/*
WebSite: CodeMedia.az
Author: Taleh Rzayev
Developers: Kənan Məmmədov (Frontend Developer) , Əhəd Hacıyev (Frontend Developer) 
*/

@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
}

body {
     font-family: "Poppins", sans-serif !important;
}

a {
     text-decoration: none !important;
}

ul {
     list-style: none;
     margin-bottom: 0 !important;
}

:root {
     --color-white: white;
     --color-whitesmoke: #fbfbfb;
     --color-whitesmoke2: #f0f0f0;
     --color-black: black;
     --color-ee4c7d: #ee4c7d;
     --color-FFC466: #ffc466;
     --color-gray: #c2c2c2;
     --color-gray2: #ccc;
     --color-dark-gray: #646464;
}


@media (max-width: 768px) {

     .container {
          padding: 0 20px !important;
     }
}

/* Navbar start */
.main-navbar {
     padding: 10px 0;
     background-color: var(--color-white);
     box-shadow: 0px 10px 30px -5px rgba(0, 0, 0, 0.25);
}

.site-logo {
     width: 60px;
     height: 60px;
}

.main-nav-link {
     padding: 5px 0;
     cursor: pointer;
     position: relative;
     border-radius: 26px;
}

.main-nav-links {
     gap: 20px;
}

.main-nav-link::after {
     content: "";
     border-radius: 26px;
     background-color: var(--color-ee4c7d);
     height: 3px;
     width: 0;
     position: absolute;
     left: 0;
     bottom: 0;
     z-index: -1;
     transition: all 0.7s;
}

.main-nav-link:hover::after,
.main-nav-link.active::after {
     /* height: 100%; */
     width: 100%;
}

.main-navbar .main-nav-links .main-nav-link a {
     color: var(--color-black);
     font-size: 14px;
     text-transform: capitalize;
     transition: all 0.7s;
}

.main-nav-link:hover a,
.main-nav-link.active a {
     color: var(--color-ee4c7d) !important;
}

.main-navbar .searcBtn,
.main-navbar .open-menu {
     background: none;
     border: none;
     font-size: 20px;
     color: var(--color-ee4c7d);
}

.open-menu {
     display: none;
}

.close-menu {
     display: none;
}

.search-overlay {
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     height: 100vh;
     background: rgba(0, 0, 0, 0.85);
     transform: scaleY(0);
     transform-origin: top;
     transition: 0.8s;
}

.close-overlay {
     position: fixed;
     right: 7%;
     top: 40px;
     background: none;
     border: none;
     color: var(--color-white);
     font-size: 26px;
}

.search-container {
     position: relative;
     top: 50%;
     left: 50%;
     width: 100%;
     transform: translate(-50%, -50%);
     display: flex;
     justify-content: center;
}

.search-container input {
     width: 50%;
     padding: 10px;
     padding-left: 20px;
     border: none;
     outline: none;
     background-color: var(--color-white);
     color: var(--color-ee4c7d);
}

.search-container button {
     padding: 10px;
     border: none;
     width: 50px;
     background-color: var(--color-ee4c7d);
     color: #fff;
}

.search-container input::placeholder {
     color: var(--color-ee4c7d);
}

.open-overlay {
     /* display: block; */
     transform: scaleY(1);
}

/* .nav-responsive-socials{
    display: none ;
} */
/* Navbar end */
/* Home page Header start */
.slider-item {
     width: 100%;
     height: 100%;
}

.layer {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background-color: rgba(0, 0, 0, 0.6);
}

.slider--img img {
     height: 500px;
     object-fit: cover;
     object-position: center;
}

.slider-item--description {
     position: absolute;
     height: 200px;
     top: 20%;
     left: 0;
     right: 0;
     background-color: rgba(255, 255, 255, 0.3);
     padding: 30px;
     text-align: center;
}

.slider-item--description h1 {
     color: var(--color-white);
     font-size: 40px;
     margin-bottom: 40px;
}

.slider-item--description a {
     padding: 14px 32px;
     border-radius: 28px;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
     font-size: 14px;
     font-weight: 500;
     display: inline-block;
     transition: 0.4s;
}

.slider-item--description a:hover {
     background-color: var(--color-white);
     color: var(--color-black);
     transition: 0.4s;
}

.slider-control {
     position: absolute;
     bottom: 125px;
     font-size: 26px;
     background: none;
     border: none;
     color: var(--color-white);
}

.slider-prev {
     z-index: 2;
     width: 50%;
     text-align: right;
}

