@charset "utf-8";
/* CSS Document */

/*--------------   SITE NAME   --------------*/


/*============================================*/
/*--------------- BASE STYLES ----------------*/
/*============================================*/


body {
    font-size:100%;
    text-align: center;
    font-family:HelveticaNeue, Helvetica, Arial, sans-serif;
    color:#FFF;
    background:#000;
}
.wrap {
    max-width:960px;
    padding:0px 10px;
    text-align: left;
    margin:auto;
}



/*============================================*/
/*---------------- TYPOGRAPHY ----------------*/
/*============================================*/




@font-face {
    font-family: 'Raleway';
    src: url(../fonts/raleway_thin-webfont.eot);
    src: url(../fonts/raleway_thin-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/raleway_thin-webfont.woff) format('woff'),
         url(../fonts/raleway_thin-webfont.ttf) format('truetype'),
         url(../fonts/raleway_thin-webfont.svg#RalewayThin) format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Delicious';
    src: url(../fonts/delicious-bold-webfont.eot);
    src: url(../fonts/delicious-bold-webfont.eot?#iefix) format('embedded-opentype'),
         url(../fonts/delicious-bold-webfont.woff) format('woff'),
         url(../fonts/delicious-bold-webfont.ttf) format('truetype'),
         url(../fonts/delicious-bold-webfont.svg#DeliciousBold) format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {

}
h2 {
    font-family:HelveticaNeue-UltraLight, Raleway, Helvetica, Arial, sans-serif;
    font-size: 3.75em;
    font-weight: normal;
    color:#FFF;
    margin-bottom:40px;
}
h3 {
    font-family: Delicious, Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-size: 2.25em;
    color:#6B9BCA;
    margin-bottom:10px;
}
h4 {

}
p {
    font-size:1em;
    line-height: 1.4em;
    color:#CCC;
    width:57%;
    display:block;
    margin:auto;
    margin-bottom:20px;
}
a {
    font-size: 1.2em;
    color:#6B9BCA;
    font-family:Delicious, Helvetica, Arial, sans-serif;
    text-decoration: none;
}
    a:hover {
        color:#FFF;
    }
ul {

}
li {
    list-style:outside;
    margin-left:20px;
}


/*============================================*/
/*------------------ LAYOUT ------------------*/
/*============================================*/



/*-------------------- NAV -------------------*/

header {
    position: relative;
    z-index: 5;
    overflow: hidden;
    height:120px;
}
#logo {
    background:url(../images/logo.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
    overflow: hidden;
    float: left;
    height: 22px;
    width:16%;
    margin-top:25px;
}
nav {
    float:right;

}
    nav li {
        display:inline-block;
        text-align: right;
        width:100px;
        margin-top:25px;
    }

.shadow {
    position: absolute;
    top:0px;
    left:0px;
    height:100%;
    width: 100%;
    z-index: 2;
    background-image: -webkit-radial-gradient(left center, 100% 100%, rgba(0,0,10,.2), rgba(0,0,10,.9));
    background: -moz-radial-gradient(0% 50%, circle, rgba(0,0,10,.2) 0px, rgba(0,0,10,.9) 100%);
    background-image: radial-gradient(left center, 100% 100%, rgba(0,0,10,.2), rgba(0,0,10,.9));
}
.moon {
    height:100%;
    width:100%;
    position: absolute;
    top:0px;
    left:0px;
    z-index: 1;
    background:url(../images/moon.jpg) left center repeat-x;
}
#content {
    background:url(../images/stripe-bg.png) center center repeat-x;
    position: relative;
    z-index: 3;
    padding:30px 0;
    text-align: center;
    -webkit-animation: stripeAnimation 10s linear infinite;
    -moz-animation: stripeAnimation 10s linear infinite;
}
    #content .wrap {
        text-align: center;
    }
@-webkit-keyframes stripeAnimation {
        0% {
            background-position: 0 center;
                }

        100% {
             background-position: -127px center;     
                }
        }
@-moz-keyframes stripeAnimation {
        0% {
            background-position: 0 center;
                }

        100% {
             background-position: -127px center;     
                }
        }


/*============================================*/
/*------------------- FORMS ------------------*/
/*============================================*/


input[type="text"], input[type="password"], input[type="number"], input[type="email"] {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border:none;
    outline: none;
    background:none;
}
    /* Hover, focus, active states for ALL types of text inputs */
    input[type="text"]:hover, input[type="text"]:active, input[type="text"]:focus, input[type="password"]:hover, input[type="password"]:active, input[type="password"]:focus, input[type="number"]:hover, input[type="number"]:active, input[type="number"]:focus, input[type="email"]:hover, input[type="email"]:active, input[type="email"]:focus {

}

select {
    -ms-appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    margin:0px;
    margin-bottom:10px;
    padding:0px;
    appearance:none;
    outline: none;
    border: none;
    background: none;
}
    select:hover {

    }



/*============================================*/
/*--------------- MEDIA QUERIES --------------*/
/*============================================*/


/*-------------- iPAD LANDSCAPE --------------*/

@media screen and (max-width: 1024px) {


}


/*--------------- iPAD PORTRAIT --------------*/

@media screen and (max-width: 768px) {

    #logo {
        width:30%;
    }
    nav li {
        text-align: left;
    }
}


/*-------------- iPHONE PORTRAIT --------------*/


@media screen and (max-width: 550px) {
    h2 {
        font-size:2.3em;
    }
    h3 {
        font-size: 1.5em;
    }
    p {
        width:100%;
    }
    nav li {
        text-align: right;
        width:35%;
        font-size: .875em;
    }
}






/*
-------------------------------------------------------------------
 ___ _   _ ___ _  _____   ___   _   _  _____   _      _   _  _____ 
| _ ) | | |_ _| ||_   _| / __| /_\ | ||_   _| | |    /_\ | |/ / __|
| _ \ |_| || || |__| |   \__ \/ _ \| |__| |   | |__ / _ \| ' <| _| 
|___/\___/|___|____|_|   |___/_/ \_\____|_|   |____/_/ \_\_|\_\___|

------------ OPERAM • FERVOR • SIMPLICITAS • INNOVATIO ------------

*/