/*******************
*      BASICS      *
*******************/

html, body {
    width:100%;
    font-family: 'Amatic SC', cursive;
    font-size: 24px;
}


h1 { color: #e9e5db; font-size: 48px !important; text-decoration: none; }
h2 { color: #e94244;  font-size: 96px; }
h3 { color: #e94244; font-size: 36px !important; }
h4 { text-transform: uppercase; margin-bottom: 0px; margin-top:14px; font-size: 24px;}
h5 { text-transform: uppercase; margin:0;  padding:4px;  }
ul { margin : 0px; padding:0 ;}
a, a:hover, a:active, a:focus {  color: #e9e5db;  outline: none;  border: 0;  text-decoration: none; }
.content a, .content a:hover, .content a:active, .content a:focus { color: #e94244; }
h2 a, h2 a:hover, h3 a, h3 a:hover { color: #e94244; }


hr{
    content: "";
    background-image: url("../img/visuals/underline.png");
    background-position: 0 0;
    background-repeat: repeat-x;
    width:24%;
    height:12px;
    border:0;
    margin: 48px auto;
}

hr.invisible{
    content: "";
    width:100%;
    border:0;
    margin: 12px auto;
}

a.underline:hover, a.underline.active {
    background-image: url("../img/visuals/underline.png");
    background-position: 0 0.8em;
    background-repeat: repeat-x;

}

img, video, iframe {  max-width:100%;  }
img.img-responsive { margin-bottom: 24px; }
img.first, video.first { margin-top: 96px; }
ul li{  list-style-type:none;   margin-right:24px;  }
p{ font-size: 36px !important; }
p.small { font-size: 24px !important; }
p.large { }

/*******************
*     STRUCTURE    *
*******************/
body{
    background-image: url("../img/bg/03.jpg");
    background-position: center center ;
    background-attachment: fixed;
    background-size: cover;
}

header{
    width:100%;
    height:100vh;

}

section {
    position: absolute;
    width:100%;
    height: 80vh;
    top:20vh;
    text-align: center;
    z-index: 2;
}

footer{
    position: absolute;
    width:100%;
    bottom:48px;
    text-align: center;
    z-index: 2;
}


/*******************
*     ELEMENTS    *
*******************/

#scene{
    z-index: -1;
}

#core_wrapper{
    position: absolute;
    width: 662px;
    max-width: 100%;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}

#emblem{
    width:100%;
    height:80%;
    padding-top: 20%;
}

#emblem img{
    max-width:50%;
}

#social{
    position: absolute;
    top:48px;
    right:5%;
}

ul#social a {
    display: inline-block;
    width: 48px;
    padding: 0;
}

ul#main_sponsors {
    position: absolute;
    bottom:24px;
    right: 5%;
}

ul#main_sponsors li{
    display: inline-block;
    float: right;
    width: 36px;
    z-index: 4;
}

ul#secondary_sponsors li{
    display: inline-block;
}

ul#gallery_navigation li{
    display: inline-block;
    margin-left: 12px;
    margin-right: 12px;
}

/*******************
*     CLASSES    *
*******************/

.container{

}

.sub_nav{
    /*position: fixed;*/
    /*margin-bottom: 64px;*/
}

.sub_nav a{
    font-size: 64px;
    color: #e94244 !important;
}

.parallax{
    position: absolute;
}

.fixed{
    position: fixed;
}

.offset-top{
    margin-top:64px;
}

.red_background{
    background-color: #e94244;
}

.sand_background{
    background-color: #d5d0c5;
}

.teal_background{
    background-color: #30d5c8;
}

.yellow_background{
    background-color: #fed136;
}

.texture_background{
    background: url('../img/ink/modal-bg.jpg') no-repeat top center;
    background-size:  cover;
}

.red_color{
    color: #e94244 !important;
}

.thumb{
    margin-bottom:24px;
}

.transition{
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/*******************
*       FORMS      *
*******************/



/*******************
*     BOOTSTRAP    *
*******************/


.navbar-nav {
    float:none;
    margin:0 auto;
    display: block;
    text-align: center;

}

.navbar-nav > li {
    display: inline-block;
    float:none;
}

.navbar-nav > li a {
    font-size: 24pt;
}

.navbar-nav > li a:hover {
    background-color: transparent;
    text-decoration: none;
}

.nav>li>a:focus, .nav>li>a:hover{
    background-color: transparent;
    text-decoration: none;
}


.navbar-fixed-bottom{
    bottom:48px;
}

.form-control{
    height: 64px;
    margin-bottom: 24px;
    font-size: 18px;
}

.dropdown-menu{
    color: #d9e5db;
    background-color: transparent;
    border:none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-box-shadow: none;

}

.dropdown-menu>li>a{

    color: #d9e5db;
    padding: 0;
}

.dropdown-menu>li>a:hover{
    color: #d9e5db;
    background-color: transparent;
    text-decoration: underline;
}

.btn{
    min-width:196px;
}

.btn-primary{
    background: #30d5c8;
    border:none;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    font-family: 'Amatic SC', cursive;
    font-size:24px;
}
.btn-primary:hover{
    background: #29b9ae;
}

.btn-primary:active{
    background: #30d5c8;
}

.btn-primary:focus{
    background: #30d5c8;
}

.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover{
    background: #29b9ae;
}


/********************
*     RESPONSIVE    *
********************/
#mobile_nav{
    margin-left:5%;
    margin-top:48px;
    z-index: 5;
    opacity: .95;
}

#mobile_menu{
    position: absolute;
    width:100%;
    height: 100vh;
    left: -100%;
    top:0;
    padding-top: 20vh;
}

#mobile_menu.visible {
    left:0;
}

#mobile_menu li{
    margin-right: 0;
    margin-bottom: 24px;
}

#mobile_menu img{
    max-width: 75%;
}

.icon_holder{
    position: absolute;
    /*z-index: 5;*/
    top: 42px;
    left: 8%;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: rgba(49, 41, 62, 0.68);
}

.icon_holder img{
    width: 32px;
    margin-top: 10px;
    /*margin-left: 10px;*/
}

#menu_open span{
    border-radius: 50%;
    background: rgba(49, 41, 62, 0.68);
    padding: 16px;
    margin-top: -16px;
}

.modal-close{
    top: 42px;
    right: 5%;
    width: 54px;
    height: 54px;
}

.navbar.texture_background #social{
    opacity: 0;
    visibility: hidden;
}

.sub_nav{
    text-align: center;
}

.sub_nav a{
    font-size: 36px;
    color: #e94244 !important;
}


@media (max-width: 768px) {
    h1, h2, h3, h4, h5, h6, p, a{
        text-align: center;
    }

    #social img{
        width: 32px;
    }
    #social li{
        margin-right: 0;
    }
}