.slider-next {
     width: 49%;
     right: 0;
     text-align: left;
     margin-left: 60px;
     z-index: 1;
}

.slider-control:hover {
     opacity: 0.8;
}

.news-section-container--top {
     position: relative;
     top: -50px;
}

.news-section-container-top--card {
     box-shadow: 15px 14px 38px 0px rgba(0, 0, 0, 0.1);
     padding: 20px;
     background-color: var(--color-white);
     transition: 0.5s;
     margin-bottom: 20px;
}

.news-section-container-top-card--icon {
     font-size: 40px;
     color: var(--color-FFC466);
     margin-bottom: 20px;
}

.news-section-container-top-card--content {
     font-size: 16px;
     color: #54595f;
}

.news-section-container-top--card:hover {
     background-color: var(--color-FFC466);

     transform: translateY(-30px);
     transition: 0.5s;
}

.news-section-container-top--card:hover * {
     color: var(--color-white);
}

.news-section-container-bottom--heading {
     /* font-weight: 400; */
     text-transform: capitalize;
     font-size: 24px;
}

.newsCard-img {
     width: 140px;
     min-width: 140px;
     height: 135px;
     position: relative;
     margin: auto;
     margin-bottom: 15px;
}

.newsCard-img::after,
.bottom-news-section-card--img:after {
     content: "";
     width: 100%;
     height: 100%;
     position: absolute;
     border-bottom-left-radius: 10px;
     border-bottom-right-radius: 10px;
     left: 0;
     bottom: 0;
     background: linear-gradient(180deg, rgba(18, 18, 19, 0) 50%, #121213 100%);
     transition: 1s;
     opacity: 0;
}

.bottom-news-section-card--img:after {
     border-radius: 0;
}

.newsCard-img img {
     width: 100%;
     height: 100%;
     object-fit: fill;
     object-position: center;
     border-radius: 10px;
}

.news-section-container-bottom-newsCard {
     align-items: center;
}

.news-section-container-bottom-newsCard:hover .newsCard-img::after,
.bottom-news-section--card:hover .bottom-news-section-card--img:after {
     opacity: 1;
}

.newsCard-description--cat {
     padding: 3px 15px;
     font-size: 14px;
     color: var(--color-white) !important;
     background-color: var(--color-ee4c7d);
     border-radius: 20px;
}

.newsCard-description--head {
     font-size: 20px;
     font-weight: 400;
     color: var(--color-black);
     transition: 0.3s;
}

.newsCard-description--content {
     font-size: 15px;
     color: #737373;
     font-weight: 300;
     text-overflow: ellipsis;
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     height: 50px;
}

.newsCard-description--btns {
     padding-top: 20px;
}

.newsCard-description--btns span {
     font-size: 12px;
     font-weight: 400;
}

.newsCard-description--btns a,
.bottom-news-section-card--description a:last-of-type {
     font-size: 14px;
     font-weight: 400;
     color: var(--color-black);
     font-weight: 500;
     text-transform: uppercase;
     transition: 0.3s;
}

.newsCard-description--btns a i,
.bottom-news-section-card--description a:last-of-type i {
     font-size: 16px;
     margin-left: 10px;
}

.newsCard-description--head:hover,
.newsCard-description--btns a:hover,
.bottom-news-section-card--description a:last-of-type:hover {
     color: var(--color-ee4c7d);
}

.news-section-container--bottom {
     position: relative;
}

.anket-head {
     font-size: 18px;
     position: relative;
     display: inline-block;
     padding-bottom: 6px;
}

.anket-answer {
     margin-bottom: 20px;
}

.anket-answer label {
     font-size: 14px;
     display: flex;
     align-items: center;
     color: #333;
     margin-bottom: 5px;
}

.anket-submit {
     padding: 5px 15px;
     border: none;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
     font-size: 14px;
     border-radius: 5px;
     transition: 0.5s;
}

.anket-submit:disabled {
     background-color: var(--color-black);
}

.anket-submit:hover {
     background-color: var(--color-black);
}

.anket-answer label input {
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     z-index: 3;
     opacity: 0;
     cursor: pointer;
}

.radio-btn {
     position: relative;
     margin-right: 5px;
}

.checked {
     border-radius: 100%;
     border: 1px solid var(--color-ee4c7d);
     width: 15px;
     max-width: 15px;
     height: 15px;
     max-height: 15px;
     position: relative;
}

.checked::after {
     content: "";
     width: 8px;
     height: 8px;
     display: block;
     border-radius: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
}

.radio-btn input[type="radio"]:checked~.checked::after {
     background-color: var(--color-ee4c7d);
}

.anket-answer label input:checked {
     background-color: var(--color-ee4c7d);
}

.progress {
     height: 10px !important;
     background-color: var(--color-white) !important;
}

.progress-bar {
     background-color: var(--color-FFC466) !important;
     font-size: 10px !important;
     color: #333 !important;
     font-weight: 500 !important;
}

.bottom-news--section {
     background-color: #f8f8f8;
}

.bottom-news-section--head {
     margin-bottom: 38px;
}

.bottom-news-section--card {
     border-radius: 10px;
     margin: 0 10px;
     background-color: var(--color-white);
}

.popular--posts {
     display: grid;
     grid-template-columns: repeat(4, calc(25% - 7.5px));
     gap: 10px;
}

.insta-post img {
     height: 75px;
     object-fit: cover;
     object-position: center;
}

.insta-post {
     position: relative;
}

.insta-post a:last-child {
     display: flex;
     align-items: center;
     justify-content: center;
     background: rgb(84, 89, 95, 0.3);
     width: 100%;
     height: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     opacity: 0;
     color: var(--color-whitesmoke);
     transition: 0.3s;
}

.insta-post:hover a:last-child {
     opacity: 1;
}

.insta-profile-link {
     display: inline-block;
     text-align: center;
     margin-top: 20px;
     padding: 5px 10px;
     border-radius: 6px;
     background-color: var(--color-black);
     color: var(--color-whitesmoke);
     transition: 0.5s;
}

.insta-profile-link:hover {
     background-color: var(--color-ee4c7d);
     color: var(--color-whitesmoke);
}

.bottom-news-section-card--img {
     width: 100%;
     height: 200px;
     position: relative;
}

.bottom-news-section-card--img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
}

