/* general */
a.extern,
a.homeLink,
a.sectionLink,
a.mailLink {
	/* used for JavaScript only*/
}
.emph {
	font-weight: bold;
}
.space-above {
	margin-top: 20px;
}
.space-below {
	margin-bottom: 20px;
}

ul.inline {
	margin: 0;
}
ul.inline li {
	display: inline-block;
	margin-right: 20px;
}
ul.bullets {
	list-style-type: square;	
	padding-left: 20px;
	text-align: left;
	margin: 0;
	margin-bottom: 10px;
}
ul.bullets > li {
	margin: 5px 0;
	text-align: left;
}
ul.white {
	background-color: white;
	margin-top: 0;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.alpha {
	list-style-type: lower-latin;	
	padding-left: 20px;
	text-align: left;
	margin: 10px 0;
}
ul.alpha > li {
	margin: 0;
	margin-bottom: 10px;
	text-align: justify;
}
ul.alpha > li > p {
	margin-bottom: 0;
}

/* bigpoints */
div.bigpoints-title {
	display: inline-block;
	max-width: 660px;
	text-align: left;
}
ul.bigpoints {
	display: inline-block;
	max-width: 660px;
	text-align: left;
}
ul.bigpoints > li {
	margin: 15px 0;
}
.floatbox > ul {
	width: 49%;
}

/* button */
a.button,
.band a.button {
	padding: 5px 15px;
	color: white;
	font-weight: bold;
}
.buttons {
	display: block;
	padding: 8px 0;
}
.buttons > .button {
	margin-right: 8px;	
}

/* band */
.band {
	min-height: 300px;
}
.band.odd {
	background-color: #F8F8FA;
}
.band.even {
	background-color: #E7ECF5;
}
.band.title {
	background-repeat:no-repeat;
	background-position: center 0;
	background-size: 2560px auto;
	background-color: #E7ECF5;
}
.band.title .slogan {
	display: inline-block;
	color: #48484A;
	padding: 5px 15px;
	font-size: 1.9em;
	font-weight: bold;
}
.band.title .version {
	display: inline-block;
	padding: 10px;
	margin-top: 50px;
	background-color: #A80335;
	color: white;
	font-weight: bold;
}
.band a {
	font-weight: bold;
	text-decoration: none;
	color: #526D9C;
}
.band a:hover {
	text-decoration:  underline;
}

/* table */
table.inline {
	display: inline-table;
	width: auto;
}
table.inline td {
	vertical-align: middle;	
}
table.inline td.logo {
	padding-right: 30px;	
}
table.layout {
	width: 100%;
	table-layout: fixed;
}
table.layout.cell-height-med th,
table.layout.cell-height-med td {
	padding: 8px 0;
	vertical-align: middle;
}
table.layout > tbody > tr > th {
	text-align: left;
}

/* tiles */
.tile-container {
	display: inline-block;
	position: relative;
	padding: 0;
	margin: 20px -12px;
}
.tile {
	display: inline-block;
/*	position: relative; */
	float: left;
	margin: 0;
	width: 24%;
	padding: 12px;
}
.tile .text {
	min-height: 240px;
	text-align: justify;
	margin-bottom: 10px;
}
.tile-spacer {
	display: inline-block;
	float: left;
	width: 1.3%;
	height: 20px;
}
@media (max-width: 1039px) {
	.tile {
		width: 49%;
	}
	.tile .text {
		min-height: 170px;
	}
	.tile-spacer.middle {
		width: 100%;	
	}
}
@media (max-width: 599px) {
	.tile {
		width: 98%;
	}
	.tile .text {
		min-height: auto;
	}
	.tile-spacer {
		width: 100%;	
	}
}
.tile .title {
	display: block;
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 10px;
	
	padding-top: 40px;
	background-repeat:no-repeat;
	background-position: left top;
	background-size: auto 40px;
}

/* content */
.content .content-section {
	padding-bottom: 10px;
}
.content .content-box {
	display: block;
	/*
	display: inline-block;
	width: 100%;
	*/
}
.content.optional {
/*	display: none; */
	padding-top: 0;
	padding-bottom: 40px;

	-webkit-transition: all 1.25s linear; 
	transition: all 1.25s linear;
	
}
.content .optional {
	display: none;
}
.content .hint {
	font-size: 0.9em;	
	margin-bottom: 10px;
}
.content .info-box {
	display: inline-block;
	background-color: white;
	padding: 5px;
	padding-right: 15px;
}

.content .caro {
	color: #971337;	
	white-space: nowrap;
}
.quote {
	width: 100%;
	background-color: #E7ECF5;
/*	background-color: #F3F5FA; */
	text-align: center;
	padding: 15px 15%;
	color: #526D9C;
}
.quote .quelle {
	display: block;	
	font-style: italic;	
	font-size: 80%;
	margin-top: 10px;
	color: #18181A;
}
.footnote {
	font-size: 0.8em;
}
.verdict .label {
	display: inline-block;
	padding: 2px 5px;
	margin-right: 5px;
/*	background-color: #A80335; */
	background-color: #647CC6;
	color: white;
	font-weight: bold;
}
.verdict .text {
	display: inline-block;
	padding: 2px 5px;
	background-color: #FFFFCC;
	font-weight: bold;
}

/* layout1col */
.layout1col {
	text-align: justify;
}

/* layout2col */
.layout2col {
	display: block;
	margin: 0;
	padding: 0;
}
.layout2col:after {
    content: "-";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}
.layout2col .col-left,
.layout2col .col-right {
	display: inline-block;
	width: 50%;
	float: left;
	margin: 0;
	padding: 0;
	min-width: 400px;
	text-align: justify;
}
.layout2col .col-left {
	padding-right: 20px;
}
.layout2col .col-right {
	padding-left: 20px;
}
.layout2col .col-left > .col-inlay {
	padding-left: 10px;
}
.layout2col .col-right > .col-inlay {
	padding-right: 10px;
}
.layout2col .col-inlay {
	padding-top: 5px;
	padding-bottom: 15px;
	/* this is required for some unknown reason */
	border-top:    1px transparent solid;
	border-bottom: 1px transparent solid;
}
.layout2col .col-one,
.layout2col .col-four {
	background-color: #E0E0E0;
}
.layout2col .col-two,
.layout2col .col-three {
	background-color: #F0F0F0;
}
@media (max-width: 879px) {
	.layout2col .col-left,
	.layout2col .col-right {
		display: block;
		width: 100%;
		padding: 0;
		float: none;
		min-width: inherit;
	}
	.layout2col .col-one,
	.layout2col .col-three {
		background-color: #E0E0E0;
	}
	.layout2col .col-two,
	.layout2col .col-four {
		background-color: #F0F0F0;
	}
	.layout2col .col-left > .col-inlay,
	.layout2col .col-right > .col-inlay {
		padding-left: 10px;
		padding-right: 10px;
	}
}


label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold;
}

