body,header,nav,section,article,aside,footer{
margin: 0;
padding: 0;
}

body{
background: #9966cc; /* Old browsers */
background: -moz-linear-gradient(top, #9966cc 0%, #ffffff 100%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9966cc), color-stop(100%,#ffffff), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #9966cc 0%,#ffffff 100%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #9966cc 0%,#ffffff 100%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #9966cc 0%,#ffffff 100%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom, #9966cc 0%,#ffffff 100%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9966cc', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

background-size: 100% 1080px;
background-attachment: fixed;

/* Dimension du fond */
height: 100%;
min-height: 100%;
overflow: auto;
}

.clear{
	clear: both;
}

a,a:hover,a:link,a:visited{
color: #000000;
}

/* Couleurs */
.or{
color: #bfa441;
}

.bleu{
color: #6666cc;
}

.mauve{
color: #9966cc;
}

.rose{
color: #c4697c;
}

.vert{
color: #336633;
}

/* Haut de page */
header{
width: 1200px;
height: 100px;
margin: 0 auto;
}

header div#logo{
position: absolute;
margin: 7px 0 0 0;
}

header div#logo img{
height: 100px;
}

header div#phrase1{
position: absolute;
font-family: 'GaramondPremrProRegular';
font-size: 30px;
text-transform: uppercase;
margin: 20px 0 0 130px;
color: #ffffff;
}

header div#les-champagnes-de-vignerons{
position: absolute;
margin: 7px 0 0 1100px;
}

header div#les-champagnes-de-vignerons img{
height: 100px;
}

header div#viticulture-raisonnee{
position: absolute;
margin: 7px 0 0 1000px;
}

header div#viticulture-raisonnee img{
height: 83px;
}

header div#viticulture-raisonnee-texte{
position: absolute;
width: 92px;
margin: 85px 0 0 1000px;
font-size: 11px;
text-align: center;
color: #006600;
}

header div#terra-vitis{
position: absolute;
margin: 7px 0 0 750px;
}

header div#terra-vitis img{
height: 100px;
}

header div#phrase2{
position: absolute;
font-family: 'BickhamScriptProRegularRg';
font-size: 50px;
margin: 40px 0 0 130px;
color: #ffffff;
}

/* Navigation */
nav{
width: 1200px;
height: 50px;
font-family: 'GaramondPremrProRegular';
font-size: 20px;
border: 1px solid #000000;
border-radius: 5px;
background-color: #ffffff;
margin: 15px auto;
box-shadow: 5px 5px 8px #000000;
}

nav ul{
list-style-type: none;
margin: 15px 0;
padding: 0;
}

nav ul li{
float: left;
padding: 0 20px 0 20px;
border-right: 1px solid #000000;
}

nav ul li:first-child{

}

nav ul li:last-child{
border-right: 0;
}

nav ul li a{
text-decoration: none;
}

nav ul li a.active{
font-weight: bold;
}

nav ul li a:hover{
font-weight: bold;
}



/* Encard principal */
section div#principale{
background-image: url(../images/background-principal.png);
background-color: #ffffff;
background-size: 100% auto;
background-position: center center;
width: 1200px;
height: auto;
min-height: 320px;
margin: 15px auto;
border: 1px solid #000000;
border-radius: 5px;
box-shadow: 5px 5px 3px #000000;
}

section div#principale article.colonne_unique{
margin: 30px;
}

section div#principale article.colonne_unique p{
font-family: 'GaramondPremrProRegular';
margin: 10px 0;
text-shadow: 5px 5px 10px #000000;
color: #ffffff;
font-weight: 400;
font-size: 18px
}

section div#principale article.colonne_unique h2{
color: #ffffff;
font-weight: 400;
font-size: 36px
}

section div#principale article.colonne_unique p a{
color: #ffffff;
}

section div#principale article.colonne_unique div#champagnes{
margin: 50px 0 0 0;
width: 930px;

/* Affichage en colonne des etiquettes */
column-count: 5;
-webkit-column-count: 5;
-moz-column-count: 5;
column-width: 170px;
-webkit-column-width: 170px;
-moz-column-width: 170px;
column-gap: 20px;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
}

section div#principale article.colonne_unique div#champagnes figure{
width: 170px;
margin: 0;
}

section div#principale article.colonne_unique div#champagnes figure img{
width: 170px;
}

section div#principale article.colonne_unique h2{
font-family: 'GaramondPremrProRegular';
margin: 30px 0 10px 0;
text-shadow: 5px 5px 10px #000000;
color: #ffffff;
font-weight: 400;
font-size: 36px
}

/* Trois colonnes en dessous la principale */
section div#secondaire{
width: 1200px;
height: 150px;
margin: 0 auto;

}

/* Colonne 1 */
section div#secondaire article.colonne1{
position: absolute;
width: 390px;
background-color: #ffffff;
height: 130px;
border: 1px solid #000000;
border-radius: 5px;
box-shadow: 5px 5px 8px #000000;
margin: 0 0 0 0;
}

section div#secondaire article.colonne1 p{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

section div#secondaire article.colonne1 h2{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

/* Colonne 2 */
section div#secondaire article.colonne2{
position: absolute;
width: 390px;
background-color: #ffffff;
height: 130px;
border: 1px solid #000000;
border-radius: 5px;
box-shadow: 5px 5px 8px #000000;
margin: 0 0 0 405px;
}

section div#secondaire article.colonne2 p{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

section div#secondaire article.colonne2 h2{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

section div#secondaire article.colonne2 p.ensavoirplus{
text-align: right;
margin: 0 20px;
}

/* Colonne 3 */
section div#secondaire article.colonne3{
position: absolute;
width: 390px;
background-color: #ffffff;
height: 130px;
border: 1px solid #000000;
border-radius: 5px;
box-shadow: 5px 5px 8px #000000;
margin: 0 0 0 810px;
}

section div#secondaire article.colonne3 p{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

section div#secondaire article.colonne3 h2{
font-family: 'GaramondPremrProRegular';
margin: 20px;
}

/* Encard des pages intérieures*/
section div#texte{
background-color: #ffffff;
background-size: 100% auto;
background-position: center center;
width: 1200px;
height: auto;
min-height: 420px;
margin: 15px auto;
border: 1px solid #000000;
border-radius: 5px;
box-shadow: 5px 5px 3px #000000;
}

section div#texte article{
margin: 30px;
}

section div#texte article aside{
float: right;
width: 250px;
}

section div#texte article aside img{
width: 250px;
}

section div#texte article h2{
color: #000000;
}

section div#texte article p{
color: #000000;
}

section div#texte article div#contact{
width: 1140px;
column-count: 3;
-webkit-column-count: 3;
-moz-column-count: 3;
column-width: 360px;
-webkit-column-width: 360px;
-moz-column-width: 360px;
column-gap: 30px;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
}

section div#texte article div#contact div.colonne{
width: 360px;
height: 500px;
}

section div#texte article div#contact div.colonne p{
margin: 5px 0 5px 0;
}

/* Formulaire de contact */
form#contact p#hp{
display: none;
}

form#contact p label{
width: 360px;
display: block;
}

form#contact p input,textarea{
width: 356px;
margin: 0;
padding: 1px;
border: 1px solid #999;
}

form#contact p#envoi{
text-align: center;
}

form#contact p input[type=submit]{
width: 100px;
text-align: center;
border: 1px solid #000000;
}



/* Pied de page */
footer{
width: 1200px;
font-family: Arial;
text-align: center;
font-size: 11px;
color: #000000;
margin: 0 auto;
}