body {
    background: #170124;
    color: white;
    font-family: 'Source Sans Pro', sans-serif;
}

button:focus, input:focus, textarea:focus {
    outline: 0;
}

.link {
    color: white;
    font-weight: 600;
}

.link:hover {
    color: white;
}

#triangle-1 {
    width: 0;
    height: 0;
    border-left: 325px solid transparent;
    border-right: 325px solid transparent;
    border-top: 325px solid rgba(255,255,255,.11);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    position: fixed;
    bottom: 0;
    left: -155px;
}

#triangle-2 {
    width: 0;
    height: 0;
    border-left: 175px solid transparent;
    border-right: 175px solid transparent;
    border-top: 175px solid rgba(255,255,255,.07);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    position: fixed;
    right: -73px;
    top: 10px;
}

#buttons {
    width: 100px;
    height: 99.5%;
    margin: 0 auto;
    vertical-align: middle;
    display: flex;
    justify-content: center;
}

#divider {
    border: solid 3px white;
    width: 0px;
    height: 90%;
    margin: 0 auto;
    align-self: center;
}

.circle {
    width: 50px;
    height: 50px;
    background: white;
    border-radius: 50%;
    position: absolute;
    align-self: center;
    margin: 0 auto;
    z-index: 5;
}

.icos {
    background: white;
    border-radius: 50%;
    position: absolute;
    align-self: center;
    margin: 0 auto;
    z-index: 5;
    color: #170124;
}

#facebook {
    -webkit-transform: translateY(-25vh);
    -moz-transform: translateY(-25vh);
    -ms-transform: translateY(-25vh);
    -o-transform: translateY(-25vh);
    transform: translateY(-25vh);
}

#fb-ico {
    -webkit-transform: translateY(-25vh) translateY(1px);
    -moz-transform: translateY(-25vh) translateY(1px);
    -ms-transform: translateY(-25vh) translateY(1px);
    -o-transform: translateY(-25vh) translateY(1px);
    transform: translateY(-25vh) translateY(1px);
    background: none;
}

#email {
    -webkit-transform: translateY(25vh);
    -moz-transform: translateY(25vh);
    -ms-transform: translateY(25vh);
    -o-transform: translateY(25vh);
    transform: translateY(25vh);
}

#em-ico {
    -webkit-transform: translateY(25vh);
    -moz-transform: translateY(25vh);
    -ms-transform: translateY(25vh);
    -o-transform: translateY(25vh);
    transform: translateY(25vh);
    background: none;
}

#vid-ico {
    -webkit-transform: translateX(2px) translateY(1px);
    -moz-transform: translateX(2px) translateY(1px);
    -ms-transform: translateX(2px) translateY(1px);
    -o-transform: translateX(2px) translateY(1px);
    transform: translateX(2px) translateY(1px);
    background: none;
}

.circle:hover, .icos:hover {
    cursor:pointer;
}

#nav {
    position:absolute;
    top: 0;
    left: 0;
    height: 99.5%;
    width: 50%;
}

.info {
    position:absolute;
    top: 0;
    left: 49.5%;
    height: 99.5%;
    width: 50%;
}

#logo {
    margin: 0 auto;
    width: 198px;
    font-family: 'Abril Fatface';
    font-weight: 100;
    font-size: 130px;
    -webkit-transform: translateY(10vh);
    -moz-transform: translateY(10vh);
    -ms-transform: translateY(10vh);
    -o-transform: translateY(10vh);
    transform: translateY(10vh);
}

.letter {
    display: inline-block;
    height: 0px;
    margin-top: 0px;
}

.dub {
    -webkit-transform: translateX(-37px);
    -moz-transform: translateX(-37px);
    -ms-transform: translateX(-37px);
    -o-transform: translateX(-37px);
    transform: translateX(-37px);
    margin-right: -37px;
}

