/* Fontlar */
@font-face {
    font-family: CredC;
    src: url("../fonts/credc.woff");
}
@font-face {
    font-family: "Geakosa Regular";
    src: url("../fonts/geakosa-regular.woff");
}
@font-face {
    font-family: "Geakosa Outline";
    src: url("../fonts/geakosa-outline.woff");
}
@font-face {
    font-family: "Geakosa Oblique Outline";
    src: url("../fonts/geakosa-oblique-outline.woff");
}
@font-face {
    font-family: "Geakosa Oblique";
    src: url("../fonts/geakosa-oblique.woff");
}
@font-face {
    font-family: "Octarine Bold";
    src: url("../fonts/octarine-bold.otf");
}
@font-face {
    font-family: "Octarine Bold Oblique";
    src: url("../fonts/octarine-boldoblique.otf");
}
@font-face {
    font-family: "Octarine Light";
    src: url("../fonts/octarine-light.otf");
}
@font-face {
    font-family: "Octarine Light Oblique";
    src: url("../fonts/octarine-lightoblique.otf");
}
@font-face {
    font-family: "League Gothic Condensed Italic";
    src: url("../fonts/leaguegothic-condenseditalic.otf");
}
@font-face {
    font-family: "League Gothic Condensed Regular";
    src: url("../fonts/leaguegothic-condensedregular.otf");
}
@font-face {
    font-family: "League Gothic Italic";
    src: url("../fonts/leaguegothic-italic.otf");
}
@font-face {
    font-family: "League Gothic Regular";
    src: url("../fonts/leaguegothic-regular.otf");
}

/* Animations */
@keyframes head_phone_up_down {
    0%{
       bottom: 20px;
    }
    50%{
        bottom: 30px;
    }
    100%{
        bottom: 20px;
    }
}
@keyframes marquee {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-50%, 0, 0);
    }
}
@keyframes marquee-2 {
     0% {
         transform: translate3d(-20%, 0, 0);
     }
     100% {
         transform: translate3d(-50%, 0, 0);
     }
 }

*{
    margin: 0;
    padding: 0;
}
:focus{
    outline: none;
}
input[type="email"] , input[type="text"] , input[type="password"] , input[type="time"] , select , textarea{
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 10px;
    font-family: Poppins, sans-serif;
}
#container{
    width: 1200px;
    margin: 0 auto;
}
#clear{
    clear: both;
}

/* Butonlar */
.turuncu-buton{
    padding: 10px 20px;
    border: 0;
    font-family: Poppins , sans-serif;
    font-size: 13px;
    background: #f79829;
    border-radius: 10px;
    cursor: pointer;
    transition: .2s ease-in-out;
    font-weight: 500;
    color: black;
    text-decoration: none;
}
.turuncu-buton i , .yesil-buton i , .kirmizi-buton i{
    margin-right: 5px;
}
.turuncu-buton:hover{
    background: black;
    color: #f79829;
}
.yesil-buton{
    padding: 10px 20px;
    border: 0;
    font-family: Poppins , sans-serif;
    font-size: 13px;
    background: #00ff00;
    border-radius: 10px;
    cursor: pointer;
    transition: .2s ease-in-out;
    font-weight: 500;
    color: white;
    text-decoration: none;
}
.yesil-buton:hover{
    background: #00d700;
}
.kirmizi-buton{
    padding: 10px 20px;
    border: 0;
    font-family: Poppins , sans-serif;
    font-size: 13px;
    background: red;
    border-radius: 10px;
    cursor: pointer;
    transition: .2s ease-in-out;
    font-weight: 500;
    color: white;
    text-decoration: none;
}
.kirmizi-buton:hover{
    background: #e10000;
}

/* Yazılar */
.yesil-yazi{
    color: #00ff00 !important;
}
.turuncu-yazi{
    color: #f79829 !important;
}
.kirmizi-yazi{
    color: red !important;
}

/* Uyarı */
#uyari{
    width: 100%;
    height: 100vh;
    z-index: 999999;
    background: rgba(0,0,0,.9);
    position: fixed;
    top: 0;
    left: 0;
    display: none;
}
#uyari .animated{
    width: 100%;
    height: 100vh;
}
#uyari #uyari-icerik{
    max-width: 500px;
    display: table;
    padding: 50px;
    background: white;
    border-radius: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    text-align: center;
}
#uyari #uyari-icerik i.fa-times{
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: red;
    color: white;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    border-radius: 0 5px 0 0;
}
#uyari #uyari-icerik i.fa-ban{
    font-size: 50px;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 50%;
    background: red;
    color: white;
    margin-bottom: 10px;
}
#uyari #uyari-icerik i.fa-check{
    font-size: 50px;
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 50%;
    background: #00ff00;
    color: white;
    margin-bottom: 10px;
}
#uyari #uyari-icerik h1{
    font-family: Work Sans , sans-serif;
    font-size: 30px;
    margin-bottom: 10px;
}
#uyari #uyari-icerik p{
    font-family: Fire Sans , sans-serif;
    font-size: 13px;
}

/* Header */
header{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 10px 0;
    z-index: 9999;
    transition: .2s ease-in-out;
    height: 0;
}
header.aktif{
    position: fixed;
    height: 90px;
    background: #f9ab53;
    box-shadow: 1px 1px 14px #00000070;
}
header #container{
    position: relative;
}
header i.fa-bars{
    display: none;
}
header nav{
    width: 100%;
    position: absolute;
    top: 25px;
    left: 0;
}
header nav ul a{
    text-decoration: none;
}
header nav > ul > a > li{
    color: black;
    font-family: "Octarine Bold" , sans-serif;
    float: left;
    list-style: none;
    border-radius: 5px;
    border: 1px solid black;
    background: white;
    padding: 7px 10px;
    padding-bottom: 3px;
    margin-right: 70px;
    font-size: 17px;
    text-transform: uppercase;
    transition: .3s ease-in-out;
}
header nav > ul > a > li:hover,
header nav > ul li.acilir-menu:hover{
    background: black;
    color: white;
}
header nav > ul li.acilir-menu{
    color: black;
    font-family: "Octarine Bold" , sans-serif;
    list-style: none;
    border-radius: 5px;
    border: 1px solid black;
    background: white;
    padding: 7px 10px;
    padding-bottom: 3px;
    font-size: 17px;
    text-transform: uppercase;
    cursor: pointer;
    transition: .3s ease-in-out;
}
header nav > ul li.acilir-menu > img{
    height: 17px;
    float: left;
    margin-top: -3px;
}
header nav > ul li.acilir-menu > span{
    display: table;
    float: left;
}
header nav > ul li.acilir-menu > span i{
    margin-left: 5px;
    margin-top: -4px;
    transition: .3s ease-in-out;
    color: black;
}
header nav > ul li.acilir-menu:hover > span i{
    color: white;
}
header nav > ul li.acilir-menu ul{
    display: none;
    margin-top: 12px;
}
header nav > ul li.acilir-menu[data-aktif="1"] ul{
    display: block;
}
header nav > ul li.acilir-menu ul li{
    display: block;
    list-style: none;
    margin-bottom: 10px;
    font-size: 14px;
}
header nav > ul li.acilir-menu ul a{
    color: black;
    text-decoration: none;
    transition: .3s ease-in-out;
}
header nav > ul li.acilir-menu:hover ul a{
    color: white;
}
header nav > ul li.acilir-menu ul li img{
    height: 17px;
    margin-right: 5px;
    vertical-align: -3px;
}
header nav > ul .right{
    float: right;
}
header nav > ul li.acilir-menu.right{
    margin-right: 0;
}
header #logo{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
header #logo::before{
    content: "";
    display: inline-block;
    height: 136px;
    width: 106px;
    z-index: -1;
    background: linear-gradient(238deg, rgba(247,160,58,1) 0%, rgba(252,150,67,1) 20%, rgba(247,135,112,1) 62%, rgba(138,85,126,1) 100%);
    /*border: 1px solid black;*/
    box-shadow: 1px 1px 5px #00000068;
    position: absolute;
    left: 8px;
    bottom: -8px;
    transition: .2s ease-in-out;
    opacity: 1;
}
header.aktif #logo::before{
    opacity: 0;
    height: 90px;
    width: 70px;
    left: 0;
    bottom: 0;
}
header #logo img{
    height: 136px;
    width: 106px;
    position: relative;
    transition: .2s ease-in-out;
}
header.aktif #logo img{
    height: 90px;
    width: 70px;
}

/* İletişim Form */
#iletisim_form{
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: 99999;
    background: rgba(0,0,0,.6);
    top: 0;
    left: 0;
    display: none;
}
#iletisim_form #animate{
    width: 100%;
    height: 100vh;
}
#iletisim_form #iletisim_form_container{
    background: url("../img/iletisim-form-bg.jpg");
    background-size: 100% 100%;
    width: 650px;
    padding: 70px 20px;
    border-radius: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#iletisim_form #iletisim_form_container span{
    display: table;
    width: 40%;
    margin: 0 auto;
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: bold;
    font-family: "Octarine Bold" , sans-serif;
    text-align: center;
    color: red;
    line-height: 20px;
}
#iletisim_form #iletisim_form_container span.yesil-yazi{
    color: #03b703 !important;
}
#iletisim_form #iletisim_form_container input,
#iletisim_form #iletisim_form_container textarea{
    width: calc(60% - 26px);
    margin: 0 auto;
    margin-bottom: 10px;
    border: 3px solid black;
    display: table;
    font-family: "Octarine Bold" , sans-serif;
}
#iletisim_form #iletisim_form_container textarea{
    height: 120px;
}
#iletisim_form #iletisim_form_container .g-recaptcha{
    display: table;
    margin: 0 auto;
}
#iletisim_form #iletisim_form_container #send{
    display: table;
    margin: 0 auto;
    margin-top: 10px;
    position: relative;
}
#iletisim_form #iletisim_form_container #send button{
    padding: 10px 32px;
    border: 1px solid black;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 14px;
    border-radius: 10px;
    cursor: pointer;
    background: white;
    position: relative;
    z-index: 1;
    transition: .1s ease-in-out;
    bottom: 0;
    left: 0;
}
#iletisim_form #iletisim_form_container #send button:focus{
    bottom: -3px;
    left: -3px;
}
#iletisim_form #iletisim_form_container #send #border{
    position: absolute;
    bottom: -5px;
    left: -5px;
    border-radius: 10px;
    border: 3px solid black;
    background: #fb617e;
    width: 100%;
    height: 100%;
    z-index: 0;
    box-sizing: border-box;
}

/* Head */
#head{
    width: 100%;
    background: rgb(246,173,72);
    background: linear-gradient(238deg, rgba(246,173,72,1) 0%, rgba(246,173,72,1) 15%, rgba(251,163,92,1) 40%, rgba(240,139,110,1) 88%, rgba(222,97,97,1) 100%);
    padding-top: 180px;
    position: relative;
    z-index: 0;
    padding-bottom: 60px;
}
#head h1{
    /*font-family: "Geakosa Regular" , sans-serif;*/
    font-family: "impact", sans-serif;
    font-size: 200px;
    text-align: center;
    color: white;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px #5b5b5b;
}
#head h1 span{
    display: table;
    margin: 0 auto;
    font-size: 140px;
    margin-top: -35px;
    position: relative;
}
#head h1 img{
    position: absolute;
    bottom: 20px;
    right: -116px;
    height: 139px;
    animation-name: head_phone_up_down;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
