/* Layout
 * ------
 * Using a negative margin technique, adapted from ZEN. The page is loaded by this order:
 *
 * 1. Header
 * 2. Content
 * 3. Navigation menus
 * 4. Sidebar Left
 * 5. Sideabr Right */
/* remove 'auto' and the width to switch to a fluid width */
#page {
    width: auto;
}

.page-inner-wrapper {
    width: 940px;
    margin: 0 auto;
    padding: 0 20px;
}

.light-overflow {
    width: 940px;
    position: relative;
    z-index: 2;
}

/* Header
 * -----------------
 */
#header {
    overflow: hidden;
}

#header, #header-light-overflow {
    height: 200px;
}

#header-logo, #header-first-region, #header-second-region {
    padding: 25px 0 0 0;
}

#header-logo {
    float: left;
    width: 350px;
}

#header-logo a {
    display: block;
    width: 346px;
    height: 153px;
}

#header-logo a span {
    display: none;
}

#header-first-region {
    float: left;
    margin-left: 80px;
    width: 280px;
}

#header-second-region {
    float: left;
    width: 200px;
    margin-left: 30px;
}

/* Layout Helpers */
#header, #footer, .mission, .breadcrumb, .node {
    clear: both;
}

#header, #primary-links, #main, #footer {
    min-width: 960px;
}

/* Sidebars width
 * --------------
 * Changing the width of the sidebars is dead easy, just change the
 * values below corresponding to the sidebar you want to modify.
 * Make sure you keep negative values as negative values.
 * For example, if I want to increase the width of the left sidebar
 * to 300px, I would have to change each '190' to '300'. */
.two-sidebars .center, .sidebar-left .center {
    margin-left: 250px;
}

.two-sidebars .center {
    padding: 0 30px;
}

.sidebar-left .center {
    padding-left: 30px;
}

.sidebar-right .center {
    padding-right: 30px;
}

#sidebar-first {
    width: 250px;
    margin-right: -250px;
}

.two-sidebars .center, .sidebar-right .center {
    margin-right: 300px;
}

#sidebar-second {
    width: 300px;
}

/* Columns Inner
 * -------------
 * You can change the padding inside the columns without changing the
 * width of them by just usinbg the INNER div of each column */
.inner {
    padding: 0;
}

/* Primary links styles
 * -----------------
 * The primary is loaded after the content, so we need to make space
 * for it, equal to its height, so if you change the height of the navigation,
 * remember to adapt the margin top of the content and sidebars. */
#primary-links ul {
    white-space: nowrap;

}

#primary-links ul, #primary-links ul li {
    margin: 0;
    padding: 0;
    height: 48px;
}

#primary-links ul li {
    display: inline-block;
    vertical-align: top;
}

#primary-links ul li a {
    display: block;
    color: #fff;
    font-size: 16px;
    font-family: arial;
    padding: 24px 20px 14px;
    position: relative;
    top: -8px;
}

#primary-links ul li.active a, #primary-links ul li.active-trail a {
    color: #00546a;
    background-color: #FFF;
    border-radius: 4px 4px 0 0 ;
    box-shadow: -2px -2px 2px rgba(0,0,0,0.25), 2px -2px 2px rgba(0,0,0,0.25);
}

/* Breadcrumb
 * -----------------
 */
#breadcrumb {
    padding: 0;
    font-size: 11px;
    color: #999;
}

#breadcrumb .page-inner-wrapper {
    padding: 0;
}

#breadcrumb a {
    color: #00546a;
}

/* Main
 * -----------------
 */
/** Layout rules. (Disclaimer: do not change if you're not sure you know what you're doing.) **/
#content {
    float: left;
    width: 100%;
    margin-right: -100%;
    padding: 0;
}

.sidebar {
    float: left;
}

#sidebar-second {
    float: right;
}

#footer {
    float: none;
    clear: both;
}

/** Main **/
#main {
    padding: 25px 0 50px;
    min-height: 500px;
}

/* Footer blocks
 * ----------------
 */
#footer {
    overflow: hidden;
}

#footer, #footer-light-overflow {
    height: 250px;
}

#footer-hr {
    background-position: 0 -380px;
    display: block;
    height: 2px;
}

#footer-top, #footer-bottom {
    height: 60px;
    padding: 30px 0 0;
}

#footer-top {
    height: 100px;
}

#footer-bottom {
    height: 80px;
}

#footer .like-buttons-wrapper {
    padding-top: 15px;
}

.footer-block {
    float: left;
}

#block-menu-menu-footer-project-links {
    padding: 0 0 6px 0;
}

.footer-top-block, .footer-bottom-block {
    margin-right: 30px;
}

#footer-top-block-3, #footer-bottom-block-3 {
    margin-right: 0px;
}

#footer-top-block-1 {
    width: 390px;
}

#footer-top-block-2 {
    width: 280px;
}

#footer-top-block-3 {
    width: 210px;
    float: right;
}

#footer-bottom-block-1 {
    width: 560px;
}

#footer-bottom-block-2 {
    width: 220px;
}

#footer-bottom-block-3 {
    width: 100px;
    float: right;
}

#footer-bottom-block-4 {
    background-color: inherit;
}
