@charset "utf-8";
/* CSS Document */

.content-wrapper h1, .content-wrapper h2, .main-content-area h2 {
    padding: 1em 0;
    font-size: 26px;
    text-transform: uppercase;
    font-weight: 700;
    font-family: 'Roboto Condensed', Roboto, Arial, Helvetica, sans-serif;
    color: #333;
    line-height: 30px;
}

/*BP RED #c61818*/

body {
    font-family: Roboto, Arial, Helvetica, sans-serif;
    font-size: 13px;
    /* background:#000; */
    /* background:url(../images/bg.jpg) 50% top no-repeat #000; */
}

    body.bp-wide {
    /* background-image:
    url(../images/bg-short.jpg); */
    }
input, textarea  {font-family:Roboto, Arial, Helvetica, sans-serif; font-size:14px;}
select  {font-family:Roboto, Arial, Helvetica, sans-serif;}
a { cursor:pointer;}

input[type="color" i][list] {
    height:22px;
    display: inline-block;
    padding:0;
}
strong { font-weight:bold;}
em { font-style:italic;}
.wrapper {width: 996px;margin:0 auto;position: relative;clear: both;padding: 0 1em;}

textarea { resize:none;}

.header {/* margin-top: 1em; *//* background-color: beige; *//* border-bottom: solid 1px #ccc; *//* box-shadow: 0 2px 3px #666; */}

.header-wrapper {
    background: url(/images/layout/grip/foot-bg.png) repeat-x 50% 3% #222;
    width: 100%;
    min-width: 1024px;
    box-shadow: 3px 0 3px #333;
    padding: 1em 0 0.3em;
    /* position: fixed; */
    z-index: 10;
    /* top: 0; */
}

#dvBPLogo { float:left; width:532px;}
    #dvBPLogo h1 {
        position: absolute;
        font-size: 1.3em;
        text-transform: uppercase;
        font-weight: 600;
        line-height: 26px;
        color: #e6e6e6;
        font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    }

.mobile-menu {
    display:none;
}


#dvTopLinks {margin-left:532px;height:75px;/* border: solid 1px red; */}
#dvTopLinks a {color: #dcdcdc;text-decoration:none;text-align:center;display:block;} 
#dvTopLinks a:hover {color: #333;}
#dvTopLinks #dvTopLinkLists div { text-align:right; clear:right; font-size:11px; line-height:11px;  text-transform:uppercase;  }
#dvTopLinks #dvTopLinkLists ul {float:right;height:34px;/* background: rgb(0, 0, 0); */background: rgba(0, 0, 0, 0.3);/* margin-left: 3%; */}
#dvTopLinks #dvTopLinkLists div:first-child ul { margin-bottom:3px;}
#dvTopLinks #dvTopLinkLists ul:hover {background: #eee;opacity: 0.5;color: #333;}
    #dvTopLinks #dvTopLinkLists ul:hover li a {
        color: #333;
    }
#dvTopLinks #dvTopLinkLists ul li { float:left; text-align:center; border-left:solid 1px #999; padding:0; margin:11px 0; height:11px; overflow:visible;}
#dvTopLinks #dvTopLinkLists ul li:first-child { border:none;}
#dvTopLinks #dvTopLinkLists ul li a { display:block; float:left; padding:11px; margin:-11px 0;} 
#dvTopLinks #dvTopLinkLists ul li a:hover {text-decoration:underline;color: #333;}

#dvTopLinks #dvTopLinkLists { float:left; width:388px;}

#dvTopLinks #dvCart {float:left;margin:0 0 0 4px;height:72px;width: 72px;/* background: #eee; */background: rgba(0, 0, 0, 0.3);}
#dvTopLinks #dvCart:hover {background: #ddd;opacity: 0.7;}
#dvTopLinks #dvCart a {height:100%;  }
#dvTopLinks #dvCart a span { font-size:38px; font-weight:bold; display:block; }
#dvTopLinks #dvCart a span:first-child { font-size:11px; font-weight:bold; text-transform:uppercase; padding:12px 0 2px;}

#dvPrimaryNav {margin: 0.7em 0 0.5em;width: 996px;/* font-family: 'Roboto Condensed'; */}

#dvPrimaryNav ul {
    white-space:nowrap;
}
    #dvPrimaryNav li {
        /* float: left; */
        font-size: 1.1rem;
        padding: 0 0 0 1rem;
        margin: 0 0 .6rem 1rem;
        border-left: solid 2px #fff;
        height: 14px;
        overflow: visible;
        font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
        display: inline-block;
    } 
#dvPrimaryNav li a {display:block;/* text-shadow:1px 1px 1px #000; *//* margin:-2px 0; */text-decoration:none;color: #ececec;text-transform:uppercase;font-weight:normal;white-space: nowrap;}
#dvPrimaryNav li:first-child a { } 
#dvPrimaryNav li:first-child {border:none; padding-left:0; margin-left:0;}
#dvPrimaryNav li a span {/* font-size:17px; */font-weight:bold;}
#dvPrimaryNav li a:hover { opacity:.7; filter:alpha(opacity=70);}


.rail-wrapper {
    width: 250px;
}

.rail-wrapper.left {
    float: left;
    width: 250px;
    margin-right: 16px;
}

.rail-wrapper h2{
    font-size:18px
}

.content-with-rail {
    width: 700px;
    display: inline-block;
}

