*,*::after,*::before{
    margin:0;
    padding:0;
    box-sizing: border-box;
}
:root{
    /* ------ zabezpieczenie przed double click na mobile---------------- */    
    touch-action: manipulation;
}
.navbar-default{
    display:none;
}
html, body{
    /* background-color: rgb(245,245,245); */
    /* background:linear-gradient(45deg, rgb(200,0,200), rgb(0,0,200)); */
    /* background:linear-gradient(45deg, rgb(100,100,100), rgb(50,50,50),rgb(150,150,150)); */
    /* background:linear-gradient(45deg, rgb(50,50,50), rgb(255,0,0),rgb(50,50,50)); */
    /* background:linear-gradient(90deg, rgb(50,50,50), rgb(120,120,120),rgb(50,50,50)); */
    /* font-size:16px; */
    font-size:4vw;

    font-family: 'Montserrat', sans-serif;
    /* -------global------------- */
    --link_a_color:rgba(255, 255, 255, .8);
    --link_a_hover_shadow:rgba(255, 0, 0, .6);
    --link_a_hover_backgound:rgba(255, 0, 0, .53);
    /* -------header------------- */
    --header_height: 4.3em;
    /* --header_height_mobile: 5em; */
    /* --header_height_mobile_for_nav: 4.5em; */
    /* --header_height_mobile_modal: 5.0em; */
    /* --header_height_mobile_margin: 5.5em; */
    --header_height_mobile: 4.6em;
    --header_height_mobile_for_nav: 4.1em;
    --header_height_mobile_modal: 4.6em;
    --header_height_mobile_margin: 5.1em;
    --mobile_nav_container_height:92%;

    --header_height_desktop: 5em;
    --header_height_desktop_modal:5.5em;
    --header_height_desktop_margin:5.5em;
    --header_height_desktop_small: 3.2em;
    --header_height_desktop_modal_small:3.5em;
    --header_height_desktop_margin_small:3.5em;
    /* ---modals---------------------------- */
    --modal_time:.7s;
    /* --modal_time:.5s; */
    --header_size_time:.5s;



    --header_background_color:rgba(0,0,0,.8);
    --header_text_color:rgba(255, 255, 255, .8);
    --h_link_a_hover_backgound:rgba(255, 0, 0, .54);

    --side_container_opacity:.98;

    /* -----home------------------------------------------------- */
    /* --block_shadow_background:rgba(255,255,255,.5); */
    --block_shadow_background:rgba(255,255,255,.3);
    --block_shadow_filter:blur(.3em);
    --home_gray_background:rgb(240,240,240);

    /* -----footer--------------- */
    --footer_border_color:rgba(255,255,255,.2);
    --social_border_color: rgba(100, 100, 100, 1);
    --social_border_color_hover: rgb(255, 0, 0);
    --social_shadow_color:rgba(255, 0, 0, .5);

    /* ----button------------------------ */
    --btn_color1:rgb(230, 230, 230);
    --btn_color1_hover:rgb(255, 255, 255);

    --btn_color2:rgb(180, 180, 180);
    --btn_color2_hover:rgb(255, 255, 255);

    /* ------- order ----------------------------------- */
    --order_icon_height_mobile:1.6em;
    --order_icon_height_desktop:2em;

    /* -----price---------------------------------- */
    --price_color:rgb(187, 11, 11);
    --currency_color:rgb(66, 66, 66);
    --currency_size:.8em;



    overflow-x: hidden;
}

