body {
	margin: 0;
	padding: 0;
	
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
	font-size:			10px;
	
	background-color:	#444;
}
body * {box-sizing: border-box;}

@media screen and (max-device-width: 480px){
  body{
    -webkit-text-size-adjust: none; /* fix font size changes on iphones */
  }
}

body.remove-scroll {
	overflow:		hidden;
}

p:first-of-type {
	margin-top: 0;
}

a {
	text-decoration:	none;
	color:				black;
}

h1, h2, h3, h4 {
	display: inline;
	font-size: 1em;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
	margin: 0;
	padding: 0;
    font-weight: inherit;
}

figure {
	margin: 0 !important;
}

div.main {
	position:			relative;
	overflow:			hidden;
	min-height:			99vh;
}

.font-basic{
	font-family: Arial, Helvetica, sans-serif;
}

.img100 {
	width:		100%;
}

.multiline-ellipsis {
  display: 			block; /* Fallback for non-webkit */
  display: 			-webkit-box;
  /*height: 4.5em;*/ /* Fallback for non-webkit */
  margin: 			0 auto;
  -webkit-line-clamp: 3; /* number of lines */
  -webkit-box-orient: vertical;
  overflow: 		hidden;
  text-overflow: 	ellipsis;	
}


.load-turn {
	position:		absolute;
	left:			50%;
	top:			50%;
	margin:			-51px auto auto -51px;
	width:			102px;
	height:			102px;
	background: center center no-repeat url('../res/bg-img/ring.svg');

	-webkit-animation:	spin 1s linear infinite;
    -moz-animation:		spin 1s linear infinite;
    animation:			spin 1s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }


.full-cover {
	position:	absolute;
	left:0; top:0; right:0; bottom:0;
}
.full-cover.above {
	z-index:	10;
}


.rshadow {
	z-index:	10;
}
.rshadow:before {
	content: "";
	position:	absolute;
	top:		28px; /* pad!! */
	left:		-28px; /* pad!! */
	width:		100%;
	height:		100%;
	background-repeat: repeat;
}
.rshadow.rs-right:before {
	left:		28px; /* pad!! */
}
.rshadow.rs-under:before {
	z-index:	-1;
}


.rshadow.rs-transp:before {
	opacity:	0.8;
}
.rshadow.rs-transp2:before {
	opacity:	0.5;
}

.rshadow.rs-black:before 	{ background-image:	url(../res/bg-img/t-black.jpg); }
.rshadow.rs-red:before 		{ background-image:	url(../res/bg-img/t-red.jpg); }
.rshadow.rs-orange:before 		{ background-image:	url(../res/bg-img/t-orange.jpg); }
.rshadow.rs-green:before 		{ background-image:	url(../res/bg-img/t-green.jpg); }


.pad-title-rect {
	padding:	0.25em 0.5em;
}
.pad-title-rect2 {
	padding:	0.5em 0.85em;
}
.pad-title-rect3 {
	padding:	0.75em 1.25em;
}


.edge-img {
	position: absolute;
	left:0; right:0;top:0;bottom:0;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
.edge-img.above {
	background-position: center top;
}
.edge-img.below {
	background-position: center bottom;
}


.media-detect { /* used to detect changed media query (size range) */
	position:		fixed;
	height:			0;
	visibility: 	hidden;
}


.masonry-recalc-trigger {
	padding-left: 1px;
}

@media (min-width: 1002px) { /* mdesk */
	.only-not-desktop 	{ display:	 none !important; }
	.only-tablet 		{ display:	 none !important; }
	.media-detect { width: 3px; }
}
@media (max-width: 1001px) { /* mtab */
	.only-desktop { display: none !important; }
	.media-detect { width: 2px; }
}
@media (max-width: 1001px) and (min-width: 640px) { /* mtab-only */
}
@media (min-width: 640px)/*, (max-height: 479px)*/ { /* mtel-not */
	.only-mobile { display: none !important; }
}
@media (max-width: 639px)/*, (max-height: 479px)*/ { /* mtel */
	.media-detect { width: 1px; }
	.only-tablet 		{ display:	 none !important; }
	.only-not-mobile	{ display:	 none !important; }
}


/* Popups */

/* lightboxes */

#ajax-lightbox, #alert {
	display: 		block;
	position: 		absolute;
	z-index:		10;
	left: 0; top: 0; right: 0; bottom: 0; margin: 0;
}

