/* Mobile */
@media screen {

.responsive-hide {display:none;}

.prdreview img.left, .prdreview img.right, .prdmain img.left, .prdmain img.right {float:none; display:block; margin:15px auto;}

div.container {min-width:320px; width:100%;}

#naviblock {width:100%; height: 107px;}
#mainnaviblock {
    display: none;
    position: fixed;
    top: 153px;
    width:100%;
    height: calc( 100% - 153px );
    overflow-y: auto;
    z-index:1000;
    background: rgba(0,0,0,0.5);
}
#account, #basket {float:left; width:50%;}
#browse a, #search a, #account a, #basket a
{background:#062b36; display:block; padding:5px 10px 15px 10px; text-align:center; font-size:25px; line-height: 35px; color:#18abd8; text-decoration:none; border:0px; border-left:#0c566c 1px solid; border-right:#041e26 1px solid; height:35px;}

#helppop {display:none;}

/* 2021 */
#browse {float:none; position:absolute; top:0; left:0; z-index:9999;}
#browse a {background:#1281a2; color:#ffffff; padding:10px; margin:0px; font-size:20px; line-height:20px; width:30px; height:21px; border:0px; text-align:center;}

/* 2021 */
#search {clear:both;}
#search a {display:none;}
#searchblock {display:block; clear:both; background:#18abd8; width:100%;}
#searchblock div {padding:5px;}
#searchblock div div {background:#fff; padding:0px;}
#searchblock div div form {display:block;}
#searchblock div div form button {background:#ffffff; float:right; padding:0px; margin:0px; color:#18abd8; font-size:16px; width:32px; height:32px; box-shadow:none; border-radius:0px;}

#searchblock input[type=text] {width:82%; background:#ffffff; border:0px; padding:5px 10px; margin:0px; border-radius:0px; outline:none; font-size:16px;}
#search input.btsearch {display:none;}

/* #basketblock {width:50%; float:right;} */
#basketblock {width:120px; height:60px; float:right; padding:5px; margin:0px 0 0 0;}

#basketblock #account span {color:#18abd8; font-size:9px; line-height:9px; text-transform: uppercase; letter-spacing:0.5px; display:block; z-index: 100; text-align:center; position: absolute; left:10px; bottom:16px; width:50px;}
#basketblock #basket span {color:#18abd8; font-size:9px; line-height:9px; text-transform: uppercase; letter-spacing:0.5px; display:block; z-index: 100; text-align:center; position: absolute; right:10px; bottom:16px; width:50px;}

#basketitems {position:absolute; z-index: 120; top:auto; right:auto; margin:-5px 0 0 32px;}

.checkoutbutton {display: block; width: auto; }
.continue-shopping-2 {display: none;}

#account a, #basket a {display:block; background:#062b36; float:left; height:50px; width:50px; text-align:center; border-radius:5px; margin:5px; padding:0px; border:0px;}
#account a i, #basket a i {color:#18abd8; font-size:25px; line-height:40px;}
#account a i span, #basket a i span {display:none;}

#account a:hover i, #basket a:hover i {color:#d1eef7;}

#mainnaviscrollband {position:relative; clear:both; top:5px;  box-shadow: 0px 1px 1px rgba(0,0,0,.3);min-width:320px;}

#mainnaviscroll {
    background: #18abd8;
    height: 40px;
    display: block;
    clear: both;
    padding: 0px;
    margin: 0 0 0 50px;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    border-top: #1281a2 1px solid;
}

.no-touch #mainnaviscroll::-webkit-scrollbar {
    display:none;
}
.no-touch #mainnaviscroll {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
#mainnaviscroll li {list-style-type: none; padding:0px; margin:0px; display:inline-block;}
#mainnaviscroll li a {display:block; padding:10px; color:#fff; text-decoration:none; font-size:14px; border-left:#46bcdf 1px solid;}