.log{
    font-size: .7rem;
    width:15em;
    text-align: center;
    color:green;    
}
/* ---------------------------------------------------------------------------------------- */
h1{
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h2{
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
h3{
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}
/* ================ uniwersalne ===================================================================================================================== */
.hide{
    display:none;
    opacity:0;
}
.container_center{
    display:flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.container_center_col{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.info_message{
    text-align: left;
    width:100%;
    padding:.5em .5em 0 .5em;
}
.info_message span{
    font-weight: bold;
    font-size: 1.2em;
    color:var(--price_color);
}
.info_message span.currency{
    font-weight: normal;
    color:var(--currency_color);
    font-size:var(--currency_size);
    padding-left:.3em;
}
.info_message span.info_big{
    font-size:1.3em;
    font-weight:bold;
    color:black;
}
.padding_top_bottom{
    padding:1em 0 .7em 0;
}
.top_margin_header{
    width:100%;
    height:var(--header_height_mobile_margin);
}
.top_margin_header_hide{
    display:none;
}
/* ============== 404 page ========================================================================================================================== */
.full_container_error{
    background:linear-gradient(45deg, rgb(150,0,0), rgb(255,0,0));
    width:100%;
    height:100vh;
    display:flex;
    align-items: center;
    justify-content: center;
}
.main_container_error{
    display:flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: rgba(0,0,0,.5);
    width:800px;
    height:30em;
    border:.01em solid rgb(50,0,50);
    border-radius: .5em;
    box-shadow: .5em .5em 3em rgba(0,0,0,.5);
    margin:1em;
}
.title_error{
    font-size:2.5em;
    color:rgb(255,230,230);
    font-weight: bold;
    text-shadow: 0 0 1em rgba(200,200,200,1);
}
.txt1_error{
    font-size: 1.5em;
    color:rgb(255,50,50);
    /* text-shadow: 0 0 1em rgba(200,0,200,1); */
    padding: .5em;
}

/* ==================== header ====================================================================================================================== */
header{
    position:fixed;
    display:flex;
    justify-content: space-between;
    align-items: center;
    top:0;
    left:0;
    width:100%;
    height:var(--header_height_mobile);
    font-size:0.9rem;
    padding:0 1em;
    background-color:var(--header_background_color);
    box-shadow: 0 0 1em .4em rgba(0, 0, 0, .4);
    color:rgba(255, 255, 255, .8);
    z-index: 2;
    -webkit-backdrop-filter: blur(.3em);
    backdrop-filter: blur(.3em);
    transition: .5s;
}
.header_logo_container{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 0 0 .4em;
}
.header_logo_img{
    height:2.6em;
    transition: .5s;
}
.back_button{
    /* content:url(/img/chevron-left.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-chevron-left' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E");
    height:1.9em;
    margin-right: 1.8em;
    /* filter:invert(80%); */
    transition: .5s;
}
.nav_basket_container{
    width:25%;
    display:flex;
    justify-content:flex-end;
    align-items: center;
    height:100%;
}
.header_basket_container{
    position: relative;
    margin: 0 1em 0 2em; 
    font-size: 1.3em;
}
.header_search_container{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width:100%;
}
.icon_search{
    /* content:url(/img/search.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
    height:2em;
    /* filter:invert(80%); */
    transition: .5s;
}
.icon_basket{
    padding: 1em;
    /* background-image:url(/img/cart.svg); */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(200,200,200)' class='bi bi-cart' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM3.102 4l1.313 7h8.17l1.313-7H3.102zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size:1.6em;
    height:1.6em;
    width:2em;
    /* filter:invert(80%); */
    transition: .5s;
}
.icon_basket_fill{
    padding: 1em;
    /* background-image:url(/img/cart-fill.svg); */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-cart-fill' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/%3E%3C/svg%3E");
    background-position:center;
    background-repeat:no-repeat;
    background-size:1.6em;
    height:1.6em;
    width:2em;
    /* filter:invert(80%); */
    transition: .5s;
}
.basket_count_show{
    display:flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top:0;
    left:2em;
    background-color: rgb(220,0,0);
    color:white;
    font-size: .6em;
    font-weight: bold;
    padding:.3em .4em;
    border-radius: 100%;
    transition:.3s;
}
/* ------header_baner--------------------------------------------------------------- */
.header_baner_cnt{
    display:flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    opacity:0;
}


/* ---------basket product added modal---------------------------------------------- */
.prod_add_to_basket_modal{
    display: none;
    /* display: flex; */
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position:fixed;    
    top:var(--header_height_mobile_modal);
    right:0;
    width:100%;
    background-color: rgba(0,0,0,.9);
    border-top:.01em solid rgb(100,100,100);
    border-bottom:.01em solid rgb(100,100,100);
    padding: 1.5em .6em 1.5em .6em;
    box-shadow: .5em .5em 1.3em .3em rgba(0, 0, 0, .5);
    transition: top var(--header_size_time), opacity var(--modal_time), background-color .05s;
    opacity:1;
}
.modal_info{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    font-size: 1.2em;
    font-weight: bold;
    color:white;
    padding:0 .7em .7em .7em;
}
.prod_add_to_basket_modal_txt{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    font-size: 1.2em;
    color:white;
    padding:.7em;
}
.modal_red_line{
    width:100%;
    height:.05em;
    background-color: rgba(255,0,0,1);
    border-bottom:.05em solid rgba(255,0,0,1);;
    margin:0 0 .8em;
}
.prod_add_to_basket_modal_container{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    text-align: left;
}
.prod_add_to_basket_modal_img{
    display:flex;
    width:100%;
    max-width: 5em;
}
.prod_add_to_basket_modal_name{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    padding: .7em;
}
/* --------basket modal (podgląd koszyka)----------------------------------------------------------------------------- */
.basket_modal{
    position:fixed;
    display: none;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    top:var(--header_height_mobile_modal);
    right:0;
    width:100%;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-y: scroll;
    max-height: 90.5vh;
    padding:0;
    transition: top var(--header_size_time), opacity var(--modal_time);
    opacity:1;
}
.basket_modal_main{
    display:block;
    /* display:flex; */
    /* align-items: center; */
    /* justify-content: flex-start; */
    /* flex-direction: column; */
    width:100%;
    /* height:100%; */
    background-color: rgba(0,0,0,.9);
    border-top:.01em solid rgb(100,100,100);
    border-bottom:.01em solid rgb(100,100,100);
    padding: 1.4em .6em .5em .6em;
}
.basket_modal_bottom{
    display:flex;
    width:100%;
}
.basket_modal_img_cnt{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%;
    max-width: 5em;
    max-height: 4em;
    background-color: white;
}
.basket_modal_container{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width:100%;
}
.basket_modal_product_container{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    text-align: left;
    margin-bottom:.2em;
}
.basket_modal_click_container{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width:96%;
    cursor: pointer;
    padding-right:.3em;
}
.basket_modal_price_container{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width:15%;
    height:100%;
    padding:.4em;
}
.basket_modal_name{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    max-width: 80%;
    padding: .2em .5em .4em .5em;
}
.basket_modal_qty{
    display: flex;
    align-items: flex-end;
    justify-content: center;
    font-weight: bold;
    color:white;
    width:100%;
    font-size:1.1em;
    margin:0 .5em;
    min-width:2em;
}
.basket_modal_qty span{
    font-weight: normal;
    font-size: .9em;
    color:rgb(200,200,200);
    padding:0 .2em;
}
.basket_modal_price{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-weight: bold;
    font-size: 1.1em;
    color:rgb(255,30,30);
}
.basket_modal_price span{
    /* display: flex; */
    /* align-items: flex-end; */
    /* justify-content: flex-end; */
    font-weight: normal;
    font-size: .6em;
    color:rgb(200,200,200);
    padding:.2em 0 .1em .2em;
}
.basket_modal_price_pp{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-size: .85em;
    font-weight: bold;
    color:rgb(220,220,220);
    padding:.2em 0;
}
.basket_modal_price_pp span{
    font-weight: normal;
    font-size: .9em;
    color:rgb(200,200,200);
    padding:0 0 0 .3em;
}
.trash{
    /* content:url(/img/trash-fill.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-trash-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
    height:1.6em;
    filter:invert(80%);
    padding:0 1em 0 1.7em;
}
.modal_gray_line{
    width:100%;
    height:.05em;
    background-color: rgb(80,80,80);
    /* margin:.5em 0 .8em; */
    margin:.5em 0;
}
.basket_modal_total_container{
    display: flex;
    align-items: center;
    width: 100%;
}
.basket_modal_total_txt{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size:1.2em;
    font-weight: bold;
    width:100%;
}
.basket_modal_total_price{
    display: flex;
    align-items: center;
    font-weight: bold;
    font-size:1.3em;
    color:rgb(255,30,30);
    padding: 0 0 0 1em;
}
.basket_modal_total_price span{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    color:rgb(200,200,200);    
    padding:0 0 0 .3em;
    font-size:.7em;
    font-weight: normal;
}
.basket_modal_buttons_container{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width:100%;
    padding:1em;
}
.basket_modal_btn_place_order{
    margin: .5em 0;
}
.basket_modal_btn_clear{
    margin: .5em 0;
    padding: .8em;
    background-color: var(--btn_color1);
    color:black;
}
.basket_modal_btn_exit{
    margin: .5em 0;
    padding: .8em;
    background-color: var(--btn_color2);
    color:black;
}
/* ----------- search modal ------------------------------------------------------------------------- */
.search_modal{
    display: none;
    /* display: flex; */
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position:fixed;
    top:var(--header_height_mobile_modal);
    right:0;
    width:100%;
    background-color: rgba(0,0,0,.9);
    border-top:.01em solid rgb(100,100,100);
    border-bottom:.01em solid rgb(100,100,100);
    padding: 1.5em .6em 1.5em .6em;
    box-shadow: .5em .5em 1.3em .3em rgba(0, 0, 0, .5);
    transition: top var(--header_size_time), opacity var(--modal_time);
    opacity:1;
}
.search_outline{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    margin-top:.5em;
    font-size:1.2em;
}
.search_outline input{
    padding:.6em 2.5em .6em .5em;
    width:100%;
    outline:none;
    border-radius: .2em;
    background-color: #eeeeee;
    font-size: 1em;
}
/* .search_outline input:focus{
    outline:none;
    border:.1em solid blue;
} */
.search_cnt{
    position: relative;
    display: flex;
    width:95%;
}
.input_search{
    text-align: left;
    margin: .2em 0 .8em 0;
    padding:.4em .5em;
    border: .05em solid rgb(200,200,200);
    border-radius: .2em;
    outline-color: var(--outline_focus_color);
    width:100%;
}
.search_icon_search{
    /* content:url(/img/search.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(25,25,25)' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
    height:1.5em;
    /* filter:invert(10%); */
}
/* --------content_modal - modal wyświetlający regulamin i inne teksty w oknie----------------------------------------------------- */
.content_modal{
    position:fixed;
    display: none;
    justify-content: flex-start;
    flex-direction: column;
    top:var(--header_height_mobile_modal);
    right:0;
    /* width:100%; */
    width:100vw;
    max-width:100vw;
    overflow-x: hidden;
    overflow-y: scroll;
    /* box-sizing:border-box; */
    /* text-overflow:ellipsis; */
    /* white-space:nowrap; */

    max-height: 90.5vh;
    padding:0;
    background-color: rgb(250,250,250);
    color:black;
    border-top:.01em solid rgb(100,100,100);
    border-bottom:.01em solid rgb(100,100,100);
    padding: 1.4em .6em .5em .6em;
    transition: top var(--header_size_time), opacity var(--modal_time);
    /* transition: top var(--header_size_time); */
}
.content_modal_main{
    /* display:flex; */
    /* align-items: center; */
    /* justify-content: flex-start; */
    /* flex-direction: column; */
    /* width:100%; */
    /* height:100%; */
    display:block;
}
.link_txt{
    color: rgb(150,0,0);
    font-weight: bold;    
    transition:.2s;
}


/* -------- HOME (strona główna) --------------------------------------------------------------------------------- */
.home_title{
    display:flex;
    justify-content: center;
    /* font-size:1.5em; */
    font-size:1.2em;
    padding:.7em 0;
    width:100%;
    color:rgb(80,80,80);
    /* background-color: rgb(200,0,0); */
    /* color:rgb(255,255,255); */
    /* animation: title_color 6s infinite; */
}
.home_title_cnt{
    position:relative;
    width:100%;
    height:2.5em;
    margin-bottom:0;
    text-transform: uppercase;
    /* background:linear-gradient(rgb(255,20,20),rgb(160,0,0)); */
    background:linear-gradient(rgb(225,0,0),rgb(200,0,0));
}
.home_title_txt{
    position:absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top:50%;
    left:50%;
    transform:translateX(-50%) translateY(-50%);
    padding: 0 .5em;
    color: rgb(255,255,255);
    min-width:16em;
    max-width:100%;
    /* animation: title_anim1 6s infinite; */
}
@keyframes title_anim1{
    0%{  }
    5%{ background-color:rgba(0,0,0,0); text-shadow:0 0 1em .5em white;  }
    50%{ background-color: rgba(0,0,0,.04);  }
    100% {  }
}
.home_title2{
    position:absolute;
    top:0;
    left:0;
    width:3%;
    height:100%;
    /* background:linear-gradient(rgb(100,100,100),rgb(70,70,70)); */

    /* border-top:1.7em solid rgb(200,0,0); */
    /* border-right:1.7em solid transparent;     */
}
.home_title3{
    position:absolute;
    bottom:0;
    right:0;
    width:3%;
    height:100%;
    /* background:linear-gradient(rgb(100,100,100),rgb(70,70,70)); */

    /* background-color: rgb(200,0,0); */
    /* border-bottom:1.7em solid rgba(200,0,0,1); */
    /* border-left:1.7em solid transparent; */
}
@keyframes title_color{
    0%{  }
    5%{  color:rgb(200,0,0); text-shadow: 0 0 1em rgba(255,30,30,.4); }
    50%{ color:rgb(150,50,50); }
    100% {  }
}
/* @keyframes title_color{
    0%{  }
    5%{  color:rgb(0,0,0); text-shadow: 0 0 1em rgba(0,0,0,.4); }
    50%{ color:rgb(80,80,80); }
    100% {  }
} */
.home_txt1{
    display:flex;
    justify-content: center;
    align-items: center;
    /* text-align: center; */
    font-size:1em;
    padding:.7em .7em 1em .7em;
    width:100%;
    max-width:100%;
    color:rgb(100,100,100);
}
/* ---img_otm = image of the month--------------- */
.img_otm_container{
    position: relative;
    display:flex;
    align-items: center;
    flex-direction: column;
}
.img_otm_container img{
    width:100%;
}
.img_otm_text_container{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    background-color: rgba(0, 0, 0,.5);
    color:white;
    opacity: .8;
    padding:.3em .5em .5em .5em;
    font-size:.8em;
}
.img_otm_name{
    display:flex;
    justify-content: flex-start;
    font-size:1em;
    font-weight: bold;
}
.img_otm_description{
    display:flex;
    justify-content: flex-start;
    font-size: .8em;
    color:rgb(230,230,230);
    padding:0;
}
.img_otm_author{
    display:flex;
    justify-content: flex-start;
    color:rgb(200,200,200);
    font-size: .85em;
}
.img_otm_author span{
    /* font-weight: bold; */
    color:rgb(230,230,230);
    margin-left:.5em;
}
/* ----blog article-------------------------------------------------- */
.blog_article_header{
    position: relative;
    height:20em;
    width:100%;
    background-position: center;
    background-size: cover;
    box-shadow: 0 0 2em rgba(0,0,0,.5);
    margin-bottom:1.5em;
}
.blog_article_title_cnt{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    color:rgb(80,80,80);
    width:100%;
    /* font-size: 1.2em; */
    padding:0 .5em;
}
.blog_article_title{
    font-size:1.3em;
    font-weight: bold;
    color:rgb(0,0,0);
    padding:.2em 0 1em 0;
    margin:0;
}
.blog_article_date{
    text-justify: left;
    font-size:.9em;
    color:rgb(100,100,100);
}
.blog_article_content{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    padding:0 .5em;
    font-size:.95em;
    width:100%;
}

/* ------- dla starej testowej strony about -------------------------------------------------------------------------------------------------- */
section{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction: column;
    width:100%;
    margin:.3em;
}
.home_baner_container{
    background-size:150vw auto;
    background-repeat: no-repeat;
    background-position: center top;
    background-attachment: fixed;
    /* background-position-y: -8em; */
    height: 20em;
    width:100%;
}
.home_baner_shadow{
    position:relative;
    text-align: center;
    width:100%;
    height: 100%;
    background-color: rgba(0,0,0,.1);
}
.home_baner_shadow2{
    position:absolute;
    left:0;
    bottom:0;    
    width:100%;
    height: 30%;
    background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4));
}
.home_baner_txt_cnt{
    position:absolute;
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--block_shadow_background);
    color:rgb(0,0,0);
    max-width:85%;
    width:28em;
    top:50%;
    left:50%;
    transform:translateX(-50%) translateY(-30%);
    padding:2.6em 1em 3em 1em;
    -webkit-backdrop-filter: var(--block_shadow_filter);
    backdrop-filter: var(--block_shadow_filter);
    animation: fade_in1 1s;
}
.home_baner_txt_cnt h1{
    padding:0;
    margin:0;
    font-size:1.7em;
    transform: scale(0.5);
    animation: scale 1.5s forwards cubic-bezier(0.5, 1, 0.89, 1);;
}
.home_baner_txt_cnt p{
    margin:0 auto;
    padding:.2em 0 .8em 0;
    color:rgb(0,0,0);
    text-shadow: 0 0 .6em rgb(200,200,200);
    transform: scale(0.6);
    animation: scale 2s forwards cubic-bezier(0.5, 1, 0.89, 1);
}
.home_baner_txt_cnt button{
    width:60%;
}
.btn_intro{
    border:none;
    cursor: pointer;
    border-radius: 0;
    width:80%;
    /* font-weight: bold; */
}
/* -------------------------------------------------------------------------------------------- */




/* ------- ORDER (ZAMÓWIENIE) - osobna strona -------------------------------------------------------------------- */
.order_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
}
.order_header{
    width:100%;
}
.order_title{
    font-size: 1.5em;
    font-weight: bold;
    margin:1em 0;
    padding-bottom:1em;
    color:rgb(66, 66, 66);
    text-align:center;
    border-bottom:.05em solid rgb(66, 66, 66);
}
.order_title2{
    font-size: 1.4em;
    font-weight: bold;
    margin:1em;
    color:rgb(66, 66, 66);
    text-align:center;
}
.order_txt{
    font-size: .6em;
    font-weight: bold;
    margin:.45em;
    color:rgb(66, 66, 66);
    text-align:center;
}
/* ----- order icon bar ------------------------------------- */
.order_icon_bar_container{
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
}
.order_icon_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.order_icon_container2{
    display: flex;
    justify-content: center;
    align-items: center;
    padding:.8em;
    margin:.2em;
    border:.12em solid rgb(80,80,80);
    border-radius:100%;
    transition: .2s;
}
.order_icon_right{
    /* content:url(/img/capslock.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-capslock' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M7.27 1.047a1 1 0 0 1 1.46 0l6.345 6.77c.6.638.146 1.683-.73 1.683H11.5v1a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1v-1H1.654C.78 9.5.326 8.455.924 7.816L7.27 1.047zM14.346 8.5 8 1.731 1.654 8.5H4.5a1 1 0 0 1 1 1v1h5v-1a1 1 0 0 1 1-1h2.846zm-9.846 5a1 1 0 0 1 1-1h5a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1v-1zm6 0h-5v1h5v-1z'/%3E%3C/svg%3E");
    height:1.1em;
    transform: rotate(90deg);
    filter:invert(30%);
    margin:.5em;
}
.order_icon_basket{
    /* content:url(/img/cart-fill.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-cart-fill' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/%3E%3C/svg%3E");
    height:var(--order_icon_height_mobile);
    filter:invert(26%);
}
.order_icon_user{
    /* content:url(/img/person-check-fill.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-person-check-fill' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M15.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L12.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0z'/%3E%3Cpath d='M1 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'/%3E%3C/svg%3E");
    height:var(--order_icon_height_mobile);
    filter:invert(26%);
}
.order_icon_delivery{
    /* content:url(/img/truck.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-truck' viewBox='0 0 16 16'%3E%3Cpath d='M0 3.5A1.5 1.5 0 0 1 1.5 2h9A1.5 1.5 0 0 1 12 3.5V5h1.02a1.5 1.5 0 0 1 1.17.563l1.481 1.85a1.5 1.5 0 0 1 .329.938V10.5a1.5 1.5 0 0 1-1.5 1.5H14a2 2 0 1 1-4 0H5a2 2 0 1 1-3.998-.085A1.5 1.5 0 0 1 0 10.5v-7zm1.294 7.456A1.999 1.999 0 0 1 4.732 11h5.536a2.01 2.01 0 0 1 .732-.732V3.5a.5.5 0 0 0-.5-.5h-9a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .294.456zM12 10a2 2 0 0 1 1.732 1h.768a.5.5 0 0 0 .5-.5V8.35a.5.5 0 0 0-.11-.312l-1.48-1.85A.5.5 0 0 0 13.02 6H12v4zm-9 1a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm9 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E");
    height:var(--order_icon_height_mobile);
    filter:invert(26%);
}
.order_icon_checkout{
    /* content:url(/img/clipboard-check.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-clipboard-check' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0z'/%3E%3Cpath d='M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z'/%3E%3Cpath d='M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z'/%3E%3C/svg%3E");
    height:1.4em;
    margin:.1em;
    filter:invert(26%);
}
/* -----icon selected----------------- */
.order_icon_container_selected{
    background-color: rgb(215,0,0);
    border-color: rgb(215,0,0);
}
.order_icon_selected{
    filter:invert(100%);
}
/* ----------------------------------- */
.order_content_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    margin:0;
    padding:0;
}
.order_buttons_container{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    font-size:1.3em;
    padding:.5em;
}
/* ------- BASKET (główny koszyk na stronie order)--------------------------------------------- */
.basket_container{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width:100%;
    margin:0;
    padding:.3em;
    font-size: 1.3em;
}
.basket_container_checkout{
    width:100%;
}
.basket_product_out_container{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width:100%;
    margin:0;
    padding:0;
}
.basket_product_container{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    text-align: left;
    margin-bottom:.2em;
}
.basket_product_description_container{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    margin-left:.2em;
}
.basket_left_line_container{
    display:flex;
    align-items: flex-start;
    justify-content: space-between;
    width:100%;
}
.basket_right_line_container{
    display:flex;
    align-items: center;
    justify-content: space-between;
    width:100%;
}
.basket_left_line_container_modal{
    display:flex;
    align-items: flex-start;
    justify-content: space-between;
    width:96%;
}
.basket_right_line_container_modal{
    display:flex;
    align-items: center;
    justify-content: space-between;
    width:100%;
}
.basket_line_container_checkout{
    display:flex;
    align-items: flex-start;
    justify-content: space-between;
    width:100%;
}
.basket_line_desktop{
    margin:1em;
}
.basket_img_cnt{
    display:flex;
    justify-content: center;
    align-items: center;
    min-width:3.5em;
}
.basket_img_cnt_checkout{
    display:flex;
    justify-content: center;
    align-items: center;
    min-width:3.3em;
}
.basket_img{
    display:flex;
    max-width: 3.7em;
    cursor: pointer;
}
.basket_img_checkout{
    display:flex;
    max-width: 3.3em;
}
.basket_name{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    max-width: 70%;
    padding: .2em;
    font-size:.65em;
}
.basket_name_checkout{
    max-width: 60%;
}
.basket_qty_price_container{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width:40%;
    margin:0;
    padding:0;
}
.basket_qty_container{
    display: flex;
    align-items: center;
    justify-content: center;
}
.basket_qty_container_pv{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size:1.3em;
    padding:.4em 0 .2em 0;
}
.basket_qty_button{
    display:flex;
    align-items: center;
    justify-content: center;
    padding:.5em;
    background-color: rgb(240,240,240);
    width:2em;
    height:2em;
    border-radius: 100%;
    color:rgb(100,100,100);
    transform: 1.2s;
}
.qty_button_hide{
    background-color: rgb(250,250,250);
    color:rgb(200,200,200);
}
.basket_qty_button_modal{
    display:flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(160,160,160,.25);
    border:.01em solid rgba(240,240,240,.3);
    color:rgb(200,200,200);
    font-weight: bold;
    font-size: 1.4em;
    /* width:3em; */
    min-width:2em;
    max-width:2em;
    min-height:2em;
    max-height:2em;
    border-radius: 100%;
    transform: 1.2s;
    /* padding:.5em; */
    padding:0;
    margin:0 .5em;
}
.qty_button_hide_modal{
    background-color: unset;
    border:.01em solid rgb(80,80,80);
    color:rgb(120,120,120);
}
.qty_button_click{
    background-color: rgb(255,0,0);
    color:white;
}
.basket_qty{
    display: flex;
    align-items: flex-end;
    justify-content: center;
    font-weight: bold;
    font-size:.9em;
    padding: .2em;
    margin:0 .5em;
    min-width:3em;
}
.basket_qty_checkout{
    margin:0;
    min-width:0;
}
.basket_qty span{
    font-weight: normal;
    font-size: .8em;
    color:rgb(100,100,100);
    padding:.1em;
}
.basket_price{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-weight: bold;
    color:rgb(200,0,0);
    font-size: .8em;
    padding: .2em;
}
.basket_price span{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-weight: normal;
    font-size: .6em;
    color:rgb(100,100,100);
    padding:0 0 .15em .3em;
}
.basket_trash{
    display: flex;
    /* content:url(/img/trash-fill.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-trash-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
    height:1em;
    filter:invert(30%);
    margin:0 .5em 0 1.7em;
}
.basket_gray_line{
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.2em 0;
}
.basket_total_container{
    display: flex;
    align-items: center;
    width: 100%;
}
.basket_line{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    margin: .5em 0;
}
.basket_info_txt{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:1em;
    color:rgb(100,100,100);
    margin:1em;
}
.basket_total_txt{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size:1em;
    font-weight: bold;
    width:100%;
}
.basket_total_price{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    font-weight: bold;
    font-size:1em;
    color:rgb(200,0,0);
    padding: 0 0 0 1em;
}
.basket_total_price span{
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    color:rgb(100,100,100);    
    padding:0 0 .15em .2em;
    font-size:.6em;
    font-weight: normal;
}
.basket_icon_basket{
    /* content:url(/img/cart.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(120,120,120)' class='bi bi-cart' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM3.102 4l1.313 7h8.17l1.313-7H3.102zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/%3E%3C/svg%3E");
    height:1.6em;
    width:2em;
    /* filter:invert(20%); */
}
/* ----------basket checkout---------------------------------------------------------------------- */
.basket_txt_title{
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size:.9em;
    margin-bottom:.2em;
    color:rgb(100,100,100);
}
.basket_txt_title2{
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size:.9em;
    margin:.5em 0;
    color:rgb(100,100,100);
    width:100%;
}
.basket_txt1{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:.8em;
    margin:.2em 0 .5em 0;
    color:rgb(100,100,100);
}
.delivery_line_checkout{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    /* height: 100%; */
    margin: .2em 0;
}
.delivery_img_container_checkout{
    display:flex;
    align-items: center;
    justify-content: center;
    margin:0;
}
.delivery_img_checkout{
    display:flex;
    width:100%;
    max-width:7em;
}
.delivery_locker_nr_checkout{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    width:100%;
    font-size:.7em;
    margin:.4em 0 0 0;
}
.delivery_locker_nr_checkout span{
    font-weight:normal;
    color:rgb(100,100,100);
}
/* -------user_data checkout-------------------------------------------------------------------------- */
.form_data_container_checkout{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width:100%;
}
.checkout_dane_i_wysylka_container{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width:100%;
    padding:0 .5em;
}
.checkout_data_container{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: normal;
    padding-bottom: .5em;
    border-radius:.3em;
}
.show_order_comment_container{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: normal;
    padding-bottom: .5em;
    border-radius:.3em;
}
/* ---------payment methods checkout------------------------------------------------------------------- */
.payments_container{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    padding:0 .5em;
}
.payment_line_container{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    margin:.4em 0;
    font-size:1.3em;
}
.payment_radio{
    display:flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width:20%;
    padding:0 .5em 0 .2em;
    margin:0;
}
.payment_name_description_container{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    width:100%;
    padding-left:1em;
    margin:0;
}
/* ----------------------------------------------------------- */
.checkout_order_comment{
    font-size: 1em;
    text-align: left;
    width:100%;
    min-width: 100%;
    max-width: 100%;
    min-height: 5em;
    max-height: 15em;
    margin:.5em 0 1em 0;    
    padding:.5em;
    border: .05em solid rgb(200,200,200);
    border-radius:.5em;
    outline-color: var(--outline_focus_color);
    box-shadow: 0 .2em .5em rgba(0,0,0,.2);
}
.checkout_order_comment:focus{
    outline:none;
    border:.07em solid blue;
}
/* ----------checkout (ZAMÓWIENIE)------------------------------------------------------------------------------------ */
/* -----warning message (pusty koszyk, źle wypełnione formularze itd)-------------------- */
.warning_container{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    border:.01em solid rgb(150,150,150);
    border-radius: .1em;
    font-size:1.1em;
    margin:.5em;
    padding:.5em;
    width:90%;
    box-shadow: 0 0 1em rgba(0,0,0,.3);
}
.warning_line1{
    background-color: rgb(200,0,0);
    color:white;
    font-weight: bold;
    width:100%;
    padding:.5em;
    margin:0;
}
.warning_line2{
    font-size:.9em;
    margin-top:1em;
}

