@charset "UTF-8";
/* CSS Document */


/* ##### GENERELL SETTINGS #####----------------------------------*/

body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font-weight:normal;
	font-size:16px;
	line-height:18px;
	font-family:'exoregular';
	color:rgba(0,0,0,1);
	background-color:rgba(255,212,0,1);
}

/* ##### FONTS ##### ----------------------------------*/

@font-face {
    font-family:'exoblack';
    src: url('fonts/exo/black/exo-black-webfont.eot');
    src: url('fonts/exo/black/exo-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/exo/black/exo-black-webfont.woff2') format('woff2'),
         url('fonts/exo/black/exo-black-webfont.woff') format('woff'),
         url('fonts/exo/black/exo-black-webfont.ttf') format('truetype'),
         url('fonts/exo/black/exo-black-webfont.svg#exoblack') format('svg');
    font-weight:normal;
    font-style:normal;
	letter-spacing:0.05em;
}
@font-face {
    font-family:'exobold';
    src: url('fonts/exo/bold/exo-bold-webfont.eot');
    src: url('fonts/exo/bold/exo-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/exo/bold/exo-bold-webfont.woff2') format('woff2'),
         url('fonts/exo/bold/exo-bold-webfont.woff') format('woff'),
         url('fonts/exo/bold/exo-bold-webfont.ttf') format('truetype'),
         url('fonts/exo/bold/exo-bold-webfont.svg#exoblack') format('svg');
    font-weight:normal;
    font-style:normal;
	letter-spacing:0.04em;
}
@font-face {
    font-family:'exoregular';
    src: url('fonts/exo/regular/exo-regular-webfont.eot');
    src: url('fonts/exo/regular/exo-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/exo/regular/exo-regular-webfont.woff2') format('woff2'),
         url('fonts/exo/regular/exo-regular-webfont.woff') format('woff'),
         url('fonts/exo/regular/exo-regular-webfont.ttf') format('truetype'),
         url('fonts/exo/regular/exo-regular-webfont.svg#exoblack') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'exolight';
    src: url('fonts/exo/light/exo2-extralight.eot');
    src: url('fonts/exo/light/exo2-extralight.eot?#iefix') format('embedded-opentype'),
         url('fonts/exo/light/exo2-extralight.woff2') format('woff2'),
         url('fonts/exo/light/exo2-extralight.woff') format('woff'),
         url('fonts/exo/light/exo2-extralight.ttf') format('truetype'),
         url('fonts/exo/light/exo2-extralight.svg#exo_2extra_light') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*
form input, label, select, textarea { outline:1px solid rgba(102,0,51,1) !important;}
a { outline:1px solid rgba(51,51,255,1); background-color:rgba(0,51,255,0.1) }
div, span, section, table, tr, td { outline:1px solid rgba(0,204,0,1) }
img { outline:1px solid rgba(204,153,51,1); background-color:rgba(204,153,51,0.1);}
h1, h2, h3 ,p, small, i, b, ul, ol, li { outline:1px solid rgba(255,51,204,1); background-color:rgba(255,51,204,0.1)}

 /* Developer View */

/* ##### LINKS ##### ----------------------------------*/

a { color:inherit; text-decoration:none; border:0 none;}
a:hover { cursor:pointer; }

a.txtlink, a.printlink, a.listlink { text-decoration:underline;}
a.txtlink:hover, a.formdetail_link:hover { opacity:0.8;}
a.printlink span { float:left; margin:25px 0 0 0;}
a.listlink { width:100%; float:left; margin:4px 0;}

a:link img {border:0px;}

.labellink { text-decoration:underline; float:left;}

/* ##### HEADLINES | TXT | MARKUPS ##### ----------------------------------*/

h1, h2, h3, h4 { margin:0; padding:0; font-weight:normal; line-height:1.2em;}

h1 { font-family:'exolight'; font-size:3.0em; text-transform:uppercase;}
h2 { font-family:'exolight'; font-size:2.0em; text-transform:uppercase; margin:0 0 0.7em 0; }
h3 { font-family: 'exoblack'; font-size:1.1em; letter-spacing:0.1em; text-transform:uppercase;}
h4 { font-family: 'exoregular'; font-size:1.2em; letter-spacing:0.05em; padding-bottom:10px; text-transform:uppercase;}

b { font-weight:normal; font-family:'exobold';}
p { font-size:1em; margin:0; padding:0 0 24px 0; line-height:1.8em; float:left;}
small { font-size:0.8em; padding:0; margin:0; line-height:0px;}
small.subsmall { font-size:0.75em; margin-top:20px; float:left; height:auto; line-height:1.2em;}

span { width:100%; float:left;}

.txt_center { text-align:center;}
.txt_left { text-align:left;}
.txt_right { text-align:right;}
.txt_block { text-align:justify;}

.txt_2col { column-count: 2; -webkit-column-count: 2; -moz-column-count: 2; -ms-column-count: 2; -o-column-count: 2;}
.txt_3col { column-count: 3; -webkit-column-count: 3; -moz-column-count: 3; -ms-column-count: 3; -o-column-count: 3;}
.txt_4col { column-count: 4; -webkit-column-count: 4; -moz-column-count: 4; -ms-column-count: 4; -o-column-count: 4;}

.txt_2col, .txt_3col, .txt_4col{ column-gap: 1; -webkit-column-gap: 1; -moz-column-gap: 1; -ms-column-gap: 1; -o-column-gap: 1; }

.uppercase, .bto { text-transform:uppercase;}

hr, .borderline, .borderline_light, .borderline_xs {
	width:100%;
	height:1px;
	float:left;
	margin:40px 0%;
	border:0px;
	background-color:rgba(0,0,0,0.2);
}

.borderline {
	margin:10px 0; 
	background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 20%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.4) 80%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 20%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.4) 80%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.borderline_light {
	margin:40px 0; 
	background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 20%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0.4) 80%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.4) 20%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.4) 20%,rgba(255,255,255,0.6) 50%,rgba(255,255,255,0.4) 80%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.borderline_xs { margin:10px 0 !important; background-color:rgba(0,0,0,0.1);}

