/*============ D E F A U L T   E L E M E N T S ============*/

rticle, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, section-vid {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
body {
	font-family: 'Raleway', sans-serif;
	font-size: 13px;
	line-height: 25px;
	color: #ffffff;
	overflow-x:hidden;
}

h1 {
	font-family: 'Raleway', sans-serif;
    font-weight: 900;
    font-size: 34px;
    line-height: 45px;
}
h2 {
	font-size: 24px;
	margin-bottom: 20px;
	padding-top: 20px;
	line-height: 36px;
}
h3 {
	font-size: 20px;
	margin-bottom: 20px;
	padding-top: 20px;
}
h4 {
	font-size: 18px;
	margin-bottom: 10px;
}
h5 {
	font-size: 16px;
	margin-bottom: 10px;
	letter-spacing: 1px;
}
h6 {
	font-size: 15px;
	margin-bottom: 10px;
	font-weight: normal;
}

h2, h3 {
	font-family: 'Raleway', sans-serif;
    font-weight: 900;
}

h4, h5, h6{
	font-family: 'Raleway', sans-serif;
}
p {
	font-family: 'Raleway', sans-serif;
    font-weight: 400;
	margin-top: 0px;
	margin-bottom: 20px;
	line-height: 19px;
}
a, a:visited, a:hover, a:active {
	text-decoration: none;
	color: #fff;
	border: none;
	outline: none;
}
.clear {
	clear: both;
	width: 0;
	height: 0;
	padding: 0;
	margin: 0;
	border: none;
	background: transparent;
	display: block;
}

.container {
}

.left {
	float:left;
}
.right {
	float:right;
}

.mtop0 {
	margin-top:0px;
}
.mtop-25 {
	margin-top: -25px;
}
.mbot0 {
	margin-bottom:0px;
}
.ptop0 {
	padding-top:0px;
}
.pbot0 {
	padding-bottom:0px;
}
.mright0 {
	margin-right:0 !important;
}
.mleft0 {
	margin-left:0 !important;
}
.pleft0 {
	padding-left:0 !important;
}
.pleft20 {
	padding-left:20px !important;
}
.pleft40 {
	padding-left:40px !important;
}
.pright0 {
	padding-right:0 !important;
}
.mtop-20 {
	margin-top:-20px;
}
.mtop5 {
	margin-top:5px;
}
.mtop10 {
	margin-top:10px;
}
.mtop15 {
	margin-top:15px;
}
.mtop20 {
	margin-top:20px;
}
.mtop25 {
	margin-top:25px;
}
.mtop30 {
	margin-top:30px;
}
.mtop80 {
	margin-top:80px;
}
.ptop5 {
	padding-top:5px;
}
.ptop10 {
	padding-top:10px;
}
.ptop15 {
	padding-top:15px;
}
.ptop20 {
	padding-top:20px;
}
.ptop25 {
	padding-top:25px;
}
.ptop30 {
	padding-top:30px;
}
.ptop40 {
	padding-top:40px;
}
.mbot-5 {
	margin-bottom:-5px;
}
.mbot5 {
	margin-bottom:5px;
}
.mbot10 {
	margin-bottom:10px;
}
.mbot15 {
	margin-bottom:15px;
}
.mbot20 {
	margin-bottom:20px;
}
.mbot25 {
	margin-bottom:25px;
}
.mbot30 {
	margin-bottom:30px;
}
.pbot5 {
	padding-bottom:5px;
}
.pbot10 {
	padding-bottom:10px;
}
.pbot15 {
	padding-bottom:15px;
}
.pbot20 {
	padding-bottom:20px;
}
.pbot25 {
	padding-bottom:25px;
}
.pbot30 {
	padding-bottom:30px;
}
.pbot5proz {
	padding-bottom:5%;
}
.section {
	width: 100%;
	min-height:  100%;
}
.section .apply {
	width: 30%;
	position: absolute;
	top: 5px;
	left: 5px;
	font-size: 8px;
}
.third {
    display: inline-block;
    position: relative;
    width: 31%;
}
.cont960 {
    width: 960px;
    margin: 0 auto;
}

/*========= H E A D E R ===========*/

.logo {
    position: fixed;
	padding:30px 0 0 40px;
	left: 20px;
    top: 20px;

}
.logo img {
	height: 220px;
	opacity:0.8;
}
.swoosh {
   position: absolute;
	padding:10px 0;
    right:-130px;
    top: -120px;
	}
.swoosh img {
	height: 580px;
	opacity:0.2;
}


/*========= C O N T A C T  S E C T I O N =========== */
.contact-address p {
	margin-bottom:5px;
}
form p {
    font-size: 1em;
    margin-left: 10%;
    margin-top: 20px;
    margin-bottom: 2px;
    line-height: 1em;
    color: #eee;
    
}
#contact-form input[type=text],input[type=password], input[type=email] {
	position: relative;
	display: block;
	width: 82%;
	height: 32px;
	margin: 3px 0 12px 58px;
	font-size: 1.2em;
	line-height: 24px;
	background: rgba(0,0,0,0.7);
	color: #fff;
    border: 1px solid #666;
    -moz-border-radius: 2px; /* Firefox */
	-webkit-border-radius: 2px; /* Safari, Chrome */
	border-radius: 2px; /* CSS3 */
    padding: 1px  0 1px 6px;
	outline: none;
}