#menu {
    margin: 0 auto;
    font-size: 23px;
    font-weight: 100;
    text-align: center;
    width: 100px;
    -webkit-transform: translateY(10vh);
    -moz-transform: translateY(10vh);
    -ms-transform: translateY(10vh);
    -o-transform: translateY(10vh);
    transform: translateY(10vh);
}

.menu-item {
    margin-top: 45px;
    margin-bottom: 0px;
}

.menu-item:hover {
    cursor: pointer;
}

.selected {
    height: 0px;
    border: solid 2px white;
    margin: 0 auto;
    padding: 0px;
    margin-top: 3px;
    transition: opacity 0.3s linear;
}

#about {
    width: 60px;
}

#members {
    width: 90px;
    opacity: 0;
}

#repertoire {
    width: 95px;
    opacity: 0;
    
}

#de-repertoire {
    height: 100%;
    overflow-x: scroll;
}

#contact {
    width: 100px;
    opacity: 0;
}

#about-nav:hover + #about {
    opacity: 1 !important;
}

#members-nav:hover + #members {
    opacity: 1 !important;
}

#repertoire-nav:hover + #repertoire {
    opacity: 1 !important;
}

#contact-nav:hover + #contact {
    opacity: 1 !important;
}


#about-blob {
    width: 58%;
    height: 60%;
    margin: 0 auto;
    -webkit-transform: translateY(15vh) translateX(20px);
    -moz-transform: translateY(15vh) translateX(20px);
    -ms-transform: translateY(15vh) translateX(20px);
    -o-transform: translateY(15vh) translateX(20px);
    transform: translateY(15vh) translateX(20px);
    font-size: 21px;
    font-weight: 100;
}

#repertoire-list {
    text-align: center;
    font-size: 22px;
    font-weight: 100;
    width: 58%;
    height: 60%;
    margin: 0 auto;
    -webkit-transform: translateY(15vh) translateX(20px);
    -moz-transform: translateY(15vh) translateX(20px);
    -ms-transform: translateY(15vh) translateX(20px);
    -o-transform: translateY(15vh) translateX(20px);
    transform: translateY(15vh) translateX(20px);
}

#members-div {
    width: 58%;
    height: 60%;
    margin: 0 auto;
    -webkit-transform: translateY(12vh) translateX(20px);
    -moz-transform: translateY(12vh) translateX(20px);
    -ms-transform: translateY(12vh) translateX(20px);
    -o-transform: translateY(12vh) translateX(20px);
    transform: translateY(12vh) translateX(20px);
}

.random {
    display:none;
}

.row {
    margin: 0 auto;
    width: 93%;
}

.person {
    width: 63px;
    height: 63px;
    margin: 5px;
    border-radius: 50%;
}

.person:hover {
    cursor: pointer;
    -webkit-transform: scale(1.8) !important;
    -moz-transform: scale(1.8) !important;
    -ms-transform: scale(1.8) !important;
    -o-transform: scale(1.8) !important;
    transform: scale(1.8) !important;
    z-index: 11 !important;
}

