:root {
    /*--shopOptionsBgColor: #d9d9d9;*/
    /*--fontFam: "Noto Sans";*/
    /*--shopSidebarWidthDefault: 240px;*/
    /*--shopSidebarToggleWidth: 20px;*/
    /*--shopSidebarWidthPlusToggle: 260px;*/

    /*--shopOptionsHeightBig: 15vh;
    --shopOptionsHeightMed: 70px;
    --shopOptionsHeightSmall: 70px;*/
}

/* Large screen size */
@media (min-width: 992px) {

    .desktop-hidden {
        display: none;
    }

    .shop-sidebar {
        /* right: auto !important; */
        left: 0;
        width: 240px;
    }
    #shopSidebar_inner{
        width:100%;
    }
    #shopSidebar_innerBackground{
        width:240px;
    }
    #shopSidebar_toggle{
        margin-left: 240px;
    }
    #testShopContent{
        margin-left: 265px;
    }

    #shopOptionsFixed {
        /*height:15vh;*/
        height:120px;


        /*padding: 1vh 2% 1vh 2%;
        top: 0;*/ 
    }
    #shopContentWrapper{
    /*height:85vh;
    padding-top:15vh;*/
    height:100%;
    padding-top:120px;


}


    /*#shopContent {
        padding-left: 0;
    }*/

    #gridArea {
        /*margin: 10% auto 0 auto;*/
        /*margin: 0% auto 0 auto;*/
        /*width: 100%;*/
    }

    #shopSearchRow #searchTerm {
        max-width: 85%; 
    }

}

/* Medium screen size */
@media (min-width: 768px) and (max-width: 992px) {

    .desktop-hidden {
        display: none;
    }

    .shop-sidebar {
        left:0;
        width: 240px;
    }    
    #shopSidebar_inner{
        width:100%;
    }
    #shopSidebar_innerBackground{
        width:240px;
    }
    #shopSidebar_toggle{
        margin-left: 240px;
    }
    #testShopContent{
        margin-left: 265px;
    }

    #shopOptionsFixed {
        /*height:15vh;*/
        height:120px;

    }
    #shopContentWrapper{
    /*height:85vh;
    padding-top:15vh;*/
    height:100%;
    padding-top:120px;
}


    #gridArea {
        /*margin-top: 12%;*/
        /*margin-top: 2%;*/
    }

    #shopSearchRow #searchTerm {
        max-width: 85%; 
    }

}

/* Small screen size */
@media (max-width: 768px) {

    .mobile-hidden {
        display: none;
    }

    .shop-sidebar {
        left:0;
        width: 0px;
    }
    #shopSidebar_inner{
        width:0;
    }
    #shopSidebar_innerBackground{
        width:0;
        display:none;
    }
    #shopSidebar_toggle{
        margin-left:0px;
    }
    #testShopContent{
        margin-left: 20px;
    }

    #shopOptionsFixed {
        /*height:20vh;*/
        height:120px;
    }
    #shopContentWrapper{
    
    /*height:80vh;
    padding-top:20vh;*/
    height:100%;
    padding-top:120px;

    }


    #gridArea {
        /*margin-top: 15%;*/
        /*margin-top: 5%;*/
    }

    #shopSearchRow #searchTerm {
        max-width: 100%; 
    }

}


.shopCheckbox{
    transform:scale(1.2);
    margin-right: 1%;
}

#testShopContent{
    transition: margin-left .25s;
}


/* ===== Shop Sidebar ===== */
#shopSidebar_inner{
    padding-right:0;
    width:100%;
    position:absolute;
    z-index: 10;
}

#shopSidebar_innerBackground{
    position:fixed;
    background-color: #d9d9d9;
    /*height:100vh;*/
    height:100%;
    z-index: 0;
}

#shopSidebar_toggle{
    height:100%;
    background-color:#808080;
    padding: 0 0 0 0;
    width:25px;
    position: fixed;
    z-index: 11;
    box-shadow: 1px 0px 6px #808080;
}

#menuHierarchy #hierarchyHeader {
    margin-left: 10px;
    background-color: #d9d9d9;
}

#backToTopSideButton{
    /*margin-top:55vh;*/
    margin-top:55%;
    width:80%;
}

