/*RESET*/
@charset "utf-8";a{text-decoration:none}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline;font-family:"Trebuchet MS",Arial,Helvetica,sans-serif}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}

/*GENERALES*/
body { margin:0px; background-color:#FFF; overflow-x: hidden !important}
p, b, a, i, u, h1, h2, h3, h4, h5, h6, ul ,li, input, textarea, select, span { 
    font-family: 'Signika', sans-serif;
    font-family: 'Rubik', sans-serif;
 }
b { font-weight:700}
.clear0 { clear:both; height:0px}
.clear5 { clear:both; height:5px}
.clear10 { clear:both; height:10px}
.clear15 { clear:both; height:15px}
.clear20 { clear:both; height:20px}
.clear30 { clear:both; height:30px}
.clear40 { clear:both; height:40px}
.clear50 { clear:both; height:50px}
::selection {color:#CCC;background:#444;}
::-moz-selection {color:#EEE;background:#444;}
*:focus { outline:none}


.opTodo { opacity: 0;}

.fix-top { margin-top: 88px !important}



header { width: 100%; height: 88px;position: fixed; top: 0; z-index: 9999; background-image: url(../img/header.jpg); background-position:  center center; background-size:  cover;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}
header .in { position: absolute; width: 96%; max-width: 1400px; height: 100%; left: 50%; transform: translateX(-50%);}
header .in .logo { left: 0; top: 50%; transform: translateY(-43%); position: absolute; height: 50px;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}

.show-menu { height: 66px;}
.show-menu .logo { height: 70px !important;}
.show-menu .in nav .contacto a img {    height: 26px;}

header .in ul { text-align: right; position: absolute; right: 0px; top: 50%; transform: translateY(-50%);}
header .in ul li { display: inline-block; vertical-align: middle; margin-left: 30px;}
header .in ul li img { display: inline-block; vertical-align: middle; width: 18px; margin-right: 6px;}
header .in ul li p { display: inline-block; vertical-align: middle; color: #FFF; font-weight: 300; font-size: 15px;}



.swiper-container.slider {width: 100%; margin-top: 88px;height: 600px; background-color: #333}
.slider .swiper-slide {
text-align: center;font-size: 18px; height: 100%; overflow: hidden;/* Center slide text vertically */
display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;
lign-items: center;
}
.slider .swiper-slide .foto { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; z-index: 1}
.slider .swiper-slide .info { position: absolute; height: auto; top: 50%; transform: translateY(-50%);  z-index: 10; text-align: right; width: 500px; right: 5vw;}
.slider .swiper-slide .info h2 { color: #FFF; font-family: 'Signika', sans-serif; font-weight: bold; font-size: 5vw; line-height: 5.1vw; margin-top: 20px; margin-bottom: 30px; }
.slider .swiper-slide .info h2.blanco { color: #FFF; font-family: 'Signika', sans-serif; font-weight: bold; font-size: 5vw; line-height: 5.1vw; margin-top: 20px; margin-bottom: 30px; }
.slider .swiper-pagination-bullet {
    width: 26px !important;
    height: 6px !important;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color:#FFF !important;
    opacity: 1;
    background-color: rgba(256,256,256,0.3) !important;
    border-radius: 0% !important;
    -webkit-border-top-left-radius: 6px !important;
    -webkit-border-bottom-right-radius: 6px !important;
    -moz-border-radius-topleft: 6px !important;
    -moz-border-radius-bottomright: 6px !important;
    border-top-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
  }
  .slider .swiper-pagination-bullet-active {
    color:#fff;
    background: #377342 !important;
  }


.btn1 {  width: auto; display: inline-block; margin: auto; background-color: #377342; padding: 14px 40px; text-align: center; cursor: pointer;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-bottomright: 10px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}
.btn1 p { color: #FFF; letter-spacing: 1px; font-weight: 500; font-size: 14px;}
.btn1:hover { background-color: #064511;}





.catalogos { width: 100%; height: auto; padding: 80px 0px; text-align: center;}
.catalogos h4 { color: #0e3f5f; font-weight: 300; font-size: 40px; margin-bottom: 30px;}
.catalogos ul { width: 100%; max-width: 1200px; margin: auto; height: auto; text-align: center;}
.catalogos ul li { vertical-align: top; display: inline-block; margin: 0px 30px; margin-bottom: 40px; width: 300px;}
.catalogos ul li img { margin-top: 20px; width: 100%;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}
.catalogos ul li p {color: #0e3f5f; font-size: 20px; font-weight: 500; line-height: 21px; margin-top: 12px;}
.catalogos ul li span {color: #0e3f5f; font-size: 16px; font-weight: 300;}
.catalogos ul li:hover img { margin-top: 0px}




.separador { width: 80%; height: 1px; margin: 70px auto; margin-bottom: 50px; background-color: #bebfc0; opacity: 0.4}

.cat2 { display: inline-block; vertical-align: top; margin: 0px 20px; text-align: center; width: 190px; margin-bottom: 30px;}
.cat2 img { margin-top: 20px; width: 100%;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}
.cat2 p {color: #0e3f5f; font-size: 16px; font-weight: 500; line-height: 21px; margin-top: 12px;}
.cat2:hover img { margin-top: 0px}



.argen2 { width: 100%; height: 500px; position: relative; margin-top: 10px;}
.argen2 .in { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); padding: 0px 30px; text-align: center; width: 80%}
.argen2 .in img { width: 300px; margin-bottom: 10px;}
.argen2 .in p { color: #FFF; font-size: 18px; font-weight: 300; line-height: 30px;}



.contacto { background-color: #011522; width: 100%; height: auto; padding: 70px 0px; text-align: center;}
.contacto h4 { color: #FFF; font-weight: 300; font-size: 40px; margin-bottom: 30px;}
.contacto .izq { display: inline-block; vertical-align: top;}
.contacto .izq .col { width: 330px;display: inline-block; vertical-align: top; margin: 0px 5px;}
.contacto .izq .campo { background-color: #022033; color: #8198a6; width: 300px; padding: 15px; border: none; font-weight: 300; margin-bottom: 8px; border-bottom: 1px solid #022033}
.contacto .izq .elText { background-color: #022033; color: #8198a6; width: 300px; padding: 15px; border: none; font-weight: 300; margin-bottom: 8px; resize: none; height: 136px; border-bottom: 1px solid #022033}
.contacto .izq .mandale { background-color: #063e63; color: #b0cad9; text-align: center; width: 110px; padding: 12px; border: none; float: right; letter-spacing: 1px;
    -moz-transition:all 0.25s ease 0s;
    -o-transition:all 0.25s ease 0s;
    -ms-transition:all 0.25s ease 0s;
    -webkit-transition:all 0.25s ease 0s;}
.contacto .izq .mandale:hover { background-color: #095e96;}
.contacto .der { display: inline-block; vertical-align: top; margin-left: 30px;}
.contacto .der ul { margin-top: 16px;}
.contacto .der ul li { text-align: left; margin-bottom: 15px}
.contacto .der ul li img { width: 18px; display: inline-block; vertical-align: middle; margin-right: 7px}
.contacto .der ul li p {  color: #FFF; font-weight: 300; display: inline-block; vertical-align: middle; opacity: 0.7}












@media screen and (max-width: 1400px) {
    .swiper-container.slider {height: 550px;}

}

@media screen and (max-width: 1260px) {
 
    .catalogos ul li {        margin-bottom: 40px;    }

}

@media screen and (max-width: 1100px) {
    .swiper-container.slider {height: 520px;}


}

@media screen and (max-width: 960px) {
    header {        height: 74px;}
    header .in .logo {        height: 45px;}

    .fix-top { margin-top: 74px !important}
 
    .swiper-container.slider {        margin-top: 74px;}
    .slider .swiper-slide .foto { height: 100%;  width: auto}

    .argen2 {  height: 600px; }
    .argen2 .in img { width: 240px }
    .argen2 .in p { font-size: 18px; line-height: 22px;}

    .catalogos h4 { font-size: 34px;}

    .btn1 p { font-size: 12px; }

    .slider .swiper-slide .info h2.blanco { font-size: 8vw;  line-height: 8.1vw; text-shadow: 1px 1px 5px rgba(0,0,0,0.51);   }
    .slider .swiper-slide .info h2 { font-size: 8vw; line-height: 8.1vw; color: #FFF ;text-shadow: 1px 1px 5px rgba(0,0,0,0.51)  }

    .contacto .der { margin: 0px; margin-top: 50px;}
    
     .catalogos ul li img { margin-top: 0px;}

}


@media screen and (max-width: 720px) {
    .swiper-container.slider {height: 480px;}

    header .in ul { display: none    }
    
    .catalogos ul li { margin-bottom: 50px; }
   


}


@media screen and (max-width: 560px) {
    header {        height: 60px;}
    header .in .logo {        height: 36px;}
    .swiper-container.slider {        margin-top: 60px;}
    
    .fix-top { margin-top: 48px !important}
    
    .show-menu { height: 60px;}
    .show-menu .logo {        height: 36px !important;}

    .slider .swiper-slide .info { width: 90%}
    .slider .swiper-slide .info h2.blanco { font-size: 12vw;  line-height:12.1vw;    }
    .slider .swiper-slide .info h2 { font-size: 12vw; line-height: 12.1vw;  }

    .btn1 {        padding: 14px 20px;}
    .btn1 p {        font-size: 11px;     }

    .catalogos h4 {font-size: 28px;}

    .catalogos ul li {  margin: 0px 0px; margin-bottom: 50px; width: 300px;}

}

@media screen and (max-width: 440px) {
    .catalogos ul li {  margin: 0px 0px; width: 270px;}
}