/* ---------- PLACE ORDER MESSAGE (style są też w mailu)------------------------ */
.ud_title{font-weight:bold;margin:.5em 0 .7em 0;color:rgb(100,100,100);padding:0;}
.plc{width:100%;}.plc span{color:#5a5a5a;font-size:.9em;font-weight:normal;}.plc_red{width:100%;color:rgb(200,0,0);}
.cnt_margin1{margin:0 0 1em 0;}.cnt_margin05{margin:0 0 .5em 0;}
.gl02{width:100%;border-bottom:.05em solid rgb(220,220,220);margin:1.5em 0;}
.txt_important{font-weight:bold;padding:.4em 0;}


/* --------nav (nawigacja)-------------------------------------------------------------------------------------------- */
.container_nav_toggle{
    width:25%;
    display:flex;
    justify-content: flex-start;
    align-items: center;
    background-color: transparent;
    font-size: 2em;
    margin: 0 .3em;
}
.icon_x{
    display:none;
    /* content:url(/img/x.svg); */
    /* content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-x' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E"); */
    /* height:1em; */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-x' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size:1em;
    height:1em;
    width:.5em;
    padding:.5em;
}
.icon_dots{
    /* content:url(/img/three-dots-vertical.svg); */
    /* content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-three-dots-vertical' viewBox='0 0 16 16'%3E%3Cpath d='M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z'/%3E%3C/svg%3E"); */
    /* height:1em; */
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(200,200,200)' class='bi bi-three-dots-vertical' viewBox='0 0 16 16'%3E%3Cpath d='M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size:1em;
    height:1em;
    width:.5em;
    padding:.5em;
}
.nav_links{
    display: none; 
    list-style: none;
}
.nav_link{
    display:flex;
    justify-content: center;
    align-items: center;    
    width:5.5em;
    height:4rem;
} 
.nav_link a{
    text-decoration: none;
    text-transform: uppercase;
    color:var(--header_text_color);     
    transition: 0.3s;
    padding: .3em .6em;
    border:solid 0 rgba(221, 0, 0, .2);
    border-radius: .1em;
}
.nav_link a:hover{
    color:var(--link_a_color);
    box-shadow: 0 0 1em .6em var(--link_a_hover_shadow);
    background-color: var(--h_link_a_hover_backgound);
    border:solid 1px rgb(221, 0, 0);
    font-weight: 600;
}
.nav_links_active{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position:absolute;    
    top:var(--header_height);
    padding:.6em 0;
    left:0;    
    width:100%;
    background-color: var(--header_background_color);
    transition: left .5s ease-in-out;
}  
.mobile_nav_show{
    animation: anim_nav_show .6s;
} 
.mobile_nav_hide{
    animation: anim_nav_hide .6s;
}
@keyframes anim_nav_show{
    from{ left:100%; opacity:0.6; }
    to{ left:0%; opacity:var(--side_container_opacity); }    
}
@keyframes anim_nav_hide{
    from{ left:0%; opacity:var(--side_container_opacity); }
    to{ left:100%; opacity:0.6; }
}

/* ============ główny content strony (main container) =============================================================================================== */
.main_container_with_sidebar{
    display: flex;
    justify-content: center;
    align-items:flex-start;
    flex-direction: row;
    margin:0 auto;
    width:100%;
    background-color: rgba(255,255,255,.2);
    opacity:0;
}
.main_container{
    display: flex;
    justify-content: center;
    align-items:center;
    flex-wrap: wrap;
    margin:0 auto;
    width:100%;
    min-height:10em;
}
.about_us{
    height:18em;
    width:100%;
    background-image:url(/img/header7b.jpg);
    background-position: center;
    background-size: cover;
    color:#fff;
    box-shadow: 0 0 2em rgba(0,0,0,.5);
}
.container_about_us{
    position:relative;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,.2);
    display: flex;
    justify-content: center;
    align-items: flex-start;
}
.title_txt{
    position:absolute;
    bottom:0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-shadow: 0 0 1em rgb(0,0,0);
    background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));
    width:100%;
    padding: 3em 0;
}
.txt_underline_red{
    font-size: 1.8em;
    font-weight: bold;    
    padding:0 0 .06em 0;
    margin:0;
    border-bottom: .16em solid red;
    text-align: center;
    text-transform: uppercase;
    color:#fff;
    text-shadow: 0 0 1em rgba(255,255,255,.7);
}
.txt_under_title{
    text-align: center;
    margin:1.5em 0;
    padding:.6em;
    color:rgb(200, 200, 200);
    font-size: 1.2em;
}   
.intro_about_us{
    margin-top:1.5em;
    margin-bottom:0.5em;
}
.intro_about_us p{
    padding:.5em;
}
.projects{
    width:100%;    
    margin: 1em 0;
    background-image: url(/img/224977684_1696816053852021_5197893036426424400_n.jpg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-color:black;
}
.projects_shadow{    
    padding:2em .4em .4em .4em;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    background-color: rgba(0,0,0,0.7);
    box-shadow: 5px 5px 5px rgb(0 0 0 / 30%);   
}
.all_projects_container{
    width:100%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
}
.project_container{
    display: flex;
    width:100%;
    justify-content: center;
    flex-wrap: wrap;
    margin-top:2em;
}
.project{
    margin-bottom: 1em;
    width:96%;
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center; 
    text-align: left;
    border: 1px solid white; 
    border-radius: .4em;
    box-shadow: 0 0 2em .4em rgba(0, 0, 0, .5);
    background-color: white;
    transition: transform 0.3s;
}
.project:hover{
    transform: scale(0.97);
}
.img_container{
    width:100%;   
}
.img_container img{
    width:100%;
    border-radius: .4em .4em 0 0;
}
.img_container h5{
    margin:1em 0 0 0;
    text-transform: uppercase;
    font-size: 1rem;
    text-align: center;
}
.content_container{
    padding: 1em 1em;
    height:100%;
}
/* -------static content------------------------------------------------------------ */
.static_content_header{
    height:18em;
    width:100%;
    /* background-position:center bottom; */
    background-position:center center;
    background-size: cover;
    color:#fff;
    box-shadow: 0 0 2em rgba(0,0,0,.5);
    margin-bottom:2em;
}
.static_content_title{
    font-size:1.5em;
    text-align: center;
    padding-bottom:1em;
    margin:0;
}

/* ================================= side-bar ================================================================================ */
.mobile_nav_container{
    position: fixed;
    top:var(--header_height_mobile_for_nav);
    left:120%;
    height:var(--mobile_nav_container_height);
    width:100%;
    display:flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index:2;
}
.side_container{
    top:0;
    left:0;
    display:flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
    background-color: black;
    width:100%;
    font-size:1em;
    padding:.4em;
    border-radius:.2em;
    box-shadow: .5em .5em 1em .3em rgba(0, 0, 0, .3);
    opacity:var(--side_container_opacity);
}
.category_menu_container{
    width:100%;
    margin:0;
    padding:0;
}
.mobile_nav_container_desktop{
    width:100%;
}
/* ----menu dodatkowe dla SKLEP (pod kategoriami w mobile nav)------------- */
.nav_menu_addon{
    display:flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
    width:100%;
    height:100%;
}
.side_item{
    display:flex;
    justify-content: space-between;
    align-items: center;
    margin:.06em;
    color:rgba(255, 255, 255, .9);
    background-color:rgb(70, 70, 70);
    width:100%;
    height:3em;
    border-radius: .2em;
    font-size: 1em;
}
.side_item_click{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    width:100%;
    height:100%;
}
.side_item_click_m{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    width:100%;
    height:100%;
}
.side_item_txt{
    padding:.4em;
    margin:.4em;
    border:solid .1em rgba(255, 0, 0, 0);
    border-radius: .2em;
}
.side_item_txt_click{
    animation: category_press_animation 1.3s;
}
@keyframes category_press_animation{
    0%{

    }
    1%,20%{
        border:solid .1em rgba(255, 0, 0, .8);
        background-color: rgba(255, 0, 0, .3);
        box-shadow: 0 0 1.5em .4em rgba(255, 0, 0, .4);
        color:white;
    }
    100%{
    }
}
.side_open_icon_container{
    display:flex;
    justify-content:flex-end;
    align-items: center;
    width:4em;
    height:100%;
    margin-right:.3em;
}
.side_open_icon{
    /* content:url(/img/chevron_right.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-chevron-right' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    height:1.2em;
    margin-right: .4em;
    filter:invert(100%);
    opacity:.8;
}
.side_open_icon_active{
    opacity:1;
}
.lm{ font-weight: bold; background-color: rgb(90, 90, 90); }
.l0{ font-weight: bold; }
.l1{ background-color: rgb(50, 50, 50); }
.l2{ background-color: rgb(42, 42, 42); }
.l3{ background-color: rgb(35, 35, 35); }
/* ------ side_sub ---------------------------------------- */
.side_sub{
    display:flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items:flex-end;
    width:93%;
    background-color: black;
    margin-left:6%;
    padding:0;
    clip:rect(0,0,0,0);
    clip-path:inset(0 0 0 0);
    overflow: hidden;
}
.side_hide{
    display:none;
}
.sidebar_hide{
    display:none;
}
.sidebar_item_clicked_desktop{
    background-color: rgb(230, 230, 230);
    /* background-color: rgb(255, 0, 0);     */
    /* color:white; */
    /* font-weight: bold; */
    /* border-color: rgb(200,0,0); */
    /* border:none; */
    /* width:100%; */
}


/* ==================== footer ====================================================================================================================== */
footer{    
    margin:0 auto; 
    color:#f0f9ff;
    background-image:url(/img/footer_m.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    box-shadow: 0 0 2em .4em rgba(0, 0, 0, .5);
    opacity:0;    
}
.footer_container_wrapper{
    margin:0 auto;
}
.footer_background{
    width: 100%;
    padding:.8em 1.5em;
    background-color: rgba(0, 0, 0,.6);
}
.footer_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.footer_feature{
    display:flex;
    justify-content:center;
    align-items: center;
    flex-direction: column;
    margin:10px;
    padding:10px;
    width:100%; 
    background-color:rgba(0,0,0,0.6);
    border-radius: 11px;
    border:solid .1vw var(--footer_border_color);
    -webkit-backdrop-filter: blur(.3em);
    backdrop-filter: blur(.3em);
}
.footer_logo{
    height:70px;
    opacity:.8;
    border-radius: .3em;
    margin:10px 0;
    box-shadow: 0 0 20px 7px rgba(255, 255, 255, .4);
}
.footer_social_container{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    margin:1.5em 0 0 0;
    padding:2em 0 0 0;
    text-align: center;   
    border-top: .1vw solid var(--footer_border_color);
}
.footer_social_circle{
    display:flex;
    justify-content: center;
    align-items: center;

    font-size: 22px;
    width:45px;
    height: 45px;
    line-height: 45px;
    border-radius: 50%;
    border: 2px solid var(--social_border_color);
    margin:1vw 2vw;
    color:#fff;
    opacity:0.6;
    transition: 0.3s ease-in-out;
}
.footer_social_circle_red_blink{
    opacity: 1;
    border: 2px solid var(--social_border_color_hover);
    box-shadow: 0 0 .6em .4em var(--social_shadow_color);
}
.footer_social_icons{
    display:flex;
    justify-content:center;
    align-items: center;
}
footer .copyright{
    text-align: center;
    padding-top: 0;
    font-weight: 700;
    opacity: 0.8;
    font-size: 16px;
    margin-top:1vw;
    color:rgba(255, 255, 255, .6)
}
.img_fb{
    content:url(/img/facebook-f-brands.svg);
    width:32%;
    filter: invert(100%);
}
.img_twitter{
    content:url(/img/twitter-brands.svg);
    width:50%;
    filter: invert(100%);
    padding: 3% 0 0 5%;
}
.img_yt{
    content:url(/img/youtube-brands.svg);
    width:60%;
    filter: invert(100%);
}
footer h4{
    margin-bottom:8px;
    text-align: center;
    font-weight: 700;
    font-size: 18px;
}
footer ul{
    list-style: none;
    line-height: 25px;
    font-size: 15px;
    text-align: center;
    margin-bottom: 0;
}
footer ul a{
    color:var(--link_a_color);
    text-decoration: none;
    transition: 0.3s;
    border:0;    
    border-radius: .2em;    
}
.footer_red_blink{
    box-shadow: 0 0 1.5em .8em var(--link_a_hover_shadow);
    background-color: var(--link_a_hover_backgound);
    font-weight: bold;
    filter:brightness(1.5);
}

/* ------------KONTAKT (contact)-------------------------------------------------------------------------------------------------------------------------------------------- */
.contact_main_container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    margin-top:1.5em;
}
.title h2{
    font-size:1.5em;
    margin:1em 2em;
    padding-bottom:1em;
    color:rgb(66, 66, 66);
    text-align:center;
    border-bottom:.05em solid rgb(66, 66, 66);
}
.all_form_container{
    position:relative;
    width:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: .5em;
    box-shadow: 0 .2em .9em rgba(0,0,0,.3);
    margin-bottom:2em;
}
.contact{
    padding:1em 1em 2em 1em;
    width:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color:rgba(255,255,255,0.3);
    border-radius: .4em;
    box-shadow: 0 25px 45px rgba(0,0,0,.1);
    border: 1px solid rgba(255,255,255,0.5);
    border-right: 1px solid rgba(255,255,255,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.2);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}
.container_circles{
    position:absolute;
}
.circle_red{
    position:absolute;
    top:var(--circle_up_down);
    left:var(--circle_right_left);
    width:11em;
    height:11em;
    border-radius: 50%;
    background: linear-gradient(rgb(255,255,255) 3%, rgb(232,9,54) 55%);
    box-shadow: 0 .4em 2em rgba(0,0,0,.6);
    /* animation: anim_red_circle 6s linear infinite; */
    opacity:.3;
}
.circle_gray{
    position:absolute;
    bottom:var(--circle_up_down);
    right:var(--circle_right_left);
    width:11em;
    height:11em;
    border-radius: 50%;
    background: linear-gradient(rgba(255,255,255,.5) 3%, rgba(152,137,140,.5) 54%);
    box-shadow: 0 .4em 2em rgba(0,0,0, 0.6);
    /* animation: anim_gray_circle 6s linear infinite; */
    opacity:.3;
}
@keyframes anim_red_circle{
     0%{ top:4.5em;   height:10em }
     5%{ top:3.5em;   height:11em }
    40%{ top:-2em;    height:11em; }
    50%{ top:-3.5em;  height:10em; }
    60%{ top:-2em;    height:11em; }
    95%{ top:3.5em;   height:11em; }
    100%{ top: 4.5em; height:10em; }
}
@keyframes anim_gray_circle{
    0%{ bottom:4.5em;   height:10em }
    5%{ bottom:3.5em;   height:11em }
   40%{ bottom:-2em;    height:11em; }
   50%{ bottom:-3.5em;  height:10em; }
   60%{ bottom:-2em;    height:11em; }
   95%{ bottom:3.5em;   height:11em; }
   100%{ bottom: 4.5em; height:10em; }
}
.contact_form{ 
    display:flex;
    flex-direction:column;
    width:100%;   
    justify-content: center;
    align-items: center;
    padding: 0;
}
.contact_email_cnt{
    display: flex;
}
.email_biuro_driftshop{
    display:flex;
    background-image: url(/img/email_biuro_driftshop_pl.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width:8em;
    height:1em;
}
.contact_form_box{
    margin:1em;
    width:100%;
}
.contact_label{
    display:block;
    margin-bottom: .2em;
}
.contact_form_box input{
    padding:.5em .8em;
    width:100%;
    outline:none;
    background-color:rgb(255,255,255);
    border: .05em solid rgba(180,180,180,1);
    border-radius: .2em;
    -webkit-appearance: none;
    box-shadow: 0 .2em .7em rgba(0,0,0,.2);
    -webkit-box-shadow: 0 .2em .7em rgba(0,0,0,.2);
    font-size: 1em;
}
.contact_form_box input:focus{
    outline:none;
    border:.1em solid blue;
}
.contact_form_box textarea{
    padding:.6em .9em;
    margin-bottom:2em;
    width:100%;
    max-width:100%;
    min-width:100%;
    height:14em;
    min-height:14em;
    max-height:14em;
    color:black;
    background:none;
    border: .05em solid rgba(180,180,180,1);
    border-radius: .2em;
    -webkit-appearance: none;
    box-shadow: 0 .2em .7em rgba(0,0,0,.2);
    -webkit-box-shadow: 0 .2em .7em rgba(0,0,0,.2);
    font-size:.95em;
}
.contact_form_box textarea:focus{
    outline:none;
    border:.1em solid blue;
}
.container_shop_info{
    display: flex;
    width:100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color:rgb(66, 66, 66);
    padding-bottom: 2em;
}
.shop_info{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding:1em;
}
.shop_info span{
    font-weight: 700;
    margin-right:0.5em;
}


/* -------------------- SHOP (SKLEP) --------------------------------------------------------------------------------------------------------------------- */
.container{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width:100%;
    margin:0;
}
.container_col{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    flex-direction: column;
    margin:0;
    width:100%;
    padding:.5em;
}
.card{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-self: normal;
    width:49%;
    padding:.5em;
    margin-bottom:1em;
    text-align: left;
    margin:.5% .5% .5em .5%;
}
.card_content{
    display:flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom:.3em;
    /* max-height:50%; */
    border-radius:.4em;
    transition:.3s;
    border:.01em solid rgba(240,240,240,0);
    cursor:pointer;
}
.card_img_container{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%;
    min-height:9em;
    margin:0;
    padding:0;
    transition:.5s;
}
.card_img{
    width:100%;
    opacity: 1;
    transition:.5s;
}
.card_img_loading{
    opacity:0;
}
.no_image{
    position:relative;
    /* content:url(/img/no_image.jpg); */
    background-image: url(/img/no_image.jpg);;
    background-position:center;
    background-repeat: no-repeat;
    background-size: cover;
    height:9em;
    width:9em;
}
.no_image_basket{
    content:url(/img/no_image.jpg);
    max-height: 4em;
}
.no_image_basket2{
    content:url(/img/no_image.jpg);
    max-height: 3em;
}
.product_title_price_container{
    display:flex;
    flex-direction: column;
    justify-content: center;
}
.card_content h3{
    font-size:.9em;
    font-weight: bold;
    color:rgb(100, 100, 100);
    margin-top:.4em;
}
.product_price{
    font-weight:bold;
    font-size:1.2em;
    color:var(--price_color);
    margin:.3em 0 .2em 0;
}
.product_price .currency{
    color:var(--currency_color);
    font-size:var(--currency_size);
}
.product_description{
    padding:.5em 0;
}
button{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%;  
    outline:none;
    border-radius: .2em;
    text-transform: uppercase;
    letter-spacing: .09em;
    box-shadow: 0 .3em 1em rgba(0,0,0,.5);
    background-color: rgb(200, 0, 0);
    border:.01em solid rgba(0, 0, 0, 0);
    color:#fff;    
    font-size:.9rem;
    padding:.67rem;
    transition: 0.3s;    
    cursor:pointer;
}
.button_inactive{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%; 
    border:none;
    outline:none;
    text-transform: uppercase;   
    letter-spacing: .09em; 
    box-shadow: 0 .3em .8em rgba(0,0,0,.5);
    background-color: rgb(220, 220, 220);
    border:.01em solid rgba(0, 0, 0, 0);
    color:rgb(50,50,50);
    cursor:pointer;
    font-size:.9rem;
    padding:.67rem;
}
.button_inactive:hover{
    background-color: rgb(220, 220, 220);
    font-weight: normal;
}
.button_inactive_prod{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%; 
    border:none;
    outline:none;
    text-transform: uppercase;   
    letter-spacing: .09em; 
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
    background-color: rgb(220, 220, 220);
    border:.01em solid rgba(0, 0, 0, 0);
    color:rgb(50,50,50);
    cursor:pointer;
    font-size:.9rem;
    padding:.67rem;
}
.wypelniacz_dn{
    width:100%;
    height:100%;
}
.wypelniacz{
    width:100%;
    height:12em;
}
.wypelniacz2{
    width:100%;
    height:20em;
}

/* ---------------- PAGINACJA ------------------------------------------------------------------------------- */
.pagination_container{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    width:100%;
    padding:.5em;
}
.pagination_button{
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: none;
    width:2.25em;
    padding:.5em;
    margin:.2em;
    cursor: pointer;
    transition:.1s;
    color:rgb(150,150,150);
    border-radius: .2em;
}
.pagination_button:hover{
    background-color: rgb(255, 0, 0);
    color:white;
    font-weight: bold;
}
.pagination_button_active{
    display:flex;
    justify-content: center;
    align-items: center;
    width:48%;
    background-color: none;
    border:.1em solid rgb(120,120,120);
    padding:.5em;
    margin:.2em;
    transition:.1s;
    color:rgb(100,100,100);
    border-radius: .2em;
}
.pagination_button_inactive{
    display:flex;
    justify-content: center;
    align-items: center;
    width:48%;
    background-color: none;
    border:.1em solid rgb(220,220,220);
    padding:.5em;
    margin:.2em;
    transition:.1s;
    color:rgb(200,200,200);
    border-radius: .2em;
}
.pagination_text{
    display:flex;
    justify-content: center;
    align-items: center;
    padding:.3em;
    margin:.2em;
    color:rgb(0,0,0);
}
.page_selected{
    background-color: rgb(173, 0, 0);
    color:white;
    font-weight: bold;
    border-color: rgb(100,100,100);
}
.pagination_clicked{
    background-color: rgb(255, 0, 0);
    color:white;
    font-weight: bold;
    border-color: rgb(200,0,0);
}
/* ---------- category path ------------------------------------------------------------------------------------ */
.category_path_container{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    width:100%;
    padding:.5em;
    text-align: left;
}
.path_cat{
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: none;
    padding:.3em;
    margin:.2em;
    cursor: pointer;
    transition:.2s;
    color:rgb(120,120,120);
    border-radius: .2em;
}
.path_cat:hover{
    background-color: rgb(255, 0, 0);
    color:white;
}
.path_txt{
    display:flex;
    justify-content: center;
    align-items: center;
    padding:.3em;
    margin:.2em;
    color:rgb(0,0,0);
}
.path_txt2{
    display:flex;
    justify-content: center;
    align-items: center;
    padding:.3em;
    margin:.2em;
    color:rgb(150,150,150);
    font-size: .8em;
    border:.01em solid rgb(220,220,220);
    border-radius:.3em;
    box-shadow: .1em .1em .7em rgba(100,100,100,.2);
}
.path_cat2{
    border:.1em solid rgb(220,220,220);
    font-size: .9em;
    box-shadow: .1em .1em .7em rgba(100,100,100,.2);
}


/* ---------- SINGLE PRODUCT ----------------------------------------------------------------------------------- */
.product_no_img{
    position:relative;
    background-image: url(/img/no_image.jpg);;
    background-position:center;
    background-repeat: no-repeat;
    background-size: cover;
    width:12em;
    height:12em;
    padding:.2em;
}
.product_no_img_txt{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    color:rgb(0,0,0);
    text-align: center;
}
.product_img{
    display: block;
    max-width:100%;
    width:100%;
    margin:0;
    padding:0.2em;
}
.product_div{
    display: flex;
    flex-direction: column;
    border-radius: .2em;
    background-color:#f9f9f9;
    width:100%;
}
.product_div_left, .product_div_right{
    padding:.5em;
    width:100%;
}
.product_hover_container{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    margin-top: 1em;
}
.product_img_hover{
    padding:0.1em;
    width:23%;
    margin: 1%;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: normal;
    border: 0.15em solid rgba(119, 117, 117, 0.3);
    border-radius: .5em;
}
.product_img_hover_active{
    border-color: rgb(211, 0, 0);  
}
.product_div_left h1{
    margin: 0 .5em .5em .5em;
}
.product_price_detail{
    color:var(--price_color);
    font-weight: bold;
    font-size: 1.3em;
    margin: .3em 0 .5em 0;
}
.product_currency{
    color:rgb(99, 99, 116);
    font-size: .8em;
}
.product_div_right p{
    margin-top:1em;
}


/* ============== FORMS - formularze =========================================================================================================================================== */
.form_outline_container_row{
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
}
.form_outline_container_rows{
    display:flex;
    justify-content: center;
    align-items: center;
    margin-left: 0;
}
.form_outline_container_rc{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
}
.l_margin{
    margin-left:.6em;
}
.form_container{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    font-size:1.2em;
    padding:.5em;
}
.form_label{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    width:100%;
    font-size:.9em;
    padding-left: .2em;
    color:rgb(150,150,150);
}
.form_title{
    display:flex;
    flex-direction: column;
    justify-content: center;
    width:100%;
    font-size: 1em;
    font-weight: bold;
    text-align: center;
    margin: .5em 0;
    padding: 0;
}
.form_txt1{
    width:100%;
    font-size: .8rem;
    text-align: center;
    padding: 0;
}
.form_outline{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
}
.form_outline input{
    padding:.4em .5em;
    width:100%;
    outline:none;
    border-radius: .2em;
    -webkit-appearance: none;
    box-shadow: 0 .2em .5em rgba(0,0,0,.2);
    -webkit-box-shadow: 0 .2em .5em rgba(0,0,0,.2);
    font-size: 1em;
}
.form_outline input:focus{
    outline:none;
    border:.1em solid blue;
}
.form_outline_number{
    display:flex;
    justify-content:flex-start;
    align-items: center;
    width:100%;
}
.form_outline_checkbox{
    display:flex;
    justify-content:flex-start;
    align-items: center;
    width:100%;
    margin:.7em 0 .9em;
}
.chkbx{
    width:1.5em;
    height:1.5em;
    margin:0 .5em 0 .3em;
}
.form_chkbx_txt{
    font-size: 1rem;
    text-align: left;
    width:100%;
    padding: 0 .5rem;
    font-size: 1em;
}
.input_checkbox_sub{
    display:none;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
    width:100%;
    transition: .3s;
}
.form_input_text{
    font-size: 1em;
    text-align: left;
    margin: .2em 0 .8em 0;
    padding:.4em .5em;
    border: .05em solid rgb(200,200,200);
    border-radius: 10.5em;
    outline-color: var(--outline_focus_color);
    width:100%;
}
.form_input_text_short{
    font-size: 1em;
    text-align: left;
    margin: .2em 0 .8em 0;
    padding:.4em .5em;
    border-radius: .3vw;
    outline-color: var(--outline_focus_color);
    width:8em;
}
.form_input_number{
    font-size: 1em;
    text-align: left;
    width:8em;
    margin: .2em 0 .8em 0;
    padding:.4em .5em;
    border: .05em solid rgb(200,200,200);
    border-radius: .3vw;
    outline-color: var(--outline_focus_color);
}

.red_field:valid,.red_field:invalid{
    outline-color: red;
    border:.1em solid red;
    background-color: rgba(255,100,100,.1);
}

.form_gray_line{
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.5em 0;
}
.form_gray_line_96{
    width:96%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.5em 0 .5em 2%;
}
.form_gray_line_no_margin{
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
}
.form_gray_line_mobile_only{
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.5em 0;
}
.form_gray_line_desktop_only{
    display:none;
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.5em 0 1em 0;
}
.form_gray_line_desktop_margin_top{
    width:100%;
    border-bottom:.05em solid rgb(220,220,220);
    margin:.5em 0;
}
.form_distance{
    width:2em;
}
.form_button{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%;
    margin:1em 0;
    font-size:.83em;
}
.form_button_size{
    width:95%;
}
.form_button_back{
    margin: .5em 0;
    padding: .8em;
    background-color: var(--btn_color1_hover);
    color:black;
}
/* ----------show form data--------------------------------------------------------- */
.form_outline_show{
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
    padding:.1em 0;
}
.form_label_show{
    display:flex;
    justify-content: flex-end;
    align-items: center;
    width:50%;
    font-size:.9em;
    color:rgb(150,150,150);
}
.form_label_show2{
    display:flex;
    justify-content: flex-end;
    align-items: center;
    width:100%;
    font-size:.8em;
    color:rgb(150,150,150);
}
.form_value_show{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    font-size: 1em;
    margin: 0;
    padding-left:1em;
    width:100%;
    color:rgb(50,50,50);
}
.form_value_show2{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    font-size: .8em;
    margin: 0;
    padding-left:1em;
    width:100%;
    color:rgb(50,50,50);
}
.flex_center{
    justify-content: center;
}



/* ============== DELIVERY - formularz wysyłka ================================================================================================================================= */
.delivery_container{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    font-size:1.3em;
    padding:.1em;
}
.delivery_line_container{
    display:flex;
    align-items: center;
    justify-content: center;
    align-self: normal;
    width:100%;
    margin:.5em 0;
    padding:.5em .4em;
    border:.05em solid rgba(255,255,255,0);
    border-radius: .5em;
}
.delivery_line_selected{
    border-color: rgba(200,200,200, .5);
    box-shadow: .3em .3em .7em rgba(200, 200, 200, .3);
}
.delivery_line_sub{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    /* height: 100%; */
}
.delivery_line_sub1{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    /* height: 100%; */
}
.delivery_line_sub2{
    display:flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    width: 100%;
    /* height: 100%; */
}
.delivery_radio{
    display:flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    width:10%;
    padding:0 .5em 0 .2em;
    margin:0;
}
.radio_btn{
    width:1.5em;
    height:1.5em;
}
.delivery_img_container{
    display:flex;
    align-items: center;
    justify-content: center;
    width:30%;
    margin:0;
}
.delivery_img{
    width:100%;
    max-width:5em;
}
.delivery_name_description_container{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    width:100%;
    padding:0 .5em;
    margin:0;
}
.delivery_name{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    width:100%;
    font-size:.8em;
    font-weight: bold;
}
.delivery_description{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    width:100%;
    font-size:.5em;
}
.delivery_days{
    display:flex;
    align-items: flex-end;
    justify-content: flex-start;
    font-size:.8em;
    width:25%;
}
.delivery_days span{
    font-size: .8em;
    color: rgb(100,100,100);
    padding:0 0 .03em .1em;
}
.delivery_price{
    width: 20%;
}
.delivery_inpost_input_container{
    display:flex;
    align-items: center;
    justify-content: center;
    width:100%;
    margin:.7em 0 0 0;
    font-size: 1em;
}
.delivery_inpost_input_container label{
    font-size:.7em;
}
.delivery_search_cnt{
    position: relative;
    display: flex;
    width:100%;
}
#input_inpost{
    padding-right:2.5em;
}
.delivery_inpost_search_button{
    position:absolute;
    display:flex;
    align-items: flex-end;
    justify-content: center;
    bottom:1.3em;
    right:.5em;
    padding:0;
}
.delivery_icon_search{
    /* content:url(/img/search.svg); */
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='rgb(0,0,0)' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
    /* height:1.5em; */
    height:1.2em;
    filter:invert(36%);
}
.delivery_select_container{
    display:flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: column;
    width:100%;
    font-size:1em
}
.delivery_select_container label{
    font-size:.7em;
}
.inpost_lockers_select{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    padding:.8em .6em;
    width:100%;
    border:none;
    outline:none;
    background-color: none;
    background-color:rgb(255,255,255,1);
    border-radius: .6em;
    border: .05em solid rgb(200,200,200);
    box-shadow: 0 .2em .8em rgba(0,0,0,.2);
    font-size: .7em;
    margin:.3em 0 0 0;
    word-wrap: normal;

}
.inpost_lockers_select:focus{
    outline:none;
    border:.15em solid blue;
}
/* ============ COOKIE MODAL ===================================================================================================== */
.cookie_modal{
    position: fixed;
    bottom:0;
    left:0;
    /* display:block; */
    width:100vw;
    background-color: rgba(0,0,0,.9);
    z-index: 9999;
}
.cookie_main{
    display: block;
    align-items: center;
    width:100%;
    font-size:1rem;
    color:#fff;
    padding:1rem;
}
.cookie_btns_cnt{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    padding: .8rem 20% .5rem 20%;
}
#link_cookie_polityka_prywatnosci{
    background-color: rgba(200,200,200,.3);
    padding: .05em;
}
/* ============ INFO MODAL ======================================================================================================= */
.info_modal{
    display:none;
    position: fixed;
    top: 0;
    left:0;
    width:100vw;
    height:100vh;
    background-color: rgba(0,0,0,.8);
}
.info_modal_view{
    display: flex;
    flex-direction: column;
    position: absolute;
    justify-content: center;
    align-items: center;
    width:90%;
    top:50%;
    left:50%;
    transform: translate(-50%,-80%);
    border-radius: .2em;
    background-color: #eeeeee;
    text-align: center;
    color:black;
    font-size: 1.4em;
    padding: 1em 0 1.3em 0;
}
.info_modal_title{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:95%;
    font-weight: bold;
    padding: .5em .5em;
    border-radius: .1em;
}
.info_modal_title_error{
    background-color: rgb(200,0,0);
    color:white;
}
.info_modal_txt{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    font-size: .8em;
    padding: 1em .5em;
    margin-bottom: 2em;
}
.info_modal_button{
    width:50%;
    border:none;
    cursor:pointer;
}
/* ---------- BLOG -------------------------------------------------------------------------- */
.blog_cnt{
    display:flex;
    flex-direction: column;
    width:100%;
    padding-bottom:.8em;
}
.blog_cnt_slide_out{
    display:flex;
    flex-direction: column;
    position:relative;
    padding:.5em 0 0 0;
}
.blog_cnt_slide{
    display:flex;
    flex-direction: row;
    overflow-y: hidden;
    overflow-x: hidden;
    /* scroll-behavior: smooth; */
    height:100%;
}
.blog_click_left{
    position:absolute;
    background-color: rgba(255,255,255,.4);
    content:url(/img/chevron-left.svg);
    height:2.85em;
    padding:.4em .5em .4em .3em;
    border-radius: 50%;
    left:.3em;
    top:50%;
    filter:invert(100%);    
    z-index: 1;
}
.blog_click_right{
    position:absolute;
    background-color: rgba(255,255,255,.4);
    content:url(/img/chevron_right.svg);
    height:2.85em;
    padding:.4em .3em .4em .5em;
    border-radius: 50%;
    right:.3em;
    top:50%;
    filter:invert(100%);    
    z-index: 1;
}
.blog_item_cnt{
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height:100%;
    min-width:100%;
    max-width:100%;
    padding:.5em 1em 1em 1em;
}
.blog_item_img_cnt{
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:17em;
    border:none;
}
.blog_item_img_cnt img{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    width:100%;
    height:100%;
    border:none;
}
/* -----blog text---------- */
.blog_img_txt_cnt{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width:100%;
    font-size: 1em;
}
.blog_txt_cnt{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width:100%;
    color:rgb(80,80,80);
    padding:.5em 0 1em 0;
}
.blog_date{
    display:flex;
    justify-content: flex-start;
    font-size:.8em;
    color:rgb(100,100,100);
}
.blog_title{
    display:flex;
    justify-content: flex-start;
    font-size:1.3em;
    font-weight: bold;
    color:rgb(50,50,50);
    padding:.2em 0 .4em 0;
}
.blog_description{
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    font-size: 1em;
}
.blog_txt_btn_cnt{
    display:flex;
    justify-content: flex-start;
    align-items: center;
    width:100%;
    padding:0 .4em;
}
.blog_txt_btn{
    /* background-color: rgb(255, 200, 0); */
    /* background-color: var(--btn_color1); */
    /* color:black; */
    /* border:.2em solid rgb(0,0,0); */
    /* border-radius:.2em; */
    width:50%;
    cursor: none;
}
.blog_txt_btn:hover{
    /* background-color: var(--btn_color1_hover); */
    font-weight: bold;
    transform:scale(1.05);
    box-shadow: 0 .3em 1em rgba(0,0,0,.8);
}
.blog_buttons_circles_cnt{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5em;
    margin-top:.3em;
}
.blog_circles_cnt{
    display:flex;
    justify-content: center;
    align-items: center;
    padding:.3em 0 .5em 0;
}
.blog_circle{
    width:.6em;
    height:.6em;
    border:.1em solid rgb(120,120,120);
    border-radius:50%;
    margin:.2em .1em;
    transition: .7s;
}
.blog_circle_selected{
    background-color:rgb(180,180,180);
}
.blog_btn{
    width:25%;
    font-size: 1.3em;
    font-weight: bold;
    padding:.3em;
    margin: .5em 0;
    background-color: var(--btn_color1_hover);
    border:.01em solid rgb(100,100,100);
    color:black;
    box-shadow: 0 0 .8em rgb(200,200,200);
    cursor:none;
}
/* ----blog classes------- */
.blog_div_std{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width:100%;
}
.blog_img_3x{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    padding:.5em;
}
.blog_img_2x{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    padding:.5em;
}
.blog_subtitle{
    font-size: 1.1em;
    font-weight: bold;
    padding:1.3em 0 .4em 0;
}
.blog_subtitle2{
    font-size: 1.1em;
    font-weight: bold;
    padding:0 0 .4em 0;
}




/* ======= SLIDE2 POLECANE ================================================================================ */
.slide2_cnt{
    display:flex;
    flex-direction: column;
    width:100%;
    padding:0;
    /* margin-bottom:1em; */
}
.slide2_items_cnt_out{
    display:flex;
    flex-direction: column;
    position:relative;
    /* padding:0 .5em; */
}
.slide2_cnt_slide{
    display:flex;
    overflow: hidden;
    padding-bottom:2em;
}
.slide2_item_cnt{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items:center;
    min-width:50%;
    max-width:50%;
    background-color: white;
    transition: .3s;
    padding:0 .5em 1em .5em;
}
.slide2_img_cnt{
    display:flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    /* height:100%; */
    min-height:13em;
}
.slide2_img_cnt img{
    width:100%;
}
.slide2_txt_name{
    display:flex;
    justify-content: flex-start;
    font-weight: bold;
    font-size: .85em;
}
.slide2_click_left{
    position:absolute;
    background-color: rgba(255,255,255,.25);
    content:url(/img/chevron-left.svg);
    height:2.85em;
    padding:.4em .5em .4em .3em;
    border-radius: 50%;
    left:.3em;
    top:55%;
    filter:invert(100%);    
    z-index: 1;
}
.slide2_click_right{
    position:absolute;
    background-color: rgba(255,255,255,.25);
    content:url(/img/chevron_right.svg);
    height:2.85em;
    padding:.4em .3em .4em .5em;
    border-radius: 50%;
    right:.3em;
    top:55%;
    filter:invert(100%);    
    z-index: 1;
}
/* ----- home przerywnik-------------------------------- */
.home_przerywnik_cnt{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items:center;
    width:100%;
    /* height:100%; */
    /* min-height:50%; */
    padding:1.5em .5em 2em .5em;
    flex-wrap: wrap;
}
.home_przerywnik_cnt2{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items:center;
    width:100%;
    /* height:100%; */
    /* min-height:50%; */
    padding:2em .5em;
    flex-wrap: wrap;
}
.home_przerywnik_item_cnt{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items:center;
    width:90%;
    font-size:1em;
    background-color: rgb(255,255,255);
    color:rgb(80,80,80);
    text-align: center;
    margin-bottom:1.5em;
    padding:1em .6em;
    border: .01em solid rgb(100,100,100);
    box-shadow: .3em .3em 1em rgba(0,0,0,.5);
    transition:.2s;
}
.home_przerywnik_title{
    color:rgb(150,20,20);
    padding:0 .5em 1em .5em;
    animation: title_color_red 6s infinite;
}
@keyframes title_color_red{
    0%{ }
    5%{  color:rgb(230,0,0); text-shadow: 0 0 1em rgba(255,30,30,.4); }
    50%{ color:rgb(150,20,20) }
    100% { }
}
.home_przerywnik_wypelniacz{
    max-height:10%;
}
.home_przerywnik_item_cnt2{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items:center;
    width:100%;
    font-size:1em;
    background-color: rgb(255,255,255);
    color:rgb(80,80,80);
    text-align: center;
    margin-bottom:1.5em;
    padding:.6em;
}
/* ----- home zdjecie_tlo_przesuwane--------------------------- */
.home_zdj_tlo_przesuwane_cnt{
    position: relative;
    background-size:cover;
    /* background-size:150vw 156vw; */
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    height:20em;
    width:100%;
}
.home_zdj_tlo_przesuwane_title{
    position:absolute;
    top:1em;
    left:1em;
    color:rgb(230,230,230);
    text-shadow: 0 0 .5em rgba(255,255,255,.8);
    font-size: 1.5em;
}
.home_zdj_tlo_przesuwane_txt2{
    position:absolute;
    bottom:1em;
    left:1em;
    color:rgb(230,230,230);
    text-shadow: 0 0 .5em rgba(255,255,255,.8);
    font-size: 1.5em;
    animation:home_zdj_tlo_przesuwane_txt2_fade_in 4s;
    /* animation-delay:10s; */
    /* animation: title_color_white 6s infinite; */
}
/* @keyframes title_color_white{
    0%{ }
    5%{  color:rgb(255,255,255); text-shadow: 0 0 .3em rgba(255,255,255,1); }
    50%{ color:rgb(230,230,230) }
    100% { }
} */

/* --------- uniwersalne (mobile) ----------------------------------------------------------------- */
.home_full_width_cnt_gray{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
    background-color:var(--home_gray_background);
}
.home_full_width_cnt_gray_desktop_only{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:100%;
}
.home_full_width_white_bar_desktop_only{
    display:none;
}
.home_full_width_cnt{
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
}

.one_button_top0{
    padding-top:0;
    margin-top:0;
    width:80%;
}
.btn_light{
    background-color: var(--btn_color1);
    color:black;
}
.btn_light:hover{
    background-color: var(--btn_color1_hover);
    font-weight: bold;
}
.wypelniacz_shop_bottom{
    width:100%;
    height:2.5em;
}
.wypelniacz_h1em_mob_only{
    width:100%;
    height:1em;
}

/* ----- spinner ------------------------------------------------------------------------------------------------------------------------ */
.please_wait_spinner{
    display:none;
    position: fixed;
    top: 0;
    left:0;
    width:100vw;
    height:100vh;
    background-color: rgba(0,0,0,.6);
    font-size: 2em;
}
.spinner_cnt{
    position: absolute;
    top:50%;
    left:50%;
    transform: translateX(-50%) translateY(-50%);
}

.lds_roller {
    display: inline-block;
    position: relative;
    width: 5em;
    height: 5em;
}
  .lds_roller div{
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 2.5em 2.5em;
  }
  .lds_roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: .375em;
    height: .375em;
    border-radius: 50%;
    box-shadow: 0 0 1em #fff;
    background: #fff;
    margin: -.25em 0 0 -.25em;
  }
  .lds_roller div:nth-child(1) { animation-delay: -0.036s; }.lds_roller div:nth-child(1):after { top: 3.9375em; left: 3.9375em; }
  .lds_roller div:nth-child(2) { animation-delay: -0.072s; }.lds_roller div:nth-child(2):after { top: 4.25em;   left: 3.5em; }
  .lds_roller div:nth-child(3) { animation-delay: -0.108s; }.lds_roller div:nth-child(3):after { top: 4.4375em; left: 3em; }
  .lds_roller div:nth-child(4) { animation-delay: -0.144s; }.lds_roller div:nth-child(4):after { top: 4.5em;    left: 2.5em; }
  .lds_roller div:nth-child(5) { animation-delay: -0.18s;  }.lds_roller div:nth-child(5):after { top: 4.4375em; left: 2em; }
  .lds_roller div:nth-child(6) { animation-delay: -0.216s; }.lds_roller div:nth-child(6):after { top: 4.25em;   left: 1.5em; }
  .lds_roller div:nth-child(7) { animation-delay: -0.252s; }.lds_roller div:nth-child(7):after { top: 3.9375em; left: 1.0625em; }
  .lds_roller div:nth-child(8) { animation-delay: -0.288s; }.lds_roller div:nth-child(8):after { top: 3.5em;    left: .75em; }
  @keyframes lds-roller {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }


