﻿/*#region FONTS */
/*@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-100.eot);
    src: url(/fonts/MuseoSlab-100.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-100.woff) format("woff"), url(/fonts/MuseoSlab-100.ttf) format("truetype"), url(/fonts/MuseoSlab-100.svg#MuseoSlab-100) format("svg");
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-100Italic.eot);
    src: url(/fonts/MuseoSlab-100Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-100Italic.woff) format("woff"), url(/fonts/MuseoSlab-100Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-100Italic.svg#MuseoSlab-100Italic) format("svg");
    font-weight: 100;
    font-style: italic
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-300.eot);
    src: url(/fonts/MuseoSlab-300.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-300.woff) format("woff"), url(/fonts/MuseoSlab-300.ttf) format("truetype"), url(/fonts/MuseoSlab-300.svg#MuseoSlab-300) format("svg");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-300Italic.eot);
    src: url(/fonts/MuseoSlab-300Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-300Italic.woff) format("woff"), url(/fonts/MuseoSlab-300Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-300Italic.svg#MuseoSlab-300Italic) format("svg");
    font-weight: 300;
    font-style: italic
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-500.eot);
    src: url(/fonts/MuseoSlab-500.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-500.woff) format("woff"), url(/fonts/MuseoSlab-500.ttf) format("truetype"), url(/fonts/MuseoSlab-500.svg#MuseoSlab-500) format("svg");
    font-weight: 500;
    font-style: normal;
    text-rendering: optimizeLegibility
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-500Italic.eot);
    src: url(/fonts/MuseoSlab-500Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-500Italic.woff) format("woff"), url(/fonts/MuseoSlab-500Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-500Italic.svg#MuseoSlab-500Italic) format("svg");
    font-weight: 500;
    font-style: italic
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-700.eot);
    src: url(/fonts/MuseoSlab-700.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-700.woff) format("woff"), url(/fonts/MuseoSlab-700.ttf) format("truetype"), url(/fonts/MuseoSlab-700.svg#MuseoSlab-700) format("svg");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-700Italic.eot);
    src: url(/fonts/MuseoSlab-700Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-700Italic.woff) format("woff"), url(/fonts/MuseoSlab-700Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-700Italic.svg#MuseoSlab-700Italic) format("svg");
    font-weight: 700;
    font-style: italic
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-900.eot);
    src: url(/fonts/MuseoSlab-900.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-900.woff) format("woff"), url(/fonts/MuseoSlab-900.ttf) format("truetype"), url(/fonts/MuseoSlab-900.svg#MuseoSlab-900) format("svg");
    font-weight: 900;
    font-style: normal
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-900Italic.eot);
    src: url(/fonts/MuseoSlab-900Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-900Italic.woff) format("woff"), url(/fonts/MuseoSlab-900Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-900Italic.svg#MuseoSlab-900Italic) format("svg");
    font-weight: 900;
    font-style: italic
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-1000.eot);
    src: url(/fonts/MuseoSlab-1000.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-1000.woff) format("woff"), url(/fonts/MuseoSlab-1000.ttf) format("truetype"), url(/fonts/MuseoSlab-1000.svg#MuseoSlab-1000) format("svg");
    font-weight: 1000;
    font-style: normal
}

@font-face {
    font-family: Museo Slab;
    src: url(/fonts/MuseoSlab-1000Italic.eot);
    src: url(/fonts/MuseoSlab-1000Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/MuseoSlab-1000Italic.woff) format("woff"), url(/fonts/MuseoSlab-1000Italic.ttf) format("truetype"), url(/fonts/MuseoSlab-1000Italic.svg#MuseoSlab-1000Italic) format("svg");
    font-weight: 1000;
    font-style: italic
}*/
/*#endregion */
body {
    background: #fafafa;
    color: #393939;
    font-family: Museo Sans, Arial, sans-serif !important;
    font-size: 14px;
    line-height: 1.25;
    margin: 0;
    padding: 0;
    width: 100%;
}

a {
    text-decoration: none;
}

    a:visited {
        text-decoration: none;
    }

    a:hover {
        text-decoration: none;
    }


p {
    line-height: 2
}

h1, h2, h3, h4, h5 {
    font-weight: 500;
}

.container {
    max-width: 1024px;
    width: 94%;
    height: 100%;
    margin: 0 auto
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

.button,
button {
    border-radius: 0;
    background: transparent;
    border: 2px solid #4d7f5a;
    border-radius: 2px;
    text-transform: uppercase;
    color: #393939;
    margin: .5em;
    padding: 1em;
    font-weight: 900;
    text-decoration: none;
    text-align: center
}

.main-wrapper {
    width: 1080px;
    margin: 0 auto;
}

.customization-form {
    margin-top: 20px;
}

form[action="/marketingmaterial/checkout"] .main-wrapper .sfContentBlock {
    margin-top: 40px;
}

.main-wrapper:last-of-type {
    border-top: 0px solid #008000;
}

#site-title {
    padding-top: 57px;
    display: inline-block;
}