#head p{
    font-family: "Octarine Light" , sans-serif;
    text-align: center;
    width: 50%;
    margin: 0 auto;
    font-weight: bold;
    line-height: 25px;
    font-size: 16px;
    color: white;
}
#head #container > a{
    margin: 0 auto;
    display: table;
    margin-top: 20px;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 18px;
    padding: 7px 0;
    padding-bottom: 3px;
    border: 1px solid black;
    background: white;
    border-radius: 5px;
    text-decoration: none;
    color: black;
    width: 170px;
    text-align: center;
    position: relative;
}
#head #container > a::before{
    content: "";
    width: 170px;
    height: 30px;
    display: inline-block;
    position: absolute;
    bottom: -8px;
    left: -8px;
    background: #fb617e;
    z-index: -1;
    border-radius: 5px;
    border: 1px solid black;
    transition: .2s ease-in-out;
}
#head #container > a:hover::before{
    bottom: -4px;
    left: -4px;
}
#head #slider{
    width: 800px;
    height: 450px;
    border: 1px solid black;
    border-radius: 5px;
    margin: 0 auto;
    margin-top: 20px;
    position: relative;
}
#head #slider > img{
    height: 450px;
    position: absolute;
    left: -120px;
    bottom: -80px;
}
#head #slider #slider_container{
    width: 800px;
    height: 450px;
    overflow: hidden;
}
#head #slider #slider_container ul{
    transition: .5s ease-in-out;
}
#head #slider #slider_container ul li{
    list-style: none;
    float: left;
}
#head #slider #slider_container ul li img{
    width: 800px;
    height: 450px;
}
#head #slider #slider-navigation{
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}
#head #slider #slider-navigation li{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: white;
    margin-right: 10px;
    list-style: none;
    float: left;
    cursor: pointer;
}
#head #slider #slider-navigation li:last-child{
    margin-right: 0;
}
#head #slider #slider-navigation li.secili{
    background: #fb617e;
}

/* Tabs */
#tabs{
    width: 100%;
}
#tabs .tab #container{
    position: relative;
}
#tabs .tab.first{
    padding: 50px 0;
    background: linear-gradient(238deg, rgba(250,175,63,1) 0%, rgba(250,170,96,1) 62%, rgba(237,121,121,1) 100%);
    box-shadow: 0px 0px 40px 10px #0000004f;
    z-index: 1;
}
#tabs .tab.second{
    background: linear-gradient(0deg, rgba(248,161,65,1) 0%, rgba(244,151,95,1) 26%, rgba(239,139,129,1) 53%, rgba(201,121,126,1) 79%, rgba(153,97,121,1) 100%);
    padding-bottom:50px;
}
#tabs .tab{
    position: relative;
}
#tabs .tab h2{
    color: white;
    font-size: 71px;
    font-family: 'impact', serif;
    margin-bottom: 10px;
    font-weight: 900;
    padding-top: 50px;
}
#tabs .tab:first-child + .tab h2{
    text-align: right;
}
#tabs .tab #container > p{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 25px;
    color: white;
    line-height: 38px;
    margin-bottom: 20px;
}
#tabs .tab #container > p span{
    color: #feed01;
}
#tabs .tab #container > img{
    position: absolute;
    top: -50px;
    right: 0;
    height: 180px;
}
#tabs .tab section{
    margin-bottom: 50px;
    display: table;
    width: 100%;
}
#tabs .tab section #tick{
    float: left;
    margin-right: 20px;
    width: 50px;
    height: 50px;
    position: relative;
}
#tabs .tab section #tick img{
    position: absolute;
    height: 50px;
    width: 50px;
}
#tabs .tab section p{
    color: white;
    font-family: "Octarine Light" , sans-serif;
    font-size: 19px;
    line-height: 30px;
    float: left;
    width: calc(100% - 70px);
    letter-spacing: 1px;
}
#tabs .tab section p span{
    font-weight: bold;
    color: #feed01;
    font-family: "Octarine Bold" , sans-serif;
}
#tabs .tab #flex{
    display: flex;
    flex-wrap: wrap;
}
#tabs .tab #flex section{
    width: 50%;
    height: 300px;
    background: white;
    border-radius: 30px 0 0 30px;
    overflow: hidden;
    background-size: 100% 100%;
    margin-bottom: 20px;
    position: relative;
    border: 7px solid black;
    border-right: 3.5px solid black;
    box-sizing: border-box;
}
#tabs .tab #flex section:nth-child(2n + 0){
    border-radius: 0 30px 30px 0;
    border: 7px solid black;
    border-left: 3.5px solid black;
}
#tabs .tab #flex section h3{
    text-align: center;
    font-family: "League Gothic Regular" , sans-serif;
    font-size: 50px;
    margin-top: 20px;
    margin-bottom: 30px;
    text-transform: uppercase;
}
#tabs .tab #flex section.fill h3{
    padding: 3px 7px;
    display: table;
    margin-top: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
    color:white;
    text-transform: uppercase;
}
#tabs .tab #flex section p{
    width: 50%;
    color: black;
    padding: 7px;
    border: 7px solid black;
    font-weight: bold;
    border-radius: 5px;
    position: absolute;
    left: 50%;
    transform: translateX(-60%);
    background: white;
    z-index: 1;
    font-size: 21px;
}
#tabs .tab #flex section.fill p{
    font-size: 20px;
    background: white;
    width: 70%;
    transform: none;
    position: unset;
    margin-left: 10px;
}
#tabs .tab #flex section #border{
    width: calc(50% + 14px);
    border: 7px solid black;
    height: 118px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50% , -50%);
    z-index: 0;
    border-radius: 5px;
    box-sizing: border-box;
    background: white;
}
#tabs .tab #flex section.two-line #border{
    height: 88px;
    transform: translate(-50% , -64%);
}
#tabs .tab #flex section.no-fill-left p{
    transform: translateX(-40%);
}
#tabs .tab #flex section.fill:nth-child(2n - 1) h3{
    margin-right: 10px;
    float: right;
}
#tabs .tab #flex section.fill:nth-child(2n - 1) p{
    margin-right: 10px;
    float: right;
}

/* Marquee */
#marquee{
    width: 100%;
    overflow: hidden;
    background: linear-gradient(194deg, rgba(251,167,47,1) 0%, rgba(255,158,99,1) 26%, rgba(250,129,117,1) 53%, rgba(231,100,135,1) 79%, rgba(186,82,152,1) 100%);
    padding: 30px 0;
    box-shadow: 0px 0px 30px 10px #0000004f;
    z-index: 1;
    position: relative;
}
#marquee #marquee-container{
    overflow: hidden;
    display: inline-block;
    width: 100%;
}
#marquee #marquee-container p{
    animation: marquee 90s linear infinite;
    display: inline-block;
    font-family: "impact" , sans-serif;
    /*font-family: "Geakosa Oblique Outline" , sans-serif;*/
    font-size: 6vw;
    color: white;
    white-space: nowrap;
}
#marquee #marquee-container p:first-child + p{
    animation: marquee 90s linear infinite reverse;
}
#marquee #marquee-container p:first-child + p + p{
    animation: marquee-2 90s linear infinite;
}

/* Index Blog */
#index_blog{
    width: 100%;
    background: linear-gradient(265deg, rgba(246,187,131,1) 0%, rgba(244,162,133,1) 31%, rgba(242,144,134,1) 62%, rgba(200,111,126,1) 100%);
    padding: 80px 0;
}
#index_blog #container{
    position: relative;
    overflow: hidden;
}
#index_blog #arrows{
    margin-bottom: 10px;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    color: #feed01;
    float: right;
    font-size: 40px;
    display: table;
}
#index_blog #arrows #back,
#index_blog #arrows #next{
    float: right;
    cursor: pointer;
    margin-left: 20px;
}
#index_blog #arrows img{
    margin: 0 10px;
    vertical-align: -2px;
}
#index_blog #arrows #next img{
    transform: rotateY(180deg);
}
#index_blog .swiper a{
    text-decoration: none;
    border: 4px solid black;
    border-radius: 14px;
    box-sizing: border-box;
}
#index_blog .swiper a #image{
    width: 100%;
    height: 200px;
    position: relative;
    border-radius: 10px;
    background: white;
    overflow: hidden;
}
#index_blog .swiper a #image img{
    max-width: 90%;
    max-height: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#index_blog .swiper a p{
    background: #9f3483;
    color: white;
    padding: 10px;
    padding-top: 20px;
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    border-radius: 0 0 10px 10px;
    font-size: 24px;
    margin-top: -10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow:hidden;
    line-height: 29px;
    height: 51px;
    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
}
#index_blog .swiper-button-prev, #index_blog .swiper-container-rtl .swiper-button-next,
#index_blog .swiper-button-next, #index_blog .swiper-container-rtl .swiper-button-prev{
    display: none;
}

/* Referanslar */
#referanslar{
    width: 100%;
    background: white;
    padding: 20px 0;
    overflow: hidden;
    position: relative;
    border-bottom: 8px solid #e2a29c;
    border-top: 8px solid #e2a29c;
    box-shadow: 0px 0px 1px 8px #9f34837a;
}
#referanslar .swiper a{
    height: 120px;
    position: relative;
}
#referanslar .swiper a img{
    max-width: 95%;
    max-height: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#referanslar .swiper > .swiper-wrapper{
    transition-timing-function : linear !important;
}

