@media only screen and (max-width: 980px){

/********************  MAIN LAYOUT   ********************/

    #sidebar{
        flex-basis: 25%;
        margin: 0 0 0 20px;
    }
    

/********************   HOME CATEGORIES   ********************/

    .tablet-mobile{display: block;}
    .tablet{display: block;}
    .mobile{display: none;}
    .pc{display: none;}


/********************   HEADER   ********************/
    #header{
        padding:  0;
    }
    #header .wrapper {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    #header .logo .domain {
        flex: 1 0 100%;
    }
    #header .logo p {
        display: none;
    }
    #header .logo h1{
        margin: 0;
        line-height: 14px; /*  Line height is the same as in .domain */
        font-size: 10px;
    }
    #header .logo .domain,
    #header .logo .domain span{
        font-size: 20px;
        line-height: 20px;
    }
        #header .logo .domain span {
            font-size: 10px;
        }
    #header .user-menu .account,
    #header .user-menu .add {
        padding: 5px 10px;
    }
        #header .user-menu .add{
            font-size: 34px;
        }
    #header .user-menu .account span,
    #header .user-menu .add span{
        font-size: 10px;
    }
    #header .user-menu .add div{
        text-align: center;
    }

/********************   HOME SEARCH   ********************/

    .home .underHeader .main-search{
        min-width: 75%;
    }

    
/********************   HOME CATEGORIES / Tabs / Panels  ********************/

    .home .underHeader #tabs {
        display: flex;
        justify-content: space-between;
        border-bottom: 0;
    }
    .home .underHeader #tabs .box {
        flex: 1 1 auto;
        overflow: hidden;
        border: 1px solid transparent;
    }

    .home .underHeader #tabs .box.active {
        position: relative;
        top: 1px;
        z-index: 2;
        border: 1px solid #d3d3d3;
        border-bottom: none;
        background: #fff;
    }

    .home .underHeader #tabs .pcIcons{
        display: block;
        margin: 0 0 10px 0;
        padding: 60px 10px 0 10px;/* 70px - for icon + 10px offset background in #tabs * parent */
        text-align: center;
        font-size: 13px;
        color: #000;
        outline: none;
        background-position: center top 10px;
        background-size: 52px 45px;
    }

    .home .underHeader #panels {
        display: block;
        border-bottom: 10px solid transparent;
    }

    .home .underHeader #panels .box {
        flex: 0 1 auto;
        overflow: hidden;
        padding: 20px;
        box-shadow: none;
    }
        .home .underHeader #panels .oferuje{
            flex-grow: 0;
        }
    .home .underHeader #panels .box.active {
        border: 1px solid #d3d3d3;
        background: #fff;
    }
    .home .underHeader #panels .see-all{
        display: inline-block;
        margin-bottom: 10px;
        font-weight: bold;
    }
    .home .underHeader #panels .pcIcons{
        display: none;
    }

    .home .underHeader #panels ul,
    .home .underHeader #panels .oferuje ul{
    column-gap: 10px;
    column-count: 3;
    }

    .home .underHeader #panels ul li{
        /* zapobiega dzieleniu elementu w taki sposob, ze czesc jest na dole, a reszta na gorze w nowej kolumnie */
        -webkit-column-break-inside: avoid; /* Chrome, Safari */
        page-break-inside: avoid;           /* Theoretically FF 20+ */
        break-inside: avoid-column;         /* IE 11 */
        display:table;                      /* Actually FF 20+ */
    }

    .home .underHeader #panels ul li a {
        padding: 12px 0;
        font-size: inherit;
    }
    
    /* .home .underHeader */
    .container{
        max-height: none;
    }

/********************   LISTING CLASSIFIEDS / ADS / ITEMS   ********************/

    .home .latest-premium,
    .home .latest-free{
        margin: 0 0 20px 0;
    }

        /*
            Display as grid
        */
        .listing.grid li{
            flex-grow: 0;
            flex-shrink: 1;
        }
            .listing.grid.premium li{
                width: 32%;
                margin: 0 2% 15px 0;
            }
                .listing.grid.premium li:nth-child(3n) {
                    margin-right: 0;
                }
            /* 6 items */
            .listing.grid.free li{
                width: 23%;
                margin: 0 2.666% 15px 0;
            }
                .listing.grid.free li:nth-child(4n) {
                    margin-right: 0;
                }
                
                .listing.grid.free li:nth-child(6n) {
                    margin-right: 2.666%; /*reset*/
                }

    /* 
        to make image responsive and square
    */
    .listing.list .photoBox{
        flex-shrink: 0;
        width: 25%;
    }

                
    .listing.grid .attributes .category,
    .listing.grid .attributes .location {
        display: none;
    }
    .listing.grid .attributes .price{
        margin: 0;
        padding: 0;
    }
    
    
    



