﻿@media screen and (max-width:767px) {
    body { line-height: 16px; }

    .NoScroll { overflow: hidden; }

    .OuterWrapper { }
    .InnerWrapper { position: relative; }

    /* HEADER */
    .FixedHeaderWrapper { }
    .AfterFixedHeaderWrapper { margin-top: 116px; }

    .InnerHeaderWrapper { }
        .InnerHeaderWrapper .LogoWrapper { margin-top: 0px; margin-bottom: 10px; }
        .InnerHeaderWrapper .Logo img { }
    .OuterTopMenuWrapper { position: fixed; height: 0px; width: 0px; z-index: 97; height: 100%; width: 100%; background: none; display: none; }
        /* LEFT MENU BACKGROUND*/
        .OuterTopMenuWrapper.Visible { display: block; }
        /* LEFT MENU BACKGROUND*/
        .OuterTopMenuWrapper.Active { background-color: rgba(0,0,0,0.7); top: 0; right: 0px; left: 0px; bottom: 0px; height: 100%; width: 100%; }
    /* LEFT MENU BACKGROUND*/
    .InnerTopMenuWrapper { position: absolute; width: 250px; background: #da291c;  top: 0px; left: -250px; bottom: 0px; height: 100%; z-index: 98; }/*tha*/
        /* LEFT MENU CONTENT */
        .InnerTopMenuWrapper.Active { left: 0px; }
        /* ACTIVE LEFT MENU CONTENT */
        .InnerTopMenuWrapper .Pages { width: 100%; padding-top: 50px; display: none; }
            /* WEBSITE PAGES */
            .InnerTopMenuWrapper .Pages.Visible { display: block; }
        /*.InnerTopMenuWrapper .Shop { display:none; float:left; width:100%; text-align:center; margin-bottom:5px; }*/
        .InnerTopMenuWrapper .Shop { width: 250px; left: -250px; }
        .InnerTopMenuWrapper nav ul { float: left; background: #ccc; width: 100%; border: 0px solid #ccc; box-sizing: border-box; }
            .InnerTopMenuWrapper nav ul li { float: left; display: block; text-align: left; clear: left; background: #fff; width: 100%; box-sizing: border-box; border-bottom: 1px solid #ccc; }
                .InnerTopMenuWrapper nav.Pages ul li:hover { background: #ccc; }
                .InnerTopMenuWrapper nav.Pages ul li a { border-right: 0px !important; display: inline-block; padding: 0px; padding-left: 37px; line-height:46px; height:46px; box-sizing: border-box; width: 100%;  font-size: 14px; }
                    .InnerTopMenuWrapper nav ul li a.Home { padding-left: 10px; }
                .InnerTopMenuWrapper nav ul li ul li:last-child { border-bottom: 0px solid #ccc; }
        .InnerTopMenuWrapper .Shop ul .CustomerMenuWrapper .CustomerMenu li:last-child a { border-bottom: 0px solid #ccc; }
        .InnerTopMenuWrapper .Pages ul li { padding-left: 0px; }
        .InnerTopMenuWrapper .Shop ul li:hover { background-color:none; }
        .InnerTopMenuWrapper .Shop ul li.CustomerMenu ul li a { border-bottom:1px solid #ddd; }

    .OuterTopMenuWrapper { padding-top: 8px; padding-bottom: 8px; }

    .InnerHeaderContentWrapper { padding-top: 10px; }
    .InnerTopMenuWrapper .Pages { }

    .MainCategories { display: none; }
    .OuterCategoriesWrapper { }
    .InnerCategoriesWrapper { width: 480px; padding: 0px; }
    .Categories { }

    /* MOBILE */

    /* MOBILE MENU HEADER */
    .OuterMobileMenuHeaderWrapper { display: block; }

    .InnerMobileSubCategoriesWrapper h5 { font-size: 16px; font-weight: 400; }
    .InnerMobileSubCategoriesWrapper { font-size: 14px; }

    .MobileCategoriesWrapper { display: block; }
        .MobileCategoriesWrapper.Active { left: 0px; }
    .MobileIcons { display: block; }
    .Categories .MobileCategories { position: absolute; z-index: 99; display: none; }
        .Categories .MobileCategories.Visible { display: block; }
    .OuterHeaderContentWrapper { }
    .InnerHeaderContentWrapper { width: 480px; position: relative; }
    .ShopToolsWrapper { display: none; position: absolute; left: 0px; top: 116px; float: left; width: 100%; padding: 10px; box-sizing: border-box; background: #34495e; border: 1px solid #000; border-top: 0px; }
        .ShopToolsWrapper .SearchContent { width: 100%; margin-top: 0px; box-sizing: border-box; height: 36px; background: #fff; }
        .ShopToolsWrapper .cbSearch { margin-left: 3px; }
            .ShopToolsWrapper .cbSearch input { line-height: 24px; width: 412px; }
        .ShopToolsWrapper .btnSearch { float: right; box-sizing: border-box; margin-top: -27px; }
        .ShopToolsWrapper .MiniCartWrapper { font-size: 14px; line-height: 18px; display: none !important; }

    .OuterMobileMenuWrapper { }
        /* LEFT MENU BACKGROUND*/
        .OuterMobileMenuWrapper.Visible { }
        /* LEFT MENU BACKGROUND*/
        .OuterMobileMenuWrapper.Active { display: none; }
    /* LEFT MENU BACKGROUND*/
    .InnerMobileMenuWrapper { }
        /* LEFT MENU CONTENT */
        .InnerMobileMenuWrapper.Active { display: none; }
    /* ACTIVE LEFT MENU CONTENT */

    .OuterMobileMenuHeaderWrapper { display: block; left: -250px; width: 250px; }
    .InnerMobileMenuHeaderWrapper .MobileMenuClose { padding-right: 7px; }

    .MobileCategoriesWrapper { left: -250px; width: 250px; }
    .MobileCategories { width: 250px; }
        .MobileCategories li span:after { right: 20px; }

    .InnerMobileSubCategoriesWrapper h5 { font-size: 16px; font-weight: 400; }
    .InnerMobileSubCategoriesWrapper { font-size: 14px; }

    .OuterMobileSubCategoriesWrapper { width: 250px; }
    .InnerMobileSubCategoriesWrapper ul li .Extend { height: 51px; line-height: 51px; padding-left: 20px; padding-right: 20px; }


    .MobileIcons li { display: block; }
        .MobileIcons li:nth-child(2) span { border-left: 0px solid #000; }
        .MobileIcons li:nth-child(5) span { border-left: 0px solid #000; }

    /* ANIMATE HEADER */
    .AnimateSmall .InnerHeaderContentWrapper .LogoWrapper { }
    .AnimateSmall .InnerTopMenuWrapper .Pages { top: 91px; }
    .AnimateSmall .Categories ul li ul { margin-top: 0px; }
    .AnimateSmall .InnerCategoriesWrapper .Categories ul.MobileIcons li a, .AnimateSmall .InnerCategoriesWrapper .Categories ul.MobileIcons li span { padding-top: 10px; padding-bottom: 10px; transition: all 0.3s ease; }
    .AnimateSmall .MobileIcons .MobileIcon { padding-top: 10px; padding-bottom: 10px; }
    .AnimateSmall .MobileIcons .Cart .Count { top: 3px; height: 20px; padding-top: 2px !important; padding-right: 1px; padding-left: 1px; }
    .AnimateSmall .ShopToolsWrapper { top: 86px; }

    
/* BANNER */
.OuterBannerWrapper.Hidden { display: none; }
.InnerBannerWrapper {}
.InnerBannerWrapper .BannerWrapper .BannerPager { bottom:10px; right:0px;}
.InnerBannerWrapper .BannerWrapper .BannerPager ul { }
.InnerBannerWrapper .BannerWrapper .BannerPager ul li.BannerPagerItem { width:20px; height:20px;}


    /* CATEGORY TREE */
    CategoryTree ul { float: none; }

    /* CONTENT */
    .OuterContentWrapper { }
    .InnerContentWrapper { width: 480px; }

    .OuterLeftWrapper { width: 0px; left: 0px; }
    .CloseCategories { display: block; }
    .InnerLeftWrapper { position: fixed; top: 50px; left: 0; bottom: 0; width: 250px; box-sizing: border-box; z-index: 999; padding: 0px; left: 0; display: none; }
        /* SUB CATEGORIES */
        .InnerLeftWrapper .CategoryTreeWrapper { background: #fff; width: 100%; top: 0px; bottom: 0px; padding: 0px; border: 0px solid #ccc; border-left: 0px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); z-index: 999; max-height: 100%; overflow: auto; box-sizing: border-box; }
            .InnerLeftWrapper .CategoryTreeWrapper h3 { display: none; }
            .InnerLeftWrapper .CategoryTreeWrapper .CloseCategories { display: none; }
        .InnerLeftWrapper .CategoryTree { }
            .InnerLeftWrapper .CategoryTree h5 { cursor: pointer; padding-left: 10px; padding-top: 10px; padding-bottom: 10px; margin: 0px; }
                .InnerLeftWrapper .CategoryTree h5:hover { background-color: #eee; }
                .InnerLeftWrapper .CategoryTree h5:before { content: '\f053 \f053'; font-family: FontAwesome; font-size: 16px; padding-right: 5px; }
            .InnerLeftWrapper .CategoryTree span.Expand { position: absolute; right: 10px; top: 10px; }
                .InnerLeftWrapper .CategoryTree span.Expand:before { content: '\f054'; font-family: FontAwesome; font-size: 16px; }
            .InnerLeftWrapper .CategoryTree .Selected ul { display: none; }
    .CategoryTree ul { width: 100%; }
        .CategoryTree ul li { float: left; padding: 0px; margin: 0px; position: relative; width: 100%; }
            .CategoryTree ul li.Children { padding: 0px !important; }
                .CategoryTree ul li.Children:before { content: ""; padding: 0px; }
            .CategoryTree ul li:before { content: ""; padding: 0px; }
            .CategoryTree ul li a { float: left; width: 100%; padding: 10px; padding-left: 20px; box-sizing: border-box; }
                .CategoryTree ul li a:hover { background-color: #eee; }


    .InnerLeftWrapper .OuterFilterWrapper { position: relative; }
    .InnerLeftWrapper .OuterFilterWrapper { width: 220px; position: fixed; left: -220px; top: 0px; bottom: 0px; padding: 0px; border-radius: 0px; border: 0px; background-color: #fff; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); z-index: 999; max-height: 100%; overflow: auto; }




    .InnerLeftWrapper { }

    .OuterMainContentWrapper { width: 480px; }
    .InnerMainContentWrapper { padding: 5px; }


    /* GENERAL */
    h1 { font-size: 20px; color: #34495e; margin-bottom: 0px; padding-bottom: 5px; }
    h2 { font-size: 18px; color: #34495e; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #34495e; }
    h3 { font-size: 16px; color: #34495e; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #34495e; }
    p { font-size: 12px; }

    .Button { padding-left: 15px; padding-right: 15px; }

    /* ICONS */
    .Home:before { font-size: 24px; float: left; line-height: 42px; }
    .CustomerRegister:before { float: left; padding-top: 3px; }
    .CustomerLogin:before { float: left; padding-top: 3px; }

    .ShowFilter { display: none; }

    /* PRODUCT LIST */
    .ProductListWrapper.ListView { }
        .ProductListWrapper.ListView .ProductListItemWrapper {padding-bottom:50px; }
        .ProductListWrapper.ListView .ProductListItemContent .ImagePlaceholder { }
        .ProductListWrapper.ListView .ProductListItemContent .ProductPlaceholder { }
        .ProductListWrapper.ListView .ProductListItemContent .PricePlaceholder { }
        .ProductListWrapper.ListView .ProductListItemContent .ImagePlaceholder a { padding-left: 0px; max-width: 100%; }

    /* PRODUCT GRID */
    .ProductListWrapper.GridView { }
        .ProductListWrapper.GridView:after { }
        .ProductListWrapper.GridView .ProductListItemContent { }
        .ProductListWrapper.GridView .ProductListItemWrapper { width: 50%; }
        .ProductListWrapper.GridView .ProductListItemContent .ImagePlaceholder { padding-bottom: 0px; }
        .ProductListWrapper.GridView .ProductListItemContent .ProductPlaceholder { padding-bottom: 0px; }
        .ProductListWrapper.GridView .ProductListItemWrapper:nth-child(2n+1):before { clear: both; }
        .ProductListWrapper.GridView .ProductListItemWrapper:nth-child(4n+1):before { clear: none; }

        .ProductListWrapper.GridView .ProductListItemContent .Price { width: 100%; margin-bottom: 10px; }
        .ProductListWrapper.GridView .ProductListItemContent .AddToCart { }

    .ProductListWrapper .Ribbon { font-size: 9px; line-height: 16px; padding: 2px 5px; }
        .ProductListWrapper .Ribbon:after { border-top-width: 18px; min-width: 30px; }
        .ProductListWrapper .Ribbon:nth-child(2) { margin-top: 21px; }
        .ProductListWrapper .Ribbon:nth-child(3) { margin-top: 42px; }
        .ProductListWrapper .Ribbon:nth-child(4) { margin-top: 63px; }

    /* PRODUCT VIEW */
    .ProductWrapper .ProductItem .ImagePlaceholder { float: left; width: 100%; }
    .ProductWrapper .ProductItem .ProductPlaceholder { float: left; width: 100%; clear: both; padding: 0px; }
    .ProductWrapper .ProductItem .OrderPlaceholder { float: left; width: 100%; }
    /*.ProductWrapper .ProductItem .OrderPlaceholder .OrderCell { width:30%; margin-right:5%; float:left; }
	.ProductWrapper .ProductItem .OrderPlaceholder .OrderCell:last-child { margin-right:0%;  }*/
    .ProductWrapper .ProductItem .AddToCart { padding: 8px; font-size: 12px; line-height: 16px; }

    /* TABS */
    .TabNavWrapper { margin-top: 10px;}
        .TabNavWrapper ul { }
            .TabNavWrapper ul li { padding-left: 10px; padding-right: 10px; }
                .TabNavWrapper ul li span { padding-left: 10px; padding-right: 10px; }


    /* CART */
    .CartNavWrapper .CartStep { width: 23%; padding: 0px; padding-left: 10px; height: 40px; line-height: 40px; font-size: 11px; }
        .CartNavWrapper .CartStep:before { padding-right: 5px; font-size:10px; }
        .CartNavWrapper .CartStep.CartStepSelected { width: 31%; padding-left: 10px; }
        .CartNavWrapper .CartStep.Done { padding-left: 10px; }

    .CartTableWrapper { width: 100%; padding-right: 0px; margin-right: 0px; }
        .CartTableWrapper .CartTableContent { width: 100%; float: left; display: inline-block; }

        .CartTableWrapper .OrderDetailItem.Header { display: none; }
        .CartTableWrapper .OrderDetailItem { padding-bottom: 0px; float: left; }
            .CartTableWrapper .OrderDetailItem:nth-child(2) { border-top: 0px solid #ccc; }
            .CartTableWrapper .OrderDetailItem .MobileHeader { display: block; margin-bottom: 10px; }
        .CartTableWrapper .ProductImageWrapper { float: left; width: 30%; margin-bottom: 10px; border: 0; padding-right: 20px; padding-top: 10px; }
        .CartTableWrapper .ProductInfoWrapper { float: left; width: 70%; margin-bottom: 10px; border: 0; padding-top: 10px; padding-bottom: 0px; }
        .CartTableWrapper .QuantityWrapper { float: left; width: 50%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; clear: both; }
        .CartTableWrapper .PerPriceWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; }
        .CartTableWrapper .TotalPriceWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; }
        .CartTableWrapper .DeleteItemWrapper { float: left; width: 50%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; padding-top: 30px; }
        .CartTableWrapper .QuantityWrapper.Col3, .CartTableWrapper .PerPriceWrapper.Col3, .CartTableWrapper .TotalPriceWrapper.Col3 { width: 33.3%; }

    .CartTotalWrapper { float: right; width: 100%; box-sizing: border-box; }
        .CartTotalWrapper .OrderTotal { font-size: 20px; }

    .CartActionWrapper { width: 50%; }
        .CartActionWrapper .btnProceedToPayment { width: auto; float: right; }

    /* FILTER */
    .CloseFilter { display: block; }

    /* ARTICLES FRONTPAGE */
    .FrontArticlesWrapper { overflow: auto; border: 1px solid #eee; margin-bottom: 20px; display: table; }
    .FrontArticleItem { width: 100%; float: left; border-right: 0px; border-bottom: 1px solid #eee;height:300px; }
        .FrontArticleItem:last-child { border-bottom: 0px solid #eee; }

    /* LOGIN */
    .LoginBox { width: 100%; padding-right: 0px; margin-bottom: 20px; }

    /* SHOPPING LIST - MY PAGE */
    .FormOneLine select.ddlMinehandlelister { width: 360px; }
    .FormOneLine input[type=text] {width:318px;}
    .FormOneLine input[type=button].Button {margin-bottom:0px;}
    .Form.SelectedList input[type=text] {width:350px;}
    .Form.SelectedList textarea {width:350px;}
    .Form.SelectedList .ActionButtons {width:100%;}
    .Form.SelectedList .ActionButtons input {width:32.8%}
     .ShoppingListTableWrapper { width: 100%; padding-right: 0px; margin-right: 0px; }
        .ShoppingListTableWrapper .ShoppingListTableContent { width: 100%; float: left; display: inline-block; }

        .ShoppingListTableWrapper .ShoppingListItem.Header { display: none; }
        .ShoppingListTableWrapper .ShoppingListItem { padding-bottom: 0px; float: left; }
            .ShoppingListTableWrapper .ShoppingListItem:nth-child(2) { border-top: 0px solid #ccc; }
            .ShoppingListTableWrapper .ShoppingListItem .MobileHeader { display: block; margin-bottom: 10px; }
        .ShoppingListTableWrapper .ProductImageWrapper { float: left; width: 30%; margin-bottom: 10px; border: 0; padding-right: 20px; padding-top: 10px; }
        .ShoppingListTableWrapper .ProductInfoWrapper { float: left; width: 70%; margin-bottom: 10px; border: 0; padding-top: 10px; padding-bottom: 0px; }
        .ShoppingListTableWrapper .QuantityWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; clear: both; }
        .ShoppingListTableWrapper .PerPriceWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; }
        .ShoppingListTableWrapper .TotalPriceWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; }
        .ShoppingListTableWrapper .DeleteItemWrapper { float: left; width: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; padding-top: 30px; }
        .ShoppingListTableWrapper .QuantityWrapper.Col3, .CartTableWrapper .PerPriceWrapper.Col3, .CartTableWrapper .TotalPriceWrapper.Col3 { width: 33.3%; }

        .SharedPopupShoppingWrapper { max-width:470px; }

        /* ADD TO CART POPUP */
    .AddToCartPopup {    }
    .ProductListWrapper.GridView .ProductListItemContent .AddToCartPopup {top:25px; }

            /* SHARED SHOPPING LIST */
    .SharedShoppingListWrapper {}
    .SharedShoppingListWrapper h2 { line-height: 1.5rem; }
    .SharedShoppingListWrapper h2 span {display:block;}
    .SharedShoppingListWrapper h2 span:before { content:''; padding:0px; }

    /* CUSTOMADDTOCARTPOPUP */
.CustomAddToCartPopupOuterWrapper { }
.CustomAddToCartPopupInnerWrapper { min-width: 160px;  max-width: 320px; }


    /* FOOTER */
    .OuterFooterWrapper { }
    .InnerFooterWrapper { width: 480px; }
    .InnerFooterWrapper .FooterHelperText { clear:right; margin-right:0px; margin-top:10px;}
}
