/* ========================================================================== */
/* 00. base styles                                                            */

/* general reset ............................................................ */
#cf-header-common *, #cf-footer-common * {margin:0; padding:0;}
#cf-header-common img, #cf-footer-common img {border:none;}
#cf-header-common li, #cf-footer-common li {list-style:none;}

/* clearfix ................................................................. */
#cf-header-common .clearfix:after, #cf-footer-common .clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
#cf-header-common .clearfix, #cf-footer-common .clearfix {display:inline-block; display:block;}

/* ========================================================================== */
/* 01. carrefour header                                                       */

/* carrefour header ......................................................... */
#cf-header-common {background:#fcfcfc url("img/cf-head-drop-inner.gif") left bottom repeat-x; font-family:arial,trebuchet MS,tahoma,helvetica,clean,sans-serif; font-size:13px;}
#cf-header-common #cf-header-commonWrap1 {width:75.4em; margin:0 auto; background:#fcfcfc url("img/cf-head-drop-inner.gif") left bottom repeat-x; padding-bottom:3px;}

/* language navigation ...................................................... */
#cf-header-common .navLang {float:right; margin-right:1em;}
#cf-header-common .navLang ul li {float:left; background:url("img/lang-nav-sep.gif") right center no-repeat; padding-right:1px;}
#cf-header-common .navLang ul li .page {text-decoration:none; color:#003F81; margin:0.5em; display:block; font-size:93%;}
#cf-header-common .navLang ul li a:hover {color:#000;}
#cf-header-common .navLang ul li.active .page {color:#666; font-weight:700;}
#cf-header-common .navLang ul li.last {background:none;}
#cf-header-common .navLang ul li.last .page {margin-right:0;}

/* site navigation .......................................................... */
#cf-header-common .navSites {margin-left:0.75em;}
#cf-header-common .navSites li {float:left;}
#cf-header-common .navSites li a {color:#003F81;}
#cf-header-common .navSites li a:hover {color:#000;}
#cf-header-common .navSites li .page {text-decoration:none; display:block;}
#cf-header-common .navSites li .page .wrap1 {display:block; cursor:pointer;}
#cf-header-common .navSites li .page .wrap2 {padding:0px 5px; display:block; overflow:hidden;}
#cf-header-common .navSites li .page .wrap3 {margin:0.5em; display:block; font-size:93%; cursor:pointer;}
#cf-header-common .navSites li.active {margin-bottom:-7px; background:url("img/sites-nav-active-bg.gif") left bottom repeat-x; position:relative; z-index:15;}
#cf-header-common .navSites li.active .page {background:url("img/sites-nav-active-arrow.gif") center bottom no-repeat; color:#666; padding-bottom:7px;}
#cf-header-common .navSites li.active .page .wrap1 {background:url("img/sites-nav-active-bg-right.gif") right top repeat-y;}
#cf-header-common .navSites li.active .page .wrap2 {background:url("img/sites-nav-active-bg-left.gif") left top repeat-y;}
#cf-header-common .navSites .navShop {float:left;}
#cf-header-common .navSites .navStores {float:left;}
#cf-header-common .navSites .navExtra {float:left; margin-left:8em;}
/* service nav */
#cf-header-common .navSites .navExtra li.last {position:relative; z-index:20;}
#cf-header-common .navSites .navExtra li.last .page {float:left; z-index:10; position:relative;}
#cf-header-common .navSites .navExtra li.last .page .wrap2 {background:url("img/sites-nav-service-hover.gif") right center no-repeat; padding-right:15px; padding-left:0;}
#cf-header-common .navSites .navExtra li.last .page:hover .wrap2 {background:url("img/sites-nav-service-hover.gif") right center no-repeat; color:#000;}
#cf-header-common .navSites .navExtra li.lastActive .page .wrap2, #cf-header-common .navSites .navExtra li.lastActive .page:hover .wrap2 {background-image:url("img/sites-nav-service-active.gif"); color:#fff;}
#cf-header-common .navSites .navExtra li.lastActive .page .wrap3 {background:#bababa; margin:0; padding:0.5em;}
#cf-header-common .navSites .navExtra li.lastSelected .page .wrap2 {background-image:url("img/sites-nav-service-hover.gif"); color:#000;}
#cf-header-common .navSites .navExtra li.last ul {position:absolute; left:-999em; display:none;}
#cf-header-common .navSites .navExtra li.lastActive ul {position:absolute; z-index:300; border:1px solid #cfcfcf; top:100%; width:23.5em; left:0; background:#fcfcfc; display:block;}
#cf-header-common .navSites .navExtra li.lastActive ul li {float:none; position:relative; margin:0.5em; border-bottom:1px solid #f5f5f5;}
#cf-header-common .navSites .navExtra li.lastActive ul li.last {border:none; margin-bottom:0;}
#cf-header-common .navSites .navExtra li.lastActive ul li .page {float:none; display:block; padding-right:40px; padding-bottom:0.6em;}
#cf-header-common .navSites .navExtra li.lastActive ul li .page .name {display:block; color:#003F81; font-weight:700;}
#cf-header-common .navSites .navExtra li.lastActive ul li .page .desc {color:#666; font-size:85%;}
#cf-header-common .navSites .navExtra li.lastActive ul li .page:hover .name {color:#000;}
#cf-header-common .navSites .navExtra li.lastActive ul li .img {position:absolute; top:0; right:0;}
#cf-header-common .navSites .navExtra li.service {position:absolute; left:-999em; top:auto; padding-left:0px;}
#cf-header-common .navSites .navExtra li.service .wrap2 {background:none; padding-left:15px;}
#cf-header-common .navSites .navExtra li.service .wrap3 {margin-right:0.75em;}
#cf-header-common .navSites .navExtra li.service {margin-left:-15px; padding-left:0px; position:relative; top:auto; left:auto;}
#cf-header-common .navSites .navExtra li.active .page {color:#003F81;}

