@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;
    list-style: none;
    text-decoration: none;
}

:root {
    --color-primary: #007130;
    --color-primary-2: #11a04d;
    --color-bacground: #f7f7f7;
    --color-text-1: #333333;
    --color-text: #808080;
    --color-border: #e7e7e7;
}

a,
a:hover {
    text-decoration: none;
    color: inherit;
}

ul,
li,
p {
    list-style: none;
    padding: 0;
    margin: 0;
}

figure {
    margin: 0;
}

section {
    padding: 50px 0;
}

.section-title {
    font-size: 30px;
    font-weight: 600;
    color: var(--color-primary);
    text-align: center;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 50px;
}

.section-title::after {
    content: "";
    position: absolute;
    width: 20%;
    height: 1px;
    background-color: var(--color-border);
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
}

.section-title:hover {
    color: var(--color-primary);
}

.mt10 {
    margin-top: 10px;
}

.mt30 {
    margin-top: 30px;
}

/* Content Wrapper START*/
.content-wrapper {
    margin-bottom: 50px;
    padding: 20px 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.content-wrapper p {
    padding: 5px;
    color: #000;
}

.content-wrapper img {
    max-width: 100%;
    width: auto;
    height: auto;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.content-wrapper-title {
    font-weight: 600;
    font-size: 25px;
    padding-bottom: 10px;
    text-align: center;
}

.content-wrapper ul {
    padding: 0 20px 20px 20px;
}

.content-wrapper ul li {
    list-style-type: circle;
}

.content-wrapper h1 {
    font-size: 25px;
}

.content-wrapper h2 {
    font-size: 23px;
    font-weight: 500;
}

.content-wrapper h3 {
    font-size: 21px;
    font-weight: 500;
}
/* Content Wrapper END*/

.page-title {
    color: var(--color-text-1);
    font-size: 25px;
    font-weight: 700;
    position: relative;
    margin-left: 10px;
    margin-bottom: 20px;
}

.page-title:after {
    position: absolute;
    content: "";
    background-color: var(--color-text-1);
    width: 30%;
    height: 2px;
    left: -10px;
    bottom: -5px;
}

.page-title-02 {
    font-size: 30px;
    font-weight: 700;
    padding-bottom: 25px;
}

.img-fluid {
    padding: 0;
}

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

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* HEADER */

/* Header-Desktop Start */
/* Header-top start*/
.hero-desktop {
    padding: 0;
    margin: 0;
}

.header-desktop {
    padding: 10px 0px 0px 0px;
    background-color: #fff;
    z-index: 999;
}

.header-top .row {
    display: flex;
    align-items: center;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--color-border);
}

.desktop-logo img {
    max-width: 150px;
    width: 100%;
    height: auto;
}

.header-area {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    position: relative;
}

.header-area:not(:last-child)::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 1px;
    background-color: var(--color-border);
}

.header-area i {
    color: var(--color-primary);
    font-size: 30px;
}

.header-box {
    display: flex;
    flex-direction: column;
    font-size: 13px;
}

.header-box img {
    margin-bottom: 2px;
    max-width: 30px;
    width: 100%;
    height: auto;
}

.header-box span {
    font-size: 14px;
    color: var(--color-text-1);
    padding-bottom: 0;
}

.header-box a {
    color: var(--color-text);
}

.header-contact {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 25px;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
    font-size: 13px;
}
/* Header-top end*/

/* Header-bottom start*/
.header-bottom {
    position: sticky;
    top: 0;
    background-color: #007130;
    box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.15);
    width: 100%;
    z-index: 9;
}

.header-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.header-menu li a {
    font-size: 15px;
    font-weight: 500;
    color: white !important;
    transition: all 0.3s ease;
}

.header-menu li a:hover {
    color: var(--color-primary);
}

.header-menu li.active {
    color: var(--color-primary);
    /* border-top: 3px solid #ffffff; */
    /* bottom: 2px; */
}

/* Logo başlangıçta gizli */
.sticky-logo {
    display: none;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    height: 40px;
    z-index: 10;
    transition: opacity 0.3s ease;
}

/* Header kaydırılırken logo görünür */
.header-bottom.sticky .sticky-logo {
    display: block;
    opacity: 1;
}
/* Header-bottom end*/
/* Header-Desktop End */

/* MOBILE HEADER START */
.mobile-header {
    display: flex;
    align-items: center;
    padding: 10px 0;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    position: sticky;
    top: 0;
    z-index: 100;
}

.mobile-header {
    display: none;
}

.mobile-header .row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mobile-logo img {
    max-width: 102px;
    width: 100%;
    height: auto;
}

.hamburger-menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
}

/* MOBILE HEADER END */

@media (max-width: 1200px) {
    .header-box {
        font-size: 8px;
    }

    .header-area i {
        font-size: 17px;
    }

    .header-contact {
        padding: 10px 15px;
    }
}

@media (max-width: 992px) {
    .header-contact {
        padding: 5px 12px;
    }

    .active a {
        font-size: unset;
    }
}

@media (max-width: 820px) {
    .header-desktop,
    .header-bottom {
        display: none;
    }

    .mobile-header {
        display: block;
        padding: 0;
    }
}

@media (max-width: 576px) {
    .page-title {
        font-size: 23px;
    }

    .page-title:after {
        width: 19%;
    }
}

/* HEADER-MODAL START */

/* Modal Karartı (Overlay) */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 998;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
}

.modal-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

/* Modal Alanı */
.modal {
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transform: translateX(-100%);
    transition: transform 0.5s ease;
    z-index: 999999999999999999999999999999999999999999999;
    background: white;
}

.modal .row {
    height: 100vh;
    background: #fff;
}

.modal.active {
    transform: translateX(0);
}

/* Mobile Header Gizleme */
.modal-open .mobile-header {
    display: none;
}

/* Modal Başlık */
.modal-title {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 5px 10px 20px;
}

.modal-logo img {
    max-width: 220px;
    max-height: 120px;
    object-fit: contain;
	padding-top: 20px;
}

/* Modal Arama */
.modal-input {
    width: 100%;
    padding: 10px 15px;
    margin-bottom: 50px;
    border: none;
    border-radius: 20px;
    background-color: var(--color-background);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    position: relative;
}

.modal-search {
    position: absolute;
    top: 30px;
    right: 10%;
    color: var(--color-text);
}

/* Modal Menü */
.modal-menu {
    width: 100%;
    padding: 0 25px;
}

.modal-menu li {
    padding: 15px 0;
    position: relative;
}

.modal-menu li a {
    color: var(--color-text);
    font-size: 20px;
    transition: color 0.3s ease;
}

.modal-menu li a:hover {
    color: var(--color-primary);
}

