/* Cool Grey 9C: 117 120 123 / #75787B */
/* Grün 382C:    196 214   0 / #C4D600 */
/* Schwarz:        0   0   0 / #000000 */

a,a:visited
{
	color: #75787B;
}

h1,h2
{
	margin: 0px 0px 40px;
	font-weight: 300;
}

body,h1,h2,h3
{
	font-weight: 300;
}

#back,nav,nav ul
{
	width: 100%;
}

#back,nav div:nth-child(1),nav div:nth-child(2)
{
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

#title i,nav ul
{
	position: absolute;
}

#title i,nav
{
	background-color: #C4D600;
	left: 0;
}

#varianten,nav
{
	text-align: center;
}

#contact,#title
{
	text-shadow: 1px 1px 10px rgba(0, 0, 0, 1);
}

#contact p span,a,a:hover,a:visited,nav ul li.active a
{
	text-decoration: underline
}

body
{
	font-family: Roboto, sans-serif;
	font-size: 14pt;
	background-color: #000000;
}

a
{
	-webkit-transition: color .5s ease;
	-moz-transition: color .5s ease;
	-ms-transition: color .5s ease;
	-o-transition: color .5s ease;
	transition: color .5s ease;
}

a:hover
{
	color: #C4D600;
}

h1
{
	font-weight: 500;
	font-size: 200%;
}

h2
{
	color: #C4D600;
	font-size: 180%;
	font-weight: 500;
}

h3
{
	font-weight: 400;
	font-size: 120%;
	margin: 20px 0px 10px 0px;
}

h3 b
{
	font-weight: 500;
}

h3 span
{
	color: #C4D600;
	font-style: italic;
}

table,ul
{
	font-size: 100%;
	font-weight: 300;
	margin: 0 0 20px;
	color: #75787B;
}

ul li
{
	margin-bottom: 8px;
}

table
{
	border-collapse: collapse;
}

table.center
{
	margin-left: auto; 
	margin-right: auto;
}

p.note
{
	font-size: 80%;
	font-style: italic;
	margin: 0 0 10px;
	color: #75787B;
}

section[runslide-subsection]
{
	position: relative;
	padding: 0 150px;
}

nav
{
	border-bottom: solid 1px #C4D600;
	height: 80px;
	top: -80px;
	-webkit-transition: top 1s ease 1s;
	-moz-transition: top 1s ease 1s;
	-ms-transition: top 1s ease 1s;
	-o-transition: top 1s ease 1s;
	transition: top 1s ease 1s;
}

nav>*
{
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

nav div:nth-child(1)
{
	background-image: url(media/image/runQuality.svg);
	width: 70px;
	height: 42px;
	margin: 19px 0 0 80px;
}

nav div:nth-child(2)
{
	background-image: url(media/image/runIT.svg);
	width: 82px;
	height: 25px;
	margin: 26px 0 0 40px;
}

nav ul
{
	bottom: 15px;
	margin: 0;
}

nav ul li
{
	display: inline-block;
	margin: 0 20px;
	-webkit-transition: color .5s ease;
	-moz-transition: color .5s ease;
	-ms-transition: color .5s ease;
	-o-transition: color .5s ease;
	transition: color .5s ease;
}

nav ul li a,nav ul li a:visited
{
	color: #000000;
	font-weight: 400;
	text-decoration: none;
}

nav ul li:hover a
{
	color: #75787B;
	text-decoration: none;
}

nav ul li.active a
{
	color: #75787B;
}

nav.show
{
	top: 0!important;
}

#back
{
	position: fixed;
	opacity: 0;
	height: 100%;
	left: 0;
	top: 0;
	background-image: url(media/image/umgebung.png);
	-webkit-transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-ms-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	transition: opacity 1s ease;
}

#back.show
{
	opacity: 1!important;
}

#back.vienna
{
	background-image: url(media/image/vienna.jpg)!important;
}

article
{
	opacity: 0;
	-webkit-transition: opacity 1s ease 1s;
	-moz-transition: opacity 1s ease 1s;
	-ms-transition: opacity 1s ease 1s;
	-o-transition: opacity 1s ease 1s;
	transition: opacity 1s ease 1s;
}

article.show
{
	opacity: 1!important;
}

#title
{
	height: 1000px;
	color: #C4D600;
	background: #000;
    opacity: 0.8;
    -moz-opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
}

#title i
{
	box-shadow: 1px 1px 10px #C4D60080;
	width: 0;
	height: 1px;
	top: 50%;
	-webkit-transition: width 2s ease;
	-moz-transition: width 2s ease;
	-ms-transition: width 2s ease;
	-o-transition: width 2s ease;
	transition: width 2s ease;
}

#title h1,#title h3
{
	position: relative;
	opacity: 0;
	left: 0;
	-webkit-transition: left 3s ease .3s,opacity .5s ease .3s;
	-moz-transition: left 3s ease .3s,opacity .5s ease .3s;
	-ms-transition: left 3s ease .3s,opacity .5s ease .3s;
	-o-transition: left 3s ease .3s,opacity .5s ease .3s;
	transition: left 3s ease .3s,opacity .5s ease .3s;
}

#title h3 span
{
	font-size: 160%;
}

#title.enter i
{
	width: 80%!important;
}

#title.enter h1,#title.enter h3
{
	opacity: 1!important;
}

#title.enter h1
{
	left: 50px!important;
}

#title.enter h3
{
	left: 80px!important;
}

#fast
{
	height: 240px;
	background-color: #1b1b1b;
	color: #75787B;
}

#fast table td
{
	padding: 10px 20px;
}

#fast table td:nth-child(1)
{
	text-align: right;
}

#fast table td:nth-child(2)
{
	font-size: 160%;
	font-weight: 300;
	color: #fff;
}

#about
{
	height: 2400px;
}

#about section[runslide-subsection]
{
	height: 600px;
	color: #0a0a0a;
}

#about .vorsprung
{
	background-color: #f0f0f0
}

#about .vorsprung div
{
	width: 100%;
	left: 0%;
}

#about .solution
{
	background-color: #e6e6e6;
}

#about .solution div
{
	width: 90%;
	left: 10%;
}

#about .facts
{
	background-color: #dcdcdc;
}

#about .facts div
{
	width: 100%;
	left: 0%;
}

#about .vorteile
{
	background-color: #e6e6e6;
}

#about .vorteile div
{
	width: 90%;
	left: 10%;
}

.vorteile h3
{
	color: #646464;
}

#about .overview,#about .screenshots
{
	width: 460px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

#about .overview,#about .screenshots,#about div[runslide-gallery]
{
	position: absolute;
}

#about .overview
{
	background-image: url(media/image/screen_01.png);
	height: 460px;
	top: 340px;
	left: 55%;
}

#about .screenshots
{
	background-image: url(media/image/screen_02.png);
	height: 400px;
	top: 1540px;
	right: 62%;
}

#about div[runslide-gallery]
{
	width: 415px;
	height: 258px;
	top: 31px;
	left: 21px;
	opacity: .88;
}

#about div[runslide-gallery] div
{
	width: 100%;
	height: 100%;
}

#varianten
{
	width: 100%;
	height: 1600px;
	background-color: #ffffff;
	color: #0a0a0a;
}

#varianten table
{
	text-align: center;
	background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(196, 214, 0, 1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(196, 214, 0, 1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(196, 214, 0, 1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(196, 214, 0, 1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(196, 214, 0, 1) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(196, 214, 0, 1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#C4D600',GradientType=1 ); /* IE6-9 */			
}

#varianten table tbody
{
	background: #fff;
}

#varianten thead
{
    background-repeat: no-repeat;
	border-bottom: 5px solid #C4D600;
}

#varianten table tr
{
	border-bottom: none;
}

#varianten table th
{
	background-color: #C4D600;
}

#varianten table tr:last-child
{
	border-bottom: none;
}

#varianten td:nth-child(2),td:nth-child(3),td:nth-child(4),th
{
	border-right: 5px solid #C4D600;
}

#varianten table tr td:nth-child(1)
{
	padding: 5px 5px 10px 10px;
	width: 500px;
	text-align: right;
}

#varianten table tr td:nth-child(2)
{
	padding: 5px 5px 10px 10px;
	width: 140px;
	text-align: center;
}

#varianten table tr td:nth-child(3)
{
	padding: 5px 5px 10px 10px;
	width: 140px;
	text-align: center;
}

#varianten table tr td:nth-child(4)
{
	padding: 5px 5px 10px 10px;
	width: 140px;
	text-align: center;
}

#varianten table p
{
	font-size: 120%;
	font-weight: 500;
}

#varianten .workflow p
{
	color: #C4D600;
}

#varianten .publish p
{
	color: #C4D600;
}

#varianten .authorization p
{
	color: #C4D600;
}

#varianten .dlm p
{
	color: #C4D600;
}

#varianten .history p
{
	color: #C4D600;
}

#varianten .search p
{
	color: #C4D600;
}

#varianten .version p
{
	color: #C4D600;
}

#varianten .structure p
{
	color: #C4D600;
}

#varianten .key p
{
	color: #C4D600;
}

#contact
{
    text-align: right;
	color: #fff;
}

#faqs
{
	height: 600px;
}

#faqs section[runslide-subsection]
{
	height: 600px;
	color: #fff
}

#faqs .faqsub
{
	background-color: #1b1b1b;
}

#faqs .faqsub div
{
	width: 100%;
	left: 0%;
}

#contact
{
	height: 700px;
}

#contact>div
{
	height: 155px;
}

#contact i
{
	position: absolute;
	background-color: #fff;
	box-shadow: 1px 1px 2px #000;
	width: 0;
	height: 1px;
	top: 50%;
	right: 0;
	-webkit-transition: width .5s ease;
	-moz-transition: width .5s ease;
	-ms-transition: width .5s ease;
	-o-transition: width .5s ease;
	transition: width .5s ease;
}

#contact h1, #contact p
{
	position: relative;
	opacity: 0;
	right: 0;
	-webkit-transition: right .5s ease .3s,opacity .5s ease .3s;
	-moz-transition: right .5s ease .3s,opacity .5s ease .3s;
	-ms-transition: right .5s ease .3s,opacity .5s ease .3s;
	-o-transition: right .5s ease .3s,opacity .5s ease .3s;
	transition: right .5s ease .3s,opacity .5s ease .3s;
}

#contact p
{
	float: right;
	text-align: left;
	margin: 0 0 0 80px;
}

#contact.enter i
{
	width: 80%!important;
}

#contact.enter h1,#contact.enter p
{
	opacity: 1!important;
}

#contact.enter h1
{
	right: 50px!important;
}

#contact.enter p
{
	right: 80px!important;
}
