@media screen and (max-width: 1300px) {
    .row {
        padding: 30px 0;
    }
    .row-b {
        padding: 0 0 30px;
    }
    .row-t {
        padding: 30px 0 0;
    }
    h1 {
        font-size: 26px;
        margin-bottom: 20px;
    }
    .content-text * {
        margin: 10px 0;
    }
    table {
        display: block;
        overflow-y: scroll;
    }
}

@media screen and (max-width: 1150px) {
    .order-info .status {
        width: 110px;
    }
}

@media screen and (max-width: 1000px) {
    header {
        width: 50px;
    }
    .header{
        padding: 10px;
    }
    header + #content {
        transform: translateX(50px);
        width: calc(100% - 50px);
    }
    header a[data-icon="plus"] {
        margin: 0 -10px;
    }
    table tbody td,
    table thead td{
        padding: 5px;
    }
    .btn {
        border-radius: 10px;
        padding: 12px 15px;
    }
    .block {
        padding: 20px;
    }
    .order-info .info{
        width: 100%;
        margin: 0 0 20px;
    }
}

@media screen and (max-width: 1150px) and (min-width: 641px) {
    .order-info {
        padding-left: 130px;
    }
}

@media screen and (max-width: 900px) {
    body {
        font-size: 14px;
    }
    .container {
        padding: 0 10px;
    }
    .form-inline {
        padding: 10px;
    }
    .form-inline {
        margin: 0 0 10px;
    }
    #avatar li {
        margin: 10px 0 0;
        width: 100%;
    }
    #avatar li:first-child{
        margin: 0
    }
    #avatar .fio {
        font-size: 20px;
    }
}

@media screen and (max-width: 780px) {
    #h1 h1{
        width: 100%;
    }
    .form-col {
        grid-template-columns: repeat(1, 1fr);
    }
    .create-sizes > .img {
        width: auto;
        margin: 0 auto 20px;
    }
    .create-sizes > div {
        width: 100%;
    }
    .man-info img {
        width: 100px;
    }
    .man-info .fio {
        width: calc(100% - 100px);
        padding-left: 10px;
    }
}

@media screen and (max-width: 640px) {
    .block-grid,
    .list-col{
        grid-template-columns: repeat(1,1fr) !important;
    }
    .block-grid > .block,
    .buttons{
        grid-column: initial;
    }
    input[type="checkbox"] + label,
    input[type="radio"] + label {
        padding: 0 0 0 35px;
    }
    input[type="checkbox"] + label,
    input[type="radio"] + label {
        margin-left: 0;
    }
    .draganddrop .upload {
        margin: 20px 0;
    }
    .draganddrop .upload span {
        width: 30px;
        height: 30px;
    }
    .draganddrop .upload label {
        padding: 0 0 0 40px;
    }
    #avatar .img {
        width: 100px;
        height: 100px;
    }
    #avatar .info {
        width: calc(100% - 120px);
    }
    .order-info.block{
        display: block;
        padding-top: 60px;
    }
    .order-info .status {
        width: 100%;
        height: 50px;
    }
    .order-info .hard {
        margin: 0 0 20px;
    }
    .popup {
        min-width: 250px;
    }
}

@media screen and (max-width: 480px) {
    body{
        padding: 0 0 50px;
    }
    header + .content {
        transform: none;
        width: 100%;
        border-radius: 0 0 var(--radius) var(--radius);
    }
    header{
        top: auto;
        bottom: 0;
        height: 50px;
        width: 100%;
        z-index: 2;
        background: inherit;
    }
    #logo{
        display: none;
    }
    .header {
        display: flex;
        justify-content: space-between;
    }
    header ul + ul {
        margin: 0
    }
    header li {
        float: left;
        margin: 0 10px 0 0;
    }
    header li:last-child{
        margin: 0;
    }
    header ul a {
        display: inline-block;
        margin: 0;
        min-width: 30px;
    }
    header a[data-icon="plus"] {
        margin-left: 0;
        min-width: 45px;
        margin-top: -7px;
    }
    #avatar label {
        margin: 0 auto;
    }
    #avatar .fio {
        text-align: center;
    }
    body #gpt_icon {
    	bottom: 60px;
    	right: 10px;
    }
}

@media screen and (max-width: 430px) {
    .block {
        padding: 10px;
    }
    .create-count .form-group:nth-child(1) {
        width: 150px;
    }
    #avatar .info {
        width: 100%;
        margin: 10px 0 0;
    }
    .profile-statistic .count {
        width: 50px;
    }
}