/* @group reset */

html, body, div, span, applet, object, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, cite, em,  img,  strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, address {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

html {
  font-size: 62.5%;
  line-height: 1.5em;
}

ol, ul {
  list-style: none;
}

a {
  color: black;
}
/* @end */

/* @group structure */

html, body {
  height: 100%; /* needed for content min-height */
  font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
  color: #111;
}

.margin_top_10px {
 margin-top: 10px;
}

.margin_right_10px {
 margin-right: 10px;
}

#wrapper {
 position: relative;
 margin: 0 auto; 
 width: 990px;
 background-color: white;
 overflow: hidden;
}

#header {
 position: relative;
 height: 160px;
 background-color: white;
}

#utils {
 position: absolute;
 top: 10px;
 right: 10px;
 font-size: 1.1em;
}

#search {
 position: absolute;
 top: 40px;
 right: 10px;
}

#nav {
 position: absolute;
 bottom: 0;
 left: 0;
}

#header li, #header_jeunesse li {
 display: inline;
}

#content {
 position: relative;
 float: left;
 padding: 10px 0px 0 10px;
 width: 770px;
 min-height: 450px;
 overflow: hidden;
}

#content h1 {
 text-transform: uppercase;
 margin-bottom: 30px;
 color: black;
}

#subcontent {
 float: right;
 margin-top: 10px;
}

#footer {
  position: relative;
  margin: 0 auto; 
  width: 950px;
  height: 110px;
  border: 10px solid white;
  border-bottom: none;
  padding: 10px;
}

#footer .autres_liens {
 font-size: 1.3em;
 margin-top: 10px;
}

#transaction_cc {
 position: absolute;
 bottom: 0;
 right: 160px;
}

#transaction_is {
 position: absolute;
 bottom: 0;
 right: 20px;
}

/* @end */

/* @group .highlight */

.highlight {
 position: relative;
 width: 760px;
 display: block;
 overflow: hidden;
 margin-bottom: 10px;
}

.no_bottom_margin {
 margin-bottom: 0;
}

.highlight img, .half_box_content img {
 float: left;
 margin-right: 10px;
}

.short {
 width: 560px;
}

.marge_jeunesse {
 margin-top: 30px;
}

.highlight h2 {
 font-size: 1.4em;
 text-transform: uppercase;
 font-weight: bold;
 padding: 10px 10px 0px 10px;
 color: black;
}

.highlight h3 {
 font-size: 1.6em;
 text-transform: uppercase;
 font-weight: bold;
 margin-top: 4px;
 line-height: 1.4em;
}

.highlight div.overview h3 {
 font-size: 1.1em;
 font-weight: bold;
 margin-bottom: 10px;
}

.highlight h4 {
 font-size: 1.2em;
 margin-bottom: 3px;
}

.highlight h5 {
 font-size: 1.1em;
 font-weight: bold;
}

.highlight div.overview {
 margin: 10px 0;	
 font-size: 1.4em;
 font-style: italic;
 padding-right: 20px;
 line-height: 1.4em;
}

.carousel_jeunesse div.overview p {
 font-size: 1.0em;
}

.highlight p.price {
 margin-bottom: 10px;	
 font-size: 1.8em;
 font-weight: bold;
}

.highlight p.more_info {	
 font-size: 1.4em;
 font-weight: bold;
}


/* @end */

/* @group pr */

#pr {
 padding: 10px;
}

#pr h2 {
 font-size: 1.4em;
 text-transform: uppercase;
 font-weight: bold;
 color: black;
 padding-bottom: 10px;
}

#pr h3 {
 font-size: 1.2em;
 line-height: 1.5em;
 margin-bottom: 2px;
}

#pr h4 {
 font-size: 1.2em;
 text-transform: uppercase;
 border-top: 2px solid grey;
 padding-top: 2px;
 margin-bottom: 3px;
}

#pr h5 {
 font-size: 1.1em;
 font-weight: bold;
 margin-bottom: 8px;
}

/* @end */

/* @group column */

#column {
 position: relative;
 float: right;
 width: 200px;	
 margin-right: 10px;
 border-top: 10px solid white;
}

#bg_jeunesse {
 position: absolute;
 bottom: 0;
 right: 10px;
 height: 321px;
}

#column h2 {
 font-size: 1.4em;
 text-transform: uppercase;
 font-weight: bold;
 margin-bottom: 4px;
}

#column p.more_info {	
 font-size: 1.2em;
 font-style: italic;
 margin: 4px 0 10px 0;
 padding-bottom: 10px;
}

#events {
 padding: 10px;
 margin-top: 20px;
}

#events h3 {
 font-size: 1.1em;
}

#events h4 {
 font-style: italic;
}

#events p {
 margin-bottom: 8px;
}

.float_left {
 float: left;
 margin-right: 5px;
}

.float_right {
 float: right;
}

/* @end */

/* @group utils */

#utils a {
 text-decoration: none;
 color: gray;
}

#utils a:hover, #utils a:active  {
 text-decoration: underline;
 color: black;
}


