/*
==================================================
  LAYOUT.CSS
  Controls all layout styles for glad.org

  Author:   Ruthie BenDor
  Updated:  2009-01-28
==================================================


Each page on GLAD.org uses the following basic structure:

|-------------------------------|
| #page                         |
| |---------------------------| |
| |  #header                  | | Contains search box and utility nav
| |---------------------------| | 
| |  #masthead                | | Contains logo and tagline
| |---------------------------| |
| |  #main-nav                | | Contains main navigation bar
| |---------------------------| |
| |  #content                 | | Contains page content
| |---------------------------| |
| |  #footer                  | | Contains footer links, contact info, copyright
| |---------------------------| |
|-------------------------------|

Rather than using a "grid", per se, here are all valid column widths. Use them at will:

==========================================================================================================
_/2     _/3     _/4     _/5     _/6     _/8     _/9     _/10    _/12    _/15    _/18  |   width in pixels
----------------------------------------------------------------------------------------------------------
                                                                                1/18      width: 40px;
----------------------------------------------------------------------------------------------------------
                                                                        1/15              width: 50px;
----------------------------------------------------------------------------------------------------------
                                                                1/12                      width: 65px;
----------------------------------------------------------------------------------------------------------
                                                        1/10                              width: 80px;
----------------------------------------------------------------------------------------------------------
                                                1/9                             2/18      width: 90px;
----------------------------------------------------------------------------------------------------------
                                                                        2/15              width:110px;
----------------------------------------------------------------------------------------------------------
                                1/6                             2/12            3/18      width:140px;
----------------------------------------------------------------------------------------------------------
                        1/5                             2/10            3/15              width:170px;
----------------------------------------------------------------------------------------------------------
                                                2/9                             4/18      width:190px;
----------------------------------------------------------------------------------------------------------
                1/4                     2/8                     3/12                      width:215px;
----------------------------------------------------------------------------------------------------------
                                                                        4/15              width:230px;
----------------------------------------------------------------------------------------------------------
                                                                                5/18      width:240px;
----------------------------------------------------------------------------------------------------------
                                                        3/10                              width:260px;
----------------------------------------------------------------------------------------------------------
        1/3                     2/6             3/9             4/12    5/15    6/18      width:290px;
----------------------------------------------------------------------------------------------------------
                                                                                7/18      width:340px;
----------------------------------------------------------------------------------------------------------
                        2/5                             4/10            6/15              width:350px;
----------------------------------------------------------------------------------------------------------
                                                                5/12                      width:365px;
----------------------------------------------------------------------------------------------------------
                                                4/9                             8/18      width:390px;
----------------------------------------------------------------------------------------------------------
                                                                        7/15              width:410px;
----------------------------------------------------------------------------------------------------------
 1/2            2/4             3/6     4/8             5/10    6/12            9/18      width:440px;
----------------------------------------------------------------------------------------------------------
                                                                        8/15              width:470px;
----------------------------------------------------------------------------------------------------------
                                                5/9                             10/18     width:490px;
----------------------------------------------------------------------------------------------------------
                                                                7/12                      width:515px;
----------------------------------------------------------------------------------------------------------
                        3/5                             6/10            9/15              width:530px;
----------------------------------------------------------------------------------------------------------
                                                                                11/18     width:540px;
----------------------------------------------------------------------------------------------------------
        2/3                     4/6             6/9             8/12    10/15   12/18     width:590px;
----------------------------------------------------------------------------------------------------------
                                                        7/10                              width:620px;
----------------------------------------------------------------------------------------------------------
                                                                                13/18     width:640px;
----------------------------------------------------------------------------------------------------------
                                                                        11/15             width:650px;
----------------------------------------------------------------------------------------------------------
                3/4                     6/8                     9/12                      width:665px;
----------------------------------------------------------------------------------------------------------
                                                7/9                             14/18     width:690px;
----------------------------------------------------------------------------------------------------------
                        4/5                             8/10            12/15             width:710px;
----------------------------------------------------------------------------------------------------------
                                5/6                             10/12           15/18     width:740px;
----------------------------------------------------------------------------------------------------------
                                                                        13/15             width:770px;
----------------------------------------------------------------------------------------------------------
                                                8/9                             16/18     width:790px;
----------------------------------------------------------------------------------------------------------
                                                        9/10                              width:800px;
----------------------------------------------------------------------------------------------------------
                                                                11/12                     width:815px;
----------------------------------------------------------------------------------------------------------
                                                                        14/15             width:830px;
----------------------------------------------------------------------------------------------------------
                                                                                17/18     width:840px;
----------------------------------------------------------------------------------------------------------
2/2     3/3     4/4     5/5     6/6     8/8     9/9     10/10   12/12   15/15   18/18     width:890px;
==========================================================================================================

*/


