/*
Theme Name: SPR Theme
Theme URI: http://www.sprpackaging.com/
Description: Theme for the SPR Packaing company
Version: 1.0
Author: Jacob Andreas
Author URI: http://jacobandreas.net/
*/


/*
 * Global ---------------------------------------
 */

* {
    margin: 0;
    padding: 0;
}

.clear {
    clear: both;
}

body {
    font-family: "Verdana", sans-serif;
}

/*
 * Generic formatting ---------------------------
 */

p {
    margin-top: .8em;
    line-height: 1.3em;
}

a {
    color: #420;
}

a img {
    border: none;
}

#content h2, #content h3, #content h4, #content h5 {
    margin-top: 1em;
    margin-bottom: -.4em;
}

#content ol, #content ul {
    margin-top: .8em;
    padding-left: 2.1em;
}

/*
 * Page layout ----------------------------------
 */

/*
 * Header
 */

a#customer_login {
    display: block;
    top: 0;
    float: right;
    background: url(img/login_button.png);
    width: 115px;
    padding: 4px;
    padding-bottom: 6px;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    font-size: 10px;
    text-align: center;
    height: 14px;
}

div#header {
    height: 144;
}

    div#header div#logo {
        width: 210px;
        height: 63;
        margin: 40px 45px 40px 18px; /* 40 = (144 - 63) / 2 */
        background: url(img/logo.png);
        float: left;
    }

    div#header ul#topnav {
        float: left;
        height: 34;
        margin: 56px 0 56px 0; /* 56 = (144 - 32) / 2 */
        list-style-type: none;
    }

    div#header ul#topnav li {
        float: left;
    }

    div#header ul#topnav li a {
        font-weight: bold;
        color: #562e18;
        text-decoration: none; display: block;
        padding: 7px 12px 7px 12px;
        float: left;
    }

    div#header ul#topnav li a:hover {
        font-weight: bold;
        color: #fff;
        text-decoration: none; display: block;
        padding: 7px 12px 7px 12px;
        float: left;
    }

    div#header ul#topnav li.selected div.left {
        background: url(img/page_active_left.png);
        height: 35px;
        width: 4px;
        float: left;
    }

    div#header ul#topnav li.selected div.right {
        background: url(img/page_active_right.png);
        height: 35px;
        width: 4px;
        float: left;
    }

    div#header ul#topnav li.selected a {
        background: url(img/page_active_slice.png);
        color: #fff;
        height: 20px;
    }

/*
 * Content page side navigation
 */

ul#sidenav {
    float: left;
    width: 94px;
    list-style-type: none;
}

    ul#sidenav li {
        margin: -9px 0 -18px -9px;
        width: 103px;
        position: relative;
    }

    ul#sidenav .top {
        height: 13px;
        background: url(img/tab_inactive_top.png);
    }

    ul#sidenav .bottom {
        height: 13px;
        background: url(img/tab_inactive_bottom.png);
    }

    ul#sidenav li a {
        background: url(img/tab_inactive_slice.png);
        font-size: 12px;
        padding: 5px 0 5px 10px;
        font-weight: bold;
        color: #fff;
        text-decoration: none;
        width: 93px;
        display: block;
        text-align: center;
    }

    ul#sidenav li.current_page_item, ul#sidenav li:hover {
        position: relative;
        z-index: 100;
    }

    ul#sidenav li.current_page_item a, ul#sidenav li:hover a {
        color: #562e18;
        background: url(img/tab_active_slice.png);
    }

    ul#sidenav li.current_page_item .top, ul#sidenav li:hover .top {
        background: url(img/tab_active_top.png);
    }

    ul#sidenav li.current_page_item .bottom, ul#sidenav li:hover .bottom {
        background: url(img/tab_active_bottom.png);
    }

/**
 * Contact form
 */

div#contact-form form {
    font-family: "Verdana", sans-serif;
}

div#contact-form td {
    vertical-align: top;
}

div#contact-form label {
    color: #562e18;
    font-size: 11px;
    font-weight: bold;
    font-family: "Verdana", sans-serif;
    width: 78px;
    display: block;
}

div#contact-form input, div#contact-form textarea {
    background: #fff;
    border-bottom: 1px solid #757575;
    border-left: 1px solid #d3d3d3;
    border-right: 1px solid #d3d3d3;
    border-top: 1px solid #eeeeee;
}

