/* Общие стили */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /*user-select: none;*/
    font-family: 'Chalet', sans-serif;
    font-size: 18px;
}

/* Подключение шрифтов */
@font-face {
    font-family: 'Chalet';
    src: url(../fonts/Chalet-LondonSixty.otf);
}

@font-face {
    font-family: 'Chalet bold';
    src: url(../fonts/Chalet-LondonSixty.otf);
}

/* Цветовые переменные */
:root {
    --cl1: #EE1D23;
    --cl2: #231F20;
    --cl3: #F1C798;
    --cl4: #FFF3E6;
    --cl5: #2683c5;
    --cl6: #2877C2;
    --cl7: #1481FF;
    --cl8: #22A1FF;
    --cl9: #5B89ED;
    --cl10: #67A9FF;
    --cl11: #6BBBF6;
    --cl12: #9BC3FF;
    --cl13: #B3DAFF;
    --cl14: #C0E4FF;
    --cl15: #FFF;
}

.text-indent {
   text-indent: 20px; 
}

body {
    margin-top: 40px;
}


/* Навигация */
nav {
    display: flex;
    flex-wrap: wrap;
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 50px;
}

.text_nav {
    font-size: 24px;
    color: var(--cl2);
    text-decoration: none;
}

.text_nav1 {
    font-size: 18px;
    color: var(--cl2);
    text-decoration: none;
}

.nav_box {
    display: flex;
    flex-direction: row;
    /* align-items: flex-end; */
    justify-content: space-between;
    padding-right: 18px !important;
}

