/*
Name: Jardin du quai
URL: http://www.jardin-du-quai.com/
Author: Com-Ocean | http://www.com-ocean.com
Date: avril 2010
*/


* {outline: none;}

html {font-size: 100.01%;}

body {
	background-color:#fcfdf1;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	margin: 0;
}
	
h1, h2, h3, h4, h5, h6, address, blockquote, ol, p, ul {
	line-height:1.6em;
	margin: 0 0 0.8em;
	padding: 0;
}

button, input, select, textarea {
	font-family: Arial, Helvetica, Verdana, sans-serif;
	font-size: 1.1em;
}

/* ----------------------------------------------------------------------- */
/*                             	GENERAL STYLES                                                */
/* ----------------------------------------------------------------------- */

.left {float: left;}

.right {float: right;}

.clear {clear: both;}
 
img {border: 0;}
 
.italic {font-style: italic;}
 
.uppercase {text-transform: uppercase;}

.imgright {
	float: right;
	margin: 0 0 10px 10px;
	}
	
.ir {
	background-position: 0 0;
	background-repeat: no-repeat !important;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.3em;
	margin: 0 0 0.5em;
	padding: 0;
  color: #453111;  
}

.date {
	display: block;
	float: right;
  color: #453111;
  margin: 0;
}

h1 {
	color: #453111;
	font-size: 24px;
  font-weight: normal;
}

h1 span {font-size: 17px;}

h2 {
	color: #453111;
	font-size: 18px; 
  margin-top: 15px;
}

h3 {
	color: #787878;
  font-size: 18px;
}

h4 { 
	color: #453111;
  font-size: 12px;
}

h5 {
	color: #787878;
  font-size: 12px;
}

h6 {
	color: #453111;
  font-size: 11px;
  font-weight: normal;
}

p {
	color: #787878;
  font-size: 1.1em;
	line-height:1.5em;
	margin: 0 0 0.8em;
	padding: 0;
}

ul {
	margin: 0 0 15px 10px;
}

li {
	color: #787878;
  font-size: 11px;
	line-height:1.5em;
	margin: 0 0 5px 0;
}


a { color: #7b8d0d; text-decoration: none;}
a:hover { text-decoration: underline;}


/* ----------------------------------------------------------------------- */
/*                             	LAYOUT                                                            */
/* ----------------------------------------------------------------------- */

#container {
	margin: 0 auto;
	width: 980px;
}

  #header {
    height: 60px;
    margin: 0;
    position: relative;
    width: 980px;
  }
    
  #main {
    background: url(../images/bkgd_top.png) no-repeat 0 0;
    margin: 0 0 0 25px;
    padding-top: 25px;
    width:920px;
  }	
  
    #content {
      background: url(../images/bkgd_body.png) repeat-y 0 0;
      margin: 0;
      min-height: 445px;
      height:auto !important;
      height: 445px;
      padding: 0 0 20px 10px;
      position: relative;
      width:903px;
    }
    
    	#content-content {
        position: absolute;
        z-index: 2;
        width: 896px;
      }
      
      	#content-text {
        	margin: 0 0 0 220px;
          position: relative;
          width: 660px;
        }
   
   					      
      	#home #content-text {
        	margin: 0 0 0 20px ;
        }
         
  #footer {
    background: url(../images/bkgd_pointilles.jpg) repeat-x 0 0;
    clear: both;
    position: relative;
    text-align: center;
    width: 980px;
  }

/* ----------------------------------------------------------------------- */
/*                             	NAVIGATION                                                      */
/* ----------------------------------------------------------------------- */

