/*
Colors:
	white
		rgb(255,255,255)
		#fff
	red
		rgb(220,0,46)
		#FF002E
	gray
		rgb(198,198,198)
		#C6C6C6
	darkGray
		rgb(135,135,135)
		#878787
	darkerGray
		rgb(102,102,102)
		#666666
	darkestGray
		rgb(51,51,51)
		#333333
*/

body {
	padding: 0;
	margin: 0;
	font-size: 15pt;
}
*{
	box-sizing: border-box;
}
ul{
	list-style:none;
	padding: 0;
	margin: 0;
}
a{
	color:#FF002E;
}
#body{
	position:absolute;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color: #fff;
}

body #canvas{
	display:none;
}
body #page,
body #nav{
	-webkit-transition: opacity 1000ms ease;
	transition: opacity 1000ms ease;
	opacity:1;
}
body.intro #page,
body.intro #nav{
	opacity:0;
}
body.intro #canvas{
	display:block;
	position:absolute;
	top:0;
	left:0;
}

#page {
	height:100%;
}
#page .left_half,
#page .right_half{
	z-index:1;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	overflow: auto;
	background-color:#fff;
}
#page .left_half.moved,
#page .right_half.moved{
	overflow: hidden;
}
#page .left_half{
	left:0;
}
#page .left_half.moved{
	width:50%;
}
#page .right_half{
	right:0;
	width:50%;
}

.content{
	position:relative;
}

/**************** PAGE HEADER *******************/
#page .page_header{
	position: fixed;
	top:0;
	width:100%;
	height:71px;
	overflow: hidden;
	font-size:18px;
	font-family: "Gotham-Book", arial;
	color: #878787;
	background-color: rgba(255,255,255,0.9);
	padding-left: 50px;
	border-bottom: 1px solid #C6C6C6;
	z-index:1;
	-webkit-transition: top 1s ease 500ms;
	transition: top 1s ease 500ms;
}
#page .left_half .page_header:before{
	background-color: #C6C6C6;
	padding-left: 0;
	box-shadow: none;
	position: absolute;
	width: 51px;
	height: 1px;
	content: "";
	top: 35px;
	left: 0;
}
#page .right_half .page_header > div{
	right:0;
}
#page .page_header > div{
	position:absolute;
	width:100%;
	height:71px;
	line-height:70px;
}
#page .moved .page_header{
	width:50%;
}
#page .page_header.hidden{
	top: -71px;
}

/************** BACK TO TOP BUTTON ********************/
.back_to_top{
	display:block;
	background-color: #C6C6C6;
	margin: 0 0 60px;
	color: #424242;
	font-family: 'Gotham-Book', arial;
	padding: 10px 20px;
	text-align: center;
}
.back_to_top div{
	display:inline-block;
	float:none;
	clear:both;
}
.back_to_top svg{
	display: inline;
}
.back_to_top span{
	display: inline-block;
	height:35px;
	line-height:35px;
	float:left;
}

/********************** PAGE CONTENT ***********************/
.icons_connector{
	position: absolute;
	top: 0px;
	width: 1px;
	right:35px;
	background-color: #C6C6C6;
}
.right_half .content{
	position: absolute;
	right:0;
	top:0;
}

.list_element{
	position:relative;
	margin: 30px 70px 70px;
}
.list_element .header h2{
	position:relative;
	color:rgb(51,51,51);
	font-family: 'Gotham-Bold', arial;
	font-size:20pt;
	margin:0;
}
.list_element .header h3{
	color:rgb(198,198,198);
	font-family: 'Gotham-Book', arial;
	font-size:17pt;
	margin:0;
}
.list_element .header .icon{
	position:absolute;
	background-color:rgb(198,198,198);
	top:0;
	left:100%;
	margin-left:10px;
	width: 50px;
	height:50px;
	border-radius:50%;
	display: table;
}
.list_element .header .icon .pseudo_cell{
	text-align:center;
	display: table-cell;
	vertical-align: middle;
}
.list_element .header .icon img{
	max-width: 30px;
	max-height: 30px;
}
.list_element .body{
	text-align: justify;
	padding: 15px 0 10px;
	line-height:15pt;
	color:rgb(102,102,102);
	font-family: 'ChaparralPro-Regular', arial;
	font-size:13pt;
}
.list_element .footer{
	color:rgb(51,51,51);
	font-family: 'Gotham-Book', arial;
	font-size:12pt;
}
.list_element .footer svg{
	float:left;
}
.list_element hr{
	clear: both;
}