.nav_box1 {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.link1:hover {
    text-decoration: underline;
    text-underline-offset: 0.4em;
    text-decoration-thickness: 0.05em;
    color: var(--cl2);
}

.link1 {
    color: var(--cl2);
}

.network {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* Header Content */
.textHed {
    width: 50%;
}



/* Blue Navigation Bar */
.blue {
    display: flex;
    margin-top: 40px;
    background-color: var(--cl5);
    color: var(--cl15);
    height: 70px;
    justify-content: center;
    align-items: center;
}

.link2:hover {
    color: var(--cl15);
}

.link2 {
    color: var(--cl15);
}

/* Support Section */
.support {
    display: flex;
    justify-content: center;
    /* align-items: center; */
    flex-direction: row;
    background-color: var(--cl11);
    border-radius: 20px;
    color: var(--cl15);
    height: auto;
}

.textSupport {
    padding-left: 20px;
    padding-right: 20px;
    /* padding-top: 20px; */
    font-size: 22px;
}

.textSupportBold {
    padding-top: 10px;
    font-family: 'Chalet bold', sans-serif;
    font-size: 22px;
    font-weight: bold;
}

.textSupportMin {
    font-family: 'Chalet', sans-serif;
    font-size: 15px;
    padding-top: 5px;
}

/* .ImgSup {
    width: 80%;
} */

/* ------media support------ */

@media(max-width: 470px) {
    .support {
        flex-direction: column;
    }

    .row>* {
        --bs-gutter-x: 60px;
    }
}

/* Network Box */
.networkBox {
    margin-top: 40px;
    display: flex;
    gap: 10px;
    flex-direction: column;
}

.rightColumNetwork {
    font-size: 17px;
}

/* Content */
.padding {
    padding-top: 40px;
}

.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    padding-right: 20px;
    padding-left: 20px;
}

/* List Styles */
.list {
    padding-top: 10px;
    list-style: none;
    padding-left: 30px;
}

.ingredients::before {
    content: "\25CF";
    position: absolute;
    left: 0;
    color: var(--cl5);
}

.ingredients {
    padding-left: 1em;
    position: relative;
    margin-bottom: 5px;
    color: var(--cl2);
}

/* Typography */
.Title {
    font-size: 36px;
    margin-bottom: 30px;
    font-weight: bolder;
}

.Text {
    padding-top: 10px;
}

/* Cards */
.TitleCardsBox {
    margin-bottom: 40px;
    margin-top: 40px;
    font-size: 26px;
    font-weight: bolder;
}

.TitleCardsBoxMin {
    margin-bottom: 40px;
    margin-top: 40px;
    font-size: 22px;
    font-weight: bolder;
}

.cards {
    margin-bottom: 20px;
}

.Card {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 550px;
    border-radius: 20px;
    border-color: var(--cl11);
    border-width: 2px;
    border-style: solid;
    border-image: initial;
    padding: 20px 15px;
}

.TitleInstrumentation {
    font-weight: bolder;
    font-size: 20px;
    margin-bottom: 25px;
    text-decoration: none;
}

.description {
    text-decoration: none;
    font-size: 14px;
    margin-bottom: 10px;
}

.BlockText {
    display: flex;
    width: 100%;
    margin-top: 30px;
    flex-direction: column;
    justify-content: space-between;
}

.down {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
}

.clickable-card {
    cursor: pointer;
}

/* Footer */
Footer {
    margin-top: 40px;
    background-color: var(--cl5);
    width: 100%;
    padding: 40px 0px;
}

.footerNetwork {
    display: flex;
    gap: 20px;
}

.contentFooter {
    display: flex;
    justify-content: space-between;
}

.textfootermax {
    color: var(--cl15);
    font-weight: bolder;
    margin-top: 15px;
}

.textfootermin {
    color: var(--cl15);
}

.footerNetwork {
    margin-top: 10px;
}

.textnavFooter {
    color: var(--cl13);
    margin-bottom: 15px;
}


.dop {
    text-decoration: none;
}


.width {
    width: 100%;
}

.Vetta {
    padding-top: 40px;
    padding-bottom: 40px;
}

.BottomVetta {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 40px;
}

.BottomVettaText {
    color: var(--cl11);
    font-weight: bold;
}

.link3:hover {
    text-decoration: underline;
    text-underline-offset: 0.4em;
    text-decoration-thickness: 0.1em;
    color: var(--cl11);
}

.link3 {
    color: var(--cl11);
}

.pad {
    padding-top: 40px;
}

.ImgCard {
    width: 80%;
}

.menu {
    display: none;
}

.CardsBoxMob {
    display: none;
}

.textHed {
    font-size: 15px;
}

/* Запросы */


@media (max-width: 1800px) {
    .logo {
        width: 200px;
    }

    .paddings {
        font-size: 20px;
    }

    .navupboxtwo {
        list-style: none;
        margin: 0;
        padding: 0;
        justify-content: flex-end;
        flex-wrap: wrap;
        flex-direction: row;
        gap: 20px;
    }

    .dop {
        font-size: 18px;
    }
}

@media (max-width: 1400px) {
    .navupboxtwo {
        list-style: none;
        margin: 0;
        padding: 0;
        justify-content: flex-end;
        flex-wrap: wrap;
        flex-direction: row;
        gap: 10px;
    }

    .paddings {
        font-size: 16px;
        color: var(--cl2);
        text-decoration: none;
    }

    .nav ul {
        justify-content: flex-end;
    }
}

@media (max-width: 1200px) {
    .Card {
        height: 550px;
    }
}


@media (max-width: 1050px) {

    nav {
        flex-wrap: wrap;
        /*justify-content: center;*/
    }
}

@media (max-width: 500px) {

    .navupboxtwo,
    .navupbox {
        flex-wrap: wrap;
        flex-direction: column;
        gap: 30px;
        align-items: center;
    }

    .navup {
        display: none;
    }

    .header {
        margin-top: 40px !important;
        margin-bottom: 40px !important;
        position: relative;
    }

    .nav_box {
        padding-right: 0px !important;
    }

    .textHed {
        width: 100%;
    }

    .logo {
        width: 70%;
    }

    .blue {
        padding: 20px;
        height: auto;
    }

    .contentFooter {
        flex-direction: column;
    }

    * {
        font-size: 15px;
    }

    .Title {
        font-size: 28px;
    }

    .text_nav {
        font-size: 16px;
    }

    .BottomVetta {
        padding-top: 25px;
        padding-bottom: 10px;
    }

    .row {
        gap: 30px;
    }

    .blue {
        margin-top: 0px;
    }

    .padding {
        padding-top: 0px;
    }

    .pad {
        padding-top: 0px;
    }

    Footer {
        padding: 0px 0px;
    }

    .navFooter {
        margin-top: 20px;
    }

    .menu {
        display: block !important;
    }

    .nav_box {
        width: 100%;
    }

    #navup {
        display: none;
    }

    .navuptwo {
        display: none;
    }

    .Card {
        width: 100%;
        height: 450px;
    }

  /*  .BoxPC {
        display: none !important;
    }*/

    /*.CardsBoxMob {
        display: block;
    }*/

   /* .CardsBox {
        display: none;
    }*/

    .logoMenu {
        display: flex;
        justify-content: space-between;
    }
}

#navup {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: var(--cl11);
    width: 100%;
    z-index: 10;
    padding: 20px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}

#navup.active {
    display: block;
}

.menu {
    display: none;
    cursor: pointer;
}

.card-scroll-container {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 15px;
}

.card-scroll-container>* {
    flex: 0 0 auto;
    scroll-snap-align: start;
    margin-left: 20px;
    margin-right: 20px;
}

.card-wrapper {
    width: 370px;
}