/* ------------ nav header top ---------------*/
#nav  {
	list-style-type: none;
  height: 70px;
	margin: 0;
  width: 980px;
}

  #nav li {
    position: absolute;
    top: 3px;
    margin: 0;
    float: left;
    z-index:0;
  }

    #nav li a {
      background-position: 0 0;
      background-repeat: no-repeat !important;
      display: block;
      height: 65px;
      overflow: hidden;
      text-indent: -9999px;
    }

    #nav li a:hover, #resto #nav .nav-resto a, #chef #nav .nav-chef a, #jardin #nav .nav-jardin a, #cuisine #nav .nav-cuisine a, #contact #nav .nav-contact a, #nav .selected  {	background-position: 0 -65px;}

  #nav .nav-resto {left: 270px;}
  #nav .nav-chef {left: 475px;}
  #nav .nav-jardin {left: 530px;}
  #nav .nav-cuisine {left: 668px;}
  #nav .nav-contact {left: 800px;}
  
    #nav .nav-resto a { background-image: url(../images/nav_resto.png); width: 256px;}
    #nav .nav-chef a { background-image: url(../images/nav_chef.png); width: 100px;}
    #nav .nav-jardin a { background-image: url(../images/nav_jardin.png); width: 190px;}
    #nav .nav-cuisine a { background-image: url(../images/nav_cuisine.png); width: 158px;}
    #nav .nav-contact a { background-image: url(../images/nav_contact.png); width: 120px;}

  .en #nav .nav-chef {left: 455px;}
  .en #nav .nav-cuisine {left: 658px;}


    .en #nav .nav-resto a { background-image: url(../images/EN/nav_resto.png); width: 256px;}
    .en #nav .nav-chef a { background-image: url(../images/EN/nav_chef.png); width: 145px;}
    .en #nav .nav-jardin a { background-image: url(../images/EN/nav_jardin.png); width: 190px;}
    .en #nav .nav-cuisine a { background-image: url(../images/EN/nav_cuisine.png); width: 168px;}
    .en #nav .nav-contact a { background-image: url(../images/EN/nav_contact.png); width: 120px;}

/* ------------ nav header right ---------------*/

#nav-right {
	float: right;
	list-style-type: none;
  height: 450px;
	margin: 0;
  width: 50px;
}

  #nav-right li {
    position: absolute;
    margin: 0;
    z-index:0;
  }

    #nav-right li a {
      background-position: 1px 0;
      background-repeat: no-repeat !important;
      display: block;
      overflow: hidden;
      text-indent: -9999px;
      width: 50px
    }

    #nav-right li a:hover, #liens #nav-right .nav-liens a, #actus #nav-right .nav-actus a, #reservation #nav-right .nav-reservation a, #nav-right .selected {	background-position: -50px 0;}

  #nav-right .nav-liens {top: 390px;}
  #nav-right .nav-actus {top: 250px;}
  #nav-right .nav-reservation {top: 90px;}
  
    #nav-right .nav-liens a { background-image: url(../images/nav_liens.png); height: 125px;}
    #nav-right .nav-actus a { background-image: url(../images/nav_actus.png); height: 190px;}
    #nav-right .nav-reservation a { background-image: url(../images/nav_reservation.png); height: 215px;}

    .en #nav-right .nav-liens a { background-image: url(../images/EN/nav_liens.png); height: 125px;}
    .en #nav-right .nav-actus a { background-image: url(../images/EN/nav_actus.png); height: 190px;}
    .en #nav-right .nav-reservation a { background-image: url(../images/EN/nav_reservation.png); height: 215px;}

/* ------------ Nav Footer ---------------*/

.nav_footer_jardinquai {
    font-size: 11px;
    font-weight: bold;
    margin: 0;
    padding: 20px 0 0;
    text-transform: uppercase;
}

#nav_footer_jardin {
  list-style-type: none;
  height: 20px;
  margin: 0 auto ;
  width: 680px;
}

		.en #nav_footer_jardin { width: 730px; }
    
  #nav_footer_jardin li {
    float: left;
    font-size: 12px;
    font-weight: normal;
    margin: 0;
    padding: 0;
    text-transform: none;
   }
  
    #nav_footer_jardin  li a { margin: 0 20px 0 5px;}
    
    #nav_footer_jardin .selected a, #nav_footer_annexe .selected a {color: #453111 !important; font-weight: bold; }

