body {text-align:justify; font-family:Arial; font-size: 12px;
		padding: auto; background-color: #CCCCCC; }

/*taille de caractères*/
h1 {size : 2 em; color : black; font-style : italic;}
h2 {size : 1 em;}
h3 {size : 0.8 em;}
h4 {size : 0.5 em;}
#colbl {color : #1946ab;}
#collb {color : #ffe4ba;}
#carblanc {color : #ffffff;}
#carnoir {font-size: 16px; color : #2f1b0c;}

/* cadres fixes et mobiles */
.fenestron {position:absolute; width:100%; background-color: #1946ab; transition: all 3s;}
.fenestron:hover {position:absolute; width:30%; background-color: #ffe4ba;}
.fenestrea {position:absolute; width:100%; background-color: #lemmon;}
.fenestrea:hover {position:absolute; width:30%; background-color: #ffe4ba;}
.fenestrend {position:absolute; width:30%; background-color: #ffe4ba;}
.fenestrend:hover {position:absolute; width:30%; background-color: #ffe4ba;}
 
/* insertions */
.carreau {position: absolute;
			margin-left: auto; margin-right: auto;
			width: 90%; padding: 3%;
			color: #1946ab;}

.incrust1 {position:fixed; top:3%; right:0%; width:20%; padding: 3%;}
.incrust2 {position:fixed; top:3%; right:0%; width:40%; padding: 3%;}
.incrust3 {position:fixed; top:3%; right:0%; width:60%; padding: 3%;}
.incrust4 {position:fixed; top:3%; right:0%; width:80%; padding: 3%;}
img#totognoun {animation : apparition 5s linear;}

.box {float: left; margin: 5px; padding: 2%; width: 25%; height: 30%; }
.xob {float: right; margin: 5px padding: 2%; width: 25%; height: 30%; }
.pin {position: fixed; top: 75%; left: 3%; width: 50%;}
.maxibox {float: left; top: 3%; width: 90%; 
			margin-left: auto; margin-right: auto;}
.bapabox {float: left; top: 85%; width: 100%; z-index:7; 
			margin-left: auto; margin-right: auto; padding: 3%;}
.place {float: left; margin: 0;}
.place:hover {transform: rotateY(90deg);}
.pldeug {float: left; 
		margin: 0; background-image: url(pinacotheque/Cd22.png); 
		width: 15%;}
.plgeud {float: left; 
		margin: 0; background-image: url(pinacotheque/Cd22.png); 
		width: 15%;}
.place {float: left; margin: 0;}
.place:hover {float: left; margin: 10%;}
.cadre {position: relative;
			border-radius: 20px;
			margin-top: 30px; margin-bottom: 5px;
			margin-left: auto; margin-right: auto;
			padding: 5px; width:800px;
			background-color:#1946AB;}
.titrembleme {position: relative;
			border-radius: 20px;
			margin-top: 30px; margin-bottom: 30px;
			margin-left: auto; margin-right: auto;
			padding: 50px; width:600px;
			background-color:#FCFCFA;}



/* apparences */
#ligne {display: inline-block;}

/* images de fond et couleurs de liens */
#imargom {background-image : url(pinacotheque/margagnoun.png); background-repeat : no-repeat;}
#lienne {background-color : #f8f8ff; transition : background-color 3s ease-in-out;}
#lienne:hover {background-color : #f5fffa;}
#pousse {
  transform: translate(10px);
}
#vertpom {background-color : #1946ab; transition : background-color 3s ease-in-out;}
#vertpom:hover {background-color : #ffe4ba;}
#noiretb {background-color : #2f1b0c; transition : background-color 3s ease-in-out;}
#noiretb:hover {background-color : #ffffff;}


#oranger {background-color : #ffe4ba; transition: background-color 3s ease-in-out;}
#oranger:hover {background-color : #1946AB;}
#parisus {background-color : #AB1946; transition: background-color 3s ease-in-out;}
#parisus:hover {background-color : #1946AB;}
#fonautomne {background-color : #ffe4ba; transition : background-color 3s ease-in-out;}
#fonautomne:hover {background-color : #baffe4;}

/* effets spéciaux */

#ombrage {box-shadow: 4px; 4px; 4px; 1px; #999999;}
#ombrage:hover {box-shadow: 6px; 6px; 6px; 1px; #999999;}

@keyframes apparition {
	0% {opacity: 0; }
	100% {opacity: 1; }
	}