/* Grid */

.contain {

	max-width: 1216px;
	margin: 0 auto;

}

.row {

	display: table;
	table-layout: fixed;
	width: 100%;
	border-collapse: separate;
	padding: .5em 0;
	
}

	.row > * {
	
		display: table-cell;
		vertical-align: top;
		position: relative;
		padding: 0 .5em; /* instead of em, because of Chrome subpixel rendering */
		word-wrap: break-word;

	}
	
	.row .row {

		margin: -.5em;
		width: calc(100% + 1em);
		margin: 0\9;
		max-width: none;
		padding: 0;

	}
	
	.row > * > * {
		
		max-width: 100%; /* instead of overflow-x:hidden, which would also activate overflow-y:hidden and clip the tooltip */
		
	}

	.row > .column23 {

		width: 66.6%;

	}
	
	.row > .column34 {

		width: 75%;

	}

	.row > .column4 {

		width: 25%;

	}

	.row > .column3 {

		width: 33.333%;

	}

	.row > .column2 {

		width: 50%;

	}

/* Basic elements */

html, body {
	
	height: 100%;
	margin: 0 auto;
	
}

html.nooverflow, html.nooverflow body {
	
	overflow: hidden;

}

body {

	font-family: 'Helvetica Neue', Arial, sans-serif;
	font-weight: 300;
	color: #555;
	font-size: 15px; /* 15px */
	position: relative;
	width: 100%; 
	background: #fff;
	-webkit-text-size-adjust: none;
	display: table;
	
}

body * {
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* iOS: Don't flash on tap */

}

h1, h2, h3, h4, h5 {
	
	margin: 0;
	font-weight: 500;

}

h1 {
	
	font-size: 2.67em; /* 2.666em 40px */
}

h2 {
	
	font-size: 2.134em; /* 2.1333em 32px */

}

h3 {
	
	font-size: 1.6em; /* 1.6em 24px */

}

h4 {
	
	font-size: 1.2em; /* 1.222em 18px */

}

h5 {
	
	font-size: 1em; /* 1em 15px */

}

body, h3, h4, h5, .sub.nav a, .button, input[type="submit"], label, input, #content select, textarea {
	
	line-height: 22px; /* 1.4666em = 22px (actual line height) / 15px (font size) */
	
}

h1, h2, .nav a, .accordion > label {
	
	line-height: 44px;
	
}

img {
	
	max-width: 100%;
	border: none;
	
}

b {
	
	font-weight: bold;

}

p, li {

	margin: 22px 0;

}

a:link, a:visited {

	color: #333;

}

	a[href]:hover, #content input[type='submit']:hover, a.button:hover {

		color: #ee8822;

	}

	a.lightbox {
		
		display: inline-block;
		vertical-align: bottom;
		
	}
	
	a.lightbox img {
		
		display: block;
		
	}

.wide-screen {
	
	display: block;
	
}

.narrow-screen {
	
	display: none !important;
	
}

/* Navigation */

.nav {
	
	font-size: 1.6em;
	line-height: 0.8;
	vertical-align: baseline;

}

	ul.nav, .nav ul {
	
		margin: 0;
		padding: 0;
		display: inline-block;
	
	}
	
	.nav a {
		
		color: #666;
		text-transform: uppercase;
		text-decoration: none;
		position: relative;
		padding: 0 .5em 0 0;

	}
	
	.nav a.active:link, .nav a.active:visited {
	
		color: #ee8822;
	
	}
	
	.nav li {
	
		display: inline;
	
	}

	.nav li:last-child {

		margin-right: 0;

	}

	.sub.nav {
	
		font-size: 1em;
	
	}
	
	.sub.nav a {
	
		color: #727272;
		display: inline-block;
		text-transform: none;
		padding: 0 .3em 0 0;
	
	}

	.nav li:first-child a {
		
		padding-left: 0;

	}
	
	#head .sub.nav li:not(:first-child):before {

		content: "";
		border-left: 1px solid #ddd;
		padding-right: .6em;

	}
	
	.nav a[href]:hover {
		
		color: #ee8822;
		
	}

	form.nav {
	
		display: inline-block;
		font-size: 1.6em;
		white-space: nowrap;
	
	}

	form.nav .selector {

		background: url('../images/country_select_globes.png') center left no-repeat;
		padding-left: .8em;

	}

	form.nav select {

		font-size: .5em;
		border: none;
		-moz-appearance: window;
		vertical-align: middle;
		background: transparent;

	}

/* Buttons */

