/* 
 * common.css, 1.0 2007.11.05
 *
 * (c) 2007 Computer History Museum		http://www.computerhistory.org
 *
 * Edit according to styleguide
 *
 */
html,body,div,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
img { border: 0; }
body { margin: 0; padding: 0; font-family: verdana,arial,helvetica,sans-serif; font-size: 76%; line-height: 1.4em; background-color: #efefef; text-align: center; }
a { text-decoration: none; outline: none; }

.iconphone { background: url(/_common/img/icon-phone.gif) 0 center no-repeat; padding-left: 20px; }
.iconemail { background: url(/_common/img/icon-email.gif) 0 center no-repeat; padding-left: 20px; }
.icondownload { background: url(/_common/img/icon-download.png) 0 center no-repeat; padding-left: 20px; }
.iconweb { background: url(/_common/img/icon-web.gif) 0 center no-repeat; padding-left: 20px; }

#commonmainwrap { margin: 18px auto; width: 960px; text-align: left; background: #fff; margin-bottom: 0; }

/* COMMON HEADER */
#commonheaderwrap { width: 960px; height: 109px; background-color: #fff; background: url(/_common/img/headerbg.jpg) repeat-y; }

#commonheaderwrap #menubar { position: relative; width: 960px; height: 30px; font-size: .9em; line-height: 2.6em; background: url(/_common/img/menubg.png) repeat-x; background-color: #000; color: #e6e6e6; }

#headernavouter {border: 1px solid red;}

#searchinput { position: absolute; top: 7px; left: 479px; width: 182px; height: 14px; padding: 0 4px; color: #781351; color: #474646; background: #faeec7; background: #ccc; border: 1px solid #efefef; font-size: 1.2em; }
#searchicon {position: absolute; top: 0; left: 671px; width: 30px; height: 30px; z-index: 9999;}
#searchform label { color: #999; display: none; }
#searchform { margin: 0; padding: 0; }
#searchform fieldset { margin: 0; padding: 0; border: 0; }

input#searchinput[type="text"]:focus#searchinput { border: 1px solid #fff; background:#fff; background: #eee; color:#13465F; }

#quicklinks { position: absolute; top: 0; left: 670px; width: 260px; padding-right: 30px; text-align: right; color: #ffffff; }
#quicklinks a { color: #ccc; text-decoration: none; padding: .2em .5em; }
#quicklinks a:hover { color: #acacac; color: #fff; }

#commonheaderwrap #menubar #search { font-size: .8em; }
#commonheaderwrap #banner { position: relative; width: 960px; height: 75px; background-color: #fff; }
/* #commonheaderwrap #banner #logo { width: 225px; height: 75px; } */
#commonheaderwrap #banner #logo { position: absolute; top: 4px; left: 5px; }
#commonheaderwrap #banner #chmbuilding { position: absolute; top: 0; left: 565px;}

#commonheaderwrap #banner #globalnavwrap { position: absolute; top: 55px; left: 0; height: 20px; }

#globalnav { padding: 0 0; margin: 0 auto; list-style-type: none; background: #fff; }
#globalnav li { float: left; width:95px; margin-right: 2px; }
#globalnav a { display: block; float: left; padding: 0 0; width:95px; color: #333333; line-height: 20px; font-size: .9em; text-align: center; text-decoration: none; }
#globalnav a:hover, #globalnav a.active { color:#fff; }

#commonheaderwrap #menubar #search { font-size: .8em; }
#commonheaderwrap #banner { position: relative; width: 960px; height: 75px; background-color: #fff; }
/* #commonheaderwrap #banner #logo { width: 225px; height: 75px; } */
#commonheaderwrap #banner #logo { position: absolute; top: 4px; left: 5px; }
#commonheaderwrap #banner #chmbuilding { position: absolute; top: 0; left: 565px;}

#commonheaderwrap #banner #globalnavwrap { position: absolute; top: 55px; left: 0; height: 20px; }

#globalnav { padding: 0 0; margin: 0 auto; list-style-type: none; background: #fff; }
#globalnav li { float: left; width:95px; margin-right: 1px; }
#globalnav a { display: block; float: left; padding: 0 0; width:95px; color:#efefef; line-height: 20px; font-size: .9em; text-align: center; text-decoration: none; }
#globalnav a:hover { color:#fff; }

#globalnav #visitus { background: #365F82; }
#globalnav #visitus a:hover, #globalnav #visitus .active { background: url(/_common/img/globalnav-hl-visitus.png); }

#globalnav #exhibits { background: #900000; }
#globalnav #exhibits a:hover, #globalnav #exhibits .active { background: url(/_common/img/globalnav-hl-exhibits.png); }

#globalnav #explore { background: #ff9900; }
#globalnav #explore a:hover, #globalnav #explore .active { background: url(/_common/img/globalnav-hl-explore.png); }

#globalnav #getinvolved { background: #3f5b2a;  }
#globalnav #getinvolved a:hover, #globalnav #getinvolved .active { background: url(/_common/img/globalnav-hl-getinvolved.png); }

#globalnav #venuerental { background: #5e5e5e; }
#globalnav #venuerental a:hover, #globalnav #venuerental .active { background: url(/_common/img/globalnav-hl-venuerental.png); }

#globalnav #events { background: #3b9eb8;}
#globalnav #events a:hover, #globalnav #events .active { background: url(/_common/img/globalnav-hl-events.png); }



#commonheaderwrap .aboutus {background: #475e80; background-image: none;}

/* COMMON BODY */
#commonbodywrap { width: 960px; background: #fff url(/_common/img/bodybg.png) repeat-y; }

#commonbodywrap #contentwrap { float: right; width: 734px; font-size: .9em; color: #333; }
#contentwrap #content { margin: 20px 30px 50px 20px; font-size: 1.2em; line-height: 1.4em; color: #5B5B5B; }
#contentwrap #content h1 { font-weight: normal; font-size: 1.6em; letter-spacing: -1px; margin: 2px 0 30px; padding: 2px 0 2px 15px; line-height: 1.1em; }
#contentwrap #content h2 { clear: both; padding: 0; color: #333; font-size: 1.3em; font-weight: normal; margin: 1.5em 0 10px; }
#contentwrap #content hr { border: 0; height: 1px; background-color: #c0c0c0; margin: 0; padding: 0;}
/*#contentwrap #content p { font-size: .9em; }*/

#contentwrap #content ul { list-style-type: none; padding-left: 9px; margin: 0; }

/* LOCAL NAV */
#commonbodywrap #localnavwrap { float: left; width: 220px; padding-bottom: 50px; }
.localnav li { display:block; width: 218px; margin-left: 1px; border-bottom: 1px solid #efefef; text-align: left; font-family: arial; overflow: hidden; }
.localnav li a { display: block;  color: #3e3e3e; text-decoration: none; line-height: 20px; font-size: 1em; float: left; width: 218px; }
.localnav li a { background: url(/_common/img/localnav-listicon-off.gif) no-repeat; background-position: 18px 7px; padding-left: 30px; } 
.localnav li a.inner-redirect img { padding-left: 7px !important; } 
.localnav li .active { color: #3e3e3e; background: #ccc url(/_common/img/localnav-listicon-on.gif) no-repeat; background-position: 18px 7px;}
.localnav li a:hover { color: #000; background: #ccc url(/_common/img/localnav-listicon-on.gif) no-repeat; background-position: 18px 7px; } 

/* NAV EMBEDDED INTO LOCAL NAV */
.sublocalnav li { display:block; width: 198px; padding-left: 20px; margin-left: 1px; border-bottom: 1px solid #efefef; text-align: left; font-family: arial; }
.sublocalnav li a { display: block; color: #3e3e3e; text-decoration: none; line-height: 20px; font-size: 1em; }
.sublocalnav li a { background: url(/_common/img/localnav-listicon-off.gif) no-repeat; background-position: 18px 7px; padding-left: 30px; } 
.sublocalnav li .active { color: #3e3e3e; background: #ccc url(/_common/img/localnav-listicon-on.gif) no-repeat; background-position: 18px 7px;}
.sublocalnav li a:hover { color: #000; background: #ccc url(/_common/img/localnav-listicon-on.gif) no-repeat; background-position: 18px 7px; } 


/* COMMON FOOTER */
#commonfooterwrap { clear: both; margin: auto; width: 960px; height: 30px; font-size: .8em; line-height: 2.5em; background-color: #efefef; color: #6e6e6e; padding-bottom: 20px;}
#commonfooterwrap #copyright {float: left; }
#commonfooterwrap #navigation {float: right; }
#commonfooterwrap #navigation a:link, #commonfooterwrap #navigation a:visited { color: #6e6e6e; text-decoration: none; }
#commonfooterwrap #navigation a:hover { color: #4366a9; }
#commonfooterwrap #navigation a:active { color: #6e6e6e; }


.generaltable { font-size: 1em; }

/* different heights for pane divs */
.h300 { height: 300px !important; }
.h350 { height: 350px !important; }
.h400 { height: 400px !important; }
.h450 { height: 450px !important; }
.h500 { height: 500px !important; }
.h550 { height: 550px !important; }
.h600 { height: 600px !important; }
.h650 { height: 650px !important; }
.h700 { height: 700px !important; }
.h750 { height: 750px !important; }
.h800 { height: 800px !important; }

/* TYPOGRAPHY */
.typographyOrange { color: #ff6633 !important; }
.typographyBlue { color: /*#BCD1E2*/ #36377c !important; }
.typographyGrey { color: /*#999999*/ #8d8c8c !important; }
.typographyGreen { color: #006600 /*#3c6234*/ !important; }
.typographyLilac { color: #a05bac !important; }


/* Clear Fix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; line-height: 0; height: 0; }

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix {display: block;}
/* End hide from IE-mac */
* html .clearfix { height: 1%; }
html[xmlns] .clearfix { display: block; }