* {
  margin: 0;
}
html, body {
  height: 100%;
background-repeat: repeat-x;
background-color:white;
 overflow:       auto;
 font-size:1em;
 color: black;
font-family: 'Lato', sans-serif;


margin: 0 0 0 0px;
}

.indexq{
width:100%; margin:40 20px 0 20px; text-align:justify; height: auto;
}

#indexwrap{width:800px; text-align: center; margin:0 auto 0 auto; padding: 0 40px 0 40px; }

#biblio{
  background-color: white;
  background-image:none;
  color: black;
}


.biop{ color: #666; width:890px; margin:6px 0 30px 0px; }

.biopgap{ color: #666;width:890px; margin: 0px 0 30px 0px; text-align: justify;}

.biodate{
width:60px;
float:left;
color: ;
height:40px;
text-align: justify;
font-size: 12pt;
margin: 0px 10px 0 0px;
 }
 

.caption {text-align:left; font-size:12px;}





#copyright{text-align:left; margin: 0 20px 0 20px; width: 100%;  color:gray; font-size: 12px; }

#crumbs{width: 300px; float:right; margin: 0px 0px 0px 0; font-size: .8em; }
#crumbs a{color: black; padding-right:5px;}
#crumbs a:hover{color:#3366ff; text-decoration: none;}


  .fixed
{
        position: absolute;
        bottom: 0px;
        height: 40px;
        background:    black;
        width:  100%;
}
ul{list-style:none;}
  h2, h3, h4, h5, h6,  {    font-family: 'Lato', sans-serif; margin: 0 0 0 0;  /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
 }

  h1{ font-size:25px; 
     font-family: 'Lato', sans-serif;}

   h3{   font-size:25px; 

margin: 0 auto 0 auto;
 font-family: 'Lato', sans-serif;
color: black;
font-weight:normal;
padding-top: 15px;}

.header {
width:166px; 
float: left;

background-color:white;
margin: 10px 0px 10px 20px;

}

#headerimg{text-align:center;
float:left;
width:600px;
margin:10px auto 10px auto;
height:450px;


}
#headerimg2{text-align:center;

width:750px;
height:auto;
  position: absolute;
 

}



p{margin: 0 0 0 0px;}
 
em{font-style: italic;
font-weight: normal;}
 
/*ALL LINKS */

 a:link {
 font-family: 'Lato', sans-serif;
  color:  #0077ee;
  font-weight:normal;
 text-decoration: none;
}
a:visited {
  color: #0077ee;
  text-decoration: none;
   font-weight:normal;
}
a:hover, a:active, a:focus {  text-decoration: underline;

}
a.active{color:#3366ff; font-weight:bold;}

a.id{  font-family: 'Lato', sans-serif;
  font-weight:normal;}




.wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 0 0 150px; /* the bottom margin is the negative value of the footer's height */
width:1000px;
display: block;

}



}
.border{ border: 1px solid #999;}
.border2{ border: 3px solid #666;}


.alsocenter{border-top: 1px solid #999;
  margin-top: 20px;
  text-align: center;
border-top:1px solid black; 
margin-top:20px; 
margin-left:auto;
margin-right:auto;
}

.also{
  margin-top: 20px;
  text-align: left;
  margin-bottom:30px;
  font-size:15px;
}
.also a:link{color:#0077ee;font-weight:normal;
font-size:15px;}

#also{border-top: 1px solid #999;}
#also a{color:#0077ee; text-decoration:none;}
       
 #also a:visited{color:black; }
 #also a:hover{  color: #0077ee;}





#back{font-size:12px;
text-align: center;}
#back a{color: black;}
#back a:hover{color:#0077ee;}



.back{font-size:12px;
text-align: center
;}

.back a{font-size:12px;}

.content {
  padding: 0px 0;
  width: 780px;
  float: left;
  position: absolute;
}

#chron{width: 900px;}

.chronid{
color:black;
font-family: "Arial", Helvetica, sans-serif;
 text-align: left;
margin: 0px 0px 0px 0px;
padding-top: 20px;
font-size: 22px;
 }     

.chronimg{padding-top: 10px;
color:gray;
text-align: left;
font-size: 11px;
padding-bottom: 60px;
}
.chronimg img{
  text-align: left;}

.chroncaption{
font-size:11px;
color:gray;
text-align: center;
width: 900px;
}
.chroncaptionright{
font-size:11px;
color:gray;
text-align:right;
width: 900px;

}




.chronlink a{color:#0077ee;
text-decoration: none;}
.chronlink a:hover{color:#0077ee;
text-decoration: underline;}




.sidebar1:after { content: ' '; clear: both; visibility: hidden; }


.sidebar2 {clear:left;
  float: left;
  padding-bottom: 0px;
}
ul.nav {
  margin: 0 0px 0px -35px;
  list-style: none; 
  margin-bottom: 5px;
}
ul.nav li {color:black;


}


.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
  padding: 2px 10px 5px 0px;
  display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
  width: auto;  /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
  text-decoration: none;
  font-size:12px;
  color: black;
  font-weight:normal;
  font-family: 'Lato', sans-serif;
  

 
}
ul.nav a.active{color: #0077ee;}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
   font-weight:normal;
  color: #0077ee;

}