/* checkbox */
.checkbox {
	vertical-align:top;
	line-height: 22px;
}
.checkbox > .box {
	float: right;
	display: block;
	width: 22px;	
	height: 22px;	
	border: 2px #647CC6 solid;
	background-color: white;
	margin-left: 5px;
	padding: 1px;
}
.checkbox > .box:hover {
	background-color: aqua;	
}
.checkbox > .box > .tick {
	display: none;
	float: left;
	background-color: #647CC6;
	width: 16px;	
	height: 16px;	
}
.checkbox.checked > .box > .tick {
	display: inline-block;
}

/* tab-view */
.tab-view .tab-head .tab-label {
	margin-right: 1px;
}
.tab-view .tab-head .tab-label:not(.active) {
/*	background-color: #D5DDEE; */
	background-color: white;
	color: #647CC6;
}
.tab-view .tab-head .tab-label:not(.active):hover {
	background-color: #B7C5E1;
	color: white;
}

/* info */
table.info {
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 0 1px;	
	background-color: #647CC6;
	margin: 10px 0;
}
table.info tr th {
	color: white;
	font-weight: bold;
	text-align: left;
	padding: 0 5px;
}
table.info tr td {
	background-color: white;
	text-align: left;
	padding: 5px;
}
table.info tr td.center,
table.info tr th.center {
	text-align: center;
}


/* features */
table.features {
	width: 100%;
	border-spacing: 0 1px;
	background-color: white;
	border-collapse:separate;
	table-layout:fixed;
}
table.features col.feature {
	width: 25%;	
}
table.features col.description {
	width: 75%;	
}
table.features tr:nth-child(even) {
	background: #E0E0E0;
}
table.features tr:nth-child(odd) {
	background: #F0F0F0;
}
table.features td.feature {
	font-weight: bold;
}
table.features td.description {
	padding: 5px 0;
}
table.features td.description .feature {
	display: none;
	font-weight: bold;
}
table.features td ul.bullets {
	margin: 0;
	margin-bottom: 10px;
}
table.features td ul.bullets > li {
	margin: 2px 0;		
}
@media (max-width: 879px) {
	table.features col.feature {
		width: 0;
	}
	table.features col.description {
		width: 100%;	
	}
	table.features td.feature {
		/* dont use display: none! */
		visibility:hidden;
	}
	table.features td.description .feature {
		display: block;
	}
}


/* downloads */
table.downloads {
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 0 1px;	
	background-color: #647CC6;
	width: 100%;
	margin: 10px 0;
}
table.downloads col {
	width: 70px;
}
table.downloads col.file {
	width: 99%;
}
table.downloads col.size {
	width: 60px;
}
table.downloads col.date {
	width: 110px;
}
table.downloads tr th {
	color: white;
	font-weight: bold;
	text-align: center;
	padding: 0 5px;
}
table.downloads tr td {
	text-align: center;
	padding: 5px;
}
table.downloads tr th.file,
table.downloads tr td.file {
	text-align: left;
	padding-left: 10px;
}
table.downloads tr td > a {
	display: block;
}
table.downloads tbody > tr {
	background-color: white;	
}
table.downloads.previous tbody > tr:nth-child(even) {
	background-color: #F4F4F4;	
}
table.downloads.previous tbody > tr:nth-child(odd) {
	background-color: white;	
}