/*
Theme Name: mpire.lu
*/

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(0, 0, 0);
    z-index: 9999999999999;
    height: 100%;
}
#status {
    width: 100px;
    height: 20px;
    position: absolute;
    text-align: center;
    left: 50%;
    top: 50%;
    color: rgb(255, 255, 255);
    margin: -16px 0 0 -50px;
    z-index: 9999999999999;
}
#status img {height:20px; width:20px; position: absolute; left:50%; margin:-10px; top:50%;}
* {
    font-family: "futura-pt", sans-serif;
    font-weight: 500;
    margin: 0;
    padding: 0;
    border: 0;
    
}
body, html { width:100%; height:100%; color:#1f1f1f; background:transparent;}
body { }
h1 { font-weight:300; font-size:5.5em; margin-bottom: 60px;}
.content h2 {font-weight:300; font-size:3em; }
.content p { margin-bottom:25px; }
h2 { font-weight:100; font-size:3em; margin-bottom: 20px; }
h3 { font-weight:400; font-size:2em; margin:30px 0;}
h4 { font-weight:100; font-size:1.5em; color:#ccc; letter-spacing: 2px; line-height: 1.5em; }
p { font-weight:100; font-size:1.5em; color:#222; letter-spacing: 2px; line-height: 1.5em; }
@media screen and (max-width:768px) { 
    body {font-size:0.8em; }
    h1 {font-size:3.5em; }
    nav ul.menu li { padding-top:11px; margin:0 10px;}
}
.container-fluid {
    padding: 0;
    margin:0;
    overflow-x: hidden; 
}
section.container-fluid {
    padding:120px 0;
}

.pdt1 { padding-top:100px; }
.pdb1 { padding-bottom:100px; }

header {
    width:100%;
    height:100%;
    top:0;
    position: absolute;
    z-index:9999999;
}
header .socials { display:none; }
header.sticky .socials { display:block; position:  absolute; right:20px; top:14px; }

header .logo { width:auto; height:calc(100% - 345px); padding:0; margin:50px auto; text-align: center; }
header .logo img { height:100%; margin-bottom: 120px; }

.skip { width:100px; margin-left:-50px; position: absolute; bottom:60px; left:50%; z-index: 9999;}


nav { width:100%; height:75px; background:rgba(0,0,0,0.5); border-color:rgba(255,255,255,0.9); border-width: 2px 0 0; border-style: solid; position: absolute; bottom:0px; }
nav ul.menu  {text-align: center; width:100%; }
nav ul.menu li { list-style: none; display: inline-block; font-size:2.0em;  color:#fff; text-transform: uppercase; padding-top:15px; margin:0 25px;  }

nav ul.menu li a:link,
nav ul.menu li a:active,
nav ul.menu li a:visited { color:#fff; font-weight: 100; }
nav ul.menu li a:hover { color:#a34924; text-decoration: none; }

a:link,
a:visited,
a:active { color:#0f0f0f; text-decoration: none; font-weight: 100; }
a:hover { color:#a34924; text-decoration: none; }
header.sticky { position: fixed; height:50px;  z-index:9999999; top:0; background:#fff;  }
header .logosmall { width:auto; height:20px; padding:0; margin:10px 20px; position:absolute; display:none; z-index:9999999999;  }
header.sticky .logosmall img { width:20px; height:20px; }
header.sticky nav { width:100%; height:45px; background:transparent; border:0; top:0; }
header.sticky  ul.menu  {text-align: center; width:100%; }
header.sticky  ul.menu li { list-style: none; display: inline-block; font-size:1em; color:#1f1f1f; text-transform: uppercase; padding-top:13px; margin:0 15px;  }
header.sticky  ul.menu li a:link,
header.sticky  ul.menu li a:active,
header.sticky  ul.menu li a:visited { color:#1f1f1f; }
header.sticky  ul.menu li a:hover { color:#ccc; text-decoration: none; }
i { width:30px; font-size:3em; text-align: center; margin: -10px auto; position: relative; transition: all 500ms ease; display: block; clear: both; }
i.up { position: fixed; bottom:90px; width:30px; height:30px; left:50%; color:#666; z-index: 999; }
i:hover { cursor:pointer; transition: all 500ms ease; }
video {
    min-width:100vw;
    min-height:100vh;
    overflow: hidden;
    z-index: 9;
    opacity: 0.75;
    position: fixed;
}
iframe { width: 100vw; height:calc(100vw / 1.77); margin-left:0; border:0; margin-top:0px; z-index: 9999;position: relative;}
/*
@media screen and (max-width: 1200px) {
    iframe {margin-left:8.333vw;}
}
*/
section {
    position: relative;
padding:120px 0;}
#welcome { overflow: hidden;}
#welcome h1 { font-size:4em; margin: 10px auto;}
section .row div img { max-width:100%; height: auto; }
section#event .row div img { max-width:100%; height: auto; }
section .row { margin:0; padding:0;}
section .row div { margin:0; padding:0;}
section.table { display:table;}
section.table .inner-half,
section .inner { width:100% !important; padding:120px 120px; text-align: center;}
section .inner i {text-align: center; margin: auto; position: relative;}
section.table .inner-half { display: inline-block; width:50%; padding:60px 60px;}


footer { padding:40px 0 10px; text-align: center; color:#fff; position: relative; z-index: 999999;}

#intro,
#mpire { padding:0; }


#mpire .row { padding:120px 0 0;}
#mpire, #join, #people { background: transparent; z-index: 999; background:#fff;}

#map h2,
#events, #cta { z-index:999999; }
#events { background-color:rgba(0,0,0,0.4); color:#fff; }
section#cta { padding:30px auto 30px;}
#cta h1 { color:#fff;  font-weight:100; margin-top:30px; margin-bottom: 30px; z-index:99999; opacity: 1:}
#cta h2 { color:#fff;  font-weight:100;  z-index:99999; }

#welcome {
    margin-top: 0;
    height: 100%; 
    min-height: 800px; 
     background-color:#0f0f0f;
}
#welcome .message {
    position: fixed;
    bottom:100px;  
    left:0;
    right:0;
    z-index:9999;
    color:#fff;
    text-align: center;
}
#welcome .message h1.one,
#welcome .message h1.two {
/*    display:none;*/
}

#welcome #slideshow { width:100%; height:100%; position: fixed; top:0; opacity:0.75; z-index:0; }
#welcome #slideshow div { position: absolute; width:100%; height:100%; top:0; background-repeat: no-repeat; background-size: cover; background-position: center center; }

#map {
    width:100%;
    height:300px;
    background-color:#fff;
}
    #map .row{
        height:300px;
        
        background-attachment: scroll;
    background-image: url(images/map.jpg);
    background-position: center left;
    background-repeat: no-repeat; 
    background-size: cover;
        opacity:0.65;
}
#welcome .overlay,
#cta .overlay,
#map .overlay {
    position: absolute;
    top: 0px;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.4;
    padding-top:0px;
    background-attachment: scroll;
    background-image: url(images/mpire_pattern.png);
    background-position: top left;
    background-size: 75%;
    background-repeat: repeat;
    z-index:999;
}
#welcome .overlay { top:0; bottom:0; position: fixed; opacity: 0.2; z-index:1; }
@media screen and (max-width:768px) { 

#map .overlay {
    opacity:0.1;
}
#map .overlay,
#cta .overlay {
    background-attachment: fixed;   
}
#cta .overlay {
 opacity:0.2;   
}

#welcome img.slide {
    width: 100%;
    height:auto;
    opacity:0.5;
}

footer {  height:45px; width:100%; z-index:99999; font-size:0.8em; }
footer p { margin:15px;}


input, textarea { width:98%; border:1px solid #ccc; padding:15px; }
label { width:48%; }
input[type="email"] { width:48%; margin-right:2%; }

@media screen and (max-width: 768px) {
    header .logo { width:auto; height:calc(100% - 245px); padding:0; margin:50px auto; text-align: center; }

header.sticky .socials { right:10px; top:14px; }
header.sticky .socials i { margin-left:0px; margin-right:0; }
header .logosmall {  margin:10px 10px; position:absolute; display:none; z-index:9999999999;  }
    nav ul.menu li { list-style: none; display: inline-block; font-size:1.5em;  color:#fff; text-transform: uppercase; padding-top:15px; margin:0 8px;  }

    header.sticky  ul.menu li { font-size:0.9em; color:#1f1f1f; text-transform: uppercase; padding-top:13px; margin:0 5px;  }

    #intro { display:none;}
}