
.asterisk{
  
color: red;

}

.updatebox {

    border: 1px solid;
    margin: 10px;
    padding: 10px 20px 10px 20px;

}

.swal-overlay {

  background-color: rgba(218, 243, 243, 0.6);
  
}

.swal-modal {

 border-radius: 20px;
  
}

.swal-button {
 
  border-radius: 10px;
  /* background-color: #25b7aa; */
  font-size: 12px;
  
}

#dialogoverlay{
    display: none;
    opacity: .8;
    position: fixed;
    top: 0px;
    left: 0px;
    background: #daf3f3;
    width: 100%;
    height: auto;
    z-index: 10;

  }
  #dialogbox{ 
    display:none;
    position:fixed;
    background:#25b7aa;
    border-radius:7px;
    width:40%;
    z-index: 10;
    
  }
  
  #dialogbox > div {background:#25b7aa;margin:8px; }
  #dialogbox > div > #dialogboxhead {background:#25b7aa; font-size:19px;padding:10px;color:#ccc; }
  #dialogbox > div > #dialogboxbody {background:#25b7aa;padding:20px;color:#000; }
  
  #button{
    height:30%;
    width:30%;
    float: right;
    margin: 10px;
    border-radius:7px;
    
  }

  .character {

    display: inline-block;
    width: 160px;
    margin-left: 2%;

  }

  .character-box {

    /* margin-top: 3%; */
    width: 100%;
    margin-left: 5%;

  }

  .character-name {

    margin-left: 33%;

  }


  .bingoteacher {
    position: absolute;
    left: 47%;
    top: 62%;
    z-index: 1;
    width: 160px;
  }

  .lingofamily {
    position: absolute;
    left: 60%;
    top: 10%;
    z-index: 1;
    width: 275px;
  }

  .mascot {
    position: absolute;
    bottom: 0;
    right: 5%;
    z-index: 1;
    
  }

  .lingowall {
    position: absolute;
    right: 25%;
    bottom: 0;
    z-index: 99;
    width: 160px;
    
  }

  .profile-shadow {
    box-shadow: -2px -2px 5px 2px #777777;
}


.tab-table, td{

  border-bottom: 1px solid grey;
  width: 100%;
  padding: 7px;


}

/* td:first-child {

  height: 40px;
  width: 20%;
  
} */

.table-border {

  border-left: 1px solid gray;
  border-right: 1px solid gray;
  

}

.blink {

  animation: blink 3s linear infinite;


}


.imgslider1{

  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 25%;

}
.imgslider2{

  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 12%;

}

.imgslider3{

  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 55%;

}

@keyframes blink {

  /* 0% {opacity: 1.0; } */
  50% {opacity: 0.0; }
  /* 100% {opacity: 1.0; } */
}




@media only screen and (max-width: 991px) {

  .bingoteacher {

    position: absolute;
    left: 5%;
    top: 85%;
    z-index: 1;
    width: 160px;

  }
  .character-box {

    /* margin-top: 3%; */
    margin-left: 0%;

  }

  .character {

    width: 150px;
    margin-left: 8%;

  }
  .cover-8 {
    background-image: none;
    background-color: white;
  }

  .lingofamily {
    position: absolute;
    left: 35%;
    top: 3%;
    z-index: 1;
    width: 225px;
  }

  .center-li {

    left: 10%;
 
 }


}


@media only screen and (max-width: 768px) {
  
  .bingoteacher {

    display: none;

  }

  .character {

    width: 140px;
    margin-left: 8%;
  

  }

.character-name{

  font-size: 12px;

}

.lingofamily {
  
  display: none;

}


}


@media only screen and (max-width: 642px) {
  
  .bingoteacher {

    display: none;

  }

  .character {

    width: 140px;
    margin-left: 6%;

  }
  
}

@media only screen and (max-width: 636px) {
  
  .bingoteacher {

    display: none;

  }

  .character {

    width: 135px;
    margin-left: 6%;

  }


}

@media only screen and (max-width: 600px) {

  .center-li {

    left: 25%;
 
 }



}

@media only screen and (max-width: 533px) {
  
  .bingoteacher {

    display: none;

  }

  .character {

    width: 125px;
    margin-left: 10%;

  }

  .cover-8 {

    background-image: none;
    background-color: white;
  }

  .center-li {

    left: 12%;
 
 }

}

@media only screen and (max-width: 364px) {

  .character {

    width: 125px;
    margin-left: 6%;
  }

  .center-li {

    left: 10%;
  }

}
  @media only screen and (max-width: 320px) {

    .character {

      margin-left: 25%;

    }

    .center-li {

      left: 0%;
   
   }
  

}