/*Version 1.0 -- Contest Version */
/* ------ Section 1 - Global Body, Font and Link Settings ------ */

body {
background-color: #FFF; /* aqua color for browser window background color and footer top border */
margin: 0;
padding: 0;
font-family: Verdana, Arial, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
color: #000;
font-size: 80%;
/*background-image: url(../image-files/logosutra-bg.gif);
background-position: bottom right;
background-attachment: fixed;
background-repeat: no-repeat;
*/
background-image: url(../image-files/bglogosutra.png);
background-repeat: repeat-x;
background-position: bottom;
background-attachment: fixed;
}

h1, h2, h3, h4, h5, h6 {
font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande',  sans-serif;
background-color: transparent; color: #cc0033; /*  dark red */ clear: both; }

h2, h3, h4, h5, h6 { margin-top: 30px; margin-bottom:0; /* to bring paragraph closer to headline */ margin-left:-10px;}

h1, .threed {
font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
font-size:150%;margin-top: 10px;text-align: center;color:#ff0033;line-height:35px;margin-bottom:0px;}

h2 {font-size:130% }
h3 {font-size:120%; border-bottom: 0 solid #8f8fb3;}
h4 {font-size:115% }
h5 {font-size:110% }
h6 {font-size:105%;}

.Liner {padding: 10px;}

p, ul, ol{line-height:18px; margin:5px 0 10px;}
dt {margin-top:10px;}

code {font-size:100%; color:gray; border:1px dotted #ccc;}

img {border: 0 solid #ddd;}

a:link img {border: 0;}

.bg {background-color:#e5e5e5; line-height:30px;}

/* -- General Link Styling -- */

a:link {color: blue; text-decoration: underline;}
a:visited {color: purple;text-decoration: underline;}
a:hover {color: red; text-decoration: underline;}

/* ------ Section 2 - Global Page Structure ------- */

#PageWrapper {width: 960px; }

#Header, #Header1, #Header2, #Header3 {position: relative;height: 60px; padding:5px 0;}
/* the 3 shmtl within header  logo- left 468 - center gosearch-right */
#logohome1, #logohome2,#logohome3 {float:left; width:232px;background:#ffb url(../image-files/logohome31.gif);height:60px;}
#logohome1 {background-image: url(../image-files/logohome31.gif); border:1px solid #aaa;border-top:1px solid #eee;border-right:1px solid #eee;}
#ban468{float:left; width:468px; height:60px; margin-left:20px;font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande',  sans-serif;}
#ban468 ul ,#sbi ul {list-style-type: none;padding: 0;}
#ban468  ul li, #sbi ul li {display: inline;text-align: center; margin-left:18px; line-height:20px; font-size:12px;}

#ban468h{float:left; width:468px; height:60px; /*border:1px dotted black;*/background-color:#eee;}
#ban468h h1 { font-family: 'Times New Roman', 'Lucida Sans Unicode', 'Lucida Grande', Arial, Verdana,  sans-serif;  width:468px; font-size:18px;line-height:24px; letter-spacing:2px;font-style:italic; padding:0px 0 0;background-color:transparent;}
#gsearch1 {clear:right; float:right; width:220px;padding-top:7px;}

#ContentWrapper {float: left;width: 100%; }

#ContentColumn {margin: 0 400px 0 0px;   /* STEP 1: set to "0 ExtraColumnWidth 0 NavColumnWidth" */}
#NavColumn {float: left;width: 180px; margin-left: -400px;}
#ExtraColumn {float: left;width: 180px;margin-left: -200px;}
#Footer {clear: both;padding: 0;margin: 0 ;}

#Header .Liner, #Header1 .Liner, #Header2 .Liner, #Header3 .Liner {padding: 0;}

#ContentColumn .Liner {padding:10px 30px;}
#ExtraColumn .Liner{padding:10px 5px;}
#Footer .Liner {margin: 0;padding: 0;}

/* ------ Section 3 - Page Structure Details ------ */

#PageWrapper {margin: 0px auto;background-color:transparent;min-height:500px;}
/*
#Header {background-image: url(../image-files/header21.gif);}
#Header1 {background-image: url(../image-files/header11.gif);}
#Header2 {background-image: url(../image-files/header21.gif);}
#Header3 {background-image: url(../image-files/header31.gif);}
#Header, #Header1, #Header2, #Header3 {
background-repeat: no-repeat;background-color:#fff;background-position: top left;border:10px solid #eee;border-right:10px solid #ddd;border-left:10px solid #ddd;}
*/

#Header {background-color:#fff; background-color:transparent;}
#ContentWrapper {background-color: transparent;}

#ContentColumn, #ContentColumn1 {
background-color:#fff;/*border:10px solid #dddddd;border-bottom:10px solid #ccc;border-top:10px solid #ccc;  min-height:1350px;*/}
#NavColumn , #NavColumn2 {
background-color:#ccc;border:10px solid #eee;border-right:10px solid #ddd;border-left:10px solid #bbb;border-bottom:10px solid #aaa;min-height:1350px;}
#ExtraColumn, #ExtraColumn2 {
border:10px solid #fff;/*min-height:1350px;*/background-color:#fff;}
#Footer {
text-align: center;font-size: 85%;border-top:4px double #ccc; height:110px;}

#NavColumn, #NavColumn2  {font-size: 90%;color: black;}
#ExtraColumn {font-size: 90%;}

#NavColumn h4, #NavColumn2 h4 {font-size: 100%;margin:20px 0; line-height:20px;}
#ExtraColumn h4 {margin-top: 0;}
#ExtraColumn p {margin-bottom:20px;} 

/* ------ Section 4 - Left Column Navigation ------ */

.Navigation {
width: 100%;
font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
background-color: transparent;}

/* -- Nav Headers -- */

.Navigation h3 {
padding: 0;font-size: 110%;color: #c03;border-bottom: 1px solid #e5e5e5;margin: 0px 0 12px;line-height:30px;
border-bottom:2px groove #f5f5f5;}
.Navigation h4 {
padding: 0;font-size: 90%;color: #c03;background-color:#ffc;margin: 0 0 12px;line-height:30px; text-align:center;}
/* -- Nav List -- */

.Navigation ul {list-style-type: none;padding: 0 0 8px 0px;margin: -6px 0 0 0;}
.Navigation li {margin-bottom: 5px;}

/* -- Navigation Link styles -- */

.Navigation a:link {
color: blue;display: block; /*  this makes the whole box highlight rather than just the text */padding: 3px 0 3px 4px;text-decoration: none;}
.Navigation a:visited {
color: purple;display: block;/*  this makes the whole box highlight rather than just the text */ padding: 3px 0 3px 4px;text-decoration: none;}
.Navigation a:hover {
color: red;display: block;/*  this makes the whole box highlight rather than just the text */ padding: 3px 0 3px 4px;background-color: #ffc;/* light yellow */text-decoration: underline;}

/* ------ Section 5 - Additional Navigation ------ */

/* -- Thumbnail-with-Caption Navigation -- */

.ThumbnailLink, .Caption {text-align: center; }
.ThumbnailLink p {}
.ThumbnailLink a:link {text-decoration: none;}
.ThumbnailLink a:hover .Caption {text-decoration: underline;color: red;}

/* -- Horizontal Text NavBar -- */

.ExtraNav {font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;}

.ExtraNav ul {list-style-type: none;padding: 0;}
.ExtraNav ul li {display: inline;text-align: center; margin-left:10px;}

.ExtraNav a:link {color: blue;text-decoration: none;text-align: center;padding: 0;}
.ExtraNav a:visited {color: purple;text-decoration: none;}
.ExtraNav a:hover {color: red;background-color: #d3e4fb;text-decoration: underline;}

#Header .ExtraNav, #Header1 .ExtraNav, #Header2 .ExtraNav, #Header3 .ExtraNav {
font-size: 85%; position: absolute; top: 0;right: 0;/* to adjust to normal list*/}

#Header .ExtraNav ul, #Header1 .ExtraNav ul,#Header2 .ExtraNav ul, #Header3 .ExtraNav ul   { 
margin: 0;}

#Footer .ExtraNav {margin: 1px auto;}
/* ------ Section 6 - Boxes ------ */

.CalloutBox {
background-color:#ffffcc;width: 85%;margin: 18px auto 24px auto;margin: 10px auto;padding:20px;border: 5px solid #ffcc66;text-align:left;}
div.CalloutBox p {margin: 13px;}
div.CalloutBox h1,div.CalloutBox h2, div.CalloutBox h3,div.CalloutBox h4,div.CalloutBox h5,div.CalloutBox h6 {margin: 0;} 
div.CalloutBox  h2{text-align:left;color: #cc0033; font-size:17px;}

.cobDemo {
background-color:#fff;width: 85%;margin: 10px auto;padding:20px;border: 5px solid #f5f5f5;}

.cobQuote, blockquote {
background-color:#f0f0f0;width: 410px; /* % caused link to move when mouseover*/margin: 10px auto;padding:20px;border: 6px solid #ccc;}

.ReminderBox {          
background-color: #ddd;width: 85%;margin: 10px auto; color: #006;border: groove blue 6px;padding:8px;}
.ReminderBox h4 {margin:0 ;padding: 2px;text-align: center;}
.ReminderBox p {font-size: 85%; /*padding: 10px 0 0;*/ line-height: 150%;}

.AdSenseBoxLeft, .AdSenseBoxRight, .AdSenseBoxCenter468, .AdSenseBoxExtraColumn {
padding: 5px;background-color: #d3e4fb;border: 0px;}
.AdSenseBoxLeft {margin: 0 18px 12px 18px;float: left;}
.AdSenseBoxRight {margin: 0 18px 12px 18px;float: right;}
.AdSenseBoxCenter468 {width: 468px;margin: 0 auto 12px auto;clear: both;}
.AdSenseBoxExtraColumn {padding: 0;margin: 0 auto 12px auto;clear: both;}
.ReturnToNavBox {
background-color: #fff;width: 90%;border-top: 1px solid #8f8fb3;border-bottom: f1px solid #8f8fb3;margin: 0 auto 12px auto;padding: 4px;}

/* -- RSS Box -- */

#RSSbox {
width: 148px;background-color: #ffc;border: 1px solid #8f8fb3;margin: 8px auto 10px 3px;padding: 2px 2px 10px 2px;font-size: 100%;font-weight: bold;color: #1d487e;line-height: 120%;text-align: center;}

/* ------ Section 7 - Frequently Used Styles ------ */

.Clear {clear: both;}

.Caption {
font-size: 85%;font-weight: bold;color: #000;display: block;line-height: 150%;margin-bottom:10px;}

/* -- floats -- */

.ItemRight {float: right;margin: 2px 0 12px 18px;text-align: center;}
.ItemCenter {margin: 2px auto 12px auto;text-align: center;clear: both;}
.ItemLeft {float: left;margin: 2px 18px 12px 0;text-align: center;}

/* -----------   Misc -------*/

.fav {list-style-image: url(../image-files/ls-favicon.gif);}
.cobheadg {margin-top:0;}
.lineunder {border-bottom:1px dotted #ccc;}
.lef{text-align:left;}
.rig {text-align:right;}

.flef {float:left; font-size:11px;margin-top:0px;}
.frig{float:right;font-size:11px;margin-top:0px;}

/*  1 column */
#ContentColumn1 {margin: 0px; padding:10px 30px;}
#ContentColumn1 dt {font-weight:bold; margin-left:10px;}
#ContentColumn1 dd {margin:0 0 10px 30px;}

#Footer1 {clear: all;padding: 0;margin: 0 ;}
#Footer1 {
text-align: center;font-size: 85%;border: 10px solid #ccc;background-color:#f5f5f5;border-top:10px solid #ddd;}

.box3001, .box3002, .box3003 {width:200px; float:left; border:1px dotted #ccc; background-color:white;clear:right; min-height:100px;text-align:center; margin:10px 40px 20px; padding:0 0 15px;}
/*.box3002 {margin-left: 100px; margin-right:100px; }*/

.box3001 h2 {text-align:center;margin-top:10px;}
.box3002 h2 {text-align:center;margin-top:10px;}
.box3003 h2 {text-align:center;margin-top:10px;} 

.logobox {float:left; width:60px; height:60px; margin-right:60px;}

#ExtraColumn {
background:#fff;font-family: Arial, Verdana, 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;}

.ExtraColNav{width: 100%; }
.ExtraColNav h3, .ExtraColNav h4 {text-align:left; margin:20px 0 20px 15px; padding:0;}
.ExtraColNav ul {list-style-type:none;/*list-style-position:inside;*/ margin:10px 0 20px;}
.ExtraColNav li {margin:10px 0 20px -30px; line-height:14px;}

/* 1 column */
#ContentColumn1 {margin: 0 0px 0 0px;}

/* 2 columns */
#ContentColumn2 {margin: 0 200px 0 0px;   /* STEP 1: set to "0 ExtraColumnWidth 0 NavColumnWidth" */ }
#NavColumn2 {float: left;width: 180px; margin-left: -200px;}
#ExtraColumn2 {float: left;width: 180px;margin-left: -200px;}
#Footer {clear: both;padding: 0;margin: 0 ;}
.cen {text-align:center;}


/* ================================================================================================== testing tabbed sidebar ================================================= */

.here{ border:2px groove #eee;}
#ExtraColumn h3, #ExtraColumn h4 {margin-left:0px; margin-bottom:15px;}
.ExtraColTab { color:#272727; height:23px;}
.ExtraColTab ul {margin:0px; padding:0px; list-style-type:none;}
.ExtraColTab li {display:inline; line-height:23px; margin-left:0px;}
.ExtraColTab li a {color:blue; text-decoration:underline; margin-left:0; margin-right:3px ;}
.ExtraColTab li a.tabactive {text-decoration:none;  position:relative;}
#tabcontent1,#tabcontent2,#tabcontent3 { width:160px; text-align:left;padding:20px 0px; font-size:12px; margin-bottom:5px;}
#tabcontent1 ul, #tabcontent2 ul, #tabcontent3 ul {list-style-type:none; margin:0; padding:0;}
#tabcontent1 li a, #tabcontent2 li, #tabcontent3 li {display:block; margin:10px ; padding:0;list-style-position:inside;}
/*
.cpads550 {float:left; width:550px; height:80px; border:1px solid #ccc; background:#eee;}
.cpads150 {}
.cpads250 {}
.cpads350 {} */