/*
Theme Name: Masaüstü
Theme URI: http://multimediabilgisayar.com
Author: Multimedia Bilgisayar
Author URI: http://multimediabilgisayar.com
Version: Masaüstü
*/


html { overflow-x:hidden; scroll-behavior: smooth; }
body { margin:0; padding:0; background:#fff; font-family: 'Poppins', sans-serif;}



h1, h2, h3, h4, h5, ul, ol, img, a, p { margin:0; padding:0; list-style:none; text-decoration:none;border:none; outline:none; }
a { transition: all .2s linear; }
/*net fotolar*/

img {image-rendering: -webkit-optimize-contrast !important;max-width: none !important;}
.kapsar { width:100% !important;float:left;background:#fff;}

.scroll{position: absolute;margin-left: calc(57%);bottom: 33px;text-align: center;z-index:100; animation-name: bounce;animation-timing-function: linear;animation-duration:1s;animation-iteration-count: infinite;}
.scroll a{display:flex;flex-direction:column;font-size:30px;color:#1c1c1c;}
.scroll i:last-child{margin-top:5px;font-size:25px;}
@keyframes bounce {
        0%   { transform: translateY(0); }
        50%  { transform: translateY(-20px); }
        100% { transform: translateY(0); }
    }

/*scrool button*/
#myBtn {display: block; position: fixed; bottom: 1vw; right: 1.8vw; z-index: 100; font-size: 1.6vw; outline: none; background-color: #5e2d71; border: 0.1vw solid #170b1c; color: #ffffff; cursor: pointer; border-radius: 5vw; width: 4vw; height: 4vw; padding: 0;}
#myBtn:hover {background-color: #555;}
/* scrool buttton*/

.header { width: 100%;z-index: 2;color: #fff;}
.header .ortala {z-index:5;}
.header-icerik{display: flex; width: 100%; display: flex; justify-content: space-around; align-items: center;}
.header-sag{width: 100%;display: flex;flex-direction: column;}
.header-sag-ust{height: 3vw; display: flex; justify-content: space-around; z-index: 4; padding: 0.5vw; background: linear-gradient( 0deg, rgba(218,218,218,1) 0%, rgba(246,246,246,1) 19%, rgba(252,252,252,1) 32%, rgba(252,252,252,1) 50%, rgba(252,252,252,1) 65%, rgba(246,246,246,1) 73%, rgba(218,218,218,1) 100%); align-items: center;}
.header-sag-ust-sag{display: flex; position: relative; align-items: center; left: 8vw;margin-top: 0.6vw;}
.header-sag-ust-sol{display: flex;margin-top: 0.6vw;}
.header-sag-ust-sol h4:first-child{color:#000;font-size: 0.6vw;margin-right: 0.6vw;}
.header-sag-ust-sol h4:last-child{color: #000;font-size: 0.6vw;font-weight: 400;}
.header-sag-alt{display: flex;justify-content: space-around;height: 3vw;letter-spacing: 0.1vw;background: linear-gradient(0deg, rgba(227,186,100,1) 0%, rgba(212,161,53,1) 100%);}
.header-sag-ust-sag h4:first-child{color:#000;font-size:0.6vw;margin-right: 0.6vw;}
.header-sag-ust-sag h4:last-child{color:#000;font-size: 0.5vw;font-weight: 400;}
.header-sag-ust i{margin-right: 0.5vw; font-size: 0.9vw; color: #622e75;}
.header-sag-ust p{font-size: 0.6vw;color:#000;margin-right: 5vw;}

.anasayfa-alan-1 #myBtn{display:none !important;}
.menu-cizgi{background-repeat: no-repeat; background-size: contain; width: 0.1vw; margin-top: 1vw; height: 3vw;}
.diller a:first-child{margin-right:10px;}
.diller img{height:18px;}
.slid-text{-webkit-animation: mover 1s infinite  alternate;animation: mover 1s infinite  alternate;}
.vert-move {-webkit-animation: mover 1s infinite  alternate;animation: mover 1s infinite  alternate;}
@-webkit-keyframes mover {0% { transform: translateY(0); }100% { transform: translateY(-10px); }}
@keyframes mover {0% { transform: translateY(0); }100% { transform: translateY(-10px); }}}
/*.sosyal {display: flex;flex-direction: row;padding-top: 0.1vw;}
.sosyal a{display: flex;width: 2.1vw;height: 2.1vw;font-size: 0.7vw;padding-right: 0.6vw;float: left;color: #000;}
.sosyal a:last-child{margin-right:0;}
.sosyal a:hover{color:#cb1a2b}
.call-us{background:#cb1a2b !important;}
.call-us:hover{color:#273147 !important;}*/

#menu  {cursor: pointer;position: absolute;margin-left: 4.5vw;}
#menu > ul {padding:0px;}
#menu > ul > li{display: block;float: left;text-align: center;position: relative;font-size: 0.9vw;font-weight: 700;z-index: 20;transition: 0.6s all;margin-right: 4.5vw;}
#menu > ul > li:hover a {color:rgb(53 52 52);}
#menu > ul > li > a{display:block;color:#000;margin-top:0.9vw}
#menu > ul > li > a > img {width: 18.7vw;z-index: 9;margin-top: -4.9vw !important;}
#menu > ul > li > ul {display: block; width: 12vw; position: absolute; background-color: #3c3b3b; opacity: 0; visibility: hidden; transition-delay: 0.2s; z-index: 6; border-bottom-right-radius: 0.6vw; border-bottom-left-radius: 0.6vw; margin-top: 0.69vw; margin-left: -0.7vw; transition: all .3s linear;}
#menu > ul > li > ul >li{height: 1.8vw; text-align: left; font-size: 0.9vw; display: flex; margin: 0.6vw; align-items: center;}
#menu > ul > li > ul >li a{display:inline-block;color: #fff !important;letter-spacing: 0;}
#menu > ul > li > ul >li:hover>a{color:#d8a843 !important;}
#menu > ul > li > ul >li:hover>i{color:#d8a843 !important;visibility:visible;}
#menu > ul > li > img{margin-top:0.2vw!important;margin-right:-3.5vw !important;}
#menu > ul >li:hover>ul{opacity:1;visibility:visible;}

.menu-item-contect{margin-left: 1.5vw !important;}


.anasayfa-alan-1 {width:100%;height:36.6vw !important;position:relative;}
.fa-circle{color:#fff;visibility:hidden;margin-right:0.8vw; font-size: 0.7vw;}

.flexslider{position:absolute !important;z-index:0;margin-top: 4vw !important;}
.flexslider,.slides,.slides li {width:100%;margin-top: 0vw !important;}
.slides li{image-rendering: -webkit-optimize-contrast;background-size: contain;background-repeat: no-repeat;height: 36.8vw !important;}
.text-area{position: relative;display: flex;margin-top: 17.3vw;flex-direction: column;align-items: center;background-color: #000000a3;width: 65vw;height: 14.8vw;margin-left: 17.3vw;border-radius: 1vw;}
.text-area-ust{display: flex;flex-direction: column;}
.text-area-ust a:first-child {font-size: 2vw;color: #ffffff;font-weight: 600;text-align: center;margin-top: 2vw;}
.text-area-ust a:last-child{color: #fff;font-size: 2.4vw;font-weight: 700;letter-spacing: 0.1vw;text-align: center;}
.slider-button{font-size: 1.1vw;width: 10.2vw;height: 3.1vw;display: flex;align-items: center;justify-content: center;background: #7d3b96;color: #fff;margin-top: 1.2vw;text-transform: uppercase;border-radius: 0.2vw;font-weight: 700;letter-spacing: 0.07vw;}
.slider-button:hover {background-color: #e0b55b;}
.anasayfa-alan-2{width: 100%;z-index: 99;position:relative;}
.alt-menu {display: flex; height: 4.9vw; color: #fff; background: linear-gradient( 0deg, rgba(0,0,0,1) 0%, rgba(125,59,150,1) 100%); margin-top: -0.2vw; justify-content: space-evenly;}
.alt-menu-baslik{color: #fff; font-size: 0.6vw; margin: 1vw; margin-top: 1.7vw;}
.anasayfa-alan-3{display: flex; padding-top: 7vw; padding-bottom: 7vw; background-image: url(/wp-content/uploads/2021/12/alan2-sag.jpg); background-repeat: no-repeat; background-size: cover; height: 19.1vw; flex-direction: column; justify-content: center; align-items: center;}
.alan3-kapsar>h2{margin-left: 6vw; font-size: 2.6vw;}
.alan3-kapsar{display: flex; padding-top: 5vw; justify-content: space-around;}
.pbox>a{background-color: #e3ba64; padding: 0.8vw;padding-left: 3.1vw; padding-right: 3.1vw; margin-left: -2.2vw; width: 8.8vw; text-align: center; color: #333; font-size: 0.9vw; top: 2vw; font-weight: 600; position: relative;}

.pbox>a:hover{background-color: #c270df;color: #fff;}

.anasayfa-alan-3>iframe {border: 2px solid #e20a16;width:24vw;height:13vw;}
.anasayfa-alan-4{height: 8.3vw; background-size: cover; background-position: center; padding-top: 11vw;padding-bottom: 11vw; background-image: url(/wp-content/uploads/2021/12/alan-3.jpg); display: flex; flex-direction: row; width: 110vw; margin-left: -3vw; background-repeat: no-repeat; align-items: center; justify-content: center;}
.anasayfa-alan-4>img{width:36vw;margin-left: -3vw;}
.anasayfa-alan-4>div{display: flex; flex-direction: column; width: 29%; margin-top: -0.4vw; margin-left: 4vw;}
.anasayfa-alan-4 h3{font-size: 1.6vw; margin-bottom: 1.4vw;}
.anasayfa-alan-4 h4 p{margin-bottom: 1.1vw; font-size: 1.1vw;}
.anasayfa-alan-4 button{width: 10vw; height: 2.5vw; background-color: #fff; font-size: 1vw; font-weight: 600; color: #2f2f2f; margin-top: 1.9vw; border: 0.1vw solid #747373;transition:0.3s;}
.anasayfa-alan-4 button:hover{background-color: #e3bb66;color: #fff;transition:0.3s;}
.anasayfa-alan-5{text-shadow: #000 0px 1px 1px; background-color: #1a1b1f; transition: 0.2s; height: 12.3vw; padding-top: 1vw;}
.anasayfa-alan-5>h2{color: #fff; font-weight: 500; font-size: 1.5vw; text-align: center;}
.dalga-turleri>span{color:#fff;font-size:1vw;}
.dalga-kapsar{display:flex;justify-content:center;padding-top: 2.1vw;margin-left:3.2vw;}
.dalga-turleri{display: flex; flex-direction: column; justify-content: center; margin-right: 5vw; align-items: center;}
.dalga-turleri>img{width:10vw;}
.dalga-aciklama>span{color: #fff;font-size: 1.1vw;}
.anasayfa-alan-6{background-color:#541c6a;text-align: center;position:relative;z-index:9;}
.anasayfa-alan-6:hover{-webkit-transform: scale(1.05);transform: scale(1.05);transition: 0.3s;}
.anasayfa-alan-6>h3{color: #fff; font-weight: 500; padding: 0.5vw;font-size:1.2vw;}
.aciklama1{width: 50vw; font-size:1vw;border: 0.2vw solid #7d3b96; padding: 2vw; margin-bottom: 10vw;}
.kutu-kapsar{ display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
.anasayfa-alan-7{background-color: #e3ba64; padding: 1px; display: flex; text-align: center; height: 18vw; position: relative; z-index: 0; width: 100%; flex-direction: column; justify-content: center; align-items: center;}
.alan-7-kapsar{display: flex; align-items: center; margin-top: -4.3vw; margin-left: 7vw; padding-bottom: 2.2vw; justify-content: center;}
.alan-7-kapsar>div{margin-right: 10vw;display:flex;}
.alan-7-kapsar>a{margin-right: 10vw;display:flex;}
.alan-7-kapsar>a>div{display:flex;}
.alan-7-kapsar>div>i, .alan-7-kapsar>a>div>i{font-size: 4.8vw; color: #000; display: flex; margin-right: 1vw; align-items: center;}
.hizala>span{color: #fff;font-size: 1.1vw;text-align: justify;}
.hizala>.first-span {font-weight:600;}
.hizala{display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;}
.go-contact{width: 21.2vw; text-align: center; background-color: #252525; color: #fff; height: 5.5vw; line-height: 5.5vw; z-index: 12; font-size: 1.2vw; top: -5.5vw; font-weight: 600; position: relative;}
.js-flickity{}
.flickity-viewport {height:9.4vw !important}
.gallery-cell { width: 100vw;height: 20vw;margin-right: 2vw;counter-increment: gallery-cell;}

.baslik-arkaplan{background-image: url(/wp-content/uploads/2021/12/hakkimizda1.jpg); width: 100%; position: relative; top: -8vw; height: 21.3vw; background-size: cover; }

.urunbasligi1{top: 1vw; color: #efeded; z-index: 0; position: relative; font-family: cursive; margin-left: 12.1vw; font-size: 2.4vw;}
.urunbasligi{margin-left: 13vw; color: #79498d; margin-bottom: 4.2vw;font-size:2vw;}
.yazi-alani{margin-top: 8vw;display: flex;flex-wrap: wrap;justify-content: space-around;}
.yazi-alani h1{padding-bottom: 1vw;}
.yazi-alani h1 :before{content: "";position: absolute;width: 7vw;height: 0.2%;background: #e20a16;border-radius: 10px;margin-top: 3.2vw;}
.yazi-alani p {}
.yazi-alani-1{margin-bottom: 3vw; display: flex; width: 96%; background: #fff; padding: 2vw; margin-top: -8vw; padding-bottom: 4vw; margin-left: 9vw; margin-right: 6vw;}
.yazi-alani-1:hover{ }
.yazi-alani-1 p:last-child{margin-top: 0.4vw; width: 100%;}
.hbaslik{margin-left: 12vw; top: -8vw; font-size: 2vw; position: relative; color: #79498d;}
.habslik2{margin-top: -4.4vw; color: #efeded; z-index: 0; font-family: cursive; margin-left: 10.9vw; font-size: 2.4vw;}
.yazi-alani-1-yazilar{width: 50vw; font-size: 1.1vw; text-align: justify;}
.yazi-alani-1-yazilar>h1{color: #d49139;font-size: 1.9vw;}
.yazi-alani-1-yazilar{margin-top: 2vw;}
.kart-kapsar{position: relative; margin-left: 19vw; width: 40%;}

.koli-dalga{text-shadow: #000 0px 1px 1px; background-color: #1a1b1f; transition: 0.2s; height:34.2vw; margin-top: -13.6vw;}
.koli-dalga>h2{color: #fff; font-weight: 500; font-size: 1.5vw; text-align: center; padding-top: 1.4vw;}
.dalgaturleri>span{color:#fff;}
.dalga-kapsayici{display: flex; padding-top: 3.7vw;padding-left: 6vw; align-items: flex-start;}
.dalgaturleri>a{display: flex; flex-direction: column; justify-content: center; /* margin-right: 5vw; */ margin-bottom: 2.2vw; width: 10.5vw; align-items: center;}
.dalgaturleri {margin-right: 5vw;}
.dalgaturleri img{width:10vw;}
.dalgaturleri span{color:#fff;font-size:1.2vw;}
.dalga-kapsayici-2{display: flex; padding-top: 3.1vw;padding-left: 6vw; align-items: flex-start;flex-direction:column;color: #fff;font-size:1.2vw;}
.dalga-kapsayici .dalgaturleri:nth-child(6){margin-top:-1vw;}
.dalgaturleri.active{border-bottom: 1px solid #dfb255; width: 10.7vw; margin-top: auto; position: relative; border-bottom-width: 0.1vw; border-bottom-left-radius: 2vw; border-bottom-right-radius: 2vw;}
.active{visibility:visible !important;}

.tum-urunler{display: flex; flex-wrap: wrap; align-items: center; justify-content: center;margin-top:1vw;margin-left:4vw;margin-bottom:6vw;}
.kolibox{padding: 2.6vw; box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px; margin-right: 4vw; margin-bottom: 4vw; width: 14.2vw; display: flex; flex-direction: column; align-items: center; height: 13.1vw;transition:0.3s;}
.kolibox>img{height: 13vw; margin-top: -2vw; margin-bottom: 1.1vw;transition:0.3s;}
.kolibox>img:hover{-webkit-transform: scale(1.25);transform: scale(1.25);transition: 0.3s;}
.kolibox h2{width: 123%; background-color: #deb254; padding: 1vw; text-align: center;font-size:1.1vw;color:#000;}

.kolibox h2:hover:before{content:"Detaylı Bilgi Alın";transition:0.3s;}

.sayfa-icerik{margin-left: 2vw;}
.urunler-icerik{margin-top: 8vw;margin-bottom: 4vw;margin-left: 3vw;margin-right: 3vw;background-color: #f2f2f2;float:left;}
.iletisimh1{top: 1vw; color: #efeded; z-index: 0; position: relative; font-family: cursive; margin-left: 12.1vw; font-size: 2.4vw;}
.iletisimh2{margin-left: 13.7vw; font-size: 2vw; color: #79498d; z-index: 99; position: relative;}
.iletisim-arkaplan{background-image: url(/wp-content/uploads/2021/12/hakkimizda.jpg); width: 108%; position: relative; height: 19.9vw; background-size: contain;}

.iletisim-icerik{display: flex;justify-content: space-around;flex-direction: column;margin-left: 6vw;margin-right: 6vw;}
.iletisim-ust{background: #fff;display: flex;justify-content: space-evenly;align-items: center;}
.iletisim-ust > li {float:left;}
.iletisim h1 {font-size:1.6vw;color: #d18a32;}
.iletisim h1 i{margin-right:10px;margin-left:15px;font-size:1em;}
.iletisim-alt{background: #fff;margin-top: 1vw;margin-bottom: 8vw;}
.iletisim-alt-bilgiler{display: flex;justify-content: space-around;align-items: center;}
.iletisim-alt-bilgiler>i{color:}
.iletisim-bilgileri {width: 24%; display: flex; padding: 3vw; align-items: center; justify-content: space-around;}
.iletisim-bilgileri i {border-radius: 0.5vw;;font-size: 2vw;color: #fff;background-color:#daab48;padding: 1vw;width: 2vw;text-align: center;}

.bilgiler h5 {font-size: 1.2vw;color: #333;font-weight: 700;}
.bilgiler p {color: #333;font-weight: 300;font-size: 0.9vw;}
.detayli-bilgi{height: 1.2vw; width: 7vw; text-align: center; border: 0.1vw solid #7d3b96; padding: 1vw; font-size: 1vw; color: #fff; background-color: #7d3b96; line-height: 1.2vw;}

.image-boxx{margin-top: -9vw;margin-right: 7vw;}
      
    
/*contact form css*/
::placeholder{font-size:1vw !important;margin:0 !important;padding:0 !important}
.iletisim-formu{margin-bottom: 3vw;margin-top:3vw;}
.wpcf7 label {display: block;font-size: 1vw !important;margin-top: -0.5vw;}
.wpcf7 label input {height: 3.1vw;background-color: #fff;color: #000;border:0.1vw #f2f2f2 solid ;line-height: 1.4vw;width: 21.5vw;margin-top: 0.1vw;border-radius: 0.4vw;}
.phone input{background:#f6f6f6 !important;}
.wpcf7-textarea{margin-bottom: 1vw;;width: 21.6vw!important;height: 6vw !important;background-color: #f6f6f6;color: #000;border: 0;margin-top: 0.2vw;border-radius: 0.4vw;}

.wpcf7-submit {width: 7vw !important; height: 2.4vw !important; background-color: #3d3c3c !important; padding: 0 !important; border: 0 !important; color: #fff; border-radius: 0.5vw; transition: 0.3s; font-size: 1.1vw !important;}
.wpcf7-submit:hover{background-color:#1a1b1f !important;color: #d4943c;transition: 0.3s;}
.wpcf7-response-output {color:#111;border-color:rgba(0,0,0,0) !important;padding:0 !important;margin:0 !important;font-size: 0.85vw;}
.wpcf7-form input:focus, .wpcf7-form textarea:focus, .wpcf7-form select:focus {border:0 !important;background:#f6f6f6;}
input.wpcf7-form-control.wpcf7-captchar {margin-bottom: 1vw;}
img.wpcf7-form-control.wpcf7-captchac.wpcf7-captcha-captcha-170 {margin-bottom: 0.3vw;width: 5vw;height: 1.5vw;}

.footer{display: flex; z-index: 11; flex-direction: column; justify-content: center; align-items: center; position: relative;}
.footer-ust{background: #252525; width: 100%; padding-top: 2.1vw; height: 12.9vw; margin-top: -5.6vw; display: flex; justify-content: center;}
.footer-alt{background: #252525; height: 4.6vw; padding-bottom: 0.5vw; display: flex; flex-direction: column; margin-top: -1vw; justify-content: center; align-items: center; width: 100%;}

.footer-alt .ortala {display: flex;align-items: center;justify-content: space-between;height:100%;}
.footer-alt copyright {color: #ffffffc7;font-size: 0.7vw;font-weight: 100;margin-top: 0.8vw;display: inline;visibility: visible;font-family: Verdana, Arial, sans-serif;}
.f-cizgi1{width: 17.8vw; top: -14.1vw; z-index: 12; height: 0.2vw; background-color: #333; position: relative;}
.f-cizgi{background-color: #333333; width: 40%; height: 0.3vw;}
.f-cizgi2{background-color: #333333; width: 0.2vw; float: left; height: 72%; left: -5vw; position: relative;}
.menu-3{display: flex; flex-direction: column; }
.menu-2 {display: flex; flex-direction: column; margin-right: 9vw;}
.menu-1 {display: flex; flex-direction: column; margin-left: 7.9vw; margin-right: 9vw;}
.menu-1>a, .menu-2>a, .menu-3>a{color: #fff; font-weight: 500; font-size: 1.1vw;}
.menu-1>a{padding-bottom: 0.4vw;}




@-webkit-keyframes upscale {50% {transform: scale(1.5);}}
@keyframes upscale {50% {transform: scale(1.5);}}
.wobble span {display: inline-block;pointer-events: none;}
.wobble span.upscale {-webkit-animation: upscale 0.5s 1;animation: upscale 0.5s 1;}
.card__face>i{font-size: 9vw;margin-top: -2.55vw;}
.card__face--back>h4,.card__face--back1>h4{padding-top: 0.7vw; font-size: 1.4vw;}
.scene {display: inline-block; width: 44.2vw; height: 22vw; perspective: 600px; padding-top: 1vw; margin-left: -10vw;}
.card {position: relative; width: 61.5%; height: 64%; cursor: pointer; transform-style: preserve-3d; transform-origin: center right; transition: transform 1s;}
.card.is-flipped {transform: translateX(-100%) rotateY(-180deg);}
.card__face {position: absolute; color: white; text-align: center; font-size: 3.5vw; backface-visibility: hidden; width: 27.2vw; height: 11.5vw;}

.card__face--front1 {background: #dfb255;}
.card2{margin-top: -9.8vw;}
   
.card__face--back1 {background: #462b51;transform: rotateY(180deg);}
.card__face--front {background: #462b51;}
.card__face--back {background: #dcae4e;transform: rotateY(180deg);}

.fa-chart-line{font-size: 27vw;color: #fff;padding-top: 4vw;}
.fa-crosshairs{font-size:27vw;color: #fff;padding-top: 4.4vw;}
.about-card{font-size: 1.2vw; text-align: unset; width: 83.7% !important; margin-left: 7%;}

/* Anasayfa alan2 kutu css*/

:root { --depth-size: 200px; --height-size: 200px; --width-size: 200px; --rotate-deg-y: 45deg; --rotate-deg-z: -20deg; --rotate-open: 45deg; --tape-size: 18px; 
--color-text: #65331a; --color-brown-1: #ca915c; --color-brown-2: #a6704e; --color-brown-3: #9c6642; --color-brown-outer-flaps: #e7bb8a; --color-brown-inner-flaps: #dca270; --color-bg-1: #d4e4e4; --color-bg-2: #e5baa9; }
.container { flex: 1; display: flex; width: 17vw; justify-content: center; align-items: flex-end; padding-bottom: calc(var(--tape-size) * 2); z-index: 100; margin-right: 6vw; top: 1.9vw; position: relative; }
.box { perspective: 1000px; transition: 0.5s linear; filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.25)); }
span svg { color: var(--color-text); }
.base { width: var(--width-size); height: var(--depth-size); background: var(--color-brown-3); transform-style: preserve-3d; transform-origin: center center;
transform: rotateX(var(--rotate-deg-y)) rotateZ(var(--rotate-deg-z)); transition: transform 0.5s linear; position: relative; }
.base .back { width: var(--width-size); height: var(--height-size); background: var(--color-brown-2); transform-origin: top center;
transform: rotateX(90deg); position: absolute; transform-style: preserve-3d; }
.base .right { width: var(--height-size); height: var(--depth-size); background: var(--color-brown-1); 
transform-origin: right center; position: absolute; right: 0; transform: rotateY(90deg); transform-style: preserve-3d; }
.base .left { width: var(--height-size); height: var(--depth-size); background: var(--color-brown-1);
transform-origin: left center; position: absolute; left: 0; transform: rotateY(-90deg); transform-style: preserve-3d; }
.base .front { width: var(--width-size); height: var(--height-size); background: var(--color-brown-2); transform-origin: bottom center; bottom: 0; transform: rotateX(-90deg); position: absolute; transform-style: preserve-3d; } 
.outer-flap { width: var(--width-size); height: calc(var(--depth-size) / 2); background: var(--color-brown-outer-flaps); position: absolute; transform-origin: top center; transform-style: preserve-3d; top: 0; }
.outer-flap.blue { transform: translateZ(var(--height-size)) rotateX(var(--rotate-open)); }
.outer-flap.pink { transform: translateZ(var(--height-size)) translateY(var(--depth-size)) scaleY(-1) rotateX(var(--rotate-open)); }
.outer-flap:before, .left:before, .right:before, .back:before { content: ""; position: absolute; background: rgba(255, 255, 255, 0.4); }
.outer-flap:before, .back:before { width: var(--width-size); bottom: 0; transform: translateZ(1px); height: var(--tape-size); }
.left:before, .right:before { transform: translateY(calc(var(--tape-size) * -1)) translateZ(1px); width: calc(var(--height-size) / 2.5); min-width: 60px; height: calc(var(--tape-size) * 2); top: 50%; }
.left:before { right: 0; }
.right:before { left: 0; }
.back:before { content: "|| |||| || || |"; letter-spacing: -1px; width: 40px; margin: calc(var(--tape-size) * 0.6); background: rgba(255, 255, 255, 0.7); transform-origin: bottom left; transform: rotate(-8deg); font-size: 16px; line-height: 1; 
font-size: normal; display: flex; justify-content: center; align-items: center; color: #000; transform: translateZ(1px); }
.inner-flap { height: var(--depth-size); width: var(--height-size); max-width: 40%; position: absolute; background: var(--color-brown-inner-flaps); }
.inner-flap.green { transform: translateZ(calc(var(--height-size) - 1px)) rotateY(calc(var(--rotate-open) * -0.3)); transform-origin: right center; right: 0; }
.inner-flap.purple { transform: translateZ(calc(var(--height-size) - 1px)) rotateY(calc(var(--rotate-open) * 0.3)); transform-origin: left center; left: 0; } 
.front { display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap; }
.front .warnings { display: flex; flex-direction: row; margin: calc(var(--tape-size) * 0.5); transform: translateZ(1px); }
.front .warnings span { width: calc(var(--tape-size) * 1.8); height: calc(var(--tape-size) * 1.8); display: flex; justify-content: center; align-items: center; border: 2px solid var(--color-text); margin: calc(var(--tape-size) * 0.2); border-radius: 3px; } 
.front .warnings span svg { fill: currentColor; width: calc(var(--tape-size) * 1.25); height: calc(var(--tape-size) * 1.25); } 
.back span { display: flex; flex-direction: column; align-items: center; transform: translateZ(1px) scale(-1); position: absolute; fill: currentColor; color: var(--color-text); font-family: sans-serif; font-weight: bold; font-size: calc(var(--tape-size) * 0.5); top: 0; right: 0; margin: calc(var(--tape-size) * 0.8); text-transform: uppercase; }
.back span svg { width: calc(var(--tape-size) * 2); height: calc(var(--tape-size) * 2); margin-bottom: calc(var(--tape-size) * 0.25); }
.right, .left { display: flex; align-items: center; justify-content: flex-end; } 
.left span.upside { transform: rotate(90deg); left: 0; } span.upside { transform: translateZ(1px) rotate(-90deg); position: absolute; display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc(var(--depth-size) - calc(var(--tape-size) * 2)); padding: calc(var(--tape-size) * 1) 0; text-align: center; white-space: nowrap; color: var(--color-text); font-size: calc(var(--depth-size) * 0.11); font-family: sans-serif; font-weight: bold; line-height: 2.5; }
span.upside svg { fill: currentColor; width: calc(var(--tape-size) * 2); height: calc(var(--tape-size) * 2); } 
.settings { width: 39vw; display: flex; flex-direction: row; justify-content: space-around; align-items: center; padding: calc(var(--tape-size) * 2);} 
.settings sliders { display: flex; flex-direction: column; justify-content: center; align-items: center; } 
.settings .sliders .range-slider { display: flex; flex-direction: row; justify-content: center; align-items: center; }
.range-slider>input { appearance: none; height: 4px; background: #b4b4b4; outline: none; opacity: 0.7; transition: opacity 0.2s; border-radius: 4px; margin: calc(var(--tape-size) * 1.2) calc(var(--tape-size) * 1); }
.range-slider>input:hover {opacity: 1;}
input::-webkit-slider-thumb { appearance: none; width: calc(var(--tape-size) * 1); height: calc(var(--tape-size) * 1); background: var(--color-bg-2); cursor: pointer; border-radius: 100%; border: 4px solid #fff; } 
input::-moz-range-thumb { width: calc(var(--tape-size) * 1); height: calc(var(--tape-size) * 1); background: #04aa6d; cursor: pointer; border-radius: 100%; border: calc(var(--tape-size) * 1) solid #fff; }
.range-slider span { width: 24px; height: 24px; display: flex; justify-content: center; align-items: center; color: var(--color-text); position: relative; }
.range-slider span svg { position: absolute; color: var(--color-text); fill: var(--color-text); width: 100%; height: 100%; } 
.range-slider span#close { width: 20px; height: 20px; } 
.range-slider span#shrink, .range-slider span#grow { transform: scaleX(-1); }
.weight { --color-weight: rgba(255, 255, 255, 0.7); display: flex; flex-wrap: wrap; flex-direction: column; } 
.weight > span.icon { width: 60px; height: 60px; position: relative; align-items: flex-end; }
.weight > span.icon > svg { position: absolute; fill: var(--color-weight); width: 100%; height: 100%; }

/*Popup Box*/

.overlay { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0; } 
.overlay:target { visibility: visible; opacity: 1; } 
.popup { margin: 1.5vw auto; padding: 3vw; background: #fff; border-radius: 0.6vw; width: 47%; position: relative; transition: all 5s ease-in-out;  } 
.inpt{width: 15vw;height: 1.5vw;margin-bottom:0.5vw;}
.popup label{font-size: 1vw;}
.popup h2 {margin-top: 0; font-weight: 600; color: #333; padding-bottom: 1vw; font-size: 1vw; }
.popup .close { position: absolute; top: 20px; right: 30px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #333; } 
.siparis-btn{background-color: #591b71;color: #fff;width: 5.5vw;font-size: 0.8vw;padding: 0.4vw;}
.popup .close:hover { color: #532960; }
.popup .content { max-height: 60%; overflow: auto; }
#siparis{z-index: 9999;}

/* Hover */
.underline-closing:after, 
.underline-closing:before, 
.underline-left:after, .underline-opening:after, .underline-opening:before, 
.underline-right:after { position: absolute; z-index: -1 } .underline-closing:after { content: ""; width: 3px; height: 3px; bottom: 0; left: 0 }
.underline-closing:focus:after, .underline-closing:hover:after { width: 50%; height: 3px } 
.underline-closing:before { content: ""; width: 3px; height: 3px; bottom: 0; right: 0 }
.underline-closing:focus:before, .underline-closing:hover:before { width: 50%; height: 3px } 

.underline-closing {display: inline; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: color 0.5s ease } 
.underline-closing:focus, .underline-closing:hover { outline: 0; color: #441256; -webkit-transition: color 1s ease; -moz-transition: color 0.5s ease; -ms-transition: color 0.5s ease; -o-transition: color 0.5s ease; transition: color 0.5s ease; cursor: pointer }
.underline-closing:after, .underline-closing:before { -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s }
.underline-closing:focus:after, .underline-closing:focus:before, .underline-closing:hover:after, .underline-closing:hover:before { outline: 0; background-color: #441256; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s }

.shine:hover {-webkit-mask-image: linear-gradient(-75deg, rgba(0,0,0,.6) 30%, #000 50%, rgba(0,0,0,.6) 70%);-webkit-mask-size: 200%;
animation: shine 2s infinite;}@-webkit-keyframes shine {from {-webkit-mask-position: 150%;}to {-webkit-mask-position: -50%;}}

.text-mesaj textarea{width: 45vw!important;border: 0.1vw solid #dadada !important;}
.label-input input{height:2vw !important;border: 0.1vw solid #dadada !important;}
.label-input .wpcf7-not-valid-tip{margin-bottom: -1vw;font-size:0.8em;}
.label-select select{width: 21.6vw;border-radius: 0.3vw;height: 2.2vw;margin-right: 1.7vw;border: 0.1vw solid #dadada !important;}

.boxx-kapsar{display:flex;flex-direction:row;align-items:center;justify-content:center;}