#cart-container {
    display: inline-block;
    float: right;
    height: 50%;
    margin-top: -5px;
}

.header .cart-ico {
    width: 30px;
    height: auto;
    padding-top: 0;
    margin: -3px 3px;
    position: relative;
}

.cart-ico {
    width: 30px;
    height: auto;
    padding-top: 0;
    margin: -3px 3px;
    position: relative;
}

.req-box {
    margin: 30px auto;
}


#itemCount {
    position: absolute;
    color: #f00;
    width: 17px;
    font-size: 12px;
    top: -3px;
    right: 94px;
}
/*the dom layout changes from  search page to home page on mobile. Use the child selector to differentiate between the two*/
#cart > #itemCount {
    top: 8px;
    right: 100px;
}

#cart {
    position: relative;
}

/*Zach 3-27-2019 - There's a wrapper on the search page that shows the description of the auto complete search item's when you hover over one.
    This is incorrect and needs to be set to not display
*/
.ui-helper-hidden-accessible {
    display: none;
}

#site-title a {
    text-decoration: none;
    font-size: 15px;
    color: #a1a096;
    text-transform: uppercase;
}

.order {
    display: inline-block;
    color: #a1a096;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: .5px;
    position: relative;
}

#header-links {
    font-size: 9px !important;
    padding-top: 57px !important;
    padding-left: 65px !important;
    text-align: center !important;
    color: #a1a096 !important;
}

    #header-links a {
        color: #a1a096 !important;
    }

.main-navigation-wrapper {
    width: 100%;
}

#personal {
    border-bottom: 4px solid #6099ad;
    margin-right: 8.5px;
    color: #6099ad;
}

#commercial {
    border-bottom: 4px solid #875f7e;
    margin: 0 8.5px;
    color: #875f7e;
}

#farm {
    border-bottom: 4px solid #c94342;
    margin: 0 8.5px;
    color: #c94342;
}

#agencyResources {
    border-bottom: 4px solid #d77c3b;
    margin: 0 8.5px;
    color: #d77c3b;
}

#header-navigation #agencyResources {
    margin-left: 114px;
}

#helpfulResources {
    border-bottom: 4px solid #4d7f5a;
    margin-left: 8.5px;
    color: #4d7f5a;
}

#agent {
    border-bottom: 4px solid #4d7f5a;
    margin-left: 8.5px;
    color: #4d7f5a;
}

/*Header Navigation*/
#header-navigation {
    list-style: none;
    margin: 0;
    padding: 0;
    border-bottom: 7px solid #245e36;
    margin-top: 60px;
    position: relative;
    cursor: pointer;
    font-style: normal;
}

.cart #header-navigation {
    display: none;
}

.main-wrapper .cart-container {
    margin-top: -10px;
}

#header-navigation li ul {
    display: none;
    overflow: visible;
    width: 180px;
    z-index: 999;
    padding: 5px 0;
}

    #header-navigation li ul li {
        font-weight: 300;
        font-size: 11px;
        color: #fff;
        text-align: left;
        text-transform: uppercase;
        letter-spacing: 1px;
        position: relative;
        padding: 8px 13px;
        width: 100%;
    }

        #header-navigation li ul li:hover ul {
            display: block;
            position: absolute;
            left: 180px;
            top: 0;
        }

#header-navigation li {
    display: inline-block;
    width: 180px;
    text-align: center;
    font-size: 19px;
    font-weight: 500;
    padding-top: 8px;
}

    #header-navigation li ul li:hover#header-navigation li ul li:hover {
        font-weight: 500;
        letter-spacing: 2px;
    }

#header-navigation a {
    text-decoration: none;
    color: #fff;
    display: block;
    line-height: 1.5;
}

#personal ul {
    position: absolute;
    background-color: #508292;
}

    #personal ul li ul {
        background-color: #6099ad;
        position: absolute;
        top: 0;
        left: 180px;
    }

        #personal ul li ul li ul {
            background-color: #508292;
        }

#helpfulResources ul {
    background-color: #3d694a;
    position: absolute;
    min-height: 115px;
}

#agent ul {
    background-color: #3d694a;
    position: absolute;
    min-height: 115px;
}

#helpfulResources ul li ul {
    background-color: #4d7f5a;
    left: 180px;
}

