@font-face { font-family: 'BebasNeue-Regular'; src: url('../../fonts/bebasneue/BebasNeue-Regular.ttf') format('truetype'); }
@font-face { font-family: '3x5'; src: url('../../fonts/3x5/3X5.TTF') format('truetype'); }
@font-face { font-family: 'divlit'; src: url('../../fonts/3x5/divlit.ttf') format('truetype'); }
@font-face { font-family: 'cocogoose-pro'; src: url('../../fonts/cocogoose-pro/Cocogoose_Pro_Thin_Trial.ttf') format('truetype'); }
@font-face { font-family: 'geo_sans_light'; src: url('../../fonts/geo_sans_light/GeosansLight.ttf') format('truetype'); }
@font-face { font-family: 'georgea'; src: url('../../fonts/georgea/GEORGEA.otf') format('truetype'); }
@font-face { font-family: 'DistortionFont'; src: url('../../fonts/DistortionFont/Distortion Dos Analogue.otf') format('truetype'); }
@font-face { font-family: 'Gontserrat-Light'; src: url('../../fonts/gontserrat/Gontserrat-Light.ttf') format('truetype'); }
@font-face { font-family: 'Gontserrat-Regular'; src: url('../../fonts/gontserrat/Gontserrat-Regular.ttf') format('truetype'); }

body#globalSite {
    padding:0px;
    margin:0px;
    background-image:url(../../images/background.png);
}


@media only screen and (orientation: portrait) {
    #topBar {
        height:60px;
        width:100%;
        margin-top:15px;
    }
    #topBarLogoImage {
        height:100%;
        width:auto;
        margin-left:2%;
        float:left;
    }
    #topNavi {
        float:right;
        width:30px;
        height:50px;
        margin-top:0px;
        margin-right:4%;
        position: relative;
        z-index: 100;
    }
    img#topNaviIconShow {
        margin-top:20px;
        width:100%;
        float:left;
        position: absolute;
        opacity: 1;
    }
    img#topNaviIconHide {
        margin-top:20px;
        width:0%;
        position: absolute;
    }
    #navi {
        height:100%;
        width:0%;
        position: absolute;
        z-index: 99;
        background-image:url(../../images/background.png);
        right:0;
        display: none;
    }
    #navi ul {
        margin:0px;
        padding:0px;
        width:400px;
        overflow: hidden;
        margin-left:auto;
        margin-right:auto;
        left:0;
        right:0;
        position: relative;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);        
    }

    #navi ul li {
        color:#ffffff;
        list-style: none;
        margin:0px;
        padding:0px;
        width:auto;
        color:#8a8a8a;
        padding-left: 50px;
        text-transform: uppercase;    
        font-family: 'BebasNeue-Regular';  
        font-size: 25px;    
        margin-bottom:30px;
    }
    #navi ul li a img {
        width:20px;
        height:auto;
        margin-right:15px;    
        float:left;
    }
    @media (min-width:1000px) {
        #navi ul li {
        color:#ffffff;
        list-style: none;
        margin:0px;
        padding:0px;
        width:100%;
        color:#8a8a8a;
        text-transform: uppercase;    
        font-family: 'BebasNeue-Regular';  
        font-size: 30px;    
        margin-bottom:30px;
        }
    }
    #paypalDonateContent {
        width:120px;
        height:80px;
        float:right;
        margin-right:10%;
    }
    form#PayPalDonate {
        margin-top:0px;
        
    }
    form#PayPalDonate h1 {
        font-size:10pt;
    }
    input#paypalIcon {
        width:100px;
        height:auto;
        margin-top:0px;
    }
    input#paypalDonateIcon {
        width:70px;
        height:auto;
        margin-top:20px;
    }    
}


@media only screen and (orientation: landscape) {
    #topBar {
        height:60px;
        width:100%;
        margin-top:15px;
    }
    #topBarLogoImage {
        height:100%;
        width:auto;
        margin-left:2%;
        float:left;
    }
    #topNavi {
        float:right;
        width:50px;
        height:40px;
        margin-top:10px;
        margin-right:4%;
        position: relative;
        z-index: 100;
    }
    img#topNaviIconShow {
        margin-top:0px;
        width:100%;
        float:left;
        position: absolute;
        opacity: 1;
    }
    img#topNaviIconHide {
        margin-top:20px;
        width:0%;
        position: absolute;
    }
    #navi {
        height:100%;
        width:0%;
        position: absolute;
        z-index: 99;
        background-image:url(../../images/background.png);
        right:0;
        display: none;
    }
    #navi ul {
        margin:0px;
        padding:0px;
        width:400px;
        overflow: hidden;
        margin-left:auto;
        margin-right:auto;
        left:0;
        right:0;
        position: relative;
        top: 50%;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #navi ul li {
        color:#ffffff;
        list-style: none;
        margin:0px;
        padding:0px;
        width:auto;
        color:#8a8a8a;
        padding-left: 50px;
        text-transform: uppercase;    
        font-family: 'BebasNeue-Regular';  
        font-size: 20px;    
        margin-bottom:30px;
    }
    #navi ul li a img {
        width:20px;
        height:auto;
        margin-right:15px;    
        float:left;
    }    
    #paypalDonateContent {
        width:120px;
        height:80px;
        float:right;
        margin-right:10%;
    }
    form#PayPalDonate {
        margin-top:0px;
        
    }
    form#PayPalDonate h1 {
        font-size:10pt;
    }
    input#paypalIcon {
        width:100px;
        height:auto;
        margin-top:-20px;
        float:left;
    }
    input#paypalDonateIcon {
        width:70px;
        height:auto;
        margin-top:5px;
    }           
    @media (min-width:1000px) {
        #navi ul li {
        color:#ffffff;
        list-style: none;
        margin:0px;
        padding:0px;
        width:100%;
        color:#8a8a8a;
        text-transform: uppercase;    
        font-family: 'BebasNeue-Regular';  
        font-size: 30px;    
        margin-bottom:30px;
        }
        input#paypalIcon {
            width:100px;
            height:auto;
            margin-top:0px;
            float:left;
        }        
    }

}

#naviFooter {
    height:auto;
    width:100%;
    bottom:10;
    position: absolute;
}
#navi ul li a {
    color:#8a8a8a;
    text-decoration: none;
}