/* Structure générale */

body {
	margin: 0;
	padding: 0;
	text-align: center; 
	}

header, nav, article, footer {
	display: block;
  	width: 1200px; 
	}

p, h1, h2 {
	margin: 0;
	}


					/* Structure de la page d'accueil */

body#accueil {
	background-color: #393939;
}


					/* Structure des pages Composition */

body#pages-compos {
	background-color: #393939;
}

#container-compos {
	margin: 0 auto;
  	width: 1200px; 
	background-image: url(compositeur/images/fond_compositrice.jpg);
	background-repeat:no-repeat;
	text-align: left;
}

header#hcompos {
	height: 112px;
}

nav#ncompos {
	position: relative;
	height: 114px;
}

article#acompos {
	height: 622px;
	position: relative;
}

ul#vertical-compos {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
	line-height: 20px;
}

li#li01-compos {
	position: absolute;
	top: 0px;
	left: 30px;
	width: 128px;
}

li#li02-compos {
	position: absolute;
	top: 22px;
	left: 30px;
	width: 128px;
}

#menu-horizontal-compos {
	position: absolute;
	top: 0px;
	left: 350px;
	width: 815px;
	text-align: center;
}

ul#horizontal-compos {
	margin-top: 0;
	padding: 0;
	list-style: none;
	line-height: 20px;
}

ul#horizontal-compos li {
	display: inline-block;
	margin: 0;
	padding-top: 0;
	padding-right: 16px;
	text-align: left;
	
	/* IE 7 */
	zoom: 1;
	*display: inline;
}

h1#tt-compos {
	position:absolute; 
	left: 350px; 
	top: -50px;
	width: 800px;
	text-align: center;
}


footer {
	text-align: center;
}



					/* Page biographie */

h2#tt-bio {
	position:absolute; 
	left: 345px; 
	top: 59px;
}

#bloctxt-bio01 {
	position:absolute; 
	left: 425px; 
	top: 85px; 
	background-image: url(compositeur/images/fondbloc01.png);
	text-align: justify;
}

#bloctxt-bio01 p {
	display: inline-block;
	width: 325px; 
	padding: 15px;
	vertical-align : top;
	
	/* IE 7 */
	zoom: 1;
	*display: inline;
}


					/* Page concerts */

article#aconcerts {
	height: 622px;
	position: relative;
	text-align: center;
	padding-top: 42px;
	background-image: url(compositeur/images/cadre-fond.png);
	background-repeat:no-repeat;
}

article#aconcerts section {
	display: inline-block;
	margin: 0;
	padding: 0px 2px 35px 2px;
	vertical-align : top;
	
	/* IE 7 */
	zoom: 1;
	*display: inline;
}

article#aconcerts p {
	background-image: url(compositeur/images/fondbloc01.png);
	padding: 5px;
	text-align: left;
}

article#aconcerts img {
	padding-bottom: 20px;
}









					/* Polices de caractères : déclarations font-face */

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

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

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

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

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

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

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

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

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

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


					/* Polices de caractères : styles titres et textes */

.tt-compos01 {
	font-family: FormataCondensedRoman, Arial, Helvetica, sans-serif;
	font-size: 35px;
	font-style: normal;
	font-weight: normal;
	line-height: 30px;
	color:#FFFFFF;
}

.tt-compos02 {
	font-family: FormataCondensedLight, Arial, Helvetica, sans-serif;
	font-size: 56px;
	font-style: normal;
	font-weight: normal;
	line-height: 50px;
	color:#8F2D3A;
}
															/* >>> Titre oeuvres jaune */
.tt-compos03 {
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 19px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}
															/* >>> Sous-titre oeuvres jaune */
.tt-compos04 {
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}

.txt-compos01 {
	font-family: FormataRegular, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}

.txt-compos02 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-style: italic;
	font-weight: bold;
	color: #FFFFFF;
}
															/* >>> Petit texte oeuvres gras */
.txt-compos04 {
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}
															/* >>> Petit texte oeuvres normal */
.txt-compos05 {
	font-family: ArialNarrowRegular, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}

.txt-footer-compos01 {
	font-family: FormataRegular, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: normal;
	color: #888888;
}

.txt-footer-compos02 {
	font-family: FormataCondensedLight, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: normal;
	color: #888888;
}


.txt-maj {
	font-size: 15px;
}

.txt-maj02 {
	font-size: 13px;
}

.txt-Lignspace {
	font-size: 30px;
}


					/* Polices de caractères : styles liens */

.lien-mcompos {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #ffffff;
}
.lien-mcompos:hover {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}

.lien-mcompos2 {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ffffff;
}
.lien-mcompos2:hover {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}
.prelien-mcompos2 {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}

.lien-mcompos3 {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	color: #ffffff;
}
.lien-mcompos3:hover {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}
.prelien-mcompos3 {
	text-decoration:none;
	font-family: ArialNarrowBold, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}
															/* >>> Lien dates concerts */
.lien-mcompos4 {
	text-decoration:none;
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}
.lien-mcompos4:hover {
	text-decoration:none;
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}

															/* >>> Lien-titre oeuvres jaune */
.lien-mcompos5 {
	text-decoration:none;
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 19px;
	font-style: normal;
	font-weight: normal;
	color: #FFF23A;
}
.lien-mcompos5:hover {
	text-decoration:none;
	font-family: ArialNarrowBoldItalic, Arial, Helvetica, sans-serif;
	font-size: 19px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
}