::-webkit-input-placeholder {
   color: #999;
    opacity: .5;
}
:-moz-placeholder { /* Firefox 18- */
   color: #999;
    opacity: .5;
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #999;  
    opacity: .5;
}
:-ms-input-placeholder {  
   color: #999; 
    opacity: .5;
}
#contact-form input:focus { 
    background: #fff;
    color: #333;
}
#contact-form input:focus:invalid { 
    box-shadow: 0 0 16px 3px #a00;
}
#contact-form input:focus { 
    box-shadow: 0 0 16px 2px #0a0;
}
.submit-btn {
    font-size: 1.4em;
	position: relative;
    background: rgba(1,255,1,0.7);
	display: block;
	margin: 26px 0 16px 58px;
    width: 82%;
	padding:16px 16px;
	text-decoration: none;
	color: #fff;
	-moz-border-radius: 2px; /* Firefox */
	-webkit-border-radius: 2px; /* Safari, Chrome */
	border-radius: 2px; /* CSS3 */
    border: 1px solid #666;
	outline: none;
	cursor: pointer;
    -webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.submit-btn:hover {
	text-decoration: none;
	background: #fff;
    color: #111;
    box-shadow: 0 0 36px 15px #999;

}
.darkbg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 989;
}
.play {
    margin: 18vh auto;  
    width: 100%;
    z-index: 20;
}
.oben {
    margin: 0 auto;
    position:fixed;
    top:0;
    left:0;
}


div.btn_play {
    display: block;
    background: url(../images/email03.svg) top center no-repeat;
    position: relative;
    min-height: 630px;
    height: 50vh;
    margin: 0 auto;
    width: 660px;
    padding:0;
    border:none;
    z-index: 10;
    opacity: .94;
}
div.btn_play::after {
    content: "";
    background: url(../images/email01.svg) top center no-repeat;
    opacity: 0.3;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
     -webkit-transform: translate3d(0, 0, 0) scale(1.02);
    -ms-transform: translate3d(0, 0, 0) scale(1.02);
    transform: translate3d(0, 0, 0) scale(1.02);
    -webkit-animation:grow 2s 0s ease-in-out infinite alternate;
    -ms-animation:grow 2s 0s ease-in-out infinite alternate;
    animation:grow 2s 0s ease-in-out infinite alternate;
}
div.suc_section {
    display: block;
    position: relative;
    width: 100%;
    padding:0;
    margin-top:35vh;
    border:none;
    z-index: 10;
    text-align: center;
}
div.suc_section h1 {font-size: 8em; opacity: .8;-webkit-animation:grow 2s 0s ease-in-out infinite alternate;
    -ms-animation:grow 2s 0s ease-in-out infinite alternate;
    animation:grow 2s 0s ease-in-out infinite alternate;}