/********************   FILTERS   ********************/
    .categories{
        display: none;
    }



/********************   ITEM   ********************/
    .item .lookLikeButton.phone,
    .item .lookLikeButton.mail {
        padding-left: 10px;
        color: #fff;
        text-align: center;
    }
        .item .lookLikeButton.phone {
            padding-top: 60px;
            pointer-events: auto;
            background: no-repeat center top 10px url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAdCAMAAACQRsywAAAAclBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9wvwjfAAAAJXRSTlMA/N325QnmRDBvIHFSv3uAYDhIJhlCKw21Bs6d4Xhbxs3R1KPswHRGhQAAAI5JREFUKM/VkekOwjAIgNmqrvbc5eZ9Td7/FU0HEZvFB/D7UcqXlEIAEAKWA+R0weM+V01hR3KNJoY2qOeIGg4KP/hexekFG06LdDwcRoQ516br7+niKh0BM3apOD9hqlmV0kX9W61E2aXa/o+yyxmvrM6wZuDCKuNLHU8UW1GGo0vK0354UfTNTSopk8QbBysbMoxdsEwAAAAASUVORK5CYII='),
            linear-gradient(to bottom, #0058a0 0%,#0058a0 50px,#0074d2 50px,#0074d2 100%);
        }
        .item .lookLikeButton.mail {
            padding-top: 50px;
            background: no-repeat center top 10px url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAWCAMAAAAPf7fDAAAAt1BMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////911ZqYAAAAPHRSTlMAMax4o+sG77D11cbQAzcMcpn35B4BaPb6uo4R3RwWQCOTp/CC2G3ciV+9Syv8XFNl4aqaKi5Xwyk558njVeSfAAABBklEQVQoz3XS13qCQBAF4KH3KgKCiqCAMcZIejnv/1wBI/kAN+dy/60zSxTqyn8pK6IQdcGrrPBFCYHq2gksYiaQzS/aPs0lM2Do2ois54gUlc5YHm94o8MlUeucHh+kzwlzM5yod8q22v2IM8XvBnrvpt8NuN3QpqH/HtcnxPKDxt5eF7srCzBXNHVyVHiXQiRYpHTrRAeor84LD+NvZOSuLwERIMUCw9MC7wG35xN7tYC6njqnI5evq6w9lvbYT3E8fP+bhvPA5QQlN6rf0YQn9x4cwKeT+jsijE3nbX8bCIz+VpDktr+NLocZ83vYlWVI5MLMPZEVL/9uSz4XGl9jx5/trB/R/RuHoAKXWAAAAABJRU5ErkJggg=='),
            linear-gradient(to bottom, #0058a0 0%,#0058a0 40px,#0074d2 40px,#0074d2 100%);
        }

    .item .thumbs {
        display: none;
    }
        
    /*
        On this property based JS galery in item in global.js
    */
    .item .mobile-galery{
        display: block;
    }
    
    /********************   ADD ITEM   

        Orygilan css file: css/ajax-uploader.css

    ********************/
    /* settigs for uploaded images - 3 images in line */
    .qq-upload-list li {
        flex-basis: 32%;
        margin-right: 2%;
    }
    .qq-upload-list li:nth-child(4n) {
        margin-right: 0;
    }



    .addToMore{
        display: block;
        width: 100%;
    }

        .locale{
            margin-bottom: 30px;
        }




    
}












@media only screen and (max-width: 600px){

    .tablet{display: none;}
    .mobile{display: block;}

/********************   MAIN LAYOUT   ********************/
    
    .search #content > .wrapper,
    .item #content > .wrapper{
        flex-wrap: wrap;
    }
    #main{
        flex-grow: 1;
        flex-shrink: 0;
        flex-basis: 100%;
    }
    #sidebar{
        flex-grow: 1;
        flex-shrink: 0;
        flex-basis: 100%;/* this settings is use in user-public-sidebar.php in JS */
        margin-left: 0;
        padding: 0;
        border: 0;
    }
    
    
