/*
main.css
*/

/* Styles by element's name */



html {
	background-color:#cecece;
	height:100%;
}

body {
	margin:0px;
	min-width:1400px;
}

a:link, a:visited, a:hover, a:active {
	color:white;
	border:0;
	outline:none;
	text-decoration:none;
}

nav {
  transition: all 1s;
  -moz-transition: all 1s; /* Firefox 4 */
  -webkit-transition: all 1s; /* Safari and Chrome */
  -o-transition: all 1s; /* Opera */
  
  box-shadow: 0px 5px 20px #000000;
}

/* PRELOADER */

#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
#loader-circle{
	display: block;
	position: relative;
	width: 350px;
	height: 350px;
	border-radius: 50%;
	border: 5px solid transparent;
	border-top-color: rgb(152,126,56);
	left: -5px;
	top: -5px;
	
	-webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
	animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */

	z-index: 1001;
}

#loader-text{
	padding-top: 20px;
	color: white;
	font-family: "Lobster", cursive;
	font-size: 20pt;
	text-align: center;
	width: 500px;
	margin-left: -70px;
}

#loader-text .browser {
	color: rgb(200,128,128);
	font-size: 16pt;
	padding-top: 20px;
}

#loader {
    display: block;
    position: relative;
    left: 45%;
    top: 30%;
    width: 350px;
    height: 350px;
    margin: -75px 0 0 -75px;
	background-image: url('/assets/images/logo.png');
	background-size: contain;
	border-radius: 50%;
    z-index: 1001;
}
	
    @-webkit-keyframes spin {
        0%   { 
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
    }
    @keyframes spin {
        0%   { 
            -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);  /* IE 9 */
            transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);  /* IE 9 */
            transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
        }
    }


#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #222222;
    z-index: 1000;
	
	-webkit-transform: translateX(0);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: translateX(0);  /* IE 9 */
			transform: translateX(0);  /* Firefox 16+, IE 10+, Opera */
}
 
#loader-wrapper .loader-left {
    left: 0;
}
 
#loader-wrapper .loader-right {
    right: 0;
}

/* Loaded */
.loaded #loader-wrapper .loader-section.loader-left {
	-webkit-transform: translateX(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: translateX(-100%);  /* IE 9 */
			transform: translateX(-100%);  /* Firefox 16+, IE 10+, Opera */
	-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
			transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
 
.loaded #loader-wrapper .loader-section.loader-right {
	-webkit-transform: translateX(100%);  /* Chrome, Opera 15+, Safari 3.1+ */
		-ms-transform: translateX(100%);  /* IE 9 */
			transform: translateX(100%);  /* Firefox 16+, IE 10+, Opera */
	-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);  
			transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader {
    opacity: 0;
	-webkit-transition: all 0.3s ease-out; 
			transition: all 0.3s ease-out;
}

.loaded #loader-wrapper {
    /* visibility: hidden; */
	-webkit-transform: translateY(-100%);
		-ms-transform: translateY(-100%);
			transform: translateY(-100%);
	-webkit-transition: all 0.3s 1s ease-out; 
			transition: all 0.3s 1s ease-out;
}



/* NAVIGATION */
#top-navigation {
	background-color: rgb(156,142,128);
	/* background-color: rgb(81,36,7); */
	/* background: url(/assets/images/nav-leather.jpg) top center repeat-x; */
	display:block;
	height:150px;
	left:0px;
	position:fixed;
	top:0px;
	width:100%;
	z-index:100;
}

#top-navigation-content {
	width:800px;
	margin: 20px auto;
}

.shrink {
	top:-100px;
	opacity:0.0;
}

.nav-content-elements {
	color:white;
	display:inline-block;
	font-family: "Lobster", cursive;
	font-size:24pt;
	height:60px;
	line-height:60px;
	margin-right:50px;
	vertical-align:text-top;
}

