/* Don't forget to set a foreground and background color
   on the 'html' or 'body' element! */
html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	text-align: left;
	vertical-align: baseline;
	zoom: 1;
}
a img, :link img, :visited img {
	/* border: 0; */
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ul {
	list-style: none;
}

#mainContent ul{

}

#mainContent ul li{
  background: url("http://images.koitech.net/bullet.gif") no-repeat 0px 6px;
  padding-left: 12px;
}

/* -------------------------  OL ---------------------------- */
/* margin-bottom: 8px; <-- borderBottom  */
ol{ margin: 0px 0px 18px00px; padding: 0px; list-style-position: inside; }
ol li{  margin-left: 0px; padding-left: 0px; }

ol > li{list-style-type: none; padding-left: 17px !important; }
ol > li{ background: url("http://images.koitech.net/li01.gif") no-repeat -1px 6px !important; }
ol > li+li{ background: url("http://images.koitech.net/li02.gif") no-repeat -1px 6px !important; }
ol > li+li+li{ background: url("http://images.koitech.net/li03.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li{ background: url("http://images.koitech.net/li04.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li{ background: url("http://images.koitech.net/li05.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li{ background: url("http://images.koitech.net/li06.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li07.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li08.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li09.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li10.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li11.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li12.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li13.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li14.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li15.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li16.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li17.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li18.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li19.gif") no-repeat -1px 6px !important; }
ol > li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li{ background: url("http://images.koitech.net/li20.gif") no-repeat -1px 6px !important; }


ol li{ background: none; padding-left: none; font-weight: normal; }


q:before, q:after,
blockquote:before, blockquote:after {
	content: "";
}


a:link{ color: #FF5700; font-weight: bold; text-decoration: none;}
a:visited{ color: #FF5700;font-weight: bold; text-decoration: none;} /* color: #FFA600; font-weight: bold; */
a:hover{ color: #212121; background-color: #FF5700; }
a:active{ color: #212121; background-color: #FFA600;}


h1{ color: #FF5E00; font-weight: normal;}
h2{ color: #FF8200; font-weight: normal;}
h3{ color: #FFA600; font-weight: normal;}
h4{ color: #FF7E00; font-weight: normal;}
h5{ /* to be determined */ }

h1{
  font-size: 3.454545em;
  line-height: 1.10542em;
  margin-bottom: 18px;
}
h2{
  font-size: 2.727272em;
  line-height: 1.2em;
  margin-bottom: 18px;
}
h3{
  font-size:  2.181818em;
  line-height: 1.5em;
  margin-bottom: 18px;
}

h4 {
	margin: 0;
	font-size: 1.1818181818181819em;
	margin-bottom: 18px;
	border-bottom: 4px solid #888;
}

#footer h4 {
	margin: 0;
	font-size: 18px;
	margin-bottom: 0px;
	border-bottom: 0px solid #888;
}

.h4NoBorder{
	margin: 0;
	font-size: 18px;
	margin-bottom: 0px;
	border-bottom: 0px solid #888;
}


code{ font-family:'courier new',courier,monospace; }


p, ul, blockquote, pre, td, th, label {
	margin: 0;
	font-size: 1em;
	line-height: 18px;
	margin-bottom: 18px;
}
p.small {
	margin: 0;
	font-size: 0.8181818181818182em;
	line-height: 2em;
	margin-bottom: 2em;
}
table {
	border-collapse: collapse;
	margin-bottom: 1.6363636363636365em;
}

strong{ font-weight: bold; }


html{ height: 100%; background-color: #3B3B3A;}

body {
 color:   #9B9B9B;/*   #818181   lightened up for readability */
 font-family: verdana, sans-serif;
 font-size: 11px;
 line-height: 18px;
 background: /* url("http://images.koitech.net/bg.gif") repeat-x */ #3B3B3A; /* #212121;<-- this was changed to the footer colort o remove bottom drak band */
 height: 100%;
}
#wrapper {
 /* width: 911px; */
 min-width: 895px;
    /* IE Dynamic Expression to set the width */
    width:expression(document.body.clientWidth < 927 ? "925px" : "100%" );
	
 min-height: 500px;
 height: auto !important;
 height: 500px;
 padding-left: 17px;
 background: url("http://images.koitech.net/bg.gif") repeat-x #212121;
}
#faux {
 overflow: auto; /* Paul O Brien Fix for IE www.pmob.co.uk */
 width: 100%
}

/* -----------------------------------Top Area ---------------------- */

#header {
 width: 911px;
 height: 183px;
 margin-bottom: 14px;
 background: url("http://images.koitech.net/bg1Header.gif") no-repeat 139px 14px;
}

  #login{
    background-color: #3B3B3A;
	font-size: 1px;
	width: 186px;
	position: relative;
	left: 692px;
	padding: 11px 0px 10px 10px;
  }

  .logField{
    margin-right: 3px;
	width: 68px;
	height: 15px;
	padding: 3px 0px 0px 6px;
	background-color: #9B9B9B;
	font-size: 10px;
	color: black;
	border: none;
	font-family: verdana;
	font-size: 10px;
	vertical-align: top;
  }

  #login fieldset{ border: 0px; line-height: 1;}
  #login legend { font-size: 10px; margin-bottom: 4px;}
  #logSubmit{  padding-left: 2px;}
  #login #loggedIn { font-size: 11px; }

#logo{
  position: relative;
  left: 484px;
  top: -28px;
  width: 100px;
}

/* -------------------------------- Nav ----------------------------- */

#nav {
 display: inline;
 width: 117px;
 float: left;
 margin-right: 29px;
}


 #nav ul{ list-style: none;}
  #nav li a{ display: block; width: 117px; height: 30px;}


  #navAbout{   background: url("http://images.koitech.net/nav.gif");}
  #navWork{    background: url("http://images.koitech.net/nav.gif") 0px -30px ;}
  #navCapabilities{    background: url("http://images.koitech.net/nav.gif") 0px -60px ;}
  #navNews{    background: url("http://images.koitech.net/nav.gif") 0px -90px ;}
  #navBlog{    background: url("http://images.koitech.net/nav.gif") 0px -120px ;}
  #navContact{ background: url("http://images.koitech.net/nav.gif") 0px -150px ;}

  #navAbout:hover{    background: url("http://images.koitech.net/nav.gif") 0px -180px;}
  #navWork:hover{     background: url("http://images.koitech.net/nav.gif") 0px -210px ;}
  #navCapabilities:hover{     background: url("http://images.koitech.net/nav.gif") 0px -240px ;}
  #navNews:hover{     background: url("http://images.koitech.net/nav.gif") 0px -270px ;}
  #navBlog:hover{     background: url("http://images.koitech.net/nav.gif") 0px -300px ;}
  #navContact:hover{  background: url("http://images.koitech.net/nav.gif") 0px -330px ;}


 .about #navAbout{            background: url("http://images.koitech.net/nav.gif") 0px -180px;}
 .work   #navWork{            background: url("http://images.koitech.net/nav.gif") 0px -210px ;}
 .capabilities   #navCapabilities{            background: url("/images/nav.gif") 0px -240px ;}
 .news   #navNews{            background: url("http://images.koitech.net/nav.gif") 0px -270px ;}
 .blog   #navBlog{            background: url("http://images.koitech.net/nav.gif") 0px -300px ;}
 .contact #navContact{        background: url("http://images.koitech.net/nav.gif") 0px -330px ;}


/* ----------------------------------- Structure -------------------------- */

#mainContent {
 float: left;
 width: 329px;
 display: inline;
 position: relative;
 margin-right: 11px; /* may change to 14px later */
}

#mainContent p{ }

#rightColumn {
 width: 402px;
 display: inline;
 position: relative;
 float: left;
}

#rightColumn p{ padding: 0px 5px 5px 5px; text-align: left; margin-bottom: 10px; }
#rightColumn ul{ padding: 0px 5px 0px 5px; text-align: left;}
#rightColumn li{
  /* background: url("/images/bullet.gif") no-repeat 0px 6px inherit; was 0px 6px */
  padding-left: 12px;
}


#right{
  width: 196px;
  background-color: #3C3B3B;
  border-bottom: 1px solid #888;
  margin-bottom: 18px;
}

