/* ----- Styles PROXIMA  A - X - P - Ω ----- */
	h1 {
		color: orange;
		}
	h2 {
		color: orange;
		margin-left: 30px;
		}
	img {
		border: 1px solid silver;
		}
	#top_ribbon {
		width: 1024px;
		height: 65px;
		padding-bottom: 10px;
		background-color: #F9EEDF;
		}
	#logo_retour {
		position: absolute;
		top: 12px;
		left: 30px;
		width: 50px;
		padding-left: 30px;
		padding-top: 13px;
		padding-right: 30px;
		padding-bottom: 12px;
		opacity: 0.3;
		border: none;
		}
	#nom_cahier {
		position: absolute;
		top: 0;
		left: 160px;
		font-size: 2.5em;
		color: #DE3163;
		}
	#nom_cahier:hover {
		cursor: default;
		}
	#rocky {
		position: absolute;
		top: 10px;
		left: 520px;
		width: 400px;
		}
	#menu_cahier_logo {
		position: absolute;
		top: 10px;
		left: 926px;
		padding-left: 30px;
		padding-top: 4px;
		padding-right: 24px;
		padding-bottom: 4px;
		font-size: 3.2em;
		color: #DE3163;
		}
	#menu_cahier_logo:hover {
		cursor: pointer;
		}
	#menu_cahier {
		width: 824px;
		margin-top: 0;
		padding-left: 200px;
		padding-top: 28px;
		padding-bottom: 20px;
		font-size: 1.8em;
		border-top: 2px solid #FFE4E1;
		color: orange;
		}
	li {
		margin-bottom: 4px;
		list-style-type: square;
		}
	li a {
		display: inline-block;
		min-width: 600px;
		color: #F0C300;
		text-decoration: none;
		/*text-transform: uppercase;*/
		}
	li a:hover {
		color: red;
		}
	a {
		text-decoration: none;
		color: red;
		}
/* ----------------- circle panel ----------------- */
	.square {
		float: left;
		margin-left: 5px;
		padding-left: 20px;
		padding-top: 10px;
		padding-right: 20px;
		padding-bottom: 10px;
		opacity: 0.8;
		}
	.circle {
		width: 50px;
		height: 50px;
		border: 1px solid silver;
		border-radius: 33px;
		}
	.circle p {
		font-size: 2.2em;
		font-family: "Times New Roman", Times, serif;
		text-align: center;
		margin-top: 0;
		color: white;
		}
	.square:hover {
		cursor: pointer;
		opacity: 1;
		}
/* ----------------- odyssey panel ----------------- */
	p {
		font-size: 1.2em;
		}
	#odyssey {
		position: relative;
		width: 1024px;
		font-family: "Century Gothic",sans-serif;
		font-size: 1em;
		text-align: center;
		border-top: 2px solid #FFE4E1;
		background-color: whitesmoke;
		}
	#title_A, #title_B, #title_C, #title_D {
		padding-top: 20px;
		padding-left: 110px;
		text-align: left;
		}
	#divA, #divB, #divC, #divD {
		position: relative;
		}
	#token_A, #token_B, #token_C, #token_D {
		position: absolute;
		top: -80px;
		left: 0;
		width: 100px;
		height: 80px;
		opacity: 0.8;
		}
	#token_A:hover, #token_B:hover, #token_C:hover, #token_D:hover {
		cursor: pointer;
		opacity: 1;
		}
	#c_blue, #c_coral, #c_orange, #c_red {
		position: absolute;
		top: 10px;
		left: 20px;
		width: 50px;
		height: 50px;
		border: 1px solid silver;
		border-radius: 33px;
		}
	#c_blue p, #c_coral p, #c_orange p, #c_red p {
		font-size: 2.2em;
		font-family: "Times New Roman", Times, serif;
		text-align: center;
		margin-top: 0;
		color: white;
		}
	#left_A, #left_B, #left_C, #left_D {
		position: absolute;
		top: 125px;
		left: 18px;
		}
	#right_A, #right_B, #right_C, #right_D {
		position: absolute;
		top: 125px;
		left: 915px;
		}
	.boomerang {
		width: 60px;
		padding: 15px;
		border: none;
		opacity: 0.4;
		}
	.boomerang:hover {
		cursor: pointer;
		opacity: 1;
		}
	#top_A {
		position: absolute;
		top: -78px;
		left: 832px;
		padding-left: 20px;
		padding-top: 8px;
		padding-right: 20px;
		padding-bottom: 8px;
		font-size: 2.8em;
		color: #DE3163;
		border: none;
		}
	#top_A:hover {
		background-color: white;
		}
	#bottom_A, #top_B, #top_C, #top_D {
		position: absolute;
		top: -75px;
		left: 920px;
		width: 70px;
		padding: 5px 15px;
		border: none;
		opacity: 0.4;
		}
	#bottom_A:hover, #top_B:hover, #top_C:hover, #top_D:hover {
		cursor: pointer;
		opacity: 1;
		}
