@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Pragati+Narrow:400,700&display=swap');


/*VARS*/
:root {	
	--header-full-height:140px;
}

body{ 	
	height: 100%;
	padding: 0;
	font-size:15px;	
	text-align:left;
	margin:0px;
	position:relative;				
	background: #FFF;
	font-family: 'Lato', sans-serif;
    font-weight: 400;
	color: #333333;
	}	

html{
	height: 100%;
	padding: 0;
	}		
	
img{ 
	border:none;
	vertical-align:middle;
	}
    


.foot_td{
    height: 1px;
}
    
/*MAIN*/

.mainTable{
	width:100%;
	height:100vh;	
	}	

	
.rollOver{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-html-opacity: 1;
	opacity: 1;
	
	transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.rollOver:hover{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
}

a,
button{
outline:0 !important;
}

/*HEADER*/ 

header{
    display: inline-block;
    box-sizing: border-box; 
    width: 100%;
    background:rgba(248,248,248,1);    
    text-align: center;
    position: fixed;
    z-index: 9999;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
}

header,
.header_td,
.espaciador{
    height: 110px;
}

.header_home{
    background:rgba(0,0,0,.6);
    -webkit-box-shadow: none;
    box-shadow: none;
}


.espaciador{
    display: inline-block;
    float: left;
    width: 100%;
}

.maxWidht{
    max-width: 1300px;
    margin: 0 auto;
}

/*FOOT*/
.foot{
    display: inline-block;
    box-sizing: border-box;
    float: left;
    background: rgba(0,0,0,1);
    padding: 20px;
    width: 100%;
    color: rgba(255,255,255,.5);
    position: relative;
    text-transform: uppercase;
    font-size: .8em;
}

.foot .direccion{
    display: inline-block;
    box-sizing: border-box;
    float: left;
}

.foot .direccion a, .foot .direccion a:hover, .foot .direccion a:active, .foot .direccion a:visited{
   color: rgba(255,255,255,.5);
   text-decoration: none;
}

.foot .direccion i{
    font-size: .8em;
}


/*LOGIN BOX*/

.login{
    padding: 10px;
    text-align: center;
}

.overlay{
	width:100%;
	height:100%;
	background-color:rgba(0, 0, 0, 0.9);
	position:fixed;
	z-index:999999;
	left:0px;
	top:0px;
	display:none;
	}


/*MENU PRINCIPAL*/

.header_home .menuPrincipal .mpParent,
.header_home .menuPrincipal .mpSingle{
    color: rgba(255,255,255,1);
}

.btnResponsivo{
    display:none;
    box-sizing: border-box;
    height: 57px;
    width: 67px;
    padding: 0px 20px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    vertical-align: middle;
    line-height: 57px;
    border: none;
    background: none;
}

.btnResponsivo img{
    width: 100%;
}

.menuPrincipal{
	display:inline-block;
    text-align: center;
    position: absolute;
    bottom: 0px;
    right: 40px;
    font-size: .85em;
	}
    
.menuPrincipal .mpBlock,
.sb_menu .mpBlock{ 
    display: inline-block;    
    box-sizing: border-box;
    float: left;
    position: relative;    
}

.menuPrincipal .mpBlock{
    margin: 0 auto;
}

.menuPrincipal .mpSub,
.sb_menu .mpSub{    
    display: inline-block;
    box-sizing: border-box;    
}

.menuPrincipal .mpSub{
    display: inline-block;
    box-sizing: border-box;
    position: absolute;
    background: rgba(248,248,248,1);
    
    opacity:0;
    height: 0;
    
    top: 42px;
    left: 0px;
    
    overflow: hidden;
    z-index: 99;    
    
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
    
    -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.35);
    -moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.35);
    box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.35);
}
	
.menuPrincipal a,
.sb_menu a{
	display:inline-block;    
	float:left;
	box-sizing:border-box;	
		
	transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
	
	text-decoration:none; 
    cursor: pointer;
    text-align: left;
	}
    

.menuPrincipal .mpParent,
.menuPrincipal .mpSingle{
    text-transform: uppercase;
    padding:10px 20px 13px 20px;
	color:#333333;
    white-space: nowrap;
    font-weight: 600;    
    position: relative;
}

.menuPrincipal .mpParent .borde,
.menuPrincipal .mpSingle .borde{
    position: absolute;
    width: 100%;
    height: 0px;
    bottom: 0px;
    left: 0px;
    display: inline-block;
    box-sizing: border-box;
    background: rgba(226,0,2,1);
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
	
	text-decoration:none; 
    cursor: pointer;
    text-align: left;
}

.menuPrincipal .mpParent:hover,
.menuPrincipal .mpSingle:hover,
.menuPrincipal .mpParent.activo,
.menuPrincipal .mpSingle.activo,
.header_home .menuPrincipal .mpParent:hover,
.header_home .menuPrincipal .mpSingle:hover{
    background: rgba(0,0,0,.1);
}

