/* Smartphones (portrait) ----------- */
@media only screen and (orientation: portrait) {
  .untitled-page .content_box {
    width: 90vw;
  }

  .untitled-page .cover5 {
    width: 100%;
    height: 123vw;
  }

  .untitled-page .image65 {
    inset: 50% 0 0 0;
    width: 100%;
    border-radius: 0 0 20px 20px;
  }

  .untitled-page .title {
    font: 600 6.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
    text-align: center;
  }

  .untitled-page .subtitle2 {
    font: 500 4.55vw / 1.19 Gilroy, Helvetica, Arial, serif;
    text-align: center;
  }

  .untitled-page .flex_col {
    margin: 12vw 6vw;
    gap: 6vw 0;
  }

  .untitled-page .medium_title,
  .untitled-page .contactSectionTitle,
  .untitled-page .clientRelationTitle,
  .untitled-page .consultationTitle {
    font: 700 5.6vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flex_col2 {
    flex-direction: column;
    width: 100%;
  }

  .untitled-page .image1 {
    width: 10.4vw;
    height: 10.4vw;
    border-radius: 7vw;
  }

  .untitled-page .highlight1 {
    font: 600 4.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
    margin: 5vw 0 0;
  }

  .untitled-page .paragraph {
    font: 500 3.6vw / 1.2 Gilroy, Helvetica, Arial, serif;
    margin: 4vw 0 0;
    width: 80vw;
  }

  .untitled-page .flex_col1 {
    gap: 7vw 0;
  }

  .untitled-page .flex_row1 {
    gap: 7vw 0;
  }

  .untitled-page .humanResourceManagementSection_1,
  .untitled-page .serviceOverviewSection,
  .untitled-page .contactUsSection,
  .untitled-page .employeeManagementSection,
  .untitled-page .solutionsSection,
  .untitled-page .payrollManagementSection,
  .untitled-page .employeeDashboardSection,
  .untitled-page .leanManagementSection,
  .untitled-page .clientRelationsSection,
  .untitled-page .mainPageSection {
    padding-top: 20vw;
  }

  .untitled-page .cover {
    height: 100vw;
  }

  .untitled-page .image4,
  .untitled-page .clientImage,
  .untitled-page .individualApproachImage,
  .untitled-page .specialistImage,
  .untitled-page .image41 {
    width: 10.4vw;
    height: 10.4vw;
  }

  .untitled-page .highlight13 {
    font: 500 3.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
    margin: 4vw 0;
  }

  .untitled-page .flex_col5 {
    margin: 4vw 2vw;
  }

  .untitled-page .contactFormGroup {
    flex-direction: column;
    width: 90vw;
  }

  .userNameButton,
  .phoneNumberButton {
    width: 90vw;
    height: 11vw;
    margin-top: 1.4vw;
    font: 400 5vw / 1.2 Gilroy, Helvetica, Arial, serif;
    padding: 3vw;
  }

  .contactButton {
    width: 90vw;
    height: 11vw;
    margin-top: 1.4vw;
    font: 400 4vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .headerToInpit {
    font: 700 3vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .callbackNotification {
    width: 100%;
    display: flex;
    height: unset;
    font: 500 4vw / 1.2 Gilroy, Helvetica, Arial, serif;
    justify-content: center;
    flex-direction: row;
  }

  .buttonContainer .form-group {
    gap: 2.5vw;
    z-index: 1;
  }

  .untitled-page .contactFormGroupImg {
    width: 100vw;
    position: relative;
    top: -12vw;
    left: -5vw;
    border-radius: 0 0 1vw 1vw;
  }

  .untitled-page .item {
    width: 90vw;
    height: 43vw;
    border-radius: 13vw;
  }

  .untitled-page .image12,
  .untitled-page .cover2 {
    width: 44.5vw;
  }

  .untitled-page .image77,
  .untitled-page .image78,
  .untitled-page .image79,
  .untitled-page .image16 {
    width: 10.4vw;
    height: 10.4vw;
    border-radius: 10vw;
  }

  .untitled-page .image13,
  .untitled-page .image14 {
    width: 43.5vw;
  }

  .untitled-page .image15 {
    width: 36.5vw;
  }

  .untitled-page .subtitle,
  .untitled-page .individualApproachSubtitle,
  .untitled-page .specialistSubtitle,
  .untitled-page .promptResponseSubtitle {
    font: 700 4.3vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .highlight14 {
    font: 501 3.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flex_row2 {
    margin-top: 13vw;
    gap: 20vw;
    width: 90vw;
  }

  .untitled-page .content_box1 {
    width: 90vw;
  }

  .untitled-page .subtitle1 {
    font: 700 4.2vw / 1.2 Gilroy, Helvetica, Arial, serif;
    height: 18vw;
  }

  .untitled-page .flex_col10 {
    padding: 5%;
    gap: 4.5vw;
  }

  .untitled-page .image181 {
    border-radius: 10vw;
    width: 6.4vw;
    height: 6.4vw;
  }

  .untitled-page .highlight2 {
    font: 700 4vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flex_row5 {
    gap: 0 3vw;
  }

  .untitled-page .dashboardCoverImage {
    height: 53vw;
  }

  .untitled-page .dashboardFlexRowDiv {
    align-items: flex-start;
    gap: 3vw;
    margin: 5vw;
    flex-direction: column;
  }

  .untitled-page .highlightTitleH2 {
    font: 700 5.6vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .employeeHighlightImage,
  .untitled-page .departmentImage {
    width: 10.4vw;
    height: 10.4vw;
  }

  .untitled-page .groupDiv {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 90vw;
    /* margin: 56px 56px 16px; */
    justify-content: space-between;
  }

  .untitled-page .titleContentDiv {
    gap: 5vw 0;
  }

  .untitled-page .leanManagementTitle {
    font: 700 5.56vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .individualApproachItem,
  .untitled-page .expertSpecialistsItem,
  .untitled-page .promptResponseItem {
    width: 90vw;
    height: 70vw;
  }

  .untitled-page .medium_title_box1,
  .untitled-page .clientRelationTitle_box {
    margin: 5vw 0 0;
  }

  .untitled-page .clientRelationDescription {
    font: 500 3.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
    margin: 5vw 0 0;
  }

  .untitled-page .approachImageContainer,
  .untitled-page .specialistImageContainer {
    height: 70vw;
    width: unset;
  }

  .untitled-page .flex_col13,
  .untitled-page .flex_col14,
  .untitled-page .flex_col15 {
    height: 70vw;
    width: 85vw;
    margin: 4vw 3vw;
  }

  .untitled-page .individualApproachDescription,
  .untitled-page .specialistDescription,
  .untitled-page .promptResponseDescription {
    font: 500 4.1vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .gridContainer {
    gap: 11vw;
    width: 90vw;
  }

  .untitled-page .clientRelationItem {
    width: 85vw;
    height: 55vw;
  }

  .untitled-page .clientRelationItemcarusel {
    width: 85vw;
    height: 30vw;
  }

  .untitled-page .flexColumnContainer {
    padding-top: 25vw;
  }

  .carousel-controls {
    margin-top: 3vw;
    font-size: 4vw;
    gap: 3vw;
  }

  .carousel-controls button {
    width: 8vw;
    height: 8vw;
  }

  .page-number {
    width: 8vw;
    height: 8vw;
  }

  .carousel-images {
    flex-wrap: wrap;
  }
  .untitled-page .rowImage1 {
    border-radius: 3vw;
    width: 36vw;
    height: 17vw;
    margin: 1vw;
  }

  .untitled-page .formGroup {
    flex-direction: column;
    width: 90vw;
  }

  .untitled-page .flexRowContacts {
    gap: 0 4vw;
  }

  .untitled-page .departmentLabel {
    font: 700 4.3vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flexRowDetails {
    align-items: flex-start;
    flex-direction: column;
    gap: 5vw;
  }

  .flexRowDetails_Block {
    gap: 2.5vw;
  }

  .untitled-page .phoneImage,
  .untitled-page .emailImage,
  .untitled-page .socialMediaImage {
    width: 10.5vw;
    height: 10.5vw;
    border-radius: 10vw;
  }

  .untitled-page .phoneNumberLabel,
  .untitled-page .emailLabel,
  .untitled-page .socialMediaHandleLabel {
    font: 700 3.5vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flexColumnLayout1 {
    margin-top: 20vw;
    gap: 5vw;
  }

  .untitled-page .contactGroup {
    width: 85vw;
  }

  .untitled-page .genericImage {
    height: 3vw;
    border-radius: 0 0 10vw 10vw;
    margin-top: 4vw;
    width: 90vw;
  }

  .untitled-page .rectangleElement {
    height: 85vw;
    border-radius: 0 0 0 0;
  }

  .untitled-page .contentGroup {
    width: 100vw;
  }

  .untitled-page .flexRow {
    flex-direction: column;
    align-items: flex-start;
    gap: 10vw;
    margin-top: 5vw;
  }

  .untitled-page .copyrightNotice {
    font: 700 3vw / 1.2 Gilroy, Helvetica, Arial, serif;
    justify-content: flex-start;
    margin-top: 6vw;
  }

  .untitled-page .mainImage1 {
    width: 35vw;
  }
  .flexRow .mainContentSection-menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 50vw;
    gap: 6vw;
  }

  .flexRow .flexRowDetails_Block {
    display: none;
  }

  .untitled-page .homeText,
  .untitled-page .clientsText,
  .untitled-page .valuesText {
    font: 700 5vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .untitled-page .flexColumn {
    left: 5vw;
    width: 90vw;
  }

  .untitled-page .group1,
  .untitled-page .group2,
  .untitled-page .group3,
  .untitled-page .dashboardGroupDiv {
    width: 90vw;
  }

  .untitled-page .flex_col6 {
    width: 90vw;
  }

  .untitled-page .flex_row {
    width: 90vw;
  }

  .mainContentSection-menu,
  .mainContentSection-contact,
  .mainContentSection-contact {
    display: none;
  }

  .untitled-page .image55 {
    width: 24vw;
    height: 11vw;
  }

  .untitled-page .mainContentSection {
    width: 90vw;
  }

  .untitled-page .humanResourceManagementSection {
    margin-top: 20vw;
  }

  .untitled-page .btn {
    width: 41vw;
    height: 9vw;
    font: 700 3.5vw / 1.2 Gilroy, Helvetica, Arial, serif;
  }

  .mobile-menu {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }

  .mobile-menu .submit-application-block-text-contacts-url {
    margin-top: 4vw;
    width: unset;
    margin-left: 0%;
  }

  .mobile-menu .submit-application-block-text-contacts-url-text-phone,
  .mobile-menu .submit-application-block-text-contacts-url-title,
  .mobile-menu .submit-application-block-text-contacts-url-text {
    color: #fff;
  }

  .menu {
    display: none;
  }

  .menu-item {
    font-size: 5.1vw;
    color: rgb(255 255 255);
  }

  .menu-item.active {
    font-weight: bold;
    color: rgb(255 255 255);
  }

  .menu-item.active::after {
    bottom: 13%;
    left: -13%;
    width: 2vw;
    height: 2vw;
    background-color: rgb(255 255 255) !important;
  }

  .open {
    display: flex;
  }

  .open ul {
    background-image: url(img/BackMenuMobile.png),
      linear-gradient(#ff5c00, #ee8c55);
    background-size: cover;
    background-position: bottom;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    /* margin-top: 20px; */
    gap: 20px;
    position: fixed;
    left: 0;
    bottom: 0%;
    width: 100%;
    height: 92%;
    padding: 8% 0 0 5%;
    /* border-radius: 40px 40px 0 0; */
    /* font-size: 4vw; */
  }

  .mobMenuContact {
    position: absolute;
    top: 55vw;
    left: 5vw;
    width: 90vw;
    border-radius: 0 0 2vw 0;
    z-index: 0;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.3); /* Черная тень */
  }

  .mobMenu {
    z-index: 1;
    position: relative;
    padding-left: 5vw;
    margin-top: 5vw !important;
  }

  .copyright {
    position: fixed;
    bottom: 0px;
    padding: 5vw;
    background-color: rgba(51, 51, 51, 1);
    color: #ffffff8c;
    width: 100%;
    left: 0;
  }

  .noVisible {
    display: none !important;
  }

  .untitled-page .image64 {
    width: 43.5vw;
    height: 64.3vw;
  }

  .desktop_view {
    display: none;
  }

  .mobile_view {
    display: unset;
  }

  .futterToLogo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    width: 100%;
  }

  .futterUpButton {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 27vw;
    height: 9vw;
    font: 600 4vw / 1.2 Gilroy, Helvetica, Arial, serif;
    color: #000;
    text-align: left;
    background-color: #fff;
    border-radius: 24px;
    outline: 1px solid #fff;
    outline-offset: -1px;
    padding: 1vw;
    cursor: pointer;
    position: relative;
  }
  .futterUpButton:hover::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.25); /* Черная тень */
    border-radius: 24px; /* Обеспечиваем соответствие радиусу кнопки */
    z-index: 1; /* Убедимся, что фон выше других элементов */
  }

  .futterUpButton:hover {
    z-index: 2; /* Поднимаем кнопку выше фона */
  }

  .carousel-wrapper {
    width: calc(100% * 18 / 2);
  }

  #pagination {
    display: none;
  }
}