/* --- GENERAL LAYOUT STYLES -------------------------------------- */

body {
  background:#E9E3D4 url(/assets/img/bg-body.png) repeat-y center top;
}

.clear {clear:both;}

.center {text-align:center;}

#page {
  width:910px;
  margin:0 auto;
  text-align:center;
  border:1px solid #FFF;
  border-width:0 1px 1px 1px; 
  z-index:1; /* Need to specify an integer value for z-index to keep dropdown menu from choking in IE6 & 7 */
}

#page-inner {
  position:relative;
  text-align:left;
  z-index:1; /* Need to specify an integer value for z-index to keep dropdown menu from choking in IE6 & 7 */
}

#header, #masthead, #content, #footer {
  width:100%; /* IE6 needs a width defined */
  position:relative;
  overflow:hidden; /* IE6 chokes on overflow:auto; */
  z-index:1; /* Need to specify an integer value for z-index to keep dropdown menu from choking in IE6 & 7 */
}

#header-inner, #masthead-inner, #content-inner, #footer-inner {
  padding:10px 0 10px 10px;
  float:left;
  position:relative;
  overflow:hidden;
  z-index:1; /* Need to specify an integer value for z-index to keep dropdown menu from choking in IE6 & 7 */
}

#content-inner {
  width:910px;
  padding:0 0 1em 0 !important;
  margin:0 !important;
  background:#FFF;
}

/* Columm styles */

.col {
  position:relative;
  float:left;
  margin-bottom:10px;
  margin-right:10px;
}

.col-append-divider { /* Append a divider to the right of a column */
  margin-right:5px !important; /* overwrite .col */
  border-right:1px solid #DDD;
  padding-right:4px;
}

.col-inner {
  padding:10px;
  position:relative;
  overflow:auto;
}

/* --- Header ----------------------------------------------------- */

#header {
  border-top:10px solid #006;
}

#header-inner {
  background:#FFF;
  padding:0 0 0 10px;
}

#search, #utility-nav {
  position:relative;
  float:left;
}

/* Search box */

#search {
  width:290px;
  margin-right:10px;
  padding:10px 0;
}

#search form {
  margin:0;
  position:relative;
  float:left;
  overflow:hidden;
}

#search input {
  border:0;
  display:block;
  float:left;
}

#search input.text {
  width:190px;
  margin-right:10px;
  padding:4px 0;
  background:#DDD;
}

#search input.image {width:90px;}


/* Utility navigation */

#utility-nav {
  width:600px;
  font-size:12px;
}

#utility-nav ul {
  float:left;
  position:relative;
  overflow:auto;
  margin:0;
}

#utility-nav ul li {
  display:block;
  float:left;
  width:140px;
  margin:0 10px 0 0 !important;
  text-align:center;
  line-height:1.2em;
  padding-top:4px;
}

#utility-nav ul li a {
  display:block;
  padding-top:10px;
}

#utility-nav ul li.social {width:32px;}

#utility-nav ul li.social a {
  padding-top:0 !important;
}


