body,h1,h2,h3,h4,h5,h6 {font-family: "Raleway", sans-serif}

body, html {
  height: 100%;
  line-height: 1;
}

 

/* main content */


#grad1 {
  height: 60vh;
  background-color: green; /* For browsers that do not support gradients */
  background-image: linear-gradient(green,rgb(97, 240, 84), rgb(151, 218, 134));
}
#herd{
  font-size: 6vw;
}

@media screen and (max-width: 920px) {
  #grad1 {
    height: 50vh;
    background-color: green; /* For browsers that do not support gradients */
    background-image: linear-gradient(green,rgb(97, 240, 84), rgb(151, 218, 134));
  }
 

@media screen and (max-width: 650px) {
  
  li a{

    padding-left: 5px;
  }
 img{
   padding-top: 2px;
   padding-bottom: 2px;
 }
  #grad1{
    max-height: 25vh;
     height: 25vh;
  }
}

li{
  padding: 12px;
}
li a{
  text-decoration: none;
}
#bit{
  height:300px;
  width:400px;
}
#bet{
  height: 300px;
  width: 500px;
}
#bit:hover{
  cursor: pointer;
  transform: scale(1.1);
}
#bet:hover{
  cursor: pointer;
  transform: scale(1.1);
}
@media screen and (max-width: 750px) {
  #bit{
    transform: scale(0.6);
    padding-top: 20%;
  }
  #bit:hover{
    transform: scale(0.7);
    padding-top: 20%;
    cursor: pointer;
  }
  
}

#gift{
  height: 450px;
  width: 500px;
}
#gift:hover{
  transform: scale(0.9);
  opacity: 0.8;
  cursor: pointer;
}
#gif{
  text-align: center;
}
@media screen and (max-width: 1080px) {
  #gift{
    transform: scale(0.6);
  }
  #gift:hover{
    transform: scale(0.4);
  }
  #cons img{
    width: 150px;
  }
}

@media screen and (max-width: 1500px) {
}
#bet{
  transform: scale(0.6);
  padding-top: 20%;
}
#bet:hover{
  transform: scale(0.5);
  padding-top: 20%;
  cursor: pointer;
}
}

@media screen and (max-width: 780px) {
  #gift{
    width: 350px;
  }
  #bet{
    transform: scale(0.4);
    padding-top: 20%;
  }
  #bet:hover{
    transform: scale(0.3);
    padding-top: 20%;
}
#cons img{
  width: 150px;
}
}

#ria:hover{
  transform: scaleX(1.2);
  cursor: pointer;
}
#west:hover{
  transform: scaleX(1.2);
  opacity: 0.8;
  cursor: pointer;
}
#mon:hover{
  transform: scaleX(0.8);
  cursor: pointer;
}
#payp:hover{
  transform: scaleX(0.8);
  opacity: 0.8;
  cursor: pointer;
}