@font-face {
    font-family: "OpenSans_SemiBold";
    src: url("../fonts/OpenSans-SemiBold.ttf");
}

@font-face {
    font-family: "OpenSans_Bold";
    src: url("../fonts/OpenSans-Bold.ttf");
}

@font-face {
    font-family: "OpenSans_Reg";
    src: url("../fonts/OpenSans-Regular.ttf");
}

body {
    
    background: #000000;
    color: white;
    text-shadow: 1px 4px 2px rgba(0,0,0,0.25);
    width: 100%;
    
}

h1 {

    font: 5.5vw 'OpenSans_Bold', san-serif;

}

h2 {

    font: 3vw 'OpenSans_SemiBold', san-serif;

}

h3 {

    font: 2.5vw 'OpenSans_SemiBold', san-serif;
}

h4 {

    font: 2vw 'OpenSans_SemiBold', san-serif;
}

p {

    font: 1.5vw 'OpenSans_Reg', san-serif;
    line-height: 2em;

}

.rule-list {

    margin: 2em 1em 0 1em;
    padding: 0;
    font: 1.5 'OpenSans_Reg', san-serif;
    line-height: 2em;
}

.rule-list li {

    margin: 0 0 2em 0;

}

.rule-list a {

    color: black;
    text-decoration: underline;
}

.rule-list a:hover {

    color: black;
    text-decoration: underline;
}


.rally-green {

    color: #589E21;
    
}

.rally-red {

    color: #c32b13;
}

.rally-yellow {

    color: #e3a924;
    text-shadow: 1px 4px 2px rgba(0,0,0,0.05);
}






a:hover {

    text-decoration: none;
    color: white;
}


.rally-info {

    color: black;
}





.rules-section {

    margin: 2em 0 0 0;

}

.schedule-section {

    margin: 78vh 0 5vh 0;
    text-shadow: none;
    color: black;

}

.row-adjust {

    margin: 5vh 0 5vh 0;
}

.middle-info-adjust {

    margin: 99vh 0 2vh 0;
    text-shadow: none;
}

.top-information {

    background: #000 url('../img/top-bg.png') no-repeat;
    background-size: contain;
    width: 100vw;
    
}

.logo {

    text-align: center;
    
}

.porsche-banner {

    background: #f5f5f5 url('../img/middle-bg.jpg') no-repeat;
    background-size: contain;
    width: 100vw;
    
}

.contact-section {

    background: #000;
    width: 100vw;
    text-align:  center;
}


.register-btn {

    border-radius: 12px;
    border: none;
    outline: none;
    background: #589E21;
    /*opacity: 0.50;*/
    color: white;
    font: 22px 'OpenSans_SemiBold', san-serif;
    width: 200px;
    height: 45px;
    display: block;
    margin: 1em auto 0.5em auto;
    text-align: center;
    text-shadow: none;
    line-height: 1.90em;
    /*pointer-events: none;*/

}

.contact-btn {

    border-radius: 12px;
    border: none;
    outline: none;
    color: black;
    background: #ccc;
    font: 22px 'OpenSans_SemiBold', san-serif;
    width: 200px;
    height: 45px;
    display: block;
    margin: 2em auto 0.5em auto;
    text-align: center;
    text-shadow: none;
    line-height: 1.90em;

}


.footer-banner {

    background: #000000 url('../img/bottom-bg.png') no-repeat;
    background-position: top;
    width: 100vw;
    height: 423px;
}

/* IPhone and Pixel */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

    .schedule-section {

        margin: 30vh 0 5vh 0;
    
    }
    h2 {

        font: 4vw 'OpenSans_SemiBold', san-serif !important;
    
    }

    p {

        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    
    }

    ul {

        margin: 2em 1em 0 1em;
        padding: 0;
        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    }

}

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

    .schedule-section {

        margin: 30vh 0 5vh 0;
    
    }

    h2 {

        font: 4vw 'OpenSans_SemiBold', san-serif !important;
    
    }

    p {

        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    
    }

    
    ul {

        margin: 2em 1em 0 1em;
        padding: 0;
        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    }

}

/* Galaxy Phones */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 4) {

    h2 {

        font: 4vw 'OpenSans_SemiBold', san-serif !important;
    
    }

    .schedule-section {

        margin: 30vh 0 5vh 0;
    
    }

    p {

        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    
    }

    
    ul {

        margin: 2em 1em 0 1em;
        padding: 0;
        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    }
}

@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {

    .schedule-section {

        margin: 30vh 0 5vh 0;
    
    }

    h2 {

        font: 4vw 'OpenSans_SemiBold', san-serif !important;
    
    }

    p {

        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    
    }

    
    ul {

        margin: 2em 1em 0 1em;
        padding: 0;
        font: 2.8vw 'OpenSans_SemiBold', san-serif;
        line-height: 2em;
    }
}