/* --- Masthead --------------------------------------------------- */

#masthead {
  background:#FFF url("/assets/img/bg-banner.png") repeat-x 0 -5px;
  border-top:3px solid #006;
}

#masthead-inner {
  background:transparent;
  padding-top:0;
  padding-bottom:0;
/*  background:#FFF url("/assets/img/bg-banner.png") repeat-x 0 -5px; */
}

#masthead-inner div {
  position:relative;
  float:left;
  margin-right:10px;
}

/* Logo */

#masthead #logo {width:200px;}

#masthead #logo a {
  display:block;
  width:200px;
  height:104px;
  margin:0;
  background:transparent url("/assets/img/logo-glad-new.png") no-repeat scroll 10px top;

/*
  background:transparent url("/assets/img/logo-glad.png") no-repeat scroll 0 0;
  width:167px;
  height:53px;
  margin:5px 0 0 10px;
*/

}

/* Copy */

#masthead #copy {
  width:375px;
  font-size: 12px;
  padding-top: 1.286em;
}

#masthead #copy h2 {
  font-size: 16px;
  font-weight: bold;
  margin: 6px 0 0 0;
}

#masthead #copy h2 a {
  text-transform: uppercase;
  color: #006 !important;
}


#masthead #copy p {
  margin: 0;
}

/* Twitter */

#masthead #twitter {
  width:290px;
  padding-top:1.286em;
}

#masthead .tweet-text {
  background:#C7D5E3;
  border:1px solid #FFF;
  border-width:1px 1px 0 1px;
  margin-left:0;
  padding:5px;
  width:283px;
}

#masthead .tweet-text p {
  margin:0;
  font-style:normal;
  font-size: 12px;
}

#masthead .tweet-meta {
  font-size: 11px !important;
  background:transparent url(/assets/img/bg-twitter.png) no-repeat left top;
  padding-left:35px;
  padding-top:0.321em;
  margin-top:0;
}

/* --- Main Navigation -------------------------------------------- */

#main-nav {
  position:relative; /* IE7 z-index... */
  width:910px; /* IE6 needs a width defined */
  height:28px;/
  z-index:1000;
  background:#006;
  border:1px solid #3F4089;
  border-width:1px 0;
}

ol#main-nav-tabs {
  position:relative;
  display:block;
  float:left;
  width:100%;
  margin:0 auto;
  padding:0;
  list-style:none;
  text-align:center;
  white-space:nowrap;
  background:#006;
}

ol#main-nav-tabs li {
  display:block;
  float:left;
  position:relative;
  width:auto;
  margin:0;
  text-align:center;
}

ol#main-nav-tabs li a {
  border-right:1px solid #3F4089;
  color:#fff;
  display:block;
  width:115px;
  padding:7px 2px;
  margin:0;
  text-align:center;
  overflow:hidden;
  line-height:1em !important;
}

ol#main-nav-tabs li#nav-home a {width:76px;}

ol#main-nav-tabs li#nav-ourwork a {width:99px;}

ol#main-nav-tabs li#nav-rr a {width:175px;}

ol#main-nav-tabs li#nav-events a {width:85px;}

ol#main-nav-tabs li#nav-news a {width:176px;}

ol#main-nav-tabs li#nav-help a {width:134px;}

ol#main-nav-tabs li#nav-about a {
  width:130px;
  border-right:none;
}

ol#main-nav-tabs li a.tab_on, ol#main-nav-tabs li a:hover {
  background:#c6d4e3 !important;
  color:#006;
  text-decoration:none;
}

ol#main-nav-tabs li:hover { /* keeps the parent nav on in most */
  background:#c6d4e3;
  color:#006 !important;
}

ol#main-nav-tabs li:hover a { /* keeps the parent nav on in most */
  color:#006 !important;
}