body > #ajax-lightbox, /* fullscreen */
#alert 
{
	position: 		fixed;
	z-index:		100000;
}

#ajax-lightbox {
	background: rgba(0, 0, 0, 0.08);	
}
#ajax-lb-turn, #ajax-lb-text {
	position:		absolute;
	left:			50%;
	top:			50%;
}
#ajax-lb-turn  {
	margin:			-51px auto auto -51px;
	width:			102px;
	height:			102px;
	background: center center no-repeat url('../res/bg-img/ring.svg');

	-webkit-animation:	spin 1s linear infinite;
    -moz-animation:		spin 1s linear infinite;
    animation:			spin 1s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

#ajax-lb-text {
	margin:			-0.5em auto auto -50px;
	width:			100px;
	height:			1em;
	font-size:		8px;
	color:			#777;
	text-shadow:	0 0 4px white;
	text-align:		center;
	
}

#alert {
	background: rgba(255, 255, 255, 0.64) center center no-repeat;
	color:			black;
	text-shadow:	0 0 2px white;
	font-size:		14px;
}
#alert.error {
	background: rgba(255, 220, 220, 0.2) center center no-repeat;
	color:			#800;
}
#alert > div  {
	display: 		block;
	position:		absolute;
	max-width:		440px;
	text-align:		center;
	
	padding: 		8px;
	background-color: white;
	border-radius:	10px;
	border:			7px solid #DDD;
	box-shadow:		2px 2px 4px 0 rgba(0, 0, 0, 0.1);	
	
	left: 			50%; 
	top: 			50%;
	-webkit-transform: 	translate(-50%, -50%);
	-ms-transform: 		translate(-50%, -50%);
	transform: 			translate(-50%, -50%);
}
#alert > div:hover {
	cursor:			pointer;
	color:			#444;
}

#alert .close {
	position:		absolute;
	
	width:			24px; /*32px; *//* !media */
	height:			24px;
	margin-right:	-14px; /* 20 */
	margin-top:		-14px;
	right:			0;
	top:			0;
	box-sizing:		border-box;
	
	border-radius:	50%;
	border:			4px solid #DDD;
	/*box-shadow:		1px 1px 2px 0 rgba(0, 0, 0, 0.25);*/
	background:		center center no-repeat url(../res/bg-img/small-cross.png);
	background-color: rgba(255, 255, 255, 0.5);
	background-size: contain;
	
	opacity:		1;
}
#alert .close:hover {
	cursor:			pointer;
	box-shadow:		1px 1px 2px 0 rgba(0, 0, 0, 0.25) inset;
}

#alert-content {
	max-height:		640px;
	overflow-y:		auto;
}

#alert span.instructions {
	color:			#777;
	display:		block;
	max-width:		256px;
	margin:			auto;
	margin-top:		8px;
	font-size: 		90%;
}

#alert .msgbox-confirm {
	padding: 		4px 4px;
	max-width:		256px;
}
#alert .msgbox-buttons {
	margin-top:		1.25em;
	text-align:		center;
}
#alert .msgbox-btn {
	display:		inline-block;
	min-width:		32px;
	margin-left:	1em;
	margin-right:	1em;
	padding: 		4px 8px;
	border:			1px solid rgba(0, 0, 0, 0.1);
	border-radius:	4px;
	background-color:	#F8F8F8;
	cursor:			pointer;
	
	-webkit-transition: all 0.5s ease;
	transition: 		all 0.5s ease;
}
#alert .msgbox-btn:hover {
	/*background-color: rgba(200, 255, 220, 0.5);*/
	background-color: #DDD;
}
#alert .msgbox-btn.cancel:hover {
	/*background-color: rgba(255, 220, 200, 0.5);*/
}

