
/* ------------------------------------------------------------------------------
    Empresa: ZELAIETA
    Author: Infoberri
    Author URI: http://www.infoberri.com
    Fecha: 2019
------------------------------------------------------------------------------  */
@media screen and (max-width: 768px) {
	h4.opcional {
		margin-left: 15px;
	}
}

/* ------------------------------------------------------------------------------
     Header
-------------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	#header.fixed {
	    top: 0;
	    position: fixed;
	    width: 100%;
	    background: #fff;
	}
}
@media screen and (max-width: 545px) {
	.top-menu-flex li span.youtubeHeaderOculta {
	  display: none;
	}
}
@media screen and (max-width: 520px) {
	.top-menu-flex li {
	    margin-right: 15px;
	    font-size: 12px;
	}
	.dropdown {
	    margin-right: 12px;
	}
}
@media screen and (max-width: 464px) {
	.top-menu-flex li a.youtubeHeader i {
	  margin-left: 0px;
	  margin-right: 0px;
	}
}
@media screen and (max-width: 393px) {
	.top-menu-flex li {
		padding-top: 3px;
    font-size: 11px;
	}
	.top-menu-flex li i {
	  margin-right: 3px;
	}
	.top-menu-flex li a.youtubeHeader {
	  margin-top: -3px;
	}
	.dropdown {
    font-size: 11px;
	}
	.dropdown-menu {
	  left: -30px;
    min-width: 100px;
    font-size: 11px;
	}
}

/* ------------------------------------------------------------------------------
    Header logo & menu
-------------------------------------------------------------------------------*/
@media (min-width:991px){
	.visible991 {
		display: none;
	}
	.exo-menu > li > a{
		display: inline-block;
	 }
	.mega-menu, .flyout-mega-wrap, .Images, .Blog, li.drop-down>ul{
		position:absolute;
	}
}
@media (max-width:991px){
	.visible991 {
		display: block;
	}
	html, body {
  }
	#header {
		top: 0px;
		background: #fff;
      	position: fixed;
	    z-index: 999991;
	    left: 50%;
	    margin-left: -375px;
	    overflow: auto;
	    max-height: 100vh;
	}
	#header .grid-logo-menu {
	    display: block;
	}
	#header .logo {
    width: 100%;
    margin: 15px 0px;
  	display: block;
	}
	#header .logo img {
    margin: 0px auto;
    display: block;
    width: 170px;
	}
	#header .exo-menu {
	    margin-top: 0px;
	    display: block;
	    width: 100%;
	    float: none;
	    position: relative;
	    background: transparent;
	    padding-top: 0px;
	    padding-bottom: 0px;
	    border-top: 0px solid #ccc;
	    font-weight: 300;
	}
	#header.fixed .exo-menu {
	    background: transparent;
	}
	.exo-menu {
		width: 100%;
	    display: block;
	    padding-top: 0px;
	    padding-bottom: 0px;
	    border-top: 0px solid #ccc;
	    background: transparent;
	    overflow: scroll;
	}
	.exo-menu > li {
	    display: block;
	    background: #fff;
	}
	.exo-menu > li > a{
		width:100% ;
	    display:none;
	}
	.exo-menu > li{
		width: 100%;
	}
	.display.exo-menu > li > a{
	  	display: block;
	  	padding: 10px 22px;
	}
	li.drop-down>ul{
		position:relative;
	    /*left: 0px;*/
	    min-width: 230px;
	    margin-left: 14px;
	    padding-top: 0px;
	}
	.mega-menu {
		position:relative;
	  	padding-top: 0px;
	  	padding-left: 35px;
	}
}

@media (max-width:768px){
	#header {
	    margin-left: 0px;
	    left: 0px;
	    width: 100%;
	}
}

@media (max-width:550px){
	#header .logoMobile img {
    margin: 0px 0px;
    display: block;
    width: 170px;
	}
}

