/* fonts starts*/
/* fonts starts */
@font-face {
    font-family: "SpaceGrotesk-Bold";
    src: url("fonts/SpaceGrotesk/SpaceGrotesk-Bold.ttf");
}

@font-face {
    font-family: "SpaceGrotesk-Light";
    src: url("fonts/SpaceGrotesk/SpaceGrotesk-Light.ttf");
}

@font-face {
    font-family: "SpaceGrotesk-Medium";
    src: url("fonts/SpaceGrotesk/SpaceGrotesk-Medium.ttf");
}

@font-face {
    font-family: "SpaceGrotesk-Regular";
    src: url("fonts/SpaceGrotesk/SpaceGrotesk-Regular.ttf");
}

@font-face {
    font-family: "SpaceGrotesk-SemiBold";
    src: url("fonts/SpaceGrotesk/SpaceGrotesk-SemiBold.ttf");
}

body {
    background-color: #F9FAFB;
}

.container {
    max-width: 1216px;
}

::-webkit-input-placeholder {
    color: #9EA5AD;
}

::-moz-placeholder {
    color: #9EA5AD;
}

:-ms-input-placeholder {
    color: #9EA5AD;
}

:-moz-placeholder {
    color: #9EA5AD;
}

.footer {
    border-top: 2px solid #EAECF0;
    padding-top: 24px;
    background-color: #fff;
}

.copyright span,
.footer-terms {
    margin-left: 8px;
    color: #667085;
    font: 14px "SpaceGrotesk-Regular";
    text-decoration: none;
}

.footer a {
    transition: all 0.4s ease;
}

.footer a:hover {
    color: #00BD69;
}

.footer-bottom {
    border-top: 1px solid #EAECF0;
    padding: 8px 0;
}

.footer-text {
    margin-top: 16px;
    font: 14px "SpaceGrotesk-Regular";
    color: #344054;
    line-height: 20px;
}

.footer-socials {
    margin-top: 54px;
}

.footer-socials li {
    margin-right: 40px;
    transition: all 0.4s ease;
}

.footer-p {
    color: #344054;
    font: 20px "SpaceGrotesk-Medium";
    line-height: 30px;
}

.footer-menu li {
    margin-bottom: 24px;
}

.footer-menu {
    display: flex;
    /* Применяем Flexbox */
    justify-content: start;
    /* Выравниваем элементы по началу контейнера */
    flex-wrap: wrap;
    /* Позволяет элементам обтекать, если они не умещаются */
    padding-left: 0;
    /* Убираем отступ слева, если он есть из-за стилей list-unstyled */
}

.footer-menu li {
    margin-right: 80px;
    /* Добавляем отступ справа для каждого элемента, кроме последнего */
    margin-bottom: 0;
    /* Убираем нижний отступ, если он был */
}

.footer-menu li:last-child {
    margin-right: 0;
    /* Убираем отступ справа у последнего элемента */
}

.footer-menu li a {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    text-decoration: none;
}

.footer-menu li a:hover {
    color: #00BD69;
}

.footer-items .col-md-3:last-child ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.footer-items .col-md-3:last-child {
    width: 32%;
}

.footer-items .col-md-3:first-child .footer-item {
    padding-right: 24px;
}

.footer-items .col-md-3:first-child {
    width: 24%;
}

.footer-items .col-md-3:nth-child(2),
.footer-items .col-md-3:nth-child(3) {
    width: 22%;
}

.header {
    background-color: #fff;
    border-bottom: 2px solid #EAECF0;
}

.header-top {
    padding-top: 22px;
    padding-bottom: 22px;
}

.login-btn {
    height: 52px;
    border-radius: 8px;
    background-color: #00BD69;
    padding-left: 22px;
    padding-right: 22px;
    color: #fff;
    font: 16px "SpaceGrotesk-SemiBold";
    border: none;
    transition: all 0.4s ease;
}

.login-btn span {
    margin-left: 8px;
}

.login-btn:hover {
    background-color: #007E5E;
}

.lang-dropdown .dropdown-toggle::after {
    display: none;
}

.lang-dropdown .dropdown-toggle:focus {
    box-shadow: none;
}

.lang-dropdown .dropdown-menu {
    min-width: 60px;
    left: -16px !important;
    border-color: #EAECF0;
}

.lang-dropdown .dropdown-item.active,
.lang-dropdown .dropdown-item:active {
    background-color: #EAECF0;
    color: #00BD69;
}

.lang-dropdown .dropdown-toggle,
.lang-dropdown .dropdown-toggle:hover {
    color: #344054;
    font: 18px "SpaceGrotesk-Medium";
}

.max-471 {
    max-width: 471px;
}

.header-search input {
    height: 44px;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1215686275);
    box-shadow: 0px 2px 5px 0px rgba(103, 110, 118, 0.0784313725);
    color: #9EA5AD;
    font: 16px "SpaceGrotesk-Regular";
    padding-left: 42px;
    padding-right: 14px;
    transition: all 0.4s ease;
}

.header-search input:focus {
    box-shadow: none;
    border-color: #00BD69;
}

.header-search .search-icon {
    width: 20px;
    height: 20px;
    top: 12px;
    left: 14px;
}

.header-bottom-list li {
    padding: 12px 24px;
}

.header-bottom-list li a {
    text-decoration: none;
    color: #344054;
    font: 16px "SpaceGrotesk-Medium";
    transition: all 0.4s ease;
}

.header-bottom-list li a:hover {
    color: #00BD69;
}

.header-bottom-list li.active a {
    color: #00BD69;
}