.bottom-news-section-card--description {
     padding: 20px;
}

.bottom-news-section-card-description-date {
     color: #575757;
     font-size: 12px;
}

.bottom-news-section-card--description h3 {
     font-size: 18px;
     color: var(--color-black);
     transition: 0.5s;
     text-overflow: ellipsis;
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     height: 45px;
}

.bottom-news-section-card--description h3:hover {
     color: var(--color-ee4c7d);
}

.bottom-news-section-card--description a:last-of-type {
     font-size: 12px !important;
}

.section-partners--heading {
     text-transform: capitalize;
     font-size: 28px;
}

.partner-slider-item img {
     width: 130px;
     object-fit: contain;
     margin: auto;
}

.popular-post--heading {
     font-size: 22px;
     text-transform: capitalize;
     padding: 4px 0;
}

.underline {
     width: 100%;
     height: 3px;
     background-color: #f2f2f2;
     position: relative;
}

.underline:after {
     content: "";
     background-color: var(--color-ee4c7d);
     position: absolute;
     bottom: 0;
     left: 0;
     width: 25%;
     height: 3px;
}

.popular-post--description {
     padding: 6px 0;
}

.popular-post--description h3 {
     font-size: 18px;
     color: var(--color-black);
     margin-bottom: 10px;
     font-weight: 500;
     text-overflow: ellipsis;
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     height: 45px;
     transition: 0.4s;
}

.popular-post--description h3:hover {
     color: var(--color-ee4c7d);
}

.popular-post--date p {
     font-size: 12px;
     color: #7a7a7a;
}

.popular-post--date p i {
     margin-right: 3px;
}

.main--footer {
     background-color: var(--color-black);
}

.footer-logo {
     width: 100px;
     height: 100px;
}

.main-footer-top--row {
     border-bottom: 2px solid #7a7a7a;
}

.main-footer-bottop--description {
     color: var(--color-white);
     font-size: 14px;
}

.footer-socials a {
     width: 35px;
     height: 35px;
     background-color: var(--color-black);
     border-radius: 100%;
     color: var(--color-black);
     font-size: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all 0.5s;
     background-color: var(--color-white);
}

.footer-socials a:hover {
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
}

/* news page start */

.pages--header {
     padding: 40px 0;
     background-color: #f7f7f7;
}

.pages-header * {
     font-size: 14px;
     font-weight: 500;
}

.pages--header a {
     color: #646464;
     transition: 0.3s;
}

.pages--header a:hover {
     color: var(--color-ee4c7d);
}

.pages--header span {
     color: var(--color-ee4c7d);
}

.pages--header i {
     color: #646464;
     padding: 0 7px;
}

.about-us-left-images {
     width: 45%;
     min-width: 45%;
}