/* ------------------------------------------------------------------------------
   Detalle lineas
-------------------------------------------------------------------------------*/
@media (max-width:991px){
	.rotate1 {
		margin-top: -15px;
	  height: 1px;
	  width: 100%;
	  background: #ec6608;
	  /* Safari */
	  -webkit-transform: rotate(.5deg);
	  /* Firefox */
	  -moz-transform: rotate(.5deg);
	  /* IE */
	  -ms-transform: rotate(.5deg);
	  /* Opera */
	  -o-transform: rotate(.5deg);
	}
	.rotate2 {
		margin-top: -4px;
	  height: 1px;
	  width: 140%;
	  margin-left: -10%;
	  background: #ec6608;
	  /* Safari */
	  -webkit-transform: rotate(-.5deg);
	  /* Firefox */
	  -moz-transform: rotate(-.5deg);
	  /* IE */
	  -ms-transform: rotate(-.5deg);
	  /* Opera */
	  -o-transform: rotate(-.5deg);
	}
}

/* ------------------------------------------------------------------------------
   Main
-------------------------------------------------------------------------------*/
@media (max-width:991px){
	main {
	  margin-top: 150px;
	}
}

/* ------------------------------------------------------------------------------
   Slider
-------------------------------------------------------------------------------*/
@media (max-width:1280px){
	.x_021_animated_layers_img {
	    height: 80%;
	}
}
@media (max-width:1024px){
	.x_021_animated_layers_img {
	    height: 60%;
	}
}
@media (max-width:991px){
	#x_021_animated_layers, #x_021_animated_layers > .carousel-inner, #x_021_animated_layers > .carousel-inner > .item {
    overflow: hidden;
    max-height: auto;
	}
	.x_021_animated_layers_txt, .x_021_animated_layers_img, .x_021_animated_layers_content_right > .x_021_animated_layers_txt {
		left: 0px;
		right: 0px;
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    display: block;
    position: relative;
    overflow: hidden;
	}
	.x_021_animated_layers_img {
	    height: 100%;
	}
	.x_021_animated_layers_img > img {
    width: 70%;
    display: block;
    margin: 0 auto;
	}
	.x_021_animated_layers_txt > h1 {
	    font-size: 45px;
	}
	.x_021_animated_layers_txt > h2 {
	    font-size: 28px;
	}
	.x_021_animated_layers_txt > a {
    width: 135px;
    height: 40px;
    line-height: 40px;
	}
	#x_021_animated_layers > .carousel-inner > .item > img.bg, #x_021_animated_layers > .carousel-inner > .item > a > img.bg {
    width: 100%;
    margin: auto;
    height: 7000px;
	}
}
@media (max-width: 991px) and (min-width: 768px) {
	.x_021_animated_layers_txt {
	    height: auto;
	    padding: 30px 0px;
	}
}
@media (max-width:768px){
	.x_021_animated_layers_img > img {
    width: 94%;
    display: block;
    margin: 0 auto;
	}
	.x_021_animated_layers_txt, .x_021_animated_layers_img, .x_021_animated_layers_content_right > .x_021_animated_layers_txt {
		left: 0px;
		right: 0px;
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    display: block;
    position: relative;
    overflow: hidden;
    padding: 0px 15px;
	}
	#x_021_animated_layers > .carousel-inner > .item > img.bg, #x_021_animated_layers > .carousel-inner > .item > a > img.bg {
    width: 100%;
    margin: auto;
    height: 7000px;
	}
}
@media (max-width: 767px) and (min-width: 420px) {
	.x_021_animated_layers_txt {
	  height: auto;
	}
}
@media only screen and (max-width: 480px) {
	#x_021_animated_layers > .carousel-inner > .item {
    overflow: hidden;
    max-height: 510px;
	}
	.x_021_animated_layers_txt {
    height: auto;
	}
	.x_021_animated_layers_img {
		padding-top: 15px;
    height: auto;
	}
}

/* ------------------------------------------------------------------------------
   Blocks Contact
-------------------------------------------------------------------------------*/
@media screen and (max-width: 992px) {
	.block_contact-item {
	    width: 48%;
	}
	.block_contact-item:nth-child(1) {
	    width: 98%;
	}
}
@media screen and (max-width: 576px) {
	.block_contact-item {
	    width: 96%;
	}
	.block_contact-item:nth-child(1) {
	    width: 94%;

    margin: 35px 3% 20px 3%;
	}
}

