/* IE9- fixes */

$font-size: 15px;
$line-height: 22px;

@import 'natuive-setup';
@import 'theme-variables'; /* Rewrite base variables here; add theme CSS below this one in <head> */

.row {
	
	font-size: 0;
	text-align: left;

}

.row > * {
	
	font-size: 16px; /* To do: replace by actual font size of column's row's parent */
	min-width: 20%; /* To do: support +33% */
	display: inline-block;
	padding: 0;
	margin: 0;
	border: none;
	color: #333;
	box-sizing: border-box;
	vertical-align: top;
	position: relative;
	word-wrap: break-word;

}

.row > * {
	
	max-width: 20%;
	
}

.row > *[class^=col] {
	
	max-width: none;

}

.row > .table-row {
	
	display: table;
	width: 100%;
	max-width: 100%;
	table-layout: fixed;
	border-spacing: .5em;
	border-collapse: separate;
	font-size: inherit;
	margin-bottom: -.5em;
	padding: 0;

}

.row > .table-row > * {
	
	display: table-cell;
	padding: .5em;
	vertical-align: top;
	word-wrap: break-word;	
	
}

.row.no-spacing > .table-row {
	
	border-collapse: collapse;
	
}
	
.row.no-padding > .table-row > * {
	
	padding: 0;
	
}
	
.col1 {
	
	width: 100%;
	max-width: 100%;

}

.col2 {
	
	width: 50%;

}

.col3 {
	
	width: 33.333%;

}

.col23 {
	
	width: 66.667%;
	
}

.col4 {
	
	width: 25%;

}

.col34 {

	width: 75%;	

}

.col5 {
	
	width: 20%;	
	
}

.col25 {

	width: 40%;

}

.col35 {

	width: 60%;

}

.col45 {

	width: 80%;

}

.align-right {
	
	text-align: right;
	
}

.align-left {
	
	text-align: left;
	
}

.align-center {
	
	text-align: center;

}

.align-middle, .row > .table-row > .align-middle {
	
	vertical-align: middle;

}

.align-bottom, .row > .table-row > .align-bottom {
	
	vertical-align: bottom;

}

.border-all.row > * {
	
	padding-right: 0;

}

.border-all.row .row {

	margin-left: -$line-height-em/2;
	padding: $line-height-em/2 0;

}

.border-all.row .row > * {
	
	padding-right: 0;
	box-sizing: border-box;

}

.border-all.row .row > * > * {
	
	margin-left: 0;
	padding-right: 0;

}

input {
	
	line-height: $line-height*2;

}

form select {
	
	padding-right: 0;
	height: $line-height;
	margin-top: $line-height/2;
	

}

form#language-selector select {
	
	margin: 0;
	padding-left: 0;
	height: $line-height*2;

}

:root select { /* IE9 not IE8 */
	
	height: $line-height*2;
	margin-top: 0;

}

input[type=checkbox], input[type=radio], form.wide input[type=checkbox], form.wide input[type=radio] {
	
	margin-left: 0;
	float: none;
	position: static;
	display: inline-block;
	clear: left;
	margin-top: 1em;

}

:root input[type=checkbox], :root input[type=radio], :root form.wide input[type=checkbox], :root form.wide input[type=radio] {
	
	display: none;

}

form.mast input[type=checkbox], form.mast input[type=radio] {
	
	float: left;
	width: auto;

}

input[type=file] {
	
	margin-left: -100%;
	height: 0;

}

input[type=submit] {
	
	padding: 0;
		
}

.checkbox-icon {
	
	margin-right: 1em;
// 	display: inline-block;
	opacity: 0;

}

:root .checkbox-icon {
	
	opacity: 1	;

}

form select, form .file-input {
	
	background-image: none;

}

form .file-input span {
	
	min-height: $line-height-em;

}

.slider-nav {
	
	left: 1em;
	
}

.slider > *:after, .slider > *:before {

	display: none;	

}

.slider {
	
	overflow-x: scroll;

}
	
.vertical .slider-nav {
	
	top: 1em;

}

nav input[type=reset], nav input.trigger, nav input.trigger.burger, nav.drop > ul input.trigger {
	
	display: none;

}

nav.drop > ul, nav.drop > ul > li {
	
	display: inline-block;
	visibility: visible;
	opacity: 1;

}

nav.drop ul li a {
	
	font-size: $font-size;
	z-index: 1;

}

nav.drop ul li li ul, nav.drop ul li li div {
	
	display: none;
	
}

nav.drop ul li li:hover ul, nav.drop ul li li:hover div {
	
	display: block;
	
}

nav.drop ul ul, nav.drop ul div {
	
	visibility: hidden;
	display: none;
	position: absolute;
	
}

nav.drop ul li:hover > ul, nav.drop ul li:hover div {
	
	visibility: visible;
	display: block;
	z-index: 5;
	
}

nav.drop input:checked ~ input[type=reset], nav.drop input.trigger {
	
	background: url(../images/0.png);
	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGBgAAAABQABh6FO
1AAAAABJRU5ErkJggg=="); /* IE10- */

}

nav.drop ul li a[href] {
	
	z-index: 1;

}

.header-and-banner.viewport {
	
	overflow: hidden;

}

.tool:hover .tip {
	
	opacity: 1;
	display: block;
	top: 2em;
	
}

.fold > .content {

    max-height: 0;

}

.fold.open > .content, .fold.mobile > .content {

    max-height: none;

}
