

*{margin:0 auto; padding:0}



body{font-family:'Open Sans', sans-serif; background-color:#fff}

a, img, ul, form, input, fieldset, iframe{border:none; text-decoration:none; outline:none; list-style:none; resize:none}

h1, h2, h3{font-weight:normal}

header, banner, section, footer, aside, nav, article, figure {display:block}



.wrapper{max-width:1200px}

.topHeader{background-color:#f7f7f7; padding:15px 0; font-family:'Roboto Slab', serif; text-align:right}

.topHeader ul{max-width:1200px}

.topHeader ul li{display:inline-block; margin:0 1px}

.topHeader ul li:nth-child(1){margin-right:10px}

.topHeader ul li a{color:#1e1e1e; font-size:14px}

.topHeader ul li a:hover{color:#189bae}

.topHeader ul li a i{border:1px solid #189bae; border-radius:100%; padding:11px 10px; color:#189bae; font-size:18px; width:20px; text-align:center}
.fa-twitter{display:none !important}


nav{padding:5px 15px 0; max-width:1200px}

nav h1{float:left}

menu{float:right; margin-top:20px}

menu ul li{display:inline; padding:0 10px}

menu ul li a{font:16px 'Roboto Slab', serif; color:#222}

menu ul li a:hover, menu ul li a.active{color:#189bae}



banner{background:url(../images/banner-bg.jpg) no-repeat; background-size:cover; font-family:'Roboto Slab', serif; padding:20px 0 100px}

banner section{max-width:1200px}

banner h1{color:#fff; font-size:60px ; font-weight:700; text-transform:uppercase; line-height:60px; padding-top:80px}

banner p{font-size:14px; color:#fff}

banner p span{display:block; background-color:#61605e; padding:15px}

banner a{display:inline-block; background-color:#189bae; font-size:14px; color:#fff; padding:10px 20px}

banner img{float:right}

.bannerLeft{float:left; max-width:470px}



banner.sub-banner{max-height:350px; overflow:hidden; position:relative; padding:0}

banner.sub-banner img{width:100%}

banner.sub-banner section h1{color:#fff; background-color:#189bae; padding:10px 20px; font:70px 'Roboto Slab', serif; text-transform:uppercase; font-weight:700; position:absolute; bottom:0}



.section1{padding:40px 0; max-width:1200px; text-align:center}

.section1 h1{font:35px 'Roboto Slab', serif; color:#1e1e1e; background:url(../images/separator.jpg) no-repeat center bottom; padding:0 0 20px; margin-bottom:20px}

.section1 p{color:#7e7e7e; font-size:15px}

.section1 h2{color:#1e1e1e; font:20px 'Roboto Slab', serif}

.section1 h2 a{display:inline-block; background-color:#189bae; border-radius:30px; color:#fff; padding:10px 20px; font-size:25px}



.section2{padding:40px 0; background-color:#f1eff0}

.section2 ul{max-width:1200px}

.section2 ul li{display:inline-block; text-align:center; width:280px; margin:8px; vertical-align:top}

.section2 ul li h1{font:20px 'Roboto Slab', serif; color:#1e1e1e; margin-bottom:15px}

.section2 ul li p{color:#7e7e7e; font-size:13px; margin-bottom:15px; min-height:55px}



.section2 ul.services{max-width:1200px; text-align:center}

.section2 ul.services li{display:inline-block; text-align:center; width:40%; margin:10px 40px; vertical-align:top}

.section2 ul.services li h1{font:30px 'Roboto Slab', serif; color:#1e1e1e; margin-bottom:15px}

.section2 ul.services li p{color:#7e7e7e; font-size:15px; margin-bottom:15px; min-height:55px}



.section3{background:url(../images/section3-bg.jpg) no-repeat; background-size:cover; padding:40px 0}

.aboutNotary{background:rgba(0, 0, 0, 0.75); padding:20px; max-width:520px; margin:0}

.aboutNotary h1{color:#fff; font:35px 'Roboto Slab', serif; margin-bottom:10px}

.aboutNotary h1 span{color:#189bae}

.aboutNotary p{color:#fff; font-size:15px}



.section4{padding:40px 0; max-width:1200px; text-align:center}

.section4 h1{font:35px 'Roboto Slab', serif; color:#1e1e1e; background:url(../images/separator.jpg) no-repeat center bottom; padding:0 0 20px; margin-bottom:20px}

.section4 h1 a{color:#189bae}

.section4 ul li{display:inline-block; text-align:center; margin:10px}

.section4 ul li img{border:1px solid #dedede; display:block}

.section4 ul li div{background-color:#189bae; padding:10px; font-family:'Roboto Slab', serif; color:#fff}

.section4 ul li div h2{font-size:20px}



.section5{background:url(../images/section1-bg.jpg) no-repeat; background-size:cover; padding:40px 0}

.mortgageSign img{float:left; margin-right:20px}

.mortgageSign h2{font:30px 'Roboto Slab', serif; color:#1e1e1e}

.mortgageSign h3{font:22px 'Roboto Slab', serif; color:#1e1e1e}

.mortgageSign p{font-size:15px; color:#7e7e7e}

.mortgageSign li{display:block; font-size:15px; color:#7e7e7e}



.contactForm{max-width:1200px; width:100%}

.contactForm fieldset{display:inline-block; padding:10px; vertical-align:top}

.contactForm fieldset:nth-child(1){width:30%}

.contactForm fieldset:nth-child(2){width:60%; text-align:right}

.contactForm fieldset input{width:100%; border:1px solid #ddd; font-size:12px; padding:10px 0; text-indent:10px; border-radius:5px; margin-bottom:10px}

.contactForm fieldset textarea{width:100%; border:1px solid #ddd; font-size:12px; padding:10px 0; text-indent:10px; border-radius:5px; height:112px}



.contactUs-form{max-width:750px; float:left}

.contactUs-form p{font-size:15px; color:#7e7e7e}

.contactUs-form h1{font:25px 'Roboto Slab', serif; color:#1e1e1e}

.contactUs-form fieldset{display:inline-block; padding:10px 0}

.contactUs-form fieldset:nth-child(1){width:350px; margin-right:7px}

.contactUs-form fieldset:nth-child(2){width:350px}

.contactUs-form fieldset:nth-child(3), .contactUs-form fieldset:nth-child(4){width:95%}

.contactUs-form fieldset label{display:block; border:1px solid #d3d3d3; padding:10px}

.contactUs-form fieldset label.name{background:url(../images/profile-icon.jpg) no-repeat 98% center}

.contactUs-form fieldset label.email{background:url(../images/mail-icon.jpg) no-repeat 98% center}

.contactUs-form fieldset label.subject{background:url(../images/tag-icon.jpg) no-repeat 98% center}

.contactUs-form fieldset label.message{background:url(../images/message-icon.jpg) no-repeat 98% 10px}

.contactUs-form fieldset input{width:100%; background:none}

.contactUs-form fieldset textarea{background:none; border:none; resize:none; width:100%; height:150px}



.contactAddress{max-width:290px; float:right}

.contactAddress h1{font:25px 'Roboto Slab', serif; color:#1e1e1e}

.contactAddress h2{font-size:20px; color:#189bae}

.contactAddress p{font-size:15px; color:#7e7e7e; line-height:24px}

.contactAddress p a{color:#189bae}



footer{background-color:#181818; padding:20px 0}

footer section{max-width:1200px}

footer section p{color:#7e7e7e; font-size:14px}

footer section a{color:#fff}

.copyright{padding-top:25px}

.socialFooter{float:right; text-align:right}

.socialFooter ul li{display:inline-block; margin:0 1px; text-align:right}

.socialFooter ul li a{color:#7e7e7e; font-size:14px}

.socialFooter ul li a i{border:1px solid #7e7e7e; border-radius:100%; padding:11px 10px; color:#7e7e7e; font-size:18px; width:20px; text-align:center}



/*misc*/

.clear{clear:both}

.btn{display:inline-block; background-color:#189bae; font:16px 'Roboto Slab', serif; color:#fff; padding:10px 50px; border:none; margin-top:10px}



@media only screen and (min-width : 769px) and (max-width:1024px){

	.wrapper{width:95%}

	banner img{width:500px}

	.section2 ul{text-align:center}

	.contactUs-form{max-width:655px; float:left}

	.contactUs-form fieldset:nth-child(1){width:305px; margin-right:7px}

	.contactUs-form fieldset:nth-child(2){width:305px}

	footer section{width:95%}

}



@media only screen and (min-width : 481px) and (max-width:768px){

	.wrapper{width:95%}

	banner h1{font-size:50px; text-align:center; line-height:40px; padding-top:40px}

	banner img{float:none; width:100%}

	.bannerLeft{float:none}

	banner.sub-banner section h1{font-size:40px}

	.section2 ul.services li{width:95%}

	.section2 ul{text-align:center}

	.contactUs-form{max-width:400px; width:100%}

	.contactUs-form fieldset:nth-child(1), .contactUs-form fieldset:nth-child(2), .contactUs-form fieldset:nth-child(3), .contactUs-form fieldset:nth-child(4){width:100%; margin:0 auto}

	footer section{width:95%}

}



@media (max-width: 480px){

	.wrapper{width:95%}

	.topHeader ul{text-align:center}

	.topHeader ul li:nth-child(1){margin:0 auto 10px; display:block}

	nav h1, menu{float:none; text-align:center}

	banner section{width:95%}

	banner h1{font-size:40px; text-align:center; line-height:40px; padding-top:40px}

	banner img{float:none; width:100%}

	.bannerLeft{float:none}

	.section1{width:95%}

	.section2 ul li{width:95%}

	.section4 ul li img{width:100%}

	.contactForm fieldset{padding:0}

	.contactForm fieldset:nth-child(1), .contactForm fieldset:nth-child(2){width:95%}

	

	banner.sub-banner{max-height:200px}

	banner.sub-banner img{display:block; height:100%}

	banner.sub-banner section h1{font-size:30px}

	

	.mortgageSign{text-align:center}

	.mortgageSign img{width:90%; float:none; margin:0 auto 10px}

	.section2 ul.services li{width:95%; margin:10px 0}

	.section2 ul.services li img{width:100%}

	

	.contactUs-form fieldset:nth-child(1), .contactUs-form fieldset:nth-child(2), .contactUs-form fieldset:nth-child(3), .contactUs-form fieldset:nth-child(4){width:100%; margin:0 auto}

	.contactAddress{float:none; max-width:100%}

	

	.socialFooter{text-align:center; float:none}

	.copyright{text-align:center; padding-top:10px}

}