.sidebar1 {clear:left;
  float: left;
  height:100%;
  width:160px;
  margin:0px 0 0 15px;
  text-align: justify;
  letter-spacing:1px;


}

.spacer{width: 100%;
height:50px;}

.overview{width: 100%;
}

.overview p{text-align: center;margin:20px 0 80px 0;}

table#overview tr td{
  padding: 30px;
}
.texttop table #overview tr td p{max-width:300px;}

#mainwrap{width:1150px;overflow: visible; max-height: 800px;
  font-family: 'Lato', sans-serif;
}

.mainlogo{
  font-size:17px; 
font-family: 'Lato', sans-serif;
width: 160px;
color: black;
margin:11px 10px 10px 20px;
text-decoration:none;
font-weight:normal;

float: left;

}
#nav{
  text-align: left;
  height: auto;
  float: left;
  margin:44px 10px 0 -210px;

}
#leftnav ul{text-align: left;} 



#leftnav{ float:left;
}

#leftnav ul{list-style:none;
}

#leftnav ul li a {
text-decoration:none;
color: black;
font-size:12px;
font-weight:normal;
letter-spacing:1px;
  padding: 2px 10px 5px 0px;
  display: block;

}
#leftnav ul li a:hover {color:#3366ff;}

#leftnav ul li a.main{
  font-size:17px; 
font-family: 'Lato', sans-serif;
width: 200px;
color: black;
margin:0px 10px 10px 0px;
text-decoration:none;
font-weight:normal;

float: left;
}




.pageheader {width:100%; 

    font-family:"Arial", Helvetica, sans-serif;
background-color:#f8f8f8;
line-height:20px;
position: static;

}

#preload { display: none; }






.push{height:50px;}


.text{font-family: "Arial", Helvetica, sans-serif;
  color:#444;
  width:750px;
  padding-top: 100px;
clear:both;
}




#info{
width:400px;
color: black;}


#install img{width:200px;
}
.install {}



.id{
  font-size:17px;
line-height: 24px;
   font-weight:normal;
font-family:"Arial", Helvetica, sans-serif;
 }  


     


a.id{color:black;text-decoration:none;}
a.id:visited{color: black;}
a.id:hover{color: #3366ff;}

.pageid{
  font-size:1.5em; 
  line-height: 24px;
color:black; 
font-family: 'Lato', sans-serif;
 text-align: left;
margin: 10px 0px 15px 0px;
 }   
 .pageidcenter{
  font-size:17px; 
  line-height: 24px;
color:black; 
font-family: 'Lato', sans-serif;
 text-align: center;
margin-left: -100px;
 }  

.pageidsub{
  font-size:15px; 
  line-height: 24px;
color:black; 
font-family: 'Lato', sans-serif;
 text-align: left;
margin: 10px 0px 0px 0px;

 }   



 .homeid{
  font-size:17px; 
  line-height: 24px;
color:black; 
width:700px;
font-family: 'Lato', sans-serif;
 text-align: center;
margin: 10px 0px 0px 0px;
float:left;
 }     





#info a {padding-left:15px;text-decoration:none;}
a.2{ text-decoration:none;
  

}
#installswapnav{list-style:none;
  display: inline;
}
#installswapnav ul{list-style:none; width:400px; 
    margin-left:auto;
   margin-right:auto;
    text-align: center;
    background-repeat:repeat-x ;
 }
  
 #installswapnav li{display: inline; margin-right:5px; }

  #installswapnav a {text-decoration:none; }
.footer li a:hover{color:#3366ff;} 
}
#installswap{}

.center{text-align: center;

}


.dcenter{text-align: center;
  width:700px;
  padding-left:50px;
margin:0 auto 0 auto;}


#dw{margin:0 auto 0 auto;

  width:900px;}


  em{font-style: italic;
    font-weight:normal;}

.indent{padding-left:35px;}
.indent2{padding-left:55px;}
.indent3{padding-left:170px;}
.film{font-size:13px;
color:gray;}
.fltlft{float: left;}

#filmcontainer{width:820px;}


