/*Шрифты*/
@font-face {
  font-family: "MyriadPro-Black";
  src: url("/fonts/MyriadPro-Black/MyriadPro-Black.woff2") format("woff2"),
       url("/fonts/MyriadPro-Black/MyriadPro-Black.woff") format("woff"),
       url("/fonts/MyriadPro-Black/MyriadPro-Black.ttf") format("truetype"),
       url("/fonts/MyriadPro-Black/MyriadPro-Black.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Black/MyriadPro-Black.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-Bold";
  src: url("/fonts/MyriadPro-Bold/MyriadPro-Bold.woff2") format("woff2"),
       url("/fonts/MyriadPro-Bold/MyriadPro-Bold.woff") format("woff"),
       url("/fonts/MyriadPro-Bold/MyriadPro-Bold.ttf") format("truetype"),
       url("/fonts/MyriadPro-Bold/MyriadPro-Bold.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Bold/MyriadPro-Bold.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-BoldCond";
  src: url("/fonts/MyriadPro-BoldCond/MyriadPro-BoldCond.woff2") format("woff2"),
       url("/fonts/MyriadPro-BoldCond/MyriadPro-BoldCond.woff") format("woff"),
       url("/fonts/MyriadPro-BoldCond/MyriadPro-BoldCond.ttf") format("truetype"),
       url("/fonts/MyriadPro-BoldCond/MyriadPro-BoldCond.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-BoldCond/MyriadPro-BoldCond.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-Cond";
  src: url("/fonts/MyriadPro-Cond/MyriadPro-Cond.woff2") format("woff2"),
       url("/fonts/MyriadPro-Cond/MyriadPro-Cond.woff") format("woff"),
       url("/fonts/MyriadPro-Cond/MyriadPro-Cond.ttf") format("truetype"),
       url("/fonts/MyriadPro-Cond/MyriadPro-Cond.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Cond/MyriadPro-Cond.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-Light";
  src: url("/fonts/MyriadPro-Light/MyriadPro-Light.woff2") format("woff2"),
       url("/fonts/MyriadPro-Light/MyriadPro-Light.woff") format("woff"),
       url("/fonts/MyriadPro-Light/MyriadPro-Light.ttf") format("truetype"),
       url("/fonts/MyriadPro-Light/MyriadPro-Light.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Light/MyriadPro-Light.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-Regular";
  src: url("/fonts/MyriadPro-Regular/MyriadPro-Regular.woff2") format("woff2"),
       url("/fonts/MyriadPro-Regular/MyriadPro-Regular.woff") format("woff"),
       url("/fonts/MyriadPro-Regular/MyriadPro-Regular.ttf") format("truetype"),
       url("/fonts/MyriadPro-Regular/MyriadPro-Regular.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Regular/MyriadPro-Regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "MyriadPro-Semibold";
  src: url("/fonts/MyriadPro-Semibold/MyriadPro-Semibold.woff2") format("woff2"),
       url("/fonts/MyriadPro-Semibold/MyriadPro-Semibold.woff") format("woff"),
       url("/fonts/MyriadPro-Semibold/MyriadPro-Semibold.ttf") format("truetype"),
       url("/fonts/MyriadPro-Semibold/MyriadPro-Semibold.eot") format("embedded-opentype"),
       url("/fonts/MyriadPro-Semibold/MyriadPro-Semibold.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}



* {
    font-family: "MyriadPro-Regular", "Helvetica Neue", Helvetica, "PingFang SC", "Microsoft Yahei", "WenQuanYi Micro Hei", Arial, Verdana, sans-serif;
}
/* Правила box sizing */
*,
*::before,
*::after {
  box-sizing: border-box;
}
/* Предотвращение увеличения размера шрифта */
html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    font-size: 16px;
  }
/* Удаление отступов по умолчанию для лучшего контроля в авторском CSS */
body, h1, h2, h3, h4, p,
figure, blockquote, dl, dd {
  margin: 0;
}
/* Удаление стилей списка в элементах ul, ol с ролью списка, что предполагает удаление стилей по умолчанию */
ul[role='list'],
ol[role='list'] {
  list-style: none;
}
/* Установка значений по умолчанию для body */
body {
    min-height: 100vh;
    line-height: 1.5;
  }
/* Установите меньшую высоту строк в заголовках и интерактивных элементах */
h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}
/* Баланс переноса текста в заголовках */
h1, h2,
h3, h4 {
  text-wrap: balance;
}
/* Элементы A, не имеющие класса, получают стили по умолчанию */
a:not([class]) {
    text-decoration-skip-ink: auto;
    color: currentColor;
    text-decoration: none;
  }
/* Наследование шрифтов для input и button */
input,
button,
textarea,
select {
  font: inherit;
}
/* Убедитесь, что textarea без атрибута rows не будут маленькими */
textarea:not([rows]) {
    min-height: 10em
  }
/* Все, к чему были привязаны якоря, должно иметь дополнительные поля прокрутки */
:target {
    scroll-margin-block: 5ex;
  }
/* Удаление маркеров у списка */
li {
  list-style: none;
}
/* Меню */
header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background: #009FAB;
  margin: auto 0;
  z-index: 5;
}
nav {
  max-width: 85vw;
  margin: 0 auto;
}
.navi {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  min-width: 320px;
  margin: 0;
  padding: 10px;  
}
.navi li a {
  font-size: calc(12px + 0.5vw);
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  text-rendering: optimizeLegibility;
  cursor: pointer;
}
.navi-item  {
  margin: auto;
  padding: 10px;
  min-width: 10%;
  flex: 1 1 auto;
  text-align: center;
  color: white;
  transition: all 0.4s ease-in-out;
}
.navi-item:hover {
  border-radius: 20px;
  background-color: #FFF;
  color: #009FAB;
}

/* Основной контент */
.content {
    padding-top: 64px;
    width: 100%;
    margin: auto;
    font-size: 1rem;
}
/* 1. Первый слайд */
.firstscreen {
    width: 100%;
    height: calc(100vh - 64px);
    background-image: linear-gradient(rgb(0, 159, 171), rgba(0, 159, 171, 0.26)), url(../image/endoscopy_bg.jpg);
    background-size: cover;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
}
.firstscreen h1 {
    font-size: calc(1rem + 3.5vw);
    padding: 20px;
}
.firstscreen p {
    font-size: calc(0.5rem + 2vw);
    font-style: italic;
    padding: 0 10px;
}
/* 2. Модель блоков для направлений и новостей */
.blocks {
  max-width: 1280px;
  min-width: 320px;
  margin: 0px auto;
  padding: 10px 0;
  color: #000;
}
.typeblocks {
  margin: 10px auto;
  padding: 10px 0;
  text-align: center;
  font-size: calc(0.5rem + 1.5vw);
}
.desc {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
  min-width: 320px;
}

/* 3. Стили направлений */
.dev {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 10px;
    padding: 10px;
    transition: transform 0.6s ease-in-out;
    min-width: 280px;
}
.dev_img {
  transform: scale(75%);
  width: 280px;
  height: 280px;
  object-fit: cover;
}
.br-50 {
  border-radius: 50%;
}
.dev figcaption {
  color: #009FAB;
  margin: 5px 10px;
  font-size: calc(0.5rem + 1vw);
  font-weight: bold;
  text-shadow: 1px 1px #7c7c7c;
}
.dev:hover {
  transform: scale(105%);
}
/* 4. Стили новостей */
.one_news {
  font-size: calc(0.5rem + 1vw);
  display: flex;
  flex-direction: row;
  min-width: 320px;
  margin: 5px 10px;
  color: black;
  text-decoration: none;
  cursor: default;
  transition: all 0.6s ease-in-out;
}
.one_news p{
  font-size: calc(1rem);
}
.one_news img {
  width: 200px;

}
.desc_news {
  padding: 5px 15px;
}  

.one_news:hover{
  background-color: #009FAB;
  transform: scale(105%);
  border-radius: 20px;
}
/* 5. Оформление страниц оборудования */
.firstBlock {
  display: flex;
  padding: 40px 20px;
  flex-wrap: wrap-reverse;
  align-items: flex-end;
}
.big_img {
  height: auto;
  width: 30% ;
  margin-right: 2em;
  object-fit: contain;
}
.ml-2em {
  margin-right: 0;
  margin-left: 2em;
}
.desc_dev {
  font-size: 1.1rem;
  max-width: 65%;
  min-width: 320px;
}
.h1_block {
  font-family: "MyriadPro-BoldCond";
  font-size: 2em;
  color: #009FAB;
  margin-bottom: 10px;
}
.h2_block {
  font-size: 1.5em;
  margin-top: 5px;
  margin-bottom: 5px;

}
.desc_dev p{
  text-align: justify;
}
.p_sub {
  font-size: 1.25em;
  font-family: "MyriadPro-Semibold";
  font-style: italic;
  margin-top: 5px;
  margin-bottom: 5px;
}
.bir {
  color: #009FAB;
  font-weight: bold;
}
/* 6. Оформление страниц эндоскопов*/
.block_endo {
  max-width: 1280px;
  min-width: 320px;
  margin: 0px auto;
  padding: 10px 0;
  color: #000;
  padding: 20px 20px;
}
.item_center {
  font-size: 2.5em;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
}
.desc_endo {
  min-width: 320px;
  max-width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 10px auto;
}
.desc_endo img {
  height: 6em;
  width: 6em;
  margin: 0px auto;
}
.desc_endo h2 {
  text-align: center;
  font-size: 1.5em;
  height: 3.2em;
}
.desc_f {
  font-size: 1.1em;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  min-width: 320px;
}
.features {
  margin-top: 40px;
  max-width: 25%;
  min-width: 250px;
  text-align: center;
  margin: 20px auto;
}
.f_img {
  width: 200px;
  height: 200px;
  object-fit: fill;
  margin-bottom: 1em;
}
.f_s_img {
  width: 200px;
  height: 200px;
  object-fit: contain;
  margin-bottom: 1em;
}
.br-r {
  border-right: #009FAB 2px solid;
}
.features figcaption {
  margin: 3px 3px;
}

/* Подвал */
footer  {
  padding: 20px 40px;
  height: auto;
  font-size: 0.9rem;
  color: #7c7c7c;
  width: 100%;
  min-width: 320px;
}
.foot {
  margin: 0 auto;
  max-width: 1280px;
}
.f_name {
  font-weight: bold;
  color: #009FAB;
}
.f_desc {
  font-style: italic;
  color: #000000;
}
.f_text {
  font-size: 0.8rem;

}
.copyright {
  color: #7c7c7c;
  font-size: 0.7rem;
  padding-top: 5px;
}

/* Таблица */

.table {
  opacity: 0.8;
  line-height: 1.25;    
}
thead {
  font-size: 0.875em;
  font-weight: 400;
}
tr {
  text-align: center;
}
.table-bordered, .table-bordered th, .table-bordered td {
  border: 1px solid #009FAB;
  
}
.left {
  text-align: left;
  width: 70px;
}