#agent ul li ul {
    background-color: #4d7f5a;
    left: 180px;
}

#helpfulResources ul li ul li ul {
    background-color: #3d694a;
}

#agent ul li ul li ul {
    background-color: #3d694a;
}

#commercial ul {
    position: absolute;
    background-color: #875f7e;
    border-bottom: none;
}

    #commercial ul li {
        border-bottom: none;
    }

        #commercial ul li ul {
            left: 180px;
            background-color: #a07697;
        }

            #commercial ul li ul li ul {
                background-color: #875f7e;
            }

#farm ul {
    position: absolute;
    background-color: #af282e;
}

    #farm ul li {
        border-bottom: none;
    }

        #farm ul li ul {
            left: 180px;
            background-color: #c94342;
        }

            #farm ul li ul li ul {
                background-color: #af282e;
            }

#agencyResources ul {
    position: absolute;
    background-color: #d77c3b;
}

    #agencyResources ul li ul {
        background-color: #bf6828;
        position: absolute;
        top: 0;
        left: 180px;
    }

        #agencyResources ul li ul li ul {
            background-color: #8f4e1e;
        }

.caret {
    display: inline-block;
    white-space: nowrap;
}
/*Hero carousel*/
.carousel-wrapper {
    height: 366px;
}

.wrapper-items {
    height: 100%;
}

.carousel-wrapper .slick-list {
    height: 100%;
}

.carousel-wrapper .slick-track {
    height: 100%;
}

.carousel-wrapper .slick-dots {
    bottom: 20px;
}

    .carousel-wrapper .slick-dots li {
        margin: 0;
    }

        .carousel-wrapper .slick-dots li button:before {
            color: #fff;
            background-color: #fff;
            border: 1px solid #fff;
            border-radius: 10px;
            opacity: 1;
            transform: scale(.4);
        }

        .carousel-wrapper .slick-dots li.slick-active button:before {
            color: rgba(0,0,0,0);
            background-color: rgba(0,0,0,0);
            border: 2px solid #fff;
            border-radius: 10px;
            transform: scale(.4);
        }

.carousel-wrapper div.wrapper-items a.image-link {
    height: 100%;
    width: 100%;
    display: block;
    text-decoration: none !important;
}

.hero-text {
    color: #fff;
    position: relative;
    top: -11px;
    left: 24px;
    width: 80%;
}

    .hero-text h1 {
        font-weight: 900;
        font-size: 97px;
        font-family: 'Museo Sans' !important;
        text-transform: uppercase;
        color: #fff !important;
        line-height: normal;
        margin-top: 0;
        margin-bottom: 10px;
    }

    .hero-text h3 {
        font-size: 40px;
        font-weight: 500;
        font-family: 'Museo Sans';
        letter-spacing: .6px;
        color: #fff !important;
        margin: 0;
        line-height: normal;
    }

.carousel-wrapper div.wrapper-items a.image-link:hover,
.carousel-wrapper div.wrapper-items a.image-link:visited,
.carousel-wrapper div.wrapper-items a.image-link:focus,
.carousel-wrapper div.wrapper-items a.image-link:active {
    text-decoration: none !important;
}
/*Featured carousel*/
.featured-carousel-wrapper {
    margin-bottom: 40px;
    position: relative;
}

.featured-carousel {
    padding: 5px 0;
}

.featured-carousel-item-overlay {
    background-color: rgba(0,0,0,.3);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 138px;
    left: 0;
    transition: all 2s;
    padding-left: 20px;
    padding-right: 40px;
    box-sizing: border-box;
}

    .featured-carousel-item-overlay h4 {
        font-weight: 500;
        font-size: 18px;
        color: #fff;
        margin: 16px 0 18px 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .featured-carousel-item-overlay.top-zero > h4 {
        white-space: normal;
        overflow: visible;
    }

    .featured-carousel-item-overlay ul {
        padding-left: 20px;
    }

    .featured-carousel-item-overlay li {
        font-weight: 500;
        font-size: 12px;
        color: #fff;
        line-height: 26px;
    }

.featured-carousel-item .overlay-corner-image {
    position: absolute;
    top: 150px;
    left: 290px !important;
    z-index: 999;
    max-height: 40px;
    max-width: 40px;
}

.featured-carousel-item, .add-carousel-item {
    height: 190px;
    margin: 0 10px;
    position: relative;
    z-index: 100;
}

.add-carousel-item {
    background-image: url('../Images/Pixel_thumbnail.png');
}

    .add-carousel-item .featured-carousel-item-overlay {
        top: 0px;
    }

    .add-carousel-item h4 {
        margin: 90px auto 0;
        display: block;
        width: 110px;
    }

.featured-carousel .slick-prev:before, .slick-next:before {
    color: #a1a096;
}

.featured-carousel .slick-list {
    width: 100%;
}

.carousel-header {
    display: block;
    border-bottom: 1px solid #6d6e65;
    margin: 0 10px;
}

.subpage-carousel-header {
    position: absolute;
    top: -13px;
    left: 5px;
    width: 99%;
    font-weight: 500;
    font-size: 18px;
    text-transform: uppercase;
    padding-bottom: 3px;
}

.subpage-featured-carousel-wrapper {
    width: 1080px;
    position: relative;
    margin-top: 30px;
}

.marketing-material-wrapper {
    height: 100%;
    width: 100%;
}

#materialModal {
    position: static !important;
    background-color: #f1f1f1;
    box-shadow: 0 0 5px #6d6e65;
    z-index: 999;
}

    #materialModal iframe {
        height: 97%;
        width: 100%;
        border: none;
    }

