/* Logo Slider */

.logo-slider {
    background: white;
    -webkit-box-shadow: 0 0px 0px 0px rgba(0, 0, 0, 0.125);
    box-shadow: 0 0px 0px 0px rgba(0, 0, 0, 0.125);
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.logo-slider::before,
.logo-slider::after {
    background: -webkit-gradient(linear, left top, right top, from(white), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
    content: "";
    height: 175px;
    position: absolute;
    width: 200px;
    z-index: 2;
}

.logo-slider::after {
    right: 0;
    top: 0;
    -webkit-transform: rotateZ(180deg);
    transform: rotateZ(180deg);
}

.logo-slider::before {
    left: 0;
    top: 0;
}

.logo-slider .logo-slide-track {
    -webkit-animation: logo-scroll 60s linear infinite;
    animation: logo-scroll 60s linear infinite;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: calc(450px * 14);
    animation-duration: 30s;
    animation-iteration-count: infinite;
}

.logo-slider .slide {
    height: 150px;
    width: 250px;
    padding: 20px;
}

@-webkit-keyframes logo-scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        -webkit-transform: translateX(calc(-250px * 7));
        transform: translateX(calc(-250px * 7));
    }
}

@keyframes logo-scroll {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    100% {
        -webkit-transform: translateX(calc(-250px * 7));
        transform: translateX(calc(-250px * 7));
    }
}

#siva-filesi {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#siva-filesi::before {
    content: "";
    filter: brightness(70%);
    position: absolute;
    background-image: url(imgs/marinas-sıva-filesi.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#siva-filesi:hover::before {
    opacity: 1;
}

#siva-filesi:hover {
    color: white;
}

#siva-filesi h3 {
    position: relative;
    font-size: 25px;
}

#siva-filesi p {
    position: relative;
    padding: 20px;
}

#jotun-boya {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#jotun-boya::before {
    content: "";
    filter: brightness(50%);
    position: absolute;
    background-image: url(imgs/marinas-jotun-boya.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#jotun-boya:hover::before {
    opacity: 1;
}

#jotun-boya:hover {
    color: white;
}

#jotun-boya h3 {
    position: relative;
    font-size: 25px;
}

#jotun-boya p {
    position: relative;
    padding: 20px;
}

#cephe-kaplama {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#cephe-kaplama::before {
    content: "";
    filter: brightness(50%);
    position: absolute;
    background-image: url(imgs/marinas-cephe-yalitim.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#cephe-kaplama:hover::before {
    opacity: 1;
}

#cephe-kaplama:hover {
    color: white;
}

#cephe-kaplama h3 {
    position: relative;
    font-size: 25px;
}

#cephe-kaplama p {
    position: relative;
    padding: 20px;
}

#cati-kaplama {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#cati-kaplama::before {
    content: "";
    filter: brightness(50%);
    position: absolute;
    background-image: url(imgs/marinas-cati-kaplama.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#cati-kaplama:hover::before {
    opacity: 1;
}

#cati-kaplama:hover {
    color: white;
}

#cati-kaplama h3 {
    position: relative;
    font-size: 25px;
}

#cati-kaplama p {
    position: relative;
    padding: 20px;
}

#profiller {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#profiller::before {
    content: "";
    filter: brightness(80%);
    position: absolute;
    background-image: url(imgs/marinas-profiller.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#profiller:hover::before {
    opacity: 1;
}

#profiller:hover {
    color: white;
}

#profiller h3 {
    position: relative;
    font-size: 25px;
}

#profiller p {
    position: relative;
    padding: 20px;
}

#isi-yalitim {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#isi-yalitim::before {
    content: "";
    filter: brightness(80%);
    position: absolute;
    background-image: url(imgs/marinas-isi-yalitim.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#isi-yalitim:hover::before {
    opacity: 1;
}

#isi-yalitim:hover {
    color: white;
}

#isi-yalitim h3 {
    position: relative;
    font-size: 25px;
}

#isi-yalitim p {
    position: relative;
    padding: 20px;
}

#alci-alcipan {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#alci-alcipan::before {
    content: "";
    filter: brightness(80%);
    position: absolute;
    background-image: url(imgs/marinas-alci-alcipan.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#alci-alcipan:hover::before {
    opacity: 1;
}

#alci-alcipan:hover {
    color: white;
}

#alci-alcipan h3 {
    position: relative;
    font-size: 25px;
}

#alci-alcipan p {
    position: relative;
    padding: 20px;
}

#su-yalitim {
    border-radius: 25px;
    border: 0.5px solid rgb(133, 133, 133);
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
}

#su-yalitim::before {
    content: "";
    filter: brightness(80%);
    position: absolute;
    background-image: url(imgs/marinas-su-yalitim.jpg);
    background-size: cover;
    background-position: top center;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    opacity: 0;
    transition: 0.5s;
    border-radius: 24px;
}

#su-yalitim:hover::before {
    opacity: 1;
}

#su-yalitim:hover {
    color: white;
}

#su-yalitim h3 {
    position: relative;
    font-size: 25px;
}

#su-yalitim p {
    position: relative;
    padding: 20px;
}

.map-container {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}

.map-container iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

.contact {
    background-color: white;
}

.iletisim {
    padding: 40px;
}

.hakkimizda {
    margin-top: 20;
}

.about {
    background-color: white;
    color: black;
}

.products {
    background-color: white;
}