/*---------------------- site header css for template ------------------------*/

/*--------------------------------- imports ----------------------------------*/

@import url("https://fonts.googleapis.com/css?family=Raleway"); /* fonts */

/*---------------------------------- global ----------------------------------*/

.container {
    background-image: url('../img/header_bgnd_img.png'); /* match #header-wrapper min-height below */
    background-repeat: repeat-x;}

#header-wrapper {
    min-height: 90px;  /* match header_bgnd_img.png height above */
    margin: 0px auto !important;
    width: 80% !important;}  /* main area width */

.center {
    margin: -23px auto 23px auto;} /* decal position */

.full { /* budget message when applicable - match #header-welcome-msg below */
    color: #94959A;
    font-size: 17px;
    font-weight: 700;
    margin: -50px 0 0 0;
    text-align: center;
    width: 80%;}  /* main area width */

#header-welcome-msg {
    color: #94959A;
    font-size: 17px;
    font-weight: 700;
    margin: 48px 0 0 8px;}

#contentwrapper {
    min-width: 100%;
    min-height: 100%;
    margin: 0 auto;
    text-align: center;}
    #contentwrapper a {
        text-decoration: none;}

#header-links-container {
    margin: -17px 0 0 0;}
        _:-moz-tree-row(hover), #header-links-container {
            margin: -16px 0 0 0;}
        @supports (-webkit-appearance:none) {
            #header-links-container {
                margin: -16px 0 0 0; }}
    .header-links, .header-links a {
        color: #94959A;}

.main {
    /*background-color: #f1f8fa; /* match .index-container background-color below */
    box-sizing: border-box;
    margin: 40px auto;
    width: 80%;}  /* main area width */

.steps {
    text-transform: none !important;
    margin-top: 80px !important;}
    .steps td {
        background-image: url(../img/step_separation_line.png);
        background-repeat: repeat-y;
        width: calc(100% / 6);}
    .steps_arrow, .steps_check {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;}
        .steps_arrow:before {
            content: "\f0da";}
        .steps_check:before {
            content: "\f00c";}
    .step-select-items, .side.left-side, .side.right-side {
        background-image: none !important;}
    .on.side.left-side, .side.left-side.leftSideFieldContainer {
        display: none;}

.pagetitle,
.pagetitle.no_mobile {
    padding: 8px 0 !important;
    text-align: center !important;}
    .pagetitle.no_mobile {
        margin-bottom: 25px !important;}

#index_img, .item-thumbnail img, .pretty-item img, .image-container img {
    max-width: 100% !important;
    max-height: 100% !important;
    min-width: 150px !important;
    height: auto !important;
    width: auto\9; /* ie8 */}

button {
    margin: 5px 5px 5px 0px;
    text-transform: none !important;
    white-space: nowrap;
    min-width: 140px;}

.highlight {
    font-weight: bold;
    font-size: 15px;
    color: red;}

.form-body td.label {
    width: 48%;}

.accept-proofs .form-body {
    width: 80% !important;} /* match form table width */
    .accept-proofs .form-body th {
        text-align: center !important;}
    .accept-proofs .form-body .previewcell table {
        margin: 0 auto !important;}

.buttonsbar {
    margin: 0.5em 0;}

.footer {
    padding-top: 10px !important;}
    .middle-row {
        margin: 0 auto !important;
        width: 80% !important;}  /* main area width */
    .right-col {
        padding-bottom: 10px;}
        .right-col a {
            color: #43949f;}

/*------- steps pages -------*/

.main.select-items.catalog--container,
.main.imprint.catalog--container,
.main.shipping.catalog--container,
.main.billing.catalog--container,
.main.review.catalog--container,
.main.done.catalog--container {
    margin-top: 0 !important;}

/*--------------------------------- profile ----------------------------------*/

#submit_edit_profile, #submit_cancel,
#submit_save_profile, #submit_delete_profile {
    margin: 5px 10px 5px auto;
    text-align: center !important;}