.rightBelow{
  width: 196px;
  background-color: #3C3B3B;
  border-bottom: 1px solid #888;
  margin-bottom: 18px;
}

.rightBelow h4{ background-color: #222122; }

#farRight{
  width: 196px;
  float: right;
  /* background-color: #3C3B3B; */
  /* border-bottom: 1px solid #888; */
  margin-bottom: 18px;
}


/* --------------------------------- Work ------------------------------ */

#legend{
  clear: right;
  width: 196px;
  float: right;
  margin-bottom: 18px;

}

#legend img{ display: inline; padding-right: 4px;}
#legendContent{  background-color: #3C3B3B;  position: relative; top: -18px; padding: 7px; border-bottom:1px solid #888888;}

* html #legend img{margin-top: 6px;} /* IE HACK */
* html #projectList img{margin-top: 6px;} /* IE HACK */

#otherWork{ background-color:#3C3B3B; border-bottom:1px solid #888888; margin-bottom: 18px; }

#otherWork a{
   display: block;
   color: #FEA105;
   font-weight: normal;
}
#otherWork img{margin-left: 4px;}
#otherWork a:hover{  color: #222122; background-color: #FEA105;}


/* ---------------------------------- About Us ------------------------------ */

#testimonials{
  line-height: 18px;
}

