/* -----------------------------
		   FONTS
----------------------------- */

@font-face {
    font-family: CaviarDreams;
    src: url(CaviarDreams.ttf);
}

@font-face {
    font-family: CaviarDreams;
    src: url(CaviarDreams_Bold.ttf);
    font-weight: bold;
}

/* -----------------------------
		PAGE SEGMENTS
----------------------------- */

body {
	/* margin: 0; /* pour éviter les marges */
	margin: auto;
	text-align: center; /* pour corriger le bug de centrage IE */
	background-image: url("images/bg.png");
	color : white;
	font-family : CaviarDreams;
	height:100%;
}

#page {
	background: #1a232c;
	margin: 20px auto;
	max-width: 1000px;
	text-align:center;
}

#header {
	background: #24b5b8;
	background-image: url("images/banniere.png");
	/* background: #db4a47; */
	color: #fff;
	letter-spacing: 8px;
	
	text-align : left;
	margin : 0 px;
	padding : 50px 50px 50px;
}

#content {
	margin : 0 px;
	padding : 20px 70px 20px;
	text-align : left;
	z-index : 10;
}

#footer {
	letter-spacing: 6px;
}



/* -----------------------------
		   LIGHTBOX
----------------------------- */


.lightbox {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, .7);
	cursor: pointer;
	z-index : 100;
}

#LBimage {
	position: absolute;
	max-width: 95%;
	max-height: 95%;
    left: 0;
    right: 0;
	top:0;
	bottom:0;
    margin: auto;
    margin: auto;
}







/* -----------------------------
			MENU
----------------------------- */

.drop_menu {
	background:#fff;
	color: #333;
	list-style-type:none;
	z-index : 50;

	padding:0px 70px;
	margin:0;
	height:50px;
	position:relative;
}

.drop_menu a {
	color: inherit;
	text-decoration:none;
}

.drop_menu li {
	background:#fff;
	float: left;
	padding: 15px 20px 14px;
}

.drop_menu li:hover {
	position:relative;
	background:#24b5b8;
	color: #fff;
	font-weight : bold;
	padding: 15px 19px 14px; /* to compensate for bold hover */
	cursor: pointer;
}

/* Submenu */
.drop_menu ul {
	position:absolute;
	left:-9999px;
	top:-9999px;
	list-style-type:none;
}

.drop_menu li:hover ul {
	left:0px;
	top:50px;
	background-color: rgba(0, 0, 0, 0);
	padding:0;
}

.drop_menu li:hover ul li {
	background:#fff;
	color: #333;
	font-weight : normal;
	padding: 10px 0px; /* to compensate for bold hover */
	width:120px;
	margin: 0;
}

.drop_menu li:hover ul li:hover {
	background:#24b5b8;
	color: #fff;
	font-weight : bold;
	padding: 9px 0px; /* to compensate for bold hover */
}







/* -----------------------------
		GRID
----------------------------- */


.item {
	float: left;
	background: #2d3949;
	background-image: url("images/bg.png");
	margin:10px;
	border-radius: 25px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	overflow: hidden;
}

.square { width: 265px;height: 265px;}
.vert { width:  265px;height: 550px;}
.horiz { width:  550px;height: 265px;}

.masonText {
	display: none;
	position:absolute;
	top:0px;
	left:0px;
	background : rgba(0, 0, 0, 0.75);
	border-radius: 25px;
	cursor: pointer;
	text-align : center;
    box-sizing: border-box;
    padding: 20px;
}


.masonImage {
    position: absolute;
    top: -100%;
    bottom: -100%;
    left: -100%;
    right: -100%;
    margin: auto;
}

/* -----------------------------
		OTHERS
----------------------------- */

h1 {
	font-size: 28pt;
	letter-spacing: 15px;
	font-weight : normal;
	padding : 0px;
	margin : 0px;
	color: #db4a47;
}

h2 {
	font-size: 28pt;
	letter-spacing: 5px;
	line-height: 90%;
	font-weight : bold;
    margin: 5px;
}

h4 {
	font-size: 14pt;
	letter-spacing: 10px;
	font-weight : normal;
	color: #aaa;
	padding : 5px 0px 0px;
	margin : 0px;
	font-style: italic;
}

a {
	color: #1cb6b8;
    text-decoration: none;
}



.solo-image {
	max-width : 100%;
	cursor: pointer;
}

.center {
	text-align : center;
}

iframe {
	border:none;
}