@font-face {
    font-family: 'ContinentalStagSans';
    src: url('ContinentalStagSans-Book.otf');
    src: url('ContinentalStagSans-Book.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ContinentalStagSans';
    src: url('ContinentalStagSans-Med.otf');
    src: url('ContinentalStagSans-Med.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'ContinentalStagSans';
    src: url('ContinentalStagSans-Light.otf');
    src: url('ContinentalStagSans-Light.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
}

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

body {
	background-color: #000;
	font-family: ContinentalStagSans,Arial,sans-serif;
	color: #fff;
	font-size: 12pt;
	letter-spacing: 0.02em;
}

h1, h2, h3 {
	color: #fb9d00;
	font-weight: bold;
}
h1 {
	font-size: 18pt;
}
h2 {
	font-size: 16pt;
}
h3 {
	font-size: 14pt;
}

#centerer {
	position: relative;
	clear: both;
    float: left;
	width: 100%;
	height: 50%;
	margin-top: -360px;
}

#ipscontent {
	clear: both;
	position: relative;
	margin: 0 auto;
	width: 1280px;
	height: 720px;
}
	#ipscontent .logo {
		position: absolute;
		top: 19px;
		padding-top: 3px;
		left: 28px;
		width: 204px;
		height: 48px;
		border-right: 1px solid #4c4c4c;
		z-index: 200;
	}
	#langselector {
		position: absolute;
		top: 22px;
		right: 28px;
		z-index: 200;
	}
	#mainnav {
		position: absolute;
		bottom: 28px;
		left: 28px;
		z-index: 200;
	}
		#mainnav a {
			display: inline-block;
			position: relative;
			width: 33px;
			height: 27px;
			margin-right: 10px;
			background-repeat: no-repeat;
		}
		#mainnav-back {
			background-image: url(../images/navi_back.png);
		}
		#mainnav-home {
			background-image: url(../images/navi_home.png);
		}

	#ipscontent .screen {
		position: absolute;
		top: 0;
		left: 0;
		background-repeat: no-repeat;
		background-size: cover;
		width: 100%;
		height: 100%;
		z-index: 100;
	}
		#ipscontent .screen h1 {
			position: absolute;
			top: 9px;
			left: 257px;
		}
		#ipscontent .screen .template {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

/** CARROUSEL_MENU **/
		#ipscontent .screen .CARROUSEL_MENU {
			visibility: hidden;
		}
			#ipscontent .screen .CARROUSEL_MENU a img {
				-webkit-filter: brightness(0.6);
  				filter: brightness(0.6);
  				transition: filter 1s ease-in-out;
  			}
			#ipscontent .screen .CARROUSEL_MENU a.front img {
				-webkit-filter: brightness(1);
  				filter: brightness(1);
  			}
			#ipscontent .screen .CARROUSEL_MENU .button {
				position: absolute;
				top: 0;
				height: 100%;
				z-index: 200;
				cursor: pointer;
  			}
				/*#ipscontent .screen .CARROUSEL_MENU .button:hover {
					background-color: rgba(255,0,0,0.2);
				}*/
			#ipscontent .screen .CARROUSEL_MENU .button.prev2 {
				left: 0;
				width: 10%;
			}
			#ipscontent .screen .CARROUSEL_MENU .button.next2 {
				left: 90%;
				width: 10%;
			}
			#ipscontent .screen .CARROUSEL_MENU .button.prev {
				left: 10%;
				width: 20%;
			}
			#ipscontent .screen .CARROUSEL_MENU .button.next {
				left: 70%;
				width: 20%;
			}

