* {
  	font-family: Arial, sans-serif;

  }

  body{
    margin:5px 5px 0 5px;
  }

  #wrapper{
    width:1150px;
    margin: 0 auto;
  }

  h1, h2 {
    font-family: 'Bitter',serif;

  }


h2 {
    margin-bottom: 8px;
margin-top: 3px;
}

a {
  text-decoration: none;
  color:#A40080;
}

a:hover{
  text-decoration: underline;
}

#banner{
  border-bottom:1px solid #aaa;
  margin-bottom:8px;
  position:relative;
}

#banner h1{
  display: inline-block;
  font-size:250%;
  margin: 0px 15px 0px 0px;
}

#banner h2{
  position:absolute;
  right:0;
  bottom:0;
  display:inline-block;
  text-align: right;
  font-size:125%;
  line-height:100%;
  color: #888;
  font-weight:400;
  margin-bottom: 5px;
  margin-top:0px;
}


   #histo{
    height:470px;
    /*float:left;*/
    position:relative;
    white-space: nowrap;
    /*overflow-x: scroll;*/
    min-width: 947px;
   }

   #orgs{
    clear:both;
    margin-top:12px;
    padding:0px;
    min-height:400px;
    position:relative;
   }

   #about{
    padding: 10px;
    width:1125px;
    height:260px;
    /*border: 1px solid #ddd;*/
    /*border-radius: 10px;*/
    padding-top: 0px;
    margin-top: 15px;
    background-color: #f8f8f8;
    font-size:75%;
    position:relative;
   }

   .aboutcolumn{
    float:left;
    height:100%;
    width:265px;
    margin:0 8px;
   }
   #about h2{
    margin: 8px 0 0 0;
    padding-bottom: 3px;
    border-bottom:3px solid #ddd;
 }

   #aboutbutton{
    position:absolute;
    left:0px;
    top:400px;
    z-index:99;
   }

   #orgtable { 
   		width: 924px;
   		margin: 1px;
   		font-size: 11px;
      padding:0px;
      border-collapse: collapse;
   }

   #orgtable td{
    padding-top:4px;
    padding-bottom:4px;
    border-top:1px solid #ddd;
   }
/*
   #orgtable th:hover{
   	text-decoration: underline;
    
   }*/

   #orgnotes, #orgsources {
    width:170px;
    margin:-5px 5px 5px 5px;
    padding:7px;
    position:absolute;
    left:960px;
    font-size: 11px;
    border-radius: 6px; 
    border:1px solid #aaa;
   }

   td.tablehover{
    background-color: #f5f5f5;
   }

   #orgsources p{
    margin:3px 0;
   }


   #orgtable td.timeline{
      position:absolute;
      background-color: #ccc;
      /*width:400px;*/
      height:3px;
      /*z-index:-1;*/
      opacity:0.2;
      padding:0px;
    }

    #orgtable th {
      padding: 7px 5px 7px 5px;
      height: 18px;
      background: #f5f5f5;
      border-right: 1px solid white;
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
      white-space: nowrap;
    }

    #orgtable th.currentsort{
      background-color: #d8d8d8;
    }

    th:hover{
      cursor:pointer;
    }

    #orgtable th img.sorticon{
      margin-left: 5px;
      position: relative;
      bottom: -3px;
      margin-top: -6px;
      opacity: 0.4;
      width: 14px;
    }

    #orgtable th img.sortfocus, #orgtable th img.sorthover{
      opacity:1.0;
    }

    td.notes, td.sources{
      text-align:center;
      font-size: 18px;
      line-height: 11px;
      color:#aaa;
    }

    td.sources{
      font-size:14px;
    }

    td.notes:hover, td.sources:hover {
      cursor:pointer;
      color:black;
    }

    td.notes.selected, td.sources.selected{
      color:#A40080;
    }

   #controlpanel{
    height:40px;
    width:944px;
    position:relative;
   }

   #focuspanel{
    width:640px;
    height:100%;
    display:inline-block;
    float:left;
   }

   #focusselector{
    margin-left:20px;
   }

    #focusselector select{
    font-size:16px;
   }

   #currentfocus{
    padding-top: 6px;
    font-weight: bold;
    display: inline-block;
   }

   #facetpanel{
    height:100%;
    /*width:400px;*/
    display:inline-block;
    position:absolute;
    right:0;
    /*position:absolute;
    right:0;*/
   }

   .histospacer{
    /*background:white;
    overflow: visible;*/
   }
   .histocolumn{
   	float:	left;
   	margin: 1px;
   	/*background: #eee;*/
   	width:19px;
    display: inline-block;

   	height:100%;
   	position:relative;
   }

   .columnlabel{
    border-top: 3px solid #ddd;
    width:100%;
    height:0px;
    padding-top: 3px;
   }

   .columnlabel.selected{
    border-top: 3px solid #888;
   }



   .histocolumn .columnlabel{
      position:absolute;
      bottom:0px;
      font-size:10px;
    }

     .facetlabel{

      font-size:10px;
      position:absolute;
      left:30px;
      top:50%;
      margin-top:-5px;
      /*width:300px;*/
      white-space:nowrap;
      padding: 2px 4px 2px 4px;
      border-radius:8px;
      background:#fff;
      border: 1px solid #aaa;
      /*box-shadow: 1px 1px 1px #444;*/
     }  

     .facetlabel:hover{
        /*z-index:99;*/
     }

     .facetdot{
      width: 7px;
      height: 7px;
      border-radius: 5px;
      display: inline-block;
      margin-left: 3px;
     }

     

     #facetbuttons {
      display:inline;
      padding:0;
     }

     .button{
      display:inline-block;
      list-style: none;
      padding:5px;
      margin-left:5px;
      border: 1px solid #e5e5e5;
      border-radius:8px;
      color:#aaa;
     }

     .button:hover{
      cursor:pointer;
      background:#eee;
     }

     .button.selected{
      color:black;
      background:#eee;
      border: 1px solid #444;
     }

 .column {
 	background: #f9a;
 	width:100%;
 	position:relative;
 	margin-bottom:1px;
 	border-radius:3px;
   opacity:0.5;
   -webkit-transition: opacity 0.5s;
  /*border:1px solid transparent;*/
 }

   .column:hover, .column.latched{
   	/*background-color: yellow;*/
   	cursor:pointer;
    /*border:1px solid #444;*/
    opacity:1.0;
    z-index:97;
    /*-webkit-transition: opacity 1.0s;*/
   }



   .column.selected{
    opacity:0.8;
    z-index:99;
    /*-webkit-transition: opacity 1.0s;*/
   }