/*----------------------- HOME PAGE HERO --------------------------------------------------*/
#dvHomeSlides { height:323px; width:754px; border-bottom:solid 4px #000; overflow:hidden;}
#dvHomeSlides.pageHero {height:250px;}
#dvHomeSlides #ulHomeSlides  { height:323px; width:754px;}
#dvHomeSlides #ulHomeSlides .home-slide { height:323px; width:754px;}
li.slide-button a {display:block;width:10px;height:10px; background:#ccc;}
li.slide-button a:hover { background:#ddd;}
li.slide-button a.vis { background:#bbb; box-shadow: inset 0 0 3px #aaa;}
    #slideButtons {position:absolute;bottom:4px;right:4px;z-index:11;}
    #slideButtons li {float:left;margin-left:4px;}
/*----------------------- END HOME PAGE HERO --------------------------------------------------*/


.home-feature {padding-bottom: 2em;/* background:#fff; *//* margin-top: 16px; */margin-top: 2em;}
    .home-feature h2 {
    }

.pageContent {/* margin-bottom:2px; */min-height:400px;background:#fff;color:#333;/* padding:12px; */line-height:1.5em;font-size:13px;}
.pageContent a { color:#333;}
.pageContent ul {margin:16px;padding-left:16px;line-height:1.5em;list-style:disc outside;}
.pageContent ul li {  padding:0 0 0 .2em; margin:.5em;}
.pageContent ol { margin:16px; padding-left:16px; line-height:1.5em; list-style:decimal outside;}
.pageContent ol li { padding:0 0 0 .2em; margin:.5em;}

.sectionHeader { position:absolute; width:744px; text-align:right; margin-top:44px;}
.sectionHeader {color:#666; font-size:10px; text-align:right; }
.sectionHeader a { color:#666; text-decoration:none; }
.sectionHeader a:hover { text-decoration:underline;}


.content-wrapper { /* width:754px; */
    background: #fff;
    font-size: 14px;
}
body.bp-wide .content-wrapper {/* width:996px; */background:transparent;}
.main-content {width: 996px;/* float:left; */background:#fff;/* min-height: 400px; */margin: 0 auto;}
.full-content {width:996px;margin: 0 auto;}
body.bp-wide .main-content {width:996px;}

.bottom-padding {
    padding-bottom:2em;
}

.main-content-area {
    background: #fff;
    color: #333; /* margin:0 24px 1em; */ /* min-height: 450px; */ /* padding: 2em 1em; */
    position: relative;
}
.main-content-area .content {}

.full-content .main-content-area {background:#fff;color:#333;padding:0 24px 1em;/* margin:0 */}

.main-content-area a { color:#333;}
.main-content-area.transparent {background:transparent;}
.main-content-area p { line-height:1.5em;font-size:14px; margin:1em 0;}
.main-content-area table.data-table { margin:1em auto; line-height:1.5em;font-size:14px;}
.main-content-area table.data-table td { padding:2px 4px;}
.main-content-area table.data-table tr:nth-child(even) { background:#eee;}
.main-content-area table.data-table tr:nth-child(odd) { background:#ddd;}
.main-content-area table.data-table tr.data-table-footer, .main-content-area table.data-table tr.data-table-footer table tr { background:none;}
.main-content-area p.additional-info { font-size:11px; font-style:italic; color:#666;}

.main-content-area h4, .bp-cart-contents .bp-cart-header {line-height: 22px;margin: .5em 0 .2em;padding:6px 12px;/* height:16px; */font-size:16px;background: url(../images/template/hash.png) left 50% #fff;color:#333;border-radius:6px;}
.main-content-area h5 {  font-weight:bold; margin:1em 0 .2em;}

.main-content-area h3, .pageContent h3 {font-size:16px;padding:12px 12px 10px;background-color:#eee;color:#333;font-weight:bold;margin:1em -13px;border-radius: 3px;line-height: 24px;clear: both;}
.main-content-area ul {margin:16px;padding-left:16px;line-height:1.5em;list-style:disc outside;}
.main-content-area ul li {/* padding:0 0 0 .2em; *//* margin: .5em 0 2em; *//* height: 400px; */}
.main-content-area ol { margin:16px; padding-left:16px; line-height:1.5em; list-style:decimal outside ;}
.main-content-area ol li { padding:0 0 0 .2em; margin:.5em;}

.main-content-area ul.radio-list  li { float:left; list-style:none;}

.main-content-area {/* padding-bottom:1px; */}

/*.main-content-area .gift-certificate { background:#000; color:#fff; width:530px; margin:1em auto; padding:10px 10px 0;}
.main-content-area .gift-certificate input, .main-content-area .gift-certificate textarea { border:none; padding:10px;}
.main-content-area .gift-certificate .form-entry { margin:1em 0; } 
.main-content-area .gift-certificate .form-entry input[type="text"] { width:506px;}
.main-content-area .gift-certificate .form-entry textarea { width:506px;}
.main-content-area .form-entry.gift-certificate-value { width:550px; margin:auto;}*/

.main-content-area ol.auto-gen-steps {
	    counter-reset: item;
		list-style:none;
}

.main-content-area ol.auto-gen-steps li::before{
	counter-increment: item;
    content: counter(item);
    margin: 0 .5em 0 -2em;
    background: #333;
    color: #fff;
	
    width: 2em;
    height: 2em;
    display: inline-block;
    line-height: 2em;
    text-align: center;
    border-radius: 1em;
    font-weight: bold;
}

.gc-hero-text > h1 {
    color: #eee;
    font-size: 39px;
    line-height: 39px;
    padding: 20px 25px;
    text-transform: uppercase;
    width: 200px;
}

.form-entry.single-line input[type="checkbox"] {
    float: left;
    margin: 0 4px 0 0;
}

.main-content-area .form-entry.small-field input[type="text"] {
    width: 100px;
    float:right;
}

.main-content-area .form-entry.small-field select {
    width: 110px;
    height:27px;
    float:right;
}

.main-content-area .form-entry.shift-right label
{
    float:left;
}

.main-content-area .form { /*width:360px; */ margin:0 auto;}

.main-content-area .form-entry label {
    display: block;
}

.main-content-area .form-entry label, .main-content-area .form-label-link {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: .5em;
}
.main-content-area .form-label-link {
    text-decoration: underline;
    cursor:pointer;
}
    .main-content-area .form-entry { margin:1em 0; /*padding:0 12px;*/ }
    .main-content-area .form-entry input[type="text"], .main-content-area .form-entry input[type="password"], .main-content-area .form-entry textarea, .main-content-area .form-entry select {
        padding: 4px;
        border: solid 1px #ccc;
    }
    .main-content-area .form-entry input[type="text"], .main-content-area .form-entry input[type="password"], .main-content-area .form-entry select {
        height: 22px;
        box-sizing: content-box;
    }
    .main-content-area .form-entry input[type="text"], .main-content-area .form-entry input[type="password"], .main-content-area .form-entry textarea {
        width: 300px;
    }
        .main-content-area .form-entry textarea:focus, .main-content-area .form-entry input:focus {
            box-shadow: inset 0px 0px 5px #ccc;
        }
    .main-content-area .form-entry p {
        line-height: 1.5em;
        font-size: 14px;
        margin: 0.1em 0 1em;
        color:#666;
    }

.main-content-area .invalid, .main-content-area a.invalid {
    background-color: #c61818;
    color: #ffcccc;
    line-height: 30px;
    padding: 5px;
}

.main-content-area .form-entry .form-cb > label {
    display: inline;
}

.main-content-area .small-form {width:300px;max-width: 100%;margin:auto;} 
.main-content-area .small-form input[type="text"], .main-content-area .small-form input[type="password"] {width: 260px;}


/*.standard-button-list { text-align:right; margin:1em 0 .1em; clear:right; height:36px; font-size:11px; line-height:14px; text-transform:uppercase;  }
.standard-button-list ul {float:right; height:30px; padding:0; margin:0; list-style:none; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 0.7);  }
.standard-button-list ul:hover {background: rgba(0, 0, 0, 0.9);}
.standard-button-list div:first-child ul { margin-bottom:3px;}
.standard-button-list ul li { float:left; text-align:center; border-left:solid 1px #666; padding:0 0 0 2px; margin:8px 0; height:11px; overflow:visible;}
.standard-button-list ul li:first-child { border:none;}
.standard-button-list ul li a, .standard-button-list ul li input { width: 0;  overflow: visible;width:auto; text-align:right; cursor:pointer; height:24px; text-decoration:none; float:left; padding:7px 10px; margin:-8px 0;  line-height:14px; font-size:11px; -moz-box-sizing:border-box;  text-transform:uppercase; color:#999; background:none; border:none;} 
.standard-button-list ul li a { }
:-moz-any(.standard-button-list ul li input) { margin-top:-9px !important;}
.standard-button-list ul li > :-moz-any(input) { margin-top:-9px !important;}
.standard-button-list ul li a:hover, .standard-button-list ul li input:hover { text-decoration:underline;}

.main-content-area .standard-button-list ul {float:right; margin-right:12px; background: rgb(0, 0, 0); background: rgba(0, 0, 0, 1);  }
.main-content-area .standard-button-list ul:hover {background: rgba(0, 0, 0, 0.8);}
.main-content-area .standard-button-list.action ul {background: rgb(200, 0, 0); background: rgba(200, 0, 0, 1);  }
.main-content-area .standard-button-list.action ul:hover {background: rgba(200, 0, 0, 0.8);}
.main-content-area .standard-button-list.action ul li a, .main-content-area .standard-button-list.action ul li input { color:#fff;}

.standard-button-list.left { clear:none;}
.standard-button-list.left ul { float:left;}

*/

.standard-button-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

    .standard-button-list input, .standard-button-list ul a, .standard-button, a.standard-button {
        display: inline-block;
        color: #fff;
        background-color: #5a554d;
        border: none;
        padding: 0 1em;
        border-radius: 2px;
        margin: 15px 4px;
        text-decoration: none;
        cursor: pointer;
        box-sizing: border-box;
        font-size: .85rem;
        line-height: 2.5em;
        border: solid 1px #5a554d;
    }

a#ctl00_ContentPlaceHolderFull_hlDesign {}

a#ctl00_ContentPlaceHolderFull_hlDesign {}

    .standard-button-list input:hover, .standard-button:hover,
    .standard-button-list input.secondary:hover, .standard-button.secondary:hover
    .standard-button-list a.secondary:hover,.standard-button-list ul a:hover {
        background-color: #393631;
        color: #fff;
    }

    .standard-button-list input.secondary, .standard-button.secondary {
        background-color: #fff;
        color: #5a554d;
        /* border: solid 1px #333; */
    }

.standard-button-list ul li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.main-content-area .formElement { margin:1em 0;}
.main-content-area .formElement label.standard { display:block; font-weight:bold; font-size:1em; margin:0 0 .5em;}


.footer { padding-top:4px;}

#dvFooterContent { clear:both;}
#dvFooterMain { float:left; width:754px; height:210px; background:#cc0000; color:#FFF; }
#dvFooterMain a { color:#FFF;}
#dvFooterMain ul { margin:12px  12px 12px 30px; min-height:130px;}
#dvFooterMain ul li {float:left; min-width:120px; padding-right:12px;}
#dvFooterMain ul li h4 { font-size:14px; font-weight:bold; margin:0 0 .3em;}
#dvFooterMain ul ul { margin:0; height:auto;}
#dvFooterMain ul ul li {float:none; font-size:11px; line-height:1.5em;}
#dvFooterMain ul ul li a { text-decoration:none;}
#dvFooterMain ul ul li a:hover { text-decoration:underline;}
#dvFooterMain ul ul li .bp-share { float:left; margin:10px 10px 0 0;}
#dvFooterMain p { margin:12px  12px 12px 30px; font-size:9px; font-weight:bold; text-transform:uppercase; line-height:1.5em;}

#dvFooterSecure { margin-left: 758px; width: 238px; height:210px; background:#FFF; color:#333;}
#dvFooterSecure h4 { padding:8px; font-size:14px; text-align:center;}
#dvFooterSecure p { margin:.5em 0; text-align:center;}

#dvFooterSecure .rail-social { padding-top:3px; }
#dvFooterSecure .rail-social a:hover { opacity:.7; filter:alpha(opacity=70);}

.crumb-trail {color:#666;font-size:10px;text-align:right;padding:4px 12px;/* margin-top: 120px; */position: absolute;top: 0px;right: 0;}
.crumb-trail a { color:#666; text-decoration:none; }
.crumb-trail a:hover { text-decoration:underline;}
    .crumb-trail > span {
        overflow:hidden;
    }




.alpha70 {
/* Fallback for web browsers that doesn't support RGBa
background: rgb(0, 0, 0) transparent; */
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.7);
/* For IE 5.5 - 7
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);*/
/* For IE 8
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000)";*/
}

/*--#dvDeckDisplay---------------------------------------------*/
/*--lucas edit 1-------------------------------------------*/
#dvDeckDisplay #dvShopDecks ul li {padding:0; margin:0;}
.main-content-area #dvDeckDisplay {border:solid 1px #fff; position:relative; overflow:visible; height:250px !important; margin-left:-21px;}
.main-content-area #dvDeckDisplay #dvShopDecks {position:relative; height:250px; width:700px; background-color:transparent; margin:0 0; padding:0 30px; overflow:hidden;}
/*.main-content-area #dvDeckDisplay #dvShopDecks.over {margin:-90px 30px; padding:90px 0px; top:-71px;}*/
.main-content-area #dvDeckDisplay #dvShopDecks.over {margin:0 30px;padding:90px 0; top:-90px;}
.main-content-area #dvDeckDisplay #dvShopDecks ul { position:absolute; list-style:none;height:250px; border:solid 0 orange; }
.main-content-area #dvDeckDisplay #dvShopDecks ul li {height:250px; width:68px; padding:0; float:left; border:solid 0 green;}
.main-content-area #dvDeckDisplay #dvShopDecks ul li .productTN { border:none !important;}
.main-content-area #dvDeckDisplay #dvShopDecks ul li .lgDisplay 
    { background:#fff; padding:2px 10px; width:108px; z-index:230; margin:-90px -24px;
      -moz-box-shadow:#333 2px 2px 4px;
      -webkit-box-shadow:#333 2px 2px 4px;
      box-shadow:#333 2px 2px 4px;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      border:solid 1px #ccc;
      }
.main-content-area #dvDeckDisplay #dvShopDecks ul li .lgDisplay .deckInfo 
    {position:absolute; left:0px; bottom:50px; padding:10px; background:#333; color:#fff; 
     -moz-box-shadow:#333 0px 2px 3px; 
     -webkit-box-shadow:#333 0px 2px 3px; 
     box-shadow:#333 0px 2px 3px;opacity:0.9;filter:alpha(opacity=90); width:108px;
     font-size: 12px}
.main-content-area #dvDeckDisplay #dvShopDecks ul li .lgDisplay .deckInfo a {color:#fff; text-decoration:none;}
.main-content-area #dvDeckDisplay #dvShopDecks ul li .lgDisplay .deckInfo a:hover { text-decoration:underline !important;}
.main-content-area #dvDeckDisplay #dvShopDecks ul li .lgDisplay .shopInfo {position:absolute; margin-top:300px;}
.main-content-area #dvDeckDisplay .shiftBtn {position:absolute; top:70px; z-index:3; }

.main-content-area #dvDeckDisplay .shiftBtn a {padding:0; cursor:pointer; height:80px; width:44px; display:block; }
.main-content-area #dvDeckDisplay #dvNextBtn {margin-left:710px; }
.main-content-area #dvDeckDisplay #dvPrevBtn {margin-left:-8px; }
.main-content-area #dvDeckDisplay #dvNextBtn a {background:url(/images/template/arrow-right.png);}
.main-content-area #dvDeckDisplay #dvPrevBtn a {background:url(/images/template/arrow-left.png);}
/*--/#dvDeckDisplay---------------------------------------------*/

.clear { float:none; clear:both;}


/* clearfix --------------------------------------------------------------------------------------------------------*/

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}


.main-content-area:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.main-content-area {
	display: inline-block;
}
 
html[xmlns] .main-content-area {
	display: block;
}
 
* html .main-content-area {
	height: 1%;
}
/* ----------------------STYLES FOR Right Rail Callouts ---------------------------------*/
.rail-content .rightSideBar 
    {
        padding-bottom:15px !important;
    }
    .rail-content .rightSideBar li 
    {
        padding-left:23px;
        line-height:125%;          
    }
   .rail-content .rightSideBar li  a
    {
        color:#FFF;
    }
/* ----------------------END STYLES FOR Right Rail Callouts ---------------------------------*/


/* ----------------------STYLES FOR DIALOG ---------------------------------*/
.dialog-container {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 100;
}

.dialog-container[aria-hidden='true'] {
    display: none;
}

.dialog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(43, 46, 56, 0.9);
    animation: fade-in 200ms both;
}

.dialog-wrapper {
    background-color: rgb(255, 255, 255);
    margin: auto;
    z-index: 2;
    position: relative;
    animation: fade-in 400ms 200ms both, slide-up 400ms 200ms both;
    padding: 1em;
    max-width: 90%;
    width: 600px;
    border-radius: 2px;
}
.dialog-wrapper.gift-certificate {
    padding:1em 3em
}
.dialog-wrapper.gift-certificate a {
    color:inherit;
}
.dialog-wrapper.gift-certificate p {
    font-size:1.2em;
    line-height:1.5em;
    margin-bottom:1em
}
.dialog-wrapper.gift-certificate p.notice {
    font-size:1em;
    font-style: italic;
}

@media screen and (min-width: 700px) {
    .dialog-wrapper {
        padding: 1em;
    }
}

.dialog-content {
    overflow: auto;
}

@keyframes fade-in {
    from {
        opacity: 0;
    }
}

@keyframes slide-up {
    from {
        transform: translateY(10%);
    }
}



.dialog-close {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    border: 0;
    padding: 0;
    background-color: transparent;
    font-weight: bold;
    font-size: 2.25em;
    width: 1.2rem;
    height: 1.2rem;
    line-height: 1.2rem;
    text-align: center;
    cursor: pointer;
    transition: 0.15s;
}

@media screen and (min-width: 700px) {
    .dialog-close {
        top: 1rem;
        right: 1rem;
    }
}

/* ----------------------END STYLES FOR DIALOG ---------------------------------*/


/* ----------------------STYLES FOR PRODUCT COMPONENT SELECTION CONTROL ---------------------------------*/
#addComplete {
    margin-bottom:2em;
}
#addComplete a.simple {
    text-align: right;
    display: block;
    margin: -0.75em 0 0.5em;
}

    #addComplete a.standard-button {
        width: calc(100%);
        margin: 0 0 1em;
        position: relative;
        padding-left: 3em;
        
        border: none;
    }

        #addComplete a.standard-button::before {
            content: '+';
            position: absolute;
            margin-right: 0.75em;
            background: #78726a;
            left: 0;
            width: 2.5em;
            text-align: center;
            font-weight: bold;
            color: #fff;
            border-radius: 2px 0 0 2px;
        }

    #addComplete a.standard-button span {
        float: right;
    }

    #addComplete a.standard-button.options {
        margin-top: .5em;
        background: #fff;
        color: #333;
        border: none;
    }
        #addComplete a.standard-button.options:hover::before {
            background: #5a554d;
        }

        #addComplete a.standard-button.secondary {
            background-color: #cecbc7;
            color: #5a554d;
        }

}

.accessory-popup {
    position: fixed;
}

.full-content-area .dialog-content h3 {
    margin: 1em;
}

.accessory-list {
    display: flex;
    flex-wrap: wrap;
    max-height: calc(100vh - 10em);
    scrollbar-color: #f6f5f2 white;
    scrollbar-width: thin;
    padding: 0 .5em;
}

    /* WebKit and Chromiums */
    .accessory-list::-webkit-scrollbar {
        width: 8px;
        height: 8px;
        background-color: white;
        margin-left: .25em;
    }

    .accessory-list::-webkit-scrollbar-thumb {
        background: #f6f5f2;
        border-radius: 5px;
    }

    .accessory-list .accessory-item {
        border-top: solid 1px #dedcd6;
        margin: 0;
        padding: 1em;
        flex: 1 1 100%;
        display: flex;
    }

        .accessory-list .accessory-item:first-child {
            border: none;
        }

        .accessory-list .accessory-item:hover {
            background-color: #f6f5f2;
            cursor: pointer;
        }

        .accessory-list .accessory-item .accessory-name {
            display: inline-block;
            vertical-align: top;
            font-weight: bold;
            display: block;
            margin-bottom: .5em;
        }

        .accessory-list .accessory-item .accessory-image {
            height: 150px;
            width: 150px;
            flex-grow: 0;
            flex-shrink: 0;
            max-width: 25vw;
            max-height: 25vw;
            display: flex;
            justify-content: center;
            justify-items: center;
            align-items: center;
            background: #fff;
        }

            .accessory-list .accessory-item .accessory-image img {
                /* width: 100%; */
                width: auto;
                max-width: 100%;
                display: inline-block;
                max-height: 100%;
            }

        .accessory-list .accessory-item .accessory-info {
            flex-grow: 1;
            padding: 1em 1em 1em 2em;
        }

        .accessory-list .accessory-item img.accessory-brand-image {
            height: 40px;
            display: block;
            margin-top: 1em;
        }

.selected-item-list .standard-button {
    margin-top: 1em;
}

.selected-item {
    border-top: solid 1px #666;
    display: flex;
    flex-direction: row;
    padding: .75em .5em;
}

    .selected-item:first-child {
        border: none;
    }

    .selected-item:hover {
    }

.item-image {
    height: 60px;
    position: relative;
    background: #fff;
    flex-basis: 60px;
    flex-grow: 0;
    flex-shrink: 0;
}

.selected-item .item-image img {
    /* width: 50px; */
    display: block;
    /* margin: 4px; */
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.item-info {
    flex-grow: 1;
    /* width: calc(80% - 90px); */
    padding: 0 0 0 1em;
    line-height: 1.15em;
}

    .item-info > div {
        /* border-bottom: solid 1px #666; */
        display: flex;
        flex-direction: row;
        /* padding: 0.75em 0.5em; */
    }

    .item-info .item-type {
        font-weight: bold;
        text-transform: uppercase;
        font-size: .85em;
        line-height: 1.5em;
    }

.item-details {
    flex-grow: 1;
    width: 100%;
    padding-right: 0.5em;
}

.item-action {
    width: 6.5em;
    text-align: right;
    white-space: nowrap;
    padding-top: .25em;
}

    .item-action a {
        background: #78726a;
        color: #fff;
        padding: 0.25em 0.5em;
        border-radius: 2px;
        display: inline-block;
        margin-bottom: 0.5em;
    }

        .item-action a:hover {
            opacity: .9;
        }

.item-grip-callout {
}

    .item-grip-callout a.button {
        margin: 0.5em 0 0;
        line-height: 2em;
        background: #cc0000;
        border: none;
        width: 100%;
        text-align: center;
    }

    .item-grip-callout a.callout {
        margin: 1em 0 .5em;
        line-height: 2em;
        background: #f7f5f3;
        border: none;
        /* width: 100%; */
        color: #5a554d;
        /* text-align: center; */
        text-decoration: none;
        padding: 1em;
        /* margin: 0.5em -1em 0; */
        display: block;
        border-radius: 2px;
        /* border: solid 1px #dfd3c1; */
    }

        .item-grip-callout a.callout h4 {
            /* font-weight: bold; */
            background: #78726a;
            padding: 0 .5em;
            color: #fff;
            margin: 0 0 .5em;
        }

            .item-grip-callout a.callout h4 span {
                float: right;
            }

        .item-grip-callout a.callout p {
            line-height: 1.5em;
        }

            .item-grip-callout a.callout p span {
                text-decoration: underline;
            }

        .item-grip-callout a.callout:hover {
            box-shadow: 0 3px 5px 0 rgb(183 174 171 / 50%), 0 0 9px 0 rgb(183 174 171 / 20%);
        }

            .item-grip-callout a.callout:hover h4 {
                font-weight: bold;
            }

.completes-out {
    padding: 8px 0 0;
    color: #c61818;
}

/* ----------------------STYLES FOR PRODUCT COMPONENT SELECTION CONTROL ---------------------------------*/

/* ---------------------- STYLES FOR UCProductDetail.ASCX ---------------------------- */
.product-detail .crumb-trail {
    position: relative;
    padding: 0;
}
.pageContent {
    color: #666666; /* padding: 0px 0px 0px 9px; */
}
.pageContent p {/* font-size: 13px; *//* margin-bottom: 1em; */}
#deckDisplay {position:relative;width:300px;height:400px;left:20px;border:1px solid #A0A0A0;border-radius:10px; -moz-border-radius:10px;display:block;text-align:center;}
.deck-preview a.magnifyicon {
    position: absolute;
    right: 0.5em;
    bottom: 0.5em;
    display: block;
    width: 1.5em;
    height: 1.5em;
    background-image: url(/images/magnifyicon.png);
    z-index: 100;

}
.full-content-area h3 {
    font-size: 1.25em;
    font-weight: bold;
    color: #666666; /* text-shadow: 1px 1px #bebebe; */
    background: none; 
    margin: 1.5em 0px .5em 0px;
    padding: 0px;
    height: auto;
    line-height: normal;
}
.product-detail div.price {
    font-size: 2em;
    color: #5a554d;
    font-weight: bold;
    line-height: 2.5rem;
}
.product-detail div.quantity {
    flex-shrink:0;
    position: relative;
}
.product-detail .quantity:hover::before {
    content: 'QTY';
    position: absolute;
    width: 100%;
    text-align: center;
    bottom: 101%;
    color: #ccc;
}
.product-detail div.quantity input {
    height: calc(2.5rem - 2px);
    text-align: center;
    font-size: 16px;
    color: #666666;
    padding: 0 0 0 1em;
    width: 2em;
    border-radius: 0.25em;
    border: solid 1px;
    box-sizing: content-box;
}

.product-detail .cart-sticky {
    position: sticky;
    background: #fff;
    top: 0;
    bottom: 0;
    z-index: 98;
    padding: 1em;
    box-shadow: 0 3px 3px #fff, 0 -3px 3px #fff;
    margin: 0 -1em 1em calc(45% - 1em);
}
.product-detail h1 {
    padding: 1em 0;
    font-size: 2em;
    line-height: 1em;
}
.product-detail .cart-bar {
    display: flex;
    column-gap: 1em;
}

    .product-detail .cart-bar .action {
        flex-grow: 1;
    }
        .product-detail .cart-bar .action a:hover {

        }
        .product-detail .cart-sticky .sub {
            text-align: right;
            font-size: 1.15em;
            margin-top: 1em;
        }
.product-detail .cart-sticky .sub a {
    text-align: center;
    display: inline-block;
    /* margin: 1em 0 0; */
    text-decoration: underline;
    /* padding: 0 .4em; */
}
    .product-detail .cart-sticky .sub a:not(:first-child)::before {
        content: '|';
        margin: 0 .4em 0 .2em;
        text-decoration: none;
        font-size: 1.1em;
    }

.product-detail textarea {
    padding: 0.25em 0.5em;
    width: calc(100% - 1em - 2px);
    box-sizing: content-box;
}

.product-detail textarea.autoresizing-vertical {
    height: 2em;
    line-height: 2em;
}

.product-detail select {
    width: calc(100% - 1em - 2px);
    line-height: 2em;
    height: 2.5em;
    padding: 0 0.5em;
    box-sizing: content-box;
}
    .product-detail select:first-child {
        margin-top: 1em;
    }

.product-detail .minicolors {
    width:100%;
}
    .product-detail .minicolors input {
        width: 100%;
        height: 2.5em;
        box-sizing: border-box;
        padding-left:3em;
    }

.product-detail .minicolors-theme-default .minicolors-swatch {
    height: calc(100% - 2px);
    left: 1px;
    top: 1px;
    width: 2.6em;
    cursor: pointer;
    border: none;
    border-radius: 2px 0 0 2px;
    overflow: hidden;
    border-right: solid 1px #bababa;
    bottom: 1px;
}

#rightBar div.deckInfo {
    margin-top: 28px; /* font-size:14px; */
}
#rightBar .message {max-width: 330px;}
div.deckInfo {
    line-height: 1.75em;
}
    div.deckInfo a {
        font-weight: bold;
    }
div.productInfo {
    line-height:1.75em;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 1em;
}
#bottomLeft {position:relative;margin-top: 20px;}
#bottomLeft h3 {margin-bottom: 8px;}
#addComplete {/* font-size:14px; */}
#addComplete div.panelComplete {margin-top:5px;}
#addComplete div.selectBox {width:260px;font-size:12px;background-color:#e6e6e6;border-radius:5px;-moz-border-radius:5px;padding:5px 50px 10px 20px;margin-bottom:7px;}
#addComplete div.selectBox a {position:relative;display:block;float:right;color:#a0a0a0;}
#addComplete div.selectBox select {width:inherit;/* font-size:14px; */color:#333333;}
#addComplete div.selectBox label {color: #848484;
font-size: 12px;
font-weight: bold;
padding-left: 5px;}
#bottomLeft div.socialMedia {width:inherit;height:20px;margin:8px 0px 25px 0px;}
#bottomLeft div.socialMedia iframe {float:left;}
#bottomLeft div.socialMedia iframe.twitter-share-button {padding:1px 5px 0 83px;}
#bottomLeft p.designDesc {margin-bottom: 8px;}

.pageContent ul.product-text-layers {
    margin: 2px;
    line-height: 1em;
}

.product-detail .flex-view {
    display: flex;
    padding:0;
}

.product-detail .col-image {
    width: 45%;
    position: relative;
    float: left;
}
.product-detail .image-area-sticky {
    position:sticky;
    top:0;
    padding:1em 0;
}

.col-image-info {
    float: left;
    clear: both;
    width: calc(45% - 2em);
}
.product-detail .col-info {
    margin-left: 45%;
    padding-bottom:1em;
}
.product-detail .col-details {
    width: 54%;
    padding: 0 0 1em;
    margin-left: 45%;
}

.product-detail .col-extra {
    margin-left:45%;
}

.product-detail .deck-preview {
    cursor: pointer;
    padding-top: 1px;
    position: relative;
    margin: 0 auto 1em;    
    width: 300px;
    overflow: hidden;
    border-radius: 1em;
}
.product-detail.personalized-product .deck-preview {
    min-height: 621px;
}

.product-detail h4.subhead {
    line-height: 2em;
    /* padding: 0 1em; */
    border-bottom: solid 2px;
    margin: 1.5em 0 1em;
    font-size: 1.1em;
}




/*Personlize & Background Detail*/

#dvNoTextMsg {
    padding: 10px;
}

#agDeckPreview {
    height: 540px;
    width: 365px;
}

    #agDeckPreview h2 {
        margin: 0 0 10px 0;
        font-size: 23px;
        color: #666666;
        text-shadow: 1px 1px #bebebe;
        line-height: 120%;
        height: auto;
        background: none;
    }

    #agDeckPreview span.price {
        font-size: 35px;
        color: #98e600;
        font-weight: bold;
        margin-bottom: 25px;
    }

    #agDeckPreview p {
        margin: 10px 0;
    }

    #agDeckPreview h3 {
        margin: 20px 0 10px; 
        font-size: 16px;
        font-weight: bold;
    }