div#contact-form input {
    height: 20px;
    margin-bottom: 5px;
}

div#contact-form textarea {
    height: 80px;
    margin-bottom: -3px;
}

div#contact {
    float: right;
    width: 284px;
    color: #fff;
    font-size: 11px;
    margin-top: -2px;
}

    div#contact div#contact-mailing {
        background: url(img/contact_column_bottom.png);
        padding: 6px;
        height: 56px;
    }

    div#contact div#contact-mailing table, div#front-copy div#contact-form table {
        width: 100%;
    }

    div#contact div#contact-mailing td {
        font-size: 11px;
        font-weight: bold;
        color: #fff;
    }

    div#contact a#contact-head {
        background: url(img/contact_column_top.png);
        color: #fff;
        font-weight: bold;
        display: block;
        padding: 9px;
        text-decoration: none;
        height: 15px;
    }

    div#contact div#contact-form {
        padding: 9px;
        background: url(img/contact_column_slice.png);
        margin-top: 1px;
    }

    div#contact div#contact-form input.submit {
        background: url(img/light_button.png);
    }

    div#contact div#contact-form input, div#contact div#contact-form textarea {
        width: 180px;
    }

div#front-copy div#contact-form input, div#front-copy div#contact-form textarea {
    width: 350px;
}

div#front-copy div#contact-form input.submit, div#contact div#contact-form input.submit {
    width: 60px;
    border: none;
    color: #fff;
    font-weight: bold;
    float: right;
    margin-right: 10px;
}

div#front-copy div#contact-form input.submit {
    background: url(img/dark_button.png);
}

div#front-copy div#contact-form {
    float: right;
    width: 430px;
    padding: 0 10px;
}

div#front-copy div#contact-form label {
    color: #fff;
}

/* (contact form plugin ajax response styles) */

.wpcf7-response-output {
    background: #fff;
    color: #000;
    border: 1px solid #aaa;
}

td span.wpcf7-not-valid-tip {
    background: #fee;
    border: 1px solid #faa;
    color: #000;
    left: 0;
    top: 0;
    width: 176px;
    font-size: .8em;
}

/*
 * Content page body
 */

div#content {
    margin: 0 22px 0 86px;
    padding: 1px 16px 1px 16px;
    width: 479px;
    background: url(img/about_column_slice.png);
    font-family: "Tahoma","Geneva","Kalimati",sans-serif;;
}

h1 {
    line-height: 20px;
    margin-bottom: 15px;
}

div.glow-top {
    width: 511px;
    height: 22px;
    margin: -9px 23px 0 85px;
    background: url(img/about_column_top.png);
}

div.glow-bottom {
    width: 511px;
    height: 22px;
    margin: 0 0 0 85px;
    background: url(img/about_column_bottom.png);
}

/*
 * Front page copy
 */

div#front-copy {
    background: url(img/front_copy_slice.png);
    padding: 10px;
    color: #fff;
    font-family: "Palatino", "Palatino Linotype", serif;
}

    div#front-copy p {
        font-weight: bold;
        font-size: 28px;
        margin-top: -1px;
    }

    div#front-copy h2 {
        font-style: italic;
        font-size: 28px;
        margin-bottom: 7px;
    }

    div#front-copy div#separator {
        float: left;
        margin-top: 20px;
        height: 210px;
        border-left: 1px solid #999999;
        border-right: 1px solid #1f1f1f;
    }

    div#front-copy div#text {
        float: left;
        width: 410px;
        padding: 0 10px;
    }

div.front-copy-bottom {
    width: 904px;
    height: 6px;
    background: url(img/front_copy_bottom.png);
    margin-bottom: 30px;
}

/*
 * Full-page background -------------------------
 */

html, body, #bgimg, #bgimg table, #bgimg td {
    height: 100%;
    width: 100%;
    overflow: hidden;
}

#bgimg {
    position: fixed;
}

#bgimg div {
    height: 100%;
    top: 0;
    position: absolute;
    width: 200%;
    left: -50%;
}

#bgimg td {
    text-align: center;
    vertical-align: middle;
}

#bgimg img {
    margin: 0 auto;
    min-width: 50%;
    min-height: 100%;
}

div#main {
    margin: 0 auto;
    width: 904px;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 50px;
    overflow: hidden;
}

div#body {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 70;
    overflow: auto;
    width: 100%;
    height: 100%;
}