
@media (max-height: 348px) {
    .indicators {
        position: absolute;
        top: 50%; /* Coloca los indicadores a la mitad del contenedor */
        right: 20px; /* Ajusta la distancia a la derecha */
        left: auto;  /* Elimina la posición izquierda */
        transform: translateY(-50%); /* Centra verticalmente los indicadores */
        flex-direction: column; /* Los indicadores estarán en columna */
    }
	
	#bannerComponent {
        height: auto;  /* Permite que el alto sea automático para adaptarse al contenido */
        min-height: 348px;  /* Siempre asegúrate de que el banner ocupe al menos la altura del viewport */
    }
}


@media (max-width: 628px){
	.video-container{
		box-shadow: unset;
		padding-bottom: 0px;
	}
	
	.defaultMainCenteredContVideo{
		/*padding-bottom: 2vh;*/
	}
	
}


@media (max-width: 700px){
	.card{
		width: 100% !important;
		margin-bottom: 2vh;
	}
	
	#wwd > article{
		width: 90%;
		margin-left: 5%;
		margin-right: 5%;
		
	}
	
	#wwd > article > hgroup{
		all: unset;
		float: left;
		width: 100%;
		display: block;
		margin: 0px;
		padding: 0px;
		

	}
	
	
}

@media (max-width: 768px) {
	
	#pieContFourDivs{
		display: block; /* Usa flexbox para organizar los elementos en una fila */
		justify-content: unset; /* Espaciado igual entre los elementos */
		

	}

	
	.pieContFourDivsElmts{
		width: 100%;
		padding: 5vh;
	}	
}



@media (max-width: 773px) {
   #impExpCap {
        background-color: #2ca190; /* Cambia el color de fondo */
    }
	
	#impExpCap > section{
		float: left;
		width: 100%;
		background-color: #2ca190;
	}

    #impExpProdsMainCont  {
        margin-top: 0px; /* Ajuste superior */
        margin-bottom: 30px; /* Ajuste inferior */
        position: relative; /* Ahora se sitúa debajo */
		padding-top: 0px;
		background-color: #2ca190;
		padding-bottom: 2vh;
    }
	
	#impExpProdsMainCont_2, #impExpProdsMainCont_3{
		padding-top: 0px;
	}
	
	#impExpProdsMainCont_3{
		width: 100%;
	}

    #impExpProdsSubcont {
        width: 97%; /* Se mantiene en 97% */
        position: relative; /* Vuelve a flujo normal */
        margin-top: 0px !important; /* Separación ajustada */
		filter: drop-shadow(0.5vh 0.5vh 0.6vh rgba(0, 0, 0, 0.0));
    }
	
	#divContGasjet_10{
		width: 97%;
	}
	
	#impExpProdsSubcont2 {
		width: unset;
        width: 100%; /* Se mantiene en 97% */
        position: relative; /* Vuelve a flujo normal */
        margin-top: 0px !important; /* Separación ajustada */
		filter: drop-shadow(0.5vh 0.5vh 0.6vh rgba(0, 0, 0, 0.0));
    }

    .impExpProdElm, .impExpProdElm2 {
        width: 100%; /* Elementos ocupan todo el ancho */
		padding: 50px 20px; 
		padding-top: 19px;
    }
	
	.impExpProdElm > div{
		width: 90%;
	}
	
	.impExpProdElm2 > div{
		width: 90%;
	}

    #impExpProdElm_1,
    #impExpProdElm_2,
    #impExpProdElm_3, 
	 #impExpProdElm_4,
	#impExpProdElm_5,
    #impExpProdElm_6,
    #impExpProdElm_7, 
	 #impExpProdElm_8,
	#impExpProdElm_9,
	#impExpProdElm_10,
	#impExpProdElm_11,
	#impExpProdElm_12{
        border-right: none; /* Quita el borde derecho */
        border-bottom: 1px outset rgba(195,195,195,0.40); /* Añade borde inferior */
		
    }
	
	#impExpCapLeft{
		width: 100%;
		

	}

	#impExpCapRight{
		width: 100%;
	}
	
	
	
	.impExpProdElm > h2{
		min-height: unset;
	}
	
	.impExpProdElm2 > h2{
		min-height: unset;
	}
	
	#certifCont > h1{
		margin-top: 3vh;
		font-size: 1.65rem;
	}
	
	#wwd > h2{
		font-size: 0.8rem;
	}
	
	#wwd > h1{
		font-size: 1.65rem;
	}
	
	
}


@media (max-width: 780px) {
    #bannerComponent {
        height: auto;  /* Permite que el alto sea automático para adaptarse al contenido */
        min-height: 100vh;  /* Siempre asegúrate de que el banner ocupe al menos la altura del viewport */
    }

    .content {
        width: 80%;     /* Ajusta el tamaño del contenido */
        top: 10vh;      /* Ajusta la posición superior en pantallas más pequeñas */
    }
	
	 .indicators {
        bottom: 10px; /* Ajusta la posición de los indicadores en pantallas más pequeñas */
    }
	
	#impExpCap > section{
		width: 100% !important;
		background-color: #2ca190;
		
		display: block; /* Activa flexbox */
		float: left;
    flex-wrap: unset;
		
	}
	
	#impExpCapLeft{
		width: 100% !important;
	}
	
	#impExpCapRight{
		width: 100% !important;
	}
	
	.video-container{
		background-color: #3FBFAC;
		
	}
	
	.defaultMainCenteredContVideo{
		background-color: #3FBFAC;
		padding-top: 2vh;
	}
	
	
	#impExpProdsMainCont_1 { /* xx  */
		padding-top: 1vh;
		background-color: #ffffff;
	}

	.defaultMainCenteredContLangVideo{
		background-color: #3FBFAC;
		padding-bottom: 1vh;
	}
	
	#impExpCapLeft > h1{
		width: 100%;
		font-size: 4vh !important;
		text-align: center;
		font-weight: bold!important;
		margin-left: unset;
	margin-top: 3vh;
	margin-bottom: unset;
		
		
	}
	
	#impExpCapRight > h1{
		width: 100%;
		color:  #ffffff;
		margin-top: 1.7vh;
		margin-left: unset;
	}
	
	#impExpCap > section{
		
	}
	
	#impExpProdsMainCont_3{
		background-color: #ffffff;
		padding-bottom: 5px;
	}
	
	.language-conte-bar > div > img{
		border: solid 1px rgba(255,255,255,1.00);
	}
	
	.language-conte-bar > div > label{
		color: #ffffff;
	}
	
	
}


@media (max-width: 1202px){
	#upInfSubCont{
		width: 85%;
	}
}


@media (max-width: 1043px){
	#upInfSubCont{
		width: 92%;
	}
}


@media (max-width: 901px){
	#upInfSubCont > div{
		width: 100%;
	}
	
	#medMapSubCont > img{
		width: 90%;
	}
}


@media (max-width: 981px){
	#upInfSubCont{
		width: 97.5%;
	}
}

@media (max-width: 996px){
	#impExpCapLeft > h1{
		
		font-size: 3rem;
	}
}

@media (max-width: 1032px){
	.card{
		width: 48%;
	}
}

@media (max-width: 1104px){
	.pieContFourDivsElmts > label{
		text-align: center;
	}
}


@media (max-width: 1275px) {
    #impExpProdsSubcont {
        width: 97%; /* Cambia el ancho del subcontenedor */
    }
	
	#divContGasjet_10{
		width: 97%;
	}
	
	#impExpProdsSubcont2 {
        width: 75%; /* Cambia el ancho del subcontenedor */
    }
	
	
	
}