#nav_footer_annexe {
	list-style-type: none;
  margin: 0 auto ;
  padding: 20px 0;
  width: 600px;
}

	.en #nav_footer_annexe { width: 500px; }

	#nav_footer_annexe  li {
  	float: left;
    font-size: 11px;
    font-weight: bold;
    margin: 0 20px;
    padding: 0 0 10px;
    text-transform: uppercase;
	}
  
  #button-fr {
  	background: url(../images/fr.png) no-repeat 0 0;
    padding: 0 0 5px 20px;
    float: right;
   }

  #button-en {
  	background: url(../images/EN/gb.png) no-repeat 0 0;
    padding: 0 0 5px 20px;
    float: right;
   }
	
/* ----------------------------------------------------------------------- */
/*                             	Specific style                                                      */
/* ----------------------------------------------------------------------- */


#resto-fr h1, #resto-fr h2, #resto-fr h4, #resto-fr h6 {color: #B31359 !important;}
#chef-fr h1, #chef-fr h2, #chef-fr h4, #chef-fr h6 {color: #96B015 !important;}
#jardin-fr h1, #jardin-fr h2, #jardin-fr h4, #jardin-fr h6 {color: #DD8803 !important;}
#cuisine-fr h1, #cuisine-fr h2, #cuisine-fr h4, #cuisine-fr h6 {color: #2EAADC !important;}
#contact-fr h1, #contact-fr h2, #contact-fr h4, #contact-fr h6 {color: #E2001A !important;}
#reservation-fr h1, #reservation-fr h2, #reservation-fr h4, #reservation-fr h6 {color: #AE0303 !important;}
#liens-fr h1, #liens-fr h2, #liens-fr h4, #liens-fr h6{color: #523288 !important;}

#resto-en h1, #resto-en h2, #resto-en h4, #resto-en h6 {color: #B31359 !important;}
#chef-en h1, #chef-en h2, #chef-en h4, #chef-en h6 {color: #96B015 !important;}
#jardin-en h1, #jardin-en h2, #jardin-en h4, #jardin-en h6 {color: #DD8803 !important;}
#cuisine-en h1, #cuisine-en h2, #cuisine-en h4, #cuisine-en h6 {color: #2EAADC !important;}
#contact-en h1, #contact-en h2, #contact-en h4, #contact-en h6 {color: #E2001A !important;}
#reservation-en h1, #reservation-en h2, #reservation-en h4, #reservation-en h6 {color: #AE0303 !important;}
#liens-en h1, #liens-en h2, #liens-en h4, #liens-en h6{color: #523288 !important;}

.croquis {
	display: none;
  position: absolute;
  z-index: 10;
}

.croquis-chef { left: -180px;  top: 140px;}
.croquis-jardin { left: -200px;  top: 70px;}
.croquis-cuisine { left: -240px;  top: 140px;}
.croquis-resto { left: -200px;  top: 140px;}
.croquis-contact { left: -210px;  top: 235px;}

#chef .croquis-chef,
#jardin .croquis-jardin,
#cuisine .croquis-cuisine,
#resto .croquis-resto,
#reservation .croquis-contact,
#contact .croquis-contact {display: block;}

/* ------------ header ---------------*/
.floral {
	position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
 }

.logo {
	position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
 }


/* ------------ footer ---------------*/

.bottom {display: block;}

.signature {
  height: 68px;
  position: absolute;
  right: 0;
  top: 20px;
  width: 141px;
}

#footer-contact {	
	background: url(../images/bkgd_pointilles.jpg) repeat-x 0 0;
  clear: both;
  font-size: 11px;
  margin: 5px 0 0;
  padding: 10px 0; 	
}

#copyright {	
  clear: both;
  font-size: 11px;
  margin: 10px 0 50px;
  padding: 10px 0;
}

/******************************* PAGES & ACTUS ****************************/