#farRight #testimonials{ background-color:#3C3B3B; border-bottom:1px solid #888888; margin-bottom: 18px; }
#gettingStarted{ background-color:#3C3B3B; border-bottom:1px solid #888888; margin-bottom: 18px; }


#rightColumn h5{ padding: 0px 5px; font-weight: bold; color: white; }


/* ---------------------------------- News ----------------------------------- */

#farRight #latestNews{ background-color:#3C3B3B; border-bottom:1px solid #888888; margin-bottom: 18px;}
#newsArchives{ background-color:#3C3B3B; border-bottom:1px solid #888888; margin-bottom: 18px;}
#spotlight{
  clear: right;
  width: 196px;
  float: right;
  /* margin-bottom: 18px; */
}
.spotLightContent{  background-color: #3C3B3B;  position: relative; top: -18px; padding: 7px; line-height: 1px;}
.spotLightContentLeftCol{   padding: 0px 7px;}




/* ------------------------------------ Blog ---------------------------------- */
#newsMain p.borderBottom{ padding-bottom: 8px; }
#blogComments{margin-bottom:8px;}
#mainContent #koiBlog div{ margin-bottom: 16px;  }
.comments{font-weight: bold; text-align: right; margin-bottom: 0px; padding-bottom: 8px;}
.comments a{ color: #FEA105; }
.comments a:hover{  color: #222122; background-color: #FEA105;}

.blogComment{ 
  padding: 16px 6px 16px 6px; 
  background: url("http://images.koitech.net/bg.gif") repeat-x scroll 0px -178px;
  height: 83px;
  min-height: 83px;
  height: auto !important;
}
/* .commentEven{ background: url(http://images.koitech.net/bg.gif) repeat-x scroll 0%; } */


#catagories{
  background-color: #3C3B3B;
  border-bottom: 1px solid #888;
  margin-bottom: 18px;
}
#catagories li{ background-image: none; padding-left: 0px;}
.postDate{ font-weight: bold; margin-bottom: 8px;}


#blogCommentForm { background-color: #3A3B3A; border-top: 1px solid #888;  border-bottom: 1px solid #888; margin-bottom: 16px;}
#blogCommentForm span{ display: block; margin: 8px;}
#blogCommentForm span input{ width: 140px; background-color: #9B9B9B; border: 0px; padding: 3px; font-size: 10px;}
#blogCommentForm label{ float: left; clear: both; width: 65px; margin: 0px 5px 0px 0px; font-weight: bold; text-align: right;}
#blogCommentForm textarea{ width: 234px; background-color: #9B9B9B; border: 0px; padding: 3px; font-size: 11px;}

#styleLink{ margin: 0px 0px 8px 78px; padding-left: 20px;}
#blogCommentForm #checkBoxes { display: block; width: 300px; margin: 0px; padding-left: 74px;}
#blogCommentForm #checkBoxes input{ width: 13px; background-color: #3A3B3A;}
#blogCommentForm #checkBoxes label{ display: inline; float: none; clear: none; width: 130px; }


#blogCommentForm #commentButtons input{  background-color: transparent ; height: 20px; width: 53px; }
#blogCommentForm #commentButtons{margin: 4px 0px 8px 75px;}

#styleGuide{ margin-left: 76px; }
#styleGuide p{ margin-bottom: 9px;}

#rssFeeds{
  clear: right;
  width: 196px;
  float: right;
  margin-bottom: 18px;
}
#rssFeeds a{display: block; background: url("http://images.koitech.net/rss.gif") no-repeat; padding-left: 20px;}
#rssFeeds a:hover{background-color:#FF5700;}
#feedsContent{  background-color: #3C3B3B;  position: relative; top: -18px; padding: 7px; border-bottom: 1px solid #888; }

blockquote {
	padding: 8px 8px 8px 23px;
	background: url("http://images.koitech.net/bgQuote.gif") no-repeat  #4B4B4B;
	}
	
.update{background-color:#3C3B3B; color: white; padding: 5px;}


/* ----------------------------- Contact ------------------------------ */

#contactMain form { background-color: #3A3B3A; border-top: 1px solid #888;  border-bottom: 1px solid #888; margin-bottom: 16px;}
#contactMain span{ display: block; margin: 8px;}
#contactMain span input{ width: 140px; background-color: #9B9B9B; border: 0px; padding: 3px; font-size: 10px;}
#contactMain label{ float: left; clear: both; width: 65px; margin: 0px 5px 0px 0px; font-weight: bold; text-align: right;}
#contactMain textarea{ width: 234px; background-color: #9B9B9B; border: 0px; padding: 3px; font-size: 11px;}

#contactMain span #ccCheckBox{ width: auto; margin: 0px; border: 0px;}
#contactMain .bSubmit{margin: 0px 0px 8px 78px;}



/* FOOTER +++++++++++++++++++++++++++++++++++++++++++++++ */

#footer {
 min-width: 895px;
    /* IE Dynamic Expression to set the width */
    width:expression(document.body.clientWidth < 927 ? "925px" : "100%" );
 clear: both;
 background: #3B3B3A url("http://images.koitech.net/bgFooter.gif") repeat-x;
 padding: 30px 17px 17px 17px;
  /* height: 40%; */
  
   min-height: 200px;
 height: auto !important;
 height: 200px;
}

#search{
	width: 117px;
 float: left;
 margin-right: 24px;  /* subtracted 5 to allow space for hover paragraphs */
  }

  .searchField{
    margin-bottom: 12px;
	width: 117px;
	height: 15px;
	padding: 3px 0px 0px 6px;
	background-color: #9B9B9B;
	font-size: 10px;
	color: black;
	border: none;
	font-family: verdana;
	font-size: 10px;
	vertical-align: top;
  }

