@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@300&display=swap');


body{
  background-color: #EA9937;
  font-size: large;
  font-family: 'Raleway', sans-serif;
    color: #000;
  }
.header{
  background-color: #FFf;
  padding-right: 75px;
  padding-left: 75px;
  justify-items: center;
  font-weight: 600;
  }
  .links{
    padding: 5px 5px 5px 5px;
    }
  .links-active{
      color: #EA9937;
    }
  .links:hover{
    color: #ff8c00;
    cursor: pointer;
    }
  .loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #001F3F;
    transition: opacity 3s, visibility 3s;
    }
  .hin{
    font-family: 'Mukta', sans-serif;
    }
  .loader--hidden {
    opacity: 0;
    visibility: hidden;
    }
.zodiac{
   background-color: #dddddd;
  }
.title{
  color: #EA9937;
  font-size: 50px;
  }
.card{
  border: 0.1px black;
  }

.loader::after {
  content: "";
  width: 75px;
  height: 75px;
  border: 15px solid #dddddd;
  border-top-color: #EA9937;
  border-radius: 50%;
  animation: loading 0.75s ease infinite;
  }
      
  @keyframes loading {
        from {
          transform: rotate(0turn);
        }
        to {
          transform: rotate(1turn);
        }
      }