header, .main-nav-mod {
    display: none !important; }
  
@media (min-width: 1260px) {
    #content {
        margin: 0px !important;
        max-width: none !important;
    }
}

#content {
    margin: 0px !important;
}
/* 
LAX GUIDE 2019 
COLORS
Primary Red: rgb(199, 61, 51);
Dark Grey: rgb(118, 120, 123);
Light Grey: rgb(209, 211, 213);

TYPOGRAPHY
font-family: jubilat_l;
font-family: jubliat_ml;
font dropcap: jubilat_ml; (60pt);
*/

/* font-declarations */

@font-face{
    font-family: jubilat_l;
    src: url("Jubilat-Light.otf")
}

@font-face{
    font-family: jubilat_ml;
    src: url("Jubilat-MediumItalic.otf")
}

@font-face{
    font-family: benton_l;
    src: url("BentonSans-Bold.otf")
}

/* main css */

html, body{
    scroll-behavior: smooth;
    margin: 0;
    padding: 0;
    font-family: jubilat_l;
}

body{
    margin: 0px;
    padding: 0px;
}

ul{
    padding: 0px;
}

/* navigation */ 

nav{
    height: 44px;
    background-color: rgb(199, 61, 51);
}

.navlinks{
    display: flex;
    position: fixed;
    width: 100%;
    z-index: 999;
    background-color: rgb(199, 61, 51);
    justify-content: space-between;
}

.navlinks ul{
    display: flex;
    justify-content: center;
    margin: 0px;
    padding: 0px;
}

.navlinks ul li{
    list-style: none;
    padding: 0px 17px;
}

.navlinks li a:hover{
    color: rgb(209, 211, 213);
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}

.navlinks ul li, 
.navlinks ul li a{
    color: #fff;
    line-height: 44px;
    text-decoration: none;
}

.responsiveNav{
    display: none;
}

.topresnavlinks{
    display: none;
}

.logotype{
    font-family: benton_l;
    letter-spacing: -3px;
    margin-right: 5px;
}

/* video header */

.video2{
    height: 100vh;
    width: 100%;
    margin-top: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}

h1{
    font-family: jubilat_l;
    font-size: 90px;
    color: #FFF;
    letter-spacing: 3px;
    margin: 0px;
    text-shadow: 2px 2px 5px black;
    text-transform: uppercase;
}

h2{
    margin: 10px 0px;
    color: white;
    text-shadow: 2px 2px 5px black;
}

i{
    color: rgb(199, 61, 51);
}

i:hover{
    color: rgb(118, 120, 123);
    -webkit-transition: color .2s ease-out;
  -moz-transition: color .2s ease-out;
  -o-transition: color .2s ease-out;
  transition: color .2s ease-out;
}

.explorelax{
    background-color: transparent;
        border: none;
        color: white;
        font-size: 30px;
        border-radius: 15px;
        -webkit-animation: action 2s infinite  alternate;
            animation: action 1s infinite  alternate;
        }
        @-webkit-keyframes action {
            0% { transform: translateY(0); }
            100% { transform: translateY(-5px); }
        }
        @keyframes action {
            0% { transform: translateY(0); }
            100% { transform: translateY(-5px); }
        }

        i{
            text-decoration: none;
        }


/* Main Content */

#panecontainer{
    width: 1000px;
    margin: 0 auto;
}

.dividingline{
    width: 100%;
    height: 2px;
    background-color: rgb(199, 61, 51);
    margin-bottom: 15px;
    margin-top: 15px;
}

/* Letter from the Editor */

.letterEditor{
    display: flex;
    padding: 40px 0px;
    justify-content: center;
}

.dividinglinef{
    background-color: transparent;
}

.letterEditor img{
    height: 500px;
}

.letterEditorRes{
    display: none;
}

/* Player Panes */