#agDeckImage {
    width: 229px;
    margin: 0 auto;
    min-height: 200px;
    /*
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
        */
}

    #agDeckImage img {
        max-width: 100%;
    }

#agDeckInfo {
    width: 215px;
    float: left;
}

.bpPersonalizeLoading {
    background: url("/images/layout/opacity-pixel-60.png") 50% 50% repeat;
    height: 100%;
    width: 754px;
    margin: 0 0;
    position: absolute;
    z-index: 30000;
}

    .bpPersonalizeLoading div {
        text-align: center;
        display: block;
        margin: 200px auto 0;
        width: 300px;
        background-color: #FFF;
        border: solid 1px #CCC;
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        font-size: 14px;
        font-weight: bold;
    }

    .bpPersonalizeLoading img {
        text-align: center;
        display: block;
        margin: 5px auto 12px;
    }

.ag-form-wrapper {
    margin: 0 0 .5em 0;
}
.ag-cutomize-more {
    
}

.bg-detail #addComplete div.selectBox {
    padding: 5px 20px 10px 20px;
}

.bg-detail .form-ddl {
    height: 30px;
    width: 100%;
    padding: 5px;
}

.bg-detail textarea {
    width: 96%;
    padding: 5px;
}

.bg-detail .ag-bg-info {
    text-align: center;
}

    .bg-detail .ag-bg-info h4 {
        font-weight: bold;
    }

    .bg-detail .ag-bg-info p {
        font-style: italic;
        text-transform: capitalize;
        color: #AEAEAE;
        overflow-wrap: break-word;
        font-size: 10px;
        line-height: 15px;
        padding-top: 4px;
    }

.bg-detail input.color-picker {
    width: 70px;
    height: 24px;
}

.bg-detail .minicolors-theme-default .minicolors-input {
    padding-left: 2px;
}

