/*@keyframes anim-h2 {
	0% {transform: rotate(0deg);}
	50% {transform: rotate(10deg);}
	100% {transform: rotate(-10deg);}
	100% {transform: rotate(0deg);}
}

@keyframes anim-rotate3d {
	0% {transform: rotate3d(0, 0, 0, 45deg);}
	20% {transform: rotate3d(-1, -1, 0, 45deg);}
	40% {transform: rotate3d(1, -1, 0, 45deg);}
	60% {transform: rotate3d(1, 1, 0, 45deg);}
	80% {transform: rotate3d(-1, 1, 0, 45deg);}
	100% {transform: rotate3d(0, 0, 0, 45deg);}
}*/

@font-face {
	font-family: CenturyGothicFace;
	src: url("CenturyGothicFont/GOTHIC.TTF");
}

@font-face {
	font-family: CenturyGothicFace;
	src: url("CenturyGothicFont/GOTHICB.TTF");
	font-weight: bold;
}

@font-face {
	font-family: CenturyGothicFace;
	src: url("CenturyGothicFont/GOTHICI.TTF");
	font-style: italic;
}

@font-face {
	font-family: CenturyGothicFace;
	src: url("CenturyGothicFont/GOTHICBI.TTF");
	font-weight: bold;
	font-style: italic;
}

@keyframes anim-body-accueil {
	from {background-position: 0% 0%, 100% 0%}
	/*from {background-position: 0% 0%, 100% 0%, 0% 0%}*/
	to {background-position: 0% 512px, 100% 512px}
	/*to {background-position: 0% 512px, 100% 512px, 256px 256px}*/
}

@keyframes anim-body-portfolio {
	from {background-position: 0% 0%, 100% 0%}
	to {background-position: 0% 256px, 100% 256px}
}

body {
	background-color: black;
	background-size: auto;
	text-align: center;
	color: white;
	font-family: CenturyGothicFace;
	margin: auto 25%;
}

body/*.accueil*/ {
	background-image: url("img/ditherescaliersalphacyanG.png"), url("img/ditherescaliersalphacyanD.png");
	/*background-image: url("img/ditherescaliersalphacyanG.png"), url("img/ditherescaliersalphacyanD.png"), url(img/ditherfondalpha.png);*/
	background-repeat: repeat-y, repeat-y;
	/*background-repeat: repeat-y, repeat-y, repeat;*/
	background-position: 0% 0%, 100% 0%;
	/*background-position: 0% 0%, 100% 0%, 0% 0%;*/
	background-attachment: fixed;
	animation-name: anim-body-accueil;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

/*body.portfolio {
	background-image: url("img/ditherfondalpha.png"), url("img/ditherfondalpha.png");
	background-repeat: repeat-y, repeat-y;
	background-position: 0% 0%, 100% 0%;
	animation-name: anim-body-portfolio;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}*/

p {
	max-width: 90%;
	margin: auto;
}

h3.galerie {
	margin: 5% auto;
}

p.galerie {
	margin: 5% auto;
}

p.retour-accueil {
	margin : 5% auto;
}

p.cv-pdf {
	margin : 5% auto;
	font-weight : bold;
}

h1 {
	color: white;
	font-size: 50px;
	margin-top: 10%;
}

h2.cv {
	text-decoration: underline;
}

li {
	list-style-position: inside;
}

a {
	color: chocolate;
}

a.bouton-navigation {
	color: inherit;
	text-decoration: inherit;
	display: block; /*Apprendre un peu mieux comment ça marche inline et block*/
	margin: 1em 40%;
	min-width: 120px;
	/*margin: auto 40%;*/
	text-align: center;
	background-color: chocolate;
	transform: scale(1.0);
	transition: transform .2s;
	border-radius: 2px;
	font-weight: bold;
	font-size: 1.5em; /*Firefox dans la console semble capable de voir les propriété CSS mise en commentaire et on peut les activer/désactiver*/
	text-align: center;
}

a.bouton-navigation:hover {
	transform: scale(1.25);
}

video {
	margin-top: 5%;
}

video.galerie {
	margin: auto auto;
}

img.poster-webdoc {
	width: 75%;
	border-radius: 6px;
	transform: scale(1.0);
	margin: 3% 0% 2% 0%;
	transition: transform .19s;
}

img.poster-webdoc:hover {
	transform: scale(1.03);
}

img.galerie {
	display: inline-block;
	margin: 2%;
	transition: transform .19s;
	border-radius: 2px;
}

img.galerie:hover {
	transform: scale(1.05);
}

/*.diviframe {
    position: relative;
    overflow: hidden;
    width: 100%;
}*/

/*iframe.diviframe {
    width:
}*/

/*div h2:hover {
	animation-name: anim-h2;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}

.h2rotate3d {
	font-size: 100px;
}

.h2rotate3d:hover {
	animation-name: anim-rotate3d;
	animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-direction: normal;
}*/