﻿@media screen and (max-width:480px) {

    /* HTML */
    html { font-size: 12px; }

    /* LAYOUT */
    .FixedHeaderWrapper { }
    .AfterFixedHeaderWrapper { margin-top: 140px; }
    .InnerHeaderWrapper { }

    .OuterCategoriesWrapper { }
    .InnerCategoriesWrapper { width: 320px; }

    .OuterHeaderContentWrapper { }
    .InnerHeaderContentWrapper { width: 320px; padding-top: 0px; }
    .InnerMainContentWrapper.SmallDevice { width: 260px !important; margin: 0px auto; }

    .OuterContentWrapper { }
    .InnerContentWrapper { width: 320px; }

    .OuterLeftWrapper { width: 0px; }
    .InnerLeftWrapper { padding: 10px; }

    .OuterMainContentWrapper { width: 320px; }
    .InnerMainContentWrapper { padding: 5px; }

    .OuterFooterWrapper { }
    .InnerFooterWrapper { }

       .OuterFirstBottomWrapper {   }
.InnerFirstBottomWrapper { width: 320px;  }

.OuterBottomWrapper { }
.InnerBottomWrapper { width: 320px;  }
.InnerFooterWrapper { width: 320px;}

    /* GENERAL */
    h1 { font-size: 18px; color: #34495e;  padding-bottom: 5px; }
    h2 { font-size: 16px; color: #34495e; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #34495e; }
    h3 { font-size: 14px; color: #34495e; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #34495e; }
    p { font-size: 12px; line-height: 14px; }
    a { font-size: 12px; }

    /* GLOBAL CLASSES */
    .Button { background: none; border: 0px; margin-top: 10px; padding: 8px; padding-left: 20px; padding-right: 20px; text-align: center; box-sizing: border-box; text-transform: uppercase; font-size: 16px; border-radius: 5px; color: #fff; background-color: #34495e; cursor: pointer; }


    /* FORMS */
    .Form .TextboxWrapper input[type=text], .Form .TextboxWrapper input[type=number], .Form .TextboxWrapper input[type=email], .Form .TextboxWrapper input[type=password], Form .TextboxWrapper textarea { width: 310px; font-size: 16px; }
    .Form input[type=text], .Form input[type=number], .Form input[type=email], .Form input[type=password], .Form textarea { width: 250px; font-size: 16px; }
        .Form input[type=text].Short { width: 60px; }
        .Form input[type=text].Large { width: 240px; }
    .Form .TextboxWrapperIcon { width: 310px; }
        .Form .TextboxWrapperIcon input[type=text], .Form .TextboxWrapperIcon input[type=number], .Form .TextboxWrapperIcon input[type=email], .Form .TextboxWrapperIcon input[type=password] { width: 270px; font-size: 16px; line-height: 20px; height: 20px; }

    .Form .Text { width: 310px; }
        .Form .Text.Short { width: 60px; clear: left; }
        .Form .Text.Large { width: 240px; }

    .Form .CheckboxWrapper label:before { margin-right: 7px; }
    .Form select { width: 310px; }

    /* ANIMATE HEADER */
    /*.AnimateSmall .InnerHeaderContentWrapper .LogoWrapper { margin-bottom: 5px; margin-top: 5px; }
    .AnimateSmall .InnerHeaderContentWrapper .SearchContent { margin-top: 0px; }
    .AnimateSmall .MobileIcons .Cart .Count { left: 30px; margin-left: 0px; }
    .AnimateSmall .ShopToolsWrapper { top: 76px; }*/

    /* HEADER */
    .InnerHeaderWrapper .LogoWrapper { max-width: 120px; margin-top: 12px; }
    .InnerHeaderWrapper .Logo img { width:100%; }
    .InnerTopMenuWrapper .Pages { }

    .ShopToolsWrapper {  }
    .InnerTopMenuWrapper .Shop { width: 200px; left: -200px; }

    .InnerHeaderContentWrapper .SearchContent { }
    .ShopToolsWrapper .cbSearch input { line-height: 20px; width: 252px; }
    
    .SearchOuterWrapper .SearchResultWrapper { margin-top: 7px; min-width: 294px; max-width: 294px;  }

    /* CONTENT */

    /* MOBILE MENU */
    .MobileIcons .Cart .Count { left: 30px; }
    .InnerTopMenuWrapper { width: 200px; left: -200px; }
    
    .InnerLeftWrapper { width: 200px; }
    .MobileCategoriesWrapper { left: -200px; width: 200px; }
    .MobileCategories { width: 200px; font-size: 16px; }
    .OuterMobileMenuHeaderWrapper { left: -200px; width: 200px; font-size: 16px; }
    .InnerMobileMenuHeaderWrapper .MobileMenuHeader { font-size: 16px; }
    .MobileCategories li span { font-size: 14px; }
    .OuterMobileSubCategoriesWrapper { width: 200px; }
    .InnerMobileSubCategoriesWrapper h5 { font-size: 14px; }
    .InnerMobileSubCategoriesWrapper a { font-size: 12px; }
    .InnerMobileSubCategoriesWrapper ul li .Extend { padding-left: 10px; padding-right: 10px;  }
    .ShopToolsWrapper .SearchField.input { width:250px; }

    /* LOGIN */
    .btnLogin { width: 100%; }
    .ForgotPassword { width: 100%; }
    .btnRegister { width: 100%;}

    /* ICONS */
    .Username:before { padding-top: 2px; padding-right: 6px; }
    .Password:before { padding-top: 2px; padding-left: 3px; padding-right: 4px; }

    /* PRODUCTLIST PAGER */
    .ProductPagerWrapper { }
        .ProductPagerWrapper .ddlProductCountPerPage { font-size: 16px; }
        .ProductPagerWrapper .GridView { padding-top: 10px; }
        .ProductPagerWrapper .ListView { padding-top: 10px; }

    /* PRODUCT LIST */
    .ProductListWrapper.ListView { }
        .ProductListWrapper.ListView .ProductListItemWrapper { }
        .ProductListWrapper.ListView .ProductListItemContent .ImagePlaceholder {  }
        .ProductListWrapper.ListView .ProductListItemContent .ProductPlaceholder { }
        .ProductListWrapper.ListView .ProductListItemContent .PricePlaceholder {  }
        .ProductListWrapper.ListView .ProductListItemContent .ImagePlaceholder a { padding-left: 5px; max-width: 100%; padding-top: 10px; }
        .ProductListWrapper.ListView .ProductListItemContent .Title { font-size: 13px; margin-bottom: 10px; }
        .ProductListWrapper.ListView .ProductListItemContent .Description { font-size: 11px; margin-bottom: 20px; }
        .ProductListWrapper.ListView .ProductListItemContent .Price { float: left; margin-bottom: 10px; font-size: 12px; }
        .ProductListWrapper.ListView .ProductListItemContent .AddToCart { clear: none; float: right; padding: 8px; padding-left: 20px; padding-right: 20px; margin-top: -10px; }

    /* PRODUCT GRID */
    .ProductListWrapper.GridView .ProductListItemContent { }

        .ProductListWrapper.GridView .ProductListItemContent .Title { font-size: 13px; margin-bottom: 10px; }
        .ProductListWrapper.GridView .ProductListItemContent .AddToCart { }

    .PagingBarWrapper .Pager { float: left; padding: 5px; padding-left: 8px; padding-right: 8px; border: 1px solid #ddd; margin-right: 3px; cursor: pointer; }
    .PagingBarWrapper .PagerMulti { float: left; padding: 5px; padding-left: 5px; padding-right: 5px; border: 1px solid #ddd; text-transform: uppercase; }
    .PagingBarWrapper .PagerNext { float: left; padding: 5px; padding-left: 8px; padding-right: 8px; border: 1px solid #ddd; text-transform: uppercase; margin-left: 3px; cursor: pointer; margin-left: 1px; }
        .PagingBarWrapper .PagerNext:before { content: ''; }



    /* PRODUCT VIEW */
    .ProductWrapper .ProductItem .ImagePlaceholder { }
    .ProductWrapper .ProductItem .ProductPlaceholder { }
    .ProductWrapper .ProductItem .OrderPlaceholder { }
    .ProductWrapper .ProductItem select { font-size: 16px; }
    .ProductWrapper .ProductItem input.Amount { font-size: 16px; }

    /* ADD TO CART POPUP */
    .AddToCartPopup { font-size: 10px; line-height: 16px; width: 100%; padding-top: 2px; padding-bottom: 2px; }
    .ProductListWrapper.GridView .ProductListItemContent .AddToCartPopup { }
    .ProductListWrapper.ListView .ProductListItemContent .AddToCartPopup { right: 0px; width: auto; top: 20px; }

    .AddToCartPopup.SUCCESS:before {  }
    .AddToCartPopup.ERROR:before { }
    .AddToCartPopup.INFO:before {  }
    .AddToCartPopup.WARNING:before {  }

    /* TABS */
    .TabNavWrapper { margin-top: 10px; }
        .TabNavWrapper ul { }
            .TabNavWrapper ul li { padding-left: 5px; padding-right: 5px; }
                .TabNavWrapper ul li span { padding-left: 5px; padding-right: 5px; }

    /* CART */
    .CartNavWrapper .CartStep { width: 100%; padding: 0px; padding-left: 20px; font-size: 12px; height: 41px; border: 0; border-bottom: 1px solid #ddd; }
        .CartNavWrapper .CartStep:before { padding-right: 10px; }
        .CartNavWrapper .CartStep.CartStepSelected { width: 100%; padding-left: 20px; }
        .CartNavWrapper .CartStep.Done { padding-left: 20px; }
        .CartNavWrapper .CartStep:last-child { border-bottom: 0px solid #ddd; }

    .CartTableWrapper .QuantityWrapper {  width: 30%;  }
    .CartTableWrapper .PerPriceWrapper {  width: 22%;  }
    .CartTableWrapper .TotalPriceWrapper { width: 23%;  }
    .CartTableWrapper .EnviromentPriceWrapper {  width: 12%;  }
    .CartTableWrapper .DeleteItemWrapper {  width: 13%;  }
       

    .CartActionWrapper { width: 100%; clear: both; }
        .CartActionWrapper .Button { width: 100%; }

    /* LOGIN */
    .OuterLoginWrapper { }
    .InnerLoginWrapper { }
    .LoginBox { width: 100%; padding: 0px; margin-bottom: 20px; }

    /* SHOPPING LIST - MY PAGE */
    .FormOneLine input[type=text] { width: 100%; }
    .FormOneLine input.Button { width: 100%; }
    .FormOneLine select.ddlMinehandlelister { width: 100%; }
    .Form.SelectedList input[type=text] { width: 100%; }
    .Form.SelectedList textarea { width: 100%; }

    .Form.SelectedList .ActionButtons input { width: 100%; }

    /* CUSTOMADDTOCARTPOPUP */
    .CustomAddToCartPopupOuterWrapper { }
    .CustomAddToCartPopupInnerWrapper { min-width: 160px; max-width: 220px; }

    .SignatureWrapper {width:100%;}
    .SignatureWrapper .Button {min-width:50px; width:310px;}
    .SignatureWrapper .imgSignature {min-width:100%; width:310px;}

    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper span { border-bottom:1px solid #ddd; }
    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper label { width:30%; margin-left:0; padding-left:0; box-sizing:border-box;  }
    .QuickCartInnerWrapper .QuickCartItem .ExtraFieldsWrapper input[type=number] { width:70%; }

    /* FOOTER */
     .FooterLeft {width:100%;}
    .FooterLeft span { clear:left; margin-bottom:5px; font-size:1.2rem;}
    .FooterLeft a { font-size:1.2rem;}
}