.elizabeth {
    background: url('../img/liz.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.kim {
    background: url('../img/kim.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.elissa {
    background: url('../img/elissa.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.gio {
    background: url('../img/gio.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.renee {
    background: url('../img/renee.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.gaby {
    background: url('../img/gaby.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.julianne {
    background: url('../img/julianne.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.faith {
    background: url('../img/faith.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.trinity {
    background: url('../img/trinity.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.ri {
    background: url('../img/ri.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.tiffany {
    background: url('../img/tiffany.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.rebecca {
    background: url('../img/rebecca.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.dj {
    background: url('../img/dj.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

.lily {
    background: url('../img/lily.jpg');
    background-position: center;
    background-size: cover;
    background-repeat: none;
}

#member-information {
    padding-top: 30px;
    padding-left: 25px;
}

#name {
    font-size: 22px;
    margin-bottom: -2px;
}

#place {
    padding-bottom: 10px;
}

#divid {
    padding: 0px;
    margin-top: -1px;
    margin-bottom: 8px;
}

strong {
    font-weight: 600;
}

.info-mem {
    font-weight: 100;
    font-size: 15px;
}

.song-div {
    margin-top: 15px;
    margin-bottom: 15px;
}

#contact-section { 
    font-size: 22px;
    font-weight: 100;
    width: 58%;
    height: 60%;
    margin: 0 auto;
    -webkit-transform: translateY(20vh) translateX(20px);
    -moz-transform: translateY(20vh) translateX(20px);
    -ms-transform: translateY(20vh) translateX(20px);
    -o-transform: translateY(20vh) translateX(20px);
    transform: translateY(20vh) translateX(20px);
}

#name1, #email1, #message {
    background: rgba(0,0,0,0);
    border: none;
    border-bottom: solid 1px white;
    width: 100%;
    margin-bottom: 10px;
    border-radius: 0px;
}

#submit_button {
    border: none;
    background: rgba(0,0,0,0);
    border-bottom: dotted 3px white;
    float: right;
    border-radius: 0px;
}

#submit_button:hover {
    border-bottom: solid 3px white;
}

#thanks { 
    text-align: center;
    font-size: 40px;
    font-weight: 500;
    width: 58%;
    height: 60%;
    margin: 0 auto;
    -webkit-transform: translateY(20vh) translateX(20px);
    -moz-transform: translateY(20vh) translateX(20px);
    -ms-transform: translateY(20vh) translateX(20px);
    -o-transform: translateY(20vh) translateX(20px);
    transform: translateY(20vh) translateX(20px);
}

.getback {
    font-size: 20px;
    font-weight: 100;
}

.opb {
    font-size: 16px;
    display: inline-block;
}

.mobile-menu {
    color: white;
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: 5;
    display: none;
}

.mobile-menu:hover {
    cursor:pointer;
}

.new-c {
    width: 41px;
    height: 41px;
}

#facebook-2 {
    position: absolute;
    top: 30px;
    left: 30px;
}

#videos-2 {
    position: absolute;
    top: 30px;
    left: 85px;
}

#email-2 {
    position: absolute;
    top: 30px;
    left: 140px;
}

#fb-ico-2 {
    position: absolute;
    top: 45px;
    left: 45px;
}

#vid-ico-2 {
    position: absolute;
    top: 44px;
    left: 100px;
}

#em-ico-2 {
    position: absolute;
    top: 44px;
    left: 151px;
}

#more-buttons {
    visibility: hidden;
}

@media (max-width: 1238px) {
    #about-blob {
        width: 65%;
    }
}

@media (max-width: 1260px) {
    #members-div {
        width: 64%;
    }
}

@media (max-width: 1120px) {
    #about-blob {
        width: 70%;
    }
}

@media (max-width: 1142px) {
    #members-div {
        width: 70%;
    }
}

@media (max-width: 1025px) {
    #about-blob {
        -webkit-transform: translateY(12vh) translateX(20px);
        -moz-transform: translateY(12vh) translateX(20px);
        -ms-transform: translateY(12vh) translateX(20px);
        -o-transform: translateY(12vh) translateX(20px);
        transform: translateY(12vh) translateX(20px);
    }
}

@media (max-width: 1044px) {
    #members-div {
        width: 75%;
    }
}

@media (max-width: 1026px) {
    #repertoire-list {
        width: 65%;
    }
}

@media (max-width: 1079px) {
    #contact-section {
        width: 65%;
    }
}

@media (max-width: 1006px) {
    #about-blob {
        font-size: 20px;
        -webkit-transform: translateY(15vh) translateX(20px);
        -moz-transform: translateY(15vh) translateX(20px);
        -ms-transform: translateY(15vh) translateX(20px);
        -o-transform: translateY(15vh) translateX(20px);
        transform: translateY(15vh) translateX(20px);
    }
}

@media (max-width: 974px) {
    #members-div {
        width: 80%;
    }
}