.about-us--images img {
     object-fit: cover;
     object-position: center;
     border-radius: 10px;
}

.about-us-description--head {
     font-size: 20px;
     margin-bottom: 20px;
     color: #183354;
}

.about-us-description--content {
     font-size: 14px;
     color: #545e69;
}

.our-team--section {
     background-color: #f7f7f7;
}

.our-tean--card {
     background-color: var(--color-white);
     border-radius: 10px;
     margin: 0 10px;
     transition: 1s;
}

.our-team-card--img {
     position: relative;
     overflow: hidden;
}

.our-team-card--img:after {
     content: "";
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background-color: #183354;
     opacity: 0;
     border-radius: 10px 10px 0 0;
     transition: 0.8s;
}

.our-team-card--img img {
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     height: 350px;
     object-fit: cover;
     object-position: top;
}

.team-socials {
     position: absolute;
     width: 100%;
     bottom: 20px;
     left: 0;
     transform: translateY(70px);
     transition: 1s;
     z-index: 1;
}

.team-socials a {
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
}

.team-socials a:hover {
     background-color: #183354;
}

.our-team-card--description {
     padding: 20px;
}

.our-team-card-description--head {
     font-size: 22px;
     margin-bottom: 5px;
     color: #183354;
     text-transform: capitalize;
}

.our-team-card-description--content {
     font-size: 16px;
     color: #545e69;
}

.our-tean--card:hover .team-socials {
     transform: translateY(0);
}

.our-tean--card:hover .our-team-card--img:after {
     opacity: 0.3;
}

.our-team-section-head {
     color: #183354;
}

.team-slider-control {
     background: none;
     border: 1px solid var(--color-ee4c7d);
     border-radius: 6px;
     padding: 0 10px;
     color: var(--color-ee4c7d);
     position: absolute;
     right: 0;
     top: -75px;
     transition: 0.5s;
}

.team-slider-control:hover {
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
}

.team-slider-prev {
     margin-right: 45px;
}

/* Catagory */

.catagory {
     padding-bottom: 50px;
}

.catagory__content {
     padding-top: 50px;
     display: flex;
     align-items: start;
     gap: 80px;
}

.catagory__post {
     width: 30%;
}

.catagory__post .catagory__post-input {
     padding-bottom: 0px;
     display: flex;
}

.catagory__post .catagory__post-input input {
     padding: 5px;
     border-radius: 5px 0 0 5px;
     border: 1px solid #ededed;
     width: 88%;
     outline: none;
}

.catagory__post .catagory__post-input .catagory__post-icon {
     background-color: var(--color-black);
     padding: 7px 10px;
     border-radius: 0 5px 5px 0;
     cursor: pointer;
     transition: all 0.3s ease-in-out;
}

.catagory__post .catagory__post-input .catagory__post-icon:hover {
     background-color: var(--color-ee4c7d);
}

.catagory__post .catagory__post-input .catagory__post-icon i {
     color: var(--color-white);
}

.catagory__post .catagory__post-content {
     width: 100%;
}

.catagory__post .catagory__post-content .catagory__post-content-title span {
     color: var(--color-black);
     text-transform: uppercase;
     display: inline-block;
     padding: 10px 0;
     line-height: 29px;
     font-weight: 500;
}

.border {
     width: 100%;
     border: 1px solid #ccc;
}

.catagory__post-content-card {
     padding-top: 20px;
     width: 100%;
}

.catagory__post-content-card .catagory__post-content-item {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 20px;
     margin-bottom: 10px;
}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-img {
     width: 50%;
     height: 120px;
}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-img img {
     width: 100%;
     height: 100%;
     border-radius: 10px;
}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-info {}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-info .catagory__post-content-text a {
     color: var(--color-black);
     text-decoration: none;
     line-height: 25px;
     transition: all 0.3s ease-in-out;
}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-info .catagory__post-content-text a:hover {
     color: var(--color-ee4c7d);
}

.catagory__post-content-card .catagory__post-content-item .catagory__post-content-info .catagory__post-content-date {
     line-height: 13px;
     font-size: 12px;
     color: #a2a2a2;
     margin-top: 7px;
}

.catagory__content .catagory__popular {
     width: 100%;
}

.catagory__content .catagory__popular .catagory__popular-title .catagory__popular-title-text {
     font-weight: 400;
     text-transform: uppercase;
     font-size: 24px;
}

.catagory__content .catagory__popular .catagory__popular-title .catagory__popular-title-text.search {
     text-transform: capitalize;
}

