@charset "utf-8";
/* CSS Document */

*{
padding:0; border:0; margin:0; box-sizing:border-box;
font-family: 'Crimson Text', serif; font-size:16px;
outline:none;
-webkit-transition: all ease-out 0.5s;
-moz-transition:all ease-out 0.5s;
-o-transition:all ease-out 0.5s;
transition:all ease-out 0.5s;
}


html {
  height: 100%;
  background:#fff
}
body {
	width:100%;
    min-height: 100%;
 
}

p, h1, h2, h3, h4, li { cursor:default}

a{ color: inherit; text-decoration:none; cursor:pointer}
a h2, a h3, a h1, a p, a li{ cursor:pointer !important}

h1{font-family: 'Open Sans Condensed', sans-serif; font-weight:100; letter-spacing:15px;  font-size:2.5em !important; font-weight:600; text-transform:uppercase}
h2{ font-family: 'Open Sans Condensed', sans-serif; font-size:1.2em !important; font-weight:600; text-transform:uppercase; padding: 15px 0}
p,li{padding:10px 0; line-height: 25px;}


.left{ float:left}
.right{ float:right}
.clear{ clear:both}

.clr-w{ color:#fff}
.clr-g{ color:#696969}
.clr-b{ color:#333333}

.back-gray{ background-color:#f4f4f4}
.back_black{ background-color:#333333;}


.pad-gral { padding:25px;}
.pad-left{ padding-left:25px}
.pad-right{ padding-right:25px}

.wrap{width:100%; height:100%; overflow-x: hidden; margin:auto;}

.section{ width:100%; position:relative; margin-top:150px}
.back_fixed{background-position:center !important; background-size:cover !important; background-repeat:no-repeat !important; background-attachment: fixed !important;}
.back_fill{background-position:center !important; background-size:cover !important; background-repeat:no-repeat !important;}

.center{ text-align:center}

hr{ height:1px; background:#CCC; width:100%}

.col-1{ width:100%; position:relative; max-width:1200px; margin: auto}
.col-2{ width:50%; position:relative}
.col-3{ width:33.33%; position:relative}
.col-4{ width:25%; position:relative}
.col-5{ width:20%; position:relative}
.col-7{ width:14.2%; position:relative}

.col-80{ width:80%; position:relative}
.col-20{ width:20%; position:relative}
.col-75{ width:75%; position:relative}
.col-70{ width:70%; position:relative}
.col-30{ width:30%; position:relative}

.btn_gral {
    padding: 15PX;
    background: #17978a;
    color: #fff;
    display: block;
    margin: 15px 0 0 0;
	text-align:center
}

.btn_gral:hover{ background-color:#c8353b}

.sup{ font-size: 8px;}


/*nav*/
#header {
    position: fixed;
    top: 0;
    z-index: 1000;
    left: 0;
    right: 0;
	height:170px;
	background: rgba(255, 255, 255, 1);
	overflow:hidden;
	padding:15px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.2);
}

.nav {
    text-align: center;
    margin: 15px auto;
	position:absolute;
	bottom:10px;
	left:0;
	right:0;
	max-width:670px;
	text-align:center;

}

.logo-head {
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    max-width: 200px;
    text-align: center;
}

.logo-head img{  max-width:270px; }
.btn_nav{font-family: 'Open Sans Condensed', sans-serif; font-size:16px; text-transform:uppercase; color:#666; padding:10px; display:inline-block; min-width:130px; text-align:center; border-bottom: 1px solid rgba(196,34,40,0);}

.btn_nav:hover {
    color: #000000;
    background: #fff;
    border-bottom: 1px solid rgba(196,34,40,1.00);
}



/*---------------------------------INDEX----------------------------------*/



/*banner*/
.banner{ position:relative; z-index:0; margin-top: 125px;}
#slides{height:500px !important; background:#000}
.slide-banner{background-size: cover;background-position: center; background-repeat: no-repeat;}
.slides-navigation a{ margin:25px;     font-size: 2em;color: #fff;opacity: 0.5;}
.slides-navigation a:hover{opacity: 1;}
.slides-pagination{ padding:25px}
.banner-text {
    max-width: 700px;
    margin: auto;
    text-align: center;
    position: relative;
    top: 0;
    left: 0;
    right:0;
    padding-top: 200px;
}
.banner-text h1{ font-size:2.5em !important; color: #ffffff; padding: 15px;}
.banner-text h2{ padding: 15px; color: #fff;}


/*GAL*/


.gal .col-4,.gal  .col-2,.gal  .col-75{padding:15px}
.gal .col-3{ padding:5px}

.normal{height:300px}
.normal2{height:150px}
.vert{height:600px}
.vert2{height:300px}
.hor{ width:66.66%}

.img-gal{ width:100%; background:no-repeat; background-size:cover; background-position:center;  height:100%;}
	
	

.hover-img {
    position: absolute;
    left: 15px;
    right: 15px;
    top: 15px;
    bottom: 15px;
    z-index: 1;
    opacity: 0;
    background: #414141;
}

.hover-img-home {
    opacity: 1;
    background: rgba(75,75,75,0.7);
}

.hover-img:hover{opacity:0.9;background: #6d1114;}
.hover-img p{ position:relative}

.hover-img .fa{   position: absolute;
    font-size: 4em;
    padding: 30%;
    text-align: center;
    width: 100%;
    left: 0;
     right: 0;
	color: white;}
	
.in_style {
    font-size: 18px;
    margin: auto;
    text-align: center;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #CCC;
    font-weight: 700;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    right: 0;
    top: 34%;
    padding: 15px;
    letter-spacing:7px
}

.btn_instyle {
    font-weight: 100 !important;
    letter-spacing: normal !important;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #CCC;
    font-size: 16px;
    padding: 5px 10px;
    display: inline-block;
}

.btn_instyle:hover{ color:#FFF; background: #333}
.blur{	filter: blur(3px); /* Someday, sigh ... */ 
	-webkit-filter: blur(3px); /* Prefixed CSS3 blur filters */
	-moz-filter: blur(3px); 
	-o-filter: blur(3px); 
	-ms-filter: blur(3px);
	}
	
.col-3 a .hover-img .in_style
{
 top: 25%;
}
.col-3 a .hover-img {
    left: 5px;
    right: 5px;
    top: 5px;
    bottom: 5px;
}

.head_img_banner{height: 365px;background-size:cover;background-position:center;background-attachment:fixed;filter: grayscale(100%);-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-o-filter: grayscale(100%);-ms-filter: grayscale(100%);}
.head_img_banner::before{ position:absolute; content:''; background:rgba(65,65,65,0.3); left:0; right:0; top:0; bottom:0; z-index:0}
	
	
	
/*CONTACTO*/

input,textarea,select{ margin:5px 0; width:100%; min-width:100%; max-width:100%; padding:10px; font-size:12px; background:#f7f7f7; color:#333; min-height:25px; z-index:10; cursor:pointer}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color:#333;
}
::-moz-placeholder { /* Firefox 19+ */
  color:#333;
}
:-ms-input-placeholder { /* IE 10+ */
  color:#333;
}
:-moz-placeholder { /* Firefox 18- */
  color:#333;
}

button{  

    padding: 15px;
	margin:5px 0;
    position: relative;
    display: block;
    float: right;
    clear: both;
    background-color:#c8353b ;
    color: #fff; cursor:pointer;
	font-family: 'Open Sans Condensed', sans-serif;
	letter-spacing:3px
	}
	
button:hover{ background: #F00}

/*FOOTER*/

#footer li {
    list-style: none;
    line-height: 20px;
    max-width: 140px;
    border-bottom: 1px solid rgb(235, 235, 235);
}
#footer li a{	font-family: 'Open Sans Condensed', sans-serif; }

.of-format {
    font-family: inherit;
    font-size: inherit;
    color: #aeaeae;
}

#footer li a:hover{ color:#c8353b}

.btn-menu {
    display: none;
    position: fixed;
    right: 20px;
    font-size: 2em;
    top: 22px;
    width: 40px;
    padding: 5px;
    height: 40px;
    text-align: center;
    cursor: pointer;
    color: #616161;
}

.close-menu{ display: none}






/*WORKStyle*/


    .nt,.nl li{font-family: 'Poppins', sans-serif;font-weight: 400 !important}
    .section{margin-top: 0 }
    .secton{ margin: 100px auto !important}
    .nt b{font-family: 'Poppins', sans-serif; font-weight: 700 !important; font-size: inherit !important}
    .banner {     position: relative; margin-top: 170px !important;}
    .title{ font-size: 3.3em; line-height: normal }
    .txt-white{ color: #fff}
    .table{ display: table; vertical-align: middle}
    .row{ display: table-row}
    .tablecell{ display: table-cell; vertical-align: middle}
    .nl li{ margin-left: 25px}
    .text-map{position: absolute;  right: 0;  bottom: 115px; max-width:  350px; width: 100%}
    .map-content{ height: 600px;background-size: cover; background-position: left top}
                .img-diagram { display: none}


/*RESPONSIVE*/



@media screen and (max-width: 970px){
    
    .btn_nav { min-width: 100px;}
    .col-4 {width: 50%;}
    #diagram    { display: none !important}
    .img-diagram{ display: block; overflow: auto}
    .img-diagram img{ min-width: 600px}
    
}



@media screen and (max-width: 800px){
    
    .col-2,.col-3,.col-30,.col-70,.col-4 {width: 100%;}
    .table,.tablecell,.row{ display: inherit !important}
    
    .btn-menu,.close-menu{ display:block}
    
    
.banner-text {
    padding-top: 160px;
}    
    
    

.nav {
    position: relative;
    left: 0 !important;
    right: 0 !important;
    background: #f4f4f4;
    padding: 25px;
    box-shadow: 0 2px 2px -2px rgba(0,0,0,0.5);
    z-index: 1;
    -webkit-transform: translateY(-200%);
    -moz-transform: translateY(-200%);
    -o-transform: translateY(-200%);
    transform: translateY(-200%)
}
    
    
.nav-active {

    
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    transform: translateY(-5px)
}
    

    
.logo-head {

    position: absolute;
    max-width: 120px;
    right: 0 !important;
    left: 20px !important;
    margin: inherit !important;
}    
    
#header {
    height: 85px !important;
    overflow: visible;
}    
    
        .btn_nav { 
    width: 100%;
    max-width: 160px;
    margin: auto;
    display: block;    
    }

    
}