@media (max-width: 915px) {
    #repertoire-list {
        width: 70%;
    }
}

@media (max-width: 961px) {
    #contact-section {
        width: 70%;
    }
}

@media (max-width: 906px) {
    #about-blob {
        font-size: 20px;
        -webkit-transform: translateY(13vh) translateX(20px);
        -moz-transform: translateY(13vh) translateX(20px);
        -ms-transform: translateY(13vh) translateX(20px);
        -o-transform: translateY(13vh) translateX(20px);
        transform: translateY(13vh) translateX(20px);
    }
}

@media (max-width: 913px) {
    #members-div {
        -webkit-transform: translateY(12vh) translateX(10px);
        -moz-transform: translateY(12vh) translateX(10px);
        -ms-transform: translateY(12vh) translateX(10px);
        -o-transform: translateY(12vh) translateX(10px);
        transform: translateY(12vh) translateX(10px);
        width: 85%;
    }
}

@media (max-width: 893px) {
    #contact-section {
        width: 75%;
    }
}

@media (max-width: 833px) {
    #about-blob {
        font-size: 19px;
        -webkit-transform: translateY(13vh) translateX(20px);
        -moz-transform: translateY(13vh) translateX(20px);
        -ms-transform: translateY(13vh) translateX(20px);
        -o-transform: translateY(13vh) translateX(20px);
        transform: translateY(13vh) translateX(20px);
    }
}

@media (max-width: 860px) {
    #members-div {
        -webkit-transform: translateY(12vh) translateX(10px);
        -moz-transform: translateY(12vh) translateX(10px);
        -ms-transform: translateY(12vh) translateX(10px);
        -o-transform: translateY(12vh) translateX(10px);
        transform: translateY(12vh) translateX(10px);
    }
    .person {
        height: 63px;
        width: 63px;
    }
}

@media (max-width: 850px) {
    #repertoire-list {
        width: 75%;
    }
}

@media (max-width: 834px) {
    #contact-section {
        width: 80%;
    }
}

@media (max-width: 796px) {
    #de-repertoire {
        height: auto;
        overflow-x: visible;
    }

    .mobile-menu {
        display: block;
    }
    
    #buttons {
        display: none;
    }
    
    #nav {
        width: 100%;
    }
    
    .info {
        left: 0;
        width: 100%;
        height: auto;
    }
    
    #menu {
        visibility: hidden;
    }
    
    #about-blob {
        -webkit-transform: translateY(calc(10vh + 190px)) translateX(0px);
        -moz-transform: translateY(calc(10vh + 190px)) translateX(0px);
        -ms-transform: translateY(calc(10vh + 190px)) translateX(0px);
        -o-transform: translateY(calc(10vh + 190px)) translateX(0px);
        transform: translateY(calc(10vh + 190px)) translateX(0px);
        width: 80%;
        font-size: 18px;
        padding-bottom: 40px;
        text-align: center;
    }
    
    #members-div {
        width: 90%;
        -webkit-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -moz-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -ms-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -o-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        transform: translateY(calc(10vh + 190px)) translateX(-5px);
        padding-bottom: 40px;
    }
    
    .row {
        transform: translateX(10px);
    }
    
    #repertoire-list {
        width: 70%;
        -webkit-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -moz-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -ms-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -o-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        transform: translateY(calc(10vh + 190px)) translateX(-5px);
        padding-bottom: 40px;
    }
    
    #contact-section {
        width: 70%;
        -webkit-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -moz-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -ms-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -o-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        transform: translateY(calc(10vh + 190px)) translateX(-5px);
        padding-bottom: 50px;
    }
    
    #thanks {
        -webkit-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -moz-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -ms-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        -o-transform: translateY(calc(10vh + 190px)) translateX(-5px);
        transform: translateY(calc(10vh + 190px)) translateX(-5px);
        padding-bottom: 50px;
    }
    
    #menu {
        padding-bottom: 40px;
    }
    
    #more-buttons {
        visibility: visible;
    }
    
    #about-blob, #contact-section, #repertoire-list, .info-mem, .get-back {
        font-weight: 300;
    }
}

