


@media screen and (max-width:991px){
    body{
        overflow-x: hidden;
        margin: 0px;
        padding: 0px;
        width: 100%;
    }
    section{
        padding: 35px;
    }
    
    .Our-Benefits .benifit_width .Our-Benefit-titel {
        padding: 50px 100px 50px 20px;
        margin-left: 0px;
        max-width: auto;
    }
    
    .our-benefit-2 .Our-Benefit-text {
        margin-top: 80px;
        padding-left: 35px;
    }
    .end-part-1, .end-section .end-part-2,
    .end-section .end-part-3{
        margin-left: 0px;
        margin-bottom: 30px;
    } 
    
    .Product-item .pi-img img {
        height: 100%;
        width: 100%;
    }
    

    .our-benefit-2 .Our-Benefit-text{
        padding-left: 20px;
        padding-right: 20px;
        height: auto;
        max-width: unset;
    }
    .Product-item .t-shirt-box{
        margin-top: 25px;
        height: auto;
    }
    .Product-item .t-shirt-box h2.title_shirts{
        font-size: 30px;
    }
    header, .privacy header{
        height: auto;
        padding-bottom: 180px;
    }
    .privacy header{
        padding-bottom: 0px;
    }
    header.product_header{
        padding-bottom: unset;
    }
    .contact-info .contact-box{
        min-height: auto;
        height: auto;
        margin-top: 30px;
    }
    .register .reg_area .reg_images .reg_img, .register .reg_area .reg_images .reg_logo, .register .reg_area .reg_images .reg_head {
        padding: 0px 20px;
    }
    .register .reg_area .reg_images .reg_head h4{
        padding: 0;
    }
    .register .reg_area .reg_images .reg_head h4 {
        font-size: 30px;
        line-height: 38px;
        margin-bottom: 20px;
    }
    .register .reg_area .reg_inner .form-group .input_area.mb-30{
        margin-bottom: 15px;
    }

    .product_area .allproduct .filter{
        display: block;
        padding: 30px 0px;
    }
    .product_area .allproduct .filter .filter_by, .product_area .allproduct .filter .sortby {
        margin: 20px 0px 0;
    }

    .Product-Collection .Product-Collection-titel h2 {
        font-size: 25px;
        font-weight: 600;
    }

    section.Product-item.pt-50.pb-140{
        padding: 40px 0px;
    }
    header .menu .navbar li.nav-item:first-child, 
    header .menu .navbar li.nav-item:first-child a.nav-link{
        padding-left: 0px;
    }
    .table_inner{
        overflow: auto;
    }
    .cart_section .cart_area .table{
        width: max-content;
    }
    .cart_section .cart_area .item_total_area .itemtotal p{
        text-align: right;
    }

    
    .custom_design .upload_main_area .upload_detail {
        margin-bottom: 25px;
    }
    .custom_design .custom_select{
        margin-top: 20px;
    }
}


/* ====== end { 991 } ========== */


