@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;600;700&display=swap');

body{
    font-family: 'Mulish', sans-serif;
}

/* =========================
   General
========================= */

.harita iframe{
    width:100%;
    height:100%;
}

.logo{
    width:120px;
    height:35px;
    object-fit:contain;
}

.hero_logo{
    aspect-ratio:16/10;
}

.slider_img{
    aspect-ratio:16/11;
    object-fit:cover;
}

.icon_hizmet{
    width:50px;
    aspect-ratio:1/1;
    object-fit:cover;
}

.icon_sosyal{
    width:25px;
    aspect-ratio:1/1;
    object-fit:cover;
}

/* =========================
   Theme Colors
========================= */

:root{
    --primary-color:#fdb900;
    --secondary-color:#0e2b5c;
}

.bg_sari{
    background:var(--primary-color);
}

.c-sari{
    color:var(--primary-color);
}

.bg_mavi{
    background:var(--secondary-color);
}

.c_mavi{
    color:var(--secondary-color);
}

.footer_color{
    background:#081e45;
}

/* =========================
   Hero Slider
========================= */

.swiper{
    width:100%;
}

.swiper-slide{
    cursor:pointer;
}

/* Image */

.slider_ana{
    width:100%;
    height:100%;
    object-fit:cover;
    aspect-ratio:16/5;
    position:absolute;
    inset:0;
}

/* Overlay */

.over_slide{
    position:relative;
    overflow:hidden;
}

.over_slide::before{
    content:"";
    position:absolute;
    inset:0;

    /* Premium dark blue gradient */
    background:linear-gradient(
        to right,
        rgba(6,24,55,.88),
        rgba(6,24,55,.65),
        rgba(6,24,55,.35)
    );

    z-index:1;
}

/* Text Container */

.capture{
    position:relative;
    z-index:2;

    display:flex;
    align-items:center;

    height:450px;
}

.capture .container{
    position:relative;
    z-index:2;
}

.capture h1{
    color:#fff;
    text-shadow:0 5px 18px rgba(0,0,0,.55);
}

.capture p{
    color:#fff;
    text-shadow:0 2px 10px rgba(0,0,0,.45);
}

/* =========================
   Swiper Buttons
========================= */

.swiper-button-prev,
.swiper-button-next{
    color:#fff;
}

.swiper-pagination-bullet-active{
    background:#fdb900;
}

/* =========================
   Services
========================= */

.hakkimizda{
    width:100%;
    height:auto;
}

.hizmet_eft{
    transition:.35s;
}

.hizmet_eft:hover{
    border-color:#fdb900 !important;
    transform:translateY(-8px);
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.hizmet_eft:hover span{
    color:#fdb900;
}

/* =========================
   Blog
========================= */

.blog{
    height:auto;
}

.blog .swiper-slide{
    cursor:context-menu;
}

/* =========================
   Background Section
========================= */

.bg_hizmet{
    background-image:url("http://7oroof.com/demos/eteon/assets/images/backgrounds/map.png");
    background-size:cover;
    background-position:center;
    background-color:#f9f9f9;
}

/* =========================
   Misc
========================= */

.a_icon{
    width:35px;
    height:35px;
    line-height:35px;
}

.menu_link{
    transition:.3s;
}

.menu_link:hover{
    color:#fdb900 !important;
}

.slider_div{
    top:50%;
    z-index:5000;
    transform:translateY(-50%);
}

.carausel_detay{
    top:50%;
    left:15%;
    transform:translateY(-50%);
}

.columcunt{
    column-count:2;
}

/* =========================
   Responsive
========================= */

@media (max-width:992px){

    .capture{
        height:350px;
    }

    .capture h1{
        width:100% !important;
        font-size:2.5rem;
    }

    .capture p{
        width:75% !important;
    }

}

@media (max-width:768px){

    .slider_ana{
        aspect-ratio:16/9;
    }

    .capture{
        height:250px;
    }

    .capture h1{
        font-size:1.8rem;
        width:100% !important;
    }

    .capture p{
        width:100% !important;
        font-size:15px;
    }

}

@media (max-width:600px){

    .swiper{
        height:220px;
    }

    .capture{
        display:flex;
        height:220px;
        text-align:center;
    }

    .capture .container{
        padding:0 20px;
    }

    .capture h1{
        font-size:1.4rem;
    }

    .capture p{
        display:none;
    }

    .swiper-button-prev,
    .swiper-button-next{
        display:none;
    }

}