@keyframes slide-down {
    0% {
        opacity: 0.6;
        transform: translateY(-100%);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fixed-header {
    background-color: #fff;
    top: 0;
    left: 0;
    right: 0;
    position: fixed;
    margin: auto;
    width: 100%;
    animation: slide-down 0.7s;
    opacity: 1;
    z-index: 999;
}

.custom-breadcrumb {
    margin-top: 24px;
    margin-bottom: 24px;
}

.custom-breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    display: none;
}

.custom-breadcrumb li {
    font: 14px "SpaceGrotesk-Regular";
    color: #00BD69 !important;
}

.custom-breadcrumb li a {
    color: #98A2B3;
    text-decoration: none;
    font: 14px "SpaceGrotesk-Regular";
}

.custom-breadcrumb li a img {
    margin-right: 16px;
}

.custom-breadcrumb li svg {
    margin-left: 16px;
    margin-right: 16px;
}

.custom-breadcrumb li svg path {
    stroke: #98A2B3;
}

.custom-breadcrumb .breadcrumb-item+.breadcrumb-item {
    padding-left: 0;
}

.custom-breadcrumb .breadcrumb-item:first-child svg {
    display: none;
}

.custom-breadcrumb .breadcrumb-item:last-child svg path {
    stroke: #00BD69;
}

.section-cover {
    background-color: #F9FAFB;
    border-radius: 16px;
    padding: 48px;
    margin-bottom: 80px;
}

.h1,
.h2 {
    color: #00BD69;
    font: 30px "SpaceGrotesk-Medium";
    margin-bottom: 12px;
}

.sub-title {
    max-width: 421px;
    margin: auto;
}

.content-text,
.sub-title {
    color: #475467;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
}

.content-text {
    margin-top: 48px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.mt-48 {
    margin-top: 48px;
}

.important-link {
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0px 0px 2px 0px rgba(16, 24, 40, 0.16);
    padding: 18px 24px;
    margin-bottom: 32px;
    transition: all 0.4s ease;
}

.important-link:hover {
    box-shadow: 0px 0px 2px 0px #00BD69;
}

.plr-16 {
    padding-left: 16px;
    padding-right: 16px;
}

.mlr-16 {
    margin-left: -16px;
    margin-right: -16px;
}

.important-link img {
    width: 77px;
    -o-object-fit: contain;
    object-fit: contain;
}

.imp-link {
    padding-left: 24px;
}

.imp-link p {
    color: #344054;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
    margin-bottom: 4px;
}

.imp-link small {
    color: #98A2B3;
    font: 14px "SpaceGrotesk-Medium";
}

.sub-title a {
    color: #00BD69;
    font: 18px "SpaceGrotesk-Medium";
    text-decoration: underline;
}

.section-banner {
    height: 358px;
    overflow: hidden;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
}

.section-banner-img,
.gallery-image img,
.news-img img,
.news-img img .federation-img img,
.compatation-img img,
.home-slider-item img,
.drop-zone>img {
    width: 100%;
    height: 100%;
    /*  -o-object-fit: cover;
  object-fit: cover;*/
}

.section-banner-layer {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    /* background: linear-gradient(90deg, #0F3D28 0%, rgba(15, 61, 40, 0) 100%); */
    padding: 32px;
}

.banner-info {
    color: #fff;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
    max-width: 421px;
}

.form-element input {
    height: 44px;
}

.form-element input,
.form-element textarea {
    border-radius: 8px;
    background-color: #fff;
    padding: 10px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border: 0;
    margin-bottom: 24px;
    font: 16px "SpaceGrotesk-Regular";
}

.form-element input:focus,
.form-element textarea:focus {
    box-shadow: 0px 1px 1px 0px rgba(0, 189, 104, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
}

.form-element textarea {
    resize: none;
    height: 132px;
    overflow: auto;
}

.phone-number input {
    padding-left: 79px;
}

.phone-number .phone-select {
    width: 56px;
}

.phone-number .phone-select svg {
    position: absolute;
    right: -12px;
    top: 12px;
}

.phone-number select {
    color: #676E76;
    font: 16px "SpaceGrotesk-Regular";
    border: 0;
    background-color: transparent;
    position: absolute;
    top: 11px;
    left: 12px;
    width: 56px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.phone-number select:focus {
    outline: none;
}

.contact-btn {
    border-radius: 8px;
    background: #00BD69;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    width: 100%;
    max-width: 384px;
    padding: 14px 22px;
    margin: 8px auto 0 auto;
    border: 0;
    color: #fff;
    font: 16px "SpaceGrotesk-SemiBold";
    transition: all 0.4s ease;
}

.contact-btn img {
    margin-left: 10px;
}

.contact-btn:hover {
    background-color: #007E5E;
}

/* faq style */
.faq-cover {
    margin-top: 48px;
    max-width: 816px;
    margin: 48px auto 0 auto;
}

.faq-cover .accordion-item {
    padding: 32px;
    background-color: #F9FAFB;
    border-radius: 16px;
    border: 0;
}

.faq-cover .accordion-item .accordion-button {
    padding: 0;
    background-color: transparent;
    font: 18px "SpaceGrotesk-Medium";
    line-height: 28px;
    box-shadow: none;
    color: #344054;
}

.faq-cover .accordion-item .accordion-body {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    padding: 16px 0 0 0;
}

.faq-cover .accordion-item .accordion-button::after {
    width: 1rem;
    height: 1rem;
    background-size: 1rem;
}

.faq-cover .accordion-item:not(:last-child) {
    margin-bottom: 32px;
}
.faq-gap{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}

.faq-contact {
    margin-top: 24px;
    padding: 48px 76px;
    background-color: #00BD69;
    box-shadow: 0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08);
    margin-bottom: 80px;
    border-radius: 16px;
}

.faq-contact .h3 {
    color: #E6FFF4;
    max-width: 356px;
    margin-left: auto;
    margin-right: auto;
    font-size: 24px;
    line-height: 32px;
}

.faq-contact .faq-contact-info {
    margin: auto;
    color: #B8F2D8;
    font: 16px "SpaceGrotesk-Regular";
    max-width: 443px;
}

.faq-contact .faq-link {
    padding: 14px 22px;
    background: #004C2A;
    color: #fff;
    border-radius: 8px;
    transition: all 0.4s ease;
    max-width: 150px;
}

.faq-contact .faq-link:hover {
    background: rgba(0, 76, 42, 0.808);
}

.faq-contact .faq-link img {
    margin-right: 10px;
}

/* gallery cover */
.gallery-cover {
    padding: 32px;
    margin-top: 24px;
}

.filter-top span {
    color: #344054;
    font: 20px "SpaceGrotesk-Medium";
    line-height: 30px;
}

.filter-btn {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    background-color: transparent;
    border: 0;
}

.filter-btn img {
    margin-left: 4px;
}

.filter-line {
    display: block;
    width: 100%;
    height: 1px;
    background-color: #EAECF0;
    margin-left: 24px;
    margin-right: 24px;
}

.mlr-24 {
    margin-left: -24px;
    margin-right: -24px;
}

.plr-24 {
    padding-left: 24px;
    padding-right: 24px;
}

.gallery-items {
    margin-top: 48px;
}

.gallery-item {
    margin-bottom: 48px;
    height: 305px;
    overflow: hidden;
    border-radius: 16px;
}

.gallery-item-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: all 0.4s ease;
}

.gallery-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 189, 105, 0) 36.8%, #00BD69 89.06%);
    padding: 16px;
    pointer-events: none;
}

.gallery-p {
    color: #fff;
    font: 18px "SpaceGrotesk-Medium";
    line-height: 28px;
    margin-bottom: 8px;
}

.gallery-span {
    margin-bottom: 8px;
}

.gallery-span,
.gallery-ul li {
    color: #E6FFF4;
    font: 14px "SpaceGrotesk-Regular";
    line-height: 20px;
}

.gallery-ul li {
    margin-right: 6px;
}

.gallery-ul li img {
    margin-right: 4px;
}

.gallery-item-img:hover {
    transform: scale(1.2);
}