/* Dropdown */
.modal-menu .dropdown {
    display: none;
    max-height: 0;
    overflow: hidden;
    background: var(--color-5);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 0 20px;
    margin-top: 10px;
    border-radius: 4px;
    transition: max-height 0.3s ease;
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    max-width: 100%;
    z-index: 1000;
}

/* Dropdown elemanlarının stilleri */
.modal-menu .dropdown li {
    padding: 10px 0;
}

.modal-menu .dropdown li a {
    color: #333;
    font-size: 20px;
}

.modal-menu li.active .dropdown {
    display: block;
    max-height: 500px;
    padding: 20px;
}

/* Modal Ä°konlar */
.modal-icons {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 50px 0;
    color: #000;
}

.modal-icons a {
    color: #000;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    font-size: 15px;
}

.modal-icons i {
    color: var(--color-4);
    font-size: 20px;
}





/* Modal Footer */
.header-modal-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    border-radius: 20px;
}

.modal-footer-icon,
.modal-contact i {
    font-size: 25px;
}

.modal-contact {
    display: flex;
    align-items: center;
    gap: 20px;
    color: var(--color-primary);
}

.modal-icon-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    border-right: 2px solid var(--color-text);
    padding-right: 20px;
    margin-right: 20px;
    font-size: 25px;
    color: var(--color-primary);
}

/* Modal Genel Stiller */
.modal-icon {
    color: var(--color-border);
    background-color: var(--color-primary-2);
    padding: 10px 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    position: absolute;
    right: 5%;
    top: 4%;
}

.modal-footer-icon {
    font-size: 15px;
}

@media (max-width: 576px) {
    .modal-input {
        margin-bottom: 0;
    }

    .modal-icons {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
}

/* HEADER-MODAL END */

/* HOME SLIDER START */
.hero-section {
    padding: 0;
}

/* HOME SLIDER END */

/* ABOUT-US START */
.about-box-list {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.about-us-section {
    background-color: var(--color-bacground);
}

.about-us-section .row {
    display: flex;
    align-items: center;
    justify-content: center;
}

.about-us-box {
    max-width: 400px;
    width: 100%;
}

.about-us-box {
    display: flex;
    flex-direction: column;
    max-width: 100%;
}

.about-content {
    color: var(--color-text);
    padding: 0 20px 0 0;
}

.about-img {
    width: 100%;
    max-width: 500px;
    height: auto;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.about-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 50px;
}

.about-title span:first-child {
    color: var(--color-primary);
    font-size: 30px;
    font-weight: 600;
    padding-bottom: 0px;
    text-shadow: 1px 1px 1px var(--color-primary);
}

.about-title span:last-child {
    color: var(--color-primary);
    font-size: 20px;
    font-weight: 400;
    padding-bottom: 5px;
}

/* ABOUT-US END */

/* ORGANIZATION START */
.organization-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    border: 1px solid var(--color-border);
    border-radius: 20px;
    padding: 8px 15px;
    margin-bottom: 30px;
}

.organization-img {
    max-width: 100%;
    width: 300px;
    border-radius: 20px;
    max-height: 150px;
    height: auto;
    object-fit: cover;
}

.organization-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 300px;
    max-width: 100%;
    padding: 0 20px;
    margin: 0 auto;
}

.org-logo {
    max-width: 100%;
    max-height: 90px;
    height: auto;
    object-fit: cover;
}

.org-date {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-primary);
    padding-bottom: 5px;
}

.org-text {
    font-size: 13px;
    color: var(--color-text);
}

@media (max-width: 1200px) {
    .organization-content {
        padding: 0;
    }

    .org-logo {
        max-height: 70px;
        max-width: 100px;
    }

    .org-date {
        font-size: 16px;
    }

    .org-text {
        font-size: 11px;
    }
}

@media (max-width: 576px) {
    .organization-img {
        max-width: 100%;
        width: 200px;
    }
}

/* ORGANIZATION END */

/* WHY-US SECTION START */
.why-us-section {
    background-color: var(--color-bacground);
}

.why-us-section .row {
    display: flex;
    /* align-items: center; */
}

.why-box-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 20px;
}

.why-box {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 20px;
}

.why-icon img {
    background-color: var(--color-primary);
    padding: 10px;
    width: 50px;
    text-align: center;
    border-radius: 10px;
}

.why-title {
    font-size: 18px;
    font-weight: 600;
    padding-bottom: 3px;
}

.why-content span {
    color: var(--color-text);
    font-size: 13px;
    line-height: 1.2;
}

.why-us-image {
    max-width: 100%;
    width: 500px;
    height: auto;
    max-height: 450px;
    display: flex;
    align-items: center;
    margin-right: auto;
    margin-left: auto;
}

/* WHY-US SECTION END */

/* UPCOMING-FAIR (YAKLAÅžAN FUARLAR) START */
.upcoming-fair-section {
    background-image: url("front/assets/img/fair-background.png");
    background-size: 40%;
    background-position: right 90%;
    background-repeat: no-repeat;
}

.upcoming-fair-section .fair-row {
    display: flex;
    align-items: center;
    padding: 40px 0;
    flex-wrap: wrap;
}



.fair-img {
    max-width: 100%;
    width: 50px;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    max-height: 50px;
    object-fit: cover;
}

.fair-box {
    max-width: 100%;
    width: 300px;
    height: auto;
}

.fair-title {
    font-weight: 600;
    font-size: 20px;
    padding-bottom: 5px;
}

.fair-box span {
    color: var(--color-text);
    font-size: 15px;
}

