/* ====================================================================
   WDS.media GmbH
   Project name: Kubus.One
   URL: https://studio.kubus.one
   Document: stylesheets.css
   Author: Gordon P. Ries
===================================================================== */

@font-face {
  font-family: "UniformCondensed";
  src: url(/fonts/UniformCondensed.woff) format("woff"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "UniformCondensedMedium";
  src: url(/fonts/UniformCondensedMedium.woff) format("woff"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "UniformCondensedBold";
  src: url(/fonts/UniformCondensedBold.woff) format("woff"); /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}

* { box-sizing: border-box; }
a { text-decoration: none; color:#000; }
a:focus, a:hover { color: #000; text-decoration: none; }

body {
	background: #fff;
	font-family: 'UniformCondensed', sans-serif;
	font-size: 16px;
	color: #000;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-font-smoothing: subpixel-antialiased;
	image-rendering: optimizeQuality;
	-ms-interpolation-mode: bicubic;
	overflow-x: hidden;
}

.row960 { max-width:960px; margin:0 auto; }


/* FLOAT-PANEL (NAVI ON TOP) */
/* ------------------------------------------------------------------ */
.float-panel {
    width:100%;
    background:white;
    z-index:300;
    padding:0; 
    transform: translateZ(0);
    transition:all 0.5s;
}
.float-panel .content-area {
    margin:0;
}              
.float-panel .fa-gg {                  
    color:#F0595C;
    font-size:30px;
    vertical-align:middle;                  
    transition:all 1s;                  
}

/* Float Panel: class="float-panel fixed" */

.fixed {
    box-shadow:0 1px 6px rgba(0,0,0,0.2);  
    padding:4px 0;
    animation:slide-down 0.7s;
    opacity:0.9;    
}                  
.fixed .fa-gg {                  
    transform: rotate(360deg);      
}
@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-100%);
    } 
    100% {
        opacity: 0.9;
        transform: translateY(0);
    } 
}
/* ------------------------------------------------------------------ */
/* END // FLOAT-PANEL (NAVI ON TOP) */


/* NAVIGATION */
/* ------------------------------------------------------------------ */
nav {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	text-align: right;
	width: auto;
	float:right;
}

nav ul {
	margin:32px 0 0 0;
	right:0p;
}

nav ul li {
	width:120px;
	display: inline;
	list-style: none;
    display: table-cell; 
    text-align: center; 
    vertical-align: middle;
	padding-left:10px;
	padding-right:10px;
}
nav ul li a {
	color: #000;	
	font-family: UniformCondensed;
	font-size:16px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}
nav ul li a:hover, nav ul li a.selected {
	color: #000;
	font-family: UniformCondensedBold;	
	font-size:16px;
	text-decoration: none;
	font-weight:normal;
}

nav ul > li:last-child a{
	color: #fff;
}

nav ul > li:last-child {
	background-color: #000;
	padding: 2px 18px 2px 18px;	
}

.mobilenavigation {
	display:none;
}

@media (max-width: 992px) {
	.mobilenavigation { 
		display: block;
		height:53px;
		display: flex;
		align-items: center;
		margin-left:105px;		
	}
	nav ul { display: none;	}
}

#button-mobile-menu { 
	text-decoration:none;
}
/* ------------------------------------------------------------------ */
/* END // NAVIGATION */


/* HEADLINES, TYPPOGRAPHY */
/* ------------------------------------------------------------------ */
h1, h2, h3, h4, h5, h6 {
	color: #000;
	line-height: normal;
	margin:0;
}
h1 {
	text-transform:uppercase;
 	font-size: 32px;
}
h1 .highlight {
	font-family: 'UniformCondensedBold', sans-serif;	
}
h2 {
	text-transform:uppercase;
 	font-size: 28px;	
}
h2 .highlight {
	font-family: 'UniformCondensedBold', sans-serif;	
}
h3 {
	font-family: 'UniformCondensedBold', sans-serif;
	font-size:24px;
	margin-bottom:20px;
}
.highlight {
	font-family: 'UniformCondensedBold', sans-serif;	
}