.button, input[type="submit"] {

	text-decoration: none;
	font-weight: bold;
	color: #555;
/* 	font-size: .8666em; */
	display: inline-block;
	cursor: pointer;
	width: auto;
	word-break: break-word;
	background: #f1f1f1;
	padding: 0 .5em;
	
	-webkit-appearance: none;

}

	.button, input[type="submit"], label, .trigger {
	
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;

	}

	.button:active, input[type="submit"]:active {

		background: #ccc;
		
	}
	
	.button.big:after {
	
		content: "►";
		padding-left: .3em;
	
	}

	.button.big, #content input[type="submit"] {

		background: rgb(0,221,240);
		font-size: 1.2em;
		line-height: 2.44444444444em;
		padding: 0 1em;
		margin: 1.2333em 0;
		border: none;
		color: #fff;

	}
	
	@-moz-document url-prefix() {

		#content input[type="submit"] { line-height: 2.333em; }
		.button.big { margin: 1.22em 0; }
		
	}

	.button.big:active, #content input[type="submit"]:active {

		background: rgb(0,121,140);

	}

	.button.yellow {
		
		color: #862165;
		background: rgb(251,222,4);
		
	}
	
	.button.yellow:active {
		
		background: rgb(151,122,0);
		
	}
	
/* Top */

#head .row > div.column4 {
	
	text-align: right;
	vertical-align: bottom;
	
}
	
	#head .row > div.column4 .nav a {
		
		padding-right: 0;
		
	}

	#head img {
		
		margin: 0;
		
	}

/* Head */

#head h1, #head p {

	color: #333;

}
	
	#head h1 {
		
		font-size: 3em;

	}

/* Main */

#content ul {

	padding-left: 1.3em;

}
	
	#content .nav ul {
	
		padding-left: 0;
	
	}

	#content ul li {
		
		margin: 1.4666em 0 0 0;

	}

	.row > * > img {
		
		display: block;
		margin: 0 auto;
		
	}

/* Footer */

/*
#footer {
	
	display: table-row;
	
}

	#footer > * {
		
		vertical-align: bottom; 
		display: table-cell;
			
	}
*/

/* Forms */

