@CHARSET "UTF-8";
*{	margin: 0px;padding: 0px;}
@viewport {	zoom: 1;}

body {margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size: 14px;color: #000;background: #000000 !important;}
.clearer {	clear: both;}
p{}
h1,h2,h3,h4,h5,h6{	margin : 10px 0 20px 0; color: #ffffff !important;text-transform: uppercase !important;}
h1{	font-size: 36px !important;margin :0 2px 0 10px;}
h2{	font-size: 18px;color: #79bff9 !important;}
h3{	font-size: 16px;color: #f000ff !important;}
h4{	font-size: 14px;color: #79bff9 ;}
h5{	font-size: 12px;}
h6{	font-size: 10px;}
a{color: #79bff9 ;}
a:hover{text-decoration: none;color: #f000ff;}
ul{color:#ffffff;list-style-type:square;margin:15px 0 0px 25px;}
li {margin: 0 0 10px 0;}
.content{margin:0;width:100%;margin-top: -20px;}
.content p{margin : 10px 0 20px 0;color: #ffffff;}
#glow-line{position: relative;float:left; background: url(image/glow-line2.png);width: calc(100% - 18px);height:30px;}
#glow-line-start{position: relative;float:left; background: url(image/glow-line-start2.png);width:9px;height:30px;}
#glow-line-end{position: relative;float:left; background: url(image/glow-line-end2.png);width:9px;height:30px;}
.header{position:relative;width:100%;z-index:3;/*margin-top: -20px;*/border-bottom: 0px solid #d9d9d9;padding-top: 10px;padding-bottom: 10px;background-color: rgba(31,22,45, 0.8) ;}
.header_inner{}
.header_block{position: relative;float: right;min-height: 1px;padding-right: 15px;padding-left: 15px;}
#logo{width: 159px; height:78px;background: url("image/we_logo.png");background-size: 159px 78px; }
#logo span{display:none;}
/* NAVIGATION */
#main-nav{position: relative;float:right;min-height: 1px;padding-right: 15px;padding-left: 15px; margin-top:28px;text-transform: uppercase;}
#main-nav a, #main-nav link {margin-right:5px;font-size:16px;text-decoration:none;}
#main-nav a:hover{color:#ffffff;}
#back-icon{position: absolute;display:block;right: 20px;	width:40px;height:40px;margin:0px;background: url(image/back_nav.png);background-size: 40px 40px;}
#back-icon span{display: none;}
#go_up{position: fixed;z-index:5;display:block;right: 50px;bottom:30px;width:40px;height:40px;margin:0px;background: url(image/go_up.png);background-size: 40px 40px;}
 /*mobile*/
#mobile_nav-icon{position: absolute;right: 20px;display: none;width:40px;height:40px;margin:0px;background: url(image/mobile_nav.png);background-size: 40px 40px;}
#mobile_nav-icon:hover{background: url(image/mobile_nav_hover.jpg);background-size: 40px 40px;}
#mobile_nav-icon span{display:none;}
#mobile_nav{display:block;display:none;position:relative;z-index:10;width:100%;margin:0 0 0 0;background:rgba(0, 0, 0, 0);font-size: 18px;text-align:left;-webkit-transition: margin .5s ease-in-out;-moz-transition: margin .5s ease-in-out;transition: margin .5s ease-in-out;}
#mobile_nav a{color:#f000ff;padding:5px 8px;display:block;font-size: 25px;text-align: center;}
#mobile_nav a:hover{color:#ffffff;}
#mobile_nav-toggle{height:40px;margin:20px 0 0 0;}
.toggle_nav{display:none;width:100%;height:100vH;padding: 20px 0 0 0;}
/* END NAVIGATION */
#start_pic{background: url( "image/oktaeder_spin_442hq3.mp4") top center no-repeat;position:absolute;background-repeat: no-repeat;background-size: cover;background-position: center center;color: white;width: 100%;height:100vH;min-height: 0px;margin: 0px auto;}
#bg_unten{position:absolute;background: url( "image/Space_unten_3.png") bottom left no-repeat;bottom:0px;background-size:cover;width:100% ;height:150vH;margin:0; mix-blend-mode: none;}
#future_face{position:fixed;background-image: url("image/future_face_big_3.png");background-repeat: no-repeat; background-size:contain;width: 60%;height:60%;top: 200px;left: -15%;mix-blend-mode:screen;transform: scale(1);animation: pulse 10s infinite;}
#designer_logo{position:relative;background-image: url("image/we_logo_start2.png");background-repeat: no-repeat; background-size:cover;background-position: top right;width: 100%;height: 100%; top: 150px;right: 0%;}
#oktaeder_spin{}
/* CONTENT */
#designer{width:90%;}
.designer_pics{position: relative;margin:10px auto 0 auto;width:450px;min-height:250px;}
#designer_pic_1{background: url( "image/Concepter_450x250-2.png") center center no-repeat;background-size:cover;}
#designer_pic_2{background: url( "image/Designer_450x250-2.png") center center no-repeat;background-size:cover;}
#designer_pic_3{background: url( "image/Profiler_450x250-2.png") center center no-repeat;background-size:cover;}
#designer_pic_4{background: url( "image/Analyser_450x250-2.png") center center no-repeat;background-size:cover;}
.text_block_full{position: relative;float:none;min-height: 400px;background-color: rgba(0,15,50,0); width: 100%;margin:0 auto 20px auto;padding: 1px 0 0  0px;/*box-shadow: 0px 0px 10px 5px #1ebede;*/}
.text_block_full p{padding:0 20px 0 20px;margin-left:10px;}
.text_block_right{position: relative;float:left;background-color:rgba(40, 66, 231, 0.2);background-color: rgba(0,15,50,0.8); width: 52%;height: 200px;margin:0px 0px 0px 10px;min-height: 1px;padding: 0px 10px;}
.start-text{float:right;background-color:rgba(0, 0, 90, 0.2);width: 60%;margin:0 0 0 15%;
	position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;}
.first-pic{	float:left;width: 50%;margin:0 20%;	position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;}
.first-pic img{margin: 0; padding:0;width:100%;}
.full{max-width: 1200px;width:100%;padding:120px 0% 5% 0%;}
.col-100{max-width: 1200px;width:100%;margin:0 auto; padding:15px 0 5% 15px;}
.half{width:45%;float: left;margin:0 5% 10px 0;}
.left{position: relative;float: left;width: 48%;min-height: 1px;padding:0 15px 0 15px;margin:0 0 15px 2%;}
.right{position: relative;float: right;width: 48%;min-height: 1px;padding:0 15px 0 15px;margin:0 0 15px 2%;}
.right_2{position: relative;float: right;width: 48%;min-height: 1px;padding:0 15px 0 15px;margin:0 0 15px 2%;}
.violett{background-color:rgba(31,22,45, 0.8);}
.violett_2{background-color:rgba(31,22,45, 0.9);}
.blue{background-color:rgba(36,36,80, 0.8);}
.blue p{}
/* SUB TEMP NEWS ARTIKEL*/
.news{background-color:rgba(0,0,0, 0.8);}
.news_artikel{position:relative;height:100vH;	padding: 140px 0 0 0;}
/* SECTIONS */
/*EVEN*/
section:nth-child(even) {position:relative;width:100%;min-height:0px;height:auto;border-top: solid 0px #fff;padding:0px 0 140px 0;}
section:nth-child(even) p{}
section:nth-child(even) h1{}
/*ODD*/
section:nth-child(odd) {position:relative;width:100%;min-height:0px;border-top: solid 0px #313131;padding:0px 0 140px 0;}
section:nth-child(odd) p{}
section:nth-child(odd) h1{}
/*FIRST*/
section:first-child {}
section:first-child p{}
section:first-child h1 {}
/*LAST*/
.content section:last-child {margin: 0;}
section:last-child p{padding: 0 10px;}
section:last-child a:hover{}
section.active {}
.first{padding:0px 0 0 0 !important;height:100vH !important; background-color:rgba(0,0,0, 0.2);}
.first_2{padding:0 !important;background-color:rgba(0,0,0, 1) !important;}
.text{margin: 98px 0 0 0; }
.two{background-color:rgba(0,0,0, 0.8);margin:0px auto -15px auto;}
.three{padding:100px 0 0 0;margin:-15px auto 0 auto;}
.four{background-color:rgba(50,22,45, 0.8);margin:-15px auto 0 auto;}
.five{padding: 0% 5% 0% 10% !important;background-color:rgba(0,0,0, 0);}
.six{padding: 0% 5% 0% 10%;background-color:rgba(0,0,0, 0.4);margin:-15px auto 0 auto;}
/*SECTION BUY */
.buy_block_01{float: left;position: relative;width: 48% !important;margin-right: 2%;padding-right: 0px;padding-left: 0px;margin-bottom: 30px;overflow: hidden;}
.buy_block_text_01{width:100%;padding:15px 15px 25px 15px;}
.buy_block{float: left;position: relative;width: 31.33333333% !important;margin-right: 2%;padding-right: 0px;padding-left: 0px;margin-bottom: 30px;overflow: hidden;}
.buy_block_head{widht:100%;padding: 15px;margin: 0 0 10px 0;}
.buy_block_text{width:100%;padding: 15px;}
.buy_block_A_bg{background:url("image/&_zusammen.svg") no-repeat;background-size: 50%;background-position: right center;}
.buy_block_B_bg{background:url("image/+_zusammen.svg") no-repeat;background-size: 50%;background-position: right center;}
.buy_block_1_bg{background:url("image/&_zusammen.svg") no-repeat;background-size: 50%;background-position: right center;}
.buy_block_2_bg{background:url("image/+_zusammen.svg") no-repeat;background-size: 50%;background-position: right center;}
.buy_block_3_bg{background:url("image/>_zusammen.svg") no-repeat;background-size: 50%;background-position: right center;}
.blue_buy_1{background-color:rgba(40,29,66, 1);}
.blue_buy_2{background-color:rgba(50,35,92, 1);}
.rosa_buy_1{background-color:rgba(69,24,76, 1);}
.rosa_buy_2{background-color:rgba(124,29,130, 1);}
.lila_buy_1{background-color:rgba(64,38,108, 1);}
.lila_buy_2{background-color:rgba(129,54,255, 1);}
.add-ons{background: rgba(36,36,80, 0);border:white 1px dotted;min-height:388px;}
.add-ons {}
/*SECTION USE */
.use_block{float: left;height:850px;position: relative;width: 23% !important;margin-right: 2%;padding-right: 0px;padding-left: 0px;margin-bottom: 30px;overflow: hidden;}
.use_block_text{width:100%;height:100%;padding: 15px;}
.use_block_text h2{font-size: 18px !important;color: #ffffff !important;}
/* BUTTON */
.button_container{position: absolute;bottom:0px;right:10px;width: 100%;max-width: 200px;height: 45px;margin: 20px auto;padding: 0px;background-color:rgba(0,0,0,0.6);background-image:url('image/arrows_more.svg');background-repeat: no-repeat;}
.button_container_2{position: absolute;bottom:0px;right:10px;width: 100%;max-width: 200px;height: 45px;margin: 20px auto;padding: 0px;background-color:rgba(64,38,108, 1);background-image:url('image/arrows_more.svg');background-repeat: no-repeat;}
.button_container:hover{}
.button img{background: url('image/button_bg_rund.png') 125px 125px; width:100%;height:125px;border:0px;}
.button span{padding:10px;}
.button_container .button, .button_container_2 .button{position: absolute;width:100%;top: 50%;margin: 0 auto;  transform: translate(0%, -50%);  -ms-transform: translate(0%, -50%);  color: #DF00E4;	background: none;  font-size: 15px;line-height: 13px; font-weight: normal; text-transform: uppercase;  padding: 12px 24px;  border: none;  cursor: pointer;  border-radius: 5px;  text-align: center;}
.button_container .button:hover {color:aqua;}
/* FOOTER */
.footer_left{position: relative;float:left;width:50%;min-height: 1px;padding-right: 15px;padding-left: 15px;}
.footer_right{position: relative;float:right; width:40%;min-height: 1px;padding-right: 15px;padding-left: 15px;}
.footer_nav{}
#future_face_footer{background: url( "image/future_face_footer.png") center center no-repeat;background-size:cover;width:200px ;height:200px;margin:0 0 20px -20px;}
#za-logo{background: url( "image/za-logo.png") center center no-repeat;background-size:contain;width:200px ;height:146px;margin:0 0 20px 0;}
.footer_nav{float:left;width:25%;margin:0 0 0 0;}
.footer_adress{}
.za-contact{margin: 10px auto;}
#iframe-brand{margin: 10px auto;padding: 0 2% 16px 2%;max-width:1170px;width: 96%;}
#foot-theme{background-color: rgba(0,0,0, 0.4) !important;/*background: linear-gradient(to bottom, rgba(0,0,0,0.4), rgba(0,0,0,1)) !important;*/margin: 0px 0 0 0;border-top: solid 0px #313131;padding: 0px 0 0 0;position: relative;width: 100%;min-height: 200px;}
#foot-theme span{color:#313131;}
#foot-theme p {color:#ffffff;}
#foot-theme a {color:#1ebede;}
#foot-theme a:hover {color:#f000ff;}
#socialmedia{float:left;text-align:center;}
.fa_foot{display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit;font-size: 25px;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;margin:0 0 0 10px;}
/* SOCIAL NAVI */
.vertical-nav-holder{z-index:2 !important;}
/* PAGE LSIT*/
div.ccm-page div.ccm-block-page-list-thumbnail-grid-wrapper div.ccm-block-page-list-page-entry-grid-item{float: left;width: 31.33333333% !important;margin-right: 2%;}
.page-list-page-entry{background-color:rgba(31,22,45, 0.8);}
/* RESPONSIVE */
@media (max-width:1320px){#designer_logo{background-size: 120%;top:250px;}}
@media (max-width:1200px){#designer_pic_1, #designer_pic_2, #designer_pic_3, #designer_pic_4 {width:405px;min-height:225px;}
		.use_block{float: left;position: relative;width:48% !important;margin:0 1% 20px 1%;height:750px;padding-right: 0px;padding-left: 0px;margin-bottom: 30px;overflow: hidden;}
		.fix_height{min-height:600px;}
}
@media (min-width:1200px){}

@media (max-width:1080px){}
@media (max-width:992px){
	.start-text{width: 80%;margin: 0 5% 0 0;}
	#future_face{width: 60% ;height:60%;top:200px; left:-30%;}
	#future_face_footer{width:350px ;height:350px;margin:0 0 0 -20px;}
	.full{width: 100%;padding: 120px 0% 5% 0%;}
	.half{width:90%;margin:0;float: left;}
	.text_block_right{float:left;width: 60%;height: 200px;margin: 0px 10px;}	
	.fix_height{min-height:500px;}
}
@media (min-width:992px){
	.full{width: 100%;padding: 120px 0% 5% 0%;}		
}	
@media (max-width:900px){
	.fix_height{min-height:500px;}
	.use_block{height:850px;}
}
@media (max-width: 768px){
	.buy_block{float: left;width: 33.33333333%;}
	.left, .right, .right_2{width: 50%;}
	.use_block{height:750px;min-height:750px;}
	.use_block{width:98% !important;min-height:auto;height:auto;}
}
@media (min-width: 768px){
	.col-sm-3{width:35% !important;}
	.col-sm-6{width:65%;}
}
@media (max-width: 768px){
	.container {padding-right: 15px;padding-left: 35px;}
	.left, .right, .right_2{float:none;width: 100%;padding: 0;}
	#designer_logo{background-size: 200%;left:25%;}
	#oktaeder_spin{width: 75%;height: 75%;	top: -7%;}
	div.ccm-page div.ccm-block-page-list-thumbnail-grid-wrapper div.ccm-block-page-list-page-entry-grid-item{float: left;width: 100% !important ;margin-right: 0%;}
	.buy_block, .buy_block_01{float: none;position: relative;width:100% !important;margin: 0% 0% 15px 0%;}
	.fix_height{min-height:400px;}
}
@media (max-width:645px) {
	#main-nav{display: none;}
	#mobile_nav{display:block;}
	#mobile_nav-icon {display:block;}
	.header{position:fixed;margin-top: 16px;}
	#go_up{display:none;}
	#za-logo{float:none;width:100% ;height:146px;margin:0 auto 20px auto;}
	.footer_nav{float:right;width:80%;margin:0 0 20px 0;}
	.footer_adress{width:75%;margin:0 0 0 25%;}
	#iframe-brand{width:80%;margin:0 0 0 25%;}
	#future_face{width: 100% ;height:100%;top:120px; left:-75%;}
	.vertical-nav-holder{top:75% !important; }
	#oktaeder_spin{width: 50%;height: 50%;top:-20px;}
	.use_block{width:98% !important;min-height:auto;height:auto;}
}
@media (max-width:450px) {
	.first{height: auto;}
	#designer_logo{right: 0%;top:200px;}
	#logo{margin: 0 0 0 20px;}	
	.half{width:100%;margin:0;}
	.designer_pics{float: none;		margin: 0 auto !important;}
	#designer_pic_1, #designer_pic_2, #designer_pic_3, #designer_pic_4 {width:315px;min-height:175px;}
	.text_block_full{min-height: 200px;}
	.text_block_full p{padding:0px;margin-left:0px;}
	.text_block_right{float: left;height: 200px;width: 100%;padding: 5% 5% 5%  10%;	margin: 60px 0 0 0;}
	.footer_left{float:left;width:50%;margin-left:-30%;min-height: 1px;padding-right: 15px;padding-left: 15px;}
	.footer_right{float:right; width:70%;min-height: 1px;padding-right: 15px;padding-left: 15px;}
	/*#iframe-brand {padding: 0 2% 16px 16%;width: 80%;}*/
	#future_face_footer{width:250px ;height:250px;margin:0 0 20px -50px;}
}
@media (max-width:320px) {
	#iframe-brand{width:90%;margin:0 0 0 10%;}
	#designer_logo{right: 0%;top:200px;}
	#oktaeder_spin{top:-10px;}
	#designer_pic_1, #designer_pic_2, #designer_pic_3, #designer_pic_4 {width:270px;min-height:150px;}
}