.tooltip-inner {
    background-color: var(--cl5) !important;
    color: var(--cl15);
    border-radius: 6px;
    padding: 5px;
    font-size: 14px;
}

.bs-tooltip-top .arrow::before {
    border-top-color: var(--cl5);
}


.color {
    color: #595C5F;
}

a.web {
    color: var(--cl7);
    text-underline-offset: 0.4em;
    text-decoration-thickness: 0.05em;
}

a.web1 {
    font-size: 17px;
    color: var(--cl15) !important;
    text-decoration: none;
    word-break: break-word;
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    transition: text-decoration 0.3s ease;
    /* плавность */
}

a.web1:hover {
    text-decoration: underline;
    /* показываем при наведении */
}

.header {
    display: flex;
    margin-top: 40px !important;
}

/*p {
    margin-bottom: 0rem !important;
}*/

.container.BoxPC {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/*Product*/
/* status v categories */

.Card {
    height: 100%;
    position: relative;
}

.now {
    position: absolute;
    top: -2px;
    left: -2px;
    width: 50%;
}

.stop {
    position: absolute;
    top: 30px;
    transform: rotate(-45deg);
    left: 10px;
}

/* price */

.price {
    display: flex;
    padding: 14px 40px;
    color: var(--cl15);
    background-color: #6BBBF6;
    border-radius: 20px 0 0 20px;
    margin-right: -40px;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 10px;
}

.retail_price span:before {
    content: "Розничная цена: ";
    color: #fff;
    font-weight: normal;
}

.opt_price span:before {
    content: "Заводская цена (опт): ";
    color: #fff;
    font-weight: normal;
}

/* Price media */

@media (max-width: 1700px) {

    #video.content-item .price {
        padding: 14px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        align-items: flex-end;
        margin-top: 40px;
        width: 100%;
        flex-direction: row !important;
        justify-content: center;
    }

    #video.content-item .priceText {
        margin-left: 20px;
    }
}

@media (max-width: 1350px) {

    #texhar.content-item .price {
        padding: 30px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        align-items: flex-end;
        /* margin-top: 40px; */
        /* width: 100%; */
        /* flex-direction: row !important; */
        justify-content: center;
    }

    /* #texhar.content-item .IMGtext {
        display: flex;
        flex-direction: column;
        align-items: center;
    } */

    .IMGtext {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 20px;
    }

  /*  #texhar.content-item .priceText {
        margin-left: 20px;
    }*/
}

@media (max-width: 1300px) {

    #sxema.content-item .price {
        padding: 30px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        align-items: flex-end;
        /* margin-top: 40px;
        width: 100%;
        flex-direction: row !important;
        justify-content: center; */
    }

    /*#sxema.content-item .priceText {
        margin-left: 20px;
    }
*/
    /* #sxema.content-item .IMGtext {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    } */
}

@media (max-width: 1150px) {

    #dok.content-item .price {
        padding: 30px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        align-items: flex-end;
        /* margin-top: 40px;
        width: 100%;
        flex-direction: row !important;
        justify-content: center; */
    }

   /* #dok.content-item .priceText {
        margin-left: 20px;
    }*/

    /* #dok.content-item .IMGtext {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    } */

    #PO.content-item .price {
        padding: 30px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        align-items: flex-end;
        /* margin-top: 40px;
        width: 100%;
        flex-direction: row !important;
        justify-content: center; */
    }

    #PO.content-item .priceText {
        margin-left: 20px;
    }

    /* #PO.content-item .IMGtext {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    } */
}

@media (max-width: 1050px) {

    .price {
        padding: 30px 40px;
        color: var(--cl15);
        background-color: #6BBBF6;
        border-radius: 20px;
        margin-right: 0px;
        flex-direction: column;
        align-items: flex-end;
        /* margin-top: 70px; */
    }

    .IMGtext {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}

@media (max-width: 1000px) {
    #osobennosti.content-item .price {
        width: 100%;
        flex-direction: row !important;
        justify-content: center;
    }

    #osobennosti.content-item .priceText {
        margin-left: 20px;
    }

    #naznachenie.content-item .price {
        width: 100%;
        flex-direction: row !important;
        justify-content: center;
    }

    #naznachenie.content-item .priceText {
        margin-left: 20px;
    }
}

@media (max-width: 500px) {
    .price {
        width: 100%;
        flex-direction: row !important;
        justify-content: center;
    }

    .priceText {
        margin-left: 20px;
    }
}

@media (max-width: 375px) {
    .price {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 10px 20px;
    }
}

/* остальное */

.table>:not(caption)>*>* {
    padding: 0px !important;
}

.TextProduct ul {
    list-style: none !important;
}