@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
 html {


--birinci-renk : #f5f6f0;
--ikinci-renk : #e6e0d0;
--ucuncu-renk : #000;
    
     --color: #000;
     --color-2: #000;
     --text-color: #525251;
     --bg-color: #525251;
     /** genel site renkleri ***/
     --bg-dark: #525251;
     --p-color: #525251;
     --w-color: #fbfbf3;
     --dodge: #000;
     --dodge-2: #ff8e2b;
     --dodge-3: #666666;
     --dodge-4: #ff8e2b;
     --light: #fbfbf3;
     --shadow: 0px 0px 30px 10px rgba(0, 0, 0, 0.05);
     --imgdodge:  brightness(0) saturate(100%) invert(96%) sepia(9%) saturate(355%) hue-rotate(350deg) brightness(92%) contrast(95%);
     --xxl-font: 75px;
     --font-title:   "DM Serif Display", serif;
     --header-line: 50px;
     --menu-text-color: #878787;

 }


 @media screen and (max-width: 1000px) {
     html {


         --xxl-font: 25px;

     }
 }


 [contenteditable="true"] {
     position: relative;
 }

 .editable {
     position: relative;
 }

 #miniToolbar button {
     background: #f5f5f5;
     border: none;
     margin: 0 3px;
     padding: 5px 8px;
     cursor: pointer;
     border-radius: 4px;
     font-size: 14px;
 }

 #miniToolbar button:hover {
     background: #ddd;
 }

 #miniToolbar button.active {
     background: #333;
     color: #fff;
 }

 [contenteditable="true"]:focus {
     outline: none;
     border: none !important;
     box-shadow: none !important;
 }



 .svg-color {
     filter: brightness(0) saturate(100%) invert(20%) sepia(18%) saturate(4861%) hue-rotate(198deg) brightness(96%) contrast(87%);
 }

 h1,
 h2,
 h3,
 h4,
 p,
 strong,
 b,
 ul,
 li {
     margin: 0px;
     padding: 0px;
     list-style: none;
 }

 p {

     font-size: 15px;
     line-height: 30px;


 }

 a {
     text-decoration: none;
     color: #666
 }

 button,
 input {
     outline: none;
 }

 body {
     margin: 0;
     padding: 0;
     font-family: "Plus Jakarta Sans", sans-serif;
     font-size: 17px;
     overflow-x: hidden;
     content: none;
     color: var(--p-color);

 }




 ::-webkit-scrollbar {
     width: 3px !important;
 }

 ::-webkit-scrollbar-track {}

 ::-webkit-scrollbar-thumb {
     background: #272727;
 }

 ::-webkit-scrollbar-thumb:window-inactive {
     background: #272727;
 }


 .detay-fiyat {

     line-height: 35px;


 }


 .url-none .more-buton {
     display: none;
 }



 input,
 select,
 textarea,
 button {
     font-family: "Plus Jakarta Sans", sans-serif;

 }

 .bold {
     font-weight: bold;
 }

 .ciz {
     text-decoration: line-through;
 }

 .innerbox {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
 }

 .txtcrop {
     width: 100%;
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
 }

 .clear:after {
     display: inline-table;
     clear: both;
     content: '';
 }

 .site-title-h2 {
     color: var(--p-color);
 }

 .COMPUTER {}

 .MOBILE {
     display: none;
 }

 @media screen and (max-width: 1000px) {
     .COMPUTER {
         display: none;
     }

     .MOBILE {
         display: block;
     }
 }


 .full-kutu-resim-menu .resim-menu .li a:hover {
     background: var(--dodge);
 }


 .etiket-listeleme .h2 {
     font-size: 18px;
     font-weight: 600;
     padding: 10px 0px;
 }

 .etiket-listeleme .img-kare {
     border-radius: 15px;
 }


 .comp-1 .img {
     position: relative;
     z-index: 20;
     box-shadow: 0px 30px 30px rgba(0, 0, 0, 0.05);
     border-radius: 6px;
 }

 .comp-1 .img img {
     z-index: 0;
     transition: 0.5s;
 
 }

 

 .comp-1 .title .h2 {
     color: var(--menu-text-color);
     font-size: 14px;
 }

 .comp-1 .title .p {
     color: var(--color);
 }

 .comp-1 .title::after {
     background: var(--menu-text-color);
     left: 10px;
     width: 1px;
 }

 .comp-1 .title {
     padding-left: 20px;
 }

 .comp-1 .img::after {
     width: 100%;
     height: 100%;
     position: absolute;
     content: '';
     display: inline-table;
     left: 0;
     top: 0;

     background: rgb(0, 0, 0);
     background: linear-gradient(284deg, rgba(0, 0, 0, 0) 31%, var(--bg-color) 100%);
     display: none;

 }

 .comp-1:hover img {
     filter: grayscale(0%);
 }



 .etiket .etiketle {
     display: inline-block;
     padding: 0px 12px;
     border-radius: 4px;
     background: var(--bg-dark);
     color: var(--w-color);
     line-height: 29px;
 }


.ss-logo {
    position: fixed;
    top: 0px;
    left: 30px;
    /* Logoyu kendi genişliğinin %50'si kadar sola kaydırır 
    transform: translateX(-50%); */
    z-index: 300;
    transition: 0.5s;
    padding: 9px;

    

 
    z-index: 99999999;

 color: #000;


 
 
}
.ss-logo div{ 
    font-weight: 300;
    font-size: 45px;
    
 
    letter-spacing: -0.02em;
 
    font-weight: 800;
    line-height: normal;




}
.ss-logo span { display: inline-block; width: 100%; font-size: 18px; line-height: 15px;   text-align: right;}
 

  @media screen and (max-width: 1000px) {
      
    .ss-logo { position: absolute; }
.ss-logo div{ 
    
    font-size: 25px;
    }
 }


.ss-logo-bg { display: block !important; transition: 0.5s; }

 .anasayfa .ss-logo {  color: var(--birinci-renk);}


 
