﻿body {
    padding:0px;
    margin:0px;
    width:100%;
    height:100%;
    font-family: 'Mitr', sans-serif;
    background: transparent;
    /*font-family: 'Covered By Your Grace', cursive;
    font-family: 'Rock Salt', cursive;
    font-family: 'Mitr', sans-serif;*/
}
html {
    padding:0px;
    margin:0px;
    width:100%;
    height:100%;
    font-family: 'Mitr', sans-serif;
    background: #030303;
    background: -moz-linear-gradient(top,  #fd0103 0%, #030303 100%); 
    background: -webkit-linear-gradient(top,  #fd0103 0%,#030303 100%); 
    background: linear-gradient(to bottom,  #fd0103 0%,#030303 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd0103', endColorstr='#030303',GradientType=0 );
    /*font-family: 'Covered By Your Grace', cursive;
    font-family: 'Rock Salt', cursive;
    font-family: 'Mitr', sans-serif;*/
}
a{
    color: #ffffff;
    transition: all ease-in-out 0.5s;
}
p{
    font-size: 18px;
}
h2{
    font-size: 35px;
    font-family: 'Rock Salt', cursive;
}
.navLink{
    font-family: 'Rock Salt', cursive;
    text-align:center;
    font-size: 22px;
}
#topNav a {
    color: #FFF;
    text-shadow: 0px 3px 10px #000;
}
.spanNav{
}
#What{
    background-color: #1c8b3c;
}
.divNavWhat{
    background-color: #1c8b3c;
    margin-top: 82px;
    padding: 3px 5px;
    border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    box-shadow: 0px -10px 20px #0c3819 inset;
    transition: all ease-in-out 0.5s;
}
.divNavWhat:hover{
    box-shadow: 0px 10px 20px #0c3819 inset;    
}
.imgDivider{
    width:100%;
}
#Triathlon{
    background-color: #fbb132;
}
.divNavTriathlon{
    background-color: #fbb132;
    margin-top: 82px;
    padding: 3px 5px;
    border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    box-shadow: 0px -10px 20px #74541d inset;
    transition: all ease-in-out 0.5s;
}
.divNavTriathlon:hover{
    box-shadow: 0px 10px 20px #74541d inset;    
}
#Decathlon{
    background-color: #0885c2;
}
.divNavDecathlon{
    background-color: #0885c2;
    padding: 3px 5px;
    margin-top: 82px;
    border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    box-shadow: 0px -10px 20px #06364e inset;
    transition: all ease-in-out 0.5s;
}
.divNavDecathlon:hover{
    box-shadow: 0px 10px 20px #06364e inset;    
}
#Contact {
    background-color: #fd0103;
}
#Contact img{
    margin-top: 20px;
}
#Contact h2{
    padding-top: 100px;
}
.divNavContact{
    background-color: #fd0103;
    margin-top: 82px;
    padding: 3px 5px;
    border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    box-shadow: 0px -10px 20px #780506 inset;
    transition: all ease-in-out 0.5s;
}
.divNavContact:hover{
    box-shadow: 0px 10px 20px #780506 inset;    
}
#containerNavButton{
    width:89.75px;
    height:96px;
    margin-top: 30px;
    margin-left: 85%;
}
#divNavButton{
    border-radius: 10px;
    -moz-border-radius: 10px;
    padding: 20px;
    border: solid #0885c2 3px;
    background-color: #e2e2e2;
}
#topNav #iNavButton{
    font-size: 50px;
    color: #0885c2;
    text-shadow: 0px 3px 5px #000;
}
.imgFull{
    width:100%;
}
a:hover, a:visited, a:after{
    text-decoration:none;
}
#divIntro{
    background-image: url('../images/intro.jpg');
    background-repeat:no-repeat;
    height:1000px;
    background-position:center bottom;
}
#divIntroBG{
    background-image: url('../images/IntroBG.jpg');
    background-repeat:repeat-x;
    height:1000px;
    background-position:center bottom;
}
#h1Intro{
    padding-top: 100px;
    margin-top:0px;
    max-width:320px;
    color:#fff;
    text-align:center;
    font-size:45px;
    text-shadow: -3px 3px 2px #000;
    font-family: 'Rock Salt', cursive;
    line-height: 65px;
}
#h2Intro{
    max-width:320px;
    color:#fff;
    text-align:center;
    text-shadow: -3px 3px 2px #000;
    font-size:45px;
    font-family: 'Covered By Your Grace', cursive;
}
#divTextContainer{
    max-width:1920px;
    display: block;
    margin-left: auto;
    margin-right:auto;
    padding-left: 25%;
    width:100%;
}
.btn-primary{
    font-size: 18px;
    color: #fff;
    text-shadow: 0px 3px 10px #0d2a01;
    border: #37ba02;
    background: #37ba02; /* Old browsers */
    background: -moz-linear-gradient(top,  #49ff00 0%, #37ba02 60%, #247901 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #49ff00 0%,#37ba02 60%,#247901 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #49ff00 0%,#37ba02 60%,#247901 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49ff00', endColorstr='#247901',GradientType=0 ); /* IE6-9 */
}
.btn-primary:hover{
    border: #49ff00;
    background: #49ff00; /* Old browsers */
    background: -moz-linear-gradient(top,  #49ff00 0%, #37ba02 40%, #247901 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #49ff00 0%,#37ba02 40%,#247901 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #49ff00 0%,#37ba02 40%,#247901 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49ff00', endColorstr='#247901',GradientType=0 ); /* IE6-9 */
}
#btnEnter{
    margin-top:40px;
    font-size: 24px;
    width:100px;
    display: block;
    margin-left: 8%;
}
.divLogoContainer{
    height:200px;
    width:273px;
    margin-top:20px;
    margin-left: -50px;
}
.topLogo{
    height:200px;
    width:273px;
}
#topNav{
    background-color: #030303;
    height:150px;
    width:100%;
}
#slideshow { 
    margin: 50px auto; 
    position: relative; 
    width: 100%; 
    height: auto; 
    padding: 0px; 
    box-shadow: 0 0 20px rgba(0,0,0,0.4); 
    display: block;
    min-height:650px;
}

