nav ul li a, nav ul li a:hover { 
    color: #fff; 
}
#top, #bottom { 
    background: #fff; 
}
nav { 
    background: rgba(0,0,0,0); 
}
nav ul { 
    background: #111; 
}
span {
    color:#fff;
}
input[type='number'] {
    display: inline-block;
    width: 40px;
    color: #000;
}

#page-1, #page-2, #page-3, #page-4, #page-5, #page-6, #page-7 {
    background-position: center;
    background-size: cover;
    backface-visibility: hidden;
    will-change: transform;
    background-repeat: no-repeat;
}
#page-1 {
    background: #000;
    background-image: url('../images/Alpha-Main-Speaker-Logo.jpg');
    height: 100vh;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 40%;
}
#page-2 {
    background-image: url('../images/Equipment-Rental.jpg');
    background-position: center;
}
#page-3-mobile {
    background-image: url('../images/System-Installations.JPG');
    background-size: cover;
    background-position: center;
}
#page-4 {
    background-image: url('../images/Live-Shows.JPG');
}

#page-5 {
    background: none;
}
#page-5-mobile {
    background-image: url('../images/clients2.jpg');
    background-position: 50% 100%;
    background-size: cover;
}
#page-6 {
    background-image: url('../images/tech.JPG');
    background-size: contain;
}
#page-7 {
    background-image: url('../images/Metal-Grill.JPG');
    height: auto;
    pointer-events: none;
}
#page-1, #page-3, #page-5, #page-7 {
    background-attachment: scroll;
}

#contact {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    pointer-events: all;
}

#contact .centered {
    margin: 10vh 0 0 0;
}
.x {
  width: 70vw !important;
}


#contactForm {
    color: #000;
}

form label {
    font-weight: 400;
    margin-right: 15px;
    color: #fff;
}

/* Flexbox container for rows */
.form-row {
    display: flex;
    justify-content: space-between;
}

/* Style each form group with some margin */
.form-group {
    margin-right: 15px;
    flex: 1;
}

/* Ensure input fields take full width of the form-group */
.form-group input {
    width: 100%;
    border-radius: 6px;
    border: 1px solid #999;
    padding: 0.5em 1em 0.5em 1em;
    font-size: 0.8em;
}
.form-group textarea {
    width: 100%;
    border-radius: 6px;
    padding: 0.5em 1em 0.5em 1em;
    font-size: 0.8em;
}
#id_checkbox {
    width: auto;
}
input[type=submit] {
    width: 25%;
    min-width: 150px;
    margin-bottom: 2vh;
    border-radius:6px;
    border: 2px solid #1188ff;
    background: none;
    color: #1188ff;
    padding-left: 0;
    cursor: pointer;
    transition: 0.1s;
    -webkit-transition: 0.1s;
}
input[type=submit]:hover {
    background: #1188ff;
    color: #fff;
    transition: 0.1s;
    -webkit-transition: 0.1s;
}

.social-link:hover, .social-link:active {
    text-decoration: none;
}
.social {
    margin-right: 18px;
}
.fb {
    height: 35px;
}
.yt {
    height: 35px;
}
.ig {
    height: 30px;
}
.li {
    height: 30px;
}
#footer {
    background: #000;
    color: #aaa;
    height: 22px;
    font-size: 0.7em;
    text-align: center;
}
#footer p {
    margin: 0 !important;
    padding: 3px 0;
}


@media all and (min-width: 1281px) {
    nav { background: rgba(0,0,0,0); }
    nav ul { background: none; }

    #page-7 {
        height: 100vh;
    }
    #contact h1 {
        text-align: center;
    }
    form div {
        margin: 0;
    }
    #page-1, #page-3, #page-5, #page-7 {
        background-attachment: fixed;
        background-size: cover;
    }
    #page-3 {
        background-image: url('../images/System-Installations.JPG');
        background-position: 33% 0%;
        background-size: cover;
    }
    #page-3-mobile {
        background: none;
    }
    #page-5 {
        background-image: url('../images/clients2.jpg');
        background-position: right;
        background-size: cover;
    }
    #page-5-mobile {
        background: none;
    }
    .dark {
        background: none;
    }
    .grey {
        color: #fff;
    }
    .grey .btn {
        background: #000;
        border: 2px solid #000;
        color: #000;
    }
    .grey .btn::before {
        background: var(--grey-color);
    }
    .grey .btn::before, .tan .btn:hover {
        background: var(--grey-color);
    }
    .grey .btn::after {
        background: #000;
    }
    .grey .btn:hover {
        color: #fff;
        background: var(--grey-color);
    }
    .btn-inverse {
        border: 2px solid #fff;
        color: #fff;
    }
    .btn-inverse:hover { color: #000; }
    .btn-inverse:before {
        background: #fff;
    }
    .btn-inverse::after {
        background: #fff;
    }
    .btn-inverse:hover::after {
        background: #fff;
    }
    .form-group input, .form-group textarea {
        font-size: 1em;
    }
}

@media all and (min-width: 1024px) and (max-width: 1280px) {
    nav { background: rgba(0,0,0,0); }
    nav ul { background: none; }

    #page-7 {
        height: 100vh;
    }
    #contact h1 {
        text-align: center;
    }
    form div {
        margin: 0;
    }
    #page-1, #page-3, #page-5, #page-7 {
        background-attachment: fixed;
        background-size: cover;
    }
    #page-3 {
        background-image: url('../images/System-Installations.JPG');
        background-position: 33% 0%;
        background-size: cover;
    }
    #page-3-mobile {
        background: none;
    }
    #page-5 {
        background-image: url('../images/clients2.jpg');
        background-position: right;
        background-size: cover;
    }
    #page-5-mobile {
        background: none;
    }
    .dark {
        background: none;
    }
    .grey {
        color: #fff;
    }
    .grey .btn {
        background: #000;
        border: 2px solid #000;
        color: #000;
    }
    .grey .btn::before {
        background: var(--grey-color);
    }
    .grey .btn::before, .tan .btn:hover {
        background: var(--grey-color);
    }
    .grey .btn::after {
        background: #000;
    }
    .grey .btn:hover {
        color: #fff;
        background: var(--grey-color);
    }
    .btn-inverse {
        border: 2px solid #fff;
        color: #fff;
    }
    .btn-inverse:hover { color: #000; }
    .btn-inverse:before {
        background: #fff;
    }
    .btn-inverse::after {
        background: #fff;
    }
    .btn-inverse:hover::after {
        background: #fff;
    }
    .form-group input, .form-group textarea {
        font-size: 1em;
    }
}




@media (hover: none) {
  #page-1, #page-3, #page-5, #page-7 {
    background-attachment: scroll !important;
  }
}