/* Déclaration des polices d écritures et balises */
h1,h2,h3,h4,h5,h6 {
	display:inline;
	margin:2% 0;
}

html,body {
	margin:0;
	padding:0;
	background:#fff;
	height:100%;
	background-color:#990D0D;
	background-image:url(../images/pattern.jpg);
	background-size:50px 50px;
	font-family:'Gloria Hallelujah',cursive;
}

/* Corps du site */
#wrap {
	height:auto;
	width:1000px;
	left:calc(50% - 500px);
	position:relative;
	background-color:rgba(230,230,230,0.81);
	padding-bottom:10px;
}

#main {
	box-shadow:0 0 22px 11px #000;
}

#header {
	height:150px;
	width:1000px;
	background-image:url(../images/header.jpg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	position:relative;
	background-color:aqua;
}

#footer {
	height:200px;
	width:1000px;
	background-color:rgba(230,230,230,0.81);
	background-image:url(../images/footer.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:1000px 200px;
	position:relative;
	margin-top:10px;
	margin-bottom:10px;
	left:calc(50% - 500px);
}

/* Barre de menu */
#menu {
	background-color:#fff;
	width:1000px;
	height:60px;
	position:relative;
}

#menu ul {
	margin:0;
	padding:0;
	list-style:none;
	overflow:hidden;
}

#menu ul li {
	width:200px;
	float:left;
	list-style:none;
	text-align:center;
	background-color:#E54848;
	height:60px;
	line-height:60px;
	font-family:'Gloria Hallelujah',cursive;
	font-size:150%;
	color:#fff;
}

#menu li:hover {
	background-color:#CC3E3E!important;
	box-shadow:inset 0 0 4px 2px rgba(0,0,0,0.6)!important;
}

/* Bouton home */
#hmIcon {
	width:150px;
	height:150px;
	position:absolute;
	right:0;
	background-image:url(../images/Accueil.png);
	background-position:center center;
	background-size:100px 100px;
	background-repeat:no-repeat;
}

/* Barre de tags  */
#tagsBar {
	width:1000px;
	min-height:30px;
	height:auto;
	margin-top:10px;
	background-color:rgba(255,99,99,0.6);
	position:relative;
	line-height:30px;
	padding:0;
}

.tagContainer {
	width:200px;
	height:30px;
	position:relative;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
}

.tagDeco {
	height:30px;
	width:190px;
	padding:0 5px;
	background-color:rgba(38,37,38,0.36);
	position:relative;
	z-index:5;
	display:none;
}

.delTag {
	height:30px;
	width:190px;
	padding:0 5px;
	top:0;
	text-align:right;
	position:absolute;
	opacity:1;
	z-index:4;
	font-family:"Myr";
	font-variant:small-caps;
	opacity:1;
	display:none;
}

/* Nuage de tags */
.cloudsWord {
	width:980px;
	display:none;
	height:0;
	left:calc(50% - 500px);
	position:relative;
	background-color:rgba(255,255,255,0.4);
	box-shadow:inset 0 0 11px 5px rgba(0,0,0,0.6);
	padding:10px;
}

.tags ul {
	height:calc(100% - 40px);
	width:calc(100% - 40px);
	margin:0;
	padding:10px;
	text-align:center;
	position:absolute;
	display:none;
}

.tags li {
	margin:0;
	padding:2px;
	top:10%;
	left:10%;
	list-style:none;
	display:block;
	position:absolute;
}

.tags li a {
	text-decoration:none;
	color:#000;
	padding:0 2px;
	background-color:rgba(255,55,55,0.45);
	border-radius:50px;
}

.tags li a:hover {
	font-size:2em;
	color:#fff;
	background-color:rgba(255,0,0,1);
}

.tag1 {
	font-size:100%;
}

.tag2 {
	font-size:120%;
}

.tag3 {
	font-size:140%;
}

.tag4 {
	font-size:160%;
}

.tag5 {
	font-size:180%;
}

/* Conteneur des bloc img */
.Img-Content {
	width:940px;
	height:930px;
	left:calc(50% - 470px);
	position:relative;
	overflow:hidden;
	margin-bottom:10px;
}

/* Bloc d image et sous blocs */
.img {
	width:300px;
	height:300px;
	background-color:#757575;
	position:relative;
	display:inline-table;
	margin-left:10px;
	margin-top:10px;
	opacity:.8;
}

.img:hover {
	opacity:1;
}

.info {
	background-color:#fff;
	width:300px;
	height:30px;
	top:270px;
	position:relative;
	opacity:.7;
}

.hiddenInfo {
	display:none;
}

/* fullScreen des images */
.imgVisu {
	height:100%;
	width:100%;
	position:absolute;
	background:rgba(0,0,0,0.63);
	display:none;
	z-index:20;
	overflow:hidden;
}

.imgDisp {
	width:80%;
	height:90%;
	left:18%;
	top:5%;
	background-size:contain;
	background-position:center center;
	background-repeat:no-repeat;
	position:absolute;
	z-index:21;
}

.imgDesc {
	width:18%;
	height:auto;
	left:1%;
	top:25%;
	background-color:rgba(255,255,255,0.68);
	color:#000;
	z-index:21;
	position:absolute;
	padding:1%;
	line-height:90%;
}

/* Bouton pour afficher la suite des images */
#previousNext {
	height:50px;
	width:1000px;
	position:left;
	position:relative;
	margin-left:2%;
}

.buttonPN {
	width:40%;
	height:50px;
	position:relative;
	display:inline-block;
	line-height:50px;
	text-align:center;
	margin:0 4%;
}

.buttonPN:hover {
	background-color:rgba(230,230,230,0.81);
}