.catagory__popular-card {
     margin-bottom: 40px;
}

.catagory__content .catagory__popular .catagory__popular-card {
     display: flex;
     gap: 30px;
}

.catagory__popular-card-img {
     transition: all 0.3s ease-in-out;
     position: relative;
}

.category__popular-tags {
     width: 20%;
}

.category__popular-tags .tags-title {
     color: var(--color-dark-gray);
     padding-bottom: 30px;
}

.tag__card {
     padding-top: 22px;
}

.tag__card .tag__item p {
     display: inline-block;
     border: 1px solid var(--color-gray);
     padding: 4px 8px;
     border-radius: 6px;
     transition: all .5s;
     font-size: 13px;
}

.tag__card .tag__item p:hover {
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
}

.tag__card .tag__item p:hover a {
     color: var(--color-white);
}

.tag__card .tag__item p a {
     color: var(--color-dark-gray);
}

.category__popular-cards {
     display: flex;
     gap: 30px;
     width: 100%;
}

.category__popular-item {
     width: 100%;
}

.catagory__popular-card-img:hover img {
     transition: all 0.3s ease-in-out;
     opacity: 0.6;
}

.catagory__popular-card-img:hover a i {
     display: block;
}

.catagory__popular-card-img:hover a i:hover {
     background-color: var(--color-ee4c7d);
     transition: all 0.3s ease-in-out;
}

.catagory__popular-card-img a i {
     display: none;
     position: absolute;
     top: 50%;
     left: 50%;
     color: var(--color-black);
     transform: translate(-50%, -50%);
     color: var(--color-gray2);
     font-size: 20px;
     padding: 10px;
     background-color: var(--color-black);
     border-radius: 50%;
     z-index: 1;
}

.catagory__popular-card-img img {
     width: 100%;
     height: 100%;
     object-fit: inherit;
}

.catagory__popular-card-img {
     width: 30%;
     height: 200px;
}

.catagory__popular-card .catagory__popular-card-info {
     width: 80%;
}

.catagory__popular-card .catagory__popular-card-info p a {
     color: var(--color-black);
     text-decoration: none;
     font-weight: 400;
     line-height: 26px;
     color: var(--color-black);
     font-size: 20px;
     overflow: hidden;
     text-overflow: ellipsis;
     transition: all 0.3s ease-in-out;
     border-left: 3px solid var(--color-ee4c7d);
     display: inline-block;
     padding-left: 10px;
}

.catagory__popular-card .catagory__popular-card-info p a:hover {
     color: var(--color-ee4c7d);
}

.catagory__popular-card .catagory__popular-card-info .catagory__popular-card-info-last {
     font-size: 15px;
     color: #737373;
     font-weight: 300;
     text-overflow: ellipsis;
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 4;
     -webkit-box-orient: vertical;
     height: 94px;
}

/* CATAGORY PAGE END */

/* CATAGORY- DETAILS PAGE START */
.catagory__content.flexDirection {
     flex-direction: row-reverse;
}

.catagory__side-content {
     width: 65%;
}

.catagory__side-content .catagory__side-btn {
     cursor: pointer;
     padding: 5px 0;
}

.catagory__side-content .catagory__side-btn a {
     text-decoration: none;
     background: var(--color-ee4c7d);
     padding: 5px 15px;
     border-radius: 7px;
     color: var(--color-white);
     transition: all 0.3s ease-in-out;
}

.catagory__side-content .catagory__side-btn a:hover {
     background: var(--color-FFC466);
}

.catagory__side-title h1 {
     font-size: 30px;
     padding: 10px 0;
     line-height: 40px;
     font-weight: 400;
}

.catagory__side-date {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding-bottom: 20px;
     border-bottom: 1px solid rgb(232, 231, 231);
}

.catagory__side-date .catagory__side-date-left a,
.catagory__side-date-right a {
     color: var(--color-black);
     text-decoration: none;
     font-size: 13px;
     padding: 0 5px 0 0;
     color: #808080;
     transition: all 0.3s ease-in-out;
}

.catagory__side-date .catagory__side-date-left a:hover,
.catagory__side-date-right a:hover {
     color: var(--color-ee4c7d);
}

.catagory__side-date-left,
.catagory__side-date-right {
     display: flex;
     align-items: center;
     gap: 10px;
}

.catagory__side-img {
     width: 100%;
     padding-top: 40px;
     padding-bottom: 40px;
     height: 600px;
}

.catagory__side-img img {
     border-radius: 5px;
     width: 100%;
     height: 100%;
     object-fit: inherit;
}

