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

 li a:hover { -webkit-transition: background-color ease-in 0.2s; -moz-transition: background-color ease-in 0.2s; -o-transition: background-color ease-in 0.2s; transition: background-color ease-in 0.2s; text-decoration:none; color: rgba(146, 177, 224, 1) !important;}

a {-webkit-transition: background-color ease-out 0.2s; -moz-transition: background-color ease-out 0.2s; -o-transition: background-color ease-out 0.2s; transition: background-color ease-out 0.2s; color: #FFF;}

a:hover{ color: #fff; text-decoration: none;}

html{     position: relative;
    min-height: 100%;}

/*-----------------------------------------------------*/

/*.list { color: #fff; font-size: 25px; background-image: url(../images/nav.png); }*/

/*HEADER*/

.bg-banner{background-image: url(../images/building-banner.jpg); background-position: center; background-size: cover; height: 400px; }
header img{ float: left; margin-top: 20px;}
header h2,h3{ float: left; color: #fff;}
header h2{ margin: 20px 0px 0px 10px; font-weight: bold; font-size: 30px;}
header h3{ margin: 0px 0px 0px 10px; font-size: 20px;}

.number{ float: right;}
.number h4,h5{ color: #fff;}
.number h4{ font-size: 50px; font-weight: bold; margin: 20px 0px 0px 0px;}
.number h5{ font-size: 36px; margin: 0px 0px 0px 0px;}
span.code{ color: #F2623E; font-weight:bold; }

.banner-text h3{ font-size: 40px; font-weight: lighter; text-align: center; margin-top: 20px;}
.banner-text img{margin: 0 auto; background: rgba(255, 255, 255, 0.39); padding: 10px;}
/*HEADER*/

/*NAV AREA*/
.content-bg{ background-image: url(../images/window-banner.jpg); background-position: center; background-size: cover; z-index: 20; height: 580px; position: relative; }
.bg-bar{ background-color: #31353D; height: 62px; z-index: 50; position: absolute; width: 100%;}
.bg-bar a{ color: #fff; font-size: 24px; font-weight: 100;}
.bg-bar a:hover{color: #fff !important; background-color:#F2623E !important; }
.nav-links{ padding: 0;}
li.active{ background-color:#F2623E; }
.nav>li>a { padding: 21px 15px; width: 180px; text-align: center;}

.navbar-fixed {
    top: 0;
    z-index: 130;
  position: fixed;
    width: 100%;
      background-color: #f2623e ;}

.mob{ display: none;}
/*NAV AREA*/

/*CONTENT AREA*/

.main{}

section{ z-index: 100; position: absolute; top: -280px;}
.main h1{ color: #F2623E; font-weight: lighter; font-size: 40px; text-transform: uppercase;}
.main h3{ color: #fff; font-weight: lighter; font-size: 21px; margin:0px 0px 10px 0px;}
.main p{ color: #BBB; font-size: 18px; }

.main-second a{ background-color: #2C3539; padding: 20px; float: left;}
.main-second a:hover { background-color: #F2623E;}
.main-second img{ max-width: 65px; float: left; background-color: #F2623E; padding: 10px;}
.main-second img:hover { background-color: #2C3539;}
.main-second a:hover + .main-second img{ background-color: #2C3539;}
.main-second{ color: #BBB; font-size: 18px; top: 25px;  }
.main-second p{ margin-top: 0;}

.button a:hover + img{ background-color: #2C3539;}
.button{ margin: 0;}




/*CONTENT AREA*/

/*ICONS AREA*/

/*ICONS AREA*/

/*MISC STYLES*/


#map{ min-height: 290px; margin: 20px 0px 20px 0px;}
.gmnoprint{ display: none;}
.gm-style-cc{ display: none;}
map-image{ display: none;}
img[src="https://maps.gstatic.com/mapfiles/api-3/images/google4.png"] {
    display: none; }


/*MISC STYLES*/

/*MIDDLE SECTION*/
.middle{ height: auto !important;}
.services-heading aside{ margin: 10px 0px 10px 0px; color: #BBB; font-size: 18px;}
.services-heading h2{ color: #F2623E; font-weight: lighter; font-size: 40px; float: none; }
.services-heading h3{ color: #292929; font-weight: lighter; font-size: 21px; float: none; margin: 0px 0px 10px 0px;}

.list ul { list-style-image: url(../images/tick.png);}
.list li{ margin: 20px 0px 20px 0px; font-weight: lighter; font-size: 24px; }


.middle-section h2{color: #fff; font-weight: lighter; font-size: 40px; float: none; }
.middle-section ul { list-style-image: url(../images/tick.png);}
.middle-section li{ margin: 20px 0px 20px 0px; font-weight: lighter; font-size: 24px; color: #fff; }

.bottom-section h2{ color: #F2623E; font-weight: lighter; font-size: 40px; float: none; }
.bottom-section h3{ color: #292929; font-weight: lighter; font-size: 21px; float: none; margin: 0px 0px 10px 0px;}
.bottom-section{ color: #BBB; font-size: 18px;}
.bottom-section-text{ margin-bottom: 20px;}

/*MIDDLE SECTION*/

/*FOOTER AREA*/
.footer-bg{ background-color: #31353D;}
footer h2{color: #fff; font-weight: lighter; font-size: 40px; float: none;  }
footer ul{ list-style: none; text-decoration: none; display: inside; padding: 0;}
footer li{  padding:2px; display: inline-block; color: #fff;}
footer a{color: #828282;}
footer a:hover{color: #fff !important;}

.logo-bottom{float: left;}
.logo-bottom img{ float: left; margin-top: 20px;}
.logo-bottom h2,h3{ float: left; color: #fff;}
.logo-bottom h2{ margin: 20px 0px 0px 10px; font-weight: bold; font-size: 30px;}
.logo-bottom h3{ margin: 0px 0px 0px 10px; font-size: 20px;}

.bottom-num h4{ margin-top: 0; margin-bottom: 10px;}

.address{ text-align: center; margin: 10px 0px 10px 0px; color: #fff;}
/*FOOTER AREA*/

/*CONTACT FORM*/
.form-heading{ margin-top: 20px; text-align: center; background-color: #31353D; width: 100%; max-width: 500px; float: right;}
.form-heading h3{ float: none; padding: 20px 20px 0px 20px; margin: 0px 0px 0px 0px; font-size: 40px; font-weight: 600;}
.form-heading p{ color: #fff; margin: 0; padding-bottom: 20px;}
p a.terms{ color: #268842;}
#contact-form {background-color: rgba(49, 53, 61, 0.66); max-width: 500px; width: 100%; padding: 20px 20px 0px 20px; margin: 0px 0px 20px 0px; float: right; z-index: 120; position: relative;} 
#contact-form input,   
#contact-form select,   
#contact-form textarea,   
 label {width: 100%; font-size: 15px; margin-bottom: 2px; color: #fff; font-weight: 400;}  
#contact-form input,   
#contact-form select,   
#contact-form textarea { width: 100%;  max-height: 150px; background: #fff; margin-bottom: 25px; padding: 5px; color: #333;}  
#contact-form input:focus,   
#contact-form select:focus,   
#contact-form textarea:focus { background-color: #fff;}  
#contact-form textarea {height: 60px;}  
#contact-form #submit { color: #fff !important; font-weight: bold; font-size: 36px; border: none; background-color: #2A8840; border-bottom: 4px solid #1D6F30; padding: 10px;}  
#contact-form #submit:hover { background-color: #1D6F30; color: #fff !important;}
#contact-form input:focus, #contact-form select:focus, #contact-form textarea:focus{ color: #444;}
#contact-form input, #contact-form select, #contact-form textarea{ color: #B1A9B1 !important;}

/*CONTACT FORM*/

/*THANK YOU PAGE*/

/*THANK YOU PAGE*/

/*SOCIAL BUTTONS*/

#soc1{width: 32px; height: 32px; background-image: url(../images/social.png); float:left; margin-right: 20px; background-position: 0px 0px;}
#soc2{width: 32px; height: 32px;background-image: url(../images/social.png);float:left; margin-right: 20px; background-position: 32px 0px;}
#soc3{width: 32px; height: 32px;background-image: url(../images/social.png);float:left; background-position: 64px 0px;}

#soc1:hover{background-position: 0px 32px;}
#soc2:hover{background-position: 32px 32px;}
#soc3:hover{background-position: 64px 32px;}

.social{float: right; margin-bottom: 10px;}

/*SOCIAL BUTTONS*/

/*ABOUT PAGE*/
.about{ margin-top: 60px; color: #BBB; font-size: 18px;}
.about-banner{ height: auto;}
.about h1{color: #F2623E; font-weight: lighter; font-size: 40px; float: none; }



/*ABOUT PAGE*/


/*CONTACT PAGE*/
#contact-form-1 {background-color: rgba(49, 53, 61, 0.66); max-width: 500px; width: 100%; padding: 20px 20px 0px 20px; margin: 0px 0px 20px 0px; float: right; } 
#contact-form-1 input,   
#contact-form-1 select,   
#contact-form-1 textarea,   
 label {width: 100%; font-size: 15px; margin-bottom: 2px; color: #fff; font-weight: 400;}  
#contact-form-1 input,   
#contact-form-1 select,   
#contact-form-1 textarea { width: 100%;  max-height: 150px; background: #fff; margin-bottom: 25px; padding: 5px; color: #333;}  
#contact-form-1 input:focus,   
#contact-form-1 select:focus,   
#contact-form-1 textarea:focus { background-color: #fff;}  
#contact-form-1 textarea {height: 60px;}  
#contact-form-1 #submit { color: #fff !important; font-weight: bold; font-size: 36px; border: none; background-color: #F2623E; border-bottom: 4px solid #CC411F; padding: 10px;}  
#contact-form-1 #submit:hover { background-color: #CC411F; color: #fff !important;}
#contact-form-1 input:focus, #contact-form select:focus, #contact-form textarea:focus{ color: #444;}    
#contact-form-1 input, #contact-form select, #contact-form textarea{ color: #B1A9B1 !important;}

.con-page{ margin-top: 85px;}
.con-page h3{ padding: 20px;}
.contact-num{ margin-bottom: 20px;}
.backlink{text-align: center;}
.contact-bottom{ position: absolute; bottom: 0; width: 100%;}
.contact-banner{ height: auto;}
/*CONTACT PAGE*/
@media only screen and (min-width: 992px) and (max-width: 1200px) {


.nav>li>a{ width: 150px; font-size: 18px;}
.main h1{ font-size: 34px; margin-top: 20px;}
.main h3{ font-size: 18px;}
.main p{ font-size: 16px; }
.main{ margin-top: 0px;}
.main-second{top: 50px;}
.main-second p{ font-size: 16px;}

.list li{ font-size: 19px;}


#areas ul li{    margin-bottom: 5px;}

}

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

header img{ margin: 0 auto; float: none; margin-top: 10px;}
header h2{ float: none; text-align: center; margin: 10px 0px 0px 0px;}
header h3{ float: none; text-align: center;  margin: 0px 0px 0px 0px;}

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

.banner-text{ display: none;}
.form-heading{ float: none; margin: 0 auto; margin-top: 20px;}

.bg-bar{ display: none;}
.middle{ background-image: url(../images/window-banner.jpg) !important; }
.content-bg{ top:0; z-index: 0; background-image: none; height: auto; }
#contact-form{ float: none; margin: 0 auto; z-index: 0; display: block; background-color: #31353D;}
#contact-form-1{ float: none; margin: 0 auto; margin-bottom: 20px; }
#contact-form-1 #submit{ font-size: 18px;}
section{margin: 0 auto; z-index: 0;  position: static;}
.main h1{ text-align: center;}
.main h3{ text-align: center; color: #333; width: 100%;}
.main p{ text-align: center;}
.main-second{ text-align: center; top: 0;}
.button { margin: 0 auto; max-width: 203px;}
.list li{ font-size: 19px;}
.services-heading{ text-align: center;}
.bottom-section{ text-align: center;}
#areas{ text-align: center;}
#areas ul li { display: inline; float: none;     margin-bottom: 5px;}

.social { float: none; margin: 0 auto; max-width: 136px; margin-bottom: 10px; height: 32px;}

.logo-bottom{  float: none; margin-top: 20px;}
.logo-bottom img{ float: none; margin: 0 auto;}
.logo-bottom h2{ float: none; margin: 10px 0px 10px 0px;}
.logo-bottom h3{ float: none; margin: 10px 0px 10px 0px;}
.address{ overflow: auto;}
.contact-form{ z-index: 200;}

.mob{ display: block;}
.mob .navbar-nav{width: 100%; margin: 0 auto;}
.mob ul li{ float: left !important; padding: 0;}
.mob .nav>li>a{ width: 100%; color: #fff; }
.mob .nav>li>a:hover{   background-color: #2A8840;}
.mob li.active{ width: 100%; background-color: #F2623E;}
.mob .link-2{ width: 100%; background-color: #F2623E;}
.mob .link-3{ width: 100%; background-color: #F2623E;}
.contact-banner{ height: auto;}
.contact-bottom{ position: relative; bottom: 0; width: 100%;}
.contact-num{ margin-bottom: 20px;}
.about{ margin-top: 0;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {

header img{ margin: 0 auto; float: none; margin-top: 10px;}
header h2{ float: none; text-align: center; margin: 10px 0px 0px 0px; font-size: 26px;}
header h3{ float: none; text-align: center;  margin: 0px 0px 0px 0px;}

.number{ float: none; text-align: center;}
.number h4{ font-size: 30px;}
.number h5{ font-size: 26px;}

.banner-text{ display: none;}
.form-heading{ float: none; margin: 0 auto; margin-top: 20px;}

.bg-bar{ display: none;}
.middle{ background-image: url(../images/window-banner.jpg) !important; }
.content-bg{ top:0; z-index: 0; background-image: none; height: auto; }
#contact-form{ float: none; margin: 0 auto; z-index: 0; display: block; background-color: #31353D;}
#contact-form-1{ float: none; margin: 0 auto; margin-bottom: 20px; }
#contact-form-1 #submit{ font-size: 18px;}
section{margin: 0 auto; z-index: 0;  position: static;}
.main h1{ text-align: center;}
.main h3{ text-align: center; color: #333; width: 100%;}
.main p{ text-align: center;}
.main-second{ text-align: center; top: 0; font-size: 16px;}
.button { margin: 0 auto; max-width: 203px;}
.list li{ font-size: 19px;}
.services-heading{ text-align: center;}
.bottom-section{ text-align: center; font-size: 16px;}
#areas{ text-align: center;}
#areas ul li { display: inline; float: none; margin-bottom: 5px;}

.bottom-section h2{font-size: 26px;}

.social { float: none; margin: 0 auto; max-width: 136px; margin-bottom: 10px; height: 32px;}

.logo-bottom{  float: none; margin-top: 20px;}
.logo-bottom img{ float: none; margin: 0 auto;}
.logo-bottom h2{ float: none; margin: 10px 0px 10px 0px; font-size: 20px;}
.logo-bottom h3{ float: none; margin: 10px 0px 10px 0px; font-size: 18px;}
.address{ overflow: auto; width: 100%; font-size: 12px;}

footer h2{ font-size: 26px;}

.middle-section h2{ font-size: 26px; text-align: center;}
.middle-section li{ font-size: 16px;}
.list li{ font-size: 16px;}
.services-heading aside{font-size: 16px;}
.services-heading h2{ font-size: 26px;}

.main h1{ font-size: 26px;}

.form-heading h3{ font-size: 32px;}
.form-heading p{ font-size: 12px;}

.main{ margin-top: 420px;}
.main-second a{ padding: 10.6%;}

.main p{ font-size: 16px;}
.contact-form{ z-index: 200;}

.mob{ display: block;}
.mob .navbar-nav{max-width: 570px; margin: 0 auto;}
.mob ul li{ float: left !important; padding: 0;}
.mob .nav>li>a{ width: 100%; color: #fff; }
.mob .nav>li>a:hover{   background-color: #2A8840;}
.mob li.active{ width: 100%; background-color: #F2623E;}
.mob .link-2{ width: 100%; background-color: #F2623E;}
.mob .link-3{ width: 100%; background-color: #F2623E;}
.contact-banner{ height: auto;}
.contact-bottom{ position: relative; bottom: 0; width: 100%;}
.contact-num{ margin-bottom: 20px;}
.about{ margin-top: 0;}
.about h1{ font-size: 26px;}
}

@media only screen and (min-width:250px) and (max-width: 479px){

header img{ margin: 0 auto; float: none; margin-top: 10px;}
header h2{ float: none; text-align: center; margin: 10px 0px 0px 0px; font-size: 26px;}
header h3{ float: none; text-align: center;  margin: 0px 0px 0px 0px;}

.number{ float: none; text-align: center;}
.number h4{ font-size: 30px;}
.number h5{ font-size: 26px;}

.banner-text{ display: none;}
.form-heading{ float: none; margin: 0 auto; margin-top: 20px;}

.bg-bar{ display: none;}
.middle{ background-image: url(../images/window-banner.jpg) !important; }
.content-bg{ top:0; z-index: 0; background-image: none; height: auto; }
#contact-form{ float: none; margin: 0 auto; z-index: 0; display: block; background-color: #31353D;}
#contact-form-1{ float: none; margin: 0 auto; margin-bottom: 20px; }
#contact-form-1 #submit{ font-size: 18px;}
section{margin: 0 auto; z-index: 0;  position: static;}
.main h1{ text-align: center;}
.main h3{ text-align: center; color: #333; width: 100%;}
.main p{ text-align: center;}
.main-second{ text-align: center; top: 0; font-size: 16px;}
.button { margin: 0 auto; max-width: 203px;}
.list li{ font-size: 19px;}
.services-heading{ text-align: center;}
.bottom-section{ text-align: center; font-size: 16px;}
#areas{ text-align: center;}
#areas ul li { display: inline; float: none;    margin-bottom: 5px;}

.bottom-section h2{font-size: 26px;}

.social { float: none; margin: 0 auto; max-width: 136px; margin-bottom: 10px; height: 32px;}

.logo-bottom{  float: none; margin-top: 20px;}
.logo-bottom img{ float: none; margin: 0 auto;}
.logo-bottom h2{ float: none; margin: 10px 0px 10px 0px; font-size: 20px;}
.logo-bottom h3{ float: none; margin: 10px 0px 10px 0px; font-size: 18px;}
.address{ overflow: auto; width: 100%; font-size: 12px;}

footer h2{ font-size: 26px;}

.middle-section h2{ font-size: 26px; text-align: center;}
.middle-section li{ font-size: 16px;}
.list li{ font-size: 16px;}
.services-heading aside{font-size: 16px;}
.services-heading h2{ font-size: 26px;}

.main h1{ font-size: 26px;}

.form-heading h3{ font-size: 30px;}
.form-heading p{ font-size: 12px;}

.main{ margin-top: 420px;}
.main-second a{ padding: 10.6%;}

.main p{ font-size: 16px;}
.contact-form{ z-index: 200;}

.mob{ display: block;}
.mob .navbar-nav{max-width: 570px; margin: 0 auto;}
.mob ul li{ float: left !important; padding: 0;}
.mob .nav>li>a{ width: 100%; color: #fff; }
.mob .nav>li>a:hover{   background-color: #2A8840;}
.mob li.active{ width: 100%; background-color: #F2623E;}
.mob .link-2{ width: 100%; background-color: #F2623E;}
.mob .link-3{ width: 100%; background-color: #F2623E;}
.contact-banner{ height: auto;}
.contact-bottom{ position: relative; bottom: 0; width: 100%;}
.contact-num{ margin-bottom: 20px;}
.about{ margin-top: 0;}
.about h1{ font-size: 26px;}
}