



.index-logo img{width: 100%;}
.index-links p:hover{
  text-align: center;
}
.index-links a{
  text-decoration: none;
  border-style: none;
  display: block;
  transition: width 0.5s;
  color: black;
  border-radius: 0vw 0vw 0vw 0vw;
}
.index-links a:hover{
  width: 100%;
  border-radius: 0vw 50vw 50vw 0vw;
  cursor: pointer;
  color: white;
}


@media screen and (min-width: 800px) {

  .row{width: 50%; padding: 10% 25% 0% 25%; gap:0;}
  .index-logo img{width: 40%; padding: 3.5% 35%;}

  .index-links{
    width: 100%;
    padding: 0%;
  }
  .index-links p{
    font-size: 1.3vw;
    margin-left: 1.5vw;
    letter-spacing: 0.09vw;
    padding: 0.5vw 0vw 0.5vw 0vw;
  }
  .index-links a{    
    width: 0.4vw;
    margin-top: 2vw;
    margin-bottom: 2vw;
  }

  .social-links{width: 8%; padding: 5% 46%; flex-direction: row; display: flex;}
    .social-links img{width: 100%;}
}

@media screen and (max-width: 800px) {
  .row{width: 100%;}

  .index-logo img{width: 34%; padding: 15% 33%;}

  .index-links{
    width: 70%;
    padding: 0% 15%;
  }
  .index-links p{
    font-size: 4vw;
    margin-left: 2vw;
    letter-spacing: 0.2vw;
    padding: 0.85vw 0vw 0.85vw 1vw;
  }
  .index-links a{    
    width: 0.8vw;
    margin-top: 5vw;
    margin-bottom: 5vw;
  }

  .social-links{width: 20%; padding: 10% 40%; flex-direction: row; display: flex;}
    .social-links img{width: 100%;}


}