.custom-pagination {
    border-top: 1px solid var(--gray-200, #EAECF0);
    padding-top: 20px;
}

.custom-pagination .page-item:first-child {
    left: 0;
}

.custom-pagination .page-item:first-child .page-link {
    width: auto;
}

.custom-pagination .page-item:first-child .page-link svg {
    margin-right: 8px;
}

.custom-pagination .page-item:last-child {
    right: 0;
}

.custom-pagination .page-item:last-child .page-link {
    width: auto;
}

.custom-pagination .page-item:last-child .page-link svg {
    margin-left: 8px;
}

.custom-pagination .page-item.active .page-link {
    color: #00BD69;
    background-color: #E6FFF4;
}

.custom-pagination .page-link {
    color: #667085;
    font: 14px "SpaceGrotesk-Medium";
    line-height: 20px;
    margin: 1px;
    border-radius: 8px;
    background-color: #fff;
    transition: all 0.4s ease;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 0;
    margin: 8px;
}

.mobile-none {
    display: none
}

.gallery-p,
.gallery-span {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.gallery-content {
    width: 100%;
}

.gallery-image {
    height: 236px;
    overflow: hidden;
}

.gallery-image {
    margin-bottom: 48px;
    border-radius: 16px;
}

.news-items {
    padding-top: 48px;
}

.news-item {
    margin-bottom: 48px;
}

.news-img {
    height: 189px;
    overflow: hidden;
    border-radius: 16px;
}

.news-desc {
    padding: 16px 8px;
}

.news-h4 {
    color: #344054;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
    margin-bottom: 8px;
}

.news-p {
    color: #98A2B3;
    font: 14px "SpaceGrotesk-Regular";
    line-height: 20px;
}

.news-item a:hover .news-h4,
.news-item a:hover .news-p,
.compatation-all:hover,
.forget-password-btn:hover {
    color: #00BD69;
    transition: all 0.4s ease;
}

.news-cover {
    padding: 48px;
}

.news-h3 {
    color: #00BD69;
    font: 30px "SpaceGrotesk-Medium";
    line-height: 38px;
    margin-bottom: 12px;
}

.news-single .gallery-ul li {
    color: #344054;
}

.news-text {
    padding-top: 48px;
    color: #475467;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
}

.news-h5 {
    color: #344054;
    font: 24px "SpaceGrotesk-Medium";
    line-height: 32px;
}

.filter-reset,
.filter-items {
    display: none;
}

.filter-submit {
    background: #000;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    padding: 13px 20px;
    color: #fff;
    border: 0;
    font: 14px "SpaceGrotesk-SemiBold";
    margin-top: 28px;
    border-radius: 8px;
    transition: all 0.4s ease;
}

.filter-submit:hover {
    background: rgba(0, 0, 0, 0.865);
}

.filter-submit svg {
    margin-left: 8px;
}

.filter-items {
    margin-top: 16px;
}

.filter-form-item {
    width: 100%;
    margin-right: 24px;
}

.filter-form-item label {
    color: #344054;
    font: 14px "SpaceGrotesk-Medium";
    line-height: 20px;
    margin-bottom: 8px;
}

.filter-form-item .bootstrap-select {
    width: 100% !important;
    max-width: 450px;
}

.filter-form-item .bootstrap-select .dropdown-menu {
    top: 12px !important;
    background-color: #fff;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border: 0;
}

.filter-form-item .bootstrap-select .dropdown-menu span.check-mark {
    display: inline-block !important;
    position: absolute;
    left: 8px;
    top: 11px !important;
    width: 20px;
    height: 20px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border-radius: 4px;
    background: #fff;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item .bs-ok-default:after {
    display: none;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item.selected .bs-ok-default:after {
    display: block;
    border-color: #fff;
    margin-left: 8px;
    margin-top: 3px;
    border-width: 0 0.2em 0.2em 0;
    width: 0.4em;
    height: 0.8em;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item.selected span.check-mark {
    background: #000;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item {
    padding: 12px;
    color: #383F45;
    font: 14px "SpaceGrotesk-Regular";
    transition: all 0.4s ease;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item:hover {
    color: #00BD69;
    background-color: transparent;
}

.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item.active,
.filter-form-item .bootstrap-select .dropdown-menu .dropdown-item:active {
    background-color: transparent;
    color: #00BD69;
}

.filter-form-item .bootstrap-select .dropdown-menu .text {
    padding-left: 24px;
}

.filter-form-item .bootstrap-select .bs-searchbox input {
    color: #383F45;
    font: 16px "SpaceGrotesk-Regular";
    height: 44px;
    padding: 12px 14px;
}

.filter-form-item .bootstrap-select .bs-searchbox input:focus {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border: 0;
}

.filter-form-item .bootstrap-select .bs-searchbox input::-webkit-input-placeholder {
    color: #98A2B3;
}

.filter-form-item .bootstrap-select .bs-searchbox input::-moz-placeholder {
    color: #98A2B3;
}

.filter-form-item .bootstrap-select .bs-searchbox input:-ms-input-placeholder {
    color: #98A2B3;
}

.filter-form-item .bootstrap-select .bs-searchbox input:-moz-placeholder {
    color: #98A2B3;
}

.filter-form-item .bootstrap-select>.dropdown-toggle {
    background-color: #fff;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border: 0;
    border-radius: 8px;
    padding: 10px 14px;
}

.filter-form-item .bootstrap-select>.dropdown-toggle:focus {
    outline: none !important;
}

.filter-form-item .bootstrap-select>.dropdown-toggle .filter-option-inner-inner {
    color: #98A2B3;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.filter-form-item .bootstrap-select>.dropdown-toggle .filter-option-inner-inner {
    color: #344054;
    padding-right: 36px;
}

.filter-form-item .filter-select-icon {
    position: absolute;
    right: 14px;
    top: 12px;
}

.filter-form-item .bootstrap-select>.dropdown-toggle:after {
    display: none;
}

.filter-form-item .bootstrap-select>.dropdown-toggle .filter-option-inner-inner {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.date-times {
    height: 44px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    padding: 10px 14px;
    border: 0;
    color: #101828;
    font: 14px "SpaceGrotesk-Regular";
    border-radius: 8px;
}

.date-times:focus {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
}

.date-icon {
    position: absolute;
    top: 12px;
    right: 14px;
}

.filter-form-item .daterangepicker:after {
    display: none;
}

.daterangepicker.opensright:after,
.daterangepicker.opensright:before {
    display: none;
}

.daterangepicker {
    margin-top: 12px !important;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    border: 0 !important;
    z-index: 1;
}

.daterangepicker .ranges,
.daterangepicker .range_inputs {
    display: none !important;
}

.daterangepicker th.month {
    color: #101828;
    font: 14px "SpaceGrotesk-Regular";
}

.daterangepicker .calendar-table th,
.daterangepicker .cancelBtn {
    font: 12px "SpaceGrotesk-Medium";
    color: #667085;
}

.daterangepicker .calendar-table td,
.daterangepicker .drp-selected {
    color: #101828;
    font: 14px "SpaceGrotesk-Regular";
}

.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker .applyBtn {
    background-color: #00BD69 !important;
}

.daterangepicker .applyBtn {
    border-color: #00BD69 !important;
}

.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td {
    width: 36px !important;
    height: 36px !important;
}

.news-h4,
.news-p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.compatations-cover .special-choose .bootstrap-select .dropdown-menu span.check-mark {
    border-radius: 50%;
}

.filter-form-item .bootstrap-select .dropdown-menu {
    z-index: 1;
}

.news-badge {
    background: #00BD69;
    padding: 4px 16px;
    color: #fff;
    font: 14px "SpaceGrotesk-Regular";
    position: absolute;
    top: 8px;
    right: 8px;
    border-radius: 8px;
}

.past-news-badge {
    background: #fff;
    padding: 4px 16px;
    color: #000;
    font: 14px "SpaceGrotesk-Regular";
    position: absolute;
    top: 8px;
    right: 8px;
    border-radius: 8px;
}

.compt-info .news-h4 {
    font-family: "SpaceGrotesk-Medium";
    -webkit-line-clamp: 1;
    line-clamp: 1;
}

.compt-info .gallery-span,
.compt-info .gallery-ul li {
    color: #667085;
}

.federation-h2 {
    color: #fff;
    font: 30px "SpaceGrotesk-Medium";
    line-height: 38px;
    max-width: 460px;
    margin-left: 32px;
}

.federation-img {
    width: 144px;
    height: 144px;
    border-radius: 50%;
    overflow: hidden;
}

.federation-layer {
    padding-left: 64px;
    padding-bottom: 32px;
}

.compatation-img {
    height: 560px;
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 40px;
}

.compt-item {
    padding: 32px;
}

.compt-h1 {
    color: #344054;
    font: 30px "SpaceGrotesk-Medium";
    line-height: 38px;
    margin-bottom: 12px;
}

.compt-profil a {
    color: #344054;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
    transition: all 0.4s ease;
}

.compt-profil a:hover {
    color: #00BD69;
}

.compt-profil img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    -o-object-fit: cover;
    object-fit: cover;
    border: 1px solid #EAECF0;
    margin-right: 8px;
}

.compt-p {
    margin-top: 12px;
    font: 12px "SpaceGrotesk-Regular";
    color: #667085;
}

.compt-p img {
    margin-right: 4px;
}

.compatation-inner .section-cover {
    padding: 0;
}

.compt-about {
    margin-top: 48px;
}

.compt-about .compt-about-text {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.compt-about p,
.compt-regp {
    color: #344054;
    font: 16px "SpaceGrotesk-Medium";
}

.map-content {
    height: 240px;
    overflow: hidden;
    border-radius: 16px;
}

.map {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}

.open-map {
    background-color: #F2F4F7;
    border-radius: 16px;
    padding: 24px;
}

.open-map span {
    color: #344054;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
    margin-bottom: 19px;
}

.open-map a {
    margin-top: 16px;
    color: #344054;
    font: 20px "SpaceGrotesk-Regular";
    border-radius: 8px;
    padding: 10px 14px;
    line-height: 30px;
}

.open-map a small {
    font-family: "SpaceGrotesk-Medium";
}

.google-map {
    background-color: #fff;
}

.waze-open {
    background: #31CCFD;
}

.map-left {
    margin-right: 32px;
    width: calc(100% - 166px);
}

.compt-regprice p {
    color: #00BD69;
    font: 24px "SpaceGrotesk-Medium";
    line-height: 32px;
}

.reg-button {
    background-color: #00BD69;
    border-radius: 12px;
    padding: 14px 24px;
    color: #fff;
    font: 16px "SpaceGrotesk-SemiBold";
    transition: all 0.4s ease;
}

.reg-button:hover {
    background-color: #004C2A;
    color: #fff;
}

.reg-button svg {
    margin-left: 12px;
}

.lh-24 {
    line-height: 24px;
}

.mt-40 {
    margin-top: 40px;
}

.reg-social li {
    margin-right: 24px;
}

.reg-contacts li {
    margin-bottom: 24px;
}

.reg-contacts li a {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.reg-contacts li a img:first-child {
    margin-right: 4px;
}

.reg-contacts li a img:nth-child(2) {
    margin-left: 8px;
}

.reg-contacts li a {
    transition: all 0.4s ease;
}

.reg-contacts li a:hover {
    color: #00BD69;
}

.compt-slider-h5 {
    color: #344054;
    font: 24px "SpaceGrotesk-Medium";
    line-height: 32px;
    margin-bottom: 32px;
}

.compt-carousel-item .gallery-ul li img {
    width: auto;
}

.compt-carousel .owl-dots .owl-dot span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #CFF8E6;
    margin: 4px;
}

.compt-carousel .owl-dots .owl-dot.active span,
.compt-carousel .owl-dots .owl-dot:hover span {
    background: #00BD69;
}

.compatation-inner {
    padding-bottom: 80px;
}

.arrow-left-slider,
.arrow-right-slider {
    width: 32px;
    height: 32px;
    padding: 4px;
    border-radius: 50%;
    background-color: #F2F4F7;
    border: 0;
    margin: 16px 8px 0 8px;
}

/* starts home page */
.home-slider-item {
    height: 564px;
    overflow: hidden;
    border-radius: 16px;
}

.home-slider-item img {
    -o-object-position: left;
    object-position: left;
}

.home-slider {
    filter: drop-shadow(0px 4px 6px rgba(16, 24, 40, 0.03)) drop-shadow(0px 12px 16px rgba(16, 24, 40, 0.08));
    margin-bottom: 40px;
}

.home-slider-prev,
.home-slider-next {
    position: absolute;
    top: calc(50% - 48px);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #00BD69;
    z-index: 1;
    border: 0;
}

.home-slider-prev {
    left: 24px;
}

.home-slider-next {
    right: 24px;
}

.home-slider .owl-dots {
    position: absolute;
    bottom: 16px;
    left: 0;
    right: 0;
    margin: auto;
    background-color: #00BD69;
    border-radius: 16px;
    width: 100px;
    padding-top: 4px;
    line-height: 20px;
}

.home-slider .owl-dots .owl-dot span {
    width: 8px;
    height: 8px;
    background-color: #CFF8E6;
}

.home-slider .owl-dots .owl-dot.active span,
.home-slider .owl-dots .owl-dot:hover span {
    background-color: #004C2A;
}

.home-owl-carousels {
    padding-top: 40px;
    padding-bottom: 40px;
}

.compatation-all {
    color: #667085;
    font: 14px "SpaceGrotesk-Regular";
    line-height: 20px;
}

.mb-36 {
    margin-bottom: 36px;
}

.row-fed {
    margin-left: -12px;
    margin-right: -12px;
}

.col-fed {
    padding-left: 12px;
    padding-right: 12px;
    width: 20%;
    max-width: 20%;
}

.federation-item {
    margin-bottom: 24px;
}

.federation-item a {
    text-decoration: none;
}

.federation-item img {
    width: 144px;
    height: 144px;
    border-radius: 50%;
}

.federation-item p {
    margin-top: 24px;
    color: #344054;
    font: 18px "SpaceGrotesk-Regular";
    line-height: 28px;
}

.mb-32 {
    margin-bottom: 32px;
}

.home-banner,
.home-main .faq-contact {
    max-width: 1008px;
    margin-left: auto;
    margin-right: auto;
}

.home-banner img {
    width: 100%;
    filter: drop-shadow(0px 4px 6px rgba(16, 24, 40, 0.03)) drop-shadow(0px 12px 16px rgba(16, 24, 40, 0.08));
    border-radius: 16px;
    /*height: 284px;*/
    -o-object-fit: cover;
    -o-object-position: left;
    object-position: left;
}

.home-form {
    max-width: 848px;
    margin: auto;
    padding-top: 48px;
}

.home-form .faq-link {
    margin-top: 0;
    border-radius: 12px;
}

.home-form-btn {
    border: 0;
    width: 100%;
}

.home-form-btn img {
    margin-right: 12px;
}

.home-form-element .bs-searchbox+.bs-actionsbox {
    margin-top: 4px;
    font: 14px "SpaceGrotesk-Medium";
    color: #383F45;
}

.home-form-element .dropdown-divider {
    border-color: #f5f5f5;
}

.home-form-element .bs-select-all {
    color: #00BD69;
}

.home-form-element .form-control {
    height: 52px;
    background-color: #B8F2D8;
    border-radius: 12px;
    border: 0;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.home-form-element .form-control:focus {
    box-shadow: none;
}

.home-form-element input[type=search] {
    background-color: #fff;
}

.home-form-element .bootstrap-select {
    width: 100% !important;
}

.home-form-element input {
    padding-left: 60px;
}

.home-form-element img {
    position: absolute;
    top: 14px;
    left: 20px;
}

.home-form-element .filter-option-inner {
    position: relative;
    top: 4px;
}

.home-form-element .dropdown-toggle {
    padding-left: 20px;
}

.home-form-element .dropdown-toggle:focus {
    outline: none !important;
}

.home-form-element .bootstrap-select>.dropdown-toggle {
    height: 52px;
    background-color: #B8F2D8;
    border-radius: 12px;
    border: 0;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    box-shadow: none;
}

.home-form-element .bootstrap-select>.dropdown-toggle:focus {
    box-shadow: none;
}

.home-form-element .bootstrap-select>.dropdown-toggle:after {
    display: none;
}

.home-form-element .filter-select-icon {
    position: absolute;
    right: 20px;
    top: 14px;
}

.home-form-element .bootstrap-select>.dropdown-toggle.bs-placeholder,
.home-form-element .bootstrap-select>.dropdown-toggle.bs-placeholder:active,
.home-form-element .bootstrap-select>.dropdown-toggle.bs-placeholder:focus,
.home-form-element .bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
    color: #00713F;
}

.home-form-element .dropdown-menu {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    background: #fff;
    border-radius: 8px;
    border: 0;
}

.home-form-element .bootstrap-select>.dropdown-menu {
    z-index: 1;
}

.home-form-element li a span.text {
    font: 16px "SpaceGrotesk-Medium";
    color: #383F45;
}

.home-form-element .dropdown-item {
    padding: 12px;
}

.home-form-element .dropdown-item:hover {
    background-color: transparent;
}

.home-form-element .dropdown-item:hover span {
    color: #00BD69;
}

.home-form-element input::-webkit-input-placeholder {
    color: #00713F;
}

.home-form-element input::-moz-placeholder {
    color: #00713F;
}

.home-form-element input:-ms-input-placeholder {
    color: #00713F;
}

.home-form-element input:-moz-placeholder {
    color: #00713F;
}

.federations-items {
    padding-top: 80px;
    padding-bottom: 48px;
}

.federations-items .federation-item {
    margin-bottom: 32px;
}

.federations-items .federation-item a p {
    transition: all 0.4s ease;
}

.federations-items .federation-item:hover a p {
    color: #00BD69;
}

.exit-btn {
    border-radius: 8px;
    background: var(--error-25, #FFFBFA);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(254, 205, 202, 0.26), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    padding: 14px 22px;
    font: 16px "SpaceGrotesk-SemiBold";
    line-height: 24px;
    border: 0;
    color: #7A271A;
    margin-left: 24px;
}

.exit-btn img {
    margin-right: 10px;
}

.exit-profil::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 40px;
    background-color: #EAECF0;
}

.profil-main {
    padding-top: 24px;
}

.profil-nav {
    padding: 16px;
    border-radius: 16px;
    background-color: #fff;
}

.profil-nav li {
    display: flex;
    align-items: center;
}

.profil-nav li a {
    color: #344054;
    font: 16px "SpaceGrotesk-Medium";
    line-height: 24px;
    text-decoration: none;
    padding: 24px;
    border-bottom: 2px solid transparent;
    display: flex;
    align-items: center;
    transition: all 0.4s ease;
}

.profil-nav li a span {
    margin-left: 8px;
}

.profil-nav li a:hover,
.profil-nav li.active a {
    color: #00BD69;
    border-color: #00BD69;
}

.profil-nav li a:hover svg path,
.profil-nav li a:hover svg circle,
.profil-nav li.active a svg path,
.profil-nav li.active a svg circle {
    stroke: #00BD69;
}

.compt-status {
    padding: 4px 12px;
    position: absolute;
    right: 8px;
    top: 8px;
    font: 14px "SpaceGrotesk-Medium";
    line-height: 20px;
    border-radius: 8px;
}

.compt-status i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 8px;
}

.compt-status-done {
    background: #ECFDF3;
    color: #027A48;
}

.compt-status-done i {
    background: #12B76A;
}

.compt-status-waiting {
    background: #FFFAEB;
    color: #B54708;
}

.compt-status-waiting i {
    background: #F79009;
}

.compt-status-rejected {
    background-color: #FEF3F2;
    color: #B42318;
}

.compt-status-rejected i {
    background: #F04438;
}

.layer-screen,
.password-layer-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

.layer-content,
.password-layer-content {
    background-color: #fff;
    width: 100%;
    max-width: 480px;
    height: 100%;
    margin-left: auto;
    padding: 58px 45px;
}

.layer-bg,
.password-layer-bg {
    content: "";
    display: block;
    width: calc(100% - 480px);
    height: 100%;
    background: rgba(0, 0, 0, 0.24);
}

.layer-cover,
.password-layer-cover {
    width: 100%;
    height: 100%;
}

.screen-close,
.screen-back,
.password-screen-close {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    background-color: transparent;
    padding: 0;
    border: 0;
}

.screen-close svg,
.screen-back svg,
.password-screen-close svg {
    margin-right: 8px;
}

.login-h4 {
    color: #00BD69;
    font: 24px "SpaceGrotesk-Medium";
    line-height: 32px;
    margin-bottom: 8px;
    margin-top: 56px;
}

.login-p {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    margin-bottom: 56px;
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
}

.login-part .form-element {
    margin-bottom: 24px;
}

.login-part .form-element input {
    border-radius: 8px;
    height: 44px;
    background-color: #fff;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    padding-left: 14px;
    padding-right: 14px;
    color: #667085;
}

.user-eye,
.forget-password-btn {
    background: transparent;
    border: 0;
    padding: 0;
}

.user-eye {
    right: 14px;
    top: 12px;
}

.user-eye img {
    width: 20px;
}

.login-submit {
    margin-top: 32px;
}

.forget-password-btn {
    margin-top: 16px;
    color: #475467;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.eye-off-btn,
.user-eye.active .eye-btn {
    display: none !important;
}

.user-eye.active .eye-off-btn,
.eye-btn {
    display: flex !important;
}

.forget-pass-item {
    margin-bottom: 24px;
}

.forget-pass-item label {
    color: #454C52;
    font: 14px "SpaceGrotesk-Medium";
    margin-bottom: 8px;
}

.forget-pass-cover {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.12), 0px 0px 0px 1px rgba(103, 110, 118, 0.16), 0px 2px 5px 0px rgba(103, 110, 118, 0.08);
    background-color: #fff;
    border-radius: 8px;
    padding: 10px 42px 10px 14px;
}

.forget-pass-cover a {
    color: #475467;
    font: 16px "SpaceGrotesk-Medium";
    line-height: 24px;
    text-decoration: none;
    transition: all 0.4s ease;
}

.forget-pass-cover a:hover {
    color: #00BD69;
}

.forget-pass-cover .pass-copy {
    position: absolute;
    right: 14px;
    top: 8px;
    background-color: transparent;
    border: 0;
    padding: 0;
}

.copy-contact {
    background-color: transparent;
    border: 0;
    padding: 0;
    margin-left: 6px;
}

.forget-password {
    display: none;
}

.layer-screen,
.password-layer-screen {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.layer-screen.active,
.password-layer-screen.active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.layer-content,
.password-layer-content {
    transition: all 0.6s ease;
    transform: translate(100%);
}

.layer-content.active,
.password-layer-content.active {
    transform: translate(0) !important;
}

.layer-bg,
.password-layer-bg {
    transition: all 2s ease;
    opacity: 0;
}

.layer-bg.active,
.password-layer-bg.active {
    opacity: 1;
}

.chg-item-title {
    color: #344054;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.chg-item-title {
    margin-bottom: 24px;
}

.chg-item-title:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 1px;
    background: #EAECF0;
    margin-left: 8px;
}

.add-h5 {
    color: #00BD69;
    font: 24px "SpaceGrotesk-Medium";
    line-height: 32px;
    margin-bottom: 8px;
}

.add-p {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

.add-form {
    max-width: 672px;
    margin: auto;
}

.drop-zone {
    border: 1px dashed #00713F;
    border-radius: 8px;
    width: 100%;
    height: 160px;
    background-color: #E6FFF4;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    overflow: hidden;
}

.add-form {
    margin-top: 48px;
}

.drop-zone-p img {
    margin-right: 8px;
}

.drop-zone-p span {
    margin-right: 8px;
    color: #00713F;
    font: 18px "SpaceGrotesk-Medium";
    line-height: 28px;
}

.add-form .form-element {
    margin-top: 32px;
}

.add-form .form-element input {
    padding-left: 14px;
}

.add-form .form-element label {
    color: #454C52;
    font: 14px "SpaceGrotesk-Medium";
    display: block;
    margin-bottom: 8px;
}

.add-form .form-element .form-control {
    margin-bottom: 0;
}

.event-input img {
    position: absolute;
    right: 14px;
    top: 13px;
    pointer-events: none;
}

.event-input input {
    padding-right: 46px;
}

.datepicker td,
.datepicker th {
    color: #101828;
    font: 14px "SpaceGrotesk-Regular";
    padding: 10px;
}

.datepicker table tr td.active.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active[disabled] {
    background-color: #00BD69;
}

.datepicker table tr td.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active:hover {
    background-color: #00BD69;
    background-image: none;
    border-color: #00BD69;
    color: #fff;
    text-shadow: none;
}

.event-hour input {
    padding-right: 12px;
}

.event-hour input::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

/* width */
textarea::-webkit-scrollbar {
    width: 8px;
}

/* Handle */
textarea::-webkit-scrollbar-thumb {
    background: #00BD69;
    border-radius: 10px;
}

#event-add-text {
    height: 80px;
}

.add-form-one,
.add-form-two {
    border-bottom: 1px dashed #D0D5DD;
    padding-bottom: 32px;
}

.form-radio [type=radio]:checked,
.form-radio [type=radio]:not(:checked) {
    position: absolute;
    left: -9999px;
}

.form-radio [type=radio]:checked+label,
.form-radio [type=radio]:not(:checked)+label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}

.form-radio [type=radio]:checked+label:before,
.form-radio [type=radio]:not(:checked)+label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #D0D5DD;
    border-radius: 100%;
    background: #fff;
}

.form-radio [type=radio]:checked+label:after,
.form-radio [type=radio]:not(:checked)+label:after {
    content: "";
    width: 10px;
    height: 10px;
    background: #00BD69;
    position: absolute;
    top: 5px;
    left: 5px;
    border-radius: 100%;
    transition: all 0.2s ease;
}

.form-radio [type=radio]:not(:checked)+label:after {
    opacity: 0;
    transform: scale(0);
}

.form-radio [type=radio]:checked+label:after {
    opacity: 1;
    transform: scale(1);
}

.form-radio {
    margin-right: 40px;
    margin-top: 8px;
}

.form-radio [type=radio]:checked+label:before {
    background-color: #E6FFF4;
    border-color: #00BD69;
}

.add-form-two input::-webkit-outer-spin-button,
.add-form-two input::-webkit-inner-spin-button,
.add-form-three input::-webkit-outer-spin-button,
.add-form-three input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.add-form-two input[type=number] {
    -moz-appearance: textfield;
    appearance: none;
    -webkit-appearance: none;
}

.ticket-link img {
    position: absolute;
    top: 12px;
    left: 14px;
}

.ticket-link #ticket-link {
    padding-left: 42px;
}

.add-form-two .filter-form-item .bootstrap-select .dropdown-menu .text {
    padding-left: 0;
}

.add-form-three .contact-btn {
    max-width: 100%;
    margin-top: 48px;
}

.event-number .special-choose {
    position: absolute;
    top: -24px;
    left: 0;
    max-width: 89px;
}

.event-number .special-choose .filter-select-icon {
    top: 5px;
}

.event-number-input {
    padding-left: 90px !important;
}

.event-number .bootstrap-select>.dropdown-toggle .filter-option-inner-inner {
    padding-right: 0;
}

.event-number .bootstrap-select>.dropdown-toggle {
    border-radius: 0;
    border: 0;
    box-shadow: none;
    padding: 0 10px;
}

.event-number .bootstrap-select .dropdown-menu .text {
    padding-left: 0;
}

.modal-backdrop.show {
    opacity: 0.24;
}

#addModal .modal-content {
    border: 1px solid #E6E8ED;
    border-radius: 16px;
    width: 96%;
    margin: auto;
}

#addModal .modal-dialog {
    max-width: 400px;
    height: calc(100vh - 3.5rem);
    margin: auto;
}

