/* defaults */
html{ color:#666; }
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0px; padding: 0px; background: transparent; }
body { font: 13px Arial, Helvetica, Garuda, sans-serif; line-height: 1;   background:#f1f1f1;}
img { border: 0px solid #FFF; }
a { text-decoration: none; color: #4b4a4a; }
#main a:hover{color:#666;}
#main a{color:#F7982B;}


/* goods */
#page { background: transparent url(imgs/halfbar.png) repeat-x; padding: 15px 0 0 0; position: relative; top: 0px; margin-top:-50px; min-height: 1%}
#main { width: 1024px; margin: 20px auto; position: relative; top: 0px; border: 0px solid #000; }

#main img{margin-bottom:20px;}

#header-wrap{background: #FFFFFF url(imgs/bb_bk.jpg) no-repeat center 10px;}
#header { width: 1024px; margin: 0px auto; position: relative; top: 0px; border: 0px solid #000; }
#logo { padding-top: 25px; position: relative; width: 345px; height: 150px;margin-left:-30px;}

/* nav stuff
	one image, shifts the clipping. like making an image map!
	*_current is the page, needs both lines to get right
	if a third state is to be use, *_current would get separated from *:hover
	couldn't compact these rules as they are different widths...
*/
#nav { height: 54px; background: transparent  no-repeat; position: absolute; top: -3px; right: 40px; font-family:Tahoma,Arial, sans-serif;}
#nav ul { list-style-type: none; text-align: center; clear: left; }
#nav ul li{float:left;}
#nav ul li a{background: transparent url(imgs/globalnav-middle.jpg) right 0px no-repeat; display:block;padding:20px;}
#nav ul li a.first{background: transparent url(imgs/globalnav-left.jpg) no-repeat right  0px ;padding-left:30px}
#nav ul li a.last{background: transparent url(imgs/globalnav-right.jpg) no-repeat right 0px;padding-right:25px;}

#nav ul li a:hover,#nav ul li a.active{background-position:right -72px;}



/* billboard */
#billboard { position: relative; top: -50px; margin: 0px auto; width: 1024px; padding-bottom: 10px; }
#billboard.home{height:320px;}
.bb-text{display:none;}
.bimg1, .bimg2 { position: absolute; top: 0px; left: 0px; }
.spin { padding: 40px 0 0px 64px; width: 860px;}
.spin h2 { font-size: 195%; color: #f79627;padding-top:10px;}
.spin p { padding-top: 10px; font-weight: bold; font-size: 150%; line-height: 1.8;color:#000; }

/* content variations */
#content { padding: 20px 20px 20px 64px; font: 110% Arial, Helvetica, Garuda, sans-serif; line-height: 1.8; position: relative; top: 0px; width: 530px; float: left; min-height: 400px; }

/* why */
#contentfull { padding: 20px 20px 20px 64px; font: 110% Arial, Helvetica, Garuda, sans-serif; line-height: 1.8; position: relative; top: 0px; width: 900px; float: left; min-height: 400px; }
/* about */
#contentmore { padding: 20px 20px 20px 64px; font: 110% Arial, Helvetica, Garuda, sans-serif; line-height: 1.8; position: relative; top: 0px; width: 600px; float: left; min-height: 400px; }
#contentmore ul { list-style-type: none; width: 570px; margin-bottom:30px; }
#contentmore ul li { background: #F79628; margin: 12px 12px 12px 6px; padding-left:20px; }
#contentmore ul li span { background: #E6E5E4; padding: 15px 50px 15px 20px; display: block; line-height: 1.6; }
#contentmore p, #contentfull p,#content p { margin-bottom: 20px;  }
#contentmore h2, #contentfull h2 { font-size: 135%; color: #F7982B; }
#contentfull .section {margin-bottom: 60px; }
#contentfull .sectionpic { float: left; margin: 2px 70px 200px 0px; background: #E8E6E6; width: 275px; height: 180px; clear: both; }

#contentmore ul li.check{background:url(imgs/check.gif) no-repeat transparent 0px 4px;margin-bottom:20px;padding-left:30px;}

/* leader */
#leadercontent { padding: 20px 20px 20px 64px; font: 110% Arial, Helvetica, Garuda, sans-serif; line-height: 210%; position: relative; top: 0px; width: 980px; float: left; min-height: 400px; }
.leader { position: relative; margin: 20px 80px 40px 0px; width: 406px; height: 205px; float: left; background: transparent url(imgs/leader_bk.png) no-repeat; }
/* ie needs help in ie8.js! yes, it's the same style*/
.leaderpic { margin: 15px 15px 0px 25px; width: 148px; float: left;}
.leaderinfo { margin-top: 30px; float: left; width: 190px; padding-right:20px;}
.leadername { font-size: 147%; font-weight: bold; display: block; margin-bottom: 5px; color:#000; }
.leadertitle { font-size: 120%; font-style: italic; color: #666; display: block; margin-bottom: 15px; line-height: 1.2; height:3em;}
.leadertag { color: #666; display: block; line-height: 1.4; }

.callout{background:#E6E5E4;padding:20px;margin-bottom:20px;}
.callout p{margin-bottom:20px;}
p.caption{text-align:center;margin-bottom:0px !important;font-style:italic;}

/* sidebar */
#sidebar { width:314px;   float: right; }
#sidebar h3{margin-bottom:10px;line-height:150%;font-size:1.2em;}

address{font-style:normal;line-height:150%;}

.box{background: transparent url(imgs/box-bkg-middle.jpg) repeat-y;}
.box-top{background: transparent url(imgs/box-bkg-top.jpg) repeat-y;height:5px;}
.box-btm{background: transparent url(imgs/box-bkg-btm.jpg) no-repeat bottom;margin-bottom:30px;height:25px;}

.newsitem { padding: 10px 20px; color: #333333;width:86%;border-bottom:1px solid #ccc;border-top:1px solid #fff;}

#sidebar .first{border-top:none;}
#sidebar .last{border-bottom:none;}

.newstitle { font-size: 96%; font-weight:bold;display:block;line-height:134%; padding: 6px 0 6px 0;}
.newsdesc { }
a.morelink { background:transparent url(imgs/more.gif) no-repeat scroll 40px 3px; color:#CC6600; display:block; height:17px; line-height:1; padding:5px 0 0; }

a.back{background:transparent url(imgs/back.gif) no-repeat scroll 0px 3px; color:#CC6600; display:block; height:17px; line-height:1; padding:5px 0 0 25px; }

/* footer */
#footer { clear: both; padding: 10px 0px 10px 68px; height: 40px; color: #666; position: relative; width: 1024px; left: 0px;  }
#footnav { float: left; position: relative; width: 600px; height: 20px; left: 0px;}
#footnav a { color: #666; padding-right: 10px; }
#footnav a:hover{color:#000;}
#copy { position: absolute !important; top: 0px; right: 72px;text-align:right; width: 200px; height: 20px;  }