.nav-content-elements span {
	vertical-align:middle;
}


#top-navigation-region, #bottom-navigation-region {
	display: block;
	overflow: hidden;
}

#top-navigation-region-bxl,
#bottom-navigation-region-bxl {
	background-color: rgb(200,190,176);
	background: url(/assets/images/header-bxl.jpg) top right repeat-x;
    display:inline-block;
	float:left;
	height:50px;
	min-height:50px;
	width:50%;
}

#top-navigation-region-bxl p,
#bottom-navigation-region-bxl p {
	color: rgb(92,85,75);
	font-family: "Lobster", cursive;
	font-size:24pt;
	margin: 0;
	position: relative;
	right: 30px;
	text-align: right;
	top:5px;
}

#top-navigation-region-lnd,
#bottom-navigation-region-lnd {
	background-color: rgb(200,190,176);
	background: url(/assets/images/header-lnd.jpg) top left repeat-x;
	display:inline-block;
	font-size:24pt;
	height:50px;
	min-height:50px;
	width:50%;
}

#top-navigation-region-lnd p,
#bottom-navigation-region-lnd p {
	color: rgb(92,85,75);
	font-family: "Lobster", cursive;
	font-size:24pt;
	margin: 0;
	position: relative;
	left: 30px;
	top:5px;
}

/* FOOTER */

footer {
	display:block;
	height:300px;
	background-color: white;
	box-shadow: 0px -5px 20px #000000;
}

#bottom-navigation {
	background-color: rgb(156,142,128);
	display:block;
	height:100px;
	left:0px;
	position:relative;
	top:0px;
	width:100%;
}

#bottom-credits {
	width:800px;
	margin: 0px auto;
	padding-top:20px;
}

#bottom-navigation-content {
	width:800px;
	margin: 0px auto;
	padding-top:20px;
}

.subcredits {
	font-size: 9pt;
	color:#999999;
	text-align: center
}

/* CONTAINER */

.container {
	background: url(/assets/images/desktop-background.jpg) top center repeat-y;
	color:white;
	padding-bottom: 100px;
}

/* SECTIONS */

section {
	display:block;
	position:relative;
	overflow:visible;
}

.section-wrapper { position:relative; display:block;}
.section-central { text-align:center; width:100%;}

.section-left {position:relative;width:50%;}
.section-left section {float: right;}

.section-right {position:relative; width:50%; left:50%; }

.section-central .section-wrapper { width:800px; margin: 20px auto; }

/* section-accueil */

#section-accueil {
	/* background: url(/assets/images/section-01-background.jpg) center center no-repeat; */
	background-size:cover;
	height:450px;
}

