@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,100,300,500,700);
@import url(https://fonts.googleapis.com/css2?family=Noto+Serif+Display:ital,wght@0,100..900;1,100..900&display=swap);

:root {
    --corporate-dark: #101820;
    --corporate-dark-grey: #5b595d;
    --corporate-white: #EEEEF4;
}
body {
    background: var(--corporate-white);
    color:var(--corporate-dark);
    font-family:'Open Sans', sans-serif;
    padding:0;
    margin: 0;
}

h1{
    font-weight:100;
    font-size:46pt;
    color:var(--corporate-dark);
    font-family: 'Noto Serif Display', serif;
    font-weight: 500;
}

p{
    font-weight:300;
}

.center-content{
    display: grid;
    place-content: center;
}

.warning-content {
    position:absolute;
    top:25%;
    width:100%;
    min-height:300px;
    text-align:center;
    margin:0;
    overflow: hidden;
}
.title-bg{
    position: absolute;
    top:40px;

    font-size: 200px;
    opacity: .01;
    display: flex;
    flex-wrap: nowrap;
    width: fit-content;

    font-weight:100;
    color:var(--corporate-dark);
    font-family: 'Noto Serif Display', serif;
    font-weight: 500;
    white-space: nowrap;

}

@media (max-width: 768px) {
    .title-bg{
        font-size: 80px;
    }
    h1{
        font-size:26pt;
    }
}
.countdown-block{
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 40px;

    max-width: 90%;
    width: 300px;
    margin:auto;


}

.countdown-block > div{
    flex:1;
    position: relative;
    width: 20%;
    /* prevent overflow of the :after pseudo-element */

}


.countdown-block > div::after{
    content: ":";
    font-size: 30px;
    font-family: 'Noto Serif Display', serif;
    font-weight: 700;
    font-style: italic;
    margin-left: 5px;
    position: absolute;
    top: 20px;
    left: 56px;
    transform: translate(0, -50%);
}

.countdown-block .countdown-seconds::after{
    display: none;
}


.countdown-block .number{
    font-family: 'Noto Serif Display', serif;
    font-weight: 700;
    font-style: italic;
    font-size: 30px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.countdown-block .word{
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-style: normal;
    text-transform: uppercase;
}