#modal-close-button {
    background-color: white;
    width: 22px;
    height: 22px;
    position: absolute;
    top: 0;
    right: -29px;
    color: #fff;
    cursor: default;
}

    #modal-close-button span {
        margin: 5px;
        font-size: 18px;
        color: black;
        cursor: pointer;
    }

.light-grey-background {
    background-color: #dbdbdb;
    margin-top: -2px;
    box-shadow: 0 0 5px #6d6e65;
}

.dark-grey-background {
    background-color: #393939;
    color: white;
}

    .dark-grey-background h1 {
        margin: 0;
        padding: 30px 30px 10px 30px;
    }

    .dark-grey-background ul {
        margin: 0;
        padding: 0 0 30px 30px;
    }

    .dark-grey-background > div {
        padding-left: 17px;    
        padding-right:30px;
    }

div.white-background {
    background-color: #fff;
    margin: 0;
}

div.modal-col {
    padding: 0;
}

div.material-share {
    margin: 0;
    border-right: 1px solid black;
    padding: 30px;
    padding-left: 15px;
}

#link-copy {
    width: 60%;
    border: 2px solid #255f37;
    border-right: none;
    float: left;
    padding: 1px 5px;
    height: 26px;
}

.white-background h5 {
    font-weight: 600;
    margin-top: 0;
}

.share-links {
    text-align: left;
}

.media-embed .share-links h5 {
    font-weight: bold;
    font-size: 25px;
}

.share-links .col-lg-5 {
    padding-bottom: 20px;
}

div.col-lg-4 {
    text-align: center;
}

.material-information-right {
    padding: 25px;
}

.social-icons img {
    max-width: 30px;
    width: 30%;
}

#emIcon img {
    height: 30px;
    width: auto;
}

.extra-padding img {
    height: 32px;
    vertical-align: top;
}

.extra-padding p {
    font-size: 12px;
    margin: 0 0 0 2px;
}

.extra-padding .col-sm-6 {
    padding: 0;
}

.extra-padding .row {
    margin: 0;
}

.preview-link {
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 12px;
}

.ui-widget-overlay.modal-overlay {
    background-color: black;
    background-image: none;
    opacity: 0.9;
    z-index: 1040;
}

#marketingMaterial iframe {
    width: 618px;
    height: 374px;
    margin: 0 5px;
    position: relative;
    top: 5px;
}

.modal-dialog {
    width: 630px;
    padding: 0 !important;
}

.modal-body {
    padding: 0;
}

.related-content:nth-child(1) {
    width: 36%;
    margin: 0 !important;
}

.related-content {
    display: block;
    width: 100%;
    position: relative;
    padding-top: 5px;
    margin-bottom: 20px;
}

    .related-content .thumb {
        width: 60px;
        height: 40px;
        float: left;
        cursor: pointer;
    }

.related-content-thumb-container {
    width: 50%;
    position: relative;
}

    .related-content-thumb-container .material-type-icon {
        top: 1px;
    }

.material-type-icon {
    position: absolute;
    right: 10px;
    bottom: 10px;
}

    .material-type-icon.video {
        right: 5px;
        top: 3px;
    }

.related-content-title {
    display: inline-block;
    width: 90px;
    color: #2b2c2d;
    font-size: 11px;
    text-align: left;
    cursor: pointer;
    font-weight: 600;
    padding-left: 10px;
}

img.special-doc-icon-position {
    top: 41%;
}

.subpage-title {
    font-weight: 700;
    font-size: 14px;
    color: #6099ad;
    text-transform: uppercase;
}

    .subpage-title h2 {
        margin-bottom: 7px;
        font-size: 20px;
    }