img { margin:0 0 -4px 0; padding:0;}

/* ##### COLORS ##### ----------------------------------*/

.yellow_light {color:rgba(255,229,91,1);}
.yellow_norm, .bto, #versionen, #versionen-mobile, .faq_item h2, .faq_item h4 {color:rgba(255,212,0,1);}
.yellow_med, a.txtlink {color:rgba(214,157,29,1);}
.yellow_dark, small.subsmall{color:rgba(103,76,29,1);}
.white, #versionen .version_pro > h2, #versionen .version_slim > h2, a .bto, input[type=radio] + label, .screen_description, .faq_item, .beta_claim {color:rgba(255,255,255,1);}

.black, .preis, .special_box {color:rgba(17,17,15,1);}
.grey_dark {color:rgba(25,25,23,1);}
.grey_med, .bto_small  {color:rgba(120,120,120,1);}
.grey_light {color:rgba(192,193,191,1);}

.green {color:rgba(88,185,153,1);}

/* ##### BACKGROUND-COLORS ##### ----------------------------------*/

.bg_yellow_light {background-color:rgba(255,229,91,1);}
.bg_yellow_norm, .preis, .screen {background-color:rgba(255,212,0,1);}
.bg_yellow_med {background-color:rgba(214,157,29,1);}
.bg_yellow_dark {background-color:rgba(103,76,29,1);}
.bg_white, .desc_item .info, .special_box, .bto_small {background-color:rgba(255,255,255,1);}

.bg_black, #versionen, #versionen-mobile, .radioselect, input[type=radio] + label, .screen_description, .faq_item  {background-color:rgba(17,17,15,1); font-family:'exolight';}
.bg_grey_dark {background-color:rgba(25,25,23,1);}
.bg_grey_med {background-color:rgba(60,60,60,1);}
.bg_grey_light {background-color:rgba(192,193,191,1);}

.bg_green, .bto, .notification_item, input[type=radio]:checked + label, .beta_claim {background-color:rgba(88,185,153,1);}

/* ##### FLOATING ##### ----------------------------------*/

#nav .logo, #nav .navitem_wrap, #nav .navitem_wrap .navitem 
{ float:left;}

/* ##### NAV ##### ----------------------------------*/

#nav {
	width:100%;
	float:left;
	background-color:rgba(17,17,15,1);
	border-bottom:1px solid rgba(17,17,15,0);
	position:relative;
	z-index:100;
}

#nav .mobile.logo,
#nav a.mobileicon { display:none;}

#nav .navitem_wrap {width:1080px; margin:0 auto; float:none;}

#nav .navitem_wrap .navitem.logo { width:142px; float:left; padding:20px 3.5%;}
#nav .navitem_wrap .navitem {
	width:171px;
	padding-left:1%;
	padding-right:1%;
	text-align:center;
	text-transform:uppercase;
	color:rgba(255,255,255,1); 
	padding:42px 0 40px 0;
	font-family:'exolight';
	letter-spacing:0.05em;
}

#nav .navitem_wrap a:first-of-type .navitem {border-left:1px solid rgba(17,17,15,0.1); }
#nav .navitem_wrap a:last-of-type .navitem {border-right:1px solid rgba(17,17,15,0.1); }

#nav .navitem_wrap .navitem:hover {color:rgba(255,212,0,1);}

#root.page_start > #nav > .navitem_wrap > a:nth-of-type(2) .navitem,
#root.page_tour > #nav > .navitem_wrap > a:nth-of-type(3) .navitem,
#root.page_versionen > #nav > .navitem_wrap > a:nth-of-type(4) .navitem,
#root.page_faq > #nav > .navitem_wrap > a:nth-of-type(5) .navitem,
#root.page_kontakt > #nav > .navitem_wrap > a:nth-of-type(6) .navitem { border-top:4px solid rgba(255,212,0,1); padding:38px 0 40px 0; color:rgba(255,212,0,1);}

/* ##### CONTENT ##### ----------------------------------*/

.content:first-of-type { padding-top:0px;}
.content { width:100%; float:left; padding:80px 0; margin:0;}

.content_text { width:100%; max-width:1082px; margin:0 auto;}
.content_text.top {padding-top:80px;}

.pageheadline { width:100%; float:left; margin-bottom:60px !important; text-align:center;}

.listspan { 
	width:90%; 
	margin:0 0 8px 0; 
	padding:2px 0 2px 5%; 
	border-left:2px solid rgba(0,0,0,1); 
	float:left;
}

.special_box { 
	width:90%; 
	padding:24px 5%; 
	float:left; 
	outline:1px solid rgba(0,0,0,0.1);
	position:relative;
}

.special_box > span.box_label {
	text-transform:uppercase;
	font-size:1.2em;
	text-align:center;
}

.intro { 
	width:100%; 
	float:left;
	font-size:1.2em; 
	line-height:1.6em;
	font-family:'exolight';
}

