/* Big tablets to 1200px (width smaller than the 1140px row) */
@media only screen and (max-width: 1200px) {
    
    .hero-text-box { width: 100%; }
    
    .row { padding: 0 2%; }
    
    /* .teamspeak-screen { 
        width: 95%;
        margin-left: 5%;
    } */
    
    .teamspeak-text-box { padding: 0 3%; }
    
    .teamspeak-text-box p { font-size: 90%; }
    
    .footer-row { width: 80%; }
}



/* Small tablets to big tablets: from 768px to 1023px */
@media only screen and (max-width: 1023px) {
    
    body { font-size: 18px; }
    
    section { padding: 50px 0; }
    
    .hero-text-box { padding-top: 110px; }
    
    .teamspeak-text-box p { font-size: 75%; }
    
    .contact-form { width: 80%; }
    
    .navbar { min-height: 50px; }
    
    .navbar .row { padding: 0 4%; }
    
    .logo { height: 30px; }

    .main-nav { line-height: 30px; }
    
    .legal-notice {
        padding-top: 110px;
        padding-bottom: 60px;
    }
}



/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
    
    body { font-size: 16px;}
    
    section { padding: 25px 0; }
    
    .row{ padding: 0 4%; }
    
    .col { 
        width: 100%;
        margin: 0 0 4% 0;
    }
    
    h1 { font-size: 450%; }
    
    h2 { font-size: 190%; }
    
    h3 { font-size: 160%; }
    
    .hero-text-box p { 
        width: 100%;
        font-size: 90%;
        margin: 0;
        padding: 0 5%;
    }
    
    /*.main-nav { display: none; }*/ 
    .mobile-nav-icon { display:inline-block; }
    
    .main-nav {
        display: none;
        float:left;
        margin-left: 50px;
        margin-top: 0;
    }
    
    .main-nav li {
        display: block;
        font-size: 110%;
    }
    
    .main-nav li a:link,
    .main-nav li a:visited {
        display: block;
        border: 0;
        padding-top: 10px;
    }
    
    .btn,
    input[type=submit] { font-size: 85%; }
    
    /* .teamspeak-screen { width: 60%; margin: 0 20%; }/ */
    
    .teamspeak-text-box p { font-size: 85%; }
        
    .footer-row { width: 100%; }
    
    .copyright { 
        width: 100%;
        text-align: center
    }
    
    .footer-links {
        width: 100%;
        text-align: center;
    }
    
    .legal-notice {
        padding-top: 90px;
        padding-bottom: 40px;
    }
}



/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px) {
    
    .contact-form { width: 100%; }
    
    .legal-notice {
        padding-top: 75px;
        padding-bottom: 25px;
    }
}