/* эскиз для верстки по размерам */
@media only screen and (min-width: 320px) and (max-width: 479px),
only screen and (min-device-width: 320px) and (max-device-width: 479px) {
    /* 320 - 480 */

    body .content-footer .footer-bl .footer-contacts {
        flex: 0 0 100%;
        text-align: center;
    }
    body .content-footer .footer-bl .text-footer {
        text-align: center;
        margin-bottom: 10px;
    }

    body .content-footer .phone-bl-ft .str-phone {
        margin-top: 35px;
    }
    body .content-footer .text-bl-ft p.f-m-t-rzd {
        font: normal normal normal 14px / 18px GothaProReg;

        text-align: center;
        margin: auto;
        width: 80%;
        margin-top: 30px;
    }

    body .content-footer .ph-em-text {
        text-align: left;
    }

    body .content-footer .bottom-menu {
        text-align: center;
        margin-bottom: 15px;
    }
   
    body h2.detail-h2 {
        font: normal normal bold 24px / 26px GothaProBol;
    }
    body .wrap .page {        

        min-width: 320px;
        box-sizing: border-box;
        max-width: 100%;
        padding: 0px 10px;
    }
    body .page-carusel {
        width: 350px;
    }
    body .footer .content-footer {
        width: 100%;
        box-sizing: border-box;
        height: auto;
        padding: 0px 10px;
    }
    body .steps .steps-conent {
        width: 350px;
    }
    body .content-footer .text-bl-ft {
        width: auto;
    }
    body .steps-conent .conteiner-steps .red-str {
        display: none;
    }
    body .steps-conent .conteiner-steps {
        margin-top: 20px;
        width: 100%;
        background-image: none;
        background-color: #fff;
        height: auto;
        margin-bottom: 20px;
    }
    body .carusel-js .slick-manual-left {
        left: 0px;
        z-index: 1;
    }
    body  .carusel-js .slick-manual-rigth {
        z-index: 1;
        right: 0px;
    }
    body .page .header .bl-top-menu {
        display: none;
    }

    body .item-news .fon-news img {
        width: 100%;
    }
    body .content-news .item-news {
        width: 100%;
        margin-right: -5px;
        margin-bottom: 20px;
    }
    body .premuchestva .item-pr .bl-text {
        width: 220px;
    }
    body .premuchestva .item-pr:nth-child(1) {
        width: 310px;
    }
    body .page .text-point .item-point {
        width: 100%;
        margin-right: -5px;
    }
    body .menu-main li {
        margin-right: 5px;
        margin-top: 0px;
        width: 48%;

        margin-bottom: 5px;
        margin-top: 5px;
    }
    body .menu-main li a {
        font: normal normal normal 20px/26px GothaProMed !important;
    }
    body .lk li a {
        font: normal normal normal 20px/26px GothaProMed !important;
    }
    body .menu-main li.march::before {
        top: 10px;
    }
    body .lk li {
        margin: 0px;
        padding: 0px;
        margin-top: 0px;
    }
    body .lk li a {
        font: normal normal normal 16px/26px GothaProMed;
    }
    body .menu-header .lk {
        float: left;
        float: unset;
    }

    body .forma-header .text h1 {
        font: normal normal 26px/26px GothaProBol !important;
    }

    body .forma-header .text p {
        font: normal normal 16px/20px GothaProMed !important;
        margin-bottom: 10px;
    }

    body .forma-header .text {
        margin-top: 0px;
    }

    body .page .menu-header {
        
        box-sizing: border-box;
        position: absolute;
        width: 100vw;
        top: 0px;
        left: 0px;
        background-color: #fff;
        z-index: 10;
        padding: 10px;
        transform: scaleY(0);
        transform-origin: top;
        transition: transform 0.2s ease;
        box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.08), 0px 4px 16px rgba(0, 0, 0, 0.08);
    }

    body .page .menu-header.open {
        transform: scaleY(1);        
    }

    body .march-items {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 10px;
        margin-top: 20px;
    }

    body .march-items .item {
        display: inline-block;
        width: 45%;
        vertical-align: top;
        margin-bottom: 5px;
    }

    body .page .header .bttn-mobil {

        display: block;
        z-index: 11;
      
        width: 42px;
        height: auto;
        cursor: pointer;
        display: flex;

        background-image: url(/web/img/menu-burger.svg);
        background-size: contain;
    }
    body .page .header .bttn-mobil.open {
        background-image: url(/web/img/close-burger.svg);

        width: 30px;
        height: 29px;
        margin-top: 6px;
        margin-right: 6px;
    }

    body .page .header {
        width: 100%;
        margin-top: 16px;
        padding-bottom: 15px;
        border-bottom: 1px solid #e5e5e5;
        
        height: auto;

        display: flex;
        justify-content: space-between;
    }
    body .bl-phone .str-phone-text {
        font: normal normal normal 11px/14px GothaProReg;
    }
    body .forma-header .text h1 {
        font: normal normal 30px/40px GothaProBol;
    }
    body .forma-header .text p {
        font: normal normal 18px/24px GothaProMed;
    }
    body .premuchestva {
        margin-top: 30px;
        margin-bottom: 30px;
    }
    body .carusel-text .h-text h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .page-carusel .carusel-content {
        margin-top: 30px;
    }
    body .carusel-all {
        height: 700px;
    }
    body .select-pay h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .select-pay {
        margin-top: 30px;
    }
    body .select-pay .items-pict {
        margin-top: 20px;
        margin-bottom: 30px;
    }
    body .select-pay .item-pic {
        width: 45%;
        margin-left: 0px;
    }
    body .steps-conent .steps-text h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .steps-conent .steps-text {
        margin-top: 30px;
    }
    body .steps {

        height: auto;
    }
    body .steps-conent .in-bl-text {
        display: inline-block;
        vertical-align: top;
        width: 94%;
        margin-top: 10px;
        margin-left: 10px;
        margin-right: 10px;
    }
    body .steps-conent .text-steps-p {
        font: normal normal normal 14px/20px GothaProLig;
    }
    body .steps-conent .hed-text-stps {
        font: normal normal normal 20px/24px GothaProMed;
    }
    body .content-news .text-news h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .content-news .text-news {
        margin-top: 30px;
    }
    body .page .text-point h3 {
        text-align: left;
        font: normal normal bold 30px/38px GothaProBol;
        letter-spacing: 0px;
        color: #13244A;
        margin-top: 30px;
    }
    body .item-point .h-point {

        font: normal normal normal 20px/20px GothaProMed;
    }
    body .item-point .t-point {
        font: normal normal normal 14px/22px GothaProReg;
    }
    body .content-footer h3.h3-f {
        text-align: left;
        font: normal normal bold 30px/38px GothaProBol;
        letter-spacing: 0px;
        color: #FFFFFF;
        opacity: 1;
        margin-top: 30px;
    }
    body .content-footer .text-bl-ft p {
        text-align: left;
        font: normal normal normal 14px/20px GothaProReg;
    }
    body .content-footer .phone-bl-ft {
        display: inline-block;
        vertical-align: top;
        margin-left: 0px;
        margin-bottom: 00px;
    }
    body .content-news .carusel-news {
        margin-top: 43px;
        margin-bottom: 30px;
    }
    body .select-pay .item-pic img {
        width: 90%;
    }

    body .data-price-cnt-bl .time-data {
        width: 90%;

        width: 100%;
        display: flex;
    }
    body .time-data .data-string-bl {
        margin: 40px 0px 0px 20px;
    }
    body .data-march .data-march-text   {
        width: 90%;
    }
    body .price-bl .buy-item .type-text {
        margin: unset;
        width: unset;
        min-width: 100px;
    }
    body .price-bl .buy-item .type-price {
        margin: unset;
        width: unset;
        text-align: unset;
    }
    body .naiti-bilet {
        margin: unset;
        width: unset;
        text-align: unset;
    }
    body .n-pzd {
        
        flex: 1;
    }

    body .data-march .data-march-header {
        display: none;
    }

    body .info-item .data-poezd {
        display: flex;
        flex-wrap: wrap;
    }
    body .u-pzd {
        flex: 1 1 100%;
    }

    body .price-bl .buy-item {        
        width: 100%;
        height: 100%;
        display: flex;
        box-sizing: border-box;
        justify-content: space-between;
        gap: 10px;
        align-content: center;
        align-items: baseline;

        box-sizing: border-box;
        padding: 5px 5px;
        margin: 5px 0px;
    }

    .data-price-cnt-bl .price-bl {
        width: 100%;
    }

    body .page .header .bl-phone {
        display: none;
    }

    body .menu-main li {
        width: 100%;
    }

    body .price-bl .buy-item {
        flex-wrap: wrap;
    }

    body .menu-bar {
        flex: 1;
    }

    body .menu-bar {       
    
        padding: 10px 3px;
        flex: 1 1 100%;
    }
}
@media only screen and (min-width: 480px) and (max-width: 599px),
only screen and (min-device-width: 480px) and (max-device-width: 599px) {
    /* 480 - 600  */
    body .wrap .page {
        width: 450px;
    }
    body .page-carusel {
        width: 450px;
    }
    body .footer .content-footer {
        width: 450px;
        height: auto;
    }
    body .steps .steps-conent {
        width: 450px;
    }
    body .content-footer .text-bl-ft {
        width: auto;
    }
    body .steps-conent .conteiner-steps .red-str {
        display: none;
    }
    body .steps-conent .conteiner-steps {
        margin-top: 20px;
        width: 99%;
    }
    body .carusel-js .slick-manual-left {
        left: 0px;
        z-index: 1;
    }
    body  .carusel-js .slick-manual-rigth {
        z-index: 1;
        right: 0px;
    }
    body .page .header .bl-top-menu {
        display: none;
    }
    body .page .header .bl-phone {
        width: 150px;
    }
    body .bl-phone .str-phone {
        font: normal normal normal 18px/24px GothaProMed;
    }
    body .bl-phone .str-phone-text {
        font: normal normal normal 11px/14px GothaProReg;
    }
    body .menu-main li a {
        font: normal normal normal 16px/26px GothaProMed;
    }
    body .lk li a {
        font: normal normal normal 16px/26px GothaProMed;
    }
    body .menu-main li {
        margin-right: 15px;
    }
    body .lk li {
        margin-top: -45px;
    }
    body .forma-header .text {
        margin-top: 40px;
    }
    body .forma-header .text h1 {
        font: normal normal 30px/38px GothaProBol;
    }
    body .forma-header .text p {
        text-align: left;
        font: normal normal 14px/26px GothaProMed;
    }
    body .premuchestva {
        margin-top: 40px;
        margin-bottom: 40px;
    }
    body .premuchestva .item-pr .bl-text p.h {
        text-align: left;
        font: normal normal 20px/26px GothaProMed;
    }
    body .bl-text p.t {
        text-align: left;
        font: normal normal 14px/20px GothaProLig;
    }
    body .page-carusel .carusel-content {
        width: 100%;
        margin-top: 40px;
    }
    body .carusel-text .h-text h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .carusel-text .ahref-text a {
        text-align: right;
        font: normal normal normal 16px/26px GothaProMed;
    }
    body .select-pay {
        margin-top: 40px;
    }
    body .select-pay h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .select-pay .item-pic img {
        width: 80%;
    }
    body .steps-conent .steps-text h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .steps-conent .steps-text {
        margin-top: 40px;
    }
    body .steps-conent .in-bl-text {
        width: 27%;
        margin-top: 10px;
        margin-left: 10px;
        margin-right: 10px;
    }
    body .steps-conent .hed-text-stps {
        font: normal normal normal 20px/26px GothaProMed;
    }
    body .steps-conent .text-steps-p {
        font: normal normal normal 13px/18px GothaProLig;
    }
    body .content-news .text-news {
        margin-top: 40px;
    }
    body .content-news .text-news h3 {
        font: normal normal bold 30px/38px GothaProBol;
    }
    body .content-news .text-news a {
        font: normal normal normal 16px/26px GothaProMed;
    }
    body .content-news .item-news {
        text-align: left;
        margin-bottom: 20px;
    }
    body .content-news .carusel-news {
        margin-top: 40px;
        margin-bottom: 40px;
        text-align: center;
    }
    body .content-news .item-news:last-child {
        margin-right: 25px;
    }
    body .item-news .name-news {
        text-align: left;
        font: normal normal normal 20px/26px GothaProMed;
    }
    body .page .text-point h3 {
        font: normal normal bold 30px/40px GothaProBol;
        margin-top: 40px;
    }
    body .item-point .h-point {
        font: normal normal normal 20px/26px GothaProMed;
    }
    body .item-point .t-point {
        text-align: left;
        font: normal normal normal 14px/22px GothaProReg;
    }
    body .page .text-point .buy-bilet {
        margin-bottom: 40px;
    }
    body .content-footer h3.h3-f {
        font: normal normal bold 30px/38px GothaProBol;
        margin-top: 40px;
    }
    body .content-footer .text-bl-ft p {
        font: normal normal normal 14px/22px GothaProReg;
    }
    body .content-footer .phone-bl-ft {
        margin-left: -10px;
    }
    body .content-footer .bottom-menu {
        margin-top: 30px;
        margin-left: 15px;
        margin-bottom: 30px;
    }

}
@media only screen and (min-width: 600px) and (max-width: 767px),
only screen and (min-device-width: 600px) and (max-device-width: 767px) {
    /* 600 - 768  */
    body .wrap .page {
        width: 570px;
    }
    body .page-carusel {
        width: 570px;
    }
    body .footer .content-footer {
        width: 570px;
        height: auto;
    }
    body .steps .steps-conent {
        width: 570px;
    }
    body .content-footer .text-bl-ft {
        width: auto;
    }
    body .steps-conent .conteiner-steps .red-str {
        display: none;
    }
    body .steps-conent .conteiner-steps {
        margin-top: 45px;
        width: 98%;
    }
    body .carusel-js .slick-manual-left {
        left: 0px;
        z-index: 1;
    }
    body  .carusel-js .slick-manual-rigth {
        z-index: 1;
        right: 0px;
    }
    body .steps-conent .in-bl-text {
        display: inline-block;
        vertical-align: top;
        width: 27%;
        margin-top: 20px;
        margin-left: 20px;
        margin-right: 10px;
    }
    body .steps-conent .hed-text-stps {
        font: normal normal normal 20px/26px GothaProMed;
    }
    body .steps-conent .text-steps-p {
        font: normal normal normal 14px/20px GothaProLig;
    }
    body .steps-conent .steps-text h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .steps-conent .steps-text {
        margin-top: 50px;
    }
    body .ul-top-bl {
        display: none;
    }
    body .menu-main li {
        margin-right: 20px;
    }
    body .menu-main li a {
        font: normal normal normal 15px/26px GothaProMed;
    }
    body .lk li a {
        font: normal normal normal 15px/26px GothaProMed;
    }
    .forma-header .text h1 {
        font: normal normal 28px/40px GothaProBol;
    }
    body .forma-header .text p {
        font: normal normal 20px/26px GothaProMed;
    }
    body .premuchestva {
        margin-top: 50px;
    }
    body .carusel-text .h-text h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .page-carusel .carusel-content {
        margin-top: 50px;
    }
    body .select-pay h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .content-news .text-news {
        margin-top: 60px;
    }
    body .content-news .text-news h3 {
        text-align: left;
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .content-news .item-news {
        text-align: left;
        margin-bottom: 20px;
    }
    body .content-news .carusel-news {
        text-align: center;
    }
    body .content-news .item-news:last-child {
        margin-right: 24px;
    }
    body .page .text-point h3 {
        text-align: left;
        font: normal normal bold 28px/40px GothaProBol;
        margin-top: 60px;
    }
    body .content-footer h3.h3-f {
        font: normal normal bold 28px/40px GothaProBol;
        margin-top: 60px;
    }
    body .content-footer .phone-bl-ft {
        margin-left: 0px;
    }
    body .content-footer .bottom-menu {
        margin-top: 30px;
        margin-left: 15px;
        margin-bottom: 30px;
    }

}
@media only screen and (min-width: 768px) and (max-width: 960px),
only screen and (min-device-width: 768px) and (max-device-width: 960px) {
    /* 768 - 960  */


    body .wrap .page {
        width: 708px;
    }
    body .page-carusel {
        width: 708px;
    }
    body .footer .content-footer {
        width: 708px;
    }
    body .steps .steps-conent {
        width: 708px;
    }
    body .ul-top-bl li a {
        font: normal normal normal 14px/18px GothaProLig;
    }

    body .content-footer .text-bl-ft {

        width: auto;
    }
    body .page .header .bl-top-menu {
        width: calc(100% - 435px);
    }
    body .ul-top-bl {
        margin-right: 20px;
    }
    body .ul-top-bl li {
        margin-left: 5px;
    }
    body .bl-phone .str-phone {
        font: normal normal normal 18px/22px GothaProMed;
    }
    body .page .header .bl-phone {
        width: 160px;
    }
    body .bl-phone .str-phone-text {
        font: normal normal normal 11px/14px GothaProReg;
    }
    body .menu-main li a {
        font: normal normal normal 14px/28px GothaProMed;
    }
    body .menu-main li {
        margin-right: 15px;
    }
    body .lk li a {
        font: normal normal normal 14px/28px GothaProMed;
    }
    body .premuchestva {
        text-align: center;
    }
    body .premuchestva .item-pr .bl-text p.t {
        font: normal normal 14px/20px GothaProLig;
    }
    body .premuchestva .item-pr .bl-text {
        width: 210px;
    }
    body .premuchestva .item-pr:nth-child(1) {
        width: 300px;
    }
    body .premuchestva .item-pr {
        margin-bottom: 20px;
    }
    body .forma-header .text {
        margin-top: 40px;
    }
    body .forma-header .text h1 {
        font: normal normal 32px/41px GothaProBol;
    }
    body .steps-conent .steps-text h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .carusel-text .h-text h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .select-pay .item-pic img {
        width: 75%;
    }
    body .select-pay h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .steps-conent .in-bl-text {
        width: 25%;
    }
    body .steps-conent .hed-text-stps {
        font: normal normal normal 20px/22px GothaProMed;
    }
    body .steps-conent .steps-text {
        margin-top: 60px;
    }
    body .steps-conent .text-steps-p {
        font: normal normal normal 14px/22px GothaProLig;
    }
    body .steps-conent .in-bl-text {
        margin-top: 30px;
    }
    body .content-news .text-news h3 {
        font: normal normal bold 28px/40px GothaProBol;
    }
    body .content-news .item-news {
        width: 336px;
        margin-bottom: 20px;
    }
    body .content-news .item-news .fon-news img {
        width: 100%;
    }
    body .content-news .item-news:nth-child(2n) {
        margin-right: 0px;
    }

    body .page .text-point h3 {
        font: normal normal bold 28px/40px GothaProBol;
        margin-top: 45px;
    }
    body .page .text-point .item-point {
        width: 320px;
    }
    body .page .text-point .item-point:nth-child(3n) {
        margin-right: 26px;
    }
    body .item-point .t-point {
        font: normal normal normal 14px/22px GothaProReg;
    }
    body .item-point .h-point {
        font: normal normal normal 20px/26px GothaProMed;
    }
    body .content-footer h3.h3-f {
        font: normal normal bold 28px/40px GothaProBol;
        margin-top: 50px;
    }
    body .content-footer .text-bl-ft p {
        font: normal normal normal 14px/22px GothaProReg;
    }
    body .content-footer .phone-bl-ft {
        margin-left: 0px;
        width: 100%;
    }
    body .content-footer .bottom-menu {
        margin-top: 25px;
        margin-left: 15px;
        display: inline-block;
        float: right;
    }
    body .content-footer .ph-em-text {
        display: inline-block;
    }
    body .steps-conent .conteiner-steps {
        width: 88%;
    }
    body .carusel-js .slick-manual-left {
        left: 0px;
        z-index: 1;
    }
    body  .carusel-js .slick-manual-rigth {
        z-index: 1;
        right: 0px;
    }
}


@media only screen and (min-width: 961px) and (max-width: 1230px),
only screen and (min-device-width: 961px) and (max-device-width: 1230px) {
    /* 960 - 1200  */
    body .wrap .page {
        width: 900px;
    }
    body .page-carusel {
        width: 900px;
    }
    body .footer .content-footer {
        width: 900px;
    }
    body .steps .steps-conent {
        width: 900px;
    }

    body .content-footer .text-bl-ft {
        width: 470px;
    }
    body .page .text-point .item-point:nth-child(3n) {
        margin-right: 26px;
    }
    body .page .text-point .item-point {
        width: 380px;
    }
    body .steps-conent .conteiner-steps {
        width: 840px;
    }
    body .steps {
        background-size: 100% 100%;
    }
    body .premuchestva .item-pr .bl-text {
        width: 170px;
    }
    body .premuchestva .item-pr .bl-text p.t {
        font: normal normal 15px/22px GothaProLig;
    }
    body .steps-conent .in-bl-text {
        width: 22%;
        margin-top: 25px;
        margin-left: 55px;
    }
    body .steps-conent .text-steps-p {
        font: normal normal normal 15px/22px GothaProLig;
    }
    body .steps-conent .steps-text h3 {
        font: normal normal bold 32px/41px GothaProBol;
    }
    body .content-news .item-news {
        width: 280px;
        margin-right: 20px;
    }
    body .content-news .item-news .fon-news img {
        width: 100%;
    }
    body .page .text-point h3 {
        font: normal normal bold 32px/41px GothaProBol;
        margin-top: 50px;
    }
    body oint {
        font: normal normal normal 15px/24px GothaProReg;
    }
    body .content-footer h3.h3-f {
        font: normal normal bold 32px/41px GothaProBol;
        margin-top: 40px;
        margin-bottom: 0px;
    }
    body .content-footer .text-bl-ft p {
        font: normal normal normal 14px/24px GothaProReg;
    }

    body .content-news .item-news .bl-name-data .data-bl-1 {
        margin-left: 20px;
        margin-right: 20px;
    }
    body .item-news .name-news {
        font: normal normal normal 16px/20px GothaProMed;
    }
    body .content-news .item-news .bl-name-data {
        top: 210px;
    }
    body .content-news .text-news h3 {
        text-align: left;
        font: normal normal bold 32px/41px GothaProBol;
    }
    body .select-pay .item-pic img {
        width: 80%;
    }
    body .select-pay h3 {
        font: normal normal bold 32px/41px GothaProBol;
    }
    body .carusel-js .slick-manual-left {
        left: 0px;
        z-index: 1;
    }
    body  .carusel-js .slick-manual-rigth {
        z-index: 1;
        right: 0px;
    }
    body .premuchestva .item-pr:nth-child(1) {
        width: 280px;
    }


}