#mainnaviscrollband .naviscroll {
    position: absolute;
    top:1px;
    height: 39px;
    width: 25px;
    display: none; /* shown by js */
}
#mainnaviscrollband .naviscroll i {
    font-size: 20px;
    line-height: 40px;
    color: #fff;
}
.touch #mainnaviscrollband .naviscroll i {
    display: none; /* no arrows on touch */
}
#mainnaviscrollband .leftarrow {
    left: 50px;
    background: -moz-linear-gradient(left, rgba(24,171,216,1) 0%, rgba(24,171,216,0.5) 100%);
    background: -webkit-linear-gradient(left, rgba(24,171,216,1) 0%,rgba(24,171,216,0.5) 100%);
    background: linear-gradient(to right, rgba(24,171,216,1) 0%,rgba(24,171,216,0.5) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18abd8', endColorstr='#8018abd8',GradientType=1 );
}
#mainnaviscrollband .rightarrow {
    right: 0;
    background: -moz-linear-gradient(left, rgba(24,171,216,0.5) 0%, rgba(24,171,216,1) 100%);
    background: -webkit-linear-gradient(left, rgba(24,171,216,0.5) 0%,rgba(24,171,216,1) 100%);
    background: linear-gradient(to right, rgba(24,171,216,0.5) 0%,rgba(24,171,216,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8018abd8', endColorstr='#18abd8',GradientType=1 );
}

#basketitems {background:#d8130d; color:#fff; text-shadow: 0px 1px 1px rgba(0,0,0,0.3); z-index:120; position:absolute; top:5px; right:5px; font-size:12px; line-height:18px; font-weight:bold; text-align:center; width:25px; height:25px; padding:0; border-radius:100%; border:#fff 0px solid; box-shadow: 0px 1px 2px rgba(0,0,0,0.3);}
#basketitems div {z-index:130; position:relative; overflow:hidden; left:-5px; width:35px; text-align:center; margin:4px 0 0 0;}

#glowlogo {margin:0 auto; padding:15px 0px; clear:both;}

#breadcrumb .bcweb {display:none;}

/*** Main Navi ***/

#mainnavi
{
position: absolute;
z-index: 1000;
top: 0;
width:90%;
background:#18abd8;
/*display:none;*/
margin:0;
padding:0;
box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
}

#mainnavi ul { padding: 0; }

#mainnavi li
{
display:block;
list-style-type:none;
position:static;
padding:0px;
}

#mainnavi li>a,
#mainnavi .dropcolheader a
{
display:block;
list-style-type:none;
color:#fff;
text-decoration:none;
font-size:16px;
margin:0px;
padding:15px;
line-height:normal;
border-bottom:#1280a2 1px solid;
}

#mainnavi .dropcol > .dropcolheader a {
    font-weight: 700;
    padding:10px 15px 10px 30px;
}
#mainnavi li.level2 > a {
    padding:10px 15px 10px 45px;
}
#mainnavi li.level3 > a {
    padding:10px 15px 10px 60px;
    font-style: italic;
}

#mainnavi a.dropcolimg {display: none;}

#mainnavi a.parent:hover {background:#46bce0;}

#mainnavi a.parent::after {font-family: 'Font Awesome 5 Pro'; font-weight: 400; content: "\f054"; float: right; color:#74cde8;}
#mainnavi a.back-button::after {font-family: 'Font Awesome 5 Pro'; font-weight: 400; content: "\f053"; float: right;}

/*#mainnavi .active {background:inherit;}*/
#mainnavi .active>a {background:#46bce0;}
/*#mainnavi .active>a:after {font-family: "Font Awesome 5 Pro"; font-weight: 400; content: "\f041"; float: right;}*/

#mainnavi li a i {float:right; color:#74cde8;}

#mainnavi li a.see-all {font-style: italic;}

/* TODO */
/*.dropdown {display:none;}*/

/*** Sections ***/
.section {}

.orderdetail .orderdetails {}


.prdthumbblock {width:50%;}
.prdthumb {width:100%; border-radius: 6px; overflow:hidden;}
.prdthumbdesc {display:none;}

.prdhighlight {width:33.333%;}
#prdcontent .prdhighlight {width:33.333%; max-width: 150px;}