/* =============== MEDIA ======================================================================================================================================================= */
/* =============== MEDIA ======================================================================================================================================================= */
/* =============== MEDIA ======================================================================================================================================================= */
/* ----600 - małe tablety------------------------------------------------------------------------------------ */
@media (min-width:600px){
    html, body{
        font-size:3vw;
    }
    /* ---- media 600 side-bar ------------------------------------------------------ */
    .mobile_nav_container{
        height:92.2%;
    }
    .side_container{
        width:68%;
    }
    .side_item{
        height:3em;
    }
    @keyframes anim_nav_show{
        from{ left:100%; opacity:0.6; }
        to{ left:32%; opacity:var(--side_container_opacity); }
    }
    @keyframes anim_nav_hide{
        from{ left:32%; opacity:var(--side_container_opacity); }
        to{ left:100%; opacity:0.6; }
    }

    /* ---- media 600 BASKET (główny koszyk na stronie order)------------------------ */
    .basket_container{
        padding:1em;
    }
    .basket_name{
        max-width: 80%;
    }
    /* ---- media 600 SHOP (SKLEP) -------------------------------------------------- */
    .card{
        width:32.5%;
        padding:.5em;
        border:.01em solid rgb(220,220,220);
        margin:.4% .4% .5em .4%;
        box-shadow: 0 0 .5em rgba(0,0,0,.05);
    }
    .card_img_container{
        min-height:8em;
    }
    button{
        font-size:.8rem;
        padding:.7rem;
    }
    .button_inactive{
        font-size:.8rem;
        padding:.7rem;
    }
    .button_inactive_prod{
        font-size:.8rem;
        padding:.7rem;
    }
    .product_div_right button{
        width:70%;
    }
    .product_price{
        font-size:1.1em;
    }
    .product_price_detail{
        font-size:1.1em;
    }
    /* ---- media 600 ORDER --------------------------------------------------------- */
    .order_buttons_container{
        padding:1em;
    }
    /* ---- media 600 forms (formularze) -------------------------------------------- */
    .form_container{
        padding:1em;
    }
    /* ---- media 600 ORDER / delivery (wysyłka) ------------------------------------ */
    .delivery_container{
        padding:1em;
    }
    /* ---- media 600 ORDER / checkout ---------------------------------------------- */
    .payments_container{
        padding:0 1em;
    }
    .checkout_dane_i_wysylka_container{
        padding:0 1em;
    }
    /* ---- media 600 place order---------------------------------------------------- */
    .info_message{
        width:90%;
    }
    /* ---- media 600 contact-------------------------------------------------------- */
    .contact{
        padding:2em;
    }
    /* ---- media 600 HOME ---------------------------------------------------------------- */
    .home_title{
        padding:1em 0;
    }
    /* ---media 600 home blog------------------------------------------ */
    .blog_item_cnt{
        padding:.5em 1em 1em 1em;
    }
    .blog_description{
        /* font-size:.9em; */
    }
    .blog_div_std{
        flex-direction: row;
    }
    .blog_img_3x{
        width:49%;
        padding:.5em;
    }
    .blog_img_2x{
        width:49%;
        padding:.5em;
    }
    /* ---media 600 SLIDE2 POLECANE------------------------------------ */
    .slide2_items_cnt_out{
        padding:0 .8em;
    }
    .slide2_item_cnt{
        min-width:33%;
        max-width:33%;
        padding:0 .5em;
    }
    .slide2_img_cnt{
        min-height:11em;
    }
    .slide2_txt_name{
        font-size: .85em;
    }
    /* ---media 600 home przerywnik------------------------------------- */
    .home_przerywnik_cnt2{
        flex-direction: row;
        padding:3em .5em;
    }
    .home_przerywnik_item_cnt2{
        width: 50%;
        margin-bottom:2em;
    }
    /* ---media 600 blog article---------------------------------------- */
    .blog_article_title_cnt{
        font-size: 1.2em;
    }
    .blog_article_content{
        font-size:1em;
    }
}