/* Form */
#form{
    width: 100%;
    min-height: calc(100vh - 140px);
    padding: 20px 0;
    background: linear-gradient(238deg, rgba(246,173,72,1) 0%, rgba(246,173,72,1) 15%, rgba(251,163,92,1) 40%, rgba(240,139,110,1) 88%, rgba(222,97,97,1) 100%);
    text-align: center;
    padding-top: 120px;
    border-bottom: 4px solid white;
}
#form.giris{
    background: url("../img/login-bg.jpg");
    background-size: 100% 100%;
    background-attachment: fixed;
}
#form #container{
    margin-top: 80px;
}
#form #container h1{
    font-family: "impact" , sans-serif;
    font-size: 120px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: normal;
    letter-spacing: 4px;
    color: white;
    text-shadow: 1px 1px 1px #5b5b5b;
}
#form.giris #container h1{
    color: white;
    text-shadow: 1px 1px 1px #5b5b5b;
}
#form.giris #container > #border{
    padding: 30px;
    border-radius: 10px;
    background: white;
    border: 10px solid black;
    display: table;
    margin: 0 auto;
    box-sizing: border-box;
}
#form #container > span,
#form #container > #border span{
    color: red;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 20px;
    display: block;
}
#form #container > p{
    color: white;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 40px;
}
#form.giris #container > #border p{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
}
#form #container > h2{
    font-family: "impact" , sans-serif;
    font-size: 40px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: normal;
    letter-spacing: 4px;
    color: white;
    text-shadow: 1px 1px 1px #5b5b5b;
}
#form #container #flex{
    display: flex;
    margin: 0 auto;
    justify-content: center;
    margin-bottom: 40px;
}
#form #container #flex a{
    width: calc((100% / 4) - 60px);
    border: 3px solid white;
    border-radius: 30px;
    margin-right: 20px;
    padding: 20px;
    background-size: 100% 105%;
    background-repeat: no-repeat;
    cursor: pointer;
    text-decoration: none;
}
#form #container #flex:first-of-type a:first-child{
    background-image: url("../img/package-1.jpg");
}
#form #container #flex:first-of-type a:first-child + a{
    background-image: url("../img/package-2.jpg");
}
#form #container #flex.flex-2 a:first-child{
    background-image: url("../img/package-3.jpg");
}
#form #container #flex.flex-2 a:first-child + a{
    background-image: url("../img/package-4.jpg");
}
#form #container #flex.flex-3 a:first-child{
    background-image: url("../img/package-5.jpg");
}
#form #container #flex.flex-3 a:first-child + a{
    background-image: url("../img/package-6.jpg");
}
#form #container #flex a:last-child{
    margin-right: 0;
}
#form #container #flex a h3{
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    font-size: 31px;
    margin-bottom: 10px;
    color: black;
}
#form #container #flex a h4{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 16px;
    margin-bottom: 10px;
    color: black;
}
#form #container #flex a ul li{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 12px;
    list-style: none;
    margin-bottom: 5px;
    color: black;
}
#form #container #flex a ul li:last-child{
    margin-bottom: 10px;
}
#form #container #flex a ul li i{
    margin-right: 10px;
}
#form #container #flex a h4.fiyat{
    margin-bottom: 120px;
    font-size: 18px;
}
#form form h2{
    font-family: "League Gothic Regular" , sans-serif;
    font-size: 50px;
    color: #f9a31a;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: normal;
    text-shadow:
        0 1px #b0b8ba,
        -1px 0 #ffffff,
        -1px 2px #b0b8ba,
        -2px 1px #ffffff,
        -2px 3px #b0b8ba,
        -3px 2px #ffffff,
        -3px 4px #b0b8ba,
        -4px 3px #ffffff,
        -4px 5px #b0b8ba,
        -5px 4px #ffffff;
    letter-spacing: 4px;
}
#form form input[type="text"],
#form form input[type="password"],
#form form input[type="email"],
#form form select{
    border: 3px solid #feed01;
    margin: 0 auto;
    margin-bottom: 20px;
    background: black;
    color: white;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 13px;
    padding: 15px 10px;
    width: calc(40% - 26px);
    display: table;
}
#form form select{
    width: 40%;
}
#form.giris #container > #border input[type="text"],
#form.giris #container > #border input[type="password"],
#form.giris #container > #border input[type="email"],
#form.giris #container > #border select{
    width: calc(100% - 36px);
    border: 3px solid black;
    background: white;
    color: black;
}
#form form p{
    font-family: "Octarine Bold" , sans-serif;
    color: white;
    margin-bottom: 10px;
}
#form form #secenekler{
    display: flex;
    margin-bottom: 20px;
}
#form form #secenekler section{
    width: 100%;
    margin-right: 20px;
    position: relative;
}
#form form #secenekler section:last-child{
    margin-right: 0;
}
#form form #secenekler section #content{
    background: white;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 30px;
    width: 100%;
    position: relative;
    z-index: 1;
    border: 3px solid black;
    bottom: 0;
    left: 0;
    transition: .1s ease-in-out;
    cursor: pointer;
}
#form form #secenekler section.secili #content{
    bottom: -2px;
    left: -2px;
    background: #feed01;
}
#form form #secenekler section i{
    font-size: 25px;
    margin-bottom: 5px;
    position: relative;
    z-index: 1;
}
#form form #secenekler section h3{
    font-size: 30px;
    font-weight: normal;
    position: relative;
    z-index: 1;
}
#form form #secenekler section #border{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fb617e;
    box-sizing: border-box;
    bottom: -6px;
    left: -6px;
    border-radius: 30px;
    z-index: 0;
}
#form form .inputlar{
    display: flex;
    flex-wrap: wrap;
}
#form form .inputlar input,
#form form .inputlar select{
    width: calc((100% / 2) - 36px);
    margin-right: 20px;
}
#form form .inputlar select{
    width: calc(50% - 10px);
}
#form form .inputlar input:nth-child(2n + 0){
    margin-right: 0;
}
#form form label{
    display: table;
    margin: 20px auto;
    color: white;
    font-family: "Octarine Bold" , sans-serif;
}
#form form label input{
    margin-right: 10px;
}
#form form label a{
    color: #feed01;
}
#form form .g-recaptcha{
    display: table;
    margin: 0 auto;
    margin-bottom: 20px;
}
#form form #button{
    position: relative;
    display: table;
    margin: 0 auto;
}
#form form #button button{
    border: 3px solid black;
    border-radius: 10px;
    background: white;
    padding: 20px 40px;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 18px;
    cursor: pointer;
    position: relative;
    z-index: 1;
    transition: .1s ease-in-out;
    left: 0;
    bottom: 0;
}
#form form #button button:hover{
    left: -3px;
    bottom: -3px;
}
#form form #button button i{
    margin-right: 10px;
}
#form form #button #border{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fb617e;
    bottom: -5px;
    left: -5px;
    z-index: 0;
    border-radius: 10px;
}

/* Blog */
#blog{
    width: 100%;
    min-height: calc(100vh - 140px);
    background: linear-gradient(238deg, rgba(246,173,72,1) 0%, rgba(246,173,72,1) 15%, rgba(251,163,92,1) 40%, rgba(240,139,110,1) 88%, rgba(222,97,97,1) 100%);
    text-align: center;
    padding-top: 120px;
    padding-bottom: 100px;
    border-bottom: 4px solid white;
}
#blog.article{
    background: url("../img/blog-content-bg.jpg");
    background-size: 100% 100%;
    background-attachment: fixed;
}
#blog #container{
    margin-top: 80px;
}
#blog > #container > h1{
    font-family: "impact" , sans-serif;
    font-size: 180px;
    color: white;
    text-shadow: 1px 1px 1px #5b5b5b;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: normal;
    letter-spacing: 4px;
}
#blog #container > span{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: white;
}
#blog #yazilar{
    display: flex;
    flex-wrap: wrap;
    margin-top: -20px;
}
#blog #yazilar article{
    width: calc((100% / 2) - 12px);
    margin-right: 20px;
    position: relative;
    height: 180px;
    margin-top: 20px;
}
#blog #yazilar article:nth-child(2n + 0){
    margin-right: 0;
}
#blog #yazilar article #border{
    content: "";
    display: inline-block;
    width: 100%;
    height: 180px;
    position: absolute;
    z-index: 0;
    background: #feed01;
    left: -10px;
    bottom: -10px;
    border-radius: 10px;
    border: 2px solid black;
}
#blog #yazilar article:nth-child(2n + 0) #border{
    left: auto;
    right: -10px;
}
#blog #yazilar article a{
    position: relative;
    z-index: 1;
    width: 100%;
    height: 180px;
    display: block;
    background: white;
    overflow: hidden;
    border-radius: 10px;
    border: 3px solid black;
    box-sizing: border-box;
}
#blog #yazilar article #thumbnail{
    width: calc(50% - 30px);
    height: 180px;
    overflow: hidden;
    float: left;
    position: relative;
}
#blog #yazilar article:nth-child(2n + 0) #thumbnail{
    float: right;
}
#blog #yazilar article #thumbnail img{
    max-width: 90%;
    max-height: 160px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#blog #yazilar article h3{
    position: absolute;
    width: 50%;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    font-size: 30px;
    color: black;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#blog #yazilar article:nth-child(2n + 0) h3{
    left: 20px;
    right: inherit;
}
#blog #container > article img#thumbnail{
    width: 30%;
    border: 3px solid black;
    overflow: hidden;
    border-radius: 10px;
    float: left;
    margin: 20px;
}
#blog #container > article #yazi{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 13px;
    line-height: 25px;
    text-align: initial;
    margin-bottom: 20px;
    background: white;
    border-radius: 10px;
    padding: 20px;
    padding-top: 0;
    border: 3px solid black;
}
#blog #container > article #yazi h1.baslik{
    text-align: left;
    color: black;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    font-size: 60px;
    letter-spacing: 4px;
    margin-bottom: 10px;
    line-height: 58px;
}
#blog #container > article #yazi h1{
    font-size: 35px;
    margin: 10px 0;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    line-height: normal;
}
#blog #container > article #yazi h2{
    font-size: 30px;
    margin: 10px 0;
    font-family: 'Playfair Display', serif;
    font-weight: normal;
    line-height: normal;
}
#blog #container > article #yazi h3{
    font-size: 25px;
    margin: 10px 0;
    border-left: 5px solid #f79829;
    padding-left: 5px;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    line-height: normal;
}
#blog #container > article #yazi h4{
    font-size: 20px;
    margin: 10px 0;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    line-height: normal;
}
#blog #container > article #yazi p{
    margin-bottom: 10px;
}
#blog #container > article #yazi a{
    font-weight: bold;
    color: #f79829;
    text-decoration: none;
}
#blog #container > article #yazi ul , #blog #container > article #yazi ol{
    display: table;
    margin-left: 15px;
    margin-bottom: 10px;
}
#blog #container > article #etiketler{
    display: table;
    width: 100%;
    margin-top: 20px;
}
#blog #container > article #etiketler a{
    display: table;
    float: left;
    margin-right: 10px;
    font-size: 10px;
    font-family: Roboto , sans-serif;
    font-weight: bold;
    background: white;
    border: 0;
    color: black;
    padding: 5px;
    margin-top: 10px;
    border-radius: 10px;
    border-left: 3px solid black;
    border-bottom: 3px solid black;
}

