header{width:100%;height:10%;color:#fff;padding:0 1rem;margin-top:10px}nav{width:100%;height:100%;display:flex;justify-content:space-between;align-items:center}.toggle{display:none}.menu{display:flex;justify-content:space-between;align-items:center;list-style:none;width:250px;z-index:2}.menu li a{color:#fff;text-decoration:none;position:relative;letter-spacing:1px;text-transform:uppercase;transition:.8s;user-select:none}.menu li a:hover{color:var(--mainColor)}.logo{font-size:1.5rem;transition:.8s}.logo:hover{font-size:1.5rem;transform:scale(1.5)}@media all and (max-width: 768px){.toggle{display:block;font-size:2rem;cursor:pointer;z-index:20}.logo{z-index:20}.open{display:block}.close,.isOpen .open{display:none}.isOpen .close{display:block}.menu{position:absolute;top:0;left:0;width:100%;height:100vh;background:black;flex-direction:column;padding:5rem;justify-content:space-around;transform:translateY(-100%);transition:1s ease}.isOpen .menu{transform:translate(0)}.menu li a{font-size:1.5rem}.contact-box{grid-template-columns:1fr}.left{height:100px}}footer{height:45px;display:flex;flex-direction:row;justify-content:center;align-items:center;border-top:1px solid white;color:#fff;text-transform:uppercase}footer a{margin-left:1rem}footer svg{transition:.5s}footer svg:hover{fill:red}