/* ----- większe tablety (zmniejszenie wysokości itemów menu)----------------------------------------- */
@media (min-width:700px){
    html, body{
        font-size:2.53vw;
    }
    /* ---- media 700 side-bar ------------------------------------------------------ */
    .side_item{
        height:2.4em;
    }    
    /* ---media 700 HOME ------------------------------------------------------------ */
    /* ---media 700 blog-------------------------------------------- */
    .blog_cnt_slide_out{
        padding:0 .3em;
    }
    .blog_item_cnt{
        min-width:50%;
        max-width:50%;
        padding:.5em .3em 1em .3em;
    }
    .blog_item_img_cnt{
        height:16em;
    }
    .blog_title{
        font-size:1.2em;
    }
    .blog_description{
        font-size: .95em;
    }
    .blog_txt_btn{
        width:75%;
    }
    /* ---media 700 SLIDE2 POLECANE------------------------------------ */
    .slide2_items_cnt_out{
        padding:0 1.5em;
    }
    .slide2_img_cnt{
        min-height:12em;
        padding:0 .5em;
    }
    /* ---media 700 blog article---------------------------------------- */
    .blog_article_title_cnt{
        font-size: 1.1em;
    }
    .blog_article_content{
        font-size:.95em;
    }
    /* ---media 700 shop(sklep)---------------------------------------- */
    button{
        font-size:.8rem;
        padding:.7rem;
    }
    .button_inactive{
        font-size:.8rem;
        padding:.7rem;
    }
    .button_inactive_prod{
        font-size:.8rem;
        padding:.7rem;
    }
}