/* İşletme */
#isletme{
    width: 100%;
    min-height: calc(100vh - 200px);
    display: table;
    padding: 10px 0;
    background: url("../img/background-3.jpg");
    background-size: 100% 100%;
    background-position: center;
    background-attachment: fixed;
    padding-top: 120px;
}
#isletme #container{
    margin-top: 80px;
}
#isletme #bildirim{
    border: 2px solid;
    border-radius: 10px;
    padding: 15px;
    background: white;
    font-family: Roboto , sans-serif;
    font-size: 12px;
    margin-bottom: 10px;
    font-weight: bold;
}
#isletme #bildirim.onemli{
    border-color: red;
}
#isletme #bildirim i{
    width: 25px;
    height: 25px;
    line-height: 25px;
    background: #f79829;
    color: black;
    text-align: center;
    border-radius: 50%;
    margin-right: 5px;
}
#isletme #bildirim a{
    padding: 5px 10px;
    text-decoration: none;
    margin-left: 10px;
    font-size: 12px;
    font-weight: bold;
}
#isletme #sol{
    float: left;
    width: 17%;
    background: white;
    border-radius: 10px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
    -moz-box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
    box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
}
#isletme #sol h2{
    font-family: Work Sans , sans-serif;
    margin: 10px 0;
    font-size: 20px;
    text-align: center;
}
#isletme #sol ul a{
    text-decoration: none;
}
#isletme #sol ul li{
    list-style: none;
    font-family: Roboto , sans-serif;
    font-size: 12px;
    color: black;
    padding: 10px;
    transition: .2s ease-in-out;
}
#isletme #sol ul li:hover{
    background: #f79829;
}
#isletme #sol ul li i{
    float: right;
    margin-top: 1px;
}
#isletme #sol ul li span{
    width: 15px;
    height: 15px;
    line-height: 15px;
    background: #f79829;
    color: black;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    font-size: 10px;
    margin-left: 5px;
    transition: .2s ease-in-out;
}
#isletme #sol ul li:hover span{
    background: black;
    color: #f79829;
}
#isletme #sag{
    float: right;
    width: calc((100% - 17%) - 30px);
    background: white;
    border-radius: 10px;
    padding: 10px;
    margin-left: 10px;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
    -moz-box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
    box-shadow: 1px 1px 2px 0px rgba(138,138,138,1);
    min-height: calc(100vh - 340px);;
}
#isletme #sag #loading{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.5);
    display: none;
}
#isletme #sag #loading #loading_window{
    width: 400px;
    display: table;
    padding: 20px;
    border-radius: 10px;
    background: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#isletme #sag #loading #loading_window img{
    width: 30%;
    display: table;
    margin: 0 auto;
    margin-bottom: 10px;
}
#isletme #sag #loading #loading_window span{
    font-family: Roboto, sans-serif;
    font-weight: bold;
    text-align: center;
    display: block;
    font-size: 20px;
    margin-bottom: 10px;
}
#isletme #sag #loading #loading_window #progress_bar{
    width: 100%;
    border: 1px solid #e3e3e3;
    border-radius: 20px;
    box-sizing: border-box;
    height: 20px;
    overflow: hidden;
}
#isletme #sag #loading #loading_window #progress_bar #bar{
    width: 0;
    height: 20px;
    background: #f79829;
}
#isletme #sag h1{
    font-family: Work Sans , sans-serif;
    font-size: 30px;
    margin-bottom: 10px;
}
#isletme #sag h2{
    font-family: Work Sans , sans-serif;
    font-size: 25px;
    margin-bottom: 10px;
}
#isletme #sag > span{
    font-family: Poppins , sans-serif;
    font-size: 13px;
}
#isletme #sag #medya{
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.9);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    display: none;
}
#isletme #sag #medya #medya-animasyon{
    width: 100%;
    height: 100vh;
}
#isletme #sag #medya #medya-icerik{
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    width: 1000px;
    height: 500px;
    background: white;
    position: absolute;
    border-radius: 10px
}
#isletme #sag #medya #medya-icerik #medya-sol{
    width: 20%;
    float: left;
    height: 500px;
    background: #f79829;
    border-radius: 5px 0 0 5px;
}
#isletme #sag #medya #medya-icerik #medya-sol ul li{
    padding: 10px;
    font-family: Roboto , sans-serif;
    font-size: 13px;
    cursor: pointer;
    transition: .2s ease-in-out;
    list-style: none;
    background: #f79829;
    margin-top: -1px;
}
#isletme #sag #medya #medya-icerik #medya-sol ul li:first-child{
    border-radius: 5px 0 0 0;
}
#isletme #sag #medya #medya-icerik #medya-sol ul li:hover , #isletme #sag #medya #medya-icerik #medya-sol ul li.secili{
    background: black;
    color: #f79829;
}
#isletme #sag #medya #medya-icerik #medya-sol ul li i{
    float: right;
    margin-top: 1px;
}
#isletme #sag #medya #medya-icerik #medya-sag{
    float: right;
    width: calc(80% - 20px);
    padding: 10px;
    overflow-y: scroll;
    height: 480px;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler span{
    font-family: Ubuntu , sans-serif;
    font-size: 12px;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul{
    display: flex;
    flex-wrap: wrap;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li{
    width: calc((100% / 5) - 8px);
    height: 130px;
    overflow: hidden;
    position: relative;
    margin-right: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    list-style: none;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li:nth-child(5n + 0){
    margin-right: 0;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li img{
    max-height: 130px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li i{
    position: absolute;
    top: 0;
    right: 0;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    background: red;
    color: white;
    font-size: 12px;
}
#isletme #sag #medya #medya-icerik #medya-sag #medya-resim-yukle{
    display: none;
}
#isletme #sag #istatistikler{
    display: flex;
}
#isletme #sag #istatistikler section{
    width: calc(100% / 3);
    background: #f79829;
    border-radius: 10px;
    margin-right: 10px;
    text-align: center;
    padding: 10px;
    color: white;
    font-family: Ubuntu , sans-serif;
}
#isletme #sag #istatistikler section h2{
    margin-top: 10px;
    font-family: Ubuntu , sans-serif;
    margin-bottom: 0;
}
#isletme #sag #istatistikler section:last-child{
    margin-right: 0;
}
#isletme #sag .tablo{
    float: left;
    margin-top: 10px;
    border-radius: 10px;
    border: 1px solid #ececec;
    padding: 10px;
    margin-right: 10px;
}
#isletme #sag .tablo.no-margin{
    margin-right: 0;
}
#isletme #sag #kucuk-tablo{
    width: calc((100% / 3) - 28px);
}
#isletme #sag #orta-tablo{
    width: calc((100% - (100% / 3)) - 26px);
}
#isletme #sag .tablo #baslik{
    width: calc(100% + 2px);
    padding: 5px 10px;
    background: #f79829;
    font-family: Ubuntu , sans-serif;
    font-size: 16px;
    font-weight: 700;
    margin-top: -11px;
    margin-left: -11px;
    border-radius: 10px 10px 0 0;
    margin-bottom: 8px;
}
#isletme #sag .tablo span{
    font-family: Roboto , sans-serif;
    font-size: 12px;
    font-weight: bold;
}
#isletme #sag .tablo table{
    font-family: Roboto , sans-serif;
    font-size: 13px;
    width: 100%;
}
#isletme #sag .tablo table tr td{
    padding-right: 10px;
    padding-bottom: 8px;
}
#isletme #sag .tablo table tr td b{
    font-weight: 500;
}
#isletme #sag .tablo table tr td:last-child{
    padding-right: 0;
}
#isletme #sag .tablo table tr:last-child td{
    padding-bottom: 0;
}
#isletme #sag .tablo table tr td a{
    color: black;
    text-decoration: none;
}
#isletme #sag #tablo{
    width: 100%;
}
#isletme #sag #tablo th{
    font-family: Poppins , sans-serif;
    font-size: 14px;
    text-align: left;
    padding-bottom: 10px;
    padding-right: 10px;
}
#isletme #sag #tablo th:last-child{
    padding-right: 0;
}
#isletme #sag #tablo td{
    font-family: Poppins , sans-serif;
    font-size: 12px;
    padding-bottom: 10px;
    padding-right: 10px;
}
#isletme #sag #tablo tr td:last-child{
    padding-right: 0;
}
#isletme #sag #tablo tr td i.fa-info{
    color: #f79829;
}
#isletme #sag #tablo tr td i.fa-check{
    color: #00ff00;
}
#isletme #sag #tablo tr td i.fa-times{
    color: red;
}
#isletme #sag #form-butonlar{
    margin-bottom: 10px;
    width: 100%;
    display: table;
}
#isletme #sag #form-butonlar a{
    float: left;
    font-size: 12px;
    padding: 5px 10px;
    margin-right: 10px;
}
#isletme #sag .menu_list{
    width: calc(100% - 20px);
    padding: 5px 10px;
    display: table;
    border-radius: 10px;
    margin-bottom: 10px;
    height: 30px;
    background: #00ff00;
    cursor: pointer;
}
#isletme #sag .menu_list[data-acik='1']{
    border-radius: 10px 10px 0 0;
}
#isletme #sag .menu_list.deaktif{
    background: red;
}
#isletme #sag .menu_list:last-child{
    margin-bottom: 0;
}
#isletme #sag .menu_list #menu_adi{
    float: left;
    font-family: Poppins , sans-serif;
    font-weight: bold;
    font-size: 16px;
    line-height: 30px;
    color: white;
}
#isletme #sag .menu_list #menu_adi i{
    margin-right: 10px;
    color: white;
    transition: .2s ease-in-out;
}
#isletme #sag .menu_list[data-acik='1'] #menu_adi i{
    transform: rotate(90deg);
}
#isletme #sag .menu_list a{
    float: right;
    padding: 5px 10px;
    border-radius: 10px;
    color: black;
    text-decoration: none;
    font-family: Poppins , sans-serif;
    font-size: 12px;
    font-weight: bold;
    margin-top: 3px;
    margin-left: 10px;
    background: white;
}
#isletme #sag .menu_list a i{
    margin-right: 5px;
}
#isletme #sag > #urunler{
    width: 100%;
    margin-bottom: 10px;
    margin-top: -10px;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
    display: none;
}
#isletme #sag > #urunler span{
    width: 100%;
    padding: 5px 10px;
    background: #f9f9f9;
    font-family: Poppins , sans-serif;
    font-size: 13px;
    display: block;
}
#isletme #sag > #urunler #urun_list{
    width: calc(100% - 20px);
    padding: 5px 10px;
    background: #f9f9f9;
    height: 30px;
}
#isletme #sag > #urunler #urun_list #urun_adi{
    font-family: Poppins , sans-serif;
    font-size: 14px;
    font-weight: bold;
    float: left;
    color: black;
    line-height: 30px;
}
#isletme #sag > #urunler #urun_list #urun_adi i{
    margin-right: 8px;
}
#isletme #sag > #urunler #urun_list a{
    float: right;
    padding: 5px 10px;
    border-radius: 10px;
    text-decoration: none;
    font-family: Poppins , sans-serif;
    font-size: 12px;
    font-weight: bold;
    margin-top: 3px;
    margin-left: 10px;
}
#isletme #sag > #urunler #urun_list a i{
    margin-right: 5px;
}
#isletme #sag #sayfalar{
    display: table;
    width: 100%;
    margin-top: 50px;
}
#isletme #sag #sayfalar ul a , #isletme #sag #sayfalar ul li{
    float: left;
    list-style: none;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: #f79829;
    font-family: Roboto , sans-serif;
    font-size: 13px;
    font-weight: bold;
    margin-right: 10px;
    text-decoration: none;
    color: black;
}
#isletme #sag #sayfalar .active , #isletme #sag #sayfalar .disabled{
    background: black;
    color: #f79829;
}
#isletme #sag #gelismis_istatistikler{
    width: 100%;
}
#isletme #sag #filtreler{
    width: 100%;
    display: table;
    margin-bottom: 10px;
}
#isletme #sag #filtreler a{
    float: left;
    text-decoration: none;
    margin-right: 10px;
    padding: 5px 10px;
}
#isletme #sag #filtreler a.secili{
    background: black;
    color: #f79829;
}
#isletme #sag #gelismis_istatistikler #flex{
    display: flex;
}
#isletme #sag #gelismis_istatistikler section{
    margin-bottom: 10px;
    border: 1px solid #e1e1e1;
    padding: 10px;
}
#isletme #sag #gelismis_istatistikler section:last-child{
    margin-bottom: 0;
}
#isletme #sag #gelismis_istatistikler section #baslik{
    width: calc(100% + 20px);
    padding: 5px 10px;
    background: #e1e1e1;
    color: black;
    font-family: Poppins , sans-serif;
    font-size: 14px;
    font-weight: bold;
    box-sizing: border-box;
    margin-top: -10px;
    margin-left: -10px;
    margin-bottom: 10px;
}
#isletme #sag #gelismis_istatistikler section span{
    display: block;
    font-size: 11px;
    margin-top: 20px;
    font-family: Poppins , sans-serif;
    color: #3b3b3b;
}
#isletme #sag #gelismis_istatistikler #flex section{
    margin-right: 10px;
    width: 100%;
}
#isletme #sag #gelismis_istatistikler #flex section:last-child{
    margin-right: 0;
}
#isletme #sag #istatistik_detay{
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: 9999999;
    background: rgba(0,0,0,.5);
    top: 0;
    left: 0;
    display: none;
}
#isletme #sag #istatistik_detay #loading{
    width: 300px;
    height: 300px;
    background: white;
    padding: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    border-radius: 10px;
}
#isletme #sag #istatistik_detay #loading img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y{
    height: 70vh;
    overflow-y: scroll;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y::-webkit-scrollbar {
    width: 5px;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y::-webkit-scrollbar-track {
    background: #f1f1f1;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y::-webkit-scrollbar-thumb {
    background: #888;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y::-webkit-scrollbar-thumb:hover {
    background: #555;
}
#isletme #sag #istatistik_detay #istatistik_detay_content{
    width: 60%;
    padding: 10px;
    background: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    border-radius: 10px;
    display: none;
}
#isletme #sag #istatistik_detay #istatistik_detay_content h1{
    font-size: 50px;
}
#isletme #sag #istatistik_detay #istatistik_detay_content i{
    position: absolute;
    top: -20px;
    right: -20px;
    font-size: 30px;
    color: white;
    background: red;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
}
#isletme #sag #istatistik_detay #istatistik_detay_content section canvas{
    height: 250px !important;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #flex section{
    margin-bottom: 10px;
}
#isletme #sag #istatistik_detay #istatistik_detay_content #flex canvas{
    height: 250px !important;
}
#isletme #sag #window-form{
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0,0,0,.8);
    width: 100%;
    height: 100vh;
    z-index: 9999999999;
}
#isletme #sag #window-form #window-form-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    background: white;
    border-radius: 10px;
    padding: 20px;
    width: 400px;
    text-align: center;
}
#isletme #sag #window-form #window-form-content p{
    font-family: Roboto , sans-serif;
    font-size: 13px;
    margin-bottom: 7px;
    line-height: 20px;
}
#isletme #sag #window-form #window-form-content span{
    font-family: Roboto , sans-serif;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 7px;
    display: block;
}
#isletme #sag #window-form #window-form-content h4{
    margin-bottom: 10px;
    font-family: Work Sans , sans-serif;
}
#isletme #sag #window-form #window-form-content input{
    width: calc(100% - 22px);
    padding: 7px 10px;
    font-size: 12px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form{
    width: 100%;
    display: table;
}
#isletme #sag #isletme-form #form-sol{
    width: 70%;
    float: left;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar{
    width: 100%;
    margin-bottom: 10px;
    border: 1px solid #dedede;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 10px;
    overflow: hidden;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar[data-acik="0"]{
    height: 50px;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar[data-acik="1"]{
    height: auto;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar #baslik{
    font-family: Work Sans , sans-serif;
    font-weight: bold;
    font-size: 21px;
    line-height: 28px;
    cursor: pointer;
    margin-bottom: 10px;
    user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar #baslik i{
    float: right;
    line-height: 28px;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar[data-acik="1"] #baslik i{
    transform: rotate(90deg);
}
#isletme #sag #isletme-form #form-sol .acilir-ayar[data-acik="0"] #ayarlar{
    display: none;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar[data-acik="1"] #ayarlar{
    display: block;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar h4{
    font-size: 16px;
    margin-bottom: 5px;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar p{
    margin-top: 5px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar input[type="text"],
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar input[type="email"],
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar input[type="time"],
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar input[type="number"],
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar #multi-secenekler section,
#isletme #sag #isletme-form #form-sol .acilir-ayar #ayarlar #secenekler section{
    padding: 7px 10px;
    font-size: 12px;
}
#isletme #sag #isletme-form #form-sol .turuncu-buton{
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol #paketler h2{
    text-transform: uppercase;
}
#isletme #sag #isletme-form #form-sol #paketler #flex{
    display: flex;
    margin-bottom: 40px;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a{
    width: calc((100% / 3) - 80px);
    border-radius: 30px;
    margin-right: 20px;
    padding: 20px;
    background-size: 100% 105%;
    background-repeat: no-repeat;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
}
#isletme #sag #isletme-form #form-sol #paketler #flex:first-of-type a:first-child{
    background-image: url("../img/package-1.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex:first-of-type a:first-child + a{
    background-image: url("../img/package-2.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex.flex-2 a:first-child{
    background-image: url("../img/package-3.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex.flex-2 a:first-child + a{
    background-image: url("../img/package-4.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex.flex-3 a:first-child{
    background-image: url("../img/package-5.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex.flex-3 a:first-child + a{
    background-image: url("../img/package-6.jpg");
}
#isletme #sag #isletme-form #form-sol #paketler #flex a:last-child{
    margin-right: 0;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a h3{
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    font-size: 31px;
    border-left: 0;
    padding-left: 0;
    margin: 0;
    margin-bottom: 10px;
    color: black;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a h4{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 16px;
    margin-bottom: 10px;
    color: black;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a ul li{
    font-family: "Octarine Bold" , sans-serif;
    font-size: 12px;
    list-style: none;
    margin-bottom: 5px;
    color: black;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a ul li:last-child{
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a ul li i{
    margin-right: 10px;
}
#isletme #sag #isletme-form #form-sol #paketler #flex a h4.fiyat{
    margin-bottom: 120px;
    font-size: 18px;
}
#isletme #sag #isletme-form #form-sol #menuler{
    width: 100%;
}
#isletme #sag #isletme-form #form-sol #menuler #menu{
    display: none;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section{
    width: 100%;
    border-radius: 10px;
    height: 300px;
    margin-bottom: 10px;
    overflow: hidden;
    position: relative;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan{
    width: 100%;
    height: 300px;
    filter: brightness(0.7);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan img{
    width: 100%;
    height: 300px;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-baslik{
    width: calc(100% - 20px);
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 1;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-baslik input{
    width: calc(100% - 20px);
    border: 0;
    padding: 10px;
    background: rgba(0,0,0,.5);
    font-size: 30px;
    font-family: Work Sans , sans-serif;
    font-weight: bold;
    color: white;
    margin-bottom: 0;
    float: left;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-baslik input::placeholder,
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-aciklama input::placeholder{
    color: #c3c3c3;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-aciklama{
    width: 100%;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-aciklama i{
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    border: 1px solid white;
    text-align: center;
    color: white;
    float: left;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-aciklama input{
    width: calc(100% - 70px);
    border: 0;
    padding: 5px;
    background: rgba(0,0,0,.5);
    font-size: 14px;
    font-family: Roboto , sans-serif;
    font-weight: bold;
    color: white;
    float: left;
    line-height: 23px;
    margin-left: 10px;
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sol #menuler #menu section #menu-resim-sec{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
}
#isletme #sag #isletme-form #form-sol #diller{
    display: table;
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
}
#isletme #sag #isletme-form #form-sol #diller ul li{
    float: left;
    font-family: Roboto , sans-serif;
    list-style: none;
    background: #f0f0f0;
    padding: 10px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
}
#isletme #sag #isletme-form #form-sol #diller ul li.secili{
    background: #f79829;
}
#isletme #sag #isletme-form #form-sol #diller ul li:first-child{
    border-radius: 5px 0 0 5px;
}
#isletme #sag #isletme-form #form-sol #diller ul li:last-child{
    border-radius: 0 5px 5px 0;
}
#isletme #sag #isletme-form #form-sol #diller ul li.tek{
    border-radius: 5px;
}
#isletme #sag #isletme-form #form-sol #urunler{
    position: relative;
    width: 100%;
    height: 570px;
}
#isletme #sag #isletme-form #form-sol #urun{
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
#isletme #sag #isletme-form #form-sol #urun:last-child{
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sol #oneriler{
    display: flex;
    flex-wrap: wrap;
}
#isletme #sag #isletme-form #form-sol #oneriler section{
    width: calc((100% / 3) - 7px);
    margin-right: 10px;
    border: 1px solid #ececec;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
    position: relative;
    margin-top: 10px;
}
#isletme #sag #isletme-form #form-sol #oneriler section:nth-child(3n + 0){
    margin-right: 0;
}
#isletme #sag #isletme-form #form-sol #oneriler section:first-child,
#isletme #sag #isletme-form #form-sol #oneriler section:first-child + section,
#isletme #sag #isletme-form #form-sol #oneriler section:first-child + section + section{
    margin-top: 0;
}
#isletme #sag #isletme-form #form-sol #oneriler section i{
    position: absolute;
    top: -10px;
    right: -10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: red;
    color: white;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
}
#isletme #sag #isletme-form #form-sol #oneriler section h4{
    text-align: center;
}
#isletme #sag #isletme-form #form-sol #oneriler section select{
    width: 100%;
    padding: 5px 10px;
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sol .tox-tinymce{
    border-radius: 10px;
}
#isletme #sag #isletme-form #form-sol #tasarimlar{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section{
    width: calc((100% / 4) - 8px);
    height: 270px;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section:nth-child(4n + 0){
    margin-right: 0;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section img{
    width: 100%;
    height: 270px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section #baslik{
    position: absolute;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.8);
    color: white;
    font-family: Work Sans , sans-serif;
    font-size: 14px;
    width: calc(100% - 20px);
    padding: 10px;
    text-align: center;
    font-weight: bold;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section i{
    position: absolute;
    top: 0;
    right: 0;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    background: #00ff00;
    color: white;
    z-index: 1;
    border-radius: 0 0 0 10px;
    display: none;
}
#isletme #sag #isletme-form #form-sol #tasarimlar section.secili i{
    display: block;
}
#isletme #sag #isletme-form #form-sol #renkler{
    width: 100%;
    display: table;
}
#isletme #sag #isletme-form #form-sol #renkler label{
    width: calc((100% / 3) - 14px);
    margin-bottom: 10px;
    margin-right: 20px;
    float: left;
    display: table;
}
#isletme #sag #isletme-form #form-sol #renkler label:nth-child(3n + 0){
    margin-right: 0;
}
#isletme #sag #isletme-form #form-sol #renkler label .sp-replacer{
    float: left;
}
#isletme #sag #isletme-form #form-sol #renkler label span{
    font-family: Poppins , sans-serif;
    float: left;
    margin-left: 5px;
    font-size: 12px;
    margin-top: 5px;
}
#isletme #sag #isletme-form #form-sol #pencereler{
    display: flex;
    margin-bottom: 20px;
}
#isletme #sag #isletme-form #form-sol #pencereler section{
    width: 100%;
    background: #f79829;
    color: white;
    padding: 10px;
    box-sizing: border-box;
    border-top: 2px solid #f79829;
    text-align: center;
    font-family: Roboto , sans-serif;
    font-size: 13px;
    font-weight: bold;
    cursor: pointer;
}
#isletme #sag #isletme-form #form-sol #pencereler section.secili{
    background: white;
    border-top: 2px solid black;
    color: black;
}
#isletme #sag #isletme-form #form-sol #pencereler section i{
    margin-right: 5px;
}
#isletme #sag #isletme-form #form-sol #window{
    display: none;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form{
    width: 100%;
    display: table;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sol{
    width: 50%;
    float: left;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sol input{
    border-radius: 0;
    font-family: Roboto , sans-serif;
    font-size: 12px;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sol input:first-child + input + input,
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sol input:first-child + input + input + input{
    float: left;
    width: 30%;
    margin-right: 10px;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sol button{
    display: block;
    border-radius: 0;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag{
    width: calc(50% - 20px);
    float: right;
    margin-left: 20px;
    border-radius: 20px;
    overflow: hidden;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
    background: url("../img/kredi-karti-template.png");
    background-size: 100% 100%;
    height: 250px;
    position: relative;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #kart-sahibi-ismi{
    position: absolute;
    bottom: 10px;
    left: 18px;
    font-size: 25px;
    font-family: CredC , sans-serif;
    text-transform: uppercase;
    color: transparent;
    background: #666666;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    text-shadow: 0px 3px 3px rgba(255,255,255,0.5);
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #kart-numarasi{
    position: absolute;
    bottom: 75px;
    left: 18px;
    font-size: 20px;
    font-family: CredC , sans-serif;
    text-transform: uppercase;
    color: transparent;
    background: #666666;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    text-shadow: 0px 3px 3px rgba(255,255,255,0.5);
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #kart-son-kullanma{
    position: absolute;
    bottom: 42px;
    left: 146px;
    font-size: 11px;
    font-family: CredC , sans-serif;
    text-transform: uppercase;
    color: black;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #kart-son-kullanma span{
    float: right;
    margin-left: 15px;
    font-size: 15px;
    margin-top: -7px;
    color: transparent;
    background: #666666;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    text-shadow: 0px 3px 3px rgba(255,255,255,0.5);
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #logo{
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 80px;
}
#isletme #sag #isletme-form #form-sol #kredi-karti-form #kredi-karti-form-sag #logo img{
    display: none;
}
#isletme #sag #isletme-form #form-sol #window[data-window="havale"] section{
    width: 100%;
    border-bottom: 1px solid black;
    display: table;
    padding: 20px 0;
}
#isletme #sag #isletme-form #form-sol #window[data-window="havale"] section img{
    float: left;
    width: 25%;
    margin-right: 20px;
}
#isletme #sag #isletme-form #form-sol #window[data-window="havale"] section #banka-bilgileri{
    float: right;
    width: calc(75% - 40px);
    font-family: Roboto , sans-serif;
    font-size: 13px;
}
#isletme #sag #isletme-form #form-sol #window[data-window="havale"] section #banka-bilgileri #detay{
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sol #window[data-window="havale"] section #banka-bilgileri #detay:last-of-type{
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sol #bilgilendirmeler{
    width: 100%;
    margin-top: 20px;
}
#isletme #sag #isletme-form #form-sol #bilgilendirmeler section{
    padding: 10px;
    font-family: Roboto , sans-serif;
    font-size: 12px;
    margin-bottom: 10px;
    background: #f79829;
    color: white;
}
#isletme #sag #isletme-form #form-sol #bilgilendirmeler section i{
    margin-right: 5px;
}
#isletme #sag #isletme-form #form-sol #bilgilendirmeler section:last-child{
    margin-bottom: 0;
}
#isletme #sag #isletme-form h2 , #isletme #sag #isletme-form h3 , #isletme #sag #isletme-form h4{
    font-family: Work Sans , sans-serif;
    font-size: 23px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form h2 .fa-plus{
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    background: #00ff00;
    font-size: 14px;
    color: white;
    vertical-align: 1px;
    margin-left: 10px;
    cursor: pointer;
    border-radius: 5px;
}
#isletme #sag #isletme-form h3{
    font-size: 20px;
    border-left: 8px solid #f79829;
    padding-left: 5px;
    margin: 20px 0;
}
#isletme #sag #isletme-form h4{
    font-size: 18px;
}
#isletme #sag #isletme-form p{
    font-family: Roboto , sans-serif;
    font-size: 13px;
    margin-bottom: 10px;
    margin-top: -10px;
}
#isletme #sag #isletme-form p a{
    color: #0055ff;
}
#isletme #sag #isletme-form input , #isletme #sag #isletme-form textarea , #isletme #sag #isletme-form select{
    width: calc(100% - 22px);
    padding: 10px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form textarea{
    resize: none;
    min-height: 300px;
}
#isletme #sag #isletme-form #inputlar{
    width: 100%;
    display: table;
}
#isletme #sag #isletme-form #inputlar input{
    width: 20%;
    float: left;
}
#isletme #sag #isletme-form #inputlar span{
    float: left;
    padding: 0 10px;
    line-height: 35px;
}
#isletme #sag #isletme-form #multi-secenekler , #isletme #sag #isletme-form #secenekler{
    width: 100%;
    display: table;
}
#isletme #sag #isletme-form #multi-secenekler section , #isletme #sag #isletme-form #secenekler section{
    width: calc((100% / 5) - 10px);
    float: left;
    border: 1px solid #ececec;
    border-radius: 10px;
    font-family: Roboto , sans-serif;
    font-size: 12px;
    text-align: center;
    padding: 10px 0;
    cursor: pointer;
    margin-right: 10px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #multi-secenekler section:nth-child(5n + 0){
    margin-right: 0;
}
#isletme #sag #isletme-form #multi-secenekler section.secili , #isletme #sag #isletme-form #secenekler section.secili {
    background: #f79829;
    border-color: #f79829;
    font-weight: bold;
}
#isletme #sag #isletme-form #form-sag{
    float: right;
    width: calc(30% - 20px);
    margin-left: 20px;
}
#isletme #sag #isletme-form #form-sag > button{
    width: calc(100% - 10px);
    padding: 10px;
}
#isletme #sag #isletme-form #form-sag section{
    width: calc(100% - 22px);
    border: 1px solid #ececec;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sag section #baslik{
    width: calc(100% + 2px);
    padding: 10px;
    margin-top: -11px;
    margin-left: -11px;
    background: #f79829;
    font-family: Poppins , sans-serif;
    font-size: 14px;
    font-weight: 700;
    border-radius: 10px 10px 0 0;
    margin-bottom: 10px;
}
#isletme #sag #isletme-form #form-sag section #resim-sec{
    width: calc(100% - 10px);
    padding: 5px;
    text-align: center;
    margin-top: 10px;
    border-radius: 10px;
}
#isletme #sag #isletme-form #form-sag section table{
    font-family: Roboto , sans-serif;
    font-size: 13px;
    width: 100%;
}
#isletme #sag #isletme-form #form-sag section table tr td{
    padding-bottom: 10px;
    padding-right: 10px;
}
#isletme #sag #isletme-form #form-sag section table tr td:last-child{
    padding-right: 0;
}
#isletme #sag #isletme-form #form-sag section table tr:last-child td{
    padding-bottom: 0;
}
#isletme #sag #isletme-form #form-sag section table tr td select{
    width: 100%;
    padding: 5px 10px;
    font-size: 12px;
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sag section table tr td input{
    width: calc(100% - 22px);
    padding: 5px 10px;
    font-size: 12px;
    margin-bottom: 0;
}
#isletme #sag #isletme-form #form-sag section table tr td button , #isletme #sag #isletme-form #form-sag section table tr td a{
    padding: 8px 16px;
    font-size: 12px;
}
#isletme #sag #isletme-form #form-sag section table tr td button{
    margin-right: 10px;
}
#isletme #sag #isletme-form #form-sag section img{
    width: 100%;
}
#isletme #sag #isletme-form #form-sag section a.turuncu-buton{
    display: block;
    text-align: center;
    margin-top: 10px;
}
#isletme #sag #acilis_sesi{
    width: 100%;
    margin-bottom: 50px;
}
#isletme #sag #acilis_sesi h2:first-of-type{
    border-left: 5px solid #f79829;
    padding-left: 10px;
    margin-bottom: 20px;
    font-size: 28px;
}
#isletme #sag #pdf_dil{
    margin-bottom: 10px;
}
#isletme #sag #ses{
    width: 100%;
    display: table;
    margin-bottom: 5px;
    position: relative;
}
#isletme #sag #ses input{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    z-index: -1;
}
#isletme #sag #ses label{
    width: calc(80% - 40px);
    float: left;
    text-align: center;
    font-weight: bold;
}
#isletme #sag #ses label i{
    margin-right: 5px;
}
#isletme #sag #ses button{
    margin-left: 10px;
    width: calc(20% - 10px);
}
#isletme #sag .dropzone{
    border: 3px dashed gray;
    border-radius: 10px;
    height: 200px;
    background: #efefef;
    cursor: pointer;
    position: relative;
}
#isletme #sag .dropzone h2{
    font-family: Work Sans , sans-serif;
    font-size: 20px;
    text-align: center;
    line-height: 200px;
}
#isletme #sag .dropzone input{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    z-index: -1;
}
#isletme #sag #arkaplan-sec{
    margin-bottom: 10px;
    display: table;
    width: 100%;
}
#isletme #sag #arkaplan-sec .turuncu-buton{
    width: calc(80% - 40px);
    text-align: center;
    float: left;
}
#isletme #sag #arkaplan-sec button{
    float: right;
    width: calc(20% - 10px);
}
#isletme #sag #masalar{
    display: flex;
    flex-wrap: wrap;
}
#isletme #sag #masalar span{
    font-family: Poppins , sans-serif;
    font-size: 13px;
}
#isletme #sag #masalar a{
    width: calc((100% / 4) - 8px);
    border: 1px solid #ececec;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
    margin-right: 10px;
    margin-bottom: 10px;
    font-family: Roboto , sans-serif;
    font-size: 14px;
    text-align: center;
    text-decoration: none;
    color: black;
    font-weight: 700;
    position: relative;
}
#isletme #sag #masalar a:nth-child(4n + 0){
    margin-right: 0;
}
#isletme #sag #masalar a i{
    top: -3px;
    right: -3px;
    font-size: 10px;
    position: absolute;
}
#isletme #sag #garsonlar{
    width: 100%;
    display: table;
}
#isletme #sag #garsonlar span{
    font-family: Poppins , sans-serif;
    font-size: 13px;
}
#isletme #sag #garsonlar a{
    width: calc((100% / 3) - 47px);
    margin-right: 10px;
    display: block;
    float: left;
    padding: 20px;
    background: #00ff00;
    color: white;
    text-decoration: none;
    font-family: Poppins , sans-serif;
    font-size: 13px;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    margin-bottom: 10px;
}
#isletme #sag #garsonlar a.kirmizi{
    background: red;
}
#isletme #sag #garsonlar a:nth-child(3n + 0){
    margin-right: 0;
}
#isletme #sag #garsonlar a i{
    margin-right: 8px;
}