/* Indicate what section of the website we're currently in */
body.section-home #nav-home a,
body.section-ourwork #nav-ourwork a,
body.section-rr #nav-rr a,
body.section-events #nav-events a,
body.section-news #nav-news a,
body.section-help #nav-help a,
body.section-about #nav-about a,
body.section-marriage-album #nav-news a,
body.section-doma #nav-ourwork a {
  background:#c6d4e3;
  color:#006 !important;
}

/* Drop-down menus */
ol#main-nav-tabs li ol {
  z-index:10000 !important;
  position: absolute;
  top:28px;
  left:-999em;
  height:auto;
  padding:0;
  margin:0 0 0 -1px;
  list-style: none;
  background:#c6d4e3;
  border-left:1px solid #3F4089;
  border-right:1px solid #3F4089;
}

/* Dropdown width: default */
ol#main-nav-tabs li ol, ol#main-nav-tabs li ol li, ol#main-nav-tabs li ol li a {
/*  width:230px !important; */
}

/* Dropdown width: Our Work */
li#nav-ourwork ol, li#nav-ourwork ol li, li#nav-ourwork ol li a {
  width:230px !important;
}

/* Dropdown width: Rights & Resources */
li#nav-rr ol, li#nav-rr ol li, li#nav-rr ol li a {
  width:240px !important;
}

/* Dropdown width: Events */
li#nav-events ol, li#nav-events ol li, li#nav-events ol li a {
  width:140px !important;
}

/* Dropdown width: News & Multimedia */
li#nav-news ol, li#nav-news ol li, li#nav-news ol li a {
  width:180px !important;
}

/* Dropdown width: How to Help */
li#nav-help ol, li#nav-help ol li, li#nav-help ol li a {
  width:210px !important;
}

/* Dropdown width: About GLAD */
li#nav-about ol, li#nav-about ol li, li#nav-about ol li a {
  width:145px !important;
}

ol#main-nav-tabs li ol li {
  display:block;
  position:relative;
  padding:0;
  margin:0 !important;
  text-align:left;
  height:auto !important;
  overflow: hidden;
  border:0 !important;
}

ol#main-nav-tabs li ol li a {
  display: block;
  color: #006;
  text-decoration: none;
  margin:0;
  height:auto !important;
  padding:4px 4px 4px 16px;
  font-weight:400;
  text-align:left;
  background-image:none !important;
  border-bottom:1px solid #006;
  overflow: hidden;
  text-decoration:none;
}

ol#main-nav-tabs li ol li a:hover {
  color: #006 !important;
  background-color:#FFF !important;
}

ol#main-nav-tabs li ol li a.more {
  background:transparent url(/assets/img/arrow-blue-rt.gif) 4px 6px no-repeat !important;
}

ol#main-nav-tabs li ol li a.more:hover {
  background:#FFF url(/assets/img/arrow-blue-rt.gif) 4px 6px no-repeat !important;
}

ol#main-nav-tabs li ol li a.less {
  border-bottom:0px !important;
  background:transparent url(/assets/img/arrow-blue-down.gif) 4px 6px no-repeat !important;
  font-style:italic;
}

ol#main-nav-tabs li ol li a.less:hover {
  background:#FFF url(/assets/img/arrow-blue-down.gif) 4px 6px no-repeat !important;
}

ol#main-nav-tabs li:hover ol ol, ol#main-nav-tabs li:hover ol ol, ol#main-nav-tabs li.sfhover ol ol, ol#main-nav-tabs li.sfhover ol ol {
  left: -999em;
}

ol#main-nav-tabs li:hover ol, ol#main-nav-tabs li li:hover ol, ol#main-nav-tabs li.sfhover ol, ol#main-nav-tabs li li.sfhover ol, ol#main-nav-tabs li li li.sfhover ol {
  left: auto;
}

/* Sub menus */

ol#main-nav-tabs li ol li ol {
  display:none;
  font-size: 1em !important; /* otherwise this text gets smaller */
  position:relative;
  overflow:auto;
  top:0;
  width:auto;
  padding:0;
  left:auto !important;
  border-bottom:1px solid #006 !important;
}

