@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Light Az.otf");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Regular Az.otf");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Medium Az.otf");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Semi Bold Az.otf");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Bold Az.otf");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Sofia Pro";
  src: url("../fonts/Sofia-Pro/Sofia Pro Black Az.otf");
  font-weight: 900;
  font-style: normal;
}
* {
  font-family: "Sofia Pro", Arial, sans-serif !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.font-bold {
  font-weight: 700 !important;
}

* ::-webkit-scrollbar {
  width: 8px !important;
}
* ::-webkit-scrollbar-thumb {
  background-color: #9586fb !important;
  border-radius: 20px;
}

body -webkit-scrollbar {
  display: none;
}

body {
  font-size: 16px;
  margin-bottom: 140px;
  background-color: #f5f5f5;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

a {
  text-decoration: none;
}

.text-paragraph {
  color: #54607a;
}

.text-sm {
  font-size: 0.875rem;
}

.form-input {
  margin-top: 15px;
  display: block;
  width: 100%;
  height: 60px;
  padding: 20px;
  font-size: 1rem;
  border-radius: 8px;
  background: #f1f1f1;
  border: none;
}

.main__journals__section {
  margin-top: 50px;
}
.main__journals__section .journals__header {
  display: flex;
  justify-content: space-between;
  padding-bottom: 16px;
  flex-direction: column;
  gap: 40px;
}
@media (min-width: 1024px) {
  .main__journals__section .journals__header {
    flex-direction: row;
    align-items: center;
  }
}
.main__journals__section .journals__header h1 {
  font-size: 1.875rem;
}
.main__journals__section .journals__header p {
  margin-top: 10px;
  padding-left: 10px;
  border-left: 3px solid #9586fb;
  color: #9586fb;
  font-style: normal;
  font-weight: 200;
  line-height: 28px;
  max-width: 1000px;
}
.main__journals__section .journals__header button {
  color: white;
  border: none;
  gap: 10px;
  border-radius: 10px;
  cursor: pointer;
  padding: 18px 36px;
  width: 100%;
  max-width: 230px;
  font-size: 1rem;
  background: linear-gradient(15deg, #7769d4 26.3%, #9586fb 86.4%);
}
.main__journals__section .journals__section__content {
  margin-top: 20px;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(1, 1fr);
}
@media (min-width: 1280px) {
  .main__journals__section .journals__section__content {
    grid-template-columns: repeat(2, 1fr);
  }
}
.main__journals__section .journals__section__content a {
  color: #100303;
}
.main__journals__section .journals__section__content .journal__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 20px;
  border-radius: 20px;
  padding: 22px;
  background-color: white;
  transition: 0.3s;
  cursor: pointer;
}
.main__journals__section .journals__section__content .journal__item:hover {
  box-shadow: 0px 100px 80px 0px rgba(0, 0, 0, 0.07), 0px 41.778px 33.422px 0px rgba(0, 0, 0, 0.05), 0px 22.336px 17.869px 0px rgba(0, 0, 0, 0.04), 0px 12.522px 10.017px 0px rgba(0, 0, 0, 0.04), 0px 6.65px 5.32px 0px rgba(0, 0, 0, 0.03), 0px 2.767px 2.214px 0px rgba(0, 0, 0, 0.02);
}
.main__journals__section .journals__section__content .journal__item .journal__date {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.main__journals__section .journals__section__content .journal__item .journal__date div {
  background-color: #f1f1f1;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 30px;
}
.main__journals__section .journals__section__content .journal__item .journal__date div h2 {
  color: #54607a;
  opacity: 0.7;
  font-weight: 200;
  letter-spacing: 2px;
  font-size: 0.875rem;
}
@media (min-width: 640px) {
  .main__journals__section .journals__section__content .journal__item .journal__date div h2 {
    font-size: 1rem;
  }
}
.main__journals__section .journals__section__content .journal__item .journal__date div h1 {
  font-size: 1.875rem;
}
@media (min-width: 640px) {
  .main__journals__section .journals__section__content .journal__item .journal__date div h1 {
    font-size: 3rem;
  }
}
.main__journals__section .journals__section__content .journal__item .journal__date span {
  color: #54607a;
  opacity: 0.7;
  font-weight: 200;
  letter-spacing: 10px;
  font-size: 0.875rem;
}
@media (min-width: 640px) {
  .main__journals__section .journals__section__content .journal__item .journal__date span {
    font-size: 1rem;
  }
}
.main__journals__section .journals__section__content .journal__item .journal__data h1 {
  font-weight: 600;
  font-size: 1.25rem;
}
@media (min-width: 640px) {
  .main__journals__section .journals__section__content .journal__item .journal__data h1 {
    font-size: 1.25rem;
  }
}
@media (min-width: 768px) {
  .main__journals__section .journals__section__content .journal__item .journal__data h1 {
    font-size: 1.5rem;
  }
}
.main__journals__section .journals__section__content .journal__item .journal__data p {
  max-width: 900px;
  margin-top: 10px;
  line-height: 24px;
  font-weight: 300;
}
.main__journals__section .journals__section__content .journal__item .journal__data p .journal_description {
  color: #54607a;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  -webkit-box-orient: vertical;
}
.main__journals__section .journals__section__content .journal__item .journal__data p .readmore__button {
  color: #9586fb;
  font-weight: 600;
  margin-left: 5px;
  cursor: pointer;
}
.main__journals__section .journals__section__content .journal__item .journal__data p .readmore__button:hover {
  text-decoration: underline;
}
.main__journals__section .journals__section__content .journal__item img {
  padding: 7px;
  position: absolute;
  top: 0;
  right: 0;
  margin: 4px;
  border-radius: 50%;
  cursor: pointer;
}
.main__journals__section .journals__section__content .journal__item img:hover {
  background-color: #eeeeee;
}/*# sourceMappingURL=journals.css.map */