/* Footer */
footer{
    width: 100%;
    background: linear-gradient(201deg, rgba(236,150,131,1) 0%, rgba(209,132,138,1) 39%, rgba(180,113,146,1) 64%, rgba(102,73,135,1) 100%);
    padding: 100px 0;
}
footer #container{
    position: relative;
}
footer #container > img{
    position: absolute;
    top: -60px;
    right: 0;
    height: 120px;
}
footer #bize-ulasin{
    width: 50%;
    border-radius: 20px;
    background: white;
    padding: 5px 0;
    text-align: center;
    font-family: 'Playfair Display', serif;
    font-weight: 900;
    font-size: 40px;
    border: 3px solid black;
    margin: 0 auto;
    cursor: pointer;
    margin-bottom: 20px;
    transition: .2s ease-in-out;
}
footer #bize-ulasin:hover{
    background: #ffd500;
}
footer #logo{
    display: table;
    margin: 0 auto;
    margin-bottom: 20px;
}
footer #logo img{
    height: 100px;
}
footer #flex{
    display: flex;
}
footer #flex section{
    width: 100%;
    margin-right: 20px;
    font-family: "Octarine Bold" , sans-serif;
}
footer #flex section:last-child{
    margin-right: 0;
}
footer #flex section h3{
    font-family: 'Octarine Bold', serif;
    font-size: 22px;
    margin-bottom: 10px;
    font-weight: 900;
    color: white;
}
footer #flex section ul a{
    text-decoration: none;
}
footer #flex section ul li{
    list-style: none;
    color: white;
    margin-bottom: 10px;
    font-size: 14px;
}
footer #flex section ul li i{
    margin-right: 10px;
    transition: .2s ease-in-out;
}
footer #flex section ul li:hover i{
    margin-right: 15px;
}
footer #flex section ul a:last-child li{
    margin-bottom: 0;
}
footer #flex section table tr td{
    padding-bottom: 10px;
    padding-right: 5px;
    font-size: 14px;
    color: white;
}
footer #flex section table tr td:last-child{
    padding-right: 0;
}
footer #flex section table tr td i{
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: white;
    color: black;
    border-radius: 50%;
}
footer #flex section table tr td a{
    text-decoration: none;
    color: black;
}
footer #flex section #social{
    margin-top: 10px;
    margin-left: 4px;
}
footer #flex section #social a{
    text-decoration: none;
    margin-right: 10px;
    position: relative;
}
footer #flex section #social a:last-child{
    margin-right: 0;
}
footer #flex section #social a i{
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: white;
    text-align: center;
    line-height: 25px;
    color: black;
    font-size: 12px;
    position: relative;
    z-index: 1;
    border: 2px solid black;
}
footer #flex section #social a #border{
    display: inline-block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 2px solid black;
    position: absolute;
    left: -4px;
    bottom: -9px;
    z-index: 0;
    background: #fb617e;
    transition: .2s ease-in-out;
}
footer #flex section #social a:hover #border{
    left: -3px;
    bottom: -8px;
}
footer #kart-firmalari{
    display: table;
    margin: 30px auto;
}
footer #mangodo{
    text-align: center;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 10px;
    margin-bottom: 10px;
    color: rgba(255, 255, 255, 0.51);
}
footer #mangodo a{
    color: white;
    font-weight: bold;
}
footer #copyright{
    text-align: center;
    font-family: "Octarine Bold" , sans-serif;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.51);
}