.shortinfo { margin:40px 0 0 0; padding:20px 0 0 0;}
.shortinfo .col06 > h2 { margin-bottom:20px;}
.shortinfo .col05 .icon {
	position:relative;
	width:120px;
	height:120px;
	margin:-190px 0 0 -60px;
	left:50%;
	background-color:rgba(0,0,0,0.5);
	box-shadow:0px 0px 20px 5pt rgba(0,0,0,0.5);
	
	filter:drop-shadow(0px 0px 20px rgba(255,255,255,0.8));
	-webkit-filter:drop-shadow(0px 0px 20px rgba(255,255,255,0.8));
	-moz-filter:drop-shadow(0px 0px 20px rgba(255,255,255,0.8));
	-ms-filter:drop-shadow(0px 0px 20px rgba(255,255,255,0.8));
	-o-filter:drop-shadow(0px 0px 20px rgba(255,255,255,0.8));
}

.shortinfo ol { float:left; margin:0; padding:0 0 10px 22px;}
.shortinfo ol > li { line-height:1.8em;}

#root.page_tour .intro { margin:0 !important;}

.feature, .faq_item { 
	width:60%; 
	margin:20px 15% !important; 
	float:left; 
	padding:20px 5%;
	box-shadow:0px 0px 0px 1pt rgba(255,255,255,0.1);
}

.faq_item p { margin:5px 0 0 0; padding:0;}

.feature span { line-height:1.4em !important; } 

.box { width:90%; padding:24px 5%; float:left;}

.row > .half {width:44%; padding:0; float:left;}
.row > .half:nth-of-type(1) {margin:0 6% 0 0;}
.row > .half:nth-of-type(2) {margin:0 0 0 6%;}

input#subinfo { position:absolute; right:0; top:-20px; display:none;}
input#subinfo:checked ~ .sub_info { opacity:1; display:block;}

.sub_info { opacity:0; display:none;}
label:hover { cursor:pointer;}

.image_fullwidth { width:100%; float:left; margin:0 0 40px 0;}
.image_fullwidth img {filter:grayscale(100%); -webkit-filter:grayscale(100%); -moz-filter:grayscale(100%); -ms-filter:grayscale(100%); -o-filter:grayscale(100%);}
.content:hover .image_fullwidth img {filter:grayscale(0%); -webkit-filter:grayscale(0%); -moz-filter:grayscale(0%); -ms-filter:grayscale(0%); -o-filter:grayscale(0%);}

.beta_claim {
	width:60px;
	height:auto;
	padding:18px;
	float:right;
	margin:-10px -10px 0 0;
}

.beta_claim span {
	width:100%; 
	float:left;
	text-align:left;
	font-size:0.9em;
	line-height:1.2em;
}

/* ##### HEADER ##### ----------------------------------*/

.header_wrap { 
	width:100%;
	float:left;
	height:480px;
	margin-bottom:100px;
}

.header_wrap .image { 
	width:100%; 
	max-width:1000px; 
	margin:0 auto;
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1), 0px 0px 0px 30pt rgba(255,255,255,1), 0px 0px 100px rgba(0,0,0,0.5);
	/*box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1), 0px 0px 0px 30pt rgba(255,212,0,1), 0px 0px 100px rgba(0,0,0,0.5);*/
	display:block !important;
}

.start.top.below.six.columns {
	display:inline-block;
	float:left;
	width:50%;
}

.start.top.below.alert.right {
	background:rgba(229,43,42,0.5);
	padding-top:1em;
	float:right;
	width:45%;
}

/* ##### NOTIFICATION ##### ----------------------------------*/

#notification a:nth-of-type(1) .notification_item { margin-top:150px;}
#notification a:nth-of-type(2) .notification_item { margin-top:225px;}

.notification_meta {
	width:160px;
	text-align:right;
	position:absolute;
	right:0;
	margin-top:180px;
	padding:0 0 0 0;
	display:none;
}

.notification_meta:hover { text-decoration:underline;}
.notification_meta .icon { float:right;}

input#hidenotification { position:absolute; right:0; top:-20px; display:none;}
input#hidenotification:checked ~ a .notification_item { display:block;}
input#hidenotification:checked + label { display:block;}

.notification_item {
	width:auto;
	max-width:200px;
	position:absolute;
	right:0;
	margin:10px 0;
	padding:15px 20px 20px 20px;
	font-family:'exolight' !important;
	box-shadow:0px 0px 30px 2pt rgba(88,185,153,0);
	display:none;
}

.notification_item:hover { box-shadow:0px 0px 0px 2pt rgba(88,185,153,0.4);}

.notification_item h4, .notification_item small { width:100%; float:left; margin:0; padding:0;}

.notification_item h4 { font-family:'exolight'; font-size:1.2em; letter-spacing:0.05em;}
.notification_item small { font-size:0.8em; margin-top:10px; text-transform:uppercase; color:rgba(255,255,255,1);}

/* ##### BTOs ##### ----------------------------------*/

.bto_wrap { width:100%; float:left; } 

.bto_wrap .bto_small {
	width:auto;
	height:28px;
	font-size:0.7em;
	margin:10px 5px;
	padding:0px 10px;
	text-align:center;
	float:left;
	letter-spacing:0.1em;
}

.bto_wrap .bto_small.l02 {
	background-color:rgba(204,51,102,0);
	color:rgba(0,0,0,1);
	font-family:'exoregular';
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.5);
}

input:checked + label.bto_small.l02 {
	box-shadow:0px 0px 0px 1pt rgba(88,185,153,1);
	color:rgba(88,185,153,1);
}

input:checked + label.bto_small.l02:after { margin-top:28px !important;}

.bto {
	width:auto;
	padding:15px 20px;
	margin:10px 10px 0 0;
	float:left;
	box-shadow:0px 0px 30px 2pt rgba(88,185,153,0);
}