.proje-list { position: relative; }
.proje-list .title {  position: absolute; bottom: 0; left: 0; padding: 30px; color: #fff;}
.proje-list .title .h2  { font-size:clamp(18px,5vw,25px); font-weight: 100; }
.proje-list img { transition: 1s; }
.proje-list:hover img { transform: scale(1.20);}


.proje-list-2 { position: relative; }
.proje-list-2 .title {  position: absolute; bottom: 0; left: 0; padding: 30px; color: #fff; background: #000; width: 100%; height: 100%; display: flex; align-items: center; align-content: center;}
.proje-list-2 .title .info  {  width: 100%; text-align: center; color: #fff; }
.proje-list-2 .title .info h1,
.proje-list-2 .title .info h2,
.proje-list-2 .title .info p { color: var(--ikinci-renk) ;}
.proje-list-2 img { transition: 1s; }
.proje-list-2:hover img { transform: scale(1.20);}






 .head {}

 .z-index-100 {
     z-index: 100;
 }

 /*************************************************************
**************************HEADER*******************************/
 .header {
     width: 100%;
     left: 0;
     top: 0;
     z-index: 800;
     padding: 10px 0px;
     position: relative;


     box-shadow: none;


 }


 .header .style-1 {

     position: relative;



     padding: 6px 30px;

     border-radius: 100px;

     background: #fff;
     box-shadow: 0px 0px 20px -10px rgba(0, 0, 0, 0.1);


 }

 .min-menu {
     padding: 30px;
     max-width: 400px;
     margin: 0 auto;
 }

 .min-menu>div {
     padding: 5px 0px;
 }

 .min-menu a {
     color: var(--dodge);
     font-size: 14px;
     color: var(--color);
 }

 .min-menu strong {
     color: var(--dodge-2);
     font-weight: 300;
 }

 .min-menu a:hover strong {
     color: var(--dodge);
 }






 .header .logo {
     height: calc(var(--header-line) - 10px);
     padding: 0px;
     position: absolute;
     top: 10px;
     /** filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7498%) hue-rotate(4deg) brightness(128%) contrast(99%);**/
 }


 .site-header .grg {
     padding: 0px;
     display: flex;
     justify-content: space-between;
     align-content: center;
     align-items: center;
 }

 .site-header .grg>div:nth-child(1) {
     flex: 4;
     text-align: left;
 }

 .site-header .grg>div:nth-child(2) {
     flex: 8;
     text-align: right;
 }


 .header .menu .url-menu {
     display: inline-block;
     color: #fff;
 }

 .header .menu .url-menu>a {
     margin: 0px 0px;
     transition: 0.5s;
     color: var(--p-color);
     font-weight: 500;
     transition: 0.5s
 }

 .header .menu .url-menu:hover {
     cursor: pointer;
 }

 .header .menu .url-menu span {
     display: inline-block;
     line-height: var(--header-line);
     padding: 0px 10px;
     border-radius: 0px;
     font-size: 18px;
     font-weight: 500;
     letter-spacing: -1px;
     color: var(--menu-text-color);
 }

 .header .menu .url-menu:hover span {
     color: var(--dodge-4);
 }



.ss-dil {
          
            position: fixed;
            right: 70px;
            top: 22px;
            z-index: 5000;
            box-sizing: border-box;
           
            font-size: 18px;
             
           
 }
 .ss-dil a { display: inline-block; color: #000; padding: 0px 5px; font-weight: 100; }




.ss-dil-2 {
          
         
         
            padding: 20px 0px;
            box-sizing: border-box;
           
            font-size: 18px;
             
           
 }
 .ss-dil-2 a { display: inline-block; color: #000; padding: 0px 9px 0px 0px; font-weight: 500; }




  .menu-shadow { width: 160px; height: 70px; background: #fff; position: fixed; top:0; right: 0px; z-index: 4000;}

        .hamburger-menu {
            width: 70px;
            height: 70px;
            position: fixed;
            right: 0px;
            top: 0px;
            z-index: 5000;
            box-sizing: border-box;
            padding: 5px;
            padding-top: 12px;
            transform: scale(0.50);
         
        }

        ._hamburger {
            width: 60px;
            height: 45px;
            position: relative;

            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
            -webkit-transition: .5s ease-in-out;
            -moz-transition: .5s ease-in-out;
            -o-transition: .5s ease-in-out;
            transition: .5s ease-in-out;
            cursor: pointer;
        }

        ._hamburger span {
            display: block;
            position: absolute;
            height: 9px;
            width: 100%;
            background: #000;
            border-radius: 9px;
            opacity: 1;
            left: 0;
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
            -webkit-transition: .25s ease-in-out;
            -moz-transition: .25s ease-in-out;
            -o-transition: .25s ease-in-out;
            transition: .25s ease-in-out;
        }

        ._hamburger span:nth-child(1) {
            top: 0px;
        }

        ._hamburger span:nth-child(2) {
            top: 18px;
        }

        ._hamburger span:nth-child(3) {
            top: 36px;
        }

        ._hamburger.open span:nth-child(1) {
            top: 18px;
            -webkit-transform: rotate(135deg);
            -moz-transform: rotate(135deg);
            -o-transform: rotate(135deg);
            transform: rotate(135deg);
        }

        ._hamburger.open span:nth-child(2) {
            opacity: 0;
            left: -60px;
        }

        ._hamburger.open span:nth-child(3) {
            top: 18px;
            -webkit-transform: rotate(-135deg);
            -moz-transform: rotate(-135deg);
            -o-transform: rotate(-135deg);
            transform: rotate(-135deg);
        }

        .ss-menu-2 span { background: #fff ; }


        .yan-hamburger {
            background: var(--ikinci-renk);
            position: fixed;
            z-index: 4500;
            top: 0px;
            width: 50%;
            height: 100%;
            display: flex;
            align-items: center;
            align-content: center;
            box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
            transition: 0.5s ease-in-out;
            right: -50%;
        }

        .yan-hamburger:after {
            display: inline-table;
            content: '';
            position: absolute;
            left: 0%;
            top: 0px;
            width: 100%;
            height: 100%;
            background: rgba(255, 255, 255, 0.7);

            z-index: -1;
            transition: 1s ease-in-out;
        }

        .yan-hamburger-on:after {
            left: -100%;
        }


        .yan-hamburger>div {
            width: 100%;
        }

        .yan-hamburger .menu {
            max-width: 350px;
            margin: 0 auto;
        }

        .yan-hamburger .menu .url-menu {
            display: inline-block;
            width: 100%;
            display: inline-block;
            padding: 6px 0px;
            font-size: 32px;
            font-weight: 600;
            font-family: var(--font-title);
            color: #000;
        }

        .yan-hamburger .menu .url-menu:hover {
           color: #fff
        }

        @media screen and (max-width: 1000px) {
            .yan-hamburger {
                width: 95%;
                right: -95%;
            }

            .yan-hamburger .menu {
                max-width: 100%;
                margin: 0 auto;
                padding: 0px 20px;
            }
        }

        .yan-hamburger-on {
            right: 0px;
        }

.yan-hamburger .url-sm p { color: #000; letter-spacing: 1px;}


  .ac-scroll-track {
    height: calc(100vh + 600px);
    position: relative;
  }

  .ac-slider {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;

  }

  .ac-scene {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    will-change: transform;
  }

.ac-hero-text {
  position: absolute;
  top: 50%;
  left: 50%;
  /* Marginleri sildik */
  max-width: 600px;
  text-align: center;
  z-index: 10;
  pointer-events: none;
  will-change: transform, opacity;
  /* Başlangıçta tam merkezde durması için */
  transform: translate(-50%, -50%); 
  transform-origin: center center;
  text-align: left;
}

 
  .ac-hero-text .ac-eyebrow {
    
    font-weight: 300;
    font-size: clamp(11px, 1.2vw, 13px);
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--birinci-renk);
    margin-bottom: 18px;
    opacity: 0.9;
  }

  .ac-hero-text h1 {
 
    font-weight: 300;
    font-size: clamp(60px, 9vw, 90px);
    color: var(--birinci-renk);
    line-height: 0.92;
    letter-spacing: -0.02em;
    white-space: nowrap;
    font-weight: 800;
   
  }

  .ac-hero-text h1 em {
    font-style: italic;
    color: var(--birinci-renk);
  }

  .ac-hero-text  p {
    margin-top: 22px;
    font-size:  2rem ;
    font-weight: 300;
    color: var(--birinci-renk);
    
    text-align: right;
  }

  .ac-hint {
    position: absolute;
    bottom: 36px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 20;
    pointer-events: none;
    will-change: opacity;
  }

  .ac-hint span {
    font-size: 10px;
    font-weight: 300;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: var(--ac-muted);
  }

  .ac-hint .ac-hint-line {
    width: 1px;
    height: 44px;
    background: linear-gradient(to bottom, var(--birinci-renk), transparent);
    animation: ac-drip 1.8s ease-in-out infinite;
  }

  @keyframes ac-drip {
    0% {
      transform: scaleY(0);
      transform-origin: top;
      opacity: 1;
    }

    50% {
      transform: scaleY(1);
      transform-origin: top;
      opacity: 1;
    }

    51% {
      transform: scaleY(1);
      transform-origin: bottom;
    }

    100% {
      transform: scaleY(0);
      transform-origin: bottom;
      opacity: 0;
    }
  }

  .ac-progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 2px;
    width: 0%;
    background: linear-gradient(to right, transparent, var(--birinci-renk), transparent);
    z-index: 30;
    will-change: width;
  }


  .ss-text-slider { position: absolute; bottom: 30px; left: 30px; z-index: 1000;}
  .ss-text-slider p { color: var(--birinci-renk); letter-spacing: 1px; font-size: clamp(20px, 5vw, 40px); line-height:clamp(30px, 5vw, 50px); }  





  .ac-reset {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 30;
    padding: 8px 20px;
    font-family: 'Outfit', sans-serif;
    font-size: 11px;
    font-weight: 300;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ac-muted);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 2px;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.4s ease, background 0.2s;
  }

  .ac-reset.ac-show {
    opacity: 1;
  }

  .ac-reset:hover {
    background: rgba(255, 255, 255, 0.14);
    color: var(--birinci-renk);
  }

  .ac-corner {
    position: absolute;
    width: 36px;
    height: 36px;
    z-index: 20;
    pointer-events: none;
    opacity: 0.45;
  }

  .ac-corner.ac-tl {
    top: 22px;
    left: 22px;
    border-top: 1px solid var(--birinci-renk);
    border-left: 1px solid var(--birinci-renk);
  }

  .ac-corner.ac-br {
    bottom: 22px;
    right: 22px;
    border-bottom: 1px solid var(--birinci-renk);
    border-right: 1px solid var(--birinci-renk);
  }

  .ac-next-section {
    min-height: 100vh;
    background: #0d1117;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ac-muted);
    font-size: 14px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
  }



 .light-menu {
     position: fixed;
     left: -100%;
     top: 0;
     width: 100%;
     height: 100vh;
     z-index: 9000;
     background: #fff;
     cursor: default;
     display: flex;
     align-items: center;
     align-content: center;
     color: #000;
     transition: 0.5s;
 }

 .light-menu .content {
     width: 100%;
     text-align: left;
 }

 .light-menu .img-story {
     border-radius: 10px;
 }

 .light-menu .light-menu-close {
     position: absolute;
     top: 20px;
     right: 20px;
     z-index: 20;
 }

 .light-menu .light-menu-close i {
     display: inline-block;
     width: 35px;
     height: 35px;
     cursor: pointer;
     line-height: 35px;
     font-size: 22px;
     background: #000;
     color: #fff;
     text-align: center;
 }

 .light-menu-list {
     text-align: left;
     width: 100%;
 }

 .light-menu-list a {
     display: inline-block;
     padding: 6px 20px;
     font-size: 28px;
     color: var(--bg-color);
     font-family: var(--font-title);
     letter-spacing: -1px;
 }

 .light-menu-list a:hover {
     color: #ccc;
 }


.light-menu .texti-tema { padding: 50px; background: #f5f5f5; height: 100vh; }
 .light-menu .texti-tema p {
 
     font-size: 25px;
     color: var(--menu-text-color);
     font-weight: 300;
     letter-spacing: -1px;



   background: linear-gradient(to bottom, #404040 0%, #b0b0b0 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;


 }
  .light-menu .texti-tema h2  { font-size: 45px; color: var(--dodge-2);





   background: linear-gradient(to right, #dd1f0a 0%, #ff8e2b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    display: inline-block;


}



 .header .menu .url-menu .acilanmenu {
     background: var(--w-color);
 }

 .header .menu .url-menu .acilanmenu ul li a {
     display: inline-block;
     width: 100%;
     padding: 15px 12px;
     color: var(--bg-color);
     font-size: 14px;
     font-weight: 600;
     border-bottom: 1px solid #ccc;

 }

 .header .menu .url-menu .acilanmenu ul li a:hover {
     background: var(--light);
 }



 .header .arada-menu {
     background: var(--bg-color);
 }

 .header .arada-menu .menu .url-menu span {
     color: #fff;
     font-size: 15px;
     padding: 0px 13px;
     border-right: 1px solid rgba(255, 255, 255, 0.2);
 }

 .header .arada-menu .menu .url-menu:hover span {
     background: var(--dodge-2);
     color: var(--dodge)
 }

 .header .arada-menu .menu .url-menu:last-child span {
     background: none;
     color: #fff;
 }

 .header .arada-menu .menu .url-menu:hover:last-child span {
     background: #fff;
     color: var(--bg-color)
 }


 .anasayfa .header {
     position: fixed;
 }


 .info-alani {
     padding: 8px 40px;
     text-align: right;
 }

 .info-alani p {
     display: inline-block;
     color: var(--menu-text-color);
     line-height: 16px;
 }

 .info-alani p i {
     display: inline-block;
     padding: 0px 5px;
     color: var(--color);
 }

 .info-alani .diltext {
     display: inline-block;
     padding: 0px 5px;
     font-size: 14px;
     color: #000;
 }

 .info-alani .dil-aktif {
     font-weight: 600;
     color: #000;
 }

 .info-alani a.tp-buton {
     display: inline-block;
     font-size: 13px;
     padding: 6px 12px;
     border: 1px solid #000;
     color: #000;
     border-radius: 3px;
 }

 .info-alani a.tp-buton i {
     display: inline-block;
     font-size: 13px;
     padding: 0px 3px 0px 0px;
 }

 .info-alani a.tp-buton-2 {
     display: inline-block;
     font-size: 13px;
     padding: 6px 12px;
     color: #000;
     cursor: pointer;
 }

 .info-alani a.tp-buton-2 i {
     display: inline-block;
     font-size: 17px;
     padding: 0px 3px 0px 0px;
 }


 #pageTransition {
     position: fixed;
     top: -100vh;
     /* İlk başta görünmez */
     left: 0;
     width: 100%;
     height: 100vh;
     background: black;
     /* Geçiş animasyonu için arkaplan */
     z-index: 9999;
     transition: top 0.5s ease-in;
 }

 #pageTransition.active {
     top: 0;
     /* Ekranı kaplar */
 }

 #pageTransition.hide {
     left: -100vw;
     /* Soldan kaybolur */
     transition: left 0.5s ease-out 2s;
     /* 2 saniye bekleyip kaybolur */
 }


 .tirnak-image h2 {
     letter-spacing: -1px;
 }







 /*************************************************************
*************************************************************/


 .open-menu .acilanmenu i {
     color: #000 !important;
     float: right;
 }



 .mobil-menu-ikonu {
     background: var(--color-2);
 }







 .galeri-fix .sticky {
     padding-top: 80px;
 }





 .list-footer {
     background: #FFF;
     background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 85%);
 }



 .list-footer .bx-tema h3 a {
     font-size: 18px;
     color: var(--color);
     font-family: var(--font-title);
 }

 .list-footer .bx-tema .li a {
     font-size: 14px;
     color: var(--color);
 }

 .list-footer .bx-tema .li a:hover {
     color: var(--dodge-2);
 }





 .mobile-header {
     width: 100%;
     position: relative;
     z-index: 4000;
     height: 70px;
     background: #fff;
 }

 .mobile-header img { }

 

 @media screen and (max-width: 1000px) {

     .mobile-header img {
         height: 50px;
         padding: 10px;
         position: absolute;
         left: 10px;
     }
 }

 .anasayfa .mobile-header {
     position: absolute;
     top: 0;
     z-index: 9000;
     background: none;
 }


 .tirnak-image .article-xs img {
     filter: var(--imgdodge);
 }




 .site-tab {
     border: 1px solid #d1d1d1;
 }

 .ozelcover {
     position: absolute;
     width: 50%;
     height: 100%;
     background: #004e9c;
     right: 0;
     top: 0;
     z-index: 0;
 }

 .ozelcover img {
     object-fit: cover;
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     right: 0;
 }




 .user-profil {
     background: linear-gradient(-45deg, #ee7752, #e73c7e, var(--color), var(--color));
     background-size: 400% 400%;
     animation: gradient 3s ease infinite;
     max-width: 350px;
     border-radius: 10px;
     padding: 30px;
     box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.2);
     text-align: center;

     position: relative;
     z-index: 0;
     margin: 0 auto;




 }





.img-h-cover { width: 100%; height: 100vh; position: relative ; z-index: 0;}
.img-h-cover img { position: absolute; width: 100%; height: 100%; object-fit: cover; left:0 ; top:0}
 @media screen and (max-width: 1000px) {
     .user-profil {
         position: relative;
         margin: 0 auto;
     }
 }

 .user-profil .name {
     position: absolute;
     opacity: 0.2;
     filter: blur(4px);
     left: 0;
     top: 0;
     text-align: left;
     font-weight: 800;



     color: #ccc;
     text-align: center;
     width: 100%;


 }

 .user-profil h1 {
     padding-top: 10px;
     color: #fff;
 }

 .user-profil .web a {
     color: #fff;
 }


 .user-profil .logo {
     width: 200px;
     height: 200px;
     border-radius: 500px;
     position: relative;
     margin: 0 auto;
 }

 .user-profil .socialmedia a {
     display: inline-block;
     border-radius: 40px;
     margin: 6px;
     transition: 0.4s;
 }

 .user-profil .socialmedia img {
     width: 35px;
     height: 35px;
     padding: 5px;
     border-radius: 40px;


     filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(7485%) hue-rotate(298deg) brightness(125%) contrast(116%);


 }

 .user-profil .socialmedia a:hover {
     background-color: var(--p-color);
 }



 .user-profil .logo img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-radius: 500px;
 }

 .user-profil .logo:after {
     content: '';
     position: absolute;
     z-index: 0;
     inset: 0;
     border: 3px solid var(--color);
     animation: pulse 1s infinite;
     border-radius: 300px;
     opacity: 0.2;
 }

 .user-profil .logo:before {
     content: '';
     position: absolute;
     z-index: 0;
     inset: 0;
     border: 1px solid var(--color);
     opacity: 0.5;
     animation: pulse 2s infinite;
     border-radius: 300px;
     opacity: 0.2;
 }


 .user-page-info {
     box-shadow: 10px 10px 90px rgba(0, 0, 0, 0.1);
     background: #fff;
 }

 .user-page-info h2 {
     text-align: right;
     padding-bottom: 30px;
 }

 .slider-w-1 {
     height: 80vh
 }


 .i-card {
     position: absolute;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     z-index: 1000;
     border-radius: 10px;
     display: grid;
     place-items: center;
     overflow: hidden;
 }

 .i-card .card-li {
     padding: 5px 0px;
     text-align: left;
     color: var(--p-color);
 }

 .i-card .card-li i {
     display: inline-block;
     padding: 0px 3px;
 }

 .i-card>div {
     background: rgba(255, 255, 255, 0.5);
     backdrop-filter: blur(10px);
     padding: 20px;
     border-radius: 10px;
     margin-left: -150%;
     transition: 0.5s;
 }

 .i-card:hover>div {
     margin-left: 0;
 }


 .hizmet-li {
     text-align: left;
     padding: 5px;
     font-weight: 600;
     transition: 0.5s;
     background: rgb(255, 255, 255);
     background: linear-gradient(73deg, rgba(255, 255, 255, 1) 0%, rgba(249, 249, 249, 1) 100%);
     margin: 3px;
     border-radius: 90px;
 }

 .hizmet-li i {
     display: inline-block;
     padding: 0px 3px;
     color: var(--w-color);
     width: 45px;
     height: 45px;
     line-height: 45px;
     border: 1px solid var(--color);
     color: var(--p-color);
     text-align: center;
     border-radius: 50px;
     margin-right: 10px;
 }

 .hizmet-li:hover {
     background: var(--bg-color);
     ;
     color: #fff;
 }

 .hizmet-li:hover i {
     color: #fff;
     border: 1px solid #fff;
 }


 .yana-img {
     width: 100%;
     height: 50vh;
     background: #00CCCC;
     overflow-x: scroll;
 }

 .yana-img img {
     height: 50vh;
 }

 .bg-light {
     background: #f8fafd;
 }

 .bg-banner-1 {
     color: #fff;
     background: #FC466B;
     /* fallback for old browsers */
     background: -webkit-linear-gradient(to right, var(--color), #FC466B);
     /* Chrome 10-25, Safari 5.1-6 */
     background: linear-gradient(to right, var(--color), #FC466B);
     /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
 }


 .buton-grup .btn-3 {
     background: var(--bg-color);
 }

 .buton-grup .s-btn {
     border: none;
 }

 .buton-grup .s-btn:hover {
     border: none;
 }

 .sosyalmedya-1 {
     border-bottom: 1px solid #f2f2f2;
     color: var(--p-color);
 }

 .sosyalmedya-1 i {
     line-height: 25px;
     padding: 0px 6px;
     color: var(--p-color);
 }

 .sosyalmedya-1 p {
     color: var(--p-color);
 }

 .sosyalmedya-1 a {
     line-height: 30px;
     display: inline-block;
     padding: 8px 0px;
     margin: 0px 0px;

     color: var(--p-color);
 }

 .sosyalmedya-1 a:hover {
     opacity: 0.5
 }

 .form-d {
     padding: 40px;
     color: var(--p-color);
     background: #f5f5f5
 }

 .form-d h1 {
     color: var(--p-color);
 }

 .form-d h2 {
     color: var(--p-color);
 }

 .form-d h3 {
     color: var(--p-color);
 }

 .form-d p {
     color: var(--p-color);
 }



 .text-detay {}

 .text-detay h1 {
     padding-bottom: 15px;
     padding-top: 20px;
 }

 .text-detay h2 {
     padding: 15px 0px;
     font-size: 26px !important;
 }

 .ikon-listele i {
     font-size: 25px;
     position: absolute;
     left: 20px;
     top: 20px;
     color: var(--dodge);
 }

 .ikon-listele {
     font-size: 19px;
     color: var(--bg-color);
     border-radius: 5px;

     -webkit-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     -moz-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);


     background: #fff;
 }

 .ikon-listele a {
     color: var(--bg-color);
 }

 .ikon-listele>div {
     position: relative;
     padding: 15px 15px 15px 60px;
     font-weight: 600;
 }

 .ikon-listele:hover a {
     color: var(--dodge);
 }




 .mini_arama {
     background: #fff;
     border: 1px solid #ccc;
     position: relative;
     max-width: 350px;
     border-radius: 30px;
     overflow: hidden;
     text-align: left;
 }

 .mini_aramai {
     width: calc(100% - 30px);
     border: none;
     outline: none;
     color: var(--text-color);
     height: 30px;
     margin: 0;
     padding: 0 15px;
     box-sizing: border-box;
 }

 .mini_aramab {
     background: none;
     border: none;
     outline: none;
     position: absolute;
     top: 0px;
     right: 5px;
     margin: 0;
     padding: 0;
     height: 30px;
 }

 .mini_aramab i {
     color: var(--p-color);
 }

 .mini_aramab:hover {
     cursor: pointer;
     opacity: 0.5;
 }


 .footer-ex-menu {
     padding: 20px;
     text-align: center;
 
 }

 .footer-ex-menu a {
     display: inline-block;
     padding: 0px 15px;
     font-size: 18px;
     color: #000;
     font-weight: 600;
     letter-spacing: -1px;
 }

 .footer-ex-menu a:hover {
     color: #ccc
 }

 @media screen and (max-width: 1000px) {


     .footer-ex-menu a {
         width: 100%;
     }

 }

 .wp-btn {
     display: inline-block;
     background: #25D366;
     color: #fff;
     padding: 12px 20px;
     border-radius: 6px;
     font-size: 15px;
     text-decoration: none;
     font-weight: 600;
 }

 .wp-btn:hover {
     opacity: .9;
 }

 .ilan-buttons {
     display: flex;
     gap: 10px;
     margin: 15px 0;
 }




 .btn-yesil {
     background: #25D366;
     ;
     color: #fff;
     padding: 12px 20px;
     border-radius: 50px;
     font-size: 15px;
     font-weight: 600;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     transition: 0.2s ease;
 }

 .btn-yesil:hover {

     opacity: 0.5;
     cursor: pointer;

 }

 .btn-mavi {
     background: #1d8cf8;
     color: #fff;
     padding: 12px 20px;
     border-radius: 50px;
     font-size: 15px;
     font-weight: 600;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     transition: 0.2s ease;
 }

 .btn-mavi:hover {
     opacity: 0.5;
     cursor: pointer;
 }




 ._table-zebra-light {
     color: var(--color);
     font-size: 13px;
 }


 .yeniyukle {
     position: absolute;
     right: 10px;
     bottom: 10px;
     z-index: 9000;
     background: #07b26e;
     color: #fff;
     width: 20px;
     height: 20px;
     line-height: 20px;
     border-radius: 90px;
     text-align: center;
 }

 .yeniyukle:hover {
     cursor: pointer;
     background: #03e78b;
 }



 .footer-ust {
     padding: 0px 0px;
     padding-top: 50px;
     color: var(--bg-color);
     background: #081630;
     background: linear-gradient(0deg, rgba(8, 22, 48, 1) 0%, rgba(15, 38, 81, 1) 100%);
 }

 .footer-ust h2 {
     color: var(--color-2);
     text-wrap: balance;
     font-weight: 100;
     font-family: var(--font-title);
 }

 .footer-ust p {
     font-size: 17px;
     line-height: 35px;
     font-weight: 100;
     text-wrap: balance;
     font-size: 22px;
 }

 .footer-ust a {
     display: inline-block;
     padding: 8px 20px;
     color: var(--bg-color);
     background: var(--dodge);
     margin-top: 10px;
     border-radius: 5px;
     font-weight: 600;
 }

 .footer-ust a:hover {
     background: #fff;
     color: var(--bg-color);
 }

 .footer-ust hr {
     border: none;
     height: 2px;
     width: 100px;
     background: var(--dodge);
     margin-top: 20px;
     margin-bottom: 20px;
 }



 .hr-tablo {
     list-style: none;
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 30px;
 }

 .hr-tablo>div {
     padding: 20px 40px;
 }

 .hr-tablo>div h1,
 .hr-tablo>div h2,
 .hr-tablo>div h2 strong,
 .hr-tablo>div h3 {
     font-weight: 400;
 }

 .hr-tablo>div h3 {
     font-size: 25px;
     color: var(--color-2);
     letter-spacing: -1px;
     padding-bottom: 10px;
 }

 .hr-tablo>div p {
     font-size: 15px;
     color: #4c6086;
     line-height: 20px;
     letter-spacing: -0.5px;
     border-left: 1px solid var(--color-2);
     padding-left: 15px;
 }




 @media screen and (max-width: 1000px) {

     .hr-tablo {
         grid-template-columns: repeat(1, 1fr);
         gap: 10px;
     }


 }










 .stm-1 {
     position: relative;
     overflow: hidden;
     z-index: 0;
     transition: 0.5s;
 }

 .stm-1 .text {
     color: var(--dodge-3);
     font-size: 14px;
     font-family: var(--font-title);
     padding: 10px 20px;
     border-left: 3px solid var(--color-2);
     transition: 0.5s;
 }

 .stm-1:hover .text {
     border-left: 3px solid var(--dodge-3);
 }

 .stm-1:after {
     transition: 0.5s;
     display: table;
     position: absolute;
     content: '';
     width: 100%;
     height: 100%;
     opacity: 0;
     bottom: 0;
     left: 0;
     z-index: 0;
     background: #000;
 }

 .stm-1 .img {
     filter: grayscale(100%);
     opacity: 0.8;
     transition: 0.5s;
 }

 .stm-1:hover .img {
     filter: grayscale(0);
     opacity: 1;
 }



 .full-menu .img-kare {
     border-radius: 9px;
     transition: 0.5s;
     box-shadow: 0px 20px 20px rgba(0, 0, 0, 0.08);
 }

 .full-menu .img-kare img {
     filter: grayscale(100%);
 }

 .full-menu .colon:hover {
     opacity: 1;
 }

 .full-menu .colon:hover .img-kare {
     transform: scale(1.10);
     box-shadow: 0px 40px 20px rgba(0, 0, 0, 0.08);
 }

 .full-menu .colon:hover .img-kare img {
     filter: grayscale(0%);
 }

 .full-menu h2 {
     font-size: 14px;
     padding-top: 20px;
 }


 .full-menu .img-kare::after {
     width: 100%;
     height: 100%;
     position: absolute;
     content: '';
     display: inline-table;
     left: 0;
     top: 0;

     background: rgb(0, 0, 0);
     background: linear-gradient(284deg, rgba(0, 0, 0, 0) 31%, var(--bg-color) 100%);

 }



 .footer-en-alt {
     padding: 10px;
     color: var(--color);
 
 }

 .footer-en-alt a.trans4 i {
     display: inline-block;
     margin: 0px 2px;
     color: var(--bg-color);
     font-size: 16px;
     transform: translateY(0px);
     border-radius: 35px;
     width: 30px;
     height: 30px;
     line-height: 30px;
 }

 .footer-en-alt a.trans4:hover i {
     background: var(--bg-color);
     color: #fff;
 }



 .sm-ikons a.trans4 i {
     display: inline-block;
     margin: 0px 2px;
     color: var(--w-color);
     font-size: 16px;
     transform: translateY(0px);
     background: var(--color);
     border-radius: 35px;
     width: 30px;
     height: 30px;
     line-height: 30px;
 }

 .sm-ikons a.trans4:hover i {
     background: #000;
     color: #fff;
 }





 .mini-menu {
     text-align: center;
     padding: 10px;
 }

 .mini-menu a {
     display: inline-block;
     padding: 10px 10px;
     font-size: 13px;
     color: var(--color);
 }

 .mini-menu a:hover {
     text-decoration: underline;
 }





 .line-header p {
     color: var(--p-color);
 }

 .line-header strong {}


 .after-shadow-ust {
     position: relative;
     overflow: hidden;
 }

 .after-shadow-ust:after {
     content: '';
     display: block;
     position: absolute;
     border-radius: 900px;
     background: var(--bg-color);
     filter: blur(20px);
     width: 700px;
     height: 300px;
     z-index: 0;
     left: 50%;
     top: 0%;
     transform: translate(-50%, -90%);
     opacity: 0.1;
 }

 .after-shadow-ust>div {
     position: relative;
     z-index: 10;
 }





 .f-colm {
     display: flex;
     align-items: center;
     align-content: center;
     width: 100%;
 }

 .f-colm>div {
     width: 100%;
 }

 .f-colm a {
     display: inline-block;
 }

 .f-colm .logo {
     padding-top: 10px;
     padding-bottom: 10px;
     height: 100px;
 }





 @keyframes efekt {
     0% {
         background: #23a37f;
         color: #fff;
     }

     50% {
         background: var(--bg-color);
         color: #fff;
     }

     100% {
         background: #23a37f;
         color: #fff;
     }
 }







 @media screen and (max-width: 1000px) {


     .kapakvar img {
         height: 100px;
         object-fit: cover;
     }


 }

 /********************* MENU *************************/


 .parallax {
     position: relative;
 }

 .parallax .kapla {
     background: var(--bg-dark);
     position: absolute;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0
 }




 .acor-tema .acordion-title {}

 .acor-tema h3 {
     background: none !important;
     font-size: 19px !important;
     border-radius: 0px !important;
     border-bottom: 1px solid #ccc;
     color: #000 !important;
 }

 .acor-tema p {
     color: #000 !important;
     padding: 0px !important
 }

 .acor-tema .acordion {
     max-width: 600px;
     margin: 0 auto;
 }



 /********************* MENU *************************/

 .flex-yap {
     display: flex;
 }

 .flex-yap>div:first-child {
     display: flex;
     width: 40%;
 }

 .flex-yap>div:last-child {
     display: flex;
     width: 60%;
     flex-direction: row-reverse;
 }

 @media screen and (max-width: 1000px) {
     .flex-yap {
         display: block;
     }

     .flex-yap>div:first-child {
         display: block;
         width: 100%;
     }

     .flex-yap>div:last-child {
         display: block;
     }

 }



 .fix-header {
     position: absolute
 }

 h1,
 h2,
 h3 {
     font-family: var(--font-2);
 }

 .renkli-2 {
     margin-top: -150px;
     position: relative;
     z-index: 1000;
 }

 .renkli-2 .colon {
     padding-top: 80px;
 }

 .renkli-2 .colon>div {
     position: relative;
 }

 .renkli-2 .colon>div h3 {}

 .renkli-2 .colon img {
     width: 100px;
     height: 100px;
     border-radius: 50px;
     object-fit: cover;
     position: absolute;
     right: 10px;
     top: -50px;
     box-shadow: 5px 0px 20px rgba(0, 0, 0, 0.2);
     transition: 0.5s;
 }

 .renkli-2 .colon>div a {
     display: inline-block;
     background: #fff;
     color: #272727;
     padding: 4px 20px;
     border-radius: 4px;
     margin-top: 8px;
 }

 .renkli-2 .colon>div a:hover {
     background: #272727;
     color: #fff;
 }

 .renkli-2 .colon>div:hover img {
     -webkit-transform: scale(1.20);
     -moz-transform: scale(1.20);
     -o-transform: scale(1.20);
     -ms-transform: scale(1.20);
     transform: scale(1.20);
 }

 @media screen and (max-width: 1000px) {
     .renkli-2 {
         margin-top: 20px;
         position: relative;
         z-index: 1000;
     }
 }

 .border-tablo {
     padding: 10px
 }

 .border-tablo>div {
     border: 1px solid #f2f2f2;
     margin-bottom: 3px;
     border-radius: 5px;
     overflow: hidden
 }

 .border-tablo>div>div {
     border-left: 1px solid #f2f2f2;
     padding: 5px 10px
 }

 .border-tablo>div>div:first-child {
     border: none;
 }

 .border-tablo span.bilgi {}

 .border-tablo .color-mavi {
     color: var(--color);
 }

 .tablo-liste .durumu-2 {
     display: inline-block;
     padding: 4px;
     border-radius: 3px;
     background: var(--color);
     color: #fff;

 }

 .tablo-liste .durumu-1 {
     display: inline-block;
     padding: 4px;
     border-radius: 3px;
     background: #6dc632;
     color: #fff;

 }

 .tablo-liste .bilgi {

     color: #666
 }

 .btn-small {

     line-height: 35px !important;
     padding: 0px 6px
 }

 .tahlil-bg {
     background: #f5f5f5;
     margin-bottom: 9px !important;
 }

 .t-form-bg {
     background: #f5f5f5;
     margin-bottom: 9px !important;
 }

 @media screen and (max-width: 1000px) {
     .t-form-bg {
         background: none
     }
 }

 .fullbg {
     width: 100%;
     height: 350px;
     object-fit: cover;
     position: relative;
     z-index: 30
 }

 #clear {
     clear: both
 }

 .ara:hover {
     cursor: pointer
 }

 .ara-u {
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.8);
     position: fixed;
     top: 0;
     left: 0;
     z-index: 9000;
     text-align: center;
     color: #fff;
     transition: All 0.2000s ease;
     -webkit-transition: All 0.2000s ease;
     -moz-transition: All 0.2000s ease;
     -o-transition: All 0.2000s ease;
 }


 .text-head {
     background: var(--bg-color);
     color: #fff;
 }


 .share {
     text-align: center;
 }

 .paylas-gurubu {
     display: inline-block;
     color: #272727;
 }

 .paylas-gurubu a {
     display: inline-block;
 }

 .paylas-gurubu a:hover {
     cursor: pointer;
     opacity: 0.5
 }

 .paylas-gurubu i {
     line-height: 35px;
     width: 35px;
     height: 35px;
     text-align: center;
     color: #272727;
 }

 .ara-u h1 {

     font-weight: 100;
     padding: 10% 0px 20px 0px;
     letter-spacing: 1px
 }

 .ara-u .ara-i {
     border: 1px solid #fff;
     background: none;
     outline: none;
     padding: 0px 20px;
     color: #fff;
     width: calc(50% - 150px);
     height: 80px;

 }

 .ara-u .ara-kapat {

     position: fixed;
     top: 30px;
     left: 50%;
     margin-left: -20px;
     color: #fff;
     padding: 10px;
 }

 .ara-u .ara-kapat:hover {
     background: #272727;
     color: #fff;
     cursor: pointer;
 }

 .ara-u .ara-b {
     border: 1px solid #fff;
     background: none;
     outline: none;
     padding: 0px 20px;
     color: #fff;
     width: calc(90px);
     height: 82px;

 }

 .ara-u .ara-b:hover {
     background: #FFF;
     color: #272727;
     cursor: pointer;
 }

 .ara-u .gelendegerler {
     background: #fff;
     width: calc(50% - 108px);
     margin: 0 auto;
 }

 .ara-u .gelendegerler .s-li {
     padding: 20px 15px;
     color: #272727;
     text-align: left;
 }

 .ara-u .gelendegerler .s-li:hover {
     background: #f4f4f4
 }

 .ara-K {
     -webkit-transform: scale(0);
     -moz-transform: scale(0);
     -o-transform: scale(0);
     -ms-transform: scale(0);
     transform: scale(0);
 }

 .ARANANYOK {
     border: 1px solid #ccc;
     background: #f2f2f2;
     text-align: center;
     padding: 40px
 }

 .YUKLENME {
     background: #fff;
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     z-index: 50000;
 }

 .YUKLENME img {
     width: 90px;
     position: absolute;
     left: 50%;
     top: 40%;
     margin-left: -45px;
     -webkit-filter: grayscale(100%);
     /* Safari 6.0 - 9.0 */
     filter: grayscale(100%);
 }

 .loaderLOGO {
     position: absolute;
     left: 50%;
     top: 50%;
     width: 400px;
     margin-left: -200px;
     margin-top: -200px;
     animation: bounce 0.2s;
     animation-direction: alternate;
     animation-timing-function: cubic-bezier(.5, 0.05, 1, .5);
     animation-iteration-count: infinite;
 }

 .loaderX {
     position: absolute;
     left: 50%;
     top: 50%;
     width: 80px;
     height: 80px;
     margin-left: -40px;
     margin-top: -40px;
     border: 2px solid #004e9c;
     border-top: 2px solid #fff;
     border-radius: 50%;
     animation: spin 1s linear infinite;
 }

 .loaderTXT {
     position: fixed;
     width: 100%;
     text-align: center;
     top: 50%;
     margin-top: -20px;

 }

 .loaderTXT i {

     color: #004e9c;
 }

 blockquote {
     background-color: #f2f2f2;
     border-left: 1em solid #272727;
     margin: 1.5em 0 1.5em;
     padding: 1em 1.5em 1em 2.5em;
     position: relative;
 }

 blockquote:before {
     color: #272727;
     content: "\201C";
     font-size: 5em;
     position: absolute;
     left: 5px;
     top: 0.6em;
     line-height: 0.1em;
 }

 blockquote:after {
     color: #272727;
     content: "\201D";
     font-size: 5em;
     position: absolute;
     right: 3px;
     bottom: 0em;
     line-height: 0.1em;
 }

 @-moz-keyframes spin {
     100% {
         -moz-transform: rotate(360deg);
     }
 }

 @-webkit-keyframes spin {
     100% {
         -webkit-transform: rotate(360deg);
     }
 }

 @keyframes spin {
     100% {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg);
     }
 }

 /********************************** MESAJ UYARISI *********************************/

 .UYARIBOX-2 {
     position: fixed;
     width: 100%;
     height: 100%;
     z-index: 5000;
     background: rgba(0, 0, 0, 0.8);
     left: 0;
     top: 0;
     display: none
 }

 .UYARIBOX-2 .uyari-a-2 {

     color: #272727;
     text-align: center;
     padding: 20px;
     width: 400px;
     background: #fff;
     position: fixed;
     left: 50%;
     top: 40%;
     margin-left: -200px;
     border-radius: 8px
 }

 .UYARIBOX-2 .uyari-a-2 .uyari-kapat {
     padding: 8px;
     background: #FFF;
     color: #272727;

     display: inline-block;
     position: absolute;
     top: 10px;
     right: 10px;
     border-radius: 6px;
 }

 .UYARIBOX-2 .uyari-a-2 .uyari-kapat:hover {
     background: #272727;
     color: #fff;
     cursor: pointer;
 }

 .UYARIBOX-2 .uyari-a-2 .mesaj-2 {
     padding: 30px 0px
 }

 /********************************** MESAJ UYARISI *********************************/
 /********************************** MESAJ UYARISI *********************************/

 .UYARIBOX {
     position: fixed;
     width: 100%;
     height: 100%;
     z-index: 5000;
     background: rgba(0, 0, 0, 0.8);
     left: 0;
     top: 0;
     display: none
 }

 .UYARIBOX .uyari-a {

     color: #272727;
     text-align: center;
     padding: 20px;
     width: 400px;
     background: #fff;
     position: fixed;
     left: 50%;
     top: 40%;
     margin-left: -150px;
     border-radius: 8px
 }

 .UYARIBOX .uyari-a .mesaj {
     padding: 30px 0px
 }

 /********************************** MESAJ UYARISI *********************************/

 @media screen and (max-width: 1000px) {
     .UYARIBOX-2 .uyari-a-2 {
         width: calc(90% - 40px);
         left: 5%;
         margin-left: 0;
     }

     .UYARIBOX .uyari-a {
         width: calc(90% - 40px);
         left: 5%;
         margin-left: 0;
     }
 }

 .IN:after {
     clear: both;
     content: "";
     display: table;
 }

 .clear:after {
     clear: both;
     content: "";
     display: table;
 }

 .INCONTENT {
     position: relative;
     width: 100%;
     z-index: 2;
     background: #fff;
     box-shadow: 0px 0px 25px -16px rgba(0, 0, 0, 0.75);
     transition: All 0.5s ease;
 }

 .NLOGIN {
     position: fixed;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     background: rgba(0, 0, 0, 0.5);
     z-index: 4000;
     overflow: auto;
     display: none;
 }

 #NLOGIN {
     width: 400px;
     left: 50%;
     margin-left: -200px;
     background: #fff;
     top: 30%;
     position: absolute;
     margin-bottom: 100px;
 }

 #NLOGIN .loginkapat {
     position: absolute;
     right: 0px;
     top: -30px;

     background: #fff;
     color: #272727;
     padding: 10px
 }

 #NLOGIN .loginkapat:hover {
     background: #272727;
     color: #fff;
     cursor: pointer;
 }














 .frame-menu-1 {
     position: relative;
     z-index: 3;
     display: flex;
     flex-direction: column;
     overflow: hidden;

 }

 .frame-menu-1 .text {
     position: absolute;
     bottom: 0px;
     z-index: 5;
     box-sizing: border-box;
     padding: 30px;
     width: 100%;
     height: 100%;
 }

 .frame-menu-1 .text-ust {
     display: flex;
     flex-direction: column;
     justify-content: flex-start
 }

 .frame-menu-1 .text-orta {
     display: flex;
     flex-direction: column;
     justify-content: center
 }

 .frame-menu-1 .text-alt {
     display: flex;
     flex-direction: column;
     justify-content: flex-end
 }

 .frame-menu-1 .img {
     position: relative;
     z-index: 0;

 }

 .frame-menu-1:after {
     display: inline-table;
     content: '';
     position: absolute;
     width: 100%;
     height: 50%;
     bottom: 0;
     background: rgb(0, 0, 0);
     background: linear-gradient(0deg, rgba(0, 0, 0, 0.5550595238095238) 0%, rgba(0, 0, 0, 0.3169642857142857) 46%, rgba(0, 212, 255, 0) 100%);
 }


















 ul.LOGINTAB {
     list-style: none;
     margin: 0;
     padding: 10px;
 }

 ul.LOGINTAB li {
     width: calc(100% / 2 - 20px);
     padding: 10px;
     color: #fff;
     background: #272727;
     float: left;
     text-align: center;
 }

 ul.LOGINTAB li.active {
     background: #fff;
     color: #272727
 }

 ul.LOGINTAB li:hover {
     background: #fff;
     color: #272727;
     cursor: pointer
 }

 ul.LOGINCONTENT {
     list-style: none;
     margin: 0;
     padding: 10px;
 }

 ul.LOGINCONTENT li {
     display: none
 }

 ul.LOGINCONTENT li.active {
     display: block
 }

 .RESFORM {
     padding: 10px;
 }

 .RESFORM p {
     padding: 10px 0px;
 }

 .RESFORM .text-i {
     width: calc(100% - 2px - 30px);
     height: 50px;
     border: 1px solid #ccc;
     padding: 0px 15px;
     outline: none;
 }

 .RESFORM .BUTON {
     background: #272727;
     color: #fff;
     padding: 0px 15px;
     height: 50px;
     line-height: 50px;
     margin-top: 10px;
     text-align: center;
 }

 .RESFORM .BUTON:hover {
     background: #464646;
     cursor: pointer;
 }

 .allbg {
     position: absolute;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     background-position: center center;
     background-size: cover;
 }

 .KUTU {
     padding: 5px;
     text-align: center;
 }

 .KUTU .DROP1 {
     width: calc(50% - 10px);
     height: 510px;
     float: left;
     margin: 5px;
     position: relative;
     background: #272727
 }

 .KUTU .DROP2 {
     width: calc(50% - 10px);
     height: 250px;
     float: left;
     margin: 5px;
     position: relative;
 }

 .KUTU .DROP3 {
     width: calc(50% - 10px);
     height: 250px;
     float: left;
     margin: 5px;
     position: relative;
 }

 .KUTU h2 {
     padding-top: 90px;
     font-weight: 400
 }

 .KUTU a {
     display: inline-block;
     padding: 8px 10px;
     background: #272727;
     color: #fff;
     margin-top: 10px
 }

 .KUTU a:hover {
     background: #555;
 }

 .KUTU .DI {
     position: absolute;
     bottom: 50px;
     width: calc(100% - 60px);
     padding: 0px 30px
 }

 .KUTU h2,
 p {}

 .G-CONTENT {}

 .G-CONTENT .IN {
     max-width: 1200px;
     margin: 0 auto;
     text-align: center;
     position: relative;
 }

 .G-CONTENT .IN h1 {
     color: #fff;
 }

 .G-CONTENT .IN .li {
     width: calc(100% / 3);
     float: left;
     color: #fff;
 }

 .TAGS {
     padding-top: 40px
 }

 .TAGS a {
     display: inline-block;
     padding: 8px 10px;
     color: #fff;
     background: #272727;

     border-radius: 6px;
 }

 .TAGS a:hover {
     background: #666
 }

 .ARAMA {
     padding: 60px 0px;
     background: #f2f2f2
 }

 .ARAMA .IN {
     max-width: 1200px;
     margin: 0 auto;
     position: relative;
 }

 .SONUCLARI {
     padding: 60px 0px;
 }

 .SONUCLARI .IN {
     max-width: 1200px;
     margin: 0 auto;
     position: relative;
 }

 .SONUCLARI .IN .li {
     padding: 40px 0px;
 }

 .SONUCLARI .IN .li h2 {

     text-transform: uppercase;
 }

 .SONUCLARI .IN .li p {}

 .SONUCLARI .IN .li .item-btn {
     padding: 8px 10px;
     background: #272727;
     color: #fff;

     border-radius: 30px;
     margin-top: 15px;
     display: inline-block
 }

 .SONUCLARI .IN .li .item-content {}

 .container {
     max-width: 1300px;
     margin: 0 auto
 }

 @media screen and (max-width: 1400px) {
     .container {
         padding: 0px 10px
     }
 }

 .max-content {
     margin: 0px 50px;
 }



 .content-2 {
     padding-left: 50px;
     padding-right: 50px;
 }

 .urun-detay-content {
     padding: 30px 0px;
 }

 .site-urun-detay {
     max-width: 1500px;
     background: #fff;
     box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.05);
     margin: 0 auto;
     box-sizing: border-box;
 }

 .site-urun-detay .ozet {
     font-size: 13px;
     line-height: 30px;
 }

 .site-urun-detay .detay-fiyat {
     color: #000;
 }


 .content {

     max-width: 1500px;
     margin: 0 auto;
     box-sizing: border-box;
 }

 @media screen and (max-width: 4000px) {

     .content {
         max-width: 1500px;
     }

 }

 @media screen and (max-width: 2000px) {

     .content {
         max-width: 1300px;
     }

     .header-4 .logo {
         height: 40px;
     }

 }

 @media screen and (max-width: 1500px) {

     .content {
         max-width: 1200px;
     }

 }

 @media screen and (max-width: 1300px) {
     .content {
         max-width: 1000px;
     }

     .content-2 {
         padding-left: 20px;
         padding-right: 20px;
     }
 }

 @media screen and (max-width: 1000px) {
     .content {
         max-width: 100%;
         padding-left: 10px;
         padding-right: 10px;
     }

     .content-2 {
         padding-left: 5px;
         padding-right: 5px;
     }
 }

 @media screen and (max-width: 575.98px) {
     .content {
         width: auto;
         padding-left: 10px;
         padding-right: 10px;
     }

     .content-2 {
         padding-left: 0px;
         padding-right: 0px;
     }
 }




 .text-rota {
     transform: rotate(5deg) scale(1.10);
     background: #f5f5f5;
     position: relative;
     z-index: 1;
     color: #ccc;
 }

 .text-rota-2 {
     transform: rotate(-5deg) scale(1.10);
     background: #70778b;
     color: #fff;
     position: relative;
     z-index: 0;
 }

 .container-url {
     position: relative;
     width: 100vw;
     overflow: hidden;


 }

 .scrolling-text .scrolling-text-content {

     font-size: 80px;
     white-space: nowrap;
     transition: transform 0.5s cubic-bezier(0.23, 0.36, 0.28, 0.83);
     line-height: 1em;
     margin: 20px 0;

     font-weight: 200;
 }






 .min-content {
     max-width: 650px;
     box-sizing: border-box
 }

 @media screen and (max-width: 1000px) {
     .min-content {
         max-width: 100%;
     }
 }

 .konumbar {
     background: #f2f2f2;
     color: #272727;

 }

 .minder {}

 .minder a {
     display: inline-block;
     padding: 10px 10px;
     color: #272727;
     font-size: 13px;
 }

 .minder a:first-child {
     font-weight: 700;
     color: #272727
 }

 ._table {
     background: #f5f5f5
 }

 .ust-tasarim {
     background: #254264;
     color: #fff;
 }

 .ust-tasarim p {
     display: inline-block;
     padding: 0px 15px;

 }

 .ust-tasarim p i {}

 .ust-tasarim a {
     display: inline-block;
 }

 .ust-tasarim a i {
     padding: 0px 8px;
     color: #fff;
 }

 .odalistele {
     border-radius: 3px;
     padding: 10px;
     box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1)
 }

 .odalistele .listi {
     padding: 0px 0px;

     line-height: 36px;
 }

 .odalistele .listi i {
     padding: 0px 9px;
     line-height: 36px;
     color: #25c05f;
 }








 .OSONUC {
     text-align: center;
 }

 .OSONUC .tanim1 {}

 .OSONUC .tanim1 i {
     padding-bottom: 15px;
 }


 .xs-form {
     max-width: 400px;
 }

 @media screen and (max-width: 1000px) {}

 .alt-ikonlar .cekin i {
     width: 30px;
     text-align: center;
     color: #0AA830;

 }

 .belirt {
     display: inline-block;
     background: #0AA830;
     padding: 0px 8px;
     border-radius: 4px;
     color: #fff;
     font-weight: 400
 }

 .allow {
     background: #fff;
     box-shadow: 15px 15px 20px #f2f2f2;
     border: 1px solid #f2f2f2;
     color: #828282;
 }

 .butondiv {
     padding: 8px 20px;
     border-radius: 4px;
     background: #272727;
     color: #fff;
 }

 .butondiv:hover {
     background: #ccc
 }

 .page-sayfalama {
     padding: 35px
 }

 .page-sayfalama a {
     display: inline-block;
     line-height: 35px;
     color: #fff;
     background: #272727;
     width: 35px;
     height: 35px;
     border-radius: 4px;
     text-align: center;
 }



 .page-sayfalama .aktif {
     background: #152d47;
 }

 .icerik-yok {
     background: #FFECD7;
     color: #272727;
     padding: 30px;
     text-align: center;
     border-radius: 9px;
 }

 .menu-bar-2 {
     background: #272727;
 }

 .ikon-menu img {
     width: 55px;
 }

 .ikon-menu .colon {
     color: #fff;
 }

 .ikon-menu .colon a {
     font-weight: 600;
     letter-spacing: 1px;
 }

 .ikon-menu .colon:hover {
     background: rgba(0, 0, 0, 0.1)
 }

 .menu-bar {
     background: #272727;
 }

 .mini-box-1 .img-kare {
     border-radius: 4px;
     position: relative;
 }

 .mini-box-1 .img-kare:after {
     display: inline-table;
     content: '';
     position: absolute;
     width: 100%;
     height: 100%;
     bottom: 0px;
     background: rgb(255, 255, 255);
     background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 72%);
 }

 .mini-box-1 .title {
     padding: 10px 0px;

     color: #272727;
 }

 .mini-box-2 {
     text-align: center;
     padding-bottom: 50px;
 }

 .mini-box-2 .img-kare {
     border-radius: 200px;
     width: 170px;
     height: 170px;
     padding: 0px;
     box-shadow: 9px 9px 30px rgba(0, 0, 0, 0.1)
 }

 .mini-box-2 .img-kare:after {
     display: inline-table;
     content: '';
     position: absolute;
     top: 0px;
     left: 0px;
     width: 50%;
     height: 100%;
     transition: 0.5s;
     background: rgb(26, 187, 155);
     background: linear-gradient(90deg, rgb(26, 187, 155) 25%, rgba(255, 255, 255, 0) 78%);
     opacity: 0.5
 }

 .mini-box-2:hover .img-kare:after {
     opacity: 1;
     width: 100%;
 }

 .mini-box-2 .title {
     padding: 6px 20px;

 }

 .mini-box-2 .ozet {
     padding: 2px 20px;

 }

 .dr-kutular {
     background: #254264;
     position: relative;
     z-index: 50;
 }

 .flex-h {
     display: flex;
     align-items: stretch;
     box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.1);
     -webkit-transform: translate(0px, -20px);
     -moz-transform: translate(0px, -20px);
     -o-transform: translate(0px, -20px);
     -ms-transform: translate(0px, -20px);
     transform: translate(0px, -20px);
 }

 .flex-h .colon {
     background: #00CCCC;
 }

 .flex-h .colon:nth-of-type(odd) {
     background-color: #ffffff;
 }

 .flex-h .colon:nth-of-type(even) {
     background-color: #fbfafa;
 }




 .full-kutu .img-cover {
     z-index: -1;
     position: absolute;
 }

 .a-buton-4 {
     display: inline-block;
     background: #fff;
     border-radius: 4px;
     color: #272727;
     line-height: 38px;
     padding: 0px 20px;
 }



 .urunler-content {
     padding: 0px 50px;
     margin: 0 auto;
 }

 @media screen and (max-width: 1000px) {
     .urunler-content {
         padding: 0px 0px;
         margin: 0 auto;
     }
 }

 .mobil-kategori-ikonu {
     position: fixed;
     top: 10px;
     left: 10px;
     z-index: 900;
     background: #272727;
     color: #fff;
     padding: 10px;
 }

 .mobil-kategori-ikonu i {
     font-size: 24px
 }

 .mobil-kategori-ikonu:hover {
     cursor: pointer;
 }

 .border-1 {
     border: 1px solid #f2f2f2;
 }

 .sol-menu {}

 .sol-menu a {
     line-height: 40px;
     color: #272727
 }




 .ff-text .max-700 {
     padding: 50px;
 }

 .ff-text img {
     border-radius: 10px;
 }

 @media screen and (max-width: 1000px) {
     .ff-text .max-700 {
         padding: 0px;
     }
 }



 /***animation: gradient 15s ease infinite; background-size: 400% 400%;***/
 @keyframes gradient {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }

 .bg-none {
     background: none;
     background-color: #0076ae;
 }


 .black-bg {}

 .bg-mavi {
     background-color: #228ae6 !important;
 }







 .WP-NEW {
     position: fixed;
     z-index: 2000;
     background: var(--bg-color);
     color: #fff;
     width: 50px;

     text-align: center;
 }

 .WP-NEW i {
     line-height: 50px;
     width: 100%;
     border-radius: 40px;
 }

 .WP-NEW>i:hover {
     cursor: pointer;
     background: #272727
 }

 .ikon-buton {
     position: absolute;
     bottom: 50px;
     width: 100%;
     display: none
 }

 .ikon-buton i {
     width: 100%;
     border-radius: 40px;
     margin-bottom: 9px
 }

 .ikon-buton .i-1 {
     background: #49e670;
 }

 .ikon-buton .i-2 {
     background: #03e78b;
 }

 .ikon-buton .i-3 {
     background: #03e78b;
 }



 .ikon-buton i:hover {
     background: #272727;
     cursor: pointer
 }



 @media screen and (max-width: 1000px) {
     .BAR {
         display: none;
     }

     .PH-FIX,
     .WP-FIX,
     .MENU-M,

     /**:first-child {  color: lime;} **/
 }

 @media screen and (max-width: 1400px) {}

 .IMG-BANNER {
     background: #2355a1;
     color: #fff;
 }

 .IMG-BANNER>div {
     padding: 10px 0px;
 }

 .IMG-BANNER>div i {
     line-height: 40px;
     width: 100%;
     font-size: 30px;
 }

 .tepe-arama {
     position: relative;
     z-index: 0;
 }

 .tepe-arama button {
     position: absolute;

     top: 10px;
     right: 10px;
     background: none;
     outline: none;
     border: none
 }

 .tepe-arama button:hover {
     cursor: pointer;
     color: #ccc;
 }

 .DARSLIDER {
     position: relative;
     z-index: 5;

 }

 .anasayfa .DARSLIDER .li:after {
     width: 100%;
     height: 50%;


     position: absolute;
     content: '';
     display: table;
     left: 0;
     top: 0;




 }


 .DARSLIDER .owl-dots {
     display: block;
     position: absolute;
     width: 100%;
     bottom: 10px;
     left: 0px;
     text-align: center;
     z-index: 9999;
 }

 .DARSLIDER .owl-dots .owl-dot {
     display: inline-block;
     width: 30px;
     height: 10px;

     margin: 2px;
     border-radius: 100px;
     background: #fff;
     opacity: 0.3;
 }

 .DARSLIDER .owl-dots .active {
     opacity: 1;
 }

 .DARSLIDER .li {
     position: relative;
     z-index: 1
 }

 .DARSLIDER .li .text a {
     display: inline-block;
     color: #fff;
     border: 1px solid #fff;


     padding: 9px 25px;
     margin-top: 15px;
     margin-right: 9px;

     letter-spacing: 1px;

     font-weight: 600;
 }

 .DARSLIDER .li .text a:hover {
     opacity: 0.5
 }

 .DARSLIDER .li .text>div {
     box-sizing: border-box;
     width: 90%;
     margin: 0 auto;
 }


 .DARSLIDER video {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background: #000;
     object-fit: cover;
     z-index: -1;


 }

 .DARSLIDER .ara-maske {

     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     object-fit: cover;
     z-index: 0;
 }


 .nokta-yok .owl-dots {
     display: none;
 }



 .DARSLIDER .li .text h2 {
     opacity: 0;
     padding: 0px 0px;
     font-weight: 100;
     font-size: 45px;
     text-shadow: 0px 0px 50px rgba(0, 0, 0, 0.1);
 }

 .DARSLIDER .li .text p {

     font-weight: 200;
     opacity: 0;
     padding: 0px 0px;
 }

 .DARSLIDER .li .text img {
     left: auto;
     top: auto;
     right: auto;
     display: inline-block;
 }

 @media screen and (max-width: 1000px) {
     .DARSLIDER .li .text h2 {

         font-size: 25px;

     }

     .DARSLIDER .li .text p {}

     .DARSLIDER .li .text br {
         display: none;
     }

     .DARSLIDER .li .text {
         text-align: center;
     }


 }


 .yan-style button {
     background: var(--color-2) !important;
     height: 50px;
     width: 100%;
 }

 .yan-style .lab {
     background: none;
     margin-top: -15px;
     color: #000;
     opacity: 1;
     color: #fff;
 }

 .oval-tema {
     background: #fff;
     padding: 50px;
     position: relative;
     overflow: hidden;
 }

 .oval-tema .article-xs {
     position: relative;
     z-index: 10;
     color: #fff;
 }

 .oval-tema p {
     color: #fff !important;
 }

 .oval-tema h1,
 .oval-tema h2,
 .oval-tema h3,
 .oval-tema h2 strong {
     color: var(--color-2) !important;
     font-size: 45px;
 }

 .oval-tema .img-cover {}


 .carosel-tema-1 .owl-carousel .owl-nav {
     text-align: center;
     padding-top: 20px;
 }

 .carosel-tema-1 .owl-carousel .owl-nav button {
     display: inline-block;
     width: 35px;
     height: 15px;
     text-align: center;
     font-size: 22px;
 }

 .carosel-tema-1 .item {
     border: 1px solid #f2f2f2;
     background: #fff;
 }

 .carosel-tema-1 .item img {
     padding: 20px;
     filter: grayscale(100%);
 }

 .carosel-tema-1 .owl-stage-outer {
     margin-top: 15px;
 }

 .DARSLIDER .text {
     position: absolute;
     bottom: 0px;
     z-index: 5;
     box-sizing: border-box;
     width: 100%;
     height: 100%;
 }



 .DARSLIDER .text-yeni {
     position: absolute;
     z-index: 20;
     width: 100%;
     height: 100%;
     top: 0px;
     left: 0px;
     display: grid;
     place-items: center;
 }

 .DARSLIDER .text-yeni>div {
     width: 100%;
     margin: 0 auto;
     text-align: center;
 }

 .DARSLIDER .text-yeni>div h1,
 .DARSLIDER .text-yeni>div h2,
 .DARSLIDER .text-yeni>div h3,
 .DARSLIDER .text-yeni>div h4 {


     font-size: clamp(2rem, 5vw, 6rem);
     font-family: var(--font-title);



     background: linear-gradient(90deg,
             rgba(131, 58, 180, 1) 0%,
             rgba(253, 29, 29, 1) 50%,
             rgba(252, 176, 69, 1) 100%);

     -webkit-background-clip: text;
     background-clip: text;
     -webkit-text-fill-color: transparent;
     display: inline-block;




 }

 .DARSLIDER .text-yeni>div p {
     color: #000;
     font-size: clamp(16px, 5vw, 22px);
     font-weight: 300;
 }

 .DARSLIDER .text-yeni>div img {
     text-align: center;
     margin: 0 auto;
     filter: brightness(0) saturate(100%) invert(48%) sepia(95%) saturate(3164%) hue-rotate(341deg) brightness(100%) contrast(104%);
 }








 @media screen and (max-width: 1000px) {
     .DARSLIDER .content {
         padding: 10px !important;
     }
 }



 .all-bounce {
     position: absolute;
     width: 100px;
     height: 100px;
     bottom: 50px;
     right: 0px;
     z-index: 3;
     text-align: center;
     margin-left: -50px;
     margin-top: -50px;
 }

 .all-bounce .box {
     width: 80px;
     height: 90px;
     position: relative;
     display: inline-block;
 }

 .all-bounce .box .box-fx {
     text-align: center;
     background-color: #fff;
     transform-origin: center;
     border-radius: 500px;
     z-index: 60;
     width: 60px;
     height: 60px;
     position: absolute;
     left: 50%;
     top: 50%;
     margin-left: -30px;
     margin-top: -30px;
 }

 .all-bounce .box .box-fx i {
     line-height: 60px;
     font-size: 30px;
     color: #fff;
     font-weight: normal
 }

 .all-bounce .box .box-1 {
     animation-duration: 1s;
     animation-iteration-count: infinite;
     background-color: #fff;
     transform-origin: center;
     border-radius: 500px;
     z-index: 20;
     width: 0px;
     height: 0px;
     position: absolute;
     left: 50%;
     top: 50%;
     margin-left: 0;
     margin-top: 0;
 }

 .all-bounce .box .box-2 {
     animation-duration: 2s;
     animation-iteration-count: infinite;
     background-color: #fff;
     transform-origin: center;
     border-radius: 500px;
     z-index: 30;
     width: 0px;
     height: 0px;
     position: absolute;
     left: 50%;
     top: 50%;
     margin-left: 0;
     margin-top: 0;
 }

 .all-bounce .box .bounce-2 {
     animation-name: bounce-2;
     animation-timing-function: ease;
 }


 @keyframes bounce-2 {
     0% {
         width: 0px;
         height: 0px;
     }

     80% {
         width: 200px;
         height: 200px;
         margin-left: -100px;
         margin-top: -100px;
     }

     100% {
         opacity: 0
     }
 }


 .DARSLIDER .text-ust {
     display: flex;
     flex-direction: column;
     justify-content: flex-start
 }

 .DARSLIDER .text-orta {
     display: flex;
     flex-direction: column;
     justify-content: center
 }

 .DARSLIDER .text-alt {
     display: flex;
     flex-direction: column;
     justify-content: flex-end
 }

 .DARSLIDER .ekrana {
     height: 100vh;
     object-fit: cover;
 }

 .DARSLIDER .ekrana img {
     position: absolute;
     height: 100%;
     width: 100%;
     z-index: 0;
     object-fit: cover;
 }








 .DARSLIDER .active .text h1:nth-of-type(1) {
     animation-duration: 1s;
     animation-iteration-count: 1;
     animation-name: data-1;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }

 .DARSLIDER .active .text h1:nth-of-type(2) {
     animation-duration: 3s;
     animation-iteration-count: 1;
     animation-name: data-1;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }

 .DARSLIDER .active .text h1:nth-of-type(3) {
     animation-duration: 5s;
     animation-iteration-count: 1;
     animation-name: data-1;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }


 .DARSLIDER .text {
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     content: '';
     display: inline-table;
     position: absolute;
     z-index: 2;
 }

 .DARSLIDER .slider-met {
     position: absolute;
     width: 100%;
     height: 100%;
     right: 0;
     top: 0;
     display: flex;
     align-items: center;
     align-content: center;
 }

 .DARSLIDER .slider-met>row {
     display: inline-block;
     width: clamp(1500px, 30%, 500px);
     margin: 0 auto;
     box-sizing: border-box;
     padding: 0px 30px;
 }

 .DARSLIDER .active .slider-met img {
     filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
 }

 .DARSLIDER .active .slider-svg img {
     filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
 }



 .DARSLIDER .slider-met a {
     background: #5b6063;
     border: 0px !important;
 }


 .DARSLIDER .active .text p {
     animation-duration: 2s;
     animation-iteration-count: 1;
     animation-name: data-2;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }


 .ana-slider .active .content {
     padding: 50px;
 }

 .ana-slider .active .text h1 {
     font-size: clamp(24px, 5vw, 50px);
     font-weight: 100;
     letter-spacing: -1px;
     font-family: var(--font-title);






 }

 .ana-slider .active .text p {
     font-size: clamp(15px, 1.5vw, 25px);
     font-weight: 100;
     letter-spacing: -1px;
     padding-top: 20px;
 }

 .ana-slider .slider-met ul {
     margin: 0;
     padding: 0;
 }

 .ana-slider .slider-met ul li {
     line-height: 30px;
 }

 .ana-slider .slider-met ul {
     animation-duration: 3s;
     animation-iteration-count: 1;
     animation-name: data-2;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }

 .ana-slider .active .slider-met ul {
     animation-duration: 2s;
     animation-iteration-count: 1;
     animation-name: data-1;
     animation-timing-function: ease;
     animation-fill-mode: both;
 }


 .text-kutu-design {
     position: relative;
     z-index: 0;
     border-radius: 10px;
     overflow: hidden;
 }

 .text-kutu-design .ikon-pub-liste {

     position: absolute;
     top: 0px;
     font-size: clamp(18px, 5vw, 20px);
     font-family: var(--font-title);
     color: #fff;
     background: var(--color-2);
     padding: 30px;

 }

 .flex-reverse-ikon-1 {
     left: 0px;
 }

 .flex-reverse-ikon-2 {
     right: 0px;
 }



 .DARSLIDER .owl-nav {
     position: absolute;
     width: 100%;
     bottom: 50%;
     height: 1px;
     left: 0px;
     text-align: center;
     z-index: 9999;
     display: block;
 }

 .DARSLIDER .owl-carousel .owl-prev {
     position: absolute;
     left: 20px;
     bottom: 0%;
 }

 .DARSLIDER .owl-carousel .owl-next {
     position: absolute;
     right: 20px;
     bottom: 0%;
 }

 .DARSLIDER .owl-carousel .owl-nav i {
     display: inline-block;
     margin: 2px;
     color: #fff;
     font-size: 35px;
 }

 .DARSLIDER .mask {
     position: absolute;
     z-index: 500;
     width: 100%;
     bottom: -20px;
 }

 .DARSLIDER .mask img {
     width: 100%;
     height: auto;
 }

 .DARSLIDER .menuslider {
     position: absolute;
     width: 300px;
     bottom: 0;
     padding-bottom: 50px;
     right: calc((100% - 1500px) / 2);
     background: rgba(255, 255, 255, 1);
     backdrop-filter: blur(6px);
     filter: none;
     z-index: 1000;
     display: flex;
     align-items: center;
     box-shadow: 0px -30px 50px rgba(0, 0, 0, 0.1);
     display: none;
 }

 .DARSLIDER .menuslider>div {
     width: 100%;
 }

 .DARSLIDER .menuslider a {
     display: inline-block;
     width: 100%;
     padding: 7px 15px;
     color: var(--p-color);
     transition: 0.5s;
     border-bottom: 1px solid rgba(0, 0, 0, 0.1);
     font-weight: 400;
     letter-spacing: -1px;
 }

 .DARSLIDER .menuslider a:hover {
     background: var(--bg-color);
     color: #fff;
 }

 .DARSLIDER .menuslider a i {
     display: inline-block;
     padding-right: 20px;
 }

 @media screen and (max-width: 1000px) {
     .DARSLIDER .mask {
         display: none;
     }
 }




 .anasayfa .DARSLIDER .owl-carousel {
     position: relative;
     z-index: 90;
 }




 .en-bilgi-bar {
     background: #f5f5f5;
     color: var(--text-color);
 }

 .en-bilgi-bar ul {
     margin: 0;
     padding: 10px 0px;
     float: right;
     margin: 0;
 }

 .en-bilgi-bar ul li {
     display: inline-block;
     padding-left: 55px;
     position: relative;
 }

 .en-bilgi-bar ul li i {
     display: inline-block;
     width: 40px;
     height: 40px;
     line-height: 40px;
     position: absolute;
     left: 5px;
     top: 0px;
     background: var(--bg-color);
     color: #fff;
     text-align: center;
     border-radius: 30px;
 }

 .en-bilgi-bar ul li strong {
     display: inline-block;
     width: 100%;
     font-weight: 600;
 }

 .logo-1 {
     position: relative;
     z-index: 0;
 }

 .logo-1 .image {
     position: relative;
     z-index: 0;
     filter: grayscale(100%);
 }

 .logo-1:after {
     content: '';
     display: inline-table;
     position: absolute;
     z-index: 100;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     background: rgb(52, 133, 117);
     background: radial-gradient(circle, rgba(52, 133, 117, 0) 34%, rgba(0, 0, 0, 0.2) 100%);
     transition: .5s;
 }

 .logo-1:hover:after {
     opacity: 0;
 }

 .rand_efek .active:after {
     opacity: 0;
 }

 .logo-1:hover .image {
     filter: grayscale(0%);
 }

 .rand_efek .active .image {
     filter: grayscale(0%);
 }


 .w-content {
     padding: 0px 6%;
 }

 .home-slider {
     padding: 0px 6%;
 }

 .home-slider .DARSLIDER {
     border-radius: 8px;
     overflow: hidden;
 }

 .form-bg {
     background: #eef3fb;
     border-radius: 8px;
     overflow: hidden;
 }

 ._tablo {}

 .paket-header {
     border: 1px solid #ccc;
     border-left: none;
     padding: 4px;
     border-bottom: none;
 }

 .paket-header:first-child {
     border-left: 1px solid #ccc;
     border-top-left-radius: 8px;
 }

 .paket-header:last-child {
     border-top-right-radius: 8px;
 }

 .paket-header a {
     display: inline-block;
     background: var(--color);
     color: #fff;
     padding: 4px 10px;
     border-radius: 60px;

 }

 .paket-header a:hover {
     background: #0076ae;
 }

 .paket-header span {
     display: inline-block;
     padding: 4px 6px;
     width: 100%;
     box-sizing: border-box;
     border-top-left-radius: 6px;
     border-top-right-radius: 6px;
 }

 .paket-baslik {
     background: #eef3fb;

     padding: 10px;
     border: 1px solid #ddd;
     font-weight: 600;

 }

 .paket-icerik {
     padding: 10px;
     border-left: 1px solid #ddd;
     border-right: 1px solid #ddd;
 }

 .paket_s_baslik {

     letter-spacing: -0.5px;
 }

 .paket_s_icerik {

     color: #888;
 }

 .yesil-ch {
     color: #11c96c;
 }

 .kirmizi-ch {
     color: #cc1616;
 }

 .turuncu-ch {
     color: #f5b812;
 }

 .tr-bottom {
     border-bottom: 1px solid #ddd;
 }

 .fake-tablo {
     border-right: 1px solid #ddd;
 }

 .align-items-s {
     display: flex;
     align-items: stretch;
     align-content: stretch;
 }

 .align-items-s>div {
     width: 100%;
 }

 .align-items-c {
     display: flex;
     align-items: center
 }

 .align-items-c>div {
     width: 100%;
 }

 .flex-content-2 {
     display: flex;
     align-content: stretch;
     align-items: center;
 }

 .flex-content-2>div {
     width: 100%;
 }

 .tab_text h2 {
     font-weight: 300;

     padding-bottom: 15px;
 }

 .tab_text p {
     color: #888
 }

 .ikon-box {
     border: 1px solid #eee;
     border-radius: 6px;
     background: #fff;
 }

 .ikon-box img {
     width: 100px;
     height: 100px;
 }

 .ikon-box p {
     padding-top: 10px;

     line-height: 17px;
 }

 .ikon-box:hover {
     cursor: pointer;
 }


 .test-1 {
     background-color: crimson;
 }

 .test-2 {
     background-color: rgb(6, 250, 238);
 }

 .CAROUSEL {
     width: 100%;
     overflow: hidden;
 }

 .CAROUSEL .owl-nav {
     display: none;


 }

 @media screen and (max-width: 1000px) {
     .CAROUSEL .owl-nav {
         display: none;
     }
 }



 .CAROUSEL .owl-dots {
     display: block;
     position: absolute;
     width: 100%;
     bottom: -10px;
     left: 0px;
     text-align: center;
     z-index: 9999;
     display: none;
 }

 .CAROUSEL .owl-dots .owl-dot {
     display: inline-block;
     width: 12px;
     height: 12px;
     border: 1px solid #272727;
     margin: 2px;
     border-radius: 100px
 }

 .CAROUSEL .owl-dots .active {
     background: #272727;
 }







 .owl-carousel {
     padding: 0px !important;
 }

 .bg-carosel {
     overflow: hidden;
 }

 .bg-carosel .owl-nav {
     text-align: center;
     display: none;
 }

 .bg-carosel .owl-nav button i {
     width: 30px;
     height: 30px;
     line-height: 30px;
     font-size: 20px;
     background: #f5f5f5;
     border-radius: 3px;
     margin: 1px;
 }



 .bg-carosel img {}









 .YORUMCS {}

 .YORUMCS .owl-nav {
     position: absolute;
     width: 100%;
     bottom: 10px;
     right: 0;
     text-align: center;
     z-index: 9999;
     display: none
 }

 .YORUMCS .owl-nav i {
     padding: 10px;
     color: #272727;
     background: #fff;
     margin: 0px
 }

 .YORUMCS .owl-dots {
     display: block;
     position: absolute;
     width: 100%;
     bottom: -30px;
     left: 0px;
     text-align: center;
     z-index: 9999;
 }

 .YORUMCS .owl-dots .owl-dot {
     display: inline-block;
     width: 6px;
     height: 6px;
     border: 1px solid #272727;
     margin: 2px;
     border-radius: 100px
 }

 .YORUMCS .owl-dots .active {
     background: #272727;
 }

 .yorum-post .yorum-user {

     color: #666;
 }

 .yorum-post .yorum-klinik-2 {
     color: #1aba9a;
 }

 .yorum-post .yorum-text {

     line-height: 33px;
     color: #909090;
 }

 .yorum-post .yorum-tarih {
     color: #909090;
 }

 .yorum-post .yorum-tarih i {
     color: #1aba9a;
     padding-left: 30px
 }

 @keyframes data-1 {
     0% {
         transform: translate(0px, -50px);
         opacity: 0
     }

     100% {
         transform: translate(0px, 0px);
         opacity: 1
     }
 }

 @keyframes data-2 {
     0% {
         transform: translate(0, 100px);
         opacity: 0
     }

     100% {
         transform: translate(0px, 0px);
         opacity: 1
     }
 }

 .instagram-content {
     padding: 20px 0px
 }

 .gliste {}

 .gliste .li {
     line-height: 40px;
     background: #fff;
     padding: 0px 15px;
     margin-bottom: 9px;
 }

 .gliste .li i {
     float: right;
     line-height: 40px;
 }

 .gliste .li:hover {
     background: #f6f6f6
 }

 .K-HOME {}

 .K-HOME .li {}

 .K-HOME .li .baslik {

     padding: 15px 10px;
 }

 .K-HOME .li .baslik:hover {
     background: #272727;
     color: #fff;
 }

 @media screen and (max-width: 1000px) {
     .K-HOME {
         display: none
     }
 }

 .text-box h2 {
     font-weight: 400;
 }

 .text-box p {
     padding-top: 4px;
 }

 .form-kapsa {
     background-color: #004e9c;
 }



 .liste-5 {
     box-shadow: 10px 20px 40px rgba(0, 0, 0, 0.1);
     transition: 0.5s;
 }

 .liste-5:hover {
     box-shadow: 10px 20px 40px rgba(0, 0, 0, 0.3);
 }


 .liste-5 .text h3 {
     line-height: 19px;

     font-weight: 600;
     padding-bottom: 30px;
     color: var(--color);
 }

 .liste-5 .text p {
     line-height: 29px;

 }





 .renkli-1 {
     background: #fff;
     border-radius: 20px;
     box-shadow: -10px 10px 30px rgba(220, 232, 244, 1);
     overflow: hidden;
     text-align: center;
     padding: 50px 0px
 }

 .renkli-1 img {
     width: 150px;
 }

 .renkli-1 .text h2 {
     color: #7c8a96;

 }

 .renkli-1 .text p {
     color: #7c8a96;

     line-height: 22px
 }

 .serbest-form {
     max-width: 450px;
     position: absolute;
     left: 50%;
     top: 120px;
     border-radius: 20px;
     background: #fff;
     padding: 40px;
     box-shadow: -10px 10px 30px rgba(220, 232, 244, 1);
 }

 .div-buton {
     line-height: 50px;
     display: inline-block;
     border-radius: 50px;
     padding: 0px 20px;
     min-width: 240px;
     background: #272727;
     color: #fff;
     border: none;
     outline: none;
 }

 .div-buton:hover {
     background: #fddbb0;
     cursor: pointer;
 }

 .a-buton {
     display: inline-block;
     color: #272727;
     border: 1px solid #272727;
     text-align: center;
     width: 100%;
     box-sizing: border-box;
     line-height: 40px;
 }

 .a-buton i {
     margin-right: 6px
 }

 .a-buton:hover {
     cursor: pointer;
     background: #f2f2f2
 }

 .a-buton-2 {
     line-height: 30px;
     display: inline-block;
     padding: 0px 0px;
     color: #71B62C;
     border: none;
     outline: none;

     text-decoration: underline;
 }

 .a-buton-2:hover {
     color: #fddbb0;
     cursor: pointer;
 }

 .a-buton-3 {
     display: inline-block;
     color: #fff;
     text-align: center;
     width: 100%;
     box-sizing: border-box;
     line-height: 40px;
     background: #0dc143;
 }

 .a-buton-3 i {
     margin-right: 6px
 }

 .a-buton-3:hover {
     cursor: pointer;
     background: #272727
 }

 .div-buton-tam {
     line-height: 50px;
     padding: 0px 0px;
     background: #272727;
     color: #fff;
     border: none;
     outline: none;
     text-align: center;
     box-sizing: border-box;
     width: 100%;
     margin: 0px
 }

 .div-buton-tam:hover {
     background: #404040;
     cursor: pointer;
 }

 .div-buton-tam-2 {
     padding: 0px 25px;
     background: #C41114;
     color: #fff;
     border: none;
     outline: none;
     text-align: center;
     box-sizing: border-box;
     margin: 0px;
     display: inline-block;
 }

 .div-buton-tam-2:hover {
     background: #272727;
     cursor: pointer;
 }


 







 .aramafilitresi {
     width: 100%;
     height: 35px;
     box-sizing: border-box;
     border: 1px solid #ccc;
     padding: 0px 10px;
     margin-bottom: 15px
 }

 .ifilitre a {
     width: 100%;
     display: inline-block;
     line-height: 22px;
     font-size: 13px;
     color: #000;
     position: relative;
 }

 .filitre-ul {
     padding: 20px 20px;
     border: 1px solid #ccc;
     margin-bottom: 18px
 }

 .filitre-ul li a i {
     padding-right: 10px;
     color: #000;
     font-size: 13px
 }

 .kategori-h2 {
     font-size: 16px;
 }



 .lg-menu-sol {

     position: relative;
     z-index: 2000;
     margin-top: 90px;



 }

 .lg-menu-sol .title {
     font-weight: 600;
     padding-left: 30px;
     padding-bottom: 10px;
     color: var(--bg-color) !important;
 }

 .lg-menu-sol a {
     display: inline-block;
     width: 100%;


     color: var(--bg-color);
     position: relative;
     box-sizing: border-box;


     font-size: 15px;


     line-height: 40px;
     font-size: 15px;

     padding: 0px 30px;

     background: var(--light);
     border-radius: 9px;
     margin-bottom: 5px;

 }


 .lg-menu-sol a i {
     color: #ccc;
     position: absolute;
     right: 10px;
     bottom: 11px;

 }

 .lg-menu-sol .secili {}

 .lg-menu-sol .secili i {
     color: #000;
 }


 .lg-menu-sol a:hover i {
     color: #272727;
 }

 .lg-menu-sol a:hover {}

 .lg-menu-sol .title {
     font-size: 22px;
     color: var(--text-color);
 }

 .lg-menu-sol .lb {

     opacity: 0.3;
 }


 .rev-img {
     border: 1px solid rgba(0, 0, 0, 0.1)
 }

 * {
     box-sizing: border-box;
 }

 .kapakvar {
     width: 100%;
     position: relative;
     z-index: -1;
 }

 .kapakvar img {
     width: 100%;
 }

 .kapakvar-fix {
     width: 100%;
     position: absolute;
     z-index: -1;
 }

 .kapakvar-fix img {
     width: 100%;
 }

 .kapakvar-min img {
     height: 110px;
     object-fit: cover;
 }

 .TXT-HEADER {
     background: #f2f2f2;
     height: 250px;
     position: relative;
     z-index: 0;
     overflow: hidden;
 }

 .TXT-HEADER .opafont {
     position: absolute;
     left: 0;
     top: 0;
     font-weight: 800;
     font-size: 250px;
     color: #8E8E8E;
     opacity: 0.2
 }

 .TXT-HEADER .content {
     position: relative;
     z-index: 10;
 }

 .megan-lg {}


 .liste-9 {}

 .liste-9 a {
     color: #999;
     padding: 5px 0px;
     ;
     border-bottom: 1px solid #ccc;
     display: inline-block;
     width: 100%;
     box-sizing: border-box;
 }

 .liste-9 a:hover {
     color: var(--text-color);
 }

 .liste-9 img {
     border-radius: 6px;
 }

 .liste-9 h3 {
     color: var(--text-color);
 }






 .fullkutu {
     background: #f2f2f2
 }

 .fullkutu a {
     display: inline-block;
     padding: 8px 15px;
     margin-top: 15px;
     border-radius: 6px;
     color: #fff;
     background: var(--color);
 }

 .fullkutu a:hover {
     background: #272727;
     color: #fff;
 }


 .urunler-content {}


 .urun-filitreleri {
     display: none;
 }


 .urun {
     position: relative;
     z-index: 0;
     transition: 0.5s;
     overflow: hidden;
     background: #fff;
     height: 100%;
     border: 1px solid #f2f2f2;
     border-radius: 10px;
 }


 @media screen and (max-width: 1000px) {
     .urun {}
 }


 .urun:hover {
     box-shadow: var(--shadow);
 }

 .urun .isim {

     padding: 6px 0px;

     font-weight: 600;
     color: var(--color);
     font-size: 14px;
     letter-spacing: -0.5px;



 }

 .urun .text {

     position: relative;
     z-index: 1;
     padding: 30px 20px;

 }



 .urun .buton {
     line-height: 35px;

     padding: 0px 15px;
     display: inline-block;
     border-radius: 6px;
     margin-top: 8px;
     background: rgb(103, 0, 1);
     background: linear-gradient(346deg, rgba(103, 0, 1, 1) 0%, rgba(237, 20, 20, 1) 100%);
     color: #fff;
 }

 .urun:hover .buton {
     background: #272727;
     color: #fff;
 }

 .urun .kategori {

     font-weight: 400;
     letter-spacing: -0.5px;
     font-size: 12px;
     color: #ccc;
     padding-top: 20px;


 }

 .urun .liste-fiyat span {
     display: inline-block;
     width: 100%;
     color: #004e9c;
     font-size: 16px;
 }



 .urun .more {
     width: 35px;
     height: 35px;
     position: absolute;
     padding: 0px;
     bottom: 10px;
     right: 10px;
     z-index: 10;
     text-align: center;
     border-radius: 60px 0px 0px 0px;
 }

 .urun .more i {
     display: inline-block;
     line-height: 35px;
     color: var(--p-color)
 }

 .urun .more:after {
     content: '';
     position: absolute;
     z-index: -1;
     inset: 0;
     border: 3px solid #f2f2f2;
     animation: pulse 1s infinite;
     border-radius: 90px;
 }

 .urun .more:before {
     content: '';
     position: absolute;
     z-index: -1;
     inset: 0;
     border: 1px solid #f2f2f2;
     opacity: 0.5;
     animation: pulse 2s infinite;
     border-radius: 90px;
 }




 .urun .fiyat {
     padding: 9px 0px
 }

 .urun .ciz {
     color: #000;
     font-size: 13px;
     padding-bottom: 5px;
 }

 .urun .ikonlar {
     position: absolute;
     bottom: 10px;
     right: 0px;
     z-index: 15;
     width: 35px;
 }

 .urun .ikonlar i {
     display: inline-block;
     line-height: 35px;
     width: 35px;
     background: #2cbdb0;
     color: #fff;

     text-align: center;
     border-radius: 50px
 }

 .urun .img {

     border-radius: 10px;
 }

 .urun .image_1 {
     z-index: 10;
 }

 .urun .image_2 {
     z-index: 5;
 }

 .urun:hover .image_2 {
     z-index: 15
 }

 .urun .miniindirim {
     position: absolute;
     z-index: 60;
     top: 10px;
     left: 10px;
     padding: 3px;
     color: #fff;
     background: #d52929;
     text-align: center;
 }

 .urun .miniindirim .lg-1 {

     font-weight: 600;
 }

 .urun .miniindirim .lg-2 {}

 .urun .yeni {
     position: absolute;
     z-index: 60;
     top: 10px;
     right: 10px;
     padding: 3px;
     color: #fff;
     background: #d52929;
     text-align: center;

 }

 .yenisezon .yeni {
     display: inline-block;
     padding: 3px;
     color: #fff;
     background: #d52929;
     text-align: center;

 }

 .yenisezon strong {
     color: #006ab5;
 }

 .alt-bar {
     background: #272727;
     height: 70px;
 }

 .ALT-BANNER {}

 .ALT-BANNER .IN li {
     width: calc(100% / 2 - 10px);
     float: left;
     padding: 10px 10px;
     margin: 5px;
 }

 .ALT-BANNER .IN li img {
     width: 100%;
     height: 150px;
     object-fit: cover;
 }

 .ALT-BANNER .IN li h2 {

     padding: 4px 0px
 }

 @media screen and (max-width: 1000px) {
     .ALT-BANNER .IN li {
         width: calc(100% / 1 - 0px);
         float: left;
         padding: 10px 0px;
         margin: 0px;
     }

     .ALT-BANNER .IN li img {
         width: 100%;
         height: 190px;
     }
 }

 .GALERI-img {
     padding: 15px;
 }

 .GALERI-img .img-li {
     width: calc(100% / 4);
     float: left;
     padding: 10px;
 }

 .GALERI-img .img-li img {
     width: 100%;
     height: 200px;
     object-fit: cover
 }

 .GALERI-img .img-li:hover {
     cursor: pointer
 }

 @media screen and (max-width: 1000px) {
     .GALERI-img .img-li {
         width: calc(100% / 1);
     }
 }

 .no-border {
     border: none !important;
 }

 .li-table {
     padding: 30px 0px
 }

 .li-table .li-tr {}

 .li-table .li-tr .li-td {
     padding: 8px 0px;
 }

 .li-table .li-tr .li-td span {
     color: #DD0306
 }

 .li-table .li-tr .fiyat {}

 .profil-kart {
     background: #fff;
     border-radius: 10px;
     box-shadow: -10px 10px 30px rgba(220, 232, 244, 1);
     overflow: hidden;
     text-align: center;
 }

 .randevu {
     position: relative;
     z-index: 0;
     overflow: hidden;
     background: rgb(37, 66, 100);
     background: linear-gradient(90deg, rgba(37, 66, 100, 1) 50%, rgb(245, 245, 245) 50%);
 }

 .form-st-1 .form_text {
     box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1);
     height: 45px;
     padding: 0px 20px;
     border: 1px solid #f2f2f2;
     border-radius: 6px;
     font-weight: 400;
 }

 .form-st-1 .form_text:focus {
     background: #fff;
     box-shadow: 0px 0px 30px rgba(7, 236, 156, 0.4);
 }

 .form-st-1 .form_select {
     box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1);
     height: 45px;
     padding: 0px 20px;
     border: 1px solid #f2f2f2;
     border-radius: 6px;
     font-weight: 400;
 }

 .form-st-1 .form_select:focus {
     background: #fff;
     box-shadow: 0px 0px 30px rgba(7, 236, 156, 0.4);
 }

 .form-st-1 .form_textarea {
     box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1);
     height: 95px;
     padding: 20px 20px;
     border: 1px solid #f2f2f2;
     border-radius: 6px;
     font-weight: 400;
 }

 .form-st-1 .form_textarea:focus {
     background: #fff;
     box-shadow: 0px 0px 30px rgba(7, 236, 156, 0.4);
 }

 .form-st-1 .btn {
     height: 45px;
     box-sizing: border-box;
     line-height: 45px;
     border: none
 }

 .form-st-1 .label {
     height: 35px;
     line-height: 35px;
     color: #272727;
     font-weight: 400;

 }

 .buton-grup .btn-tema {
     background: #000;
     border: 0px !important;
     color: #fff;

 }

 .buton-grup .btn-tema:hover {
     background: #272727;
     color: var(--w-color);
 }

 .buton-grup .btn-tema-border {
     border: 1px solid #272727;
     color: #272727;
 }

 .buton-grup .btn-tema-border:hover {
     background: #272727;
     color: #fff;
 }

 .buton-grup .btn-tema-color {
     color: #272727;
 }

 .buton-grup .btn-tema-color:hover {
     background: #313131;
     color: #fff;
 }




 .buton-grup .btn-tema-2 {
     background: var(--bg-color);
     color: #fff;
     border: 1px solid var(--color);
 }

 .buton-grup .btn-tema-2:hover {
     background: var(--bg-color);
     border: 1px solid var(--color);
 }

 .buton-grup .btn-tema-2-border {
     border: 1px solid var(--color);
     color: var(--p-color);
 }

 .buton-grup .btn-tema-2-border:hover {
     background: var(--bg-color);
     color: #fff;
 }

 .buton-grup .btn-tema-2-color {
     color: var(--p-color);
 }

 .buton-grup .btn-tema-2-color:hover {
     color: var(--p-color);
 }










 .urun-detay-b3 {}



 @media screen and (max-width: 1000px) {
     .urun-detay-b3 {}
 }





 .urun-detay-ul-1 ul {
     margin: 0px !important;
     padding: 10px !important;
     padding-left: 20px !important;
     list-style: none;
 }

 .urun-detay-ul-1 ul li {
     line-height: 18px !important;
     font-size: 14px;
     padding: 0px 0px !important;
     list-style: none;
 }

 .urun-detay-ul-1 ul li p {
     line-height: auto;
     font-size: 14px;
     padding: 0px;
 }

 .urun-detay-ul-1 h2 {
     font-size: 20px;
     margin: 0px;
     padding: 10px 0px;
 }

 .urun-detay-ul-1 h2 strong {
     font-weight: 400;
     color: #000;
 }

 .urun-detay-ul-1 p {
     line-height: auto;
     font-size: 14px;
     padding: 0px;
     color: #000;
 }

 .urun-detay-ul-1 h3 {
     font-size: 20px;
     margin: 0px;
     padding: 10px 0px;
 }

 .urun-detay-ul-1 h3 strong {
     font-weight: 400;
     color: #000;
 }
















 ul.ACILIRTAB {
     padding: 20px 0px
 }

 ul.ACILIRTAB li {
     margin-bottom: 15px;
     position: relative;
 }

 ul.ACILIRTAB li i {
     position: absolute;
     right: 25px;
     top: 25px;

 }

 ul.ACILIRTAB li h2:hover {
     cursor: pointer;
 }

 ul.ACILIRTAB li h2 {
     padding: 0px;
     margin: 0;
     color: #494949;

 }

 ul.ACILIRTAB li .li {
     color: #777;
     padding: 30px 0px;
     display: none;
 }

 ul.ACILIRTAB li .li p {
     line-height: 30px;
 }

 ul.ACILIRTAB li:first-child .li {}

 ul.ACILIRTAB .active .li {
     display: block;
 }

 @media screen and (max-width: 1000px) {
     ul.ACILIRTAB li h2 {
         padding: 0px 40px 0px 0px;
         margin: 0;
         color: #494949;
         font-size: 18px
     }
 }

 .UYELIK {
     padding: 0px 0px;
     position: relative;
 }

 .UYELIK .IN {
     max-width: 1200px;
     margin: 0 auto;
     padding: 100px 0px;
     background: #fff
 }

 .UYELIK .UYEFORM {
     max-width: 500px;
     margin: 0px auto;
     min-height: 500px
 }

 .shadow-2 {
     box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.1)
 }

 .lg-blog {
     position: relative;
     z-index: 0;
     overflow: hidden;
     background: #f5f5f5;
 }

 .lg-blog h3 {

     padding: 0px 0px 0px 0px;
     margin: 0px;
     color: #ccc;
     font-weight: 400;
 }

 .lg-blog h2 {

     padding: 0px 0px 0px 0px;
     margin: 0px;
     color: #666;
     font-weight: 400;
 }

 .lg-blog p {

     padding: 0px 0px;
     color: #404040;
     margin: 0px;
     opacity: 0.5;
 }

 .lg-blog .ikon {
     position: absolute;
     right: -26px;
     top: 50%;
     margin-top: -30px;
     box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1);
     transition: .5s;
     color: #fff;
     background: var(--color);
     width: 60px;
     height: 60px;
     line-height: 60px;
     text-align: center;
     border-radius: 60px;
 }

 .lg-blog:hover .ikon {
     right: 10px;
 }

 .lg-blog a {
     display: inline-block;
     padding: 6px 15px;
     border-radius: 4px;
     background: var(--color);
     color: #fff;
 }

 .blog-content {
     background: #fff;
     margin-left: 400px;
     box-shadow: -10px 10px 30px rgba(220, 232, 244, 1);
     border-radius: 10px
 }

 @media screen and (max-width: 1000px) {
     .blog-content {
         background: #fff;
         margin-left: 0px;
         box-shadow: -10px 10px 30px rgba(220, 232, 244, 0);
         border-radius: 10px
     }
 }

 .blog-post {
     position: relative;
     z-index: 0;
 }

 .content-relative {
     position: relative;
     z-index: 10;
 }

 .bg-beyaz {
     background: #fff;
 }

 .li-tab {
     text-align: center
 }

 .li-tab .li {
     padding: 10px 20px;
     display: inline-block;
     color: #272727;
     border-bottom: 5px solid #f6f6f6;
 }

 .li-tab .li i {
     padding-right: 8px
 }

 .li-tab .aktif {
     border-bottom: 5px solid #272727;
 }

 .li-tab .li:hover {
     cursor: pointer;
     border-bottom: 5px solid #ccc;
 }

 .li-tab-icerik {}

 @media screen and (max-width: 1000px) {
     .UYELIK .IN {
         width: 100%;
         padding: 40px 0px;
     }

     .li-tab-icerik {
         padding: 50px 0px
     }

     .UYELIK .BG {
         display: none
     }

     .li-tab .li {
         padding: 10px 20px;
         display: inline-block;
         width: 100%;
         color: #272727;
         border-bottom: 5px solid #f6f6f6;
         text-align: left;
     }

     .UYELIK .UYEFORM {
         max-width: 500px;
         margin: 0 auto;
         padding: 0px 30px
     }

     .li-tab {
         padding: 30px
     }

     .mb1 {
         width: 70% !important;
     }

     .mb2,
     .mb3 {
         display: none
     }
 }

 .li-tab-1 {}

 .li-tab-1 .li {
     padding: 20px 0px;
     float: left;
     color: #999;
     text-align: center;
     width: calc(100% / 3);
 }

 .li-tab-1 .li span {
     display: inline-block;
     width: 100%;

     font-weight: 800;
     padding-bottom: 10px;
 }

 .li-tab-1 .aktif {
     background: #fff;
     color: #272727
 }

 .li-tab-1 .li:hover {}

 .li-tab-1-icerik {
     padding: 10px;
     background: #fff;
 }


 .buton-grup .btn {
     display: inline-block;
     line-height: 40px;
     padding: 0px 12px;
     margin-bottom: 4px;
     border-radius: 4px;
     letter-spacing: 0px;
     border: none;
     outline: none;
     box-sizing: border-box;
 }

 .buton-grup .btn i {
     padding-right: 4px
 }



 .buton-grup .btn i {
     padding-right: 4px
 }



 .buton-grup .btn:hover {
     cursor: pointer
 }

 .buton-grup .btn-7 {
     background: var(--color);
     color: #fff;
 }

 .buton-grup .btn-7:hover {
     background: #272727;
 }

 .buton-grup .btn-7-border {
     border: 1px solid var(--color);
     color: var(--color);
 }

 .buton-grup .btn-7-border:hover {
     background: var(--color);
     color: #fff;
 }

 .buton-grup .btn-7-color {
     color: var(--color);
 }

 .buton-grup .btn-7-color:hover {
     background: var(--color);
     color: #fff;
 }

 ul.ultablist {
     list-style: none;
     padding: 60px 0px;
     max-width: 1200px;
     margin: 0 auto
 }

 ul.ultablist li {
     padding: 0px 0px;

 }



 .ul-tab {
     border-bottom: 1px solid #f2f2f2;
 }

 .ul-tab>.li {
     line-height: 35px;
     float: left;
     border-bottom: 5px solid #fff;
     margin-right: 5px;
     padding: 6px 20px;
     font-weight: 600;
     color: var(--p-color);
 }

 .ul-tab>.li:hover {
     cursor: pointer;
     border-bottom: 5px solid #ccc;
 }

 .ul-tab>.active {
     border-bottom: 5px solid #f2f2f2;
 }

 .tab-content {}

 .tab-content>.li {
     display: none;
 }

 .tab-content>.li:first-child {
     display: block;
 }


 .puanlamasoru {
     background: #1aba9a;
 }



 .comp-3 .img {
     border-radius: 15px;
 }




 .tema-listeleme-text {}

 .tema-listeleme-text>div {
     padding: 50px;
     color: var(--bg-color);
     transition: 0.5s;
     position: relative;
     overflow: hidden;
 }

 .tema-listeleme-text>div::after {
     width: 200px;
     height: 200px;
     left: 50%;
     bottom: 50%;
     transform: translate(50%, -50%);
     content: '';
     display: block;
     position: absolute;
     background: #ccc;
     z-index: -1;
     border-radius: 300px;
     filter: blur(50px);
     opacity: 0.2;
 }

 .tema-listeleme-text>div img {
     margin-bottom: 20px;
 }

 .tema-listeleme-text>div h2 {
     font-size: 30px;
     letter-spacing: -0.5px;
     padding-bottom: 10px;
     color: var(--dodge-3);
     font-weight: 600;
 }

 .tema-listeleme-text>div h2 strong {
     font-weight: 700;
 }

 .tema-listeleme-text>div p {
     font-size: 15px;
     line-height: 30px;
     color: var(--dodge-3)
 }

 .tema-listeleme-text>div p u {
     color: #ccc;
     text-decoration: none;
     font-size: 90px;
     font-weight: 200 !important;
     font-family: var(--font-title);
 }

 .tema-listeleme-text img {
     filter: var(--imgdodge)
 }







 @media screen and (max-width: 1000px) {
     .tema-listeleme-text>div {
         padding: 20px;
     }
 }






 .tema-listeleme-text-2 hr {
     border: none;
     height: 2px;
     width: 100px;
     background: var(--dodge);
     margin: 20px 0px 20px 0px;
 }

 .tema-listeleme-text-2>div {
     padding: 90px;
     color: var(--bg-color);
     transition: 0.5s;
     position: relative;
     overflow: hidden;
     border-radius: 10px;
 }

 .tema-listeleme-text-2>div img {
     filter: brightness(0) saturate(100%) invert(99%) sepia(0%) saturate(0%) hue-rotate(108deg) brightness(115%) contrast(100%);
     margin-bottom: 15px;
 }

 .tema-listeleme-text-2>div h2 {
     font-size: 30px;
     letter-spacing: -0.5px;
     padding-bottom: 10px;
     color: var(--bg-color)
 }

 .tema-listeleme-text-2>div p {
     font-size: 14px;
     line-height: 25px;
     color: var(--bg-color)
 }

 .tema-listeleme-text-2>div h4 {
     font-weight: 100;
     font-size: 28px;
 }

 .tema-listeleme-text-2>div:nth-child(2) {
     background: #f5f5f5;
 }

 @media screen and (max-width: 1000px) {
     .tema-listeleme-text-2>div {
         padding: 20px;
     }
 }


















 .al-checkbox {

     line-height: 25px
 }

 .image-text-banner {
     width: 100%;
 }

 .alt-bg {
     position: relative;
     z-index: 0;
     overflow: hidden;
 }

 .alt-bg .alt-img {
     position: absolute;
     z-index: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     left: 0;
     top: 0px;
 }

 .alt-bg .alt-img img {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0px;
     top: 0px;
     object-fit: cover
 }

 .ikon-yazi {
     position: relative;
     z-index: 0;
     padding-left: 60px;
 }

 .ikon-yazi h3 {
     color: #555;
     font-weight: 600;

     padding-bottom: 0px
 }

 .ikon-yazi p {
     color: #555;

     line-height: 22px;
 }

 .ikon-yazi i {
     position: absolute;
     left: 10px;
     top: 30px;

     color: var(--color)
 }

 .outdoor {
     width: 150px;
     height: 150px;
     margin-left: -75px;
     margin-top: -75px;
     background: #fff;
     border-radius: 150px;
     position: absolute;
     left: 50%;
     top: 50%;
 }

 .outdoor i {
     font-size: 45px;
     padding-top: 30px
 }

 .outdoor .p {}

 .outdoor .link {
     position: relative;
     z-index: 10;
     cursor: pointer;
 }

 .bildiri {
     padding: 40px 30px;
     color: #fff;
     background: #272727;
     margin-top: 10px;
     border-radius: 10px;
 }

 .bildiri h1 {

     font-weight: 800;
 }

 .bildiri a {
     display: inline-block;
     background: #fff;
     color: #272727;
     padding: 8px 15px;
     margin-top: 15px;
 }

 .bosheader {
     background: var(--color);
     height: 50px;
 }

 .framehet {
     width: 100%;
     position: relative;
     overflow: auto;
     height: calc(100vh - 140px)
 }

 @media screen and (max-width: 1000px) {
     .bosheader {
         background: #2b2a2a;
         height: 1px;
     }
 }

 .article {}

 .article h1 {
     padding: 8px 0px;
     font-weight: 300;
     color: var(--p-color);
 }

 .article h2 {
     padding: 8px 0px;
     color: var(--p-color);
 }

 .article p {
     padding: 8px 0px;

 }

 .article ul {
     margin: 0px;
     padding: 20px;
 }

 .article ul li {
     list-style: disc;
     padding: 6px 0px;

 }

 .article h3 {}

 .article ol li {
     padding: 6px 0px 6px 50px;
     margin-bottom: 30px;

     line-height: 30px;
     list-style: none;
     background-image: url("info.png");
     background-repeat: no-repeat;
     background-position: 0px 15px;
     background-size: 30px;
 }

 .article table {
     font-size: 13px;
     width: 100% !important;
 }

 .article table tr td:nth-child(1) {
     width: 35% !important;
 }

 .article table tr td:nth-child(2) {
     width: 5% !important;
 }

 .article table tr td:nth-child(3) {
     width: 60% !important;
 }





 .article-x {}

 .article-x h1 {
     padding: 8px 0px;

 }

 .article-x h2 {
     padding: 8px 0px;

 }

 .article-x p {
     padding: 8px 0px;

 }

 .article-x ul {
     margin: 0px;
     padding: 20px;
 }

 .article-x ul li {
     list-style: disc;
     padding: 6px 0px
 }

 .article-2x {}

 .article-2x h1 {
     padding: 8px 0px;

 }

 .article-2x h2 {
     padding: 8px 0px;

 }

 .article-2x p {
     padding: 8px 0px;

 }

 .article-2x ul {
     margin: 0px;
     padding: 20px;
 }

 .article-2x ul li {
     list-style: disc;
     padding: 6px 0px
 }

 .article-xs {}

 .article-xs h1 {
     padding: 8px 0px;

     font-weight: 800;
     color: #000;
 }

 .article-xs h2 {
     padding: 8px 0px;

     font-weight: 200;
 }

 .article-xs p {
     padding: 8px 0px;

     letter-spacing: 0px
 }

 .article-xs ul {
     margin: 0px;
     padding: 20px;
 }

 .article-xs ul li {
     list-style: disc;
     padding: 6px 0px
 }

 @media screen and (max-width: 1000px) {
     .article-xs h1 {
         padding: 8px 0px;

         font-weight: 200;
     }

     .article-xs h2 {
         padding: 8px 0px;

         font-weight: 200;
     }

     .article-xs br {
         display: none;
     }
 }

 .makale h1 {}

 .makale h2 {}

 .makale p {}



 .box-img a {
     display: inline-block;
     padding: 5px 15px;
     border-radius: 4px;
     background: #2727270cc;
     color: #fff;
     margin-top: 5px;
 }

 .box-img a:hover {
     background: #fff;
     color: #272727;
 }

 .tema-text h1 {}

 .tema-text h2 {}

 .tema-text p {
     color: #4d4d4d;
 }

 .log-max {
     max-width: 400px;
     margin: 0 auto;
 }

 .more-buton {
     display: inline-block;
     background: var(--dodge-2);
     color: #fff !important;
     padding: 6px 15px;
     border-radius: 4px;
     transition: 0.5s;

 }

 .more-buton:hover {
     background: var(--dodge);
     color: #fff;
 }



 .more-buton-2 {
     display: inline-block;
     background: var(--dodge);
     ;
     color: #fff;
     padding: 6px 15px;
     border-radius: 4px;

     transition: 0.5s;


 }




 .more-buton-3 {
     display: inline-block;
     background: var(--bg-color);
     ;
     color: #fff;
     padding: 6px 15px;
     border-radius: 4px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1);
     transition: 0.5s;


     background: #FF276F;
     background: linear-gradient(to right, #FF276F 0%, #FF276F 24%, #FBC822 73%);


 }

 .more-buton-3:hover {
     background: #fff;
     color: var(--text-color);
 }







 .image-text-banner-2 a {
     display: inline-block;
     padding: 6px 15px;
     background: var(--bg-color);
     color: #fff;
     border-radius: 4px;
     margin-top: 10px;
 }

 .image-text-banner-2 span {
     font-weight: 100;
 }

 .border-hover {
     border: 1px solid #ddd;
     margin-bottom: 5px
 }

 .border-hover:hover {
     background: #f5f5f5;
 }

 .profil-60 {
     width: 60px;
     height: 60px;
     object-fit: cover;
 }

 .bg-line {
     position: relative;
     z-index: 0;
 }

 .bg-line .ln-1 {
     position: relative;
     z-index: 20
 }

 .bg-line .ln-2 {
     position: absolute;
     z-index: 0;
     width: 220px;
     height: 220px;
     border-radius: 150px;
     right: 10%;
     top: 10%;
     background: #f2f2f2;
 }

 .BANNER {
     background: #fff;
     color: #272727
 }

 .BANNER h2 {
     padding: 6px 0px;
     letter-spacing: -1px;

 }

 .BANNER p {
     padding: 6px 0px;
 }

 .BANNER .content {
     position: relative;
     z-index: 0
 }

 .BANNER a {
     position: absolute;
     right: 20px;
     top: calc(50% - 25px);
     background: #272727;
     color: #fff;
     padding: 6px 15px;
     border-radius: 6px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1)
 }

 .BANNER a:hover {
     background: #272727;
     color: #fff;
 }

 .cok-link {}

 .cok-link a {
     display: inline-block;
     line-height: 35px;

     color: #272727;
 }

 .cok-link a:hover {
     text-decoration: underline
 }

 .cok-link i {
     padding-right: 9px;
 }

 .cok-link .ikonu {
     color: #11c96c
 }

 .BANNER-3 {
     background: var(--color);
     color: #fff;
     position: relative;
 }

 .BANNER-3 .text {
     position: relative;
     z-index: 5000
 }

 .BANNER-3 .text a {
     display: inline-block;
     background: var(--color);
     color: #fff;
     padding: 6px 15px;
     border-radius: 6px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1)
 }

 .BANNER-3 .text a:hover {
     background: #ccc;
     color: #272727;
 }

 .BANNER-3 p {
     padding: 6px 0px;
 }

 .NEREDEYIM {
     background: #f2f2f2
 }

 .NEREDEYIM .IN {
     max-width: 1200px;
     margin: 0 auto;
     padding: 10px 0px;
     text-align: center;
     color: #666;
     text-transform: uppercase;
 }

 .lg-list h3 {}

 .lg-list .description {}

 .lg-list:hover {
     background: #f5f5f5
 }

 .ABONEOL {

     padding: 60px 0px;
     overflow: hidden;

 }



 .ozel-konumlandir {
     position: relative;
     z-index: 3000;
     margin-top: -90px;
     background: #fff;
     border-radius: 6px;
     box-shadow: var(--shadow);
     overflow: hidden;
 }

 .ozel-konumlandir h2,
 .ozel-konumlandir p {
     color: #fff;
 }





 .ul-tema-a ul {
     list-style: none;
     margin: 0;
     padding: 0;


 }

 .ul-tema-a ul:after {
     display: inline-table;
     content: '';
     clear: both;
 }

 .ul-tema-a ul li {
     list-style: none;
     margin: 0;
     padding: 30px 10px;
     position: relative;
     color: var(--bg-color);
     font-size: 14px;
     text-align: center;

 }

 .ul-tema-a ul li:last-child {
     border: none;
 }

 .ul-tema-a ul li:nth-child(2) {
     background: #e1fbf8;
 }




 .ul-tema-a ul li i {
     display: inline-block;
     font-size: 39px;
     width: 100%;
     text-align: center;
     padding-bottom: 10px;
     color: var(--dodge);
 }

 .ul-tema-a ul li strong {
     font-weight: 600;
     padding: 6px 0px;
     display: inline-block;
     width: 100%;
     font-size: 20px;
     color: var(--bg-color);
 }

 .ul-tema-a ul li::after {}



 @media screen and (max-width: 1000px) {

     .ozel-konumlandir {
         margin-top: 10px;
     }

     .ul-tema-a ul li:nth-child(3) {
         display: none;
     }
 }



 .footer {
     background: none;
     padding: 0px 0px;
     padding: 50px 0px;
 }

 .footer .content {
     border-radius: 10px;
 }

 .footer .content .ul-menu h3 {
     color: var(--bg-color);
     font-size: 18px;
     padding-bottom: 10px;
 }

 .footer .content .ul-menu li a {
     color: var(--bg-color);
     font-size: 14px;
     line-height: 25px;
 }

 .footer .content .ul-menu li a:hover {
     text-decoration: underline;
 }


 .sm i {
     color: var(--bg-color);
     display: inline-block;
     padding: 5px;
     font-size: 22px;
 }

 .sm i:hover {
     color: var(--dodge);
 }

 .footer-menu a {
     color: #000;
     display: inline-block;
     padding: 10px 20px;
     font-size: 13px;
     letter-spacing: 2px;
 }

 .footer-menu a:hover {
     opacity: 0.5;

 }

 .footer ul h2 {
     font-size: 19px;
     padding: 6px 0px;
     color: var(--color);
 }

 .footer .fo-link {
     font-size: 14px;
     line-height: 28px;
     color: #404040;
 }

 .footer .fo-link:hover {
     text-decoration: underline;
 }




 .PAGEBANNER {
     background-position: center center;
     background-repeat: no-repeat;
     background-size: cover;
     height: 350px;
 }

 .PAGEBANNER .IN {
     max-width: 1200px;
     margin: 0 auto
 }

 .PAGEBANNER .IN h1 {
     line-height: 350px;

     font-weight: 300;
 }

 .SOSYALMEDYA i {
     line-height: 40px;

     color: #fff;
 }

 .SOSYALMEDYA a {
     display: inline-block;
     padding: 0px 0px;
     margin: 0px 0px;
     width: 30px;
     height: 40px;
 }

 .SOSYALMEDYA a:hover {
     opacity: 0.5
 }

 .TAB-A1 {
     margin: 50px 0px
 }

 .TAB-A1 .TABI {
     text-align: center
 }

 .TAB-A1 .TABI .li {
     padding: 15px 30px;

     color: #272727;
     display: inline-block;
     margin: 0px 2px;
     cursor: pointer
 }

 .TAB-A1 .TABI .li i {
     font-size: 38px
 }

 .TAB-A1 .TABI .li p {

     font-weight: 700;
 }

 .TAB-A1 .TABI .active {
     background: #f2f2f2;
 }

 .TAB-A1 .CONU {
     background: #f2f2f2;
     padding: 30px
 }

 .TAB-A1 .CONU .li {
     display: none;
 }

 .TAB-A1 .CONU .li:first-of-type {
     column-count: 3;
     column-gap: 40px;
     column-rule: 1px solid #ccc;
     line-height: 32px
 }

 .i-filitre {
     width: calc(100% / 4 - 60px);
     float: left;
     padding: 10px 30px;
     position: relative
 }

 .i-filitre:hover {
     cursor: pointer
 }

 .i-filitre i {
     position: absolute;
     top: 13px;
     left: 5px;
     opacity: 0.2
 }

 .i-filitre:hover i {
     opacity: 1
 }

 .i-filitre-ac i {
     opacity: 1
 }

 .URUN-HOME {
     padding: 0px 0px;
 }

 .URUN-HOME .IN {
     margin: 0 auto;
     width: 90%;
     padding: 10px 0px 50px 0px
 }

 .URUN-HOME .owl-carousel .owl-nav {}

 .URUN-HOME .owl-carousel .owl-prev {
     position: absolute;
     left: -40px;
     top: 50%;
 }

 .URUN-HOME .owl-carousel .owl-next {
     position: absolute;
     right: -40px;
     top: 50%;
 }

 .URUN-HOME .owl-carousel .owl-nav i {
     display: inline-block;
     margin: 2px;
     color: #272727;
 }

 .URUN-HOME .owl-carousel .owl-next:hover {}

 .URUN-HOME .owl-carousel .owl-prev:hover {}

 .URUN-HOME .owl-item {
     margin: 0;
     padding: 0;
     background: #fff;
 }

 .URUN-HOME .owl-item span {
     text-decoration: line-through;
 }

 .URUN-HOME .owl-item h3 {
     position: absolute;
     z-index: 50;
     left: 0px;
     bottom: 10px;
     width: 100%;
     text-align: center;
     font-weight: 100
 }

 .URUN-HOME .owl-item:hover h3 {
     background: #272727;
     color: #fff
 }

 .URUN-HOME .owl-item img {
     width: 100%;
 }

 .URUN-HOME h2 {
     text-align: center;
 }

 @media screen and (max-width: 1000px) {
     .URUN-HOME .IN {
         margin: 0 auto;
         width: 100%;
     }
 }

 .form_form .form_text {
     border-radius: 0px;
 }

 .form_form .form_textarea {
     border-radius: 0px;
 }

 .form_form .form_select {
     border-radius: 0px;
 }

 .form_form .form_multiselect .multi_value {
     border-radius: 0px;
 }


 .ikon-text {
     color: var(--text-color);
 }

 .ikon-text p {
     font-size: 13px;
 }

 .ikon-text strong {
     color: var(--text-color);
     font-size: 22px;
 }

 .ikon-text img {
     filter: brightness(0) saturate(100%) invert(58%) sepia(20%) saturate(478%) hue-rotate(116deg) brightness(93%) contrast(90%);
 }

 .fabuda {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
 }

 .fabuda p {
     width: 100%;
     gap: 0px;
     background: #f5f5f5;
     border: 5px solid #fff;
     border-radius: 15px !important;
 }




 .filitrever {
     max-width: 450px;
     transition: 0.5s;
     height: 100vh;
     z-index: 3000;
     background: #fff;
     box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.05);
     position: fixed;
     top: 0;
     right: -100%;
     overflow-y: auto;

 }

 .filitrever .kapat {
     background: var(--bg-color);
     color: #fff;
 }

 .filitrever .kapat:hover {
     background: var(--bg-dark);
     cursor: pointer;
 }




 .liste-1 .text:before {

     display: none;
 }


 .formac {
     position: fixed;
     right: 0px;
     top: 300px;
     z-index: 1000;
     border-radius: 40px 0px 0px 40px;
     background-color: var(--p-color);
     color: #fff;
     width: 40px;
     height: 40px;
     text-align: center;
 }

 .formac i {
     display: inline-block;
     line-height: 40px;
 }

 .formac:hover {
     background: var(--bg-dark);
     cursor: pointer;
 }

 @media screen and (max-width: 1000px) {}

 .BTN1 {
     background: #272727;
     color: #fff;
 }

 .BTN1:hover {
     background: #272727;
     color: #fff
 }

 .BUTONLAR {}

 .BUTONLAR button {
     border: none;
     background: none;
     outline: none;
     margin: 0;
     padding: 0;
 }

 .BUTONLAR .bt-1 {
     background: #272727;
     color: #fff;
     padding: 8px 10px;
 }

 .BUTONLAR .bt-2 {
     background: #4ba440;
     color: #fff;
     padding: 8px 10px;
 }

 .BUTONLAR .bt-txt {
     padding: 8px 0px;
 }

 .BUTONLAR button:hover {
     cursor: pointer;
     background: #272727;
     color: #fff;
 }

 .BUTONLARDIV {}

 .BUTONLARDIV .buton {
     padding: 8px 10px;
     float: left;

 }

 .BUTONLARDIV .bt-1 {
     background: #272727;
     color: #fff;
 }

 .BUTONLARDIV .bt-2 {
     background: #4ba440;
     color: #fff;
     margin-left: 5px
 }

 .BUTONLARDIV .bt-txt {
     display: inline-block;
     padding: 8px 0px;
     margin-top: 15px;

 }

 .BUTONLARDIV .buton:hover {
     background: #272727;
     cursor: pointer
 }

 @media screen and (max-width: 1000px) {
     .kategori-menusu {
         position: fixed;
         width: 100%;
         height: 100%;
         left: -100%;
         top: 0;
         background: #fff;
         z-index: 600;
         transition: 0.5s;
         display: flex;
         align-content: stretch;
         align-items: center
     }

     .kategori-menusu>div {
         padding: 0px 40px
     }
 }

 @-webkit-keyframes bardol {
     0% {
         width: 0%
     }

     100% {
         width: 85%
     }
 }

 @-moz-keyframes bardol {
     0% {
         width: 0%
     }

     100% {
         width: 85%
     }
 }

 @-o-keyframes bardol {
     0% {
         width: 0%
     }

     100% {
         width: 85%
     }
 }

 @keyframes bardol {
     0% {
         width: 0%
     }

     100% {
         width: 85%
     }
 }

 .akbar {
     background: #f2f2f2;
     margin-top: 20px;
 }

 .sozlesme {
     padding: 9px 0px;
 }

 .COROSER .owl-nav .owl-prev {
     position: absolute;
     top: 50%;
     left: -30px;
 }

 .COROSER .owl-nav .owl-next {
     position: absolute;
     top: 50%;
     right: -30px;
 }

 .COROSER .owl-nav i {
     font-size: 20px
 }

 .video-box-video {
     position: relative;
     background: #272727;

 }

 .video-box-video .text {
     width: 100%;
     height: 100%;
     position: absolute;
     display: flex;

     z-index: 10;
 }

 .video-box-video .text a {
     display: inline-block;
     color: #fff;
     background: var(--bg-color);
     ;
     padding: 9px 25px;
     margin-top: 15px;
     margin-right: 9px;
     border-radius: 6px;
     letter-spacing: 1px;

     font-weight: 600;
 }

 .video-box-video .text>div {
     width: 100%;
 }

 .video-box-video .text-ust {
     display: flex;
     flex-direction: column;
     justify-content: flex-start
 }

 .video-box-video .text-orta {
     display: flex;
     flex-direction: column;
     justify-content: center
 }

 .video-box-video .text-alt {
     display: flex;
     flex-direction: column;
     justify-content: flex-end
 }

 .video-box-video video {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
     z-index: 0;

 }

 .video-box-video h1 {
     font-size: 55px;
 }




 .text-header {
     background: #f8fafd;
     color: #272727;
     height: 150px;
     overflow: hidden;
     display: flex;
     align-items: center;
     position: relative;
     margin-bottom: 40px;
 }

 .text-header .text {

     margin: 0px;
     margin: 0px;
     text-align: right;
     padding-right: 50px;
     width: 100%;
     position: relative;
     z-index: 4;
     font-weight: 300;
 }

 .text-header .blur {
     font-size: 9rem;
     margin: 0px;
     margin: 0px;
     text-align: right;
     filter: blur(10px);
     width: 100%;
     position: absolute;
     height: 100%;
     z-index: 0;
     opacity: 0.3;
     color: #ccc;
 }

 .uyeol-d {
     position: relative;
     z-index: 0;
 }

 .uyeol-d:after {
     content: '';
     position: absolute;
     width: 100%;
     height: 100%;
     background: #fff;
     top: 0;
     left: 0;
     z-index: -1;
 }

 .uyeol-d:before {
     content: '';
     position: absolute;
     width: 80%;
     height: 80%;
     background: #fff;
     border-radius: 20%;
     top: 10%;
     left: 0;
     z-index: -1;
     box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.1);
 }

 .bg-gri-500 {
     background: var(--bg-color);
     color: #fff;
 }

 .bg-gri {
     background: #f2f2f2;
 }

 .bg-beyaz {
     background: #fff;
 }

 .bg-yesil {
     background: #6cad49;
     color: #fff;
 }

 .bg-yesil ul li {
     color: #fff;
 }

 .bg-mavi {
     background: #fddbb0;
     color: #fff;
 }

 .bg-mavi ul li {
     color: #fff;
 }

 .color-yesil {
     color: #71B62C;
 }

 .color-mavi {
     color: #fddbb0;
 }

 .color-beyaz {
     color: #fff;
 }

 .color-sari {
     color: #FFBA00;
 }

 .color-kirmizi {
     color: #E00F13 !important;
 }

 .color-gri {
     color: #9B9B9B;
 }

 .bg-soft-yesil {
     background: #e1fff5;
 }

 .hayalet-img {
     width: 50%;
     height: 400px;
     background: #1e55b9;
     left: 0px;
     top: 0px;
     display: block
 }

 .ul-butonlu li {
     padding: 4px 0px;
 }

 .ul-butonlu li a {
     padding: 6px 20px;
     border: 1px solid #1bbc9c;
     color: #1bbc9c;
     border-radius: 6px;
     display: inline-block;
     width: 100%;
     box-sizing: border-box;
 }

 .ul-butonlu li a:hover {
     background: #1bbc9c;
     color: #fff;
 }

 @keyframes data-3 {
     0% {
         -webkit-transform: scale(1);
         -moz-transform: scale(1);
         -o-transform: scale(1);
         -ms-transform: scale(1);
         transform: scale(1);
     }

     50% {
         -webkit-transform: scale(1.20);
         -moz-transform: scale(1.20);
         -o-transform: scale(1.20);
         -ms-transform: scale(1.20);
         transform: scale(1.20);
     }

     100% {
         -webkit-transform: scale(1);
         -moz-transform: scale(1);
         -o-transform: scale(1);
         -ms-transform: scale(1);
         transform: scale(1);
     }
 }

 .OLW-ANIMASYON .active {
     overflow: hidden;
 }

 .OLW-ANIMASYON .active img {
     animation: data-3 8s infinite;
 }

 * {
     box-sizing: border-box;
 }

 .bg-siyah {
     background: #272727;
     color: #fff;
 }

 .bg-abstract {
     background: #0AA830;
 }

 .menu-article {
     font-weight: 400;
 }



 .gray-img img {
     filter: grayscale(100%);
     transition: 0.5s;

 }

 .gray-img img:hover {
     filter: grayscale(0%);

 }

 .siyah-menu {
     position: fixed;
     background: rgba(255, 255, 255, 0.8);
     position: fixed;
     backdrop-filter: blur(10px);
     filter: none;
 }

 .gray-logo img {
     filter: grayscale(100%);
     transition: 0.5s;
     opacity: 0.4;
 }

 .gray-logo img:hover {
     filter: grayscale(0%);
     opacity: 1;
 }

 .mavi-bg {
     color: #fff;
     background: rgb(0, 129, 255);
     background: radial-gradient(circle, rgba(0, 129, 255, 1) 4%, rgba(44, 26, 135, 1) 100%);
 }

 @keyframes gradient {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }

 .kayanyazi {
     background: #161514;
     color: #fff;
 }

 .bg-ver {
     position: relative;
 }

 .bg-ver::before {
     display: inline-table;
     content: '';
     position: absolute;
     width: 100%;
     height: 50%;
     top: 0;
     background: url(de2.png) top right no-repeat;
     z-index: -1;
 }

 .bg-ver::after {
     display: inline-table;
     content: '';
     position: absolute;
     width: 100%;
     height: 50%;
     bottom: 0;
     background: url(de1.png) bottom left no-repeat;
     z-index: -1;
 }

 .site-butonlar {
     background: #895941
 }

 .site-butonlar a {
     display: inline-block;
     padding: 9px 15px;
     color: #fff;
     transition: 0.5s
 }

 .site-butonlar a:hover {
     opacity: 0.5;
     background: rgba(0, 0, 0, 0.1);
 }

 @media screen and (max-width: 1000px) {
     .site-butonlar {
         margin: 10px;
         border-radius: 8px;
         overflow: hidden
     }

     .site-butonlar a {
         display: inline-block;
         padding: 9px 15px;
         color: #fff;
         width: 100%;
         box-sizing: border-box;
         border-bottom: 1px solid rgba(255, 255, 255, .1)
     }
 }

 .dar-kutu h3 {}







 .liste-12 {

     position: relative;

     padding: 20px;
     background: #fff;
     border: 1px solid #f2f2f2;
     box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.05);
     border-radius: 6px;
     transition: 0.5s;

 }

 .liste-12 .h3 {
     color: #272727;
     font-weight: 600;


 }

 .liste-12 .p {
     color: #666;
     line-height: 28px
 }

 .liste-12 .fiyat {

     line-height: 35px;

     text-align: right;
 }

 .liste-12 .fiyat .ciz {
     color: red;
 }

 .liste-12 .fiyat .parabirimi {
     color: #0AA830;
 }


 .liste-12 .img {
     border-radius: 4px;
 }

 .liste-12 .img:after {
     display: table;
     content: '';
     position: absolute;
     width: 100%;
     height: 100%;
     z-index: 1000;
     background: var(--bg-color);
     transition: 0.5s;
     left: -100%;
     top: 0;
     opacity: 0.5;
 }

 .liste-12:hover .img:after {
     left: 0;
 }

 .liste-12 .info {
     color: #666;
 }





 @media screen and (max-width: 1000px) {}

 .liste-3 {
     border: 1px solid #f2f2f2
 }

 .CAROUSEL-MIN {}

 .CAROUSEL-MIN .owl-nav {
     position: relative;
     text-align: center;
     z-index: 9999;
     display: block
 }

 .CAROUSEL-MIN .owl-nav i {
     padding: 10px;
     color: #272727;
     background: #fff;
     margin: 0px
 }

 .CAROUSEL-MIN .owl-dots {
     display: block;
     position: absolute;
     width: 100%;
     bottom: -10px;
     left: 0px;
     text-align: center;
     z-index: 9999;
     display: none;
 }

 .CAROUSEL-MIN .owl-dots .owl-dot {
     display: inline-block;
     width: 12px;
     height: 12px;
     border: 1px solid #272727;
     margin: 2px;
     border-radius: 100px
 }

 .CAROUSEL-MIN .owl-dots .active {
     background: #272727;
 }

 .home-yorum {
     background: #fff;
     max-width: 800px;
     margin: 30px auto;
     padding: 30px;
     border-radius: 8px;
     box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2);


 }

 .home-yorum .ozet {
     font-size: 13px;
     line-height: 30px;
     max-height: 250px;
     position: relative;
     overflow: hidden;
 }

 .home-yorum .ozet:after {
     content: '';
     display: inline-table;

     background: rgb(255, 255, 255);
     background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(0, 0, 0, 0) 69%);
     width: 100%;
     height: 150px;
     position: absolute;
     left: 0;
     bottom: -5px;
 }

 .genel-puan {
     color: #FFBA00;
 }

 .genel-puan i {
     margin-left: 5px;
 }

 .genel-puan span {
     color: #555;

 }

 .yorum-liste {
     background: #F7F7F7;
     border-radius: 10px;
     margin: 0px 0px
 }

 .yorum-liste .puan {
     color: #FFBA00;
 }

 .yorum-liste .puan i {
     margin-left: 5px;
 }

 .yorum-liste .puan span {
     color: #555;

 }

 .yorum-liste .tit {

     font-weight: 600;
     padding-bottom: 10px;
 }

 .yorum-liste .tit a {
     color: #fddbb0;
     text-decoration: underline;
 }

 .yorum-liste .ozet {
     color: #555;

     line-height: 20px;
     padding-top: 15px;
     border-top: 1px solid #ccc;
     font-size: 16px;
     line-height: 30px;
 }

 .yorum-liste .tarih {
     color: #9B9B9B;
     position: absolute;
     top: 10px;
     right: 10px;

 }

 .yorum-liste .tarih i {
     padding-left: 10px;
 }

 .yorum-liste.ozet strong {
     font-size: 22px;
 }







 .h4-revize {}

 .h4-revize h4 {
     font-weight: 400;

     color: #272727;
 }

 .h4-revize h4 strong {
     font-weight: 400;
 }

 .h4-revize p {
     color: #999 !important;
 }

 .teklif-asama-bg {
     background: #f7f7f7;
 }

 .teklif-asama-bg .teklif-asama {
     text-align: center;
     padding: 40px 0px;
 }

 .teklif-asama-bg .teklif-asama .big-ikon {
     display: inline-block;
     width: 80px;
     height: 80px;
     text-align: center;
     line-height: 60px;
     border: 8px solid #ccc;
     border-radius: 90px;

     font-weight: 600;
     margin: 0 auto;
     background: #fff;
     position: relative;
     z-index: 2;
 }

 .teklif-asama-bg .teklif-asama .txt {
     text-align: center;
     position: relative;
     margin-top: 20px;
     display: inline-block;
 }

 .teklif-asama-bg .teklif-asama .txt h2 {
     padding: 0;
     margin: 0;

 }

 .teklif-asama-bg .teklif-asama .txt p {
     padding: 0;
     margin: 0;

 }

 .teklif-asama-bg .teklif-asama .txt i {
     position: absolute;
     left: 0;
     top: 5px;

 }

 .teklif-asama-bg .devredisi {
     color: #d6d6d6;
 }

 .teklif-asama-bg .devredisi .big-ikon {
     border: 8px solid #d6d6d6;
 }

 .teklif-asama-bg .burada {
     color: #272727;
 }

 .teklif-asama-bg .burada .big-ikon {
     border: 8px solid #ffba00
 }

 .teklif-asama-bg .burada .big-ikon i {
     line-height: 80px;
     text-align: center;
     color: #71B62C;
     font-size: 35px;
 }

 .teklif-asama-bg .i-1 {
     display: none
 }

 .teklif-asama-bg .gecti .i-2 {
     display: none
 }

 .teklif-asama-bg .gecti .i-1 {
     display: block
 }

 .teklif-asama-bg .gecti .big-ikon {
     border: 8px solid #71B62C
 }

 .teklif-asama-bg .cizgisi {
     position: absolute;
     z-index: 0;
     width: 80%;
     height: 10px;
     background: #d6d6d6;
     left: 10%;
     top: 35%;
 }

 .resimler-firma {
     background: #f2f2f2;
     padding: 30px;
 }

 .resim-sil {

     color: #272727;
     padding: 4px;
 }

 table {
     width: 100%;
     border-collapse: collapse;
 }

 /* Zebra striping */

 tr:nth-of-type(odd) {}

 th {
     color: #272727;
     font-weight: bold;
 }

 td,
 th {
     padding: 9px 6px;
     border: 1px solid #f2f2f2;
     text-align: left;

 }

 @media only screen and (max-width: 760px),
 (min-device-width: 768px) and (max-device-width: 1024px) {

     /* Force table to not be like tables anymore */
     table,
     thead,
     tbody,
     th,
     td,
     tr {
         display: block;
     }

     thead tr {
         position: absolute;
         top: -9999px;
         left: -9999px;
     }

     tr {
         border: 1px solid #ccc;

     }

     td {
         /* Behave  like a "row" */
         border: none;
         border-bottom: 1px solid #eee;
         position: relative;
     }

     td:before {
         position: absolute;
         width: 100%;
         padding-right: 10px;
         white-space: nowrap;
     }
 }

 table tbody tr td:first-child {
     width: 70%;
 }

 table tbody h5 {
     margin: 0px;
     padding: 0px;
 }

 .onemli {
     background: #f6f6f6;
     position: relative;
     z-index: 0;
     color: #5b5b5b;
     padding: 10px 15px 10px 70px;
     border-radius: 7px;
     margin: 5px 0px;

 }

 .onemli:after {
     width: 30px;
     height: 30px;
     display: inline-block;
     position: absolute;
     z-index: 10;
     left: 15px;
     top: 15px;
     content: '';

     background-image: url("bilgi.svg");
     background-repeat: no-repeat;
     background-position: 0px 0px;
     background-size: 30px;
     opacity: 0.5;

     filter: brightness(0) saturate(100%) invert(37%) sepia(63%) saturate(1636%) hue-rotate(193deg) brightness(94%) contrast(103%);

 }


 .list-style-1 {
     padding: 30px;
 }

 .list-style-1 ul {
     list-style: none;
     padding: 5px 0px;
     margin: 0px
 }

 .list-style-1 ul li {
     display: inline-block;
     background: #f2f2f2;
     color: var(--p-color);
     border-radius: 3px;
     padding: 5px 10px;
 }

 .list-style-1 strong {
     float: right;
 }

 .list-style-1 p {
     border-bottom: 1px solid #f2f2f2;
 }



 .buton-grup .btn-0-border {
     background: #49e670;
     color: #fff;
     margin-top: 10px;
 }

 @media screen and (max-width: 1000px) {
     .onemli {
         padding: 50px 15px 10px 15px;
     }
 }


 .onemli-2 {
     background: #d3ffee;
     padding: 10px 35px;
     border-radius: 7px;
     margin: 5px 0px;
 }

 .onemli-2 ul {
     margin: 0px 20px;
     padding: 0px;
 }

 .onemli-2 ul li {
     line-height: 35px;
 }












 .SIPARIS {
     background: #eef3fb;
     padding: 0px 0px
 }

 .SIPARIS .IN {
     max-width: 1200px;
     margin: 0 auto;
     padding: 50px 0px
 }

 .SIPARIS .UYEFORM {
     max-width: 500px;
     margin: 0 auto;
 }

 .SIPARIS h2.formbaslik {
     padding: 0px 0px 20px;
 }




 .SIPARISLERIM {
     background: #fff;
     padding: 40px
 }

 .SIPARISLERIM .baslik {
     background: #f2f2f2
 }

 .SIPARISLERIM .tr {
     width: calc(100% / 4);
     padding: 8px 8px;
     float: left
 }

 .SIPARISLERIM .list {
     border-bottom: 1px solid #f2f2f2
 }



 #yukaricik {
     display: inline-block;
     background-color: #fff;
     box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3);
     width: 30px;
     height: 30px;
     text-align: center;
     border-radius: 60px;
     position: fixed;
     bottom: 10px;
     right: 10px;
     transition: background-color .3s,
         opacity .5s, visibility .5s;
     opacity: 0;
     visibility: hidden;
     z-index: 1000;
 }

 #yukaricik::after {
     content: "\f077";
     font-family: FontAwesome;
     font-weight: normal;
     font-style: normal;

     line-height: 30px;
     color: #272727;
 }

 #yukaricik:hover {
     cursor: pointer;
     background-color: #fff;
 }

 #yukaricik:active {
     background-color: #555;
 }

 #yukaricik.show {
     opacity: 1;
     visibility: visible;
 }



 .yeni-liste-1 {
     grid-template-columns: 100px auto;
 }

 .yeni-liste-2 {
     grid-template-columns: auto 100px;
 }

 .yeni-liste-ortak {
     display: grid;
     align-items: center;
     gap: 30px;
     padding-bottom: 15px;
     border-bottom: 1px solid #f2f2f2;
 }

 .yeni-liste-ortak .img {
     border-radius: 5px;
 }

 .yeni-liste-ortak .text {
     font-size: 16px;
     font-weight: 600;
 }

 .yeni-liste-ortak .tag {
     font-weight: 300;
     font-size: 12px;
     padding-top: 10px;
     color: #ccc;
 }


 .yeni-liste-ortak:hover .text {
     color: var(--bg-dark);
 }

 .footer-alt {
     background: #f2f2f2;
     color: var(--text-color);


 }

 .footer-alt p {

     color: var(--text-color);

 }

 .sosyalmedya i {
     display: inline-block;
     width: 45px;
     height: 45px;
     line-height: 45px;
     border: 1px solid #ccc;
     text-align: center;
     border-radius: 35px;
 }

 .sosyalmedya a {
     display: inline-block;
 }

 .footer-url a {
     display: inline-block;
     padding: 6px 10px;
     color: #272727;
 }






 hr {
     border: 0px;
     width: 100%;
     background: #ccc;
     height: 1px;
 }

 .ekibimiz img {
     filter: grayscale(100%);
 }

 .ekibimiz:hover img {
     filter: grayscale(0%);
 }

 .ekibimiz .img-border {
     border: 1px solid #ddd;
     padding: 7px;
     border-radius: 600px;
 }

 .ekibimiz .h3 {
     font-weight: 600;
 }

 .ekibimiz .p p {
     line-height: 19px;
     opacity: 0.8;
 }

 .full-kutu {}


 .cek-ul ul {
     list-style: none;
 }

 .cek-ul ul li {
     width: 100%;
     padding: 6px 0px 6px 50px;
     margin-bottom: 5px;

     line-height: 30px;
     list-style: none;
     background-image: url("ck.png");
     background-repeat: no-repeat;
     background-position: 0px 6px;
     background-size: 30px;
 }

 .cek-ul ul:after {
     display: table;
     clear: both;
     content: '';
 }


 .food {
     padding: 20px;
 }

 .food ul {
     width: calc(100% / 3);
     float: left;
     padding: 30px;
     box-sizing: border-box;
 }

 .food ul li {
     list-style: none;
     border-bottom: 1px solid #ccc;
     color: #666;
 }

 .food ul li strong:first-child {
     color: var(--text-color);
     width: 100%;
     display: inline-block;
 }

 .food ul li strong:last-child {
     color: var(--text-color);
     float: right;
 }

 .food ul h3 {
     color: #888;
     font-weight: 300;
 }


 @media screen and (max-width: 1000px) {
     .food ul {
         width: calc(100% / 1);
         float: left;
         padding: 30px;
         box-sizing: border-box;
     }
 }




 .ic-menu {}

 .ic-menu .li {
     line-height: 35px;
     margin-bottom: 3px;
     padding: 0px 30px;
     position: relative;
     transition: 0.5s;
     background: #fff;
     border: 1px solid #ddd;
     overflow: hidden;
     border-radius: 4px;
 }

 .ic-menu .li i {
     position: absolute;
     right: 5px;
     top: 5px;
     color: var(--w-color);
     background: #ccc;
     display: inline-block;
     width: 25px;
     height: 25px;
     line-height: 25px;
     text-align: center;
     border-radius: 30px;
 }

 .ic-menu .li:hover {
     background: #f5f5f5;
 }




 .free-article ul {
     margin: 0px;
     padding: 0px;
 }

 .free-article ul li {
     padding: 6px 0px 6px 30px;

     margin: 0px;
     line-height: 30px;
     list-style: none;
     background-image: url("ck.png");
     background-repeat: no-repeat;
     background-position: 0px 15px;
     background-size: 15px;

     margin-bottom: 1px;
 }

 .free-article ol {
     margin: 0px;
     padding: 0px;
 }

 .free-article ol li {
     padding: 6px 0px 6px 30px;
     margin: 0px;

     line-height: 30px;
     list-style: none;
     background-image: url("close.png");
     background-repeat: no-repeat;
     background-position: 0px 15px;
     background-size: 15px;

     margin-bottom: 1px;
 }

 .free-article h1 {
     padding: 8px 0px;
     font-weight: 300;
 }

 .free-article h2 {
     padding: 8px 0px;

 }

 .free-article p {
     padding: 0px 0px;

 }

 .free-article hr {
     margin: 30px 0px;
     background: rgb(212, 212, 212);
     background: linear-gradient(100deg, rgba(212, 212, 212, 1) 0%, rgba(0, 15, 85, 0) 47%);
 }

 .minipencere {
     width: 100px;
     padding: 5px;
 }


 #acordion {}

 #acordion .acordion {
     padding: 0px;

 }

 #acordion .acordion-title h3 {
     cursor: pointer;
     padding: 0px 20px;
     line-height: 50px;
     letter-spacing: -0.5px;

     font-weight: 600;
     color: var(--bg-color);
     position: relative;
     z-index: 0;
     background: var(--light);
     margin-bottom: 5px;
     border-radius: 6px;
     font-size: 16px;


 }

 #acordion .acordion-title h3 i {
     position: absolute;
     line-height: 30px;
     background: none;
     color: var(--dodge);
     top: 10px;
     right: 10px;
     padding: 0px 15px;
     border-radius: 0px;

 }

 #acordion .acordion-content {
     padding: 9px 20px;
 }

 #acordion .acordion-content p {
     font-size: 14px;
     color: var(--bg-color);
     font-weight: 400;
 }





 .urun-class {
     text-align: center;
     position: relative;
     overflow: hidden;
     border-radius: 8px;
     background: #f5f5f5;
 }

 .urun-class img {
     background: none;
 }

 .urun-class p {
     display: none;
 }

 .urun-class .more-buton {
     display: none;
 }

 .urun-class h3 {
     font-weight: 400;
 }

 .urun-class h3 strong {
     font-weight: 400
 }

 .urun-class:after {
     transition: 0.5s;
     display: inline-table;
     content: '';
     position: absolute;
     width: 80%;
     height: 80%;
     border-radius: 600px;
     background: #85cc5d;
     left: -50%;
     top: -50%;
     z-index: -1;
 }

 .urun-class:hover {
     background: none;
 }

 .urun-class:hover:after {

     -webkit-transform: scale(5);
     -moz-transform: scale(5);
     -o-transform: scale(5);
     -ms-transform: scale(5);
     transform: scale(5);

     opacity: 0.1;


 }





 .ikonbar {
     background: #0076ae;

     display: flex;

 }


 .ikonbar .li {
     width: calc(100% / 3);
     border-left-color: #ccc;
     color: var(--w-color);
     text-align: center;
 }

 .ikonbar .li h3 {
     color: var(--w-color);
 }

 .ikonbar .li p {
     color: var(--w-color);
 }

 .ikonbar .li i {
     color: var(--w-color);
 }

 .p-font-11 input {
     display: inline-block;
     float: left;
 }

 .p-font-11 p {
     font-size: 11px;
     display: inline-block;
     float: left;
 }


 .e-bulten {
     background: rgb(91, 96, 99);
     background: linear-gradient(90deg, rgba(91, 96, 99, 1) 0%, rgba(91, 96, 99, 1) 50%, rgba(35, 96, 121, 1) 50%, rgba(35, 96, 121, 1) 100%);
     color: #fff
 }

 @media screen and (max-width: 1000px) {
     .e-bulten .content {
         padding: 10px;
     }
 }



 @media screen and (max-width: 1000px) {
     .ikonbar {
         display: block;
     }

     .ikonbar .li {
         width: calc(100% / 1);
     }
 }


 .text-box {
     display: block;
 }


 .p-none .item {
     text-align: center;
     position: relative;
 }

 .p-none .item:after {
     width: 100px;
     height: 100px;
     content: '';
     display: inline-block;
     position: absolute;
     left: 50%;
     top: 50%;
     background-color: var(--p-color);
     z-index: -1;
     transform: translateX(-50%) translateY(-60%);
     border-radius: 100px;
     filter: blur(6px);
     opacity: 0.07;

 }

 .p-none .item h3 {
     color: var(--p-color);
     font-weight: 300;
 }

 .p-none .item h3 strong {
     font-weight: 300;
 }

 .p-none .item p {
     color: var(--p-color);
     font-weight: 300;
 }

 .p-none .more-buton {
     display: none;
 }

 .p-none .img-kare {
     border-radius: 1000px;
     width: 150px;
     height: 150px;
     margin: 0 auto;
     padding: 0px;
 }

 .slider-tema-1 {
     padding-bottom: 30px;
 }

 .slider-tema-1 .owl-nav {
     display: none;
     position: absolute;
     width: 60px;
     bottom: 0%;
     height: 1px;
     left: 50%;
     text-align: center;
     z-index: 9999;


     transform: translateX(-50%);
 }

 .slider-tema-1:hover .owl-nav {
     display: block;
 }


 .slider-tema-1 .owl-carousel .owl-prev {}

 .slider-tema-1 .owl-carousel .owl-next {}

 .slider-tema-1 .owl-carousel .owl-nav i {
     display: inline-block;

     color: var(--p-color);
     font-size: 25px;
     line-height: 30px;
     width: 30px;
     height: 30px;
 }


 .slider-tema-dotted {}

 .slider-tema-dotted .owl-nav {
     display: none
 }

 .slider-tema-dotted .owl-dots {
     display: block;
     position: absolute;
     width: 100%;
     bottom: 10px;
     left: 0px;
     text-align: center;
     z-index: 9999;
 }

 .slider-tema-dotted .owl-dots .owl-dot {
     display: inline-block;
     width: 30px;
     height: 10px;

     margin: 2px;
     border-radius: 100px;
     background: #fff;
     opacity: 0.3;
 }

 .slider-tema-dotted .owl-dots .active {
     opacity: 1;
 }





 .galeri-home-rad {
     border-radius: 10px;
     overflow: hidden;
     box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
 }

 .grid-tema>div {
     background: #f5f5f5;
     border-radius: 6px;
     padding: 20px;
 }



 .bg-ozel-full {
     color: #fff;
     position: relative;
 }

 .bg-ozel-full h1 {
     color: #fff;
 }

 .bg-ozel-full h2 {
     color: #fff;
 }

 .bg-ozel-full p {
     color: #fff;
 }

 .bg-ozel-full .img-tam {
     opacity: 0;
 }

 .bg-ozel-full>div:after {
     content: '';
     display: inline-table;
     position: absolute;
     height: 100%;
     width: 50%;
     background: #03e78b;
 }



 .gorsel-url {
     text-align: center;
 }

 .gorsel-url img {
     background: none;
 }

 .gorsel-url p {
     display: none;
 }

 .gorsel-url .more-buton {
     display: none;
 }

 .gorsel-url h3 {
     font-weight: 400;
 }

 .gorsel-url h3 strong {
     font-weight: 400
 }



 .buton-type a {
     display: inline-block;
     background: var(--bg-color);
     ;
     color: #fff;
     padding: 6px 15px;
     border-radius: 4px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1);
     transition: 0.5s;



 }

 .buton-type a:hover {
     background: #fff;
     color: var(--text-color);
 }


 .buton-gizle .more-buton {
     display: none;
 }



 .gradient-bottom {
     position: relative;
 }

 .gradient-bottom::after {
     width: 100%;
     height: 40%;
     position: absolute;
     left: 0;
     bottom: 0;
     background: rgb(36, 67, 124);
     background: linear-gradient(0deg, rgba(36, 67, 124, 1) 0%, rgba(255, 255, 255, 0) 100%);
 }


 .li-etiketle ul {
     margin: 0px;
     padding: 0px;
     list-style: none;
 }

 .li-etiketle ul li {
     margin: 0px;
     padding: 6px 15px;
     list-style: none;
     display: inline-block;
     background: #e5e5e5;
     color: var(--p-color);
     border-radius: 4px;
     transition: 0.5s;
 }

 .li-etiketle ul li:hover {
     background: #f7bb05;
 }



 .bg-dark {
     background: #000;
     color: #fff;
 }

 .bg-dark h1 {
     color: #fff;
 }

 .bg-dark h2 {
     color: #fff;
 }

 .bg-dark p {
     color: #fff;
 }

 .bg-light {
     background: #272727;
     color: #fff;
 }

 .bg-light h1 {
     color: #fff;
 }

 .bg-light h2 {
     color: #fff;
 }

 .bg-light p {
     color: #fff;
 }

 .bg-tema {
     background: #FFF;
     background: radial-gradient(circle, rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 85%);
 }

 .bg-tema h1 {
     color: var(--bg-color);
     font-weight: 800;
 }

 .bg-tema h2 {
     color: var(--bg-color);
     font-weight: 600;
 }

 .bg-tema h3 {
     color: var(--bg-color);
 }

 .bg-tema p {
     color: var(--bg-color);
     font-weight: 400;
 }


 .bg-tema-2 {
     background: var(--color-2)
 }

 .bg-tema-2 h1 {
     color: var(--dodge-4) !important;
     font-weight: 800;
 }

 .bg-tema-2 h2 {
     color: var(--dodge-4) !important;
     font-weight: 600;
 }

 .bg-tema-2 h3 {
     color: var(--dodge-4) !important;
 }

 .bg-tema-2 p {
     color: #fff !important;
     font-weight: 400;
 }



 .bg-tema-3 {
     background: var(--color)
 }

 .bg-tema-3 h1,
 .bg-tema-3 h2,
 .bg-tema-3 h2 strong,
 .bg-tema-3 h3 {
     color: var(--color-2) !important;
 }

 .bg-tema-3 p {
     color: #fff !important
 }

 .bg-tema-3 .article-xs img {
     filter: brightness(0) saturate(100%) invert(79%) sepia(6%) saturate(1590%) hue-rotate(9deg) brightness(90%) contrast(87%);
 }










 .bg-tema-4 {
     color: var(--p-color);
     position: relative;
     z-index: 0;
 }

 .bg-tema-4:after {
     width: 100px;
     height: 80%;
     position: absolute;
     z-index: -1;
     content: '';
     display: inline-block;
     left: 50%;
     top: 50%;
     background: #f2f2f2;
     transform: translate(-50%, -50%);
 }

 .bg-tema-4 h1 {
     color: var(--p-color);
 }

 .bg-tema-4 h2 {
     color: var(--p-color);
 }

 .bg-tema-4 h2 strong {
     display: inline-block;
     position: relative;
 }

 .bg-tema-4 h2 strong:after {
     width: 100%;
     position: absolute;
     height: 20px;
     background: #f3f3f3;
     content: '';
     display: inline-block;
     left: 0;
     bottom: 5px;
     z-index: -1;
 }

 .bg-tema-4 h3 {
     color: var(--p-color);
 }

 .bg-tema-4 p {
     color: var(--p-color)
 }


 .otel-detay {
     padding: 50px;
 }

 .otel-detay .otel-detay-text {
     background: var(--dodge);
     padding: 40px;
 }

 @media screen and (max-width: 1000px) {
     .otel-detay {
         padding: 5px;
     }
 }

 .urun-detay {}

 .urun-detay-content {}

 .urunler-content {
     margin: 0 auto;
 }


 .lego-tam {
     background: #f6f6f6;
     position: relative;
     z-index: 0;
 }

 .lego-tam-alt {
     position: relative;
     z-index: 0;
     overflow: hidden;
 }

 .lego-tam-alt:after {
     background: #f6f6f6;
     content: '';
     z-index: -1;
     display: inline-table;
     position: absolute;
     width: 200%;
     height: 100%;
     left: -50%;
     top: -50%;
     transform: rotate(9deg);
 }

 .lego-tam-ust {
     position: relative;
     z-index: 0;
     overflow: hidden;
 }

 .lego-tam-ust:after {
     background: #f6f6f6;
     content: '';
     z-index: -1;
     display: inline-table;
     position: absolute;
     width: 200%;
     height: 100%;
     left: -50%;
     top: 50%;
     transform: rotate(-9deg);
 }






 .abs-1 {
     position: relative;
     z-index: 0;
 }

 .abs-1:after {
     left: 0;
     top: 0;
     opacity: 0.5;
     z-index: 0;
     width: 70vh;
     height: 70vh;
     background: #e7f2ff;
     transform: translate(-35vh, 0px) rotate(45deg);
     position: absolute;
     display: inline-table;
     content: '';
     border-radius: 100px;
 }

 .abs-1:before {
     left: 0;
     top: 0;
     opacity: 0.5;
     z-index: 0;
     width: 60vh;
     height: 60vh;
     background: #e7f2ff;
     transform: translate(-15vh, -30vh) rotate(45deg);
     position: absolute;
     display: inline-table;
     content: '';
     border-radius: 100px;
 }

 .abs-1>div {
     position: relative;
     z-index: 10;
 }


 .abs-2 {
     position: relative;
     z-index: 0;
 }

 .abs-2:after {
     left: 0;
     top: 0;
     opacity: 0.5;
     z-index: 0;
     width: 70vh;
     height: 70vh;
     background: #e7f2ff;
     transform: translate(35vh, 0px) rotate(45deg);
     position: absolute;
     display: inline-table;
     content: '';
     border-radius: 100px;
 }

 .abs-2:before {
     left: 0;
     top: 0;
     opacity: 0.5;
     z-index: 0;
     width: 60vh;
     height: 60vh;
     background: #e7f2ff;
     transform: translate(15vh, 30vh) rotate(45deg);
     position: absolute;
     display: inline-table;
     content: '';
     border-radius: 100px;
 }

 .abs-2>div {
     position: relative;
     z-index: 10;
 }






 .metin-reklam {
     padding: 50px 20px;
     position: relative;
     overflow: hidden;
 }

 .metin-reklam h1 {
     color: var(--p-color);
     letter-spacing: 3px !important;

     background: #9601FB;
     background: linear-gradient(to right, #9601FB 0%, var(--color) 44%, #01FCD1 100%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 .metin-reklam h2 {
     color: var(--p-color);
 }

 .metin-reklam h3 {
     color: var(--p-color);
     font-weight: 700;
     background: #FF276F;
     background: linear-gradient(to right, #FF276F 0%, #FF276F 24%, #FBC822 73%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 .metin-reklam p {
     color: var(--p-color);
     letter-spacing: 1px;
 }

 .metin-reklam:after {
     content: '';
     display: inline-block;
     position: absolute;
     z-index: 0;
     width: 50vh;
     height: 50vh;
     border-radius: 2000px;
     background-color: #9403fb;
     left: 0;
     top: 0;
     filter: blur(100px);
     transform: translate(50%, 50%);
     opacity: 0.2;
 }

 .metin-reklam:before {
     content: '';
     display: inline-block;
     position: absolute;
     z-index: 0;
     width: 50vh;
     height: 50vh;
     border-radius: 2000px;
     background-color: #01FCD1;
     right: 0;
     top: 0;
     filter: blur(100px);
     transform: translate(-50%, -90%);
     opacity: 0.2;
 }




 .metin-reklam>div {
     position: relative;
     z-index: 10;
 }









 .metin-reklam-2 {
     background: var(--bg-dark);
     padding: 50px 20px;
 }

 .metin-reklam-2 h1 {
     color: var(--p-color);
     font-weight: 200 !important;
     letter-spacing: 3px !important;
     background: #FF276F;
     background: linear-gradient(to right, #FF276F 0%, #FF276F 24%, #FBC822 73%);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 .metin-reklam-2 h2 {
     color: #fff;
 }

 .metin-reklam-2 h3 {
     color: var(--p-color);
     font-weight: 700;
 }

 .metin-reklam-2 p {
     color: #fff;
     letter-spacing: 1px;
 }



 .slider-tema h2 {
     color: var(--p-color);
     font-weight: 300;
 }

 .slider-tema h2 strong {
     font-size: 55px;
     font-weight: 800;
     background: rgb(62, 176, 255);
     background: linear-gradient(31deg, rgba(62, 176, 255, 1) 0%, rgba(0, 46, 247, 1) 100%);

     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;

 }

 .slider-tema a {}

 .slider-tema a {
     margin-top: 20px;
     display: inline-block;
     background: var(--bg-color);
     ;
     color: #fff;
     padding: 6px 15px;
     border-radius: 4px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1);
     transition: 0.5s;

     background: rgb(62, 176, 255);
     background: linear-gradient(31deg, rgba(62, 176, 255, 1) 0%, rgba(0, 46, 247, 1) 100%);



 }


 .imageWrapper {
     position: relative;
     display: inline-block;
     background: #00CCCC;
 }

 .editIcon {
     position: absolute;

     background: #28a745;
     color: white;
     border-radius: 50%;
     width: 24px;
     height: 24px;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
     cursor: pointer;
     font-size: 18px;
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
     z-index: 900;
     left: -50%;
     top: -50%;
 }


 .slider-tema a:hover {
     background: rgb(62, 176, 255);
     background: linear-gradient(90deg, rgba(62, 176, 255, 1) 0%, rgba(0, 46, 247, 1) 100%);
 }

 .MG {
     background: var(--bg-color) !important;
 }

 .color-tema {
     color: var(--bg-color);
 }

 .color-tema h1 {
     color: var(--dodge);
     font-family: var(--font-title);
 }

 .color-tema h1 strong {
     color: var(--dodge);
     font-weight: 800;
 }

 .color-tema h2 {
     color: var(--dodge);
     font-family: var(--font-title);
 }

 .color-tema h2 strong {
     color: var(--dodge);
     font-weight: 800;
 }

 .color-tema h3 {}

 .color-tema p {
     color: var(--color);
     font-size: 17px;
     line-height: 35px;
     font-weight: 300;
 }

 .color-tema p a {
     color: var(--color);
 }


 .site-font-2 h1 {
     font-size: clamp(2rem, 5vw, 3rem);
 }

 .site-font-2 h2 {
     font-size: clamp(2rem, 5vw, 3rem);
 }

 .site-font-2 h3 {
     font-size: clamp(2rem, 5vw, 2rem);
 }

 .site-font-2 p {
     line-height: auto;
     font-weight: 300;
     padding: 6px 0px;
     font-size: clamp(0.7rem, 5vw, 1.2rem);
 }

 .site-font-2 ul {
     padding: 20px;
 }

 .site-font-2 ul li {
     list-style: circle;
 }

 .color-tema-2 h1,
 .color-tema-2 h1 strong,
 .color-tema-2 h2,
 .color-tema-2 h2 strong {
     color: var(--dodge-2);

 }

 .color-tema-2 p {
     color: var(--menu-text-color);

 }

 .color-tema-2 ul {
     width: 100%;
     text-align: center;
 }

 .color-tema-2 ul li {

     font-size: 17px;
     line-height: 35px;
     font-weight: 600;
     margin: 4px;
     padding: 0;
     display: inline-block;
     list-style: none;

     padding: 9px 30px;
     border-radius: 5px;
     color: #000;


     background: #8EA0AE;
     background: linear-gradient(342deg, rgba(142, 160, 174, 1) 0%, rgba(210, 215, 219, 1) 60%);
 }







 .color-tema-3 h1,
 .color-tema-3 h1 strong,
 .color-tema-3 h2,
 .color-tema-3 h2 strong {
     color: var(--dodge-2);
     font-family: var(--font-title);
     font-weight: 800;
 }

 .color-tema-3 p {
     color: var(--dodge-3);
     font-size: 17px;
     line-height: 35px;
     font-weight: 300;
 }

 .color-tema-3 ul li {
     color: var(--dodge-3);
     font-size: 17px;
     line-height: 35px;
     font-weight: 300;
     margin: 0;
     padding: 0
 }

 .color-tema-4 h1,
 .color-tema-4 h1 strong,
 .color-tema-4 h2,
 .color-tema-4 h2 strong {
     color: var(--color-2);
     font-family: var(--font-title);
 }

 .color-tema-4 p {
     color: var(--dodge-3);
     font-size: 17px;
     line-height: 35px;
     font-weight: 300;
 }

 .color-tema-4 ul li {
     color: var(--dodge-3);
     font-size: 17px;
     line-height: 35px;
     font-weight: 300;
     margin: 0;
     padding: 0
 }




 .img-beyaz img {
     filter: brightness(0) saturate(100%) invert(93%) sepia(100%) saturate(1%) hue-rotate(10deg) brightness(108%) contrast(100%);
 }

 .color-tema-dark {
     color: #fff;
 }

 .color-tema-dark h1 {
     color: #fff;
 }

 .color-tema-dark h2 {
     color: #fff;
 }

 .color-tema-dark h2 strong {
     background: var(--bg-color);
 }

 .color-tema-dark h3 {
     color: #fff;
 }

 .color-tema-dark p {
     color: #fff;
 }




 .kategori-kategori {
     padding: 20px;
     background: var(--light);
     border-radius: 10px;
 }

 .kategori-kategori h3 {
     padding-bottom: 10px;
     padding-left: 40px;
     color: var(--bg-color);
 }

 .kategori-kategori .img img {
     border-radius: 10px;
     -webkit-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     -moz-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
 }

 .kategori-kategori ul li a {
     font-weight: 500;
     color: var(--bg-color);
 }

 .kategori-kategori ul li a:hover {
     color: var(--dodge);
 }


 .bg-gray {
     background: #f7f7f7;
 }



 .yan-menu {
     background: var(--color-2)
 }


 .yan-menu .diltext {
     color: #fff !important;
 }

 .yan-menu .dil-aktif {
     font-weight: 600;
 }


 .buton-tema-1 a {
     margin-top: 20px;
     display: inline-block;
     background: var(--bg-color);
     ;
     color: #fff;
     padding: 6px 15px;
     border-radius: 4px;
     box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.1);
     transition: 0.5s;
 }

 .buton-tema-1 a:hover {
     opacity: 0.7;
 }






 .ul-tema-2 ul {
     list-style: none;
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 10px;
 }

 .ul-tema-2 ul:after {
     display: inline-table;
     content: '';
     clear: both;
 }

 .ul-tema-2 ul li {
     list-style: none;
     margin: 0;
     padding: 6px 10px 6px 30px;
     position: relative;
     color: var(--text-color);
     font-size: 13px;
     border-radius: 3px;
     background: #fff;

 }

 .ul-tema-2 ul li::after {
     position: absolute;
     left: 8px;
     top: 8px;
     content: "\f00c";
     font-family: FontAwesome;
     font-weight: normal;
     font-style: normal;

     color: var(--text-color);

 }



 .ul-tema-i ul {
     list-style: none;
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: repeat(5, 1fr);
     gap: 0px;
 }

 .ul-tema-i ul:after {
     display: inline-table;
     content: '';
     clear: both;
 }

 .ul-tema-i ul li {
     list-style: none;
     margin: 0;
     padding: 30px 10px;
     position: relative;
     color: var(--text-color);
     font-size: 15px;
     border-radius: 3px;
     text-align: center;

 }

 .ul-tema-i ul li i {
     display: inline-block;
     font-size: 39px;
     width: 100%;
     text-align: center;
     padding-bottom: 10px;
     color: var(--text-color);
 }

 .ul-tema-i ul li strong {
     font-weight: 600;
     padding: 6px 0px;
     display: inline-block;
 }



 .ul-tema-i-2 ul {
     list-style: none;
     margin: 0;
     padding: 0;
     display: grid;
     grid-template-columns: repeat(1, 1fr);
     gap: 3px;
 }

 .ul-tema-i-2 ul:after {
     display: inline-table;
     content: '';
     clear: both;
 }

 .ul-tema-i-2 ul li {
     list-style: none;
     margin: 0;
     padding: 9px 0px;
     position: relative;
     color: var(--text-color);
     font-size: 16px;


 }

 .ul-tema-i-2 ul li i {
     display: inline-block;
     color: var(--text-color);
     padding-right: 10px;
 }

 @media screen and (max-width: 1000px) {

     .ul-tema-i ul {

         grid-template-columns: repeat(2, 1fr);

     }

 }





 .about .img-tam {
     position: relative;
     z-index: 0;
 }

 .about .img-tam img {
     height: 70vh;
     object-fit: cover;
 }

 .about .page {
     background: #fff;
     padding: 50px;
     margin-top: -50vh;
     max-width: 700px;
     box-shadow: var(--shadow);
 }

 .about .content {
     position: relative;
     z-index: 1;
     padding-bottom: 50px;
 }


 @media screen and (max-width: 1000px) {


     .about .img-tam img {
         height: auto;
         object-fit: cover
     }

     .about .page {
         background: #fff;
         padding: 20px;
         margin-top: -0;
         max-width: 100%;
     }

     .about .content {
         position: relative;
         z-index: 1;
         padding: 0px;
     }

 }


 .liste-2a {
     position: relative;
     overflow: hidden
 }

 .liste-2a .text {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     display: flex;
     align-items: center;
     align-content: center;
     transition: .5s;
 }

 .liste-2a .text>div {
     width: 100%;
     text-align: center;
     position: relative;
     z-index: 1;
     font-weight: 300;
     font-size: 22px;
     color: #fff;
 }

 .liste-2a .text:after {
     display: table;
     position: absolute;
     content: '';
     width: 100%;
     height: 100%;
     bottom: 0;
     left: 0;
     z-index: 0;
     background: var(--bg-color);
     opacity: .5;




 }

 .liste-2a:hover .text {
     left: -100%;
 }



 .bg-page {
     background: var(--color-2)
 }

 .bg-page .bg-beyaz {}

 .img-tam-2 {}

 .img-tam-2 img {
     padding: 0;
     margin: 0;
     width: 100%;
 }


 .hover:hover {
     cursor: pointer;
 }

 .sepete-at {
     line-height: 48px;
     color: #fff;
     font-weight: 600;
     overflow: hidden;
     border: 1px solid #000;
     text-align: center;
     background: #000;
     cursor: pointer;
 }

 .sepete-at:hover {
     background: #505050;
 }

 .adetler {
     line-height: 48px;
     color: #666;
     font-weight: 600;
     overflow: hidden;
     border: 1px solid #000;

 }


 .formlu-acord .form {
     background: var(--bg-color);
     border-radius: 9px;
 }

 .formlu-acord .form h2 {
     color: #fff;
 }

 .formlu-acord .form p {
     color: #fff;
 }

 .formlu-acord .form .btn-tema {
     color: #fff;
     background: var(--dodge);
 }

 .sepet-header {
     padding: 30px 0px;
     text-align: center;
     font-size: 36px;
     background: #f4f4f4;
 }

 .sepetlistesi {
     padding: 20px;
     margin-bottom: 5px;
     border: 1px solid #f2f2f2;
 }

 .sepetlistesi .ozellikler {
     padding-top: 5px;
     font-size: 12px;
 }

 .sepetlistesi a.isim {
     font-size: 14px;
 }

 .sepetlistesi a.sil {
     color: #f27a1a;
 }

 .sepetlistesi span {
     display: inline-block;
     width: 100%;
     font-size: 12px;
     color: #f27a1a;
 }

 .sepetlistesi strong {
     color: #000;
 }



 .full-menu {
     position: relative;
     overflow: hidden;
     padding: 20px;
 }

 .full-menu>div {
     position: relative;
     z-index: 10;
     display: grid;
     grid-template-columns: repeat(6, 1fr);
     gap: 5px;
 }

 .full-menu .menu-alt {
     border-right: 1px solid #ccc;
     padding: 20px;
 }

 .full-menu .menu-alt:last-child {
     border: none;
 }


 .full-menu .menu-alt a {
     font-size: 12px;
     color: #606060 !important;
     display: inline-block;
     width: 100%;
     padding: 5px 0px;
     line-height: 18px;
 }

 .full-menu .menu-alt a:hover {
     text-decoration: underline;
 }

 .full-menu .menu-alt strong {
     color: var(--bg-color);
 }

 .adetler input {
     border: none;
     width: calc(100% / 3);
     height: 50px;
     margin: 0px 0px;
     text-align: center;
     float: left;
     box-sizing: border-box;
     font-size: 18px;
     font-weight: bold
 }

 .adetler .eksilt {
     width: calc(100% / 3);
     background: #ffffff;
     color: #000;
     text-align: center;
     float: left;
     line-height: 50px;
     box-sizing: border-box;
     font-size: 20px
 }

 .adetler .eksilt:hover {
     cursor: pointer;
     color: #000
 }

 .barkod {
     color: #f27a1a;
 }

 .urunkodu {
     color: #ccc;
 }




 .site-color h1 {
     color: var(--bg-color);
 }

 .site-color h2 {
     color: var(--bg-color);
 }

 .img-over .img-tam {
     border-radius: 9px;
 }

 .site-font h1 {
     font-size: clamp(2rem, 5vw, 3rem);
 }

 .site-font h2 {
     font-size: clamp(2rem, 5vw, 3rem);
 }

 .site-font h3 {
     font-size: clamp(2rem, 5vw, 2rem);
 }

 .site-font p {
     line-height: auto;
     font-weight: 400;
     padding: 6px 0px;
     font-size: clamp(0.7rem, 5vw, 1rem);
 }

 .site-font ul {
     padding: 20px;
 }

 .site-font ul li {
     list-style: circle;
 }














 .site-banner {
     background: #f5f5f5;
 }

 .site-banner h2 {
     color: var(--bg-color);
 }

 .site-banner p {
     color: var(--p-color);
 }

 .site-banner a {
     display: inline-block;
     padding: 6px 15px;
     color: #fff;
     background: var(--bg-color);
     font-weight: 600;
     border-radius: 4px;
 }


 .mq {
     width: 100%;
     overflow: hidden;
     position: relative;
     background: var(--color-2);
     color: #fff;
     padding: 14px 0;
     /* isteğe bağlı */
 }

 .mq p {
     opacity: 0.5;
 }




 .liste-1 {
     padding: 20px;
     background: #fff;
     border-radius: 10px;
 }

 .liste-1 .img-hd {
     border-radius: 10px;
     -webkit-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     -moz-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
 }

 .liste-1 .h3 {
     padding-top: 20px;
     font-weight: 600;
 }


 .grid-listelemesi .text h2 {
     padding-bottom: 10px;
     color: var(--bg-color);
     padding-top: 20px;
     font-size: 18px;
 }

 .grid-listelemesi .text p {
     font-weight: 500;
     color: var(--bg-color);
     font-size: 14px;
 }

 .grid-listelemesi:hover .text h2 {
     color: var(--dodge);
 }

 .grid-listelemesi .img {
     border-radius: 0px;
 }



 .icindekiler {
     background: #fff;
     padding: 30px;
     margin: 0px;
     color: var(--bg-color);

     border-radius: 10px;
     -webkit-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     -moz-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);

 }

 .icindekiler .title {
     font-weight: 800;
     font-size: 18px;
     color: var(--bg-color);
     padding-bottom: 15px;
 }

 .icindekiler ul {
     margin: 0px;
     padding: 0px 20px;
 }

 .icindekiler ul li {
     list-style: decimal;
     margin: 0px;
     padding: 0px;
 }

 .icindekiler ul li a {
     display: inline-block;
     color: var(--bg-color);
     font-size: 16px;
     line-height: 27px;
     font-weight: 600;
 }



 @media screen and (max-width: 1000px) {
     .icindekiler {
         padding: 10px 30px;
         margin-bottom: 30px;
     }

     .icindekiler .title {
         padding-bottom: 0px;
     }

     .icindekiler ul {
         display: none;
     }

     .icindekiler .title::after {
         display: inline-block;
         float: right;

         content: "\f063";
         font-family: FontAwesome;
         font-weight: normal;
         font-style: normal;


     }

     .icindekiler ul li a {
         font-size: 14px;
     }

     .kapaliUL ul {
         display: none;
     }

     .acikUL ul {
         display: block;
     }

 }

 .blog-bg {
     background: var(--light);
 }

 .blog-bg article {
     color: var(--bg-color);
     background: #fff;
     padding: clamp(15px, 5%, 200px);
     border-radius: 10px;
     -webkit-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     -moz-box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
     box-shadow: 0px 36px 43px -36px rgba(36, 78, 122, 0.5);
 }

 .blog-bg article h1 {
     color: var(--bg-color);
     font-size: 36px !important;
     padding-bottom: 10px;
 }

 .blog-bg article h2 {
     color: var(--bg-color);
     font-weight: 700;
     font-size: 25px !important;
     padding-top: 35px;
     padding-bottom: 15px;
 }

 .blog-bg article h3 {
     padding-top: 10px;
     font-size: 18px;
     color: var(--bg-color);
 }

 .blog-bg article h3 a {
     color: #000;
 }

 .blog-bg article p a {
     color: var(--bg-color)
 }

 .blog-bg article p {
     color: var(--bg-color);
     font-size: 17px;
     line-height: 35px;
     padding-bottom: 10px;
 }

 .blog-bg article ul {
     margin: 0px;
     padding: 0px 20px;
 }

 .blog-bg article ul li {
     margin: 0px;
     padding: 0px;
     line-height: 35px;
     list-style: circle;
     font-size: 17px;
     color: var(--bg-color);
 }

 .blog-bg article ol {
     margin: 0px;
     padding: 0px 20px;
 }

 .blog-bg article ol li {
     margin: 0px;
     padding: 0px;
     line-height: 35px;
     list-style: decimal;
     font-size: 17px;
     color: var(--bg-color);
 }


 .blog-bg article img {
     margin: 15px 0px;
 }

 .mobile-footer {
     display: none !important;
 }

 .subeler .text h2 {
     font-size: 22px;
     color: var(--bg-color);
     padding: 15px 0px;
 }

 .subeler .text h3 {
     font-size: 18px;
     color: var(--dodge);
 }

 .subeler .text {
     border-left: 1px solid var(--bg-color);
     margin-left: 50px;
     padding: 30px 30px;
 }

 .subeler .text a {
     display: inline-block;
     padding: 8px 15px;
     border-radius: 5px;
     background: var(--dodge);
     color: #fff;
     margin: 10px 0px;
     width: 100%;
     text-align: center;
 }

 .subeler .text a:hover {
     background: var(--bg-color);
 }

 .subeler .img-kare {
     border-radius: 30px;
     -webkit-box-shadow: 0px 37px 86px -63px rgba(0, 0, 0, 0.49);
     -moz-box-shadow: 0px 37px 86px -63px rgba(0, 0, 0, 0.49);
     box-shadow: 0px 37px 86px -63px rgba(0, 0, 0, 0.49);
 }



 .full-kutu-totext>.tablo>div {
     padding: 50px 0px;
 }

 .full-kutu-totext>.tablo>div:first-child {
     background: #f2f2f2;
 }


 .scrollAnimate img {
     width: 100%;
 }

 .scrollAnimate h1 {
     font-weight: 900;
 }


 .heading .article-xs hr {
     width: 100px;
     border-bottom: 1px solid var(--dodge);
     height: 0px;
     margin: 0;
 }

 .heading .article-xs h1 {
     font-size: clamp(24px, 5vw, 65px)
 }

 .heading .article-xs h2 {
     font-size: clamp(24px, 5vw, 65px)
 }


 .bg-tema-tab {
     background: var(--bg-color);
 }

 .tab-tema .e-tab-butonlar {
     border: none;
     margin: 0px;
     padding: 0px;
 }

 .tab-tema .e-tab-butonlar a {
     border: none;
     background: #fff;
     border-radius: 0px;
     margin: 0px;
     color: var(--bg-color);
     font-size: 18px;
     padding: 15px 20px;
     display: inline-block;
     margin-right: -4px;
 }

 .tab-tema .e-tab-butonlar .aktif-tab:after {
     content: '';
     position: absolute;
     width: 100%;
     height: 1px;
     background: var(--dodge);
     bottom: 0px;
     left: 0px;
 }

 .tab-tema .e-tab-content {
     border: none;
     background: #fff;
     padding: 50px;
     margin: 0px;
 }

 .tab-tema .e-tab-content ul {
     margin: 0px;
     padding: 0px 20px;
 }

 .tab-tema .e-tab-content ul li {
     margin: 0px;
     padding: 0px;
     line-height: 35px;
     list-style: circle;
     font-size: 17px;
     color: var(--bg-color);
 }

 .font-tema-5 h1,
 .font-tema-5 h2,
 .font-tema-5 p {
     color: #fff;
 }

 .font-tema-5 h2 {
     font-size: 35px;
     font-weight: 300;
 }

 .font-tema-5 h2 strong {
     font-weight: 800;
     color: var(--dodge);
 }


 .font-tema-6 h1,
 .font-tema-6 h2,
 .font-tema-6 p {
     color: var(--bg-color);
 }

 .font-tema-6 h2 {
     font-size: 35px;
     font-weight: 300;
 }

 .font-tema-6 h2 strong {
     font-weight: 800;
     color: var(--dodge);
 }

 .font-tema-6 h4 {
     font-weight: 800;
     padding-top: 20px;
     font-size: 22px;
 }







 .grad-1>div {

     padding: 30px 0px;
     border-radius: 9px;
     overflow: hidden;
 }

 .grad-1>div:hover {
     background: #f5f5f5;
 }

 .grad-1>div:hover .p {
     color: #fff;
 }



 .liste-ikon-text {
     text-align: center;
 }

 .liste-ikon-text .h3 {
     font-size: 16px;
     font-family: var(--font-title);
     padding: 20px;
     font-weight: 600;
 }

 .liste-ikon-text .p {
     font-size: 12px;
 }

 .liste-ikon-text img {
     width: 80%;
     aspect-ratio: 1/1;

     object-fit: cover;
     border-radius: 5px;
     filter: grayscale(100%);


     box-shadow: 0px 20px 20px -10px rgba(0, 0, 0, 0.3);
 }

 .liste-ikon-text:hover img {
     filter: grayscale(0%);
 }

 .gray-galeri img {
     transition: 0.5s;
     filter: grayscale(100%);
 }

 .gray-galeri img:hover {
     filter: grayscale(1%);
 }







 .div-padding>div {
     padding: 50px;
 }




 #sliderTextFull {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
     background: radial-gradient(circle at center, #ffffff 0%, #f8f9fa 100%);
     display: flex;
     justify-content: center;
     align-items: center;
     color: #1a1a1a;
 }

 #sliderTextFull .bg-source img {
     position: absolute;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     z-index: 0;
     object-fit: cover;




 }

 #sliderTextFull .sft-wrap {
     position: relative;
     z-index: 10;
     width: 100%;
     max-width: 900px;
     padding: 40px;
     min-height: 450px;
     display: flex;
     justify-content: center;
     align-items: center;
 }



 #sliderTextFull .sft-slide {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     opacity: 0;
     visibility: hidden;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     padding: 0 20px;
     transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
         visibility 0.9s cubic-bezier(0.16, 1, 0.3, 1);
 }

 #sliderTextFull .sft-slide.active {
     opacity: 1;
     visibility: visible;
     z-index: 2;
 }

 /* Per-element stagger animation */
 #sliderTextFull .sft-slide>* {
     transform: translateY(40px);
     opacity: 0;
     filter: blur(10px);
     transition: all 0.9s cubic-bezier(0.16, 1, 0.3, 1);
 }

 #sliderTextFull .sft-slide.active>* {
     transform: translateY(0);
     opacity: 1;
     filter: blur(0);
 }

 #sliderTextFull .sft-slide.active p:nth-child(1) {
     transition-delay: 0.1s;
 }

 #sliderTextFull .sft-slide.active h1 {
     transition-delay: 0.2s;
 }

 #sliderTextFull .sft-slide.active p:last-child {
     transition-delay: 0.3s;
 }

 /* Typography */
 #sliderTextFull .sft-slide h1,
 #sliderTextFull .sft-slide h2 {
     font-size: clamp(2.5rem, 5vw, 5rem);
     margin: 1rem 0 1.5rem;
     font-weight: 800;

     letter-spacing: -0.03em;
     color: #1a1a1a;

     background: -webkit-linear-gradient(#ff8e2e, #ff552e);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;


 }

 #sliderTextFull .sft-slide p {
     font-size: clamp(1rem, 2vw, 1.25rem);
     line-height: 1.6;
     color: #666;
 }

 #sliderTextFull .sft-slide img {
     max-width: 120px;
     height: auto;

     filter: brightness(0) saturate(100%) invert(75%) sepia(69%) saturate(3522%) hue-rotate(337deg) brightness(102%) contrast(101%);
 }

 /* Nav dots */
 #sliderTextFull .sft-nav {
     position: absolute;
     bottom: 20px;
     left: 50%;
     transform: translateX(-50%);
     display: flex;
     gap: 12px;
     z-index: 10;
 }

 #sliderTextFull .sft-dot {
     width: 10px;
     height: 10px;
     border-radius: 20px;
     background: rgba(0, 0, 0, 0.1);
     cursor: pointer;
     transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }

 #sliderTextFull .sft-dot.active {
     width: 40px;
     background: #1a1a1a;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
 }

 @media (max-width: 600px) {
     #sliderTextFull .sft-wrap {
         min-height: 400px;
     }
 }



 .grid-tema-1>div {
     background: #fff;
     padding: 30px;

     border-radius: 50px;
     background: linear-gradient(145deg, #dadada, #ffffff);
     box-shadow: 20px 20px 60px #cecece,
         -20px -20px 60px #ffffff;

     text-align: center;
     position: relative;
     z-index: 0;
     padding: 50px 30px;

 }


 .grid-tema-1>div:hover {
     background: #fff;
 }

 .grid-tema-1>div h2 {

     color: var(--dodge-2);




     padding: 10px 0px;


 }

.bg-shadow { background: #fff; box-shadow: 0px 0px 30px -20px rgba(0,0,0,0.3); border-radius: 9px;}


.tab-wrap {
    font-family: inherit;
}
.tab-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 1.5rem;
}
.tab-btn {
    padding: 8px 18px;
    font-size: 18px;
    font-weight: 500;
    color: var(--menu-text-color);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: color .15s, border-color .15s;
    white-space: nowrap;
}
.tab-btn:hover {
    color: #111827;
}
.tab-btn.active {
    color: var(--dodge-4);
    border-bottom-color: var(--dodge-4)
}
.tab-panel {
    display: none;
}
.tab-panel.active {
    display: block;
}
/* Liste içerikleri için (ul li varsa) */
.tab-panel ul {
    columns: 3;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.tab-panel ul li {
    font-size: 16px;
    color: var(--menu-text-color);
    padding: 5px 0;
    border-bottom: 0.5px solid #f3f4f6;
    break-inside: avoid;
}
@media (max-width: 480px) {
    .tab-panel ul { columns: 1; }
    .tab-btn { padding: 7px 12px; font-size: 13px; }
}

 .text-banner-cover {
    position: relative;
    z-index: 0;
    overflow: hidden;
    height: 80vh;
    display: flex;
    align-items: center;
    align-content: center;
}

.text-banner-cover > div {
    width: 100%;
}

.text-banner-cover .text {
    position: relative;
    z-index: 10;
}

.text-banner-cover .cover {
    z-index: 0;
    height: 100%;
    right: 0;
    width: 100%;
    top: 0;
    position: absolute;
    object-fit: cover;
}

.text-banner-cover .cover img {
    position: absolute;
    height: 100%;
    width: 100%;
    object-fit: cover;
    right: 0;
    top: 0;
}

.text-banner-cover .main-text {
    width: 50%;
}

/* Tablet */
@media (max-width: 1024px) {
    .text-banner-cover .main-text {
        width: 70%;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .text-banner-cover {
        height: 60vh;
        align-items: flex-end;
        padding-bottom: 2rem;
    }

    .text-banner-cover .main-text {
        width: 100%;
    }
}

/* Küçük mobile */
@media (max-width: 480px) {
    .text-banner-cover {
        height: 50vh;
    }
}




 .grid-tema-1>div img {
     filter: brightness(0) saturate(100%) invert(92%) sepia(2%) saturate(5%) hue-rotate(360deg) brightness(91%) contrast(88%);
 }



 .grid-tema-1>div:first-child {
     background: #FD1D1D;
     background: linear-gradient(342deg, rgba(253, 29, 29, 1) 0%, rgba(252, 176, 69, 1) 60%);
     position: relative;
     z-index: 1;
 }

 .grid-tema-1>div:first-child h2 {
     color: #fff !important;
 }

 .grid-tema-1>div:first-child p {
     color: #fff;
 }


 .grid-tema-1>div:first-child img {
     filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%);
 }



 .site-font-xl h1 {
     font-size: clamp(2rem, 5vw, 3rem);
     color: var(--dodge-4);

 


 }

 .site-font-xl h2 {
     font-size: clamp(2rem, 5vw, 3rem);
       color: var(--dodge-4);




 }

 .site-font-xl h3 {
     font-size: clamp(2rem, 5vw, 2rem);
       color: var(--dodge-4);
 }

 .site-font-xl p {
     line-height: 2.5rem;
     font-weight: 300;
     padding: 6px 0px;
     font-size: clamp(0.7rem, 5vw, 1.3rem);
     color: var(--menu-text-color);
 }

  .site-font-xl ul { list-style: none; margin: 0px; padding: 20px 0px; }
  .site-font-xl ul li { display: inline-block; width: 100%;   padding: 15px 30px; margin-bottom:1px; font-weight: 600;


background: #fff ; box-shadow: -9px 20px 20px -10px rgba(0,0,0,0.1); border-radius: 9px;
 
 



}

.ozel-konum { transform: translateY(-200px);}

@media (max-width: 768px) {

.ozel-konum { transform: translateY(0px);}
}



.ac-content {
  
    overflow: hidden;
}
.ac-title h2 {

    padding: 20px 30px;
    color: var(--dodge-4);
 
}
.ac-icerik {
     border: 1px solid #ccc;
     margin-bottom: 15px;
     border-radius: 9px;
     overflow: hidden;
     background: #fff;
}
.ac-icerik h3 {
    margin: 0;
    padding: 0.875rem 1.25rem;
    font-size: 1.25rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background 0.15s;
 
}
.ac-icerik h3:hover,
.ac-icerik h3.active {
    background: #f9fafb;
}
.ac-icerik h3 .arrow {
    font-size: 12px;
    transition: transform 0.25s;
    color: #9ca3af;
}
.ac-icerik h3.active .arrow {
    transform: rotate(180deg);
}
.ac-body {
    display: none;
    overflow: hidden;
}
 
.ac-body p {
    margin: 0;
    padding: 0.75rem 1.25rem;
    color: #6b7280;
   
}

.ac-body p:first-child {
    border-top: 1px solid #e5e7eb;
}

.tl-wrap {
    padding: 2rem 0;
    position: relative;
}
.tl-line {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e5e7eb;
    transform: translateX(-50%);
}
.tl-item {
    display: grid;
    grid-template-columns: 1fr 2px 1fr;
    position: relative;
}
.tl-left {
    padding: 2rem 2.5rem 2rem 0;
    text-align: right;
    position: relative;
}
.tl-right {
    padding: 2rem 0 2rem 2.5rem;
    text-align: left;
    position: relative;
}
.tl-mid {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.tl-mid-line {
    width: 2px;
    background: #e5e7eb;
    flex: 1;
}
.tl-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #9ca3af;
    border: 2px solid #ffffff;
    flex-shrink: 0;
}
.tl-h-line-left {
    position: absolute;
    top: 50%;
    right: 0;
    height: 1px;
    width: 2.5rem;
    background: #e5e7eb;
    transform: translateY(-50%);
}
.tl-h-line-right {
    position: absolute;
    top: 50%;
    left: 0;
    height: 1px;
    width: 2.5rem;
    background: #e5e7eb;
    transform: translateY(-50%);
}
.tl-title {
    font-size: 25px;
    font-weight: 800;
    color: var(--dodge-2);
    margin: 0 0 6px;
}
.tl-text {
    font-size: 16px;
    color: var(--menu-text-color);
    line-height: 1.6;
    margin: 0 0 4px;
}

@media (max-width: 768px) {
    .tl-line {
        left: 16px;
        transform: none;
    }

    .tl-item {
        grid-template-columns: 32px 1fr;
        grid-template-rows: auto;
    }

    /* sol boş alan ve orta sütun birleşiyor */
    .tl-left {
        display: none;
    }

    .tl-mid {
        grid-column: 1;
        grid-row: 1;
    }

    .tl-right {
        grid-column: 2;
        grid-row: 1;
        padding: 1.5rem 0 1.5rem 1.5rem;
        text-align: left;
        visibility: visible !important;
    }

    /* sağ tarafta olan öğeler zaten doğru konumda */
    /* sol tarafta olan öğelerin içeriğini sağa taşı */
    .tl-item .tl-left .tl-title,
    .tl-item .tl-left .tl-text {
        display: none;
    }

    /* sol içeriği sağa kopyalamak yerine PHP'de her zaman tl-right içine yaz */
    .tl-h-line-left,
    .tl-h-line-right {
        display: none;
    }

    .tl-dot {
        margin-top: 1.75rem;
    }

    .tl-title {
        font-size: 18px;
    }

    .tl-text {
        font-size: 14px;
    }
}

.sss-tema  .img-tam { border-radius: 50px;   }



.tema-ab h1, 
.tema-ab h2, 
.tema-ab h3,  
.tema-ab p { color: #000; }



 .tema-ab p {  font-size: 16px; padding: 8px 0px; }

 .tema-ab .border-left {   padding: 8px 0px; border-left: 1px solid #ccc; padding-left: 20px; margin-top: 30px;}
 .tema-ab .border-left p { font-size: 13px !important; }



 

/* Macy'nin çalışması için kapsayıcıda grid/flex OLMAMALI */
#macy-container {
    width: 100%;
    display: block !important; /* Grid varsa iptal eder */
}

/* Sütunların genişliğini Macy belirleyecek, biz sadece içindekileri düzenleyelim */
.column {
    
}

.column img {
    width: 100%;
    height: auto;
    display: block;
}

 .urun-detay-7 .description { font-size: clamp(22px,5vw,55px); text-align: right; padding-bottom: 20px;}
 .urun-detay-7 h1 { font-size: clamp(22px,5vw,55px); text-align: right; padding-bottom: 20px;}


 .text-detay ul    { padding-right: 30px;}
 .text-detay ul li { border-bottom: 1px solid #f2f2f2; line-height: 35px; font-size:16px; color: #000; font-weight: 100; }

 .text-detay ul li strong { display: inline-block; font-weight: 400;  }




 .about-me-2 { position: relative ; z-index: 0;}

 .about-me-2 .me-text { position: absolute; left: 50%; top: 0;  transform: translateX(-80%);  }
 .about-me-2 .me-text p {  color: #fff;  }

.img-vh { width: 100%; height:100vh; position: relative; z-index: 0;}
.img-vh img { width: 100%; height:100vh; position:absolute; z-index: 0; object-fit: cover;}

.xl-text h1 { font-size: clamp(2.5rem,5vw,4rem) ; }
.xl-text h2 { font-size: clamp(2.5rem,5vw,4rem) ; }
.xl-text p  { font-size: clamp(14px,5vw,18px) ; }