@media(min-width: 1600px){
    .container{
        max-width: 1600px;
    }
}
@media(max-width: 1650px){
    .step-8 ul {
        column-gap: 0px;
    }
    .step-8 ul li svg {
        right: 8;
        width: 21px;
    }
    .step-font {
        margin-top: 15px;
    }
    .basic-plan tr td:first-child {
        width: 71.853px;
    }
    .step-8 ul li {
        width: 55px;
    }
}

@media(max-width: 1599px){
    :root{
        --fs-30: 25px;
    }

    .right-flex {
        padding-bottom: 30px;
    }
    .item_one {
        max-width: 362px;
        width: 100%;
    }
    .img-upload-main {
        max-width: 33%;
        margin-top: 10px;
    }
    .canvas-edit .fs-25{
        font-size: var(--fs-20);
    }

    .flex-canvas{
        display: block;
    }
    .canvas-height .flex-canvas .canvas-area {
        width: 70%;
        height: 280px;
        margin: 0 auto;
    }
    .folder-main {
        height: 129.351px;
    }
    .step-bar {
        width: 18.135px;
        height: 18.135px;
        border: 2.9px solid var(--white);
    }

    .step-8 ul li {
        margin-right: 8px;
        width: 42px;
    }
    .step-8 ul li svg {
        right: 0;
        width: 18px;
        top: -2px;
    }
    .step-8 li.active .step-bar::after {
        width: 6px;
        height: 6px;
        transform: translate(-3px , 4px);
    }
    .canvas-height .flex-canvas .canvas-area {
        width: 55%;
        height: 310px;
    }
    .canvas-item1{
        width: 100%;
    }

    .want-more{
        padding-bottom: 40px;
    }
    .content-btb {
        margin-top: 20px;
    }
}