.bto:hover { box-shadow:0px 0px 0px 2pt rgba(88,185,153,0.4);}

.bto_more {
	padding:10px 10px 6px 10px;
	margin:20px auto;
	color:rgba(165,166,165,1);
	outline:1px solid rgba(165,166,165,0.5);
	float:left;
}

.icon {width:24px; float:left; margin:-3px 14px 0 0;}

/* ##### VERSIONEN ##### ----------------------------------*/

#versionen { width:100%; float:left;}

#versionen .version_description {
	width:100%;
	height:280px;
	float:left;
	position:relative;
}

#versionen .preis {
	width:140px; 
	padding:5px 10px; 
	margin:25px 0 0 0; 
	float:left;
	box-shadow:0px 0px 0px 2pt rgba(0,0,0,1);
}

#versionen .preis h2,
#versionen .preis small { width:100%; float:left; font-family:'exoregular';}

.col07 .row.version_description,
.col07 .row.version_pro.details,
.col07 .row.version_slim.details {min-width:540px !important;}

#versionen .version_description .desc_item {
	width:262px;
	height:20px;
	margin-top:124px;
	padding:10px 0 6px 10px;
	position:absolute;
	transform:rotate(-90deg); -webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg);
}

#versionen .version_description .desc_item:nth-of-type(1) {  margin-left:-120px;}
#versionen .version_description .desc_item:nth-of-type(2) {  margin-left:-64px;}
#versionen .version_description .desc_item:nth-of-type(3) {  margin-left:-8px;}
#versionen .version_description .desc_item:nth-of-type(4) {  margin-left:48px;}
#versionen .version_description .desc_item:nth-of-type(5) {  margin-left:104px;}
#versionen .version_description .desc_item:nth-of-type(6) {  margin-left:160px;}
#versionen .version_description .desc_item:nth-of-type(7) {  margin-left:216px;}
#versionen .version_description .desc_item:nth-of-type(8) {  margin-left:272px;}
#versionen .version_description .desc_item:nth-of-type(9) {  margin-left:328px;}
#versionen .version_description .desc_item:nth-of-type(10) { margin-left:384px;}
#versionen .version_description .desc_item:nth-of-type(11) { margin-left:440px;}

#versionen .version_description .desc_item a { letter-spacing:0.05em;}

#versionen .version_description .desc_item .info {
	width:160px;
	height:130px;
	padding:20px;
	margin:-95px 0 0 -205px;
	float:left;
	text-align:center;
	display:none;
	box-shadow:0px 0px 10px 1pt rgba(0,0,0,0.1);
	transform:rotate(90deg); -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); -o-transform:rotate(90deg);
}

.info .txt { font-size:0.9em; color:rgba(102,102,102,1);}
.info b { color:rgba(0,0,0,1) !important;}


#versionen .version_description .desc_item .info > .icons img.ic { width:18px; height:18px float:left; margin:0 5px 0 0;}
#versionen .version_description .desc_item .info > .icons img.ic.inactive { opacity:0.5;}

#versionen .version_description .desc_item .info > .icons { width:100%; float:left; margin:8px 0 0 0;}
#versionen .version_description .desc_item .icon.details { 
	width:18px; 
	height:18px;
	margin:-1px 8px 0 0;
	transform:rotate(90deg); -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); -o-transform:rotate(90deg);
}

#versionen .version_pro,
#versionen .version_slim {
	width:100%;
	height:150px;
	float:left;
	margin-top:30px;
}

#versionen .version_pro small,
#versionen .version_slim small { margin:10px 0 15px 0; float:left; width:100%;}

.col07 .row.version_pro.details .dot_wrap,
.col07 .row.version_slim.details .dot_wrap { width:36px; float:left; margin:0 20px 0 0;}

.col07 .row.version_pro.details .dot_wrap:last-of-type,
.col07 .row.version_slim.details .dot_wrap:last-of-type {margin:0;}

.col07 .row.version_pro.details .dot,
.col07 .row.version_slim.details .dot {
	width:10px;
	height:10px;
	background-color:rgba(255,255,255,0.3);
	float:left;
	margin:15px 13px 0px 13px;
}

.col07 .row.version_pro.details .dot.active,
.col07 .row.version_slim.details .dot.active {
	background-color:rgba(0,0,0,0);
	box-shadow:0px 0px 0px 1pt rgba(255,212,0,1), inset 0px 0px 0px 1pt rgba(255,212,0,1);
}

.dot img {width:100%; float:left;}

#arbeitseintrag:target > .info,
#projektliste-level-1:target > .info,
#projektliste-level-2:target > .info,
#wochenjournal-level-1:target > .info,
#wochenjournal-level-2:target > .info,
#kunden:target > .info,
#projekte:target > .info,
#stundentypen:target > .info,
#stundenfreigabe:target > .info,
#stundenreport:target > .info,
#stundenreport-archiv:target > .info { display:block !important;}

#versionen-mobile { display:none;}

/* ##### BESTELLUNG ##### ----------------------------------*/

.v_wrap { width:50%; margin:0 25%; float:left;}

.v_zeies  {
	width:46%;
	height:auto;
	min-height:320px;
	float:left;
	padding:20px 0%;
	margin:0 2% 40px 2%;
	
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1), 0px 0px 20px rgba(0,0,0,0.1);
}

.v_zeies > h2, .v_zeies > h4 { 
	width:100%; 
	float:left; 
	margin:0;
	padding:0;
	text-align:center; 
}

.v_zeies > h2 { 
	font-size:2.5em; 
	padding-bottom:20px; 
	border-bottom:1px solid rgba(120,120,120,0.3);
}