form {
	
	overflow: hidden;

}

	form label {
		
		text-align: right;
		
	}

	#content form {
		
		padding-top: 22px;

	}

	label {
		
		display: inline-block;
		text-align: right;
		font-weight: bold;
		max-width: 100%;
		position: relative;
		padding: 0;
		margin: 0 0 22px 0;
		width: 100%;
		float: left;

	}
	
	form div.checkbox {
	
		clear: both;
		min-height: 44px;
		margin-bottom: 22px;

	}

	form div.checkbox:after {
		
		content: "";
		display: block;
		clear: both;

	}
		
	select {
		
		-webkit-appearance: none;
		appearance: none;
		font-family: inherit;
	    text-indent: -1px;
	    text-overflow: '';	
	    margin: 0;

	}

	select::-ms-expand {
	
	    display: none;
	
	}

	input, #content select, textarea {
		
		font-family: inherit;
		display: inline-block;
		overflow: hidden;
		resize: none;
		vertical-align: top;
		border-radius: 0;
		padding: 0 .7em;
		min-height: 44px;
		border: 0;
		background: #eee;
		font-size: 1.0666em;
		margin: -11px 0 11px 0;
		width: 50%;
		float: right;

	}
	
		input:focus {
			
			line-height: 44px\9; /* IE8 input vertical alignment */
	
		}
	
		@-moz-document url-prefix() {

			input { border-bottom: 1px solid transparent; }

		}

	form div.checkbox span {
		
		display: inline-block;
		font-weight: bold;
		text-align: right;
		width: 50%;
		float: left;
		margin-top: 0;
		padding-right: 3%;
		cursor: default;

	}
	
	form input[type="submit"] {
		
		margin-right: 0;
		min-width: 50%;
		
	}
	
	textarea {
		
		margin: -11px 0 11px 0;
		border-bottom: 1px solid transparent;
		padding-top: 11px;
		min-height: 66px;

	}
	
	label span {
		
		position: relative;
		display: inline-block;
		width: 50%;
		padding: 0 3% 0 0;
		float: left;		

	}
	
	form div.checkbox label span {
		
		width: auto;

	}
	
	form .mandatory span.checkbox:after, form .mandatory span.tip:after {
	
		display: none;
		
	}

	form .mandatory {
		
		position: relative;
		
	}

	form .mandatory:after {
		
		content: "*";
		color: #a00;
		position: absolute;
		left: 47.5%;
		top: 0;
		font-weight: bold;
		
	}

	form .mandatory.alert span, form .mandatory.alert p {
		
		background: #666;
		color: #eee;
		
	}

	form .mandatory.alert span.checkbox {
		
		background: transparent;
		color: #555;
		
	}

	form .mandatory.alert span.tip {
		
		background: #222;
		
	}
	
	#content select {
		
		-moz-appearance: none;
		text-indent: 0.01px;
		text-overflow: '';
		width: 45%;
		margin-top: 0;
		min-height: 0; /* IE8 fix */
		width: 100%;
		background: transparent;
		border: 0;
		text-indent: 0px;
		padding: 11px 1.6em 11px .7em;
		padding-right: 0\9; /* IE8 */
		float: none;
		height: 44px;

	}

	@-moz-document url-prefix()	{

		#content select { width: calc(100% + 1em); padding-left: .5em;}

	}
	
	form .selector, form .file-input {

		width: 50%;
		background: #eee url('../images/select-arrow.svg') no-repeat;
		background-position: calc(100% - .7em) 50%;
		padding: 0;
		vertical-align: top;
		border: none;
		height: 22px;
		overflow: hidden;
		margin-left: 0;

	}
	
	#content form .selector {
		
		padding-top: 0;
		height: 44px;
		margin: -11px 0 11px 0;
		
	}
	
	:root #content select { padding-right: 2% \0/IE9; background: #fff \0/IE9; }  /* Disable the custom arrow in IE9 */

	select:hover {
		
		cursor: pointer;
		
	}

	noscript input[type="submit"] {
		
		max-height: 1em;
		line-height: 1;
		padding: .1em;
		min-width: 0;
		margin-top: 0;
		min-height: 0;
		font-size: .8em;

	}
	
	div.checkbox label {
		
		text-align: left;
		width: 50%;
		font-weight: normal;
		float: right;
		clear: right;
		margin: 1px 0 0 0;
		cursor: pointer;
		
	}
	
	div.checkbox label + label {
		
		margin-top: 0;

	}

	div.checkbox label:last-child {
		
		margin-bottom: 21px;

	}
		
	b.checkbox {
		
		width: 1em;
		height: 1em;
		display: inline-block;
		background: rgba(0,221,240,1);
		vertical-align: middle;
		margin-top: -.5em;
		text-align: center;
		line-height: 1;
		color: #333;
		margin-right: .5em;

	}

	input[type="checkbox"]:checked + b.checkbox:before {
		
		content: "✓";

	}

	input[type="radio"] + b.checkbox {
		
		border-radius: 50%;

	}

	input[type="radio"]:checked + b.checkbox:before {
		
		content: "●";

	}

	input[type="checkbox"]:focus + b.checkbox, input[type="radio"]:focus + b.checkbox {
		
		box-shadow: 0 0 1px #000;

	}
		
	input[type="checkbox"], input[type="radio"] {
		
		-webkit-appearance: none;
		-moz-appearance: window;
		-ms-appearance: none;
		position: absolute;
		background: transparent;
		cursor: pointer;
		opacity: 0;
		padding: 0;
		border: 1px solid transparent;
		left: 0;
		outline: none;
		float: left;
		width: auto;
		min-height: 0;
		opacity: 0;
		margin: 0 .5em 0 -1.5em;
		margin-left: 0\9; /* IE8 */

	}

	input[type="file"] {
		
		position: absolute;
		left: 0;
		width: 100%;
		margin: 0;
		padding: 0;
		cursor: pointer;
		filter: alpha(opacity=0);
		opacity: 0;
		font-size: 200px;
		height: 44px;
		margin-left: -100%\9;

	}
	
	form .file-input {

		font-weight: normal;
		background: #eee;
		height: 44px;
		line-height: 45px;
		margin: -11px 0 11px 0;
		cursor: pointer;
		font-style: italic;
		
	}

	form .file-input span {

		width: 100%;
		text-align: left;
		white-space: nowrap;
		padding: 0 0 0 .8em;

	}
		
/* Modal window */

#blackbox {

	z-index: 9999;
	background: #fff;
	background: rgba(255,255,255,.9);
	overflow-y: scroll;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	border-top: none;
	padding-top: 3em;
	-webkit-overflow-scrolling: touch;

	}

	#blackbox::-webkit-scrollbar {
	
	    display: none;
	
	}

	#blackbox .close {

		color: #fff;
		cursor: pointer;
		padding: .6em;
		height: 3em;
		font-weight: bold;
		position: fixed;
		background: #000;
		background: rgba(0,0,0,.7);
		width: 100%;
		z-index: 99999;
		top: 0;
		line-height: 1.7em;

	}

	#blackbox > * {
		
		background: #fff;
		
	}

	#blackbox .slider, #blackbox .slider-container {
		
		background: transparent;
		
	}
	
	#blackbox-bg {
		
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: -1;
		cursor: crosshair;
		background: transparent;

	}