/* @end */

/* @group nav */

#nav ul {
 margin-left: 10px;
}

#nav ul li {
 display: block;
 float: left;
 margin-right: 5px;
}

#nav ul li span a {
 display: block;
 border: 1px solid white;
 border-bottom: none;
 text-decoration: none;
 background: url(/images/bg-nav.jpg) repeat-x;
 font: bold 1.4em "Trebuchet MS", sans-serif;
 padding: 3px 10px;
}

#nav ul li a:hover {
 background: url(/images/bg-nav-on.jpg) repeat-x;
}

/* @end */

/* @group carousel */

/* @group half_box */

.half_box {
 position: relative;
 float: left;
 width: 355px;
 overflow: hidden;
 padding: 10px;
}

.half_box h2 {
 font-size: 1.4em;
 text-transform: uppercase;
 font-weight: bold;
 color: black;
}

.half_box h3 {
 font-size: 1.6em;
 font-weight: bold;
 margin-bottom: 4px;
 margin-top: 4px;
 line-height: 1.2em;
}

.half_box h4 {
 font-size: 1.2em;
 margin-bottom: 3px;
}

.half_box h5 {
 font-size: 1.1em;
 font-weight: bold;
}

.half_box div.overview  {
 margin: 10px 0;	
 font-size: 1.1em;
 font-style: italic;
 padding-right: 10px;
 line-height: 1.3em;
}

/* @end */

.recently_published {
 float: left;
 width: 720px;
}

.recently_published ul li {
 display: inline;
 float: left;
 padding: 10px;
 width: 720px;
 overflow: hidden;
}

.recently_jeunesse {
 float: left;
 width: 500px;
}

.recently_jeunesse ul li {
 display: inline;
 float: left;
 padding: 10px;
 width: 500px;
 overflow: hidden;
}

.recently_jeunesse div.overview {
 font-size: 1.0em;
}



.best_sellers, .is_not_released_yet {
 float: left;
 width: 330px;
}

.best_sellers ul li, .is_not_released_yet ul li {
 display: inline;
 float: left;
 padding: 10px 0;
 width: 330px;
 overflow: hidden;
}

#content .catalogue {
 float: left;
 width: 500px;
}

div.carousel_item img {
 border: 1px solid black;
 padding: 3px;
 background-color: white;
}

#content .catalogue div.overview p {
 font-size: 0.9em;
 line-height: 16px;
}

#content .catalogue ul li {
 display: inline;
 float: left;
 padding: 10px;
 width: 500px;
 overflow: hidden;
}

#content .carousel .disabled {
 -moz-opacity:.3;
 opacity:0.3;
 filter:alpha(opacity=30);
}

#content .carousel-previous {
 position: absolute;
 bottom: 10px;
 right: 15px;
 cursor: pointer;
}

#content .carousel-next {
 position: absolute;
 bottom: 10px;
 right: 0px;
 cursor: pointer;
}

#content .carousel_item {
 overflow: hidden;
 min-height: 225px;
}




/* @end */

/* @group authors List */


#authors_list {
 margin-top: 20px;
}

#authors_list li {
 float: left;
 margin-right: 15px;
 margin-bottom: 20px;
}

#authors_list li a p {
 font-size: 1.1em;
}

#authors_list li a img {
 border: 1px solid white;
}

#authors_list li a img:hover {
 border: 1px solid black;
}


/* @end */

/* @group fiche */

#fiche {
 float: left;
 width: 550px;
 margin-top: 20px;
 margin-left: 10px;
}

#fiche h2 {
 text-transform: uppercase;
 margin-bottom: 3px;
}

#fiche h2 a {
 text-decoration: none;
 font-size: 14px;
}

#authorInfos  {
 overflow: hidden;
 margin: 10px 0;
}

#authorInfos img {
 float: left;
 margin-right: 10px;
}

#authorInfos p {
 font-size: 1.2em;
 line-height: 1.6em;
 padding-right: 20px;
}

#authorInfos h4 {
 font-size: 1.4em;
 text-transform: uppercase;
 margin-bottom: 4px;
}

#authorInfos .hyperlink {
 margin: 4px 0;
}

.portfolio {
 font-size: 1.4em;
 text-transform: uppercase;
 font-weight: bold;
 margin-bottom: 8px;
 border-bottom: 1px solid black;
}

.accordeon div img.cover {
 float: left;
 padding: 3px;
 border: 1px solid grey;
 margin-right: 10px;
}

.accordeon div {
 overflow: hidden;
 padding: 2px;
 margin-top: 4px;
}

.accordeon {
 margin-bottom: 20px;
}

.accordeon h3 a {
 color: black;
 font-weight: normal;
 line-height: 20px;
}

.accordeon p {
 font-size: 1.2em;
}

/* @group book_details */

.book_details .emphasis {
 font-size: 1.6em;
 color: red;
 text-transform: uppercase;
 font-weight: bold;
 margin-bottom: 6px;
}

div.book_details > p {
 font-size: 1.2em;
 margin-bottom: 4px;
}