.v_zeies .detail { 
	width:80%; 
	min-height:55px;
	padding:20px 10% 15px 10%; 
	float:left;
	font-size:0.8em; 
	color:rgba(153,153,153,1); 
	border-bottom:1px solid rgba(120,120,120,0.3);
}

.v_zeies > .preis { 
	width:70%; 
	margin:20px 10%; 
	padding:10px 5%;
	float:left;
}

.v_zeies > .icon {
	width:20%;
	margin:20px 40% -40px 40%;
	background-color:rgba(255,255,255,1);
	box-shadow:0px 0px 20px rgba(0,0,0,0.1);
}


input#zeiesversion-pro:checked + .v_zeies > .icon,
input#zeiesversion-slim:checked + .v_zeies > .icon { 
	width:10%;
	padding:5%;
	box-shadow:0px 0px 20px rgba(0,0,0,0.1);
}

input#zeiesversion-pro:checked + .v_zeies,
input#zeiesversion-slim:checked + .v_zeies {
	background-color:rgba(0,0,0,1);
	color:rgba(255,255,255,1);
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.8), 0px 0px 20px rgba(0,0,0,0.1);
}

/* ##### FORMSLIDE ##### ----------------------------------*/

.form_slide { 
	width:100%; 
	float:left;
	display:none;
}

label.form_bto.next,
label.form_bto.prev {
	width:30px;
	height:30px;
	padding:20px;
	position:absolute;
	top:300px;
	background-color:rgba(0,0,0,1) !important;
	display:none;
	z-index:5;
}

label.form_bto.next {right:0;}
label.form_bto.prev {left:0;}

label.form_bto img { width:100%;}

input#formslide-01,
input#formslide-02,
input#formslide-03,
input#formslide-04 { display:none;}

input#formslide-01:checked ~ label.form_bto.next.bto01,
input#formslide-02:checked ~ label.form_bto.next.bto02, 
input#formslide-02:checked ~ label.form_bto.prev.bto03,
input#formslide-03:checked ~ label.form_bto.next.bto04, 
input#formslide-03:checked ~ label.form_bto.prev.bto05, 
input#formslide-04:checked ~ label.form_bto.prev.bto06 { display:block;}

input#formslide-01:checked ~ .form_slide.fs01,
input#formslide-02:checked ~ .form_slide.fs02,
input#formslide-03:checked ~ .form_slide.fs03,
input#formslide-04:checked ~ .form_slide.fs04 {display:block;}

.formbox { 
	width:90%; 
	float:left;
	padding:20px 5%;
	margin:20px 0;
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1), 0px 0px 20px rgba(0,0,0,0.1);
}


/* ##### NEW USER ##### ----------------------------------*/

.newuser_wrap {
	width:80%;
	margin:0 10%;
	float:left;
}

.newuser_levelselect label {
	padding:5px; 
	margin:5px 5px 0 0; 
	float:left;
}

.user_summary, .customer_summary { color:rgba(153,153,153,1); margin-top:10px;}

form input, form textarea, form input[type="password"], form input[type="search"], form input[type="text"] {
	width:90%;
	padding:10px 5%;
	margin:0 0 10px 0;
	float:left;
	background-color:rgba(239,238,237,0.2);
	font-size: 105%;
	outline:0px;
	border:0px;
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1);
	font-family:'exoregular';
}

form select { 
	width:100% !important;
	margin:0 0 10px 0;
	padding:10px 5% !important;
	font-size:105%;
	float:left;
	border:0; 
	outline:0px;
	background-color:rgba(239,238,237,0.2);
	box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.1);
	font-family:'exoregular';
	
	appearance:none;  
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
	-o-appearance:none;
}

.formselect:after {
	content:'';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8px 5px 0 5px;
	border-color: rgba(0,0,0,0.3) transparent transparent transparent;
	position:absolute;
	float:right;
	margin:18px 0 0 -20px;
}

form .errorhighlighted:active,
form .errorhighlighted:focus,
form textarea:active,
form textarea:focus,
form input:active,
form input:focus,
form select:active, 
form select:focus { box-shadow:0px 0px 0px 1pt rgba(0,0,0,0.2), inset 0px 0px 30px 1pt rgba(0,0,0,0.1);}

/* ##### BTO OVERLAY ##### ----------------------------------*/

.bto_overlay { 
	width:70px; 
	height:70px;
	position:absolute;
	right:0;
	top:300px;
	background-color:rgba(255,255,255,0.8);
	z-index:15;
}

input#zeiesversion-pro:checked ~ .bto_overlay,
input#zeiesversion-slim:checked ~ .bto_overlay { display:none;}

/* ##### TOUR ##### ----------------------------------*/

/* Device */
input#tour_screen-desktop,
input#tour_screen-mobile,
input#tour_level-un,
input#tour_level-ma { position:absolute; right:0; top:-20px; display:none;}

input#tour_screen-desktop:checked ~ .tour_wrap > .view_desktop { display:block;}
input#tour_screen-mobile:checked ~ .tour_wrap > .view_mobile { display:block;}

/* Level screens */
input#tour_level-un:checked ~ .tour_wrap > .view_desktop > .screen.unternehmer { display:block;}
input#tour_level-un:checked ~ .tour_wrap > .view_mobile > .screen.unternehmer { display:block;}
input#tour_level-ma:checked ~ .tour_wrap > .view_desktop > .screen.mitarbeiter { display:block;}
input#tour_level-ma:checked ~ .tour_wrap > .view_mobile > .screen.mitarbeiter { display:block;}