.bg-detail .minicolors-theme-default .minicolors-swatch {
    width: 26px;
    height: 26px;
    right: -26px;
}


/* ---------------------- END OF STYLES FOR UCProductDetail.ASCX ---------------------------- */

/*------------------------STYLES for product-spec-list---------------------------------*/
.product-spec-list li {
    padding:0;
    list-style: none;
    margin: 0;
}
.product-spec-list li h4 {
    border-bottom: dashed 1px;
    border-top: solid 1px;
    margin: 2em 0 1em;
    padding: .25em 0 .25em;
    border-color: #b9ae9e;
    color: #7b7469;
    font-weight: 700;
    text-transform: uppercase;
    background:none;
    border-radius: 0;
}
.product-spec-list a span {
    position: absolute;
    transform: translate(-50%, 0);
    top: 0;
    left: 50%;
    /* width: 100%; */
    display: block;
    text-align: center;
    background: #ffffff;
    white-space: nowrap;
    /* margin: 2em 0 1em; */
    padding: 0 .25em;
    /* border-color: #b9ae9e; */
    color: #7b7469;
    font-weight: 700;
    text-transform: uppercase;
    font-size: .9em;
    /* height: 34px; */
    z-index: 10;
    line-height: .8em;
}
.product-spec-list a:hover span {
    color:#b9ae9e;
}

.main-content-area ul.product-spec-list, .main-content-area .product-spec-list ul {
    margin: 0;
    padding: 0;
}

    .main-content-area .product-spec-list ul li {
        margin: 1em 0;
        padding: 0;
    }

.product-spec-list li li {
    width: 100%;
    display: inline-block;
}

@media screen and (min-width: 429px) {
    .product-spec-list li li {
        width: 33%;
        display: inline-block;
    }
}

.product-spec-list a img {
    width: 100%;
    display: block;
    z-index: -2;
    vertical-align: middle;
    /* border: solid 1px green; */
    transition: transform 300ms ease-out;
}
.product-spec-list a:hover img {
    transform: scale(1.1);
}

.product-spec-list a {
    position: relative;
    display: block;
    /* height: 100%; */
    width: 100%;
    /* border: solid 1px red; */
    padding: 14px 0 0;
}

.product-spec-list li li a::before {content: "  ";border: solid 2px #b9ae9e;width: 80%;height: 10px;z-index: 10;display: block;text-align: center;margin: auto;border-bottom: 0;position: absolute;margin-top: .5em;left: 50%;transform: translate(-50%, 0);top: -2px;}

/* ---------------------- STYLES for product-spec --------------------------------*/

.product-specs * {
    box-sizing:border-box;
}
.product-specs p {

    margin-bottom: 1em;
}
.product-specs .full-width-cols .col-wide {
    padding: 1em 6em 1em 0;
}

.product-specs .top-info {
    margin-top: -3em;
}
.product-specs .full-width-cols #rightBar.col-wide {
    padding:1em;
    

}
.product-spec-image {
    text-align:center;
    position: relative;
    /* min-height: 100px; */
    margin-top: 48px;
}

#dvProductBottom {
    margin-bottom:50px;
    /* width: 300px; */
}
#dvProductCrosscut {
    margin-bottom: 60px;
    /* width: 300px; */
}
#dvProductCrosscut img {
    padding-top:10px
}
#dvProductProfile {
    margin-bottom: 3em;
    /* position: absolute; */
    /* top: 50%; */
    /* transform: translate(0,-133%) rotate(-90deg); */
}
.product-spec-image img {
    display: block;
    width: 276px;
    margin: auto;
}
#dvProductProfile.product-spec-image img {
    width:100%;
    
    min-width: 276px;
}


.product-spec-measurement {
    border: solid 2px #b9ae9e;
    position: absolute;
    border-radius: 2px;
    overflow: visible;
}
.product-spec-measurement.left, .product-spec-measurement.right {
    
    width:20px;
}
.product-spec-measurement.top, .product-spec-measurement.bottom {
    
height:20px;
    
/* text-align: center; */
}

.product-spec-measurement.left {

border-right: none;

left: 2%;
} 
.product-spec-measurement.right {
    
border-left:none;
    
right: 2%;
    
/* vertical-align: middle; */
}
.product-spec-measurement.bottom {
    
border-top:none;
    
bottom: -13px;
    
/* vertical-align: middle; */
}

.product-spec-measurement.left span {

    transform: translate(calc(-50% - 1px), -50%) rotate(-90deg);
} 
.product-spec-measurement.right span {
    
transform: translate( calc(50% + 1px ) , -50%) rotate(-90deg);
    
right: 0;
    
/* width: 100%; */
    
/* height: 100%; */
    
/* transform-origin: left; */
    
/* border: solid 1px red; */
}

.product-spec-measurement.bottom span {
    left:50%;
    /* bottom: -3em; */
    transform: translate(-50%, .25em);
} 
.product-spec-measurement span, .product-spec-orientation span {
    position: absolute;
    top:50%;
    display:block;
    background: #ffffff;
    padding: 0 6px;
    line-height: 16px;
    width: max-content;
    text-transform: uppercase;
    color: #b9ae9e;
    font-weight: 700;
}
.product-spec-image h4 {
    position: absolute;
    display:block;
    text-transform: uppercase;
    color: #767067;
    font-weight: 700;
    width:100%;
    top:-1em;
}
.product-spec-image h4 span {
    
    color: #e2d6c5;
}
#dvProductTypeLength {
    top: calc( var(--pt-scale) * 1px);
    height:calc((var(--pt-length) * var(--pt-scale) * (1px))) ;
}

#dvProductTypeWheelbase {
    top: calc( 
        (var(--pt-scale) * (1px)) 
      + (var(--pt-nose) * var(--pt-scale) * (1px)) 
      + (var(--pt-truck) * var(--pt-scale) * (1px)) 
      );
    height: calc( (var(--pt-wb) * var(--pt-scale) * (1px)) );
}

#dvProductTypeNose {
    top: calc( var(--pt-scale) * 1px);
    /* bottom: 550px; */
    height: calc( (var(--pt-nose) * var(--pt-scale) * (1px)) );
}
#dvProductTypeTail {
    /* bottom: calc( var(--pt-scale) * 1px); */
    /* bottom: 550px; */
    top: calc( 
        (var(--pt-scale) * (1px)) 
      + (var(--pt-nose) * var(--pt-scale) * (1px)) 
      + (var(--pt-truck) * var(--pt-scale) * (2px)) 
      + (var(--pt-wb) * var(--pt-scale) * (1px)) 
      );
    height: calc( (var(--pt-tail) * var(--pt-scale) * (1px)) );
}
#dvProductTypeProfile {
    /* left: 50%; */
    /* width: 98%; */
    /* transform: translateX(-50%); */
    /* top: -200px; */
}
.product-spec-orientation {
    
border-right: none;
    
border-left: none;
    
border-bottom-style: dotted;
    
position: absolute;
    
border: dotted 2px #b9ae9e;
    
position: absolute;
    
border-radius: 2px;
    
overflow: visible;
}

.product-spec-orientation.horizontal {
    border-top:none;
    border-left:none;
    border-right:none;
    height: 1.25em;
    left: 50%;
    width: 98%;
    transform: translateX(-50%);
}

.product-spec-orientation.vertical {
    border-top:none;
    border-left:none;
    border-right:none;
    height: 1.25em;
    width: calc((var(--pt-length) * var(--pt-scale) * (1px)));
    transform: rotate(270deg) translate(calc(-100% - .75em), 3em);
    transform-origin: left;
    position:absolute;
    left: 0;
    /* top: 0; */
}
.product-spec-orientation span {
    
transform: translate(0, 0.1em);
}
.product-spec-orientation span:first-child {
    left: -.5em;
}
.product-spec-orientation span:last-child {
    left:unset;
    right: -.5em;
    /* top: 2em; */
}


#dvProductTypeWidth {
    left: 50%;
    width: calc( var(--pt-scale) * var(--pt-width) * (1px) );
    transform: translateX(-50%);
    /* top: -200px; */
}

.product-specs {
    position:relative;
    
}

.product-specs h1{
    font-family: 'Roboto';
    font-size: 1.5em;
    padding: 0;
    margin-bottom: .5em;
    color: #7b7469;
    /* margin-top: -2em; */
}
#dvProductSpecs {
    border-radius:2px;
    padding: 0em 0 1em;
    margin-bottom: 3em;
    border-bottom: solid 1px #b9ae9e;
}
#dvProductSpecs h4 {
    border-bottom: dashed 1px;
    border-top: solid 1px;
    margin: 2em 0 1em;
    padding: .25em 0 .25em;
    border-color: #b9ae9e;
    color: #7b7469;
    font-weight: 700;
    text-transform: uppercase;
}
#dvProductSpecs h4:first-child {
    /* margin-top: 0; */
}
.product-spec-item {
    margin-bottom:1em

}
.product-spec-item label {width: 40%;display: block;text-align:right;padding-right: 1em;text-transform: uppercase;margin: 0;float: left;font-size: 12px;line-height: 1.75rem;}

.product-spec-item div {
    width: 60%;
    border-radius: 1px;
    display:inline-block;
    margin: 0;
    text-align: center;
    background: #f8f6f4;
    padding: .25rem .5em 0;
    line-height: 1.5rem;
    font-size: 1.15em;
    text-transform: lowercase;
    font-family: 'Special Elite', arial;
    }


    @media screen and (max-width: 428px) {
        .product-spec-item label {
            float:none;
            text-align:left;
            width:100%;

        }
        .product-spec-item div {
            width:100%
        }
    }
.product-spec-item.links div {
    font-family:inherit;
    font-size:1em;
    text-transform:none;
    
}

.pageContent ul.product-info-bullets {
    margin:3em 0;
}
.pageContent ul.product-info-bullets li {
    margin-bottom:1em;
}
.action-area a {
    display: block;
    background: #5a554d;
    color: #fff;
    text-align: center;
    text-decoration: none;
    border-radius: 2px;
    line-height: 2.5em;
    margin-bottom:1em;
}
.action-area a.secondary {
    background: #fff;
    color: #5a554d;
    border: solid 1px;
    }
.action-area.wide {
    text-align:center;
}
    .action-area.wide a {
        display: inline-block;
        width: 18em;
        margin: 1em 1em 0;
    }
.action-area a:hover {
    background-color:#393631;

}
.action-area a.secondary:hover {
    background-color: #f8f6f4;
}
/* ---------------------- END STYLES for product-spec --------------------------------*/

/* ----------------------  SITE-WIDE HASH BUTTON STYLES ------------------------ */
a.hash-button,div.hash-button
{    
    position:relative;  
    color:#FFF;
    text-transform:uppercase;
    font-weight:bold;
    text-align:center;
    border-radius:2px;
    -moz-border-radius:2px;
    display:block;
}

a.hash-button:link,a.hash-button:visited,a.hash-button:hover,a.hash-button:active 
{
    text-decoration:none;
}
a.hash-green {
    line-height: 2.5rem;
    background-color: #cc0000;
    font-size: 1.1rem;
    font-weight: bold;
    box-shadow: 0 3px 5px 0 rgb(183 174 171 / 50%), 0 0 9px 0 rgb(183 174 171 / 20%);
}
    a.hash-green:hover {
        background-color: #d61f2c;
        box-shadow: 0 4px 5px 0 rgb(183 174 171 / 50%), 0 0 11px 0 rgb(183 174 171 / 30%);
    }
a.hashGrey {
    line-height: 2.5em;
    background-color: #5a554d;
    font-size: 1.1rem;
    font-weight: bold;
    box-shadow: 0 3px 5px 0 rgb(183 174 171 / 50%), 0 0 9px 0 rgb(183 174 171 / 20%);
}
    a.hashGrey:hover {
        background-color: #706b63;
        box-shadow: 0 4px 5px 0 rgb(183 174 171 / 50%), 0 0 11px 0 rgb(183 174 171 / 30%);
    }
a.hashDisabled
{
    background-color:#E1E1E1;
    box-shadow: 1px 1px 1px #303030;  
    -webkit-box-shadow: 1px 1px 1px #303030;
    -moz-box-shadow: 1px 1px 1px #303030;    
}
a.hashDisabled:hover
{
    background-color:#E1E1E1;
    box-shadow: 1px 1px 1px #303030;  
    -webkit-box-shadow: 1px 1px 1px #303030;
    -moz-box-shadow: 1px 1px 1px #303030; 
    cursor:default;
       
}
a.hash-red
{       
    height:40px;  
    background-color:#cc0000;    
    font-size:18px;
    font-weight:bold;
    text-shadow: 1px 1px #c8c8c8;    
    box-shadow: 1px 1px 1px #3d4926;      
}
a.hash-red:hover 
{
    background-color:#e91c1c;
    -webkit-box-shadow: 0px 0px 6px 2px #d9d9d9;
    -moz-box-shadow: 0px 0px 6px 2px #d9d9d9;
    box-shadow: 0px 0px 6px 2px #d9d9d9;
}
/* ---------------------- END OF  SITE-WIDE HASH BUTTON STYLES ------------------------ */