@media(max-width: 1399px){
    :root{
        --fs-20: 18px;
        --fs-25: 20px;

        --fs-60: 50px;
    }
    .left-flex {
        width: 250px;
    }
    .item_one {
        max-width: 280px;
        width: 100%;
    }
    .left_items {
        height: 134.5px;
    }

    .right-flex-image {
        display: grid;
    }
    .form-left-box {
        width: 100%;
    }
    .img-upload-main {
        max-width: 100%;
    }
    .form-content {
        padding-top: 40px;
        padding-bottom: 30px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .img-upload-main{
        margin-bottom: 40px;
    }
    .column-flex {
        gap: 40px;
    }

    .form-left-box{
        order: 1;
    }
    .right-flex-image {
        justify-content: normal;
    }
    .header{
        padding-right: 0;
    }

    .content-same-details {
        padding: 33px 15px;
    }
    .table-logo img {
        max-width: 200px;
    }

    .table-right-content .h6 {
        font-size: var(--fs-16);
    }

    .checklist-row li{
        font-size: var(--fs-25);
    }

    .content-same {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .canvas-res{
        height: 300px;
        position: relative;
    }
    .canvas-res .canvas{
        height: 100%;
    }

    /* .folder-main {
        height: 127.351px;
    } */

    .folder-main {
        height: 154.351px;
    }
    
    .folder-main .fs-20{
        font-size: var(--fs-16);
    }
    .content-height {
        min-height: 738px;
    }
    .content-responsive-1399{
        margin-top: 35px;
    }
    .content-same.content-padding .step-8 {
        margin-top: 50px;
        margin-bottom: 0;
    }
    .flex-canvas {
        display: flex;
    }

    .content-height .btn-warning, .content-height .btn-success {
        position: static;
    }
    .content-height {
        min-height: 100%;
    }
    .canvas-height {
        min-height: 100%;
    }

    .next-lock {
        left: 0;
        position: static;
        bottom: 0;
        border: 0;
        text-align: center;
        width: 100%;
    }
    .want-more .btn{
        margin-left: 85px;
    }
    .folder-flex-mini {
        max-width: 100%;
    }
    .canvas-item1 {
        width: 40%;
    }
    .tax-original .canvas-area {
        width: 300px;
        height: 300px;
    }

    .canvas-area-step {
        display: block;
        width: 100%;
        height: 100%;
        position: relative;
        margin: 0 auto;
        margin-top: 0;
    }
    .take-image {
        column-gap: 15px;
    }
    .content-same-1018 ol li{
        font-size: var(--fs-25);
    }
    .basic-plan tr td:first-child {
        width: auto;
    }
    .basic-plan {
        margin-bottom: 40px;
    }
}

@media(max-width: 1199px){
    :root{
        --fs-30: 20px;
    }
    .body-content {
        margin-top: 50px;
    }
    .main_flex {
        display: block;
        gap: 0;
    }
    .right-flex {
        width: calc(100% - 0px);
    }

    .header-flex div:nth-child(2)::before {
        content: '';
        height: 100%;
        top: 0;
        right: -20px;
    }
    .header-flex {
        gap: 15px;
    }

    .main-header {
        position: sticky;
        top: 0;
        left: 0;
        width: 100%;
        background-color: #102437;
        z-index: 1;
        backdrop-filter: blur(100px);
        box-shadow: 0px 0px 9px -2px #000000;
        z-index: 999;
    }

    .header {
        padding-top: 15px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 15px;
    }
    .mobile-menu{
        display: block;
    }


    .left-flex {
        position: fixed;
        top: 76px;
        height: calc(100% - 75px);
        transform: translateX(-100%);
        animation: leftAnimationDown 0.3s forwards;
        transition: all 0.3s;
    }
    @keyframes leftAnimationDown {
        0%{
            transform: translateX(0%);
        }
        100%{
            transform: translateX(-100%);
        }
    }
    .left-flex.animationLeft {
        transform: translateX(-100%);
        z-index: 2;
        animation: leftAnimation 0.3s forwards;
    }
    @keyframes leftAnimation {
        0%{
            transform: translateX(-100%);
        }
        100%{
            transform: translateX(0%);
        }
    }

    .logo {
        text-align: center;
        padding-top: 31px;
        padding-left: 33.08px;
        padding-right: 33.08px;
        margin-bottom: 59px;
    }

    .left_ul ul {
        padding-left: 0;
        margin-bottom: 0px;
    }
    .left_ul ul li {
        margin-bottom: 30px;
    }
    .header-flex-right{
        display: none;
    }
    .header {
        justify-content: flex-start;
    }
    .header-flex{
        margin-left: 15px;
    }


    .content-res{
        display: flex;
    }

    .content-responsive{
        margin-top: 30px;
    }

    .folder-main {
        height: 154.351px;
    }

    .content-height {
        min-height: 100%;
    }
    .content-height .btn-warning, .content-height .btn-success{
        position: static;
    }

    .send-tds-lock {
        margin-top: 60px;
        padding-top: 40px;
    }

    .next-lock {
        position: static;
        padding-top: 0;
    }

    .send_email {
        min-height: 300px;
        height: 100%;
    }


    .quickbooks {
        min-height: 100%;
    }
    .quickbooks-svg svg{
        max-width: 200px;
    }

    .small-email {
        margin-top: 60px;
    }
    .content-same-1018{
        margin-top: 20px;
    }
    .step-submit .content-mb {
        max-width: 100%;
    }

    .full-logo .white-logo {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .payment-confirm .fs-60 {
        margin-bottom: 20px;
    }
}

@media(max-width: 991px){
    :root{
        --fs-25: 18px;
        --fs-60: 30px;
    }
    .header-flex-right {
        max-width: 288px;
    }
    .form-search .input-group {
        max-width: 236px;
    }
    .payment-confirm .fs-60 {
        margin-bottom: 25px;
    }

    .custom-modal .modal-body {
        min-height: 360px;
        max-width: 767px;
        width: 100%;
    }

    .folder-grid .folder-main{
        margin: 0 auto; 
    }  
    .folder-grid .row .col-12:nth-child(even) .folder-main{
        margin-left: 10px;
    }
    .folder-grid .row .col-12:nth-child(odd) .folder-main{
        margin-right: 10px;
    }
    .folder-flex-mini{
        margin-left: 0;
    }
    .want-more .btn {
        margin-left: 10px;
    }
    .folder-flex-mini .folder-grid .row .col-12:nth-child(odd) .folder-main{
        margin-right: auto;
        margin-left: 10px;
    }
    .video_take-picture video{
        width: 100%;
        height: 100%;
    }

    .video_loop{
        display: flex;
        flex-wrap: wrap;
        gap: 0;
    }
    .video_loop .video_items {
        width: 100%;
        max-width: calc(100% / 3);
        padding-right: 10px;
    }
    .video_loop{
        margin-bottom: 15px;
    }
    .video_details{
        display: none;
    }

    .video_youtube {
        max-width: 100%;
        height: 400px;
        margin-bottom: 0;
    }

    
}

@media(max-width: 767px){
    :root{
        --fs-76: 60px
    }
    .item_tow {
        width: 100%;
    }
    .column-flex {
        display: grid;
        gap: 30px;
    }

    .left_box{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        max-width: 100%;
        gap: 30px;
    }

    .left_box .left_items{
        width: 100%;
        max-width: calc(94% / 2);
    }
    .item_one{
        width: 100%;
        max-width: 100%;
    }
    .left_items {
        height: 97px;
    }

    .left_box {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        max-width: 100%;
        row-gap: 0;
        column-gap: 25px;
    }

    .content-table table thead th {
        white-space: nowrap;
    }
    .content-white {
        margin-top: 30px;
    }
    .logoheader{
        display: block;
    }
    .content-table {
        padding: 30px 10px;
    }
    .logoheader .table-logo{
        margin-bottom: 15px;
    }

    .flex-canvas {
        display: block;
    }
    .quickbooks-svg {
        margin-bottom: 0;
    }
    .quickbooks-svg svg {
        max-width: 70px;
    }
    .folder-flex-mini .folder-grid .row .col-12:nth-child(odd) .folder-main{
        margin-right: 15px;
        margin-left: auto;
    }
    .canvas-item1 {
        width: 100%;
    }
    .tax-original .flex-canvas .canvas-item1::after {
        content: '';
        position: absolute;
        width: 1px;
        height: 100%;
        background-color: transparent;
        top: 0;
        left: auto;
        right: -62px;
    }
    .content-responsive {
        overflow: hidden;
    }
    .tax-original .canvas-area {
        margin: 0 auto;
    }
    .user-validation p{
        margin-bottom: 8px;
    }

    .modal-btn {
        position: static;
    }

    .video_youtube {
        height: 300px;
    }

    .flex_ancher {
        display: flex;
        column-gap: 119px;
        margin-top: 25px;
        justify-content: space-between;
        margin-bottom: 25px;
    }
    .user_pic {
        width: 60px;
        height: 60px;
    }
    .ca-names .ca-orgname{
        font-size: var(--fs-14);
    }
    .ca-names p{
        font-size: var(--fs-14);
    }
}

@media(max-width: 575px){
    .step-8 ul {
        display: grid;
        column-gap: 8px;
        padding-left: 0;
    }
    .step-8 ul li {
        margin-right: 8px;
        width: 60px;
        padding-left: 40px;
        margin-bottom: 23px;
        position: relative;
    }
    .step-8 li.active .step-bar,
    .step-8 li .step-bar{
        position: absolute;
        left: 0;
    }
    .step-font {
        margin-top: 5px;
    }
    .step-8 ul li svg {
        right: auto;
        width: 18px;
        top: auto;
        left: 0;
        transform: rotate(90deg);
        bottom: -24px;
    }
    .step-8 ul li {
        margin-bottom: 40px;
    }
    .step-8 ul li:last-child{
        margin-bottom: 0px;
    }

    .custom-modal .modal-body {
        max-width: 575px;
        margin: 0 auto;
        width: 400px;
    }

    .content-white-box {
        min-height: 100%;
    }
    .content-same-full .ul-default {
        padding-left: 20px;
        padding-right: 20px;
    }
    .content-same-full .fs-30 {
        padding-bottom: 30px;
    }
    .seect-ca ul{
        padding-left: 0;
    }
    .hire-content .content-same.content-padding{
        padding-left: 0;
        padding-right: 0;
    }
}

@media(max-width: 440px){
    :root{
        --fs-18: 16px;
    }
    .left_box .left_items {
        width: 100%;
        max-width: calc(93% / 2);
    }
    .input_file input {
        width: 100%;
    }
    .input_file {
        overflow: hidden;
    }


    .modal-header .btn-close {
        right: 3px;
        top: 4px;
    }

    .custom-modal .modal-body {
        min-height: auto;
        max-width: 340px;
        width: 340px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        padding-top: 30px;
    }

    .content-table table thead th {
        white-space: nowrap;
        font-size: var(--fs-16);
        font-weight: var(--fw-400);
    }

    .table thead th{
        min-width: 150px;
    }
    .checklist-row ul {
        margin-bottom: 40px;
    }

    .folder-grid .row div[class*="col-"] {
        margin-bottom: 20.65px;
    }

    .canvas-height .flex-canvas .canvas-area {
        width: 90%;
        height: 350px;
    }
    .canvas-item1 {
        width: 100%;
    }

    .take-image {
        display: block;
        margin-bottom: 20px;
    }
    .content-same-1018 ol li{
        font-size: var(--fs-16);
    }
    .take-image .fs-30{
        margin-bottom: 15px;
    }
    .video_youtube {
        height: 250px;
    }
}

@media(max-width: 428px){
    :root{
        --fs-30: 18px;
        --fs-20: 16px;
    }
    .left_box .left_items {
        width: 100%;
        max-width: calc(100% / 1);
        border-radius: 12px;
        margin-bottom: 7px;
        height: 65px;
    }
    .header-flex {
        width: 398px;
    }
    .header-flex img.ig-fluid{
        width: 45px;
    }
    .header-flex .fs-30{
        margin-bottom: 0;
    }
    .header-flex {
        gap: 12px;
    }
    .header-flex div:nth-child(2)::before {
        content: '';
        right: -16px;
    }
    .form-content {
        padding-top: 22px;
    }
    .left_ul ul li {
        margin-bottom: 25px;
    }
    .mobile-menu {
        width: 37px;
    }
    .user_upload_img span{
        white-space: nowrap !important;
    }
    .canvas-edit {
        display: block;
    }
    .canvas-edit .btn{
        margin-top: 15px;
    }
    .canvas-edit div:first-child {
        width: 100%;
    }

    .content-white-box{
        padding: 11px 15px;
    }
    .unorder-list li .fs-16{
        font-size: var(--fs-14);
    }


    .logo_whiteBox {
        margin-bottom: 30px;
        max-width: 250px;
        width: 166px;
    }

    .before-content {
        margin-bottom: 20px;
        max-width: 60px;
    }
    .send_email p{
        font-size: var(--fs-20);
    }

    .content-same-1018 {
        padding: 20px 20px;
    }

}

@media(max-width: 375px){
    .content-same-1018-white .upload-file-design span:last-child {
        font-size: var(--fs-14);
    }
    .content-btb {
        border-top: 1px solid var(--white);
        display: grid;
        justify-content: space-between;
        padding-top: 20px;
        gap: 12px;
        text-align: center;
        margin: 0 auto;
        align-items: center;
        justify-content: center;
    }
    .video_youtube {
        height: 210px;
    }
    .flex_ancher {
        column-gap: 35px;
    }
}