*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family: "Poppins", sans-serif;
}

body{
    height:100vh;
    overflow:hidden;
    position:relative;
    /* color:white; */
}


.bg{
    position:absolute;
    inset:0;
    background:url("logo1.webp");
    background-repeat: repeat;
    background-size: contain;
    z-index:-1;
    transform:scale(1.05);
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.35);
    z-index:-2;
}

.container{
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:20px;
}


h1{
    font-size:120px;
    line-height:.9;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:1px;
    text-shadow:0 8px 25px rgba(0,0,0,.5);
}


h1 span{
    display:inline-block;
    transition:0.2s;
    cursor:pointer;
}


p{
    margin-top:20px;
    font-size:18px;
    color:#f1f1f1;
    line-height:1.7;
}


.timer{
    margin-top:45px;
    display:flex;
    justify-content:center;
    gap:25px;
    flex-wrap:wrap;
}

.box{
    width:120px;
    height:120px;
    background:rgba(255,255,255,.12);
    border:2px solid rgba(255,255,255,.25);
    backdrop-filter:blur(10px);
    border-radius:20px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
}

.number{
    font-size:46px;
    font-weight:bold;
}

.label{
    margin-top:5px;
    font-size:14px;
    letter-spacing:2px;
    color:#000000;
}

footer{
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    /* gap: 10; */
    bottom:30px;
    width:100%;
    text-align:center;
    color:#000000;
    font-size:18px;
    gap: 10px;
}
.footer-div2{
        display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 768px) {

    h1 {
        font-size: 110px;
    }

    .box {
        width: 95px;
        height: 95px;
    }

    .number {
        font-size: 34px;
    }

    .label {
        font-size: 14px;
    }
    .footer{
        font-size: 14px;
    }
}


@media (max-width: 645px) {

    body{
        
        overflow-x: hidden !important;
    }
    
    .container {
        width: 95%;
        padding: 10px;
    }

    .bg{
        
        background-repeat: no-repeat;
    background-size: cover;
    }
    h1 {
        font-size: 80px;
        letter-spacing: 0px;
    }

    .timer {
        flex-direction: row;
        gap: 15px;
        flex-wrap: nowrap;
    }

    .box {
        width: 80px;
        height: 80px;
    }

    .number {
        font-size: 24px;
    }

    .label {
        font-size: 12px;
    }

    footer {
        font-size: 14px;
        flex-direction: column;
        gap: 10px;
    }
    .display-none{
        display: none;
    }
    .footer-div2{
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
}
@media (width < 376px) {
       h1 {
        font-size: 70px;
        letter-spacing: 2px;
    }
        footer {
        font-size: 14px;
    }
}

@media (width < 321px) {
       h1 {
        font-size: 60px;
        letter-spacing: 2px;
    }
        footer {
        font-size: 8px;
    }
}


.iclick-logo:hover svg g g path{
transition: all 1s ease;
}





.iclick-logo svg g g path{
    fill: #111111 !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g rect{
    fill: #111111 !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(1) path{
    stroke: #111111 !important;
    fill: transparent !important;
    stroke-width: 6px !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(4) path{
    stroke: #111111 !important;
    fill: transparent !important;
    stroke-width: 6px !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(2) path{
    stroke: #111111 !important;
    fill: transparent !important;
    stroke-width: 6px !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(3) path{
    stroke: #111111 !important;
    fill: transparent !important;
    stroke-width: 6px !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(5) path{
    fill: #000000 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo svg g g:nth-child(6) path{
    fill: #363636 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}




.iclick-logo:hover svg g g:nth-child(1) path{
    fill: #0054A6 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo:hover svg g g:nth-child(4) path{
    fill: #0054A6 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo:hover svg g g:nth-child(2) path{
    fill: #0072BC !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo:hover svg g g:nth-child(3) path{
    fill: #00A651 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo:hover svg g g g:nth-child(5) path{
    fill: #000000 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}
.iclick-logo:hover svg g g g:nth-child(6) path{
    fill: #363636 !important;
    stroke: none !important;
    fill-opacity: 1 !important;
}