#addModal .modal-header {
    padding: 12px 16px;
    border-bottom-color: #E6E8ED;
}

#addModal .modal-title {
    color: #202739;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
}

#addModal .add-modal-close {
    border: 0;
    padding: 0;
    background-color: transparent;
}

#addModal .modal-body {
    padding: 26px 10px 2px 10px;
}

#addModal .modal-body img {
    width: 100%;
    max-width: 170px;
    -o-object-fit: contain;
    object-fit: contain;
}

#addModal .modal-footer {
    border-top-color: #D1D4DE;
    padding: 12px 16px;
}

#addModal .modal-body-text {
    padding-top: 24px;
    padding-bottom: 24px;
}

#addModal .modal-body-text h4 {
    color: #00BD69;
    font: 20px "SpaceGrotesk-Regular";
    line-height: 30px;
    margin-bottom: 10px;
}

#addModal .modal-body-text p {
    color: #667085;
    font: 16px "SpaceGrotesk-Regular";
    line-height: 24px;
    margin-bottom: 0;
}

.add-close-btn {
    width: 100%;
    background: #00BD69;
    border-radius: 8px;
    padding: 10px;
    color: #fff;
    border: 0;
    transition: all 0.4s ease;
}

.add-close-btn:hover {
    background-color: #00713F;
}