/*-------------------------- customer service info ---------------------------*/

.customer-service .message-block {
    text-align: center;}

/*--------------------------------- reorder ----------------------------------*/

.reorder_txt, .tabular.order-table {
    margin: 0 auto;
    width: 80%;} /* match form table width */

#submit_lookup_orders {
    width: 210px;}

/*---------------------------------- basket ----------------------------------*/

.main.basket-view.catalog--container form table {
    margin: 0 auto;}

/*---------------------------------- index -----------------------------------*/

.decal {
    display: none !important;} /* hides second (index page) decal */

.index-container {
    /*background-color: #f1f8fa !important; /* match .main background-color above */
    padding: 0 0 15px 0 !important;}

.index_img_area {
    margin-bottom: 25px;}

.index_header {
    font-weight: 600;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    letter-spacing: 3px;
    color: #43949f; /* header title text colour */
    margin: 0;}

.index_subhead {
    font-weight: 300;
    font-size: 18px;
    line-height: 40px;
    text-align: center;
    letter-spacing: 3px;
    color: #58595B;
    margin-bottom: 60px;}

.bullet {
    color: #d1d3d4;}

#submit_start_order, #submit_re_order, #submit_track_order, #submit_admin_login,
#submit_admin_login2, #submit_cataloglink, #submit_saved_orders,
#submit_customer_service, #submit_start_shopping, #submit_edit_profile {
    min-width: 210px;}

/*-------------------------------- catalogue ---------------------------------*/

.stretchy_cols {
    max-height: 600px !important;
    min-height: 200px;}

.select-items {
    max-width: 80% !important;
    min-width: 80% !important;
    width: 80% !important;} /* main area width */

.main-section {
    text-align: center;}

#copy2 {
    background-color: #f2f3f5; /* gst match Vertical Bar Background Color */
    box-sizing: border-box;
    margin-top: 20px !important;
    padding: 5px;}

#copy3 {
    padding: 0px !important;}

#extra_content_above_items {
    margin-top: 40px;}

#extra_content_below_items {
    margin: 20px 0;}

.image-container {
    margin: 10px 5px 8px 15px;}

.pretty-item.input-row {
    padding: 0 5px 10px 15px;}

#submit_catalog_add {
    width: 100px;}

#lightbox-image {
    border: 1px solid #333;}

.catalog-table .first {
    padding: 0 20px !important;}

.item-thumbnail.label {
    padding: 20px !important}

/*------- catalogue vertical tab -------*/

.item-search-block {
    margin: 10px 0px 8px 20px !important;}

#searchfield_input {
    width: 145px;}

.before {
    padding: 0px !important;}

/*- responsive tabs -*/

.responsive_tabs-shell {
    padding: 0 !important;}

.responsive_tabs .opened,
.responsive_tabs .closed {
    padding-left: 20px !important;}

.responsive_tabs .opened:before {
    content: "\f107" !important;
    margin: 10px 0 0 -12px !important;}

.responsive_tabs .closed:before {
    content: "\f105" !important;
    margin: 10px 0 0 -9px !important;}

.responsive_tabs .off:hover {
    background-color: #313131 !important;}

/*- non responsive tabs -*/

.opened, .closed {
    background-position: 5px 12px !important;
    padding-left: 20px !important;}

.vertical .off:hover {
    background-color: #313131 !important;}

/*------- catalogue shopping basket -------*/

.after {
    background: #fafafa; /* basket background colour responsive */
    padding: 15px 20px 12px 20px !important;}

#basket_icon {
    display: inline-block;
    font: normal normal normal 22px/1.5 FontAwesome;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;}
    #basket_icon:before {
        content: "\f291";}

#basket-list-title {
    color: #666;
    padding-bottom: 8px;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: bold !important;}

.basket-list-item button {
    background: #666 !important; /* button colour */
    display: block !important;
    text-align: center;
    padding: 2px 2px 2px 5px !important;
    width: 25px !important;
    height: 25px !important;}