p strong {
	font-family: 'UniformCondensedBold', sans-serif;
}
/* ------------------------------------------------------------------ */
/* END // HEADLINES, TYPPOGRAPHY  */


/* SECTION INFO */
/* ------------------------------------------------------------------ */

.info-bg-white { background-color:#fff; z-index:0; height:230px; }

.info-bg-blue {	background-color:#079acf; z-index:0; height:570px; }
@media (max-width: 1200px) {
	.info-bg-blue { height:670px; }
}
@media (max-width: 576px) {
	.info-bg-blue { height:600px; }
}

.info-bg-grey {	background-color:#eee; z-index:0; height:560px; }
@media (max-width: 1200px) {
	.info-bg-grey { height:620px; }
}
@media (max-width: 576px) {
	.info-bg-grey { height:510px; }
}
@media (max-width: 350px) {
	.info-bg-grey { height:700px; }
}

.mood-ar {
	margin-top:25px;
	margin-left:-150px;
	width:800px;
	height:360px;
}

@media (max-width: 1200px) {
	.mood-ar  {
	margin-left:100px;	
	margin-top:-25px;
    max-width: 100%;
    height: auto;		
	}
}

@media (max-width: 768px) {
	.mood-ar  {
	margin-left:0px;	
	margin-top:25px;
    max-width: 100%;
    height: auto;		
	}
}

.info-testing {
	margin-top:-120px;	
}

@media (max-width: 1200px) {
	.info-testing {
		margin-top:-25px;	
	}
}

@media (max-width: 768px) {
	.info-testing {
		margin-top:0px;	
	}
}

.btn-moreinfo {
	font-family: 'UniformCondensed', sans-serif;	
	color:#fff;
	font-size:16px;
	font-weight: lighter;
	text-decoration: none;
}

.btn-moreinfo {
  margin: 0 auto;
  display: block;
  height: 40px;
  /* background: url(../images/arrow-down.svg);
  background-size: 24px 14px;
  background-repeat: no-repeat;
  background-position: bottom center; */
  margin-top:75px;
  margin-bottom:20px;
}

.btn-moreinfo-icon {
	width: 24px;
	height: 14px;
	margin:0 auto;
	margin-top:-3px;
	-webkit-animation: sdb04 2s infinite;
  	animation: icondown 2s infinite;
  	box-sizing: border-box;
}

@-webkit-keyframes icondown {
  0% {
    -webkit-transform:  translate(0, 0);
  }
  20% {
    -webkit-transform:  translate(0, 10px);
  }
  40% {
    -webkit-transform:  translate(0, 0);
  }
}

@keyframes icondown {
  0% {
    transform: translate(0, 0);
  }
  20% {
    transform: translate(0, 10px);
  }
  40% {
    transform:  translate(0, 0);
  }
}

.btn-big {
	text-transform: uppercase;
	font-family: 'UniformCondensedBold', sans-serif;	
	font-size:20px;
	font-weight:800;
    display: inline-block;
    color:#fff !important;
    padding: 6px 30px 5px 30px;
    text-decoration: none;
    text-transform: uppercase;
	background-color:transparent;
}

.btn-big.black { background-color:#000; }
.btn-big.green { background-color:#25d03a; }
.btn-big.pink { background-color:#ff46b1; }

.btn-big:hover {
	text-decoration: underline;
}

.btn-hero {
	font-family: 'UniformCondensedBold', sans-serif;	
}

.btn-hero:hover {
	text-decoration: underline;
}

.btn-testing-descr {
	max-width:270px;
	text-align: left;
	padding-top:8px;
	font-family: 'UniformCondensed', sans-serif;	
	font-size:12px;
	line-height:14px;
	font-weight:100;
    color:#fff;
}

.testing-hr {
	max-width:265px;
	height:1px; 
	border:none; 
	color:#fff; 
	background-color:#fff;  
	text-align:left; 
	margin-left:0px;
	margin-top:12px;
	margin-bottom:6px;	
}

.btn-testing-customer {
	max-width:270px;
	text-align: left;
	padding-top:8px;
	font-family: 'UniformCondensed', sans-serif;	
	font-size:16px;
	line-height:14px;
	font-weight:100;
    color:#fff;
	margin:0;
}

.btn-testing-login {
	text-transform: uppercase;
}
.btn-testing-login a:link, .btn-testing-login a:visited {
	color:#fff;
}
.btn-testing-login a:hover {
	text-decoration:underline;
}

.slanting-info {
	height:550px; 
	width:100%; 
	background-color:#eee; 
	transform: skew(0, -5deg); 
	position: absolute; 
	margin-top:-390px; 
	padding-bottom: 150px
}

/* ------------------------------------------------------------------ */
/* END // HEADLINES, TYPPOGRAPHY  */


/* SECTION FUNKTIONEN */
/* ------------------------------------------------------------------ */

.process-line {
	margin:0 auto;
	margin-top: 80px;
	margin-bottom:50px;
	width: 740px;
	height: 1282px;
	background: url(../images/process-line-center.svg);
  	background-repeat: no-repeat;
  	background-position: top center;
  	background-size: 329px 1211px;	
}

@media (max-width: 576px) {
	.process-line {
		margin:0 auto;
		max-width:100%;
		height:2372px;
		background: url(../images/process-line-left.svg);
		background-repeat: no-repeat;
		background-position: top left+10px;
  		background-size: 167px 2058px;			
	}
}

.process-top-1 span,  .process-top-2 span { 
	font-size: 24px; 
	text-transform: uppercase; 
	font-family: 'UniformCondensedBold', sans-serif; 
}

.process-top-1 { 
	text-align:center; 
	padding-right:175px; 
	padding-top:2px; 
}

.process-top-2 { 
	text-align:center; 
	padding-left:180px; 
	padding-top:2px; 
}

@media (max-width: 576px) {
	.process-top-1 { 
		text-align:left; 
		padding-left:75px; 
		padding-top:7px; 
	}
	.process-top-2 { 
		text-align:left; 
		padding-left:65px; 
		padding-top:84px; 
	}	
}

.process-row1 { height:40px; }

.process-row2 { height:220px; }
.process-row2 .process-headline { padding-left:40px; padding-top:95px; }
.process-row2 .process-text { padding-left:40px; padding-top:5px; }

.process-row3 { height:180px; }
.process-row3 .process-headline { padding-left:40px; padding-top:55px; }
.process-row3 .process-text { padding-left:40px; padding-top:5px; }

.process-row4 { height:264px; }
.process-row4 .process-headline { padding-left:40px; padding-top:55px; }
.process-row4 .process-text { padding-left:40px; padding-top:5px; }

.process-row5 { height:40px; }

.process-row6 { height:185px; }
.process-row6 .process-headline { text-align:right; padding-top:73px; padding-right: 35px; }
.process-row6 .process-text { text-align:right;  padding-right: 35px; padding-left:15px; padding-top:5px; }

.process-row7 { height:185px; }
.process-row7 .process-headline { text-align:right; padding-top:70px; padding-right: 35px; }
.process-row7 .process-text { text-align:right;  padding-right: 35px; padding-left:15px; padding-top:5px; }

.process-row8 { height:200px; }
.process-row8 .process-headline { text-align:right; padding-top:68px; padding-right: 35px; }
.process-row8 .process-text { text-align:right;  padding-right: 35px; padding-left:15px; padding-top:5px; }

.process-row2 .col-icon { padding-top:60px; padding-left: 70px; }
.process-row3 .col-icon { padding-top:20px; padding-left: 70px; }
.process-row4 .col-icon { padding-top:25px; padding-left: 70px; }
.process-row6 .col-icon { padding-top:50px; padding-right: 90px; }
.process-row7 .col-icon { padding-top:45px; padding-right: 80px; }
.process-row8 .col-icon { padding-top:40px; padding-right: 80px; }

@media (max-width: 576px) {
	.process-row1 { height:45px; }
	.process-row2 { height:360px; }	
	.process-row3 { height:300px; }
	.process-row4 { height:370px; }
	.process-row5 { height:120px; }
	.process-row6 { height:366px; }
	.process-row7 { height:294px; }
	.process-row8 { height:376px; }
	
	.process-row2 .col-icon { height:180px; text-align: left; padding-top:90px; padding-left:80px; }
	.process-row2 .col-text { height:180px; }
	.process-row2 .process-headline { padding-left:80px; padding-top:10px; }
	.process-row2 .process-text { padding-left:80px; }	
	
	.process-row3 .col-icon { height:150px; text-align: left; padding-top:60px; padding-left:70px;}
	.process-row3 .col-text { height:150px; }
	.process-row3 .process-headline { padding-left:80px; padding-top:10px; }
	.process-row3 .process-text { padding-left:80px; }		
	
	.process-row4 .col-icon { height:185px; text-align: left; padding-top:110px; padding-left:80px; }
	.process-row4 .col-text { height:185px; }
	.process-row4 .process-headline { padding-left:80px; padding-top:10px; }
	.process-row4 .process-text { padding-left:80px; }	
	
	.process-row6 .col-icon { height:183px; text-align: left; padding-top:95px; padding-left:70px; }
	.process-row6 .col-text { height:183px; }
	.process-row6 .process-headline { text-align:left; padding-left:80px; padding-top:10px; }
	.process-row6 .process-text { text-align:left; padding-left:80px; }	
	
	.process-row7 .col-icon { height:147px; text-align: left; padding-top:85px; padding-left:70px; }
	.process-row7 .col-text { height:147px; }
	.process-row7 .process-headline { text-align:left; padding-left:80px; padding-top:10px; }
	.process-row7 .process-text { text-align:left; padding-left:80px; }		
	
	.process-row8 .col-icon { height:188px; text-align: left; padding-top:110px; padding-left:70px; }
	.process-row8 .col-text { height:188px; }
	.process-row8 .process-headline { text-align:left; padding-left:80px; padding-top:10px; }
	.process-row8 .process-text { text-align:left; padding-left:80px; }		
	
}

.process-icon { width:95px; height:95px; }
.col-icon { text-align: center; }

.process-headline { font-size: 24px; text-transform: uppercase; font-family: 'UniformCondensedBold', sans-serif; margin:0; }
.process-text { font-size: 16px; font-family: 'UniformCondensed', sans-serif; line-height: 20px; margin:0; padding-right:10px; }


.box-info {
	margin:9px;
	width:222px;
	height:280px;
	border: 8px solid #ffee00;
  	padding: 10px;
  	padding-top: 130px;
	background: url(../images/plus-symbol.svg);
	background-size: 30px 30px;
	background-repeat: no-repeat;
	background-position: top left;
}

.slanting-funktionen {
	height:660px; 
	width:100%; 
	background-color:#eee; 
	transform: skew(0, -5deg); 
	position: absolute; 
	margin-top:-680px; 
	z-index:-100;
}

@media (max-width: 576px) { 
	.slanting-funktionen {
		height:1250px; 
		width:100%; 
		background-color:#eee; 
		transform: skew(0, -5deg); 
		position: absolute; 
		margin-top:-1300px; 
		z-index:-100;
	}
}

/* CHECK GRID
.col-icon{ background-color:rgba(39,200,39,0.05); border-bottom: 1px dotted rgba(0,0,0,0.2); }
.col-text{ background-color:rgba(190,0,255,0.05); border-bottom: 1px dotted rgba(0,0,0,0.2); }
.process-row1, .process-row5 { background-color:rgba(220,160,140,0.2); border-bottom: 1px dotted rgba(0,0,0,0.2); }
END // CHECK GRID  */

.presentation-icon img { width:64px; height:64px; margin-right:25px; }
.presentation-text { line-height: 1.5em; }

.responsive-video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.responsive-video {
	position: relative;
	padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
	padding-top: 0px;
	height: 0;
	overflow: hidden;
}

/* ------------------------------------------------------------------ */
/* END // SO FUNKTIONIERT ES  */


/* PREISE */
/* ------------------------------------------------------------------ */

.box-trial {
	transform: skew(0, -5deg);
	border: 8px solid #000;
	padding: 20px;
	text-align:center;
	background:#fff;
}

.box-trial p {
	font-size:18px;
}

ul.kubus-prices {
    list-style: none;
    padding-left: 1em;
    text-indent: -1em;
	margin-top:15px;
}

ul.kubus-prices li {
	color:#1f1f1f;
	margin-bottom:10px;
	line-height:16px;
}

ul.kubus-prices li:before {
    content:'› ';
	color:#000;
	font-weight: 100;

}

ul.kubus-prices li.plus {
	color:#000;
	margin-bottom:10px;
	line-height:20px;
	font-family: 'UniformCondensedBold', sans-serif;
	font-weight:100;
}

ul.kubus-prices li.plus:before {
    content:'+ ';
	color:#000;
	font-weight: 100;
}

.kubus-abos { margin-bottom:25px; }

.kubus-abos .headline {
	margin-top:30px;
	margin-bottom:0px;
	font-size:18px;
	font-family: 'UniformCondensedBold', sans-serif;
	font-weight:100;	
}

.kubus-abos .preprice { font-size:12px; }

.kubus-abos .price-numbers { 
	font-size:24px; 
	font-family: 'UniformCondensedBold', sans-serif;
	font-weight:100;
}

.kubus-abos .price-savings { 
	font-family: 'UniformCondensedBold', sans-serif;
	font-weight:100;
}

span.price-savings.blue { 
	color:#079acf;
}

.spacer-prices-1 { width:100%; height:80px; }
.spacer-prices-2 { width:100%; height:30px; }

.hr-prices {
	display:none;
	border: none 0;
    border-bottom: solid 1px #666;
    color: #fff;
    background-color: #fff; 
    clear: both;
	width:85%;
	margin-top:40px;
	margin-bottom:30px;
}

@media (max-width: 992px) {
	.hr-prices { display:block; }
	.spacer-prices-1 { display:none; }
	.spacer-prices-2 { display:none; }
}

.slanting-preise { 
	height:740px; 
	width:100%; 
	background-color:#eee; 
	transform: skew(0, -5deg); 
	position: absolute; 
	margin-top:-670px; 
	z-index:-100;
}

@media (max-width: 992px) {
	.slanting-preise { 
		height:1600px; 
		width:100%; 
		background-color:#eee; 
		transform: skew(0, -5deg); 
		position: absolute; 
		margin-top:-1550px; 
		z-index:-100;
	}
}


/* ------------------------------------------------------------------ */
/* END // PREISE  */


/* DOWNLOADS */
/* ------------------------------------------------------------------ */

.row-download {
	margin-top:-90px;
	transform: skew(0, -5deg);	
}

.box-download-app {
	margin-top:20px;
	border: 8px solid #25d03a;
	padding: 20px;
	text-align:center;
	background:#fff;
}

.box-download-marker {
	margin-top:20px;
	border: 8px solid #ff46b1;
	padding: 20px;
	text-align:center;
	background:#fff;
}

/* ------------------------------------------------------------------ */


/* FOOTER */
/* ------------------------------------------------------------------ */

.footer-blue {
	margin-top:120px;
	height:116px; 
	background: linear-gradient(
		rgba(255, 255, 255, 1) 0%
		, rgba(255, 255, 255, 1) 50%
		, rgba(7, 154, 207, 1) 50%
		, rgba(7, 154, 207, 1) 100% 
	);
}

@media (max-width: 576px) {
	.footer-blue { 
		height:250px; 
		background: linear-gradient(
			rgba(255, 255, 255, 1) 0%
			, rgba(255, 255, 255, 1) 20%
			, rgba(7, 154, 207, 1) 20%
			, rgba(7, 154, 207, 1) 100% 
		);
	}
}

.footer-blue-logo { 
	text-align: left; 
	padding-top:33px;
}

.footer-blue-mail {  
	text-align: center; 
	padding-top:40px; 
}

.footer-blue-sm { 
	text-align:right; 
	padding-top:40px;
}

.footer-blue-sm .icon-sm {
	width:40px; 
	height:40px;
	margin-left:14px;
}

.footer-blue-sm .icon-sm {
	margin-left:8px;
}
	
@media (max-width: 576px) {
	.footer-blue-logo { 
		text-align: left; 
		height:70px;
		padding-top:25px;
	}

	.footer-blue-mail { 
		text-align: left; 
		height:70px; 
	}

	.footer-blue-sm { 
		margin-left:0px;
		text-align: left; 
		height:70px;
	}
}

.footer-black { 
	height:35px; 
	background-color:#000; 
	color:#fff; 
	font-size:12px; 
	text-transform: uppercase;
	padding-top:7px;
}

.footer-black .imprint { 
	text-align: left;
	font-family: 'UniformCondensed', sans-serif;
	font-weight:400;
	word-spacing:1.5em;
	white-space:nowrap;
}

@media (max-width: 576px) {
	.footer-black .imprint {
		font-size:11px;
		word-spacing:0.5em;
	}
}

.footer-black .copyright { 
	text-align: right;
	font-family: 'UniformCondensed', sans-serif;
	font-weight:100;
	white-space:nowrap;
}

a.meta-link  { color:#fff; }
a.meta-link:hover { 
	color:#fff;
	text-decoration: underline;
}

a.meta-mail  { 
	color:#000; 
	font-size:22px;	
	font-family: 'UniformCondensedBold', sans-serif; 
}

a.meta-mail:hover  { 
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* END // PREISE  */


/* IMPRESSUM / DATENSCHUTZ */
/* ------------------------------------------------------------------ */
.imprint-text strong {
	font-family: 'UniformCondensedBold', sans-serif; 
}
.imprint-text  {
	padding:20px;
}
/* ------------------------------------------------------------------ */
/* END // IMPRESSUM / DATENSCHUTZ  */


/* DOWNLOADS*/
/* ------------------------------------------------------------------ */
a.btn-back { 
	text-transform: uppercase;
	font-size:15px;
}

a.btn-back:hover { 
	color:#000;
	text-decoration: underline;
}

section#apps { margin-top:90px; }

.btn-store { 
	width:160px; 
	height:47px; 
	margin:0 auto; 
	margin-bottom: 10px; 
} 
.download-text { 
	margin-top: 10px; 
	padding-right: 35px;
}
.disclaimer-text { 
	font-size:10px; 
	color:#aaa; 	
	font-family: 'UniformCondensed', sans-serif; 
	font-weight: 100; 
	line-height:1.1em; 
}


section#marker { margin-top: 120px; }

section#downloads { margin-top:120px; min-height:200px; margin-bottom: 50px; }

.slanting-download {
	height:250px; 
	width:100%; 
	background-color:#eee; 
	transform: skew(0, -5deg); 
	position: absolute; 
	margin-top:-190px; 
	padding-bottom: 150px;
	z-index:-100;
}

section#viewer { margin-top:00px; }
/* ------------------------------------------------------------------ */
/* END // DOWNLOADS  */