/* "collections.css" - main layout styles for the Wellcome Collection - Includes any layout-based typographical elements (positioned

's and lists etc) Contents: - Universal Reset, and accessibility - Main layout ****************************************************************************************/ @import "typography.css"; @import "home.css"; /* - Universal Reset, and accessibility ---------------------------------------------------------------------------------------*/ *{ margin: 0; padding: 0; } html, body { font: 88%/2 Arial, Helvetica, sans-serif; height: 100%; margin-bottom:1px; color: #000; /* background: #F8F8F8 url('../css_images/common/bg_tile.gif') repeat-y 50%; */ } body{ position: left; width: 610px; /* margin: 0 auto; */ padding: 25px; height: auto; } /* - Main layout ---------------------------------------------------------------------------------------*/ /* Branding */ div#branding{ position: relative; top: 0; left: 0; width: 610px; height: 8em; border-top: 1px solid #6D6B70; border-bottom: 1px solid #6D6B70; background: url('../css_images/common/bg_branding.gif') no-repeat top left; } /* Navigation */ div#navigation{ position: relative; top: 0; left: 0; width: 610px; height:5em; line-height: 50px; border-bottom: 1px solid #6D6B70; } div#navigation ul#nav_main{ width: 590px; float: left; } #home div#navigation ul#nav_main{ margin-top: 0; } /*new from ico2*/ div#navigation ul#nav_sub{ position: absolute; top: -8em; right: 0; width: 200px; height: 7.5em; padding-top: 1em; margin-bottom: -90px; line-height: 1.4em; } div#navigation ul#nav_main li ul#sublinks{ position: absolute; top: .9em; left: 0; float: left; width: 600px; } /*new from ico2*/ div#navigation ul#nav_main li ul#sublinks li{ float: left; font-size: .8em; } /*new from ico2*/ /* Search box */ div#navigation form#search{ float: right; /*width: 200px;*/ height: 50px; margin-top: 10px; line-height: 1.5em; } /* Target IE7 Only */ html>body div#navigation form#search{ *width: 200px; } /* Main content from ico2*/ div#main{ position: relative; float: left; width: 610px; } div#main #objectgallery{ position: relative; float: left; width: 610px; height: 275px; text-indent: -999em; background: url('../css_images/common/sorry.jpg'); } /* Secondary main content */ div.main_subcontent{ position: relative; float: left; margin: 20px 0 0 0; } div.main_subcontent ul.subcontent_item li{ float: left; width: 300px; min-height: 12em; margin-bottom: 1em; } div.main_subcontent ul.subcontent_item li img{ margin-bottom: 5em; } /* Sidebar content */ ul#secondary{ float: right; width: 200px; } #exhibits_flash ul#secondary{ position: absolute; top: 340px; right: -240px; } ul#secondary li{ float: left; width: 200px; padding: 0 0 10px 0; /*border-bottom: 1px solid #6D6B70;*/ } ul#secondary li.last{ border-bottom: none; } /* Site info (footer) */ div#siteinfo{ position: relative; top: 10px; left: 0; width: 610px; height: 30px; line-height: 30px; border-top: 1px solid #6D6B70; float:left; } /* added by MP */ div#navigation form#search_new{ float: right; width: 190px; height: 50px; margin-top: 10px; line-height: 1.5em; } div#navigation ul#nav_main_level1{ position: absolute; top: 25px; right: 0; left: 0px; _height: 7.5em; padding-top: 1em; _margin-bottom: -90px; line-height: 1.5em; } div#navigation_level1{ position: relative; top: 0; left: 0; width: 610px; /*height: 50px; line-height: 50px; border-bottom: 1px solid #6D6B70;*/ } div#navigation_level1 ul#nav_sub_leve11{ width: 600px; float: left; } /*for regular 2 col table*/ #main td{ width:50%; } #eventstable{ width:610px; margin-bottom:20px; } #eventstable .imgcol{ width:100px; padding-bottom:2em; } #eventstable .txtcol{ width:180px; padding-left:15px; padding-bottom:1em; } #eventstable .divcol{ width:20px; } #eetable{ width_:610px; margin-bottom:20px; } #eetable .imgcol{ width:100px; padding-bottom:2em; } #eetable .txtcol{ width:180px; padding-left:15px; padding-bottom:1em; } #eetable .divcol{ width:20px; } #secondary li table{ width: 180px; /*padding-left:15px;*/ } #secondary li td{ width: 100px; } #secondary li ul li{ padding-left: 15px; } #secondary li ul li h3{ font-size: 1.1em; } ul#staticlist li{ float: left; width: 610px; padding: 0 0 10px 0; } .line { border-top-width: 1px; border-top-style: solid; border-top-color: #6d6b70; } div#main a{ color: #990099; } div#main ul li_{ padding-left: 15px; line-height: 1.5em; background: url('../css_images/icons/arrow_purple.gif') no-repeat left 1px; } .arrowpurplelist{ padding-left: 15px; line-height: 1.5em; background: url('../css_images/icons/arrow_purple.gif') no-repeat left 1px; } div.main_subcontent_ { width:100px; } #main_ td img{ width:100px; margin-right:15px; } #main_ td p, #main td h1, #main td h1{ width:180px; } #exhibtable{ border-top: 1px solid #6d6b70; margin-top:20px; padding-top:20px; } #exhibtable p{ width:385px; margin-bottom:20px; margin-left:25px; } #exhibtable h3{ width:385px; margin-left:25px; } #exhibtable img{ margin-bottom:20px; } #moduletable p_{ width:100px; } #moduletable h2_{ width:100px; } #moduletable img_{ margin-bottom:20px; } .twocoltable p__{ height: .5em; } .twocoltable td{ width:50%; } #sendtofriend td { width:120px; margin-bottom:20px; } #sitemap td.left div a { color:#000; } #sitemap td.right div a { color:#6D6B70; } /*Layered image galleries (using word style Image Gallery)*/ #layer1 {visibility: visible; display: block;} #layer2 {visibility: hidden; display: none;} #layer3 {visibility: hidden; display: none;} #layer4 {visibility: hidden; display: none;} #layer5 {visibility: hidden; display: none;} #layer6 {visibility: hidden; display: none;} #layer7 {visibility: hidden; display: none;} #layer8 {visibility: hidden; display: none;} #layer9 {visibility: hidden; display: none;} #layer10 {visibility: hidden; display: none;} #layer11 {visibility: hidden; display: none;} #layer12 {visibility: hidden; display: none;} #layer13 {visibility: hidden; display: none;} #layer14 {visibility: hidden; display: none;} #layer15 {visibility: hidden; display: none;} #layer16 {visibility: hidden; display: none;} #layer17 {visibility: hidden; display: none;} #layer18 {visibility: hidden; display: none;} #layer19 {visibility: hidden; display: none;} #layer20 {visibility: hidden; display: none;} #layer21 {visibility: hidden; display: none;} #layer22 {visibility: hidden; display: none;} #layer23 {visibility: hidden; display: none;} #layer24 {visibility: hidden; display: none;} #layer25 {visibility: hidden; display: none;} #layer26 {visibility: hidden; display: none;} #layer27 {visibility: hidden; display: none;} #layer28 {visibility: hidden; display: none;} #layer29 {visibility: hidden; display: none;} #layer30 {visibility: hidden; display: none;} /*Lightbox styles*/ #lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; } #lightbox a img{ border: none; } #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #imageContainer{ padding: 10px; } #loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #imageContainer>#hoverNav{ left: 0;} #hoverNav a{ outline: none;} #prevLink, #nextLink{ width: 49%; height: 100%; background: transparent url(../css_images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */ display: block; } #prevLink { left: 0; float: left;} #nextLink { right: 0; float: right;} #prevLink:hover, #prevLink:visited:hover { background: url(../css_images/lightbox/prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(../css_images/lightbox/nextlabel.gif) right 15% no-repeat; } #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100% } #imageData{ padding:0 10px; color: #666; } #imageData #imageDetails{ width: 70%; float: left; text-align: left; } #imageData #caption{ font-weight: bold; } #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; } #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; } #removeShadow{ background:none; } /*css shadow*/ .img-shadow { background: url(../css_images/shadow.gif); width:110px; height:78px; } /*online exhibitions - margin differs IE and FF*/ #exhibits #hpmodules td p{ font-size: 1.1em; color: #595959; margin-top: -1px; } #slideshow img{ padding-bottom:0px; } .atop img{ padding-bottom:0px; } #linlinktable{ /*margin-bottom:300px;*/ } #linlinktable table{ width:300px; } #linlinktable td{ padding-right:10px; } /*use for whole page background images*/ #node_9300702{ background-image:url('../css_images/summer2.gif'); background-repeat: no-repeat; background-position: 0px 100px; } #node_9300702 div#main{ width:600px; } #node_9300702 h1{ margin-bottom:250px; } #node_9300702 h2{ margin-top:10px; margin-bottom:10px; } #node_9300702 td { padding-right:10px; padding-bottom:10px; } #node_9300702 td p{ margin-top:0px; } #node_9300702 td p b{ line-height:1.8em; } #node_9300702 img{ background:none; padding-bottom:0px; } #node_9300702 #siteinfo{ margin-top:-10px; } #node_9300720{ background-image:url('../css_images/big_draw_bg.gif'); background-repeat: no-repeat; background-position: 0px 100px; } #node_9300720 div#main{ width:400px; } #node_9300720 h1{ margin-bottom:250px; } #node_9300720 #map img{ margin-top:50px; } /*Skeletons*/ #loc1 { position:relative; left:10px; top:-490px; width:250px; z-index:2; display:none; float:left; margin-bottom:-490px; } #loc2 { position:relative; left:520px; top:-500px; width:250px; z-index:3; display:none; float:left; margin-bottom:-500px; } #loc3 { position:relative; left:550px; top:-480px; width:250px; z-index:4; display:none; float:left; margin-bottom:-480px; } #loc4 { position:relative; left:550px; top:-450px; width:250px; z-index:5; display:none; float:left; margin-bottom:-450px; } #loc5 { position:relative; left:550px; top:-420px; width:250px; z-index:6; display:none; float:left; margin-bottom:-420px; } #loc6 { position:relative; left:520px; top:-350px; width:250px; z-index:7; display:none; float:left; margin-bottom:-350px; } #loc7 { position:relative; left:480px; top:-350px; width:250px; z-index:8; display:none; float:left; margin-bottom:-350px; } #loc8 { position:relative; left:350px; top:-285px; width:250px; z-index:9; display:none; float:left; margin-bottom:-285px; } #loc9 { position:relative; left:0px; top:-370px; width:250px; z-index:10; display:none; float:left; margin-bottom:-370px; } #loc10 { position:relative; left:10px; top:-450px; width:250px; z-index:11; display:none; float:left; margin-bottom:-450px; } .pu_text{ position:relative; background-color:#fff; border-left:2px solid #000; border-right:2px solid #000; padding-left:10px; padding-right:10px; __width:176px; width:226px; float:left; } .pu_top_img{ height:10px; width:250px; background-image:url(../css_images/pu_top_250.gif); background-repeat: no-repeat; float:left; } .pu_bottom_img{ height:10px; width:250px; background-image:url(../css_images/pu_bottom_250.gif); background-repeat: no-repeat; float:left; } #exhibits #linlinktable{ float:left; } /*Anatomical Venus*/ #venus_info { position:relative; left:10px; top:-610px; width:260px; z-index:1; /*display:none;*/ float:left; margin-bottom:-610px; } #venus_loc1 { position:relative; left:10px; top:-930px; width:260px; z-index:2; display:none; float:left; margin-bottom:-930px; } #venus_loc2 { position:relative; left:10px; top:-930px; width:260px; z-index:3; display:none; float:left; margin-bottom:-930px; } #venus_loc3 { position:relative; left:10px; top:-930px; width:260px; z-index:4; display:none; float:left; margin-bottom:-930px; } #venus_loc4 { position:relative; left:10px; top:-930px; width:260px; z-index:5; display:none; float:left; margin-bottom:-930px; } /*social bookmarks*/ #sharelinks ul{ width:610px; float:left; margin-top:20px; } #shareslist li{ padding:0; margin:0; float:left; list-style: none; display: inline; margin-right:12px; } li#delicious {background-image:url(../css_images/deli.gif);background-repeat: no-repeat;} li#reddit {background-image:url(../css_images/reddit.gif);background-repeat: no-repeat;} li#digg {background-image:url(../css_images/digg.gif);background-repeat: no-repeat;} li#facebook {background-image:url(../css_images/facebook.gif);background-repeat: no-repeat;} li#stumbleupon {background-image:url(../css_images/stumble.gif);background-repeat: no-repeat;} /*li#yahoo {background-image:url(../css_images/yahoo.gif);background-repeat: no-repeat;}*/ #shareslist a { margin-left:25px; font-weight:100; position:relative; top:-3px; } #home .arrow_grey_box a, #home .sound_grey a, #home .vision_grey a { color: #707176; font-size:90%; } .home_image_blue { padding-left:10px; border-left:1px solid #7a95d2; border-right:1px solid #7a95d2; border-bottom:1px solid #7a95d2; margin-bottom:20px; padding-top:10px; padding-bottom:10px; } .home_image_purple { padding-left:10px; border-left:1px solid #660099; border-right:1px solid #660099; border-bottom:1px solid #660099; margin-bottom:20px; padding-top:10px; padding-bottom:10px; } .home_image_grey { padding-left:10px; border-left:1px solid #707176; border-right:1px solid #707176; border-bottom:1px solid #707176; margin-bottom:20px; padding-top:10px; padding-bottom:10px; } .home_image_green { padding-left:10px; border-left:1px solid #bbbb0c; border-right:1px solid #bbbb0c; border-bottom:1px solid #bbbb0c; margin-bottom:20px; padding-top:10px; padding-bottom:10px; }