/* Definition des polices - Debut */

@font-face {
    font-family: 'Cheeseburger';
    src: url('cheesebu-webfont.eot');
    src: url('cheesebu-webfont.eot?#iefix') format('embedded-opentype'),
         url('cheesebu-webfont.woff') format('woff'),
         url('cheesebu-webfont.ttf') format('truetype'),
         url('cheesebu-webfont.svg#cheeseburgerregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OldeEnglish';
    src: url('oldeenglish-webfont.eot');
    src: url('oldeenglish-webfont.eot?#iefix') format('embedded-opentype'),
         url('oldeenglish-webfont.woff') format('woff'),
         url('oldeenglish-webfont.ttf') format('truetype'),
         url('oldeenglish-webfont.svg#olde_englishregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Definition des polices - Fin */

a:link {color:#666666;}
a:visited {color:#555555;}
a:hover {color:#202090;}
a:active {color:#666666;}

a img {border:none;}

body{
	font-size:11pt;
	line-height: 1.2;
	color: #333;
	font-family: Arial, Helvetica, sans-serif;
	background-position: center top;
	background-repeat: repeat-x;
	margin: 0;
	text-align: center;
}

h1 {
	font-size:11pt;
	margin-top:4px;
	margin-left:10px;
	margin-bottom:4px;
	font-weight:bolder;
}

h2 {
	font-size:11pt;
	color:#e0f8ff;
}

h3 {
	font-size:11pt;
	margin-top:4px;
	margin-left:10px;
	margin-bottom:4px;
	font-weight:bolder;
}

h1 a:link, h1 a:visited, h1 a:hover {
	color:#FEC2E6;
}

h3 a:link, h3 a:visited, h3 a:hover {
	color:#FEC2E6;
}

h4 {
	font-size:11pt;
	font-weight:bolder;
	color:#D31462;
	text-decoration:underline;
	line-height: 1;
}

h5 {
    margin-top:10px;
	margin-bottom:0px;
	padding-top:10px;
	font-size:14pt;
	font-weight:bolder;
	color:white;
}

hr {
	margin-bottom:2px;
	width:120px;
	height:1px;
	color:white;
	display:inline-block;
}

p {
	font-size:9pt;
	color:#777;
}

paroles {
	font-size:10pt;
	color:#333;
}

parolesTitre {
	font-size:14pt;
	color:#fdc2e5;
}

div#site {
	width:1020px;
	margin: auto;
}


.social{
	padding-left:10px;
	width:480px;
	text-align:left;
	padding-top:8px;
	height:28px;
}

/* Header - Debut */

header{
  height:242px;
}

header .social {
  float:right;
  margin-left: 0;
  padding-left: 0;
  text-align: right;
}

#topLogo{
  text-align: left;
  z-index: 99;
}

nav {
	position:relative;
	vertical-align:top;
  margin: 0;
  padding: 0;
  /*width: 100%;*/
  /*transition: width 1s;
  -webkit-transition: width 1s;
  -ms-transition: width 1s;*/
}

nav.f-nav{
  z-index: 9999;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
} /* this make our menu fixed top */

nav ul {
  /*overflow:inherit;*/
  display:inline-block;
  width:1019px;
	list-style-type: none;
	margin:auto;
	padding-left:0;
  background-color: #97EEFF;
  text-align: center;
  transition: box-shadow 0.5s;
  -webkit-transition: -webkit-box-shadow 0.5s;
  -ms-transition: -ms-box-shadow 0.5s;
  -moz-transition: -moz-box-shadow 0.5s;
}

nav.f-nav ul{
  /*width: 100%;*/
  -moz-box-shadow: 0px 4px 2px 0px #656565;
-webkit-box-shadow: 0px 4px 2px 0px #656565;
-o-box-shadow: 0px 4px 2px 0px #656565;
box-shadow: 0px 4px 2px 0px #656565;
}

nav ul li{
  display:inline-block;
  list-style: none; /* nécessaire pour IE7 */
}
nav ul li:first-child{ padding-left: 0;
  /*overflow:hidden;
  width:0px;
  transition: width 0.5s;
  -webkit-transition: width 0.5s;
  -ms-transition: width 0.5s;*/
}
/*nav.f-nav ul li:first-child{ padding-left: 0; width:95px; }
nav ul li:first-child img{
  width:95px;
}*/

nav ul li a img{
	transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	transform: scale(1);
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
  perspective: 1000; backface-visibility: hidden;
  -ms-perspective: 1000; -ms-backface-visibility: hidden;
  -webkit-perspective: 1000; -webkit-backface-visibility: hidden;
}

nav ul li a img:hover{
	transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
}


/* Header - Fin */

/* Center - Debut */

section#center {
  display: inline-block;
	vertical-align:top;
	width:660px;
  margin-top:0;
  margin-left:10px;
}

article#centerSlideshow{
	height:304px;
}

.center{
	margin-top:10px;
	border-radius: 10px 10px 10px 10px;
}

article.centerNews{
	text-align:left;
	color:#AB074C;
	background-color:#FB69A3;
	padding: 2px 2px 2px 2px;
	box-shadow: 0px 2px 5px 0px #000;
}

article.centerNews .news{
	background-color:#FFF;
	border-radius: 0px 0px 10px 10px;
	padding: 4px 10px 4px 10px;
	font-weight:normal;
	font-size:9pt;
	color:#777;
}

article.centerGame{
	text-align:left;
	color:#FFFFFF;
	background-color:#0382B9;
}

article.centerErreur{
	text-align:left;
	color:#FFFFFF;
}

article.centerSelection{
	text-align:left;
	color:#FEC2E6;
	background-color:#D31462;
	padding: 2px 2px 2px 2px;
	box-shadow: 0px 2px 5px 0px #000;
}

article.centerSelection.ariane{
  color:white;
  background-color:#4FB8E5;
}

article.centerSelection.ariane a{
  	color:#FFFFFF;
  	text-decoration:none;
}

article.centerSelection .selection{
	background-color:#FB69A3;
	color:#000000;
	border-radius: 0px 0px 10px 10px;
	padding: 2px 10px 10px 10px;
	font-weight:normal;
}

article.centerLecteur{
	text-align:center;
	color:#FFFFFF;
	background-color:#0382B9;
	box-shadow: 0px 2px 5px 0px #000;
}

.vignette{
	text-align:center;
}

/* Center - Fin */

/* Bandeau droite - Debut */

#rightSocial{
	text-align:left;
	width:336px;
	height:54px;
	background-image: url(../img/social-02.png);
}

#rightSocial img{
	margin-top:3px;
	margin-left:2px;
}

aside {
	width:330px;
	margin-top:10px;
	margin-left:5px;
  margin-right:10px;
    display: inline-block;
    vertical-align: top;
}

/* Bandeau droite - Fin */

article.centerNews .pub{
	background-color:#FFF;
	border-radius: 10px 10px 10px 10px;
	padding: 4px 10px 4px 10px;
	font-weight:normal;
}

footer {
	margin-top:10px;
	background-color:#0483BA;
	border-top: 1px #000000 solid;
	border-bottom: 30px #025F8A solid;
	height:80px;
	padding-top:10px;
	padding-bottom:10px;
}

footer ul{
	list-style: none;
	width:1000px;
	margin: 0 auto 0 auto;
	padding:0;
}
footer ul li{
	display: inline-block;
	vertical-align:top;
	border-left: 2px #025F8A solid;
	padding-left:12px;
	padding-right:12px;
	height:100%;
}
footer ul li.liSpacer{
	padding-left:0px;
	padding-right:0px;
}

footer .lien {	width:auto; text-align:left;}
footer .lien a {
	color:#FFFFFF;
	text-decoration:none;
	font-size:12px;
}

footer .langue {
	width:420px;
	color:#FFFFFF;
	font-size:14px;
	text-decoration:none;
	text-align:center;
}

footer .propos {
	width:350px;
	text-align:justify;
    text-justify: inter-word;
}

footer .propos div{
	color:#FFFFFF;
	font-size:12px;
}

footer .title {text-align:center;}

footer .spaceHeight{
	height:45px;
}

/* Jeu de memoire - Debut */

section.centerTiers {
	margin-top:10px;
    display: inline-block;
	width:160px;
}

.container {
  width: 150px;
  height: 150px;
  position: relative;
  margin: 0 auto 0;
  -webkit-perspective: 800px;
	 -moz-perspective: 800px;
	   -o-perspective: 800px;
		  perspective: 800px;
}

.card {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transition: -webkit-transform 1s;
	 -moz-transition: -moz-transform 1s;
	   -o-transition: -o-transform 1s;
		  transition: transform 1s;
  -webkit-transform-style: preserve-3d;
	 -moz-transform-style: preserve-3d;
	   -o-transform-style: preserve-3d;
		  transform-style: preserve-3d;
  -webkit-transform-origin: right center;
	 -moz-transform-origin: right center;
	   -o-transform-origin: right center;
		  transform-origin: right center;
}

.flipped {
  -webkit-transform: translateX( -100% ) rotateY( -180deg );
	 -moz-transform: translateX( -100% ) rotateY( -180deg );
	   -o-transform: translateX( -100% ) rotateY( -180deg );
		  transform: translateX( -100% ) rotateY( -180deg );
}

.card figure {
  display: block;
  height: 100%;
  width: 100%;
  line-height: 150px;
  position: absolute;
  -webkit-backface-visibility: hidden;
	 -moz-backface-visibility: hidden;
	   -o-backface-visibility: hidden;
		  backface-visibility: hidden;
  margin: 0;
	border-radius: 10px 10px 10px 10px;
}

.card .front {
	background-image: url(../images/jeux-memory.png);
}

.card .back {
  -webkit-transform: rotateY( 180deg );
	 -moz-transform: rotateY( 180deg );
	   -o-transform: rotateY( 180deg );
		  transform: rotateY( 180deg );
}

/* Jeu de memoire - Fin */

/* Formattage texte histoire - Debut */
.calligraphe {
	font-size: xx-large;
	font-family: "OldeEnglish";
}

.histoire {
	line-height: 1.2;
	font-size:12pt;
	color:#000000;
	text-align: justify;
	text-indent: 20px;
}

.jaune{
	color:#FFE400;
	font-weight:bold;
}

.rouge{
	color:#FF0000;
	font-weight:bold;
}

.bleu{
	color:#0C55C1;
	font-weight:bold;
}

.gras{
	font-weight:bold;
}

.cheeseburger{
	font-family: 'Cheeseburger', Georgia, serif;
}
/* Formattage texte histoire - Fin */

/* Partenaire - Debut */
.partenaire{
	vertical-align:top;
	background-color:#FFF;
	border-radius: 0px 0px 10px 10px;
	padding: 2px 10px 4px 10px;
	font-weight:normal;
	list-style-type: none;
	margin:auto;
}

.partenaire li{
	width:45%;
	margin:10px;
    display: inline-block;

}
/* Partenaire - Fin */

/* Formulaire - Debut */
legende {
	font-size:11pt;
	line-height: 1;
	font-weight:bolder;
	color: #000;
}

.contact{
	margin-top:10px;
	margin-bottom:10px;
}

.contact fieldset{
	padding-top:20px;
}

.contact textarea{
	resize: none;
}

#bouton{
	text-align:center;
	margin:auto;
}
:required
{
    background-color: #FFE4EB;
}
/* Formulaire - Fin */

