

/* TABLETS */
@media all and (max-width: 959px) and (min-width: 480px) {

	.SectionCabecera {
		max-width:100%;
	}

/*/////////////////////////////////////////////////////////////////////////

ESTILOS PARA LOS ELEMENTOS DEL LOCUTORIO GORRITI */

	.PositionSticky {
		margin-top:-30px !important;
	}
	#Div2, #Div3, #Div5 {
		font-size:18px;
	}
	.DivBandera img {
		width:80%;
		height:100%;
	}
	.SeccionCuerpo .ArticlePagina1 {
		height:43vh;
		height:63vh;
		height:auto;
	}

	.SeccionCabecera .ArticleImgLogo {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap:0;
		place-items: center;
		height:16vh;
		height:18vh;

		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		-ms-border-radius: 15px;
		-o-border-radius: 15px;
		border-radius: 15px;

		box-shadow: 0 0 10px white;
		padding:15px 0 20px;
	}

	.SeccionCabecera .ArticleImgLogo .DivLogoParte1 {
		grid-area: 1 / 1 / 2 / 101;
		width:90vw;
		height:5vh;
		background-image:url(/Img/Titulos/Nombre-Empresa-Locutorio.png);
		background-repeat:no-repeat;
		background-size:55%;
		background-position:center;
	}
	
	.SeccionCabecera .ArticleImgLogo .DivLogoParte2 {
		display:inline-block;
		grid-area: 2 / 1 / 3 / 101;
		width:90vw;
		height:5vh;
		background-image:url(/Img/Titulos/Nombre-Empresa-Gorriti.png);
		background-repeat:no-repeat;
		background-size:75%;
		background-size:75%;
		background-position:center;
	}

	.SeccionCabecera .ArticleImgLogo .DivLogoParte3 {
		grid-area: 3 / 1 / 4 / 101;
		display:block;
	}
	
	.SeccionCabecera .ArticleMenuCabecera {
		display:none;  /*DEI*/
	}

	.SeccionCuerpo .ArticlePagina1 .DivContenedorCielo {
		height:30vh;
	}

	.ArticlePagina1 .DivCTA_Llamar, 
	.ArticlePagina1 .DivCTA_Whatsapp {
		display:inline-block;
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap:0;
		height:13vh;
	}

	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios Div {
		background-size:100%;
		background-position:center;
		background-repeat:no-repeat;
		height:6vh;
	}

	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivWestern {
		grid-area: 1 / 1 / 2 / 2;
		background-image:url(/Img/Logos/Western.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivRia {
		grid-area: 1 / 2 / 2 / 3;
		background-image:url(/Img/Logos/Ria.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivFast {
		grid-area: 2 / 1 / 3 / 2;
		background-image:url(/Img/Logos/TransFast.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivITransfer {
		grid-area: 2 / 2 / 3 / 3;
		background-image:url(/Img/Logos/I-Transfer2.jpg);
	}
	
	.DivTituloServicios, .DivTituloContacto {
		background-size:45vh;
		height:5vh;
	}

	.SeccionCuerpo .ArticlePagina2 {
		height:58vh;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
		padding-top:15px;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios {
		height:50vh;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios div {
		background-size:20vh;
	}

	.ArticlePagina2 .DivServicios div:nth-child(2n+1) {
		height:3vh;
	}
	
	.ArticlePagina2 .DivServicios div:nth-child(2n+2) {
		height:15vh;
	}

	.DivServicios div p {
		margin-top:7px;
		font-size:13px;
	}

	.DivTitServiciosPagos {
		grid-area: 1 / 1 / 2 / 2;
	}
	.DivServiciosPagos {
		grid-area: 2 / 1 / 3 / 2;
	}	
	.DivTitServiciosRecargasMoviles {
		grid-area: 1 / 2 / 2 / 3;
	}
	.DivServiciosRecargasMoviles {
		grid-area: 2 / 2 / 3 / 3;
	}
	
	.DivTitServiciosRecargasBus {
		grid-area: 3 / 1 / 4 / 2;
	}
	.DivServiciosRecargasBus {
		grid-area: 4 / 1 / 5 / 2;
	}	
	.DivTitServiciosFotocopias {
		grid-area: 3 / 2 / 4 / 3;
	}
	.DivServiciosFotocopias {
		grid-area: 4 / 2 / 5 / 3;
	}
	
	.DivTitServiciosLatinos {
		grid-area: 5 / 1 / 6 / 2;
	}
	.DivServiciosLatinos {
		grid-area: 6 / 1 / 7 / 2;
	}	
	.DivTitServiciosOtros {
		grid-area: 5 / 2 / 6 / 3;
	}
	.DivServiciosOtros {
		grid-area: 6 / 2 / 7 / 3;
	}

	.SeccionCuerpo .ArticlePagina3 .DivContacto {
		grid-template-columns: repeat(1, 1fr);
	}

	.ArticlePagina3 .DivContacto .DivTitAgencia1 {
		grid-area: 1 / 1 / 2 / 2;
		height:4vh;
		font-size:15px;
		padding-top:7px;
	}
	
	.ArticlePagina3 .DivContacto .DivImgFachada {
		grid-area: 2 / 1 / 3 / 2;
		height:auto;
		text-align:right;
	}

	.ArticlePagina3 .DivContacto .DivDatosContacto {
		grid-area: 3 / 1 / 4 / 2;
		text-align:center;
	}
	
	.ArticlePagina3 .DivContacto .DivMapa {
		grid-area: 4 / 1 / 5 / 2;
		height:auto !important;
		text-align:left;
	}

	.ArticlePagina3 .DivContacto .DivTitAgencia2 {
		grid-area: 5 / 1 / 6 / 2;
		height:4vh;
		font-size:15px;
		padding-top:7px;
	}

	.ArticlePagina3 .DivContacto .DivImgFachadaAgencia2 {
		grid-area: 6 / 1 / 7 / 2;
		height:auto;
		text-align:right;
	}

	.ArticlePagina3 .DivContacto .DivDatosContactoAgencia2 {
		grid-area: 7 / 1 / 8 / 2;
		text-align:center;
	}
	
	.ArticlePagina3 .DivContacto .DivMapaAgencia2 {
		grid-area: 8 / 1 / 9 / 2;
		height:auto !important;
		text-align:left;
	}

	.ArticlePagina3 .DivContacto p {
		font-size:17px;
		line-height:20px;
	}

	.SeccionCuerpo .DivNovedades {
		bottom:2vh;
		right:2vw;
		display:inline-block;
		padding:5px;
		line-height:3vh;
		min-height:1vh !important;
		width:90vw !important;
		height:auto;
		background-blend-mode: lighten;
		background-color:rgb(255,255,255, 0.8); /* Define la opacidad de la imagen de fondo. Sólo funciona con background-blend-mode: lighten;  */
	}

	.SeccionCuerpo .DivNovedades p {
		margin:0 !important; /* DEI */
		font-size:16px;
	}

	.DivPagFormNovedades .DivNovedades {
		bottom:2vh;
		right:2vw;
		display:inline-block;
		padding:10px;
		padding:5px;
		width:90vw !important;
		height:auto;
	}

	.DivPagFormNovedades .DivNovedades p {
		margin:0 !important; /* DEI */
		font-size:16px;
	}

	#DivPagPanelNovedades {
		min-width:95vw;
		width:95vw;
	}
	
/* ***************************************************************************************** */

.DivCamposNovedades {
	margin-top: 4vh !important;
	margin-left: 3vw !important;
}

.DivItemNovedad {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  grid-template-rows: repeat(2, auto);
	column-gap:0vw;
	margin-bottom:0px;
	max-width:78vw;
	width:78vw;
	align-items:center; /* Si no funciona la anterior. Funciona en Grid y en Flex. Comprobado */
	justify-content: center;/* Debe ir en el contenedor. Alinea horizontalmente los items del contenedor. Seleccionar entre start center o end. Funciona en Grid y en Flex. Comprobado */

/* Otra forma es poniendo en el Grid, para que centre vertical y horizontalmente  */
	place-items: center; /* Esto centra el planeta vertical y horizontalmente */
}

.DivItemNovedad div:not(#DivTextoNovedad) {
	max-width:25vw;
	width:25vw;
}

.DivItemNovedad input:not(#TbTextoNovedad) {
	padding:10px 10px 2px;
	max-width:95%;
	height:auto;
	min-height:6vh;
	font-size:12px;
	text-align:center;
}

.DivItemNovedad .SpanPlaceholder {
	font-size:10px;
}

.DivItemNovedad p {
	margin:0;
}

.DivTextoNovedad {
	grid-area: 1 / 1 / 2 / 10 !important; /*DEI*/
	grid-area: 1 / 1 / auto / 10 !important; /*DEI*/
	max-width:78vw;
	width:78vw;
}

.DivFechaDesde {
	grid-area: 2 / 1 / 3 / 4 !important; /*DEI*/
	grid-area: 2 / 2 / 3 / 5 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivFechaHasta {
	grid-area: 2 / 4 / 3 / 7 !important; /*DEI*/
	grid-area: 2 / 5 / 3 / 8 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivFechaCreacion {
	grid-area: 2 / 7 / 3 / 10 !important; /*DEI*/
	grid-area: 2 / 8 / 3 / 9 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivBotonesNovedades {
	display:grid;
  grid-template-columns: repeat(18, 1fr);
	margin:0 auto !important;
	min-width:80vw;
	max-width:80vw;
	width:100%;
	text-align:center;
	place-items: center; /* Esto centra el planeta vertical y horizontalmente */
}

.DivBotonesNovedades div {
	width:100%;
}

.DivBotonModificar {
	grid-area: 1 / 1 / 2 / 10;
}

.DivBotonEliminar {
	grid-area: 1 / 10 / 2 / 16;
}

.DivCheckEliminar {
	grid-area: 1 / 16 / 2 / 18;
}

.DivCheckEliminar input[type="checkbox"] {
	width:4vw;
}

hr {
	margin:2vh auto 4vh;
	max-width:77vw;
	width:77vw;
}

.DivPubliTasas {
	display:none; /* En móvil no se muestra esa imagen, porque satura mucho la portada */
}

.SeccionPie {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(1, 5vh);
	column-gap:10px;
}

.SeccionPie div {
	padding-top:1.6vh;
	font-family:Philosopher;
	font-size:10px;
	font-weight:bold;
	color:white;
	text-align:center;
}

.SeccionPie div a {
	color:white;
}

.SeccionPie div p {
	padding: 0px 0px;
}

/* *****************************************************************************************	*/


@keyframes resplandorOscilante {
    0% {
        box-shadow: 0 0 5px 5px white;
    }
    50% {
        box-shadow: 0 0 10px 4px white;
    }
    100% {
        box-shadow: 0 0 5px 5px white;
    }
}

/* CSS PARA LO RELACIONADO CON EL CIELO */

	.DivCielo div[class*='moon'] img {
		width: 15%;
	}
	
	@keyframes revolve {
		0% {
			--angle: 0deg;
			--z: 0;
			transform: scale(0.5);
		}
		25% {
			--angle: 90deg;
			--z: -1;
			transform: scale(0.25);
		}
		50% {
			--angle: 176deg;
			--z: -1;
			transform: scale(0.45);
		}
		55% {
			--angle: 180deg;
			--z: 5;
			transform: scale(0.5); /* Luna mediana cuando está en el extremo izquierdo */
		}
		75% {
			--angle: 270deg;
			--z: 10;
			transform: scale(0.75);
		}
		100% {
			--angle: 360deg;
			--z: 0;
			transform: scale(0.5);
		}
	}

	.planet {
		grid-area: 1 / 1;
		width:60%;
		padding: 10px;
		text-align: center;
		transform: none; /* Asegúrate de no tener transformaciones que lo desplacen */
	}	

	.planet img {
		width: 50px;
		width: 100%;
	}

	div[class*='moon'] img {
		width: 50px;
		width: 20%;
	}	

  .moon, .moon2, .moon3, .moon4, .moon5,
  .moon6, .moon7, .moon8, .moon9, .moon10,
  .moon11, .moon12, .moon13, .moon14, .moon15,
  .moon16, .moon17, .moon18, .moon19, .moon20 {
    --x-amplitude: calc(600px * 0.25); /* Reduce al 70% del valor original */
    --y-amplitude: calc(140px * 0.25); /* Reduce al 70% del valor original */
		translate: calc(var(--x) + 83px) var(--y); /* Desplazamos 200px a la derecha */
  }


/* FIN DE ESTILOS PARA LOS ELEMENTOS XXXXXXXXXXXX

////////////////////////////////////////////////////////////////////////// */

}

/* MÓVILES */
@media all and (max-width: 479px) and (min-width: 320px) {

	.SectionCabecera {
		max-width:100%;
	}

/*/////////////////////////////////////////////////////////////////////////

ESTILOS PARA LOS ELEMENTOS DEL LOCUTORIO GORRITI */

	.PositionSticky {
		margin-top:-30px !important;
	}
	#Div2, #Div3, #Div5 {
		font-size:18px;
	}
	.DivBandera img {
		width:80%;
		height:100%;
	}
	.SeccionCuerpo .ArticlePagina1 {
		height:auto;
	}

	.SeccionCabecera .ArticleImgLogo {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap:0;
		place-items: center;
		height:16vh;
		height:18vh;

		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		-ms-border-radius: 15px;
		-o-border-radius: 15px;
		border-radius: 15px;

		box-shadow: 0 0 10px white;
		padding:15px 0 20px;
	}

	.SeccionCabecera .ArticleImgLogo .DivLogoParte1 {
		grid-area: 1 / 1 / 2 / 101;
		width:90vw;
		height:5vh;
		background-image:url(/Img/Titulos/Nombre-Empresa-Locutorio.png);
		background-repeat:no-repeat;
		background-size:55%;
		background-position:center;
	}
	
	.SeccionCabecera .ArticleImgLogo .DivLogoParte2 {
		display:inline-block;
		grid-area: 2 / 1 / 3 / 101;
		width:90vw;
		height:5vh;
		background-image:url(/Img/Titulos/Nombre-Empresa-Gorriti.png);
		background-repeat:no-repeat;
		background-size:75%;
		background-size:75%;
		background-position:center;
	}

	.SeccionCabecera .ArticleImgLogo .DivLogoParte3 {
		grid-area: 3 / 1 / 4 / 101;
		display:block;
	}
	
	.SeccionCabecera .ArticleMenuCabecera {
		display:none;  /*DEI*/
	}

	.SeccionCuerpo .ArticlePagina1 .DivContenedorCielo {
		height:30vh;
	}

	.ArticlePagina1 .DivCTA_Llamar, 
	.ArticlePagina1 .DivCTA_Whatsapp {
		display:inline-block;
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap:0;
		height:13vh;
	}

	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios Div {
		background-size:100%;
		background-position:center;
		background-repeat:no-repeat;
		height:6vh;
	}

	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivWestern {
		grid-area: 1 / 1 / 2 / 2;
		background-image:url(/Img/Logos/Western.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivRia {
		grid-area: 1 / 2 / 2 / 3;
		background-image:url(/Img/Logos/Ria.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivFast {
		grid-area: 2 / 1 / 3 / 2;
		background-image:url(/Img/Logos/TransFast.jpg);
	}
	
	.SeccionCuerpo .ArticlePagina1 .DivLogosEmpresasEnvios .DivITransfer {
		grid-area: 2 / 2 / 3 / 3;
		background-image:url(/Img/Logos/I-Transfer2.jpg);
	}
	
	.DivTituloServicios, .DivTituloContacto {
		background-size:45vh;
		height:5vh;
	}

	.SeccionCuerpo .ArticlePagina2 {
		height:58vh;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
		padding-top:15px;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios {
		height:50vh;
	}

	.SeccionCuerpo .ArticlePagina2 .DivServicios div {
		background-size:20vh;
	}

	.ArticlePagina2 .DivServicios div:nth-child(2n+1) {
		height:3vh;
	}
	
	.ArticlePagina2 .DivServicios div:nth-child(2n+2) {
		height:15vh;
	}

	.DivServicios div p {
		margin-top:7px;
		font-size:13px;
	}

	.DivTitServiciosPagos {
		grid-area: 1 / 1 / 2 / 2;
	}
	.DivServiciosPagos {
		grid-area: 2 / 1 / 3 / 2;
	}	
	.DivTitServiciosRecargasMoviles {
		grid-area: 1 / 2 / 2 / 3;
	}
	.DivServiciosRecargasMoviles {
		grid-area: 2 / 2 / 3 / 3;
	}
	
	.DivTitServiciosRecargasBus {
		grid-area: 3 / 1 / 4 / 2;
	}
	.DivServiciosRecargasBus {
		grid-area: 4 / 1 / 5 / 2;
	}	
	.DivTitServiciosFotocopias {
		grid-area: 3 / 2 / 4 / 3;
	}
	.DivServiciosFotocopias {
		grid-area: 4 / 2 / 5 / 3;
	}
	
	.DivTitServiciosLatinos {
		grid-area: 5 / 1 / 6 / 2;
	}
	.DivServiciosLatinos {
		grid-area: 6 / 1 / 7 / 2;
	}	
	.DivTitServiciosOtros {
		grid-area: 5 / 2 / 6 / 3;
	}
	.DivServiciosOtros {
		grid-area: 6 / 2 / 7 / 3;
	}

	.SeccionCuerpo .ArticlePagina3 .DivContacto {
		grid-template-columns: repeat(1, 1fr);
	}

	.ArticlePagina3 .DivContacto .DivTitAgencia1 {
		grid-area: 1 / 1 / 2 / 2;
		height:4vh;
		font-size:15px;
		padding-top:7px;
	}
	
	.ArticlePagina3 .DivContacto .DivImgFachada {
		grid-area: 2 / 1 / 3 / 2;
		height:auto;
		text-align:right;
	}

	.ArticlePagina3 .DivContacto .DivDatosContacto {
		grid-area: 3 / 1 / 4 / 2;
		text-align:center;
	}
	
	.ArticlePagina3 .DivContacto .DivMapa {
		grid-area: 4 / 1 / 5 / 2;
		height:auto !important;
		text-align:left;
	}

	.ArticlePagina3 .DivContacto .DivTitAgencia2 {
		grid-area: 5 / 1 / 6 / 2;
		height:4vh;
		font-size:15px;
		padding-top:7px;
	}

	.ArticlePagina3 .DivContacto .DivImgFachadaAgencia2 {
		grid-area: 6 / 1 / 7 / 2;
		height:auto;
		text-align:right;
	}

	.ArticlePagina3 .DivContacto .DivDatosContactoAgencia2 {
		grid-area: 7 / 1 / 8 / 2;
		text-align:center;
	}
	
	.ArticlePagina3 .DivContacto .DivMapaAgencia2 {
		grid-area: 8 / 1 / 9 / 2;
		height:auto !important;
		text-align:left;
	}

	.ArticlePagina3 .DivContacto p {
		font-size:17px;
		line-height:20px;
	}

	.SeccionCuerpo .DivNovedades {
		bottom:2vh;
		right:2vw;
		display:inline-block;
		padding:5px;
		line-height:3vh;
		min-height:1vh !important;
		width:90vw !important;
		height:auto;
		background-blend-mode: lighten;
		background-color:rgb(255,255,255, 0.8); /* Define la opacidad de la imagen de fondo. Sólo funciona con background-blend-mode: lighten;  */
	}

	.SeccionCuerpo .DivNovedades p {
		margin:0 !important; /* DEI */
		font-size:16px;
	}

	.DivPagFormNovedades .DivNovedades {
		bottom:2vh;
		right:2vw;
		display:inline-block;
		padding:10px;
		padding:5px;
		width:90vw !important;
		height:auto;
	}

	.DivPagFormNovedades .DivNovedades p {
		margin:0 !important; /* DEI */
		font-size:16px;
	}

	#DivPagPanelNovedades {
		min-width:95vw;
		width:95vw;
	}
	
/* ***************************************************************************************** */

.DivCamposNovedades {
	margin-top: 4vh !important;
	margin-left: 3vw !important;
}

.DivItemNovedad {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  grid-template-rows: repeat(2, auto);
	column-gap:0vw;
	margin-bottom:0px;
	max-width:78vw;
	width:78vw;
	align-items:center; /* Si no funciona la anterior. Funciona en Grid y en Flex. Comprobado */
	justify-content: center;/* Debe ir en el contenedor. Alinea horizontalmente los items del contenedor. Seleccionar entre start center o end. Funciona en Grid y en Flex. Comprobado */

/* Otra forma es poniendo en el Grid, para que centre vertical y horizontalmente  */
	place-items: center; /* Esto centra el planeta vertical y horizontalmente */
}

.DivItemNovedad div:not(#DivTextoNovedad) {
	max-width:25vw;
	width:25vw;
}

.DivItemNovedad input:not(#TbTextoNovedad) {
	padding:10px 10px 2px;
	max-width:95%;
	height:auto;
	min-height:6vh;
	font-size:12px;
	text-align:center;
}

.DivItemNovedad .SpanPlaceholder {
	font-size:10px;
}

.DivItemNovedad p {
	margin:0;
}

.DivTextoNovedad {
	grid-area: 1 / 1 / 2 / 10 !important; /*DEI*/
	grid-area: 1 / 1 / auto / 10 !important; /*DEI*/
	max-width:78vw;
	width:78vw;
}

.DivFechaDesde {
	grid-area: 2 / 1 / 3 / 4 !important; /*DEI*/
	grid-area: 2 / 2 / 3 / 5 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivFechaHasta {
	grid-area: 2 / 4 / 3 / 7 !important; /*DEI*/
	grid-area: 2 / 5 / 3 / 8 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivFechaCreacion {
	grid-area: 2 / 7 / 3 / 10 !important; /*DEI*/
	grid-area: 2 / 8 / 3 / 9 !important; /*DEI*/
	max-width:20vw;
	width:20vw;
}

.DivBotonesNovedades {
	display:grid;
  grid-template-columns: repeat(18, 1fr);
	margin:0 auto !important;
	min-width:80vw;
	max-width:80vw;
	width:100%;
	text-align:center;
	place-items: center; /* Esto centra el planeta vertical y horizontalmente */
}

.DivBotonesNovedades div {
	width:100%;
}

.DivBotonModificar {
	grid-area: 1 / 1 / 2 / 10;
}

.DivBotonEliminar {
	grid-area: 1 / 10 / 2 / 16;
}

.DivCheckEliminar {
	grid-area: 1 / 16 / 2 / 18;
}

.DivCheckEliminar input[type="checkbox"] {
	width:4vw;
}

hr {
	margin:2vh auto 4vh;
	max-width:77vw;
	width:77vw;
}

.DivPubliTasas {
	display:none; /* En móvil no se muestra esa imagen, porque satura mucho la portada */
}

.SeccionPie {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(1, 5vh);
	column-gap:10px;
}

.SeccionPie div {
	padding-top:1.6vh;
	font-family:Philosopher;
	font-size:10px;
	font-weight:bold;
	color:white;
	text-align:center;
}

.SeccionPie div a {
	color:white;
}

.SeccionPie div p {
	padding: 0px 0px;
}

.DivPais, .DivCambio, .DivCambioB {
	display:inline-block;
	width:30%;
}
.DivCambio {
	margin:0 3px;
}
.DivCampos {
	width:95% !important; /* DEI */
}

/* *****************************************************************************************	*/


@keyframes resplandorOscilante {
    0% {
        box-shadow: 0 0 5px 5px white;
    }
    50% {
        box-shadow: 0 0 10px 4px white;
    }
    100% {
        box-shadow: 0 0 5px 5px white;
    }
}

/* CSS PARA LO RELACIONADO CON EL CIELO */

	.DivCielo div[class*='moon'] img {
		width: 15%;
	}
	
	@keyframes revolve {
		0% {
			--angle: 0deg;
			--z: 0;
			transform: scale(0.5);
		}
		25% {
			--angle: 90deg;
			--z: -1;
			transform: scale(0.25);
		}
		50% {
			--angle: 176deg;
			--z: -1;
			transform: scale(0.45);
		}
		55% {
			--angle: 180deg;
			--z: 5;
			transform: scale(0.5); /* Luna mediana cuando está en el extremo izquierdo */
		}
		75% {
			--angle: 270deg;
			--z: 10;
			transform: scale(0.75);
		}
		100% {
			--angle: 360deg;
			--z: 0;
			transform: scale(0.5);
		}
	}

	.planet {
		grid-area: 1 / 1;
		width:60%;
		padding: 10px;
		text-align: center;
		transform: none; /* Asegúrate de no tener transformaciones que lo desplacen */
	}	

	.planet img {
		width: 50px;
		width: 100%;
	}

	div[class*='moon'] img {
		width: 50px;
		width: 20%;
	}	

  .moon, .moon2, .moon3, .moon4, .moon5,
  .moon6, .moon7, .moon8, .moon9, .moon10,
  .moon11, .moon12, .moon13, .moon14, .moon15,
  .moon16, .moon17, .moon18, .moon19, .moon20 {
    --x-amplitude: calc(600px * 0.25); /* Reduce al 70% del valor original */
    --y-amplitude: calc(140px * 0.25); /* Reduce al 70% del valor original */
		translate: calc(var(--x) + 83px) var(--y); /* Desplazamos 200px a la derecha */
  }


/* FIN DE ESTILOS PARA LOS ELEMENTOS XXXXXXXXXXXX

////////////////////////////////////////////////////////////////////////// */

}	