@font-face {
  font-family: 'Pinyon Script';
  src: url('./fonts/PinyonScript-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Raleway';
  src: url('./fonts/Raleway.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Monsieur';
  src: url('./fonts/MonsieurLaDoulaise-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poiret One';
  src: url('./fonts/PoiretOne-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


body{
  font-size: 14px;
}

.main-content{
    max-width: 400px;
    min-height: 100vh;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden;
    position: relative;
}
/* Hide scrollbar for Chrome, Safari and Opera */
.main-content::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.main-content {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.header-section{
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 30px 15px;
}
@keyframes floatUp {
    0% {
      transform: translatey(0px) scale(1);
    }
    50% {
      transform: translatey(-20px) scale(1.02) rotate(5deg);
    }
    100% {
      transform: translatey(0px) scale(1) ;
    }
}
@keyframes floatDown{
    0% {
    transform: translatey(0px) scale(1);
    }
    50% {
    transform: translatey(20px) scale(1.02) rotate(5deg);
    }
    100% {
    transform: translatey(0px) scale(1) ;
    }
}
@keyframes floatSmall {
  0% {
    transform: translatey(0px);
  }
  50% {
    transform: translatey(-5px);
  }
  100% {
    transform: translatey(0px) ;
  }
}
.bismillah{
  width: 200px;
  margin: auto;
}
.drop-shadow{
  box-shadow: 0px 0px 6px -4px rgba(0,0,0,0.68);
  -webkit-box-shadow: 0px 0px 6px -4px rgba(0,0,0,0.68);
  -moz-box-shadow: 0px 0px 6px -4px rgba(0,0,0,0.68);
}
.covid-section{
  font-size: 12px;
}
.covid-section .icon-box{
  text-align: center;
  font-size: 10px;
}
.covid-section .icon-box img{
  margin: auto;
  display: block;
  width: 50px;
}
.flash-alert{
  position: fixed;
  top: 10px;
  right: 10px;
  display: none;
}