input#tour_level-un:checked ~ .tour_wrap > .view_desktop > .screen.empty,
input#tour_level-un:checked ~ .tour_wrap > .view_mobile > .screen.empty,
input#tour_level-ma:checked ~ .tour_wrap > .view_desktop > .screen.empty,
input#tour_level-ma:checked ~ .tour_wrap > .view_mobile > .screen.empty { display:none;}

/* Level button */
input#tour_level-un:checked ~ .radioselect.rs01,
input#tour_level-un:checked ~ .radioselect.rs02,
input#tour_level-un:checked ~ .radioselect.rs03,
input#tour_level-un:checked ~ .radioselect.rs04,
input#tour_level-un:checked ~ .radioselect.rs05,
input#tour_level-un:checked ~ .radioselect.rs06,
input#tour_level-un:checked ~ .radioselect.rs07,
input#tour_level-un:checked ~ .radioselect.rs08,
input#tour_level-un:checked ~ .radioselect.rs09 { display:block;}

input#tour_level-ma:checked ~ .radioselect.rs10,
input#tour_level-ma:checked ~ .radioselect.rs11 { display:block;}

/* Images */
input#image-01:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(1),
input#image-02:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(2),
input#image-03:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(3),
input#image-04:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(4),
input#image-05:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(5),
input#image-06:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(6),
input#image-07:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(7),
input#image-08:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(8),
input#image-09:checked ~ .tour_wrap .view_desktop .screen.unternehmer > .image:nth-of-type(9),
input#image-10:checked ~ .tour_wrap .view_desktop .screen.mitarbeiter > .image:nth-of-type(1),
input#image-11:checked ~ .tour_wrap .view_desktop .screen.mitarbeiter > .image:nth-of-type(2) { display:block}

input#image-01:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(1),
input#image-02:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(2),
input#image-03:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(3),
input#image-04:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(4),
input#image-05:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(5),
input#image-06:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(6),
input#image-07:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(7),
input#image-08:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(8),
input#image-09:checked ~ .tour_wrap .view_mobile .screen.unternehmer > .image:nth-of-type(9),
input#image-10:checked ~ .tour_wrap .view_mobile .screen.mitarbeiter > .image:nth-of-type(1),
input#image-11:checked ~ .tour_wrap .view_mobile .screen.mitarbeiter > .image:nth-of-type(2) { display:block}

.image { display:none;}

/* bto description */
input#tour_level-un:checked ~ input#image-01:checked + label + .screen_description.rs01,
input#tour_level-un:checked ~ input#image-02:checked + label + .screen_description.rs02,
input#tour_level-un:checked ~ input#image-03:checked + label + .screen_description.rs03,
input#tour_level-un:checked ~ input#image-04:checked + label + .screen_description.rs04,
input#tour_level-un:checked ~ input#image-05:checked + label + .screen_description.rs05,
input#tour_level-un:checked ~ input#image-06:checked + label + .screen_description.rs06,
input#tour_level-un:checked ~ input#image-07:checked + label + .screen_description.rs07,
input#tour_level-un:checked ~ input#image-08:checked + label + .screen_description.rs08,
input#tour_level-un:checked ~ input#image-09:checked + label + .screen_description.rs09,
input#tour_level-ma:checked ~ input#image-10:checked + label + .screen_description.rs10,
input#tour_level-ma:checked ~ input#image-11:checked + label + .screen_description.rs11 { display:block;}

/* bto small */
input#tour_screen-desktop:checked + label,
input#tour_screen-mobile:checked + label,
input#tour_level-un:checked + label,
input#tour_level-ma:checked + label { font-family:'exobold'; }

input#tour_screen-desktop:checked + label:after,
input#tour_screen-mobile:checked + label:after,
input#tour_level-un:checked + label:after,
input#tour_level-ma:checked + label:after {
	content:'';
	position:absolute;
	margin:26px 0 0 -25px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 10px 0 10px;
	border-color: rgba(88,185,153,1) transparent transparent transparent;
}

.num_marker { 
	width:auto;
	height:15px;
	float:left;
	padding:8px 5px 3px 5px;
	margin:11px 10px 0 0;
	line-height:1.0em;
	font-size:0.6em;
	font-family:'exoregular';
	letter-spacing:0.1em;
}

/* layout */
.tour_wrap { width:100%; float:left; position:relative;} 

.overlay {
	width:100%;
	height:100%;
	position:absolute;
	background-color:rgba(0,204,0,0);
}

.screen.unternehmer, .screen.mitarbeiter { display:none;}
.screen.unternehmer .image, .screen.mitarbeiter .image { width:100%; height:auto; float:left;}
.screen.unternehmer .image img, .screen.mitarbeiter .image img { margin-bottom:-10px;}

.screen.empty { background-color:rgba(255,255,255,1); box-shadow:inset 0px 0px 80px 20pt rgba(0,0,0,0.1);}
.screen.empty h2 { margin-top:25%;}

input[type=radio] { position:absolute; display:none;}

.radioselect {
	width:30px;
	height:30px;
	padding:5px;
	position:fixed;
	right:25px;
	top:55%;
	display:none;
	z-index:50;
}

.radioselect.rs01, .screen_description.rs01 { margin-top:-250px;}
.radioselect.rs02, .screen_description.rs02 { margin-top:-200px;}
.radioselect.rs03, .screen_description.rs03 { margin-top:-150px;}
.radioselect.rs04, .screen_description.rs04 { margin-top:-100px;}
.radioselect.rs05, .screen_description.rs05 { margin-top:-50px;}
.radioselect.rs06, .screen_description.rs06 { margin-top:-0;}
.radioselect.rs07, .screen_description.rs07 { margin-top:50px;}
.radioselect.rs08, .screen_description.rs08 { margin-top:100px;}
.radioselect.rs09, .screen_description.rs09 { margin-top:150px;}
.radioselect.rs10, .screen_description.rs10 { margin-top:-250px;}
.radioselect.rs11, .screen_description.rs11 { margin-top:-200px;}

