/* -------------------------- Main Website Styles -------------------------- */

body {
    background-color: #0076c0;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    font-family: "Encode Sans Regular", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 24px;
    color: #656565;
}

img, a img {
    border: 0 none;
}

*,
*::after,
*::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    outline: none;
}

    a[href^="tel"] {
        color: inherit !important;
        text-decoration: none !important;
    }

H1 {
    font-size: 48px;
    margin-bottom: 10px;
    margin-top: 0px;
    font-weight: normal;
    font-style: normal;
    color: #656565;
    line-height: 56px;
    font-family: "Encode Sans Compressed Light";
    text-transform: uppercase;
}

H2 {
    font-size: 32px;
    margin-bottom: 5px;
    margin-top: 15px;
    font-weight: normal;
    font-style: normal;
    color: #656565;
    line-height: 42px;
    font-family: "Encode Sans Compressed Black";
}

H3 {
    font-size: 22px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-weight: normal;
    font-style: normal;
    color: #656565;
    line-height: 32px;
    font-family: "Encode Sans Compressed Bold";
}

H4 {
    font-size: 12px;
    margin-bottom: 0px;
    margin-top: 0px;
    font-weight: bold;
    color: #656565;
}

hr /* Make sure you upate all the color hexes when changing, different browsers read this tag differently. */ {
    border: 0px solid #ccc;
    color: #ccc;
    height: 1px;
    background-color: #ccc;
}

A, A:Link, A:Visited {
    color: #0076c0;
    text-decoration: none;
    font-weight: bold;
}

    A:Hover {
        color: #008be3;
        text-decoration: underline;
    }

    A.anchor-disabled {        
        pointer-events: none;
        cursor: default;
    }
/* ------ Custom Fonts ------ */


