﻿@font-face {
    font-family:"LatoHairline";
    src:url('../fonts/Lato/Lato-Hairline.eot?') format('embedded-opentype');
    src:url('../fonts/Lato/Lato-Hairline.woff') format('woff');
    src:url('../fonts/Lato/Lato-Hairline.ttf') format('truetype');
}

@font-face {
    font-family:"LatoLight";
    src:url('../fonts/Lato/Lato-Light.eot?') format('embedded-opentype');
    src:url('../fonts/Lato/Lato-Light.woff') format('woff');
    src:url('../fonts/Lato/Lato-Light.ttf') format('truetype');
}

@font-face {
    font-family:"LatoRegular";
    src:url('../fonts/Lato/Lato-Regular.eot?') format('embedded-opentype');
    src:url('../fonts/Lato/Lato-Regular.woff') format('woff');
    src:url('../fonts/Lato/Lato-Regular.ttf') format('truetype');
}

* {
    margin: 0px;
    padding: 0px;
    border: 0px;
    text-decoration: none;
    list-style: none;
}

body {
    font-family: LatoRegular, Arial, sans-serif;
    background: url(../images/background_1280.jpg) no-repeat #1f1f1f;
    background-size: 100%;
    background-position-x: center;
    background-position-y: center;
    background-position: center center;
    background-attachment: fixed;
    color: white;
}

.wrapper {
    width:960px;
    margin:auto;
}

h1, h2, h3, p {
    padding: 8px 20px 2px;
}

h1 {
    font-size:2em;
    font-family: LatoHairline, Arial, sans-serif;
}

h2 {
    padding-top:20px;
    font-size:1.2em;
    font-family: LatoLight, Arial, sans-serif;
}

p {
    -webkit-text-shadow: 0px 0px 9px rgba(0,0,0,0.5);
    text-shadow: 0px 0px 9px rgba(0,0,0,0.5);
    text-align:justify;
}

a {
    color: white;
    font-weight: bold;
    text-shadow: 0px 0px 6px rgba(255, 254, 172, 0.62);
    -moz-transition: all linear 150ms;
    -o-transition: all linear 150ms;
    -webkit-transition: all linear 150ms;
    transition: all linear 150ms;
}

a:active {
    text-shadow: 0px 0px 10px #fffeac, 0px 0px 2px #fffeac;
}

a:hover {
    text-shadow: 0px 0px 10px #fffeac, 0px 0px 2px #fffeac;
}

ul {

}

li {
    display:inline-block;
    padding: 5px;
}

video {
    margin-top:20px;
}

.img_rig {
    width: 330px;
    margin-top: 14px;
}

.clickable {
    cursor:pointer;
}

.w440 {
    width:440px;
}

/* HEADER */
header {
    background:#fe001a;
    background: -moz-linear-gradient(top,  #fe001a 0%, #be0013 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fe001a), color-stop(100%,#be0013)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #fe001a 0%,#be0013 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #fe001a 0%,#be0013 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #fe001a 0%,#be0013 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #fe001a 0%,#be0013 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe001a', endColorstr='#be0013',GradientType=0 ); /* IE6-9 */
    height: 140px;
}

#banner {
    position:relative;
    top:-20px;
}

.logo {
    position:absolute;
    top:0px;
    left:0px;
}

#banner_hover {
    opacity:0;
    -moz-transition: opacity linear 150ms;
    -o-transition: opacity linear 150ms;
    -webkit-transition: opacity linear 150ms;
    transition: opacity linear 150ms;
}

#banner_hover:hover {
    opacity:0.55;
}

nav {
    width: 380px;
    display: inline-block;
    position: relative;
    bottom: -104px;
    right: -580px;
}

/* CONTENT */
#content {

}

#inner_content {
    background: rgba(0,0,0,0.30);
    padding-bottom: 190px;
    -moz-box-shadow: 0px 0px 160px rgba(0,0,0,0.25), 0px 0px 16px rgba(0,0,0,0.20);
    -webkit-box-shadow: 0px 0px 160px rgba(0,0,0,0.25), 0px 0px 16px rgba(0,0,0,0.20);
    box-shadow: 0px 0px 160px rgba(0,0,0,0.25), 0px 0px 16px rgba(0,0,0,0.20);
}

section {

}

section > img {
    margin: 20px;
    border-radius: 16px;
}