/* ----------------- responsive design ----------------- */
	@media(orientation:portrait){
		#parthenon {
			padding-bottom: 20px;
		}
		#logo_retour {
			position: absolute;
			top: 8px;
			left: 30px;
			width: 50px;
			padding-left: 30px;
			padding-top: 18px;
			padding-right: 30px;
			padding-bottom: 15px;
		}
		#nom_cahier {
			position: absolute;
			top: 4px;
			left: 170px;
		}
		#menu_cahier_logo {
			position: absolute;
			top: 6px;
			left: 920px;
			font-size: 3.4em;
		}
		#menu_cahier {
			font-size: 2.2em;
		}
		li {
			margin-bottom: 5px;
		}
		p {
			font-size: 1.2em;
		}
		#odyssey {
			font-size: 1.2em;
		}
		#rocky {
			position: absolute;
			top: 14px;
			left: 520px;
		}
		#token_A, #token_B, #token_C, #token_D {
			position: absolute;
			top: -90px;
			left: 10px;
		}
		#top_A {
			position: absolute;
			top: -95px;
			left: 822px;
			padding-left: 20px;
			padding-top: 8px;
			padding-right: 20px;
			padding-bottom: 8px;
			font-size: 2.8em;
		}
		#bottom_A, #top_B, #top_C, #top_D {
			position: absolute;
			top: -85px;
			left: 925px;
			width: 80px;
			padding: 5px;
		}
	}
/* ------------------------- Autres ------------------------- */
	.verein {
		width: 860px;
		text-align: left;
		padding-left: 80px;
		}
	.verein a:hover {
		background-color: white;
		}
	#ta, #tb, #tc, #td {
		display: none;
		}
	#la, #lb, #lc, #ld {
		display: none;
		}
	#xa, #xb, #xc, #xd {
		display: block;
		}
	#ra, #rb, #rc, #rd {
		display: none;
		}
	hr {
		border: 3px dotted silver;
		}
