﻿/*#region Pading*/
.pt-7y {
    padding-top: 7%;
}


.pt-2y {
    padding-top: 2%;
}

.pt-4y {
    padding-top: 4%;
}

.pt-10y {
    padding-top: 10%;
}


.p-3y {
    padding: 3%;
}

.pl-4y {
    padding-left: 4%;
}


/*#endregion*/


/*#region Margin*/

.m-b-2y {
    margin-bottom: 2%;
}

.ml-5px {
    margin-left: 5px;
}

.mobile-mt-60px {
    margin-top: auto;
}

/*#endregion*/

.poster1 {
    /* The image used */
    background-color: #cccccc; /* Used if the image is unavailable */
    min-height: 500px; /* You must set a specified height */
    height: auto;
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}


.h-50vw {
    height: 50vw;
}

.h-48vw {
    height: 48vw;
}

.h-30vw {
    height: 30vw;
}


.h-60vw {
    height: 60vw;
}


.section1 {
    padding: 0px 0px !important;
}

.text-div {
}

.wd-155px {
    width: 155px;
}

.my-title-div {
    margin-top: 10px;
}


    .my-title-div h1, .my-title-div h2 {
        font-family: 'Montserrat', sans-serif;
    }


.my-content-div {
    position: relative;
    width: 100%;
}

.mt-20y {
    margin-top: 20%;
}

.h-100y {
    height: 100%;
}

.wd-100-y {
    width: 100%;
}

.wd-83-y {
    width: 83%;
}

.my-text-div {
    width: 100%;
}



.losorucevap-div {
    padding: 200px 0px 0px 100px;
}


.bg-aliceblue {
    background-color: aliceblue;
}


.my-card1-a, .my-card1-a:hover {
    text-decoration: none;
    color: #121168;
}



.my-card-1 {
    border: 1px solid #121168;
    padding: 5px 5px 0px 5px;
    width: 100%;
    min-height: 37px;
    height: auto;
    margin-bottom: 15px;
}

    .my-card-1:hover {
        border: 1px outset var(--renk7);
    }

.card-img-sp {
    float: left;
    width: auto;
    margin-right: 7px;
    color: black;
}

    .card-img-sp img {
        max-width: 26px;
        height: auto;
    }

.card-text-sp {
    color: black;
    font-size: 13px;
}


.basindan-img {
    text-align: left;
    width: 350px;
    height: auto;
}

.v-h-center {
    position: absolute;
    top: 50%;
    left: 46%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

.soylesi-devam-button-div {
    position: relative;
    bottom: 0px;
    right: 0px;
    width: 100%;
    height: auto;
    min-height: 50px;
    text-align: right;
}

/*#region Color*/

.cl-black {
    color: black !important;
}

/*#endregion*/



/*#region BG Color */


.bg-renk1 {
    background-color: var(--renk1);
}

.bg-renk2 {
    background-color: var(--renk2);
}

.bg-renk3 {
    background-color: var(--renk3);
}

.bg-renk4 {
    background-color: var(--renk4);
}

.bg-renk5 {
    background-color: var(--renk5);
}

.bg-renk6 {
    background-color: var(--renk6);
}

.bg-renk7 {
    background-color: var(--renk7);
}

.bg-renk8 {
    background-color: var(--renk8);
}

.bg-renk9 {
    background-color: var(--renk9);
}

.bg-renk10 {
    background-color: var(--renk10);
}

.bg-renk11 {
    background-color: var(--renk11);
}

.bg-renk12 {
    background-color: var(--renk12);
}

.bg-renk13 {
    background-color: var(--renk13);
}

.bg-renk14 {
    background-color: var(--renk14);
}

.bg-renk15 {
    background-color: var(--renk15);
}

.bg-renk16 {
    background-color: var(--renk16);
}

.bg-renk17 {
    background-color: var(--renk17);
}

.bg-renk18 {
    background-color: var(--renk18);
}

.bg-renk19 {
    background-color: var(--renk19);
}

.bg-renk20 {
    background-color: var(--renk20);
}

.bg-renk21 {
    background-color: var(--renk21);
}

.bg-renk22 {
    background-color: var(--renk22);
}

.bg-renk23 {
    background-color: var(--renk23);
}

.bg-renk24 {
    background-color: var(--renk24);
}

.bg-renk25 {
    background-color: var(--renk25);
}

.bg-renk26 {
    background-color: var(--renk26);
}

.bg-renk27 {
    background-color: var(--renk27);
}

.bg-renk28 {
    background-color: var(--renk28);
}

.bg-renk29 {
    background-color: var(--renk29);
}

.bg-renk30 {
    background-color: var(--renk30);
}

.bg-renk31 {
    background-color: var(--renk31);
}

.bg-renk32 {
    background-color: var(--renk32);
}

.bg-renk33 {
    background-color: var(--renk33);
}

.bg-renk34 {
    background-color: var(--renk34);
}

.bg-renk35 {
    background-color: var(--renk35);
}

.bg-renk36 {
    background-color: var(--renk36);
}

.bg-renk37 {
    background-color: var(--renk37);
}

.bg-renk38 {
    background-color: var(--renk38);
}

.bg-renk39 {
    background-color: var(--renk39);
}

.bg-renk40 {
    background-color: var(--renk40);
}

.bg-renk41 {
    background-color: var(--renk41);
}

.bg-renk42 {
    background-color: var(--renk42);
}


/*#endregion*/


.logo-div {
    position: fixed;
    top: 5px;
    left: 5px;
}



@media only screen and (min-width:1000px) {

    #hero {
        padding-top: 200px;
    }


    .my-content-div {
        padding: 30px 100px;
    }

    .h180p {
        min-height: 120px;
        height: auto;
        width: 100%;
    }

    .swiper-container {
        height: 45vw;
    }

    .pt-section1 {
        padding-top: 40px;
        position: relative;
    }

    .pt-7y {
        padding-top: 7%;
    }
}

