@font-face {
  font-family: 'NEIRIZI';
  src: url('../fonts/NEIRIZI.TTF') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'NotoNastaliqUrdu';
  src: url('../fonts/NotoNastaliqUrdu-Regular.ttf') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'NotoNastaliqUrdu';
  src: url('../fonts/NotoNastaliqUrdu-Medium.ttf') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  font-weight: 500;
}

@font-face {
  font-family: 'NotoNastaliqUrdu';
  src: url('../fonts/NotoNastaliqUrdu-SemiBold.ttf') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  font-weight: 600;
}

@font-face {
  font-family: 'NotoNastaliqUrdu';
  src: url('../fonts/NotoNastaliqUrdu-Bold.ttf') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  font-weight: 700;
}


@font-face {
  font-family: 'BNAZANIN';
  src: url('../fonts/BNAZANIN.TTF') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'BNAZANIN';
  src: url('../fonts/BNAZNNBD.TTF') format('truetype');
  /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  font-weight: 700;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'NEIRIZI', 'BNAZANIN', 'NotoNastaliqUrdu';
  direction: rtl;
}

html {
  overflow-x: hidden;
}

body {
  background: #E8D4BA;
}

button {
  cursor: pointer;
  border: 0;
}

a {
  text-decoration: none;
}

h3 {
  font-weight: 400;
}

/*header {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 14px;
  padding-left: 28px;
}*/

.header-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  background: white;
  padding: 8px 28px 8px 40px;
  display: flex;
  align-items: center;
  border-radius: 516.04px 0 0 516.04px;
}

.logo img {
  width: 79px;
  height: 34px;
}

