*{
  font-family: "taviraj-light", serif;
  box-sizing: border-box;
  margin: 0;
  padding-right: 0;
  
  
}
h1{
  font-size:4rem;
  font-family: "Taviraj", serif;
  font-weight: 500;
  font-style: normal;
  display: flex;
  flex-wrap: wrap;
  
}
em{
  text-decoration: underline wavy #4dffff 2px;
  
}
h2{
  font-family: "Taviraj", serif;
  font-weight: 400;
  font-style: normal;
}
h3{
  font-size: 1.5em;
    font-family: "Taviraj", serif;
    font-weight: 200;
    font-style: normal;
  
}
p{
  
  font-size: 1.333rem;
  font-family: "Taviraj", serif;
  font-weight: 300;
  font-style: italic;

}

.logo{
 
  font-family: "Taviraj", serif;
  font-weight: 900;
  font-style: none;
 display: inline;
 text-decoration: none;
 text-shadow: 0px 13px 20px #144d4d;
 list-style:none;
 font-size: 2.3rem;
 align-items: center;
 justify-content: center;
 display: flex;
 float: left;
 padding-bottom: 1rem;
}
nav {
  background-color: #0000ff73;
  padding: 0.6rem;
  height: auto;
  width: 100vw;
  min-width:480px;
  flex-wrap: wrap; 
  
}
nav ul{
  flex-wrap: wrap; 
  display: flex;
  list-style:none;
  justify-content: flex-end;
  align-items: center;
}
nav ul a{
  margin-left: 1rem;
  margin-right: 1rem;
  font-family: "Taviraj", serif;
  font-weight: 400;
  font-style: normal;
  display: flex;
  flex-wrap: wrap; 
  text-align: center;
  justify-content:space-between;
  text-decoration: none;
  list-style:none;
  padding: 0.6rem 1rem;
  color: rgb(255, 255, 255);
  border-radius:16px;
  background-color:#36b3b3;
  border: 1px solid rgba(54,44,44,1);
  text-shadow: 4px;
  box-shadow: 4px 5px 12px 2px rgba(23,21,21,0.84);
-webkit-box-shadow: 4px 5px 12px 2px rgba(23,21,21,0.84);
-moz-box-shadow: 4px 5px 12px 2px rgba(23,21,21,0.84);
  transition-property:background-color color 0.8s ease 0s;

  transition:all 0.3s ease;
}
nav li a:hover{
  cursor: grab;
  transition-duration: 0.8s;
  flex-wrap: wrap; 
  background-color:#fdfcff;
  color: black;
  transform: scale(1);
  text-transform: uppercase;
}
.about
{
  padding: 20px,30px;
  height:100vh;
  margin: 10vw;
  
   
}
.services{
  padding: 20px,30px;
  height:30vh;
  margin: 20vw;
  margin-bottom: 44rem;
}
.contact{
  padding: 20px,30px;
  height:100vh;
  margin: 20vw;
  margin-bottom:min(1rem);
  padding-bottom:min(18rem);
}
.foot a ,
.rights{
  cursor: grab;
  background-color: #0000ff73;
  font-family: "Taviraj", serif;
  font-weight: 400;
  font-style: normal;
  color: #000000;
  list-style: none;
  display: flex;
  justify-content:center;
  justify-content: space-evenly;
}
.foot{
  margin-top:8rem;
  width: 100vw;
  color: black;
  font-size: large;
}
.foot a{
  text-decoration: none;
  text-decoration: underline wavy #4dffff 2px;
  transition-property: color;
}
.foot a:hover{
  transition:all 0.3s ease;
  color:#290263;
  text-decoration: underline wavy #000000 2px;
    
}
@media (max-width: 480px){
  .services{
    padding: 20px,30px;
    height:30vh;
    margin: 20vw;
    margin-bottom: 48rem;

  }
}


button{
  cursor: grab;
  margin-top:3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 11px;
  margin-left:50% ;
  margin-right: 50%;
  font-size: 19px;
  text-decoration: none;
  font-weight: 700;
  transition: all 0.3s ease;
  outline: none;
  user-select: none;
  color: #000000;
  border-width: 2px;
  border-style: solid;
  border-color: #000000;
  border-radius: 16px;
  background-color: #8836ff;
}
button a{
  cursor: grabbing;
  text-decoration:none ;
  color: #000000;
  justify-content: center;
  align-items: center;
}
button:hover {
  transition: all 0.3s ease;
  background-color: #ffffff;
  background-image: none;
  cursor: grab;
}

div.gallery {
  cursor: grab;
  margin-top:3rem;
  float:bottom;
  clip-path: circle(40%);
  shape-outside: circle(45%);
  border: 1px solid #000000;
}

div.gallery:hover {
  cursor: grab;
  border: 2px solid #000000;
}

div.gallery img {
  cursor: grabbing;
  display: block;
  margin: auto;
  width: 50%;
}

div.desc {
  display: block;
  margin: auto;
  width: 50%;
  padding: 15px;
  text-align: center;
}


@media (max-width: 100vw) {
  h1 {
      font-size: 4rem;
  }

  h2 {
      font-size: 3rem;
  }

  header h3 {
      font-size: 2rem;
  }

  
}
@media (max-width: 480px) {
  h1 {
      font-size: 2rem;
  }

  h2 {
      font-size: 1.3rem;
  }
 
  header h3 {
      font-size: 16px;
  }

  ul li {
      margin-bottom: 10px;
  }

 
}