﻿@media screen and (max-width:767px) {
    body { line-height: 16px; }


    /* LAYOUT */
    .FixedHeaderWrapper { }
    .AfterFixedHeaderWrapper { margin-top: 140px; }

    .InnerHeaderWrapper { }

    .OuterCategoriesWrapper { }
    .InnerCategoriesWrapper { width: 480px; padding: 0px; }

    .OuterHeaderContentWrapper { }
    .InnerHeaderContentWrapper { width: 480px; position: relative; }

    .OuterContentWrapper { }
    .InnerContentWrapper { width: 480px; }

    .OuterLeftWrapper { width: 0px; left: 0px; }
    .InnerLeftWrapper { }

    .OuterMainContentWrapper { width: 480px; }
    .InnerMainContentWrapper { padding: 5px; }

    .OuterFooterWrapper { }
    .InnerFooterWrapper {  }

       .OuterFirstBottomWrapper {   }
.InnerFirstBottomWrapper { width: 480px;  }

.OuterBottomWrapper { }
.InnerBottomWrapper { width: 480px;  }

.InnerFooterWrapper { width: 480px;}

    /* GENERAL */
    h1 {   }
    h2 {  }
    h3 { }
    p {  }

    .Button { padding-left: 15px; padding-right: 15px; }

    /* ICONS */
    .Home:before { font-size: 24px; float: left; line-height: 42px; color:#444; }
    .CustomerRegister:before { float: left; padding-top: 3px; }
    .CustomerLogin:before { float: left; padding-top: 3px; }


    /* 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; }*/

    /* HEADER */
    .InnerHeaderWrapper .LogoWrapper { margin-top: 6px; margin-bottom: 0px; }
    .InnerHeaderWrapper .Logo img {}

    .OuterTopMenuWrapper { position: fixed; height: 0px; width: 0px; z-index: 97; height: 100%; width: 100%; background: none; display: none; }
        .OuterTopMenuWrapper.Visible { display: block; }
        .OuterTopMenuWrapper.Active { background-color: rgba(0,0,0,0.7); top: 0; right: 0px; left: 0px; bottom: 0px; height: 100%; width: 100%; }
    .InnerTopMenuWrapper { position: absolute; width: 250px; background: #34495e; top: 0px; left: -250px; bottom: 0px; height: 100%; z-index: 98; }
        .InnerTopMenuWrapper.Active { left: 0px; }
        .InnerTopMenuWrapper .Pages { width: 100%; padding-top: 50px; display: none; }
            .InnerTopMenuWrapper .Pages.Visible { display: block; }
        .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; transition:background-color 300ms linear }
        .InnerTopMenuWrapper nav.Pages ul li:hover {  }
        .InnerTopMenuWrapper nav.Pages ul li a { color:#444; 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: 0px; }
    .InnerTopMenuWrapper .Pages { }

    .SearchOuterWrapper .SearchResultWrapper { margin-top: 7px; min-width: 454px; max-width: 454px;  }

    /* MAIN CATEGORIES*/
    .MainCategories { display: none; }


    /* 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; }

        .SearchOuterWrapper {float:left; width:100%;}
    .ShopToolsWrapper {   box-sizing: border-box; padding:0; margin:0;}
    .SelectedCustomerWrapper {font-size:0.8rem; line-height:1rem;  border-radius:5px; font-weight:300; padding:5px;}

.SelectedCustomerWrapper h6 { text-transform:uppercase; font-size:1rem; font-weight:400; margin-bottom:3px; border-bottom:1px solid #ccc;}
    .SearchInnerWrapper {float:left; width:100%;}
        .ShopToolsWrapper .SearchContent { width: 100%; margin-top: 0px; box-sizing: border-box; height: 36px; background: #fff; float:none;}
        .ShopToolsWrapper .SearchField.input { width:400px; float:left; padding-left:5px; }
        .ShopToolsWrapper .btnSearch { float: right; box-sizing: border-box; margin-top: -27px; }
        .ShopToolsWrapper .MiniCartWrapper { font-size: 14px; line-height: 18px; display: none !important; }

    .OuterMobileMenuWrapper { }
        .OuterMobileMenuWrapper.Visible { }
        .OuterMobileMenuWrapper.Active { display: none; }
    .InnerMobileMenuWrapper { }
        .InnerMobileMenuWrapper.Active { display: none; }

    .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 {  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; }


    /* 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 */
    .CloseCategories { display: block; }

    /* SUB CATEGORIES */
    .InnerLeftWrapper { position: fixed; top: 50px; left: 0; bottom: 0; width: 250px; box-sizing: border-box; z-index: 999; padding: 0px; left: 0; display: none; }
        .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; }

    /* FILTER */
    .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; }
    .ShowFilter { display: none; }

    /* PRODUCT LIST */
    .ProductListWrapper.ListView { }
        .ProductListWrapper.ListView .ProductListItemWrapper { }
        .ProductListWrapper.ListView .ProductListItemContent .ImagePlaceholder { width:50%; }
        .ProductListWrapper.ListView .ProductListItemContent .ProductPlaceholder {width:50%; }
        .ProductListWrapper.ListView .ProductListItemContent .PricePlaceholder { position:relative; width:100%;}
        .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 { width:100%; padding-left:0; }
    .ProductWrapper .ProductItem .ProductPlaceholder {  width:100%; }
    .ProductWrapper .ProductItem .OrderPlaceholder { width:100%; margin-bottom:20px; }
    .ProductWrapper .ProductItem .AddToCart { padding: 8px; font-size: 1rem; line-height: 16px; }
    .ProductColorWrapper { width:100%; padding-left:0;  }

    /* 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 STEPS */
    .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; }

    /* CART */
    .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: 25%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; clear: both; }
        .CartTableWrapper .PerPriceWrapper { float: left; width: 20%; 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 .EnviromentPriceWrapper { float: left; width: 20%; text-align: center; background-color: #eee; padding: 10px; box-sizing: border-box; height: 80px; }
        .CartTableWrapper .DeleteItemWrapper { float: left; width: 10%; 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; }
        .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 {  }
    .QuickCartOuterWrapper .QuickCartButtons .AddToCartPopup {
    right: 0px;
    left:0px;
    top: 70px;
}

    /* 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 */
    .InnerFooterWrapper .FooterHelperText { margin-right: 0px; margin-top: 5px; }

    /* QUICK CART */
    .QuickCartOuterWrapper { }
    .QuickCartInnerWrapper { }
    .QuickCartInnerWrapper .ArticleNo {width:100%;}
    .QuickCartInnerWrapper .ArticleDescription {width:100%;}
    .QuickCartInnerWrapper .ArticlePrice { width:30% }
    .QuickCartInnerWrapper .ArticleQuantity { width:30%}
    .QuickCartInnerWrapper .ArticleDelete { width:10%;}
    .QuickCartInnerWrapper .QuickCartHeader {display:none;}
    .QuickCartInnerWrapper .QuickCartItem .MobileHeader { display:block; margin-bottom:5px; }
    .QuickCartInnerWrapper .QuickCartItem  { border-bottom:1px solid #444; padding-top:10px; } 
    .QuickCartInnerWrapper .QuickCartItem .TextboxWrapper input[type=text], .QuickCartInnerWrapper .QuickCartItem .TextboxWrapper input[type=number] { font-size: 16px; }
    .QuickCartInnerWrapper .QuickCartItem .ArticleDelete { padding-top:32px; text-align:center; }
    .QuickCartInnerWrapper .QuickCartItem .SearchResultContent { min-width:428px; max-width:428px; }
    .QuickCartOuterWrapper .QuickCartButtons .AddQuickCartToCart { width:100%}
    .QuickCartOuterWrapper .QuickCartButtons .AddNewItem { width:100%}
    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper { width:100%;}
    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper span { display:block; margin-bottom:5px;  }
    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper input[type=number] { font-size: 16px; }
    .ImageFakeTable { min-height:0px; }
}
