/* 
Theme Name: Bootstrap 3.3.4 - Base
Theme URI: #
Description: Programmed by B3 communication - steven Zhou

Version: 3.3.4
Author: Steven Zhou
Author URI: http://www.b3com.com
Tags: Steven Zhou: steven@b3com.com
-------------------------------------------------------------- */
html, body { height:100%; width: 100%; }
html {-webkit-font-smoothing: antialiased; }

a, a:hover, a:active, a:focus { outline: 0;}
object, embed {outline: 0;}
input::-moz-focus-inner { border: 0; }
input[type="checkbox"] { -webkit-appearance: checkbox;}
input:focus,
select:focus,
textarea:focus,
button:focus { outline: none; }

section{
	padding-bottom: 100px;
    padding-top: 150px;
}

section#home{
	padding-bottom: 0;
	padding-top: 0;
}

section#homeowners{
	padding-bottom: 0; 
}

#mquery { position:fixed; top:40%; left:1%; width:80px; height:24px; z-index:1; border:red 1px solid; display:none;}
#mquery:after 	{content: ">1200";} 

#retina-test { min-height:300px; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;
	background-image:url(images/retina.jpg);
}


body {
font-family: 'Roboto', sans-serif;
font-size:16px;
font-weight:400;
line-height:1.5;
color:#58595b;
overflow-x: hidden; 
}


.wow { visibility:hidden;} /*zzj-force this kicks in the sooner better*/

.home .navbar-inverse { border:none; background:rgba(0,0,0,0.8);}

.home  .navbar-brand { height:auto !important;}

.home .navbar-right { margin-top:30px;}

.home .navbar-right li+li:before { 
    content: "•";
	position:absolute;  left:0; top:50%; margin-top:-10px;
	color:#c1d42e;
}


.home .navbar-right li+li:nth-child(2):before{
	content: "";
}

.homeownerText{
	color: white;
	margin-bottom: 40px;
}

.homeownerText h2{
	margin-bottom: 20px;
}

.homeownerText p{
	margin-bottom: 15px;
}


.formContainer{
	color: white;
}

.navbar-inverse .navbar-nav > li > a  { color:white; font-weight:300;}
.navbar-inverse .navbar-nav > .active > a { font-weight:400; background:none;}
.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover { background:none !important;}

/*to center slider*/
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  width: 100%;
  margin: auto;
}

#myCarousel  { width:100%; height:100%; position:relative;}
#myCarousel .carousel-inner { width:100%; height:100%;  position:relative;}
#myCarousel .item { width:100%; height:100%; background-position:50% 50%; background-size:cover; background-repeat:no-repeat; }

#myCarousel .carousel-caption { text-align:left; bottom:80px;}
.proj_button {background:none; border:white solid 2px; font-size:14px; letter-spacing:1px; padding:6px 20px; color:#c1d42e;  }
.proj_button:hover {color:#c1d42e;}
#myCarousel .carousel-caption h1 { margin-top:0; margin-bottom:3%; font-size:48px;}
#myCarousel .carousel-caption h1 span { font-weight:300;}
#myCarousel .carousel-caption h5 { font-size:18px;}


.zzjNextslidController { display:block; position:absolute; z-index:8; bottom:10%; right:15%;}
.zzjNextslidController span.glyphicon { color:white; font-size:64px; }

.item.pic1 { background-image:url(images/slid_01.jpg);}
.item.pic2 { background-image:url(images/slid_02.jpg);}

   
.carousel-indicators { display:none;}

.fullheight { 
	height:100%; 
	position:relative; 
	/*min-height:680px; */
}

.home hr {border-color:rgba(0,0,0,0.6); }
hr.neghr { margin-top:-10px;}


h2 { font-size:36px;}
h2.proh { padding:5% 0;}
h2 > span { font-size:0.5em;}
h2._first { padding-left: 190px; background:url(images/west41.png) 0% 50% no-repeat; background-size:160px 125px;}
h2._second { padding-left: 121px; background:url(images/p35_logo.png) 0% 50% no-repeat; background-size:70px 123px;}

.contacttopper { background:url(images/contact.jpg) 50% 100% no-repeat; background-size:cover;}
.contacttopper h2 { color:white; margin:12% 0 3% 16px;}

section#projects { padding:5% 0;}


p.wpdes { 
	margin:5% 0;
	text-align: center;
	line-height: 1.9em;
}


.past-project-container{
/*    padding-top: 5%;
    padding-bottom: 10%;*/
}

.past-project{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	height: 35vw;
	/*padding: 10%;*/
	text-align: left;
}

.past-project-container .carousel-caption{
	text-align: left;
}

.past-project h5{
	font-size: 18px;
}

.past-project h1{
    margin-top: 0;
    margin-bottom: 3%;
    font-size: 48px;
}


.past-project h1 span{
	font-weight: 300;
}

.separator{
	margin-bottom: 80px;
}

.separator hr{
	margin-top: -26px;
}


.separatorText{
	width: 100%;
	text-align: center;
}

.separatorText h1{
    width: 25%;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    font-size: 30px;
    padding: 0 10px;
    position: relative;
}


.homeOwnerContainer{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&amp;0.27+0,1+100 */
	background: -moz-linear-gradient(top,  rgba(0,0,0,0.27) 0%, rgb(43, 43, 43) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0.27) 0%,rgb(43, 43, 43) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0.27) 0%,rgb(43, 43, 43) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

}


.homeownersdiv {background:url(images/contact.jpg) 50% 50% no-repeat; background-size:cover;}
.homeownersformbox { padding:16% 6%; margin:0 10%;}

.homeownersformbox .controls input, .homeownersformbox .controls textarea, .homeownersformbox .controls select { 
    background: #d1d1d1;
    border-color: #d1d1d1;
    padding: 6px 6px;
    width: 100%;
    margin-bottom: 20px;
    color: #484848;
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    border-radius: 0;

}

.homeownersformbox .controls select {
	background-image: url('images/arrow.svg');
    background-position: center right 8px;
    background-repeat: no-repeat;
    background-size: 15px;
}

.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline{
	padding-top: 0;
}


.homeownersformbox  .error input, .homeownersformbox  .error textarea, .homeownersformbox  .error select { border-color:red;}

.homeOwnerContainer .form_box .btn-success{
	margin-top: 20px;
}

#homeowners-results{
	width: 100%;
	padding: 20px;
	border: 1px solid white;
	display: none;
	position: absolute;
	text-align: center;
}