/* ----------------------- STYLES FOR SEARCH BAR ----------------------------*/
#shopProductSearch {
    margin-bottom: 2em;
}
#shopProductSearch div.txtSizeSearch {/* float:right; */position: relative;}
#shopProductSearch div.txtSizeSearch input[type=text] {position:relative;width: 50%;font-size: 14px;color: #666;margin-right:10px;/* height: 30px; *//* border-radius: 3px; *//* border: solid 1px #666; */}     
#shopProductSearch.searchPage div.txtSizeSearch input[type=text] { position:relative; width:206px; font-size: 14px; color: #666; margin-right:10px; } 
#shopProductSearch div.searchMsg
    {
    position:absolute;
    margin-top:12px;
    font-weight: bold;
    color: #c61818;
    }
#shopProductSearch div.txtSizeSearch select,#shopProductSearch div.txtSizeSearch input,#shopProductSearch div.sortBy select
    {
        /* text-transform:none; */
        font-size:14px;
        height: 24px;
        border-radius: 3px;
        border: solid 1px #999;
        padding: 4px;
    }
#shopProductSearch div.txtSizeSearch select
    {
        /* width:190px; */
        /* margin-right:30px; */
        /* padding: 4px; */
        height: 34px;
    } 
#shopProductSearch div.sortBy
    {
        float: right;
    }
    #shopProductSearch a.hashGrey {
        width: auto;
        display: inline-block;
        margin-left: 11px;
        line-height: 34px;
        padding: 0 1em;
    }   
#shopFullList a.fullShopLnk
    {
        float:right;
        display:block;
        padding-right:35px;
        color:#CCC;
        text-shadow: 1px 1px 1px #666;
    }
ul.simplelistrr.button-list {
    text-align: center;
    list-style:none;
    margin:0 0 1em;
    padding:0;
}


.simplelistrr.button-list li {
    display: inline;
    margin:0;
    padding:0;
}

    .simplelistrr.button-list li a {
        display: inline-block;
        border: solid 1px;
        color: #333;
        background: #fff;
        border-radius: .15em;
        padding: 0 .5em;
        margin: 0 .25em .25em 0;
        line-height: 2em;
        text-decoration: none;
        font-size: 16px;
    }

    .simplelistrr.button-list li a:hover {
    background: #eee;
}
.simplelistrr.button-list li a.active {
    color:#fff;
    background:#333;
    cursor: default;
}

#shopDeckList {
    list-style-type: none;
    margin: 0;
    padding: 0
}

    #shopDeckList li.shop-deck-li {
        float: left;
        width: 200px;
        height: 382px;
        margin: 23px;
        padding: 0 0 10px;
        border: solid 1px #eee;
        border-radius: 3px;
    }

    #shopDeckList li.shop-deck-li h3 {
        margin: -1px -13px 18px;
    }
        #shopDeckList li.shop-deck-li img {
            max-width: 140px;
            height: 248px;
            margin: 0 auto;
            display: block;
        }

.shop-list-paging {
    float: right;
    margin-top: 20px;
}

.shop-deck-thumbnail {
    text-align: center;
    width: 158px;
    margin: 0 auto;
}

.main-content-area .shop-list-buttons ul {
    margin-left: 0;
    margin: 0 0;
    float: none;
}

/* -----------------------END OF STYLES FOR SEARCH BAR ----------------------------*/

/*-----------------------  STYLES FOR THE CHECKOUT PAGE ----------------------*/
.main-content-area.checkout .form-entry 
    { 
        margin:0.5em 0px !important;
        padding:0px 0px !important;
    }

.main-content-area.checkout p.SecureCheckout 
{
    font-size:12px;
    font-style:italic;
}

.main-content-area.checkout a.hash-green {
    margin-top: 25px;
    width: inherit;
    font-size: 1.5em;
    background: #2c2a27;
}
.main-content-area.checkout a.hash-green:hover {
    background: #000;
}
.main-content-area.checkout span.cartProdDesc
{
    display:block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width:inherit;
}

.main-content-area.checkout .form-entry span 
{
    color:Red;
    font-size:14px;
}
.main-content-area.checkout td.prodDesc 
{
    width:220px;
}
.main-content-area.checkout a.checkoutPaypalLnk
{
    margin: 20px 0 22px;
    display: block;
}
.main-content-area.checkout div.validationError ul li
{
    color:Red;
    padding:0px;
    margin:0px;
}
/*.main-content-area.checkout .form-entry input[type="text"].cardEntry
{
    width:259px;
}
.main-content-area.checkout .form-entry select.cardEntry 
{
    width:268px;
    height:28px;
}*/

/*.main-content-area.checkout .form-entry.cvv-code input[type="text"] 
{
    width:85px;
}*/

.main-content-area.checkout select, .main-content-area.checkout .form-entry input[type="text"] {
    height: 36px;
    font-size: 16px;
    padding: 0 4px;
    box-sizing: border-box;
    border: solid 1px #ccc;
}

.main-content-area.checkout .form-entry input[type="text"].standard {
    width:100%;
}
    .main-content-area.checkout select.standard, .main-content-area.checkout .form-entry.address-state select {
        width: 100%;
    }

.main-content-area.checkout .form-entry {
    width: 100%;
}


    .main-content-area.checkout .form-entry.address-1 {
        width: 64%;
        display: inline-block;
    }

    .main-content-area.checkout .form-entry.address-2 {
        width: 32%;
        float: right;
    }

    .main-content-area.checkout .form-entry.address-state {
        width: 46%;
        display: inline-block;
    }

    .main-content-area.checkout .form-entry.address-zip {
        width: 46%;
        float: right;
    }

    .main-content-area.checkout .form-entry.address-city {
        width: 48%;
        display: inline-block;
    }

    .main-content-area.checkout .address-state-zip {
        float: right;
        width: 48%;
    }

.main-content-area.checkout .form-entry.card-number {
    width: 48%;
    display: inline-block;
}

.main-content-area.checkout .card-exp-cvv {
    float: right;
    width: 48%;
}

.main-content-area.checkout .form-entry.exp-date {
    width: 52%;
    display: inline-block;
}

    .main-content-area.checkout .form-entry.exp-date select {
        width: 54px;
    }

.main-content-area.checkout .form-entry.cvv-code {
    width: 40%;
    float: right;
}

.main-content-area.checkout #securityScan {margin: 0 auto;width: 109px;}


.main-content-area.shop-checkout-wrapper {
    width: 996px;
    margin: 0 auto;
}

.shop-checkout-footer {
    padding: 12px;
    font-size: 12px;
    color: #adadad;
    line-height: 16px;
    border-top: solid 24px #000;
    text-align: center;
    background-color: #000;
}
    .shop-checkout-footer a {
        color: #adadad;
    }
.shop-checkout-header {
    color: #eee;
    font-size: 22px;
    margin: 0 auto;
    text-align: right;
    line-height: 55px;
    padding-right: 24px;
    background-color:#000;
}

.bp-checkout-contents {
    display: grid;
    grid-template-columns: repeat(24, 1fr);
}

.bp-checkout-left-col {
    grid-column: span 12;
}

.bp-checkout-right-col {
    grid-column: 15/span 10;
}

.main-content {
    padding: 0 1em;
}

.main-content-area.checkout h3 {
    margin: 1em -6px;
}

    .main-content-area.checkout h3 > span {
        float: right;
        font-size: 14px;
        font-weight: normal;
    }


.checkout hr {
    color: #ccc;
    margin: 16px 0;
}

.checkout .paypal-button {
    background: url('/images/paypal_logo.png') #fec539 49% 44% no-repeat;
    background-size: auto;
    background-size: 20%;
    width: 100%;
    display: block;
    padding: 15px 0 15px 49%;
    box-sizing: border-box;
    border-radius: 7px;
    box-shadow: 1px 1px 1px #3d4926;
    height: 40px;
}

    .checkout .paypal-button:hover {
        box-shadow: 0px 0px 6px 2px #d9d9d9;
    }

.ui-widget.xav-popup {
    max-width: 450px;
    font-family: inherit;
    padding: 20px 10px;
}

.xav-popup .ui-dialog-titlebar-close {
    display: none
}

.xav-popup .ui-widget-header {
    background: none;
    border: 0 transparent none;
}

.xav-popup a {
    text-decoration: underline;
    color: #877C6F;
    float: right;
}

.xav-popup input[type="radio"] {
    vertical-align: top;
    width: 20px;
}

.xav-popup .popup-address span {
    margin-left: 6px;
    display: inline-block;
}

.xav-popup strong {
    font-weight: normal;
    margin: 17px 0 5px;
    display: block;
}

.checkout-processing {
    margin-top: 25px;
    width: inherit;
    font-size: 1.5em;
    background: #2c2a27;
    display: block;
    position: relative;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    border-radius: 2px;
    line-height: 2.5rem;
    font-weight: bold;
    box-shadow: 0 3px 5px 0 rgb(183 174 171 / 50%), 0 0 9px 0 rgb(183 174 171 / 20%);
}

.checkout-error {
    width: 100%;
    display: block;
    border: solid 1px #ccc;
    padding: 20px;
    line-height: 23px;
    background: #f7e6e6;
    border-radius: 3px;
    box-sizing: border-box;
    margin-bottom: 20px;
}

.main-content-area.checkout a.hash-green.bitpay-button {
    background: url(/images/bitpay-logo.png) no-repeat #1a3b8b 50% 60%;
    background-size: 64px;
    height: 45px;
    margin-top: 16px
}

    .main-content-area.checkout a.hash-green.bitpay-button:hover {
        opacity: 0.9;
    }

/*----------------------- END OF STYLES FOR THE CHECKOUT PAGE ----------------------*/

/*-----------------------  STYLES FOR THE SHOP-PRODUCTS PAGE ----------------------*/ 
.main-content-area.shop-products span.stringCap { text-transform:capitalize; }
.main-content-area.shop-products a.hashGrey {
    width: 150px;
    font-size: 16px;
    float: right;
    margin: 0 1em 1em 0;
    }
.main-content-area.shop-products p.deckCount strong { font-size:16px;  }
.main-content-area.shop-products h3 span.shopTitle { display:block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width:370px; float:left; height:inherit;padding-top:2px;}
.main-content-area.shop-products h3 span.smallerTxt {font-weight:normal;font-size:12px;color:#333333;padding-top: 3px;} 
.main-content-area.shop-products h3 span.dateOpen { float:right; margin-right:20px; }
.main-content-area.shop-products h3 span.deckCount { float:left; }
.main-content-area.shop-products h3 {height: 26px;}

.shop-page-info .shop-page-image {
    max-width: 706px
}
.shop-pages-content-wrapper .shop-page-image {
    max-width: 97px
}

#giftCertificates .home-slide {
    background: url(/images/hpslides/skate-your-own-design.jpg) no-repeat 50% 6% #F99617;
    background-size: 996px;
    height: 270px;
}


/*----------------------- END OF STYLES FOR THE SHOP-PRODUCTS PAGE ----------------------*/
    /*-----------------------  STYLES FOR THE CART PAGE -------------------------------*/
.cart a.bp-button {
    position: relative;
    color: #FFF;
    text-decoration:none;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    border-radius: 2px;
    -moz-border-radius: 2px;
    display: inline-block;
    line-height: 2.5rem;
    background-color: #000;
    font-size: 1.1rem;
    font-weight: bold;
    box-shadow: 0 3px 5px 0 rgb(183 174 171 / 50%), 0 0 9px 0 rgb(183 174 171 / 20%);
}
.cart a.bp-button:hover {
    background-color: #d61f2c;
    box-shadow: 0 4px 5px 0 rgb(183 174 171 / 50%), 0 0 11px 0 rgb(183 174 171 / 30%);
}
    
    .cart .bp-button {
        width: 33%;
        display: inline-block;
    }
.cartButtons a.bp-button.secondary {
    background: none;
    text-decoration: underline;
    font-size: 1em;
    box-shadow: none;
    padding: 0;
    margin: 0 0 0.25em;
    color: #333;
}
.cartButtons:first-child {
    
}
.cartButtons {
    text-align: right;
    margin:1em 0;
}
    .cartButtons ul {
        padding:0;
        margin:0;
    list-style: none;

    }
    .cartButtons ul li {
        text-align: right;
    padding: 0;
    margin: 0;
    }