.fair-date {
    color: var(--color-primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid var(--color-primary);
    padding: 5px 35px;
    border-radius: 10px;
    text-align: center;
}

.fair-date span {
    font-size: 15px;
    font-weight: 400;
}

.fair-detail {
    background-color: var(--color-primary);
    padding: 6px 20px;
    border-radius: 5px;
    color: #fff;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
}

.fair-detail:hover {
    color: #fff;
}

.fair-detail img {
    padding-left: 10px;
    max-width: 20px;
    width: 100%;
}

.fair-column {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.fair-logo {
    max-width: 100%;
    width: 200px;
}

.fair-box-title {
    font-size: 18px;
    font-weight: 600;
    margin-top: -15px;
}

@media (max-width: 992px) {
    .fair-row {
        display: flex;
        flex-direction: column;
    }

    .fair-column {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .fair-logo {
        margin-right: 0;
        width: 150px;
    }
}

@media (max-width: 576px) {
    .fair-column {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-inline: 35px;
    }
}

/* UPCOMING-FAIR (YAKLAÅžAN FUARLAR) END */

/* DATA SECTION START */
.datas-section {
    padding: 30px 0;
}

.datas-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
    flex-wrap: wrap;
}

.data-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-right: 40px;
    border-right: 1px solid var(--color-primary);
}

.data-box:last-child {
    border: none;
}

.data-box span:first-child {
    color: #000;
    font-size: 35px;
    font-weight: 600;
}

.data-box span:last-child {
    color: var(--color-text);
}

@media (max-width: 820px) {
    .data-box {
        width: 32%;
        padding-right: 0;
        border-right: none;
        border: 1px solid var(--color-primary);
        padding-bottom: 15px;
    }

    .data-box:last-child {
        border: 1px solid var(--color-primary);
    }
}

@media (max-width: 480px) {
    .data-box,
    .data-box:last-child {
        border: none;
    }

    .data-box span:first-child {
        color: #000;
        font-size: 30px;
        font-weight: 600;
    }

    .data-box span:last-child {
        font-size: 15px;
    }
}

/* DATA SECTION END */

/* CTA SECTION START */
.cta-top-img {
    background-image: url("front/assets/img/fair-background.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 50px 0;
}

.cta-row {
    overflow-x: hidden;
}

.cta-top {
    display: flex;
    font-size: 35px;
    font-weight: 500;
    color: #11a04d;
    gap: 10px;
    font-family: "Rubik", sans-serif;
    background: linear-gradient(to right, #0a8c40, #19c862);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: 0;
    margin: 0;
}

.cta-top span {
    color: #11a04d;
    font-size: 50px;
    font-weight: 800;
}

.cta-bottom-img {
    color: #fff;
    padding: 160px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.cta-bottom-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.cta-bottom-p {
    font-size: 35px;
    font-weight: 600;
    padding-bottom: 35px;
}

.cta-bottom-btn {
    background-color: var(--color-primary);
    padding: 5px 15px;
    border-radius: 10px;
    color: #fff;
}

@media (max-width: 768px) {
    .cta-top {
        font-size: 30px;
    }

    .cta-top span {
        font-size: 43px;
    }
}

@media (max-width: 576px) {
    .cta-bottom-p {
        font-size: 25px;
        text-align: center;
        padding: 30px;
    }

    .cta-top {
        font-size: 17px;
    }

    .cta-top span {
        font-size: 20px;
    }

    .section-title {
        font-size: 30px;
        margin-bottom: 15px;
    }

    .about-title {
        margin-bottom: 25px;
    }

    .cta-bottom-img {
        padding: 130px 0;
    }
}

/* CTA SECTION END */

/* FOOTER START */
.footer-top {
    padding-bottom: 50px;
}

.footer-logo {
    max-width: 100%;
    width: 250px;
    object-fit: contain;
    height: auto;
    max-height: 200px;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 30px;
}

.footer-logo img {
    max-width: 250px;
}

.footer-title {
    font-size: 20px;
    font-weight: 600;
    padding-bottom: 7px;
    margin-bottom: 20px;
    text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.3);
    position: relative;
}

.footer-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1px;
    background-color: black;
}

.footer-list {
    margin-bottom: 20px;
}

.footer-list li {
    padding-bottom: 10px;
    transition: all 0.3s ease;
}

.footer-list li a {
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 7px;
}

.footer-list li a:hover {
    color: var(--color-text);
}

.social-list {
    display: flex;
    gap: 15px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.social-list a {
    color: var(--color-primary);
    font-size: 17px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    /* justify-content: center; */
    gap: 10px;
}

.social-list a:hover {
    color: var(--color-text);
}

.footer-bottom {
    padding: 10px 0px 0px 0px;
}

.footer-bottom .row {
    background-color: var(--color-primary);
}

.footer-bottom .fb {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 10px 30px;
}

.fb-img {
    max-width: 100%;
    width: 250px;
}

.fb-center {
    display: flex;
    justify-content: center;
}

.fb-right {
    display: flex;
    gap: 25px;
    justify-content: flex-end;
}

.fb-right a {
    position: relative;
    text-decoration: none;
    color: inherit;
    text-align: center;
}

.fb-right a:not(:last-child)::after {
    content: "|";
    position: absolute;
    right: -13px;
    color: #fff;
    font-size: 16px;
}

.footer-center-list {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-center-list li {
    width: 100%;
    box-sizing: border-box;
}

.footer-center-list a {
    transition: all 0.3s ease;
}

.footer-center-list a:hover {
    color: var(--color-text);
}

@media (max-width: 820px) {
    .footer-logo {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .fb {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }
}

@media (max-width: 576px) {
    .footer-center-list {
        margin-bottom: 50px;
    }
}

/* FOOTER END */

/* WHATSAPP START */
/* WHATSAPP START */
.fixedButton {
    position: fixed;
    bottom: 65px;
    right: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 9;
    transition: none;
}

@media (max-width: 992px) {
    .fixedButton {
        display: none;
    }
}

.fixedButton .fixedButton-icon {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #4ac959;
    border-radius: 50%;
    font-size: 30px;
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.fixedButton .fixedButton-icon:hover {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.fixedButton-content {
    --fixedButton-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    --fixedButton-bg-c: #fff;
    width: 190px;
    padding: 10px 10px;
    box-shadow: var(--fixedButton-shadow);
    margin-bottom: 20px;
    border-radius: 18px;
    position: relative;
    background-color: var(--fixedButton-bg-c);
    color: #303030;
    font-weight: 700;
    line-height: initial;
    font-size: 14px;
    opacity: 0;
    /* Başlangıçta görünmez */
    transform: translateY(20px);
    /* Başlangıç pozisyonu */
    transition: all 0.5s ease-in-out;
    /* Yumuşak geçiş */
}

.fixedButton-content::before {
    --offset: 10px;
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(0px - var(--offset));
    width: 0;
    height: 0;
    border-left: var(--offset) solid transparent;
    border-right: var(--offset) solid transparent;
    border-top: var(--offset) solid var(--fixedButton-bg-c);
    filter: drop-shadow(var(--fixedButton-shadow));
}

.fixedButton .close {
    position: absolute;
    top: 0;
    right: 0;
    height: 25px;
    width: 25px;
    font-size: 15px;
    background-color: rgba(34, 34, 34, 0.7);
    color: white;
    border-radius: 50%;
    transform: translate(50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    /* Başlangıçta görünmez */
    transition: opacity 0.4s ease-in-out;
    /* Yumuşak geçiş */
}

/* Hover Durumu */
.fixedButton:hover .fixedButton-content {
    opacity: 1;
    /* Görünür yap */
    transform: translateY(0);
    /* Yukarı doğru çık */
}

.fixedButton:hover .close {
    opacity: 1;
    /* Çarpıyı görünür yap */
}

/* BREADCRUMB START */
.breadcrumb-image img {
    margin: 0;
    max-width: 100%;
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.bredcrumb {
    padding: 0;
}

.bredcrumb-bottom {
    background: var(--color-bacground);
    padding: 25px 0;
}

.breadcrumb-bottom-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.breadcrumb-bottom-wrapper .title {
    color: var(--color-text-1);
    font-size: 30px;
    font-weight: 600;
}

.links {
    display: flex;
    align-items: center;
}

.links li a:after {
    margin-left: 6px;
    margin-right: 6px;
    font-family: "Font Awesome 6 Free";
    content: "\f054";
    font-size: 10px;
    font-weight: 900;
}

.lb-data .lb-close {
    background: #ff0000;
    color: #fff;
    font-size: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    top: -20px;
    right: -20px;
    position: absolute;
    cursor: pointer;
}

@media (max-width: 820px) {
    .breadcrumb-bottom-wrapper .title {
        font-size: 20px;
    }
}

@media (max-width: 576px) {
    .breadcrumb-image img {
        height: 150px;
    }

    figure {
        margin-top: 0;
    }

    .breadcrumb-bottom-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .links {
        font-size: 12px;
    }
}

/* BREADCRUMB END */

/* TEMPLATE ABOUT US START */
.template-about {
    padding: 60px 0px;
}

.about-page-img {
    max-width: 100%;
    width: auto;
    margin-bottom: 15px;
}

.about-desc {
    font-size: 17px;
    color: var(--color-text);
    padding: 10px 20px 10px 0px;
}

.about-desc p {
    color: var(--color-text);
    margin-bottom: 15px;
}

@media (max-width: 576px) {
    .template-about {
        padding: 30px 0px;
    }
}

/* TEMPLATE ABOUT US END */

/* (template-gallery) MEDYA START */
.picture-box-area .picture-box {
    margin-bottom: 30px;
    display: block;
}

.picture-box img {
    border-radius: 20px;
    margin-bottom: 30px;
}

.gallery-title {
    text-align: center;
    font-size: 25px;
    position: relative;
    font-weight: 600;
}

.separator {
    display: block;
    width: 50px;
    height: 2px;
    background: #000;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
    margin-bottom: 50px;
}

.separator:before {
    content: "";
    display: block;
    width: 10px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 0;
    left: -15px;
}

.separator:after {
    content: "";
    display: block;
    width: 10px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 0;
    right: -15px;
}

.gallery-content {
    background-color: var(--color-primary-2);
    color: #fff;
    padding: 15px 0;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    margin-bottom: 50px;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.gallery-image {
    max-width: 100%;
    width: 100%;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    height: 250px;
}

.gallery-btn {
    background-color: var(--color-primary-2);
    color: #fff;
    padding: 5px 25px;
    border-radius: 10px;
    border: 1px solid var(--color-primary);
}

@media (max-width: 820px) {
    .gallery-title {
        font-size: 15px;
    }

    .gallery-btn {
        padding: 5px 25px;
    }
}

@media (max-width: 576px) {
    .gallery-btn {
        padding: 0px 18px;
    }
}

/* (template-gallery) MEDYA END */

/* Ana Menü */
.header-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 20px;
}

.header-menu > li {
    position: relative;
}

.header-menu > li > a {
    text-decoration: none;
    color: #000;
    padding: 10px 15px;
    display: block;
}

/* Dropdown Menüler */
.dropdown {
    list-style: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    padding: 10px 0;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    z-index: 10;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    width: 200px;
}

.dropdown > li {
    position: relative;
}

.dropdown > li > a {
    text-decoration: none;
    color: #333;
    padding: 10px 15px;
    display: block;
    transition: opacity 0.6s ease, transform 0.6s ease;
    width: 250px;
}

/* Hover Durumunda Görünürlük */
.header-menu > li:hover > .dropdown,
.dropdown > li:hover > .dropdown {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Alt Dropdown (Ä°kinci Seviye) */
.dropdown > li > .dropdown {
    top: 0;
    left: 100%;
    width: 150px;
    margin-left: 0;
    margin-top: -10px;
    background: var(--color-border);
    color: #fff;
}

.dropdown > li > .dropdown .active {
    border: none;
}

/* Hover Efektleri */
.dropdown > li > a:hover {
    background-color: transparent;
    transform: translateX(10px);
}

.header-menu > li > .dropdown > .active {
    border: none;
}

/* SINGLE-GALLERY START (image-box) */
.image-title {
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    padding-bottom: 20px;
    text-decoration: underline;
}

.image-desc {
    padding-bottom: 45px;
}

.single-img {
    max-width: 100%;
    width: auto;
    border-radius: 15px;
    margin-bottom: 75px;
}

/* SINGLE-GALLERY END */

/* CONTACT PAGE START */
.contact-page .title {
    font-size: 25px;
    position: relative;
    margin-bottom: 30px;
    font-weight: 600;
    color: var(--color1);
}

.contact-page .title:after {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    background-color: var(--color2);
    bottom: 0;
    left: 0;
}

.contact-box {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}

.contact-box .icon {
    background-color: var(--color-primary);
    border-radius: 50%;
    min-width: 70px;
    min-height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    margin-right: 20px;
    color: white;
}

.contact-box .info-title {
    font-size: 20px;
    margin-bottom: 0px;
    font-weight: 600;
    color: var(--color1);
}

.contact-box .info-detail {
    margin-bottom: 10px;
}

.navigation-arrow {
    margin-left: 10px;
}

.contact-box .info-detail span {
    font-weight: 600;
}

.contact-box .info-detail a {
    color: #666;
}

.contact-box .info-detail a:hover {
    color: var(--color2);
}

.form-group {
    width: 100%;
    margin-bottom: 20px;
}

.form-group .form-control {
    width: 100%;
    background: white;
    border: solid 1px #ddd;
    border-radius: 5px;
    height: 50px;
    padding: 0 20px;
    outline: none;
}

.form-group textarea {
    width: 100%;
    background: white;
    border: solid 1px #ddd;
    border-radius: 5px;
    height: 120px;
    padding: 10px 20px;
    outline: none;
}

.form-group input[type="file"] {
    width: 100%;
    background: white;
    border: solid 1px #ddd;
    border-radius: 5px;
    height: 50px;
    padding: 10px;
    outline: none;
    border-radius: 26px;
}

.form-group button {
    background-color: var(--color1);
    color: white;
    border: none;
    padding: 0 30px;
    font-weight: 700;
    margin-left: 5px;
    border-radius: 3px;
    outline: none;
    cursor: pointer;
    height: 50px;
}

.form-group button:hover {
    background-color: var(--color2);
}

.form-group .send-button {
    background-color: var(--color-primary);
    color: #fff;
    display: inline-flex;
    border-radius: 10px;
    padding: 10px 30px;
}

.form-group .recaptcha {
    display: flex;
    justify-content: center;
    text-align: center;
}

.form-group-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
    flex-direction: column;
    align-items: center;
    gap: 25px;
}

.contact-button {
    background: var(--color-primary);
    padding: 10px 30px;
    border-radius: 10px;
    color: #fff;
    transition: all 0.3s ease;
    border: 1px solid var(--color-primary);
}

.contact-button:hover {
    background-color: #fff;
    color: var(--color-primary);
}

.form-robot {
    display: flex;
}

.g-maps {
    margin-top: 30px;
    margin-bottom: -77px;
}

.button1.navigation-button {
    display: none;
}

.profile-box {
    padding: 10px 0;
    margin-bottom: 50px;
    border: 1px solid lightgrey;
    border-radius: 20px;
    height: 230px;
    /* Tüm kutuların aynı yükseklikte olmasını sağlar */
    display: flex;
    flex-direction: column;
}

.profile-title {
    font-size: 13px;
    color: var(--color-text);
    word-wrap: break-word;
    word-break: break-word;
}

.profile-content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-inline: 20px;
    height: 100%;
}

.person-name {
    color: var(--color-text-1);
    font-size: 18px;
    font-weight: 500;
    padding-block: 20px;
    border-bottom: 1px solid var(--color-border);
    word-wrap: break-word;
    word-break: break-word;
    flex: 1;
    min-width: 0;
    padding-left: 10px;
}

.profile-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 60px;
    flex: 1;
}

.profile-box i {
    color: var(--color-primary-2);
    margin-right: 10px;
}

.person-img {
    border-radius: 50%;
    object-fit: cover;
    margin-right: 10px;
    flex-shrink: 0;
}

.google-maps {
    margin-bottom: 80px;
}

.navigation-button {
    display: inline;
    background-color: var(--color-primary);
    color: #fff;
    padding: 5px 30px 7px 30px;
    border-radius: 10px;
    margin-top: 10px;
}

.person-contact-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 5px;
}

.infos {
    text-decoration: none;
}

@media (max-width: 820px) {
    .contact-box .icon {
        min-width: 60px;
        min-height: 60px;
        font-size: 25px;
    }

    .form-group-btn {
        display: flex;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .profile-content {
        padding: 10px 10px 30px 10px;
    }

    .person-name {
        font-size: 17px;
    }
}

@media (max-width: 576px) {
    .contact-box .icon {
        min-width: 50px;
        min-height: 50px;
        font-size: 20px;
    }

    .profile-box {
        height: 260px;
    }

    .profile-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .person-name {
        font-size: 17px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .profile-title {
        text-align: center;
    }

    .profile-contact {
        margin-top: -35px;
        padding: 20px;
    }

    .person-contact-box {
        font-size: 10px;
    }
}

/* CONTACT PAGE END */

/* SINGLE FAIR START */
.fair-detail-title {
    color: var(--color-primary);
    font-size: 30px;
    font-weight: 600;
    border-bottom: 1px solid var(--color-primary-2);
    margin-bottom: 25px;
}

.fair-title-02 {
    background-color: var(--color-primary);
    color: #fff;
    font-weight: 500;
    font-size: 17px;
    display: inline;
    padding: 2px 33px 5px 33px;
    border-radius: 4px;
}

.fair-detail-box {
    padding-bottom: 30px;
}

.fair-detail-box span {
    font-weight: 600;
    margin-right: 7px;
}

.fair-detail-img {
    width: 100%;
    width: 100%;
    margin-bottom: 0;
}

.fair-ul {
    margin-top: 10px;
    padding: 0 30px;
}

.fair-ul-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
    list-style: none;
    padding: 0;
    padding: 0 20px;
    margin-top: 10px;
}

.fair-ul li {
    list-style-type: disc;
    margin-right: 25px;
}

.fair-btn-group {
    display: flex;
    align-items: center;
    gap: 25px;
}

.fair-btn {
    background-color: #fff;
    color: var(--color-primary);
    padding: 2px 10px;
    border-radius: 7px;
    border: 1px solid var(--color-primary);
}

@media (max-width: 820px) {
    .fair-detail-img {
        margin-right: auto;
        margin-left: auto;
        display: flex;
    }
}

@media (max-width: 576px) {
    .fair-ul-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .fair-ul li {
        font-size: 12px;
    }

    .fair-btn {
        padding: 2px 30px;
        text-align: center;
    }
}

/* SINGLE FAIR END */

/* FAIR-BOX START */
.fair-box-img {
    max-width: 100%;
    width: auto;
    margin-bottom: 0px;
}

@media (max-width: 768px) {
    .mb50 {
        margin-bottom: 80px;
    }
}

/* FAIR-BOX END */

/* CAREER (KARÄ°YER) START */
.career-row input,
.career-row textarea,
.cv-form {
    width: 100%;
    padding: 8px 15px;
    border: solid 1px #d6d6d6;
    margin-bottom: 15px;
    font-family: "Poppins";
    outline: none;
    display: flex;
    flex-direction: column;
}

.robot-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 50px;
}

.robot {
    max-width: 100%;
    width: 250px;
    margin-bottom: 15px;
}

.career-btn a {
    background-color: var(--color-primary);
    color: #fff;
    padding: 10px 100px;
}

@media (max-width: 820px) {
    .robot-box {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 20px;
    }
}

/* CAREER END */

/* BLOG-LIST-PAGE START */
.blog-list-page .row > div {
    margin-bottom: 30px;
}

/* BLOG-LIST-PAGE END */

/* BLOG-BOX START */
.blog-box {
    margin-bottom: unset;
}

.blog-content {
    background-color: var(--color-primary-2);
    color: #fff;
    padding: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    padding-bottom: 30px;
}

.blog-image {
    max-width: 100%;
    width: 100%;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.blog-title {
    font-weight: 600;
    margin-bottom: 20px;
}

.blog-btn {
    background-color: var(--color-primary-2);
    color: #fff;
    padding: 10px 25px;
    border-radius: 10px;
    border: 1px solid var(--color-primary);
}

.blog-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-form input {
    width: 100%;
    border: none;
    padding: 10px 5px;
    border: 1px solid var(--color-border);
}

.sticky-container {
    position: sticky;
    top: 100px;
    height: fit-content;
}

/* BLOG-BOX END */

.social-media-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.social-media-bar .w-app {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 0 24px 24px 0;
    padding-inline: 2rem 1rem;
    position: relative;
    z-index: -1;
    left: -1.5rem;
    height: 50px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    background-color: #218247;
}

.social-media-bar .w-app i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: white;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: solid 1px #e1e9ee;
}

.social-media-bar .social-media {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 24px 0px 0px 24px;
    height: 50px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    background-color: var(--color-primary);
}

.social-media-bar .social-media li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50px;
    height: 40px;
    border-radius: 0 0 24px 24px;
    transition: all 0.3s ease;
}

.social-media-bar .social-media li:hover {
    background-color: #f57d00;
}

.social-media-bar .social-media li i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color-primary);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: solid 1px #e1e9ee;
    background-color: #fff;
    font-size: 12px;
}

.social-media-bar .social-media li:nth-child(2):hover {
    background-color: #3b5998;
}

.social-media-bar .social-media li:nth-child(3):hover {
    background-color: #55acee;
}

.social-media-bar .social-media li:nth-child(4):hover {
    background-color: #ff0000;
}

.social-media-bar .social-media li:nth-child(5):hover {
    background-color: #0077b5;
}

.sticky-smbar {
    position: fixed;
    right: 0vw;
    top: 30vh;
    z-index: 55;
}

.sticky-smbar .w-app,
.sticky-smbar .social-media,
.sticky-smbar .social-media-bar {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.sticky-smbar .w-app,
.sticky-smbar .social-media {
    width: 35px;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

.sticky-smbar .w-app {
    position: relative;
    z-index: 9;
    top: -1.5rem;
    padding-inline: unset;
    padding-block: 2rem 1rem;
    left: unset;
    border-radius: 0 0px 24px 24px;
}

.sticky-smbar .social-media {
    position: relative;
    z-index: 10;
}

.sticky-smbar .social-media li {
    border-radius: 24px 0 0px 24px;
}

/* DATA Lity START */
.lity-overlay {
    background-color: rgba(0, 0, 0, 0.8);
}

.lity-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}



/* DATA Lity END */

/* VIDEO-BOX START */
.video-box {
    position: relative;
    display: block;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s ease;
    margin-bottom: 50px;
}

.video-box img {
    width: 100%;
    height: auto;
    display: block;
}

.video-box .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
}

.video-box .play-icon {
    font-size: 48px;
    color: #fff;
    position: relative;
    /* z-index: 3; */
}

.video-box .overlay::before {
    content: "";
    position: absolute;
    width: 80px;
    height: 80px;
    background: rgba(0, 255, 127, 0.2);
    border-radius: 50%;
    animation: pulse1 2.5s infinite;
    /* z-index: 1; */
}

.video-box .overlay::after {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    background: rgba(34, 139, 34, 0.2);
    border: 2px solid rgba(34, 139, 34, 0.6);
    border-radius: 50%;
    animation: pulse2 3s infinite;
    /* z-index: 1; */
}

/* Animasyonlar */
@keyframes pulse1 {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.2);
        opacity: 0.8;
    }
}

@keyframes pulse2 {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.4);
        opacity: 0.6;
    }
}