/********************   HOME SEARCH   ********************/

    .home .underHeader .search {
    }

    .home .underHeader .main-search{
        min-width: 100%;
    }


/********************   HOME MENU   ********************/

    .home .underHeader #tabs .pcIcons{
        padding: 45px 10px 0 10px;/* 45px - for icon + 10px offset background in #tabs * parent */
        font-size: 10px;
        background-size: 30px 25px;
    }

    .home .underHeader #panels ul,
    .home .underHeader #panels .oferuje ul{
        column-gap: 30px;
        column-count: 2;
    }

/********************   HOME ABOUT SITE   ********************/


    .about-site ul.categories {
        justify-content: flex-start;
    }
    .about-site .categories li {
        flex: 1 1 100%;
        margin-bottom: 20px;
    }
    .about-site .categories li:nth-child(odd){
        margin-right: 0;
    }


/********************   FORMS   ********************/    

/* 
    .resp-wrapper keep only FORMS items, it is used in files with form like
:
    contact with admin,
    user change e-mail, user change password user change username,
    forgot password 
    login
    recover password (when user is not login)
*/
.resp-wrapper {
    max-width: 100%;
    margin: 0 auto;
}

    .home .main-search button,
    #filters button[type="submit"] {
        padding: 0px 25px;
        background: #0058a0 center center no-repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAb1BMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9Eya1FAAAAJHRSTlMAzwIkExn1fq3c79gJdRHz/HLLFXDZeCd7K8Zqgt+r4wfqwal7phQZAAAAfUlEQVQIHQXBCWKCQBAAsAgLy1lhReuJtp3/v7EJSHM5Hu9bAm4l+n1/xf0b0iFyU1XNM34TclyBZ2xM5z4BzbtQDx2g2lvqoQNUfy1TP34Bp9cBl5iBHCvWaOeGJkc58Wgj4tx1fZQbjyWWfBmHYcwJP7GsTHX9Adf3BoB/MCAHtonhDqQAAAAASUVORK5CYII=');
        
    }
    .home .main-search button span,
    #filters button[type="submit"] span{
        display: none;
    }
    
    
/********************   FILTERS   ********************/
    .filters-main{
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .filters-category{
        
    }

    #filters .row {
        margin: 0;
    }
    .filters-category fieldset{
        margin: 5px;
    }
 

    .filters-main .what {
        width: calc(100% - 60px);
        order: 1;
    }
    .filters-main .button {
        order: 2;
    }
    .filters-main .where {
        width: 40%;
        order: 3;
        margin-bottom: 5px;
    }
    .filters-main .category {
        width: 40%;
        order: 4;
        margin-bottom: 5px;
    }
    .filters-main .more {
        display: block;
        width: 15%;
        order: 5;
        margin-bottom: 5px;
    }

    #filters .filterCloseX {
        position: absolute;
        z-index: 1;
        bottom: 5px;
    /*  left: xxx; - left calculate in js. Need this when there is range like "price" */ 
        font-size: 20px;
        cursor: pointer;
    }

    #filters .filterCloseX,
    .js-active-filter-element {
        background: #ffcd87;
    }
    
 /********************   CHANGE SELECT TO MENU   ********************/
 #filters .boxForNewMenu{
     max-height: 80vh;
 }
    
/********************   LISTING CLASSIFIEDS / ADS / ITEMS   ********************/


    .listing.grid.free li,
    .listing.grid.premium li{
        width: 48%;
        margin: 0 4% 20px 0;
    }
        .listing.grid.free li:nth-child(2n),
        .listing.grid.premium li:nth-child(2n) {
            margin-right: 0;
        }
        
    .listing.list .description p{
        display: none;
    }
    
    .listing.list .attributes {
        display: none;
    }
    
    .listing.list h3 a {
        display: block;
        height: 65px;
        overflow: hidden;
        text-decoration: none;        
        font-weight: bold;
        line-height: 150%;
        color: #000;
        font-size: 16px;
    }

    ::-webkit-scrollbar {
        -webkit-appearance: none;
    }

    ::-webkit-scrollbar:vertical {
        width: 12px;
    }

    ::-webkit-scrollbar:horizontal {
        height: 12px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, .5);
        border-radius: 10px;
        border: 2px solid #ffffff;
    }

    ::-webkit-scrollbar-track {
        border-radius: 10px;  
        background-color: #ffffff; 
    }

