/* YUI reset.css from 2.6.0 */
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:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
legend{color:#000;}
del,ins{text-decoration:none;} 
*{
	outline: none;
}
  
  html { 
    margin: 0;
    background-color: #5c5c5c;
	background-image:url(../img/gradbg.jpg);
	background-repeat:repeat-x;
    font-family: 'Gill Sans',Verdana,Helvetica,sans-serif;
    color: #ccc;
    font-size: 14pt;
  }
  
  img {
     margin: 0;
     padding: 0;
  }
  
  a {
     color: #FFF;
     text-decoration: none;
  }
  a:hover {
     color: #CCC;
  }
  
  h1 {
     font-size: 14px;
	 color: #71b4c4;
  }
  h2 {
     font-size: 11px;
  }
  h3 {
     font-weight: bold;
  }
  h4 {
      font-style:italic;
  }
  
  #myController span{
	  color:#FFF;
	  background:#000;
	  margin-right:10px;
	  cursor:pointer;
	  display:none;
  }
  
  #jFlowSlide{
  	  border: 2px solid #9d9d9d;
      margin-top: 60px;
      margin-left: auto;
      margin-right: auto;
      background-color: #23282c;
      background-image: url(../img/bg.jpg);
      background-repeat: repeat-y;
  }
  .topbanner{
	  position:absolute;
	  width: 700px;
	  height: 53px;
	  background-image: url(..img/about_banner.jpg) !important;
	  z-index: 1000;
	  float: right;
  }
  
  .jFlowPrev, .jFlowNext{
	  cursor:pointer;
  }
    
  .intro {
	  width:700px;
	  height: 477px;
      background-image: url(../img/intro.jpg) !important;
      position: absolute;
      top: 0px;
      left: 0px;
	  text-align: left;
	  font-size: 22px;
	  line-height: 300%;
  }
  
  .menu {
      position: absolute;
      top: 83px;
      left: 590px;
  }
  
   .menu a:hover{
      color:#71b4c4;
	  cursor: pointer;
  }
  
	ul.navlist
  {
	  position: absolute;
	  top: 0px;
	  right: 1px;
	  white-space: nowrap;
  }
  
  
  ul.navlist li
  {
	  float: left;
	  font-size: 15px !important;
	  font-family: 'Gill Sans',Verdana,Helvetica,sans-serif;
	  margin: 0;
	  padding: 9px 0px;
  }
  
  .navlist a
  {
	  margin: 0;
	  padding: 9px 17px;
	  color: #999999;
	  text-decoration: none;
  }
  
  .navlist a.current
  {
	  color: #FFF;
	  background-color: #9d9d9d;
	  background-image:url(../img/highlightnavbg.gif);
  }
  
  .navlist a:hover
  {
	  color: #BBBBBB;
	  background-color: #7d7d7d;
	  background-image:url(../img/hovernavbg.gif);
	  cursor: pointer;
  }
  
  .footer {
	width: 700px;
	height: 43px;
	background-image: url(../img/footbg.gif) !important;
	position:absolute;
	bottom: 0px;
	left: 0px;
  }
  .footer .button{ text-align: center; line-height: 43px; background: url( ../img/button_bg.gif) no-repeat; }
  .footer .button:hover{ background: url( ../img/button_bg.gif) 0 -43px no-repeat;}
  .footer .button a{ color: #ccc;}
  
  .footer .left {
      cursor: pointer;
      margin: 0px;
      float: left;
	  width: 120px; height: 43px; 
  }
  
  .footer .right {
      cursor: pointer;
      margin: 0px;
      float: right;
	  width: 120px; height: 43px; 
  }

  .content .cleft {
      float: left;
      width: 310px;
      height: 365px;
      margin-top: 16px;
      margin-left: 16px;
      border: 1px solid #9c9c9c;
      font-size: 13px;
      padding: 12px;
      background: #41484f;
	  overflow:auto;
  }
  
  .content .cright {
      width: 338px;
      margin-top: 8px;
      float: right;
  }
  
   .content .cleftport {
      float: left;
      width: 280px;
      height: 365px;
      margin-top: 16px;
      margin-left: 16px;
      border: 1px solid #9c9c9c;
      font-size: 13px;
      padding: 12px;
      background: #41484f;
  }
  
  .content .crightport {
      width: 368px;
	  height: 390px;
      margin-top: 16px;
      float: right;
	  overflow:auto;
  }
  
  .content .crightport .lb {
      margin: 0 4px;
      float: left;
  }
  
  .content .cright img {
      border: 1px solid #9c9c9c;
      margin: 8px 0 0 10px;
  }
  
  .content .crightport a img {
      border: 1px solid #9c9c9c;
      margin: 0 0 0 10px;
	  opacity: .3; filter: alpha( opacity=30); 
  }
  .content .crightport a:hover img {
	  opacity: 1; filter: alpha( opacity=100); 
  }
  
  .content .crightport .lb h2 {
      text-align:center;
      color: #ccc;
	  margin: 3px 0 20px 10px;
  }
  
  .content .hidden {
      display: none;
  }
  
  .content .cleftresume {
      float: left;
      width: 400px;
      height: 305px;
      margin-top: 16px;
      margin-left: 16px;
      border: 1px solid #9c9c9c;
      font-size: 11px;
      padding: 12px;
      background: #41484f;
      overflow:auto;
  }
  
  .content .cleftresume li, .crightresume li{
      list-style:circle;
      margin-left:1em;
  }
  
  .content .ctopresume {
      height: 20px;
      margin-top: 16px;
      margin-left: 16px;
      margin-right: 16px;
      padding: 12px;
      text-align: center;
      border: 1px solid #9c9c9c;
      background: #41484f;
  }
  
  .content .ctopresume a{
      font-size: 18px;
      color: #71b4c4;
  }
  
  .content .ctopresume a:hover{
      color:#ccc;
  }
  
  .content .crightresume {
      float: left;
      width: 200px;
      height: 305px;
      margin-top: 16px;
      margin-left: 16px;
      border: 1px solid #9c9c9c;
      font-size: 11px;
      padding: 12px;
      background: #41484f;
      overflow:auto;
  }
  
  .homelink{
  	  position: absolute;
      top: 0px;
      left: 0px;
  }
  
  .homelink a:hover {
  	  cursor:pointer;
  }
  
  .date {
      float:right;
      color:#888;
      display:inline;
  }
  
  #topmenu
  {
	padding: 0;
	margin: 0;
	list-style-type: none;
	float: right;
	width: 100%;
	color: #fff;
	background-color: #036;
  }

  #topmenu li { display: inline; }
  
  #topmenu a
  {
	float: right;
	width: 5em;
	color: #fff;
	background-color: #036;
	padding: 0.2em 1em;
	text-decoration: none;
	border-right: 1px solid #fff;
  }
  
  #topmenu a:hover
  {
	background-color: #369;
	color: #fff;
  }
  
  
  br.both{
	clear:both;
  }

  #contact{
	  background-color:#FFF;
	  color:#888;
	  font-size:14px;
  }
  
  #contact a{
	  color:#000;
  }
   
  #contact a:hover{
	  color: #71b4c4;
  }
  
  #contact .conttitle{
	  color: #000;
	  font-size:20px;
	  border-bottom:1px dotted #71b4c4;
	  border-color:#71b4c4;
  }
  
  #contact .conttext{
	  color:#000;
	  font-size:14px;
  }
  
  /*this is what we want the div to look like
    when it is not showing*/
  div.loading-invisible{
    /*make invisible*/
    display:none;
  }

  /*this is what we want the div to look like
    when it IS showing*/
  div.loading-visible{
    /*make visible*/
    display:block;

    /*position it 200px down the screen*/
    position:absolute;
    top:0px;
    left:0;
    width:100%;
    text-align:center;

    /*in supporting browsers, make it
      a little transparent*/
    background:#000;
  }