.quote {
    margin: 20px;
    width:150px;
    font-size:2em;
}

.right {
    float: right;
}

.left {
    float: left;
}

.border {
    clear:both;
    margin: 10px 0px 5px;
    border-top:1px solid rgba(0,0,0,0.1);
    border-bottom:1px solid rgba(255,255,255,0.1);
}

#stills {
    padding:0px;
}

/* IMAGE SLIDER */
#slider {
    position:relative;
}

#image_container {
    position:relative;
    z-index: 0;
    width:960px;
    height:540px;
}

.slider-image {
    width: 960px;
    z-index: 0;
    position: absolute;
    top: 0px;
    left: 0px;
}

#image-ID-0 {
    z-index:1;
}

#controls {
    width: 960px;
    z-index: 1;
    position: absolute;
    top: 0px;
    left: 0px;
}

.arrow {
    cursor: pointer;
    opacity: 0.2;
    -moz-transition: opacity linear 100ms;
    -o-transition: opacity linear 100ms;
    -webkit-transition: opacity linear 100ms;
    transition: opacity linear 100ms;
    position:absolute;
    top:225px;
}

#left-arrow {
    left:20px;
}

#right-arrow {
    right:20px;
}

.arrow:hover{
    cursor:pointer;
    opacity:1;
}

#buttons {
    position:absolute;
    top: 509px;
    left:442px;
    cursor:pointer;
}

.button {
    width:10px;
    height:10px;
    border:1px solid white;
    background:rgba(255,255,255,0.5);
    display: inline-block;
    border-radius: 6px;
}

.marker {
    -moz-box-shadow: 0px 0px 10px white;
    -webkit-box-shadow: 0px 0px 10px white;
    box-shadow: 0px 0px 10px white;
    background:white;
}

/* CONTACT */
#contact label {
    display:inline-block;
    vertical-align: top;
    font-size:16px;
    padding: 10px;
    margin: 10px;
    width: 50px;
}

#contact input, #contact textarea {
    color: white;
    border: 1px solid #73858A;
    padding: 10px;
    margin: 10px;
    background-color: rgba(250,250,250,0.15);
    width: 300px;
}

#contact textarea {
    width: 738px;
    height: 200px;
}           

#contact .submit {
    float:right;
    width: 200px;
    font-size:16px;
    margin-right:96px;
    cursor:pointer;
}

#contact .submit:hover, #contact .submit:focus {
    background-color: rgba(250,250,250,0.35);
}

::-webkit-input-placeholder {   /* WebKit browsers */
    color:    #DDD;
}

:-moz-placeholder {             /* Mozilla Firefox 4 to 18 */
    color:    #DDD;
    opacity:  1;
}

::-moz-placeholder {            /* Mozilla Firefox 19+ */
    color:    #DDD;
    opacity:  1;
}

:-ms-input-placeholder {        /* Internet Explorer 10+ */
    color:    #DDD;
}

/* FOOTER */
footer {
    position: relative;
    margin-top: -140px;
    background: url(../images/footer.png);
    background-repeat: no-repeat;
    background-position-y: bottom;
    text-align: center;
    height: 145px;
    color: white;
    text-shadow: 0px 0px 6px rgba(255, 254, 172, 0.62);
}

#inner_footer {
    position:absolute;
    bottom: 10px;
    left: 0px;
    right: 0px;
}

.seperator {
    margin:10px;
}

#lightbox {
    background-color:rgba(0,0,0,0.75);
    position:fixed;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    z-index:2;
    display:none;
}

.lb_image {
    margin:auto;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    border-radius: 18px;
    max-width: 98%;
    max-height: 98%;
    display:none;
}

#lb_close {
    position: absolute;
    top: 10px;
    right: 10px;
    opacity: 0.75;
    cursor: pointer;
    -moz-transition: opacity linear 200ms;
    -o-transition: opacity linear 200ms;
    -webkit-transition: opacity linear 200ms;
    transition: opacity linear 200ms;
}

#lb_close:hover {
    opacity: 0.95;
}

/* RESPONSIVENESS */
@media (min-width: 1280px) {
    body {
        background-image: url(../images/background_1920.jpg);
    }
}

@media (min-width: 1920px) {
    body {
        background-image: url(../images/background_2800.jpg);
    }
}

@media (min-width: 2800px) {
    body {
        background-image: url(../images/background_3840.jpg);
    }
}

