/* before series */

/* #insertCountdownForm {
    margin-left: 8vw;
    margin-top: calc(-430px + (20vw));
    min-width: 50%;
    padding: 20px;
} */

#form-container {
    background-color: white;
    border-radius: 10px;
}

#countdownForm {
    display: none;
    margin: 10px 0px 40px 0px;
    background-color: #ffffff00;
}

#countdownTitle {
    font-size:2vw;
    padding: 25px 30px 5px 30px;
    text-align: center;
    background-color: #ffffff00;
}

ul#countdownTimer {
    list-style:none;
    margin:10px 0;
    padding:0;
    display:block;  
    text-align:center; 
    background-color: #ffffff00;
}
    
ul#countdownTimer li {
    display: inline-block; 
    background-color: #ffffff00;
}

ul#countdownTimer li span {
    font-size:4vw;
    font-weight:300;
    line-height:80px;
    background-color: #ffffff00;
}

ul#countdownTimer li.seperator {
    font-size:4vw;
    line-height:70px;
    vertical-align:top;
    background-color: #ffffff00;
}

ul#countdownTimer li p {
    background-color: #ffffff00;
    color:#a7abb1;
    font-size:1vw;
}

/* during series */

#form-container-event-end {
    background-color: white;
    border-radius: 10px;
}

#eventEndCountdownForm {
    /* display: none; */
    /* margin: 10px 0px 40px 0px; */
    background-color: #ffffff00;
}

#eventEndCountdownTitle {
    font-size:2vw;
    padding: 25px 30px 5px 30px;
    text-align: center;
    background-color: #ffffff00;
}

ul#eventEndCountdownTimer {
    list-style:none;
    /* margin:10px 0; */
    padding:0;
    display:block;  
    text-align:center; 
    background-color: #ffffff00;
}
    
ul#eventEndCountdownTimer li {
    display: inline-block; 
    background-color: #ffffff00;
}

ul#eventEndCountdownTimer li span {
    font-size:50px;
    font-weight:300;
    line-height:80px;
    background-color: #ffffff00;
}

ul#eventEndCountdownTimer li.seperator {
    font-size:50px;
    line-height:70px;
    vertical-align:top;
    background-color: #ffffff00;
}

ul#eventEndCountdownTimer li p {
    background-color: #ffffff00;
    color:#a7abb1;
    font-size:14px;
}

/* event 1 */

#form-container0 {
    background-color: white;
    border-radius: 10px;
}

#countdownForm0 {
    /* display: none; */
    margin: 10px 0px 0px 0px;
    background-color: #ffffff00;
}

/* #countdownTitle0 {
    font-size:2vw;
    padding: 25px 30px 5px 30px;
    text-align: center;
    background-color: #ffffff00;
} */

ul#countdownTimer0 {
    list-style:none;
    margin:10px 0;
    padding:0;
    display:block;  
    text-align:center; 
    background-color: #ffffff00;
}
    
ul#countdownTimer0 li {
    display: inline-block; 
    background-color: #ffffff00;
}

ul#countdownTimer0 li span {
    font-size:4vw;
    font-weight:300;
    line-height:80px;
    background-color: #ffffff00;
}

ul#countdownTimer0 li.seperator {
    font-size:4vw;
    line-height:70px;
    vertical-align:top;
    background-color: #ffffff00;
}

ul#countdownTimer0 li p {
    background-color: #ffffff00;
    color:#a7abb1;
    font-size:1vw;
}

/* event 2 */

#form-container1 {
    background-color: white;
    border-radius: 10px;
}

#countdownForm1 {
    /* display: none; */
    margin: 10px 0px 0px 0px;
    background-color: #ffffff00;
}

/* #countdownTitle1 {
    font-size:2vw;
    padding: 25px 30px 5px 30px;
    text-align: center;
    background-color: #ffffff00;
} */

ul#countdownTimer1 {
    list-style:none;
    margin:10px 0;
    padding:0;
    display:block;  
    text-align:center; 
    background-color: #ffffff00;
}
    
ul#countdownTimer1 li {
    display: inline-block; 
    background-color: #ffffff00;
}

ul#countdownTimer1 li span {
    font-size:4vw;
    font-weight:300;
    line-height:80px;
    background-color: #ffffff00;
}

ul#countdownTimer1 li.seperator {
    font-size:4vw;
    line-height:70px;
    vertical-align:top;
    background-color: #ffffff00;
}

ul#countdownTimer1 li p {
    background-color: #ffffff00;
    color:#a7abb1;
    font-size:1vw;
}

/* event 3 */

#form-container2 {
    background-color: white;
    border-radius: 10px;
}