@font-face {
    font-family: "Encode Sans Compressed Light";
    src: url("/media/fonts/encodesanscompressed-300-light-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Light";
    src: url("/media/fonts/encodesanscompressed-300-light-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Regular";
    src: url("/media/fonts/encodesanscompressed-400-regular-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Regular";
    src: url("/media/fonts/encodesanscompressed-400-regular-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Medium";
    src: url("/media/fonts/encodesanscompressed-500-medium-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Medium";
    src: url("/media/fonts/encodesanscompressed-500-medium-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Semibold";
    src: url("/media/fonts/encodesanscompressed-600-semibold-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Semibold";
    src: url("/media/fonts/encodesanscompressed-600-semibold-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Bold";
    src: url("/media/fonts/encodesanscompressed-700-bold-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Bold";
    src: url("/media/fonts/encodesanscompressed-700-bold-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Extrabold";
    src: url("/media/fonts/encodesanscompressed-800-extrabold-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Extrabold";
    src: url("/media/fonts/encodesanscompressed-800-extrabold-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: "Encode Sans Compressed Black";
    src: url("/media/fonts/encodesanscompressed-900-black-webfont.eot"); /* EOT file for IE */
}

@font-face {
    font-family: "Encode Sans Compressed Black";
    src: url("/media/fonts/encodesanscompressed-900-black-webfont.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
    font-family: 'Encode Sans Regular';
    src: url("/media/fonts/EncodeSans-Regular.ttf") format("truetype"); /* TTF file for CSS3 browsers */
    url('/media/fonts/encodesans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* ------ Grid Column Classes ------ */

/* Example Layout:
*  
*
*	<div class="section group">
*		<div class="col span_6">
*			Content Goes Here.
*		</div>
*		<div class="col span_6">
*			Content Goes Here.
*		</div>
*	</div>
*
*
*/

.section {
    clear: both;
    padding: 0px;
    margin: 0px;
}

/* GROUPING */


.group:before,
.group:after {
    content: "";
    display: table;
}

.group:after {
    clear: both;
}

.group {
    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}

/* Grid-Style Div Classes */

.col {
    display: block;
    float: left;
}

.col_padding {
    padding: 5px;
}

/* 
Span classes are all out of 12 columns.
i.e .span_6 = length of 6 columns out of 12, or half width. 
*/

.span_12 {
    width: 100%;
}

.span_11 {
    width: 91.66%;
}

.span_10 {
    width: 83.33%;
}

.span_9 {
    width: 75%;
}

.span_8 {
    width: 66.66%;
}

.span_7 {
    width: 58.33%;
}

.span_6 {
    width: 50%;
}

.span_5 {
    width: 41.66%;
}

.span_4 {
    width: 33.33%;
}

.span_3 {
    width: 25%;
}

.span_2 {
    width: 16.66%;
}

.span_1 {
    width: 8.33%;
}


/* -------------------------- Specialty Website Styles -------------------------- */

.pencil {
    width: 16px !important;
    height: 16px !important;
}

.hiddenPic {
    display: none;
}

.mobile-hide {
    display: inherit;
}

@media print {
    .noprint {
        display: none;
    }
}
.printable {
	display: none;
}
@media print {
    .printable {
        display: block;
    }
}

.over img:hover {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7; /* FX/Opera/Safari/Chrome */
}

.clearer {
    clear: both;
}

.categories-text {
    line-height: 18px;
    font-size: 12px;
}

.box-categories a:link,
.box-categories a:visited {
    font-size: 14px;
}

.font-white,
.font-white h1,
.font-white h2,
.font-white h3,
.font-white h4,
.font-white a,
.font-white a:link,
.font-white a:visited {
    color: #fff;
}

.font-black,
.font-black h1,
.font-black h2,
.font-black h3,
.font-black h4,
.font-black a,
.font-black a:link,
.font-black a:visited {
    color: #000;
}

.font-gray,
.font-gray h1,
.font-gray h2,
.font-gray h3,
.font-gray h4,
.font-gray a,
.font-gray a:link,
.font-gray a:visited {
    color: #5f5f5f;
}
.font-red,
.font-red h1,
.font-red h2,
.font-red h3,
.font-red h4,
.font-red a,
.font-red a:link,
.font-red a:visited {
    color: #e12326;
}

.font-orange {
    color: #ff9100;
}

/* -------------------------- Social Media Style Classes Go Here -------------------------- */

.box-social {
}

    .box-social a {
        display: inline-block;
        width: 35px;
        height: 35px;
        background-position: center;
        background-repeat: no-repeat;
    }

.icon-facebook:link, .icon-facebook:visited {
    background-image: url(../images/icons/facebook.png);
}

.icon-facebook:hover {
    background-color: #3b579d;
}

.icon-twitter:link, .icon-twitter:visited {
    background-image: url(../images/icons/twitter.png);
}

.icon-twitter:hover {
    background-color: #33ccff;
}

.icon-google-plus:link, .icon-google-plus:visited {
    background-image: url(../images/icons/google-plus.png);
}

.icon-google-plus:hover {
    background-color: #dc4a38;
}

.icon-youtube:link, .icon-youtube:visited {
    background-image: url(../images/icons/youtube.png);
}

.icon-youtube:hover {
    background-color: #cd201f;
}

.icon-pinterest:link, .icon-pinterest:visited {
    background-image: url(../images/icons/pinterest.png);
}

.icon-pinterest:hover {
    background-color: #bd081c;
}

.icon-ebay:link, .icon-ebay:visited {
    background-image: url(../images/icons/ebay.png);
}

.icon-ebay:hover {
    background-color: #0063d1;
}


/* -------------------------- Structure Style Classes Go Here -------------------------- */
.table-reporting .hdr-reporting td {
	font-weight: bold;
	color: white;
	font-size: 20px;
}
.table-reporting .hdr-reporting .column-left {
	width: 60%;
	background-color: #0076c0;
}
.table-reporting .hdr-reporting .column-right {
	background-color: #69b545;
}
.table-reporting td {
	padding: 15px;
	background-color: #eeeeee;
	border: 1px solid #fff;
	vertical-align: top;
}
.table-reporting h3 {
	font-size: 18px;
}
.main-container {
    width: 100%;
    position: relative;
    text-align: left;
}

.boxed {
    width: 1050px;
    margin: 0 auto;
}

.padding,
.padding25 {
    padding: 25px;
}

.padding2,
.padding15 {
    padding: 15px;
}
.padding20 {
	padding: 20px;
}
.padding35 {
	padding: 35px;
}
.padding50 {
	padding: 50px;
}

.padding-center {
    padding-top: 25px;
    padding-bottom: 25px;
}

.padding-left {
    padding-top: 25px;
    padding-right: 25px;
    padding-bottom: 25px;
}

.padding-right {
    padding-top: 25px;
    padding-left: 25px;
    padding-bottom: 25px;
}

.bg-body {
    background-color: #fff;
}

.box-body {
}

.box-left {
}

.box-right {
}

.box-main {
}

.box-story-content {
}


/* -------------------------- Button Style Classes Go Here -------------------------- */


.btn {
    padding: 15px;
    min-width: 200px;
    text-align: center;
    font-size: 18px;
    margin-top: 10px;
    border: none;
    line-height: normal !important;
    font-style: normal;
    -webkit-appearance: none;
    display: inline-block;
}

    .btn:hover {
        text-decoration: none;
        cursor: pointer;
    }

.btn-cal {
    padding: 15px;
    text-align: center;
    font-size: 18px;
    margin-top: 10px;
    border: none;
    line-height: normal !important;
    font-style: normal;
    -webkit-appearance: none;
    display: inline-block;
}

.btn-cal:hover {
    text-decoration: none;
    cursor: pointer;
}

.btn1,
.btn1:link,
.btn1:visited {
    background-color: #0076c0;
    color: #fff;
}

    .btn1:hover {
        background-color: #008be3;
    }

.btn2,
.btn2:link,
.btn2:visited {
    background-color: #cfe6f5;
    color: #0076c0 !important;
}

    .btn2:hover {
        background-color: #fff;
    }

.btn3,
.btn3:link,
.btn3:visited {
    background-color: #2894d8;
    color: #fff;
}

    .btn3:hover {
        background-color: #cfe6f5;
    }
.btn4,
.btn4:link,
.btn4:visited {
    background-color: #6eb33f;
    color: #fff;
}

    .btn4:hover {
        background-color: #80c454;
    }

.btn-red,
.btn-red:link,
.btn-red:visited {
    background: #e12326;
    color: #fff;
}

    .btn-red:hover {
        background-color: #bc1f23;
    }
    .btn-gray,
    .btn-gray:link,
    .btn-gray:visited {
        background: #ccc;
        color: #fff;
    }
.btn-home,
.btn-home:link,
.btn-home:visited {
    float: left;
    padding: 10px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    vertical-align: middle;
}

    .btn-home:hover {
        background-color: #6eb33f;
    }

.btn-remove {
    font-size: 30px;
    text-align: center;
    background: transparent;
}    
/*
 * Devexpress buttons make styling the background with these multiple
 * classes really tricky. To override the devexpress button styles we need
 * to use "background" to set classes above. But this gives us trouble
 * when setting specific background style. So I've decided to set the icon
 * styles as !important to fix this.
 *
 * This may not be true for all browsers, I'm using Firefox
 *
 */
.btn-white-arrow-left {
    padding-left: 40px;
	background-image: url("/images/arrow-left-white.png")!important;
	background-position: 15px 18px!important;
	background-repeat: no-repeat!important;
}

.btn-white-arrow-right {
    padding-right: 40px;
	background-image: url("/images/arrow-right-white.png")!important;
	background-position: 94% 18px!important;
	background-repeat: no-repeat!important;
}
  
    
/* -------------------------- ECommerce Style Classes -------------------------- */

.product-detail-pricing {
    font-size: 18px;
    line-height: 34px;
}

.product-list .dxdvItem, .dxdvFlowItem {
    border: none;
    background-color: transparent;
    height: auto;
}

/* -------------------------- Header Style Classes Go Here -------------------------- */

.slicknav_menu,
.js #menu {
    display: none;
}

.bg-top {
    background-color: #fff;
    z-index: 999;
    width: 100%;
}
.bg-header {
	position: relative;
	z-index: 150;
	background-color: white;
}
.bg-menu {
    z-index: 100;
    background-color: #0076c0;
    	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
    padding: 0;
    height: 50px;
}

.box-menu {
    position: relative;
}

.desktop-menu {
    display: inline-block;
}

.dx-main-menu {
    float: left;
}

.box-logo {
	padding-top: 15px;
}

.box-header-address {
    text-align: right;
    padding: 10px 0;
    position: relative;
}
#search_label {
    margin-bottom: 0;
    position: absolute;
    right: 0;
    z-index: 999;
}


/* -------------------------- Footer Style Classes Go Here -------------------------- */

.box-footer {
    font-size: 12px;
}
.bg-footer-top {
    background-color: #fff;
    font-size: 16px;
}
.bg-footer-top td {
    vertical-align: top;
}
.box-footer-top td {
    padding-bottom: 20px;
}
.bg-footer-top a,
.bg-footer-top a:link,
.bg-footer-top a:visited {
    font-family: "Encode Sans Compressed Light";
    font-weight: normal;
    color: #656565;
}

.bg-footer-top h3 {
    color: #0076c0;
    text-transform: uppercase;
    font-family: "Encode Sans Compressed Bold";
    margin-bottom: 20px;
}
.footer-right {
    text-align: right;
}
.footer-social em {
	margin-right: 5px;
	width: 20px;
	font-size: 18px;
	line-height: normal;
	vertical-align: middle;
}


/* -------------------------- Home Classes Go Here -------------------------- */

.newsletter-boxed {
	max-width: 1600px;
	margin: 0 auto;
}

.bg-newsletter h3 {
    padding-right: 30px;
    text-align: right;
    font-size: 30px;
    line-height: 50px;
    vertical-align: middle;
}
.bg-newsletter a:link,
.bg-newsletter a:visited {
	padding: 10px 30px;
	margin: 0;
	font-family: "Encode Sans Compressed Bold";
	font-weight: normal;
	font-size: 25px;
	line-height: normal;
	
}

.bg-newsletter .padding {
    padding-top: 50px;
    padding-bottom: 50px;
}

.box-newsletter-form {
    padding-top: 15px;
    width: 50%;
    margin: 0 auto;
}

    .box-newsletter-form .col {
        padding: 5px;
    }

    .box-newsletter-form .btn3 {
        margin-top: 0;
        min-width: inherit;
    }

.box-mission h2,
.bg-what-we-do h2 {
    font-size: 48px;
    margin-bottom: 10px;
    margin-top: 0px;
    font-weight: normal;
    font-style: normal;
    color: #656565;
    line-height: 56px;
    font-family: "Encode Sans Compressed Light";
}

.box-mission {
    padding-left: 120px;
    padding-right: 120px;
    font-size: 18px;
    line-height: 36px;
}

.box-mission {
    text-align: center;
}

.bg-what-we-do {
    background-image: url(../images/bg-rain-barrel2.jpg);
    font-size: 20px;
    line-height: 32px;
}

    .bg-what-we-do h2 {
        color: #fff;
    }

    .bg-what-we-do a:link,
    .bg-what-we-do a:visited {
        color: #cfe6f5;
        font-family: "Encode Sans Compressed Light";
    }

    .bg-what-we-do .padding {
        padding: 50px;
    }

.inner-shadow {
    -webkit-box-shadow: inset 10px 10px 30px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 10px 10px 30px 0px rgba(0,0,0,0.3);
    box-shadow: inset 10px 10px 30px 0px rgba(0,0,0,0.3);
}

.outer-shadow {
    -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.5);
}

.bg-ticker {
    background-color: #eee;
}
.bg-ticker .padding {
    padding: 15px;
}
.box-ticker {
    font-style: italic;
    text-align: center;
}
.box-ticker a:link,
.box-ticker a:visited {
    font-weight: normal;
    color: #656565;
    display: inline-block;
    margin-right: 25px;
}

/* -------------------------- Parallax & Slideshow Styles -------------------------- */

.parallax {
    padding: 0;
    margin: 0;
    width: 100%;
    margin: 0 auto;
    background-size: 100% auto;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    z-index: 99;
}

.bg-home-banner {
    position: relative;
    width: 100%;
    background-color: #414141;
    background-image: url(../images/bg-main-image-ohio-river.jpg);
    min-height: 650px;
}

.bg-main-banner {
    position: relative;
    width: 100%;
    background-color: #414141;
    background-image: url(../images/bg-main-image-ohio-river.jpg);
    min-height: 200px;
}

.box-main-image {
    text-align: center;
    text-shadow: 0 0 20px #000;
    padding-top: 200px;
}

    .box-main-image h1 {
        font-size: 44px;
        font-family: "Encode Sans Compressed Bold";
        text-transform: uppercase;
    }

    .box-main-image h2 {
        font-size: 38px;
        font-family: "Encode Sans Compressed Regular";
    }

.slide, #slideshow {
    width: 100%;
    height: 600px;
    position: relative;
    z-index: 0;
}

    #slideshow .position {
        width: 100%;
    }

    #slideshow .controls {
        bottom: 25px;
        right: 10px;
        z-index: 9999;
        position: absolute;
        width: 100%;
        text-align: center;
    }

        #slideshow .controls a {
            font-size: 3px;
            line-height: 3px;
            margin: 2px;
            padding-left: 5px;
            padding-right: 5px;
            padding-top: 3px;
            padding-bottom: 3px;
            text-decoration: none;
            background: #fff;
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            border-radius: 100%;
        }

            #slideshow .controls a:first-child {
                background: #fff;
            }

            #slideshow .controls a.activeSlide {
                background: #eb2428;
            }

#slide1 {
}



/* -------------------------- Forms -------------------------- */

.box-form .col, .box-payment .col {
    padding-top: 5px;
    padding-bottom: 5px;
}

.box-form .lbl, .box-payment .lbl {
    text-align: right;
    padding-right: 15px;
    font-weight: bold;
}

.box-form .fld input,
.box-form .fld textarea,
.box-payment .fld input,
.box-payment .fld textarea{
    padding: 10px !important;
    box-sizing: border-box;
}



/* -------------------------- Custom Style Classes Go Here -------------------------- */


.left {
	float: left;
}
.right {
	float: right;
}
.box-translate {
    position: absolute;
    top: 20px;
    right: 180px;
}


/* Search Form */

.search-label {
    float: right;
    padding: 8px;
    width: 50px;
    height: 50px;
    font-size: 28px;
    line-height: 50px;
    line-height: normal;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    background: #005a93;
    cursor: pointer;
}

.search-container {
    display: block;
    position: fixed;
    top: 0; /* shift container downwards so the header is still visible when search is shown */
    left: 0; /* initially position search container out of view */
    z-index: -9;
    width: 100%;
    height: 0%;
    text-align: center;
    font: 16px OpenSansBold, sans-serif;
    background: rgba(0,0,0,0.8);
    opacity: 1;
    transition: .8s;
    /*-webkit-transform:   scale(.9) translate3d(-0, -50px, 0);
    transform:           scale(.9) translate3d(-0, -50px, 0);
    -webkit-transition:  -webkit-transform .5s, opacity .5s, left 0s .5s;
    transition:          transform .5s, opacity .5s, left 0s .5s;*/
}

    .search-container div {
        padding: 5px;
        color: #fff;
    }

    .search-container .search-box {
        position: relative;
        top: 25%;
        opacity: 0;
        /*-webkit-transform: translate3d(0, 50px, 0);
    		transform: translate3d(0, 50px, 0);*/
        -webkit-transition: all .5s 0s;
        transition: all .3s 0s;
    }

.search-field {
    padding: 10px;
    margin: 0 auto;
    border: none;
    outline: none;
    font-size: 60px;
    color: #000;
    background: #fff;
}

.opensearch {
    z-index: 9999;
}

    .opensearch .search-box {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: all .5s 0s;
        transition: all .3s 0s;
    }

.fixed-top-padding {
    padding-top: 182px;
}

.bg-gray {
    background-color: #e5e5e5;
}

.bg-blue {
    background-color: #0076c0;
}

.bg-page-hdr {
    position: absolute;
    z-index: 999;
    bottom: 0;
    width: 100%;
    padding-bottom: 30px;
}

    .bg-page-hdr h1 {
        font-size: 64px;
        font-weight: bold;
        line-height: 70px;
        text-transform: uppercase;
        color: #fff;
        text-align: center;
        text-shadow: 0 0 20px #000;
    }

* -------------------------- Product Elements -------------------------- */

/* Setting a height for product cards on the data view */
.dxdvItem,
.dxdvFlowItem {
    height: 380px;
}

/* Product Spotlight */
.product-spotlight-container H2 {
    font-size: 30px;
    line-height: 36px;
}

/* We use Display: Flex and adjust for these elements to position the content
 * and set an even vertical align for the buttons 
 */
.product-spotlight {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    height: 370px;
    text-align: center;
}

.product-spotlight img {
    width: 100%;
    padding: 10px;
    height: 200px !important;
    overflow: hidden !important;
}

.product-spotlight-title a:link,
.product-spotlight-title a:visited {
    font-family: "Encode Sans Compressed Semibold";
    font-size: 18px;
    line-height: normal;
}
.product-addinfo {
    width: 100%;
    font-size: 13px;
}

.product-spotlight-pricing {
    color: #343434;
    width: 100%;
    line-height: 16px;
}

.product-spotlight-link {
    align-self: flex-end;
}

/* Removing some styling to match the home page design */
.home-products .product-spotlight {
    background-color: #fff;
    border: none;
}

/* Product Option Dropdown */
.product-options {
    padding: 5px;
    background: #eee;
    border: 1px solid #9f9f9f;
}

/* Product Quantity Control */
.product-quantity {
    background: #eee;
    border: 1px solid #9f9f9f;
}

    .product-quantity .dxeSpinIncButton,
    .product-quantity .dxeSpinDecButton {
        padding: 3px;
        background: transparent;
        border: 1px solid #ccc;
    }

        .product-quantity .dxeSpinIncButton:hover,
        .product-quantity .dxeSpinDecButton:hover {
            background: #ccc;
        }

/* Pager Styles */
.dxdvPagerPanel {
    padding: 10px 0;
    background-color: #eee;
}

/* -------------------------- Cart Styles -------------------------- */
.btn-cart:link,
.btn-cart:visited {
	display: inline-block;
	padding: 10px;
	margin-bottom: 10px;
	text-align: center;
	font-size: 12px;
	border: none;
	line-height: normal !important;
	font-style: normal;
	-webkit-appearance: none;
   background-color: #6db23e;
   color: #fff;
   min-width: 150px;
}

.btn-cart:hover {
	 background-color: #89c860;
}

.box-cart-buttons {
    float: right;
    width: 50%;
    text-align: right;
}

.box-cart td {
    vertical-align: top;
    padding: 5px;
}

.cart-btn-delete,
.cart-tn-image,
.cart-desc {
    float: left;
}

.cart-tn-image {
    padding-right: 5px;
}

.box-order-info .lbl {
    width: 200px;
}

.box-order-info . col_left {
    padding-right: 30px;
}

.cart-subtext {
    min-height: 60px;
    font-size: 12px;
    line-height: 16px;
    font-style: italic;
    color: red;
}

.box-cart-totals {
    margin-right: 10px;
    max-width: 500px;
    float: right;
}

    .box-cart-totals .frm {
        width: 100%;
    }

    .box-cart-totals table.frm td.lbl {
        width: 65%;
        text-align: right;
    }

    .box-cart-totals table.frm td.fld {
        width: 35%;
        text-align: right;
    }

/* Cart Status Bar*/
.cart-status-bar {
	position: relative;
	width: 100%;
	height: 50px;
	overflow: hidden;
}
.status-bar-section {
	float: left;
	width: 33.3%;
	font-family: "Encode Sans Compressed Bold";
	line-height: 50px;
	text-align: center;
	vertical-align: middle;
	color: #fff;
	background-color: #0076c0;
}
.status-bar-text {
	position: relative;
	z-index: 1;
}
.status-bar-spacer {
	position: absolute;
	top: 3px;
	width: 48px;
	height: 48px;
	background-color: #0076c0;
	border-top: 5px solid #fff;
	border-right: 5px solid #fff;
	-ms-transform: rotate(45deg); /* IE 9 */
   -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
   transform: rotate(45deg);
}
.status-spacer-first {
	left: 30%;
}
.status-spacer-second {
	left: 63%;
}

.status-bar-active {
	background-color: #6eb33f;
}

table.frm td.lbl2 {
    width: 200px !important;
}

/* -------------------------- Forgot Password Styles -------------------------- */

.page-password {
	background-color: white;
}
.page-password .frm .lbl { 
	width: 100px;
}
.page-password .content { 
	padding: 20px;margin: auto;width: 500px;
}

    
/* -------------------------- Logo Scroll Styles -------------------------- */

.logo-scroll, .box-logo-scroll {
    position: relative;
    margin: 0 auto;
    top: 0px;
    left: 0px;
    width: 900px;
    height: 150px;
}

.box-logo-scroll {
    overflow: hidden;
}

.logo-scroll {
    visibility: hidden;
}

.box-logo-scroll img {
    max-width: 200px;
    height: auto;
    
}

 .box-logo-scroll img:hover {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7; /* FX/Opera/Safari/Chrome */    
 }

/* jssor slider arrow navigator skin 03 css */
/*
.jssora03l                  (normal)
.jssora03r                  (normal)
.jssora03l:hover            (normal mouseover)
.jssora03r:hover            (normal mouseover)
.jssora03l.jssora03ldn      (mousedown)
.jssora03r.jssora03rdn      (mousedown)
*/
.jssora03l, .jssora03r {
    display: block;
    position: absolute;
    /* size of arrow element */
    cursor: pointer;
    z-index: 999;
}

.jssora03l {
    background: url(../includes/logo-scroll/images/arrow-left.png) no-repeat;
    top: 0px;
    left: -50px;
    width: 25px;
    height: 69px;
}

.jssora03r {
    background: url(../includes/logo-scroll/images/arrow-right.png) no-repeat;
    top: 0px;
    right: -50px;
    width: 25px;
    height: 69px;
}

    .jssora03l:hover,
    .jssora03r:hover,
    .jssora03l.jssora03ldn,
    .jssora03r.jssora03rdn {
        filter: alpha(opacity=70);
        -moz-opacity: 0.7;
        opacity: 0.7; /* FX/Opera/Safari/Chrome */
    }

/* max-width: 1080px */

@media (max-width: 1080px) {
    .jssora03l, .jssora03r {
        display: none;
    }
}

/* -------------------------- Link Scroll Styles -------------------------- */
.marquee {
    height: 50px;
    overflow: hidden;
    position: relative;
}

.marquee p {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    line-height: 50px;
    text-align: center;
    /* Starting position */
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    /* Apply animation to this element */
    -moz-animation: scroll-left 20s linear infinite;
    -webkit-animation: scroll-left 20s linear infinite;
    animation: scroll-left 20s linear infinite;
    font-size: 18px;
}

/* Move it (define the animation) */
@-moz-keyframes scroll-left {
    0% {
        -moz-transform: translateX(100%);
    }

    100% {
        -moz-transform: translateX(-100%);
    }
}

@-webkit-keyframes scroll-left {
    0% {
        -webkit-transform: translateX(100%);
    }

    100% {
        -webkit-transform: translateX(-100%);
    }
}

@keyframes scroll-left {
    0% {
        -moz-transform: translateX(100%); /* Browser bug fix */
        -webkit-transform: translateX(100%); /* Browser bug fix */
        transform: translateX(100%);
    }

    100% {
        -moz-transform: translateX(-100%); /* Browser bug fix */
        -webkit-transform: translateX(-100%); /* Browser bug fix */
        transform: translateX(-100%);
    }
}

/* -------------------------- Newsletter Form -------------------------- */
.box-newsletter-form label {
	display: block;
	padding: 5px 0 0 0;
}
.box-newsletter-form input[type="text"],
.box-newsletter-form input[type="email"],
.box-newsletter-form input[type="tel"] {
	width: 100%;
	padding: 10px !important;
	box-sizing: border-box;
	border: 1px solid #656565;
}
.box-newsletter-form .ctct-form-listitem label {
	display: inline;
	padding: 0;
}
.box-newsletter-form button {
	padding: 15px;
	min-width: 200px;
	text-align: center;
	font-size: 18px;
	margin-top: 10px;
	border: none;
	line-height: normal !important;
	font-style: normal;
	-webkit-appearance: none;
	display: inline-block;
	background-color: #6eb33f;
	color: #fff;
}

    .box-newsletter-form button:hover {
        background-color: #80c454;
}

/* -------------------------- Simple Accordian Text Classes Go Here -------------------------- */
.accordion-toggle {
	cursor: pointer;
	padding: 15px 10px;
	margin-bottom: 0;
	background-color: #ddd;
	border-bottom: 1px solid #aaa;
	font-size: 18px;
	line-height: 24px;
	font-family: "Encode Sans Compressed Bold";
}
.accordion-toggle:hover {
	background-color: #7bb537;
	color: #fff;
}
.accordion-toggle:before {
	content: "+";
	padding-right: 10px;
}
.accordion-toggle:last-child {
	border-bottom: none;
}
.accordion-content {display: none;}
.accordion-content P {
	padding: 0 10px;
}
.accordion-content.default {display: block;}


/* -------------------------- Tool Tips -------------------------- */
a.tooltip {
    text-decoration: none;
    color: #3C3C3C;
}

    a.tooltip span {
        display: none;
        padding: 2px 3px;
        margin-left: 8px;
        width: 250px;
        text-decoration: none;
        font-style: normal;
        text-align: left;
    }

    a.tooltip:hover span {
        display: inline;
        position: absolute;
        background: #FFFFC1;
        border: 1px solid #ccc;
        color: #535353;
        text-decoration: none;
        font-style: normal;
        text-align: left;
    }

a.tooltip_img {
    text-decoration: none;
}

    a.tooltip_img span {
        display: none;
        padding: 2px 3px;
        margin-left: 8px;
        width: 250px;
        text-decoration: none;
        font-style: normal;
        text-align: left;
    }

    a.tooltip_img:hover span {
        display: inline;
        position: absolute;
        font-style: normal;
        text-align: left;
    }



/* -------------------------- Resize photogallery images -------------------------- */

.tn_resize {
    max-width: 100px;
    max-height: 80px;
}

.tn_resize_grid {
    max-width: 150px;
    max-height: 100px;
}

.img_resize {
    max-width: 500px;
    max-height: 400px;
}




/* -------------------------- TopAdminBar -------------------------- */

table.admin_hdr_bar {
    width: 100%;
    background-color: #1d4f98;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 999999;
}

    table.admin_hdr_bar td {
        color: #dcdcdc;
        padding: 3px;
    }

        table.admin_hdr_bar td a {
            color: #fff;
            font-weight: bold;
            text-decoration: none;
        }

            table.admin_hdr_bar td a:hover {
                font-weight: bold;
                text-decoration: underline;
            }
/* -------------------------- Dataview Heights -------------------------- */

.home-products [class*=dxdvFlowItemsContainer] {
    width: 100% !important;
}

.home-products [class*=dxdvFlowItemsContainer] > tbody > tr > td {
    text-align: center;
    display: flex !important;
    justify-content: space-between !important;
}

#div_featured_products .dxdvItem,
.dxdvFlowItem {
    height: 400px !important;
}

#div_featured_products .product-spotlight {
    height: 390px !important;
}

#div_new_products .dxdvItem,
.dxdvFlowItem {
    height: 400px !important;
}

#div_new_products .product-spotlight {
    height: 390px !important;
}

#div_store_products .dxdvItem,
.dxdvFlowItem {
    height: 400px !important;
}

#div_store_products .product-spotlight {
    height: 390px !important;
}

#div_category_products .dxdvItem,
.dxdvFlowItem {
    height: 300px !important;
}

#div_category_products .product-spotlight {
    height: 290px !important;
}

#div_category_categories .dxdvItem,
.dxdvFlowItem {
    height: 300px !important;
}

#div_category_categories .product-spotlight {
    height: 290px !important;
}

