.eventCountDown { display: inline-block; float: right; width: 300px; height: 150px; position: relative;background: linear-gradient(196deg, #811300 0%, #C1272F 48.56%, #811300 100%);padding: 0;}

.eventCountDown .countDownCnts { display: inline-block; width: 100%; height: 100%; float: right; position: relative }
.eventCountDown .text {display:inline-block;width: 200px;height: 35px;position: absolute;top: 20px;z-index:1;left: 50%;transform: translateX(-50%);opacity: 1;background: url(../Images/WC2022/countdownText-White.svg) center center no-repeat;background-size: 100% auto;pointer-events: none;}

.eventCountDown .countDown { display: inline-block; float: right; width: 100%; position: absolute; bottom: -7px; left: 0; z-index: 2 }
.eventCountDown .countDown p { font-family: droidKufiLight, Arial; font-size: 15px; cursor: pointer; color: #000; text-align: center; cursor: auto; margin-bottom: 10px }
.eventCountDown .countDown .phrosCounter { text-align: center; width: auto; margin: 0 auto; display: inline-block; }
.eventCountDown .countDown .phrosCounter .phrosTimer { position: relative; display: inline-block; float: left; text-align: center; margin: 0 6px; font-family: ykLight;font-weight:bold; font-size: 18px; border-radius: 8px;border: 2px solid #D3E3FF; color:#00246B ; background-color: #fff; line-height: 38px; width: 54px; height: 58px; }
.eventCountDown .countDown .phrosCounter .phrosTimer:last-child:before{display:none}
.eventCountDown .countDown .phrosCounter .phrosTimer:last-child:after { display: none }
.eventCountDown .countDown .phrosCounter .phrosTimer span {font-weight: normal;font-family: droidLight, Arial; color:#1E1E1E;font-size: 10px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); line-height: 1;background: #EBEBEB;
    width: 100%;
    padding: 4px 0; }



 .eventCountDown img{display:inline-block;position:absolute;width:100%;height:100%;top:0;left:0}
 .eventCountDown p{display:inline-block;width:auto;text-align:center;font-size:14px;font-family:droidBold, Arial;color:#EEBC2F;margin-top:18px;position:relative}

.eventCountDown .countDown .phrosCounter .phrosTimer{background-color:unset;font-size:45px;color:#fff;margin:0;width: 40px;height: 62px;border:0;line-height:38px;font-family:alumaniSansBold;margin-left:28px;float:right}
.eventCountDown .countDown .phrosCounter .phrosTimer:last-child{margin-left:0}
.eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:13px;color:#fff;background-color:unset;font-family:droidBold,arial}
.eventCountDown .countDown .phrosCounter .phrosTimer:before{content:'';background:url(../Images/Afcon2025/statstitlePattern.svg);background-size:cover;width:17px;height:17px;display:inline-block;    position: absolute;
    left: -24px;
    top: 11px;}

big .eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:13px;color:#C1272F;background-color:unset;font-family:droidBold,arial}
.eventCountDown .countDown{bottom:25px}

.big{width:100%;float:right;height:auto;float:none;margin-bottom:60px;margin-top:30px;height:233px}
.big .eventCountDown{width:100%;height:100%;background: transparent;  border-radius: 34px;position:relative;padding:0 0 0;float:none}
.big .eventCountDown p{font-size:28px}
.big .eventCountDown .countDown .phrosCounter {
        display: flex;
    gap: 34px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.big .eventCountDown .countDown .phrosCounter .phrosTimer{font-size:80px;width: 150px;
    height: 150px;
    margin-left: 0;
color:#fff;
border-radius:16px;
display: flex;
    justify-content: center;
    align-items: center;
        flex-direction: column;
        gap:4px;
        line-height:51px
}

.big .eventCountDown .countDown .phrosCounter .phrosTimer.days{background:url(../Images/wc26/daysPattern.webp) no-repeat center center;    background-size: 100% auto;}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.hours{background:url(../Images/wc26/hoursPattern.webp) no-repeat center center;    background-size: 100% auto;}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.minutes{background:url(../Images/wc26/mintesPattern.webp) no-repeat center center;    background-size: 100% auto;}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.sec{background:url(../Images/wc26/secondPattern.webp) no-repeat center center;    background-size: 100% auto;}

.big .eventCountDown .countDown .phrosCounter .phrosTimer:before{content:'';display:flex;width:20px;height:20px;    top:auto;
    left:-27px}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.hours:before{background:url(../Images/wc26/canadaRedIcon.svg) no-repeat center center;background-size:cover}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.minutes:before{background:url(../Images/wc26/usaBlueIcon.svg) no-repeat center center;background-size:cover}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.sec:before{background:url(../Images/wc26/mexicoGreenIcon.svg) no-repeat center center;background-size:cover}
.big .eventCountDown .countDown .phrosCounter .phrosTimer.days:before{display:none}
.big .eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:14px;color:#fff;    position: relative;
    bottom: auto;
    left: auto;
    transform: none;

}
.big .eventCountDown .countDown{bottom: auto;
    position: relative;
    left: auto;}
.big .eventCountDown p{margin-top:0;color:#000;margin-bottom:20px}
 
.big .eventCountDown .countDown .phrosCounter .phrosTimer:last-child{margin-left:0}

.sponserStrip{display:inline-block;position:absolute;bottom:0;right:0;border: 1px solid  #EEBC2F;background: #7F0000;width:100%;height:30px;padding:0 10px;}
.sponserStrip p{display:inline-block;float:right;color:#fff;font-size:10px;text-align: right;width: auto; margin: 0;line-height:30px}
.sponserStrip img{display:inline-block;width:auto;max-width:60px;height:calc(100% - 6px);margin:3px 0;float:left;position:relative}

.big.hp{width:300px;height:150px;background: #fff;
    margin-bottom: 15px;
    margin-top: 0;}
.big.hp .eventCountDown{padding:10px}
.big.hp .eventCountDown p {font-size: 20px;    margin-bottom: 10px;}
 .big.hp  .eventCountDown .countDown .phrosCounter .phrosTimer{width:55px;height: 55px;
    font-size: 30px;
    gap: 5px;
    line-height: 18px;}
 .big.hp  .eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:8px;padding:0}
 .big.hp  .eventCountDown .countDown .phrosCounter{gap:20px}
 .big.hp  .eventCountDown .countDown .phrosCounter .phrosTimer:before{    width: 15px; height: 15px;left: -17px;}


@media screen and (min-width:1360px) and (max-width:1919px) {

}


@media screen and (min-width:1280px) and (max-width:1359px) {

}

@media screen and (min-width:1024px) and (max-width:1279px) {

}

@media only screen and (max-width: 1023px) {
           .eventCountDown { margin: 0 calc((100% - 300px) /2) 20px }
           .big{height:162px}
           .big .eventCountDown{margin:0}
           .big .eventCountDown p {font-size: 22px;}
           .big .eventCountDown .countDown .phrosCounter .phrosTimer{width:100px;height:100px;font-size: 52px;    gap: 6px;}
}

@media screen and (min-width: 360px) and (max-width: 767px) {
      .big{height:110px}
           .big .eventCountDown p {font-size: 20px;    margin-bottom: 10px;}
           .big .eventCountDown .countDown .phrosCounter .phrosTimer{width:60px;height:60px;font-size: 36px;        gap: 0;
        line-height: 24px;}
          .big .eventCountDown .countDown .phrosCounter{gap:20px}
            .big .eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:8px}
             .big .eventCountDown .countDown .phrosCounter{gap:20px}
             .big .eventCountDown .countDown .phrosCounter .phrosTimer:before{    width: 15px; height: 15px;left: -17px;}

.eventCountDown p:before, .eventCountDown p:after{width:18px;height:11px;right:-24px}
.eventCountDown p:after{left:-24px;right:auto}

}

@media screen and (min-width: 320px) and (max-width: 359px) {
     .big .eventCountDown p {font-size: 20px;    margin-bottom: 10px;}
 .big .eventCountDown .countDown .phrosCounter .phrosTimer{width:60px;height:60px;font-size: 36px;    gap: 6px;}
 .big .eventCountDown .countDown .phrosCounter .phrosTimer span{font-size:8px}
 .big .eventCountDown .countDown .phrosCounter{gap:20px}
 .big .eventCountDown .countDown .phrosCounter .phrosTimer:before{    width: 15px; height: 15px;left: -17px;}

.eventCountDown p:before, .eventCountDown p:after{width:18px;height:11px;right:-24px}
.eventCountDown p:after{left:-24px;right:auto}


}