#filmsp{padding-left: 30px;
text-align: left;

}
#filmsp h3{text-align: center; margin-left: -30px; font-size: 22px; font-weight: normal;}
#filmsp p {width: 470px; margin-left: auto; margin-right: auto;}

.films{text-align: center;
padding-top: 45px;
padding-bottom:45px;}





#footerSlideContainer {
  position: fixed;
  bottom:0;
  width: 100%;
  text-align:center;
background-color:white;
min-width: 960px;


}

#footerSlideContent {
  width: 900;
  height: 30px;
  background: white;
  color: #CCCCCC;
  font-size: 0.8em;
  border-top: solid #c0c0c0 1px;
  padding-left: 50px;

}

#footerSlideContent ul {
  list-style-type: none;
  line-height: 2em;
list-style:none; 
width:100%;
   margin: 0 auto 0 auto;
    text-align: center;
    background-repeat:repeat-x ;
}

#footerSlideContent ul a{
  display: inline;
  color:#666;
}

#footerSlideText {

}
#footerSlideText ul li {
color : #fff;
display: inline;
margin-right: 55px;
    padding-right: 10px;

}
#footerSlideText ul li a{
text-decoration : none;
font-size:13px;
padding: 0 10px 0px 10px;
 color:black;
}
    

#footerSlideText ul li a:hover{
  color:#3366ff;
}


#footerSlideText ul li a.active{
  color:#3366ff;
  font-weight:normal;
}
 .fixed ul{list-style:none; width:920px; 
    margin-left:auto;
   margin-right:auto;
    text-align: center;
    background-repeat:repeat-x ;
 }
  
  .fixed li{display: inline; margin-right:50px; }

  .fixed li a {text-decoration:none; color: white; line-height:30px;  }