/* ----- desktopy i tablety LANDSCAPE ---------------------------------------------------------------- */
@media (min-width:900px){
    /* ---- media desktop html, body ---------------------------------------------------- */
    html, body{
        font-size:16px;
    }
    /* ---- media desktop uniwersalne --------------------------------------------------- */
    .info_message{
        width:60%;
    }
    /* ---media desktop header -------------------------------------------------------- */
    .top_margin_header{
        height:var(--header_height_desktop_margin);
    }
    header{
        height:var(--header_height_desktop);
        padding:0 4em;
    }
    .nav_links{
        display: flex;   
    }
    .nav_link{
        cursor: pointer;
    }
    .header_logo_container{
        padding-bottom:.2em;
    }
    .header_logo_img{
        height:3.2em;
        cursor: pointer;
    }
    .header_logo_img_small{
        height:2em;
    }
    .back_button{
        margin-right: 3em;
        cursor: pointer;
    }
    .container_nav_toggle{
        display:none;        
    }
    .header_basket_container{
        margin: 0 .3em 0 4em;
        cursor: pointer;
    }
    .icon_search{
        height:1.8em;
        margin-right:4.5em;
        cursor: pointer;
    }
    .prod_add_to_basket_modal{
        top:var(--header_height_desktop_modal);
        right:.5em;
        width:40em;
        border:.01em solid rgb(100,100,100);
        border-radius: .3em;
        padding:1em;
    }
    /* --------- COOKIE POPUP --------------------------------------------------------- */
    #link_cookie_polityka_prywatnosci{
        cursor: pointer;
    }
    /* ---media desktop basket modal (podgląd koszyka)--------------------------------- */
    .basket_modal{
        top:var(--header_height_desktop_modal);
        right:.5em;
        /* width:47em; */
        width:67em;
        border-radius:.3em;
        box-shadow: .5em .5em 1.3em .3em rgba(0, 0, 0, .5);
    }
    .basket_modal_main{
        border:.01em solid rgb(100,100,100);
        border-radius: .3em;
        padding: 1em 1em .2em 1em;
    }
    .basket_modal_bottom{
        display:none;
    }
    .basket_modal_click_container:hover{
        background-color: rgba(100,100,100,.3);
        filter:brightness(.95);
        color:white;
    }
    .trash{
        padding:0 .4em 0 2.5em;
        cursor: pointer;
    }
    .trash:hover{
        filter:invert(100%);
    }
    .basket_modal_price_container{
        /* flex-direction: row; */
        align-items: center;
        justify-content: space-between;
    }
    .basket_modal_qty{
        justify-content: flex-start;
        padding:0 .3em;
    }
    .basket_modal_price span{
        padding:.15em 0 .2em .25em;
    }
    /* -----media desktop basket modal buttons--------- */
    .basket_modal_btn_place_order{
        width:70%;
    }
    .basket_modal_btn_clear{
        width:70%;
    }
    .basket_modal_btn_clear:hover{
        background-color: var(--btn_color1_hover);
        font-weight: bold;
    }
    .basket_modal_btn_exit{
        width:70%;
    }
    .basket_modal_btn_exit:hover{
        background-color: var(--btn_color2_hover);
        font-weight: bold;
    }
    /* ---media desktop search modal ------------------------------------------- */
    .search_modal{
        top:var(--header_height_desktop_modal);
        right:.5em;
        width:50em;
        border:.01em solid rgb(100,100,100);
        border-radius: .3em;
        padding:1em;
    }
    .search_cnt{
        width:90%;
    }
    .search_outline input{
        padding:.4em 2.5em .4em .5em;
    }
    .search_icon_search{
        height:1.2em;
    }
    /* ---media desktop content_modal --------------------------------------------- */
    .content_modal{
        top:var(--header_height_desktop_modal);
        right:.5em;
        width:900px;
        max-width: 100%;
        border-radius:.3em;
        box-shadow: .5em .5em 1.3em .3em rgba(0, 0, 0, .5);
        border:.01em solid rgb(100,100,100);
        border-radius: .3em;
        padding: 1em 1em .2em 1em;
    }
    .form_chkbx_txt span{
        cursor:pointer;
    }
    .form_chkbx_txt span:hover{
        color:rgb(200,0,0);
        text-decoration: underline;
    }
    /* ---media desktop HOME (strona główna) ------------------------------------------ */
    /* ---media desktop img_otm = image of the month--------------- */
    .img_otm_text_container{
        padding:.5em .8em;
        font-size:1.2em;
    }
    .home_baner_txt_cnt{
        font-size:1.3em;
        padding:2.6em 0 3em 0;
        width:40em;
    }
    /* ---media desktop blog------------------- */
    .blog_cnt_slide_out{
        padding:0 5em;
    }
    .blog_click_left{
        background-color: rgba(255,255,255,.3);
        top:40%;
        left:1em;
        height:2.7em;
        cursor: pointer;
        transition:.2s;
    }
    .blog_click_left:hover{
        background-color: rgba(255,255,255,.5);
    }
    .blog_click_right{
        background-color: rgba(255,255,255,.3);
        top:40%;
        right:1em;
        height:2.7em;
        cursor: pointer;
        transition:.3s;
    }
    .blog_click_right:hover{
        background-color: rgba(255,255,255,.5);
    }
    .blog_item_cnt{
        min-width:50%;
        max-width:50%;
        padding:.5em .3em 1em .3em;
    }
    .blog_item_img_cnt{
        height:19em;
        max-height:30vh;
        cursor: pointer;
        transition:.3s;
        /* border:.1em solid rgba(150,150,150,0); */
        /* border-radius: .2em; */
    }
    .blog_item_img_cnt:hover{
        filter:saturate(1.2) brightness(1.14);
        transform:scale(1.02);
        /* box-shadow: 0 .5em 1em rgba(0,0,0,.7); */
    }
    .blog_circles_cnt{
        bottom:.4em;
        margin:0 5em;
        align-items: center;
    }
    .blog_circle{
        width:.7em;
        height:.7em;
        border-color: rgb(150,150,150);
        transition: 1s;
    }
    .blog_btn{
        width:16%;
        cursor:pointer;
    }
    .blog_btn:hover{
        background-color: rgb(230,0,0);
        color:white;
    }
    /* ---media desktop blog text----- */
    .blog_txt_cnt{
        font-size: 1.3em;
    }
    .blog_date{
        font-size:.7em;
    }
    .blog_title{
        font-size:1em;
    }
    .blog_description{
        font-size: .75em;
    }
    .blog_txt_btn{
        width:70%;
        /* opacity:.5; */
        cursor: pointer;
    }
    /* ----media desktop blog article------------------------------- */
    .blog_article_header{
        height:25em;
    }
    .blog_article_title_cnt{
        padding:0 1em;
    }
    .blog_article_title{
        font-size: 1.6em;
    }
    .blog_article_content{
        font-size:1.1em;
        padding:0 1em;
    }
    /* ----------------- */
    .blog_div_std{
        flex-direction: row;
    }
    .blog_img_3x{
        width:33%;
        padding:.5em;
    }
    .blog_img_2x{
        width:50%;
        padding:.5em;
    }

    /* ---media desktop SLIDE2 POLECANE ------------------------------------ */
    .slide2_cnt{
        padding-bottom: 1em;
    }
    .slide2_items_cnt_out{
        padding:0 5.2em;
    }
    .slide2_item_cnt{
        min-width:24.3%;
        max-width:24.3%;
        padding:.5em .5em 1em .5em;
        margin:.45%;
        border:.01em solid rgb(120,120,120);
        border-bottom:1em solid rgb(210,0,0);
        box-shadow: 0 0 .2em rgba(0,0,0,.18);
        cursor: pointer;
        background-color: white;
    }
    .slide2_item_cnt:hover{
        transform:scale(1.01);
        box-shadow: .3em .3em 1em rgba(0,0,0,.5);
        filter:saturate(1.2) contrast(1.1);
    }
    .slide2_img_cnt{
        min-height:12em;
        /* max-height:14em; */
        padding:.5em;
    }
    .slide2_click_left{
        background-color: rgba(255,255,255,.25);
        top:45%;
        left:1em;
        height:2.7em;
        cursor: pointer;
        transition:.2s;
    }
    .slide2_click_left:hover{
        background-color: rgba(255,255,255,.5);
    }
    .slide2_click_right{
        background-color: rgba(255,255,255,.25);
        top:45%;
        right:1em;
        height:2.7em;
        cursor: pointer;
        transition:.2s;
    }
    .slide2_click_right:hover{
        background-color: rgba(255,255,255,.5);
    }
    .slide2_txt_name{
        font-size: 1em;
    }
    /* ---media desktop home przerywnik------------------------------------- */
    .home_przerywnik_cnt{
        flex-direction: row;
        padding:.5em .5em 4em .5em;
        align-items:flex-start;
    }
    .home_przerywnik_cnt2{
        flex-direction: row;
        padding:4em .5em;
        align-items:flex-start;
    }
    .home_przerywnik_item_cnt{
        width: 32.1%;
        height:100%;
        margin: 0 .6%;
        padding:2em .6em;
        cursor: pointer;
    }
    .home_przerywnik_item_cnt:hover{
        transform:scale(1.03);
        animation:przerywnik_deg .3s;
        box-shadow: .3em .3em 2em rgba(0,0,0,1);
    }
    @keyframes przerywnik_deg{
        0%  { transform:scale(1.00);}
        30%{ transform:rotate3d(1,1,1,4deg) scale(1.01); }
        60%{ transform:rotate3d(1,1,1,-2deg) scale(1.02); }
        100%{transform:scale(1.03);}
    }
    .home_przerywnik_item_cnt2{
        width: 32.1%;
        height:100%;
        margin: 0 .6%;
    }
    /* ---media desktop home_zdj_tlo_przesuwane_cnt---------------- */
    .home_zdj_tlo_przesuwane_cnt{
        background-size:100vw auto;
        background-position: center;
        height:35em;
        cursor: pointer;
    }
    .home_zdj_tlo_przesuwane_filter{
        cursor: pointer;
    }
    .home_zdj_tlo_przesuwane_title{
        font-size: 1.8em;
    }
    .home_zdj_tlo_przesuwane_txt2{
        font-size: 1.8em;
    }
    /* ---media desktop image of the month---------------------------------- */
    .home_title{
        /* font-size:2em; */
        font-size:1.4em;
        padding:1.3em 0 .8em 0;
    }
    .home_title_cnt{
        margin-bottom:.8em;
        height:2.5em;
    }
    .home_title_txt{
        padding: 0 2.5em;
    }
    .home_title2,.home_title3{
        width:20%;
    }
    .home_txt1{
        width:1000px;
    }
    /* ---media desktop home banner---------------------------------------- */
    .home_baner_container{
        background-size:100vw auto;
        height: 30em;
    }

    /* ---media desktop ORDER (ZAMÓWIENIE) -------------------------------------------- */    
    .order_txt{
        font-size: .8em;
    }
    .order_icon_container{
        margin:0 .5em 0 .5em;
    }
    .order_icon_container2{
        padding:1.2em;
        margin:.5em;
        border-width: .15em;
        cursor: pointer;
    }
    .order_icon_right{
        height:2em;
        margin:1.6em;
    }
    .order_icon_basket{
        height:var(--order_icon_height_desktop);
        min-width:1.5em;
    }
    .order_icon_user{
        height:var(--order_icon_height_desktop);
        min-width:1.5em;
    }
    .order_icon_delivery{
        height:var(--order_icon_height_desktop);
        min-width:1.5em;
    }
    .order_icon_checkout{
        height:var(--order_icon_height_desktop);
        min-width:1.5em;
    }
    /* ---------- */
    .order_icon_container2:hover{
        background-color: rgb(0,255,255);
        border-color: rgb(0,255,255);
        filter:invert(100%) brightness(200%);
    }
    .order_icon_container_selected:hover{
        background-color: rgb(215,0,0);
        border-color: rgb(215,0,0);
        filter: invert(0%);
    }
    .order_buttons_container{
        width:60%;
    }
    /* ---media desktop BASKET (główny koszyk na stronie order) -------------------------------------- */
    .basket_product_description_container{
        flex-direction: row;
    }
    .basket_left_line_container{
        align-items: center;
        margin-right: 3em;
    }
    .basket_right_line_container{
        width:20%;
    }
    .basket_left_line_container_modal{
        align-items: center;
        width:70%;
    }
    .basket_right_line_container_modal{
        width:20%;
    }
    .basket_line{
        margin: 1em 0;
    }
    .basket_img_cnt{
        min-width:5em;
    }
    .basket_img_cnt_checkout{
        min-width:4em;
    }
    .basket_img{
        max-width: 5em;
    }
    .basket_img_checkout{
        cursor: pointer;
    }
    .basket_name{
        font-size:.8em;
        padding: .7em;
    }

    .basket_qty{
        font-size:1.1em;
    }
    .basket_qty_button{
        cursor: pointer;
    }
    .basket_qty_button_modal{
        cursor: pointer;
    }
    .basket_price{
        font-size: 1em;
    }
    .basket_trash{
        height:1.1em;
        cursor: pointer;
    }
    /* ---media desktop basket order/checkout-------------- */
    .basket_container_checkout{
        width:85%;
    }
    .basket_line_container_checkout{
        align-items: center;
    }
    .basket_qty_price_container{
        justify-content: space-between;
        width:16%;
    }
    .basket_qty_checkout{
        font-weight: normal;
    }
    /* ---media desktop FORMS - formularze -------------------------------------------- */
    .form_outline_container_rows{
        margin-left:.6em;
    }
    .form_outline_container_rc{
        flex-direction: row;
    }
    .form_container{
        width:60%;
    }
    .form_button_size{
        width:50%;
    }
    .form_button_back:hover{
        background-color: var(--btn_color1);
        font-weight: bold;
    }
    .form_gray_line_mobile_only{
        display:none;
    }
    .form_gray_line_desktop_only{
        display:block;
    }
    .form_gray_line_desktop_margin_top{
        margin:1em 0 .5em 0;
    }
    /* ---media desktop DELIVERY - formularz wysyłka ---------------------------------- */
    .delivery_container{
        width:60%;
    }
    .delivery_radio{
        padding:0 1em 0 .3em;
    }
    .delivery_img_container{
        width:20%;
        justify-content: flex-start;
    }
    .delivery_name_description_container{
        padding:0 1em;
    }
    .delivery_description{
        font-size:.6em;
    }
    .delivery_days{
        font-size: .9em;
        width:20%;
    }
    .delivery_days span{
        padding:0 0 .12em .1em;
    }
    .delivery_inpost_search_button{
        right:.8em;
        cursor: pointer;
    }
    /* ---media desktop inpost lockers------------------------------- */
    .inpost_lockers_select{
        font-size: .8em;
        padding:.6em;
    }
    /* ---media desktop info modal ---------------------------------------------------- */
    .info_modal_view{
        width:40%;
    }
    /* ---media desktop checkout (ZAMÓWIENIE) ----------------------------------------- */
    .basket_txt_title{
        font-size: .85em;
    }
    .basket_txt_title2{
        margin:1em 0;
    }
    /* ----------------------- */
    .form_data_container_checkout{
        width:90%;
    }
    .checkout_dane_i_wysylka_container{
        flex-direction: row;
        align-items: flex-start;
    }
    .checkout_data_container{
        width:98%;
        padding:.3em .8em .8em .8em;
        margin:.5em;
        border:.05em solid rgb(230,230,230);
        box-shadow: 0 .2em .8em rgba(0,0,0,.1);
    }
    /* ----------------- */
    .form_outline_show{
        padding:.2em 0;
    }
    .form_label_show{
        width:70%;
    }
    .form_value_show2{
        font-size: 1em;
    }
    /* ---media desktop payment method------------------------------------------------- */
    .payments_container{
        width:85%;
        align-items: flex-start;
    }
    /* ---media desktop warning message (pusty koszyk, źle wypełnione formularze itd) ------- */
    .warning_container{
        width:50%;
    }
    /* ---media desktop sidebar ------------------------------------------------------- */
    .mobile_nav_container{
        position:unset;
        justify-content:flex-start;
        align-items: flex-start;
        top:0;
        left:0;
        height:100%;
        width:28rem;
        overflow-x:unset;
        overflow-y:unset;
        margin:.4em 1em .4em .4em;
        border:.01em solid rgb(210,210,210);
        box-shadow: 0 0 1em rgba(0, 0, 0, .3);
        z-index: unset;
    }
    .side_container{
        width:100%;
        font-size: 1em;
        padding:.3em;
        border-radius:0;
        background-color: rgb(245, 245, 245);
        box-shadow:none;
        opacity:1;
    }
    .side_item{
        height:1.8em;
        margin:.07em;
        background-color: rgb(245, 245, 245);
        color:black;
        border-bottom:solid .05em rgb(235,235,235);
        border-radius:0;
        cursor:pointer;
        font-size: .96em;
    }
    .side_open_icon{
        filter:none;
        height:1em;
    }
    .side_sub{
        background:none;
    }
    .side_item_txt{
        padding:.1em;
    }
    .nav_menu_addon{
        display:none;
    }
    /* ---media desktop / tablet (szersze buttony w side-bar) --------------------------------------------------- */
    @media(max-height:900px){
        .side_item{
            height:2.2em;
            margin:.07em;
            /* cursor:unset; */
        }
    }
    @media(max-height:600px){
        .side_item{
            cursor:unset;
        }
    }
    /* ---media desktop main content (main container) --------------------------------- */
    .main_container_with_sidebar{
        max-width:100%;
    }    
    .main_container{
        max-width:100%;
        padding:0;
    }
    .projects_shadow{    
        padding:2em .4em;
    }
    .project{
        width:46%;
        margin: .7em;
        justify-content: space-between;
    }
    .about_us{
        height:24em;
    }
    .static_content_header{
        height:24em;
    }
    .txt_underline_red{
        font-size: 2.3em;
    }
    /* ---media desktop SHOP (SKLEP) -------------------------------------------------- */
    button{
        font-size:.88rem;
        padding:.7rem;
    }
    button:hover{
        background-color: rgb(255, 0, 0);
        font-weight: bold;
    }
    .button_inactive{
        font-size:.88rem;
        padding:.7rem;
    }
    .button_inactive_prod{
        font-size:.88rem;
        padding:.7rem;
        width:50%;    
    }
    .wypelniacz2{
        height:20em;
    }
    /* ---media desktop PAGINACJA ----------------------------------------------------- */
    .pagination_button{
        width:1.8em;
        padding:.3em;
    }
    .pagination_button_active{
        width:2em;
        border:.1em solid rgb(150,150,150);
        color:rgb(110,110,110);
        padding:.3em;
        transition:.1s;
        cursor: pointer;
    }
    .pagination_button_active:hover{
        background-color: rgb(255, 0, 0);
        color:white;
        font-weight: bold;
    }    
    .pagination_button_inactive{
        width:2em;
        border:.1em solid rgb(220,220,220);
        color:rgb(200,200,200);
        padding:.3em;
        transition:.1s;
    }
    /* ---media desktop - single product ---------------------------------------------- */
    .product_div_left{
        padding:1.2em 1.2em .5em 1.2em;
    }
    .product_div_right{
        padding:0 1.2em 1em 1.2em;
    }
    .product_div_right p{
        line-height:1.3em;
    }
    .product_price{
        font-size:1.3em;
    }
    .product_price_detail{
        font-size:1.3em;
    }
    .product_div_right button:hover{
        background-color: rgb(255, 0, 0);
        font-weight: bold;
    }
    .img_container{
        width:85%;
    }
    .no_image{
        margin-top:1em;
    }
    .product_img{
        cursor:pointer;
    }
    .product_img_hover{
        width:18%;
    }
    /* ---media desktop / tablet - pomniejszenie głównego zdjęcia -------------- */
    @media(max-height:970px){
        .img_container{
            width:74%;
        }   
        .product_img_hover{
            width:15%;
        }
        .product_hover_container{
            margin-top: .5em;
        }
        .blog_title{
            font-size:.9em;   
        }
    }
    @media(max-height:700px){
        .img_container{
            width:70%;
        }
    }
    /* ---media desktop footer -------------------------------------------------------- */
    .footer_container{
        display: flex;
        flex-direction: row;          
        align-items: flex-start;
        flex-wrap: wrap;
        text-align: center;
    }
    .footer_logo{
        cursor: pointer;
    }
    .footer_feature{
        width:40%;
        padding:3vw;
        height: 140px;
    }
    .footer_feature li{
        cursor:pointer;
    }
    footer ul a:hover{
        box-shadow: 0 0 1.5em .8em var(--link_a_hover_shadow);
        background-color: var(--link_a_hover_backgound);
        font-weight: bold;
    }
    .footer_social_circle{
        cursor: pointer;
    }
    .footer_social_circle:hover{
        opacity: 1;
        border: 2px solid var(--social_border_color_hover);
        box-shadow: 0 0 .6em .4em var(--social_shadow_color);
    }
    /* ---media desktop contact ------------------------------------------------------- */
    .all_form_container{
        width: 40em;
        max-width:100%;
    }
    .circle_red{
        top:-3em;
        left:11em;
    }
    .circle_gray{
        bottom:-3em;
        right:11em;    
    }
    .contact{
        padding:1em;
    }
    .contact_form{
        padding: 1em;
    }
    .contact_form_box textarea{
        height:20em;
        max-height:20em;
    }
    .container_shop_info{
        flex-direction: row;
        align-items: flex-start;
        padding:.5em .5em 2em .5em;
        width:100%;
    }
    .shop_info{
        width:33%;
        padding:.5em;
    }
    /* ---media desktop uniwersalne (desktop) ----------------------------------------------------------------- */
    .one_button_top0{
        width:60%;
    }
    .home_full_width_cnt_gray_desktop_only{
        background-color:var(--home_gray_background);
    }
    .home_full_width_white_bar_desktop_only{
        display:block;
        background-color: rgb(253,253,253);
        width:100%;
        height:2em;
    }
    .wypelniacz_h1em_mob_only{
        display:none;
    }
} /* ----end DESKTOP / tablet landscape------- */