#alert .confirm-dont-ask-again {
	margin-top:			8px;
	font-size:			80%;
}
#alert .confirm-dont-ask-again input {
	margin-right: 		4px;
}

#alert-tmp-message {
	position:			fixed;
	top:				auto;
	left:				0;
	right:				0;
	bottom:				0;
	z-index:			100000;
	text-align:			center;
	margin: 			4px 0;
	padding:			8px 16px;
	background-color:	rgba(0, 0, 0, 0.25);
	color:				black;
	font-size:			11px;
}

#alert-tmp-message.error {
	color:				red;
}

#alert-tmp-message.white {
	color:				white;
	background-color:	#00ace1;
}


/* Top title (all pages except home) */

.site-title {
	cursor:		pointer;
}
.site-title:hover {
	opacity:	0.64;
}

#title-line {
	position:	absolute;
	top:		0;	left:		0;	width:		100%;
	padding-top: 1.6em;
	padding-top: 1.4em;
	z-index:	50;
}
#title-line > .sub {
	position:	relative;
	margin:		auto;	
}

#title-line .site-title,
#title-line .page-title {
	position:	relative;
	max-width:	50%;
}
#title-line .site-title {
	float:		left;
	/*font-size: 110%;*/
}
#title-line .page-title {
	float:		right;
	/*font-size: 110%;*/
}

#title-line .btn-main-menu {
	/*clear:		both;
	float:		left;
	position: 	relative;
	margin-top:	0.5em;*/
	position:	absolute;
	left:		0;
	top:		77px;
	
	background: center center no-repeat url(../res/bg/menu/circle.png);
	
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
}
body.museum #title-line .btn-main-menu,
body.legal #title-line .btn-main-menu,
body.universe #title-line .btn-main-menu
{
	background: center center no-repeat url(../res/bg/menu/circle-b.png);
	color:		white;
}

#title-line .btn-main-menu:hover {
	opacity:	0.9;
}
#title-line .btn-main-menu.hide {
	opacity:	0.5;
}

#title-line .btn-main-menu > .sub {
	position:	relative;
	font-size:  82px;
	width:		1em;
	height:		1em;
}

#title-line .btn-main-menu .title {
	position:	absolute;
	left:		7px;
	top:		50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	margin-top:	-2px;
	font-size:	14px;
}

@media (max-width: 1001px) { /* mtab */
}
@media (max-width: 639px)/*, (max-height: 479px)*/ { /* mtel */

	#title-line {
		padding-top: 0.4em;
	}
	
	#title-line .page-title {
		position:	relative;
		max-width:	100%;
		float:		left;
	}
	
	#mobile-title {
		position:	relative;
		background-color:	white;
		line-height:		100px;
		z-index:			150;
		overflow: 			hidden;
	}
	
	#mobile-title > .sub {
		position:			relative;
		vertical-align:		middle;
	}
	
	#mobile-title .el {
		display:		inline-block;
		vertical-align:	middle;
		/*float:			left;*/
	}
	#mobile-title #mobile-btn-menu {
		/*float:	right;*/
		position:		absolute;
		right:			0;
		top:			50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);

		font-size:		30px;
		/*font-size:		41px;*/
		width:			1em;
		height:			1em;
		background:	right center no-repeat url(../res/bg/menu/mobile-btn.png);
	}
}


/* Main menu (initially invisible except on the home page or mobile mode) */

#main-menu {
	position: 	absolute;
	top:		0;
	left:		0;
	
	width:		712px; /* = image size */
	height:		731px;
	
	z-index:	150;
	background: left top no-repeat url(../res/bg/menu/menu-d.png);
	
	/*-webkit-transition:	margin-left 0.5s ease;
	transition:	margin-left 0.5s ease;*/
}
#main-menu.retracted {
	margin-left:	-712px;
}
#main-menu.animated {
	-webkit-transition:	margin 0.5s ease;
	transition:	margin 0.5s ease;	
}