.fixed li a:hover{color:#0077ee;} 

#gridcontainer{ width:1000px; padding-left: 130px; margin-top: 40px; margin: 40 auto 0 auto;  text-align: center; height: 350px; }

#gridcontainerb{width:1000px; margin-left:50px; text-align: center;}
#gridcontainerb a{color:#666;}
#gridcontainerb a:hover{color:#0077ee; text-decoration: none; }

#gridcontainerc a{color:#666;}
#gridcontainerc a:hover{color: #0077ee; text-decoration: none; }
#gridcontainerc{width:1000px; margin-left:75px; text-align: center;}

#gridcontainerd{width:1000px; margin-top:-10px; margin-left:-10px; text-align: center;}
#gridcontainerd a{color:#666;}
#gridcontainerd a:hover{color:#0077ee; text-decoration: none; }

.grid {width: 430px;float:left;  margin: 0 auto 20px auto;  background-color:; padding: 0px 3px 3px 3px;}
.grid a{color:#666;}
.grid a:hover{color:#0077ee ; text-decoration: none; }

.gridthreedwell{width:925px;padding: 0 6px 4px 6px; margin-right: auto; margin-left: auto; background-color:; 
  color:#666; margin-top: -41px; margin-left:45px; text-align:center;  }

.gridthree{width:430px;padding: 0 4px 4px 4px; margin-right: auto; margin-left: auto; background-color:; 
  color:#666; margin-top: 20px; text-align:center;  }

.gridthree a{color:#666;}
.gridthree a:hover {color: #0077ee; text-decoration: none;}

.gridthreedwell a{color:#666;}
.gridthreedwell a:hover {color: #0077ee; text-decoration: none;}

.gridc {width: 270px;float:left; margin: 15px;  background-color:; padding: 0px 3px 3px 3px;}
.gridc a{color:#666;}
.gridc a:hover{color: #0077ee; text-decoration: none; }



.headline{width:800px;  padding-top:10px; text-align: justify; margin-left: auto; margin-right: auto; }

.jump{text-align:center; font-size: 12px;}

.lalign{text-align: left;}

#objtable{
  position: static;
  margin: 10px auto 40px auto;
  width:750px;
}



 /* Periods */
  .period {
    border-top: 1px solid #EEE;
    padding: 15px 0 20px 20%;
    position: relative;
    color: gray;
    font-size: 13px;

  }
   .period img{ padding:10px 0 0 0; margin:0 0 0 0;}
    .inter {
    border-top: 1px solid #EEE;
    padding: 5px 0 5px 2%;
    position: relative;
    color: black;
  }
  .inter.first { border-top: none;}
  
  .texts {
    border-top: 1px solid #EEE;
    padding: 5px 0 5px 2%;
    position: relative;
    color: gray;
    font-size:.9em;
  }
 .texts .firstt { border-top: none; padding-bottom: 10px;}
    .texts.info {border-top: none;
   margin-left:-15px;
}
  



  .exhibit {
     border-top: 1px solid #EEE;
    padding: 5px 0 5px 12%;
    position: relative;
    color: black;
           width:900px;
}
   .exhibit .date {
    left: 0;
    position: absolute;
    top: 10px;
  }

 
      
  }
   .exhibit .img{
    top: 15px;
  padding: 2px 0 2px 35px;
width:400px;
float: right;
         position: relative;
}

  .exhibit-i {
     border-top: 1px solid #EEE;
    padding: 15px 0 20px 13%;
    position: relative;
    color: black;
       height:220px;
       width:800px;
  }


   .exhibit-i .date {
    left: 0;
    position: absolute;
    top: 10px;
  }
 
 .exhibit-i .img{
top: 10px;
  padding: 2px 0px 2px 70px;
width:300px;
float: right;
text-align: center;
}






   .exhibit-ni .date {
    left: 0;
    position: absolute;
    top: 10px;
  }

  .exhibit-ni .first { border-top: none;padding-left: 10px;}

  .exhibit-ni .info{
    width:450px;
  } 
  .exhibit-ni {
     border-top: 1px solid #EEE ;
    padding: 15px 0 15px 13%;
    position: relative;
    color: black;
      height:90px;
       width:700px;
  }
.exhibit-ni .nicaption{width:380px; padding-left: 10px;}


  .exhibit.first { border-top: none;}

   .exhibit.first .img{ top: 0px;
 padding: 2px 0 2px 65px;
width:200px;
height: 200px;
float: right;
}

#extab{ margin:0px 0 0 -40px; }
#extab ul{display: inline;}
#extab ul li{color:black; display: inline; padding-right: 18px; color: gray;}
#extab ul li.mainex{color:black; }
#extab ul li a{color:gray; font-size: 11px;}
#extab ul li a:hover{color:#3366ff; text-decoration: none; }

.first { border-top: none;
top:10px;}





  .period.first {
    border-top: none;
  }
  
  .period.slideshow {
   padding: 20px 0 5px 0;
  }
  .period .date {
    left: 0;
    position: absolute;
    top: 13px;
  }
   .period .author {
    left: 0;
    position: absolute;
    top: 15px;
    margin-right:20px;
    color:black;
  }
  .period_unit {
    margin-bottom: 15px;
  }
  .period.alt {
    padding-bottom: 0;
  }


#swap{
margin: 15px 0 0 65px;
float:left;
padding:0 0 30px 37px;
text-align: center;

}
#swap img{width: 800px;
height: 550px;}



#sourcetable{font-size:11px;color:gray;}    
#sevrestable{font-size:11px; color:gray;margin-left: 0px; text-align: center; width: 900px;}
#fctable{font-size:11px; color:gray;margin-left: 0px; text-align: center;}
#fctable img{
  margin-bottom: 40px;
}
#objecttable{font-size:12px;}


/*TAKE out when done with table sorter?  */

table.tablesorter tbody td .chronimg{padding-top: 15px;
float: left;
font-size: 11px;
padding-bottom: 60px;
}

table.tablesorter tbody td .chronimg .chroncaption{font-size:11px;
color:gray;
float:right;

width: 900px;}

#sevrestable .dheader{
  font-size:10px; 

 text-align: left; 
font-family:"Arial", Helvetica, sans-serif;
color: black;
font-weight:normal;
padding-top: 5px;
padding-bottom: 5px;
}


table.tablesorter tbody tr td .dheader{
  font-size:20px; 
  width:900px;
margin: 0 auto 0 auto;
 text-align: left; 
font-family:"Arial", Helvetica, sans-serif;
color: black;
font-weight:normal;
padding-top: 5px;
padding-bottom: 5px;
}


.texttop{
width:900px;
padding-left:115px;

}
.texttop p{
  width:800px;
  margin: ;
padding: 0 40px 0 50px;
}


#three img{margin:5px;}
#three{text-align: center padding-bottom:20px;font-size:13px;}

#three table{text-align: center; width:900px; margin: 0 auto 0 -45px;}

#three1 img{margin:5px;}
#three1{text-align: center padding-bottom:20px;}
#three1 table{text-align: left; width:400px; margin: 0 auto 0 0px;}
#toppush{
  width:100%;
  height:50px;

position: absolute;
}
#complete{width:700px;
margin: 0 auto 0 auto;
text-align: center;}


#birthfilm {}
#birthfilm img{width: 100%;
}

#enter{
  margin-top: 25px; 
  text-align: center;
  color: #a16829;
}

#enter a{color:#a16829;
  font-size: 20px;
}

#sitecredit{  font-size: 9px; color: #666;}