.subpage-title-and-narrow-results {
    position: relative;
    border-bottom: 1px solid grey;
}

.subpage-results {
    padding-top: 5px;
    float: right;
}

    .subpage-results h2 {
        display: inline-block;
        text-transform: uppercase;
        font-weight: 500;
        font-size: 14px;
        color: #a1a096;
        padding-right: 14px;
        position: relative;
        top: -5px;
    }

    .subpage-results .narrow-results-image-container {
        margin: 0 15px;
        display: inline-block;
        font-size: 10px;
        font-weight: 500;
        color: #255f37;
        text-align: center;
        cursor: pointer;
    }

        .subpage-results .narrow-results-image-container span {
            text-align: center;
            margin: 0 auto;
            display: block;
            width: 100%;
            text-transform: uppercase;
        }

.grey-icon span {
    color: #a1a096;
}

.selected-result {
    color: #a1a096;
}

.subpage-results .narrow-results-image-container img {
    margin: 0 auto;
}


.full-list-wrapper {
    width: 1080px;
    position: relative;
}

.full-list {
    margin: 0 5px;
}

.full-list-item-overlay {
    background-color: rgba(0,0,0,.3);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 138px;
    left: 0;
    transition: top 2s;
    padding-left: 20px;
    padding-right: 40px;
    box-sizing: border-box;
}

    .full-list-item-overlay h4 {
        font-weight: 500;
        font-size: 18px;
        color: #fff;
        margin: 16px 0 18px 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .full-list-item-overlay.top-zero > h4 {
        white-space: normal;
        overflow: visible;
    }

    .full-list-item-overlay ul {
        padding-left: 20px;
    }

    .full-list-item-overlay li {
        font-weight: 500;
        font-size: 12px;
        color: #fff;
        line-height: 26px;
    }

.full-list-item .overlay-corner-image {
    position: absolute;
    top: 150px;
    left: 304px;
    z-index: 999;
    max-height: 40px;
    max-width: 40px;
}

.full-list-item {
    height: 190px;
    width: 338px;
    display: inline-block;
    margin: 10px 8px;
    position: relative;
    top: 11px;
    overflow-y: hidden;
    z-index: 100;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    text-align: inherit !important;
}

    .full-list-item:hover, .featured-carousel-item:hover, .add-carousel-item:hover {
        cursor: pointer;
    }

    .full-list-item:focus, .featured-carousel-item:focus, .add-carousel-item:focus {
        border-bottom: solid 5px #1a5732;
    }
/*External media embed page*/
.media-embed-wrapper {
    position: relative;
    width: 1080px;
    margin: 0 auto;
}

    .media-embed-wrapper h2 {
        font-weight: 900;
    }

header.media-embed-header {
    margin-top: 30px;
    padding-bottom: 49px;
    border-bottom: 1px solid grey;
}

.media-embed-header-left {
    width: 49%;
    display: inline-block;
}

.media-embed-header-right {
    width: 50%;
    display: inline-block;
    text-align: center;
    position: absolute;
    top: 14px;
    right: -171px;
}

    .media-embed-header-right #header-links {
        padding: 0 !important;
    }

    .media-embed-header-right h3 {
        color: #169203;
        font-size: 13px;
        font-family: 'Museo Sans';
        margin-bottom: 8px;
    }

.media-embed #scrollPane {
    margin: 10px auto;
    width: 950px;
    height: 1000px;
    border: 20px solid white;
}

    .media-embed #scrollPane iframe {
        width: 100%;
        height: 100%;
    }

.media-embed .wisdia-embed {
    width: 620px;
    margin: 75px auto;
}

.thank-you-header {
    text-transform: uppercase;
    border-bottom: 1px solid grey;
    padding-bottom: 5px;
    margin-top: 67px;
    color: #255f37;
    font-family: Museo Slab, sans-serif;
    font-size: 14px;
}

    .thank-you-header h2 {
        margin-bottom: 0;
    }

.thank-you-wrapper {
    margin-top: 104px;
    margin-left: 10px;
}

.empty-wrapper {
    margin-top: 55px;
    margin-left: 10px;
}

.thank-you-wrapper h1 {
    font-weight: 500 !important;
    font-size: 40px !important;
    color: inherit !important;
    text-transform: none !important;
}

.thank-you-wrapper h4 {
    font-weight: 500;
    font-size: 15px;
    color: #343734;
}