.shop-sidebar {
    /*background-color: #d9d9d9;*/
    /*height: 100%;*/
    height: auto;
    /*height: 100vh;*/



    /*width: 20%;*/
    /*width: 300px;*/
    /*width: 300px;*/
    position: absolute;
    /*position: absolute;*/
    /*top:0;*/
    left:0;
    /*overflow-y:scroll;*/
    
    padding: 0% 0 0 0;
    transition:.25s;

    z-index: 9;

    /*box-shadow: 2px 2px 6px #808080;*/
    

    /* border-right: solid 1px #808080; */

    /*-webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;*/

}

.shop-sidebar .navbar-collapse {
    padding-left: 0;   
}

/* ====== Shop Filter/Search Options ===== */
#shopOptionsFixed {
    background-color: #d9d9d9;
    opacity: 1;
    width: 100%;
    box-shadow: 1px 2px 6px #808080;
    right: 0;
    /*padding: 2vh 2% 1vh 2%;*/
    padding: 2% 2% 1% 2%;
    top: 0; 
    z-index: 50;
}

#shopOptionsWrapper{
    position:fixed;
    width:100%;
    z-index: 45;
    /*height:15vh;*/
}

/*#shopOptionsWrapper_row{
    height:100px;
}*/

#shopContentWrapper{
    /*position:absolute;*/
    width:100%;
    z-index:30;
   }


#shopSearchRow {
    width: 100%;
}

#shopSearchRow .form-group {
    margin-bottom: 0;
}

#shopSearchRow #searchTerm {
    float: left; 
    /*margin-bottom: 2%;*/
}

#shopFilterRow {
    position: absolute;
    width: 100%;
    margin: 0 auto 0 auto;
    /*bottom: 2vh;*/
    /*bottom: 2%;*/

}

/* ==== Shop Content (Items) ===== */

#shopContent {
    padding: 0 1% 0 2%;
}

#gridArea {
    text-align: center;

}

#OnlineStoreGrid {
    padding-top: 1%;

}

#searchSubmit {
    width: 10%;
    margin-left: 1%;
}

#desktop label {
    padding-right: 1%;
}


.shop-content {
    z-index: 0;
    padding: 0;
}

#desktop label {
    padding-left: 2%;
}

.checkboxWrapper {
    width: 100%;
    float: left;
    overflow-x: hidden;
}

.filterHeader {
    font-size: 115%;
    font-weight: 500;
}

#showFilterModal {
    height: 100%;
    width: 100%;
    background-color: white;
}

/* Item "cards" */
.shop-item-card {
    /* display: inline-block; 
    width: 185px; 
    height: 100%;
    margin: 1% 1% 0 0;
    text-align: center; */
    /* width: 15%; */
    text-align: center;
    padding: 0%;
    /* margin: 0.5%; */
}

.shop-item-card .thumbnail {
    padding: 5% 7% 5% 7%;
    margin-bottom: 0;
    cursor:pointer;
}

.shop-item-card .image {
    /* width: 150px;  */
    width: 100%;
    height: 175px; 
    margin: 0 auto 5% auto;
    text-align: center; 
    vertical-align: middle;
}

.shop-item-card button {
    width: 100%;
}

.side-padded-row {
    padding-left: 5%;
    padding-right: 5%;
}

.shopItemIconTopLeft {
    /*position: absolute;*/
    display:block;
    /*margin:auto;*/
    height:20px;
    /*width:100%;*/
    text-align:left;
}

.shopPageItemElementText {
    padding-bottom: 3%;
}

.shopPageItemElementText h5 {
    height:  40px;
    font-size: 100%;
    margin: 0 0 6% 0;
    /*line-height: 1.3;*/
}

.shopPageItemElementText p {
    height: 15px;
    margin: 5% 0 0 0;
    font-size: 100%;
    /*font-size: 90%;*/
}

/* .shopPageItemElementText p:first {
    font-size: 100%;
}
 */
.sale-highlight {
    color: red;
    /*font-size: 105%;*/
    /*height: 15px;*/
    /*font-size: 110%;*/
}

.cart-controls {
   margin-top: 10%; 
}

/* ===== Filter Modal (Mobile View) ===== */

#modalFilterItems {
    width: 75%; 
    margin: 5% auto 0 auto;
}

#modalFilterItems .modal-content {
    padding: 5% 3% 0 3%;
}

#modalFilterItems .modal-content label {
    font-family: "Noto Sans";
    font-weight: 300;
    margin-top: -1%;
}

#modalFilterItems .modal-content input {
    height: 20px;
    width: 20px;
    margin-right: 1%;
}

#modalFilterItems .modal-footer {
    padding-left: 0;
    padding-right: 0;
}