@import url('https://css.rtve.es/css/rtve.2026/rtve.alertas/rtve.rtveplay-portadas.alert.desktp.css');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap');

.rtveAlert.countDown.eclipse-solar picture {display: none;}
.rtveAlert .ico.close {position:absolute;right: 0;padding: 1rem;top: -0.6rem;}
body.rtveplay.portada .rtveAlert.countDown.eclipse-solar .ico.close {right: 1.6rem;}
.rtveAlert .ico.close .rtve-icons {width:2.5rem;height:2.5rem;display:block;padding-top:4rem;background: url('https://css.rtve.es/css/rtve.2021/i/rtve-icons.svg/rtve-icon_close.svg') no-repeat 50% 0;font-size:1.3rem;display:flex;justify-content:center;letter-spacing:0.25pt;color:transparent;transition:color 0.3s;cursor:pointer;}

.container[data-tipo="mod_htmlLibre"]:has(.rtveAlert) {z-index:2}

body.rtve .rtveAlert.countDown.eclipse-solar.ghost, body.rtveplay.portada .rtveAlert.countDown.eclipse-solar.ghost {height: 0;padding: 0;}
body.rtveplay:has(#mainNav .blindBox.be_on) .rtveAlert.countDown.eclipse-solar {z-index: -1;opacity: 0;}
body.rtveplay .container[data-tipo="mod_htmlLibre"]:has(.rtveAlert) > section .rowContainer:only-child {padding-top:0}
body.rtve .rtveAlert.countDown.eclipse-solar,body.rtveplay.portada .rtveAlert.countDown.eclipse-solar {width:100%;overflow: hidden;height:10rem;background: #000;padding:0.8rem 0 1.2rem 0;background: url('https://css.rtve.es/css/rtve.2026/rtve.alertas/i/eclipse-solar/img_desktop_main.png') no-repeat #000;background-position:50% 50%;position: relative;background-size: contain;}

body.rtve .rtveAlert.countDown.eclipse-solar .container ,body.rtveplay.portada .rtveAlert.countDown.eclipse-solar .container{position:static;display: flex;align-items: center;justify-content: space-between;}

.rtveAlert.countDown.eclipse-solar .container:not(:has(.CountDown)) .txtBox p.txt.claim { display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 2.2rem; top: 1.5rem; right: 6%;letter-spacing: normal; text-transform: uppercase;}
.rtveAlert.countDown.eclipse-solar .container:not(:has(.CountDown)) .txtBox p.txt.claim .rtve-icons.rtveplay { height: 1em; width: 3.5em; }
.rtveAlert.countDown.eclipse-solar:not(:has(.container .CountDown)) { background-position: 47% 50% !important; }
.rtveAlert.countDown.eclipse-solar .txtBox {display: flex;flex-flow: column;position: relative;flex: 1;gap: 1rem;}
.rtveAlert.countDown.eclipse-solar .txtBox p {font-size: 1.6rem;line-height: 2.8rem;color: #fff;font-weight: 300;}
.rtveAlert.countDown.eclipse-solar .txtBox p.txt {position: absolute;right: -27.3%;top: 6rem;}
.rtveAlert.countDown.eclipse-solar .txtBox p.txt .sub-light.br {display: none;}
.rtveAlert.countDown.eclipse-solar .txtBox p .medium {font-weight: 500;}
.rtveAlert.countDown.eclipse-solar .txtBox p .bold {font-weight: 600;}
.rtveAlert.countDown.eclipse-solar .txtBox p .uppercase { text-transform: uppercase; }
.rtveAlert.countDown.eclipse-solar .container .auxBox {margin: 0;position: relative;left: -2rem;top: -0.5rem;}

.rtveAlert.countDown.eclipse-solar .txtBox h2 .black {font-weight: 900;}
.rtveAlert.countDown.eclipse-solar h2 {font-size:2rem;width:41rem;height:7.8rem;color:#fff;text-transform: uppercase;letter-spacing: 1.4rem;line-height: 1.3;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.rtveAlert.countDown.eclipse-solar .txtBox h2 .sub-light {font-weight: 300;font-size: 2rem;letter-spacing: 1.2rem;text-transform: uppercase;text-align: center;}
.rtveAlert.countDown.eclipse-solar .txtBox h2 .sub-light.hidden { position: relative; width: auto; height: auto; overflow: visible; visibility: visible; }
.rtveAlert.countDown.eclipse-solar .txtBox h2 .sub-light .br { display: block; display:none}


.rtveAlert.countDown.eclipse-solar .rtve-icons.rtveplay {color: transparent;background: url('https://css.rtve.es/css/rtve.2021/i/rtve-logos/logo_rtveplay_2025_ffffff.svg') no-repeat;height: 2.2rem;display: inline-block;width: 7.8rem;position: relative;top: 0.3rem;margin-left: 0.3rem;}
.rtveAlert.countDown.eclipse-solar .rtve-icons.la-1 {color: transparent;background: url('https://css.rtve.es/css/rtve.directos/logos_cadenas/tv-la1_nac.svg') no-repeat;height: 1.7rem;display: inline-block;width: 1rem;position: relative;top: 0.4rem;}

body.rtveplay.portada .rtveAlert.countDown.eclipse-solar .container:not(:has(.CountDown)) .txtBox p.txt.claim { right: 8%; }
body.rtveplay.portada .rtveAlert.countDown.eclipse-solar:not(:has(.container .CountDown)) { background-position: 45% 50% !important; }

/*boton*/
.rtveAlert.countDown.eclipse-solar .buttonBox {margin-top: -1.1rem;}
.rtveAlert.countDown.eclipse-solar .buttonBox a { padding: 0.8rem 2.2rem; border: 0.1rem solid #fff; border-radius: 0.4rem; font-size: 1.2rem; line-height: 2rem; font-weight: 300; text-transform: uppercase; letter-spacing: 0.5pt; color: #fff;transition: all 0.2s;}
.rtveAlert.countDown.eclipse-solar .buttonBox a:hover {color: #000;background: #fff;}

/* countdown */
.rtveAlert.countDown.eclipse-solar .CountDown{margin:0;}
.rtveAlert.countDown.eclipse-solar .CountDown,.rtveAlert .CountDown p {display: flex;flex-flow: row;text-align: center;gap: 1.6rem;}
.rtveAlert.countDown.eclipse-solar .CountDown * {font-size: 3.2rem;line-height:2.5rem;color:#fff;font-weight:900;text-decoration: none;font-style: normal;font-family: "Montserrat", sans-serif;}
.rtveAlert.countDown.eclipse-solar .CountDown span{display: flex;flex-flow: column;min-width:4.8rem;}
.rtveAlert.countDown.eclipse-solar .CountDown span abbr{line-height: 1rem;font-weight: 300;}
.rtveAlert.countDown.eclipse-solar .CountDown .segundos {width: 3.5rem;}
.rtveAlert.countDown.eclipse-solar .CountDown span em {display: flex;flex-flow: column;}
.rtveAlert.countDown.eclipse-solar .CountDown span abbr:after{content: 'd\0000EDas';color: #fff;font-weight: 900;text-decoration: none;font-style: normal;font-size: 1rem;line-height: 1rem;text-transform: uppercase;letter-spacing: 1.5pt;}
.rtveAlert.countDown.eclipse-solar .CountDown abbr[title="horas"]:after{content: 'horas';}
.rtveAlert.countDown.eclipse-solar .CountDown abbr[title="minutos"]:after{content: 'min';}
.rtveAlert.countDown.eclipse-solar .CountDown abbr[title="segundos"]:after{content: 'seg';}

.rtveAlert.countDown.eclipse-solar .CountDown span abbr.singular-day::after{content: 'd\0000EDa';}
.rtveAlert.countDown.eclipse-solar .CountDown span abbr.singular-hour::after{content: 'hora';}

@media only screen  and (max-width:1600px){
    .rtveAlert.countDown.eclipse-solar .auxBox p{font-size: 1.6rem;}
}
@media only screen and (max-width: 1399px) {
    .rtveAlert.countDown.eclipse-solar .txtBox p {font-size: 1.3rem;}
}
@media only screen and (max-width:1200px){
    .rtveAlert.countDown.eclipse-solar .txtBox {padding-left: 0;}
    .rtveAlert.countDown.eclipse-solar .auxBox p{font-size: 1.6rem;line-height:2rem;}
    .rtveAlert.countDown.eclipse-solar .botones-alerta span {font-size:1.6rem;line-height:2rem;padding:0.5rem 1rem;}
    .rtveAlert.countDown.eclipse-solar .CountDown *{font-size:2.4rem;line-height:3rem;}
    .rtveAlert.countDown.eclipse-solar .container .auxBox {left: -8rem;}
    .rtveAlert.countDown.eclipse-solar .txtBox p.txt {right: -18rem;}
}
@media only screen and (max-width:1000px){
   .rtveAlert.countDown.eclipse-solar a {width:100%;max-width:98rem;}
}
@media only screen and (max-width:960px){
    .rtveAlert.countDown.eclipse-solar .auxBox p{font-size: 1.2rem;line-height:1.6rem;}
    .rtveAlert.countDown.eclipse-solar .CountDown *{font-size:1.8rem;line-height:2.2rem;}
    .rtveAlert.countDown.eclipse-solar .CountDown {margin: 0 0.8rem;}
}
@media only screen and (max-width:650px){
    .rtveAlert.countDown.eclipse-solar .CountDown * {font-size: 1.6rem;}
    /* sin texto */
    .rtveAlert.countDown.eclipse-solar .txtBox .auxBox p {display: none;}
    .rtveAlert.countDown.eclipse-solar .txtBox .auxBox .CountDown p {display: flex;}
}

/* ancho como container */
@media only screen and (max-width: 1100px) {.rtveAlert.countDown.eclipse-solar .container {width:100%;max-width:90rem;}}
@media only screen and (max-width: 1259px) {.rtveAlert.countDown.eclipse-solar .container {width:100%;max-width:110rem;}}
@media only screen and (min-width: 1260px) {.rtveAlert.countDown.eclipse-solar .container {width:104.4rem;}}
@media only screen and (min-width: 1260px) and (max-width: 1399px) {.rtveAlert.countDown.eclipse-solar .container{width:100%;max-width:112rem;}}
@media only screen and (min-width: 1410px) {.rtveAlert.countDown.eclipse-solar .container{width:118rem;}
body.rtveplay.portada .rtveAlert.countDown.eclipse-solar .container {width: 136.5rem;}
body.rtveplay.portada .rtveAlert.countDown.eclipse-solar .txtBox p.txt {right: -22.5%}}