#homeowners-results span{
	color: white;
}


#contact-results{
	width: 100%;
	padding: 20px;
	border: 1px solid white;
	display: none;
	position: absolute;
	text-align: center;
}

#contact-results span{
	color: white;
}


.contactContainer{
	color: white;
	background:url(images/form_bk.jpg) 50% 100% no-repeat; 
	/*background-size:cover; */
	padding:7% 0 10% 0;
	background-color: #323F48;
	height: 100%;
	min-height: 1000px;

}

.contactContainer .separatorText h1{
	background-color: #323F48;
}

.contactContainer .separator hr{
	border-color: white;
}

.contactContainer form{
	color: black;
}

/*section#homeowners{
	padding-top: 0;
}*/


/*.form_box { background:url(images/form_bk.jpg) 50% 100% no-repeat; background-size:cover; padding:5% 0;}*/
.form_box p, .form_box a { color:white;}
label.control-label { display:none;}
.controls input, .controls textarea { width:100%; margin-bottom:20px; padding:6px 6px; border: rgba(0,0,0,0.5) solid 2px;}
.form_box .btn-success { border-radius:0; background:none; border:white solid 2px; font-size:12px; letter-spacing:1px; padding:8px 60px; margin-bottom:20px; color:#c1d42e;}
.form_box .error input, .form_box .error textarea  { border-color:red;}
.form_box label.error { font-size:10px; color:white; margin-bottom:10px; position:absolute; opacity:0;  }
/*#results span { color:red; position:absolute;}*/
 

.footer { background:#c1d42e;}
.footer p { line-height:50px; font-size:14px;}
.footer  p a { color:#58595b}


.navbar-toggle{
	margin-top: 14px;
}

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1524px){
#mquery:after 	{   content: "993-1200";} 
.past-project h1 { font-size:24px;}
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px){
#mquery:after 	{   content: "993-1200";} 
	.navbar-brand .img-responsive {
		width: 120px;

	}

	.home .navbar-right{
		margin-top: 7px;
	}


	.separatorText h1{
		width: 28%;
	}


}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px){
#mquery:after 	{   content: "769-992";} 
	.home .navbar-right{
		float: none !important;
	}

	.navbar-brand .img-responsive {
		width: 240px;
		margin-left: auto;
		margin-right: auto;
	}

	.navbar-header{
		float: none;
	}

	.home .navbar-brand{
		width: 100%;
	}

	.separatorText h1{
		width: 36%;
	}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px){
	#mquery:after 	{   content: "481-768";} 

	body { font-size:14px;}
	#myCarousel .carousel-caption h1 { margin-bottom:6%; font-size:36px;}
	p.wpdes { padding:3% 0;}
	.navbar-brand img { width:180px; height:auto;}
	.home .navbar-right li+li:before { display:none;}
	h2 { font-size:24px;}

	.viewbtn > img { margin-bottom:5%;}

	.past-project{

		height: 75vw;

	}

	.past-project h1 { margin-bottom:6%; font-size:28px;}

	.zzjNextslidController { display:block; position:absolute; z-index:8; bottom:12%; right:5%;}

	#myCarousel .carousel-caption{
		left: 5%;
		bottom: 9%;
	}

	.past-project-container .carousel-caption{
		text-align: left;
		left: 7%;
	}


	.home .navbar-brand{
		width: auto;
	}

	.navbar-brand .img-responsive {
		width: 120px;

	}


	.homeownersformbox {
	    padding: 16% 0%;
	     margin: 0 0%; 
	}

	.separatorText h1{
		width: 46%;
		font-size: 25px;
	}

	h1{
		font-size: 25px;
	}


	.separator hr{
		margin-top: -23px;
	}


	.projectContainer{
		margin-top: 40px;
	}

	section{

		padding-top: 80px
	}

	.separator{
		margin-bottom: 60px;
	}


}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px){
	#mquery:after 	{   content: "321-480";} 
	.navbar-brand img { width:120px; height:auto;}

	.fullheight{
		height: 70%;
	}

	.navbar-toggle{
		margin-top: 14px;
	}

	.separatorText h1 {
	    width: 58%;
	    font-size: 22px;
	}

	h1{
		font-size: 22px;
	}


}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px){
#mquery:after 	{   content: "<=320";} 
}


/* For Retina */
@media all and (-webkit-min-device-pixel-ratio: 1.5) {

#retina-test {
	background-image:url(images/retina@2x.jpg);
}

}

.fillforbutton{
    border-radius: 0;
    background: none;
    border: white solid 0px;
    font-size: 12px;
    letter-spacing: 1px;
    padding: 10px 60px;
    margin-bottom: 20px;
    color: #c1d42e;
}