/* ---------- media footer 921px---------------------------------------------------------------------- */
@media(min-width:921px){
    footer{
        background-image:url(/img/footer.jpg);
    }    
    .footer_feature{
        width:30%;
        padding:2vw;
    }
}
/* -------- media 1024 ------------------------------------------------------------------------ */
@media(min-width:1024px){
    .product_div{
        flex-direction: column;
    }
    .product_div_right button{
        width:50%;
    }
    /* ---- media 1024 SHOP (SKLEP) -------------------------------------------------- */
    .card{
        /* width:32.3%; */
        width:24%;
        padding:1%;
        border:.01em solid rgb(240,240,240);
        margin:.5% .5% 1% .5%;
        box-shadow: 0 0 .5em rgba(0,0,0,.05);
        transition:.2s;
    }
    .card:hover{
        transform:scale(1.01);
        box-shadow: 0 0 1.5em rgb(180,180,180);
     }
    .card_content h3{
        font-size:.93em;
    }
    /* ---media 1024 blog-------------------------------------------------------- */
    .blog_item_cnt{
        min-width:33.3%;
        max-width:33.3%;
        padding:.8em;
    }
}

/* ------ media 1200px --------------------------------------------------------------------------------------------------------------- */
@media(min-width:1280px){
    header{
        padding:0 7em;
    }
    /* ---media 1200 home banner---------------------------------------- */
    .home_baner_container{
        background-size:100vw auto;
        height: 40em;
    }
    /* --- media 1280 main content (main container) --------------------------------------------------------------- */
    .project{
        width:30%;    
    }
    /* ---media 1280 blog-------------------------------------------------------- */
    .blog_item_cnt{
        min-width:25%;
        max-width:25%;
        padding:.8em;
    }
    /* ---media 1200 slider2----------------------------------------------------- */
    .slide2_item_cnt{
        min-width:19.2%;
        max-width:19.2%;
    }
}

