﻿/* carrefour corporate 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;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

/* line-heights ............................................................. */
p, a, li, span {line-height:1.25em;}


/* ========================================================================== */
/* 01. carrefour frame                                                        */

/* carrefour site frame ..................................................... */
body #allContainer #cf-header {background:#fcfcfc url("img/cf-head-drop-outer.gif") left bottom repeat-x; padding-bottom:3px;}
body #allContainer #cf-header #cf-headerWrap1 {width:75.4em; margin:0 auto;}
body #allContainer #cf-main #cf-mainWrap1 {width:75.4em; margin:0 auto; position:relative; z-index:5;}
body #allContainer #cf-footer {background:#fafafa; border-top:1px solid #d8d8d8; padding-bottom:3em;}
body #allContainer #cf-footer #cf-footerWrap1 {width:75.4em; margin:0 auto; overflow:hidden;}

/* carrefour splash page .................................................... */

/* ========================================================================== */
/* 02. cf subsite frame                                                       */

/* subsite header ........................................................... */
#sub-header {overflow:hidden; position:relative; padding-top:1px; min-height:86px;}
.home #sub-header {background: 0;}
#sub-footer {margin-top:-2em;}

/* grid three ............................................................... */
.gridThree {padding-left:16em; margin:1em; min-height:750px; background:url(img/grid-line-bg.gif) 16em top repeat-y; padding-bottom:4em;}
.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 top repeat-y; padding-left:70px; margin:1em; min-height:750px; padding-bottom:4em;}
.gridTwoRight .content {float:left; position:relative; width:100%;}
.gridTwoRight .context {float:right; width:18em; margin-right:-18em;}
/* on homepage */
.home .gridTwoRight {background:none; padding-left:0; margin-left:0;}
/**/
.gridTwoRight .content .actions .edit {position:absolute; right:0; top:2.75em;}

/* grid two left ............................................................ */
.gridTwoLeft {padding: 0 18em 0 16em; min-height:750px; margin:1em; background:url(img/grid-line-bg.gif) 16em top repeat-y; padding-bottom:4em;}
.gridTwoLeft .content {float:right; width:100%; }
.gridTwoLeft .navigation {float:left; width:16em; margin-left:-16em;}

/* grid one --------------------------------------------------------------- */
.gridOne {margin:1em; background:url("img/grid-bg.gif") left top repeat-y; padding-left:70px; padding-right:18em; min-height:750px; padding-bottom:4em;}

/* navigation column ........................................................ */
.navigation .filter, .navigation .tree {xmargin-right:-1px;}

/* ========================================================================== */
/* 03. headings                                                               */