/* VIDEO-BOX END */

/* SIKÇA SORULAN SORULAR START*/
.faq-section {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

.faq-box {
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 15px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 500;
}


.faq-box.active .faq-answer {
    max-height: 500px; /* İçeriğin sığabileceği büyük bir değer */
    opacity: 1;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding-top 0.3s ease;
}

.toggle-btn {
    cursor: pointer;
    font-size: 20px;
    font-weight: bold;
    color: var(--color-primary-2);
    transition: transform 0.3s ease;
}

.toggle-btn.open {
    transform: rotate(45deg);
}

.faq-box.active {
    background-color: #f0f0f0;
}


.faq-answer {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    padding-top: 0;
    font-size: 14px;
    color: var(--color-text);
    transition: height 0.3s ease, opacity 0.3s ease, padding-top 0.3s ease;
    height: 0;
}

.faq-box.active .faq-answer {
    height: auto; /* Dinamik içerik boyutuna uyum sağlar */
    opacity: 1;
    padding-top: 15px;
}
.faq-p {
    margin-bottom: 40px;
}

/* SIKÇA SORULAN SORULAR END */

.banner-row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    /* 8'e 4 oranı */
    gap: 20px;
}

.banner-row .col-lg-8,
.banner-row .col-lg-4 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.single-fair-gallery {
    margin-block: 60px;
}

