
*{
   margin: 0 auto;
   padding: 0 auto;
}




/* GENERAL */

.title{
    font-family: 'The Girl Next Door', sans-serif;
    font-size: calc(10px + 1.5vw);
}




/* LOGO */

.logo{
    width: 150px;
    height: auto;
    padding: 15px 15px;
    filter: drop-shadow(0 0 1px #f3f700);
}

.little-logo img{
    float: right;
   border-radius: 1px;
   transition: all .5s;
   -webkit-transition: all .5s;
}


.facebook img{
   position: fixed;
   width: 50px;
   height: auto;
   right: 0%;
   bottom: 15px;
   z-index: 2;
}
.mail img{
   border: 1px solid black;
   position: fixed;
   width: 50px;
   height: auto;
   right: 0%;
   bottom: 60px;
   z-index: 1;
}

.facebook img:hover, .mail img:hover{
   width: 60px;
   -webkit-box-shadow: 5px 6px 29px 2px rgba(0,0,0,0.74); 
   box-shadow: 5px 6px 29px 2px rgba(0,0,0,0.74);
   transform: translateY(-0.25em);
   z-index: 3;
}

.green-text{
   color: #A5B3C2;
}

/* BACKGROUND */

@media(max-width: 700px){

   .custom-bg{
      display: none;
   }

}

.custom-bg{
   z-index: -1;
   position: absolute;
   top: 780px;
   clip-path: polygon(0 31%, 100% 11%, 100% 90%, 0 100%);
   width: 100%;
   height: 100%;
   background-color: rgba(77, 57, 40, 0.2)
}


/* STEP */

#step img{
   filter: drop-shadow(2px 10px 15px rgba(0, 0, 0, 0.3));
}