#footerBlog {
 float: left;
 width: 339px; /* 333 */
 display: inline;
 position: relative;
 margin-right: 11px; /* may change to 14px later */
}

#footer p{ text-align: justify; padding: 5px;} /* formerly footerBlog p */
#footer p:hover{ background-color: #323232;}  /* formerly footerBlog p:hover */

#footerRightCol{
 width: 402px;
 display: inline;
 position: relative;
 float: left;
}
#footerFarRight{
  width: 196px;
  float: right;
 line-height: 18px;
}

#footerRight{
  width: 196px;
 line-height: 18px;
}

a.emailLink{  color: #FEA105; font-weight: normal;}
a.emailLink:hover{  color: #222122; background-color: #FEA105;}

#footerFeedIcon{
  position: relative;
  top: -27px;
  left: -260px;
  float: right;
}


/* 404 ------------------------------------------------------ */
#missingSearch p{ margin:8px 5px; }
#missingSearch span{ display: inline; margin: 0px;}
#missingSearch span input{ margin: 0px 5px 5px 0px; }
#missingSearch .bSubmit{ margin: 0px; }



/* UTILS ---------------------------------------------------- */


#rightColumn a{ display: block;}

.blockLink{ color: #FF5700; font-weight: bold; text-decoration: none; display: block; padding-left: 5px;}
a:link .blockLink{ color: #FF5700; font-weight: bold; text-decoration: none; display: block;}
a:visited .blockLink{ color: #FF5700; font-weight: normal; text-decoration: none; display: block;}
a:hover .blockLink{ color: #212121; background-color: #FF5700; display: block; }
a:active .blockLink{ color: #212121; background-color: #FFA600; display: block;}

.blockDisplay{display: block;}
.clear { clear: both; background: none; }
.hr1{ height: 4px; background-color: #888; overflow: hidden; margin-bottom: 15px;}
.hr2{ height: 1px; background-color: #888; overflow: hidden; margin-bottom: 15px;}
.hide{ margin:0px -99999px;}
.hidden{
  position: absolute;
  left: 0px;
  top: -500px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.margin5{ margin: 5px; line-height: 16px;}
.leftPad5{  margin-left: 5px;}
.boldText{ font-weight: bold; }

.rightColImg{
  border: 5px solid  #6B6B6B;
  background-color: white;
  padding: 1px;
  }

a .rightColImg{
  border: 5px solid  #6B6B6B;
  background-color: white;
  padding: 1px;
}

 a:hover .rightColImg{
  border-color: #FF5700;
}


.imgBorder{
  background-color:white;
  border:5px solid #6B6B6B;
  padding:1px;
  margin-bottom: 8px;
}

.avatar{ margin-left: -127px;margin-top: -16px; position: absolute;}

.avatar img{
  background-color:white;
  border:5px solid #6B6B6B;
  padding:1px;
  margin-bottom: 5px;
  display: block;
}

a .avatar{
  border: 5px solid  #6B6B6B;
  background-color: white;
  padding: 1px;
}

 .avatar a:hover img{
  border-color: #FF5700;
}

.underline{
  border-bottom: solid 1px #888;
  padding-bottom: 8px;
  margin-bottom: 8px;
}


.noBorder{ border: 0px;}
.borderBottom{ border-bottom: 1px solid #888888; margin-bottom: 8px;}
.borderTop{ border-top: 1px solid #888888;}

#alert{ 
  background-color:#3A3B3A;
  border-bottom:1px solid #888888;
  border-top:1px solid #888888;
  margin-bottom:16px; 
  color: white;
  font-weight: bold;
  text-align: center;
  padding: 18px 18px 0px 18px;
}
#alert p{
  text-align: center;
}



/* SPLASH */
#splash{ background: url("http://images.koitech.net/splashBGTile.gif") #212121 repeat-y; padding: 0px; margin: 0px; line-height:18px;}
#splash #main{ background: url("http://images.koitech.net/splashBG.jpg") no-repeat; width: 757px; height:411px; padding: 32px 0px 0px 52px; }
#splash #content{ padding: 24px 0px 0px 5px;  width: 370px;}