.basket-list-item {
    border-top: 2px dashed #d1d3d4; /* match border colour below */
    font-size: 12px !important;
    padding: 8px 0;}

.basket-list-item a {
    color: #666 !important;
    text-decoration: none !important;}

#basket_button_container {
    border-top: 2px dashed #d1d3d4; /* match border colour above */
    padding-top: 5px;}

/*-------------------------------- configure ---------------------------------*/

.main.imprint.catalog--container {
    margin-bottom: 40px;}
    .main.imprint.catalog--container form {
        margin-top: 30px;}

.required-star {
    color: red;
    position: relative;
    top: 3px;
    left: 2px;}

.imprint .form-body .form-sublabel {
    display: inline; }

.imprint-splitview .left-side .form-body {
    border-radius: 0 !important;
    min-width: 180px !important;
    max-width: 450px !important;
    width: 100% !important;}

.catalog-table tr th,
.catalog-table tr td {
    border: none !important;}

.title h1 {
    padding-left:15px !important;}

.title h2 {
    text-align: left !important;
    padding: 5px 10px 10px 15px !important;
    margin-top: -10px !important;}

.label {
    padding-left: 5px !important;}

.form-body .title {
    -moz-border-radius: 0 0 0 0 !important;
    -webkit-border-radius: 0 0 0 0 !important;
    border-radius: 0 0 0 0 !important;}

.field-container {
    border-bottom: none !important;}

.left-side.leftSideFieldContainer .field-container input,
.left-side.leftSideFieldContainer .TextField .input input,
div.field-container input {
    width: 98% !important;
    max-width: 98% !important;}

.left-side.leftSideFieldContainer .EmailField .input input,
.left-side.leftSideFieldContainer .EmailField .input span select,
div.EmailField div.input span input {
    width: auto !important;}

.left-side.leftSideFieldContainer .DateField .input select,
div.DateField div.input select {
    width: 31% !important;}

.two-page.form-body.form-ed-off input {
    max-width: 280px !important;
    min-width: 280px !important;}

.proof-title {
    text-align: center;}

.buttonsbar.sbs_buttons {
    background-color: #ffffff !important; /* match main background colour */
    -moz-border-radius: 0 0 0 0 !important;
    -webkit-border-radius: 0 0 0 0 !important;
    border-radius: 0 0 0 0 !important;}

#pasteboard {
    border-color: #eaeaea !important;
    background: #f2f3f5 !important;}

/*------- proof confirmation -------*/

.preview-wrapper #confirm_container {
    left: calc(50% - 320px);}

#confirm_container .buttonsbar {
    background-color: #f2f3f5 !important;
    line-height: 1.4em !important;
    min-width: 580px !important;
    padding-bottom: 25px!important;} /* proof confirmation area */
    #approval_checkbox_group {
        margin-bottom: 15px;}

/*--------------------------------- shipping ---------------------------------*/

#shipping-pricetable {
    margin-top: 40px;}

#requestor-info {
    margin-bottom: 27px;}

#button_addproducts {
    width: 180px;}

.ic-msg-blank.message-block {
    display: none;}

/*---------------------------------- billing ----------------------------------*/

#creditcardicon {
    width: 57px !important;}

/*---------------------------------- review ----------------------------------*/

.main.review.catalog--container .accept-proofs {
    margin: 0 auto;
    width: 80% !important;} /* match form table width */

#highlight_review {
    font-weight: bold;
    font-size: 18px;
    color: red;}

.items-table {
    text-align: center;}
    .items-table td.label {
        width: 46% !important;}

#normal_src {
    border: 1px solid #333;}

/*---------------------------------- accept ----------------------------------*/

.accept-msg {
    margin: 40px auto;
    width: 80%;} /* match form table width */

.accept-showneworderbutton.center {
    margin-bottom: 30px !important;}

#submit_logout {
    width: 210px;}