#div_recommended_products .dxdvItem,
.dxdvFlowItem {
    height: 400px !important;
}

#div_recommended_products .product-spotlight {
    height: 390px !important;
}


/* Doc Library */
.doclib_backlink {
    display: none;
}

/* Events */
.event-container {
    border-bottom: 1px solid #DEDEDE;
    padding: 5px;
    margin-bottom: 8px;
    width: 100%;
    box-shadow: 5px 5px 5px rgba(68, 68, 68, 0.6);
    border-left: 10px solid;
}

.event-month-container {
    padding-bottom: 15px;
}

.event-date {
    font-size: 0.75em;
}

.event-type-container {
    margin-bottom: 25px;
    border: 2px solid gray;
}

.guest-fld {
    margin-bottom: 10px;
}

.button-container {
    display: flex;
    justify-content: space-between;
}

.add-save-guest-btn {
    padding: 5px;
    min-width: 90px;
    font-size: 12px;
}

.event-registration-container {
    background: #DEDEDE;
    border: 1px solid #A8A8A8;
    width: 100%;
    min-height: 75px;
    padding: 5px;
    overflow: hidden;
    padding-bottom: 25px;
}

.event-date {
    font-size: 12px;
}

.event-type-checkboxlist {
    width: 100% !important;
}

.event-type-filter {
    font-size: 18px;
    font-weight: bold;
    color: white;
    background-color: #6EB33F;
    padding: 5px 0px 5px 15px;
}

.month-header {
    font-size: 18px;
    font-weight: bold;
    padding: 5px 0px 5px 15px;
    background-color: #6EB33F;
    color: white;
}

.upcoming-event-header {
    font-size: 18px;
    font-weight: bold;
    padding: 5px 0px 5px 15px;
    background-color: #6EB33F;
    color: white;
}

.event-square {
    display:inline-block;
    width: 10px;
    height: 10px;
    margin-right: 3px;
}
.event-square-large {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 5px;
}
.event-upcoming {
    padding: 7px;
}
.event-upcoming-link {
    vertical-align: top;
}

.event-details-title {
    color: #007AD0;
}

.event-details-date-container {
    color: #656565;
    font-size: 16px;
    padding: 10px 0px 10px 0px;
}

.event-details-address {
}

.event-details-gray-bold {
    color: #656565;
    font-size: 16px;
    padding: 10px 0px 10px 0px;
    font-weight: 600;
}