.catagory__side-info {
     margin-bottom: 100px;
}

.catagory__side-info p:first-child {
     padding-top: 20px;
}

.catagory__side-info p {
     color: rgb(81, 81, 81);
}

.about__admin-content {
     width: 65%;
     border: 1px solid rgb(211, 209, 209);
     display: flex;
     align-items: center;
     gap: 30px;
     padding: 20px;
     margin: 50px 0;
     border-radius: 5px;
}

.about__admin-description {
     font-size: 16px;
     font-weight: 600;
}

.about__admin-description p {
     display: flex;
     align-items: center;
     gap: 10px;
     cursor: pointer;
}

.about__admin-description p a {
     text-decoration: none;
     color: #808080;
     transition: all 0.3s ease-in-out;
}

.about__admin-description p a:hover {
     color: var(--color-ee4c7d);
}

.about__admin-description p span i {
     font-size: 16px;
}

/* Catagory DETAILS END */

/* CONTACT PAGE START */
.contact__content {
     padding-top: 50px;
     display: flex;
     justify-content: center;
     gap: 30px;
}

.contact__content .contact__info {
     width: 60%;
}

.contact__content .contact__form {
     width: 40%;
}

.contact__content .contact__info-title {
     color: var(--color-dark-gray);
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 15px;
     letter-spacing: 0;
     line-height: 1.4;
}

.contact__content .contact__info-title::before {
     display: inline-block;
     content: "";
     width: 10px;
     height: 10px;
     background-color: var(--color-ee4c7d);
     border-radius: 50%;
     margin-right: 10px;
}

.contact__content .contact__info-text {
     max-width: 600px;
     padding-bottom: 30px;
}

.contact__content .contact__info .contact__info-boxs {
     max-width: 600px;
     height: 120px;
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
     justify-content: center;
     gap: 20px;
}

.contact__content .contact__info .contact__info-boxs .contact__info-box {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 0;
     margin: 0;
}

.contact__content .contact__info .contact__info-boxs .contact__info-box span {
     width: 38px;
     height: 38px;
     border-radius: 4px;
     color: var(--color-white);
     background-color: var(--color-ee4c7d);
     margin-right: 15px;
     display: flex;
     justify-content: center;
     align-items: center;
}

.contact__content .contact__info .contact__info-boxs .contact__info-box p {
     margin-top: 5px;
     font-size: 16px;
     line-height: 1.6;
     color: var(--color-dark-gray);
}

.contact__content .contact__info .contact__info-boxs .contact__info-box a {
     font-size: 16px;
     line-height: 1.6;
     color: var(--color-dark-gray);
     text-decoration: none;
     transition: all 0.5s ease-in-out;
}

.contact__content .contact__info .contact__info-boxs .contact__info-box a:hover {
     color: var(--color-ee4c7d);
}

.contact__content .contact__form {
     background-color: var(--color-whitesmoke);
     padding: 10px;
     padding-top: 0;
}

.contact__content .contact__form form label {
     display: block;
}

.contact__content .contact__form form label input {
     border: 1px solid var(--color-gray);
     outline: none;
     width: 80%;
     box-shadow: none;
     color: var(--color-black);
     border: 1px solid var(--color-whitesmoke2);
     border-radius: 4px;
     font-size: 15px;
     padding: 10px 20px;
     margin-top: 10px;
     width: 100%;
}

.contact__content .contact__form form label textarea {
     border: 1px solid var(--color-gray);
     outline: none;
     width: 80%;
     box-shadow: none;
     color: var(--color-black);
     border: 1px solid var(--color-whitesmoke2);
     border-radius: 4px;
     font-size: 15px;
     padding: 10px 20px;
     margin-top: 10px;
     width: 100%;
}

.contact__content .contact__form form button {
     border: none;
     outline: none;
     padding: 12px 20px;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
     border-radius: 5px;
     margin-top: 10px;
     font-size: 15px;
}

.map {
     margin: 50px 0;
}

.map .map__content iframe {
     width: 100%;
}

.user--name {
     margin-bottom: 0;
     color: var(--color-ee4c7d);
     cursor: pointer;
     user-select: none;
}

.user--name i,
.user-dropdown a i {
     margin-right: 7px;
}

.user-name-dropdown {
     position: relative;
}

.user-dropdown {
     position: absolute;
     padding: 20px;
     background-color: var(--color-white);
     width: 100%;
     border-top: 2px solid var(--color-ee4c7d);
     top: 52px;
     box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .08);
     display: none;

}

