body{background-color: black;
  background-image: url(../img/5.jpg);
       padding: 10px 10px 10px 80px;

     background-repeat: no-repeat;
  background-attachment: fixed;
}
* {

}

.link a img { }
.link a {}
.link a:hover img { -webkit-filter: drop-shadow(0px 0px 8px rgba(0, 231, 255, 0.8));}
.link a span {}
.link a:hover span {}

.bottom {  position: relative;
  bottom: 0;}

h1 {text-align: center; font-weight: bold;
    text-justify: inter-word; color: white; font-style: normal; 
    font-size: 70px; font-family: "helvetica", helvetica, serif; 
    font-weight: normal; display: inline;  
   }

   h2 {text-align: center; font-weight: normal;
    text-justify: inter-word; color: black; font-style: normal; 
    font-size: 20px; font-family: "helvetica", helvetica, serif; 
    font-weight: normal; display: inline;  
  }

   h4{
    color:white; text-shadow: 2px 2px 10px white;
    font-weight: normal;
    text-decoration: none;
    font-size: 30px;
    font-family: "helvetica", helvetica, serif; 
    font-weight: normal; display: inline;  
    }


a {color:white; text-shadow: 2px 2px 10px black;   text-decoration: none;}
a:hover {
color: white;
text-shadow: 0px 0px 1px white;
}

p {color: white; font-family: "helvetica", helvetica, serif; }

 .return { 
  position: fixed;
  top: 90%;
  left: 5%;}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(30%, 1fr));
  gap: 20px;
  height: relative; 
}

.content {
  margin-left: 25%;
  margin-right: 15%;
}

.menu{  
  top:0;
  left: 0;
  margin-left: 0%;
  position: fixed;
  width: 300px;
  height: 100%;
  background-color: ;
}

.menu #content { 
  margin-left:10%;
 }

.menu img{
  width: 70%;
}


@media screen and (max-width:1000px){ 
  body {
    overflow: scroll; 
    padding: 0px;}

h1 {
  font-size: 10vw;
}

.content { 
  position: relative;
  margin-left: 15%;
  margin-right: 10%;
}

.menu{
  display:none ;

}

.gallery {
  margin-left: 15%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 20px;
}

.menu{  
  width: 100%;
}

.menu #content { 
  margin-left:10%;
  margin-right: 10%;
 }
 .menu #content #list {
  margin-left: 30%;
 }

.menu img{
  display: ;
  position: absolute;
    width: 150px;

}
 }

@media screen and (max-width:570px){ 
  
.bottom {  
  position: absolute;
  bottom:10% ;}


.menu{  
  width: 300px;
  margin-left:15%;
  position: ;

}

.menu #content { 
  margin-left:0%;
  margin-right: 10%;
 }

 .menu #content #list {
  margin-left: 0%;
 }

.menu img{
  position: relative;
    width: 70%;

}
    }