.allah {
    width: 100%;
    padding-right: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.allah-mobile-container {
  width: 100%;
  padding-right: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.allah-mobile {
  color: #381B00;
  font-size: 17.09px;
  margin-top: 8px;
}

.Record_your_memories {
  background: transparent;
  border: 1px solid #381B00;
  border-radius: 37.18px;
  padding: 2px 24px;
  color: #381B00;
  font-size: 11px;
}

.container {
  width: 100%;
  padding-left: 28px;
  padding-right: 28px;
}

.details-container {
  width: 100%;
  margin-top: 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.right-detail-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.id {
  color: #4C2602;
  font-size: 11.72px;
}

.detail-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.detail-cover {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cover-contaier {
  position: relative;
}

.cover {
  width: 125px;
  height: 144px;
  border-radius: 100%;
  overflow: hidden;
}

.cover-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cover-svg {
  width: 121px;
  height: 135px;
  position: absolute;
  bottom: -20px;
  right: -38px;
}

.OC-container {
  display: none;
}

.details {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 37px;
}

.name {
  color: #733800;
  font-size: 23.87px;
  font-weight: 400;
}

.detail-item-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  margin-top: 3px;
}

.detail-item {
  display: flex;
  align-items: center;
}

.item-title,
.item-object,
.item-sub {
  font-size: 12.51px;
}

.item-title {
  color: #452201;
}

.item-object,
.item-sub {
  color: #733800;
}

.item-object {
  margin-right: 5.5px;
}

.item-sub {
  margin-right: 13.85px;
}

.OC-container-mobile {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 31px;
}

.online-pilgrimage-mobile {
  color: #4C2602;
  padding: 3px 20px 2px;
  background: transparent;
  border: 0.96px solid #744F29;
  border-radius: 44.97px;
}

.condolence-message-mobile {
  color: #4C2602;
  background: white;
  padding: 3px 25px 2px;
  border: 0.95px solid #ffffff;
  border-radius: 44.3px;
}

.recitation {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 43px;
}

.recitation-item-container {
  width: 100%;
  overflow-x: scroll;
  display: flex;
  align-items: center;
  gap: 17.5px;
  padding-bottom: 2px;
}

.recitation-item {
  font-size: 11.63px;
  color: #452201;
  background: #E5BD8E;
  border: 0.84px solid #744F29;
  padding: 3px 21px 1px;
  white-space: nowrap;
  border-radius: 39.34px;
}

.recitation-item-active {
  background: white;
}

.recitation-details {
  width: 100%;
  display: flex;
  align-items: center;
  margin-top: 22px;
}

.poetry {
  width: 100%;
  margin-top: 36px;
}

.poetry-verse {
  display: flex;
  align-items: center;
  column-gap: 35px;
}

.poetry-stanza p {
  /*  font-size: 4.5vw;*/
    font-family: 'NotoNastaliqUrdu' !important;
    color: #452201;
}

.left-detail-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-top: 84px;
}

.reading-the-Quran {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.reading-container {
  width: 100%;
  display: flex;
  align-items: center;
}

.reading-title {
  font-size: 14.42px;
  color: #452201;
  margin-left: 15px;
}

.reading-counter {
  display: flex;
  align-items: center;
  column-gap: 6px;
  margin-left: auto;
}

.reading-counter-item {
  width: 25px;
  height: 25px;
  background: white;
  border-radius: 5.69px;
  color: #4C2602;
  font-size: 18.89px;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 9px;
  line-height: 0;
}

.Participation_in_finishing_the_Quran {
  color: #4C2602;
  font-size: 11.69px;
  padding: 2px 20px;
  background: transparent;
  border: 0.85px solid #744F29;
  border-radius: 39.56px;
}

.number_of_page_left {
  width: 100%;
  display: flex;
  align-items: center;
}

.number_of_page_left_title {
  color: #452201;
  font-size: 13.11px;
  margin-left: 5px;
}

.number_of_page_left_counter {
  color: #733800;
  font-size: 13.11px;
}

.left-detail-container hr {
  width: 100%;
  border: 0.66px solid #7A592E;
  margin-top: 30px;
  margin-bottom: 30px;
}

.reading_the_salawat_and_fatiha_container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 19px;
}

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

.reading_the_salawat_and_fatiha_title {
  color: #452201;
  font-size: 13.11px;
}

.reading_the_salawat_and_fatiha_counter {
  width: 123px;
  padding: 3px 20px 1px;
  background: #E5BD8E;
  border: 0.86px solid #744F29;
  border-radius: 40.11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11.86px;
  color: #452201;
}

.do_salawat_and_fatiha {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.do_salawat_and_fatiha_title {
  color: #452201;
  font-size: 13.11px;
  margin-bottom: 21px;
}

.do_salawat_and_fatiha_container {
  width: 100%;
  padding-right: 13px;
  border: 0.76px solid #744F29;
  border-radius: 35.49px;
  display: flex;
  align-items: center;
  position: relative;
}

.do_salawat_and_fatiha_counter_title {
  font-size: 10.49px;
  color: #4C2602;
  margin-left: 16px;
}

.do_salawat_and_fatiha_counter_container {
  display: flex;
  align-items: center;
  gap: 6.5px;
}

.do_salawat_and_fatiha_counter_container button {
  width: 15px;
  background: transparent;
}

.do_salawat_and_fatiha_counter_container button svg {
  width: 7px;
  height: 4px;
}

.do_salawat_and_fatiha_counter {
  color: #4C2602;
  font-size: 13.77px;
}

.do_salawat_and_fatiha_counter_btn {
  width: 108px;
  height: 100%;
  text-align: center;
  background: #E5BD8E;
  border: 0.76px solid #744F29;
  border-radius: 35.49px;
  font-size: 10.49px;
  color: #4C2602;
  position: absolute;
  left: 0;
}

.do_salawat_and_fatiha_container:last-child {
  margin-top: 13px;
}

.tags-container {
  width: 100%;
  display: flex;
  align-items: center;
  margin-top: 51px;
}

.tags-items-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px;
}

.tags-title {
  font-size: 15.58px;
  color: #452201;
  margin-left: 12px;
  white-space: nowrap;
}

.tags-item {
  background: white;
  border-radius: 32.37px;
  padding: 2px 15px;
  font-size: 10.86px;
  color: #452201;
}

.information {
  width: 100%;
  background: linear-gradient(180deg, #FEFBEF 0%, rgba(254, 251, 239, 0) 100%);
  border-radius: 60px 60px 0 0;
  padding: 34px 0 30px;
  margin-top: 30px;
}

.biography-container {
  width: 100%;
}

.biography-title {
  width: 100%;
  text-align: center;
  font-size: 18.69px;
  color: #452201;
  margin-bottom: 23px;
  font-weight: 400;
}

.biography-content p {
    width: 100%;
    font-family: 'BNAZANIN' !important;
    font-size: 15.7px;
    line-height: 34.29px;
    white-space: pre-line;
    text-align: justify;
}

.pictures-countainer,
.videos-container {
  width: 100%;
  margin-top: 86px;
}

.pictures-title,
.videos-title {
  width: 100%;
  text-align: center;
  font-size: 18.69px;
  color: #452201;
}

.pictures-inner-container,
.videos-inner-container {
  width: 100%;
  margin-top: 26px;
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 11.98px;
  overflow: hidden;
  height: 151px;
  position: relative;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
}

.video {
  display: block;
  width: 100%;
  height: 100%;
  object-position: center;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  display: none;
}

.swiper-button-next,
.swiper-button-prev {
  width: 28px;
  height: 28px;
  transform: translateY(50%);
}

.hover-image {
  display: none;
}

.video-player-container {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background: hsla(0, 0%, 0%, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  opacity: 1;
  pointer-events: all;
  transition: opacity 0.3s ease;
}

.video-player {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}

.video-player-btn {
  box-shadow: 0px 0px 3.3663992881774902px rgba(0, 0, 0, 0.25);
  width: 27px;
  height: 27px;
  background: white;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.video-player-btn svg {
  width: 12px;
  height: 12px;
}

.video-player-title {
  color: white;
  font-size: 10.54px;
}

.video-player-time {
  color: white;
  font-size: 9.83px;
  position: absolute;
  top: 7px;
  left: 10px;
}

.mySwiper2 {
  margin-top: 35px;
}

.mySwiper2 .swiper-slide {
  height: auto !important;
}

.voice-files-container {
  width: 100%;
  margin-top: 76px;
  overflow-x: hidden;
}

.voice-files-title {
  width: 100%;
  text-align: center;
  font-size: 18.69px;
  color: #452201;
}

.audio-player {
  width: 100%;
  display: flex;
  flex-direction: column;
  background-color: white;
  padding: 17px 19px 11px;
  gap: 16px;
}

.audio-container,
.audio-details {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.play-btn {
  width: 40px;
  height: 41px;
  background: url('/images/play-icon.svg') no-repeat center;
  cursor: pointer;
  border: none;
  outline: none;
}

.audio-title,
.time {
  font-size: 15px;
  color: #452201;
}

.progress-container {
  width: 80%;
  height: 40px;
  margin-left: 10px;
  position: relative;
  display: flex;
  align-items: center;
}

.progress-bar {
  width: 100%;
  height: 4px;
  background-color: #fff;
  border-radius: 5px;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.equalizer-bar {
  width: 3px;
  background-color: #452201;
  border-radius: 2px;
  animation: pulse 1s ease-in-out infinite;
}

.equalizer-bar:nth-child(n) {
  animation-delay: 0.2s;
}

.equalizer-bar:nth-child(2n) {
  animation-delay: 0.4s;
}

@keyframes pulse {

  0%,
  100% {
    transform: scaleY(1);
  }

  50% {
    transform: scaleY(0.5);
  }
}

.audio-player2 {
  width: 100%;
  display: flex;
  align-items: center;
}

.play-btn2 {
  width: 40px;
  height: 40px;
  background-color: brown;
  background: url('/images/play-icon-2.svg') no-repeat center;
  cursor: pointer;
  border: none;
  outline: none;
}

.progress-container2 {
  width: 80%;
  height: 40px;
  margin-left: 10px;
  position: relative;
  display: flex;
  align-items: center;
  margin-right: auto;
}

.progress-bar2 {
  width: 100%;
  height: 4px;
  background-color: #fff;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  direction: ltr;
}

.progress2 {
  width: 0;
  height: 100%;
  background-color: #381B00;
}

.time2 {
  margin-left: 10px;
  font-family: 'Courier New', monospace;
  color: #4C2602;
}

footer {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 122px;
}

.footer-title {
  font-size: 18.69px;
  font-weight: 400;
  color: #452201;
  margin-bottom: 34px;
}

.share-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.qrCode-container {
  display: flex;
  align-items: center;
  gap: 11px;
}

.qrCode {
  width: 77px;
  height: 77px;
  border-radius: 7.36px;
  background: white;
  padding: 8px;
}

.qrCode-picture {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
}

.qrCode-btns {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.qrCode-btn {
  width: 141px;
  padding: 5px 0 4px;
  color: #452201;
  font-size: 11.77px;
  background: white;
  border-radius: 6.46px;
  text-align: center;
}

.share-inner-container {
  width: 100%;
  margin-top: 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 34px;
}

.share {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

.share-title {
  font-size: 16.57px;
  color: #452201;
}

.share-links {
  display: flex;
  align-items: center;
  gap: 13px;
}

.share-item {
  display: flex;
}

.share-item svg {
  width: 22px;
  height: 22px;
}

.short-link-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
}

.short-link-title {
  font-size: 16.57px;
  color: #452201;
}

.short-link-inner-container {
  width: 100%;
  background: white;
  border-radius: 6.2px;
  padding: 4px 14px 4px 5px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.short-link {
  direction: ltr;
  font-size: 12.27px;
  color: #4D2908;
  margin-left: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.copy-short-link {
  font-size: 9.82px;
  color: white;
  border-radius: 6.2px;
  background: #452201;
  padding: 7px 22px 5px;
}

.map-container {
  width: 100%;
  margin-top: 159px;
}

.map-innser-container {
  width: 100%;
  background: #FEFBEE;
  border-radius: 8.42px;
  display: flex;
  padding: 150px 25px 17px;
  position: relative;
}

.map {
  width: 85%;
  position: absolute;
  height: 216px;
  border-radius: 8.42px;
  top: -83px;
  right: 50%;
  transform: translateX(50%);
}

.routing-container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 11px;
}

.routing-item {
  border-radius: 5.67px;
  background: white;
  padding: 4px 12px 2px;
  color: #452201;
  font-size: 10.34px;
}

.footer-description {
  width: 100%;
  margin-top: 61px;
  text-align: center;
  font-size: 11.86px;
  color: #502E0D;
}

@media (min-width: 1024px) {
  /*header {
    flex-direction: row;
    justify-content: space-between;
    padding-top: 36px;
    padding-left: 86px;
  }*/

  .logo {
    background: white;
    padding: 5px 77px 5px 53px;
    border-radius: 692.1px 0 0 692.1px;
  }

  .logo img {
    width: unset;
    height: unset;
  }

  .allah {
   /* display: block;*/
    font-size: 37.11px;
  }

  .allah-mobile-container {
    display: none;
  }

  .Record_your_memories {
    font-size: 19.52px;
    border-radius: 66.03px;
    padding: 5px 42px 2px;
  }

  .container {
    max-width: 1728px;
    padding-left: 86px;
    padding-right: 86px;
    margin-left: auto;
    margin-right: auto;
  }

  .details-container {
    margin-top: 44px;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }

  .right-detail-container {
    width: 65%;
    align-items: flex-start;
  }

  .id {
    font-size: 18.74px;
  }

  .detail-container {
    flex-direction: row;
    align-items: flex-end;
    gap: 45px;
  }

  .detail-cover {
    width: fit-content;
  }

  .cover-contaier {
    position: relative;
  }

  .cover {
    width: 200px;
    height: 229px;
  }

  .cover-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .cover-svg {
    width: unset;
    height: unset;
    bottom: -20px;
    right: -60px;
  }

  .OC-container {
    display: flex;
    flex-direction: column;
    margin-top: 24px;
    gap: 6px;
  }

  .online-pilgrimage {
    color: #4C2602;
    padding: 4px 23px;
    background: transparent;
    border: 1.16px solid #744F29;
    border-radius: 54.13px;
  }

  .condolence-message {
    color: #4C2602;
    background: white;
    padding: 4px 22px;
    border: 1.16px solid #ffffff;
    border-radius: 54.13px;
  }

  .details {
    width: calc(100% - 245px);
    align-items: flex-start;
    margin-top: 0;
  }

  .name {
    font-size: 38.16px;
  }

  .detail-item-container {
    width: 100%;
    align-items: flex-start;
    gap: 19px;
    margin-top: 5px;
  }

  .detail-item {
    display: flex;
    align-items: center;
  }

  .item-title,
  .item-object,
  .item-sub {
    font-size: 20px;
  }

  .item-title {
    color: #452201;
  }

  .item-object,
  .item-sub {
    color: #733800;
  }

  .item-object {
    margin-right: 10px;
  }

  .item-sub {
    margin-right: 22px;
  }

  .OC-container-mobile {
    display: none;
  }

  .recitation {
    margin-top: 34px;
    align-items: flex-start;
  }

  .recitation-item-container {
    width: 100%;
    overflow-x: auto;
    display: flex;
    align-items: center;
    gap: 24px;
    padding-bottom: 0;
  }

  .recitation-item {
    font-size: 16px;
    border: 1.16px solid #744F29;
    padding: 5px 28px 3px;
    border-radius: 54.13px;
  }

  .recitation-details {
    margin-top: 18px;
    max-width: 594px;
  }

  .play-timer {
    margin-left: 9px;
  }

  .play-timer .timer {
    font-size: 15.74px;
  }

  .play-percentage {
    width: calc(100% - 87px);
    height: 11px;
    border-radius: 30px;
  }

  .play-percentage-inner {
    border-radius: 30px;
  }

  .play-recitation {
    margin-right: 6px;
  }

  .play-recitation svg {
    width: 19px;
    height: 23px;
  }

  .poetry {
    margin-top: 18px;
  }

  .poetry-verse {
    column-gap: 40px;
  }

  .poetry-stanza {
    font-size: 26.08px;
  }

  .left-detail-container {
    width: 34%;
    margin-top: 60px;
  }

  .reading-the-Quran {
    gap: 19px;
  }

  .reading-title {
    font-size: 22px;
    margin-left: 23px;
  }

  .reading-counter {
    column-gap: 9px;
  }

  .reading-counter-item {
    width: 38px;
    height: 38px;
    border-radius: 8.67px;
    font-size: 28.81px;
    align-items: flex-end;
    padding-bottom: 13px;
    line-height: 0;
  }

  .Participation_in_finishing_the_Quran {
    font-size: 16px;
    padding: 4px 28px;
    border: 1.16px solid #744F29;
    border-radius: 54.13px;
  }

  .number_of_page_left_title {
    font-size: 20px;
    margin-left: 6px;
  }

  .number_of_page_left_counter {
    font-size: 20px;
  }

  .left-detail-container hr {
    border: 1px solid #7A592E;
    margin-top: 49px;
    margin-bottom: 49px;
  }

  .reading_the_salawat_and_fatiha_container {
    gap: 20px;
  }

  .reading_the_salawat_and_fatiha_title {
    color: #452201;
    font-size: 20px;
  }

  .reading_the_salawat_and_fatiha_counter {
    width: 166px;
    padding: 6px 28px 4px;
    border: 1.16px solid #744F29;
    border-radius: 54.13px;
    font-size: 16px;
  }

  .do_salawat_and_fatiha_title {
    font-size: 20px;
    margin-bottom: 14px;
  }

  .do_salawat_and_fatiha_container {
    padding-right: 21px;
    border: 1.16px solid #744F29;
    border-radius: 54.13px;
  }

  .do_salawat_and_fatiha_counter_title {
    font-size: 16px;
    margin-left: 24px;
  }

  .do_salawat_and_fatiha_counter_container {
    gap: 10px;
  }

  .do_salawat_and_fatiha_counter_container button {
    width: 20px;
    background: transparent;
  }

  .do_salawat_and_fatiha_counter_container button svg {
    width: unset;
    height: unset;
  }

  .do_salawat_and_fatiha_counter {
    font-size: 21px;
  }

  .do_salawat_and_fatiha_counter_btn {
    width: 166px;
    border: 1.16px solid #744F29;
    border-radius: 54.13px;
    font-size: 16px;
  }

  .do_salawat_and_fatiha_container:last-child {
    margin-top: 20px;
  }

  .tags-container {
    margin-top: 70x;
  }

  .tags-items-container {
    gap: 4px;
  }

  .tags-title {
    font-size: 20px;
    margin-left: 15.35px;
  }

  .tags-item {
    border-radius: 41.55px;
    padding: 2px 18px;
    font-size: 13.93px;
  }

  .information {
    border-radius: 120px 120px 0 0;
    padding: 76px 0 30px;
    margin-top: 58px;
  }

  .biography-title {
    text-align: right;
    font-size: 27px;
  }

  .biography-content p {
        font-size: 24px;
        line-height: 52.42px;
    }

  .pictures-countainer,
  .videos-container {
    margin-top: 67px;
  }

  .pictures-title,
  .videos-title {
    text-align: right;
    font-size: 27px;
  }

  .pictures-inner-container,
  .videos-inner-container {
    width: 100%;
    margin-top: 30px;
  }

  .swiper-slide {
    border-radius: 20px;
    height: 252px;
    position: relative;
  }

  .swiper-slide a {
    width: 100%;
    height: 100%;
  }

  .hover-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    background: hsla(0, 0%, 0%, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .hover-image-btn {
    background: white;
    box-shadow: 0px 0px 8.10588264465332px rgba(0, 0, 0, 0.25);
    width: 65px;
    height: 65px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
  }

  .swiper-slide:hover .hover-image {
    opacity: 1;
  }

  .swiper-button-next,
  .swiper-button-prev {
    width: 47px;
    height: 47px;
    transform: translateY(0px);
  }

  .video-player {
    gap: 5px;
  }

  .video-player-btn {
    box-shadow: 0px 0px 5.611764907836914px rgba(0, 0, 0, 0.25);
    width: 45px;
    height: 45px;
  }

  .video-player-btn svg {
    width: unset;
    height: unset;
  }

  .video-player-title {
    font-size: 17.57px;
  }

  .audio-player {
    padding: 22px 24px 13px;
    gap: 24px;
  }

  .video-player-time {
    font-size: 16.39px;
    top: 12px;
    left: 16px;
  }

  .voice-files-container {
    margin-top: 85px;
  }

  .voice-files-title {
    text-align: right;
    font-size: 27px;
  }

  .voice-files-inner-container {
    margin-top: 45px;
    gap: 9px;
  }

  .audio-title,
  .time {
    font-size: 17px;
    color: #452201;
  }

  .footer-title {
    font-size: 27px;
    margin-bottom: 59px;
  }

  .share-container {
    flex-direction: row;
    justify-content: space-between;
  }

  .qrCode-container {
    gap: 18px;
  }

  .qrCode {
    width: 126px;
    height: 126px;
    border-radius: 12px;
    padding: 14px;
  }

  .qrCode-btns {
    gap: 11.34px;
  }

  .qrCode-btn {
    width: 231px;
    padding: 8px 0 6px;
    font-size: 19.18px;
    border-radius: 10.53px;
  }

  .share-inner-container {
    width: unset;
    margin-top: 0;
    align-items: flex-end;
    gap: 14px;
  }

  .share {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 42px;
  }

  .share-title {
    font-size: 27px;
  }

  .share-links {
    gap: 20px;
  }

  .share-item svg {
    width: unset;
    height: unset;
  }

  .share-item:hover svg path {
    fill: #502E0E;
  }

  .short-link-container {
    width: unset;
    flex-direction: row;
    gap: 30px;
  }

  .short-link-title {
    font-size: 27px;
  }

  .short-link-inner-container {
    width: 514px;
    border-radius: 10.1px;
    padding: 6px 22px 6px 6px;
    display: flex;
    align-items: center;
  }

  .short-link {
    font-size: 20px;
    margin-left: 11px;
    font-family: Arial, Helvetica, sans-serif;
  }

  .copy-short-link {
    font-size: 16px;
    border-radius: 10.1px;
    padding: 13px 23px 9px;
  }

  .map-container {
    width: 100%;
    margin-top: 258px;
    padding: 0 87px;
  }

  .map-innser-container {
    border-radius: 15px;
    display: flex;
    padding: 267px 51px 31px;
    position: relative;
  }

  .map {
    width: 93%;
    height: 384px;
    border-radius: 15px;
    top: -148px;
  }

  .routing-container {
    justify-content: flex-start;
    gap: 20px;
  }

  .routing-item {
    border-radius: 10.1px;
    padding: 8px 25px 4px;
    font-size: 18.41px;
  }

  .footer-description {
    margin-top: 55px;
    font-size: 20px;
  }
}