/* Back to top button */

.backtotop {

	text-align: center;
	display: block;
	width: 2em;
	height: 2em;
	line-height: 2em;
	margin: .5em auto;
	font-weight: bold;
	background: transparent;
	background: rgba(0,0,0,.2);
	color: #fff;
	border-radius: 2em;
	font-family: "Hiragino Mincho ProN"; /* fix for iOS */
	cursor: pointer;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	text-decoration: none;

}

/* Tooltip */

.tool {

	cursor: help;
	font-weight: bold;
	position: relative;

}
	
	.tool:after {
		
		content: " ?";
		display: inline-block;
		background: #444;
		border-radius: 100%;
		color: #ddd;
		width: 1.5em;
		text-align: center;

	}

	.tip, label span .tip {
	
		background: #333;
		color: #ddd;
		padding: .5em;
		font-size: 12px;
		font-weight: normal;
		position: absolute;
		top: auto;
		left: 0;
		right: 0;
		display: none;
		cursor: default;
		overflow: hidden;
		line-height: 1.5em;
		z-index: 999;
		text-align: left;
		opacity: 0;
	    width: 300px;
	
	}
	
	.tip.open, .tool:hover .tip {
		
		opacity: 1;
		display: block;
		top: 2em;
		
	}

/* Lists */


ul {
	
	margin: 22px 0 22px .3em;

}

	ol {
	
	    list-style-type: none;
	    counter-reset: level1;
		padding: 0;
		margin: 0;
	
		}
	
	ol > li {

		text-indent: -2.3em;
		margin-left: 2.3em;

	}
	
	ol li > * {
		
		text-indent: 0;
		display: inline-block;

	}

	ol > li:before {

	    content: counter(level1);
	    counter-increment: level1;
	    font-weight: bold;
	    background: #999;
	    padding: .3em .6em .3em .6em;
	    border-radius: 1em;
	    margin-right: .5em;
	    color: #fff;

	}

	ol > li ol {

	    list-style-type: none;
	    counter-reset: level2;

	}

	ol > li ol > li:before {

	    content: counter(level1) "." counter(level2) " ";
	    counter-increment: level2;
	    padding: .3em .4em .3em .5em;
	    border-radius: 1em;
	    background: #999;
	    color: #fff;

	}

	ol ol > li ol {

	    list-style-type: none;
	    counter-reset: level3;
	    margin-left: 1em;

	}

	ol ol > li ol > li:before {

	    content: counter(level1) "." counter(level2) "." counter(level3) " ";
	    counter-increment: level3;

	}

	ol ol > li {

		text-indent: -3em;

	}

	ol ol ol > li {

		text-indent: -3.9em;

	}

	ol ul {

		text-indent: .1em;

	}

	ol p {

		text-indent: 0;

	}
	
	li h4 {
		
		line-height: 1.111em;
	}
	
/* Accordion */

.accordion {

	position: relative;
	padding: 0 .5em 0 1em;
	cursor: pointer;
	color: #777;
	font-weight: normal;
	margin: 0;
	text-align: left;
	cursor: pointer;
	background: #fff;
	max-width: 100%;
	
}

	.accordion > label {
		
		text-align: left;
		cursor: pointer;
		-webkit-transition: padding 0.25s ;
		-moz-transition: padding 0.25s ;
		-ms-transition: padding 0.25s ;
		-o-transition: padding 0.25s ;
		transition: padding 0.25s ;  
		
	}

	.accordion > div { /* hidden accordion item */

	    overflow: hidden;
	    max-height: 0;
	    cursor: auto;
	    transition: max-height .4s ease-in-out;

	}

	.accordion:first-of-type > div {

	    padding-top: 1px;

	}

	.accordion:first-of-type {

	    margin-bottom: -1px;

	}

	.accordion > div > * {
		
		margin-top: 0;

	}

	.accordion input.trigger:checked + div {
		
		max-height: none;

	}
	
	.accordion.open input.trigger + * {
		
		display: inline-block;
		
	}
	
	.accordion > label {
		
		margin: 0;
		float: none;
		
	}

/* Tables */