.thank-you-home-btn {
    background-color: #255f37 !important;
    margin: 0 !important;
    width: 192px !important;
    height: 39px !important;
}

    .thank-you-home-btn a {
        color: #f1f1f1 !important;
        text-decoration: none !important;
        text-transform: none !important;
        font-weight: 500 !important;
        font-size: 18px !important;
    }

.empty-home-btn {
    background-color: #255f37 !important;
    margin: 0 auto;
    width: 192px !important;
    height: 39px !important;
}

    .empty-home-btn a {
        color: #f1f1f1 !important;
        text-decoration: none !important;
        text-transform: none !important;
        font-weight: 500 !important;
        font-size: 18px !important;
    }

.fsBody .fsLabel {
    float: left;
}

.fsFieldRow input[type=text], .fsFieldRow input[type=tel], .fsFieldRow input[type=email], .fsBody textarea, .fsBody select {
    background-color: lightgrey !important;
    border: none !important;
    margin: -8px;
}

.fsBody select {
    width: 200px;
}

.fsSubmitButton {
    font-weight: 300 !important;
    text-transform: uppercase !important;
}

.fsFieldHorizontal h1 {
    color: #a1a096;
}

.overflow-hidden {
    overflow: hidden;
}
/*Special classes*/
.extra-padding {
    padding: 30px;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
}

.extra-margin {
    margin: 10px 0;
}

.width-100-percent {
    width: 100% !important;
}

#triangle-left {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-right: 13px solid #f00;
    border-bottom: 15px solid transparent;
    position: absolute;
    right: 0;
    top: 0;
}

.inline-block {
    display: inline-block;
}

.hidden-desktop {
    display: none;
}

.ui-dialog-titlebar-close {
    display: none;
}
/*formstack is super aggresive, these classes are used to overwirte fs classes without messing up other stuff...maybe*/
.white-text {
    color: #fff !important;
}



.loading-indicator {
    position: fixed;
    z-index: 9999;
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: none;
}

    .loading-indicator:before {
        content: '';
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.5);
    }
    /* :not(:required) hides these rules from IE9 and below */
    .loading-indicator:not(:required) {
        /* hide "loading..." text */
        font: 0/0 a;
        color: transparent;
        text-shadow: none;
        background-color: transparent;
        border: 0;
    }

        .loading-indicator:not(:required):after {
            content: '';
            display: block;
            font-size: 10px;
            width: 1em;
            height: 1em;
            margin-top: -0.5em;
            -webkit-animation: spinner 1500ms infinite linear;
            -moz-animation: spinner 1500ms infinite linear;
            -ms-animation: spinner 1500ms infinite linear;
            -o-animation: spinner 1500ms infinite linear;
            animation: spinner 1500ms infinite linear;
            border-radius: 0.5em;
            -webkit-box-shadow: rgba(255, 255, 255, 0.5) 1.5em 0 0 0, rgba(255, 255, 255, 0.5) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.5) 0 1.5em 0 0, rgba(255, 255, 255, 0.5) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.5) 0 -1.5em 0 0, rgba(255, 255, 255, 0.5) 1.1em -1.1em 0 0;
            box-shadow: rgba(255, 255, 255, 0.5) 1.5em 0 0 0, rgba(255, 255, 255, 0.5) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.5) 0 1.5em 0 0, rgba(255, 255, 255, 0.5) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.5) -1.5em 0 0 0, rgba(255, 255, 255, 0.5) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.5) 0 -1.5em 0 0, rgba(255, 255, 255, 0.5) 1.1em -1.1em 0 0;
        }

/* Animation */
@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.ui-dialog {
    z-index: 5000;
}

.ui-widget-overlay {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    background-color: black;
    opacity: 0.5;
    z-index: 4999;
}

.green-button {
    background-color: #255f37;
    color: #fff;
    padding: 8px 16px;
    font-weight: 600;
    cursor: pointer;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none !important;
    display: inline-block;
    user-select: none !important;
    margin-right: 20px;
    font-size: 12px;
    line-height: 1.4;
}

.orange-button {
    background-color: #c76234;
    color: #fff;
    padding: 8px 25px;
    font-weight: 600;
    cursor: pointer;
    text-align: center;
    text-transform: uppercase;
    display: inline-block;
    margin-right: 10px;
    font-size: 12px;
    text-decoration: none;
    line-height: 1.4;
}

    .orange-button:hover {
        text-decoration: none;
        color: white;
    }

    .orange-button:focus {
        text-decoration: none;
        color: white;
    }

.disabled {
    background-color: #8c8e8b !important;
    cursor: not-allowed !important;
    padding: 8px 12px;
    line-height: 1.4;
}

