/*
Theme Name:  Akerimus
Description: Akerimus theme
Author:      Akerimus
Version:     1.0
*/

body{
	background:url(img/body.jpg)	no-repeat top center black;
	background-attachment: fixed;
	padding:0;
	margin:0;
	font-family:Times;
}


/* En-tête des pages */
#header{
	margin:0 auto;
	width:1025px;
	padding-top:25px;
	height:120px;
}
#logo{
	float:left;
	background:url(img/logo.png) center center no-repeat;
	width:125px;
	height:115px;
	margin-right:15px;
	transition-duration:0.5s;
	transition-timing-function:ease-out;
}
#authorNameAndMenu{
	float:left;
}	
#authorName{
	font-size:36px;
	display:block;
	text-decoration:none;
	line-height:1;
	padding-top:10px;
	font-family:"robotothin";
}
#colorLastNameAuthor{
	color:#ff6600;
	font-weight:bold;
}
#colorFirstNameAuthor{
	color:#ff3300;
}
#menu{
	font-family:"Courier New", Courier, monospace;
	color:#666;	
	font-size:18px;
	margin-bottom:10px;
}
#menu > div{
	border-bottom:1px solid #333;	
}
#menu div a{
	color:#666;
	text-decoration:none;
} 
#menu div ul{
	list-style-type:none;
	padding:0;
	margin:10px 0 0 0;
}
#menu > div > ul > li{
	display:inline-block;
	padding:0 15px 5px;
	position:relative;
}
#menu > div > ul > li:before{
	content:" ";
	position:absolute;
	z-index:2;
	border-right:1px solid #333;
	right:0;
	height:10px;
	top:5px;
}
#menu > div > ul > li:hover{border-bottom:2px solid #666;}
.menu-container #twitch{color: purple;}
.menu-container #touti{color: lightblue;}


/* Auto scroll des images*/
#container{
	display: inline-block;
	width: 96%;
	margin: auto;
	position: absolute;
	top: 180px;
	left: 1%;
    padding: 10px;
	overflow: auto;
    background: none;
	text-align: center;
	white-space: nowrap;
    /*animation: slide infinite 6s;*/
	justify-content: center;
	align-items: center;
}
@keyframes slide {
  0% {
    margin-left: 0px;
  }
  100% {
    margin-left: -100%;
  }
}
#container:hover {
    animation-play-state: paused;
}
#container > div {
	display: inline-block;
}
#facebook {
	position: absolute;
	top: 10px;
	left: 10px;
}
.image {--background-repeat: no-repeat;--background-size: 100%;--width: 250px;--height: 350px;--margin:25px;
	box-shadow: 
	0px 0px 8px 0px rgb(255, 100, 0),
	0px 0px 8px 0px rgba(255, 100, 0),
	0px 0px 8px 0px rgba(255, 100, 0),
	0px 0px 8px 0px rgba(255, 100, 0);
	position: relative;
	float: inline-start;
	left: 10%;
}
.image:hover{cursor: pointer;--width: 450px;--height: 600px;}
	
#id_couv{background: url("img/id_couv.jpg");
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#id_couv:hover{background: url("img/id_couv2.jpg");
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#harmort_couv{background: url("img/harmort_couv.jpg");
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#harmort_couv:hover{background: url("img/harmort_couv2.jpg") no-repeat;
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#dodo_couv{background: url("img/dodo_couv.jpg") no-repeat;
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#dodo_couv:hover{background: url("img/dodo_couv2.png") no-repeat;
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#touti_couv{background: url("img/touti_couv.png") no-repeat;
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}
#touti_couv:hover{background: url("img/touti_couv2.png") no-repeat;
	background-repeat: no-repeat;background-size: var(--background-size);width: var(--width);height: var(--height);margin: var(--margin);
}


/* FOOTER */
#footer{
	margin:10px;
	padding:10px;
	text-align:center;
	color:#951;
	font-size:12px;
	position:fixed;
	left: 100px;
	bottom: 0px;
}