#section-accueil .section-wrapper {
	margin: 0 auto;
}


	
	/* 1940 */
	#section_1940-01 { min-width:650px; min-height:493px; max-width:650px; max-height:493px; overflow:hidden; z-index:1; }
	#section_1940-02 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1940-03 { min-width:650px; min-height:500px; max-width:650px; max-height:500px; overflow:hidden; z-index: 1;}
	#section_1940-04 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1940-05 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1940-06 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden;z-index: 2;}
	#section_1940-07 { min-width:800px; min-height:1000px; max-width:800px; max-height:1000px; overflow:hidden;z-index: 1;}
	#section_1940-09 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden;z-index: 2;}
	#section_1940-11 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }

	#section_1940-01 { margin-bottom: -10px; right:100px;}
	#section_1940-02 { margin-bottom: -70px; right:100px;}
	#section_1940-03 { margin-bottom: -30px; right:50px;}
	#section_1940-04 { margin-bottom: -30px; right:75px;}
	#section_1940-05 { margin-bottom: -40px; right:100px;}
	#section_1940-06 { margin-bottom:-120px;}


	/* 1941 */
	#section_1941-01 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1941-02 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1941-03 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1941-04 { min-width:660; min-height:859px; max-width:660px; max-height:859px; overflow:hidden; z-index:0; }
	#section_1941-05 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }

	#section_1941-01 { margin-bottom: -70px; right:50px;}
	#section_1941-02 { margin-left: 50px;}
	#section_1941-03 { margin-bottom:-70px; margin-left: 100px;}
	#section_1941-04 { margin-bottom: -50px; margin-left: 50px;}
	#section_1941-05 { margin-left: 70px;}

	/* 1942 */
	#section_1942-02 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1942-03 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1942-04 { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:1; }
	#section_1942-05 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:3; }
	#section_1942-07 { overflow:hidden; z-index:2; }
	#section_1942-08 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1942-09 { width:70%; overflow:hidden; z-index:0; }

	#section_1942-02 { margin-bottom: -60px; right:50px; }
	#section_1942-03 { margin-bottom: -80px; }
	#section_1942-04 { margin-bottom: -50px; right: 150px;}
	#section_1942-06 { margin-bottom: -10px; }
	#section_1942-07 { margin-bottom: -100px; }
	#section_1942-08 { margin-bottom: -70px; }
	#section_1942-09 { margin:0 auto; }

	/* 1943 */
	#section_1943-02 { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:1; }
	#section_1943-03 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1943-04 { min-width:808px;	min-height:430px; max-width:808px; max-height:430px; overflow:hidden; z-index:2; }
	#section_1943-05 { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:1; }
	#section_1943-06 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1943-07 { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:1; }
	#section_1943-08 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1943-09 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1943-10 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	
	#section_1943-02 { margin-bottom: -60px; margin-left: 50px; }
	#section_1943-03 { margin-bottom: -40px; margin-left: -100px; }
	#section_1943-04 { margin-bottom: -100px; margin-left: -200px; }
	#section_1943-05 { margin-bottom: -200px;}
	#section_1943-06 { margin-bottom: -50px;right:100px;}
	#section_1943-07 { margin-bottom: -100px;right:200px; }
	#section_1943-08 { margin-bottom: -40px;right:100px;}
	#section_1943-09 { margin-bottom: -420px;right:70px;; }

	/* 1944 */

	#section_1944-01 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:2; }
	#section_1944-02 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1944-03 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1944-04 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:2; }
	#section_1944-04-B { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:2; }
	#section_1944-05 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1944-06-01 { min-width:433px; min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:1; }
	#section_1944-06-02 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1944-08-01 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1944-08-02 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1944-08-B { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:0; }
	#section_1944-08-03 { min-width:650px; min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1944-10 { overflow:hidden; z-index:3; }
	#section_1944-10-A1 { width:70%; overflow:hidden; z-index:1; }
	#section_1944-10-A2 { width:70%; overflow:hidden; z-index:2; }
	#section_1944-10-B { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:2; }
	#section_1944-12 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:0; }
	#section_1944-14 { min-width:650px;	min-height:433px; max-width:650px; max-height:433px; overflow:hidden; z-index:1; }
	#section_1944-15 { min-width:433px;	min-height:650px; max-width:433px; max-height:650px; overflow:hidden; z-index:0; }

	#section_1944-01 {margin-bottom: -40px;}
	#section_1944-02 {margin-bottom: -140px; margin-left: -75px}
	#section_1944-03 {margin-bottom: -50px; margin-left: -75px}
	#section_1944-04 {margin-bottom: -50px;}
	#section_1944-04-B {margin-bottom: -50px;margin-left: 100px;}
	#section_1944-05 {margin-bottom: -50px; margin-left: -75px}
	#section_1944-06-01 {margin-bottom: -450px; right:250px;}
	#section_1944-08-01 {margin-bottom: -150px;}
	#section_1944-08-A {margin-bottom: -150px;}
	#section_1944-08-02 {margin-bottom: -100px; margin-left: 50px;}
	#section_1944-08-B {margin-bottom: -250px; margin-left: 100px;}
	#section_1944-10 {margin-bottom: -150px;}
	#section_1944-10-A1 {margin: 0 auto -100px ;padding-left:70px;}
	#section_1944-10-A2 {margin: 0 auto;padding-left:120px;}
	#section_1944-10-B {margin-bottom: -100px;}

	#section_1944-12 {margin-bottom: -100px;}
	#section_1944-14 {margin-bottom: -75px;margin-left: 55px;}
	#section_1944-15 {margin-left: 205px;}