ol#main-nav-tabs li ol li ol li a {
  padding:3px 4px 3px 24px;
  border:none !important;
}

ol#main-nav-tabs li ol li ol li a:hover,
ol#main-nav-tabs li ol li ol li a:active {
  background-color:#FFF !important;
}


/* --- Content ---------------------------------------------------- */


/* --- Title Area --- */

#content #title-area {
  width:910px;
  margin:0 0 1em 0 !important; /* overwrites class="col" */
}

#content #title-area .col-inner {
  padding:20px !important; /* overwrites class="col-inner" */
}

/* Breadcrumbs */
#content #title-area #breadcrumbs {}

#content #title-area #breadcrumbs a {
  color:#FFF !important;
  font-size:70%;
}

#content #title-area h1 {color:#FFC;}

#content #title-area p {
  width:590px;
  margin:0.643em 0;
  color:#FFF;
}

/* --- Listings --- */

#content .item {
  padding:0.643em 0;
  margin:0.643em 0;
}

#content .item p {
  margin:0.643em 0;  
}

#content .item h4 {margin:0;}

#content .item h5 {
  margin:0.643em 0;
  font-style:italic;
  padding-left:1em;
  padding-right:2em;
}

#content .item h4 a, #content .item h5 a {
  color:#006 !important;
}

#content .item-meta {
  font-size:70%;
  text-transform:uppercase;
  color:#333 !important;
  margin-bottom:0 !important;
  border-bottom:1px solid #E9E3D4;
  padding:0.321em 0;
}

#content .item-meta a {
  color:#333 !important;
  font-weight:normal !important;
}

#content .item-graphic {
  border:1px solid #DDD;
  display:block;
  float:left;
  margin:0.321em 10px 0.321em 0;
  position:relative;
  overflow:auto;
}

#content .item-graphic img {
  display:block;
  float:left;
}

#content .item-text p {
  margin-top:0.321em !important;
}




/* --- Forms --- */

/* Form wrapper */

#content .form-wrapper {
  position:relative;
  overflow:auto;
  border:1px dotted #DDD;
  padding:10px;
}

#content .form-wrapper h2 {border-bottom:0px;}

#content form {
  position:relative;
  overflow:hidden;
  margin:0 !important;
}

#content form ol {list-style:none;}

#content form li {
  margin-left:0 !important;
}

#content form label {
  display:block;
  padding:0.643em 0 0.321em 0;
  font-weight:bold;
}

#content form input.text {
  display:block;
  width:250px;
}

/* Step Header */

#content form .step-header {
  position:relative;
  overflow:hidden;
  line-height:1.2em;
}

#content form .step-header span {
  display:block;
  float:left;
  font-size:70%;
  font-weight:bold;
  text-transform:uppercase;
  margin:0.643em 1em 0 0 !important;
  padding:5px;
  color:#FFF;
  background:#600;
}

#content form .step-header h3 {
  margin:0.643em 0 0 0 !important;
  border-bottom:none !important;
}

/* Form step */
#content form .form-step {width:260px;}

/* Section divider */
#content form .form-divider {
  border-top:1px dotted #DDD;
  clear:both;
  margin-top:0.321em;
  padding-top:0.321em;
}


/* --- Print This Page --- */

ul#print {
  margin:10px 0 !important;
}

ul#print li {
  background:#C6D4E3;
  padding:0.643em 10px !important;
  text-align:center;
  border:1px solid #C9C2C1;
}


/* --- Page Tools ------------------------------------------------- */

/* ---- deprecated; remove this once CSS conversion is complete */
#secondary .print-page {
	margin:0;
	padding:0;
}
/* ---- */


#secondary ul#addthis {
  position:relative;
  overflow:hidden;
  margin:0 !important;
  padding-left:5px;
}

#secondary ul#addthis li {
  display:block;
  float:left;
  width:74px;
  text-align:center;
  margin:0 10px 0 0 !important;
}