@media (max-width: 576px) {
    .single-fair-gallery {
        margin: 10px 10px 30px 10px;
    }
}

/* Modal açıldığında body'nin kaymasını engelle */
body.lity-opened {
    overflow: hidden;
}

/* Modal arka planının kaymasını engelle */
.lity .lity-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Resimlerin düzgün bir şekilde görünmesi için */
.picture-box img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.hero-desktop {
    display: none;
}

.hero-mobile {
    display: block;
    padding: 0;
}

@media (min-width: 768px) {
    .hero-desktop {
        display: block;
    }

    .hero-mobile {
        display: none;
    }
}

/* IDENTITY START */
.banner-title {
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 5px;
    color: #294277;
    margin-top: 15px;
}

.gallery-gif {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.gallery-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    box-sizing: border-box;
}

.gallery-item-02 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 1 calc(50% - 10px);
    max-width: calc(50% - 10px);
    box-sizing: border-box;
}

.gallery-item-03 {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-sizing: border-box;
}

.gallery-right {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.gallery-right-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 1 calc(50% - 10px);
    max-width: calc(50% - 10px);
    box-sizing: border-box;
}

.image {
    max-width: 100%;
    height: auto;
    display: block;
}

.right-image {
    max-width: 100%;
    width: 100%;
}