.menuPrincipal .mpParent:hover .borde,
.menuPrincipal .mpSingle:hover .borde,
.menuPrincipal .mpParent.activo .borde,
.menuPrincipal .mpSingle.activo .borde,
.header_home .menuPrincipal .mpParent:hover .borde,
.header_home .menuPrincipal .mpSingle:hover .borde{
    height: 3px;
}

.menuPrincipal .mpSub .mpSub_wrap{
   display: inline-block;
   box-sizing: border-box;
   width: 100%;
   padding: 15px;
}
    
.menuPrincipal .mpSub a{  
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  float: left; 
  
  transition: all 0.1s;
  -moz-transition: all 0.1s;
  -webkit-transition: all 0.1s;
  -o-transition: all 0.1s;
  -ms-transition: all 0.1s; 
  
  white-space: nowrap;
  padding: 4px 8px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: rgba(0,0,0,.6);
  font-size: 1.1em;
  margin: 2px 0px;
}

.menuPrincipal .mpSub a:first-child{
    margin-top: 0px;
} 

.menuPrincipal .mpSub a:last-child{
    margin-bottom:0px;
} 

.menuPrincipal .mpSub a:hover{
    color: rgba(255,255,255,1);
    background: rgba(226,0,2,1);
    
}

.menuPrincipal .subIcon{
    margin-left: 3px;
    font-size:.9em;
    color: #868686;
}

.menuPrincipal .mpBlock > .mpParent .fas{
    
    transition: all 0.6s;
    -moz-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    -o-transition: all 0.6s;
    -ms-transition: all 0.6s;
}

.menuPrincipal .mpBlock:hover > .mpSub{
    opacity: 1;
    height: auto;
}

.menuPrincipal .mpBlock:hover > .mpParent .fas{
    -webkit-transform: rotateX(-180deg);
    transform: rotateX(-180deg);   
}

.menuPrincipal a i,
.sb_menu a i{
    margin-right: 3px;
    color: rgba(0,0,0,.3);
}

.menuPrincipal .mpSub.mpProductos{
    position: fixed;
    right: 0px;
    top: 110px;
    left:  auto;
}

.menuPrincipal .mpSub.mpProductos .mpSub_wrap{
    padding-bottom: 5px;
}

.mpProductos .col_menu{
    display: inline-block;
    box-sizing: border-box;
    float: left;
}

.mpProductos .col_menu:first-child{
    padding: 15px 5px 15px 15px;
    width: 25%;
    text-align: left;
    color: rgba(0,0,0,.6);
    font-size: .95em;
    line-height: 1em;
}

.mpProductos .col_menu:last-child{
    width: 75%;
    display: flex;
    flex-flow: row wrap;
}


.mpProductos .desc .titulo{
    font-weight: 900;
    font-size: 1.6em;
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 10px;
    text-transform: uppercase;
    line-height: 1em;
    color: rgba(0,0,0,1);
}

.menuPrincipal .mpSub.mpProductos a{
    position: relative;    
    width: 50%;
    clear: both;
    flex: auto;
    white-space: normal;
    padding-left: 40px;  
    padding: 0px 5px 0px 50px;
    margin-bottom: 5px;
    height: 50px;
}