.add-close-btn span {
    margin-right: 8px;
}

.home-form-element .dropdown-item.active,
.home-form-element .dropdown-item:active {
    background-color: transparent;
}

.home-form-element .dropdown-item.active span,
.home-form-element .dropdown-item:active span {
    color: #00BD69;
}

.err-msg {
    color: red;
    font: 12px "SpaceGrotesk-Regular";
    display: block;
    margin-top: 4px;
}

.plt-20 {
    position: relative;
    top: -20px;
}

.alert-success {
    color: #00BD69;
    background-color: rgba(0, 189, 104, 0.1);
    border-color: rgba(0, 189, 104, 0.1);
}

.edit-btn {
    display: inline-flex;
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 8px;
    padding: 8px;
    text-decoration: none;
    position: absolute;
    right: 8px;
    bottom: 8px;
}

.page-404 {
    margin-top: 24px;
    margin-bottom: 80px;
}

.page-cover-404 {
    background-color: #fff;
    border-radius: 16px;
    padding: 48px;
    min-height: 60vh;
}

.page-cover-404 img {
    width: 100%;
    max-width: 532px;
    display: block;
    margin: auto;
}

.page-cover-404 p {
    color: #00BD69;
    font: 30px "SpaceGrotesk-Medium";
    line-height: 38px;
    margin-top: 48px;
    margin-bottom: 10px;
}