@media only screen and (max-width: 1400px) {

    #hero {
        padding-top: 70px;
    }

    .h180p {
        min-height: 180px;
        height: auto;
        width: 100%;
    }

    .swiper-container {
        height: 800px;
    }

    .pt-section1 {
        padding-top: 30px;
        position: relative;
    }

    .sc-max-1400-pt-1-5y {
        padding-top: 1.5%;
    }


    .sc-max-1400-pt-1y {
        padding-top: 1%;
    }

    .fp-slidesNav.bottom {
        bottom: 15px !important;
    }

    h1 {
        font-size: 30px !important;
    }

    h2 {
        font-size: 25px !important;
    }

    .my-content-div {
        padding: 30px 50px !important;
    }

    .v-h-center {
        position: absolute;
        top: 45%;
        left: 50%;
        -moz-transform: translateX(-50%) translateY(-50%);
        -webkit-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
    }

    .pt-7y {
        padding-top: 3%;
    }

    .my-content-div {
        padding: 10px 10px !important;
    }

    .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
        margin-bottom: .4rem !important;
    }

    .h-48vw {
        height: 44vw;
    }
}



@media only screen and (max-width: 768px) {

    #hero {
        padding-top: 20px;
    }

    .pt-section1 {
        padding-top: 160px;
        position: relative;
    }

    .v-h-center {
        position: relative;
    }

    #header {
        height: 105px;
        position: relative;
        top: 30px;
        left: 20px;
        width: 100%;
    }

    .pt-7y {
        padding-top: 2%;
    }

    .my-content-div {
        padding: 30px 0px !important;
    }

    .form-element-div {
        line-height: 30px !important;
    }

    .div-form {
        padding: 10px !important;
    }

    .l-h50px {
        line-height: 50px !important;
    }

    .w33y {
        width: 33% !important;
    }

    .mobile-mt-60px {
        margin-top: 60px !important;
    }

    .mobile-tb-15px {
        margin-bottom: 15px;
        margin-top: 15px;
    }

    .aos-init {
        margin-bottom: 15px;
        margin-top: 15px;
    }

    .mobile-hide {
        display: none;
    }

    .logo-div {
        position: absolute !important;
        top: -15px !important;
        left: 5px;
    }
}




.my-section .scroll-arrow-down {
    position: relative;
    bottom: 65px;
    left: 50%;
    z-index: 2;
    display: inline-block;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    color: #000;
    font: normal 400 20px/1 'Josefin Sans', sans-serif;
    letter-spacing: .1em;
    text-decoration: none;
    transition: opacity .3s;
}

    .my-section .scroll-arrow-down:hover {
        opacity: .5;
    }

.text-l {
    text-align: left !important;
}

/*.my-section .scroll-arrow-down {
    padding-top: 0px;
}*/

.my-section .scroll-arrow-down span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    border-left: 1px solid #000;
    border-bottom: 1px solid #000;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb05 1.5s infinite;
    animation: sdb05 1.5s infinite;
    box-sizing: border-box;
}

@-webkit-keyframes sdb05 {
    0% {
        -webkit-transform: rotate(-45deg) translate(0, 0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        -webkit-transform: rotate(-45deg) translate(-20px, 20px);
        opacity: 0;
    }
}

@keyframes sdb05 {
    0% {
        transform: rotate(-45deg) translate(0, 0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        transform: rotate(-45deg) translate(-20px, 20px);
        opacity: 0;
    }
}



#topbar {
    background: #fff;
    padding: 10px 0;
    /*border-bottom: 1px solid #eee;*/
    font-size: 14px;
    position: absolute;
    top: 0px;
    height: 33px;
    width: 100%;
    z-index: 56;
}


#header {
    height: 45px;
    transition: all 0.5s;
    transition: all 0.5s;
    padding: 5px 0;
    background: #fff;
    z-index: 997;
    position: absolute;
    top: 33px;
    width: 100%;
}

    #header .logo h1 {
        font-size: 25px;
        margin: 0;
        padding: 0px 0;
        line-height: 1;
        font-weight: 400;
        letter-spacing: 3px;
        text-transform: uppercase;
    }


.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: 1rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: inherit;
}


.el-yazisi {
    font-family: 'Dancing Script', cursive;
    font-size: 30px;
    font-weight: 700;
}

.text-bold {
    font-weight: 700;
}


.border-b-1-solid {
    border-bottom: 1px solid #eee;
    height: 23px;
}


.back-img {
    display: block;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.50)),url("/Content/img/son/Banner.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: contain;
    height: 55vh;
    width: 100%;
}

.back-img-blog {
    display: block;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.50)),url("/Content/img/son/blog1b.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    height: 55vh;
    width: 100%;
}


.back-img-enki {
    display: block;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.50)),url("/Content/img/son/enkibg.jpg");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    height: 55vh;
    width: 100%;
}


.w-auto {
    width: auto;
}


@media (max-width : 1125px) and (min-width : 968px) {
    .nav-menu {
        width: 70% !important;
    }
}



@media only screen and (max-width: 1300px) and (min-width: 1000px) {

    .containers {
        width: 100% !important;
    }

    .nav-menu a {
        display: block;
        position: relative;
        color: #444444;
        font-weight: 500;
        padding: 12px 8px !important;
        transition: 0.3s;
        font-size: 13px !important;
        font-family: "Open Sans", sans-serif;
    }

    .back-img {
        height: 43vh;
    }
}


@media only screen and (max-width: 1450px) and (min-width: 1300px) {

    .containers {
        width: 98% !important;
    }

    .poster1 {
        min-height: 400px !important;
    }
}