.cw1deg {
	-webkit-transform: rotate(1deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(1deg); /* IE 9 */
			transform: rotate(1deg);
 }

.cw2deg {
	-webkit-transform: rotate(2deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(2deg); /* IE 9 */
			transform: rotate(2deg);
 }

.cw3deg {
	-webkit-transform: rotate(3deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(3deg); /* IE 9 */
			transform: rotate(3deg);
 }

.cw8deg {
	-webkit-transform: rotate(8deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(8deg); /* IE 9 */
			transform: rotate(8deg);
 }

.ccw1deg {
	-webkit-transform: rotate(-1deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(-1deg); /* IE 9 */
			transform: rotate(-1deg);
 }

.ccw2deg {
	-webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(-2deg); /* IE 9 */
			transform: rotate(-2deg);
 }

.ccw3deg {
	-webkit-transform: rotate(-3deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(-3deg); /* IE 9 */
			transform: rotate(-3deg);
 }

.ccw8deg {
	-webkit-transform: rotate(-8deg); /* Chrome, Safari, Opera */
	 	-ms-transform: rotate(-8deg); /* IE 9 */
			transform: rotate(-8deg);
 }


/* BACKGROUNDS */

section.background {
	display:block;
	position:absolute;
	overflow:visible;
	z-index: 0;
}

.background-central { text-align:center; width:100%;}
.background-left { width:50%; left:0%; text-align:right; }
.background-right {	width:50%; left:50%; }


/* background_001 */

#background_001 {
 }

/* CARD */

.quote { font-family: "Lobster", cursive; font-size:20pt; }

.axis-text-card {
	position:absolute;
	max-width:500px;
	left:50px;
	top:130px;
}

.ally-text-card {
	position:absolute;
	max-width:500px;
	left:150px;
	top:130px;
}

.hphoto-card,
.vphoto-card {
	bottom:25px;
	line-height:80px;
	position:absolute;
	right:40px;
	text-align:right;
}

.hphoto-card {
	max-width:600px;
}

.vphoto-card {
	max-width:370px;
}

.hphoto-card div,
.vphoto-card div {
	display:inline-block;
	position:relative;
}

.hphoto-card .theme {
	float:left;
	font-size:20pt;
	margin-right:10px;
	max-width:510px;
}

.vphoto-card .theme {
	float:left;
	font-size:20pt;
	line-height:initial;
	margin-right:10px;
	max-width:280px;
}

.hphoto-card .mlines {
	line-height:initial;
}

.hphoto-card .pict,
.vphoto-card .pict {
	display:inline-block;
	float:left;
	font-size:20pt;
	margin-right:10px;
	position:relative;
}

.timing-mark{
	font-size: 20px;
	padding-bottom: 30px;
	padding-top: 30px;
}

.timing-mark img{
	height: 30px;
	width: 70px;
}

/* GENERIC TEMPLATE */

.center { text-align:center; }
.right { text-align:right; }
.small { cursive; font-size:12pt; }
.white { color:white; text-shadow: 0px 0px 10px #000000; }
.black { color:black; }

/* PULSE */

@-webkit-keyframes hvr-pulse {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes hvr-pulse {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.hvr-pulse {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}

.hvr-pulse:hover, .hvr-pulse:focus, .hvr-pulse:active {
  -webkit-animation-name: hvr-pulse;
  animation-name: hvr-pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

/* to Move */
.audiojs {
	margin:0 auto;

}