/* Taquin - Debut */

.taquin{
	text-align:left;
	padding:9px;
}

.difficulte{
	line-height:1.8;
	margin-top:10px;
	margin-left:30px;
	margin-right:30px;
    display: inline-block;
	width:100px;
	text-align:center;
	background-color:#D31462;
	border-radius: 10px 10px 10px 10px;
}


.difficulte a{
	text-decoration:none;
	color:#FEC2D0;
	font-size:11pt;
	font-weight:bolder;
}

.apercu{
	float:right;
	margin: 10px;
}
/* Taquin - Fin */

/* Coloriage - Debut */

.carte{
	margin-top:10px;
	margin-left:7px;
}

/* Coloriage - Fin */

/* Livre - Debut */

.livre{
	font-size:9pt;
	color:black;
}

.livre img.couverture{
	float:left;
	margin: 5px 15px 5px 5px;
}

.livre div.amazon{
	width:87%;
	padding: 10px 30px 10px 30px;
	display: inline-block;
	text-align:center;
	vertical-align:center;
	background-color:#FFCEE3;
	border: 2px #D31462 solid;
	border-radius: 10px 10px 10px 10px;
	font-size:12pt;
	color:#D31462;
	font-weight:bold;
}

.livre div.amazon img{
	width:80px;
	height:25px;
	margin-bottom:-10px;
	margin-left:4px;
}

.livre #myCanvas{
	float:right;
}

.livre .selection p{
	color:#D31462;
}

.star{
	float:right;
}

.livre h3{width:100%;}

/* Livre - Fin */

/* Comptine - Debut */

.partition {
	text-align:center;
}

/* Comptine - Fin */

/* Imprimer - Debut */

.imprimer{
	text-align:center;
}

/* Imprimer - Fin */

/* Labyrinthe - Debut */

.lab{
	height:500px;
}

/* Labyrinthe - Fin */

/* Exercice - Debut */
.livre div .spaceLine{
	width:87%;
	padding: 0px 30px 0px 30px;
	display: inline-block;
	vertical-align:center;
}
/* Exercice - Fin */

/* Fimo - Debut */
img.fimo{
	border-radius: 10px 10px 10px 10px;
}
/* Fimo - Fin */

/* Unboxing - Debut */
img.unboxing{
	width:150px;
  margin:4px;
  /*border-style: solid;
  border-width: 0px 0px 20px 0px;
  border-color: #D31462;
  border-radius: 0px 0px 10px 10px;*/
}
/* Unboxing - Fin */

/* Gateau - Debut */
img.gateau{
  width:620px;
}
/* Gateau - Fin */