@media screen and (max-width:767px){
    body{
        overflow-x: hidden;
        margin: 0px;
        padding: 0px;
        width: 100%;
    }
    section{
        padding: 35px;
    }
    .Our-Benefits .Our-Benefits-img img {
        margin-top: 40px;
    }
    .Our-Benefits .Our-Benefit-titel {
        padding-left: 40px;
    }
    .our-benefit-2 .Our-Benefits-img2 img {
        width: 100%;
        margin-top: 0;
    }
    .faq {
        margin-top: 20px;
    }
    .faq .faq-box {
        padding: 0 0px;
    }
    .end-section .end-part-2 {
        margin-left: 0px;
        margin-top: 20px;
    }
    .end-section .end-part-3 {
        margin-left: 0px;
        margin-top: 20px;
    }
    .Product-item .pi-img {
        margin-bottom: 20px;
    }
    .Product-item .table-box .no-1-colam {
        padding: 20px 20px;
    }
    .Product-item .table-box .no-2-colam {
        padding: 20px 20px;
    }
    .Product-item .table-box .no-1-colam .size-num h3 {
        font-size: 12px;
    }
    .Product-item .table-box .no-2-colam .size-num h3 {
        font-size: 12px;
    }
    .contact-info .contact-box {
       margin-top: 20px;
    }


    body.height{
        overflow: hidden;
        height: 100vh;
    }
    button.navbar-toggler::before{
        position: fixed;
        content: "";
        width: calc(100% - 250px);
        height: 100vh;
        top: 0;
        right: 0;
        opacity: 0.4;
        background: #000000;
        transition: all 0.28s ease-in-out;
    }
    button.navbar-toggler.collapsed::before{
        width: 0px;
        transition: all 0.28s ease-in-out;
    }



    .navbar-toggler, .navbar-toggler.collapsed{
        padding: 0;
        border: 0;
        position: relative;
        z-index: 10;
        text-align: left;
        flex: 1;
        z-index: 999;
    }
    .navbar-toggler:focus{
        box-shadow: none;
    }
    
    
    .navbar-toggler .menubar{
        width: 22px;
        z-index: 10;
        height: 2px;
        display: inline-block;
        position: absolute;
        background: #ffffff;
        left: 10px;
    }

    .navbar-toggler .cross{
        position: fixed;
        top: 48px;
        left: 20px;
        opacity: 1;
        transform: scale(1);
        transition: all 0.3s ease-in-out;
        animation: cross 2s;
    }
    @keyframes cross {
        0%{
            opacity: 0;
            transform: scale(0.5);
        }
        30%{
            opacity: 1;
        }
        70%{
            transform: scale(1.1);
        }
        100%{
            transform: scale(1);
        }
    }
    .navbar-toggler.collapsed .cross{
        opacity: 0;
        transition: all 0.3s ease-in-out;
        animation: none;
    }
    .navbar-toggler .bars{
        opacity: 0;
        transition: all 0.3s ease-in-out;
    }
    .navbar-toggler.collapsed .bars{
        opacity: 1;
        transition: all 0.3s ease-in-out;
    }
    
    .navbar-toggler .cross i{
        color: #ffffff;
        font-size: 30px;
    }
    .navbar-toggler.collapsed .menubar{
        background: #000000;
    }
    .navbar-toggler.collapsed .cross i{
        color: #000000;
        padding-left: 10px;
    }
    .navbar-toggler .menubar:nth-child(2){
        top: 7px;
    }
    .navbar-toggler .menubar:last-child{
        top: 14px;
        width: 14px;
    }

    header .menu .navbar .menucollapse{
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99;
    }
    header .menu .navbar .menucollapse ul{
        width: 250px;
        height: 100vh;
        padding-top: 100px;
        background: #000000;
    }
    header .menu .navbar li.nav-item{
        padding-left: 12px;
    }
    header .menu .navbar .menucollapse ul  li.nav-item a.nav-link{
        color: #ffffff;
        padding: 12px 8px;
    }

    header .menu .navbar .profile_cart{
        margin-right: 10px;
    }


    .Product-item .t-shirt-box .accordion-item .accordion-header button{
        display: block;
    }
    .Product-item .t-shirt-box .accordion-item .accordion-button::after {
        position: absolute;
        right: 20px;
        top: calc(50% - 10px);
    }
    .Product-item .table-box{
        overflow: auto;
    }
    .Product-item .table-box .no-1-colam, .Product-item .table-box .no-2-colam {
        width: 1000px;
    }
    .our-benefit-2 .Our-Benefits-img2{
        display: none;
    }

    .privacy_section .privacy_area .nav button.nav-link{
        font-size: 17px;
    }

    .product_area .allproduct .filter .filter_by .dropdown .dropdown-toggle, .product_area .allproduct .filter .sortby .dropdown .dropdown-toggle{
        margin: 0px 10px;
    }

    .product_area .nav{
        display: grid;
        grid-template: auto / auto auto;
    }
    .product_area .nav button.nav-link:nth-child(1), .product_area .nav button.nav-link:nth-child(2){
        border-bottom: 0px;
    }
    .product_area .nav button.nav-link:nth-child(2){
        border-right: 2px solid #FF5D31;
    }

    .product_main .quickmodal.modal .modal-body .product_details .decoration_content .sizeprice {
        align-items: flex-start;
        flex-direction: column;
    }
    .size_name, .allsize, .offprice, .priceinclude {
        margin-bottom: 15px;
    }
    .product_main .quickmodal.modal .modal-dialog{
        width: calc(100% - 50px);
        margin-left: auto;
    }

    .cart_section .cart_area .item_total_area {
        padding: 20px;
        align-items: flex-start;
        flex-direction: column;
    }
    .cart_section .cart_area .item_total_area .coupon_area form{
        margin: 10px 0;
    }
    .cart_section .cart_area .table .product_detail .product_detail_inner h4{
        font-size: 16px;
    }
    .cart_section .cart_area .table .product_detail .product_detail_inner p{
        font-size: 15px;
    }
    .cart_section .cart_area .table .product_detail .product_detail_inner .color_pr p{
        font-size: 13px;
    }
    header .menu .navbar li.nav-item:first-child, header .menu .navbar li.nav-item:first-child a.nav-link{
        padding-left: 12px;
    }
}