.page-cover-404 a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    padding: 14px 22px;
    color: #344054;
    font: 16px "SpaceGrotesk-SemiBold";
}

.page-cover-404 a svg {
    margin-right: 10px;
}

.filter-all .filter-form-item:first-child,
.filter-all .filter-form-item:nth-child(2) {
    min-width: 20%;
}

/*.filter-all .filter-form-item:nth-child(3), .filter-all .filter-form-item:nth-child(4) {
  width: 15%;
}
.filter-all .filter-submit {
  width: 20%;
}
*/

.com-price,
.com-link {
    display: none;
}

.nav-compatation-links li {
    margin-left: 10px;
    margin-right: 10px;
    margin: 0 10px 24px 10px;
}

.nav-compatation-links li a {
    text-decoration: none;
    font: 16px "SpaceGrotesk-Medium";
    line-height: 24px;
    color: #344054;
    padding-bottom: 10px;
    border-bottom: 1px solid transparent;
    transition: all 0.4s ease;
}

.nav-compatation-links li a:hover,
.nav-compatation-links li.active a {
    border-color: #00BD69;
}

.home-slide-layer {
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(376deg, #0F3D28 6%, rgba(15, 61, 40, 0) 100%);
    width: 100%;
    height: 100%;
    padding: 20px 40px 96px 48px;
    border-radius: 16px;
}

.home-slide-layer h2 {
    font: 36px "SpaceGrotesk-Regular";
    color: #fff;
}

.home-slide-layer p {
    color: #fff;
    font: 24px "SpaceGrotesk-Regular";
}

.home-slide-layer svg {
    margin-right: 8px;
}

.section-banner-layer {
    background: transparent;
}

.custom-pagination .page-link {
    background-color: transparent;
}

@media screen and (max-width:767px) {
    .home-slide-layer h2 {
        font-size: 26px;
    }

    .home-slide-layer {
        padding: 20px 40px 62px 28px;
    }

    .home-slide-layer p {
        font-size: 20px;
    }

    .section-banner {
        height: 56vw;
    }

    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 60vw;
    }
}

@media screen and (max-width:400px) {
    .compt-register {
        flex-direction: column;
        align-items: center;
    }

    .reg-button {
        width: 100%;
        margin-top: 12px;
    }
}