div.suc_section h2 {font-weight: 200; font-size: 4em;}
div.suc_section::after {
    content: "";
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;

}
.suc_section div {
    width: 42%;
    position: relative;
    margin: 15vh auto;
}
.suc_section button {
    font-size: 2.4em;
    background: rgba(1,255,1,0.7);
	display: block;
    width: 100%;
    padding:26px 16px;
	text-decoration: none;
	color: #fff;
	-moz-border-radius: 2px; /* Firefox */
	-webkit-border-radius: 2px; /* Safari, Chrome */
	border-radius: 2px; /* CSS3 */
    border: 1px solid #666;
	outline: none;
	cursor: pointer;
    -webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.suc_section button:hover {
	text-decoration: none;
	background: #fff;
    color: #111;
    box-shadow: 0 0 36px 15px #999;

}
.btn_play p {
    padding: 4em 4em 0 4em;
    font-size: 1em;
    margin-bottom: 2px;
    line-height: 1.5;
    color: #888;
    text-align:center;
}
.btn_play h1 {
    padding: 1.5em 0 .6em 0 ;
    margin: 0;
    font-size: 2.6em;
    line-height: 1.4;
    letter-spacing: 0.1em;
    color: #fff;
    text-align:center;
    opacity: 0.40;
}
.btn_play h2 {
    padding: 8px 0 4px 0;
    margin: 0 0 0 50px;
    font-size: 1.2em;
    font-weight: 200;
    line-height: 1;
    color: #fff;
    text-align:left;
    opacity: 0.40;
}
form p {
    padding: 2% 0 0 0 !important;
    font-size: 1.5em;
}
.inner {
    width: 700px;
    height: 80px;
    margin: 2px auto;
    padding: .1em 0; 
    
}
div.inner::after {
    content: "";
    background: url(../images/email04.svg) top center no-repeat;
    opacity: .85;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    position: absolute;
    z-index: -1;
}
.yeah {
    position: fixed;
    width: 80%;
    margin: 20% 6%;
    padding: 4%;
    color: #333;
    text-align: center;
    -moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	border-radius: 10px;
    background: rgba(255,255,255,0.8);
}
.yeah h1, .noes h1 {font-size: 3em; line-height: 1.5;}
.yeah p, .noes p {font-size: 1.5em;}

.windowimp  {
	position: fixed;
    line-height: 1.4em;
	display: none;
	bottom: 0;
	left: 0;
	margin:0;
	z-index: 998;
	width:100%;
	height: 100%;
	background:#444;
    overflow: scroll;
}
.impressum {
    width: 70%;
    margin: 0 auto;
    padding-top: 30px;
}

 
.closerz {
  	position: absolute;
    top: 0;
	right: 0;
  	z-index: 999;
  	display: block;
  	margin-top: 1em;
  	margin-right: 1em;
  	float: right;
  	height: 50px;
  	width: 50px;
    cursor: pointer;
    fill: #fff;
    -webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	transition: all 0.4s linear;
}

.closerz:hover {
	fill: #333;
    background: #eee;
	}

.imp-foot  {
  	color: #fff;
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	transition: all 0.4s linear;
    padding: 12px 12px 12px 12px;
}
.imp-foot:hover {
	cursor:pointer;
    color: #862;
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	transition: all 0.4s linear;
}
.yt {
    position: relative;
    padding:0 0 25px 0;
    margin:0;

    }
.ytvid iframe {
    width: 960px;
    height: 600px; 
}
.ytvid h3 {
    text-align: center;
    font-weight: 400;
    font-size: 2em;
    margin: 5px 0;
    padding: 0;
}

.greyfac {
    background: #642;
    opacity: 0;
}
.greyclas {
    background: #002;
}
.factions {
    width: 100%;
    z-index: 20;
    opacity: .95;
    font-size: 6em;
}
.factions h1 {
    font-size: 5.7vw;
    padding: 8% 2% 2% 2%;
    margin: 0;
    text-align:center;
}
.factions h2 {
    font-size: 4.7vw;
    padding: 4% 2% 2% 2%;
    margin: 0;
    text-align:center;
}
.factions p {
    padding: 2%;
    font-size: 2vw;
    font-weight: 300;
    line-height: 1.5;
}

.third img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    margin: 10px auto;
    
    
}
.third p {
    font-size: .35em;
    font-weight: 300;
    line-height: 1.1;
    text-align: center;
    padding: 0;
    
}
.blur {
    -webkit-filter: blur(4px);
    filter: blur(4px); 
    -ms-filter: blur(3px);
}
.hidden {
    display:none;
}
.closerx {
  	position: absolute;
    top: 0;
	right: 20px;
  	z-index: 999;
  	display: block;
  	margin-top: 1em;
  	margin-right: 1em;
  	float: right;
  	height: 50px;
  	width: 50px;
    cursor: pointer;
    fill: #002954;
    -webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	transition: all 0.4s linear;
}

.closerx:hover {
	fill: #fff;
    background: #54291f;
	}

.redbg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(170,0,0,0.4);
    z-index: 989;
}
.noes {
    position: fixed;
    width: 50%;
    margin: 10% 24.6% ;
    padding: 4%;
    text-align: center;
    -moz-border-radius: 20px; /* Firefox */
	-webkit-border-radius: 20px; /* Safari, Chrome */
	border-radius: 20px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,8f0222+44,6d0019+100;Brown+Red+3D */
    background: rgb(169,3,41); /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.closery {
  	position: absolute;
    top: 0;
	right: 20px;
  	z-index: 999;
  	display: block;
  	margin-top: 1em;
  	margin-right: 1em;
  	float: right;
  	height: 50px;
  	width: 50px;
    cursor: pointer;
    fill: #ee1212;
    -webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	transition: all 0.4s linear;
}

.closery:hover {
	fill: #fff;
    background: #ff291f;
	}

video#bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(../images/black-criss-cross.png) no-repeat;
    background-size: cover; 
    
}