.drop-active {
     display: block;
}

.user-dropdown a {
     color: #121213;
     display: flex;
     align-items: center;
     font-size: 18px;
     transition: .3s;
}

.user-dropdown a:hover {
     color: var(--color-ee4c7d);
}

.message--section {
     padding: 50px 0;
}

.message--section .message-section--content {
     padding: 30px;
     color: white;
     border-radius: 10px;
}

.marathon-card {
     height: 100% !important;
}

.marathon-card img {
     height: 250px;
}

.marathon-card--btn {
     background-color: var(--color-ee4c7d) !important;
     color: white !important;
}

.marathon-card--btn:hover {
     background-color: var(--color-FFC466) !important;
}

.marathon-detail-description--left {
     color: #545e69;
     border: 1px solid #d1d7dc;
     padding: 30px;
}

.marathon-detail-description--left li {
     margin-bottom: 10px;
}

.marathon-detail-description--right {
     box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .08);
     background-color: var(--color-white);
     position: sticky;
     top: 120px;
     border: 1px solid #d1d7dc;

}

.marathon-detail-description-right--content {
     padding: 30px 15px;
}

.login--page {
     width: 100%;
     height: 100vh;
     background-color: #FAFAFA;
     background-image: url('../images/login-bg.svg');
     background-repeat: no-repeat;
     background-size: 550px;
     background-position: center;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     gap: 30px;
}

.register--page {
     /* height: auto;
     padding: 30px 0; */
}

.register--page .login-logo {
     position: static;
}


.login-logo {
     width: 160px;
     height: 160px;
     margin: auto;
     border-radius: 100%;
     padding: 10px;
     position: absolute;
     left: 0;
     right: 0;
     top: 10px;
}

.login-page--form {
     width: 360px;
     margin: auto;
     padding: 35px 30px;
     background-color: var(--color-white);
     border-radius: 10px;
     gap: 25px;
     box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16);
}

.login-page-form--head {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 10px
}

.login-page--form>p {
     font-size: 14px;
}

.login-page--form label {
     font-size: 16px;
     font-weight: 400;
     color: #666;
}

.login--page input {
     padding: 9px 20px;
     border-radius: 12px;
     border-radius: 6px;
     background-color: #F7F7F7;
     border: 1px solid #F7F7F7;
     outline: none;
     color: #666;
     margin-bottom: 15px;
}

.login--page input:focus {
     border-color: var(--color-ee4c7d);
}

.login--page button {
     border: none;
     padding: 6px 28px;
     border-radius: 6px;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
     transition: .5s;
     box-shadow: 0 0 0 rgba(80, 182, 255, 0.31);
     width: 100%;
     font-size: 14px;
}

.button-and-forgot {
     gap: 15px;
     margin-top: 25px;
     flex-wrap: wrap;
}

.button-and-forgot>a {
     color: black !important;
     font-weight: 300;
     font-size: 14px;
}

.button-and-forgot>a:hover {
     text-decoration: underline !important;
}


.login--page button a {
     color: var(--color-white) !important;
}

.login--page button:hover {
     background-color: var(--color-FFC466);
}

.login-page--form>a {
     font-size: 14px;
     font-weight: 500;
     color: black !important;
     transition: .3s;
     display: inline-block;
     text-align: center;
     margin-top: 25px;
     padding-bottom: 3px;
     border-bottom: 2px solid rgba(222, 222, 222, 0.7);
}

.login-page--form>a:hover {
     border-color: var(--color-ee4c7d);
}

.reset-password-page .button-and-forgot {
     margin-top: 0;
}

.reset-password-page .button-and-forgot button {
     width: 100%;
}



.hidden {
     display: none;
}

.sticky-button {
     position: fixed;
     background-color: #25D366;
     bottom: 40px;
     right: 20px;
     border-radius: 50px;
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
     z-index: 20;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
     width: 70px;
     height: 70px;
     -webkit-transition: all 0.2s ease-out;
     transition: all 0.2s ease-out;
}

.sticky-button svg {
     margin: auto;
     fill: #fff;
     width: 35px;
     height: 35px;
}

.sticky-button a,
.sticky-button label {
     cursor: pointer;
     display: flex;
     align-items: center;
     width: 55px;
     height: 55px;
     -webkit-transition: all .3s ease-out;
     transition: all .3s ease-out;
}

.sticky-button label svg.close-icon {
     display: none;
}

