body{
    animation: loop 75s infinite linear;
}

@keyframes loop {
    100%{
        background-position: 2500px 2500px;
    }
}

a.nav-link:link
{
   color: transparent;
   text-decoration: none;
}
a.nav-link:visited
{
   color: transparent;
   text-decoration: none;
}
a.nav-link:hover
{
   color: transparent;
   text-decoration: none;
}
a.nav-link:active
{
   color: transparent;
   text-decoration: none;
}

@media (min-width:320px)  { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 45%;
        max-width: 55%;
        max-height: 55%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: fixed;
        bottom: 15%;
        height: 2%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }

      .socials {
        position: absolute;
        bottom: 6%;
    }
}
@media (min-width:481px)  { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 15%;
        max-width: 55%;
        max-height: 55%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: fixed;
        bottom: 15%;
        height: 2%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }

      .socials {
        position: absolute;
        bottom: 6%;
    }
}
@media (min-width:641px)  { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 15%;
        max-width: 55%;
        max-height: 55%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: fixed;
        bottom: 15%;
        height: 2%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }

      .socials {
        position: absolute;
        bottom: 6%;
    }
}
@media (min-width:961px)  { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 30%;
        max-width: 55%;
        max-height: 55%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: fixed;
        bottom: 15%;
        height: 2%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }

      .socials {
        position: absolute;
        bottom: 6%;
    }
}
@media (min-width:1025px) { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 5%;
        max-width: 55%;
        max-height: 55%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: fixed;
        bottom: 15%;
        height: 2%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }

      .socials {
        position: absolute;
        bottom: 6%;
    }
}
@media (min-width:1281px) { 
    body {
        background-image: url("pattern.png");
        background-size: 174px 174px;
        background-color: #685b80;
        background-repeat: repeat;
        background-position: left top;
    }
    h1 {
        color: white;
        text-align: center;
      }
      
      p {
        font-family: verdana;
        font-size: 20px;
      }

      .divClara{
        display: flex;
        justify-content: center;
      }

      .clara {
        position: absolute;
        margin-top: 5%;
        max-width: 60%;
        max-height: 60%;
      }
    
      .fade {
        position:fixed;
        width: 100%;
        height: 25%;
        bottom:0px;
    }
    
    .follow {
        position: absolute;
        bottom: 15%;
    }
    
    footer {
        align-items: center;
        justify-content: center;
        display: flex;
      }
    
    .socials {
        position: absolute;
        bottom: 6%;
    }
}