.banner-right-title {
    margin-bottom: -70px;
    font-weight: 700;
    font-size: 18px;
    color: #294277;
}

/* IDENTITY END */

.desktop-gorsels {
    padding: 0;
}

@media (max-width: 992px){
    .desktop-gorsels {
        display: none;
    }
}


.header-menu li ul {
    transform: scaleY(0);
    transition:all 0.3s ease;
    transform-origin: top;
    opacity: 0;
    visibility: hidden; /* display yerine visibility */
    position: absolute; /* Boş alan sorununu önlemek için */
    background: #007130;
    width: 240px;
    padding: 10px;
    border-radius: 0px 0px 15px;
}

.header-menu li:hover ul {
    opacity: 1;
    visibility: visible; /* Görünürlüğü aktif yapar */
    transform: scaleY(1);
}

.header-menu ul li {
    padding: 10px;
}

section.home-slider-section {
    padding: 0;
}

.swiper.home-images {
    padding: 0;
}

section.mobile-home-slider {
    padding: 10px;
}


@media (max-width:992px){
    .home-slider-section {
        display: none;
    }
}

@media (min-width:992px){
    .mobile-home-slider {
        display: none;
    }
}

.organization-box {
    min-height: 198px;

}


ul.col-lg-3.fb-right li.active:before {
    position: absolute;
    content: '';
    background: #ffffffb3;
    width: 2px;
    height: 26px;
    right: -15px;
}

ul.col-lg-3.fb-right li.active {
    position: relative;

}
.upcoming-fair-section .fair-row {
    border: 1px solid transparent; 
    transition: all 0.3s ease;
    margin-bottom: 30px;
}

.upcoming-fair-section .fair-row:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}



.google-maps iframe{
    height: 100%;
    width: 100%;
}

.fair-box-title {
    padding: 25px 0px 40px 0px;
}

section.template-blog {
    padding: 120px 0px;
}



.cta-top-img {
    position: relative;
    height: auto;
    background-attachment: fixed; 
    background-position: center;
    background-size: cover;
    padding: 75px 0px;
}

.cta-top-img::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 1;
}