#secondary ul#addthis li#addthis-share {
  margin-right:0 !important;
}

#secondary ul#addthis li a {
  display:block;
  padding:7px 5px 3px 26px;
  background-repeat: no-repeat;
  background-position: 6px 5px;
  margin-bottom:0;
  text-align:left;
  border:1px solid #E9E3D4;
}

#secondary ul#addthis li a:link, ul#addthis li a:visited {
}

#secondary ul#addthis li a:hover, ul#addthis li a:active {
  background-color:#E9E3D4;
  border-color:#600;
}

#secondary #addthis-print a { background-image: url(/assets/img/icons/print.png); }
#secondary #addthis-email a { background-image: url(/assets/img/icons/email_go.png); }
#secondary #addthis-share a { background-image: url(/assets/img/icons/star.png); }

*html #secondary .print-page ul#addthis { /* IE6 ONLY */
  height:28px;
}


/* --- Tabs --- */




/* Mix of default jQuery css and custom GLAD */

/* Caution! Ensure accessibility in print and other media types... */

 /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
@media projection, screen {
  .ui-tabs-hide {
    display: none;
  }
}

/* Hide useless elements in print layouts... */
@media print {
  .ui-tabs-nav {
    display: none;
  }
}

/* Skin */
.ui-tabs-nav {
  font-size: .9em;
  list-style: none;
  margin: 0 !important;
  padding: 0 0 0 0;
  height:25px;
  overflow:hidden;
}
*html .ui-tabs-nav { /* IE6 */
  font-size: .8em;
  margin-bottom:-1px !important;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
  display: block;
  clear: both;
  content: " ";
}
.ui-tabs-nav li {
  float: left;
  margin: 0 !important;
  font-weight: 400;
}
.ui-tabs-nav a, .ui-tabs-nav a span {
  float: left; /* fixes dir=ltr problem and other quirks IE */
  padding: 0 6px;
  background:url(/assets/img/tabs.png) no-repeat;
}
*html .ui-tabs-nav a span { /* IE6 */
  padding:5px 3px 0px 6px !important;
}
.ui-tabs-nav a {
  margin: 0 0 0 0; /* position: relative makes opacity fail for disabled tab in IE */
  padding-left: 0;
  background-position: 100% 0;
  text-decoration: none !important;
  white-space: nowrap; /* @ IE 6 */
  outline: 0; /* @ Firefox, prevent dotted border after click */
}
.ui-tabs-nav a:hover {
  color:#006 !important;
}
.ui-tabs-nav a:link, .ui-tabs-nav a:visited {
  color: #666;
}
.ui-tabs-nav .ui-tabs-selected a {
  position: relative;
  top: 0;
  z-index: 2;
  margin-top: 0;
  margin-right:0;
  color:#fff !important;
  background-position: 100% -26px;
}
.ui-tabs-nav .ui-tabs-selected a:hover {
  color:#fff !important;
}
.ui-tabs-nav a span {
  padding-top: 3px;
  padding-right: 3px;
  height: 24px;
  background-position: 0 0;
  line-height: 1em;
}
.ui-tabs-nav .last-tab a span {
  padding-right: 5px;
}
*+html .ui-tabs-nav .last-tab a span { /* IE7 */
  padding-right: 4px;
}
*html .ui-tabs-nav .last-tab a span { /* IE6 */
  padding-right: 2px !important;
}
.ui-tabs-nav .ui-tabs-selected a span {
  padding-top: 3px;
  height: 24px;
  background-position: 0 -26px;
  line-height: 1em;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
  cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active, .ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */
  cursor: pointer;
}
.ui-tabs-disabled {
  opacity: .4;
  filter: alpha(opacity=40);
}
.ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited {
  color: #000;
}
.ui-tabs-panel {
  width:173px;
  margin-top:0;
  border: 1px solid #600;
  border-top: 3px solid #600;
  padding: 10px;
  background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
  z-index:100;
}
/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear @ IE 6 & IE 7 Quirks Mode */
  display: inline-block;
}
*:first-child+html .ui-tabs-nav { /* auto clear @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
  display: inline-block;
}
/* Rights & Resources */

#tabbed-latestpublications {
  background:url(/assets/img/photo-rrbox-books.jpg) 0 0 no-repeat !important;
  padding:150px 10px 10px 10px;
}
#tabbed-legalinfoline {
  background:url(/assets/img/graphic-rrbox-legalinfoline.gif) 0 0 no-repeat !important;
  padding:150px 10px 10px 10px;
}
#rt-col-content .ui-tabs-panel h4 {
  font-size:1.4em;
  border-bottom:0;
  margin:5px 0 0px 0 !important;
  color:#006;
  border-bottom:0 !important;
  text-transform:none !important;
}
#rt-col-content .ui-tabs-panel h5 {
  font:1em Georgia, "Times New Roman", Times, serif;
  margin:6px 0 4px 0;
}
#rt-col-content #tabbed-legalinfoline h4 {
  font:1.5em Arial, Helvetica, sans-serif;
}