/** PORTRAIT_MAIN **/
		#ipscontent .screen .PORTRAIT_MAIN {
			box-shadow: inset 0 120px 40px -40px #000, inset 0 -120px 40px -40px #000;
		}
			#ipscontent .screen .PORTRAIT_MAIN .header {
				position: absolute;
				top: 240px;
				left: 420px;
				background-color: rgba(0,0,0,0.5);
				padding: 10px;
			}
				#ipscontent .screen .PORTRAIT_MAIN .header h2 {
					color: #fff;
					font-weight: normal;
					margin: 0;
				}
				#ipscontent .screen .PORTRAIT_MAIN .header p {
					margin-bottom: 0;
				}
			#ipscontent .screen .PORTRAIT_MAIN .headline {
				margin-top: 365px;
				margin-left: 32px;
				position: relative;
				font-size: 14pt;
				line-height: 1.5em;
			}
			#ipscontent .screen .PORTRAIT_MAIN .text {
				position: relative;
				-webkit-column-count: 3; /* Chrome, Safari, Opera */
			    -moz-column-count: 3; /* Firefox */
			    column-count: 3;
		    	-webkit-column-gap: 10px; /* Chrome, Safari, Opera */
			    -moz-column-gap: 10px; /* Firefox */
			    column-gap: 10px;
			    font-size: 9pt;
			    margin: 0 32px;
			}
			#ipscontent .screen .PORTRAIT_MAIN .menu {
				position: absolute;
				bottom: 28px;
				right: 28px;
				z-index: 200;
			}
				#ipscontent .screen .PORTRAIT_MAIN .menu a.menuitem {
					display: inline-block;
					position: relative;
					width: 64px;
					height: 32px;
					margin-right: 10px;
					background-repeat: no-repeat;
					text-decoration: none;
					color: #000;
					line-height: 32px;
					padding-left: 32px;
					font-size: 10pt;
				}
			#ipscontent .screen .PORTRAIT_MAIN .documents {
				display: none;
				position: absolute;
				top: 25%;
				left: 25%;
				width: 50%;
				background-color: #373737;
				border-radius: 8px;
				padding: 0 10px 10px 10px;
				font-size: 10pt;
			}
				#ipscontent .screen .PORTRAIT_MAIN .documents a.document {
					display: block;
					color: #fff;
					text-decoration: none;
					background-image: url(download.png);
					background-repeat: no-repeat;
					background-position: left center;
					min-height: 22px;
					line-height: 2.25em;
					padding-left: 30px;
				}
					#ipscontent .screen .PORTRAIT_MAIN .documents a.document span {
						color: #999;
						font-size: 0.8em;
						margin-left: 0.5em;
					}
				#ipscontent .screen .PORTRAIT_MAIN .documents a.cancel {
					display: block;
					color: #fb9d00;
					text-decoration: none;
					background-image: url(arrow_orange.png);
					background-repeat: no-repeat;
					background-position: left center;
					min-height: 22px;
					line-height: 2.25em;
					padding-left: 10px;
					margin-top: 1em;
				}

/** PORTRAIT_DETAIL **/
		#ipscontent .screen .PORTRAIT_DETAIL {
			box-shadow: inset 0 120px 40px -40px #000, inset 0 -120px 40px -40px #000;
		}
			#ipscontent .screen .PORTRAIT_DETAIL .header {
				position: absolute;
				top: 65%;
				left: 0;
				width: 36.5%;
				background-color: rgba(0,0,0,0.5);
				padding: 10px 3%;
				text-align: right;
			}
				#ipscontent .screen .PORTRAIT_DETAIL .header h2 {
					color: #fff;
					font-weight: normal;
					margin: 0;
				}
				#ipscontent .screen .PORTRAIT_DETAIL .header p {
					margin-bottom: 0;
				}
			#ipscontent .screen .PORTRAIT_DETAIL .text {
				position: absolute;
				left: 42.5%;
				width: 54%;
				top: 17.5%;
				height: 75%;
			    font-size: 9pt;
			    overflow: auto;
			    letter-spacing: 0.05em;
			    padding-right: 1%;
			}
				#ipscontent .screen .PORTRAIT_DETAIL .text h3 {
					color: #fff;
					margin-top: 0;
					font-weight: normal;
				}

/** VIDEO **/
			#ipscontent .screen .VIDEO video {
				position: relative;
				display: block;
				width: 100%;
				height: 100%;
			}
			#ipscontent .screen .VIDEO .videochapters,
			#ipscontent .screen .VIDEO .videochapters img {
				position: absolute;
				top: 0;
				left: 0;
			}
			#ipscontent .screen .VIDEO .captions,
			#ipscontent .screen .VIDEO .captions div {
				position: absolute;
				bottom: -50;
				left: 0;
				width: 100%;
			}
			#ipscontent .screen .VIDEO .captions div {
				display: none;
				text-align: center;
				color: #fff;
				text-shadow: 1px 1px 0 #000;
				font-size: 16pt;
			}


#ipscontent.onlyback>.logo,
#ipscontent.onlyback .screen>h1,
#ipscontent.onlyback #langselector,
#ipscontent.onlyback #mainnav-home {
	display: none;
}
#ipscontent.onlyback #mainnav {
	top: 28px;
	bottom: unset;
	opacity: 0;
	transition: opacity 1s ease-in-out 1s;
}
	#ipscontent.onlyback:hover #mainnav {
		opacity: 1;
		transition: opacity 500ms ease-in-out;
	}

#ipscontent.noheader>.logo {
	display: none;
}