.cta-top {
    position: relative;
    z-index: 2;
    text-align: center;
    color: #333; /* Metin rengi */
    display: flex;
    align-items: center;
    justify-content: center;
}

.cta-top span {
    font-size: 2rem;
    font-weight: bold;
    display: block;
}

.cta-top p {
    font-size: 1.5rem;
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.cta-top:last-child {
    font-size: 2rem;
    font-weight: bold;
    margin-top: 9px;
}

.contact-form .form-item {
    width: 100%;
    padding: 8px 15px;
    border: solid 1px #d6d6d6;
    margin-bottom: 15px;
    font-family: "Poppins";
    outline: none;
}

.contact-form-area.detail-form-area {
    padding: 20px;
    border-radius: 20px;
/* From https: //css.glass */
    background: rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

@media (max-width:992px){
    .contact-form-area.detail-form-area,.content-wrapper {
        backdrop-filter: unset;

    }
}


.about-us-box .content-wrapper,.detail-page .content-wrapper,.template-about .content-wrapper.about-desc,.careeer-page .content-wrapper  {
    box-shadow: unset;
    filter: unset;
    backdrop-filter: unset;
    background: unset;
}


.contact-title {
    font-size: 22px;
    font-weight: 600;
    color: black;
    margin-bottom: 30px;
    padding-bottom: 7px;
    position: relative;
  }
  .contact-title::before {
    position: absolute;
    content: "";
    width: 30%;
    height: 3px;
    background: #007130;
    bottom: 0;
  }

  button.form-btn {
    background: #007130;
    border: 1px solid #007130;
    color: white;
    padding: 12px 50px;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.form-bottom {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    margin-top: 20px;
}

button.form-btn:hover {
    background: transparent;
    color: #007130;
}

.footer-sticky {
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #007130;
    position: fixed;
    z-index: 999;
    width: 100%;
    bottom: 0;
    padding: 0 0.5rem 1.15rem 0.5rem;
    border-top-left-radius: 2.15rem;
    border-top-right-radius: 2.15rem;
    border-top: 6px solid #696969;
  }
  .footer-sticky .sticky-box {
    width: 20%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: default;
  }
  .footer-sticky .sticky-box .icon {
    height: 48px;
    width: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .footer-sticky .sticky-box .icon i {
    font-size: 24px;
    color: white;
  }
  .footer-sticky .sticky-box .text {
    font-size: 10px;
    color: white;
    text-align: center;
  }
  .footer-sticky .top-box {
    -webkit-transform: translateY(-1.5rem);
    transform: translateY(-1.5rem);
  }
  .footer-sticky .top-box .icon {
    background: #696969;
    border-radius: 50%;
    position: relative;
  }
  .footer-sticky .top-box .icon i {
    color: white;
  }
  .footer-sticky .top-box .icon::before {
    content: "";
    position: absolute;
    height: 66px;
    width: 66px;
    border: 1px solid white;
    border-radius: 50%;
    opacity: 0.5;
  }
  .footer-sticky .top-box .icon::after {
    content: "";
    position: absolute;
    height: 56px;
    width: 56px;
    border: 1px solid white;
    border-radius: 50%;
    opacity: 0.75;
  }
  .footer-sticky .top-box .text {
    -webkit-transform: translateY(1.5rem);
    transform: translateY(1.5rem);
    text-align: center;
  }
  
  @media (max-width: 992px) {
    .footer-sticky {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
  }
  
  @media (max-width: 320px) {
    .footer-sticky .sticky-box .text {
      font-size: 10px;
    }
  }
  
  
  .banner{
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .picture-box {
    position: relative;
    display: inline-block;
    transition: all 0.3s ease;
}

.picture-box img {
    display: block;
    transition: opacity 0.3s ease;
}

.picture-box:hover img {
    opacity: 0.7; /* Siyah opaklık efekti için opacity azaltılır */
}

.picture-box::after {
    content: "\f25a"; /* Font Awesome'daki fa-hand-pointer ikonu */
    font-family: "Font Awesome 5 Free"; /* Font Awesome yazı tipi */
    font-weight: 900; /* İkonun stiline göre ağırlık */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #000000a8; /* Ä°konun rengi */
    font-size: 50px; /* Ä°konun boyutu */
    pointer-events: none; /* İkon tıklamayı engellemesin */
    opacity: 0; /* Başlangıçta görünmez */
    transition: opacity 0.3s ease; /* Geçiş efekti */
    z-index: 10;
}

.picture-box:hover::after {
    opacity: 1; /* Hover sırasında görünür */
}


.header-menu li ul li:hover {
    transform: translateX(10px);
}

.header-menu li ul li {
    transition: all 0.3s ease;
}


.fair-detail-box.detail-katalog a {
    background: #007130;
    color: white;
    width: 639px;
    text-align: center;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 14px 0;
    /* margin-top: 22px; */
    transition: all 0.3s ease;
    border: 1px solid;
    border-radius: 5px;
    align-items: center;
    gap: 5px;
    margin-top: 20px;
}

.fair-detail-box.detail-katalog a:hover {
    background: transparent;
    color: #007130;
}.fair-detail-box.detail-katalog a i {
    font-size: 31px;
}


@media (max-width: 992px) {
    .fair-detail-box.detail-katalog a {
        width: 100%;
    }
    .single-fair-gallery {
        margin: 10px 10px 30px 0px;
    }
    li ul {
        max-height: 0; /* Varsayılan olarak gizle */
        overflow: hidden; /* Taşmayı gizle */
        transition: max-height 0.3s ease, opacity 0.3s ease; /* Geçiş animasyonu */
        opacity: 0; /* Görünmez yap */
        list-style: none;
        margin: 0;
        padding: 0;
    }
    
    li ul.open {
        max-height: 500px; /* Yeterince büyük bir değer verin */
        opacity: 1; /* Görünür yap */
        /* left: 20px; */
        position: relative;
        padding-left: 20px;
    }
    li ul.open li:before {
        position: absolute;
        content: '';
        width: 13px;
        height: 3px;
        background: #11a04d;
        bottom: 27px;
        left: -17px;
        z-index: 999999;
    }
    
}

#kvkk-label a {
    pointer-events: auto;
    text-decoration: underline;
}
.service-offer-form-area.col-lg-6 {
    padding: 50px;
    box-shadow: 0px 0px 4px #007130;
}

section.careeer-page .row .col-lg-6 {
    /* box-shadow: 0px 0px 20px; */
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* border-radius: 5px; */
}


@media (max-width: 992px) {
    .service-offer-form-area.col-lg-6 {
        display: block !important;
    }
    
    .form-bottom {
        flex-direction: column;
    }
    
    section.careeer-page .row .col-lg-6 {
        display: block !important;
        width: 100%;
        box-shadow: unset;
        padding: 17px;
    }
    
    section.careeer-page .row .col-lg-6 img {
        max-width: 100%;
    }
}

.popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    padding: 20px;
    background: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    text-align: center;
    display: none;
    z-index: 1000;
}
.popup .close-btn {
    background-color: #ff5e57;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 10px;
}
.popup .close-btn:hover {
    background-color: #ff3b2e;
}
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 999;
}

.popup p {
    padding-bottom: 10px;
}
body.noscroll {
    overflow: hidden;
}


@media (max-width: 992px) {
    div#popup {
        width: 200px;
    }
    
    div#popup img {
        width: 165px;
    }
}


.blog-box {
    position: relative;
    display: block;
    overflow: hidden;
    text-decoration: none;
    cursor: pointer;
}

.blog-box .flow-img {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; 
}

.blog-box .flow-img img {
    width: 100%; 
    height: 100%; 
    object-fit: cover;
    transition: transform 0.3s ease-in-out; 
    transform-origin: center; 
}

.blog-box:hover .flow-img img {
    transform: scale(1.1); 
}


.blog-box {
    position: relative;
    display: block;
    overflow: hidden; 
    text-decoration: none;
    cursor: pointer;
}

.blog-box .flow-img {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; 
}

.blog-box .flow-img img {
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    transition: transform 0.3s ease-in-out;
    transform-origin: center;
}

.blog-box .flow-img::after {
    content: ''; 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); 
    opacity: 0; 
    transition: opacity 0.3s ease; 
    z-index: 1; 
}