/* --- Secondary Items w/ Rounded Corners --- */

.secondary-item {
  background:#FFF url("/assets/img/rc-gradient-E9E3D4.gif") repeat-x top left;
  margin:0.643em 0 1.286em 0;
}

.secondary-item-top div {
  background: url("/assets/img/rc-tl-E9E3D4.gif") no-repeat top left;
}

.secondary-item-top {
  background: transparent url("/assets/img/rc-tr-E9E3D4.gif") no-repeat top right;
}

.secondary-item-bottom {
  background: url("/assets/img/secondary-item-bottom.gif") no-repeat bottom left;
}

.secondary-item-top div,
.secondary-item-top,
.secondary-item-bottom {
  width: 100%;
  height: 10px;
  font-size: 1px;
}

.secondary-item-content {
  padding: 0 10px; 
  border:1px solid #E9E3D4;
  border-width:0 1px;
  margin-bottom:-1.286em; /* to compensate for margin on last item */
}






/* --- Footer ----------------------------------------------------- */

#footer {
  border-top:3px solid #DDD;
}

#footer-inner {
  background:#FFF;
  font-size:87.5%;
  padding-bottom:0 !important;
}

#footer p {
  color:#666 !important;
}

#footer .col-append-divider {border-color:#DDD;}

/* Footer Links */

#footer-links {width:710px;}

#footer-links ul {
  margin:0;
  position:relative;
  overflow:hidden;
  float:left;
}

#footer-links li {
  display:block;
  float:left;
  width:80px;
  margin:0 10px 0 0;
  height:48px;
}

#footer-links li.last {margin-right:0;}

/* Footer Contact */

#footer-contact {width:170px;}

#footer-contact .vcard {padding-left:10px;}

#footer-contact p {
  margin:0;
  padding:0 0 0.643em 0;  /* Transfer margin styles to padding styles */
}

#footer-contact h4 {
  margin:0;
  padding:0 0 0.643em 0;  /* Transfer margin styles to padding styles */
  color:#666;
}

#footer-contact a { /* overwrite default link styling? */
}

/* Footer Copyright */

#copyright {width:710px;}

#copyright p {
  border-top:1px solid #DDD;
  margin:0;
  padding:0.643em 0;  /* Transfer margin styles to padding styles */
  text-align:center;
}


/* ================================================================
   ==== PAGE STRUCTURE of a generic GLAD page ===================== */

/* this assumes the arrangement |     primary    |secondary| */

#primary  { width:590px; margin-left:10px; }

#secondary {width:290px;}

/* ================================================================ */


/* Tables */

table {}

  table caption {}

  thead {}

  tbody {}

  tfoot {}

  tr {}
    th {}
    td {}

  colgroup {}
    col {}
