Skip to content

Instantly share code, notes, and snippets.

@naeluh

naeluh/index.html

Created February 27, 2015 19:49
Show Gist options
  • Save naeluh/bb1ab536a79d60bc7adf to your computer and use it in GitHub Desktop.
Save naeluh/bb1ab536a79d60bc7adf to your computer and use it in GitHub Desktop.
Download ZIP
Grandes Maestros | Natural History Museum of Los Angeles // source http://jsbin.com/doqopa
Raw
index.html
<html class="js">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Grandes Maestros | Natural History Museum of Los Angeles</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="shortcut icon" href="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/images/favicon.ico" type="image/x-icon">
<meta name="keywords" content="nhm,natural history museum,los angeles county">
<meta name="dcterms.date" content="2014-06-26T00:00:00Z">
<meta name="copyright" content="©2011 Natural History Museum of Los Angeles County">
<link rel="canonical" href="http://stage.nhm.orghttp://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros">
<meta name="revisit-after" content="1 day">
<script type="text/javascript" src="http://stage.nhm.org/site/misc/jquery.js?5"></script>
<style type="text/css"></style>
<script type="text/javascript" src="http://stage.nhm.org/site/misc/drupal.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/sites/all/modules/jquery_aop/misc/jquery.aop.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/sites/all/modules/lightbox2/js/lightbox.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/misc/collapse.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/misc/tableheader.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/js/jquery.clearinginput.min.js?5"></script>
<script type="text/javascript" src="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/js/header.js?5"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
jQuery.extend(Drupal.settings, { "basePath": "http://stage.nhm.org/site/", "lightbox2": { "rtl": "0", "file_path": "http://stage.nhm.org/site/(\\w\\w/)sites/default/files", "default_image": "http://stage.nhm.org/site/sites/all/modules/lightbox2/images/brokenimage.jpg", "border_size": 10, "font_color": "000", "box_color": "fff", "top_position": "", "overlay_opacity": "0.8", "overlay_color": "000", "disable_close_click": true, "resize_sequence": 0, "resize_speed": 400, "fade_in_speed": 400, "slide_down_speed": 600, "use_alt_layout": false, "disable_resize": false, "disable_zoom": false, "force_show_nav": false, "show_caption": true, "loop_items": false, "node_link_text": "View Image Details", "node_link_target": false, "image_count": "Image !current of !total", "video_count": "Video !current of !total", "page_count": "Page !current of !total", "lite_press_x_close": "press \x3ca href=\"#\" onclick=\"hideLightbox(); return FALSE;\"\x3e\x3ckbd\x3ex\x3c/kbd\x3e\x3c/a\x3e to close", "download_link_text": "Download Original", "enable_login": false, "enable_contact": false, "keys_close": "c x 27", "keys_previous": "p 37", "keys_next": "n 39", "keys_zoom": "z", "keys_play_pause": "32", "display_image_size": "", "image_node_sizes": "()", "trigger_lightbox_classes": "", "trigger_lightbox_group_classes": "", "trigger_slideshow_classes": "", "trigger_lightframe_classes": "", "trigger_lightframe_group_classes": "", "custom_class_handler": 0, "custom_trigger_classes": "", "disable_for_gallery_lists": true, "disable_for_acidfree_gallery_lists": true, "enable_acidfree_videos": true, "slideshow_interval": 5000, "slideshow_automatic_start": 0, "slideshow_automatic_exit": 1, "show_play_pause": 1, "pause_on_next_click": 0, "pause_on_previous_click": 1, "loop_slides": 0, "iframe_width": 600, "iframe_height": 400, "iframe_border": 1, "enable_video": false }, "nice_menus_options": { "delay": "800", "speed": "slow" } });
//--><!]]>
</script>
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/modules/ckeditor/ckeditor.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/modules/date/date_popup/themes/datepicker.1.7.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/modules/date/date_popup/themes/jquery.timeentry.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/modules/lightbox2/css/lightbox.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/modules/views/css/views.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/css/funky-tabs.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/css/base.css?5">
<link type="text/css" rel="stylesheet" media="all" href="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/css/nodes.css?5">
<link type="text/css" rel="stylesheet" media="print" href="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/css/nhm_print.css?5">
<!--link rel="alternate" type="application/rss+xml" title="RSS Feed for NHMLA" href="http://stage.nhm.org/rss/" /-->
<script>
$(function(){$('a.sync-window').click(function(){window.open(this.href, 'Sync Window', 'width=500,height=280,scrollbars=yes');return false;});});
</script>
<script type="text/javascript" src="http://stage.nhm.org/site/sites/all/themes/zen_nhm_theme/js/fittext.js"></script>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
<style id="jsbin-css">
#gblheader
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
height:39px;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px;
z-index:1
}
#gNavContent
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px
}
#closeNav
{
color: #000;
cursor: pointer;
display: block;
float: right;
font-size: 19px;
font-weight: 700;
position: relative;
right: 17px;
top: 193px;
}
li
{
list-style-type:none
}
#gNav > ul > li > a
{
display:inline;
float:left;
padding:16px;
text-decoration:none;
width:298px
}
#gNav > ul > li > a:hover
{
text-decoration:none
}
#gNav > ul > li > a > h1
{
font-size:1.196em;
font-weight:700
}
#gNav > ul > li > a > p
{
color:#000;
font-size:.953em;
font-weight:700;
height:95px;
line-height:17px;
margin:1em 0
}
#gNav > ul > li:nth-child(1) > a > h1
{
color:#788d39
}
#gNav > ul > li:nth-child(2) > a > h1
{
color:#0070af
}
#gNav > ul > li:nth-child(3) > a > h1
{
color:#b5121b
}
#navContainer
{
background-color:#f6f6f5;
color:#000;
height:39px;
margin:0 auto;
padding:0;
position:absolute;
width:100%
}
a
{
color:#000;
text-decoration:none
}
#gblheader > ul
{
float:right;
margin-right:19px
}
#gblheader > p
{
float:left;
font-weight:700;
margin:11px 0 0 15px
}
#gblheader > p:nth-child(1)
{
cursor:pointer
}
#gblheader > ul > li
{
float:left;
margin:14px 0 0 3px
}
#bkgrd
{
height:100%;
position:absolute;
top:39px;
width:100%;
z-index:3
}
.up
{
top:39px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.down
{
top:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_up
{
height:39px!important;
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_down
{
height:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_up
{
top:-265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_down
{
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
#blContent
{
position:relative;
top:39px;
z-index:3
}
@media only screen and (max-device-width: 768px) {
#gNav > ul > li > a
{
padding:12px;
width:298px
}
#gNav > ul > li > a > h1
{
font-size:1.196em
}
#gNav > ul > li > a > p
{
font-size:1em;
height:97px;
line-height:17px
}
#gNav
{
height:212px;
width:970px
}
#closeNav
{
right:17px;
top:-30px
}
}
</style>
</head>
<body class="lightbox-processed tableHeader-processed">
<!-- GNAV START -->
<div id="navContainer">
<nav id="gNav">
<div id="gblheader">
<p id="button" style="color:black;">The Family of Museums</p>
<p>Read more about our Family</p>
<ul>
<li> <a href="#">
nhm.org
</a>
|
</li>
<li> <a href="#">
tarpits.org
</a>
|
</li>
<li> <a href="#">
hartmuseum.org
</a>
</li>
</ul>
</div>
<div class="blClear"></div>
<ul id="gNavContent" class="pos_up">
<li>
<a href="#">
<h1 id="gNavHeader1">Natural History Museum of Los Angeles County</h1>
<p id="gNavCopy1">The NHM has amassed one of the world’s most extensive and valuable collections of natural and cultural history — more than 35 million objects, some as old as 4.5 billion years.</p>
<img src="https://jsbin-user-assets.s3.amazonaws.com/naeluh/nhm-logo.png">
</a>
</li>
<li>
<a href="#">
<h1 id="gNavHeader2">The Page Museum at La Brea Tar Pits</h1>
<p id="gNavCopy2">Located in the heart of metropolitan Los Angeles, the world famous Page Museum at the La Brea Tar Pits represents the only active urban paleontological excavation site in the United States. </p>
<img src="https://jsbin-user-assets.s3.amazonaws.com/naeluh/tarpits-logo.png">
</a>
</li>
<li>
<a href="#">
<h1 id="gNavHeader3">The Hart Museum and Ranch</h1>
<p id="gNavCopy3">Silent film star William S. Hart purchased ranch property in Newhall, north of Los Angeles, in 1921. He built a 22-room mansion and filled it with Western art, Native American artifacts, and early Hollywood memorabilia.</p>
<img src="https://jsbin-user-assets.s3.amazonaws.com/naeluh/hart-logo.png">
</a>
</li>
<li id="closeNav">X</li>
</ul>
</nav>
</div>
<div id="bkgrd"></div>
<script type="text/javascript">
var sZe = 2.5223;
var sZeTwo = 2.7223;
window.fitText( document.getElementById("gNavHeader1"), sZe );
window.fitText( document.getElementById("gNavHeader2"), sZe );
window.fitText( document.getElementById("gNavHeader3"), sZe );
window.fitText( document.getElementById("gNavCopy1"), sZeTwo );
window.fitText( document.getElementById("gNavCopy2"), sZeTwo );
window.fitText( document.getElementById("gNavCopy3"), sZeTwo );
</script>
<!-- GNAV END -->
<!-- Begin blContent -->
<div id="blContent">
<!-- header begin -->
<div id="exnav-block">
<div id="blHeader">
<h1><a href="http://stage.nhm.org/site/">Grandes Maestros | Natural History Museum of Los Angeles</a></h1>
<!-- Begin bl_menu_top -->
<div id="bl_menu_top" style="">
<form action="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros" accept-charset="UTF-8" method="post" id="search-theme-form">
<div>
<div id="search" class="container-inline">
<div class="form-item" id="edit-search-theme-form-1-wrapper"><input type="text" value="SEARCH" id="nhm_search_input" name="search_theme_form" class="blur"></div>
<input type="submit" name="op" id="edit-submit-1" value="Search" class="form-submit" style="display: none;">
<input type="hidden" name="form_build_id" id="form--aXZsjNojYaefEiSoONbf_jJOo8HtScpqxp1fYV-Zqc" value="form--aXZsjNojYaefEiSoONbf_jJOo8HtScpqxp1fYV-Zqc">
<input type="hidden" name="form_token" id="edit-search-theme-form-form-token" value="3c275dcfa73efa78debb50f9736d11ec">
<input type="hidden" name="form_id" id="edit-search-theme-form" value="search_theme_form">
</div>
</div>
</form>
<!--<input name="" type="text" value="SEARCH" />-->
<div id="bl_menu_top_links">
<div id="exnav-secondary-links">
<ul class="links secondary-links">
<li class="menu-1239 first"><a href="http://stage.nhm.org/site/about-our-museums" title="About Our Museums">About Our Museums</a></li>
<li class="menu-1242"><a href="http://shop.nhm.org/" title="Shop">Shop</a></li>
<li class="menu-1243"><a href="http://stage.nhm.org/site/join-us/make-a-gift" title="Donate">Donate</a></li>
<li class="menu-1241"><a href="http://stage.nhm.org/site/join-us/membership" title="Membership">Membership</a></li>
<li class="menu-1240"><a href="http://stage.nhm.org/site/join-us/volunteers-docents" title="Volunteer">Volunteer</a></li>
<li class="menu-71812"><a href="http://stage.nhm.org/site/about-our-museums/event-rentals-filming" title="Events/Filming">Events/Filming</a></li>
<li class="menu-36152 last"><a href="http://tickets.nhm.org/WebStore/shop/ViewItems.aspx?CG=nhmonline&amp;C=nhmtickets" title="Buy Tickets">Tickets</a></li>
</ul>
</div>
</div>
</div>
<div class="blClear"></div>
<div id="bl_menu">
<div id="exnav-primary-links">
<ul class="links primary-links">
<li class="menu-1227 first"><a href="http://stage.nhm.org/site/plan-your-visit" title="Plan Your Visit" container="0">Plan Your Visit</a></li>
<li class="menu-1245"><a href="http://stage.nhm.org/site/explore-exhibits" title="Explore Exhibits" class="top-menu-active">Explore Exhibits</a></li>
<li class="menu-1229"><a href="http://stage.nhm.org/site/calendar" title="Calendar" container="0">Calendar</a></li>
<li class="menu-1439"><a href="http://stage.nhm.org/site/activities-programs" title="Activities &amp; Programs">Activities &amp; Programs</a></li>
<li class="menu-1441"><a href="http://stage.nhm.org/site/for-teachers" title="For Teachers">For Teachers</a></li>
<li class="menu-1233"><a href="http://stage.nhm.org/site/research-collections" title="Research and Collections" container="0">Research and Collections</a></li>
<li class="menu-1440 last"><a href="http://stage.nhm.org/site/join-us" title="Join Us">Join Us</a></li>
</ul>
</div>
<div class="blClear"></div>
</div>
<div>
<img src="http://stage.nhm.org/site/sites/default/files/marketing/hero/gm_header_7.jpg" style="float:left;" height="147" width="707">
<div class="bl_block">The special exhibit features more than 1,200 works made by the best folk artists in Latin America, Spain and Portugal.</div>
</div>
<div class="blClear"></div>
</div>
</div>
<!-- header end -->
<!-- Begin bl_content_box -->
<div id="bl_content_box">
<div class="bl_paginator">
<div class="breadcrumb"><a href="http://stage.nhm.org/site/">Home</a> &gt; <a href="http://stage.nhm.org/site/explore-exhibits" title="Explore Exhibits">Explore Exhibits</a> &gt; <a href="http://stage.nhm.org/site/explore-exhibits" title="Special Exhibits">Special Exhibits</a> &gt; Grandes Maestros</div>
</div>
<div class="bl_right_column">
<!-- id: 3309 -->
<div id="rcm_toolber">
[ <a href="http://stage.nhm.org/site/node/3309" class="rcm_link" title="*** NOTE: These links will open in a new browser window or tab. ***" target="_blank">View RCM</a> ]
[ <a href="http://stage.nhm.org/site/node/3309/edit" class="rcm_link" title="*** NOTE: These links will open in a new browser window or tab. ***" target="_blank">Edit RCM ]</a> ]
[ <a href="http://stage.nhm.org/site/node/3309/workflow" class="rcm_link" title="*** NOTE: These links will open in a new browser window or tab. ***" target="_blank">RCM Workflow</a> ]
<br>
</div>
<div class="bl_box">
<h4>New Exhibit Now Open!</h4>
<div class="bl_sectionimage">
<img src="http://stage.nhm.org/site/sites/default/files/marketing/rcm_img/module_treeoflife_1.jpg" width="230">
</div>
<div class="bl_box2">
<p>Become a member today, and receive free tickets to <a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros"><em>Grandes Maestros: Great Masters of Iberoamerican Folk Art, Collection of Fomento Cultural Banamex</em></a>!</p>
<p><span>Presenting sponso</span><span>r</span></p>
<p><a href="https://www.scholarshare.com/"><img alt="" height="46" src="http://stage.nhm.org/site/sites/default/files/module_scholarshare_0.jpg" width="208"></a></p>
</div>
</div>
</div>
<div class="bl_left_column">
<div id="block-menu-menu-grandes-maestros" class="clear-block block block-menu">
<h2>Grandes Maestros</h2>
<div class="content">
<ul class="menu">
<li class="leaf first active-trail menu-active"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros" class="active">About the Exhibit</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/exhibit-highlights">Exhibit Highlights</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/events">Events</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/gallery-store">Gallery Store</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/member-previews">Member Previews</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/food">Food</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/group-sales">Group Sales</a></li>
<li class="leaf last"><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/media">Videos</a></li>
</ul>
</div>
</div>
</div>
<script>
//$(".block-nice_menus").remove();
$(".block-user").remove();
</script>
<div class="bl_center bl_article">
<h2>Grandes Maestros</h2>
<h3>November 9, 2014 through September 13, 2015</h3>
<p>NHM is pleased to host the U.S. debut of the extraordinary traveling exhibition&nbsp;<em>Grandes Maestros: Great Masters of Iberoamerican Folk Art, Collection of Fomento Cultural Banamex</em>.</p>
<p><strong><a href="http://tickets.nhm.org/WebStore/shop/ViewItems.aspx?CG=nhmonline&amp;C=NHMTickets"><img alt="" src="http://stage.nhm.org/site/sites/default/files/marketing/mc/gm_buyTickets.png"></a></strong></p>
<p>One of the best art shows of 2014&nbsp;—&nbsp;Christopher Knight of the <em>Los Angeles Times</em></p>
<p>One of the best 15 art exhibits of 2014&nbsp;—&nbsp;Huffington Post</p>
<p>Experience culture through art.&nbsp;<em>Grandes Maestros </em>brings together hundreds of folk art masters from across 22 countries to showcase modern culture, religion and traditions through a celebration of beauty and power. Crafted by the best living artisans in the world, these more than 1,200 pieces tell the modern day stories of communities across Mexico, Central and South American, Spain and Portugal.</p>
<p><strong>Reserve your tickets online today!&nbsp;<br>
<a href="http://tickets.nhm.org/WebStore/shop/ViewItems.aspx?CG=nhmonline&amp;C=NHMTickets"><span>Buy Tickets</span></a></strong>
</p>
<h3>Grandes Maestros Events and Programming</h3>
<p>Throughout the exhibition, there will be a number of cultural events and programming, including a Latin Festival, food workshops, hands-on activies, musical events, lectures and more. Click <a href="http://www.nhm.orghttp://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/events">here</a> for more info.</p>
<h3>Become a Member and See it for FREE!</h3>
<p>NHM members receive numerous benefits, including year-round free admission to the Museum and special exhibitions. Become a Member today, and receive free&nbsp;tickets to&nbsp;<em>Grandes Maestros: Great Masters of Iberoamerican Folk Art, Collection of Fomento Cultural Banamex</em>!</p>
<p>Read more about NHM memberships <a href="http://www.nhm.orghttp://stage.nhm.org/site/join-us/membership/levels-benefits">here</a>.</p>
<h3>Group Visits</h3>
<p>Coming with ten or more people, click <a href="http://www.nhm.orghttp://stage.nhm.org/site/plan-your-visit/group-visits">here</a> to learn about special rates for groups and how to add <em>Grandes Maestros</em> to your visit.</p>
<h3>Learn More</h3>
<p>Find out more about these great masters and about the program of supporting folk art at the <a href="http://www.fomentoculturalbanamex.org/gmapi_en/">Fomento Cultural Banamex website</a>.</p>
<p><a href="http://stage.nhm.org/site/explore-exhibits/special-exhibits/grandes-maestros/en-espanol">En Español</a><br>
<a href="http://stage.nhm.org/site/plan-your-visit/tickets">Get Tickets</a>
</p>
<p>&nbsp;</p>
<br>
<div class="bl_block">
<h3></h3>
<p><img alt="" src="http://stage.nhm.org/site/sites/default/files/marketing/mc/GM_sponsor_logos_10212014.png"></p>
<div class="blClear"></div>
</div>
<style>
body { background-color: #000000!important; }
#back-midL { z-index: -990; display: inline-block; width: 100%!important; height: 100%; position: fixed; top: 50px; background-image:url('http://stage.nhm.org/site/sites/default/files/marketing/gm_bg_left.jpg'); background-repeat: no-repeat; background-position: top center; left: -736px; /*border: yellow 1px solid;*/ }
#back-midR { z-index: -1000; display: inline-block; width: 100%!important; height: 100%; position: fixed; top: 50px; background-image:url('http://stage.nhm.org/site/sites/default/files/marketing/gm_bg_right.jpg'); background-repeat: no-repeat; background-position: top center; right: -736px; /*border: yellow 1px solid;*/ }
#blContent { height: 100%!important; }
</style>
<script>
$(document).ready(function() {
$("body").prepend('<div id="back-midL"></div>');
$("body").prepend('<div id="back-midR"></div>');
});
</script>
</div>
<div class="alert-dialog" style="display:none;">
<div class="alert-content" style="display:none;"></div>
</div>
<div class="blClear"></div>
</div>
<!-- End bl_content_box -->
<!-- Begin blFooter -->
<div id="blFooter">
<div class="bl_right">
<div style="margin-top: 4px;"><a href="http://cssd.lacounty.gov/wps/portal/cssd/parents/mostwanted" target="_blank" style="color: #636363;font-weight: bold;text-decoration: none;">Public Service Notice</a></div>
</div>
<div id="block-devel_node_access-0" class="clear-block block block-devel_node_access">
<h2>node_access entries for nodes shown on this page</h2>
<div class="content">
<table class="sticky-header" style="position: fixed; top: 0px; width: 353px; left: 499px; visibility: hidden;">
<thead>
<tr>
<th style="width: 27px;">node</th>
<th style="width: 29px;">realm</th>
<th style="width: 17px;">gid</th>
<th style="width: 24px;">view</th>
<th style="width: 37px;">update</th>
<th style="width: 32px;">delete</th>
<th style="width: 157px;">explained</th>
</tr>
</thead>
</table>
<table style="text-align: left" class="sticky-enabled sticky-table">
<thead class="tableHeader-processed">
<tr>
<th>node</th>
<th>realm</th>
<th>gid</th>
<th>view</th>
<th>update</th>
<th>delete</th>
<th>explained</th>
</tr>
</thead>
<tbody>
<tr class="odd">
<td><a href="#node-0">0</a></td>
<td>all</td>
<td>0</td>
<td>1</td>
<td>0</td>
<td>0</td>
<td>All users may view all nodes.</td>
</tr>
</tbody>
</table>
<div class="form-item">
<div class="description">(To see more details enable <a href="http://stage.nhm.org/site/admin/settings/devel#edit-devel-node-access-debug-mode">debug mode</a>. For per-user access permissions enable the second DNA <a href="http://stage.nhm.org/site/admin/build/block">block</a>.)</div>
</div>
<br><br>
</div>
</div>
<div id="block-menu-menu-footer" class="clear-block block block-menu">
<div class="content">
<ul class="menu">
<li class="leaf first"><a href="http://stage.nhm.org/site/about-our-museums/contact-us">Contact Us</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/about-our-museums/press">Press</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/about-our-museums/working-at-nhm">Careers</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/about-our-museums/terms-of-use">Terms of Use</a></li>
<li class="leaf"><a href="http://stage.nhm.org/site/about-our-museums/e-news/subscribe">e-News</a></li>
<li class="leaf last"><a href="http://stage.nhm.org/site/about-our-museums/feedback">Feedback</a></li>
</ul>
</div>
</div>
<div class="blClear"></div>
</div>
<!-- End blFooter -->
</div>
<!-- End blContent -->
<script>
var my_href = window.location.pathname;
$(".bl_left_column li").each(
function () {
this_href = $(this).find("a").attr("href");
if (my_href.match(this_href)) {
$(".menu-active").removeClass("menu-active"); // just in case
$(this).addClass("menu-active");
}
});
$("#bl_menu li a").each(
function () {
this_href = $(this).attr("href");
if (my_href.indexOf(this_href) == 0) {
$(".top-menu-active").removeClass("top-menu-active"); // just in case
$(this).addClass("top-menu-active");
}
});
</script>
<div id="lightbox2-overlay" style="display: none;"></div>
<div id="lightbox" style="display: none;" class="lightbox2-orig-layout">
<div id="outerImageContainer" style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);">
<div id="modalContainer" style="display: none; padding: 10px;"></div>
<div id="frameContainer" style="display: none; padding: 10px;"></div>
<div id="imageContainer" style="display: none; padding: 10px;">
<img id="lightboxImage" alt="">
<div id="hoverNav"><a id="prevLink" title="Previous" href="#" style="padding-top: 10px;"></a><a id="nextLink" title="Next" href="#" style="padding-top: 10px;"></a></div>
</div>
<div id="loading"><a href="#" id="loadingLink"></a></div>
</div>
<div id="imageDataContainer" class="clearfix" style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);">
<div id="imageData">
<div id="imageDetails"><span id="caption"></span><span id="numberDisplay"></span></div>
<div id="bottomNav">
<div id="frameHoverNav"><a id="framePrevLink" title="Previous" href="#" style="padding-top: 10px;"></a><a id="frameNextLink" title="Next" href="#" style="padding-top: 10px;"></a></div>
<a id="bottomNavClose" title="Close" href="#" style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);"></a><a id="bottomNavZoom" href="#"></a><a id="bottomNavZoomOut" href="#"></a><a id="lightshowPause" title="Pause Slideshow" href="#" style="display: none;"></a><a id="lightshowPlay" title="Play Slideshow" href="#" style="display: none;"></a>
</div>
</div>
</div>
</div>
<script id="jsbin-javascript">
function gnav() {
var checkIe = window.requestAnimationFrame;
if (checkIe) {
var c = 0;
$("#navContainer").addClass('nav_up');
$("#bkgrd").addClass('up');
$("#blContent").addClass('up');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2) , #closeNav').click(function () {
c++;
$("#navContainer").toggleClass('nav_down', 'nav_up');
$("#bkgrd").toggleClass('down', 'up');
$("#blContent").toggleClass('down', 'up');
$("#gNavContent").toggleClass('pos_down', 'pos_up');
if (c === 1){
$('#gblheader > p:nth-child(2)').fadeOut();
}else{
$('#gblheader > p:nth-child(2)').fadeIn();
c = 0;
}
});
} else {
$("#gNavContent").removeClass('pos_up');
$("#gNavContent").css('top', '-265px');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2)').toggle(
function () {
$("#navContainer").animate({
height: "265px"
}, 500);
$("#bkgrd").animate({
top: "265px"
}, 500);
$("#blContent").animate({
top: "265px"
}, 500);
$("#gNavContent").animate({
top: "0"
}, 500);
$('#gblheader > p:nth-child(2)').fadeOut();
},
function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
$('#closeNav').click(function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
}
}
function addEvent(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt, func, false);
else if (elem.attachEvent) { // IE DOM
elem.attachEvent("on" + evnt, func);
} else { // No much to do
elem[evnt] = func;
}
}
addEvent("load", window, gnav);
</script>
<script id="jsbin-source-css" type="text/css">#gblheader
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
height:39px;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px;
z-index:1
}
#gNavContent
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px
}
#closeNav
{
color: #000;
cursor: pointer;
display: block;
float: right;
font-size: 19px;
font-weight: 700;
position: relative;
right: 17px;
top: 193px;
}
li
{
list-style-type:none
}
#gNav > ul > li > a
{
display:inline;
float:left;
padding:16px;
text-decoration:none;
width:298px
}
#gNav > ul > li > a:hover
{
text-decoration:none
}
#gNav > ul > li > a > h1
{
font-size:1.196em;
font-weight:700
}
#gNav > ul > li > a > p
{
color:#000;
font-size:.953em;
font-weight:700;
height:95px;
line-height:17px;
margin:1em 0
}
#gNav > ul > li:nth-child(1) > a > h1
{
color:#788d39
}
#gNav > ul > li:nth-child(2) > a > h1
{
color:#0070af
}
#gNav > ul > li:nth-child(3) > a > h1
{
color:#b5121b
}
#navContainer
{
background-color:#f6f6f5;
color:#000;
height:39px;
margin:0 auto;
padding:0;
position:absolute;
width:100%
}
a
{
color:#000;
text-decoration:none
}
#gblheader > ul
{
float:right;
margin-right:19px
}
#gblheader > p
{
float:left;
font-weight:700;
margin:11px 0 0 15px
}
#gblheader > p:nth-child(1)
{
cursor:pointer
}
#gblheader > ul > li
{
float:left;
margin:14px 0 0 3px
}
#bkgrd
{
height:100%;
position:absolute;
top:39px;
width:100%;
z-index:3
}
.up
{
top:39px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.down
{
top:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_up
{
height:39px!important;
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_down
{
height:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_up
{
top:-265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_down
{
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
#blContent
{
position:relative;
top:39px;
z-index:3
}
@media only screen and (max-device-width: 768px) {
#gNav > ul > li > a
{
padding:12px;
width:298px
}
#gNav > ul > li > a > h1
{
font-size:1.196em
}
#gNav > ul > li > a > p
{
font-size:1em;
height:97px;
line-height:17px
}
#gNav
{
height:212px;
width:970px
}
#closeNav
{
right:17px;
top:-30px
}
}</script>
<script id="jsbin-source-javascript" type="text/javascript">function gnav() {
var checkIe = window.requestAnimationFrame;
if (checkIe) {
var c = 0;
$("#navContainer").addClass('nav_up');
$("#bkgrd").addClass('up');
$("#blContent").addClass('up');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2) , #closeNav').click(function () {
c++;
$("#navContainer").toggleClass('nav_down', 'nav_up');
$("#bkgrd").toggleClass('down', 'up');
$("#blContent").toggleClass('down', 'up');
$("#gNavContent").toggleClass('pos_down', 'pos_up');
if (c === 1){
$('#gblheader > p:nth-child(2)').fadeOut();
}else{
$('#gblheader > p:nth-child(2)').fadeIn();
c = 0;
}
});
} else {
$("#gNavContent").removeClass('pos_up');
$("#gNavContent").css('top', '-265px');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2)').toggle(
function () {
$("#navContainer").animate({
height: "265px"
}, 500);
$("#bkgrd").animate({
top: "265px"
}, 500);
$("#blContent").animate({
top: "265px"
}, 500);
$("#gNavContent").animate({
top: "0"
}, 500);
$('#gblheader > p:nth-child(2)').fadeOut();
},
function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
$('#closeNav').click(function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
}
}
function addEvent(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt, func, false);
else if (elem.attachEvent) { // IE DOM
elem.attachEvent("on" + evnt, func);
} else { // No much to do
elem[evnt] = func;
}
}
addEvent("load", window, gnav);</script></body>
</html>
Raw
jsbin.doqopa.css
#gblheader
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
height:39px;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px;
z-index:1
}
#gNavContent
{
background:none repeat scroll 0 0 #f6f6f5;
color:#000;
font-family:Arial,Gadget,sans-serif;
margin:0 auto;
overflow:hidden;
padding:0;
position:relative;
width:1024px
}
#closeNav
{
color: #000;
cursor: pointer;
display: block;
float: right;
font-size: 19px;
font-weight: 700;
position: relative;
right: 17px;
top: 193px;
}
li
{
list-style-type:none
}
#gNav > ul > li > a
{
display:inline;
float:left;
padding:16px;
text-decoration:none;
width:298px
}
#gNav > ul > li > a:hover
{
text-decoration:none
}
#gNav > ul > li > a > h1
{
font-size:1.196em;
font-weight:700
}
#gNav > ul > li > a > p
{
color:#000;
font-size:.953em;
font-weight:700;
height:95px;
line-height:17px;
margin:1em 0
}
#gNav > ul > li:nth-child(1) > a > h1
{
color:#788d39
}
#gNav > ul > li:nth-child(2) > a > h1
{
color:#0070af
}
#gNav > ul > li:nth-child(3) > a > h1
{
color:#b5121b
}
#navContainer
{
background-color:#f6f6f5;
color:#000;
height:39px;
margin:0 auto;
padding:0;
position:absolute;
width:100%
}
a
{
color:#000;
text-decoration:none
}
#gblheader > ul
{
float:right;
margin-right:19px
}
#gblheader > p
{
float:left;
font-weight:700;
margin:11px 0 0 15px
}
#gblheader > p:nth-child(1)
{
cursor:pointer
}
#gblheader > ul > li
{
float:left;
margin:14px 0 0 3px
}
#bkgrd
{
height:100%;
position:absolute;
top:39px;
width:100%;
z-index:3
}
.up
{
top:39px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.down
{
top:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_up
{
height:39px!important;
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.nav_down
{
height:265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_up
{
top:-265px!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
.pos_down
{
top:0!important;
transition-duration:250ms;
transition-property:all;
transition-timing-function:cubic-bezier(0.17,0.04,0.03,0.94)
}
#blContent
{
position:relative;
top:39px;
z-index:3
}
@media only screen and (max-device-width: 768px) {
#gNav > ul > li > a
{
padding:12px;
width:298px
}
#gNav > ul > li > a > h1
{
font-size:1.196em
}
#gNav > ul > li > a > p
{
font-size:1em;
height:97px;
line-height:17px
}
#gNav
{
height:212px;
width:970px
}
#closeNav
{
right:17px;
top:-30px
}
}
Raw
jsbin.doqopa.js
function gnav() {
var checkIe = window.requestAnimationFrame;
if (checkIe) {
var c = 0;
$("#navContainer").addClass('nav_up');
$("#bkgrd").addClass('up');
$("#blContent").addClass('up');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2) , #closeNav').click(function () {
c++;
$("#navContainer").toggleClass('nav_down', 'nav_up');
$("#bkgrd").toggleClass('down', 'up');
$("#blContent").toggleClass('down', 'up');
$("#gNavContent").toggleClass('pos_down', 'pos_up');
if (c === 1){
$('#gblheader > p:nth-child(2)').fadeOut();
}else{
$('#gblheader > p:nth-child(2)').fadeIn();
c = 0;
}
});
} else {
$("#gNavContent").removeClass('pos_up');
$("#gNavContent").css('top', '-265px');
$('#gblheader > p:nth-child(1) , #gblheader > p:nth-child(2)').toggle(
function () {
$("#navContainer").animate({
height: "265px"
}, 500);
$("#bkgrd").animate({
top: "265px"
}, 500);
$("#blContent").animate({
top: "265px"
}, 500);
$("#gNavContent").animate({
top: "0"
}, 500);
$('#gblheader > p:nth-child(2)').fadeOut();
},
function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
$('#closeNav').click(function () {
$("#navContainer").animate({
height: "39px"
}, 500);
$("#bkgrd").animate({
top: "39px"
}, 500);
$("#blContent").animate({
top: "39px"
}, 500);
$("#gNavContent").animate({
top: "-265px"
}, 500);
$('#gblheader > p:nth-child(2)').fadeIn();
});
}
}
function addEvent(evnt, elem, func) {
if (elem.addEventListener) // W3C DOM
elem.addEventListener(evnt, func, false);
else if (elem.attachEvent) { // IE DOM
elem.attachEvent("on" + evnt, func);
} else { // No much to do
elem[evnt] = func;
}
}
addEvent("load", window, gnav);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment