#countdown {
    font-size: 3.0em;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}


.day, .hrs, .min, .sec{
    background-color: #000;
    color: #fff;
    font-weight: bold;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 80px;
    width: 80px;
    margin: 0 10px;
    
}

@media only screen and (max-width: 2200px) {
    #countdown {
        font-size: 3.5em;
        width: 100%;
        height: 100%;
       
    }
}

@media only screen and (max-width: 1950px) {
    #countdown {
        font-size: 3.0em;
        width: 100%;
        height: 100%;
      
    }
}

@media only screen and (max-width: 1650px) {
    #countdown {
        font-size: 2.5em;
        width: 100%;
        height: 100%;
       
    }
}

@media only screen and (max-width: 1350px) {
    #countdown {
        font-size: 2.0em;
   
        width: 100%;
        height: 100%;
        
    }
}

@media only screen and (max-width: 1150px) {
    #countdown {
        font-size: 1.5em;
      
        width: 100%;
        height: 100%;
      
    }
}

@media only screen and (max-width: 850px) {
    #countdown {
        font-size: 1.0em;
      
        width: 100%;
        height: 100%;
        
    }
}

@media only screen and (max-width: 600px) {
    #countdown {
        font-size: 1.0em;
    
        width: 100%;
        height: 100%;
    }
}

@media only screen and (max-width: 575px) {
    #countdown {
        font-size: 1.0em;
   
        width: 100%;
        height: 100%; 
			overflow-wrap: break-word;
    }
}