body {

position: relative !important;
height: 100% !important;

}

::selection {background:#fff;color:#000;}

::-webkit-input-placeholder {
    color: #fff; 
}

:-moz-placeholder { /* Firefox 18- */
    color: #fff; 
}

::-moz-placeholder {  /* Firefox 19+ */
    color: #fff; 
}

:-ms-input-placeholder {  
    color: #fff;  
}

a, a:link, a:visited {    -webkit-transition-duration: .50s, .2s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration: .5s, .3s;
    -O-transition-duration: .5s, .3s;
    -ms-transition-duration: .5s, .3s;
}

a:hover {}




h1 {font-size: 42px;color: #000;text-align: left;}

h2 {font-size: 24px;color: #000;text-align: left;}

#section1 {width:100%;height: 100% !important;background: #CAD400;padding: 300px 0 250px 0; position: relative;}
#section2 {background: #F08035;padding: 150px 0 350px 0}
#section3 {background: #8DCDC4;padding: 150px 0 250px 0}
#section4 {background: #CAD400;padding: 200px 0 250px 0}

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

.top10 {margin-top: 10px !important;}
.top20 {margin-top: 20px !important;}
.top30 {margin-top: 30px !important;}
.top40 {margin-top: 40px !important;}
.top50 {margin-top: 50px !important;}

.pad10 {padding-top: 10px !important;}
.pad20 {padding-top: 20px !important;}
.pad30 {padding-top: 30px !important;}
.pad40 {padding-top: 40px !important;}
.pad50 {padding-top: 50px !important;}

.margincero {margin: 0;padding: 0;}
.margin1 {margin: 0;padding: 1px;}
.left0 {left: 2px;}

.logo {margin-top: 15%;}
.flecha a img {margin-top: 200px;margin-bottom: 100px;position: relative;
-webkit-transition-duration: .50s, .2s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration: .5s, .3s;
    -O-transition-duration: .5s, .3s;
    -ms-transition-duration: .5s, .3s;}

.opacity20 {opacity: .2;
-webkit-transition-duration: .50s, .2s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration: .5s, .3s;
    -O-transition-duration: .5s, .3s;
    -ms-transition-duration: .5s, .3s;}
.opacity20:hover  {opacity: 1}



#topmenu {background: #fff;width: 100%;height: 100px;position: relative;
top: 0;z-index: 8000;opacity: 0;
-webkit-transition-duration: .50s, .2s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration: .5s, .3s;
    -O-transition-duration: .5s, .3s;
    -ms-transition-duration: .5s, .3s;}
#topmenu .logo {margin-top: 10px}
#topmenu .logo img {max-width: 335px;}

#topmenu .menu {}
#topmenu .menu ul, .comercial .menu ul, .comercial .cambio ul {margin-top: 70px;}
#topmenu .menu ul li, .comercial .menu ul li, .comercial .cambio ul li {list-style: none;display: inline-block;position: relative;width: 110px;
text-align: center;background: #fff}
#topmenu .menu ul li {background: none;top: -8px;}#topmenu .menu ul li a {display:block;}
#topmenu .menu ul li a, #topmenu .menu ul li a:link, 
#topmenu .menu ul li a:visited, .comercial .menu ul li a,
.comercial .menu ul li a:link, .comercial .menu ul li a:visited, .comercial .cambio ul li a, .comercial .cambio ul li a:link, .comercial .cambio ul li a:visited
{text-transform: uppercase;font-size: 16px;color: #2d2d2d;padding: 5px;}
#topmenu .menu ul li a:hover, #topmenu .menu ul li a.active
{color: #CAD400;}

#topmenu.fixed {position: fixed;opacity: 1;}





.comercial .menu ul, .comercial .cambio ul {margin-top: 0px;width: 100%;}

.comercial .menu, .comercial .cambio{ margin-bottom: 30px;z-index: 99}

.comercial .menu  a,
.comercial .menu  a:link, .comercial .menu a:visited, .comercial .cambio a, .comercial .cambio a:link, .comercial .cambio a:visited {

    padding: 15px 15px 15px 15px;
float: left;font-size: 14px;
list-style: none;display: inline-block;position: relative;
text-align: center;background: #fff;margin-right: 2px;color: #2d2d2d;min-width: 151px;
}
.comercial .menu  a:hover,
.comercial .menu a.active, .comercial .cambio a:hover, .comercial .cambio a.active
{color: #CAD400;box-shadow: 0px 2px 5px #8A8A8A;}


.comercial .cambio  a:link, .comercial .cambio a:visited {

min-width: 80px;

}

.hover {float: left;margin-right: 15px;}
.hover div {opacity: 0;position: absolute;top: 0;
-webkit-transition-duration: .50s, .2s;
    -webkit-transition-timing-function: linear, ease-in;
    -moz-transition-duration: .5s, .3s;
    -O-transition-duration: .5s, .3s;
    -ms-transition-duration: .5s, .3s;}



.topmenu .menu ul li a.active:after {

  content: "";
border-color: #fff transparent transparent transparent;
border-style: solid;
border-width: 15px;
height: 0;
width: 0;
position: absolute;
bottom: -32px;
left: 34px;

}

.comercial .menu a.active:after, .comercial .cambio a.active:after {

content: "";
border-color: #fff transparent transparent transparent;
border-style: solid;
border-width: 15px;
height: 0;
width: 0;
position: absolute;
bottom: -30px;
left: 38%;
}

.comercial .cambio a.active:after {

left: 38%;
}


.cambio2:after  {left:10% }



.top-bar {

background: #2d2d2d;
height: 0px;
position: relative;
top: 0;
width: 100%;
z-index: 99999;
box-shadow: 0 0px 3px #2d2d2d;
margin: 0;

}

.inicio h1 {color: #fff;font-size: 22px;text-align: justify;line-height: 26px;}

.slider_comercial .thumb, .slider_residencial .thumb {width: 262px;
position: relative;
height: 215px;margin: 1px;float: left;}

.slider_comercial, .slider_residencial {float: left;width: 100%;clear: both}

.slider_comercial li, .slider_residencial li {list-style: none;position: relative;}
.slider_comercial li img, .slider_residencial li img {width: 100%;float: left}


.caption {position: absolute;top: 0;
left: 0;background-color: rgba(0, 0, 0, 0.3);width: 262px;
height: 215px;opacity: 0}

.caption img {
width: 18% !important;
margin-top: 80px;
margin-left: 112px;
opacity: 0.7;}


/* CONTACTO */

#form {float: left;width: 500px;clear: both;margin-top: 30px;margin-left:80px;}
.contacto h2 {color: #777;margin-bottom: 30px;padding: 5px;text-align: center;font-size: 24px;font-weight: 500;}
.form {position: relative;width: 500px;height: 200px;margin-top: 30px;float: left;}
#contact_form {}
#contact_form ul {width: 100%;height: 100%;float: left;margin-top: -20px}
#contact_form ul li {margin: 0px 0 0px 0;list-style: none;float: left;position: relative;width: 100%;clear:left;}
#contact_form .right {float:right;width:50%;clear:none;margin-top: 0px;}
#contact_form label {line-height: 11px;text-align: center;width: 100%;color: #2d2d2d;font-size: 18px;background: #fff;
font-weight: 600;top: 15px;position: relative;}
#contact_form label:after {content: "";
width: 0px;
height: 0px;
border-style: solid;
border-width: 16.5px 0 17.5px 15.3px;
border-color: transparent transparent transparent #c9d400;
line-height: 0px;
_border-color: #000000 #000000 #000000 #c9d400;
_filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');position: absolute;top: 0;left: 0}
#contact_form input, #contact_form textarea {padding: 4px;border: none;color: #000;
    font-size: 18px;box-shadow:none;background: #fff; /* Old browsers */
    -webkit-transition-duration: .4s, .5s;
    -webkit-transition-timing-function: linear, ease-out;
    -moz-transition-duration: .4s, .5s;
    -O-transition-duration: .4s, .5s;
    -ms-transition-duration: .4s, .5s;
}

#camposreq { background: #3b3b3b;
width: 60%;
height: 150px;
margin: 0 auto;
float: left;
text-align: center;
margin-top: -232px;
margin-left: 165px;
color: #fff;
padding-top: 62px;
display: none
}
#contact_form input:hover, #contact_form textarea:hover {outline: none;}
#contact_form input:focus, #contact_form textarea:focus {outline: none;color: #F08035;}
#contact_form input {width: 100%;height: 60px;margin-bottom: 10px;padding-left: 15px;
}
#contact_form textarea {width: 100%;height: 115px;resize: none;padding-left: 15px;}
#contact_form #button {text-align: right;}
#contact_form input.button {margin: 0px 0 0 0px;width: 100%;clear: both;height:40px;display: inline-block;padding-left: 0}
#contact_form input.button {text-decoration: none;color: #eee;font-size: 18px;background: #3b3b39; cursor:pointer;
    -webkit-transition-duration: .4s, .5s;
    -webkit-transition-timing-function: linear, ease-out;
    -moz-transition-duration: .4s, .5s;
    -O-transition-duration: .4s, .5s;
    -ms-transition-duration: .4s, .5s;
   font-weight: 100;}
#contact_form input.button:hover {color: #CAD400;}
#contact_form input.button:active {
    color: #F08035;
    -webkit-box-shadow: 0px 0px 10px 1px #ccc;
    -moz-box-shadow: 0px 0px 10px 1px #ccc;
    box-shadow: 0px 0px 10px 1px #ccc;
}

.error {color: #fff;display: none;font-size: 13px;position: relative;list-style: none;width: 100%;}
.success {position: relative;color: #2d2d2d;padding: 0;font-size: 12px;display: none;color: #19a44a;}
.fail {position: relative;padding: 0;font-size: 12px;display: none;color: #19a44a;}



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

    .menuhide {display: none;}
    .top-bar {overflow: visible;}
    .top-bar .toggle-topbar {display: none; }
    .orbit-bullets {text-align: center}
    .orbit-bullets li {float: none; display: inline-block;cursor: pointer;}
    .hide {display: block}
}


@media only screen and (max-width: 780px) {

    .menuhide {display: none;}
    .menuprincipal {display: block}
    .menuhide {display: none}
    .top-bar {display: none;}
    .top-bar .toggle-topbar {display: none; }
    .orbit-bullets{top: 10px;text-align: center;}
    .orbit-bullets li {float: none; display: inline-block;cursor: pointer;}
    .logo_top {display: none}
    .top-bar {display: block;}

    .comercial .cambio a:link, .comercial .cambio a:visited { min-width: 55px; padding: 10px;
font-size: 9px;}
.comercial .cambio a.active:after {left: 32%;border-width: 11px;bottom: -20px}

.comercial .menu a.active:after {left: 37%;border-width: 11px;bottom: -20px}

.comercial .menu a, .comercial .menu a:link, .comercial .menu a:visited {min-width: 101px; padding: 10px;
font-size: 9px;}


}

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


    .menuhide {display: block}
    .menuprincipal {display: none}
    .top-bar .toggle-topbar {display: block; }
    #topmenu {height: 23%}
    .topmenu .logo  {text-align: center}
    .topmenu .logo img {width: 100%;margin: 0}
    .logo {margin-top: 100px;}
    .flecha {margin-top: 250px;}
    .hover {margin-right: 20px;}
    #topmenu .menu ul {margin-top: -6px}
    #topmenu .menu ul li {float: left; width: 50%;}
    #topmenu .menu ul li a{font-size: 12px; padding: 0px;background: none; top:5px;
margin-top: 25px; }
    .topmenu .menu ul li a.active:after {}
     
     .inicio {margin-top: 50px;}
     #section1 {padding: 180px 0 150px 0}
    #section2 {padding: 180px 0 150px 0}
    #section3 {padding: 180px 0 150px 0}
    #section4 {padding: 180px 0 150px 0}
    .comercial {margin-top: 20px;}
    .comercial .menu  a, .comercial .cambio  a  {width: 100%;}
    .comercial .menu a.active:after, .comercial .cambio  a.active:after  {display: none}
    .slider_comercial li img, .slider_residencial li img {width: 100%;}
    .hide {display: none !important}

    .comercial .cambio a:link, .comercial .cambio a:visited {font-size: 16px;}

    .slider_comercial .thumb, .slider_residencial .thumb, .caption  {width: 100%;}
    #camposreq {background: #3b3b3b;
width: 70%;
height: 150px;
margin: 0 auto;
float: left;
text-align: center;
margin-top: -280px;
margin-left: 36px;
color: #fff;
padding-top: 50px;display: none}



}