/* starts mobile style */
@media screen and (min-width: 1200px) {
    .desktop-none {
        display: none;
    }

    .slider-left-shadow,
    .slider-right-shadow {
        position: absolute;
        top: 0;
        height: calc(100% - 46px);
        z-index: 1;
        display: flex;
        align-items: center;
        transition: all 0.4s ease;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .slider-left-shadow {
        left: 0;
        background: linear-gradient(-270deg, rgba(249, 250, 251, 0.55) 0%, rgba(249, 250, 251, 0) 100%);
    }

    .slider-right-shadow {
        right: 0;
        background: linear-gradient(270deg, rgba(249, 250, 251, 0.55) 0%, rgba(249, 250, 251, 0) 100%);
    }

    .compt-slider:hover .slider-left-shadow,
    .compt-slider:hover .slider-right-shadow {
        opacity: 1;
        pointer-events: all;
        visibility: visible;
    }
}

@media screen and (min-width: 576px) {
    .form-cover {
        max-width: 816px;
        margin-left: auto;
        margin-right: auto;
    }
}

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

    .footer-items .col-md-3:first-child,
    .footer-items .col-md-3:nth-child(2),
    .footer-items .col-md-3:nth-child(3),
    .footer-items .col-md-3:last-child {
        width: 100%;
        text-align: center;
    }

    .footer-socials {
        justify-content: center;
    }

    .footer-items .col-md-3:last-child ul {
        display: block;
    }

    .footer-socials {
        margin-top: 16px;
        margin-bottom: 32px;
    }

    .footer-items {
        padding-bottom: 16px;
    }

    .footer-bottom {
        justify-content: center !important;
        flex-direction: column;
    }

    .copyright {
        margin-bottom: 8px;
    }

    .footer-socials li {
        margin-left: 20px;
        margin-right: 20px;
    }

    .footer-items .col-md-3:first-child .footer-item {
        padding-right: 0;
    }

    .footer {
        padding-left: 16px;
        padding-right: 16px;
    }

    .mobile-none {
        display: none;
    }

    .header {
        border-bottom: 1px solid #EAECF0;
        background-color: #fff;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
    }

    .w-24 {
        width: 24px;
    }

    .h-24 {
        height: 24px;
    }

    .mobile-menu {
        margin-left: 16px;
    }

    .header .container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .header-search-box {
        border-bottom: 1px solid #EAECF0;
        padding: 8px 16px;
        max-width: 100%;
        transition: all 0.4s ease;
        display: none;
        position: fixed;
        top: 77px;
        left: 0;
        background-color: #fff;
    }

    .header-search-box.active {
        display: block;
    }

    .mobile-search .ms-close,
    .mobile-search.active .ms-search,
    .mobile-menu .menu-x,
    .mobile-menu.active .menu-open {
        display: none;
    }

    .mobile-search.active .ms-close,
    .mobile-search .ms-search,
    .mobile-menu .menu-open,
    .mobile-menu.active .menu-x {
        display: block;
    }

    .mobile-nav-menu {
        position: fixed;
        left: 0;
        top: 0;
        z-index: 998;
        width: 100%;
        height: 100%;
        background: #fff;
        padding: 40px 30px;
    }

    .header-bottom-list {
        border: 0;
        flex-direction: column;
        margin-bottom: 24px;
    }

    .header-layer {
        height: 76px;
    }

    .header-bottom {
        position: fixed;
        left: 0;
        right: 0;
        width: 100%;
        height: 100%;
        border-top: 1px solid #EAECF0;
        padding: 28px 32px 86px 28px;
        background-color: #fff;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.4s ease;
        overflow: auto;
        background: rgba(255, 255, 255, 0.25);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }

    .header-bottom.active {
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }

    .login-btn {
        margin: auto;
    }

    .mobile-lang .dropdown-item.active,
    .mobile-lang .dropdown-item:active {
        color: #00BD69;
    }

    .mobile-lang p {
        margin-top: 24px;
        color: #344054;
        font: 16px "SpaceGrotesk-Regular";
        margin-bottom: 24px;
    }

    .mobile-lang p::before,
    .mobile-lang p::after {
        content: "";
        display: inline-block;
        height: 1px;
        background-color: #fff;
        width: 51px;
    }

    .mobile-lang p::before {
        margin-right: 4px;
    }

    .mobile-lang p::after {
        margin-left: 4px;
    }

    .mobile-lang .dropdown-item.active,
    .mobile-lang .dropdown-item:active {
        background-color: #00BD69;
        color: #fff;
    }

    .mobile-lang .dropdown-item a {
        padding-left: 12px;
        padding-right: 12px;
    }

    .compt-item {
        padding: 16px;
    }

    .col-fed {
        width: 50%;
        max-width: 50%;
    }

    .mobile-lang ul li a {
        background-color: #fff;
    }

    .mobile-lang ul li:first-child a {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    .mobile-lang ul li:last-child a {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    /* .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 55vw;
    }

    .news-img {
        height: 189px;
        width: 60vw;
        overflow: hidden;
        border-radius: 16px;
    }*/
}

@media screen and (min-width: 767px) and (max-width: 1200px) {
    .gallery-items .col-md-4 {
        width: 50%;
    }

    .compatation-inner .row .col-md-9,
    .compatation-inner .row .col-md-3 {
        width: 100%;
    }

    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 21vw;
    }
}

.dropdown-menu {
    inset: unset !important;
}

div.dropdown-menu.show {
    transform: translate3d(0px, 45.6px, 0px) !important;
}


@media screen and (max-width: 992px) {
    .filter-form {
        flex-direction: column;
    }

    .filter-form-item {
        margin-bottom: 12px;
        margin-right: 0;
    }

    .filter-submit {
        width: 100%;
        margin-top: 0;
    }

    .filter-form-item .bootstrap-select {
        max-width: 100% !important;
    }

    .filter-form-item .bootstrap-select .dropdown-menu {
        max-width: 100%;
    }

    .bootstrap-select.show-tick .dropdown-menu li a span.text {
        max-width: 96%;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .federation-title {
        justify-content: center;
        flex-direction: column;
    }

    .federation-content {
        margin: auto;
    }

    .federation-h2 {
        margin-top: 16px;
        margin-left: 0;
        text-align: center;
        font-size: 20px;
        line-height: 30px;
    }

    .federation-img {
        width: 96px;
        height: 96px;
    }

    .profil-nav li a span {
        white-space: nowrap;
    }

    .profil-nav {
        padding: 0 20px;
        justify-content: flex-start !important;
        overflow: auto;
    }

    .profil-nav li a {
        padding: 16px;
    }

    .footer-menu {
        display: flex;
        flex-direction: column;
        justify-content: start;
        flex-wrap: wrap;
        padding-left: 0;
        text-align: center;
    }

    .footer-menu li {
        margin-right: 0;
        margin-bottom: 0;
    }


    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 25vw;
    }
}

@media screen and (max-width: 767px) {
    .gallery-items .col-md-4 {
        width: 100%;
    }

    .news-cover {
        padding: 48px 16px;
    }

    .gallery-image {
        margin-bottom: 24px;
    }

    .news-single-cover {
        margin-bottom: 32px;
    }

    .home-slider-item {
        height: 60vw;
    }

    .home-slider-prev,
    .home-slider-next {
        display: none;
    }

    .home-banner .faq-contact {
        padding: 24px 16px;
    }

    .home-form-element {
        margin-bottom: 16px;
    }

    .home-form {
        padding-top: 24px;
    }

    .layer-bg,
    .password-layer-bg {
        display: none;
    }

    .layer-content,
    .password-layer-content {
        max-width: 100%;
        padding: 20px;
    }

    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 50vw;
    }
}