.book_details p.price {
 font-size: 1.8em;
 margin: 10px 0;
 font-weight: bold;
}

span.book_overview p {
 line-height: 1.5em;
 margin-bottom: 9px;
}


/* @end */







/* @group bouton */

.button a {
 text-decoration: none;
 font-size: 12px;
 font-weight: bold;
 color: white;
 cursor: pointer;
}


.btn_left_side {
 float: left;	
 padding: 6px 7px 6px 10px;
 background: url(/images/bg-btn-left.gif) left no-repeat;
}

.btn_right_side {
 float: left;	
 width: 25px;
 height: 27px;
 background: url(/images/bg-btn-right.gif) right no-repeat;
}

.button a:hover .btn_left_side {
 background: url(/images/bg-btn-left-on.gif) left no-repeat;
}

.button a:hover .btn_right_side {
 background: url(/images/bg-btn-right-on.gif) right no-repeat;
}



/* @end */

/* @end */

/* @group inside_content */
#inside_content {
 padding: 10px 10px 0 10px;
}

#inside_content h1 {
 font-size: 1.6em;
 text-transform: uppercase;
 margin-bottom: 10px;
}

#inside_content ul li {
 margin-bottom: 10px;
}

#inside_content h3 {
 font-size: 1.4em;
 font-weight: bold;
 margin-bottom: 4px;
}

#inside_content h4 {
 font-size: 1.2em;
 font-weight: bold;
 text-transform: uppercase;
}

#inside_content h5 {
 font-size: 1.1em;
 font-weight: bold;
 margin-bottom: 10px;
}

#inside_content p {
 font-size: 1.2em;
 line-height: 1.4em;
 margin-bottom: 8px;
}

.infos p, .infos_grey_bg p {
 font-size: 1.2em;
 margin-bottom: 10px;
 line-height: 1.6em;
}

.infos_grey_bg address {
 font-size: 1.1em;
 line-height: 1.4em;
}


/* @end */

/* @group infos */

.infos {
 margin-bottom: 20px;
}

.infos_grey_bg {
 padding: 10px;
 background-color: #e8e6dd;
 margin-top: 10px;
}

.infos h2, .infos_grey_bg h2 {
 text-transform: uppercase;
 margin-bottom: 8px;
}

.infos h3, .infos_grey_bg h3 {
 font-size: 1.3em;
}

.infos p, .infos_grey_bg p {
 color: #444;
}


/* @end */

/* @group colonnes */
.colonnes {
 float: left;
 overflow: hidden;
}

.quatre {
 width: 170px;
 margin-right: 10px;
}

.space_after_20px {
 margin-bottom: 20px; 
}

.space_after_10px {
 margin-bottom: 10px; 
}

.space_before_20px {
 margin-top: 20px;
}


/* @end */

/* @group panier */

#panier {
 position: relative;
 padding: 10px;
 font-size: 1.1em;
}

#panier h3 {
 font-size: 1.1em;
 line-height: 1.6em;
 font-weight: normal;
 margin-bottom: 10px;
}

#panier li.underlined {
 text-align: right;
 border-bottom: 2px solid grey;
 margin-bottom: 10px;
}

#panier li.title {
 position: relative;
 margin-top: 3px;
 padding-right: 15px;
}

#panier img.remove_from_cart {
 position: absolute;
 top: 3px;
 right: 0;
 cursor: pointer;
}

#total {
 font-size: 1.3em;
 font-weight: bold;
 padding-top: 10px;
}


#renseignements label {
 display: block;
 font-size: 1.1em;
}

#renseignements p input {
 width: 300px;
 margin-bottom: 12px;
}

#renseignements select.width300px {
 width: 300px;
}

#renseignements p input[type="submit"] {
 width: auto;
 margin-top: 12px;
 margin-bottom: 12px;
}


/* @end */

#intro {
 margin: 200px auto 0 auto;
 width: 100%;
 text-align: center;
}

#intro p {
 margin-left: -20px;
}

ul.liste {
 font-size: 1.2em;
 list-style-type: disc;
 margin: 0 20px;
 line-height: 1.2em;
}

ul.liste > li {
 color: #444;
}

address.joindre {
 font-weight: normal;
 font-style: normal;
 font-size: 1.2em;
 line-height: 1.6em;
}

.media a {
 text-transform: uppercase;
 font-weight: bold;
 color: #ee5c00;
}

.rouge {
 color: red;
}

#manuscrit label {
 display: block;
}

#manuscrit input[type="text"] {
 width: 300px;
 margin-bottom: 10px;
}

#footer_links {
 float: right;
 display: inline;
 text-align: right;
}


#errorsDiv {
 color: red;
 font: bold 10px Georgia, "Times New Roman", Times, serif;
}

#errorsDiv.innerError {
 font: bold 11px Georgia, "Times New Roman", Times, serif;
 margin-bottom: 3px;
}

#errorsDiv li {
 margin-bottom: 2px;
}

#errorsDiv ul {
 margin-bottom: 10px;
}