@import "/css/reset.css";
.flickity-page-dots {
    display: none !important;
}

@media only screen and (max-width: 5000px) and (min-width: 1600px) {
    .ortala {
        width: 1600px !important;
        margin-left: calc(50% - 800px) !important;
    }
    .galeriresim {
        width: 400px !important;
    }
    .hizmetlerimiz,
    .referanscaro,
    .sektorlercaro {
        padding-left: calc(0% + 16.2%) !important;
        padding-right: calc(0% + 16.2%) !important;
    }
}

@media only screen and (max-width: 5000px) and (min-width: 1200px) {
    .container {
        float: left;
        max-width: 1280px !important;
        margin-left: calc(50% - 640px);
        padding: 0px !important;
    }
    .ortala {
        float: left;
        width: 1280px;
        margin-left: calc(50% - 640px);
    }
    .pcdegizle {
        display: none !important;
    }
    .hakkimizda {
        float: left;
        width: 100%;
        margin-top: 78px;
        background-color: #122b77;
        padding: 50px 0px;
    }
    .hakresimler {
        float: right;
        width: 832px;
    }
    .hakkimizdaresim {
        float: right;
        width: 779px;
        height: 415px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
        margin-right: 53px;
    }
    .hakkimizdaresim img {
        float: left;
        width: 100%;
        height: 100%;
        border-radius: 7px;
        object-fit: cover;
    }
    .hakkimizdaresim2 {
        float: right;
        width: 309px;
        height: 242px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
        margin-top: -184px;
    }
    .hakkimizdaresim2 img {
        float: left;
        width: 100%;
        height: 100%;
        border-radius: 7px;
        object-fit: cover;
    }
    .hakkimizdayazi {
        float: left;
        width: 381px;
    }
    .hakkimizdayazi b {
        float: left;
        width: 100%;
        font-weight: bold;
        font-size: 28px;
        text-align: left;
        color: #fff;
        line-height: normal;
        margin-bottom: 13px;
    }
    .hakkimizdayazi span {
        float: left;
        width: 100%;
        font-weight: normal;
        font-size: 16px;
        line-height: 24px;
        text-align: left;
        color: #fff;
    }
    .hakkimizdayazi a {
        float: left;
        width: 175px;
        height: 58px;
        border-radius: 9px;
        border: 2px solid #fff;
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 15px;
    }
    .hakkimizdayazi a:hover {
        border: 2px solid #0bb2f1;
        background-color: #0bb2f1;
        color: #000;
    }
    .galeri {
        float: left;
        width: 100%;
        margin-top: 100px;
    }
    .galeriresim {
        float: left;
        width: 320px;
        height: 308px;
        overflow: hidden;
    }
    .galeriresim:hover img {
        transform: scale(1.1);
    }
    .galeriresim img {
        float: left;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .5s ease;
    }
    .sliderarkaplan {
        float: left;
        width: 100%;
        height: 520px;
    }
    .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-zoom-container {
        width: 100%;
        height: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        align-items: flex-start;
    }
    .swiper-zoom-target {
        float: left;
        width: 100%;
        height: 692px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }
    .hizmetbaslik {
        float: left;
        width: 100%;
        height: 267px;
        background: #ecfaff;
    }
    .hizmetbaslik b {
        float: left;
        font-weight: bold;
        font-size: 28px;
        text-align: left;
        color: #022d7b;
        margin-top: 44px;
    }
    .hizmetbaslik a {
        float: right;
        height: 40px;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #9e9e9e;
        display: flex;
        align-items: center;
        margin-top: 39px;
    }
    .hizmetbaslik a svg {
        float: right;
        margin-left: 10px;
    }
    .hizmetlerimiz {
        float: left;
        width: 100%;
        padding-left: calc(0% + 2.7%);
        padding-right: calc(0% + 2.7%);
        margin-top: -151px;
    }
    .hizmet {
        float: left;
        width: 100%;
        height: 365px;
        border-radius: 5px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .hizmet:hover .hizmetanabaslik {
        color: #fff;
        background: #022d7b;
    }
    .hizmet b {
        float: left;
        padding: 10px 13px;
        border-radius: 3px;
        background: #fff;
        box-shadow: 0px 3px 6px rgb(0 0 0 / 9%);
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #022d7b;
        position: absolute;
        bottom: 18px;
        left: 17px;
    }
    .sektorler {
        float: left;
        width: 100%;
        padding: 44px 0px 79px 0px;
        background: #ecfaff;
    }
    .sektorbaslik {
        float: left;
        font-weight: bold;
        font-size: 28px;
        text-align: left;
        color: #022d7b;
    }
    .sektorbuton {
        float: right;
        height: 40px;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #9e9e9e;
        display: flex;
        align-items: center;
    }
    .sektorbuton svg {
        float: right;
        margin-left: 10px;
    }
    .sektorlercaro {
        float: left;
        width: 100%;
        padding-left: calc(0% + 2.7%);
        margin-top: 25px;
    }
    .haberlerbaslik {
        float: left;
        width: 40%;
        margin-top: 100px;
    }
    .haberlerbaslik b {
        float: left;
        width: 100%;
        font-weight: bold;
        font-size: 28px;
        text-align: left;
        color: #122b77;
    }
    .haberleralani {
        float: left;
        width: 100%;
        margin-top: -25px;
        margin-bottom: 100px;
    }
    .haberlerbutonvealtbaslik {
        float: left;
        width: 500px;
        margin-top: 50px;
        margin-right: 112px;
    }
    .haberlerbutonvealtbaslik span {
        float: left;
        width: 50%;
        font-weight: normal;
        font-size: 16px;
        line-height: 24px;
        text-align: left;
        color: #2a2a2d;
    }
    .haberlerbutonvealtbaslik a {
        float: left;
        width: 175px;
        height: 58px;
        border-radius: 9px;
        background: transparent;
        border: 2px solid #767b7d;
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        color: #767b7d;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
    }
    .haber {
        float: left;
        width: 566px;
        height: 265px;
        border-radius: 10px 10px 10px 7px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.07);
        display: flex;
        align-items: center;
        margin-top: -47px;
        background-color: #fff;
    }
    .haber:last-child {
        float: right;
    }
    .haber:nth-child(2) {
        margin-bottom: 80px;
    }
    .haber:nth-child(3) {
        margin-left: 47px;
    }
    .haber .haberresim {
        float: left;
        width: 270px;
        margin-left: -46px;
        height: 210px;
        border-radius: 7px 10px 10px 10px;
        overflow: hidden;
    }
    .haber img {
        float: left;
        width: 100%;
        height: 100%;
        border-radius: 7px 10px 10px 10px;
        transition: transform .5s ease;
        object-fit: cover;
    }
    .haber:hover .haberresim img {
        transform: scale(1.1);
    }
    .haber div {
        float: left;
        width: 285px;
        margin-left: 30px;
    }
    .haber div b {
        float: left;
        width: 100%;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #022d7b;
    }
    .haber div p {
        float: left;
        width: 100%;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #97aed9;
        margin: 10px 0px;
    }
    .haber div span {
        float: left;
        width: 100%;
        font-size: 14px;
        line-height: 24px;
        font-weight: 400;
        color: #798879;
    }
    .referansvecozum {
        float: left;
        width: 100%;
        background: #f5f9fb;
        padding: 57px 0px;
    }
    .referanslar {
        float: left;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .referanscaro {
        float: left;
        width: 100%;
        padding-left: calc(0% + 2.7%);
        margin-top: 25px;
    }
    .referanscaro picture {
        float: left;
        width: 100%;
        border-radius: 5px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
    }
    .mt-50 {
        margin-top: 50px;
    }
}

@media only screen and (max-width: 1199px) and (min-width: 0px) {
    .mt-50 {
        margin-top: 50px;
    }
    .referansvecozum {
        float: left;
        width: 100%;
        background: #f5f9fb;
        padding-top: 57px;
        padding-bottom: 57px;
    }
    .referanslar {
        float: left;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .referanscaro {
        float: left;
        width: 100%;
        padding-left: calc(0% + 6.7%);
        margin-top: 25px;
    }
    .referanscaro picture {
        float: left;
        width: 100%;
        border-radius: 5px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
    }
    .referanscaro picture img {
        border-radius: 5px;
    }
    .sektorler {
        float: left;
        width: 100%;
        padding: 44px 0px;
        background: #ecfaff;
        margin-top: 75px;
    }
    .sektorbaslik {
        float: left;
        font-weight: bold;
        font-size: 20px;
        text-align: left;
        color: #022d7b;
    }
    .sektorbuton {
        float: left;
        height: 40px;
        font-weight: 500;
        font-size: 14px;
        text-align: left;
        color: #9e9e9e;
        display: flex;
        align-items: center;
        margin-top: 23px;
        margin-left: calc(0% + 6.7%);
    }
    .sektorbuton svg {
        float: right;
        margin-left: 10px;
    }
    .sektorlercaro {
        float: left;
        width: 100%;
        padding-left: calc(0% + 6.7%);
        margin-top: 25px;
    }
    .haberler {
        float: left;
        padding-left: calc(0% + 6.7%);
        width: 100%;
        margin-top: 28px;
    }
    .hakkimizda {
        float: left;
        width: 100%;
        margin-top: 50px;
    }
    .hakresimler {
        float: right;
        width: 100%;
    }
    .hakkimizdaresim {
        float: right;
        width: 100%;
        height: 287px;
    }
    .hakkimizdaresim img {
        float: left;
        width: 100%;
        height: 100%;
        border-radius: 7px;
        object-fit: cover;
    }
    .hakkimizdaresim2 {
        display: none !important;
    }
    .hakkimizdayazi {
        float: left;
        width: 100%;
        margin-top: 25px;
    }
    .hakbaslik {
        float: left;
        width: 100%;
        font-weight: bold;
        font-size: 24px;
        text-align: left;
        color: #122b77;
        line-height: normal;
        margin-bottom: 13px;
    }
    .hakkimizdayazi span {
        float: left;
        width: 100%;
        font-weight: normal;
        font-size: 14px;
        line-height: 24px;
        text-align: left;
        color: #2a2a2d;
    }
    .hakkimizdayazi a {
        float: left;
        width: 175px;
        height: 58px;
        border-radius: 9px;
        border: 2px solid #767b7d;
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        color: #767b7d;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 15px;
    }
    .hizmetbaslik {
        float: left;
        width: 100%;
        height: 267px;
        background: #ecfaff;
    }
    .hizmetbaslik b {
        float: left;
        font-weight: bold;
        font-size: 20px;
        text-align: left;
        color: #022d7b;
        margin-top: 44px;
    }
    .hizmetbaslik a {
        float: right;
        height: 40px;
        font-weight: 500;
        font-size: 14px;
        text-align: left;
        color: #9e9e9e;
        display: flex;
        align-items: center;
        margin-top: 33px;
    }
    .hizmetbaslik a svg {
        float: right;
        margin-left: 10px;
    }
    .mobiltumugor {
        float: left;
        height: 40px;
        font-weight: 500;
        font-size: 14px;
        text-align: left;
        color: #9e9e9e;
        display: flex;
        align-items: center;
        margin-top: 23px;
        margin-left: calc(0% + 6.7%);
    }
    .mobiltumugor svg {
        float: right;
        margin-left: 10px;
    }
    .hizmetlerimiz {
        float: left;
        width: 100%;
        padding-left: calc(0% + 6.7%);
        margin-top: -181px;
    }
    .hizmet {
        float: left;
        width: 100%;
        height: 365px;
        border-radius: 5px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .hizmet b {
        float: left;
        padding: 10px 13px;
        border-radius: 3px;
        background: #fff;
        box-shadow: 0px 3px 6px rgb(0 0 0 / 9%);
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #022d7b;
        position: absolute;
        bottom: 18px;
        left: 17px;
    }
    .haberleralani {
        float: left;
        width: 100%;
        margin-bottom: 20px;
    }
    .haberlerbaslik {
        float: left;
        width: 100%;
        margin-top: 56px;
    }
    .haberlerbaslik b {
        float: left;
        width: 100%;
        font-size: 20px;
        line-height: normal;
        font-weight: 800;
        color: #030277;
    }
    .haberlerbutonvealtbaslik {
        float: left;
        width: 100%;
        margin-top: 10px;
    }
    .haberlerbutonvealtbaslik span {
        float: left;
        width: 100%;
        font-size: 14px;
        font-weight: 400;
        color: #798879;
        line-height: 26px;
    }
    .haberlerbutonvealtbaslik a {
        float: left;
        width: 175px;
        height: 58px;
        border-radius: 9px;
        background: transparent;
        border: 2px solid #767b7d;
        font-weight: bold;
        font-size: 16px;
        text-align: left;
        color: #767b7d;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 20px;
    }
    .haber {
        float: left;
        width: 100%;
        /* height: 265px; */
        border-radius: 10px 10px 10px 7px;
        /* display: flex; */
        /* align-items: center; */
        margin-top: 30px;
        background-color: #fff;
    }
    .haber img {
        float: left;
        width: 100%;
        height: 181px;
        border-radius: 7px 10px 10px 10px;
        /* margin-left: -46px; */
        object-fit: cover;
        margin-top: -20px;
    }
    .haber div {
        float: left;
        width: 100%;
        /* margin-left: 30px; */
        margin-top: 24px;
    }
    .haber div b {
        float: left;
        width: 100%;
        font-size: 16px;
        font-weight: 500;
        color: #030277;
        line-height: normal;
    }
    .haber div p {
        float: left;
        width: 100%;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        color: #97aed9;
        margin: 9px 0px;
    }
    .haber div span {
        float: left;
        width: 100%;
        font-size: 14px;
        line-height: 24px;
        font-weight: 400;
        color: #798879;
        height: 96px;
        overflow: hidden;
    }
    .ortala {
        float: left;
        width: 100%;
        padding: 0px 10px;
    }
    .container {
        float: left;
        width: 100%;
        padding: 0px 25px;
    }
    .mobildegizle {
        display: none !important;
    }
    .sliderarkaplan {
        float: left;
        width: 100%;
        height: 350px;
    }
    .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-zoom-container {
        width: 100%;
        height: 100%;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        -ms-flex-align: center;
        align-items: flex-start;
    }
    .swiper-zoom-target {
        float: left;
        width: 100%;
        height: 350px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }
    .slideryazi {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 180px;
        background: rgb(0, 174, 239);
        background: linear-gradient(0deg, rgba(0, 174, 239, 1) 50%, rgba(255, 255, 255, 0) 100%);
        padding: 50px 20px 0px 20px;
    }
    .slideryazi b {
        float: left;
        width: 100%;
        font-weight: bold;
        font-size: 22px;
        text-align: left;
        color: #fff;
        line-height: normal;
    }
    .slideryazi span {
        float: left;
        width: 100%;
        height: 79px;
        overflow: hidden;
        font-weight: normal;
        font-size: 16px;
        line-height: 24px;
        text-align: left;
        color: #fff;
    }
    .galeri {
        float: left;
        width: 100%;
        margin-top: 70px;
    }
    .galeriresim {
        float: left;
        width: 48%;
        height: 152px;
        overflow: hidden;
        margin-right: 2%;
        margin-bottom: 2%;
    }
    .galeriresim:nth-child(3n+0) {
        margin-right: 0%;
    }
    .galeriresim:hover img {
        transform: scale(1.1);
    }
    .galeriresim img {
        float: left;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .5s ease;
    }
}