@media screen and (max-width: 576px) {
    .header-logo img {
        height: 24px;
    }

    .header-top {
        padding-top: 16px;
        padding-bottom: 16px;
    }

    .header-layer {
        height: 58px;
    }

    .header-search-box {
        top: 59px;
    }

    .custom-breadcrumb .breadcrumb-item:not(:first-child) {
        display: none !important;
    }

    .custom-breadcrumb .breadcrumb-item:first-child svg {
        display: block;
        transform: rotate(180deg);
    }

    .custom-breadcrumb .breadcrumb-item img {
        display: none;
    }

    .custom-breadcrumb li a {
        color: #00BD69;
    }

    .section-cover {
        border-radius: 0;
        padding: 24px 16px;
        margin-bottom: 32px;
    }

    .main>.container {
        padding: 0;
    }

    .sub-title,
    .content-text {
        font-size: 16px;
        line-height: 24px;
    }

    .h1 {
        font-size: 26px;
    }

    .section-banner {
        width: calc(100% - 32px);
        margin: auto;
        height: 30vw;
    }

    .contact-btn {
        max-width: 100%;
    }

    .section-banner-layer {
        padding: 16px 16px 44px 16px;
    }

    .h2 {
        font-size: 20px;
        line-height: 30px;
    }

    .banner-info {
        font-size: 16px;
        line-height: 24px;
    }

    .section-cover {
        margin-top: 32px;
    }

    .faq-cover .accordion-item .accordion-button {
        font-size: 16px;
        line-height: 24px;
    }

    .faq-cover .accordion-item .accordion-body {
        font-size: 14px;
        line-height: 20px;
        padding-top: 8px;
    }

    .faq-cover .accordion-item {
        padding: 16px;
    }

    .faq-contact {
        padding: 32px 16px;
    }

    .faq-contact .faq-link {
        margin-top: 32px;
    }

    .faq-contact {
        margin: 16px 16px 32px 16px;
    }

    .gallery-item {
        margin-bottom: 32px;
    }

    .custom-pagination .page-item span {
        display: none;
    }

    .section-banner-layer {
        align-items: flex-end !important;
    }

    .banner-info {
        margin-bottom: 0;
    }

    .h2 {
        margin-bottom: 8px;
    }

    .news-items {
        padding-top: 24px;
    }

    .news-item {
        margin-bottom: 24px;
    }

    .main-mobile {
        margin-left: 16px;
    }

    .main-mobile .section-banner {
        width: 100%;
    }

    .filter-top span,
    .filter-btn,
    .filter-form-item .bootstrap-select>.dropdown-toggle .filter-option-inner-inner {
        font-size: 14px;
    }

    .filter-btn img {
        width: 18px;
    }

    .filter-line {
        margin-left: 16px;
        margin-right: 16px;
    }

    .gallery-items {
        margin-top: 32px;
    }

    .gallery-items.mlr-24 {
        margin-left: inherit;
        margin-right: inherit;
    }

    .gallery-items .plr-24 {
        padding-left: inherit;
        padding-right: inherit;
    }

    .daterangepicker {
        width: calc(100% - 32px);
    }

    .daterangepicker .drp-calendar {
        max-width: 96%;
    }

    .compatations-cover .news-item {
        margin-bottom: 0;
    }

    .federation-layer {
        padding: 16px;
    }

    .main-compatation>.container {
        padding: 16px;
    }

    .compatation-img {
        height: 320px;
    }

    .map-left {
        width: 100%;
        margin-right: 0;
    }

    .compt-register {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #fff;
        position: fixed;
        width: 100%;
        z-index: 99;
        left: 0;
        bottom: 0;
        padding: 24px;
    }

    .reg-button {
        padding: 10px 16px;
        margin-top: 0;
    }

    .compt-regprice span {
        color: #344054;
        font: 14px "SpaceGrotesk-Regular";
        line-height: 20px;
        margin-bottom: 4px;
        text-align: left;
    }

    .compt-regprice {
        margin-top: 0;
    }

    .compatation-all {
        font-size: 14px;
    }

    .compatation-inner {
        padding-bottom: 32px;
    }

    .mb-36 {
        margin-bottom: 24px;
    }

    .compt-slider-h5 {
        font-size: 16px;
        width: 100%;
        text-align: center;
    }

    .home-owl-carousels {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .home-slider {
        margin-bottom: 20px;
    }

    #home-slider {
        padding-left: 4px;
        padding-right: 4px;
    }

    .federation-item {
        margin-bottom: 48px;
    }

    .federation-item p {
        font-size: 14px;
        margin-top: 16px;
        line-height: 24px;
    }

    .federation-item img {
        width: 96px;
        height: 96px;
    }

    .col-fed:nth-child(2),
    .col-fed:nth-child(4) {
        position: relative;
        top: 100px;
    }

    .w-212 {
        width: 212px;
    }

    .faq-contact .faq-link {
        margin-top: 0;
    }

    .federations-items {
        padding-top: 32px;
        padding-bottom: 24px;
    }

    .profil-nav li a {
        font-size: 14px;
    }

    .form-radio {
        margin-right: 16px;
    }

    .add-form .form-element,
    .add-form-three .contact-btn {
        margin-top: 24px;
    }

    .add-form {
        margin-top: 10px;
    }

    .event-number .special-choose {
        top: -16px;
    }

    .page-cover-404 {
        min-height: auto;
        padding: 48px 16px;
    }

    .page-cover-404 p {
        font-size: 24px;
        line-height: 32px;
    }

    .nav-compatation-links {
        margin-top: 16px;
    }

    /*   home-banner img {
    height: 10vw;
   }*/

    .home-slide-layer {
        position: absolute;
        left: 0;
        top: 0;
        background: linear-gradient(376deg, #0F3D28 6%, rgba(15, 61, 40, 0) 100%);
        width: 100%;
        height: 100%;
        padding: 20px 40px 22vw 15px;
        border-radius: 16px;
    }

    .home-slide-layer h2 {
        font-size: 4vw;
        width: 60vw;
    }

    .home-slide-layer p {
        font-size: 3vw;
        width: 55vw;
    }

    .gallery-span,
    .gallery-ul li {
        color: #E6FFF4;
        font: 2.5vw "SpaceGrotesk-Regular";
        line-height: 20px;
    }

    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 70vw;
    }

    .new-bh {
        height: 189px;
        width: 85vw;
        overflow: hidden;
        border-radius: 16px;
    }
}

@media screen and (max-width: 400px) {
    .custom-pagination .page-link {
        font-size: 12px;
    }

    .custom-pagination .page-link {
        width: 32px;
        height: 32px;
    }

    .page-item:first-child .page-link,
    .page-item:last-child .page-link {
        padding: 0;
    }


    .home-slide-layer {
        position: absolute;
        left: 0;
        top: 0;
        background: linear-gradient(376deg, #0F3D28 6%, rgba(15, 61, 40, 0) 100%);
        width: 100%;
        height: 100%;
        padding: 5px 10vw 15vw 18px;
        border-radius: 16px;
    }

    .home-slide-layer h2 {
        font-size: 14px;
        width: 220px;
    }

    .home-slide-layer p {
        font-size: 11px;
        width: 200px;
    }

    .gallery-span,
    .gallery-ul li {
        color: #E6FFF4;
        font: 12px "SpaceGrotesk-Regular";
        line-height: 20px;
    }

    .news-h4 {
        color: #344054;
        font: 18px "SpaceGrotesk-Regular";
        line-height: 28px;
        margin-bottom: 8px;
        width: 90vw;
    }

    .new-bh {
        height: 189px;
        width: 85vw;
        overflow: hidden;
        border-radius: 16px;
    }
}

/* ends mobile style */



.img-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    transition: ease .5s;
    backdrop-filter: blur(3px);
    background-color: rgba(0, 0, 0, 0.3);
}

.news-item:hover .img-layer {
    backdrop-filter: blur(0);
    background-color: transparent;

}