.bloc-text {
  height: 475px;
  left: 150px;
  overflow: auto;
  padding-right: 5px;
  position: absolute;
  width: 500px;
}

.colright {
  left: 405px;
  height: 355px;
  width: 250px;
}

.colfull  { height: 475px;}

.pager {
  font-size: 12px;
  position: absolute;
  top: 250px;
}

.pager span,
.pager a {
  display: block;
  float: left;
  margin-right: 2px;
  text-align: center; 
  width: 15px;
}

/* Submenu */

.submenu h1
{
  background-color: #a5bc14;
  color: #ffffff !important;
  font-size: 15px;
  font-weight: bold;
  padding: 0 0 0 15px;
  text-transform: uppercase;
}

.submenu {
  position: absolute;
  left: 15px;
  top: 200px;
  width: 205px;
}

.submenu ul {
  margin-left: 0;
  padding: 0 15px 0 15px;
}

.submenu ul li {
  border-bottom: 1px dotted #787878;
  color:#7B8D0D;
  list-style-image: url('/images/puce1.gif');
  list-style-position: inside;
  padding: 0 13px 5px 0;
  text-indent: -10px;
}

.submenu ul li.selected {
  color: #000000;
  line-height: 15px;
  list-style-image: url('/images/puce2.gif');
}

.submenu ul li.selected a {
  color: #787878;
  cursor: default;
}

.submenu ul li.selected a:hover { text-decoration: underline;}



/* formulaire de réservation */

#myContactFormContainer { margin-bottom: 5px;}

  #myContactFormContainer input {
    font-size: 11px;
    padding: 1px;
    width: 220px;
  }

  #myContactFormContainer select { font-size: 11px;}

  #contact_date_reservation_month { margin: 0 3px;}
  #contact_date_reservation_day { margin-right: 3px;}
  #contact_date_reservation_year { margin-left: 3px;}

.form-row {
  clear: both;
  margin-bottom: 5px;
  width: 225px;
}

.form-submit input {  float: right; width: auto !important; }

fieldset {
  border: none;
  padding: 0;
}

label {
  color: #787878;
  display: block;
  font-size: 11px;
}

.error_list {
  margin: 0;
  padding: 0;
}

.error_list li {
  background: url('/images/warning.png') no-repeat 0 0;
  color: #cc0000; 
  font-size: 11px;
  list-style-type: none;
  margin: 0;
  padding-left: 24px;
}

.submit:active { position: relative; top: 1px}

.form-confirm {
  color:#AF0303;
  font-weight: bold;
}

/* Galerie photos */

.galleryview {margin: 0 0 0 0 !important;	}

.loader { background: url(/images/loader.gif) no-repeat center center; }

#galerie {
  height: 480px !important;
  float: left;
 }
 
#filmstrip-box {
  background-image: url('/images/bg-gallery.png');
	height: 108px;
  left: 400px;
	margin: 0 0 0 0 !important;
  position: absolute;
  top: 370px;
	width: 263px;
 }
 
.strip_wrapper { 
  left: 25px !important;
  top: 0 !important;
  width: 190px !important;
}
 
.caption {display: none;} 

#filmstrip-box li.frame {
  height: 90px;
  margin-top: 8px !important;
  overflow: hidden;  
  width: 90px;
}

.panel-overlay {color: #ffffff;	}

.panel-overlay p {color: #ffffff; padding-top: 5px}

.panel { text-align: center; width: 390px !important }

.panel img { margin: 0 auto;}

.nav-prev { display: none; }

.nav-next { left: 625px; top: 410px !important; }

#pointer { border: none !important;}

#pointer img { display: none }

/************ chargement ajax ************/

.prettyLoader {
	background: url(/images/prettyLoader/prettyLoader.png) top left no-repeat;
	height: 30px;
	position: absolute;
	width: 30px;
	z-index: 30000;
}

.prettyLoader img {
	display: block;
	margin: 7px 0 0 7px;
}

.pl_ie6 { background-image: url(/images/prettyLoader/prettyLoader.gif); }