@import url("fonts.css");
@import url("base.css");
/* the import rules above cannot be deleted, they provide the base css ------ */

/* ========================================================================== */
/* 01. page main structure                                                    */
/* ========================================================================== */

/* general font declaration */
#allContainer {font-size:85%;}

/* main width declaration */ /* IE6 FIX IN ie6.css */
#cf-header .mainNav .gridOne, #cf-header .portalNav .gridTwoLeft, #cf-main {width:86.4em; margin:0 auto;}

#cf-header .portalNav {background-color:#878787;}
#cf-header .mainNav {background:#e2e2e2 url("img/sitenav-bg.gif") bottom left repeat-x;}

/* ========================================================================== */
/* 02. grids                                                                  */
/* ========================================================================== */

/* grid two left ------------------------------------------------------------ */
#cf-header .gridTwoLeft .wrapper {margin-left:10em;}
#cf-header .gridTwoLeft .col-1 {float:left; width:10em; margin-left:-10em;}
#cf-header .gridTwoLeft .col-2 {float:right; width:100%;}

/* ========================================================================== */
/* 03. titles                                                                 */
/* ========================================================================== */

/* general heading declaration ---------------------------------------------- */
h1, h2, h3, h4, h5, h6 {font-size:100%; color:#2483b3;}

/* koppen ------------------------------------------------------------------- */
h1.title span {font-size:140%;}
h2.title span {font-size:130%;}
h3.title span {font-size:125%;}
h4.title span {font-size:115%;}
h5.title span {font-size:110%;}
h6.title span {font-size:100%;}

/* ========================================================================== */
/* 05. navigation                                                             */
/* ========================================================================== */

/* language navigation ------------------------------------------------------ */
#cf-header .langNav {margin:0.5em 0em;}
#cf-header .langNav ul li {float:left; padding-left:1px; background:url("img/portal-sep.gif") left center no-repeat;}
#cf-header .langNav ul li .page {margin:0em 0.5em; color:#dfdfdf; text-transform:uppercase; text-decoration:none;}
#cf-header .langNav ul li.first {background:none; padding-left:0;}
#cf-header .langNav ul li.first .page {margin-left:0;}
#cf-header .langNav ul li.active .page {font-weight:700; color:#ffffff;}

/* secondary navigation ----------------------------------------------------- */
#cf-header .secondNav {margin:0.5em 0em; float:right;}
#cf-header .secondNav .title {float:left; margin-right:0.75em; padding-left:23px; background:url("img/icon-cf-be.gif") left 0.1em no-repeat;}
#cf-header .secondNav .title a {text-decoration:none; color:#ffffff; font-weight:700;}
#cf-header .secondNav ul {float:left;}
#cf-header .secondNav ul li {float:left; padding-left:1px; background:url("img/portal-sep.gif") left center no-repeat;}
#cf-header .secondNav ul li .page {margin:0em 0.75em; color:#ffffff; font-weight:700; text-decoration:none;}
#cf-header .secondNav ul li .page:hover {color:#e2e2e2;}
#cf-header .secondNav ul li.last .page {margin-right:0;}

/* site nav ----------------------------------------------------------------- */
.siteNav {padding-top:1em;}
.siteNav ul li {float:left; background:url("img/mainnav-sep.gif") right top no-repeat; padding-right:2px;}
.siteNav ul li.last {background:none;}
/* second level */
.siteNav ul ul {margin-right:1.25em;}
.siteNav ul ul li {margin-left:1.25em; background-image:none; padding:0;}
.siteNav ul ul li .page {text-decoration:none; display:block; padding:0.5em; color:#616161;}
.siteNav ul ul li .page:hover {color:#000000;}
.siteNav ul ul li.mobile, .siteNav ul ul li.energy, .siteNav ul ul li.products, .siteNav ul ul li.simply, .siteNav ul ul li.disney { background:url("../images/site/mainnav-sep.gif") right top no-repeat; padding-right:8px;}
.siteNav ul ul li.mobile span {color:#333333;}
.siteNav ul ul li.energy span {color:#88b03c;}
.siteNav ul ul li.products span {color:#005bab;}
.siteNav ul ul li.assist span {color:#006D9F;}
.siteNav ul ul li.last {background:none;}

/* list of main sites */
.siteNav ul li.first ul li {height:2.25em;}
.siteNav ul li.first ul li .page img {vertical-align:bottom;}
.siteNav ul li.first ul li.first {margin-left:0em;}
.siteNav ul li.first ul li.first .page {padding-left:0;}
/* active styling */
.siteNav ul ul li.active .page {font-weight:700; padding:0; background:#ffffff url("img/tab-left.gif") left bottom repeat-y;}
.siteNav ul ul li.active .page span {display:block;}
.siteNav ul ul li.active .page span.wrap1 {background:url("img/tab-right.gif") right bottom repeat-y; height:2.55em; padding-bottom: 2px;} /* height changed in ie.css */
.siteNav ul ul li.active .page span.wrap2 {background:url("img/tab-top.gif") left top repeat-x;}
.siteNav ul ul li.active .page span.wrap3 {background:url("img/tab-top-left.gif") left top no-repeat;}
.siteNav ul ul li.active .page span.wrap4 {background:url("img/tab-top-right.gif") right top no-repeat; padding:3px 5px 0px 3px;}
.siteNav ul ul li.active .page span.wrap5 {padding:0.5em 0.75em; padding-bottom:0.25em;}