/* general heading declaration .............................................. */
.heading {font-size:100%; color:#003F81;}
/* hX specifications */
h1.heading span {font-size:131%; font-family: Verdana;}
h2.heading span {font-size:123.1%; color:#0093D0; xfont-weight:400;}
h3.heading span {font-size:108%;}

/* in content */
h1 {margin:1em;}
h1 a {font-size:68%; font-weight:400;}
.gridOne h3.heading span {color: #004081;}

/* ========================================================================== */
/* 04. links & buttons                                                        */

/* general link declaration ................................................. */
a {color:#0093d0;}
a:hover {color:#f18e00;}

/* back link ................................................................ */
a.back {padding-left:10px; background:url("img/back.gif") left 0.4em no-repeat; }

/* print link ............................................................... */
a.print {padding-right:30px; background:url("img/print.gif") right top no-repeat; text-decoration:none;}

/* pdf links */
a.pdf { background: url("img/pdf-icon.gif") left center no-repeat; padding-left: 25px; }

/* submit button ............................................................ */
.submit {background:#003f81; color:#fff; border:none; padding:0.1em 0.25em;}


/* ========================================================================== */
/* 05. navigation                                                             */

/* primary navigation ..................................................... */
.navMain {margin:0em 1em;}
.navMain ul.navL1 {background:#004081; overflow:hidden;}
.navMain ul.navL1 li {float: left; font-size: 85%; color: #fff; font-weight: bold;}
.navMain ul.navL1 li.active {display: block; padding: 0.5em 1.25em; background: #8FAABF;}
.navMain ul.navL1 li a:link, .navMain ul.navL1 li a:visited {color: #fff; display: block; padding: 0.5em 1.25em; text-decoration: none;}
.navMain ul.navL1 li a:hover, .navMain ul.navL1 li a:active {background: #8FAABF; color: #fff; text-decoration: none;}
.home .navMain {background: 0}
.navMain ul.navL2 {background: #8FAABF; padding: 0.35em 0 0.35em 1em; overflow: hidden;}
.navMain ul.navL2 li {float: left; font-size: 85%; color: #fff; padding: 0 0.5em; border-right: 1px solid #fff;}
.navMain ul.navL2 li.active {color: #004081;}
.navMain ul.navL2 li.last {border-right: 0;}
.navMain ul.navL2 li a:link, .navMain ul.navL2 li a:visited {color: #fff; text-decoration: none;}
.navMain ul.navL2 li a:hover, .navMain ul.navL2 li a:active {color: #004081; text-decoration: none;}


/* secondary navigation ..................................................... */
.navSecond ul li {display:inline; margin-right:0.5em;}
/* in footer */
#sub-footer .navSecond {text-align:center; 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 a.page { color: #003F81; }
#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;}
/* email */
.navSecond.email {margin-left:0.75em;}
.navSecond.email li {display:block; padding:0.1em 0em; padding-left:12px; background:url("img/faq-q-item.gif") left 0.5em no-repeat;}

/* sub navigation ........................................................... */
.tree {overflow:hidden; padding-bottom:2px;}
.tree ul {border:1px solid #DDE5EC; border-right:0; padding: 0.5em 0;}
.tree ul li {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") 8px 0.75em no-repeat; padding-left:16px; font-size: 88%; }
.tree ul li a.page:hover {color:#000;}
.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"); color:#000; font-weight:700;}
.tree ul li.active ul li .page {background:none; font-weight:400; padding-left:0;}
.tree ul li.active ul li.active .page {font-weight:700;}
.tree ul li.last {background:none;}
.tree ul ul {border:none; margin-left:2em; padding:0;}
.tree ul ul li {border-right:0;}
.tree h2.heading {background: url(img/tree-heading.gif) 0 top repeat-x; border-bottom: 1px solid #fff; color: #577E9C; font-size: 70%; padding: 0.5em 1em 0.25em;}

/* account navigation ....................................................... */
.tree.accountNav .heading {background:#fff url("img/account-head.gif") left bottom repeat-x; padding:0.25em 0.75em; border:1px solid #d7d7d7; border-bottom-width:0;}
.tree.accountNav .heading span {font-size:108%;}
.tree.accountNav ul li.active {background:url("img/tree-border.gif") left bottom repeat-x;}
.tree.accountNav ul li.active a.page:hover {background-image:url("img/tree-bullit.gif");}

/* breadcrumb ............................................................... */
.navBreadcrumb {overflow:hidden; margin:1em; margin-top:0;}
.navBreadcrumb ol li {float:left; margin-right:0.5em; background:url("img/bread-sep.gif") right 0.5em no-repeat; padding-right:10px; font-size: 88%;}
.navBreadcrumb ol li .page {color:#0093D0;}
.navBreadcrumb ol li.last {padding-right:0; background:none; color:#999999;}
.navBreadcrumb ol li.last .page {color:#999999;}

/* paging ...................................................................*/
.paging {overflow:hidden; margin:1em; border-top:1px solid #e7e7e7; padding-top:0.5em; text-align:center;}
.paging .pager {}
.paging .pager .prev, .paging .pager .next {display:inline; line-height:1.5em;}
.paging .pager .prev .page, .paging .pager .next .page {text-decoration:none; }
.paging .pager .prev .page {background:url("img/pager-prev.gif") left 0.4em no-repeat; padding-left:10px; color:#999; font-size: 88%;}
.paging .pager .prev a.page {background-image:url("img/back.gif"); color:#0092CF; text-decoration: underline;}
.paging .pager .next .page {background:url("img/pager-next.gif") right 0.35em no-repeat; padding-right:10px; color:#999; font-size: 88%;}
.paging .pager .next a.page {background-image:url("img/next.gif"); color:#0092CF; text-decoration: underline;}
.paging .pager ul {display:inline; margin:0em 1.5em;}
.paging .pager ul li {display:inline; margin-right:0.25em; font-size: 88%; }
.paging .pager ul li .page {padding:0.25em 0; width:1.25em; color: #666; }
.paging .pager ul li .page:hover {color: #004081; text-decoration: none;}
.paging .pager ul li.active .page {font-weight:bold; color: #004081;}
.paging .pager ul li.hellip {display: none; background:none;}
.paging .pager ul li.hellip .page:hover {background:none; color:#00F;}
.paging .pagerAmount {display: none; float:right; line-height:1.6em;}
.paging .pagerAmount .heading {display:inline;}
.paging .pagerAmount .heading span {font-size:100%; font-weight:400; color:#333;}
.paging .pagerAmount ul {display:inline; margin:0;}
.paging .pagerAmount ul li {display:inline; background:url("img/pager-amount-sep.gif") right center no-repeat; padding-right:1px;}
.paging .pagerAmount ul li .page {margin-right:0.4em;}
.paging .pagerAmount ul li.active .page {font-weight:700;}
.paging .pagerAmount ul li.last {background:none;}
.paging .pagerAmount ul li.last .page {margin-right:0;}

/* alt navigation ........................................................... */
.navAlt {margin:1em;}
.altNavWrap {border:1px solid #bb6e00; border-left:none; border-right:none; background:#f4a533 url("img/alt-nav-bg.gif") left top repeat-x; height:2.15em;}
.navAlt a {color: #0092CF; background: url(img/car-nav-arrow.png) 0 0.3em no-repeat; padding-left: 0.75em; font-size: 88%;}

/* ========================================================================== */
/* 06. basic content                                                          */

p {line-height:1.35em; color:#333;}


/* textblock ................................................................ */
.textblock {margin:1em;}
.textblock .heading {margin-top:1.5em; margin-bottom:0.5em;}
.textblock .heading span {color:#0092CF; font-size:108%; xfont-weight:400;}
.textblock h3.heading span {font-size:103%; color:#004081;}
.textblock p {margin-bottom:1em; color: #666; font-size:100%; line-height:1.4em;}
.textblock ul, .textblock ol {margin:1em 0em;}
.textblock ul li {padding-left:12px; background:url("img/faq-bullet.gif") left 0.45em no-repeat; color: #666; margin-bottom: 0.75em; overflow:hidden;}
.textblock ol li {list-style:decimal; list-style-position:inside; color: #666;}
.intro p {color: #004081; font-size: 104%;}

.textblock.intro:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.textblock.intro {display:inline-block; display:block;}


/* focus .................................................................... */
.focus {margin:1em;}
.focus a {color:#0093d0;}
.focus li {background: url("img/car-nav-arrow.png") 2px 0.4em no-repeat; padding-left:12px; }
.focus li a {font-size:85%;}
.focus .focusHeading {background:#004081; color:#fff; padding:0.25em 1em;}
.focus .focusHeading .heading {color:#fff;}
.focus .focusHeading .heading span {font-size:100%; color:#fff;}
.focus .focusContent {background:#fff url(img/focus-background.png) 0 bottom repeat-x; border:1px solid #e6e6e6; overflow:hidden;}
.focus .focusContent p {color:#004081; font-size: 88%; margin:1em; line-height:1.15em;}
.focus .focusContent ul {margin:1em;}
.focus.info .img,.focus.client .img {margin:0 0 0.75em 0;}
* html .focus.info .img,* html .focus.client .img {margin:0; background:#fff;}
* html .focus.info .focusContent,* html .focus.client .focusContent { background:#FFF}


.focus .img {float:right; margin:1em 1em 0.75em 0.75em; overflow:hidden;}
.row .focus .img {float:none;}
.focus .focusFooter {padding: 0.25em 1em; background:#fff; border:1px solid #E6E6E6; border-top:0px;}
.focus .focusFooter a {background: url("img/car-nav-arrow.png") 2px 0.4em no-repeat; padding-left:12px; font-size: 88%; }
.focus .navSimple {margin:0.5em 0.75em;}
.focus .navSimple ul {margin:0;}
.focus .navSimple a {background: url(img/car-nav-arrow.png) 2px 0.4em no-repeat; padding-left:10px; font-size:85%;}
.home .row {clear: left; overflow: hidden; margin:1em; margin-left:0.5em;}
.row .focus {width:17.75em; margin:0; margin-left: 0.5em; float:left;}
.row .focus p {margin:0.75em;}
.home .row .focus .focusContent {min-height:11.5em;}
.home.pressPage .row .focus .focusContent {min-height:18.5em;}
/* context focus */
.context .focus {margin:0; margin-bottom:1em;}
.context .focus .focusHeading {background: #F4F4F6 url(img/heading-background.png) 0 top repeat-x; border-bottom: 1px solid #fff; padding:0.25em 0.75em;}
.context .focus .focusHeading .heading span {color:#646464; font-weight:700; font-size:100%;}
.context .focus .focusContent {border:1px solid #ececec; background:none;}
.context .focus .focusFooter {}
/* focus double and simple */
.focus.focusDouble .focusHeading, .focus.focusSimple .focusHeading {background:none; margin:1em; padding:0; margin-bottom:0em;}
.focus.focusDouble .focusHeading .heading span, .focus.focusSimple .focusHeading .heading  span {color:#004081; font-size:116%;}
.home .focus.focusDouble .focusContent, .home  .focus.focusSimple .focusContent {min-height:11.5em; border:none;}
.focus.focusDouble .focusContent p, .focus.focusSimple .focusContent p {color: #666; font-size:93%; margin:1em;}
.focus.focusSimple .focusContent p {font-size:85%;}
.focus.focusDouble .focusFooter, .focus.focusSimple .focusFooter {border:0;}
/* focusDouble & focusSimple */
.row .focusDouble {width:35.75em; border: 1px solid #E6E6E6; margin-left: 0.5em; background: url("img/car-duurzaam1.jpg") left bottom no-repeat; position:relative;}
.row .focusSimple {border: 1px solid #E6E6E6; }
.row .focusDouble p {line-height:1.3em;}
.row .focusDouble .focusFooter {float:left; padding-right:1.5em;}
.focusDouble .focusContent {padding-right:7em; background:none;}

/* press highlight .......................................................... */
.pressHighlight {margin:1em; height:400px; position:relative; background:#c0c0c0;}
.pressHighlight .focus { position:absolute; left:1em; bottom:1em; width:25em;}
.pressHighlight .focus .focusHeading {background:#0092CF;}
.pressHighlight .focus .focusHeading span {color:#fff; font-size:108%;}
.pressHighlight .focus .focusContent {background:#fff;}

/* press list ............................................................... */
.pressList {margin:0.5em 0.75em;}
.pressList li {padding-left:4em; position:relative; margin-bottom:0.15em; background:none;}
.pressList li .heading span {font-size:100%; font-weight:700;}
.pressList li a {background:none; padding-left:0;}
.pressList li .date {position:absolute; left:0; top:0.1em; width:3.5em; text-align:right;}
/* in focus */
.pressList .focus li .heading a {text-decoration:none;}
.focus .pressList ul {margin:0;}
.focus .pressList ul p {margin:0.5em 0em; margin-bottom:1em; color:#666; line-height:1.35em;}

/* vcard .................................................................... */
.vcard {color: #004081; font-size:93%; margin:0.5em 0.75em;}
.vcard .img {float: left; clear: right; border: 1px solid #e6e6e6; margin-left: 0;}
.vcard img {float: left;}
.focus .vcard .heading {font-size:100%}
/* profile */
.vcard.profile {border-top: 1px solid #e6e6e6; margin:0.75em; position:relative; padding-left:66px;}
.vcard.profile h3 {font-size:100%; margin-top:1em;}
.vcard.profile .img {position:absolute; left:0px; top:0px;}
.vcard.profile.noImg {padding-left:0;}
.profile .role {margin-bottom: 1em;}
.profile .email .label, .profile .tel .label {display: none;}
.profile .email a {background: url(img/email-bg.gif) 0 0.25em no-repeat; padding-left: 1.5em; word-wrap:break-word;}
.profile .tel .value {background: url(img/tel-bg.gif) 0 0 no-repeat; padding-left: 1.5em; margin-bottom: 0.5em;}
.context .focus .pressList h3 span {font-weight:400; font-size:100%;}
.context .focus .pressList h3 a {background: 0; text-decoration: none; padding: 0;}
.date {color: #999; font-size: 88%; float: left;}
/* noImg*/


/* external links */
.focusContent .external, a.external {color: #0092CF; background: url(img/button-external.gif) 0 0.25em no-repeat; padding-left: 1.5em;}


/* doormat */
.navDoormat {margin:1em; overflow:hidden;}
.navDoormat ul li {float: left; width: 50%; margin-bottom: 1.25em; min-height:14em;}
.navDoormat ul li ul li { float: none; width: auto; margin-bottom: 0; min-height:0;}
.navDoormat .img {float: left; margin-top:0.25em; margin-right:0.5em; margin-bottom:0.25em;}
.navDoormat h2.heading {margin-bottom:0.25em;}
.navDoormat h2.heading span {font-weight: bold; color: #004081; font-size: 103%;}
.navDoormat p {color: #666; font-size: 88%; padding-right: 0.5em; line-height:1.2em;}
.navDoormat .nav { margin-top: 0.4em; }
.navDoormat a.more {color: #0092CF; background: url(img/car-nav-arrow.png) 0 0.3em no-repeat; padding-left: 0.75em; font-size: 88%; }

/* filter ................................................................... */
.filter {border:1px solid #DDE5EC; border-right:0; background:#F6F8FA url("img/filter-bg.gif") left 2em repeat-x}
.filter h2.heading {background:#003f81; color:#fff; padding:0.25em 1em;}
.filter h2.heading span {color:#fff; font-size:100%;}
.filter .filterblock .heading {margin:1em;}
.filter .filterblock ul {margin:1em;}
.filter .filterblock ul li {padding-left:20px;}
.filter .filterblock ul .active {background:url("img/filter-active.gif") 5px 0.35em no-repeat;}
.filter form {margin:1em;}
.filter form input {width:9em;}
.filter form input.submit {width:auto;}

/* history */
.history {margin:1em;}
.history .list {margin: 1em 0; width: 100%;  }
.history .list li {border-bottom: 1px solid #E7E7E7; padding-bottom: 0.5em; margin-bottom:0.75em; overflow:hidden; position:relative;}
.history .list li li {border:none; padding-bottom:0;}
.history .list li .img {float:left; margin-right:0.5em;}
.history .list .textblock {margin-left:50px; margin-top:0;}
.history .list .heading {padding-top:0;}
.history .list .heading span {font-weight:700; font-size:93%;}
.history .year {background:#003F81; color: #fff; font-weight:700; position:absolute;  top:0; left:0; text-align:left; width: 2.25em; padding:0em 0.25em;}
.history .paging {border-top:0; text-align:center;}

/* download list ............................................................ */
.downloadList {margin:1em;}
.downloadList li {border-top:1px solid #e7e7e7; background:none; padding:1.5em 0em; padding-left:100px; position:relative; min-height:90px;}
.downloadList li .heading {margin-right:12.5em;}
.downloadList li .img {position:absolute; left:0; top:1.5em;}
.downloadList li .img .caption {position:absolute; bottom:0; left:100px; white-space:nowrap;}
.downloadList li .heading span {font-size:100%; color:#000;}
.downloadList li div.meta {margin-right:13.5em;}
.downloadList li .meta {font-size:93%; color:#666;}
.downloadList li ul {clear:both; position:absolute; right:0; top:1.5em; xpadding-right:2em; width:12em; overflow:hidden;}
.downloadList li ul li {min-height:0; border:none; padding:0; padding-left:20px; margin-bottom:0.5em;}
.downloadList li ul li a {color:#0093D0; word-wrap: break-word;}
.downloadList li ul li .meta {font-size:85%; color:#999; margin-left:0.25em;}
.downloadList li ul li.tiff {background:url("img/tiff-icon.gif") left top no-repeat;}
.downloadList li ul li.jpeg {background:url("img/jpeg-icon.gif") left top no-repeat;}
.downloadList li ul li.doc {background:url("img/doc-icon.gif") left top no-repeat;}
.downloadList li ul li.gif {background:url("img/gif-icon.gif") left top no-repeat;}
.downloadList li ul li.pdf {background:url("img/pdf-icon.gif") left top no-repeat;}
.downloadList li ul li.png {background:url("img/png-icon.gif") left top no-repeat;}
.downloadList li ul li.ppt {background:url("img/ppt-icon.gif") left top no-repeat;}
.downloadList li ul li.xls {background:url("img/xls-icon.gif") left top no-repeat;}

/* context */
.context .downloadList {margin:0; margin-top:-1px;}
.context .downloadList ul {margin:0;}
.context .downloadList li {border-top:1x solid #cecece; padding:0.75em 0em;}
.context .downloadList li .heading {width:12em; float:right; margin-right:0;}
.context .downloadList li .meta {width:12.9em; float:right;}
.context .downloadList li div.meta {margin-right:0;}
.context .downloadList li .img {position:static; margin-right:13em; float:none; margin-top:0;}
.context .downloadList li ul {position:static; padding:0; margin:0.5em; margin-bottom:0;}
.context .downloadList li ul li {padding:0; padding-left:20px;}
.context .downloadList li ul li .meta {float:none; width:auto; font-size:85%;}
.context .downloadList li ul li a {padding-left:0; background:none;}

/* docList .................................................................. */
.docList {margin:0.75em;}
.docList li {padding-left:20px; margin-bottom:0.25em;}
.docList li a {color:#0093D0; }
.docList li .heading {display:inline;}
.docList li .meta {font-size:85%; color:#999; margin-left:0.15em; display:inline;}
/* in row */
.row .docList ul {margin:0;}
.row .docList li {padding-left:65px; position:relative; min-height:70px;}
.row .docList li .img {position:absolute; top:0; left:0; margin:0;}
.row .docList li .meta {display:block; margin-left:0;}
.row .docList li a {padding-left:0; background:none;}
/* in context */
.context .docList ul {margin:0;}
.context .docList li.pdf {background:url("img/pdf-icon.gif") left top no-repeat;}
.context .docList li a {padding-left:0; background:none;}
/* in related */
.relatedInfo .docList li.pdf {background:url("img/pdf-icon.gif") left top no-repeat; padding-left:22px;}
.relatedInfo .docList li {margin-bottom:1.5em;}
.relatedInfo .docList li .heading a {font-weight:400;}

/* related information ...................................................... */
.relatedInfo {margin:1em; border:1px solid #8FAABF; background:#F3F8FB;}
.relatedInfo .relWrap1 {margin:-1px; background:url("img/related-rb.gif") right bottom no-repeat;}
.relatedInfo .relWrap2 {background:url("img/related-lb.gif") left bottom no-repeat;}
.relatedInfo .relWrap3 {background:url("img/related-rt.gif") right top no-repeat;}
.relatedInfo .relWrap4 {background:url("img/related-lt.gif") left top no-repeat; overflow:hidden;}
.relatedInfo h2.heading {margin:1.5em; background:url("img/related-heading.gif") left top no-repeat; height:22px; width:161px;}
.relatedInfo h2.heading span {position:absolute; left:-999em; top:auto;}
.relatedInfo .docList {border-bottom:1px solid #D2DEE7; margin:1.5em;}
.relatedInfo .docList.last {border-bottom:none;}
.relatedInfo .extList {border-bottom:1px solid #D2DEE7; margin:1.5em;}
.relatedInfo .extList.last {border-bottom:none;}
.relatedInfo .extList li {margin-bottom:1.5em; padding-left:22px; background:url("img/button-external.gif") 5px 0.25em no-repeat}
.relatedInfo .extList li .heading a {font-weight:400;}


/* image .................................................................... */
.img {position:relative;}
.img .pop {position:absolute; bottom:105%; border:5px solid #bfcfdf; background:#fff; z-index:180; left:-1px;}
.img .pop .arrow {width:9px; height:5px; position:absolute; bottom:-10px; left:30px; background:url("img/image-popup-arrow.gif") left top no-repeat;}
.img .actions {position:absolute; left:0.5em; top:0.5em;}
.img .actions a.size {background:url("img/zoom.gif") right 0.35em no-repeat; padding-right:16px;}
.img .caption {color:#999; font-size:85%; font-style:italic;}
/* floate image */
.img.left {float:left; margin-right:0.5em;}

/* ========================================================================== */
/* 07. components                                                             */

/* site label ............................................................... */
.siteLabel {margin:0.75em 2em 0.5em;}

/* caption detail ........................................................... */
.spec .caption {float:left; width:7.25em; text-align:left;}
.spec .detail {margin-left:8em; display:block;}

/* overlay .................................................................. */
#overlayBase {display:none;}
#overlayBase #overlayBG {background:#eee; position:absolute; opacity:0.85; filter:alpha(opacity=85); z-index:1000; left:0; top:0;}
.overlay {position:fixed; left:50%; top:50%; z-index:1001; display:none;}

/* popUp .................................................................... */
html.jsPop, .jsPop body {height:200%; overflow:hidden; min-height:50em;}

.jsPop #overlayBG {position:absolute; height:200%; width:100%; z-index:3000;}
.jsPop #overlay {position:absolute; height:200%; width:100%; z-index:3000;}
.jsPop .popBox {position:absolute;}
.jsPop #overlayBG {height:4500%;}
.popup {position:fixed; top:50%; left:50%; z-index:1000; border:1px solid #9AC4DC; background:#fff;}
.popup .popupHeading {background:#003f81;}
.popup .popupHeading .heading {margin:0; padding:0.5em 2em;}
.popup .popupHeading .heading span {color:#fff;}
.popup .popupContent {background:#F3F3F3; border-top:1px solid #fff; overflow:hidden;}
.popup .popupContent .formbox {border:none; background:none;}
.popup .popupContent .formbox .formcontent .intro {margin:1em; font-weight:700;}
.popup .popupContent .formbox .formcontent fieldset {margin-left:1em; margin-right:1em;}
.popup .popupContent .formbox .formfooter {margin:-1em; background:#fff; padding:0.5em; border-top:1px solid #9AC4DC}
.popup .popupContent .formbox .formfooter .buttongroup {margin:0;}
.popup .close {position:absolute; right:0.5em; top:0.5em; background:url(img/question-close.gif) left 0.5em no-repeat; display:block; height:19px; letter-spacing:-999em; text-indent:-999em; width:18px;}


/* popDownload popup .............................................................. */
.popDownload { margin:0; width:50em; min-height:30em; margin-left:-25em; margin-top:-15em;}
.popDownload h2.heading span {font-size:138.5%;}
.popDownload .img {border:1px solid #bfcfdf; margin:1em; cursor:pointer;}

/* flash popup ........................................................... */
.popFlash { margin:0; width:70em; min-height:30em; margin-left:-35em; margin-top:-20em; background:#fff;}
.popFlash .popupFooter {border-top:1px solid #9AC4DC; text-align:right; padding:0.25em 0.5em;}

/* carousel ................................................................. */
.carousel {background:url("site/carousel.jpg") left top no-repeat; height:17.5em; margin:1em; margin-top:0; border: 1px solid #E5E5E5; position:relative; margin-bottom:1em;}
.carNav { position:absolute; right:1.75em; bottom:1.75em; z-index:15;}
.carNav ul li {float: left; font-weight: bold; margin-left: 0.5em;}
.carNav a {display: block; background: #004081; color: #fff; padding: 0 0.5em; text-decoration: none;}
.carNav a:hover, .carNav .active a {background:#0093D0; color:#fff;}
.carContent {position:absolute; bottom:1em; right:1em; width:26em; border: 1px solid #0092CF; background:url("img/white-85.png") left top repeat; z-index:10;}
.carContent .heading, .carContent p {margin:1em; line-height:1.3em;}
.carContent .heading span {color:#003f81;}
.carContent ol li {display: none; font-size: 93%;}
.carContent ol li .heading {margin-bottom:-0.25em;}
.carContent ol li.first {display: block; }
.carContent div.nav {margin:1em; margin-top:2em;}
.carContent div.nav a {color:#0093d0; font-size: 88%; background: url(img/car-nav-arrow.png) 0 0.3em no-repeat; padding-left: 0.75em;}

/* fiche .................................................................... */
.fiche {margin:1em 0em; padding:1em 0em; border:1px solid #ccc; border-left:0; border-right:0;}
.fiche .spec {padding:0.25em 0em;}

/* faq ...................................................................... */
.faq {margin:1em;}
.faq .sections {margin-bottom:1.5em; margin-left:0.5em;}
.faq .sections li {padding:0.1em 0em; padding-left:10px; background:url("img/faq-q-item.gif") left 0.7em no-repeat;}
.faq .section {margin:1em 0em; position:relative;}
.faq .section .heading { padding:0.25em 0.75em;}
.faq .section h2.heading {border-bottom: 1px solid #e6e6e6;}
.faq .section .heading span {font-size:93%; color:#004081;}
.faq .section .questions {margin:0.5em 1.5em;}
.faq .section .questions .heading {background:none;padding:0.25em 0em;}
.faq .section .questions .heading a {text-decoration:none; color:#3FAEDC; font-size:93%;}
.faq .section .questions .heading a:hover {text-decoration:underline;}
.faq .section .questions .heading span .nr {color:#003f81; margin-right:0.25em;}
.faq .section .questions .textblock {margin:0em 1.75em;}
.faq .section .questions .textblock p {margin:0.5em 0em 1em 0em;}
.faq .section .nav {position:absolute; top:0.35em; right:0.5em;}
.faq .section .nav a {font-size:85%; color:#003f81; text-transform:uppercase; text-decoration:none;}
.faq .exColMain {display:none;}

/* faq list ................................................................. */
.focus .faqList {margin:0.75em;}
.focus .faqList ul {margin:0;}
.focus .faqList li {padding-left:12px; background:url("img/faq-bullet.gif") left 0.45em no-repeat; margin-bottom:0.25em;}
.focus .faqList li a {text-decoration:none; padding-left:0; background:none;}


/* notification ............................................................. */
.notify {margin:1em;}
.notify .heading {margin:0.5em; margin-left:35px; font-size:100%;}
.notify p {margin:0.5em; margin-left:38px;}
/* notification tip */
.notify.tip {border:1px solid #f18e00; background:#fef9f2 url("img/notify-tip.gif") 10px 6px no-repeat; padding:0;}
.notify.tip .notifyWrap1 {margin:-1px; background:url("img/notify-tip-br.gif") right bottom no-repeat;}
.notify.tip .notifyWrap2 {background:url("img/notify-tip-tr.gif") right top no-repeat;}
.notify.tip .notifyWrap3 {background:url("img/notify-tip-bl.gif") left bottom no-repeat;}
.notify.tip .notifyWrap4 {background:url("img/notify-tip-tl.gif") left top no-repeat; padding-top:0.25em; padding-bottom:0.5em;}
/* notification confirm */
.notify.confirm {border:1px solid #DFEFD5; background:#F2F8EE url("img/notify-confirm.gif") 12px 8px no-repeat; }
.notify.confirm .heading span {color:#58AC25;}
.notify.confirm p {color:#666;font-size: 88%; margin: 0 1em 1em;}
/* notification error */
.notify.notifyError {border:1px solid #FBD9D7; background:#FDEFEE url("img/notify-error.gif") 12px 8px no-repeat;}
.notify.notifyError .heading span {color:#900;}
.notify.notifyError p {color:#F04D41; font-weight:700;}
/* notification info */
.notify.info {background:#F3F3F3 url("img/notify-info.gif") 12px 8px no-repeat; overflow:hidden;}
.notify.info p {color:#004081;}
/* notification alert */
.notify.alert {border:1px solid #F7EFDC; background:#FFFDF2 url("img/notify-alert.gif") 12px 8px no-repeat;}
.notify.alert .heading span {color:#F7B72C;}
.notify.alert p {color:#666;font-size: 88%; margin: 0 1em 1em;}

/* legal notice ............................................................. */
div.legal {display: none; text-align:center;color:#999; font-size:85%; margin:0em 1em; margin-bottom:0.75em; }

/* flash & video ............................................................ */
.flash, .video {margin:1em;}

/* help block ............................................................... */
.help {width:180px; border:1px solid #239BEF; background:#F3F8FB; z-index:400; padding:0.5em;}
.help .arrow {width:7px; height:4px; background:url("img/logolist-arrow.gif") left top no-repeat; position:absolute; bottom:-4px;}

/* ========================================================================== */
/* 08. basic form elements                                                    */

/* form box ................................................................. */
.formbox {border:1px solid #E7E7E7; margin:1em;}
.formbox .formheader {margin:1em 0em;}
.formbox .formheader .requiredNotification {text-align:right; margin-right:1em; margin-bottom:-0.75em; font-size:93%;}
.formbox .formcontent {background:#F3F3F3; padding:1px 0px;}
.formbox .formcontent .intro {margin:1em 2em;}
.formbox .formcontent .comment {margin:1em 0.75em;}
.formbox .formcontent fieldset .comment {margin:1em 0em;}
.formbox .formcontent .commentGap {margin-top:2.5em;}
.formbox .formcontent .settings {margin:2em; background:#fff; padding:1em 4em;}
.formbox .formfooter .buttongroup {margin:1em;}

/* fieldset ................................................................. */
fieldset {margin:0em 2em; margin-bottom:1.5em; margin-top:1.5em; position:relative; border-bottom:1px solid #DADADA;}
fieldset .legend {color:#003f81; font-weight:700; position:absolute; left:0; top:-0.7em;}
fieldset .fieldsetContent {padding:1.25em 0em;}
fieldset.comment {margin:1em 0em;}

/* form row ................................................................. */
.formrow {margin:0.6em 0em; font-size:93%;}
/* feedback */
.formrow .feedback {clear:left; margin-left:12.5em; line-height:1.25em; padding-top:0.25em;}
.formrow .feedback .error {background:url("img/row-error.gif") left center no-repeat; padding-left:14px; color:#900; font-size:93%;}
/* grid */
.formrow.grid {border-bottom:1px solid #CFDBE7; padding-bottom:1em; margin-bottom:1em; padding-left:1.5em;}
.formrow.grid .inputElement {width:30%; margin-right:3%; float:left;}
.formrow.grid .inputElement .inputCaption {float:none;}
.formrow.grid .inputElement .inputCaption .label {text-align:left; color:#333; font-weight:700;}
.formrow.grid .inputElement .inputControl {margin:0;}
.formrow.grid .inputElement .inputControl .controls .control {margin:0.6em 0em;}
/* subordinate boxed */
.formrow .subBoxed {clear:left; margin-left:12.5em; overflow:hidden;}
.formrow .subBoxed .notify {margin-top:0.75em; margin-bottom:0.25em; background-color:#fff;}
.formrow .subBoxed .formrow {margin-left:50px; font-size:100%;}
/* gap */
.formrow.gap {margin-bottom:1.5em;}

/* input element ............................................................ */
.formrow .inputElement {float:left; position:relative; margin:0;}
.formrow .inputElement .inputCaption {float:left; text-align:right; width:11.5em; font-weight:700; color:#666; line-height:1.5em;}
.formrow .inputElement .inputCaption .label {display:block; position:relative; line-height:1.25em;}
.formrow .inputElement .inputCaption .label .required {position:absolute; right:-0.5em; top:0.1em; font-size:108%;}
.formrow .inputElement .inputControl {margin-left:12.5em;}
.formrow .inputElement .inputControl .control .textfield {border:1px solid #ccc; width:20em;}
.formrow .inputElement .inputControl .controls .controlHint {color:#666;}
.formrow .inputElement .inputControl .controls .fieldHelp {vertical-align:middle; position:relative; z-index:100;}
/* extra */
.formrow .inputElement.extra {margin-left:0.5em;}
.formrow .inputElement.extra .inputCaption {width:auto;}
.formrow .inputElement.extra .inputControl {float:left; margin-left:0em;}
/* error */
.formrow .inputElement.inpError .inputControl .controls .textfield {border-color:#900;}
/* hidden */
.formrow.hidden .inputElement {display:none;}
/* poco */
.formrow .inputElement.poco .inputControl {	position:relative}
/* subordinate */
.formrow .inputElement .inputControl .subordinate {margin:0.5em 0em; position:relative;}
.formrow .inputElement .inputControl .subordinate label {position:absolute; left:0.25em; top:0.2em; color:#666;}
#allContainer .formrow .inputElement .inputControl .subordinate input {position:static; width:20em;}

/* checklist ................................................................ */
.formrow .inputElement.checklist .inputControl .controls .control {margin-bottom:0.75em;}

/* button group ............................................................. */
.buttongroup {overflow:hidden;}
.buttongroup .advance {float:right;}
.buttongroup .advance input {font-size:108%;}
.buttongroup .abort {float:left;}

/* textfield ................................................................ */
.textfield {font-size:100%; padding:0.12em 0em;}
/* lengths */
.formrow .inputControl .controls .textfield {width:21em;}
.formrow .numeric .inputControl .controls .textfield {width:4em;}
.formrow .numericExtra .inputControl .controls .textfield {width:16.5em;}
.formrow .municipality .inputControl .controls .textfield {width:10.35em;}
.sms .formbox .formcontent .inputElement.numericExtra input.textfield {width:13em;}
.formrow .numericDisabled .inputControl .controls .textfield {width:3.5em; text-align:center;}
.formrow .date .inputControl .controls .textfield {width:5em;}
.formrow .password .inputControl .controls .textfield {width:13em;}

/* dropdown  ................................................................ */
select {font-size:100%; padding-top:1px; border:1px solid #ccc;}

/* password ................................................................. */
.formrow .inputElement.password .inputControl .controls .control input {float:left;}

/* radio list ............................................................... */
.formrow .inputElement.checklist .inputControl .controls .control input {position:relative; top:2px;}

/* radio list ............................................................... */
.formrow .inputElement.radiolist.small .inputControl .controls .control {display:inline; margin-right:1.25em;}

/* single checkbox .......................................................... */
.formrow .inputElement.singleCheck {float:none;}
.formrow .inputElement.singleCheck .inputControl {padding-left:18px; position:relative; margin:0;}
.formrow .inputElement.singleCheck .inputControl input {position:absolute; left:0; top:0px;}
.formrow .inputElement.singleCheck .inputControl label {display:block; font-size:100%;}
.formrow .inputElement.singleCheck .inputControl .fieldHint {display:block; color:#999; margin-top:0.5em;}
/* disabled */
.formrow .inputElement.singleCheck .inputControl .disable label {color:#999;}


/* ========================================================================== */
/* 09. specific page                                                          */

.pressDetailPage .content .focus {margin-top:3em;}
.pressDetailPage h1 span .date {float:none; font-size:77%; margin-left:0.25em; padding-left:0.5em; color:#0093D0; font-weight:400; line-height:1.75em; background:url("img/date-sep.gif") left top no-repeat;}

.faqDetailPage .content .nav {margin:1em;}
.historyPage .gridOne {padding-right:0;}
/* ========================================================================== */
/* 10. splash page                                                            */

.splash {background:#F9F9F9 url("img/splash-body-bg.gif") left top repeat-x;}
.splash #allContainer {width:37em; margin:10em auto;}
.splash .splashContent {overflow:hidden; background:#fff url("img/corporate-splash.jpg") 0em 0em no-repeat; height:14.2em; padding-left:190px; border:1px solid #CCCCCC;}
.splash .splashContent .splashContentWrap {margin:4.5em 1em 0em 1em;}
.splash .splashContent h1 {margin:0 0 0.3em 0;}
.splash .splashContent h1 span {font-size:116%;}
.splash .splashContent .langChoice li {margin-bottom:2.5em;}
.splash .splashContent .langChoice li a {display:block; color:#0093D0; text-decoration:underline; padding-top:0px; padding-left:12px; font-size:100%; font-weight:700; background:url("img/splash-arrow.gif") 0em 0.4em no-repeat;}
.splash .splashContent .langChoice li a:hover {color:#004081;}
.splash .splashFooter {margin-top:10em;}
.splash .splashFooter .copyright {color:#666666; font-size:116%; text-align:center;}

/* logo list ................................................................ */
.logoList {overflow:hidden; margin:1.5em; padding-top:0.5em;}
.logoList .img {float:left;}
.logoList ul {float:left;}
.logoList ul li {float:left; margin-right:10px;}
.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#gb-logo {margin-right:0; }
.logoList ul li#gb-logo .description .arrow {right:15px;}
.logoList ul li#hyper-logo .description .arrow {right:64px;}
/* in footer */
#cf-footer .logoList {float:right;}