#countdownForm2 {
    /* display: none; */
    margin: 10px 0px 0px 0px;
    background-color: #ffffff00;
}

/* #countdownTitle2 {
    font-size:2vw;
    padding: 25px 30px 5px 30px;
    text-align: center;
    background-color: #ffffff00;
} */

ul#countdownTimer2 {
    list-style:none;
    margin:10px 0;
    padding:0;
    display:block;  
    text-align:center; 
    background-color: #ffffff00;
}
    
ul#countdownTimer2 li {
    display: inline-block; 
    background-color: #ffffff00;
}

ul#countdownTimer2 li span {
    font-size:4vw;
    font-weight:300;
    line-height:80px;
    background-color: #ffffff00;
}

ul#countdownTimer2 li.seperator {
    font-size:4vw;
    line-height:70px;
    vertical-align:top;
    background-color: #ffffff00;
}

ul#countdownTimer2 li p {
    background-color: #ffffff00;
    color:#a7abb1;
    font-size:1vw;
}

@media (max-width: 400px) {
    #home {
        height: 620px;
        margin-top: 75px;
        background-position: center 310px;
        background-size: 525px;
    }
    /* #insertCountdownForm {
        margin: unset;
        padding: unset;
        max-width: 80%;
        position: absolute;
        top: 210px;
        left: 40px;
    } */
    #countdownForm {
        margin: 10px 0px 15px 0px;
    }
    #countdownTitle {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    }
    ul#countdownTimer li span {
        font-size: 36px;
    }
    ul#countdownTimer li.seperator {
        font-size: 36px;
    }
    ul#countdownTimer li p {
        font-size: 12px;
    }
    /* #countdownTitle0 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer0 li span {
        font-size: 9vw;
    }
    ul#countdownTimer0 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer0 li p {
        font-size: 3vw;
    }
    /* #countdownTitle1 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer1 li span {
        font-size: 9vw;
    }
    ul#countdownTimer1 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer1 li p {
        font-size: 3vw;
    }
    /* #countdownTitle2 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer2 li span {
        font-size: 9vw;
    }
    ul#countdownTimer2 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer2 li p {
        font-size: 3vw;
    }
}

@media (max-width: 576px) and (min-width: 400px) {
    /* #insertCountdownForm {
        margin: unset;
        padding: unset;
        max-width: 80%;
        position: absolute;
        top: 210px;
        left: 40px;
    } */
    #countdownForm {
        margin: 10px 0px 15px 0px;
    }
    #countdownTitle {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    }
    ul#countdownTimer li span {
        font-size: 36px;
    }
    ul#countdownTimer li.seperator {
        font-size: 36px;
    }
    ul#countdownTimer li p {
        font-size: 12px;
    }
    /* #countdownTitle0 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer0 li span {
        font-size: 9vw;
    }
    ul#countdownTimer0 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer0 li p {
        font-size: 3vw;
    }
    /* #countdownTitle1 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer1 li span {
        font-size: 9vw;
    }
    ul#countdownTimer1 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer1 li p {
        font-size: 3vw;
    }
    /* #countdownTitle2 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer2 li span {
        font-size: 9vw;
    }
    ul#countdownTimer2 li.seperator {
        font-size: 9vw;
    }
    ul#countdownTimer2 li p {
        font-size: 3vw;
    }
}

@media (max-width: 992px) and (min-width: 576px) {
    /* #insertCountdownForm {
        margin: unset;
        width: 60%;
        position: absolute;
        top: 120px;
        left: 21vw;
        padding: 40px;
    } */
    #countdownTitle {
        font-size: 18px;
    }
    ul#countdownTimer li span {
        font-size: 36px;
    }
    ul#countdownTimer li.seperator {
        font-size: 36px;
    }
    ul#countdownTimer li p {
        font-size: 12px;
    }
    /* #countdownTitle0 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer0 li span {
        font-size: 7vw;
    }
    ul#countdownTimer0 li.seperator {
        font-size: 7vw;
    }
    ul#countdownTimer0 li p {
        font-size: 2.5vw;
    }
    /* #countdownTitle1 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer1 li span {
        font-size: 7vw;
    }
    ul#countdownTimer1 li.seperator {
        font-size: 7vw;
    }
    ul#countdownTimer1 li p {
        font-size: 2.5vw;
    }
    /* #countdownTitle2 {
        font-size: 18px;
        padding: 5px 30px 5px 30px;
    } */
    ul#countdownTimer2 li span {
        font-size: 7vw;
    }
    ul#countdownTimer2 li.seperator {
        font-size: 7vw;
    }
    ul#countdownTimer2 li p {
        font-size: 2.5vw;
    }
}