* { padding: 0%; margin: 0%; font-family: 'Montserrat', sans-serif; -webkit-tap-highlight-color: transparent; } body { background-color: #001A35; } .menu { position: absolute; font-family: 'Open Sans', sans-serif; right: 0; } .sidebar { height: 100%; width: 0; position: fixed; z-index: 5; top: 0; right: 0; background-color: black; overflow-x: hidden; transition: 0.7s; padding-top: 40px; } .sidebar a:hover { color: #e9bd43; } .sidebar h1 { color: #e9bd43; font-size: 25px; padding-bottom: 5px; padding-left: 32px; } .sidebar a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; color: #818181; display: block; transition: 0.7s; } .sidebar .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; } .openbtn { display: block; font-size: 25px; font-weight: 300; cursor: pointer; position: relative; background-color: #001A35; color: #e9bd43; padding: 20px 15px; border: none; opacity: 1; transition: all 1s ease; } a { text-decoration: none; } .lo { display: flex; flex-direction: row; align-items: center; justify-content: center; } @media screen and (max-width:600px) { .logo { width: 40vw; height: 40vw; margin-top: 10vh; margin-bottom: 5vh; } h1 { color: #e9bd43; text-align: center; margin-bottom: 4vh; font-weight: 500; } .text { color: white; text-align: center; font-size: 18px; margin: 0px 10px 15px; } .contact { margin: 100px 150px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .fon { color: #e9bd43; } } @media screen and (min-width:600px) { .logo { width: 15vw; height: 15vw; margin-top: 10vh; margin-bottom: 5vh; } h1 { color: #e9bd43; text-align: center; margin-bottom: 4vh; font-weight: 500; } .text { color: white; text-align: center; font-size: 25px; margin: 0px 15vw 15px; } .contact { margin: 100px 45vw; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .fon { color: #e9bd43; } }