#slideshow > div  > p{
    font-size: 35px;
    text-align:center;
}

#slideshow > div { 
    position: absolute; 
    top: 10px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
}
.imgSlideshow{
    max-width: 100%;
    height: 500px;
    display:block;
    margin: 30px auto;
}
#slideshowContainer{
    background-color: #e2e2e2;
}
#footerNav a{
    color: #565656;
    text-align:center;
    transition: all ease-in-out 0.5s;
}
#footerNav a:hover{
    color: #030303;
}
#footerNav p{
    color: #565656;
    text-align:center;
}
#footerNav{    
    padding-bottom: 50px;
}

@media only screen and (max-width:1198px) and (min-width:992px) {
    .navLink {
        font-size: 18px;
    }

    .divNavWhat, .divNavDecathlon, .divNavTriathlon, .divNavContact {
        margin-top: 94px;
    }
}

@media only screen and (min-width:992px){
    #containerNavButton{
        display:none;
    }
}
@media only screen and (max-width:991px){
    #divDropDown{
        position: absolute;
        width:100%;
        transition: all ease-in-out 1s;
        background-color: #e2e2e2;
        border: solid 1px #0885c2;
        border-radius: 10px;
        -moz-border-radius: 10px;
        padding-bottom: 82px;
    }

    #divDropDown.divClosed{
        left:-150%;
    }
    #divDropDown.divOpen{
        left:0%;
    }
    .divLogoContainer {
        margin: -30px auto 0px;
    }
    .navLink{
        font-family: 'Rock Salt', cursive;
        text-align:center;
        font-size: 22px;
    }
    #topNav a {
        color: #FFF;
        text-shadow: 0px 3px 10px #000;
    }
    .divNavWhat{
        background-color: #1c8b3c;
        margin-top: 82px;
        padding: 15px 5px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        box-shadow: 0px -10px 20px #0c3819 inset;
    }
    .divNavDecathlon{
        background-color: #fbb132;
        margin-top: 82px;
        padding: 15px 5px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        box-shadow: 0px -10px 20px #654a1c inset;
    }
    .divNavTriathlon{
        background-color: #0885c2;
        padding: 15px 5px;
        margin-top: 82px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        box-shadow: 0px -10px 20px #052b3d inset;
    }
    .divNavContact{
        background-color: #fd0103;
        margin-top: 82px;
        padding: 15px 5px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        box-shadow: 0px -10px 20px #640304 inset;
    }
}
@media only screen and (max-width:1198px) and (min-width:800px){    
    #divTextContainer{
        padding-left: 15%;
    }
    #btnEnter{
        margin-left: 12%;
    }
}
@media only screen and (max-width:799px) and (min-width:580px){    
    #divTextContainer{
        padding-left: 5%;
    }
    #btnEnter{
        margin-left: 12%;
    }
}
@media only screen and (max-width:579px) and (min-width:530px){    
    #divTextContainer{
        padding-left: 5px;
    }
    #btnEnter{
        margin-left: 15%;
    }
}
@media only screen and (max-width:529px){    
    #divTextContainer{
        padding-left: 0px;
        width:98%;
        display: block;
        margin-left: 1%;
        margin-right:1%;
    }
    #btnEnter{
        margin-left: 25%;
    }
    #h2Intro, #h1Intro{
        max-width:100%;
        width:270px;
    display: block;
    }
    #h1Intro{
        font-size: 30px;
    }
    #h2Intro{
        font-size: 35px;
    }
}