@charset "utf-8";

@font-face {
  font-family: 'Roboto';
  src: url('./fonts/Roboto-Regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('./fonts/Roboto-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('./fonts/Roboto-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('./fonts/Roboto-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Roboto';
    src: url('./fonts/Roboto-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro Narrow';
    src: url('./fonts/GothamProNarrow-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro Narrow';
    src: url('./fonts/GothamProNarrow-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/* ---------- common start ---------- */

:root {
  --main-dark-color: #000F26;
  --blue-dark-color: #19407C;
  --blue-accent-color: #00AEEF;
  --gray-light-color: #F3F3F3;
  --gray-middle-color: #E7E7E7;
  --gray-secondary-color: #8F8F8F;
  --gray-dark-color: #8F8F8F;
  --yellow-color: #FFCD00;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  font-size: 10px;
  color: var(--main-dark-color);
  font-family: 'Gotham Pro Narrow';
}
img {
  pointer-events: none;
}
.no_highlights,
.blue_button,
.source_title,
img,
button,
a {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.blue_button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background-color: var(--blue-dark-color);
  font-size: 1rem;
  padding: 1.2rem 2.4rem;
  border-radius: 4rem;
  border: none;
  outline: none;
  cursor: pointer;
  transition: transform .4s ease, background-color .4s ease;
  text-decoration: none;
  font-family: 'Gotham Pro Narrow';
}
.blue_button:hover {
  transform: scale(1.05);
  background-color: var(--blue-accent-color);
}
.blue_button span {
  color: #FFFFFF;
  font-size: 2.4rem;
  font-weight: 500;
}
.blue_button img {
  display: block;
  width: 1.6rem;
  margin-left: 1.2rem;
  transition: transform .4s ease;
}
.blue_button:hover img {
  transform: translateY(-.2rem) translateX(.2rem);
}
.standard_text {
  display: block;
  line-height: 1.2em;
  font-family: 'Roboto';
  font-weight: 400;
}
.standard_title {
  display: block;
  line-height: 1.2em;
  font-family: 'Roboto';
  font-weight: 500;
}
.text_12 {
  font-size: 1.2rem;
}
.text_14 {
  font-size: 1.4rem;
}
.text_16 {
  font-size: 1.6rem;
}
.text_22 {
  font-size: 2.2rem;
}
.title_h1 {
  font-size: 4.8rem;
  font-weight: 700;
}
.title_h2 {
  font-size: 3.2rem;
  font-weight: 500;
}
.title_h4 {
  font-size: 2.4rem;
  font-weight: 500;
}
.blue_text {
  color: var(--blue-accent-color);
}
.gray_text {
  color: var(--gray-secondary-color);
}
.bold_text {
  font-weight: bold;
}
.standard_text a {
  text-decoration: underline;
  cursor: pointer;
  font-weight: 500;
  color: inherit;
}
.standard_text a:hover {
  text-decoration: none;
}
.column_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
}
.window_block {
  border-radius: 2.4rem;
  padding: 2rem;
  margin-top: .8rem;
}
.window_block_white {
  background-color: #FFFFFF;
}
.window_block_gray {
  background-color: var(--gray-light-color);
}
.column_box .window_block {
  width: 49rem;
}
.standard_title + .column_box {
  margin-top: 1.2rem;
}
.pack_info_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
sup {
  font-size: 1.2rem;
  line-height: .2em;
}
br.mobile {
  display: none;
}

/* ---------- common end ---------- */

/* ---------- main start ---------- */

.index_main {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-color: var(--blue-accent-color);
  position: relative;
  background-image: url(./img/bg_desk.jpg);
  background-size: cover;
  background-position: center;
}
.index_main:before {
  content: '';
  display: block;
  width: 5.2rem;
  height: .8rem;
  background-image: url(./img/logo_haleon_small.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  top: 1.2rem;
  right: 13.2rem;
}
.index_main:after {
  content: '';
  display: block;
  width: 15.4rem;
  height: 3rem;
  background-image: url(./img/logo_th_sn_mini.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  top: .2rem;
  right: 0;
  left: 0;
  margin: 0 auto;
  transition: transform .6s ease, opacity .6s ease;
  opacity: 0;
  transform: translateY(4rem);
}
.index_main.open_window:after {
  opacity: 1;
  transform: none;
}
.dynamic_section {
  position: absolute;
  transition: transform .4s ease;
  opacity: 0;
  transform: translateY(2rem);
  z-index: 0;
  pointer-events: none;
}
.dynamic_section_active {
  opacity: 1;
  transform: none;
  z-index: 1;
  pointer-events: auto;
}
.start_section {
  width: 100%;
  height: 100%;
  padding-top: 9.3rem;
}
.logo_th_sn_desk {
  display: block;
  width: 44.5rem;
  margin: 0 auto;
}
.start_section_title {
  display: block;
  font-size: 16.5rem;
  line-height: .9em;
  font-weight: 700;
  color: #FFFFFF;
  text-align: center;
  margin-top: 3.6rem;
}
.start_section_text {
  display: block;
  font-size: 5.8rem;
  line-height: 1.2em;
  font-weight: 500;
  color: var(--yellow-color);
  text-align: center;
  margin-top: 1.2rem;
}
.window_section {
  width: 104rem;
  height: calc(100% - 7rem);
  overflow: hidden;
  margin: 0 auto;
  top: 3.2rem;
  left: 0;
  right: 0;
  background-color: var(--gray-middle-color);
  border-radius: .8rem;
  border: 1px solid #B5B5B5;
}
.window_header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 3rem;
  background-color: var(--gray-light-color);
  padding-left: .5rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}
.window_header_info {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.icon_window_header {
  display: block;
  width: 2rem;
  margin-right: .4rem;
}
.window_header_info_text {
  color: var(--gray-dark-color);
}
.window_controls {
  display: block;
  height: 100%;
}
.window_section_scrollzone {
  display: block;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  padding: 4.5rem 2rem 4rem;
}
.window_section_scrollzone {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.window_section_scrollzone::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.info_text {
  color: #7C7C7C;
}
.img_pack_theraflu {
  display: block;
  width: 6.6rem;
}
.img_pack_sinecod {
  display: block;
  width: 7.2rem;
}
.img_pack_theraflu + .pack_info_box {
  width: 37.6rem;
}
.img_pack_theraflu + .pack_info_box {
  width: 38.8rem;
}
.buttons_line {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 3.2rem;
}
.reception_patient_button_1 {
  margin-right: 3.2rem;
}
.window_footer {
  margin-top: 4rem;
}
.sources_container {
  transition: max-height .6s ease;
  overflow: hidden;
}
.sources_container_inner {
  padding-top: 1.2rem;
}
.source_text {
  color: #616B79;
  line-height: 1.4em;
}
.source_text a {
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}
.source_text a:hover {
  text-decoration: none;
}
.source_title {
  width: 100%;
  position: relative;
  cursor: pointer;
}
.source_title:before {
  content: '';
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(./img/icon_button_arrow_black.svg);
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
  transition: transform .6s ease;
}
.source_title_closed:before {
  transform: rotate(90deg);
}
.window_footer_info_container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
}
.window_footer_info_item {
  width: 47em;
}
.window_footer_info_item:first-child {
  margin-right: 2rem;
}
.logo_haleon_healthpartner {
  display: block;
  width: 35.4rem;
}
.window_footer_info_item .text_12 {
  margin-top: 1.6rem;
}
.sources_block + .window_block {
  margin-top: 1.2rem;
}
.patient_box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
.patients_list {
  display: block;
  width: 17rem;
  background-color: #FFFFFF;
  border-radius: 2rem;
  overflow: hidden;
  list-style: none;
}
.state_survey .patients_list,
.state_appointments .patients_list {
  opacity: .8;
  pointer-events: none;
}
.patient_item {
  display: block;
  width: 100%;
  height: 4rem;
}
.patient_button {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
  transition: background-color .4s ease;
  border-radius: 2rem;
  border: none;
  outline: none;
  background-color: #FFFFFF;
  padding-left: 1.2rem;
}
.state_patient_1 .choose_patient_button_1,
.state_patient_2 .choose_patient_button_2 {
  background-color: rgba(25, 64, 124, 0.3);
}
.patients_cards {
  width: 81rem;
}
.patient_card_item {
  display: none;
  width: 100%;
}
.state_patient_1 .patient_card_item_1,
.state_patient_2 .patient_card_item_2 {
  display: block;
}
.patient_info_line {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-bottom: .4rem;
}
.patient_point_container {
  display: block;
  width: 7rem;
  padding-top: 1.4rem;
}
.patient_info_container {
  width: 73rem;
  height: auto;
  min-height: 4.3rem;
  background-color: #FFFFFF;
  border-radius: 1.6rem;
  padding: 1.2rem;
  overflow: hidden;
}
.complaints_list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  height: 11.2rem;
  list-style: none;
  margin-top: 1rem;
}
.complaint_item {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 34rem;
  height: 2.8rem;
  position: relative;
  margin-right: 2rem;
  padding-left: 3rem;
}
.complaint_item:before {
  content: '';
  display: block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url(./img/icon_point.svg);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto 0;
}
.complaint_item.complaint_item_active:before {
  background-image: url(./img/icon_point_active.svg);
}
.patient_info_line_column {
  display: block;
  margin-top: 2.4rem;
  margin-bottom: 0;
}
.patient_info_line_column .patient_point_container,
.patient_info_line_column .patient_info_container {
  width: 100%;
}
.patient_info_line_column .patient_point_container {
  padding: 0;
}
.patient_info_line_column .patient_info_container {
  margin-top: .8rem;
  height: 8rem;
}
.patient_info_line_column.med_therapy .patient_info_container {
  height: auto;
  background-color: var(--gray-light-color);
  padding: 0;
  padding-bottom: 1.2rem;
  overflow: visible;
}
.img_pack_theraflu_2 {
  display: block;
  width: 11.8rem;
} 
.pack_info_container {
  width: 66.8rem;
  padding-top: 1.2rem;
  padding-right: 1.2rem;
}
.info_text_container {
  position: relative;
  margin-top: .4rem;
  padding-right: 6.8rem;
}
.icon_info_container {
  position: absolute;
  right: 0;
  top: 0;
  width: 4.8rem;
}
.icon_info_container_mobile {
  display: none;
}
.icon_info {
  display: block;
  width: 100%;
}
.popup_info_container {
  padding: 2rem;
  border-radius: 2.4rem;
  position: absolute;
  background-color: #FFFFFF;
  z-index: 2;
  opacity: 0;
  transform: translateY(-2rem);
  transition: transform .4s ease, opacity .4s ease;
  pointer-events: none;
  filter: drop-shadow(2px 2px 1rem rgba(0, 0, 0, .3));
}
.icon_info_container:hover + .popup_info_container {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.popup_info_container_1 {
  width: 62.3rem;
  top: -15.4rem;
  right: 8rem;
}
.popup_info_container_2 {
  width: 64.5rem;
  top: -12.6rem;
  right: 8rem;
}
.popup_info_container:before {
  content: '';
  display: block;
  width: 2.4rem;
  height: 2.8rem;
  background-image: url(./img/icon_message_triangle_right_white.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left center;
  position: absolute;
  right: -2.4rem;
  top: 0;
  bottom: 0;
  margin: auto 0;
  transform: translateX(-1px);
  z-index: 2;
}
.popup_info_container .text_16 {
  margin-top: 1.2rem;
}
.point_text_container {
  position: relative;
  padding-left: 2rem;
}
.point_text_container:before {
  content: '';
  display: block;
  width: .3rem;
  height: .3rem;
  border-radius: 50%;
  background-color: var(--main-dark-color);
  position: absolute;
  left: 1rem;
  top: .6rem;
}
.med_therapy_line {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 1.2rem;
  border-top: 1px solid #B9B9B9;
  padding-top: .4rem;
}
.info_text_container + .med_therapy_line {
  margin-top: 2.4rem;
}
.med_therapy_title {
  font-family: 'Roboto';
  font-weight: 600;
  width: 17rem;
}
.med_therapy_text_1 {
  width: 23.5rem;
}
.med_therapy_text_2 {
  width: 22.2rem;
}
.img_pack_sinecod_2 {
  display: block;
  width: 11.8rem;
}
.pack_info_box + .pack_info_box {
  margin-top: 2.4rem;
}
.pack_info_box + .pack_info_box .pack_info_container {
  padding-top: 0;
}
.patient_card_item .blue_button {
  margin-top: 3.2rem;
}
.patient_card_item .load_button {
  margin-top: 0;
}
.recommendation_container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 2.4rem;
  padding-left: 1.2rem;
}
.recommendation_container .text_16 {
  width: 51rem;
}
.popup_info_container_3 {
  width: 68.3rem;
  top: -13.6rem;
  right: 8rem;
}
.popup_info_container_4 {
  width: 64.3rem;
  top: -20.2rem;
  right: 8rem;
}
.window_section_2 {
  padding-top: 0;
  top: 5.2rem;
}
.window_section_2.dynamic_section_active {
  transform: translateX(2rem);
}
.point_text_container + .title_h2 {
  margin-top: 3.2rem;
}
.img_all_theraflu_3 {
  display: block;
  width: 100%;
  height: 17.5rem;
  object-fit: contain;
}
.img_pack_sinecod_3 {
  display: block;
  height: 17.5rem;
}
.pack_block {
  padding-top: 7rem;
}
.pack_block .text_22 {
  margin-bottom: 1.2rem;
}
.pack_block .point_text_container{
  margin-top: 1rem;
}
.window_section_2 .window_section_scrollzone {
  padding-top: 0;
}
.window_section_2 .window_section_scrollzone_container {
  padding-top: 12rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
.window_section_2 .column_box + .load_button {
  margin-top: 3.2rem;
}
.img_stamp_1 {
  display: block;
  width: 70.8rem;
  position: absolute;
  top: 5.8rem;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 2;
  pointer-events: none;
}
.img_stamp_1_mobile {
  display: none;
}
.img_stamp_2 {
  display: block;
  width: 21.2rem;
  position: absolute;
  top: 53.1rem;
  right: 5rem;
  z-index: 2;
  pointer-events: none;
}
.window_block_patient {
  margin-top: 6rem;
  position: relative;
}
.window_block_patient:before {
  content: '';
  display: block;
  width: 16.8rem;
  height: 8.8rem;
  background-image: url(./img/img_stamp_3.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: absolute;
  left: 1.5rem;
  bottom: -4rem;
  pointer-events: none;
}
.window_block_patient_container {
  display: none;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 2.4rem;
  padding-left: 4rem;
  padding-right: 7.2rem;
}
.state_patient_1 .window_block_patient_container_1,
.state_patient_2 .window_block_patient_container_2 {
  display: flex;
}
.img_patient_good {
  display: block;
  width: 20rem;
}
.window_block_patient_container .text_22 {
  width: 56.8rem;
  font-weight: 400;
}
.window_block_patient + .buttons_line .blue_button {
  margin: 0 1.6rem;
}

/* ---------- main end ---------- */

/* ---------- footer start ---------- */

.index_footer {
  width: 100%;
  height: 3rem;
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: #0F3570;
}
.windows_line {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  height: 100%;
}
.icon_windows,
.icon_folder,
.icon_note,
.icon_med {
  display: block;
  height: 100%;
  margin-right: .4rem;
}
.icon_windows {
  margin-right: .8rem;
}
.icon_note,
.icon_med {
  opacity: 0;
}
.icon_note.active_icon,
.icon_med.active_icon {
  opacity: 1;
}

/* ---------- footer end ---------- */

/* ---------- popups start ---------- */

.prompt_elem {
  position: absolute;
  background: rgba(136, 153, 212, 0.7);
  border: 1px solid #E8E8E8;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-radius: 1.6rem;
  padding: 2rem;
  transition: transform .6s ease, opacity .6s ease;
  opacity: 0;
  transform: translateY(5rem);
  z-index: 0;
  pointer-events: none;
  bottom: 5rem;
}
.prompt_elem_active {
  opacity: 1;
  transform: none;
  z-index: 2;
  pointer-events: auto;
}
.start_section_prompt {
  width: 61.7rem;
  right: 2rem;
}
.icon_prompt {
  display: block;
  width: 2.8rem;
}
.start_section_prompt .text_16 {
  margin-top: 1.2rem;
  color: #FFFFFF;
}
.start_button {
  margin-top: 3.2rem;
}
.cookie_prompt {
  width: 29rem;
  left: 0;
  top: 0;
  bottom: auto;
  border: none;
  background-color: #1C5897;
  padding: 1.2rem;
}
.cookie_prompt.prompt_elem_active {
  opacity: .8;
  z-index: 1010;
}
.prompt_elem_wrapper {
  display: block;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.prompt_buttons_container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.2rem;
}
.accept_cookie_button,
.dismiss_cookie_button {
  width: 13rem;
  background-color: #4C75B5;
  padding: .8rem 1.6rem;
  justify-content: center;
}
.accept_cookie_button span,
.dismiss_cookie_button span {
  font-size: 1.4rem;
}
.accept_cookie_button .icon_button_arrow,
.dismiss_cookie_button .icon_button_arrow {
  display: none;
}
.cookie_prompt .text_12 {
  width: 100%;
  color: #FFFFFF;
}

.popups_container {
  width: 100vw;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  overflow: hidden;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -10;
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s ease;
  background-color: rgba(0, 15, 38, 0.6);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
}
.popups_container_active {
  opacity: 1;
  pointer-events: auto;
  z-index: 10;
}
.popups_container_wrapper {
  display: block;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.popup_item {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  transition: opacity .4s ease, transform .4 ease;
  opacity: 0;
  transform: translateY(-4em);
  pointer-events: none;
}
.popup_item_active {
  opacity: 1;
  transform: none;
  pointer-events: auto;
  position: relative;
  z-index: 2;
}
.popup_patient_1,
.popup_patient_2 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.popup_patient_image {
  display: block;
  width: 39rem;
}
.popup_patient_message {
  display: block;
  width: 55.6rem;
  background-color: #FFFFFF;
  border-radius: 2.4rem;
  padding: 3.2rem 2.4rem;
  position: relative;
  margin-left: 4.8rem;
}
.popup_patient_message:before {
  content: '';
  display: block;
  width: 2.4rem;
  height: 2.8rem;
  background-image: url(./img/icon_message_triangle_left_white.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left center;
  position: absolute;
  left: -2.4rem;
  top: 0;
  bottom: 0;
  margin: auto 0;
  transform: translateX(1px);
  z-index: 2;
}
.popup_patient_button_1,
.popup_patient_button_2 {
  margin-top: 3.2rem;
}
.popup_patient_dialog_1,
.popup_patient_dialog_2 {
  padding: 4rem 0 12rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.popup_patient_dialog_1 .title_h1,
.popup_patient_dialog_2 .title_h1 {
  color: #FFFFFF;
  text-align: center;
}
.popup_patient_dialog_1 .title_h2,
.popup_patient_dialog_2 .title_h2 {
  color: var(--yellow-color);
  text-align: center;
}
.dialog_list {
  display: block;
  width: 100rem;
  list-style: none;
}
.dialog_item {
  background: linear-gradient(0deg, rgba(4, 20, 45, 0.3) 0%, rgba(25, 64, 124, 0.3) 100%);
  border: 1px solid var(--blue-accent-color);
  border-radius: 1.6rem;
  margin-top: 6.4rem;
  padding: 3rem 2rem;
}
.patient_dialog {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
}
.patient_dialog_image {
  display: block;
  width: 12.8rem;
}
.dialog_list .popup_patient_message {
  width: 65.6rem;
}
.patient_dialog .popup_patient_message {
  background-color: #FFE0E0;
  margin-left: 2.4rem;
}
.patient_dialog .popup_patient_message:before {
  background-image: url(./img/icon_message_triangle_left_pink.svg);
  width: 1.6rem;
  height: 2rem;
  left: -1.6rem;
}
.doctor_dialog {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  padding-left: 15.2rem;
  margin-top: 1.2rem;
}
.doctor_dialog .popup_patient_message {
  background-color: #E6EFFF;
  margin-left: 0;
  margin-right: 2.4rem;
}
.doctor_dialog .popup_patient_message:before {
  background-image: url(./img/icon_message_triangle_right_blue.svg);
  width: 1.6rem;
  height: 2rem;
  right: -1.6rem;
  top: 5.4rem;
  margin: 0;
  bottom: auto;
  left: auto;
  transform: translateX(-1px);
}
.dialog_list + .blue_button {
  margin-top: 6.4rem;
}
.elem_survey,
.elem_appointments,
.appointments_patient_button,
.answers_button_patient,
.state_survey .survey_button_patient,
.state_survey.state_appointments .appointments_patient_button {
  display: none;
}
.state_survey .elem_survey,
.state_appointments .elem_appointments {
  display: block;
}
.state_survey .complaints_list,
.state_survey .appointments_patient_button,
.state_appointments .answers_button_patient {
  display: flex;
}

/* ---------- popups end ---------- */

@media screen and (max-width: 1200px) {
  html {
    font-size: .7vw;
  }
}

@media screen and (min-width: 2000px) {
  html {
    font-size: .52vw;
  }
}

@media screen and (max-width: 768px) {

  /* ---------- common start ---------- */

  html {
    font-size: 1vw;
    color: var(--main-dark-color);
    font-family: 'Gotham Pro Narrow';
  }
  .blue_button {
    padding: 2.5rem 5rem;
    border-radius: 10rem;
    width: 100%;
  }
  .blue_button span {
    font-size: 4.5rem;
  }
  .blue_button img {
    width: 3rem;
    margin-left: 0;
  }
  .blue_button:hover img {
    transform: translateY(-1rem) translateX(1rem);
  }
  .text_12 {
    font-size: 3rem;
  }
  .text_14 {
    font-size: 3.5rem;
  }
  .text_16 {
    font-size: 3.6rem;
  }
  .text_22 {
    font-size: 4.5rem;
  }
  .title_h1 {
    font-size: 11rem;
  }
  .title_h2 {
    font-size: 6rem;
  }
  .title_h4 {
    font-size: 6rem;
  }
  .column_box {
    display: block;
  }
  .window_block {
    border-radius: 6rem;
    padding: 4rem;
    margin-top: 2rem;
  }
  .column_box .window_block {
    width: 100%;
  }
  .standard_title + .column_box {
    margin-top: 3rem;
  }
  .pack_info_box {
    display: block;
    position: relative;
  }
  sup {
    font-size: 3rem;
    line-height: .2em;
  }
  br.mobile {
    display: inline;
  }

  /* ---------- common end ---------- */

  /* ---------- main start ---------- */

  .index_main {
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
  }
  .index_main:before {
    width: 13rem;
    height: 2rem;
    top: 3rem;
    right: 3rem;
  }
  .index_main:after {
    width: 34rem;
    height: 7rem;
    top: 1rem;
    right: auto;
    left: 3rem;
    margin: 0;
    transform: translateY(7rem);
  }
  .start_section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 0;
  }
  .logo_th_sn_desk {
    width: 76rem;
  }
  .start_section_title {
    font-size: 16rem;
    margin-top: 8rem;
  }
  .start_section_text {
    font-size: 8rem;
    margin-top: 1rem;
    padding: 0 4rem;
  }
  .window_section {
    width: 94rem;
    height: calc(100vh - 17rem);
    height: calc(var(--vh, 1vh) * 100 - 17rem);
    top: 8rem;
    border-radius: 2rem;
  }
  .window_header {
    height: 8rem;
    padding-left: 1.2rem;
  }
  .icon_window_header {
    width: 5rem;
    margin-right: 1rem;
  }
  .window_section_scrollzone {
    padding: 10rem 2rem 2rem;
  }
  .img_pack_theraflu {
    width: 22rem;
  }
  .img_pack_sinecod {
    width: 24rem;
  }
  .img_pack_theraflu + .pack_info_box {
    width: 100%;
  }
  .img_pack_theraflu + .pack_info_box {
    width: 100%;
  }
  .buttons_line {
    display: block;
    margin-top: 8rem;
  }
  .reception_patient_button_1 {
    margin-right: 0;
    margin-bottom: 3rem;
  }
  .window_footer {
    margin-top: 10rem;
  }
  .sources_container_inner {
    padding-top: 2.5rem;
  }
  .source_title:before {
    width: 4rem;
    height: 4rem;
  }
  .window_footer_info_container {
    display: block;
  }
  .window_footer_info_item {
    width: 100%;
  }
  .window_footer_info_item:first-child {
    margin-right: 0;
    margin-bottom: 5rem;
  }
  .logo_haleon_healthpartner {
    width: 100%;
  }
  .window_footer_info_item .text_12 {
    margin-top: 4rem;
  }
  .sources_block + .window_block {
    margin-top: 3rem;
  }
  .patient_box {
    display: block;
  }
  .patients_list {
    width: .1px;
    height: .1px;
    position: absolute;
    pointer-events: none;
    opacity: 0;
    z-index: -999;
    overflow: hidden;
  }
  .patients_cards {
    width: 100%;
  }
  .patient_info_line {
    display: block;
    margin-bottom: 1.5rem;
  }
  .patient_point_container {
    width: 100%;
    padding-top: 0;
  }
  .patient_info_container {
    width: 100%;
    min-height: 8rem;
    border-radius: 4rem;
    padding: 2rem;
    margin-top: 2rem;
  }
  .complaints_list {
    display: block;
    height: auto;
    list-style: none;
    margin-top: 3rem;
  }
  .complaint_item {
    width: 100%;
    height: 5.2rem;
    margin-right: 0;
    padding-left: 6rem;
  }
  .complaint_item:before {
    width: 4rem;
    height: 4rem;
  }
  .patient_info_line_column {
    margin-top: 1.5rem;
    margin-bottom: 0;
  }
  .patient_info_line_column .patient_info_container {
    height: auto;
  }
  .patient_info_line_column.med_therapy .patient_info_container {
    height: auto;
    padding: 2rem;
    position: relative;
  }
  .img_pack_theraflu_2 {
    width: 22rem;
  } 
  .pack_info_container {
    width: 100%;
    padding-top: 0;
    padding-right: 0;
  }
  .info_text_container {
    position: relative;
    margin-top: 1rem;
    padding-right: 0;
  }
  .icon_info_container {
    display: none;
  }
  .icon_info_container_mobile {
    display: block;
    width: 12rem;
    position: absolute;
    top: 6rem;
    right: 3rem;
    z-index: 2;
  }
  .popup_info_container {
    padding: 4rem;
    border-radius: 6rem;
    z-index: 2;
    opacity: 1;
    transform: none;
    transition: transform .4s ease, opacity .4s ease;
    pointer-events: auto;
  }
  .popup_info_container:before {
    content: none;
  }
  .popup_info_container .text_16 {
    margin-top: 2rem;
  }
  .point_text_container {
    padding-left: 4rem;
  }
  .point_text_container:before {
    width: 0.8rem;
    height: 0.8rem;
    left: 1.2rem;
    top: 1.3rem;
  }
  .med_therapy_line {
    display: block;
    margin-top: 3rem;
    padding-top: 1rem;
  }
  .info_text_container + .med_therapy_line {
    margin-top: 3rem;
  }
  .med_therapy_title {
    width: 100%;
  }
  .med_therapy_text_1 {
    width: 100%;
  }
  .med_therapy_text_2 {
    width: 100%;
  }
  .img_pack_sinecod_2 {
    width: 22rem;
  }
  .pack_info_box + .pack_info_box {
    margin-top: 10rem;
  }
  .pack_info_box + .pack_info_box .pack_info_container {
    padding-top: 3rem;
  }
  .patient_card_item .blue_button {
    margin-top: 5rem;
  }
  .patient_card_item .load_button {
    margin-top: 3rem;
  }
  .recommendation_container {
    display: block;
    margin-top: 10rem;
    padding-left: 0;
  }
  .recommendation_container .text_16 {
    width: 100%;
  }
  .window_section_2 {
    padding-top: 0;
    top: 8rem;
  }
  .window_section_2.dynamic_section_active {
    transform: none;
  }
.point_text_container + .title_h2 {
  margin-top: 3.2rem;
}
  .img_all_theraflu_3 {
    height: auto;
  }
  .img_pack_sinecod_3 {
    height: auto;
    width: 39rem;
  }
  .pack_block {
    padding-top: 7rem;
  }
  .pack_block .text_22 {
    margin-bottom: 2rem;
    font-size: 4.3rem;
    margin-top: 2rem;
  }
  .pack_block .point_text_container{
    margin-top: 1rem;
  }
  .window_section_2 .window_section_scrollzone {
    padding-top: 0;
  }
  .window_section_2 .window_section_scrollzone_container {
    padding-top: 39rem;
  }
  .window_section_2 .column_box + .load_button {
    margin-top: 5rem;
  }
  .img_stamp_1_mobile {
    display: block;
    width: 55rem;
    position: absolute;
    top: 10rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 2;
  }
  .img_stamp_1 {
    display: none;
  }
  .img_stamp_2 {
    width: 40rem;
    top: 117.1rem;
    right: 3rem;
  }
  .window_block_patient {
    margin-top: 10rem;
    background-color: transparent;
  }
  .window_block_patient:before {
    content: none;
    width: 31rem;
    height: 16rem;
    left: auto;
    bottom: auto;
    top: 55rem;
    right: 0rem;
  }
  .window_block_patient .title_h1 {
    font-size: 6rem;
  }
  .window_block_patient_container {
    display: none;
    margin-top: 3rem;
    padding: 0;
  }
  .state_patient_1 .window_block_patient_container_1,
  .state_patient_2 .window_block_patient_container_2 {
    display: block;
  }
  .img_patient_good {
    width: 40rem;
    margin: 0 auto;
  }
  .window_block_patient_container .text_22 {
    width: 100%;
    background-color: #FFFFFF;
    padding: 3rem;
    border-radius: 4rem;
    position: relative;
    font-size: 4rem;
    margin-top: 7rem;
  }
  .window_block_patient_container .text_22:before {
    content: '';
    display: block;
    width: 5rem;
    height: 5rem;
    background-image: url(./img/icon_message_triangle_left_white.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    left: 0;
    right: 0;
    top: -4rem;
    margin: 0 auto;
    transform: rotate(90deg);
  }
  .window_block_patient + .buttons_line {
    width: 100%;
    margin-top: 4rem;
  }
  .window_block_patient + .buttons_line .blue_button {
    margin: 0;
    width: 100%;
    margin-bottom: 3rem;
  }

  /* ---------- main end ---------- */

  /* ---------- footer start ---------- */

  .index_footer {
    height: 7.5rem;
  }
  .icon_windows,
  .icon_folder,
  .icon_note,
  .icon_med {
    margin-right: 1rem;
  }
  .icon_windows {
    margin-right: 2rem;
  }

  /* ---------- footer end ---------- */

  /* ---------- popups start ---------- */

  .prompt_elem {
    border-radius: 4rem;
    padding: 4rem;
    bottom: 10rem;
  }
  .start_section_prompt {
    width: 94rem;
    right: 0;
    left: 0;
    margin: 0 auto;
  }
  .icon_prompt {
    width: 6rem;
  }
  .start_section_prompt .text_16 {
    margin-top: 3rem;
  }
  .start_button {
    margin-top: 6rem;
    width: 100%;
  }
  .cookie_prompt {
    bottom: auto;
    width: 94rem;
    right: 0;
    left: 0;
    margin: 0 auto;
    top: 7rem;
  }
  .prompt_elem_wrapper {
    display: block;
  }
  .prompt_buttons_container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-top: 3rem;
  }
  .accept_cookie_button,
  .dismiss_cookie_button {
    width: 42rem;
    padding: 2rem 4rem;
  }
  .dismiss_cookie_button {
    margin-top: 0;
  }
  .accept_cookie_button span,
  .dismiss_cookie_button span {
    font-size: 4rem;
  }
  .cookie_prompt .text_12 {
    width: 100%;
  }

  .popup_patient_1,
  .popup_patient_2 {
    flex-direction: column;
  }
  .popup_patient_image {
    width: 50rem;
  }
  .popup_patient_message {
    width: 90rem;
    border-radius: 6rem;
    padding: 5rem;
    margin-left: 0;
    margin-top: 10rem;
  }
  .popup_patient_message:before {
    width: 6rem;
    height: 7rem;
    left: 0;
    right: 0;
    top: -6rem;
    bottom: auto;
    margin: 0 auto;
    transform: rotate(90deg);
  }
  .popup_patient_button_1,
  .popup_patient_button_2 {
    margin-top: 5rem;
  }
  .popup_patient_dialog_1,
  .popup_patient_dialog_2 {
    padding: 6rem 0 10rem;
  }
  .popup_patient_dialog_1 .title_h1,
  .popup_patient_dialog_2 .title_h1 {
    font-size: 8.5rem;
  }
  .popup_patient_dialog_1 .title_h2,
  .popup_patient_dialog_2 .title_h2 {
    padding: 0 2rem;
  }
  .dialog_item {
    border-radius: 4rem;
    margin-top: 6rem;
    padding: 4rem;
  }
  .patient_dialog {
    align-items: center;
  }
  .patient_dialog_image {
    width: 12rem;
  }
  .dialog_list .popup_patient_message {
    width: 75rem;
  }
  .patient_dialog .popup_patient_message {
    margin-left: 5rem;
    margin-top: 0;
  }
  .patient_dialog .popup_patient_message:before {
    width: 3rem;
    height: 4rem;
    left: -3rem;
    transform: none;
    right: auto;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  .doctor_dialog {
    padding-left: 0;
    margin-top: 3rem;
  }
  .doctor_dialog .popup_patient_message {
    margin-left: 0;
    margin-right: 5rem;
    margin-top: 0;
  }
  .doctor_dialog .popup_patient_message:before {
    width: 3rem;
    height: 4rem;
    right: -3rem;
    top: 4rem;
    margin: 0;
    bottom: auto;
    left: auto;
    transform: translateX(-1px);
  }
  .dialog_list + .blue_button {
    margin-top: 6rem;
    width: 84rem;
  }
  .elem_survey,
  .elem_appointments,
  .appointments_patient_button,
  .answers_button_patient,
  .state_survey .survey_button_patient,
  .state_survey.state_appointments .appointments_patient_button {
    display: none;
  }
  .state_survey .elem_survey,
  .state_appointments .elem_appointments {
    display: block;
  }

  .state_survey .appointments_patient_button,
  .state_appointments .answers_button_patient {
    display: flex;
  }
  .state_survey .complaints_list {
    display: block;
  }

  .popup_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
  }
  .popup_info .popup_info_container {
    width: 90rem;
  }
  .close_popup_button {
    display: block;
    width: 12rem;
    height: 12rem;
    border: none;
    outline: none;
    cursor: pointer;
    background-color: transparent;
    background-image: url(./img/icon_close.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    top: -14rem;
    right: 0;
    z-index: 2;
  }
  .pack_info_container .popup_info_container {
    display: none;
  }

  /* ---------- popups end ---------- */

}
/* edit----------------------------------------- */
  .new-footer__content {
      width: 100%;
      background-color: #000000;
      border-radius: 16px;
      display: flex;
      flex-direction: column;
      margin-top: 20px;
  }

  .new-footer__inner {
      display: flex;
      flex-direction: column;
      
  }

  .new-footer__inner--top {
      background-color: #ffffff;
      border-radius: 16px;
      padding: 0 24px;
  }
  .new-footer__inner--bottom {
      padding: 40px 24px 24px;
      row-gap: 20px;
  }

  .new-footer__box {
      display: flex;
      flex-direction: column;
      row-gap: 20px;
      padding: 24px 0;
  }
  .new-footer__box--top {
      border-bottom: 1px solid #000000;
  }
  .new-footer__logo {
      width: 100%;
      max-width: 354px;
  }
  .new-footer__logo img {
      width: 100%;
      max-width: 354px;
  }
  .new-footer__text {
      font-family: Verdana, Arial, sans-serif;
      color: #444444;
      font-size: 16px;
  }

  .new-footer__text--white {
    color: #ffffff;
  }

  .new-footer__link {
      color: inherit;
      display: inline;
      text-decoration: underline;
      white-space: nowrap;
  }

.doctor-dialog {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    z-index: -1;
    visibility: hidden;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(1px);
}

.doctor-dialog[open] {
    visibility: visible;
    z-index: 1009;
}

.doctor-dialog__container {
    width: 100%;
    max-width: 530px;
    background-color: #ffffff;
    border-radius: 8px;
    padding: 24px 10px;
    display: flex;
    justify-content: center;
}

.doctor-dialog__inner {
    width: 100%;
    max-width: 450px;
    display: flex;
    flex-direction: column;
    row-gap: 4px;
}

.doctor-dialog__text {
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px;
}

.doctor-dialog__button {
  border: none;
  margin: 0;
  overflow: visible;
  outline: none;
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;

    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    background-color: #000000;
    border-radius: 6px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1;
    padding: 10px;
    cursor: pointer;
}

.doctor-dialog__button * {
    display: block;
    pointer-events: none;
}

@media screen and (max-width: 480px) {
  .doctor-dialog__text,
  .doctor-dialog__button {
    font-size: 9px;
  }
}

.no-doctor-dialog {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    z-index: -1;
    visibility: hidden;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.no-doctor-dialog[open] {
    visibility: visible;
    z-index: 1010;
}

.no-doctor-dialog__container {
    width: 100%;
    max-width: 530px;
    background-color: #ffffff;
    border-radius: 8px;
    padding: 24px 10px;
    display: flex;
    justify-content: center;
}

.no-doctor-dialog__inner {
    width: 100%;
    max-width: 450px;
    display: flex;
    flex-direction: column;
    row-gap: 12px;
}

.no-doctor-dialog__title,
.no-doctor-dialog__text {
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
}

.no-doctor-dialog__title {
    font-weight: 700;
}

.no-doctor-dialog__buttons {
    display: flex;
    column-gap: 4px;
}

.no-doctor-dialog__button {
  border: none;
  margin: 0;
  overflow: visible;
  outline: none;
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    background-color: #000000;
    border-radius: 6px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
    line-height: 1;
    padding: 10px;
    cursor: pointer;


}
.no-doctor-dialog__button * {
  display: block;
  pointer-events: none;
}

@media screen and (max-width: 480px) {
  .no-doctor-dialog__text,
  .no-doctor-dialog__button {
    font-size: 9px;
  }
}