.menuPrincipal .mpSub.mpProductos a span{
    display: inline-block;
    box-sizing: border-box;
    position: absolute;    
    height: 40px;
    width: 40px;
    overflow: hidden;
    left: 0px;
    top: 0px;
    background: #FFFFFF;
    text-align: center;
    border: solid 1px #9c9c9c;
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.menuPrincipal .mpSub.mpProductos a span img{
    width: 80px;
    height: 80px;
    margin-left: -20px;
    margin-top: -20px;
}

.menuPrincipal .mpSub.mpProductos a:hover{
    background: none;
    color:rgba(0,0,0,.8);    
}

.menuPrincipal .mpSub.mpProductos a:hover span{
    opacity: 0.6;
}

/*TOP BAR*/

.topBar{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    padding: 8px 40px;
    background: rgba(28,32,36,1);
}

.topBar .menu_tb{
    display: inline-block;
    box-sizing: border-box;
    float: right;
    font-size: .8em;
    font-weight: 400;
    text-transform: uppercase;
}

.topBar .menu_tb a,
.topBar .menu_tb a:active,
.topBar .menu_tb a:hover{
    display: inline-block;
    box-sizing: border-box;
    float: left;
    text-decoration: none;
    color: rgba(255,255,255,0.8);
}

.topBar .menu_tb a i{
    margin-right: 5px;
}

.topBar .menu_tb a{
    margin-left: 10px;
}

.topBar .menu_tb a:first-child{
    margin-left: 0px;
}


/*MENU BAR*/

header .logo{
    width: 114px;
    position: absolute;
    left: 40px;
    bottom: 15px;
}

header .logo img{
    width: 100%;
}

header .logo {
  fill: red;
}


/*HOME*/

.wallpaper{
	display:inline-block;
    height: 100%;
    width: 100%;
	height:auto;
	position:relative; 
	max-height:100%;
	overflow:hidden;
	box-sizing:border-box;
	float:right;
	vertical-align: middle;
    
    transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -webkit-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    
    padding-top: 0px; /*padding header*/
    background: #000;       
	}
    
.wallpaper .bk{
    opacity: 0.7;
}
    
.bk .pic{
    height:calc(100vh);
    width: 100%;
} 

.bk .pic img{
    height: 100%;
} 

.ss_1{
   background: url('../slides/1.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
}

.ss_2{
   background: url('../slides/2.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
}
.ss_3{
   background: url('../slides/3.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
} 

.intro{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    position: absolute;
    z-index: 999;
    text-align: center; 
    bottom: 40px;
    padding: 40px;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;  
}

.intro h1{
    font-size: 8em;
    font-weight: 700;
    color: #FFFFFF;
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    font-family: 'Pragati Narrow', sans-serif;
    text-transform: uppercase;
    padding-bottom: 0px;
    border-bottom: 1px solid rgba(255,255,255,.3);
    margin-bottom: 20px;
    line-height: 1em;
}

.intro .txt{
    color: #FFFFFF;
    display: inline-block;
    box-sizing: border-box;
    font-size:1.1em;
    padding: 40px;
    position: relative;
    text-align: center;
}

.intro .txt p{
    font-weight: 900;
    text-transform: uppercase;
}

.intro_resp{
    display: none;
    margin-bottom: 20px;
}

.intro_resp .txt{
    color: #333333;
    display: inline-block;
    box-sizing: border-box;
    width: 100%;   
    border: solid 1px rgba(0,0,0,.3);
    padding: 20px 20px 5px 20px;
    position: relative;
    text-align: justify;
}


.intro_resp .triangulo{
    border-right-color: rgba(0,0,0,.3);
}

/**/

.contenido{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    margin: 0 auto;
}

.bloque_contenido{
    padding: 40px 40px 0px 40px;
}

.bloque_single{
    padding: 0px 40px;
}

/**/
.articulo{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    color: rgba(0,0,0,.7);
    margin-bottom: 40px;
}

.articulo .boxTexto p{
    text-align: justify;
}

.articulo h1{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    font-size: 2.5em;
    line-height: 1em;
    margin-bottom: 40px;
    font-weight: 300;
    letter-spacing: -1.5px;
    text-transform: uppercase;
    text-align: left;
    border-right: 10px solid rgba(226,0,2,1);
    padding: 0px 20px 0px 0px;
}

.articulo h2{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    padding: 10px 20px;
    background:rgba(0,0,0,.1);
    
    font-family: 'Lato', sans-serif;
    margin-bottom: 20px;
    font-weight: 900;
    font-size: 1em;
    text-transform: uppercase;
    text-align: left;
    border-right: 10px solid rgba(226,0,2,1);
}

.articulo .boxTexto h1,.articulo .boxTexto h2, .articulo .boxTexto h3{    
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 1.8em;
    padding-bottom: 10px;
    border-bottom: solid rgba(226,0,2,.3) 1px;
    color: rgba(0,0,0,.8);
}

.articulo .detalles{
    font-size: .75em;
    color: rgba(0,0,0,.4);
}

.articulo .miniatura{
    width: 100%;
    max-width: 50%;
    box-sizing: border-box;
    display: inline-block;
    padding: 0px 0px 6px 20px;
    float: right;
}

.articulo .miniatura img{
    width: 100%;
}

.articulo img{
    max-width: 100%;
    display: block;
    padding: 10px;
    border: solid 1px rgba(0,0,0,.1);
    text-align: center;
    object-fit:scale-down;    
    margin: 10px auto;
}

.articulo table{
    border-spacing: 0;
    border-collapse: collapse;
    border: 1px solid rgba(0,0,0,.1);
    margin-bottom: 1rem;    
    margin: 0 auto;
    font-size:.8em;
    width: auto !important;
}

.articulo table td, .articulo table th{
    padding: 3px 6px;
    border: 1px solid rgba(0,0,0,.1);
    vertical-align: top;
    text-align: center;
    height: auto !important;
    white-space:nowrap;
}

.articulo table th{
    text-align: center;
    font-weight: 900;
    vertical-align: middle;
    background: rgba(226,0,2,1);
    color: #FFFFFF;
    text-align: center; 
}

.articulo table td p, .articulo table th p{
    padding: 0px;
    margin: 0px;
}

.articulo table tr:nth-child(even) td{
    background: rgba(255,221,221,.3);
}

.wrapTabla{
    width: 100%;
    overflow-x: auto;  
    position: relative;
    margin: 0 auto;
}

/*
.wrapTable{
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    overflow-x: auto;  
    position: relative;
    margin: 0 auto;
}
*/
/**/

.masonry {
  display: flex;
  width: 100%;
  flex-flow: row wrap;    
  margin-bottom: 30px;
}

.masonry-brick {
  overflow: hidden;
  margin: 0px 5px 10px 5px;
  color: white;
  position: relative;
  flex: auto;
  height: 250px;
  min-width: 150px;
}

.masonry-img{
  object-fit: cover;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  max-width: 100%;
}

@media only screen and (min-width: 1024px) {
  /* Horizontal masonry bricks on desktop-sized screen */
  .masonry-brick:nth-child(4n+1) {
    width: 250px;
  }
  .masonry-brick:nth-child(4n+2) {
    width: 325px;
  }
  .masonry-brick:nth-child(4n+3) {
    width: 180px;
  }
  .masonry-brick:nth-child(4n+4) {
    width: 380px;
  }
  
}

@media only screen and (max-width: 1023px) and (min-width: 780px) {
  /* Horizontal masonry bricks on tabled-sized screen */
  .masonry-brick:nth-child(4n+1) {
    width: 200px;
  }
  .masonry-brick:nth-child(4n+2) {
    width: 250px;
  }
  .masonry-brick:nth-child(4n+3) {
    width: 120px;
  }
  .masonry-brick:nth-child(4n+4) {
    width: 280px;
  }

}

/**/

.flex_twoCols{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-wrap: wrap;
    justify-content: center ;    
    width: 100%;
}


.flex_twoCols > .videoInline{
    display: inline-block;
    box-sizing: border-box;
    flex: 100%;
    padding: 0px 0px 20px 0px;
    text-align: center;  
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	width: 100%;
	box-sizing: border-box;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
	background: rgba(255,255,255,1.00);
}

/**/

.descargables{ 
    margin-bottom: 40px;
}

.descargables{ 
    margin-bottom: 40px;
}

.descargables .bloque_contenido{
    padding-top: 0px;
    padding-bottom: 0px;    
}

.boxDescargables{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    padding-top: 0px;
    background: rgba(0,0,0,.1);
	position: relative;
}

.descargables h2{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    padding: 10px 15px;
    font-weight: 900;
    font-size: 1em !important;
    text-transform: uppercase;
    background: rgba(255,255,255,.5);
    border-right: 10px solid rgba(226,0,2,1);
}

.descargable .descripcion{
    display: inline-block;
    box-sizing: border-box;
    padding: 0px 15px;   
    padding-left: 35px;    
    text-align: left;
    position: relative;
    margin-bottom: 8px;
}

.descargable a, .descargable a:hover, .descargable a:active, .descargable a:link, .descargable a:visited{
    color: #333333;
    text-decoration: none;
    position: relative;
}

.descargable{
    text-align: left;
}

.descargable i{
    color: rgba(0,0,0,.3);
    left: 15px;
    position: absolute;   
    font-size: .8em;
    top: 6px;
    
}

.descargable:last-child .box{
    margin-bottom: 0px;
}

.boxDescargables .cnt{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    padding: 20px;
}

/**/
.bigError{
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    padding: 10px;
}

.bigError .error{
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    font-size: 3em;
    font-weight: 300;
    width: 100%;
    line-height: .5em;
}

.bigError .error div{
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    font-size: 3em;
    font-weight: 900;
    width: 100%;
    line-height: 1em;
    letter-spacing: -5px;
    color: rgba(0,0,0,.3)
}

.bigError .denegado{
     display: inline-block;
    box-sizing: border-box;
    text-align: center;
    font-size: 1.9em;
    line-height: .5em;
    
}

/**/

.tituloImg{
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
    padding: 0px 20px 20px 20px;
    width: 100%;
}

.tituloImg img{
    width: 100%;
    max-width: 250px;
    margin: 0 auto;
}

.centro{
    text-align: center;
}

.bloqueDebug{
    display: inline-block;
    width: 100%;
    float: left;
    word-wrap: break-word;
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #000;
}

/**/

.td_top{
    vertical-align: top;
}

/*

.bannerTop{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    height: 400px;
    float: left;
    padding: 10px;
}

.bannerTop .bannerCol{
    display: inline-block;
    box-sizing: border-box;
    float: left;
}

.bannerTop .bannerCol:first-child{
    width: 65%;
    padding-right: 10px;
}

.bannerTop .bannerCol:last-child{
    width: 35%;
    padding-left: 10px;
}

.bannerTop .bannerCol .banner{
    width: 100%;
    height: 400px;  
    display: inline-block;
    box-sizing: border-box;   
    overflow: hidden;
    background: #9c9c9c;
    position: relative;
    overflow: hidden;
}

.bannerTop .bannerCol .banner .txt{
    position: absolute;
    bottom: 0px;
    right: 0px;
    font-size: 2em;
    display: inline-block;
    background: #000000;
    color: #FFF;
    padding: 20px;
    
}

.bannerTop .bannerCol .banner img{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    height: 400px;
    object-fit:cover;
    object-position: 50% 50%;
}
*/

.bannerTop{
    width: 100%;
    float: left;
}

.bannerTop .bannerCol{
    padding: 10px;
}

.bannerTop .bannerCol:first-child{
    width: 65%;
    padding-right: 5px;
}

.bannerTop .bannerCol:last-child{
    width: 35%;    
    padding-left: 5px;
    position: relative;
    overflow: hidden;
}

/*
.bannerTop .bannerCol:last-child div{
    position: absolute;
    height: calc(100% - 20px);
    width: calc(100% - 15px);
    top: 10px;
    left: 5px;
}
*/

.bannerTop .bannerCol img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.boxCentro{
    text-align: center;
}

.boxIntro{
    display: inline-block;
    box-sizing: border-box;
    margin: 0 auto;
    margin-top: 40px;
}

.boxIntro h2{
    font-size: .9em;
    text-transform: uppercase;
    color: rgba(0,0,0,.7);
    font-weight: 700;
    margin-bottom: 10px;
}

.boxIntro h1{
    font-weight: 700;
    color: rgba(0,0,0,.7);
}

.separador{
    height: 1px;
    width: 100px;
    background: rgba(0,0,0,.3);
    display: block;
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
}

.boxIntro .txt{
    margin: 0 auto;
    max-width: 700px;
    font-size: 1.2em;
    color: rgba(0,0,0,.5);
    text-align: justify;
}

.boxIntro .pic{
    display: inline-block;
    box-sizing: border-box;
    padding: 20px;
    width: 100%;
}

.boxIntro .pic img{
    width: 100%;    
}

/**/
.gridIconos{
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    color: #FFFFFF;  
    justify-content: center;
    
}

.gridIconos > .boxIcono{
    display: inline-block;
    box-sizing: border-box;
    flex: 25%;
    padding: 0px 20px 20px 20px;
    text-align: center;
    min-width: 250px;
    max-width: 450px;
}

.gridIconos .boxIcono .icono{
    display: block;
    box-sizing: border-box;    
    width: 80px;
    margin: 0 auto;
    margin-bottom: 20px;
}

.gridIconos .boxIcono .icono img{
    width: 100%;
}

.gridIconos .boxIcono h4{
    font-size: 1.1em;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 700;
}

.gridIconos .boxIcono p{      
    font-size: 1.1em;
    line-height: 1.8em;
}

.bloque_rojo{
    background: #c10002;
    padding: 40px;
}

/*POSTS*/

.plecaTop{
    padding: 40px 0px;
    background: url("../img/pleca_cat.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
}

.plecaTopBox{
    width: 100%;
    margin: 0 auto;
    text-align: left;
    padding:0px 40px;
}

.plecaTop h2, .plecaTop h1{
    color: rgba(255,255,255,.9);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.6em;
    font-family: 'Pragati Narrow', sans-serif;
}

.breadcrumbs, .breadcrumbs a, .breadcrumbs a:hover, .breadcrumbs a:link, .breadcrumbs a:visited, .breadcrumbs a:active{
    color: rgba(255,255,255,.6);
    text-decoration: none;
}

.breadcrumbs i{
    margin: 0px 10px;
    font-size: .8em;
}

.breadcrumbs i:first-child{
    margin-left: 0px;
}

/**/

.galeria{
    padding-top: 0px;
}


/**/

.gridPosts{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-wrap: wrap;   
    width: 100%;
    justify-content: flex-start;
}


.gridPosts > .post{
    display: inline-block;
    box-sizing: border-box;
    padding: 20px;
    text-align: center;  
    border: solid rgba(0,0,0,.1) 1px;
    margin-bottom: 20px;
    
}

.gridPosts.postsRelacionados > .post{
    width: 30%;
    padding: 10px;  
    margin: 10px;
}

.gridPosts.postsRelacionados{
    margin: 10px -10px;
}


.gridPosts .post .thumb{
    display: inline-block;
    box-sizing: border-box;
    width: 30%; 
    float: left;
    position: relative;
    overflow: hidden;
}

.gridPosts .post .thumb img{
    width: 100%;
}

.gridPosts .post .desc{
    display: inline-block;
    box-sizing: border-box;
    padding-left: 40px;
    text-align: left;
    float: left;
    position: relative;
    width: 70%;
}

.gridPosts .post .desc h3{
    display: inline-block;
    box-sizing: border-box;
    font-size: 2em;
    font-weight: 300;
    text-align: left;    
    color: rgba(0,0,0,.9);
    max-width: 400px;
    line-height: 1em;
    margin-bottom: 20px;
}

.gridPosts .post .desc .short_desc{
    line-height: 1.6em;
    font-size: 1.2em;
    color: rgba(0,0,0,.5);
    text-align: justify;
    margin-bottom: 20px;
}

.gridPosts .post .desc .ver_mas{
    display: inline-block;
    box-sizing: border-box;
    padding: 8px 15px;
    background: rgba(0,0,0,.3);
    -webkit-border-radius: 15px;
    border-radius: 15px;
    text-transform: uppercase;
    font-size: .8em;
    font-weight: 900;
    color: #FFFFFF;
}


.gridPosts.postsRelacionados .post .desc .ver_mas{
    float: right;
    padding: 4px 10px;
    font-size: .7em;
}

.gridPosts.postsRelacionados .post .thumb{
    width: 100%;
    margin-bottom: 15px;
}

.gridPosts.postsRelacionados .post .desc{
    width: 100%;
    padding: 0px;
}

.gridPosts.postsRelacionados .post .desc h3{
    font-size: 1.1em;
    font-weight: 700;
}

.gridPosts.postsRelacionados .post .desc .short_desc{
    font-size: .9em;
    line-height: 1.2em;
}

/**/
.gridAreas{
    text-align: center;
    display: inline-block;
    box-sizing: border-box;
    margin: 0px -10px;
}


.gridAreas > div{
    display: inline-block;
    box-sizing: border-box;
    padding: 8px 15px;
    background: rgba(0,0,0,.1);
    margin: 10px;
    color: rgba(0,0,0,.8);
    font-size: .75em;
    text-transform: uppercase;
    font-weight: 900;
}


/*LISTADO PRODUCTOS*/

.tablaSidebar{
    width: 100%;
}

.tablaSidebar .menuSidebar{
    padding-right: 40px;
    width: 300px;
}

.tablaSidebar .menuSidebar, .tablaSidebar .contenidoSidebar{
    vertical-align: top;
}

.buscador{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    margin-bottom: 40px;
}

.buscador .searchBox{
    display: inline-block;
    box-sizing: border-box;
    padding: 5px;
    background: rgba(233,233,233,0.1);
    -webkit-border-radius: 20px;
    border-radius: 20px;
    border: solid 1px rgba(0,0,0,0.2);    
    width: 100%;
}

.buscador .searchBox input{
    width: calc(100% - 30px);
    float: left;
    border: 0px;
    background: none;
    font-family: 'Lato', sans-serif;
    font-size: 15px;
    padding-left: 10px;
}

.buscador .searchBox input::placeholder{
    font-style: italic;
}
.buscador .searchBox input::-webkit-input-placeholder{
    font-style: italic;
}
.buscador .searchBox input:-ms-input-placeholder{
    font-style: italic;
}

.buscador .searchBox button{
    float: right;
    display: inline-block;
    box-sizing: border-box;
    border: none;
    background: none;
    width: 30px;
}

/*MENU SIDEBAR*/
.categoriasListado{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;    
    margin-bottom: 40px;
}

.categoriasListado .menu{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;  
}

.categoriasListado .menu .boxCat{
     display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
}

.categoriasListado .menu a{
    display: inline-block;
    box-sizing: border-box;
    width: calc(100% - 20px);
    float:left;
    padding: 5px 0px;    
    color: rgba(0,0,0,.5);
    border-bottom: solid 1px rgba(0,0,0,.1);
    text-decoration: none;
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    
}

.categoriasListado .menu a:hover{
    padding-left: 5px;
    color: rgba(226,0,2,1);
}

.categoriasListado .menu .boxCat{
    padding-left: 0px;   
    display: inline-block;
    box-sizing: border-box;
    width: 100%; 
    
    transition: all 1s;
    -moz-transition: all 1s;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;
    
}

.categoriasListado .menu .boxCat > .boxCat{
    padding-left: 10px;
    border-bottom: 0px;
    height: 0px;
    overflow: hidden;
    opacity: 0;
}

.categoriasListado .menu .boxCat > .boxCat.desplegado{
    height: auto;
    opacity: 1;
}

.categoriasListado .menu .boxCat > .boxCat a{
    border-bottom: solid 1px rgba(0,0,0,0);
}

.categoriasListado .menu .btnDesplegable{
    display: inline-block;
    box-sizing: border-box;
    width: 20px;
    text-align: center;
    float: right;
    color: rgba(0,0,0,.2);
    padding-top: 4px;
    cursor: pointer;
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.categoriasListado .menu .btnDesplegable:hover{
    color: rgba(226,0,2,1);
}

.categoriasListado .titulo{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    font-family: 'Pragati Narrow', sans-serif;
    text-align: left;
    font-weight: 900;
    border-bottom:1px solid rgba(226,0,2,1);
    font-size: 1.3em;
    margin-bottom: 10px;
}

.categoriasListado .titulo i{    
    display: none;
    float: right;    
    color: rgba(226,0,2,1);
    padding-left: 10px;
}

.categoriasListado .menu a.activo{
    color: rgba(226,0,2,1);
}

.no_results{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    padding: 20px;
    background: rgba(0,0,0,.1);
    color: rgba(0,0,0,.8);
    text-align: center;
    font-weight: 700;
    
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

/**/

.gridProductos {
  display: inline-block;
  box-sizing: border-box;
  display: flex;
  flex-flow: row wrap;    
  justify-content: space-around;
  margin-bottom: 30px;
  margin-right: -20px;
  margin-left: -20px;
}

.gridProductos > .boxProducto{
  color: white;
  position: relative;
  flex: auto;
  margin-right:20px;
  margin-left: 20px;
  margin-bottom: 40px;
  text-align: center;
  width: 190px;
}

.gridProductos .boxProducto a{
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    color: rgba(0,0,0,.8);
}

.gridProductos .boxProducto .pic{
    display: inline-block;
    box-sizing: border-box;
    width: 200px;
    height: 200px;
    line-height: 150px;
    vertical-align: middle;
}

.gridProductos .boxProducto img{
    width: 200px;
    height: 200px;
    object-fit: contain;
}

.gridProductos .boxProducto .descripcion{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    float: left;
    margin-top: 10px;
    line-height: 1em;
    color: rgba(0,0,0,.7);
}

.paginadoBox{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}

.paginadoBox .paginado{
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    margin: 0 auto;
}

.paginado a{
    display: inline-block;
    box-sizing: border-box;
    float: left;
    margin: 0px 5px;
    color: rgba(255,255,255,1);
    text-decoration: none;
    background: rgba(0,0,0,.3);
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    font-size: .9em;
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.paginado a:hover, .paginado a.pagActivo{
    background: rgba(0,0,0,.5);
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

/**/

.productoHead{
    display: flex;
    float: left;
    margin-bottom: 20px;
    margin: 0px -20px 0px -20px;
    flex-wrap: wrap;   
    justify-content: center;
}

.productoHead .ph_col{
    flex-direction: column;
    text-align: center;
    padding: 0px 20px;
    margin-bottom: 20px;
    /*align-self: flex-end;*/
}

.productoHead .ph_thumbnail{
    flex-basis: 400px;
    flex-shrink: 0;
}

.productoHead .ph_desc{
    flex-basis: 100px;
    flex-grow: 1;
}

.productoHead .ph_thumbstrip{
    flex-basis: 100%;
}

.productoHead .descripcion{
    padding: 20px;
    background: rgba(200,200,200,.2);
    -webkit-border-radius: 10px;
    border-radius: 10px;
    text-align: justify;
}

.productoHead h1{
    font-family: 'Pragati Narrow', sans-serif;
    font-size: 2em;
    font-weight: 900;
    line-height: 1em;
    margin-bottom: 15px;
}

.productoHead .descripcion .sku{
    margin-bottom: 20px;
    font-size: .8em;
}

.productoHead .descripcion p{
    font-size: .85em;
    color: rgba(0,0,0,.6);
    padding: 0px;
    margin: 0px;
}

.galeria_productos{
    display: inline-block;
    box-sizing: border-box;
	
	-webkit-box-shadow: 0 0 8px 0 rgba(0,0,0,.2);
	box-shadow: 0 0 8px 0 rgba(0,0,0,.2);
	
	-webkit-border-radius: 3px;
	border-radius: 3px;
	overflow: hidden;
	width: 100%;
}

.galeria_thumbnails{
	width: 100%;
	display: grid;
	grid-template-columns: repeat(5, 1fr);	
	grid-auto-rows: 1fr;
	grid-column-gap: 5px;
	grid-row-gap: 5px;
	margin-top: 20px;
}

.galeria_thumbnails .pic{
	width: 100%;
	aspect-ratio: 1 / 1;	
}

.galeria_productos .pic{
	width: 100%;
	aspect-ratio: 1 / 1;
}

.galeria_thumbnails img, .galeria_productos img{
	width: 100%;
	height: 100%;
	object-fit: cover;	
	
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.galeria_thumbnails img{	
	-webkit-border-radius: 3px;
	border-radius: 3px;
	border: solid 1px #eaeaea;
}

.galeria_thumbnails img{
    cursor: pointer;    
    
    transition: all 0.2s;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
}

.galeria_thumbnails img:hover{
    cursor: pointer;    
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
}

.thumbstrip-responsive{
	display: none;
}

/**/

.producto-head{	
	width: 100%;
	display: grid;
	grid-template-columns: repeat(2, 1fr);	
	grid-auto-rows: 1fr;
	grid-column-gap: 40px;
	grid-row-gap: 40px;
}

.producto-head .descripcion {
	display: inline-block;
	width: 100%;
	padding: 20px;
	background: rgba(200,200,200,.2);
	-webkit-border-radius: 10px;
	border-radius: 10px;
	text-align: justify;
}

.producto-head h1 {
  font-family: 'Pragati Narrow', sans-serif;
  font-size: 2em;
  font-weight: 900;
  line-height: 1em;
  margin-bottom: 15px;
  text-align: left;
}


.producto-head .descripcion .btnGenerico{
	font-size: .9em;
	text-decoration: none;
	background: rgba(226,0,2,1);
}


.anchor-link{
	margin-top:calc(var(--header-full-height)*-1);
	display: flex;
	position: absolute;
	top: 0px;
	width: 100%;
}

.bloque-form{
	display: flex;
	width: 100%;
	padding: 20px;
}


/*

.galeria_productos .pic:first-child{
    width: 400px;
    height: 400px;
    margin: 0px;
}
*/

/**/

/*HOME*/
.wallpaper{
	display:inline-block;
    height: 100%;
    width: 100%;
	height:auto;
	position:relative; 
	max-height:100%;
	overflow:hidden;
	box-sizing:border-box;
	float:right;
	vertical-align: middle;
    
    transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -webkit-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -ms-transition: all 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);
    
    padding-top: 0px; /*padding header*/
       
	}
    
.bk .pic{
    height:calc(100vh);
    width: 100%;
} 

.bk .pic img{
    height: 100%;
} 

.ss_1{
   background: url('../img/home/s1.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
}

.ss_2{
   background: url('../img/home/s5.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
}
.ss_3{
   background: url('../img/home/s3.jpg'); 
   background-size: cover; 
   background-position: center;
   background-repeat: no-repeat;
} 

.intro{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    position: absolute;
    z-index: 999;
    text-align: center; 
    bottom: 40px;
    padding: 40px;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;  
}

.intro h1{
    font-size: 3em;
    font-weight: 300;
    color: #FFFFFF;
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    line-height: .9em;   
    margin-bottom: 40px;
}

.intro .txt{
    color: #FFFFFF;
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    max-width: 900px;
    font-size:1.1em;    
    border: solid 1px rgba(255,255,255,.3);
    padding: 40px;
    position: relative;
    background: rgba(0,0,0,.2);
}

/* pager */
.bannerTop .cycle-pager { 
    display: inline-block;
    box-sizing: border-box;
    text-align: right;
    z-index: 500; 
    position: absolute !important; 
    bottom: 0px;
    right: 10px;
    overflow: hidden;
}
.bannerTop .cycle-pager span { 
   
    font-family: arial; font-size: 50px; 
    display: inline-block; 
    color: rgba(255,255,255,.7);
    cursor: pointer; 
    line-height: 20px;
    text-shadow: 0 0 2px #000000;
    
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
    margin-left: 2px;
}

.bannerTop .cycle-pager span.cycle-pager-active { 
    color: rgba(255,255,255,1);
    
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    -ms-transition: all 0.3s;
}

.bannerTop .cycle-pager > * { 
    cursor: pointer;
}

/**/

.grid_1x2{
    width: 100%;   
    margin-bottom: 20px;
}

.grid_1x2 tr .grid_col:first-child{
    width: 25%;
    padding-right: 20px;
}

.grid_1x2 tr .grid_col:last-child{
    width: 75%;
    padding-left: 20px;
}

.grid_1x2 td{
    vertical-align: top;
}

/*BOX FORM*/
.boxForm{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    max-width: 302px;
    float: left;
    margin-bottom: 20px;
}

.boxForm h2, .contacto h2{
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 10px;
    color:#333333;
}

.boxForm input, .boxForm textarea, .boxForm select{
    margin-bottom: 5px;
    resize: none;
}

.boxForm textarea{
    height: 100px;
}

.formInline{
    padding: 15px;
    background: rgba(0,0,0,.9);
    color: #FFFFFF;
    min-width: 332px;
}

.btnGenerico, .btnGenerico:hover {
    background: rgba(0,0,0,.5);
    font-weight: 400;
    border: none;
    font-size: .8em;
    color: #FFFFFF;
    float: right;
    font-family: 'Lato', sans-serif;
    text-transform: uppercase;
    margin-top: 5px;
    padding: 4px 15px;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	white-space: nowrap;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.formInline .btnGenerico, .formInline .btnGenerico:hover {
    background: rgba(255,114,0,1.00);
    font-weight: 800;
    border: none;
    font-size: 1em;
    color: #FFFFFF;
    float: right;
}

.grecaptcha-badge { 
    visibility: hidden;
}

.btnGenerico i{
	display: flex;
	align-items: center;
}

.warning{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    text-align: right;
    font-size: .85em;
    color: rgba(226,0,2,.6);
}

.formInline .warning{
    font-size: .8em;
}

.formInline textarea {
    height: 100px;
}

.contacto a, .contacto{
    color: rgba(0,0,0,.5); 
    text-decoration: none;
}

.highlight{
    background: rgba(226,0,2,.1);
}

.relacionados{
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
}

.relacionados h3{
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 1.8em;
    padding-bottom: 10px;
    border-bottom: solid rgba(226,0,2,.3) 1px;
    color: rgba(0,0,0,.8);
}

.relacionados .gridProductos > .boxProducto{
  width: 140px;
}

.relacionados .gridProductos .boxProducto img {
    width: 140px;
    height: 140px;
}

.relacionados .gridProductos .boxProducto .pic {
    width: 140px;
    height: 140px;
    line-height: 140px;
}

.relacionados .gridProductos .boxProducto .descripcion {
    font-size: .9em;
    margin-top: 10px;
    line-height: 1.2em;
}

/**/

.form-grid-wrapper .form-grid{
	width: 100%;
	display: grid;
	grid-template-columns: repeat(2, 1fr);	
	grid-auto-rows: 1fr;
	grid-column-gap: 20px;
	grid-row-gap: 20px;	
}

.form-grid-wrapper .form-grid .form-col{
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