/* Eklentiler */
.sp-colorize-container{
    background: none !important;
}
.sp-clear-enabled .sp-clear{
    display: none !important;
}
.cc-window {
    opacity: 1;
    transition: opacity 1s ease;
}
.cc-window.cc-invisible {
    opacity: 0;
}
.cc-animate.cc-revoke {
    transition: transform 1s ease;
}
.cc-animate.cc-revoke.cc-top {
    transform: translateY(-2em);
}
.cc-animate.cc-revoke.cc-bottom {
    transform: translateY(2em);
}
.cc-animate.cc-revoke.cc-active.cc-bottom,
.cc-animate.cc-revoke.cc-active.cc-top,
.cc-revoke:hover {
    transform: translateY(0);
}
.cc-grower {
    max-height: 0;
    overflow: hidden;
    transition: max-height 1s;
}
.cc-link,
.cc-revoke:hover {
    text-decoration: underline;
}
.cc-revoke,
.cc-window {
    position: fixed;
    overflow: hidden;
    box-sizing: border-box;
    font-family: Helvetica, Calibri, Arial, sans-serif;
    font-size: 12px;
    line-height: 1.5em;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    z-index: 9999;
}
.cc-window.cc-static {
    position: static;
}
.cc-window.cc-floating {
    padding: 2em;
    max-width: 24em;
    -ms-flex-direction: column;
    flex-direction: column;
}
.cc-window.cc-banner {
    padding: 10px 1em;
    width: 100%;
    -ms-flex-direction: row;
    flex-direction: row;
}
.cc-revoke {
    padding: 0.5em;
}
.cc-header {
    font-size: 18px;
    font-weight: 700;
}
.cc-btn,
.cc-close,
.cc-link,
.cc-revoke {
    cursor: pointer;
}
.cc-link {
    opacity: 0.8;
    display: inline-block;
    padding: 0.2em;
}
.cc-link:hover {
    opacity: 1;
}
.cc-link:active,
.cc-link:visited {
    color: initial;
}
.cc-btn {
    display: block;
    padding: 0.4em 0.8em;
    font-size: 0.9em;
    font-weight: 700;
    border-width: 2px;
    border-style: solid;
    text-align: center;
    white-space: nowrap;
    background: #f79829 !important;
}
.cc-banner .cc-btn:last-child {
    min-width: 140px;
}
.cc-highlight .cc-btn:first-child {
    background-color: transparent;
    border-color: transparent;
}
.cc-highlight .cc-btn:first-child:focus,
.cc-highlight .cc-btn:first-child:hover {
    background-color: transparent;
    text-decoration: underline;
}
.cc-close {
    display: block;
    position: absolute;
    top: 0.5em;
    right: 0.5em;
    font-size: 1.6em;
    opacity: 0.9;
    line-height: 0.75;
}
.cc-close:focus,
.cc-close:hover {
    opacity: 1;
}
.cc-revoke.cc-top {
    top: 0;
    left: 3em;
    border-bottom-left-radius: 0.5em;
    border-bottom-right-radius: 0.5em;
}
.cc-revoke.cc-bottom {
    bottom: 0;
    left: 3em;
    border-top-left-radius: 0.5em;
    border-top-right-radius: 0.5em;
}
.cc-revoke.cc-left {
    left: 3em;
    right: unset;
}
.cc-revoke.cc-right {
    right: 3em;
    left: unset;
}
.cc-top {
    top: 1em;
}
.cc-left {
    left: 1em;
}
.cc-right {
    right: 1em;
}
.cc-bottom {
    bottom: 1em;
}
.cc-floating > .cc-link {
    margin-bottom: 1em;
}
.cc-floating .cc-message {
    display: block;
    margin-bottom: 1em;
}
.cc-window.cc-floating .cc-compliance {
    -ms-flex: 1;
    flex: 1;
}
.cc-window.cc-banner {
    -ms-flex-align: center;
    align-items: center;
}
.cc-banner.cc-top {
    left: 0;
    right: 0;
    top: 0;
}
.cc-banner.cc-bottom {
    left: 0;
    right: 0;
    bottom: 0;
}
.cc-banner .cc-message {
    -ms-flex: 1;
    flex: 1;
}
.cc-compliance {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-line-pack: justify;
    align-content: space-between;
}
.cc-compliance > .cc-btn {
    -ms-flex: 1;
    flex: 1;
}
.cc-btn + .cc-btn {
    margin-left: 0.5em;
}
@media print {
    .cc-revoke,
    .cc-window {
        display: none;
    }
}
@media screen and (max-width: 900px) {
    .cc-btn {
        white-space: normal;
    }
}
@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) {
    .cc-window.cc-top {
        top: 0;
    }
    .cc-window.cc-bottom {
        bottom: 0;
    }
    .cc-window.cc-banner,
    .cc-window.cc-left,
    .cc-window.cc-right {
        left: 0;
        right: 0;
    }
    .cc-window.cc-banner {
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .cc-window.cc-banner .cc-compliance {
        -ms-flex: 1;
        flex: 1;
    }
    .cc-window.cc-floating {
        max-width: none;
    }
    .cc-window .cc-message {
        margin-bottom: 1em;
    }
    .cc-window.cc-banner {
        -ms-flex-align: unset;
        align-items: unset;
    }
}
.cc-floating.cc-theme-classic {
    padding: 1.2em;
    border-radius: 5px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-compliance {
    text-align: center;
    display: inline;
    -ms-flex: none;
    flex: none;
}
.cc-theme-classic .cc-btn {
    border-radius: 5px;
}
.cc-theme-classic .cc-btn:last-child {
    min-width: 140px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-btn {
    display: inline-block;
}
.cc-theme-edgeless.cc-window {
    padding: 0;
    background-color: white !important;
    color: black !important;
}
.cc-floating.cc-theme-edgeless .cc-message {
    margin: 2em 2em 1.5em;
}
.cc-banner.cc-theme-edgeless .cc-btn {
    margin: 0;
    padding: 0.8em 1.8em;
    height: 100%;
    background: #f79829;
}
.cc-banner.cc-theme-edgeless .cc-btn:hover,
.cc-banner.cc-theme-edgeless .cc-btn:focus{

}
.cc-banner.cc-theme-edgeless .cc-message {
    margin-left: 1em;
}
.cc-floating.cc-theme-edgeless .cc-btn + .cc-btn {
    margin-left: 0;
}









@media only screen and (max-width: 1200px) and (min-width: 769px){
    #container,
    #form #container,
    #blog #container{
        width: calc(95% - 40px);
        padding: 0 20px;
    }
    #index_blog .swiper a p{
        height: 47px;
    }
    #form #container{
        padding: 20px;
    }
    #blog #container{
        padding: 20px;
    }
    #isletme #sag #gelismis_istatistikler canvas{
        height: 250px !important;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content{
        width: 80%;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content h1{
        font-size: 28px;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content canvas{
        height: 200px !important;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #flex canvas{
        height: 250px !important;
    }
}

@media only screen and (max-width: 768px){
    #container,
    #form #container,
    #blog #container{
        width: calc(95% - 40px);
        padding: 0 20px;
    }
    header i.fa-bars{
        width: 60px;
        height: 60px;
        border-radius: 10px;
        border: 1px solid black;
        background: white;
        text-align: center;
        line-height: 60px;
        display: block;
        float: left;
        font-size: 40px;
        margin-top: 35px;
        transition: .2s ease-in-out;
    }
    header i.fa-bars[data-aktif="1"]{
        background: #feed01;
    }
    header.aktif i.fa-bars{
        width: 50px;
        height: 50px;
        line-height: 50px;
        margin-top: 20px;
    }
    header nav{
        width: 50%;
        position: fixed;
        top: 0;
        right: -50%;
        background: black;
        height: 100vh;
        left: auto;
        z-index: 99999999;
        transition: .2s ease-in-out;
    }
    header nav[data-aktif="1"]{
        right: 0;
    }
    header nav ul a li,
    header nav > ul li.acilir-menu{
        width: 100%;
        float: none;
        background: none;
        border: 0;
        padding: 20px;
        box-sizing: border-box;
        color: white;
        font-size: 30px;
    }
    header nav > ul .right{
        float: none;
    }
    header nav > ul li.acilir-menu > span i{
        color: white;
        margin-left: 10px;
    }
    header nav > ul li.acilir-menu ul li{
        font-size: 19px;
        padding: 10px 20px;
    }
    header nav > ul li.acilir-menu ul a:last-child li{
        margin-bottom: 0;
    }
    header nav > ul li.acilir-menu ul li img{
        height: 24px;
        margin-right: 10px;
        vertical-align: -6px;
    }
    #head h1{
        font-size: 150px;
    }
    #head h1 span{
        font-size: 100px;
        margin-top: -21px;
    }
    #head h1 img{
        right: -75px;
        height: 92px;
    }
    #head p{
        width: 80%;
    }
    #head #slider{
        width: 90%;
        height: 350px;
    }
    #head #slider #slider_container,
    #head #slider #slider_container ul li img{
        width: 100%;
        height: 350px;
    }
    #head #slider > img{
        left: -65px;
        bottom: -60px;
        height: 250px;
    }
    #tabs .tab h2{
        padding-top: 24px;
        font-size: 60px;
    }
    #tabs .tab #container > img{
        top: -50px;
        height: 110px;
    }
    #tabs .tab #container > p{
        font-size: 21px;
        line-height: 34px;
    }
    #tabs .tab section p{
        font-size: 17px;
        line-height: 24px;
    }
    #tabs .tab #flex section{
        width: 100%;
        margin-right: 0;
        height: 280px;
        border-radius: 30px;
		border: 7px solid black !important;
    }
    #tabs .tab #flex section:nth-child(2n + 0){
        border-radius: 30px;
    }
    #tabs .tab #flex section #border,
    #tabs .tab #flex section.two-line #border{
        height: 80px;
        transform: translate(-50% , -55%);
    }
    #tabs .tab #flex section p{
        font-size: 16px;
    }
    #index_blog .swiper a p{
        padding: 20px 10px;
    }
    #form #container #flex a{
        width: calc((100% / 3) - 40px);
    }
    #blog #container{
        padding: 20px;
    }
    #blog > #container > h1 {
        font-size: 100px;
    }
    #blog #container > article img.thumbnail{
        width: 100%;
        max-width: inherit;
    }
    #blog #container > article #yazi{
        font-size: 14px;
    }
    #blog #container > article #yazi h1{
        font-size: 28px;
    }
    #blog #container > article #yazi h2{
        font-size: 25px;
    }
    #blog #container > article #yazi h3{
        font-size: 22px;
    }
    #blog #container > article #yazi h4{
        font-size: 20px;
    }
    #isletme #sol{
        width: 22%;
    }
    #isletme #sag{
        width: calc(78% - 30px);
    }
    #isletme #sag #istatistikler{
        flex-wrap: wrap;
    }
    #isletme #sag #istatistikler section{
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    #isletme #sag #istatistikler section:last-child{
        margin-bottom: 0;
    }
    #isletme #sag #kucuk-tablo{
        width: calc(100% - 26px);
        margin-right: 0;
    }
    #isletme #sag #orta-tablo{
        width: calc(100% - 26px);
    }
    #isletme #sag #gelismis_istatistikler section #baslik{
        font-size: 10px;
    }
    #isletme #sag #gelismis_istatistikler canvas{
        height: 180px !important;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content{
        width: 80%;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content h1{
        font-size: 28px;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content canvas{
        height: 180px !important;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #flex canvas{
        height: 200px !important;
    }
    #isletme #sag #isletme-form #form-sol{
        width: 60%;
    }
    #isletme #sag #isletme-form #form-sag{
        width: calc(40% - 20px);
    }
    #isletme #sag #isletme-form #secenekler,
    #isletme #sag #isletme-form #multi-secenekler{
        display: flex;
    }
    #isletme #sag #isletme-form #secenekler section,
    #isletme #sag #isletme-form #multi-secenekler section{
        width: 100%;
    }
    #isletme #sag #isletme-form #form-sol #tasarimlar section{
        width: calc((100% / 3) - 8px);
        height: 170px;
    }
    #isletme #sag #isletme-form #form-sol #tasarimlar section img{
        height: 170px;
    }
    #isletme #sag #isletme-form #form-sol #menuler #menu section,
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan,
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan img{
        height: 190px;
    }
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-baslik input{
        font-size: 17px;
    }
    #isletme #sag #medya #medya-icerik{
        width: 90%;
    }
    #isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li,
    #isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li img{
        height: 100px;
    }
    #isletme #sag #isletme-form #form-sol #urun{
        width: 100%;
    }
    #isletme #sag #isletme-form #form-sol .tox-tinymce{
        height: 250px !important;
    }
    #isletme #sag #isletme-form #form-sol #urunler{
        height: 430px;
    }
    #isletme #sag #garsonlar a{
        width: calc((100% / 2) - 45px)
    }
    #isletme #sag #garsonlar a:nth-child(2n + 0){
        margin-right: 0;
    }
    #isletme #sag #garsonlar a:nth-child(3n + 0){
        margin-right: auto;
    }
    #isletme #sag #isletme-form #form-sag section table tr td a,
    #isletme #sag #isletme-form #form-sag section table tr td button{
        display: block;
        margin-right: 0;
        width: calc(100% - 32px);
        text-align: center;
    }
    #isletme #sag #isletme-form #form-sag section table tr td a{
        margin-top: 10px;
    }
    #isletme #sag #isletme-form #form-sag section table tr td button{
        width: 100%;
    }
}
@media only screen and (max-width:640px){
    @keyframes head_phone_up_down {
        0%{
            bottom: 7px;
        }
        50%{
            bottom: 12px;
        }
        100%{
            bottom: 7px;
        }
    }
    #container,
    #form #container,
    #blog #container{
        width: calc(95% - 10px);
        padding: 0 5px;
    }
    header.aktif{
        height: 74px;
    }
    header #logo img{
        height: 117px;
        width: 88px;
    }
    header.aktif #logo img{
        height: 74px;
        width: 57px;
    }
    header #logo::before{
        height: 117px;
        width: 88px;
    }
    header i.fa-bars{
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 22px;
        margin-top: 42px;
    }
    header.aktif i.fa-bars{
        width: 40px;
        height: 40px;
        line-height: 40px;
        margin-top: 16px;
    }
    header nav ul a li,
    header nav > ul li.acilir-menu{
        font-size: 15px;
    }
    header nav > ul li.acilir-menu > img{
        height: 24px;
    }
    header nav > ul li.acilir-menu ul li{
        font-size: 12px;
        padding: 5px 10px;
    }
    header nav > ul li.acilir-menu ul li img{
        height: 20px;
    }
    #iletisim_form #iletisim_form_container{
        width: 95%;
        padding: 20px 20px;
        box-sizing: border-box;
    }
    #iletisim_form #iletisim_form_container input,
    #iletisim_form #iletisim_form_container textarea{
        width: calc(84% - 26px);
        font-size: 11px;
    }
    #head h1{
        font-size: 75px;
    }
    #head h1 span{
        font-size: 51px;
        margin-top: -8px;
    }
    #head h1 img{
        bottom: 7px;
        right: -42px;
        height: 49px;
    }
    #head p{
        line-height: 16px;
        font-size: 12px;
    }
    #head #slider,
    #head #slider #slider_container,
    #head #slider #slider_container ul li img{
        height: 206px;
    }
    #head #slider > img{
        left: -33px;
        bottom: -58px;
        height: 189px;
    }
    #tabs .tab h2{
        padding-top: 8px;
        font-size: 32px;
    }
    #tabs .tab #container > img{
        height: 60px;
    }
    #tabs .tab #container > p{
        font-size: 13px;
        line-height: 24px;
    }
    #tabs .tab section{
        margin-bottom: 35px
    }
    #tabs .tab section #tick,
    #tabs .tab section #tick img{
        height: 40px;
        width: 40px;
    }
    #tabs .tab section p{
        font-size: 11px;
        line-height: 18px;
        width: calc(100% - 60px);
    }
    #tabs .tab #flex section{
        height: 190px;
    }
    #tabs .tab #flex section h3{
        font-size: 34px;
        margin-top: 10px;
        margin-bottom: 20px;
    }
    #tabs .tab #flex section #border{
        height: 83px;
        transform: translate(-50% , -45%);
    }
    #tabs .tab #flex section.two-line #border{
        height: 65px;
        transform: translate(-50% , -56%);
    }
    #tabs .tab #flex section p{
        font-size: 10px;
    }
    #tabs .tab #flex section.fill p{
        font-size: 12px;
    }
    #marquee #marquee-container p{
        font-size: 13vw;
    }
    #index_blog #arrows{
        font-size: 25px;
    }
    #index_blog #arrows img{
        vertical-align: -4px;
        height: 29px;
    }
    #index_blog .swiper a #image{
        height: 110px;
    }
    #index_blog .swiper a p{
        padding: 7px;
        padding-top: 13px;
        font-size: 18px;
        height: 46px;
        line-height: 23px;
    }
    #referanslar .swiper a{
        height: 55px;
    }
    #form #container{
        width: calc(95% - 40px);
        padding: 20px;
    }
    #form #container h1{
        font-size: 75px;
    }
    #form #container > h2{
        font-size: 36px;
    }
    #form #container > p{
        font-size: 15px;
        line-height: 22px;
    }
    #form form > input[type="email"], #form form > input[type="password"]{
        width: calc(100% - 22px);
        margin-right: 0;
    }
    #form #flex{
        flex-wrap: wrap;
    }
    #form #container #flex a{
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px;
    }
    #form form h2{
        font-size: 31px;
        text-shadow:
            0 1px #b0b8ba,
            -1px 0 #ffffff,
            -1px 2px #b0b8ba,
            -2px 1px #ffffff,
            -2px 3px #b0b8ba,
            -3px 2px #ffffff;
    }
    #form form #secenekler{
        flex-wrap: wrap;
    }
    #form form #secenekler section{
        width: calc((100% / 2) - 10px);
        margin-bottom: 20px;
    }
    #form form #secenekler section:nth-child(2n + 0){
        margin-right: 0;
    }
    #form form .inputlar input{
        width: calc(100% - 26px);
        margin-right: 0;
    }
    #form form label{
        font-size: 13px;
        line-height: 22px;
    }
    #form.giris #container > #border{
        padding: 20px;
    }
    #form.giris #container > #border p{
        font-size: 13px;
    }
    #form.giris #container > #border input[type="text"],
    #form.giris #container > #border input[type="password"],
    #form.giris #container > #border input[type="email"]{
        width: calc(100% - 26px);
    }
    #form form #button button{
        padding: 10px 30px;
    }
    #blog #container{
        width: calc(95% - 20px);
        padding: 10px;
        margin-top: 50px;
    }
    #blog #yazilar article{
        width: 100%;
        margin-right: 0;
    }
    #blog #container > article #yazi h1.baslik{
        font-size: 40px;
        line-height: 42px;
    }
    #blog #container > article img#thumbnail{
        width: calc(100% - 40px);
        box-sizing: border-box;
    }
    #blog #container > article > h1{
        font-size: 40px;
        text-shadow:
            0 1px #b0b8ba,
            -1px 0 #ffffff,
            -1px 2px #b0b8ba,
            -2px 1px #ffffff,
            -2px 3px #b0b8ba,
            -3px 2px #ffffff,
            -3px 4px #b0b8ba,
            -4px 3px #ffffff;
    }
    #blog #container > article #yazi h1{
        font-size: 35px;
    }
    #blog #container > article #yazi h2{
        font-size: 30px;
    }
    #blog #container > article #yazi h3{
        font-size: 25px;
    }
    #blog #container > article #yazi h4{
        font-size: 20px;
    }
    #isletme #sol{
        width: 100%;
        margin-bottom: 10px;
    }
    #isletme #sag{
        width: calc(100% - 20px);
        margin-left: 0;
    }
    #isletme #sag #istatistikler{
        flex-wrap: wrap;
    }
    #isletme #sag #istatistikler section{
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    #isletme #sag #istatistikler section:last-child{
        margin-bottom: 0;
    }
    #isletme #sag #kucuk-tablo{
        width: calc(100% - 26px);
        margin-right: 0;
    }
    #isletme #sag #orta-tablo{
        width: calc(100% - 26px);
    }
    #isletme #sag #filtreler a{
        font-size: 12px;
    }
    #isletme #sag #gelismis_istatistikler section #baslik{
        font-size: 10px;
    }
    #isletme #sag #gelismis_istatistikler canvas{
        height: 170px !important;
        width: 100% !important;
    }
    #isletme #sag #istatistik_detay #loading{
        width: 70%;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content{
        width: 80%;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #overflow-y{
        height: 70vh;
        overflow-y: scroll;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content h1{
        font-size: 26px;
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content section canvas{
        height: 150px !important;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #flex{
        display: block;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #flex section{
        width: 100%;
        margin-right: 0;
        box-sizing: border-box;
    }
    #isletme #sag #istatistik_detay #istatistik_detay_content #flex canvas{
        height: 130px !important;
    }
    #isletme #sag #isletme-form #form-sol{
        width: 60%;
    }
    #isletme #sag #isletme-form #form-sag{
        width: calc(40% - 20px);
    }
    #isletme #sag #isletme-form #secenekler,
    #isletme #sag #isletme-form #multi-secenekler{
        display: flex;
    }
    #isletme #sag #isletme-form #secenekler section,
    #isletme #sag #isletme-form #multi-secenekler section{
        width: 100%;
    }
    #isletme #sag #isletme-form #form-sol #tasarimlar section{
        width: calc((100% / 3) - 8px);
        height: 170px;
    }
    #isletme #sag #isletme-form #form-sol #tasarimlar section img{
        height: 170px;
    }
    #isletme #sag #isletme-form #form-sol #menuler #menu section,
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan,
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-arkaplan img{
        height: 190px;
    }
    #isletme #sag #isletme-form #form-sol #menuler #menu section #menu-baslik input{
        font-size: 17px;
    }
    #isletme #sag #medya #medya-icerik{
        width: 90%;
    }
    #isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li,
    #isletme #sag #medya #medya-icerik #medya-sag #medya-resimler ul li img{
        height: 100px;
    }
    #isletme #sag #isletme-form #form-sol #urun{
        width: 100%;
    }
    #isletme #sag #isletme-form #form-sol .tox-tinymce{
        height: 250px !important;
    }
    #isletme #sag #isletme-form #form-sol #urunler{
        height: 430px;
    }
    #isletme #sag #garsonlar a{
        width: calc((100% / 2) - 45px)
    }
    #isletme #sag #garsonlar a:nth-child(2n + 0){
        margin-right: 0;
    }
    #isletme #sag #garsonlar a:nth-child(3n + 0){
        margin-right: auto;
    }
    #isletme #sag #isletme-form #form-sag section table tr td a,
    #isletme #sag #isletme-form #form-sag section table tr td button{
        display: block;
        margin-right: 0;
        width: calc(100% - 32px);
        text-align: center;
    }
    #isletme #sag #isletme-form #form-sag section table tr td a{
        margin-top: 10px;
    }
    #isletme #sag #isletme-form #form-sag section table tr td button{
        width: 100%;
    }
    footer #logo{
        text-align: center;
    }
    footer #logo img{
        width: 80%;
        height: auto;
    }
    footer #container > img{
        top: -51px;
        height: 55px;
    }
    footer #bize-ulasin{
        width: 100%;
    }
    footer #flex{
        flex-wrap: wrap;
    }
    footer #flex section{
        width: 100%;
        margin-bottom: 20px;
        text-align: center;
        margin-right: 0;
    }
    footer #flex section:last-child{
        margin-bottom: 0;
    }
    footer #flex section table{
        display: inline-block;
    }
    footer #flex section table tr td{
        text-align: left;
    }
    footer #kart-firmalari{
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }
    footer #kart-firmalari svg{
        width: 330px;
        display: block;
        margin: auto;
    }
    footer #mangodo{
        width: 100%;
        display: block;
        text-align: center;
        padding: 20px 0;
        padding-bottom: 5px;
    }
    footer #mangodo a{
        text-decoration: none;
    }
}
@media only screen and (max-width:350px){
    footer #kart-firmalari svg{
        width: 260px;
    }
}