/* CHARGEMENT DES POLICES DE CARACTERES */
/****************************************/

@font-face {
    font-family: 'aaarghnormal';
    src: url('../fonts/Aaargh-webfont.eot');
    src: url('../fonts/Aaargh-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Aaargh-webfont.woff') format('woff'),
         url('../fonts/Aaargh-webfont.ttf') format('truetype'),
         url('../fonts/Aaargh-webfont.svg#aaarghnormal') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'chunkfiveroman';
    src: url('../fonts/chunkfive-webfont.eot');
    src: url('../fonts/chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/chunkfive-webfont.woff') format('woff'),
         url('../fonts/chunkfive-webfont.ttf') format('truetype'),
         url('../fonts/chunkfive-webfont.svg#chunkfiveroman') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* STYLE TAILLE ECRAN PAR DEFAUT */
/*********************************/

body { 	background-color: #edece5; }

.fondTop { background:#edece5; color:#3d3d3d; font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; padding-top: 70px; }
.fond1 { background: #47463b url(../img/fond-block1.png) no-repeat right center; color: white; font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; }
.fond2 { background: #574141 url(../img/fond-block2.png) no-repeat left center; color: white; font: 1em/1em 'aaarghnormal', Arial, sans-serif; }
.fond3 { background: #504f4f url(../img/fond-block3.png) no-repeat right center; color: white; font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; }
.fond4 { background: #4c6076; color: white; font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; }
.fond5 { background: #6e87a1; color: white; font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; }
.fond6 { background: #574141; color: white; font: 1em/1em 'aaarghnormal', Arial, sans-serif; }

.fond700px { min-height: 700px; padding: 30px;}
.fond300px { min-height: 300px; padding: 30px;}

h1 { font: 3em/1.3em 'chunkfiveroman', Times, serif; }
table caption, table td, table th { color: white; font: 1.2em/1.3em Arial, sans-serif; }
h1.indz { font: 4em/1.3em 'chunkfiveroman', Times, serif; color:#7b7a69; line-height: 150px; }
img, .indz { behavior: url(iepngfix.htc); }
.gras { font-weight: bold; }

.fondTop h2 { margin: 20px 0; padding: 0; line-height: 1em; }
.fondTop h4 { margin: 10px 0; padding: 0; line-height: 1em; }
nav { font: 1.2em/1.2em 'aaarghnormal', Arial, sans-serif; }

.fondTop .marge20 { margin-top: 20px; }
.fondTop .marge40 { margin-top: 40px; }
.fondTop .marge60 { margin-top: 60px; }

footer { width: 100%; background: #222222; padding: 30px; color: #ffffff;  color: white; font: 1em/1em 'aaarghnormal', Arial, sans-serif; }

a { color: #fff; text-decoration: underline;}
.fondTop a { color: #005267; text-decoration: underline;}


/* FORMULAIRE */
/**************/

p.formulaire_erreur { padding-top: 70px; }
p.formulaire_valide { padding-top: 70px; }
.form-contact { margin-top: 20px; }
.form-contact ul { list-style-type: none; }
.form-contact fieldset { margin: 0 0 10px 0; padding: 0 0 10px 0; font-size: 14px; border-bottom: 1px solid #eee; }
.form-contact fieldset.check { padding-left: 30%; }
.form-contact fieldset label { float: left; width: 30%; margin: 15px 0 5px 0; font-weight: bold; }
.form-contact fieldset.check label { display: inline; float: none; width: auto; font-weight: normal; }
.form-contact fieldset.radio ul li label { display: inline; float: none; width: auto; font-weight: normal; }
.form-contact fieldset input.form-text,
.form-contact fieldset textarea { display: block; width: 60%; padding: 3px 10px; margin-top: 10px; height: 35px; font-size: 14px; border: 3px solid #ddd; background: #f5f5f5; -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05); -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.05); -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.form-contact fieldset input.form-text:focus { border: 3px solid #ccc; background: #fff; }
.form-contact fieldset textarea { height: 100px; }
.form-contact fieldset select { min-width: 25%; margin: 0; }
.form-contact fieldset.radio ul { margin: 5px 0 0 20%; }
.form-contact fieldset.radio ul li { margin: 0 0 5px 0; }
.form-contact fieldset.radio ul li:last-child { margin: 0; }
.form-contact fieldset p.form-help { margin: 0px 0 0 30%; padding-top: 0; font-size: 12px; color: #999; }
.form-contact input[type="submit"] { margin: 0; padding: 5px 10px; font-size: 12px; font-weight: bold; border: 3px solid #ccc; background: #eee; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.form-contact input[type="submit"]:hover, .form-contact input[type="submit"]:focus { border: 3px solid #bbb; background: #e5e5e5; }
.form-contact input[type="submit"]:active { border: 3px solid #ccc; background: #eee; }
.form-contact fieldset.form-actions { margin: 0 0 0 30%; padding: 0; border: none; }
input.submit { width: 100%; height: 3em; font-size: 3em; }
.input-error { border: 3px solid #d00000; }
span.erreur { color: #c00; }

@media screen and (max-width: 767px) {
	.form-contact fieldset label { display: block; float: none; width: auto; margin: 0 0 5px 0; }
	.form-contact fieldset.form-actions,
	.form-contact fieldset.check,
	.form-contact fieldset.radio ul,
	.form-contact fieldset p.form-help { margin-left: 0; padding-left: 0; }
	.form-contact fieldset input.form-text,
	.form-contact fieldset textarea { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
}


/* STYLE LARGEUR < 768px */
/*************************/

@media screen and (max-width: 767px) {
	.fondTop, .fond1, .fond2, .fond3, .fond4, .fond5 { min-height: 450px; padding: 30px;}
	.fondTop { padding-top: 100px;  }
	h1 { font: 2.5em/1.3em 'chunkfiveroman', Times, serif; }
	h1.indz { font: 3em/1.3em 'chunkfiveroman', Times, serif; color:#7b7a69; line-height: 150px; }
	.coursier { margin-top: 40px; color:#7c1a1a; }
	.txtcenter p { text-align: left; }
}

/* STYLE LARGEUR < 480px */
/*************************/

@media only screen and (max-width : 480px) {
	h1 { font: 2em/1.3em 'chunkfiveroman', Times, serif; }
	h1.indz { font: 2em/1.3em 'chunkfiveroman', Times, serif; color:#7b7a69; line-height: 40px; }
	.coursier { margin-top: 40px; color:#7c1a1a; }
	.txtcenter p { text-align: left; }
	h2 { font-size: 1.3em; }
	.fondTop { background:#edece5; color:#3d3d3d; font: 1em/1.1em 'aaarghnormal', Arial, sans-serif; padding-top: 30px; }
	.fond1 { background: #47463b; color: white; font: 1em/1.1em 'aaarghnormal', Arial, sans-serif; }
	.fond2 { background: #574141; color: white; font: 1em/1em 'aaarghnormal', Arial, sans-serif; }
	.fond3 { background: #504f4f; color: white; font: 1em/1.1em 'aaarghnormal', Arial, sans-serif; }
	.fond4 { background: #4c6076; color: white; font: 1em/1.1em 'aaarghnormal', Arial, sans-serif; }
	.fond5 { background: #6e87a1; color: white; font: 1em/1.1em 'aaarghnormal', Arial, sans-serif; }	
}


/* Hack IE PNG */
img { behavior: url(../img/iepngfix.htc); }