@charset "utf-8";
/* CSS Document */
/*
Theme Name: Arts et saveurs de l'ocean
Theme URI: http://asoi.com
Description: ASOI Theme
Version: 0.7
Author: Remi Voluer
Author URL: 
/* --------------------------------------------- */

/* TABLE OF CONTENTS
00 - Reset
01 - Elements globaux - Standard Elements
02 - Typographie - All Type throughout the site
03 - Structure - Columns, clearfix, etc.
04 - Header - Website Header
05 - Navigation & Search
06 - Colonnes et boites
07 - Footer
10 - Pages intérieures
11 - Formulaires


/* ----------------------------------------------*/
/* 00 - Reset
/* ----------------------------------------------*/
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, code,del, dfn, em, img, q, dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;font-weight: inherit;font-style: inherit;font-size: 100%;font-family: inherit;vertical-align: baseline;}
body { line-height: 1.7em ;margin:0;background-color:#CCCCCC;
font-size: 68.75%;color: #222;font-family:Georgia,"Times New Roman",Times,serif; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; }
a, a:hover, a:visited { text-transform:none; font-weight:normal; text-decoration:none; color:#000; } 


/* ----------------------------------------------*/
/* 00 - Reset
/* ----------------------------------------------*/


/* ----------------------------------------------*/
/* 01 - Elements globaux
/* ----------------------------------------------*/
body {background:url(../images/img/body_bckg.jpg) repeat; width:100%; min-height:100%; margin:0; text-align:center; }
#body_visu { background:url(../images/img/bg.jpg) repeat-x scroll 50% 0; width:100%; min-height:100%; margin:0;}
.clear {clear:both;}
.right {float:right;}
/*#content {background:#FFFFFF; min-height:500px; width:930px;}*/
hr {background:url(../images/img/hr.jpg); height:20px; border:none 0px; clear:both; margin-bottom:15px; }

#frame {margin: 0 auto; text-align:center; width:980px;}


/* ----------------------------------------------*/
/* 02 - Typographie
/* ----------------------------------------------*/
h1,h2,h3 { font-family:Cambria, Georgia,"Times New Roman",Times,serif;}
h4,h5,h6 { font-family:Cambria, Georgia,"Times New Roman",Times,serif; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-style: normal; text-transform: normal; clear: both; letter-spacing: normal; }

h1 {font-size: 28px; letter-spacing: -1px; line-height: 1.2em; margin:0 0 5px 15px;}
h2 {font-size: 20px; line-height: 1.5em; margin:0 0 5px 15px; background:url(../images/img/hr.jpg) top no-repeat;}
h3 {font-size: 20px; line-height: 1.5em; padding-left:20px; background: url(../images/img/h3_bckg.jpg) no-repeat;}
h3 strong {font-weight:bold; text-decoration:underline;}
h3 span.legende {font-weight:normal; float:right;  margin:-30px 20px 0px 0px; font-size:11px; font-family:Georgia,"Times New Roman",Times,serif;}
h4 {font-size: 17px; line-height: 1.5em; margin:0 0 0 15px; background:url(../images/img/hr.jpg) bottom no-repeat; padding-bottom:15px;}
h5 {font-size: 14px; line-height: 1.5em; margin:0 0 5px 15px;}

p {font-style: normal; font-weight: normal; text-transform: normal; letter-spacing: normal;  }
strong {font-weight: bold; color:#FF5019;}
.quiet {font-style: italic; color:#666666;}
.price {float:right; color: #5B5B5B; margin-top:0px !important; font-weight:bold;}

#region { color:#abc507; padding-left:25px; margin-bottom:5px; float:left; }
#region.reunion {background: url(../images/img/reg_run.gif) no-repeat ;}

/* ----------------------------------------------*/
/* 03 - Structure principale
/* ----------------------------------------------*/
#main { width:980px; background: url(../images/img/main_bckg.jpg); overflow:auto; padding:0;}
#main_g { margin:0 auto; background:url(../images/img/border_left.png) left repeat-y; width:980px; padding-left:15px;  text-align:left;}
#main_d { background:url(../images/img/border_right.png) right repeat-y; width:980px; padding-right:15px;}
#content { width:710px ; min-height:500px; float:left; padding: 0px 0px 0px 10px;}
/*.ligne {width:560px; padding-top:10px; padding-bottom:10px ;border-bottom: dashed #999999 1px; clear:both;}*/
.col_gauche {width:259px; border-right:#CCCCCC 1px solid; float:left;min-height:300px;}
.col_droite {width:259px; border-left:#CCCCCC 1px solid; float:left; min-height:300px;}
#fiche {}


/* ----------------------------------------------*/
/* 04 - Header
/* ----------------------------------------------*/
#toolbar { width:100%; background:#000000; height:30px;}
#toolbar .spacer {display:block; float:right; width:10%; height:1px }
#toolbar ul {float:right; margin:0px 0px 0px 0px; padding:0px;}
#toolbar li {list-style:none; float:left; color:#FFFFFF; margin:5px 15px 0 0; border-right: 1px #ffffff solid; padding: 0 10px 0 0; }
#toolbar a { color:#FFFFFF;}
#toolbar a:visited { color:#FFFFFF;}
#toolbar .drapeaux {float:right; margin: 8px 10px 0 10px; width:22px; height:13px;}
#toolbar .search {display:block; width:170px; float:right;}
#toolbar input[type=submit] { font-size:10px; height:18px; } 
#toolbar input[type=text] {width:100px; height:16px; margin-top:7px;}
#logo {width:330px; height:140px; position:absolute; left:5%; top:0;}
#header { margin:0 auto; width:980px; overflow:auto; height:120px;}


/* ----------------------------------------------*/
/* 05 - Navigation
/* ----------------------------------------------*/
#univers {
	width:980px;
	height:55px;
	margin-top:65px;
/*	position:absolute; */
	left: 40px;
	overflow:hidden;
}
#univers a { float:left; overflow:hidden; padding:55px 0 0 0; height:0 !important;}
#univers ul {float:right; margin:0px; padding:0px; display:inline;}
#univers li {list-style:none; height:55px; float:left; color:#000000; display:inline; list-style-position:outside;}
li#og1 a{width:140px; background:transparent url(../images/img/og_1.png) no-repeat scroll left top; }
li#og2 a{width:140px; background:transparent url(../images/img/og_2.png) no-repeat scroll left top; }
li#og3 a{ width:140px; background:transparent url(../images/img/og_3.png) no-repeat scroll left top; }
li#og4 a{ width:140px; background:transparent url(../images/img/og_4.png) no-repeat scroll left top; }
li#og5 a{ width:140px; background:transparent url(../images/img/og_5.png) no-repeat scroll left top; }
li#og1 a:hover, #univers li#og1.active a{ width:140px; background-image:url(../images/img/og_up_1.png)}
li#og2 a:hover, #univers li#og2.active a{ width:140px; background-image:url(../images/img/og_up_2.png)}
li#og3 a:hover, #univers li#og3.active a{ width:140px; background-image:url(../images/img/og_up_3.png)}
li#og4 a:hover, #univers li#og4.active a{ width:140px; background-image:url(../images/img/og_up_4.png)}
li#og5 a:hover, #univers li#og5.active a{ width:140px; background-image:url(../images/img/og_up_5.png)}

#menu {width:980px; min-height:160px; background:#CC66FF; background:url(../images/img/menu.jpg) no-repeat center top; padding-top:5px; }
.menu_sep {width:5px; height:120px; float:left;}
.menucol {width:115px; height:120px; margin-left:15px; float:left;}
.menucol ul a {font-weight:bold; margin:0px; color:#000000; font-size:14px;}
.menucol li { border-left:1px dashed #CCCCCC; padding-left:8px; font-weight:normal; /*background:transparent url(../images/img/fleche_gris.gif) no-repeat scroll left center; padding-left:12px; */ line-height:1.6em; list-style-image:none; list-style-type:none; list-style-position:outside; font-size:11px;}
.menucol li a {padding-left:12px; text-decoration:none; color:#5B5B5B; font-weight:normal; font-size:12px;}
.menucol li a:hover {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; padding-left:12px; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#407d78;}
.menucol li a.active {font-weight:bold; background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; padding-left:12px; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#407d78;}

#menucompte { background-image:url(../images/img/bckg_panier.jpg); width:210px; /*border-left:#CCCCCC 1px solid; */ height:110px;  float:right; margin:10px 20px 0 0; }
#menucompte ul { padding:10px 20px 0 20px; font-weight:bold; line-height:20px;}
#menucompte li { font-weight:normal; list-style:none;}
#menucompte li a {background:transparent url(../images/img/fleche_gris.gif) no-repeat scroll left center; padding-left:12px; text-decoration:none; color:#5B5B5B;}
#menucompte li a:hover {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#000000;}
#menucompte li a.active {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#000000;}


#ariane {width:930px; padding:4px 0 0 20px; margin:10px 0 20px 0; border-top:#CCCCCC 1px dashed;}
#ariane span { padding-right:10px;}


/* ----------------------------------------------*/
/* 06 - Colonnes et boites
/* ----------------------------------------------*/

/* 06a - Blocs centraux*/
.col1 {width:660px; margin-left:4px; margin-right:4px; margin-bottom:20px ; min-height:100px; float:left; padding:5px; border:#CCCCCC dashed 1px;}
.col1:hover, .col1:focus{}
.col1.up:hover, col1.up:focus {background-color:#000000; color:#FFFFFF;}

.col2 {width:330px; margin-left:4px; margin-right:4px; margin-bottom:20px ; min-height:100px; float:left; padding:5px; border:#CCCCCC dashed 1px; }
.col2:hover, .col2:focus{ }
.col2.up:hover, col2.up:focus {background-color:#000000; color:#FFFFFF;}
.col2 p { font-size: 18px; line-height: 1.75em; padding:10px; font-style:italic;}
.col2 img {width:330px;}

.col3 { width:225px; margin-left:3px; margin-right:3px; margin-bottom:5px; min-height:100px; float:left; margin-bottom:20px; text-align:center;}
.col3:hover, .col3:focus{}
.col3 p{ font-size: 11px; line-height: 1.7em; padding:5px;}
.col3 img {padding: 0px 5px 0px 5px; height:125px; margin-top:-10px;}
.col3_double { width:225px; margin-left:3px; margin-right:3px; margin-bottom:5px; min-height:100px; float:right; margin-bottom:20px; text-align:left;}
.col3_double:hover, .col3:focus{}
.col3_double p{ font-size: 11px; line-height: 1.7em; padding:5px;}
.col3_double2 { width:450px; margin-left:3px; margin-right:3px; margin-bottom:5px; min-height:100px; float:left; margin-bottom:20px;}
.col3_double2:hover, .col3_double:focus{ background-color:#ededed;}


.col4 { width:162px; margin:0 6px 20px 7px; min-height:100px; float:left; background-color:#FFFFFF;}
.col4:hover, .col4:focus{ background-color:#ededed; }
.col4 img {border-bottom:#CCCCCC dashed 1px; padding-bottom:5px; margin: 5px 5px 0 5px; width:150px;}
.col4 p{ font-size: 11px; line-height: 1.5em; padding:0 5px 5px 5px; }
.col4_index {width:162px; margin:0 6px 20px 7px; min-height:100px; float:left;}

/* 06b - Blocs des colonnes*/
.encart {float:left; min-width:250px; margin-bottom:30px;}
.encart_tri {float:left; min-width:250px; margin-bottom:30px; }
.encart_tri ul { font-weight:bold; margin:0px; color:#407d78; padding-left:25px; }
/*.encart_tri li { background:transparent url(../images/img/fleche_gris.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; padding-left:5px;}*/
.encart_tri li { line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; padding-left:5px;}
.encart_tri li a {background:transparent url(../images/img/fleche_gris.gif) no-repeat scroll left center; padding-left:12px; text-decoration:none; color:#5B5B5B;}
.encart_tri li a:hover {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#000000;}
.encart_tri li a.active {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#000000;}
span.lien {text-align: right; float: right; margin-right: 15px;}

.col_droite hr {background:transparent url(../images/img/hr.jpg) no-repeat scroll center top; height:20px;}
.col_gauche h2 {text-align:center;}
.col_gauche h4 {text-align:center;}

.profil {float:right; min-width:250px; margin-bottom:30px; }
.profil img { margin-top:5px; margin-left:35px; width:195px;}
.profil #region {margin-left:12px;}
.profil hr {background:transparent url(../images/img/hr.jpg) no-repeat scroll center bottom; margin-bottom:0px;}
.profil ul { margin:0px 0px 0px 30px; color:#000000; text-align:left; line-height:2em;}
.profil li { background:transparent url(../images/img/fleche_gris.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; padding-left:15px;}
.profil li a {padding-left:12px; text-decoration:none; color:#000000; }
.profil li:hover {background:transparent url(../images/img/fleche_bleu.gif) no-repeat scroll left center; line-height:18px; list-style-image:none; list-style-type:none; list-style-position:outside; font-weight:bold; color:#407d78;}

.profil_mini { width:230px; margin-bottom:10px; border-bottom:#CCCCCC 1px dashed; padding:3px; margin-right:3px; margin-left:10px; float:left;}
.profil_mini img {height:50px; margin-right:10px; margin-left:10px; float:right; background-color:#9966CC;}
.profil_mini p {text-align:right; margin-right:10px;}

.produit_mini {width:100px; float:left; margin-left:12px; margin-bottom:10px; padding:3px; background:#ffffff;}
.produit_mini img {width:100px;}




/* ----------------------------------------------*/
/* 07 - Footer
/* ----------------------------------------------*/
#footer {width:980px; margin-top:60px; }
#footer1 {width:980px; height:10px; background:url(../images/img/footer_1.gif);}
#footer2 {width:980px; background:url(../images/img/footer_2.gif) repeat-y; padding:10px 0 0 0;}
#footer3 {width:980px; height:10px; background:url(../images/img/footer_3.gif) repeat-x;}
.footer_col { width:200px; margin-left:30px; float:left;}
#copy {width:980px; text-align:center; background:#000000; color:#FFFFFF;}
#footer a:link, #footer a:visited {color:#ffffff;}


#menu .col2 {border:none;}
.menu_sep_home {width:10px; height:120px; float:left;}