@import url('reset.css');

::-moz-selection{ background-color: #3c5a78; color: #eee;}
::selection{ background-color: #3c5a78; color: #eee;}

*{-webkit-appearance: none; -webkit-text-size-adjust: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

a {text-decoration: none; color: #f8f8f8; cursor: pointer; font-weight: 400;}
a:hover {color: #CFCFCF;}

a.opacity {
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    -o-transition: opacity .25s ease-in-out;
    transition: opacity .25s ease-in-out;
    border: none;
}

a:hover.opacity {
    opacity: 0.6;
    -moz-opacity: 0.6;
    filter: alpha(opacity=60);
    border: none;
}

a.opacityinverse {
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
-o-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out; border:none;
opacity: 0.5;
-moz-opacity: 0.5;
filter: alpha(opacity=50);}

a:hover.opacityinverse {
    opacity: 1;
    -moz-opacity: 1;
    border: none;
}


body {
    background-color: #383e59;
    font-family: 'Open Sans', sans-serif;
    color: #FFF;
    font-size: 14px;
    line-height: 29px;
    letter-spacing: 0;
    font-weight: 300;
    -webkit-text-size-adjust: 100%;
    min-width: 1200px;
}

h1 {font-size: 22px; line-height: 30px; letter-spacing: 6px; text-transform: uppercase; color: #FFF; margin-bottom: 10px; font-family: 'Yanone Kaffeesatz', sans-serif; font-weight: 300;}
h2 {font-size: 22px; line-height: 30px; letter-spacing: 6px; text-transform: uppercase; color: #FFF; margin-bottom: 10px; font-family: 'Yanone Kaffeesatz', sans-serif; font-weight:200; text-align: center;}

.clear{clear: both;}
.left {position: relative; float: left;}
.right {position: relative; float: right;}

p {margin-bottom: 15px;}

.box-shadow {box-shadow: 0 0 20px -5px rgba(0, 0, 0, 1); -moz-box-shadow: 0 0 20px -5px rgba(0, 0, 0, 1);  -webkit-box-shadow: 0 0 20px -5px rgba(0, 0, 0, 1);}


/* --------------------------------------------------------------------------
    CSS BASE
--------------------------------------------------------------------------- */

.only-mobile {display: none;}

.wrapper {position: relative; height: auto; overflow: hidden; min-width: 1200px; max-width: 1200px; padding: 0 25px 0 25px; margin: 0 auto;}
#main-content {position: relative; height: auto; overflow: hidden; z-index: 4; width: 90%; margin: 0 auto;}
#main-content .wrapper > div {overflow: auto; padding-right: 20px;}
#main-content .wrapper {width: 800px; min-width: 800px;}
#main-content .wrapper, #main-content .wrapper p {text-align: justify;}

#logo {position: relative; height: auto; overflow: hidden; width: 190px; margin: 70px auto 40px auto; z-index: 4;}

#menu {position: absolute; width: 100%; bottom: 0; display: block; margin: 20px 0 30px 0; text-align: center; z-index: 4; min-width: 1200px;}
#menu ul {position: relative; height: auto; text-align: center; display: inline-block;} 
#menu ul li {position: relative; height: auto; margin: 0 8px 0 8px; display: inline-block; text-transform: uppercase;}
#menu ul li.last {margin-right: 0;}
#menu ul li a {color: #fff; font-size: 15px; font-family: 'Yanone Kaffeesatz', sans-serif; font-weight: 300; letter-spacing: 7px; padding-left: 6px; padding-bottom: 2px; display: inline-block;}
#menu ul li.active a {color: #CFCFCF; border-bottom: 1px dotted #CFCFCF;}
#menu ul li a:hover {color: #CFCFCF;}

.credits, .copy {position: relative; height: auto; overflow: hidden; font-size: 10px;}
.credits{margin-right: 30px;}
.copy{margin-left: 30px;}

#galleria {position: absolute; width: 100%; height: 100%; z-index: 1; top: 0; left: 0; min-width: 1200px !important;}
#galleria-hover {position: absolute; width: 100%; height: 100%; z-index: 2; top: 0; left: 0; min-width: 1200px !important; background: rgba(56, 62, 89, 0.4);}

#bg-top {width: 100%; height: 523px; position: absolute; top: 0; z-index: 2; background: url(/frontend/img/bg-top.png) repeat-x; min-width: 1200px !important;}
#bg-bottom {width: 100%; height: 523px; position: absolute; bottom: 0; z-index: 2; background: url(/frontend/img/bg-bottom.png) repeat-x; min-width: 1200px !important;}

.payoff {position: relative; height: auto; overflow: hidden; z-index: 3; opacity: 0;}


#menu-location {position: relative; height: auto; text-align: center; overflow: hidden; margin-bottom: 30px;}
#menu-location ul.menu-location {position: relative; height: auto; text-align: center; display: inline-block;} 
#menu-location ul.menu-location li {position: relative; height: auto; margin: 0 3px 0 3px; display: inline-block; text-transform: uppercase;}
#menu-location ul.menu-location li.last {margin-right: 0;}
#menu-location ul.menu-location li a {color: #fff; font-size: 13px; font-family: 'Yanone Kaffeesatz', sans-serif; font-weight: 300; letter-spacing: 5px; padding-left: 4px; padding-bottom: 2px; display: inline-block;}
#menu-location ul.menu-location li.active a {color: #CFCFCF; border-bottom: 1px dotted #CFCFCF;}
#menu-location ul.menu-location li a:hover {color: #CFCFCF;}
#menu-location ul.menu-location li.x {margin: 0;}


.gallery-container {position: relative; height: auto; overflow: scroll; }
.gallery-container a {position: relative; height: auto; overflow: hidden; display: inline-block; margin: 0; padding: 0; width: 100px; height: 100px; margin-bottom: -9px;}

#cookieChoiceInfo {background-color: #383e59 !important; font-size: 10px; line-height: 15px; padding-top: 10px !important; font-family: Helvetica, Arial, sans-serif;}
#cookieChoiceInfo a#cookieChoiceDismiss {margin-left: 8px !important;}
#cookieChoiceInfo a { font-weight: bold;}
#cookieChoiceInfo a:hover {color: #666;}


/*************** SCROLLBAR BASE CSS ***************/

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}

.scroll-wrapper > .scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0;
    position: relative !important;
    top: 0;
    width: auto !important;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.scroll-element {
    display: none;
}
.scroll-element, .scroll-element div {
    box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {
    cursor: default;
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999;
}
.scroll-textarea > .scroll-content {
    overflow: hidden !important;
}
.scroll-textarea > .scroll-content > textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important;
}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
    height: 0;
    width: 0;
}

/*************** SIMPLE OUTER SCROLLBAR ***************/

.scrollbar-outer > .scroll-element,
.scrollbar-outer > .scroll-element div
{
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}

.scrollbar-outer > .scroll-element {
    
}

.scrollbar-outer > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scrollbar-outer > .scroll-element.scroll-x {
    bottom: 0;
    height: 12px;
    left: 0;
    width: 100%;
}

.scrollbar-outer > .scroll-element.scroll-y {
    height: 100%;
    right: 0;
    top: 0;
    width: 12px;
}

.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { height: 8px; top: 2px; }
.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer { left: 2px; width: 8px; }

.scrollbar-outer > .scroll-element .scroll-element_outer { overflow: hidden; }
.scrollbar-outer > .scroll-element .scroll-element_track { background-color: rgba(238, 238, 238, 0.35); }

.scrollbar-outer > .scroll-element .scroll-element_outer,
.scrollbar-outer > .scroll-element .scroll-element_track,
.scrollbar-outer > .scroll-element .scroll-bar {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.scrollbar-outer > .scroll-element .scroll-bar { background-color: #d9d9d9; }
.scrollbar-outer > .scroll-element .scroll-bar:hover { background-color: #c2c2c2; }
.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }


/* scrollbar height/width & offset from container borders */

.scrollbar-outer > .scroll-content.scroll-scrolly_visible { left: -12px; margin-left: 12px; padding-right: 20px;}
.scrollbar-outer > .scroll-content.scroll-scrollx_visible { top:  -12px; margin-top:  12px; }

.scrollbar-outer > .scroll-element.scroll-x .scroll-bar { min-width: 10px; }
.scrollbar-outer > .scroll-element.scroll-y .scroll-bar { min-height: 10px; }


/* update scrollbar offset if both scrolls are visible */

.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -14px; }
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -14px; }

.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -14px; }
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -14px; }






















/* --------------------------------------------------------------------------
    Smartphone
--------------------------------------------------------------------------- */

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

    .only-mobile {display: block;}

}