.blog-box:hover .flow-img::after {
    opacity: 1;
}

.blog-box .hover-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex; 
    align-items: center; 
    gap: 8px; 
    color: #fff; 
    font-size: 1.5em;
    opacity: 0;
    transition: opacity 0.3s ease; 
    z-index: 2; 
}

.blog-box:hover .hover-content {
    opacity: 1;
}

.blog-box:hover .flow-img img {
    transform: scale(1.1); 
}


.blog-page .form-bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    margin-top: 20px;
}


.content-wrapper a {
    font-weight: 600;
}

a:hover{
    cursor: pointer;
}

.datas-section {
    padding: 30px 0;
    background: #f7f7f7;
    padding-bottom: 80px;
    padding-top: 50px;
}


.works-form .row .col-lg-6 {
    box-shadow: unset !important;
}

.btn-maps.fair-detail-box.detail-katalog {
    margin-top: 43px;
}

.btn-maps.fair-detail-box.detail-katalog a {
    width: 628px;
}

.mt50{
    margin-top: 50px;
}

.fileStyle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
}
@media (max-width: 992px) {
    .btn-maps.fair-detail-box.detail-katalog a {
        width: 100%;
    }
    .fileStyle {
        font-size: 14px;
        font-weight: 600;
    }
    .footer-bottom .fb {
        padding-bottom: 100px;
    }
}

.imgFile {
    position: relative; 
    display: inline-block;
    overflow: hidden;
    text-align: center;
    text-decoration: none; 
    color: inherit;
}

.imgFile img {
    transition: all 0.4s ease;
}

.imgFile span {
    display: block;
    margin-top: 8px;
    font-size: 14px; 
}

.imgFile::before {
    content: ''; 
    position: absolute; 
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    transition: background 0.4s ease; 
    z-index: 1; 
}

.imgFile::after {
    content: '\f25a'; 
    font-family: 'Font Awesome 5 Free';
    font-weight: 900; 
    color: white; 
    font-size: 30px;
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%) scale(0); 
    transition: transform 0.4s ease; 
    z-index: 2; 
    pointer-events: none; 
}

/* Hover durumunda */
.imgFile:hover::before {
    background: rgba(0, 0, 0, 0.4); 
}

.imgFile:hover img {
    transform: scale(1.1);
}

.imgFile:hover::after {
    transform: translate(-50%, -50%) scale(1); 
}

.links {
    flex-wrap: wrap;
}

/* Slider oklarını dışarı taşımak */
.partnerSlider-section {
    position: relative; /* Konteynerin göreli konumunu ayarladık */
}

.partnerSlider .swiper-button-next, 
.partnerSlider .swiper-button-prev {
    color: #000;
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    position: absolute; /* Konumları dışarı taşımak için absolute */
    top: 50%; /* Okları dikeyde ortalamak için */
    transform: translateY(-50%); /* Dikeyde tam ortalamak için */
    z-index: 10;
}

/* Sağ ok */
.partnerSlider-section .swiper-button-next {
    right: -60px; /* Sağ tarafa taşımak için */
}

/* Sol ok */
.partnerSlider-section .swiper-button-prev {
    left: -60px; /* Sol tarafa taşımak için */
}

.partnerSlider 
.swiper-slide img {
    display: block;
    width: auto;
    height: auto;
    object-fit: cover;
    padding: 20px;
    height: auto;
}
.swiper.partnerSlider.swiper-initialized.swiper-horizontal.swiper-backface-hidden {
    padding: 25px;
}

.partnerSlider-section .swiper-button-next, .partnerSlider-section .swiper-button-prev {
    right: -60px;
    background: green;
    color: white;
    padding: 22px;
    font-size: 15px !important;
    border-radius: 50%;
}
.partnerSlider-section .swiper-button-next:after, .partnerSlider-section .swiper-button-prev:after {
    font-size: 24px;
}
@media (max-width: 768px) {
    /* Mobilde okları altta göstermek için */
    .partnerSlider-section .swiper-button-next,
    .partnerSlider-section .swiper-button-prev {
        top: auto; /* Dikeyde ortalama kaldırıldı */
        bottom: -20px; /* Alt kısma taşıyoruz */
        right: auto; /* Sağdan taşıyoruz */
        left: auto; /* Soldan taşıyoruz */
        margin: 0 auto; /* Okları ortalamak için */
        transform: none; /* Yatayda ortalamak için */
    }

    /* Pagination'ı mobilde gizlemek */
    .partnerSlider-section .swiper-pagination {
        display: none;
    }
    .partnerSlider-section .swiper-button-next {
        position: relative;
        left: 12% !important;
        top: -8px !important;
    }
    
    .partnerSlider 
.swiper-slide img {
    padding: 0px;
    min-height: unset   ;
}
    .partnerSlider-section .swiper-button-prev {
        position: relative;
        top: -50px !important;
        left: -12% !important;
    }
    .swiper.partnerSlider.swiper-initialized.swiper-horizontal.swiper-backface-hidden{
        padding: 0;
    }
    section.partnerSlider-section {
        padding: 0;
        padding-top: 30px;
    }
    .partnerSlider-section .swiper-slide {
     height: unset;
    }
}

.row.single-fair-gallery .section-title {
    margin-top: 50px;
}

.modal-center ul.lang-menu {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-left: 25px;
}
.btn-maps.fair-detail-box.detail-katalog a {
    z-index: 1;
    position: relative;
}