.screen_description {
	width:230px;
	height:auto;
	position:fixed;
	right:90px;
	top:55%;
	margin:0;
	padding:20px;
	z-index:50;
	text-align:left;
	display:none;
}
.screen_description:after {
	content:'';
	position:absolute;
	top:0;
	margin:10px 0 0 20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent rgba(0,0,0,1);
}

.screen_description .borderline_light { margin:15px 0;}
.screen_description h4 { font-size:1.0em; letter-spacing:0.1em;}
.screen_description span { font-size:0.8em; line-height:1.5em;}
.screen_description b { font-family:'exolight'; letter-spacing:0.1em !important; color:rgba(255,204,0,1) !important;}

.view_desktop, .view_mobile {
	width:100%; 
	position:relative;
	float:left;
	margin:40px 0 10px 0;
	display:none;
}

.view_desktop .device, .view_mobile .device {z-index:5; position:relative;}

.view_desktop .device { width:100%; padding:0%;}
.view_mobile .device { width:350px; left:50%; margin-left:-175px !important;}

.view_desktop .screen, 
.view_mobile .screen { 
	top:0; 
	position:absolute; 
	z-index:15;
	overflow-x:hidden;
	overflow-y:scroll;
}

.view_desktop .screen {
	width:85.8%; 
	height:86.3%;
	margin:3.1% 7.1%;
}

.view_mobile .screen {
	width:330px;
	height:85%;
	margin:49px 0 0 -165px;
	left:50%;
}

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

}

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

}

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

	#nav .mobile.logo,
	#nav a.mobileicon { display:block;}
	
	#nav:target > a.mobileicon:nth-of-type(1) { display:none;} 
	#nav:not(:target) > a.mobileicon:nth-of-type(2) { display:none;} 
	
	#nav .mobile.logo {width:140px; float:left; padding:20px 5%;}
	
	#nav a.mobileicon {
		width:30px;
		height:30px;
		padding:35px;
		background-color:rgba(0,0,0,1);
		position:absolute; 
		top:0;
		right:0;
		z-index:200;
	}
	
	#nav:target a.mobileicon { background-color:rgba(250,250,250,0); border-left:0px none;}
	
	#nav > .navitem_wrap { display:none;}
	#nav > .navitem_wrap .logo { display:none;}
	#nav:target > .navitem_wrap { display:block;}
	
	.navitem_wrap { 
		width:100%;
		max-width:100%;
		padding:0; margin:0;
		position:fixed; 
		top:0; 
		left:0;
		right:0; 
		bottom:0; 
		background-color:rgba(0,0,0,1);
		z-index:100;
	}
	
	.navitem_wrap a .navitem {
		width:100% !important;
		float:left;
		color:rgba(255,255,255,1);
		padding:20px 0% !important;
	}
	
	.navitem_wrap a:nth-of-type(2) .navitem {margin-top:80px;}
	
	#root.page_start > #nav > .navitem_wrap > a:nth-of-type(2) .navitem,
	#root.page_tour > #nav > .navitem_wrap > a:nth-of-type(3) .navitem,
	#root.page_versionen > #nav > .navitem_wrap > a:nth-of-type(4) .navitem,
	#root.page_faq > #nav > .navitem_wrap > a:nth-of-type(5) .navitem,
	#root.page_kontakt > #nav > .navitem_wrap > a:nth-of-type(6) .navitem { border:0px; padding:35px 0 35px 0; color:rgba(255,212,0,1);}
	
	
	.content { padding:20px 0;}
	.content_text { width:90%; margin:0 5%;}
	
	.header_wrap { height:auto; margin-bottom:30px;}
	.header_wrap .image { box-shadow:inset 0px 0px 0px 5pt rgba(255,212,0,1);}
	
	.intro { margin:20px 0 0 0;}
	
	.content.bg_image { min-height:280px;}
	
	#versionen { display:none;}
	#versionen-mobile { display:block; width:100%; float:left; padding-bottom:20px;}
	
	#versionen-mobile .list.vergleich { width:96%; margin:15px 2%;}
	
	#versionen-mobile .toprow { width:100%; float:left;}
	#versionen-mobile .toprow .column001,
	#versionen-mobile .toprow .column002 { width:20%; float:left; text-align:center; outline:1px solid rgba(255,255,255,1);}
	#versionen-mobile .toprow .column003 { width:60%; float:left;}
	
	#versionen-mobile .toprow .column001 > span,
	#versionen-mobile .toprow .column002 > span { color:rgba(0,0,0,1); font-size:1.2em; letter-spacing:0.05em; background-color:rgba(255,255,255,1); padding:10px 0;}
	
	#versionen-mobile .listrow { 
		width:100%;
		float:left; 
		border-bottom:1px solid rgba(255,255,255,0.5);
		color:rgba(255,255,255,1); 
	}
	
	#versionen-mobile .listrow .column01 {border-left:1px solid rgba(255,255,255,0.5);}
	
	#versionen-mobile .listrow .column01,
	#versionen-mobile .listrow .column02,
	#versionen-mobile .listrow .column03,
	#versionen-mobile .listrow .column04,
	#versionen-mobile .listrow .column05 { padding:5px 1%; margin-left:-1px; min-height:60px;}
	
	#versionen-mobile .listrow .column01,
	#versionen-mobile .listrow .column02,
	#versionen-mobile .listrow .column03,
	#versionen-mobile .listrow .column04 { 
		width:8%; 
		float:left; 
		text-align:center;
		border-right:1px solid rgba(255,255,255,0.5);
	}
	
	#versionen-mobile .listrow .column05 { width:58%; float:left; border-right:1px solid rgba(255,255,255,0.5); margin-left:-2px;}
	
	.column05 > span { font-size:0.8em; color:rgba(255,255,255,0.8);}	
	
	#versionen-mobile .listrow .column01 .dot,
	#versionen-mobile .listrow .column02 .dot,
	#versionen-mobile .listrow .column03 .dot,
	#versionen-mobile .listrow .column04 .dot { margin-top:20px;}
	
	.list.vergleich .listrow.first > .column01,
	.list.vergleich .listrow.first > .column02,
	.list.vergleich .listrow.first > .column03,
	.list.vergleich .listrow.first > .column04 { height:18px; min-height:18px !important; max-height:18px;}
	
	#versionen-mobile .listrow .column01,
	#versionen-mobile .listrow .column02 { background-color:rgba(255,255,255,0.1);}
	
	#versionen-mobile .version_pro, #versionen-mobile .version_slim { width:50%; float:left; margin:20px 0;}
	#versionen-mobile .version_pro > h2, #versionen-mobile .version_slim > h2 { padding:0 2%; color:rgba(255,255,255,1);}
	
	#versionen-mobile .preis {
		width:140px; 
		padding:10px 2%; 
		margin:0px 2%; 
		float:left;
	}
	
	.preis h2,
	.preis small { width:100%; float:left; margin-bottom:5px;}
	
	.v_wrap { width:60%; margin:0 20%;}
}