.video-overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    pointer-events: none;
    opacity: 0.5;
    background-repeat: repeat;
    background-image: url("../images/black-criss-cross.png");
    z-index: -10;
}
.video-underlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    pointer-events: none;
    opacity: 1;
    background-repeat: no-repeat;
    background-image: url("../images/crush_web.jpg");
    background-size: cover;
    z-index: -10;
    display: none;
}
.bottom {
    width: 100%;
    height: 60px;
    background: #222; 
}
.bottom2 {
    position: fixed;
    width: 100%;
    height: 60px;
    bottom:0;
    left:0;
    background: #222; 
}
.bottomcent {
    width: 400px;
    margin: 0 auto;
    padding-top: 25px;
}
.bottomcent img{
    width: 430px;
    padding: 6px 20px;

}
.bottomcent p, .bottomcent a {
    color: #fff;
    text-align: center;
    margin-bottom: 0;    
}


@-webkit-keyframes grow {
    0%
    {-webkit-transform:translate3d(0, 0, 0) scale(1.02)}
    100%
    {-webkit-transform:translate3d(0, 0, 0) scale(0.98)}
}
@keyframes grow {
    0%
    {transform:translate3d(0, 0, 0)  scale(1.02)}
    100%
    {transform:translate3d(0, 0, 0)  scale(0.98)}
}

@media screen and (min-width:0\0) {  
    .btn_play h2 {
        padding: 2.3em 0 0 0;}
   
}
@media only screen and (min-width : 681px) and (max-width : 1400px) {

    .logo img {
        height: auto;
        width: 350px;
        
    }
    .suc_section button {
    font-size: 1.4em;
	padding:16px 12px;
    }

    div.suc_section h1 {font-size: 5em; opacity: .8;}
    div.suc_section h2 {font-weight: 200; font-size: 2.6em;}
  
 }
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 300px) and (max-device-width : 480px) {
    .cont960 {
    width: 310px;
    margin: 0 auto;
    }
    .logo {
	padding:20px 0 0 20px;
	left: 0;
    top: 0;
    }
    .logo img {
        height: auto;
        width: 210px;
        
    }
      .cont960 {
    width: 320px;
        }
    .third {
        width: 29%;
    } 
    .factions p {
        font-size: .2em;
    }
    .bottomcent {
        width: 320px;
    }
    .bottomcent p {
        font-size: 8px;
    }
    .section {
	    width: 100%;

    }
    .windowimp  {
	    width:100%;
        top:0;
        bottom: auto;
    } 
    div.btn_play {
        min-height: 330px;
        height: auto;
        margin: 0 auto;
        width: 300px;
        background: url(../images/email02_portr.svg) top center no-repeat;
    }
    .play {
    margin: 25% auto;  

    }
    .yt {
    position: relative;
    padding:0;
    margin: 10px 30px 10px 30px;
    height: 0;
    }
    .btn_play h2 {
    font-size: 1.2em;
    padding: 3em 0 0 0;
    }
    .btn_play h1 {
    font-size: 2.2em;
    }
    .submit-btn {
    font-size: .8em;
    }
    .contact-form input[type=text], input[type=email] {
	font-size: .8em;
    margin: 16px 0 16px 29px;
    }
    #bgvid {
        display: none;
    }
    .video-overlay {
        display: none;
    }
    .inner {
        width: 300px;
        height: 60px;
        margin: 2px auto;
        padding: .1em 0;
    }
    .topform {
        display: none!important;
    }
   
    div.btn_play::after {
        background: url(../images/email01_portr.svg) top center no-repeat;
    }
    .video-underlay {
        display: block;
    }
    .suc_section button {
        font-size: .8em;
        padding:8px 6px;
    }
    div.suc_section h1 {font-size: 3em;}
    div.suc_section h2 {font-size: 1.6em;}
     .suc_section div {
        width: 70%;
        margin: 5vh auto;
    }
    .ytvid iframe {
        width: 290px;
        height: 150px; 
    }
}


/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .cont960 {
    width: 720px;
    margin: 0 auto;
    }  
    .suc_section button {
    font-size: 1.2em;
    }
    div.suc_section h1 {font-size: 3em; opacity: .8;}
    div.suc_section h2 {font-weight: 200; font-size: 1.6em;}
    
        .ytvid iframe {
        width: 640px;
        height: 360px; 
    }
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
    .cont960 {
    width: 350px;
    margin: 0 auto;
    } 
     .suc_section button {
    font-size: 1.2em;
    }
    div.suc_section h1 {font-size: 3em; opacity: .8;}
    div.suc_section h2 {font-weight: 200; font-size: 1.6em;}
    .suc_section div {
        width: 70%;
    }
        .ytvid iframe {
        width: 320px;
        height: 180px; 
    }
}