/* THE FOLLOWING SECTION IS TO STYLE CONTENT */


body{
    background-color: black;
    border: 0;
    margin: 0;
    padding:0;
    vertical-align: middle;
    scroll-snap-align: middle;
}



img{
    width: 80px;
    height: 80px;
    padding-left: 50px;
    padding-top: 20px;
    padding-bottom: 20px;
    float: left;
    
}

p{

    color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 50px;  
    height: auto;
    
}


.footer{

    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background-color: white;
    text-align: center; 
    justify-items: center;
    padding-bottom: 60px;
}


/* THE FOLLOWING SECTION IS TO ALIGN CONTENT */

.nav{
width: 100%;   
text-align: center;
justify-content: center;
align-items: center;
background-color: black;
height: auto;
}

header{
    height: 100px;
}
.intro{   
    padding-left: 50px;
    padding-right: 50px;
    background-color: black;
    justify-content: center; 
    height: fit-content;   
    border: auto;
}

li{
    padding: 10px;
    list-style-type: none;
    text-decoration: none;  
    padding-bottom: 20px;
    
}

ul{
    float: right;
}

a{
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    background: -webkit-linear-gradient(#405DE6, #5815DB, #833AB4, #C13584, #E1306C, #FD1D1D); -webkit-background-clip: text; -webkit-text-fill-color: transparent;;
    font-size: 50px;
    padding: 20px;
}

a :hover {
    font-weight: bolder;
}

li :hover{

    font-weight: bolder;
}


@media only screen and (min-width: 700px) and (max-width: 1024px) {
    .intro {
      margin-top: 300px;
    }
  }