/* ----------------- Constellations ----------------- */
	#perseus {
		width: 60px;
		margin-top: 10px;
		padding: 20px;
		border-radius: 180px;
		border: none;
		opacity: 0.3;
		}
	#perseus:hover {
		cursor: pointer;
		opacity: 1;
		}
	#divZ {
		position: relative;
		height: 60px;
		}
	#zodiac {
		position: absolute;
		top: -15px;
		left: 80px;
		width: 850px;
		font-size: 1.5em;
		}
	#uclip_z {
		position: relative;
		text-align: center;
		display: none;
		}
	#img_01 {
		position: absolute;
		top: 25px;
		left: 22px;
		width: 228px;
		height: 172px;
		}
	#img_02 {
		position: absolute;
		top: 25px;
		left: 272px;
		width: 228px;
		height: 172px;
		}
	#img_03 {
		position: absolute;
		top: 25px;
		left: 522px;
		width: 228px;
		height: 172px;
		}
	#img_04 {
		position: absolute;
		top: 25px;
		left: 772px;
		width: 228px;
		height: 172px;
		}
	#img_05 {
		position: absolute;
		top: 219px;
		left: 22px;
		width: 228px;
		height: 172px;
		}
	#img_06 {
		position: absolute;
		top: 219px;
		left: 272px;
		width: 228px;
		height: 172px;
		}
	#img_07 {
		position: absolute;
		top: 219px;
		left: 522px;
		width: 228px;
		height: 172px;
		}
	#img_08 {
		position: absolute;
		top: 219px;
		left: 772px;
		width: 228px;
		height: 172px;
		}
	#img_09 {
		position: absolute;
		top: 413px;
		left: 22px;
		width: 228px;
		height: 172px;
		}
	#img_10 {
		position: absolute;
		top: 413px;
		left: 272px;
		width: 228px;
		height: 172px;
		}
	#img_11 {
		position: absolute;
		top: 413px;
		left: 522px;
		width: 228px;
		height: 172px;
		}
	#img_12 {
		position: absolute;
		top: 413px;
		left: 772px;
		width: 228px;
		height: 172px;
		}
/* ----------------- Panneau sud ----------------- */
	.centrimage {
		display: block;
		margin-left: auto;
		margin-right: auto;
		}
	#milky_way {
		position: relative;
		width: 1024px;
		height: 192px;
		border-top: 2px solid #FFE4E1;
		background-color: white;
		}
	#m1, #m2 {
		float: left;
		width: 512px;
		opacity: 0.1;
		border: none;
		}
	#soto {
		position: absolute;
		bottom: 20px;
		left: 40px;
		padding: 30px;
		}
	#G_link {
		width: 55px;
		height: 55px;
		border: 1px solid silver;
		background-color: purple;
		opacity: 0.6;
		border-radius: 33px
		}
	#G_link p {
		font-size: 2.4em;
		font-family: "Times New Roman", Times, serif;
		text-align: center;
		margin-top: 4px;
		color: white;
		}
	#gryffon {
		position: absolute;
		bottom: 20px;
		left: 436px;
		width: 150px;
		border-radius: 100px;
		}
	#gryffon:hover {
		cursor: pointer;
		}
	#rocket {
		position: absolute;
		bottom: 20px;
		right: 40px;
		width: 60px;
		padding: 30px;
		border: none;
		}
	.whitehall_grey {
		padding: 20px;
		color: grey;
		background-color: white;
		border-radius: 24px 0 24px 0;
		border: 1px solid lightyellow;
		}
/* ----------------- responsive design ----------------- */
	@media(orientation:landscape){
		.play_icone {
			margin-left: 16px;
			padding: 6px 8px 8px 32px;
			text-decoration: none;
			float: left;
		}
		.surligne {
			color: #B22222; /* rouge tuile */
		}
	}
	@media(orientation:portrait){
		.play_icone {
			margin-left: 16px;
			padding: 10px 8px 8px 32px;
			text-decoration: none;
			float: left;
		}
		.surligne {
			color: #F0C300;
			font-weight: bold;
		}
	}
/* ---------------------- commun ----------------------- */
	.lien_contenu {
		margin-left: 20px;
		padding: 8px 8px 8px 32px;
		text-decoration: none;
		font-size: 1.1em;
		color: grey;
		float: left;
		}
	.lien_contenu:hover {
		color: dodgerblue;
		}
	.lien_video {
		padding: 8px 8px 8px 0;
		text-decoration: none;
		font-size: 1.1em;
		color: grey;
		display: block;
		float: left;
		}
	.lien_video:hover {
		color: dodgerblue;
		}
/* ------------------- collection ------------------- */
	.bord_zoom {
		margin: 10px;
		border: 12px solid white;
		box-shadow: 4px 4px 10px rgba(0,0,0,0.5);
		-webkit-transition: box-shadow 0.1s ease;
		-moz-transition: box-shadow 0.1s ease;
		transition: box-shadow 0.1s ease;
		}