body{
     background-color: aqua;
     font-family: 'Belanosima', sans-serif;
     color: #E93490;
     margin: 0;
     display: flex;
     flex-direction: column;
     min-height: 100vh;
}
/*MENU*/
.menu{
    padding-left: 1rem;
    display: flex;
    flex-direction: column;
    align-self: flex-start;
    position: sticky;
    top: 20px;
    left: 0;
}
.tab{
     padding: 1rem;
     text-align: center;
     width: 10vw;
     margin-right: 10vw;
}
p{
     margin: 0;
}
a{
     text-decoration: none;
     color: #E93490;
}
a:hover{
     color: #fc9fce;
     text-decoration: underline;
}
footer{
     height: 2.5rem;
     background-color: #E93490;
     margin-top: auto;
     display: flex;
     align-items: center;
     justify-content: center;
     position: sticky;
     bottom: 0.0rem;
}
footer p{
     color: white;
     text-align: center;
}
/*MAIN*/
.main{
     display: flex;
}

/*GALLERY*/
.gallery{
     /*display: grid;
     grid-template-columns: 25% 25% 25% 25%;
     grid-template-rows: 20vw 20vw 20vw 20vw 20vw;*/
     display: flex; 
     align-items: flex-end;
     margin-left: auto;
     flex-wrap: wrap;
     justify-content: flex-end;
     width: 1000px;
}

.showcase{
     border:  0.15rem solid black;
     padding: 0.2rem;
}
.showcaseWrapper{
     margin: 1rem;
     align-self: center;
     background-color: white;
     padding: 0.5rem;
     padding-top: 0.5rem;
     border: 0.2rem solid black;
     box-shadow: 0.5rem 0.5rem #fc9fce, 0.5rem 0.5rem 0 0.15rem black;
}
/*.showcaseWrapper.B{
     grid-area: 2/1/3/3;
     width: 2fr;
}*/

/*CONTENT*/
.content{
     padding: 7vh;
     display: flex;
     flex-wrap: wrap;
}
.description{
     padding: 10vh;
     line-height: 2.8vh;
     font-size: 2vh;
}
.aboutme .content {
     flex-wrap: nowrap;
}
/*RESUME*/
.resume a{
    background-color: white;
    padding: 0.5rem;
    border-radius: 0.7rem;
}
.resume{
    margin: 2rem;
}
/* enbiggening */
.screen {
     opacity: 0;
     visibility: hidden;
     z-index: -1;
     height: 100vh;
     width: 100vw;
     position: fixed;
     left: 0;
     top: 0;
     background: rgba(0,0,0,0.4);
     transition: all 500ms;
}
.screen.show {
     display: block;
     opacity: 1;
     visibility: visible;
     z-index: 5;
}
.showcaseWrapper.big {
     position: fixed;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -55%);
     z-index: 5;
}
.showcaseWrapper.big img {
     max-height: 80vh;
     max-width: 90vw;
     width: auto;
     height: auto;
}

/*MEDIA QUERY*/
@media only screen and (max-width: 1400px) {
  .main, .content{
    display: block;
  }
  .gallery{
      width: 70vw;
      justify-content: space-evenly;
      margin-left:0;
      margin:auto;
  }
  .showcase img{
      max-width:100%;
  }
  .menu{
    flex-direction: row;
    justify-content: space-evenly;
    background-color: white;
    top:0;
  }
  .menu .tab{
      margin-right:0;
      width:20vw;
  }
  .menu img{
      height:35px;
  }
  .showcase iframe{
      height:70vw;
      width:100%;
  }
  .showcaseWrapper.big img {
     max-height: 80vh;
     max-width: 70vw;
}
.showcaseWrapper.big {
     transform: translate(-55%, -55%);
}
}