.title{
    text-align: center;
    width: 100%;
    font-size: 45px;
    color: rgb(199, 61, 51);
    margin-top: 20px;
    font-family: jubilat_ml;
}
.slideoutpanes{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.slideoutpanes img{
    width: 333px;
    
}

.slideoutpanes img:hover {
    background-color: rgb(209, 211, 213);
    -webkit-transition: background-color .2s ease-in;
    -moz-transition: background-color .2s ease-in;
    -o-transition: background-color .2s ease-in;
    transition: background-color .2s ease-in;
}

.slideoutpanes heropane img{
    z-index: 100;
}

.slideoutpanes_s{
    display: none;
}

/* Scroll Menu */

.scrollmenu{
    overflow: auto;
    max-width: 100%;  
    max-height: 100%;
    margin-bottom: 20px;
    margin-top: 20px;
}


/* Footer */

.footer{
    width: 100%;
    background-color:rgb(199, 61, 51);
    color: white;
    text-align: center;
}

.footer img{
    width: 200px;
    height: 42px;
    padding: 12px;
}

/* Responsive Navigation TABLET */

@media all and (max-width: 1035px){
    
.navlinks{
    visibility: hidden;
}
.titletype_s{
    font-size: 19px;
}
.logotype_s{
    font-size: 19px;
    font-family: benton_l;
}

.slideoutpanes{
    display: none;
}
    
.slideoutpanes_s {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.slideoutpanes_s img{
    width: 333px;
    
}

.slideoutpanes_s img:hover {
    background-color: rgb(209, 211, 213);
    -webkit-transition: background-color .2s ease-in;
    -moz-transition: background-color .2s ease-in;
    -o-transition: background-color .2s ease-in;
    transition: background-color .2s ease-in;
}

.heropane img{
    z-index: 100;
    width: 500px;
}
    
.responsiveNav{
    visibility:visible;
    display: flex;
    justify-content: space-between;
    position: fixed;
    width: 100%;
    height: 44px;
    z-index: 999;
    background-color: rgb(199, 61, 51);
}
    
.responsiveNav ul li{
    list-style: none;
    padding: 0px 30px;
}

.responsiveNav li a:hover{
    color: rgb(209, 211, 213);
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}

.responsiveNav ul li, 
.responsiveNav ul li a{
    color: #fff;
    line-height: 13px;
    text-decoration: none;
}
    
.responsiveNav ul li a button{
    margin-top: -8px;    }

.menuBtn {
    color: white;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 4px 0px 4px 8px;
}

.menuBtn i{
    font-size: 20px;
    color: white;
}
    
.menuBtn i:hover{
    color: rgb(209, 211, 213);
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}
    
.popoutnav{
    background-color: rgb(199, 61, 51);
    width: 100%;
    height: 100vh;
    position: fixed;
    top: -100vw;
    left: 0;
    z-index: 1000;
    visibility: hidden;
    opacity: 0;
    transition: all .4s;
}
    
.popoutnav.active{
    opacity: 1;
    top: 0;
    visibility: visible;
}
    
.topresnavlinks{
    width: 100%;
    display: flex;
    justify-content: flex-end;
    text-align: right;
    }
    
.topresnavlinks ul li{
    font-size: 30px;
    padding:15px 30px;
    list-style: none;
}
    
.topresnavlinks ul li a{
    color: white;
    text-decoration: none;
}

.topresnavlinks ul li a:hover{
    color: rgb(209, 211, 213);
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}
   
.topresnav{
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
    flex-wrap: wrap;
}
    
.closeBtn {
    background-color: transparent;
    border: 1px solid transparent;
    padding: 10px;
    width: 50px;
    height: 50px;
    margin-right: 30px;
}

.closeBtn i{
    font-size: 28px;
    color: white;
}

.closeBtn i:hover{
    color: rgb(209, 211, 213);
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}
    
.video2{
    height: 100vh;
    width: 100%;
    margin-top: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}


h1{
    font-family: jubilat_l;
    font-size: 75px;
    color: #FFF;
    letter-spacing: 3px;
    margin: 0px;
    text-shadow: 2px 2px 5px black;
}

h2{
    margin: 10px 0px;
    color: white;
    text-shadow: 2px 2px 5px black;
}
    
/* Responsive Navigation Large Phone */

/* Responsive Pane Container */
    
    #panecontainer{
    width: 700px;
    margin: 0 auto;
}
    .letterEditor img{
        height: 375px;
}

@media all and (max-width: 750px){
    h1{
        font-family: jubilat_l;
        font-size: 57px;
    }
     #panecontainer{
    width: 515px;
    margin: 0 auto;
}

.letterEditor{
    display: none;
}


    
.letterEditorRes{
    display: inline;
    display: flex;
    justify-content: center;
}

.letterEditorRes img{
    width: 375px;
    height: 750px;
    margin: 20px 0px;
}

.slideoutpanes{
    display: flex;
    justify-content: center;
    display: none;
}

    .heropane img{
        width: 333px;
    }


/* Responsive Navigation  Phone */

@media all and (max-width: 515px){

.video2{
    height: 85vh;
    width: 100%;
    margin-top: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    
}
    
h1{
    font-family: jubilat_l;
    font-size: 37px;
    color: #FFF;
    letter-spacing: 3px;
    margin: 0px;
    text-shadow: 2px 2px 5px black;
}

h2{
    font-size: 25px;
    margin: 10px 0px;
    color: white;
    text-shadow: 2px 2px 5px black;
}

#panecontainer{
    width: 325px;
    margin: 0 auto;
}
    
@media all and (max-width: 350px){
    h1{
        font-size: 30px;
    }
    .letterEditorRes img{
    width: 325px;
    height: 650px;
    margin: 20px 0px;
}
    
    }