@charset "utf-8";
/* CSS Document */

header, nav, article, footer{ display : block ; }

@-webkit-keyframes tag{
        0% { opacity : 0 }
		50% { opacity : 0.4 }
		100% { opacity : 0 }
}

@-webkit-keyframes menuactive{
        0% {
			border: solid 1px red ;
			-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;}
		50% {
			border: solid 1px silver ;
			-webkit-box-shadow: 3px 3px 5px #888 ;}
		100% {
			border: solid 1px red ;
			-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;}
}

@-webkit-keyframes lienmenuactive{
        0% { color : red }
		50% { color : silver ; }
		100% { color : red ; }
}

body
{
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif ;
	background-color : #f1e2bd ;
	background-image : url(images/bg.png) ;
	background-repeat : repeat-y ;
	background-position : center top ;
	width : 800px ;
	margin : 10px auto ;
}

h2
{
	color : gold ;
	text-align : center ;
	text-decoration : underline ;
	text-shadow : 0px 0px 6px black, 0px 0px 2px black ;
}

h3
{
	color : gold ;
	text-shadow : 0px 0px 6px black, 0px 0px 2px black ;
}

h4
{
	color : gold ;
	text-shadow : 0px 0px 6px black, 0px 0px 2px black ;
}

article>*:not(h2):not(h3):not(h4),footer>*
{
	opacity : 0.6 ;
	-webkit-transition : 750ms ;
}

article:hover>*:not(h2):not(h3):not(h4), footer:hover>*
{
	opacity : 1 ;
	-webkit-transition : 500ms ;
}

p
{
	color : #333 ;
	text-align : justify ;
	font-weight : bold ;
	-webkit-transition : 2s ;
}

.alerte
{
	color : red ;
	text-align : center ;
	border : dashed 1px red ;
	height : 20px ;
	-webkit-border-radius : 10px ;
}

a
{
	color : red ;
}

a:visited
{
	color : red ;
}

table
{
	-webkit-border-radius : 10px ;
	background-color : silver ;
	-webkit-box-shadow: -3px -3px 5px #888, 3px 3px 5px #FFF ;
	width : 528px ;
}

td
{
	text-align : center ;
	background-color : #FC0 ;
	-webkit-border-radius : 10px ;
	height : 20px ;
	padding : 0px 10px ;
	-webkit-box-shadow: -1px -1px 2px #FFF, 1px 1px 2px #888 ;
	-webkit-transition : 1s ;
}

td:hover:not(.add):not(.del)
{
	background-color : #FE1 ;
	-webkit-transition : 250ms ;
}

td:active
{
	-webkit-box-shadow: -1px -1px 2px #888, 1px 1px 2px #FFF ;
	-webkit-transition : 250ms ;
}

.cacher { display : none ; }

tr
{
	color : #333 ;
	font-weight : bold ;
}

tr:first-child
{
	font-weight : bold ;
	color : white ;
	text-shadow : 0px 0px 4px grey, 0px 0px 2px black ;
}

input
{
	text-align : center ;
	height : 20px ;
	border : solid 1px gold ;
	-webkit-border-radius : 10px ;
}

select
{
	text-align : center ;
	padding-right : 5px ;
	height : 20px ;
	border : solid 1px gold ;
	-webkit-border-radius : 10px ;
}

textarea
{
	width : 508px ;
	max-width : 508px ;
	min-height : 50px ;
	padding : 10px ;
	border : solid 1px gold ;
	-webkit-border-radius : 25px ;
}

input[type="submit"]
{
	background-color : gold ;
	color : white ;
	font-weight : bold ;
	padding : 0px 10px ;
	text-shadow : 0px 0px 4px grey, 0px 0px 2px black ;
	-webkit-box-shadow: -1px -1px 2px #FFF, 1px 1px 2px #888 ;
	-webkit-transition : 1s ;
}

input[type="submit"]:hover
{
	background-color : #FE1 ;
	-webkit-transition : 250ms ;
}

input[type="submit"]:active
{
	-webkit-box-shadow: -1px -1px 2px #888, 1px 1px 2px #FFF ;
	-webkit-transition : 250ms ;
}

.add
{
	width : 20px ;
	height : 20px ;
	background-color : green ;
	font-weight : bold ;
	color : white ;
	text-shadow : 0px 0px 4px grey, 0px 0px 2px black ;
}

.del
{
	width : 20px ;
	height : 20px ;
	background-color : red ;
}

.del a
{
	text-decoration : none ;
	font-weight : bold ;
	color : white ;
	text-shadow : 0px 0px 4px grey, 0px 0px 2px black ;
}

header
{
	-webkit-box-sizing : border-box ;
	width : 800px ;
	min-height: 200px ;
	height : 200px ;
	border : 1px solid gold ;
	-webkit-box-shadow: 3px 3px 5px #888 ;
	-webkit-border-radius : 100px ;
	background-color : silver ;
	-webkit-transition : 750ms ;
}

header:hover
{
	border : solid 1px red ;
	-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;
	-webkit-transition : 250ms ;
}

#logo
{
	width : 200px ;
	height : 200px ;
	margin : 5px 0px 0px 5px ;
	-webkit-transition : 750ms ;
}

#logo:hover
{
	-webkit-transform : scale(1.04) ;
	-webkit-transition : 500ms ;
}

nav
{
	-webkit-box-sizing : border-box ;
	width : 200px ;
	float : left ;
}

nav div
{
	font : 22px bold ;
	padding-top : 7px ;
	text-shadow : 0px 0px 2px black, 0px 0px 5px black ;
	-webkit-box-sizing : border-box ;
	font-family : "Palatino Linotype", "Book Antiqua", Palatino, serif ;
	display : block ;
	margin : 10px 0px ;
	width : 200px ;
	height : 50px ;
	background-color : gold ;
	border : solid 1px silver ;
	-webkit-border-radius : 25px ;
	-webkit-box-shadow: 3px 3px 5px #888 ;
	text-align : center ;
	-webkit-transition : 750ms ;
}

nav div a
{
	color : silver ;
	text-decoration : none ;
	-webkit-transition : 750ms ;
}

nav div a:visited
{
	color : silver ;
}

nav div:hover
{
	border: solid 1px red ;
	-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;
	-webkit-transform : scale( 1.05 ) ;
	-webkit-transition : 250ms ;
}

nav div:hover a
{
	color : red ;
	text-decoration : none ;
	-webkit-transition : 250ms ;
}

nav div:active
{
	-webkit-transform : scale( 0.9 ) ;
}

nav .ads { height : 260px ; }

nav .ads>*
{
	-webkit-box-shadow: -3px -3px 5px #888, 3px 3px 5px #FFF ;
	-webkit-border-radius : 10px ;
}

.active
{
	-webkit-animation : menuactive 3s linear 0s infinite ;
}

.active>a
{
	-webkit-animation : lienmenuactive 3s linear 0s infinite ;
}

article
{
	-webkit-box-sizing : border-box ;
	margin-top : 10px ;
	margin-left : 10px ;
	padding : 0px 30px 35px 30px ;
	width : 590px ;
	min-height : 75px ;
	background-color : silver ;
	border : solid 1px gold ;
	-webkit-border-radius : 100px ;
	-webkit-box-shadow: 3px 3px 5px #888 ;
	float : left ;
	-webkit-transition : 750ms ;
}

article:hover
{
	border : solid 1px red ;
	-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;
	-webkit-transition : 250ms ;
}

footer
{
	-webkit-box-sizing : border-box ;
	width : 800px ;
	height : 30px ;
	margin : 10px 0px ;
	background-color : silver ;
	border : 1px solid gold ;
	-webkit-box-shadow: 3px 3px 5px #888;
	-webkit-border-radius : 15px ;
	float : left ;
	-webkit-transition : 750ms ;
	padding : 5px 7px ;
}

footer:hover
{
	-webkit-box-shadow: 0px 0px 5px red, 3px 3px 5px #888 ;
	border : solid 1px red ;
	-webkit-transition : 250ms ;
}

#tel
{
	float : left ;
	margin-right : 7px ;
}

#spancopyright
{
	float : right ;
}

footer>span
{
	float : left ;
	font-size : 16px ;
	color : #333 ;
	text-align : justify ;
	font-weight : bold ;
	-webkit-transition : 2s ;
}

footer:hover>span
{
	opacity : 1 ;
	-webkit-transition : 500ms ;
}

.copyright
{
	margin-top: 2px ;
	text-align: center ;
	clear: both ;
	color: #666 ;
	font-size: 11px ;
	font-weight: bold ;
	width: 800px ;
}

.copyright>a
{
	color: #444 ;
	-webkit-transition : 250ms ;
}

.copyright>a:hover
{
	color: #222 ;
	-webkit-transition : 250ms ;
}

h1
{
	display : inline ;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif ;
	color : gold ;
	font-size : 18px ;
	text-shadow : 0px 0px 6px #000, 0px 0px 2px #000 ;
	opacity : 0 ;
	position : absolute ;
	cursor : pointer ;
	-webkit-transition : 4s ;
}

h1:hover
{
	opacity : 1 ;
	webkit-transition : 150ms ;
	-webkit-animation : none ;
}

h1:active
{
	text-shadow : 0px 0px 9px red, 0px 0px 2px #000 ;
	-webkit-transition : 150ms ;
}

.mot1{ -webkit-animation : tag 4s linear 4s infinite ; margin: 20px 0 0 20px }
.mot2{ -webkit-animation : tag 4.9s linear 4s infinite ; margin: 40px 0 0 360px }
.mot3{ -webkit-animation : tag 3.7s linear 4s infinite ; margin: 80px 0 0 48px }
.mot4{ -webkit-animation : tag 7s linear 4s infinite ; margin: 173px 0 0 230px }
.mot5{ -webkit-animation : tag 8s linear 4s infinite ; margin: 108px 0 0 314px }
.mot6{ -webkit-animation : tag 4.5s linear 4s infinite ; margin: 93px 0 0 210px }
.mot7{ -webkit-animation : tag 3.5s linear 4s infinite ; margin: 152px 0 0 0px }
.mot8{ -webkit-animation : tag 5s linear 4s infinite ; margin: 132px 0 0 80px }
.mot9{ -webkit-animation : tag 6s linear 4s infinite ; margin: 60px 0 0 186px }