/******************* BRIDGE *********************/
.bridge{
	position:absolute;
	top:15px;
	left:20px;
	width:27px;
	height:41px;
	padding: 5px 10px;
	z-index:100;
}
.bridge div{
	width:100%;
	height:100%;
	border-top: 13px solid #FF002E;
	border-bottom: 13px solid #FF002E;
}


/******************* NAVIGATION *****************************/
#nav{
	position:fixed;
	display:none;
	top:0;
	left:0;
	width:100%;
	height:100%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-perspective:800px;
	perspective:800px;
	font-family: "Gotham-Book", arial;
	font-size:20px;
}
#nav.active{
	display:block;
}
#nav .left_half{
	position:absolute;
	overflow:auto;
	background-color:#fff;
	right:50%;
}
#nav .right_half{
	position: absolute;
	left:50%;
	overflow:auto;
	background-color:#fff;
}
#nav.animated .left_half{
	overflow:hidden;
}
#nav.animated .right_half{
	overflow:hidden;
}

#nav .shadow{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
	display:none;
}
#nav.animated .shadow{
	display:block;
}
#nav .left_half .shadow{
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65)));
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
	background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
	background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
}
#nav .right_half .shadow{
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0)));
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to right,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
}

/********************** MENU ******************************/
#nav .menu_header{
	height:71px;
	line-height:70px;
	font-size:40px;
	font-family: "Gotham-Bold", arial;
	color: #333;
	padding-left: 50px;
}

#nav .menu_items{
	display: block;
	margin: 30px 50px;
}
#nav .menu_items li{
	position:relative;
	display: block;
	margin-bottom: 30px;
}
#nav .menu_items li.active:before{
	background-color: #FF002E;
	width: 51px;
	height: 1px;
	content: "";
	display: block;
	position:absolute;
	left:-50px;
	top:10px;
}
#nav .menu_items li a{
	display: inline-block;
	margin-bottom: 0px;
	color: #333;
}
#nav .menu_items li.active a{
	color: #FF002E;
}

/*************************** PAGES ***********************/

/*** FILM ***/
.list_element.film{
	padding-top: 100px;
	margin-top: 0px;
}
.list_element.film .body img{
	width:100%;
}
.list_element.film .header .icon{
	top:100px;
}
.list_element.film .body a{
	display: inline-block;
	font-family: 'Gotham-Book', arial;
}
.list_element.film .body svg{
	float:left;
}
.list_element.film .body span{
	display: inline-block;
	padding: 0 5pt;
	height:40px;
	line-height:45px;
}

/*** BOOK ***/
.list_element.book .body{
	padding-bottom:0;
}
.list_element.book .body img{
	width:100%;
}
.list_element.book hr{
	margin-top:-10px;
}
.list_element.book .footer img{
	float:left;
}
.list_element.book .footer span{
	padding-left:10px;
	color: #C6C6C6;
}
.list_element.book .footer .download img{
	height:30px;
}
.list_element.book .footer .download span{
	height:30px;
	line-height:40px;
}
.list_element.book .footer .request img{
	height:20px;
}
.list_element.book .footer .request span{
	height:20px;
	line-height:20px;
}



/**** Language panel ****/
#nav .lang_panel{
	font-family: "Gotham-Light", arial;
	padding: 20px 0 0 50px;
}

#nav .lang_panel li {
	display: inline-block;
}

#nav .lang_panel li a{
	display: inline-block;
	padding: 3px 12px;
	color: #333;
}

#nav .lang_panel li.active a{
	color: #FF002E;
}

#nav .lang_panel li:first-child a{
	padding-left:0;
}
#nav .lang_panel li:not(:last-child) a{
}