.ppprdhighlights {border: none; background: none;}

.youmayalsolike {position: relative;}

tr.freebie-spendx td.description {white-space: normal;}
table.mediacode th input[type=text] {margin-bottom:5px; width: 88%; max-width: none;}

#mainnavi .dropcollection { max-width: 640px; margin: 0 auto;}
.dropcollection div {padding:0 10px; max-width:640px; margin:0 auto;}
.dropcollection div a {display:block; width:46%; text-decoration: none; margin:10px 2% 5px 2%; float:left;}
#mainnavi .dropcollection div a i {display: inline-block; float: none;}
.dropcollection div a img {width:100%; height: auto; vertical-align: top; border-radius:5px; box-shadow: 0px 2px 5px rgba(0,0,0,0.3);}
.dropcollection div a div /* Dummy Text */ {font-size:10px; padding:5px 0px; line-height: 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#d1eef7;}

#prdimgthumbs {white-space: nowrap; width: auto; overflow: visible; margin: 0 5px; padding-right: 10px;}

#thumbWrapper {
    overflow-y: hidden;
    overflow-x: scroll;
    position: relative;
    width: 100%;
}
#prdimg .pparrowright, #prdimg .pparrowleft {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-decoration: none;
    position: absolute;
    bottom: 0;
}
.no-touch #thumbWrapper {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.no-touch #thumbWrapper::-webkit-scrollbar{
    display: none;
}
.prddetail span {white-space:normal;}

}

@media screen and (min-width: 640px) {

.prdthumbblock {width:33.333%;}
.prdhighlight {width:16.6665%;}

.section {width:50%; float:left;}

.maincol50 /* Main Column 50% */ {width:50%; float:left;}

.buttonleft {text-align:left;}
.buttonright {text-align:right;}

.quoteleft, .quoteright {width:50%;}
.quoteleft {float:left;}
.quoteright {float:right;}

.confirmcol {width:50%; float:left;}

.basket .delete, .basket .image {display:table-cell;}
.basket .description {max-width: none; overflow:auto; white-space:normal;}
table.baskettotal tr td {white-space: nowrap;}
table.mediacode th input[type=text] {max-width: 160px;}

/* Products Page Filter */
div.productfilter {text-align:center; padding:5px;}
div.productcount {float:left; text-align:left; padding:18px 10px; max-width:350px; margin:0 auto;}
div.filterselect {float:right; padding:5px; max-width:350px; margin:0 auto;}
div.productfilter form div label {display:none;}
div.productfilter form div {display:inline-block; padding:5px;}
div.productfilter form select {width:125px;}

#highlights .highlight div div {font-size:12px;}
#highlights .highlight div div strong {font-size:18px;}
}

@media screen and (max-width: 450px) {

table.basket { display: flex; justify-content: space-between; }
#shopping-cart-totals-table { display: table; }

#shopping-cart-table tr {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: stretch; align-content: stretch;     background: #222; border-bottom: #333 3px solid;}
#shopping-cart-table td {display: block; flex: 1 0 auto; padding: 0; margin: 6px; text-align: center; vertical-align: middle; border-bottom: none;}

#shopping-cart-table td.image { order: 1; flex: 0 0 60px;}
#shopping-cart-table td.description { order: 2; flex: 1 0 50%; text-align: left; }
#shopping-cart-table td.delete { order: 3; flex: 0 0 10%; padding-bottom:6px; text-align: right;}

#shopping-cart-table td.price {order: 4; flex: 1 0 50%;  text-align: right;}
#shopping-cart-table td.price .cart-price { display: inline-block; margin : 0 20px;}
#shopping-cart-table td.price .prdbutton {float: none; width: auto; padding: 0;}
#shopping-cart-table td.price .prdbutton button {display: block; }
#shopping-cart-table td.price .prdbutton .plusminusblock {text-align: inherit; width: auto; display: inline-block;}

#shopping-cart-table td.subtotal {order: 5; flex: 0 0 25%; text-align: right; margin-right: 10px;}

table.baskettotal th, table.baskettotal td {white-space: normal;}
}