.main-content-area.cart div.cartRefId 
{
    color:#333;
}
.main-content-area.cart .bp-cart-contents .bp-cart-header {
    margin-top:-.5em;
}
.main-content-area.cart div.couponCode {
    margin-top: 0px;
}
.main-content-area.cart div.hash-button
{
    width:300px;
}
.main-content-area.cart span.cartUpdated 
{
    min-width: 280px;
    text-transform:none;
    text-align:left;
    padding-left:12px;
    height:25px;
    padding-top:7px;
    font-weight:normal;
    font-size:16px;
    text-shadow: 1px 1px #acacac;
    box-shadow: 1px 1px 1px #303030;
    border-radius:7px;
    -moz-border-radius:7px;
    margin-top:6px;
    /* margin-left:-12px; */
    float:left;
    background: url(/images/template/hash.png) left 50% white;
    color: #333333;
}
.main-content-area.cart td {vertical-align:top !important;}
.main-content-area.cart table.tablePrice td {padding-bottom:10px;}
.main-content-area.cart table td.itemDesc {line-height:130%;}
.main-content-area.cart table.tblItemList td {padding-top:10px;padding-bottom:10px;}


ul.bp-cart-contents {
    margin: 0 0 1em;
    padding: 0;
    list-style: none;
    border-bottom:solid 1px #eee;
}

    ul.bp-cart-contents li {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        padding: 0.5em 0;
        margin: 0;
    }

    .bp-cart-contents li.bp-cart-item {
        border-bottom: solid 1px #eee;
        padding: 1em 0;
        margin: 0;
    }

.bp-cart-item-tn {
    grid-column: span 2;
    text-align: center;
    margin-right:1em;
}

    .bp-cart-item-tn input, .bp-cart-item-tn img {
        max-width: 70px;
        max-height: 150px;
    }

.bp-cart-item-desc {
    grid-column: span 6;
    font-size:0.93em;
}

    .bp-cart-item-desc strong {
        font-size: 1rem
    }
.bp-cart-product-type-name {
    font-size:1rem;
    margin-bottom:.5em;
}

.bp-cart-item-options {
    margin: .5em 0;
}

.bp-cart-item-quantity {
    grid-column: 9 / span 2;
    text-align: center;
}

.bp-cart-item-total {
    grid-column: 11 / span 2;
    text-align: right;
    font-size: 1rem;
}

.bp-cart-summary-row {
    display: flex;
    border-bottom:solid 1px #eee;
    line-height:2em;
    font-size:1rem;
}

.bp-cart-checkout-sticky {
    /*
    position: sticky;
    bottom: 0;
    */
    background: #fff;
    padding: 1em 0 0;
}
/*
    .bp-cart-checkout-sticky::before {
        background: linear-gradient( 0deg, #fff, transparent);
        content: '';
        height: 1em;
        width: 100%;
        top: -1em;
        position: absolute;
    }
    */
li .bp-cart-footer-label {
    grid-column: span 10;
    text-align: right;
    width:auto;
}

.bp-cart-footer-label {
    width: 100%;
    flex-shrink: 1;
    font-weight: bold;
}
li .bp-cart-footer-total {
    grid-column: span 2;
    width: auto;
}
.bp-cart-footer-total {
    width:10em;
    text-align: right;
}

.bp-cart-info {
    clear: both;
    line-height: 20px;
    padding: 0 0 2em;
   /* max-width: 600px;
    margin-top: -6em;*/
    z-index: 300;
    position: relative;
}

@media screen and (max-width:480px) {
    .bp-cart-contents .bp-cart-header {
        display: none;
    }

    .bp-cart-item-tn {
        grid-column: span 5;
        text-align: center;
    }

    .bp-cart-item-desc {
        grid-column: span 7;
        margin-bottom: 1em;
    }

    .bp-cart-item-quantity {
        grid-column: 6 / span 4;
        text-align: left;
        margin-top: 4px;
    }

    .bp-cart-item-total {
        grid-column: 10 /span 3;
        text-align: right;
        margin-top: 24px;
    }

    .bp-cart-footer-label {
        grid-column: span 8;
        font-weight: bold;
        text-align: left;
    }

    .bp-cart-footer-total {
        grid-column: 10/ span 4;
        text-align: right;
    }
}


/*----------------------- END OF STYLES FOR THE CART PAGE -------------------------------*/   

/*----------------------- STYLES FOR LOGIN PAGE -------------------------------*/   

.fb-login::before {
    content: 'OR';
    /* width: 100%; */
    background: #fff;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 0;
    left: 50%;
    padding: .5em;
}

.fb-login {
    margin-top: 2em;
    padding: 2em 0 0;
    border-top: solid 1px;
    position: relative;
}
.fb-login-icon {
    /* float: Right; */
    margin: auto;
    display: block;
    /* margin-right: 5px; */
    width: 175px;
}

.forgot-password {
    line-height: 30px;
    padding-right:20px;
}
.main-content-area.login .col-wide {
    padding: 1em 6em;
    /* font-size: 16px; */
}
.main-content-area.login .small-form {
    padding:0;
    width: 100%;
}
.main-content-area.login ul.simplelist3 {
    margin-bottom:2em;
    font-size: 16px;
}
.main-content-area.login p {
    font-size: 16px;
}
.main-content-area.login .small-form input[type="text"], .main-content-area.login .small-form input[type="password"] {
    width: 100%;
    font-size: 16px;
    height: 2.25em;
    box-sizing: border-box;
}
.main-content-area.login .standard-button-list li {
    width:100%;
}
.main-content-area.login .form-entry:last-child {
    margin-bottom:0;
}
.main-content-area.login .standard-button-list input, .main-content-area.login .standard-button-list ul a {
    display:block;
    width:100%;
    text-align:center;
    margin: 0;
    line-height: 2.25em;
    font-size: 1em;
}
@media screen and (max-width: 428px){
.main-content-area.login .col-wide {
    padding: 0 1em 2em;
    /* border: solid 1px; */
    /* border-radius: 3px; */
    /* margin: 0 0 2em; */
}
.main-content-area.login .col-wide input[type=text] {
        box-sizing:border-box;
    }
}
/* ---------------------- END STYLES FOR LOGIN PAGE -----------------------------*/

/* ----------------------  STYLES FOR FACEBOOK POPUP -----------------------------*/
.main-content-area.fb-popup h2 {width:937px;margin-left:0px;}
#fbloginText {padding-left:15px;height:450px;}
/* ---------------------- END OF  STYLES FOR FACEBOOK POPUP -----------------------------*/

/* ----------------------- STYLES FOR USER PROFILE PAGE ---------------------------*/

table.txt1 tr td {
    padding-bottom: 20px;
}

.public-profile .user-tn {
    max-width: 300px;
    float: left;
    margin-right: 20px;
}

/* -----------------------END OF  STYLES FOR USER PROFILE PAGE ---------------------------*/
/* ----------------------- STYLES FOR IMPORT-PROFILE-DECKS PAGE ---------------------------*/
table#importProductListing tr td {
    vertical-align: top;
    padding: 8px;
}
/* -----------------------END OF  STYLES FOR IMPORT-PROFILE-DECKS PAGE ---------------------------*/

/*------------------------STYLES FOR DESIGN TIPS & TEMPLATES --------------------------------*/

#dvBaseInfo {display:none;}
#design-help-text tr:nth-child(even) {
    background: #eeeeee;
}
#design-help-text table.txt1 tr td {
    vertical-align:middle;
    padding: .5em 1em;
    /* line-height: 2em; */
}
#design-help-text table.txt1 {
    margin:auto;
}

.pageDisplay td {padding:10px;}
.pageDisplay td table td {padding:0px;}

.promo-strip-wrapper {
    margin: 0 auto;
    background-color: #000;
    padding: 4px;
    text-align: center;
}

.promo-strip {
    width:100%;    
    text-align: center;
}
    .promo-strip.promo-desktop {
        width: 1022px;
    }
    .promo-strip.promo-mobile {
        display: none;
    }
.home-hero {margin-top:341px; }
.med-hero {margin-top:274px;}

.home-hero.hero-w-promo {margin-top:327px; }
.med-hero.hero-w-promo {margin-top:260px;}

#dvHomeHero {background:url('../images/hpslides/create-your-own-skateboard-graphic.jpg') 50% 50% no-repeat;background-size:996px 323px;height:323px;margin-bottom: 4px;/* margin-top: 4px; */}
#dvHomeHero div:first-child {margin:0 20px 0 600px;padding: 30px 0 0;
    text-align: center; color:#fff; text-shadow:1px 1px 1px #000;}
#dvHomeHero a span{ background:#fff; color:#373331; display:inline-block;font-size: 23px;
    height: 44px;
    line-height: 44px;
    margin: 3px;
    text-transform: uppercase;
    width: 270px; text-shadow:none;}
#dvHomeHero a {background: transparent;border: solid 3px #fff; display:inline-block; margin-bottom:3em;}
#dvHomeHero a:hover span {background-color:#FFF100}
#dvHomeHero a:hover {border-color:#FFF100}
.home-hero-header {text-transform:uppercase;font-size:1.2em; margin-bottom:1em;}
#dvHomeHero ul { font-size:1.2em;}
#dvHomeHero ul li {margin:.6em 0;}
#dvHomeHero p {margin:1em 0;}

#dvCustomHero {background:url('../images/hpslides/choose-a-skateboard-blueprint.png') 50% 50% no-repeat;background-size:754px 94px;height:94px;margin-bottom: 4px;}
.page-custom.content-wrapper {background:transparent;}
.page-custom .main-content { background:transparent;}
#dvCustomHero h2 {
    color: #fff;
    font-size: 24px;
    margin: 15px 0 0 24px;
    position: absolute;
    text-transform: uppercase;
}
#dvCustomHero ul {color: #fff;
    font-size: 0.8em;
    line-height: 40px;
    margin: 7px 0 0 439px;
    position: absolute;
    text-transform: uppercase;}

    .designer-intro
    {
        /* margin: 16px 4px 16px 16px; */
        line-height: 1.5em;
    }

        .designer-intro ul
        {
            list-style: disc;
            margin: 10px 24px 23px;
        }

        .designer-intro li
        {
            margin: 4px 8px;
        }


/*New Home Features*/
.home-feature a:not(.button) {
    color:#c61818;
}

.home-feature > p{
    font-size: 1.1em;
    line-height: 1.5em;
    padding: 0 1rem 2rem;
}

.home-feature > h3 {
    /* font-weight: 700; */
    margin: 1em 1rem 0.3em;
    text-transform: uppercase;
    font-size: 16px;
    border-top: solid 1px #eee;
    padding: 5px 0;
}


.grip-bg {
     background: url(/images/layout/grip/whitegrip.png) repeat 50% 3% #fbff4f5e; 
}

.maple-bg {
    background: url(/images/layout/maple-skateboard-bg.jpg) repeat 50% 53% #fbff4f59;
}

.concrete-bg {
    background: url(/images/layout/concrete-bg.png) repeat 50% 53% #eee;
}

.decks-bg {
    background: url(/images/layout/blank-decks-bg.jpg) repeat 50% 53% #eee;
}

.kickflip-bg, .full-width-wrapper.kickflip-bg {
    background: url(/images/layout/alley-kickflip.jpg) no-repeat 50% 53% #353535;
}

.tree-bg {
    background: url(/images/layout/tree-bg.jpg) repeat 50% 100% #333;
}

.decks-left-bg {
    background: url(/images/layout/deck-stack-left.jpg) no-repeat 50% 53% #eee;
}

.full-width-wrapper.bulk-decks-bg {
    background: url(/images/layout/bulk-decks-bg.png) no-repeat 50% 100% #000;    
}

.full-width-wrapper.base-types-bg {
    background: url(/images/layout/skateboard-base-types.jpg) no-repeat 50% 100% #000;
    background-size: cover;
}

.home-page .cameron-pool-bg {
    background: url(/images/features/cameron-white-pool-hero.jpg) no-repeat 50% 5% #fff;
    min-height: 500px;
    /*background-size: 133%;*/
}
    .cameron-pool-bg .callout-content {
        margin-top: 360px;
        text-align: center;
        margin-bottom: 26px;
    }
.home-page .holo-deck-bg.active {
    
}

.home-page .holo-deck-bg .fade-image-0, .home-page .holo-deck-bg .fade-image-1 {
    content: '';
    background: no-repeat 50% 5% #cc0000;
    background-size: cover;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 5s ease-out;
}
.home-page .holo-deck-bg .fade-image-1 {
    background-image: url(/images/features/holographic-skateboard-hero-1.jpg);
    opacity: 1;
    pointer-events: none;
}
.home-page .holo-deck-bg.active .fade-image-1 {
    opacity: 0;
}
.home-page .holo-deck-bg .fade-image-0 {
    background-image: url(/images/features/holographic-skateboard-hero.jpg);
    cursor:pointer;
    opacity: 0;
}
.home-page .holo-deck-bg.active .fade-image-0 {
    opacity: 1;
}
.home-page .holo-deck-bg {
    position: relative;
    min-height: 400px;
    display: flex;
    transition: background-image 2s ease-in;
    /* background-size: 133%; */
    height: 29vw;
    /* max-width:1600px; */
    /* max-height:500px; */
    margin: auto;
}

    .holo-deck-bg .callout-content {
        /* margin-top: 360px; */
        text-align: center;
        margin-bottom: 1em;
        align-self: flex-end;
    }

    #aboutBp {
        min-height: 908px;
        margin-bottom: -5px;
    }
    #aboutBp .info-text {
        background-color: #eeeeeed1;
        color: #000;
    }
    #aboutBp h2 {
        color: #c61818;
        text-shadow: #eee 1px 1px 3px;
    }

    .full-width-wrapper {
        padding: 1em;
        /* border-radius: 5px; */
        /* text-align: center; */
        min-width: 996px;
        background-color: #eee;
    }
    .full-width-wrapper.bottom {
        margin-bottom:-4px;
    }

