.covid-overlay-bg{
    background:rgba(0,0,5,0.4);
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
    display:none;
    text-align:center;
    z-index:699;      
}

.covid-overlay{
    position:fixed; 
    z-index:900; 
    bottom:15px;
    right:15px; 
    width:30%; 
    height:90%; 
    border:1px solid rgb(16, 94, 171);
    min-width:300px;
    background-color:#fff;
    -webkit-box-shadow: -4px 5px 5px 0 rgba(0,0,0,.3);
    box-shadow: -4px 5px 5px 0 rgba(0,0,0,.3);    
    -webkit-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;

    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;

}
.covid-overlay .covid-overlay-header{
   background-color:rgb(16, 94, 171);
   position: absolute;
   z-index:200;
   width:100%;
   padding-top: 5px;
   padding-bottom:5px;
}
.covid-overlay .covid-overlay-header .title{
    font-size:130%;
    color:#fff;
    font-weight:bold;
    line-height:40px;
    padding-right:30px;
}

.covid-overlay .covid-overlay-header img.cdc-logo{
    height:40px;
    margin-left:5px;
    margin-right:5px;
    float:left;
}

.covid-overlay .covid-overlay-header img.chat-icon{
    color:#fff;
    margin-top:9px;
    height:32px;
    filter: invert(100%); 
    -webkit-filter:invert(100%);     

}

.covid-overlay .open-covid-overlay,
.covid-overlay .close-covid-overlay{
    position:absolute; 
    top:0px; 
    right:10px; 
    font-size:120%; 
    z-index:100;
    font-weight:bold;
    color:#fff;
    cursor: pointer;
    line-height:40px;
}
.covid-overlay .close-covid-overlay{
    display:none;
}
.covid-overlay .open-covid-overlay{    
    width:100%;
    text-align:right;
    right:0px;
    padding-right:20px;
}
/* .covid-overlay .open-covid-overlay:hover{
    background-color:rgba(20, 255, 5, .5);
} */

.covid-overlay iframe{    
    position: absolute;
    top:0px;
    z-index:150;
    padding-top:40px;
}

.covid-overlay-closed{
    height:50px;
    bottom:-100px;
}



  .sk-fading-circle {
    margin: 100px auto;
    width: 40px;
    height: 40px;
    position: relative;
  }
  
  .sk-fading-circle .sk-circle {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  
  .sk-fading-circle .sk-circle:before {
    content: '';
    display: block;
    margin: 0 auto;
    width: 15%;
    height: 15%;
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
            animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
  }
  .sk-fading-circle .sk-circle2 {
    -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
            transform: rotate(30deg);
  }
  .sk-fading-circle .sk-circle3 {
    -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
            transform: rotate(60deg);
  }
  .sk-fading-circle .sk-circle4 {
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
  }
  .sk-fading-circle .sk-circle5 {
    -webkit-transform: rotate(120deg);
        -ms-transform: rotate(120deg);
            transform: rotate(120deg);
  }
  .sk-fading-circle .sk-circle6 {
    -webkit-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
            transform: rotate(150deg);
  }
  .sk-fading-circle .sk-circle7 {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  .sk-fading-circle .sk-circle8 {
    -webkit-transform: rotate(210deg);
        -ms-transform: rotate(210deg);
            transform: rotate(210deg);
  }
  .sk-fading-circle .sk-circle9 {
    -webkit-transform: rotate(240deg);
        -ms-transform: rotate(240deg);
            transform: rotate(240deg);
  }
  .sk-fading-circle .sk-circle10 {
    -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
            transform: rotate(270deg);
  }
  .sk-fading-circle .sk-circle11 {
    -webkit-transform: rotate(300deg);
        -ms-transform: rotate(300deg);
            transform: rotate(300deg); 
  }
  .sk-fading-circle .sk-circle12 {
    -webkit-transform: rotate(330deg);
        -ms-transform: rotate(330deg);
            transform: rotate(330deg); 
  }
  .sk-fading-circle .sk-circle2:before {
    -webkit-animation-delay: -1.1s;
            animation-delay: -1.1s; 
  }
  .sk-fading-circle .sk-circle3:before {
    -webkit-animation-delay: -1s;
            animation-delay: -1s; 
  }
  .sk-fading-circle .sk-circle4:before {
    -webkit-animation-delay: -0.9s;
            animation-delay: -0.9s; 
  }
  .sk-fading-circle .sk-circle5:before {
    -webkit-animation-delay: -0.8s;
            animation-delay: -0.8s; 
  }
  .sk-fading-circle .sk-circle6:before {
    -webkit-animation-delay: -0.7s;
            animation-delay: -0.7s; 
  }
  .sk-fading-circle .sk-circle7:before {
    -webkit-animation-delay: -0.6s;
            animation-delay: -0.6s; 
  }
  .sk-fading-circle .sk-circle8:before {
    -webkit-animation-delay: -0.5s;
            animation-delay: -0.5s; 
  }
  .sk-fading-circle .sk-circle9:before {
    -webkit-animation-delay: -0.4s;
            animation-delay: -0.4s;
  }
  .sk-fading-circle .sk-circle10:before {
    -webkit-animation-delay: -0.3s;
            animation-delay: -0.3s;
  }
  .sk-fading-circle .sk-circle11:before {
    -webkit-animation-delay: -0.2s;
            animation-delay: -0.2s;
  }
  .sk-fading-circle .sk-circle12:before {
    -webkit-animation-delay: -0.1s;
            animation-delay: -0.1s;
  }
  
  @-webkit-keyframes sk-circleFadeDelay {
    0%, 39%, 100% { opacity: 0; }
    40% { opacity: 1; }
  }
  
  @keyframes sk-circleFadeDelay {
    0%, 39%, 100% { opacity: 0; }
    40% { opacity: 1; } 
  }


@media all and (max-width: 1020px){  
    .covid-overlay{
        bottom:15px; 
        right:15px;
        width:50%;         
        min-width:300px;
       
    }
    .covid-overlay-closed{
      bottom: -100px;
    }
}
@media all and (max-width: 650px){ 
    .covid-overlay{
        bottom:15px; 
        right:5%; 
        width:90%;         
        min-width:300px;       
    }
    .covid-overlay-closed{
      bottom: -100px;
    }

}

@media all and (max-width: 1238px){
    .covid-overlay .covid-overlay-header .title{
        font-size:110%;
        color:#fff;
        font-weight:bold;
        line-height:40px;
    }
    .covid-overlay .open-covid-overlay {
        width:100%;
        text-align:right;
        right:0px;
        padding-right:10px;        
    }
    .covid-overlay .covid-overlay-header img.chat-icon{
        color:#fff;
        margin-top:15px;
        height:20px;
        filter: invert(100%); 
        -webkit-filter:invert(100%);     

    }
}