/*
WHO, WHAT, URL
(c) Net Efficiency Ltd
08 January 2007
*/

/* #~~ Base css to even keen all browsers including IE7 operating in IE6 quirks mode ~~# */
/* #~~ begin required styles ~~# */

html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;text-align:left;}
html,body,select,input,textarea{font-family:helvetica,arial,verdana,sans-serif;}

html,body{background: #fff;margin:0;padding:0;}
body*{line-height:1.22em;}


div,img{margin:0;padding:0;}
fieldset,img{border:0;outline:0;}

h1,h2,h3,h4,h5,h6,p,ul,ol,li,table{margin:0 0 1em 0;padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;}

cite,code,em,strong,th{font-style:normal;font-weight:normal;}
b,strong,th{font-weight:bold;}
em,i{font-style:italic;}

select,input,textarea{font:100%;}
label{display:block;}
pre,code{font:100% monospace;*font-size:100%;}

table{border-collapse:collapse;border-spacing:0;empty-cells:show;font-size:inherit;font:100%;}
th,td{border:1px solid #000;padding:4px;vertical-align:top;}

ul{margin-left:1.1em;}
ol{margin-left:2.1em;}
li{margin:0 0 0.5em 0;}
q:before,q:after{content:'';}

a,a:link,a:visited{color:#000;text-decoration:underline;}
a:active, a:hover, a:focus{color:#000;text-decoration:none;outline:none;}
a img, a:link img, a:active img, a:visited img, a:hover img, a:focus img{border:0;outline:0;}

.clearing{height:1px;line-height:1px;clear:both;font-size:0px;margin-top:-1px;}
.alttext{display:block;position:absolute;width:1px;height:1px;overflow:hidden;left:-10000px;top:-10000px;}

#skipnav{position:absolute;top:0;left:0;width:100%;font-weight:bold;color:#000;text-align:center;font-size:0.6em;}
#skipnav a, #skipnav a:link, #skipnav a:visited {display:block;position:relative;width:904px;margin: 0 auto;text-indent:-1000em;border:0;padding:2px 0 2px 2px;}
#skipnav a:focus, #skipnav a:hover, #skipnav a:active {position:relative;left:6px;text-indent:0;border:1px dotted #000;border-top:0;margin: 0 auto;color:#000;}

/* common css for typo3 */
ul.sitemap, ul.sitemap ul{list-style-position:outside;list-style-type:none;margin:0;padding:0;}
ul.sitemap ul{margin:2px 0 0 15px;padding:0;}
ul.sitemap li{margin:0 0 10px 0;padding:0;}
ul.sitemap li ul li{margin:0 0 5px 0;padding:0;}

img.align-left{float:left;clear:none;margin:0 1em 1em 0;}
img.align-right{float:right;clear:none;margin:0 0 1em 1em;}

a.align-left{float:left;clear:none;margin:0 1em 1em 0;}
a.align-right{float:right;clear:none;margin:0 0 1em 1em;}

/* #~~ end required styles ~~# */


/* NOTE: to get all browsers to use a similar font size chose a higher
up div with an ID and apply as below. It will give a font-size where 
1em = 10px approximately
 */

html,body{background: #009de9 url("main_bg.png") top center repeat-x;}

#wrapper{font-size:x-small;text-align:center;}


#allwrap{width:915px;text-align:left;margin: 0 auto;}


#banner{float:left;clear:both;width:915px;margin: 44px 0 10px;}
#logo{float:left;clear:none;width:222px;height:166px;margin:0 35px 0 8px;overflow:hidden;}
#iban{float:left;clear:none;width:650px;height:166px;overflow:hidden;}
#logo img, #iban img{outline:0;border:0;}



#topbar{float:left;clear:both;width:915px;min-height:40px;background: url("topnav.png") 0 0 no-repeat;}
#topnav{list-style-type:none;margin:0;float:left;clear:both;padding:7px 0 0;width:915px;}
#topnav li{float:left;clear:none;height:22px;overflow:hidden;}
#topnav li#tn1{width:124px;margin: 0 30px 0 20px;}
#topnav li#tn2{width:97px;margin-right:30px;}
#topnav li#tn3{width:139px;margin-right:30px;}
#topnav li#tn4{width:76px;margin-right:30px;}
#topnav li#tn5{width:84px;margin-right:30px;}
#topnav li a,#topnav li a:link,#topnav li a:visited,#topnav li span.cur {border:0;outline:0;background:none;float:left;clear:none;}
#topnav li a:hover,#topnav li a:focus,#topnav li a:active, #topnav li span.cur{border:0;outline:0;background: url("tn_ov.gif") 0 17px repeat-x;}
#topnav li a img,#topnav li a:link img,#topnav li a:visited img,#topnav li a:hover img,#topnav li a:focus img,#topnav li a:active img, #topnav li span.cur img{border:0;outline:0;}




#psform{float:left;clear:none;}
#psword{float:left;clear:none;width:140px;margin-right:6px;border:0;padding:1px 2px;}
#psbutton{float:left;clear:none;background-image:none;background-position: bottom left;background-repeat:repeat-x;width:57px;height:19px;}

#cent{float:left;clear:both;width:915px;margin:25px 0 0;}

/* default inner and home page columns */
#lhcol{float:left;clear:none;width:230px;margin-right:35px;padding-bottom:1px;}
#maincol{float:left;clear:none;width:650px;margin-right:0px;padding-bottom:1px;}
#rhcol{float:left;clear:none;width:305px;margin-right:0;padding-bottom:1px;display:none;}

/* 3 col page like the professionals page */
.n3col #maincol{width:320px;margin-right:25px;}
.n3col #rhcol{display:block;}

/* 2 col - no left column, wide main column */
.w2col #lhcol{display:none;}
.w2col #maincol{width:590px;margin-right:20px;}
.w2col #rhcol{display:block;}



#lnav{float:left;clear:both;width:230px;background: url("lhnav_top.png") top left no-repeat;}
#ilnav{float:left;clear:both;width:230px;background: url("lhnav_bot.png") bottom left no-repeat;padding:16px 0 15px;}
#iilnav{float:left;clear:both;width:222px;background: url("lhnav_mid.png") top left repeat-y;padding-left:8px;}
#iiilnav{float:left;clear:both;width:192px;background: #2788d5 url("lhnav_bg.png") top left repeat-x;min-height:387px;padding: 0 15px;}

#lhnav,#lhnav ul{float:left;clear:both;list-style-type:none;padding:0;margin:0;}
#lhnav{width:192px;color:#fff;font-weight:bold;font-size:1.5em;font-family:helvetica,arial,verdana,sans-serif;}
#lhnav li{float:left;clear:none;width:192px;margin:0 0 4px;padding:0;}
#lhnav li.lastli{margin-bottom:0;}
#lhnav li a,#lhnav li span.cur{float:left;clear:none;width:192px;margin:0;padding:0;}
#lhnav ul{padding-left:17px;width:175px;margin-top:4px;}
#lhnav ul ul{padding-left:0px;width:175px;}
#lhnav ul li{width:175px;}

#lhnav ul a,#lhnav ul a.act,#lhnav ul span.cur{width:153px;padding:0 11px;min-height:24px;}

#lhnav a,#lhnav a:link,#lhnav a:visited{color:#fff;text-decoration:none;background:none;}
#lhnav a:hover,#lhnav a:active,#lhnav a:focus,#lhnav span.cur{text-decoration:underline;}

#lhnav ul a.act,#lhnav ul a.act:link,#lhnav ul a.act:visited,#lhnav ul span.cur{background: url("lhnav_bg_all.png") bottom left no-repeat;text-decoration:none;}
#lhnav ul a:hover,#lhnav ul a:focus,#lhnav ul a:active,#lhnav ul a.act:hover,#lhnav ul a.act:focus,#lhnav ul a.act:active{color:#133b8a;background: url("lhnav_bg_all.png") top left no-repeat;text-decoration:none;text-decoration:none;}

#lhnav ul a:hover span,#lhnav ul a:focus span,#lhnav ul a:active span,#lhnav ul a.act:hover span,#lhnav ul a.act:focus span,#lhnav ul a.act:active span{background:#fff;}

#lhnav ul li a span,#lhnav ul li span.cur span{float:left;clear:both;padding:2px 0 0;}
#lhnav ul li a.act span,#lhnav ul li span.cur span{background:#5c7fb6;}
#lhnav ul li li a span,#lhnav ul li li span.cur span{padding-left:13px;}








/* breadcrumb navigation */
#crumb{float:left;clear:both;width:100%;margin:0 0 25px;padding:0;font-weight:bold;font-size:1.3em;font-family:helvetica,arial,verdana,sans-serif;color:#133b8a;}
#maincol #crumbs{list-style-type:none;float:left;clear:none;margin:0;}
#maincol #crumbs li{float:left;clear:none;font-size:100%;margin:0;line-height:130%;}
#maincol #crumbs a,#maincol #crumbs a:link,#maincol #crumbs a:visited{color:#133b8a;text-decoration:none;}
#maincol #crumbs a:active,#maincol #crumbs a:hover,#maincol #crumbs a:focus{color:#133b8a;text-decoration:underline;}



/* typography */
.n3col #lhcol h1{font-size:2.5em;line-height:140%;margin:0 0 15px;font-weight:bold;}
.n3col #lhcol h2{font-size:2em;line-height:150%;margin:0 0 20px;font-weight:bold;}
.n3col #lhcol h3,.n3col #lhcol h4,.n3col #lhcol h5,.n3col #lhcol h6{font-size:1.75em;line-height:150%;margin:0 0 20px;font-weight:bold;}
.n3col #lhcol h1.pic,.n3col #lhcol h2.pic,.n3col #lhcol h3.pic,.n3col #lhcol h4.pic,.n3col #lhcol h5.pic,.n3col #lhcol h5.pic{line-height:100%;}
.n3col #lhcol p,.n3col #lhcol li{font-size:1.3em;line-height:150%;}
.n3col #lhcol p, .n3col #lhcol ul, .n3col #lhcol ol{margin-bottom:15px;}
.n3col #lhcol li{margin:0 0 5px;}

#maincol h1{font-size:2.5em;line-height:140%;margin:0 0 15px;font-weight:bold;}
#maincol h2{font-size:2em;line-height:150%;margin:0 0 20px;font-weight:bold;}
#maincol h3,#maincol h4,#maincol h5,#maincol h6{font-size:1.75em;line-height:150%;margin:0 0 20px;font-weight:bold;}
#maincol h1.pic,#maincol h2.pic,#maincol h3.pic,#maincol h4.pic,#maincol h5.pic,#maincol h5.pic{line-height:100%;}
#maincol p,#maincol li{font-size:1.3em;line-height:170%;}
#maincol p, #maincol ul, #maincol ol{margin-bottom:15px;}
#maincol li{margin:0 0 5px;}

/* mainly used for sitemap but possible for other occurances */
#maincol li li {font-size:90%;}
#maincol li li li{font-size:100%;}

#rhcol h1{font-size:2.5em;line-height:140%;margin:0 0 15px;font-weight:bold;}
#rhcol h2{font-size:2em;line-height:150%;margin:0 0 20px;font-weight:bold;}
#rhcol h3,#rhcol h4,#rhcol h5,#rhcol h6{font-size:1.75em;line-height:150%;margin:0 0 20px;font-weight:bold;}
#rhcol h1.pic,#rhcol h2.pic,#rhcol h3.pic,#rhcol h4.pic,#rhcol h5.pic,#rhcol h5.pic{line-height:100%;}
#rhcol p,#rhcol li{font-size:1.2em;line-height:130%;}
#rhcol p, #rhcol ul, #rhcol ol{margin-bottom:15px;}
#rhcol li{margin:0 0 5px;}



/* an extra div to help the spacing in various content panels */
#maincol .content{padding:0 6px;margin:-8px 0;zoom:1}
#lhcol .content{padding:40px 15px;}
#rhcol .content{padding:8px 4px;}




/* panels */
/* this panel can be used anywhere and anyhow - but due to it's width, the full 915px, it'll split the columns apart unless it's used above or below them. */
.p915{float:left;clear:both;width:915px;padding-top:16px;background: url("top_915px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip915{float:left;clear:both;width:915px;padding-bottom:24px;background: url("bot_915px.png") bottom left no-repeat;}
.iip915{float:left;clear:both;width:891px;background: url("mid_915px.png") 0 0 repeat-y;padding: 0 8px 0 16px;}
.iiip915{width:891px;float:left;clear:both;margin:-8px 0;position:relative;}

.p650{float:left;clear:both;width:650px;background: url("top_650px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip650{float:left;clear:both;width:650px;background: url("bot_650px.png") bottom left no-repeat;padding:16px 0 24px;}
.iip650{float:left;clear:both;width:626px;background: url("mid_650px.png") 0 0 repeat-y;padding: 0 8px 0 16px;}
.iiip650{width:626px;float:left;clear:both;margin:-8px 0;position:relative;}

.p590{float:left;clear:both;width:590px;background: url("top_590px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip590{float:left;clear:both;width:590px;background: url("bot_590px.png") bottom left no-repeat;padding:16px 0 24px;}
.iip590{float:left;clear:both;width:566px;background: url("mid_590px.png") 0 0 repeat-y;padding: 0 8px 0 16px;;}
.iiip590{width:566px;float:left;clear:both;margin:-8px 0;position:relative;}

.p320{float:left;clear:both;width:320px;background: url("top_320px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip320{float:left;clear:both;width:320px;background: url("bot_320px.png") bottom left no-repeat;padding:16px 0 24px;}
.iip320{float:left;clear:both;width:296px;background: url("mid_320px.png") 0 0 repeat-y;padding: 0 8px 0 16px;;}
.iiip320{width:296px;float:left;clear:both;margin:-8px 0;position:relative;}

.p305{float:left;clear:both;width:305px;background: url("top_305px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip305{float:left;clear:both;width:305px;background: url("bot_305px.png") bottom left no-repeat;padding:16px 0 24px;}
.iip305{float:left;clear:both;width:281px;background: url("mid_305px.png") 0 0 repeat-y;padding: 0 8px 0 16px;;}
.iiip305{width:281px;float:left;clear:both;margin:-8px 0;position:relative;}

.p230{float:left;clear:both;width:230px;background: url("top_230px.png") 0 0 no-repeat;margin-bottom:16px;}
.ip230{float:left;clear:both;width:230px;background: url("bot_230px.png") bottom left no-repeat;padding:16px 0 24px;}
.iip230{float:left;clear:both;width:206px;background: url("mid_230px.png") 0 0 repeat-y;padding: 0 8px 0 16px;;}
.iiip230{width:206px;float:left;clear:both;margin:-8px 0;position:relative;}

/* default/small corners for panels */
.smc_tr,.smc_tl,.smc_bl,.smc_br{position:absolute;width:5px;height:5px;z-index:40000}
.smc_tr{background: url("in_corner_tr.png") top right no-repeat;top:0px;right:0px;}
.smc_tl{background: url("in_corner_tl.png") top left no-repeat;top:0px;left:0px;}
.smc_bl{background: url("in_corner_bl.png") bottom left no-repeat;bottom:0px;left:0px;}
.smc_br{background: url("in_corner_br.png") bottom right no-repeat;bottom:0px;right:0px;}



/* special proffessional panels */
#rhcol .rhprof{margin-bottom:2px;}
#rhcol .rhprof h3{margin:3px 0;}
#rhcol .rhprof p{margin:0 0 5px;}
#rhcol .rhprof a.align-left{margin-bottom:2px;}


/* consumer page */
.vpan{margin:3px 0 5px;}
.lastvpan{margin-bottom:0px;}
a.play_button{float:left;clear:none;display:block;margin:5px 0 0 -7px;}

.themes{float:left;clear:both;padding:0 35px;margin:6px 0 2px;width:821px;}
.theme{float:left;clear:none;width:263px;margin:0 15px 0 0;}
.themes .last{margin-right:0;}
.theme a.align-left{margin-bottom:0;}
.themes h3{margin:3px 0;}
.themes p{font-size:1.2em;line-height:130%;margin-bottom: 0 0 5px;}




/* content pictures with shadows */
#maincol span.s_pic{float:right;clear:none;margin:0 0 1em 1em;position:relative;overflow:hidden;display:block;}
#maincol span.s_pic img.shad{float:left;clear:none;margin:0;padding:0;}
#maincol span.s_pic .sp_top{float:left;clear:both;background: url("img_masks/top.gif") 0 0 no-repeat;padding-top:4px;display:block;}
#maincol span.s_pic .sp_bot{float:left;clear:both;background: url("img_masks/bottom.gif") bottom left no-repeat;display:block;padding-bottom:10px;}
#maincol span.s_pic .sp_left{float:left;clear:both;background: url("img_masks/left.gif") 0 0 no-repeat;display:block;padding-left:11px;}
#maincol span.s_pic .sp_right{float:left;clear:both;background: url("img_masks/right.gif") top right no-repeat;display:block;padding-right:4px;}
#maincol span.s_pic .sp_tlc{z-index:211;width:14px;height:11px;position:absolute;top:0;left:0;background: url("img_masks/tl_corner.gif") 0 0 no-repeat;display:block;font-size:1px;line-height:1px;}
#maincol span.s_pic .sp_trc{z-index:212;width:15px;height:11px;position:absolute;top:0;right:0;background: url("img_masks/tr_corner.gif") 0 0 no-repeat;display:block;font-size:1px;line-height:1px;}
#maincol span.s_pic .sp_blc{z-index:213;width:14px;height:12px;position:absolute;bottom:0;left:0;background: url("img_masks/bl_corner.gif") 0 0 no-repeat;display:block;font-size:1px;line-height:1px;}
#maincol span.s_pic .sp_brc{z-index:214;width:15px;height:12px;position:absolute;bottom:0;right:0;background: url("img_masks/br_corner.gif") 0 0 no-repeat;display:block;font-size:1px;line-height:1px;}



#foot{float:left;clear:both;position:relative;width:915px;background: url("foot_top.png") 0 0 no-repeat;padding:9px 0 0;font-size:0.9em;margin:55px 0 25px;}
#ifoot{float:left;clear:both;width:915px;background: url("foot_bot.png") left bottom no-repeat;padding: 0 0 14px;}
#iifoot{float:left;clear:both;width:907px;background: url("foot_side.png") 0 0 repeat-y;padding-left:8px;}
#iiifoot{float:left;clear:both;width:745px;padding: 0 27px 0 135px;background: #f0f0f0 url("foot_mid.png") bottom left no-repeat;}
#iiiifoot{float:left;clear:both;margin-top:-5px;}

#foot p{color:#000;margin-bottom:0;}
#foot a,#foot a:link,#foot a:visited{text-decoration:none;color:#000;}
#foot a:hover,#foot a:active,#foot a:focus{text-decoration:underline;color:#000;}

#ccl_logo{position:absolute;top:2px;left:29px;width:88px;height:31px;}