/* ====== end { 767 } ========== */


@media screen and (max-width:575px){

    section{
        padding: 35px 0px;
    }
    .Product-Collection .product-box2 {
        height: auto;
    }
    .Product-Collection .product-box2 .pb2-img {
        height: auto;
    }
    header .titel h1{
        font-size: 40px;
    }
    header .titel p{
        font-size: 16px;
    }
    header .titel a{
        width: 100%;
    }
    .Product-Collection .Product-Collection-titel h2{
        font-size: 35px;
    }
    .Product-Collection .product-box2 .pb2-text h3{
        font-size: 14px;
    }
    .Product-Collection .product-box2 .pb2-text h4{
        font-size: 18px;
        line-height: 22px;
    }
    .Our-Benefits .benifit_width .Our-Benefit-titel{
        padding:50px 20px 0px
    }
    .Our-Benefits .Our-Benefit-titel a, .our-benefit-2 .Our-Benefit-text .baton a.submit_btn{
        width: 100%;
    }
    .Our-Benefits .Our-Benefits-img img{
        max-width: 100%;
        height: auto;
    }
    .our-benefit-2 .Our-Benefits-img2 img{
        display: none;
    }
    .our-benefit-2 .Our-Benefits-img2{
        height: unset;
        width: none;
    }
    .Our-Benefits .Our-Benefits-img{
        height: unset;
    }
    .our-benefit-2 .Our-Benefit-text input{
        width: unset;
    }
    header{
        padding-bottom: 120px;
        height: unset;
    }
    .our-benefit-2 .Our-Benefit-text{
        padding-left: 20px;
        height: auto;
        padding-right: 20px;
    }
    .our-benefit-2 .Our-Benefit-text h2 {
        font-size: 30px;
    }
    .faq .faq-box .section_title{
        font-size: 30px;
    }
    .faq .faq-box h2 button{
        padding: 20px 22px;
        padding-right: 35px;
        padding-left: 15px;
        text-align: left;
    }
    .faq .faq-box .faq-accordion .accordion-item .accordion-body p{
        font-size: 14px;
    }
    .Product-item .t-shirt-box .accordion-item .accordion-header button span, .Product-item .t-shirt-box .accordion-item .accordion-header button p {
        font-size: 12px;
    }
    .register{
        padding: 0px;
    }

    .product_area .allproduct .filter .filter_by, .product_area .allproduct .filter .sortby{
        display: block;
    }
    .product_area .allproduct .filter .filter_by .dropdown, .product_area .allproduct .filter .sortby .dropdown, .product_area .allproduct .filter .filter_by p, .product_area .allproduct .filter .sortby p{
        margin-bottom: 10px;
    }
    select{
        white-space: break-spaces;
    }

    .custom_design .upload_main_area .nav{
        display: grid;
        grid-template: auto / auto auto auto;
    }
    .custom_design .upload_main_area .design_output .slider .slider_nav h3{
        height: 90px;
    }
}


@media screen and (max-width:480px){
    header .titel {
        margin-top: 100px;
    }
    .privacy_section .privacy_area .nav button.nav-link {
        font-size: 16px;
        padding: 14px 8px;
    }
    .product_main .quickmodal.modal .modal-body {
        padding-left: 10px;
        padding-right: 10px;
    }
    .custom_design .upload_main_area .design_output .slider .slider_nav h3 {
        height: auto;
    }
}


/* ====== end { 575 = 480 } ========== */


/* ====== end { 380 } ========== */