.copy-link {
    height: 26px;
    width: 40%;
    background: #255f37;
    border-color: #255f37;
    color: white;
    text-align: center;
    padding: 0;
    margin: 0;
    float: left;
    border-radius: 0;
    font-weight: 700;
}

    .copy-link[disabled] {
        background: #8c8e8b;
        border-color: #8c8e8b;
    }

.cart-header {
    width: 100%;
    height: 34px;
    background-color: #255f37;
    position: absolute;
    top: 0;
    left: 0;
    box-shadow: 0 7px 8px -6px #000;
    z-index: 1000;
    border-bottom: solid 1px #000;
}

#logoUpload {
    display: none;
}

#uploadLogo {
    background: black;
    color: white;
    padding: 7px;
    border-radius: 3px;
    border: 0px;
    cursor: pointer;
}

#fileDisplay {
    margin-top: 13px;
    margin-bottom: 13px;
}

.cart-header div {
    width: 50%;
    display: inline-block;
    float: left;
    color: white;
    text-align: center;
    margin-top: 10px;
}

.cart-header img {
    height: 21px !important;
    width: 21px !important;
    position: inherit;
    top: 0;
    left: 0;
    padding-top: 0 !important;
    margin: -5px 0 !important;
}

.cart-header a {
    margin-top: -40px;
    display: inline-block;
    color: white;
}

.cart-header div:last-child a:last-of-type {
    text-decoration: underline;
}

#slide-window {
    position: fixed;
    right: 0;
    top: 50%;
    width: 8em;
    margin-top: -2.5em;
}

#slidebar-container {
    box-shadow: 0 7px 8px -6px #000;
    position: fixed;
    left: -520px;
    top: 50%;
    width: 340px;
    margin: -2.5em 0 0 0;
    border: 25px #ffa500 solid;
    transition: left 1s ease;
    z-index: 3000;
    max-width: 75%;
}

    #slidebar-container.active {
        left: 3px;
    }

#slidebar {
    background-color: #255f37;
    border: 5px solid white;
    box-shadow: 0 0 0 25px #255f37;
}

    #slidebar .padded-content {
        padding: 30px;
        color: white;
        text-align: center;
    }

#window-close-button {
    background-color: white;
    width: 22px;
    height: 22px;
    position: absolute;
    top: -25px;
    right: -54px;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 7px 8px -6px #000;
    border: .5px solid gray;
}

    #window-close-button span {
        margin: 5px;
        font-size: 18px;
        color: black;
    }

.customization-form {
    width: 100%;
}

    .customization-form .form-row {
        margin-bottom: 10px;
        max-width: 90%;
    }

    .customization-form p {
        line-height: 18px;
    }

    .customization-form label {
        display: block;
    }

    .customization-form input {
        width: 250px;
        padding: 6px;
    }

    .customization-form select {
        width: 250px;
        padding: 6px;
    }

    .customization-form .phone-container div {
        display: inline-block;
    }

.phone-container .phone input {
    width: 190px;
}

.phone-container .ext input {
    width: 50px;
}

.gbox-container {
    text-align: center;
    margin-bottom: 100px;
}

.gbox {
    background-color: #c5c8cc;
    box-shadow: 0 7px 8px -6px #000;
    border: solid 1px #000;
    padding: 20px;
    text-align: left;
    margin-top: 30px;
    margin-bottom: 30px;
}

    .gbox textarea {
        display: block;
        width: 100%;
        min-height: 120px;
        margin-top: 10px;
        resize: none;
    }

.customization-form-button {
    width: 100%;
    margin: 0;
    background-color: #4d7f5a;
    color: white;
    text-transform: none;
    text-align: center;
    padding: 1em;
    font-weight: 900;
    border: 2px solid #4d7f5a;
    border-radius: 2px;
    margin-top: 10px;
    cursor: pointer;
}

.cart-contents ul {
    list-style: none;
    padding-left: 0px;
}

    .cart-contents ul li img {
        display: block;
        width: 215px;
        padding-top: 0px;
        margin: 0 0;
        height: auto;
    }

    .cart-contents ul li label {
        padding-bottom: 5px;
    }

    .cart-contents ul li {
        border-top: 1px solid black;
        padding: 30px 0px;
        /*box-shadow: 0 7px 8px -6px #000;*/
    }

        .cart-contents ul li:last-of-type {
            border-bottom: 1px solid black;
        }

.cart-contents label {
    display: block;
}

.qty {
    width: 58px;
}

.cart-contents textarea {
    width: 365px;
    height: 70px;
    resize: none;
}

.cart-contents .form-row {
}

input.error, textarea.error, select.error {
    border: red solid 2px;
}