/********************   ITEM   ********************/

    .item .underHeader{
        margin: 0;
    }

    .item .item-photos{
        max-height: 70vw;
        min-height: 0;
        margin: 0;
    }
    .item .lookLikeButton.phone,
    .item .lookLikeButton.mail {
        padding-left: 65px;
        padding-top: 10px;
        color: #fff;
        text-align: left;
    }
        .item .lookLikeButton.phone {
            background: no-repeat left 18px center url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAdCAMAAACQRsywAAAAclBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9wvwjfAAAAJXRSTlMA/N325QnmRDBvIHFSv3uAYDhIJhlCKw21Bs6d4Xhbxs3R1KPswHRGhQAAAI5JREFUKM/VkekOwjAIgNmqrvbc5eZ9Td7/FU0HEZvFB/D7UcqXlEIAEAKWA+R0weM+V01hR3KNJoY2qOeIGg4KP/hexekFG06LdDwcRoQ516br7+niKh0BM3apOD9hqlmV0kX9W61E2aXa/o+yyxmvrM6wZuDCKuNLHU8UW1GGo0vK0354UfTNTSopk8QbBysbMoxdsEwAAAAASUVORK5CYII='),
            linear-gradient(to right, #0058a0 0%,#0058a0 50px,#0074d2 50px,#0074d2 100%);
        }
        .item .lookLikeButton.mail {
            background: no-repeat left 10px center url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAWCAMAAAAPf7fDAAAAt1BMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////911ZqYAAAAPHRSTlMAMax4o+sG77D11cbQAzcMcpn35B4BaPb6uo4R3RwWQCOTp/CC2G3ciV+9Syv8XFNl4aqaKi5Xwyk558njVeSfAAABBklEQVQoz3XS13qCQBAF4KH3KgKCiqCAMcZIejnv/1wBI/kAN+dy/60zSxTqyn8pK6IQdcGrrPBFCYHq2gksYiaQzS/aPs0lM2Do2ois54gUlc5YHm94o8MlUeucHh+kzwlzM5yod8q22v2IM8XvBnrvpt8NuN3QpqH/HtcnxPKDxt5eF7srCzBXNHVyVHiXQiRYpHTrRAeor84LD+NvZOSuLwERIMUCw9MC7wG35xN7tYC6njqnI5evq6w9lvbYT3E8fP+bhvPA5QQlN6rf0YQn9x4cwKeT+jsijE3nbX8bCIz+VpDktr+NLocZ83vYlWVI5MLMPZEVL/9uSz4XGl9jx5/trB/R/RuHoAKXWAAAAABJRU5ErkJggg=='),
            linear-gradient(to right, #0058a0 0%,#0058a0 50px,#0074d2 50px,#0074d2 100%);
        }
    .item article{
        margin-top: 15px;
    }
    
    .item .mobile-contact-button{
        display: block;
    }
    .item #pc_s_message{
        display: none;
    }
    .item #mobile_s_message{
        display: block;
    }
    .ui-button--mail{
        display: none;
    }

/********************   PAGINATION   ********************/

.paginate {
    margin-bottom: 30px;
}
/********************   ADD / POST ITEM   ********************/
    /*
        Used in add item 
        #boxForNewMenu ul float="none" is use in JS
        to check it is moblie or not!!!
    */
	.item-post #boxForNewMenu ul {
        float: none;
        width: 100%;
    }
    
    /* settigs for uploaded images - 3 images in line */
    .qq-upload-list li {
        flex-basis: 48%;
        margin-right: 4%;
    }
    .qq-upload-list li:nth-child(4n) {
        margin-right: 0;
    }
    
    .item-post .seller_info .control-group {
        flex-basis: 100%;
    }
    

/********************   FOOTER   ********************/

#footer .resp-toggle{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    
    list-style: none;
    margin: 0;
    padding: 0;
}
#footer .resp-toggle li {
    flex-basis: 50%;
    padding: 10px 0;
    text-align: center;
}


/********************   USER ACCOUNT   ********************/

    .user .actions{
        display: block;
    }
    .user #main{
        order: 2;
    }
    .user #sidebar{
        order: 1;
    }
    
    .user .user_menu{
        display: flex;
        align-items: space-between;
        flex-wrap: wrap;
        
        margin: 0 0 30px 0;
    }
    .user .user_menu li{
        flex-basis: 48%;
    }

    /********************   USER PUBLIC PROFILE    ********************/
    .user-public-profile .mobile-contact-button{
        display: block;
    }











}