@media (max-width: 500px) {
    #contact-section {
        width: 80%;
    }
}

@media (max-width: 552px) {
    #triangle-1 {
        border-left: 170px solid transparent;
        border-right: 170px solid transparent;
        border-top: 170px solid rgba(255,255,255,.11);
        left: -85px;
    }
    
    #triangle-2 {
        border-left: 120px solid transparent;
        border-right: 120px solid transparent;
        border-top: 120px solid rgba(255,255,255,.07);
        right: -50px;
    }
}

@media (min-width: 797px) and (max-height: 670px) { 
    #about-blob {
        font-size: 17px;
    }
}

@media (min-width: 797px) and (max-height: 689px) { 
    #members-div {
        -webkit-transform: translateY(8vh) translateX(10px);
        -moz-transform: translateY(8vh) translateX(10px);
        -ms-transform: translateY(8vh) translateX(10px);
        -o-transform: translateY(8vh) translateX(10px);
        transform: translateY(8vh) translateX(10px);
    }
}

@media (min-width: 797px) and (max-height: 654px) { 
    #members-div {
        -webkit-transform: translateY(8vh) translateX(10px);
        -moz-transform: translateY(8vh) translateX(10px);
        -ms-transform: translateY(8vh) translateX(10px);
        -o-transform: translateY(8vh) translateX(10px);
        transform: translateY(8vh) translateX(10px);
    }
    .person {
        width: 50px;
        height: 50px;
    }
    
    #member-information {
        margin-top: -20px;
    }
}

@media (min-width: 797px) and (max-height: 575px) { 
    #members-div {
        -webkit-transform: translateY(8vh) translateX(10px);
        -moz-transform: translateY(8vh) translateX(10px);
        -ms-transform: translateY(8vh) translateX(10px);
        -o-transform: translateY(8vh) translateX(10px);
        transform: translateY(8vh) translateX(10px);
    }
    .person {
        width: 45px;
        height: 45px;
    }
    
    #member-information {
        margin-top: -10px;
    }
}

@media (min-width: 797px) and (max-height: 524px) { 
    #members-div {
        -webkit-transform: translateY(8vh) translateX(10px);
        -moz-transform: translateY(8vh) translateX(10px);
        -ms-transform: translateY(8vh) translateX(10px);
        -o-transform: translateY(8vh) translateX(10px);
        transform: translateY(8vh) translateX(10px);
    }
    .person {
        width: 40px;
        height: 40px;
    }
    
    #member-information {
        margin-top: -15px;
    }
}

@media (min-width: 797px) and (max-height: 576px) { 
    #about-blob {
        font-size: 16px;
    }
    
    #triangle-1 {
        border-left: 170px solid transparent;
        border-right: 170px solid transparent;
        border-top: 170px solid rgba(255,255,255,.11);
        left: -85px;
    }
    
    #triangle-2 {
        border-left: 120px solid transparent;
        border-right: 120px solid transparent;
        border-top: 120px solid rgba(255,255,255,.07);
        right: -50px;
    }
    
}

@media (min-width: 797px) and (max-height: 481px) { 
    #about-blob {
        font-size: 15px;
    }
}

@media (min-width: 797px) and (max-height: 440px) { 
    #about-blob {
        font-size: 14px;
    }
}

@media (min-width: 797px) and (max-height: 577px) { 
    #repertoire-list {
        -webkit-transform: translateY(10vh) translateX(20px);
        -moz-transform: translateY(10vh) translateX(20px);
        -ms-transform: translateY(10vh) translateX(20px);
        -o-transform: translateY(10vh) translateX(20px);
        transform: translateY(10vh) translateX(20px);
        font-size: 18px;
    }
    
    .opb {
        font-size: 14px;
    }
}

