@import url("default.css");

#banner {width: 100%; position: relative;}
#banner img {width: 100%; display: block;}

#text_wrap {position: absolute; top:0; left:0; bottom:0; right:0; margin: auto; height: 90px; color: #ebebeb; text-align: center;}

#text_wrap h1 {height: 45px; font-size: 45px; margin-bottom: 20px;  background: url("../images/headline.png") 50% 100% no-repeat;}
#bg {position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.5); top: 0;}
#map {width: 100%; height: 330px; background: #ebebeb;}


.left {float: left; width: 5%; border-top: solid 3px #fcbc1c;}
.right {float: left; width: 95%; border-top: solid 1px #e6e6e6; margin-top: 1px;}

#form_wrap {background: #fff; padding: 50px 15px;}
#the_wrap {padding-top: 40px;}

#f_left {float: left; width: 30%;}
#f_left .social {text-align: left; padding-left: 40px;}
#f_right {float: left; width: 70%;}
.imgs {text-align: left;}

#input_wrap {width: 40%; float: left;}
.input {width: 100%; padding: 25px; margin-bottom: 15px; font-family: 'Raleway', sans-serif; font-size: 14px;
border: solid 1px #ebebeb; background: #efefef;}

#message {width: 58%; float: right;}
#message textarea {width: 100%; height: 235px; font-family: 'Raleway', sans-serif; font-size: 14px;
 background: #ebebeb; border: solid 1px #efefef; padding: 15px;}

input:required, textarea:required {
    border-color: #ccc !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.submit {width: 160px; float: right; height: 50px;}
.submit input {width: 100%; background: #fcbc1c; color: #000; height: 50px; border: none; cursor: pointer; 
	-webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -ms-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  font-family: 'Raleway', sans-serif; font-size: 14px;
}

.submit input:hover {background: #000; color: #fcbc1c;}


/*Mobile view*/
@media screen and (max-width: 75em) { 

}

@media screen and (max-width: 65em) { 


	
}

@media screen and (max-width: 60em) { 

#text_wrap { height: 60px; }
#text_wrap h1 {font-size: 35px; height: 30px;}

}

@media screen and (max-width: 55em) { 
	#f_left {float: none; width: 100%; text-align: center; padding-bottom: 20px;}
	.imgs {text-align: center;}
	#f_left .social {text-align: center; padding-left: 0;}
	#f_right {float: none; width: 100%;}
	.submit {float: none; margin: 0 auto;}
}

@media screen and (max-width: 45em) { 

}


@media screen and (max-width: 40em) { 
	
	#input_wrap {width: 100%; float: none;}
	.input {padding: 15px;}

	#message {width: 100%; float: none; margin-bottom: 15px;}
	#message textarea {width: 100%; height: 150px; padding: 15px;}
}


@media screen and (max-width: 30em) { 

#text_wrap { height: 40px;}
#text_wrap h1 {font-size: 20px; height: 25px; margin-bottom: 5px;}
}

@media screen and (max-width: 25em) { 
#text_wrap {position: relative; height:100px; padding-top: 30px;}
#text_wrap h1 {font-size: 18px; height: 22px; margin-bottom: 0px;}

}