/* carrefour css - written and maintained by Internet Architects              */
/* Yahoo fonts.css integrated. (c) 2007, Yahoo! Inc. All rights reserved.     */

/* ========================================================================== */
/* 00. base styles                                                            */

/* set base body ............................................................ */
body {font:13px/1 arial,trebuchet MS,tahoma,helvetica,clean,sans-serif; background:#fff; color:#333;}

/* general reset ............................................................ */
* {margin:0; padding:0;}
html, body, form, img, fieldset, legend, table, tbody, thead, tfoot, tr, th, td {border:none;}
li {list-style:none;}

/* hide elements from screen but not from source ............................ */
.hidden {position:absolute !important; top:auto; left:-999em !important;}

/* clearfix class ........................................................... */
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block; display:block;}

/* line-heights ............................................................. */
p, a, li, span {line-height:1.25em;}


/* ========================================================================== */
/* 01. carrefour frame                                                        */

/* carrefour site frame ..................................................... */
body {background:#fafafa url("img/body-bg.gif") left 25px repeat-x;}
body #allContainer #cf-header {background:#fcfcfc url("img/cf-head-drop-outer.gif") left bottom repeat-x;}
body #allContainer #cf-header #cf-headerWrap1 {width:75.4em; margin:0 auto; background:#fcfcfc url("img/cf-head-drop-inner.gif") left bottom repeat-x; padding-bottom:3px;}
body #allContainer #cf-main {background:#f2f2f2 url("img/body-bg.gif") left top repeat-x; margin-top:-2px;}
body #allContainer #cf-main #cf-mainWrap1 {width:75.4em; margin:0 auto; position:relative; z-index:5;}
body #allContainer #cf-main #cf-mainWrap2 {margin:0px -10px; background:url("img/cf-main-right.gif") right top repeat-y;}
body #allContainer #cf-main #cf-mainWrap3 {background:url("img/cf-main-left.gif") left top repeat-y;}
body #allContainer #cf-main #cf-mainWrap4 {background:url("img/cf-main-right-top.gif") right top no-repeat;}
body #allContainer #cf-main #cf-mainWrap5 {background:url("img/cf-main-left-top.gif") left top no-repeat;}
body #allContainer #cf-main #cf-mainWrap6 {background:url("img/cf-main-flaps.gif") center 97px no-repeat;}
body #allContainer #cf-main #cf-mainWrap7 {background:url("img/cf-main-bottom.gif") left bottom repeat-x;}
body #allContainer #cf-main #cf-mainWrap8 {background:url("img/cf-main-bottom-right.gif") right bottom no-repeat;}
body #allContainer #cf-main #cf-mainWrap9 {background:url("img/cf-main-bottom-left.gif") left bottom no-repeat; padding:0px 10px 5px 10px;}
body #allContainer #cf-main #cf-mainWrap10 {background:#fff;}
body #allContainer #cf-footer {background:#fafafa; border-top:1px solid #d8d8d8; margin-top:-24px; padding-top:24px; padding-bottom:3em;}
body #allContainer #cf-footer #cf-footer-commonWrap1 {width:75.35em; margin:0 auto; overflow:hidden;}


/* logo list ................................................................ */
.logoList {overflow:hidden; margin:1.5em;}
.logoList .img {float:left;}
.logoList ul {float:left;}
.logoList ul li {float:left;}
.logoList ul li .description {width:200px; bottom:77%; position:absolute; left:-999em; border:1px solid #f4d503; background:#fff9d6; z-index:400; padding:0.5em;}
.logoList ul li .description .arrow {width:7px; height:4px; background:url("img/logolist-arrow.gif") left top no-repeat; position:absolute; bottom:-5px;}
.logoList ul li#eshop-logo .description .arrow {right:20px;}
.logoList ul li#express-logo .description .arrow {right:20px;}
.logoList ul li#gb-logo .description .arrow {right:69px;}
.logoList ul li#hyper-logo .description .arrow {right:102px;}
/* in footer */
#cf-footer .logoList {float:right;}

/* ========================================================================== */
/* 02. cf subsite frame                                                       */

/* subsite header ........................................................... */
#sub-header { overflow:hidden; border:1px solid #C2C2C2; border-top-style:none; border-bottom-style:none; position:relative; padding-top:1px; min-height:96px; background:url("img/cf-albarde-fr.gif") right center no-repeat;}
.nl #sub-header {background:url("img/cf-albarde-nl.gif") right center no-repeat;}
#sub-header .siteLabel { margin: 2.25em 1em 1.3em 3em }


/* grid three ............................................................... */
.gridThree {padding-left:16em; margin-top:0.75em; min-height:750px;}
.gridThree .wrapper2 {padding-right:18em;}
.gridThree .wrapperIn {float:right; width:100%;}
.gridThree .content {float:left; width:100%;}
.gridThree .content .gridOne {margin:0em 3px;}
.gridThree .context {float:right; width:18em; margin-right:-18em;}
.gridThree .navigation {float:left; width:16em; margin-left:-16em;}

/* grid two right ........................................................... */
.gridTwoRight {padding-right:18em; background:url("img/grid-bg.gif") left 0.75em repeat-y; padding-left:102px; margin-left:1em; margin-top:0.75em; padding-bottom:5em; margin-bottom:-4em;  min-height:750px;}
.gridTwoRight .content {float:left; position:relative; width:100%;}
.gridTwoRight .context {float:right; width:18em; margin-right:-18em;}

/* grid two left ............................................................ */
.gridTwoLeft {padding-left:16em; min-height:750px; margin-top:0.75em;}
.gridTwoLeft .wrapper {margin-right:1em;}
.gridTwoLeft .content {float:right; width:100%;}
.gridTwoLeft .navigation {float:left; width:16em; margin-left:-16em;}

/* grid one --------------------------------------------------------------- */
.gridOne {margin:0.75em 1em; padding-bottom:5em; margin-bottom:-4em; min-height:750px;}

/* ========================================================================== */
/* 03. headings                                                               */

/* general heading declaration .............................................. */
.heading {font-size:100%; color:#f18e00;}
/* hX specifications */
h1.heading span {font-size:146.5%;}
h2.heading span {font-size:131%;}
h3.heading span {font-size:116%;}


/* ========================================================================== */
/* 04. links & buttons                                                        */

/* general link declaration ................................................. */
a {color:#003f81;}
a:hover {color:#f18e00;}


/* ========================================================================== */
/* 05. navigation                                                             */

/* secondary navigation ..................................................... */
.navSecond ul li {display:inline; margin-right:0.5em;}
/* in footer */
#sub-footer .navSecond {text-align:center; padding-top:3.15em; padding-bottom:0.35em;}
#sub-footer .navSecond ul li {background:url("img/second-footer-sep.gif") right 0.25em no-repeat; padding-right:1px;}
#sub-footer .navSecond ul li .page {text-decoration:none; font-size:93%; padding-right:0.6em;}
#sub-footer .navSecond ul li.first {background:none; margin-right:1em; color:#666;}
#sub-footer .navSecond ul li.last {background:none; padding:0; margin:0;}
#sub-footer .navSecond ul li.last .page {padding:0;}

/* sub navigation ........................................................... */
.tree {margin:0em 0.75em; overflow:hidden; background:#f0f0f0; padding-bottom:2px;}
.tree ul {border:1px solid #d7d7d7; background:#fff url("img/tree-bg.gif") right top repeat-y;}
.tree ul li {border:1px solid #fff; border-bottom:0; border-left:0; background:url("img/tree-border.gif") left bottom repeat-x; padding-bottom:1px;}
.tree ul li.level2 .page {padding-left:38px; background-position:26px 0.75em;}
.tree ul li.level3 .page {padding-left:50px; background-position:38px 0.75em;}
.tree ul li.level4 .page {padding-left:62px; background-position:50px 0.75em;}
.tree ul li .page {display:block; padding:0.25em 0.5em; text-decoration:none; background:url("img/tree-bullit.gif") 12px 0.75em no-repeat; padding-left:26px;}
.tree ul li a.page:hover {color:#f18100;}
.tree ul li.back .page {background:url("img/back.gif") 12px 0.6em no-repeat;}
.tree ul li.back a.page:hover {background-image:url("img/back-hover.gif");}
.tree ul li.active {background:none;}
.tree ul li.active .page {background-image:url("img/tree-bullit-active.gif"); background-color:#fff; font-weight:700; color:#003f81;}
.tree ul li.active ul li .page {background-image:url("img/tree-bullit.gif"); background-color:transparent; font-weight:400; }
.tree ul li.last {background:none;}
.tree ul ul {border:none; background:url("img/tree-border.gif") left top repeat-x; padding-top:1px;}
.tree ul ul li {border-right:0;}

/* alt navigation ........................................................... */
.altNav {height:2.4em;}
.altNavWrap {border-bottom:1px solid #8A8A8A; border-top:1px solid #636363; background:#0172C1 url("img/alt-nav-bg.gif") left top repeat-x; height:2.15em;}

/* ========================================================================== */
/* 06. basic content                                                          */

p {line-height:1.35em; color:#333;}

/* ========================================================================== */
/* 07. components                                                             */

/* site label ............................................................... */
.siteLabel {margin:1.25em 2em;}

/* legal notice ............................................................. */
.legal {text-align:center;color:#999; font-size:85%; margin:0em 1em; margin-bottom:0.75em; }