/* --------- UNIWERSALNE KLASY------------------------------------------------------------------------------------ */
.cnt_std_width{
    /* width:1250px; */
    width:1400px;
    max-width:100%;
}
.cnt_just_left{
    justify-content: flex-start;
}
.color_red{
    color:rgb(200,0,0);
}
.display_none{
    display:none;
}
.wypelniacz_3em{
    display:flex;
    width:100%;
    height:unset;
    margin-bottom:3em;
}
.btn_click_click{
    background-color: rgb(0,230,230);
    border-color:rgb(0,220,220);
}
.red_color{
    color:rgb(200,0,0);
}
.green_color{
    color:rgb(0,140,0);
}
.blue_color{
    color:rgb(0, 100, 250);
}
.red_background{
    background-color:rgb(255,100,100);
}
.img_loading{
    opacity:0;
}
.top_p0_m0{
    padding-top:0;
    margin-top:0;
}
.no_padding_bottom{
    padding-bottom: 0;
}
.padding_bottom1{
    padding-bottom:3em;
}
.wypelniacz_height{
    height:100%;
}
.offline_error{
    /* background-color: rgb(200,0,0); */
    background: linear-gradient(45deg,rgb(150,0,0),rgb(220,0,0));
    border:.1em solid rgb(150,0,0);
    color:white;
    text-shadow: 0 0 1em rgba(255,255,255,1);
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    width:20em;
    max-width: 90%;
    padding:3em 2em;
    margin:2em 0;
    box-shadow: .3em .3em 2em rgba(0,0,0,.7);
}
.img_edge_darken_filter{
    width:100%;
    height:100%;
    background:linear-gradient(180deg, rgba(0,0,0,.5),rgba(0,0,0,0),rgba(0,0,0,0),rgba(0,0,0,.5));
}
.scale_07{
    transform:scale(.7);
}
.scale_08{
    transform:scale(.75);
}
.scale_085{
    transform:scale(.85);
}
.scale_09{
    transform:scale(.9);
}
.basket_modal_small{
    top:var(--header_height_desktop_modal_small);
}
.opacity_0{
    opacity:0;
}
.width100{
    width:100%;
}
.border_g1{
    border:.01em solid rgb(200,200,200);
}
.font_09{
    font-size:.9em;
}

/* ------animowany napis--------------------------------------------- */
.home_zdj_tlo_przesuwane_title {
  max-width:100%;
  transform: scale(0.94);
  animation: scale 8s forwards cubic-bezier(0.5, 1, 0.89, 1);
}
@keyframes scale{
  100% { transform: scale(1); }
}
.home_zdj_tlo_przesuwane_title span{
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
}
.home_baner_txt_cnt span{
    display: inline-block;
    opacity: 0;
    filter: blur(1px);
  }
span:nth-child(1)  { animation: fade-in .8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(2)  { animation: fade-in .8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(3)  { animation: fade-in .8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(4)  { animation: fade-in .8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(5)  { animation: fade-in .8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(6)  { animation: fade-in .8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(7)  { animation: fade-in .8s 0.7s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(8)  { animation: fade-in .8s 0.8s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(9)  { animation: fade-in .8s 0.9s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(10) { animation: fade-in .8s 1.0s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(11) { animation: fade-in .8s 1.1s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(12) { animation: fade-in .8s 1.2s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(13) { animation: fade-in .8s 1.3s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(14) { animation: fade-in .8s 1.4s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(15) { animation: fade-in .8s 1.5s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(16) { animation: fade-in .8s 1.6s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(17) { animation: fade-in .8s 1.7s forwards cubic-bezier(0.11, 0, 0.5, 0); }
span:nth-child(18) { animation: fade-in .8s 1.8s forwards cubic-bezier(0.11, 0, 0.5, 0); }
@keyframes fade-in{
    /* 0%{color:white;} */
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
@keyframes home_zdj_tlo_przesuwane_txt2_fade_in{
    0%{
        opacity: 0;
        filter: blur(4px);
    }
    60%{
        opacity: 0;
        filter: blur(4px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
      }
}
@keyframes fade_in1{
    0%{ opacity:0; }
    100% { opacity: 1; }
  }

/* ================ klasy mdv ============================================================ */
.mdv_div_cnt{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    }
.mdv_div_box{
    display: flex;
    margin-bottom: 0.5rem;
    width:100%;
}
.mdv_icon{
    width:12%;
}
.mdv_div_txt{
    width:98%;
    padding:0.3rem;
}
.mdv_icon img{
    padding-right: 0.3rem;
    width:100%;
}
.mdv_screenshot_cnt{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width:100%;
    margin-bottom: 1rem;
    margin-top:.5rem;
}
.mdv_screenshot_box img{
    width:100%
}
/* ---- mdv screen box portrait----------- */
.mdvScrBoxPortr_cnt{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    margin-top:1rem;
}
.mdvScrBoxPortr1{
    width:50%;
    padding:2%;
    order:2;
}    
.mdvScrBoxPortr1 img{
    width:100%;
}
.mdvScrBoxPortr2{
    width:100%;
    padding:2%;
    order:1;
}
.h1s{
    width: 100%;
    background-color: rgb(230, 230, 230);
    font-size: 1.3rem;
    font-weight: bold;
    text-align: center;
    padding: .7em;
    border-radius: .3em;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.h2s{
    width: 100%;
    background-color: rgb(230, 230, 230);
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    padding: .7em;
    border-radius: .3em;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

@media (min-width: 900px){
    .mdv_div_cnt{
        justify-content: flex-start;        
    }   
    .mdv_div_box img{
        padding-right: 1.1rem;
    } 
    .mdv_icon{
        width:5%;
    }
    .mdv_screenshot_box img{
        width:65%;
    }
    .mdvScrBoxPortr_cnt{
        flex-wrap: nowrap;
    }
    .mdvScrBoxPortr1{
        width:30%;
        padding:2% 2% 0 0;
        order:1;
    }
    .mdvScrBoxPortr1 img{
        width:100%;
    }   
    
}