table {

	width: 100%;
	overflow: auto;
	border-collapse: collapse;
	-webkit-overflow-scrolling: touch;

	}

	table::-webkit-scrollbar {
	
	    display: none;
	
	}

	table td {

		padding: 0 .5em;
		vertical-align: middle;

	}

	table tr:first-child td {

		color: #fff;
		font-weight: bold;

	}

	table tr:nth-child(2n+1) {

		background: #f4f4f4;
	}

	table tr:first-child {

		font-size: 1.1em;
		background: #292b2e;

	}

	tr, td {
		
		border: none;
		
	}
	
	table.scroll {
		
		display: block;
		overflow: scroll;
		table-layout: auto;
		
	}

	table.scroll td {
		
		word-break: normal;
	
	}
	
	div.table {
		
		overflow-x: auto;
	    scrollbar-3dlight-color:grey;
	    scrollbar-arrow-color:grey;
	    scrollbar-base-color:;
	    scrollbar-darkshadow-color:grey;
	    scrollbar-face-color:;
	    scrollbar-highlight-color:;
	    scrollbar-shadow-color:
	
	}
	
/* Etc */

.social {
	
	text-align: right;
	
}

/* Checkbox trigger */

input.trigger, [for="nav-trigger"] {
	
	display: none;
	
}

.trigger {
	
	cursor: pointer;
	
}

.quote {
	
	margin-left: 1em;
	border-left: 1px solid #bbb;
	padding-left: 1em;
	
}

/* Narrow Screens */

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

	.row {
		
		overflow-x: hidden;

	}

	.row > * {

		display: block;
		padding: 5px; /* Because percentage leads to Android Chrome inline-block bug */

	}

	.row .row > * {

		padding: 0;

	}

	.row > *, .row > .column23, .row > .column2, .row > .column3, .row > .column4, .row > .column34 {

		width: auto;

	}
	
	#head > .row:first-child div {
		
		text-align: right;
		
	} 
	
	label {

		text-align: left;

	}
	
		label span {
			
			padding: 2% 0;
			width: 100%;
			text-align: left;
			
		}
		
		form .mandatory.alert > span {
			
			padding: 2%;
			
		}
		
		form .mandatory.alert > span.checkbox {
			
			padding: 2% 0;

		}
		
		form .mandatory:after {
			
			right: 0;
			left: auto;
			
		}

		#content label .selector, label input, textarea, form .file-input {
			
			width: 100%;
			margin: 0;
				
		}
	
		#content label select, input[type="submit"] {
	
			width: 100%;

		}
				
		#content select {
			
			padding: 0 1.3em 0 .7em;
			margin-bottom: 0;
			
		}
		
		@-moz-document url-prefix() {

			#content label select { width: 110%; padding-left: .5em; }

		}
		
		form label span .tip {
			
			visibility: hidden;
			
		}

		#content form label:before {
			
			display: none;
	
		}
		
		form div.checkbox span, div.checkbox label {
			
			display: block;
			width: 100%;
			text-align: left;

		}

		form div.checkbox span {
			
			margin-bottom: 22px;			
			
		}
		
		div.checkbox label {
		
			margin-top: 0;

		}
		
		input[type="radio"] {
			
			margin-left: 2px;
			
		}

		form .mandatory span.tool:after, form .mandatory p.tool:after {
			
			right: 0;
			
		}
		
	.wide-screen {
		
		display: none !important;
		
	}

	.narrow-screen {
		
		display: block !important;
		
	}

	table {
		
		display: block;
		overflow: scroll;
		table-layout: auto;
		
	}

	table td {
		
		word-break: normal;
	
	}
	
	.button.big {
		
		display: block;
		text-align: center;
		
	}

	.nav-main {
		
		position: fixed;
		top: 1em;
		left: 0;
		background: transparent;
		z-index: 99999;
		width: 100%;

	}
	
	.nav-main input.trigger#nav-trigger + div {
		
		display: none;
		
	}

	.nav-main input.trigger#nav-trigger:checked + div {
		
		display: block;
		
	}

	.nav-main .row * {

		background: #fff;
		
	}
	
	.nav-main > div {
		
		background: #fff;
		display: none;
		margin-top: 2em;

	}
	
	label[for="nav-trigger"] {
		
		display: block;
		left: 0;
		top: 0;
		width: 1.1em;
		height: 1em;
		font-size: 3em;
		line-height: .95em;
		margin: 0;
		text-align: center;
		max-width: none;
		overflow: hidden;
		background: #fff;
		position: fixed;
		z-index: 99999;
		-webkit-box-shadow: 1px 1px 2px #333;
		box-shadow: 1px 1px 2px #333;
		
	}
	
	#blackbox .close {
		
		padding-left: 4em;
		
	}

	.embed-row {
		
		margin: 0;

	}

}