/* ========================================================================== */
/* 02. carrefour footer                                                       */

/* carrefour footer ......................................................... */
#cf-footer-common {background:#fafafa; border-top:1px solid #d8d8d8; padding-top:24px; padding-bottom:3em; font-family:arial,trebuchet MS,tahoma,helvetica,clean,sans-serif; font-size:13px;}
#cf-footer-common #cf-footer-commonWrap1 {width:75.35em; margin:0 auto; overflow:hidden;}
#cf-footer-common a {color:#003F81;}
#cf-footer-common a:hover {color:#000;}

/* logo list ................................................................ */
#cf-footer-common .logoList {overflow:hidden; float:right; margin:1.5em;}
#cf-footer-common .logoList .img {float:left;}
#cf-footer-common .logoList ul {float:left;}
#cf-footer-common .logoList ul li {float:left;}
#cf-footer-common .logoList ul li .description {width:200px; bottom:77%; position:absolute; left:-999em; border:1px solid #f4d503; background:#fff9d6; z-index:400; padding:0.5em;}
#cf-footer-common .logoList ul li .description .arrow {width:7px; height:4px; background:url("img/logolist-arrow.gif") left top no-repeat; position:absolute; bottom:-5px;}
#cf-footer-common .logoList ul li#eshop-logo .description .arrow {right:20px;}
#cf-footer-common .logoList ul li#express-logo .description .arrow {right:20px;}
#cf-footer-common .logoList ul li#gb-logo .description .arrow {right:69px;}
#cf-footer-common .logoList ul li#hyper-logo .description .arrow {right:102px;}

/* meta navigation .......................................................... */
#cf-footer .navCompany {float:left; margin:2.5em 1.5em;}
#cf-footer .navCompany ul li {background:url("img/meta-nav-sep.gif") right center no-repeat; float:left;}
#cf-footer .navCompany ul li .page {margin:0em 0.5em; display:block;}
#cf-footer .navCompany ul li.last {background:none;}