/*Heading*/
@import url('https://fonts.googleapis.com/css?family=Monoton&display=swap');
/* Sub Heading*/
@import url('https://fonts.googleapis.com/css?family=Fredericka+the+Great&display=swap');
/* para */
@import url('https://fonts.googleapis.com/css?family=Dokdo&display=swap');
/*qoutes */
@import url('https://fonts.googleapis.com/css?family=Bahianita&display=swap');





*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}


.preLoader
  {
      position: fixed;
      width: 100%;
      height: 100%;
      background: #fbb471 url(images/tennis.gif) no-repeat center;
      z-index: 99999;
  }
  .LoadingLogo
  {
      color: #000;
      font-family: 'Luckiest Guy', cursive;
      text-align: center;
      position: relative;
      top: 200px;
  }
  

.navbar{
    background-color: #444a4e;
}
.navbar-brand{
    color: #fff;
    font-size: 40px;
    font-family: 'Bahianita';
    animation: btn 1s infinite ease;
}
@keyframes btn {
    from, 49% { transform-origin: -50% 100%; }
  50%, 75%, to { transform-origin: 150% 100%; }
  25% { transform: rotate(-10deg); }
  50% { transform: rotate(0deg); }
  75% { transform: rotate(10deg); }
}
.navbar ul li{
    list-style: none;
    display: inline-block;
    font-family: 'Bahianita';
}
.navbar li p{
    color: #fff;
    font-size: 40px;
    border-left: 1px solid #fff;
    padding-left: 10px;
}

.navbar-brand:hover{
    transition: 0.7s;
    animation: none;
}


.qoute{
    height: 100vh;
    text-align: center; 
    background-color: #444a4e;
}
.qoute h1{
    color: #fff;
    position: relative;
    top: 150px;
    width: 50%;
    margin: 0 auto;
    font-size: 90px;
    font-family: 'Bahianita';  
}

.img{
    height: 100vh;
    text-align: center;
}

.box{
    display: inline-block;
    margin: 10px;
    position: relative;
    top: 100px;
    background-color: #fff;
    width: 30%;
    height: 50vh;
}





@media (max-aspect-ratio: 16/9){
    .qoute h1{
        font-size: 50px;
    }
    .box{
        width: 90%;
        margin: 40px;
    }
}