/* ------------------------------------------------------------------------------
   Title
-------------------------------------------------------------------------------*/
@media screen and (max-width: 550px) {
	.title h1 {
		font-size: 30px
	}
}

/* ------------------------------------------------------------------------------
   Máquinas
-------------------------------------------------------------------------------*/
@media screen and (max-width: 550px) {
	.hotspots .hotspot .trigger {
	  width: 24px;
	  height: 24px;
	}
	.hotspots .hotspot .trigger i {
	  font-size: 10px;
	}
	.hotspots .hotspot .content figure::before {
	  top: 15px;
	  right: 5px;
	  height: 24px;
	  width: 24px;
	  font-size: 10px;
	}
	.hotspots .hotspot .content figure figcaption {
	  padding: 6px 8px 14px 8px;
	  font-size: 16px;
	}
}
/* ------------------------------------------------------------------------------
   Texto maquinas
-------------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	.info-maquina {
	  flex-direction: column;
	}
	.info-maquina ul:nth-child(1), .info-maquina ul.width-50:nth-child(1) {
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.info-maquina ul:nth-child(2), .info-maquina ul.width-50:nth-child(2) {
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
}

/* ------------------------------------------------------------------------------
   Otra info maquinas
-------------------------------------------------------------------------------*/
@media screen and (max-width: 991px) {
	.otra-info-maquina.ptz div:nth-child(1) {
    width: 50%;
	}
	.otra-info-maquina.ptz div:nth-child(2) {
	  width: 50%;
	} 
	.otra-info-maquina div.txa-mini-medidas img {
	  width: 70%;
	}
	.otra-info-maquina div.txa-mini-top-medidas img {
	  width: 100%;
	}
	.otra-info-maquina-3-columns {
	  flex-direction: column;
	}
	.otra-info-maquina-3-columns div:nth-child(1) {
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.otra-info-maquina-3-columns div:nth-child(1) img {
	  width: 40%;
	  display: block;
	  margin: 0px auto;
	}
	.otra-info-maquina-3-columns div:nth-child(2) {
	  padding-right: 30px;
	  padding-left: 30px;
	  padding-top: 40px;
	  width: 100%;
	} 
	.otra-info-maquina-3-columns div:nth-child(3) {
	  padding-right: 30px;
	  padding-left: 30px;
	  padding-top: 20px;
	  width: 100%;
	}
}
@media screen and (max-width: 768px) {
	.otra-info-maquina.ptz div:nth-child(1) {
    width: 100%;
}
	.otra-info-maquina, .otras-tablas-maquina, .otra-info-maquina-3-columns {
	  flex-direction: column;
	}
	.otra-info-maquina div:nth-child(1) {
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.otra-info-maquina div:nth-child(2) {
		padding-top: 30px;
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.otra-info-maquina div:nth-child(2) img {
		width: 70%;
		display: block;
		margin: 0px auto;
	}
	.otra-info-maquina div.ptz-medida-h img {
	  width: 36%;
	  padding-top: 30px;
	}
	.otra-info-maquina div.txa-mini-medidas img {
	  width: 80%;
	  display: block;
	  margin: 0px auto;
	}
	.otra-info-maquina div.man-roll img {
	  padding-top: 0px;
	}
	.otras-tablas-maquina div:nth-child(1) {
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.otras-tablas-maquina div:nth-child(2) {
  	padding-top: 30px;
	  padding-right: 30px;
	  padding-left: 30px;
	  width: 100%;
	} 
	.otras-tablas-maquina div:nth-child(1) .ptz-otras-tablas {
	  width: 42%;
	  display: block;
	  margin: 0px auto 0px auto;
	}
	.otras-tablas-maquina div:nth-child(2) .ptz-otras-tablas {
	  width: 49%;
	  display: block;
	  margin: 0px auto 0px auto;
	}
	.otra-info-maquina-3-columns div img {
	  width: 100%;
	}
	.otra-info-maquina div.kompakt-montaje img {
	   width: 100%;
	   display: block;
	   margin: 15px auto;
	}
	.otra-info-maquina div.txi-bi-montaje img {
	   width: 70%;
	   display: block;
	   margin: 15px auto 15px auto;
	}
}
@media screen and (max-width: 550px) {
	.otra-info-maquina div.txa-mini-medidas img {
	  width: 92%;
	  display: block;
	  margin: 0px auto;
	}
	.otra-info-maquina div.txi-bi-montaje img {
	   width: 92%;
	}
	.otra-info-maquina-3-columns div:nth-child(1) {
	  padding-right: 0px;
	  padding-left: 0px;
	}
	.otra-info-maquina-3-columns div:nth-child(2), .otra-info-maquina-3-columns div:nth-child(3) {
  	padding-top: 30px;
	  padding-right: 0px;
	  padding-left: 0px;
	  width: 100%;
	} 
	.otra-info-maquina-3-columns div:nth-child(1) img {
	  width: 65%;
	  display: block;
	  margin: 0px auto;
	}
	.otra-info-maquina div.subHeadar p, .otras-tablas-maquina div.subHeadar p, .otra-info-maquina div.subHeadar.columns2 p, .otras-tablas-maquina div.subHeadar.columns2 p, .otra-info-maquina div.line.columns2 p, .otras-tablas-maquina div.line.columns2 p, .otras-tablas-maquina div.line.columns3 p, .ctz div.header.columns7 p, .ctz div.subHeadar p, .ctz div.line.columns7 p {
		font-size: 12px;
	}
}

/* ------------------------------------------------------------------------------
   Tablas
-------------------------------------------------------------------------------*/
@media screen and (max-width: 991px) {
	.otra-info-maquina.ptz div.header {
	  width: 100%;
	}
	.otra-info-maquina.ptz div.subHeadar {
  	width: 100%;
  }
  .otra-info-maquina.ptz div.line {
	  width: 100%;
	}
}
@media screen and (max-width: 768px) {
	.otra-info-maquina.ptz div:nth-child(2) {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .otra-info-maquina div.subHeadar, .otras-tablas-maquina div.subHeadar {
  	padding-top: 0px;
  	padding-left: 0px;
  	padding-right: 0px;
  }
  .otras-tablas-maquina div:nth-child(2) {
    padding-top: 0px;
    padding-right: 0px;
    padding-left: 0px;
    width: 100%;
	}
}



/* ------------------------------------------------------------------------------
   Tablas ok
-------------------------------------------------------------------------------*/
@media screen and (max-width: 991px) {
	.tablas-ctz {
		flex-wrap: wrap;
	}
	.tablas-ctz div.img {
	  width: 50%;
	} 
	.tablas-ctz div.img img {
		display: block;
		margin: 0px auto;
		width: 70%;
	  min-width: 320px;
	}
	.tablas-ctz div.tablas {
	  width: 50%;
  	flex-direction: column;
	} 
	.tablas-ctz div.tablas div.ctz:nth-child(2) {
	  margin-top: 25px;
	}
}
@media screen and (max-width: 768px) {
	.tablas-ptz {
	  flex-direction: column;
	}
	.tablas-ptz p {
		font-size: 12px;
	}
	.tablas-ptz div {
	  width: 100%;
	}
	.tablas-ptz div:nth-child(1) img {
		display: block;
		margin: 30px auto;
		width: 70%;
	  min-width: 320px;
	}
	.tablas-ptz div:nth-child(1) {
	  padding-right: 0px;
	} 
	.tablas-ptz div.header.second {
		margin-top: 30px;
	}
	.tablas-ptz div:nth-child(2) {
	  padding-left: 0px;
	}
	.tablas-ptz div.subHeadar.columns2 p:nth-child(1) {
	  padding-right: 55px;
	}
	.tablas-ptz div.subHeadar.columns2 p:nth-child(2) {
	  padding-right: 65px;
	}
	.tablas-ptz div.line.columns2 p:nth-child(1) {
	  padding-right: 70px;
	}
	.tablas-ptz div.line.columns2 p:nth-child(2) {
	  padding-right: 70px;
	}
	.tablas-ctz {
	  flex-direction: column;
	}
	.tablas-ctz p {
		font-size: 12px;
	}
	.tablas-ctz div.img, .tablas-ctz div.tablas {
	  width: 100%;
	} 
	.tablas-ctz div.img img {
		display: block;
		margin-top: 30px;
		width: 40%;
	}
	.tablas-ctz div.tablas div.ctz {
	  width: 100%;
	  padding-left: 0px;
	} 
	.tablas-ftz {
		margin-right: -30px;
    margin-left: -30px;
	}
	.tablas-ftz p {
		font-size: 12px;
	}
	.tablas-ftz div.header.columns7 p {
	  font-size: 16px;
	}
	.tablas-ftz div.line.columns7 p:nth-child(7) {
	  width: 23%;
	  text-align: right;
	  padding-right: 32px;
	}
	.tablas-ftz.ftz-700 div.line.columns7 p:nth-child(7) {
	  width: 23%;
	  text-align: right;
	  padding-right: 20px;
	}
}

/* ------------------------------------------------------------------------------
   Maquinas
-------------------------------------------------------------------------------*/
@media screen and (max-width: 600px) {	
	.hotspots.ptz .hotspot:nth-child(1) .trigger {
	  top: 20%;
	  left: 70%;
	}
	.hotspots.ptz .hotspot:nth-child(2) .trigger {
	  top: 23%;
	  left: 40%;
	}
}

/* ------------------------------------------------------------------------------
   Distribuidores
-------------------------------------------------------------------------------*/
@media screen and (max-width: 992px) {
	.listDistributors .grid li {
		width: 48%;
	}
	.map {
  	background-position: 43% center;
	}
}
@media screen and (max-width: 625px) {
	.map {
	  height: 300px;
	}
}
@media screen and (max-width: 500px) {
	.listDistributors .grid li {
		width: 96%;
		margin: 2%;
	}
}

a.toggle-menu{
    position: absolute;
    right: 15px;
    width: 40px;
    height: 40px;
    text-align: center;
    font-size: 24px;
    line-height: 40px;
    background-color: #666;
    color: #fff;
    top: 20px;
    cursor: pointer;
}

/* ------------------------------------------------------------------------------
   Contacto
-------------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	#fcontacto div.margen {
	  padding-right: 0px;
	  padding-left: 0px;
	}
	#fcontacto p {
		text-align: justify;
	}
	.contactarCon {
	    display: flex;
	    flex-direction: column;
	    margin-bottom: 30px;
	}
	.contactarCon div {
		margin-bottom: 15px;
	}
}

/* ------------------------------------------------------------------------------
   Quienes somos
-------------------------------------------------------------------------------*/
@media screen and (max-width: 1280px) {
	.left-half {
	  width: 60%;
	}
	.right-half {
	  padding: 50px 50px 50px 50px;
	  width: 40%;
	}
}
@media screen and (max-width: 1024px) {
	.left-half {
	  width: 50%;
	}
	.right-half {
	  width: 50%;
	}
}
@media screen and (max-width: 768px) {
	.quienes-somos {
		flex-direction: column-reverse;
	}
	.left-half {
	  width: 100%;
	  min-height: 400px;
	}
	.right-half {
	  width: 100%;
	  padding: 0px 15px 40px 15px;
	  margin-top: -50px;
	}
}

/* ------------------------------------------------------------------------------
	 Noticias
-------------------------------------------------------------------------------*/
@media screen and (max-width: 992px) {
	.grid li {
		width: 48%;
		margin: 1%;
	}
}
@media screen and (max-width: 400px) {
	.grid li {
		width: 98%;
		margin: 2% 1%;
	}
}
@media screen and (max-width: 550px) {
	#news-list .grid li {
		width: 98%;
		margin: 2% 1%;
	}
}