.error-textbox {
    margin: 10px 0px;
    color: red;
    text-transform: inherit;
    border: grey 1px solid;
    width: 245px;
    padding: 10px;
}

.err-text {
    color: red;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: red;
    opacity: .75; /* Firefox */
    font-family: Museo Sans,Arial,sans-serif;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: red;
    opacity: .75;
    font-family: Museo Sans,Arial,sans-serif;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: red;
    opacity: .75;
    font-family: Museo Sans,Arial,sans-serif;
}

.cart-contents button {
    border-radius: 0;
    background: transparent;
    border: transparent solid 0px;
    border-radius: 2px;
    text-transform: none;
    color: red;
    margin: 5px 0 0 0;
    padding: 1.6px;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
}

    .cart-contents button:hover {
        text-decoration: underline;
    }

#place-order {
    text-decoration: underline;
}

.instructions {
    font-style: italic;
    margin-bottom: 10px;
    display: block;
}

.modal-cart-container {
    text-align: center;
    padding-top: 10px;
}

#modal-cart-bar {
    width: 100%;
    height: 45px;
    background-color: white;
    position: relative;
    top: 0px;
    left: 0;
}

    #modal-cart-bar div {
        padding: 10px;
    }

.right {
    float: right;
}

.left {
    float: left;
}

#modal-cart-bar #cart {
    margin-top: -7px;
    cursor: pointer;
}

#modal-cart-bar .left {
    padding-top: 15px;
}

    #modal-cart-bar .left .order {
        color: #255f37;
        cursor: pointer;
    }

.customization {
    display: block;
    font-size: 12px;
}

.btn-primary, .btn-primary:hover, .btn-primary:visited, .btn-primary:active, .btn-primary:focus {
    background-color: white !important;
    border: none !important;
    color: #ccc !important;
    position: absolute;
    top: 8px;
    right: 5px;
    margin: 0;
    padding: 0 !important;
}

.form-inline > .form-group {
    position: relative;
}

.form-inline {
    float: right;
}


.play-search {
    width: 250px !important;
}

.play-header {
    border-bottom: 1px solid #6d6e65;
}

    .play-header .logo {
        width: 60%;
        height: auto;
        margin-left: -100px;
    }

@media(max-width:960px) {
    .form-inline {
        float: left;
    }
}

.play-header .col-lg-2 a,
.play-header .col-lg-3 a {
    padding-top: 12px;
    display: block;
    color: #6d6e65;
}

    .play-header .col-lg-2 a:hover,
    .play-header .col-lg-3 a:hover {
        text-decoration: underline;
    }

.play-header .col-lg-3:first-of-type a {
    padding-top: 0;
}

.play-header .col-lg-2,
.play-header .col-lg-3 {
    border-right: 1px solid #6d6e65;
}

.play-header .col-lg-3:first-of-type {
    padding-top: 5px;
}

    .play-header .col-lg-3:first-of-type a {
        display: block;
    }

.play-header .col-lg-3:last-of-type {
    padding-right: 0;
}

.play-header .row {
    width: 1080px;
    margin: 0 auto;
}

    .play-header .row > div {
        height: 40px;
        text-align: center;
    }

.share-head {
    background-color: #255f37;
}

    .share-head .row {
        margin: 0 auto;
        width: 1080px;
    }

    .share-head .share-icon {
        float: right;
        margin-right: 15px;
        width: auto;
    }

    .share-head a,
    .share-head a:hover,
    .share-head a:visited,
    .share-head a:active {
        color: white !important;
        font-family: Museo Sans,Arial,sans-serif;
        font-size: 14px;
        padding-top: 10px;
        display: block;
    }

        .share-head a:hover {
            text-decoration: underline;
        }

    .share-head .col-lg-2 {
        border-right: 2px solid white;
        text-align: center;
        height: 70px;
    }

        .share-head .col-lg-2:nth-of-type(1) {
            border-left: 2px solid white;
        }

        .share-head .col-lg-2 a {
            padding-top: 25px;
        }

    .share-head img {
        height: 45px;
    }

.media-embed-wrapper h2 {
    font-family: Museo Sans,Arial,sans-serif;
    color: #6d6e65;
    margin: 7% 20px;
}

#null {
    display: none;
}

footer {
    width: 100%;
    position: static;
    margin-top: 30px;
}

    footer.public {
        position: absolute;
        left: 0;
    }

    footer div {
        width: 100%;
        background-color: #255f37;
        text-align: center;
        color: white;
        font-family: Museo Sans,Arial,sans-serif;
        font-size: 11.2px;
        padding: 35px 0;
    }

    footer p {
        margin: 10px 0;
    }