#main-menu > .sub {
	position:	relative;
    margin-top: 56px;
    margin-left: 48px;
	max-width:		42%;
	overflow:		hidden;
}

#main-menu .links {
	position:		relative;
}

#main-menu .links .menu-link {
	position:		relative;
	display:		block;
	
	margin-bottom:		0.32em;
	text-transform:		lowercase;
	text-decoration:	none;
}
#main-menu .links .menu-link.home {
	font-size:			110%;
	font-size:			41px;
	margin-bottom:		1.5em;
}
#main-menu .links .menu-link:not(.home) {
	font-size:		93%;
}

#main-menu .links a.menu-link:hover {
}
#main-menu a:hover {
	opacity:	0.64;
}

#main-menu .bottom {
	margin-top:		56px;
	text-transform:	lowercase;
}

#main-menu .bottom .lang-switch {
	font-size:		18px;
}

#main-menu .bottom .social {
	position:	relative;
	overflow:	hidden;
	margin-top: 10px;
	margin-bottom: 10px;
	
}
#main-menu .bottom .social > a {
	position:	relative;
	display:	block;
	float:		left;
	width:		1em;
	height:		1em;
	margin-right: 0.4em;
	font-size:	30px;
	background-position: center center;
	background-repeat:	no-repeat;
	background-size:	98%; /* to avoid cut circles*/
}
.social .s-fb {
	background-image: url(../res/bg/menu/f-b.png);
}
.social .s-tw {
	background-image: url(../res/bg/menu/t-b.png);
}
/*#main-menu .bottom */.social .s-ig {
	background-image: url(../res/bg/menu/i-b.png);
}

#main-menu .bottom .legal {
	clear:		both;
	position:	relative;
    font-size: 11px;
    font-weight: 600;
	margin-top:	17px;
}


@media (min-width: 1002px) { /* mdesk */
	#main-menu {
		padding-left:	0;
		padding-right:	0;
	}
	#main-menu .bottom {
		padding:		0;
	}
}