.sticky-chat {
     position: fixed;
     bottom: 50px;
     right: 20px;
     width: 320px;
     -webkit-transition: all .3s ease-out;
     transition: all .3s ease-out;
     z-index: 21;
     opacity: 0;
     visibility: hidden;
}

.sticky-chat a {
     text-decoration: none;
     font-family: 'Roboto', sans-serif;
     color: #505050;

}

.sticky-chat svg {
     width: 35px;
     height: 35px;
}

.sticky-chat .chat-content {
     border-radius: 10px;
     background-color: #fff;
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .25);
     overflow: hidden;
     font-family: 'Roboto', sans-serif;
     font-weight: 400;
}

.sticky-chat .chat-header {
     position: relative;
     display: flex;
     align-items: center;
     padding: 15px 20px;
     background-color: #25D366;
     overflow: hidden;
}

.sticky-chat .chat-header:after {
     content: '';
     display: block;
     position: absolute;
     bottom: 0;
     right: 0;
     width: 80px;
     height: 75px;
     background: rgba(0, 0, 0, .040);
     border-radius: 70px 0 5px 0;
}

.sticky-chat .chat-header svg {
     width: 35px;
     height: 35px;
     flex: 0 0 auto;
     fill: #fff;
}

.sticky-chat .chat-header .title {
     padding-left: 15px;
     font-size: 14px;
     font-weight: 600;
     font-family: 'Roboto', sans-serif;
     color: #fff;
}

.sticky-chat .chat-header .title span {
     font-size: 11px;
     font-weight: 400;
     display: block;
     line-height: 1.58em;
     margin: 0;
     color: #f4f4f4;
}

.sticky-chat .chat-text {
     display: flex;
     flex-wrap: wrap;
     margin: 30px 20px;
     font-size: 12px;
}

.sticky-chat .chat-text span {
     display: inline-block;
     margin-right: auto;
     padding: 10px;
     background-color: #f0f5fb;
     border-radius: 0px 15px 15px;
}

.sticky-chat .chat-text span:after {
     content: 'indicə';
     display: inline-block;
     margin-left: 10px;
     font-size: 9px;
     color: #989b9f;
}

.sticky-chat .chat-text span.typing {
     margin: 15px 0 0 auto;
     padding: 10px;
     border-radius: 15px 0px 15px 15px;
}

.sticky-chat .chat-text span.typing:after {
     display: none;
}

.sticky-chat .chat-text span.typing svg {
     height: 13px;
     fill: #505050;
}

.sticky-chat .chat-button {
     display: flex;
     align-items: center;
     margin-top: 15px;
     padding: 12px 20px;
     border-radius: 10px;
     background-color: #fff;
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .25);
     overflow: hidden;
     font-size: 12px;
     font-family: 'Roboto', sans-serif;
     font-weight: 400;
}

.sticky-chat .chat-button svg {
     width: 20px;
     height: 20px;
     fill: #505050;
     margin-left: auto;
     transform: rotate(40deg);
     -webkit-transform: rotate(40deg);
}

.chat-menu:checked+.sticky-button label {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
}

.chat-menu:checked+.sticky-button label svg.chat-icon {
     display: none;
}

.chat-menu:checked+.sticky-button label svg.close-icon {
     display: table-cell;
}

.chat-menu:checked+.sticky-button+.sticky-chat {
     bottom: 120px;
     opacity: 1;
     visibility: visible;
}

/* Pagination */
.pagination {
     display: flex;
     justify-content: center;
     align-items: center;
     padding-bottom: 50px;
}

.pagination li a {
     color: var(--color-ee4c7d);
}

.pagination li:hover a {
     color: var(--color-ee4c7d);
}

.pagination .page-item.active {
     background-color: var(--color-ee4c7d) !important;
     color: var(--color-white);
     border: none;
}

.pagination li .page-link:hover {
     border: none;
     box-shadow: none;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
}

.our-team.row .our-tean--card {
     margin: 0;
     height: 100%;
}

.contact-iframe iframe {
     width: 600px;
     height: 250px;
}

.button-main {
     border: none;
     padding: 9px 28px;
     border-radius: 6px;
     background-color: var(--color-ee4c7d);
     color: var(--color-white);
     transition: .5s;
     box-shadow: 0 0 0 rgba(80, 182, 255, 0.31);
     width: auto;
     font-size: 14px;
}

.button-main:hover {
     color: var(--color-white);
}


.pb-150 {
     padding-bottom: 150px;
}


.mobile_other_news_block {
     display: none;
}

.mobile_tag_block {
     display: none;
}

p.ql-align-justify{
     text-align: justify !important;
}