@media (min-width: 797px) and (max-height: 497px) { 
    #repertoire-list {
        -webkit-transform: translateY(10vh) translateX(20px);
        -moz-transform: translateY(10vh) translateX(20px);
        -ms-transform: translateY(10vh) translateX(20px);
        -o-transform: translateY(10vh) translateX(20px);
        transform: translateY(10vh) translateX(20px);
        font-size: 18px;
    }
    
    .opb {
        font-size: 14px;
    }
    
    .song-div {
        margin-top: 11.5px;
        margin-bottom: 11.5px;
    }
}


@media (min-width: 797px) and (max-height: 527px) { 
    #contact-section {
        -webkit-transform: translateY(15vh) translateX(20px);
        -moz-transform: translateY(15vh) translateX(20px);
        -ms-transform: translateY(15vh) translateX(20px);
        -o-transform: translateY(15vh) translateX(20px);
        transform: translateY(15vh) translateX(20px);
    }
    
}

@media (min-width: 797px) and (max-height: 490px) { 
    #contact-section {
        -webkit-transform: translateY(10vh) translateX(20px);
        -moz-transform: translateY(10vh) translateX(20px);
        -ms-transform: translateY(10vh) translateX(20px);
        -o-transform: translateY(10vh) translateX(20px);
        transform: translateY(10vh) translateX(20px);
    }
    
}

@media (min-width: 797px) and (max-height: 460px) { 
    #name1, #email1, #message {
        margin-bottom: 6px;
    }
    #contact-section {
        -webkit-transform: translateY(9vh) translateX(20px);
        -moz-transform: translateY(9vh) translateX(20px);
        -ms-transform: translateY(9vh) translateX(20px);
        -o-transform: translateY(9vh) translateX(20px);
        transform: translateY(9vh) translateX(20px);
    }
    
}

@media (min-width: 797px) and (max-height: 656px) { 
    #logo {
        font-size: 130px;
        -webkit-transform: translateY(5vh);
        -moz-transform: translateY(5vh);
        -ms-transform: translateY(5vh);
        -o-transform: translateY(5vh);
        transform: translateY(5vh);
    }
    
    #menu {
        -webkit-transform: translateY(5vh);
        -moz-transform: translateY(5vh);
        -ms-transform: translateY(5vh);
        -o-transform: translateY(5vh);
        transform: translateY(5vh);
    }
}

@media (min-width: 797px) and (max-height: 592px) { 
    
    .menu-item {
        margin-top: 35px;
    }
}

@media (min-width: 797px) and (max-height: 570px) { 
    
    #menu {
        -webkit-transform: translateY(3vh);
        -moz-transform: translateY(3vh);
        -ms-transform: translateY(3vh);
        -o-transform: translateY(3vh);
        transform: translateY(3vh);
    }
}

@media (min-width: 797px) and (max-height: 528px) { 
    
    #menu {
       -webkit-transform: translateY(0vh);
        -moz-transform: translateY(0vh);
        -ms-transform: translateY(0vh);
        -o-transform: translateY(0vh);
        transform: translateY(0vh);
    }
}

@media (min-width: 797px) and (max-height: 518px) { 
    
    .menu-item {
        margin-top: 30px;
    }
}

@media (min-width: 797px) and (max-height: 488px) { 
    
    .menu-item {
        margin-top: 27px;
    }
}

@media (min-width: 797px) and (max-height: 470px) { 
    #logo {
        font-size: 130px;
        -webkit-transform: translateY(3vh);
        -moz-transform: translateY(3vh);
        -ms-transform: translateY(3vh);
        -o-transform: translateY(3vh);
        transform: translateY(3vh);
    }
    
    #menu {
        -webkit-transform: translateY(-4vh);
        -moz-transform: translateY(-4vh);
        -ms-transform: translateY(-4vh);
        -o-transform: translateY(-4vh);
        transform: translateY(-4vh);
    }
}

@media (min-width: 797px) and (max-height: 446px) { 
    
    .menu-item {
        margin-top: 22px;
    }
}