﻿header.top-header {
    background: #eee;
}

    header.top-header .container {
        height: 50px;
    }

        header.top-header .container ul {
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            list-style: none;
        }

            header.top-header .container ul li a {
                width: 30px;
                height: 30px;
                display: flex;
                align-items: center;
                justify-content: center;
                text-decoration: none;
                background-color: #194b87;
                color: #fff;
                margin-right: .5rem;
            }

            header.top-header .container ul li:nth-child(1) a {
                background-color: #3d5998;
            }

            header.top-header .container ul li:nth-child(2) a {
                background-color: #54abee;
            }

            header.top-header .container ul li:nth-child(3) a {
                background-color: #da2b26;
            }

            header.top-header .container ul li:nth-child(4) a {
                background-color: #f60273;
            }

header.header {
    background: #ffffff !important;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    box-shadow: 0 2px 12px 2px rgba(0, 0, 0, 0.2);
}

    header.header .navbar .nav-link {
        text-transform: uppercase;
        font-weight: 600 !important;
        background: #d9f1f2 !important;
        color: #28888e !important;
        padding: 0.5rem 0.75rem !important;
        margin-right: 0.5rem !important;
        font-size: 0.8rem !important;
    }

        header.header .navbar .nav-link.active,
        header.header .navbar .nav-link:hover {
            background: #41b8c0 !important;
            color: white !important;
        }

.modal-header {
    justify-content: right;
}

header.header .navbar .nav-link::before,
header.header .navbar .nav-link::after {
    display: none !important;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 600px;
        margin: 1.75rem auto;
    }
}

.text-primary {
    color: var(--color-primary) !important;
}

.home-slider {
    padding: 0 !important;
    margin-top: -50px !important;
    background: url(../img/slider-bg.png) !important;
    background-size: cover !important;
    background-position: center;
    background-repeat: no-repeat !important;
}

    .home-slider .container .row {
        margin-top: 2.5rem;
        border-radius: 1rem;
        background: rgba(255, 255, 255, 0.15);
        padding: 1rem 0.75rem !important;
    }

    .home-slider .container {
        padding: 30px 1.5rem
    }


.featured-services.services .service-item {
    display: flex;
    flex-direction: column;
    background: white !important;
    justify-content: space-evenly !important;
    align-items: center !important;
    flex: 1;
    color: #f8f8f8 !important;
    background-image: url(../img/btn-bg.png) !important;
    background-size: cover !important;
    background-color: var(--color-primary) !important
}

    .featured-services.services .service-item a,
    .featured-services.services .service-item i {
        color: inherit !important;
    }


.recent-blog-posts {
    padding: 25px 0 !important;
    background: #f8f8f8 !important;
}

    .recent-blog-posts .section-header {
        padding: 0 !important;
        margin-bottom: 0 !important;
    }

    .recent-blog-posts h2 {
        color: #28888e !important;
        font-weight: 700 !important;
        font-size: 1.45rem !important;
    }

.post-box {
    overflow: visible !important;
}

    .post-box .post-img {
        box-shadow: 0 0 12px 2px rgba(0, 0, 0, 0.2);
    }

    .post-box .meta .post-date {
        font-size: 0.95rem !important;
        font-weight: 600 !important;
        color: #323232 !important
    }

    .post-box .post-title {
        color: #50433d !important
    }

    .post-box .readmore {
        padding: 0.5rem !important;
        width: max-content !important;
        display: inline-block !important;
        background: #41b8c0 !important;
        color: #fff !important;
    }

.footer .container {
    min-height: 50px;
}

    .footer .container ul {
        display: flex;
        align-items: center;
        list-style: none;
    }

        .footer .container ul li a {
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            background-color: #194b87;
            color: #fff;
            margin-right: .5rem;
        }

        .footer .container ul li:nth-child(1) a {
            background-color: #3d5998;
        }

        .footer .container ul li:nth-child(2) a {
            background-color: #ff0033;
        }

        .footer .container ul li:nth-child(3) a {
            background: linear-gradient(45deg, rgb(255, 220, 128), /* sarı */
            rgb(255, 94, 58), /* turuncu */
            rgb(193, 53, 132), /* pembe */
            rgb(131, 58, 180)); /* mor */
        }


        .footer .container ul li:nth-child(4) a {
            background-color: #f60273;
        }

.resim-container {
    display: flex; /* Resimleri yatayda hizalar */
}

.resim {
    max-width: 50%; /* Resimleri eşit genişlikte yapar */
    height: auto; /* Oranları korumak için */
}

.metin {
    text-align: left; /* Metni sola yaslar */
}

.kayan-yazi {
    --space: 0rem;
    display: grid;
    align-content: center;
    overflow: hidden;
    gap: var(--space);
    width: 100%;
    font-family: "Corben", system-ui, sans-serif;
    font-size: 1.35rem;
    line-height: 1.5;
    margin-top: 40px
}

.marquee {
    --duration: 15s;
    --gap: var(--space);
    display: flex;
    overflow: hidden;
    user-select: none;
    gap: 2.4rem;
}

    .marquee:hover .marquee_group {
        animation-play-state: paused;
    }


.marquee_group {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: var(--gap);
    min-width: 100%;
    animation: scroll var(--duration) linear infinite;
}

    .marquee_group span::after {
        content: "•";
        margin: 0px 25px;
        color: #50433d
    }



@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-100% - var(--gap)));
    }
}

.social-text {
    color: #ffffff !important;
}

header.header .navbar .nav-link.active, header.header .navbar .nav-link:hover {
    background: #f03d42 !important;
}

header.header .navbar .nav-link {
    background: #989898 !important;
    color: #ffffff !important;
}

.recent-blog-posts h2 {
    color: #50433d !important
}

.post-box .readmore {
    background: #f03d42 !important
}

a {
    color: #f03d42;
}

    a:hover {
        color: #eb787b;
    }

#preloader:before, #preloader:after {
    border: 4px solid #50433d;
}

.portfolio .portfolio-flters li:hover, .portfolio .portfolio-flters li.filter-active {
    color: #f03d42;
}

.contact .info-item i {
    color: #f03d42;
}

.alert table {
    margin-bottom: 0px;
    vertical-align: middle
}

    .alert table .btn-success {
        color: #fff;
        background-color: #741e17 !important;
        border-color: #741e17 !important;
    }

.btn-site {
    color: #ffffff;
    background-color: #f03d42;
    border-color: #f03d42;
}

    .btn-site:hover {
        color: #FFF;
        background-color: #989898;
        border-color: #989898;
    }

    .btn-site:focus {
        outline: 0;
        box-shadow: 0 0 0 0.25rem #50433d21;
    }


.btn-site1 {
    color: #e2d7d2;
    background-color: #f03d42;
    border-color: #f03d42;
}

    .btn-site1:hover {
        color: #FFF;
        background-color: #1d1d1d;
        border-color: #1d1d1d;
    }

    .btn-site1:focus {
        outline: 0;
        box-shadow: 0 0 0 0.25rem #50433d21;
    }