.info-text {/* background: url(/images/layout/grip/whitegrip.png) repeat 50% 3% #000000; */padding: 2em;border-radius: 5px;/* text-align: center; */text-align: center;color: #2a2a2a;/* opacity: 0.8; */}


.info-text h3 {
    /* font-weight: 700; */
    margin: 0 0 0.5em;
    text-transform: uppercase;
    font-size: 19px;
    /* border-top: solid 1px #eee; */
    /* padding: 5px 0; */
}       

.info-text p{
    font-size: 14px;
    line-height: 1.5em;
    /* padding: 0 1rem 2rem; */
}

    .info-text a {
        color: #c61818;
    }


.complete-callout {
    padding-top: 25px;
}

.complete-callout img:first-child {
    max-width: 780px;
    width: 90%;
}
.complete-callout img {
    display: block;
    margin: auto;
}

.complete-callout img:last-child {
    margin-bottom: 1em;
    max-width: 1174px;
    width: 98%;
}

.dark-bg h2, .dark-bg .crumb-trail a, .dark-bg .crumb-trail {
    color: #fff;
}

.dark-bg .info-text {
    background-color: #eee;
    opacity: 0.8;
    box-sizing: border-box;
}

/*components/accessories page*/
ul.access-list { list-style-type:none;}
ul.access-list li {padding: 40px 0; border-bottom:solid 1px #eee;}
ul.access-list li .brand-logo img { width:100px;  }
ul.access-list li .brand-logo {
    float: left;
    margin-right: 40px;
    width: 100px;
}
ul.access-list li .access-name {
    display: block;
    float: left;
    margin-left:40px;
    font-size:16px;
    width: 250px;
    font-weight:bold;
}
    ul.access-list li .access-tn
    {
        float: left;
    }
    .access-name-link {

    padding-left: 40px;
    display: block;
    width: 250px;
    float: left;
    padding-top: 10px;

}

.main-content-area ul#productList {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    list-style: none;
    margin: 0;
    padding: 0;
    column-gap: 1em;
    row-gap: 1em;
}

    .main-content-area ul#productList li.deck {
        /*width: 150px;
        margin: 0 5px;
        float: left;
        height: 502px;*/
        text-align: center;
        grid-column: span 3;
        position: relative;
        /* border: solid 1px #f0f0ed; */
        padding-bottom:2em;
    }
.main-content-area ul#productList li.deck > div {
    display:flex;
    flex-direction:column;
    height: 100%;
}

.main-content-area ul#productList li.deck .deck-info {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /* border: solid 1px; */
    padding: 0 1em;
}
    .main-content-area ul#productList li.deck > div > a {position:relative;display: flex;justify-content: center;align-items: end;padding-bottom: 1em;flex-grow: 1;min-height:0;}

    .customizable > div > a::before {
    content: 'customizable';
    position: absolute;
    bottom: .2em;
    z-index: 3;
    /* left: 0; */
    /* right: 0; */
    background: #bebcb7;
    color: #fff;
    line-height: 1.75em;
    border-radius: 0 0 5px 5px;
    width: 100px;
    left: 50%;
    transform: translateX(-50%);
    text-transform: uppercase;
    font-size: 12px;
}
.customizable:hover > div > a::before {
    background: #6d6c6bad;
}
.main-content-area ul#productList li.deck:hover img {
    transform: scale(1.075);
}

.main-content-area ul#productList li.deck img {
    max-width: 140px;
    transition: transform .5s;
}

.main-content-area ul#productList li.deck.legacy img {
    /* max-width:95px; */
}

.main-content-area ul#productList li.deck .deck-info > strong a {
    max-height: 40px;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.product-list-paging {
    font-size: 14px;
    width: auto;
    float:right;
    text-align: center;
    margin: 3em 0;
}


#auto-gen .product-list-paging {
    text-align: center;
	
	float:none;
}
#auto-gen .product-list-paging div {
    font-size: 14px;
    width: auto;
    display: inline-block;
	float:none;
}

.product-list-paging a, .product-list-paging span {
    padding: 0 .5em;
    line-height: 3em;
    height:3em;
    text-decoration: none;
    background: #ccc;
    display: inline-block;
    margin: 0;
    transition: 600ms ease;
    float: left;
    text-align:center;
    min-width: 20px;
}

#auto-gen .product-list-paging a {
    min-width: 1.75em;
	}

.product-list-paging a:first-child {
    /* background: red; */
    border-radius: 2em 0 0 2em;
    padding-left: 1em;
}
.product-list-paging a:last-child {
    border-radius: 0 2em 2em 0;
    padding-right: 1em;
}

.product-list-paging a:hover {
    background: #cc0000;
    color: #fff;
}
.product-list-paging a.aspNetDisabled {
    background: #333;
    color: #fff;
	cursor:default;
}

.product-list-paging a:first-child.aspNetDisabled, .product-list-paging a:last-child.aspNetDisabled {
   width:1.5em;
   min-width:1.5em;
   padding:0; 
   color:#333;
   overflow:hidden;
   
}




/*Full Width Triple Col Layout*/
.full-content-area
{
     background:#fff; color:#333;
}
.full-content-area .pageContent
{
     padding: 10px 0 0;
}

.crumb-trail {
       margin-top: 10px;
}

.full-width-cols.cols-two-wide {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.full-width-cols .col-reg
{
    width:300px;
    float:left;
    display:block;
    margin:0 12px;    
}

.full-width-cols .col-wide {
    grid-column: span 6;
    padding: 1em 1em 1em 1em;
}

.full-width-cols .col-xwide {
    grid-column: span 8;
    padding: 1em 1em 1em 1em;
}

.full-width-cols .col-med {
    grid-column: span 4;
    padding: 1em 1em 1em 1em;
}

@media screen and (max-width: 428px) {
    .full-width-cols .col-xwide {
        grid-column: span 12;
        padding: 1em 1em 1em 1em;
    }

    .full-width-cols .col-med {
        grid-column: span 12;
        padding: 1em 1em 1em 1em;
    }
}
.full-width-cols h3
{
    margin:0 0 20px;
    font-weight: 700;
    border-radius:0;
    padding:0;
    font-size:20px;
    background-color:#fff;
}

.image-col img {
    width: 100%;
    border: solid 1px #eee;
}

.image-col figcaption {
    text-align: center;
    line-height: 32px;
    font-style: italic;
}

p.subhead-text, .info-block {
    font-size: 16px;
    line-height: 30px;
    text-align: center;
}
p.subhead-text {
    padding: 32px 16px;
}
p.subhead-text-simple {
    font-size:1.35em;
    text-align:center;
}



/*ADMIN SHOP PAGE PRODUCTS*/

.shop-page-product-wrapper > div, .shop-pages-content {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.shop-page-product-header, .shop-pages-header {
    padding: 4px 0 16px;
    text-align:right;
}

.shop-page-product-header-links {
    grid-column: 7 / span 6;
}

    .shop-page-product-header-links a {
        margin-left: 4px;
    }

.shop-page-product-header strong {
    grid-column: span 6;
}

.shop-page-product-content > div, .shop-pages-content > div {
    padding: 10px;
    border-bottom: solid 1px #eee;
}

.shop-page-product-content, .shop-pages-content {
    border: solid 1px #eee;
}

.shop-page-product-content > div.cb-col {
    grid-column: span 1;
    text-align: center;
    padding-top: 12px;
}

.cb-col input {
    padding: 10px;
}

.tn-col {
    grid-column: span 2;
}

    .tn-col input {
        width: 100px;
    }

.desc-col {
    grid-column: span 8;
    line-height: 19px;
}

.shop-pages-content > div.desc-col {
    grid-column: span 9;
}

.shop-page-product-content > div.btn-col, .shop-pages-content > div.btn-col {
    grid-column: span 1;
    text-align: right;
    padding: 20px 30px;
    line-height: 23px;
}

.shop-pages-content-wrapper {
    margin-bottom:36px;
}

.footer-actions {
    text-align: right;
    grid-column: 6 / span 7;
    padding: 10px 0;
}
    .footer-actions label {
        margin-right: 8px;
    }

    .footer-actions select {
        height: 24px;
    }
.shop-page-product-content > div.dv-msg {
    grid-column: span 12;
}

.main-content-area h3 > span {
    float: right;
    font-size: 14px;
    font-weight: normal;
}

/*New Shop & New Shop Checkout*/

.main-content-area.new-shop .form, .main-content-area.new-shop-checkout .form {
    width: initial;
}

.main-content-area.new-shop .form-entry, .main-content-area.new-shop-checkout .form-entry {
    width: initial;
    padding: 0;
}

.icon-callout {
    width: 39%;
    display:inline-block;
    /* background-color: #eee; */
    padding: 2em;
    /* border-radius: 10px; */
    position: relative;
    /* height: 95px; */
    margin: 20px 24px;
    vertical-align: top;
    /* opacity: 0.79; */
    border: solid 1px #333;
}
.icon-callout h5{
    font-family: 'Roboto Condensed',Roboto,Arial, Helvetica, sans-serif;
    font-size: 24px;
    margin: 0 0 .5em;
    text-transform: uppercase;
    font-weight: bold;
}
.icon-callout .callout-text{width: 60%;font-size: 1em;line-height: 1.5em;}

.icon-callout i{font-size: 65px;position: absolute;top: 18px;right: 21px;}
.icon-callout i.ico-object-group, .icon-callout i.ico-measure {
    font-size:55px;
    }

.icon-callout a {color:#fff;/* float: right; */background-color: #c61818;padding: .75em;width: 147px;text-align: right;text-decoration: none;text-transform: uppercase;position: absolute;right: -7px;bottom: 7px;}
.icon-callout a:hover {/* opacity:0.8; */right:-5px;background-color: #f44c4c;}

.deck-stack-left img {
    width: 600px;
}

.order-tracking-details {
    border: dashed 1px #ccc;
    padding: 4px;
    background-color: #eee;
    border-radius: 4px;
}

/*-------- Shopify App ----------------*/

ol.step-list {
    list-style: none;
    counter-reset: step-counter;
    margin: 2em 3em;
}

    ol.step-list li {
        counter-increment: step-counter;
        position: relative;
        margin: 1em 0;
    }

        ol.step-list li::before {
            content: counter(step-counter);
            color: #fff;
            font-size: 1.5rem;
            font-weight: bold;
            position: absolute;
            --size: 32px;
            left: calc(-1 * var(--size) - 10px);
            line-height: var(--size);
            width: var(--size);
            height: var(--size);
            top: 0;
            background: #c61818;
            border-radius: 50%;
            text-align: center;
        }

.step-list h5, .step-status h5 {
    font-size: 16px;
}

ol.step-list li.completed-true::before {
    background-color: #5e8e3e;
}

.step-status {
    line-height: 20px;
}

    .step-status i {
        font-size: 36px;
        float: left;
        padding: 0 12px 27px 12px;
    }

.steps-completed i {
    color: #5e8e3e;
}

.steps-incomplete i {
    color: #c61818;
}

.help-text {
    border: dashed 1px #eee;
    padding: 1em;
    background-color: #e3eddc;
    border-radius: 5px;
}

.help-col {
    margin-top: 3em;
}

    .help-col h3 {
        background-color: transparent;
        line-height: 36px;
        margin-bottom: 0;
    }

        .help-col h3:before {
            font-size: 36px;
            color: #5e8e3e;
            float: left;
            margin-right: 6px;
        }

    .help-col p {
        line-height: 24px;
    }
/*-------- Messages --------------------*/

.warning {
    --message-color: #FFC107;
}
.message {
    border:solid 1px;
    border-color:var(--message-color);
    border-radius:3px;
    padding: .5em .5em .5em 2.5em;
    position:relative;
    display:block;
    margin:.5em 0;
    box-sizing: border-box;
    /* float: none; */
}
.message-item {
    /* margin-left: -6px; */
    /* border-radius: 4px 0 0 4px; */
    /* border-left: solid 6px var(--message-color); */
}

li#displayLayer2 {}
.message i {
    position:absolute;
    left: .7em;
    top:.7em;
    color: #ffc107;
}
.message a {
    color:var(--message-color);
}



/*-------- Form Message ----------------*/
.form-message {
    padding: 10px;
    border-radius: 3px;
    font-size: 16px;
    margin-bottom: 16px;
}

    .form-message:before {
        font-family: "bpicons" !important;
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        speak: none;
        line-height: 16px;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-size: 20px;
        display: inline-block;
        float: left;
        margin: 0 6px 6px 0;
    }

    .form-message.error {
        background-color: #c618180d;
        color: #c61818;
        border: dashed 1px #c61818;
    }

        .form-message.error::before {
            content: "\4a";
            color: #c61818;
        }

    .form-message.success {
        background-color: #f6fee6;
        color: #333;
        border: dashed 1px #80a12f;
    }

        .form-message.success::before {
            content: "\4b";
            color: #80a12f;
        }

    .form-message i {
        font-style: italic;
        font-size: 12px;
    }

#shopifyAppHome .form-message {
    margin-top: 20px;
}

/* account area -------------------------------------- */
.account-shop-list {
    width: calc(100% - 2.25em);
    margin: 0 auto 2em;
}
.account-shop-list table, .account-shop-list tbody {
    display:block;
    width:100%;
    box-sizing:border-box;
   
}
.account-shop-list table tr {
    background:#f8f6f4;
    display:block;
    box-sizing:border-box;
    width:100%;
    border-radius: 3px;
    margin: 0 0 1em;
}
.account-shop-list table tr:first-child {
    background:none;
    margin: 0;
}
.account-shop-list table td {
    padding-bottom: 1em !important;
    display:inline-block;
    width: 10em;
    box-sizing:border-box;
    padding: 1em 0;
}
.account-shop-list table td:nth-child(1) {
    width: calc(100% - 40em);
    padding-left: 1em;
}

.account-shop-list table td:nth-child(1) a {
    text-transform:uppercase;
}
.account-shop-list > a {
    /* text-align:right; */
    /* width: 100%; */
    margin-left: 1em;
}
.account-shop-list .button {
    background: #80a12f;
    color: #fff;
    display: inline-block;
    text-decoration: none;
    /* padding: .5em .25em; */
    width: calc(100% - 1em);
    line-height: 2em;
    text-align: center;
    border-radius: 2px;
}
.account-shop-list .button:hover {
    background: #6f8635;
}
.account-form {
    width: 50em;
    max-width: calc(100% - 1em);
    margin: auto;
}

.account-form .account-form-entry {
    
margin: 0 0 2em;
}
.account-form input[type="text"], .account-form textarea {
     width: 100%;
    border-radius: 2px;
    border: solid 1px #666;
    padding: .5em .5em;
    overflow:visible
}



.account-form textarea {
    line-height:1.5em;
    resize:vertical;
}

.account-form label {
    font-weight:700;
    margin-bottom:.5em;
    display:block;

}

.account-form label[title]::after {
    content:'?';
    background:#333;
    color:#fff;
    cursor:pointer;
    width:1.25em;
    display:inline-block;
    text-align:center;
    line-height:1.25em;
    border-radius:100%;
    margin-left:.25em;
}

.account-info {
    margin:1em;
    font-size: 1.2em;
}
.account-info #dvShopLogo {
    width: 150px;
    height: 150px;
    border: solid 2px #827c74;
    padding: 2px;
}

.account-callouts .account-icon-callout {
    width: calc(50% - 2.25em);
    display:inline-block;
    background-color: #f8f6f4;
    padding: 2em;
    /* border-radius: 10px; */
    position: relative;
    /* height: 95px; */
    margin: 1em;
    vertical-align: top;
    /* opacity: 0.79; */
    border:none;
    min-height: 12em;
    border-radius: 3px;
    color: #393631;
    box-sizing: border-box;
}
.account-callouts .account-icon-callout.full {
    width: calc(100% - 2.25em);
    }
.account-callouts .account-icon-callout h5{
    font-family: 'Roboto Condensed',Roboto,Arial, Helvetica, sans-serif;
    font-size: 18px;
    margin: 0 0 .75em;
    text-transform: uppercase;
    font-weight: bold;
    max-width: calc(100% - 65px);
}
    .account-callouts .account-icon-callout.xl h5 {
    
max-width: calc(100% - 90px);
    
font-size: 21px;
    }
.account-icon-callout #dvShopLogo{
    height: 100px;
    width: 100px;
    display: block;
    position: relative;
    border: solid 2px;
    float: left;
    margin: 0 1em 0 0;
    border-radius: 2px;
    }

.account-icon-callout #dvShopLogo img {
    max-width: calc(100% - .25em);
    max-height: calc(100% - .25em);
    display: block;
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);

    background: url('/images/grid-transparency.png');
}
    