@media screen and (max-width:980px) {
	
	.txt_2col { column-count: 1; -webkit-column-count: 1; -moz-column-count: 1; -ms-column-count: 1; -o-column-count: 1;}
	
	.radioselect.rs01, .screen_description.rs01 { margin-left:-250px;}
	.radioselect.rs02, .screen_description.rs02 { margin-left:-200px;}
	.radioselect.rs03, .screen_description.rs03 { margin-left:-150px;}
	.radioselect.rs04, .screen_description.rs04 { margin-left:-100px;}
	.radioselect.rs05, .screen_description.rs05 { margin-left:-50px;}
	.radioselect.rs06, .screen_description.rs06 { margin-left:-0;}
	.radioselect.rs07, .screen_description.rs07 { margin-left:50px;}
	.radioselect.rs08, .screen_description.rs08 { margin-left:100px;}
	.radioselect.rs09, .screen_description.rs09 { margin-left:150px;}
	.radioselect.rs10, .screen_description.rs10 { margin-left:-250px;}
	.radioselect.rs11, .screen_description.rs11 { margin-left:-200px;}
	
	.radioselect {
		right:5px; position:absolute; top:65%;
	}
	
	.screen_description {
		width:90%;
		position:absolute;
		right:0;
		left:0;
		top:96%;
		margin:0 !important;
		padding:20px 5%;
	}
	
	.view_mobile .device { width:280px; margin-left:-140px !important;}
	.view_mobile .screen {
		width:264px;
		height:85%;
		margin:39px 0 0 -134px;
	}
	
	.v_wrap { width:80%; margin:0 10%;}

}

@media screen and (max-width:720px) {
	
	.txt_2col, .txt_3col, .txt_4col{
		column-count: 1;
		-webkit-column-count: 1;
		-moz-column-count: 1;
		-ms-column-count: 1;
		-o-column-count: 1;
	}
	
	.content.bg_image { min-height:100px;}
	
	#notification a:nth-of-type(1) .notification_item { margin-top:110px;}
	#notification a:nth-of-type(2) .notification_item { margin-top:185px;}

	.notification_item { position:absolute;}
	.notification_meta { visibility:hidden;}
	
	.feature, .faq_item { 
		width:90%; 
		margin:10px 0% !important; 
	}
	
	.v_wrap { width:90%; margin:0 5%;}
		
  
  
  
  .quote { text-align:center; background:red;}
  .quote p.statement { font-family: Georgia, Times, serif; font-style: italic; font-size:1.3em;}
  .quote p.author {}
  

  
@media screen and (max-width:540px) {
	
	h1 { font-size:2.0em;}
	h2 { font-size:1.8em;}
	h3 { font-size:1.0em;}
	h4 { font-size:1.0em;}
	
	#versionen-mobile .version_pro, #versionen-mobile .version_slim { width:100%;}
	
	#versionen-mobile .toprow .column001,
	#versionen-mobile .toprow .column002 { width:24%; float:left; text-align:center; outline:1px solid rgba(255,255,255,1);}
	#versionen-mobile .toprow .column003 { width:50%; float:left;}
	
	#versionen-mobile .listrow .column01,
	#versionen-mobile .listrow .column02,
	#versionen-mobile .listrow .column03,
	#versionen-mobile .listrow .column04,
	#versionen-mobile .listrow .column05 { padding:8px 2%; min-height:90px;}
	
	#versionen-mobile .listrow .column01,
	#versionen-mobile .listrow .column02,
	#versionen-mobile .listrow .column03,
	#versionen-mobile .listrow .column04 { width:8%;}
	
	#versionen-mobile .listrow .column05 { width:48%; font-size:0.9em;}
	
	.v_wrap { width:100%; margin:0%;}
	
	.bto_wrap > label.bto_small {
		width:60%;
		margin:10px 20%;
		text-align:center;
	}
	
	.bto_overlay,
	label.form_bto.prev, label.form_bto.next { top:180px;}
	
	.pageheadline { margin-bottom:20px !important;}

}