@media (min-width: 1002px) and (min-height: 600px) { /* mtab (only tablet) */ /* mtel-not */
	#main-menu { position: fixed; }
}
@media (min-width: 1002px) and (min-height: 552px) and (max-height:599px) { /* mtab (only tablet) */ /* mtel-not */
	#main-menu { position: fixed; top: -19px; /* 44 */ }
	#main-menu .links .menu-link.home { margin-bottom: 1em; }
	#main-menu .bottom { margin-top: 36px;}
	#title-line { padding-top: 0.8em; }
}
@media (min-width: 1002px) and (max-height:551px) { /* rgpd2 fix */
	#main-menu { position: fixed; top: -19px; /* 44 */ }
	#main-menu .links .menu-link.home { margin-bottom: 0.44em; }
	#main-menu .bottom { margin-top: 16px; }
	#title-line { padding-top: 0.8em; }
	#main-menu .links .menu-link:not(.home) {
		margin-bottom: 4px;
	}
}
@media (max-width: 1001px) and (min-width: 640px) { /* mtab (only tablet) */ /* mtel-not */

	#main-menu {
		position: fixed;
		width:		693px; /* = image size */
		height:		478px;
		background: left top no-repeat url(../res/bg/menu/menu-t.png);
	}
	#main-menu.retracted {
		margin-left:	0;
		margin-top:	-478px;
	}

	#main-menu > .sub {
		position:	relative;
		margin-top: 30px;
		margin-left: 0;
		max-width:		110%;
		overflow:		hidden;
	}

	#main-menu .links {
		position:		relative;
	}

	#main-menu .links .menu-link {
		float: left;
		margin-bottom:		0;
		margin-right:		16px;
	}
	#main-menu .links .menu-link.home {
		font-size:			110%;
		margin-bottom:		17px;
	}
	#main-menu .links .menu-link:nth-of-type(2){
		clear: both;
	}
	#main-menu .links .menu-link:not(.home) {
		font-size:		74%;
		letter-spacing:	-1.5px;
	}


	#main-menu .bottom {
		display:		none;
	}

	
	#main-bottom-menu {
		position:		fixed;
		left:			0; right:	0;
		bottom:			0;
		min-height:		40px;
		z-index:		150;
		background-color: black;
		padding-top:	16px;
		padding-bottom:	16px;
		overflow:		hidden;
		color:			white;
		
		-webkit-transition: margin 0.5s ease;
		transition: margin 0.5s ease;
	}
	body.home #main-bottom-menu {
		height:		177px;
	}

	#main-bottom-menu.retracted {
		margin-bottom:	-80px;
		margin-bottom:	-100px; /*RGPD2*/
	}
	
	#main-bottom-menu a {
		color:			white;
	}
	
	#main-bottom-menu .bottom {
		position:		relative;
		text-transform:	lowercase;
	}
	
	#main-bottom-menu .bottom .col {
		position:		relative;
		float:			left;
		width:			50%;	
	}
	#main-bottom-menu .bottom .col.group2 { /*RGPD2*/
		margin-top: -8px;
		line-height: 12px;
	}
		
	#main-bottom-menu .bottom .lang-switch {
		position:		relative;
		float:			left;
		font-size:		18px;
		padding-top:	0;
		margin-right:	25px;
	}

	#main-bottom-menu .bottom .social {
		position:	relative;
		float:		left;
		overflow:	hidden;
		padding-top:	0;		
	}
	#main-bottom-menu .bottom .social > a {
		position:	relative;
		display:	block;
		float:		left;
		width:		1em;
		height:		1em;
		margin-right: 0.4em;
		font-size:	30px;
		background: center center no-repeat;
		/*background-size:	cover;*/
	}
	#main-bottom-menu .bottom .social .s-fb {
		background-image: url(../res/bg/menu/f-w-o.png);
	}
	#main-bottom-menu .bottom .social .s-tw {
		background-image: url(../res/bg/menu/t-w-o.png);
	}
	#main-bottom-menu .bottom .social .s-ig {
		background-image: url(../res/bg/menu/i-w-o.png);
	}

	#main-bottom-menu .bottom .legal {
		position:	relative;
		clear:		both;
		float:		right;
		font-size: 11px;
		font-weight: 600;
		margin-top:	7px;
	}

	#main-bottom-menu .bottom .legal > div {
		float:		left;
	}
	#main-bottom-menu .bottom .legal .notice {
		margin-right:	22px;
	}
	
}

	
@media (max-width: 639px)/*, (max-height: 479px)*/ { /* mtel */

	#main-menu {
		clear:		both;
		position: 	relative;
		z-index:	140;
		background: none;
		background-color:	white;
		overflow:		hidden;
		width:			100%;
		height:			auto;
		max-height:		800px;
		padding-bottom: 28px;
		box-shadow:		0 0 7px 0 rgba(0, 0, 0, 0.5);
	}
	#main-menu.retracted {
		max-height:		0;
		padding-bottom: 0;
	}
	#main-menu.animated {
		-webkit-transition:	max-height 0.5s ease;
		transition:			max-height 0.5s ease;	
	}

	#main-menu > .sub {
		position:		relative;
		margin:			0;
		margin-top:		10px;
		max-width:		100%;
		overflow:		hidden;
	}

	#main-menu .links .menu-link {
		margin-bottom:		0.48em;
	}
	#main-menu .links .menu-link.home {
		display:			none;
	}
	#main-menu .links .menu-link:not(.home) {
		font-size:		80%;
	}

	#main-menu .bottom {
		padding:		0;
		margin-top:		34px;
	}

	#main-menu .bottom .lang-switch {
		font-size:		18px;
	}

	#main-menu .bottom .social {
		margin-top: 16px;
		margin-bottom: 16px;
		
	}
	#main-menu .bottom .social > a {
		font-size:	30px;
	}

	#main-menu .bottom .legal {
		clear:		both;
		position:	relative;
		font-size: 11px;
		font-weight: 600;
		margin-top:	17px;
	}


}