.account-icon-callout .info div {
    margin:0 0 .5em;
}
.account-icon-callout label {
    font-weight:bold;
}
.account-callouts .account-icon-callout .callout-text{width: calc(100% - 12em);font-size: 1em;line-height: 1.5em;min-width: 125px;}

.account-callouts .account-icon-callout i{font-size: 65px;position: absolute;top: 18px;right: 21px;color: #827c74;}
.account-callouts .account-icon-callout i img {
    max-width:150px;
    max-height:150px;
}
.account-callouts .account-icon-callout.xl i {
    font-size:90px;
} 
.account-callouts .account-icon-callout .account-icon-button {
    color:#fff;
    /* float: right; */
    background-color: #5a554d;
    padding: .75em;
    width: 12em;
    text-align: right;
    text-decoration: none;
    text-transform: uppercase;
    position: absolute;
    right: -.5em;
    bottom: 1em;
    border-radius: 1px;
    background-color: #80a12f;
    /* background-color: #1d909c; */
    }
.account-callouts .account-icon-callout .account-icon-button:hover {/* opacity:0.8; */right:-5px;background-color: #393631;}


.account-callouts .shop-shopify-info.account-icon-callout {
    border: solid 1px #b3ab9f;
    min-height: 10em;
    background: none;
    width: calc(100% - 2.5em);
}
.account-callouts .shop-shopify-info.account-icon-callout h5 {
   margin-bottom:1em;

}
.account-callouts .shop-shopify-info.account-icon-callout .note {
    font-style:italic;
    margin-top:1em;
}
.account-callouts .shop-shopify-info.account-icon-callout h5 img {
   /* width:100px; */
   float:left;
   margin: -.45em -.2em .25em 0;
   display: block;
}
.account-callouts .shop-shopify-info.account-icon-callout .account-icon-button {background-color: #5a554d;}
.account-callouts .account-icon-callout i.ico-shopify {
    -webkit-mask: url('/images/external/shopify_glyph.svg') no-repeat center;
    height: 55px;
    width:65px;
    background-size:contain;
    /* opacity:.8; */
    background-color: #827c74;
}

.payment-card-details {
    border: solid 1px #ccc;
    padding: 10px;
    border-radius: 10px;
    width: 300px;
    background-color: #eee;
}

    .payment-card-details h5 {
        font-size: 16px;
    }

@media screen and (max-width: 428px){
    .account-shop-list {
        width:100%;
    }
    .account-callouts .account-icon-callout {
        width: 100%;
        margin: 1em 0;
    }
    .account-callouts .account-icon-callout .callout-text{
        width:100%;
        padding:1em 0 2em
    }
    .account-callouts .account-icon-callout .account-icon-button  {
        position:relative;
        width:100%;
        margin:0;
        /* padding: 0; */
        display: block;
        text-align: center;
        right: auto;
        bottom: auto;
    }
    .account-callouts .shop-shopify-info.account-icon-callout {
        width:100%;
    }
    .account-callouts .shop-shopify-info.account-icon-callout h5 img {
        float:none;
    }
    .account-callouts .account-icon-callout.full {
        width:100%;
    }
    .account-callouts .account-icon-callout h5 {
        min-height:2em;
    }
.account-callouts .account-icon-callout.xl h5 {
        min-height: 2.75em;
    }
    .account-icon-callout #dvShopLogo {
        float:none;
        margin:auto;
    }
.account-shop-list table tr:first-child {
    display:none;
}
.account-shop-list table tr {
    padding-top:1em;
}
    .account-shop-list table td {
        /* width: 50%; */
        padding:.25em 1em;
    }
    .account-shop-list .button {
        width: 100%;
    }
    .account-shop-list table td{
        width:100%;

    }
} /*end @media screen and (max-width: 420px) */


.auto-gen-deck {
    float: left;
    width: 16%;
    text-align: center;
    position: relative;
    /* padding: 1em 0 0; */
    height: 482px;
}

    .auto-gen-deck .auto-gen-deck-info {
        width: 100%;
    }

        .auto-gen-deck .auto-gen-deck-info a {
            text-decoration: none;
            color: #333;
            font-size: 1.2em;
            font-weight: bold;
            line-height: 1.25em;
            padding: 0 .25em;
            display: block;
            overflow: hidden;
            max-height: 2.5em;
            text-overflow: ellipsis;
            min-height: 1.5em;
            margin: .25em 0;
        }

    .auto-gen-deck img {
        /* transition: 300ms ease; */
        /* -webkit-mask-size: 100%; */
        margin: auto;
        display: block;
    }
.bg-callout .auto-gen-deck img {
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 140px auto;
    -webkit-mask-image: url(/images/8_25-mask-shape.png);
    background-color: #fff;
    /* transform: scale(1); */
    width: 100px;
}


.auto-gen-deck-image {
    position:relative;
    transition: all 300ms ease-in-out;
    width: 140px;
    margin: auto;
    /* border: solid 4px yellow; */
    /* background: aliceblue; */
}

.auto-gen-deck:hover .auto-gen-deck-image {
    /* transform: scale(1.01); */
    /* perspective: 1000px; */
    /* -webkit-backface-visibility: visible; */
    /* backface-visibility: visible; */
    /* -webkit-animation: ease-in-out deck-grow 1s; */
}

@-webkit-keyframes deck-grow {
    40% {
        transform: scale(1.02);
        
    }
}

.bg-callout .auto-gen-deck-image::before {
    background: url('/design/decktemplates/8_25_mask_build_BP_standard_28.png') no-repeat;
    content: '';
    height: 100%;
    width: 100%;
    /* border: solid; */
    display: block;
    position: absolute;
    /* top: 0; */
    /* left: 50%; */
    z-index:100;
    /* transform: translate(-50%, 0); */
    background-size: 100% auto;
    background-position: 50%;
    /* border: solid 1px red; */
    mix-blend-mode: multiply;
    z-index: 20;
    transform: scale(1);
}


@media screen and (min-width: 429px) {

    .auto-gen-deck:hover {
        cursor: pointer;
    }

        .auto-gen-deck:hover .auto-gen-deck-info a {
            color: #cc0000;
        }

        .auto-gen-deck:hover img {
            /* height: 307px; */
            /* margin: -5px; */
        }
}


.shop-product-shopify .form-cb {
    line-height: 32px;
}

/* Featured Decks */

.featured-deck-list {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

    .featured-deck-list .featured-deck {
        grid-column: span 4;
        padding: 1em;
    }

        .featured-deck-list .featured-deck img {
            width: 100%;
        }

.featured-deck-excerpt {
    position: absolute;
    bottom: 0px;
    padding: 1em;
    line-height: 1.2em;
    background-color: #e1caa6a8;
    display: none;
}

.featured-deck-image {
    position: relative;
    /*! cursor: pointer; */
}

.featured-deck-list .featured-deck-image:hover .featured-deck-excerpt {
    display: block;
}

.featured-deck h4 {
    text-align: center;
    padding: 4px;
    font-weight: bold;
    line-height: 1.2em;
    color: #76726d;
    text-align: center;
}

.featured-deck-excerpt a {
    color: #c61818;
}

.featured-deck a {
    text-decoration: none;
}

.one-tree .image-col img {
    border: transparent 0 none;
}

.pricing-table {
    width: 100%;
    line-height: 20px;
}

    .pricing-table td {
        padding: 8px 4px;
    }

    .pricing-table .header-row {
        font-weight: bold;
    }

    .pricing-table tr:nth-child(2n) {
        background: #eeeeee;
    }

.links-col {
    line-height: 20px;
    border-left: solid 1px #eee;
    padding: 20px;
    margin: 52px 0;
}


.base-type-photo {
    width: 100%;
}

.base-type-wrapper .standard-button {
    float: right;
}

.base-type-wrapper {
    margin: 20px 0 40px;
}

/*upload image progress bar*/
.progress-bar-wrapper {
    height: 40px;
    clear: both;
    border: solid 1px #666;
    background-color: #000;
    color: #fff;
}

.progress-bar {
    /*background-color: #cc0000;*/
    height: 100%;
    font-size: 16px;
    line-height: 40px;
    padding-left: 8px;
    font-style: italic;
    position: relative;
}

span.progress-percent {
    z-index: 2;
    position: absolute;
}

span.progress-kb-left {
    font-size: 10px;
    text-transform: uppercase;
    z-index: 2;
    position: absolute;
    right: 6px;
    top: -12px;
}

span.progress-time-left {
    font-size: 10px;
    text-transform: uppercase;
    z-index: 2;
    position: absolute;
    right: 7px;
    bottom: -13px;
}

.progress-percent-bar {
    background-color: #cc0000;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
#btnUploadImg {
    display: none;
}