html {
  zoom: 0.8;
}

body { margin: 0; padding: 0 0 0 0; font-family: 'RedHatDisplay-Regular'; font-size: 16px; background-color: #ffffff; color: #292929; }
* { box-sizing: border-box; }
.dspNone { display: none !important; }
.flex-row { flex-direction: row; display: flex; }
.flex-col { flex-direction: column; display: flex; }
.swiper-button-next, .swiper-button-prev { color: #242424 !important; }
#product-band.inner .swiper-button-next, #product-band.inner .swiper-button-prev { background-color: #ffffff; width: 32px; height: 32px; box-shadow: 0 0 10px #d4d4d4; border-radius: 50%; }
#product-band.inner .swiper-button-next:after, #product-band.inner .swiper-button-prev:after { color: #D41116; font-size: 20px; }
#product-band.inner .swiper-button-next { margin-right: 5%; }
#product-band.inner .swiper-button-prev { margin-left: 5%; }
/* symbols */
.elipses { position: absolute; left: 0; }

.container { display: flex; flex-direction: row; align-items: center; width: 1700px; }
.container.column { flex-direction: column; align-items: unset; }
section { padding: 50px; display: flex; align-items: center; flex-direction: column;}
section.gray { background-color: #F7F7F7; }
section.nopadding { padding: 0; }

.main-menu-container { display: none; flex-direction: column; align-items: center; }
.main-menu-container.show { display: flex; }
.main-menu-container .container.menu { z-index: 100; position: absolute; }
.main-menu-container .container.menu .mainmenu { box-shadow: 0 0 10px #d4d4d4; top: 0; right: 0; width: 1524px; padding: 60px 100px 100px 100px; position: absolute; background-color: #faf6ea; border-bottom-left-radius: 140px; border-bottom-right-radius: 25px; background-image: url('../img/bgmenu.png'); background-size: 800px auto; background-repeat: no-repeat; background-position: bottom right; }
.main-menu-container .container.menu .mainmenu .menu-container { width: 70%; display: flex; flex-direction: row; flex-wrap: wrap; }
.main-menu-container .container.menu .mainmenu .menu-container a:link, 
    .main-menu-container .container.menu .mainmenu .menu-container a:visited { color: #292929; text-decoration: none; display: flex; width: 33.3%; white-space: nowrap; font-size: 20px; font-weight: 700; padding: 12px 0; text-transform: none !important; font-family: 'RedHatDisplay-Bold'; }
.main-menu-container .container.menu .mainmenu .menu-container a:hover { color: #D41116; }

#topredbar { display: flex; background-color: #D41116; min-height: 58px; align-items: center; color: #ffffff; justify-content: center; }
#topredbar .container { justify-content: flex-end; gap: 30px; }
#topredbar a:link, #topredbar a:visited { font-family: 'RedHatDisplay-Regular'; font-size: 18px; color: #ffffff; text-decoration: none; font-weight: 500; }
#topredbar a:hover { font-weight: bold; }
#topredbar .searchbox { position: relative; transition: .5s all; background-color: #d98181; display: flex; width: 32px; height: 32px; border-radius: 20px; border: #e8e8e8 1px solid; align-items: center; }
#topredbar .searchbox.open { padding: 0 5px 0 15px; width: 214.5px; }
#topredbar .searchbox input { display: none; outline: none; border: transparent 0px solid; background-color: transparent; color: #ffffff; font-family: 'RedHatDisplay-Regular'; font-size: 16px; }
#topredbar .searchbox.open input { display: flex; width: 162px; }
#topredbar .searchbox i { font-size: 20px; cursor: pointer; position: absolute; right: 5px; top: 5px; }

#topbar {
    display: flex;
    height: 88px;
    background-color: #ffffff;
    justify-content: center;
    box-shadow: 0 0 10px #d4d4d4;
    position: relative;
    z-index: 150;
}
#topbar .container .logo { height: 106px; margin-bottom: -20px; margin-right: 100px; }
#topbar .container nav { display: flex; flex: 1; gap: 70px; height: 90px; align-items: center; }
#topbar .container nav a:link, #topbar .container nav a:visited, #topbar .container nav label { cursor: pointer; text-decoration: none; text-transform: uppercase; color: #292929; font-size: 18px; font-weight: 700; font-family: 'RedHatDisplay-Bold'; }
#topbar .container nav label { display: flex; position: relative; height: 90px; align-items: center; }
#topbar .container nav label i { margin-left: 5px; }
#topbar .container nav a:hover, #topbar .container nav label:hover { color: #D41116; }
#topbar .container .social { display: flex; flex-direction: row; align-items: center; gap: 25px; }
#topbar .container .social img { width: 30px; }

#banner {
    display: block;
    height: calc(100vh - 58px);
    position: relative;
    width: 100%;
    margin-top: -20px;
    overflow: hidden;
}

#banner .swiper {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#banner .swiper-wrapper {
    width: 100%;
    height: 100%;
}

#banner .swiper-slide {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#banner img.bg-image-original {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#banner .swiper-button-next,
#banner .swiper-button-prev {
    color: #ffffff;
    background: rgba(0, 0, 0, 0.3);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    transition: all 0.3s ease;
}

#banner .swiper-button-next:after,
#banner .swiper-button-prev:after {
    font-size: 24px;
}

#banner .swiper-button-next:hover,
#banner .swiper-button-prev:hover {
    background: rgba(0, 0, 0, 0.5);
}

#banner .swiper-pagination {
    bottom: 30px !important;
    z-index: 10;
}

#banner .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: #ffffff;
    opacity: 0.5;
    margin: 0 8px !important;
}

#banner .swiper-pagination-bullet-active {
    opacity: 1;
    background: #D41116;
    transform: scale(1.2);
}

#product-band { 
    background-image: url('../img/bg01.jpg'); 
    display: flex; 
    padding: 75px; 
    flex-direction: column;
    width: 100%;
    overflow: hidden;
}

#product-band .product-grid {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 15px;
    width: 100%;
    padding-bottom: 20px;
    justify-content: center;
    align-items: start;
}

#product-band .product-box {
    flex: none;
    width: 100%;
    min-width: unset;
}

#product-band .product-box .image { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    position: relative; 
    height: 100px; 
    margin-top: 10px;
    width: 100%;
    overflow: visible; 
    z-index: 2;
    flex: 1;
}

#product-band .product-box .image img { 
    width: 70%; 
    height: auto;
    max-height: 120px;
    object-fit: contain;
    transition: all .5s; 
    z-index: 3;
}

#product-band .product-box .image:hover img { 
    width: 100%; 
    max-height: 170px;
}

#product-band .product-box label { 
    cursor: pointer; 
    padding: 0 8px 20px 8px; 
    text-align: center; 
    font-size: 18px; 
    font-family: 'RedHatDisplay-Bold'; 
    margin-top: auto;
    display: flex;
    flex-direction: column;
}

#product-band.inner { align-items: center; position: relative; background: unset; padding: 75px 0 50px 0; }
#product-band.inner .product-box { background-color: unset; box-shadow: unset; }
#product-band.inner .container { overflow: hidden; flex-direction: column; align-items: flex-start; }
#product-band.inner img.background { position: absolute; left: 0; right: 0; opacity: .25; height: 250px; width: 100%; bottom: 0; }
#product-band.inner h2 { font-family: 'RedHatDisplay-Bold'; font-size: 35px; margin: 0; }

.button-set { padding-top: 0px; display: flex; align-items: center; justify-content: center; }
.button-set.right { justify-content: flex-end; }
.button-set button { cursor: pointer; border: #D41116 1px solid; border-radius: 10px; position: relative; padding: 15px 25px; background-color: #ffffff; }
.button-set button label { cursor: pointer; font-size: 25px; position: relative; color: #292929; display: flex; gap: 10px; align-items: center; }
.button-set button .shadow { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background-color: #D41116; transition: .25s all; }
.button-set button:hover .shadow { width: 100%; }
.button-set button:hover label { color: #ffffff; }

.button-set button.red { border: #ffffff 1px solid; background-color: #D41116; }
.button-set button.red label { color: #ffffff; }
.button-set button.red .shadow { background-color: #ffffff; transition: .25s all; }
.button-set button.red:hover label { color: #D41116;  border-radius: 10px;}

/* SWIPER */
.swiper { width: 100%; height: 260px; margin: 20px auto; overflow: unset !important; }
.swiper-slide { display: flex; height: 520px; padding: 10px 0; overflow: unset; }
.swiper-slide .box { position: relative; padding: 20px; box-shadow: 0 0 10px #e9e9e9; background-color: #ffffff; flex: 1; display: flex; flex-direction: column; height: 98%; border-radius: 15px; margin: 10px; transition: all .5s; }
.swiper-slide .box.flash { background: #DCEBF4; background: linear-gradient(160deg,rgba(220, 235, 244, 1) 0%, rgba(236, 242, 247, 1) 50%, rgba(248, 250, 249, 1) 100%); }
.swiper-slide .box:hover { height: 98%; box-shadow: 0 0 10px #cccccc; }
.swiper-slide .box h3 { font-family: 'ProductSans-Regular'; font-size: 30px; line-height: 40px; color: #292929; margin: 0 0 5px 0; letter-spacing: -.5px; padding: 25px 25px 0 25px; }
.swiper-slide .box label { font-family: 'ProductSans-Regular'; font-size: 18px; line-height: 22px; padding: 0 25px; background-image: linear-gradient(108deg, #006bb9 0, #903fcf 32%, #cf0f3c 84%, #b84100 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.swiper-slide .box span { padding: 15px 25px; font-size: 14px; line-height: 20px; color: #686868; }
.product-box { display: flex; flex-direction: column; background-color: #ffffff; box-shadow: 0 0 5px #d4d4d4; border-radius: 8px; height: 170px; }
.product-box .image { display: flex; align-items: flex-end; justify-content: center; position: relative; height: 180px; }
.product-box .image img { width: 60%; position: absolute; bottom: 0; transition: all .5s; }
.product-box .image:hover img { width: 90%; }
.product-box label { cursor: pointer; padding: 0 20px 15px 20px; text-align: center; font-size: 20px; font-family: 'RedHatDisplay-Bold'; }

.card-container { display: flex; flex-direction: row; align-items: flex-start; gap: 25px; }
.card { overflow: hidden; height: 454px; flex: 1; background-repeat: no-repeat; background-position: -255px 0; background-size: cover; display: flex; justify-content: flex-end; position: relative; border-radius: 10px; box-shadow: 0 0 10px #d4d4d4; }
.card .bg-img { position: absolute; right: 0px; top: 0; bottom: 0; }
.card .inner { width: 320px; position: relative; display: flex; justify-content: flex-end; flex-direction: column; }
.card .inner h3 { margin: 0; font-size: 32px; text-align: center; color: #292929; font-family: 'Livvic-SemiBold'; padding: 0 20px; line-height: 100%; }
.card .inner p { font-family: 'Livvic-Regular'; font-size: 18px; color: #292929; line-height: 100%; padding-right: 20px; }
.card .inner p.fronttext { font-family: 'Livvic-SemiBold'; font-size: 20px; }
.card .inner a.btn:link, .card .inner a.btn:visited { font-family: 'Livvic-Bold'; font-size: 18px; font-weight:bold; color: #D41116; display: flex; align-items: center; justify-content: flex-end; text-decoration: none; padding: 0 20px 30px 0; }

section h2 { background: linear-gradient(180deg, #D41116 0%, rgba(212, 17, 22, 0) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-family: 'RedHatDisplay-Bold'; font-size: 50px; font-weight: 700; margin-bottom: 0; }

#surdurulebilirlik { display: flex; flex-direction: row; align-items: unset; }
#surdurulebilirlik .leftcol { display: flex; flex-direction: column; flex: 2; background-color: #D41116; padding: 75px 75px 75px 10%; }
#surdurulebilirlik .leftcol .text { display: flex; flex-direction: row; position: relative; margin-bottom: 30px; }
#surdurulebilirlik .leftcol .text .arrow { position: absolute; left: 0; top: 0; bottom: 0; }
#surdurulebilirlik .leftcol .text div { padding-left: 45px; }
#surdurulebilirlik .leftcol .text div h4 { margin: 15px 0 0 0; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-family: 'RedHatDisplay-Bold'; font-size: 35px; line-height: 100%; font-weight: 700; }
#surdurulebilirlik .leftcol .text div h3 { color: #FFFFFF; font-family: 'RedHatDisplay-Bold'; font-size: 50px; line-height: 100%; font-weight: 700; margin: 10px 0 30px 0; line-height: 120%; }
#surdurulebilirlik .leftcol p { font-family: 'RedHatDisplay-SemiBold'; color: #ffffff; font-size: 20px; line-height: 120%; font-weight: 600; margin-bottom: 50px; }
#surdurulebilirlik .rightcol { display: flex; flex-direction: row; flex-wrap: wrap; flex: 5; align-items: flex-start; background-position: right bottom; background-repeat: no-repeat; background-image: url('../img/bg03.png'); background-size: 550px; padding: 75px 10% 75px 125px; }
#surdurulebilirlik .rightcol .col { display: flex; flex-direction: column; align-items: flex-start; width: 50%; padding-right: 20%; }
#surdurulebilirlik .rightcol .col label { font-family: 'RedHatDisplay-Bold'; font-size: 35px; padding-top: 10px;  }
#surdurulebilirlik .rightcol .col p { font-family: 'RedHatDisplay-Regular'; font-size: 20px; font-weight: 600; line-height: 150%; padding-top: 10px; margin: 0; }

.dummy-tab { position: relative; display: flex; flex-direction: row; margin-top: 5px; }
.dummy-tab .tab { cursor: pointer; display: flex; flex: 1; flex-direction: column; align-items: center; padding: 25px; box-shadow: 0 -4px 4px #d4d4d4; background-color: #f7f7f7; }
.dummy-tab .tab:last-child { border-top-right-radius: 12px; border-right: #e8e8e8 2px solid; }
.dummy-tab .tab:first-child { border-top-left-radius: 12px; }
.dummy-tab .tab.selected { cursor: default; background-color: #ffffff; margin-bottom: -2px; border-left: #D41116 2px solid; border-bottom: transparent 2px solid; border-top: #D41116 2px solid; border-right: #D41116 2px solid; border-top-left-radius: 12px; border-top-right-radius: 114px; }
.dummy-tab .tab.next { border-left: #e8e8e8 2px solid; border-top-left-radius: 140px; }
.dummy-tab .tab.previous { border-top-right-radius: 30px; }
.dummy-tab .tab label { cursor: pointer; color: #292929; font-size: 25px; font-family: 'RedHatDisplay-Bold'; margin-bottom: 5px; }
.dummy-tab .tab.selected label { cursor: default; }
.dummy-tab .tab span { color: #292929; font-size: 18px; text-align: center; max-width: 130px; }
.dummy-tab .tab.selected label { color: #D41116; }

.dummy-tab-content { border: #D41116 2px solid; padding: 35px; background-color: #ffffff; display: flex; flex-direction: row; }
.dummy-tab-content .image { width: 530px; }
.dummy-tab-content .image img { width: 100%; border-radius: 10px; }
.dummy-tab-content .title { padding: 50px; flex-direction: column; display: flex; }
.dummy-tab-content .title label { color: #D41116; font-family: 'RedHatDisplay-Bold'; font-size: 35px; text-transform: uppercase; font-weight: 700; }
.dummy-tab-content .title span { color: #292929; font-family: 'RedHatDisplay-SemiBold'; font-size: 20px; }
.dummy-tab-content .content { display: flex; flex-direction: column; flex: 1; }
.dummy-tab-content .content p { color: #292929; font-family: 'RedHatDisplay-Regular'; font-size: 20px; line-height: 130%; font-weight: 700; }

#message-band { background-position: center; position: relative; background-repeat: no-repeat; background-size: cover; background-image: url('../img/bg06.png'); }
#message-band .shadow { position: absolute; left: 0; right: 0; bottom: 0; top: 0; background-color: #000000; opacity: .6;}
#message-band .container { padding: 0 20%; position: relative; }
#message-band p { font-family: 'RedHatDisplay-Regular'; color: #ffffff; font-weight: 500; font-size: 35px; line-height: 130%; letter-spacing: 0%; text-align: center; }

.footer { display: flex; flex-direction: column; background-color: #D41116; }
.footer .footer-logo { text-align: center; margin-top: -25px; position: relative; }
.footer .footer-logo img { height: 106px; }
.footer .social { display: flex; flex-direction: row; gap: 20px; align-items: center; justify-content: center; margin: 10px 0 20px 0; }
.footer .social img { width: 24px; }
.footer .links { display: flex; flex-direction: row; justify-content: center; }
.footer .links a:link, .footer .links a:visited { text-decoration: none; font-family: 'Livvic-Regular'; font-size: 20px; color: #ffffff; padding: 0 20px; }
.footer .links a:hover { font-weight:bold; }
.footer .links a:last-child { border-right: unset; }
.footer .container { align-self: center; padding: 20px 0; justify-content: space-between; font-family: 'Livvic-Regular'; font-size: 20px; color: #ffffff; padding: 25px;}
.footer .container a:link, .footer .container a:visited { text-decoration: underline; color: #ffffff; }
.footer .container a:hover { color: #ffcc00; }

/* categories */
#inner-banner { display: flex; flex-direction: column;  height: 380px; width: 100%; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; align-items: center; justify-content: center; }
#inner-banner h1 { margin: 0; font-family: 'Livvic-SemiBold'; font-size: 50px; line-height: 100%; position: relative; color: #ffffff; text-align: center; width: 100%; }
#inner-banner h4 { font-family: 'RedHatDisplay-Bold'; font-size: 20px; line-height: 100%; position: relative; color: #ffffff; text-align: center; width: 100%; margin: 0; text-transform: uppercase; }
#inner-banner span { display: flex; background-color: #cc0001; width: 70px; height: 3px; position: relative; margin-top: 5px; margin-bottom: 10px; }
#inner-banner .shadow { position: absolute; left: 0; right: 0; bottom: 0; top: 0; background-color: #000000; opacity: .7; }

.inner-nav-container { background-color: #F7F7F7; z-index: 160; display: flex; position: relative; align-items: center; justify-content: center; }
.inner-nav-container .container { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; padding: 30px; gap: 40px; background-color: #FBF6E9; box-shadow: 0 0 10px #d4d4d4; margin-top: -42px; }
.inner-nav-container .container a:link, a:visited { line-height: 26px; text-decoration: none; color: #292929; font-family: 'RedHatDisplay-Regular'; font-size: 20px; opacity: .5; }
.inner-nav-container .container a:hover { color: #D41116; }
.inner-nav-container .container a.active { font-family: 'RedHatDisplay-Bold'; border-bottom: #D41116 2px solid; color: #D41116; opacity: 1; }

.container.playground { display: flex; flex-direction: column; align-items: unset; }
.container.playground .header h3 { color: #D41116; font-family: 'RedHatDisplay-Bold'; font-size: 40px; margin: 0px; }
.container.playground .header p { width: 400px; margin: 10px 0 30px 0; }
.container.playground .content { display: flex; flex-direction: row; padding-bottom: 80px; align-items: flex-start; }
.container.playground .content .left-col { display: flex; flex-direction: column; flex: 1; }
.container.playground .content .left-col a:link, .container.playground .content .left-col a:visited { color: #D41116; font-family: 'RedHatDisplay-Regular'; font-size: 20px; text-decoration: none; margin-bottom: 20px; }
.container.playground .content .left-col a:hover { color: #292929; }
.container.playground .content .left-col a:hover::before { background-color: #292929; }
.container.playground .content .left-col a::before { content: ""; display: inline-block; width: 45px; height: 2px; background-color: #D41116; margin-right: 12px; vertical-align: middle; }
.container.playground .content .main-col { display: flex; flex-direction: row; width: 1200px; flex-wrap: wrap; }
.container.playground .content .main-col.full { width: unset; flex: 1; padding: 0 0 0 75px; }
.container.playground .content .main-col.full h2 { background: unset; font-family: 'RedHatDisplay-Bold'; font-weight: 700; font-size: 35px; margin: 15px 0; color: #292929; -webkit-text-fill-color: unset; }
.container.playground .content .main-col.full p { margin: 0 0 20px 0; font-size: 20px; line-height: 30px; }
.container.playground .content .main-col .box { padding: 15px; }
.container.playground .content .main-col .box .item { border-radius: 6px; width: 350px; height: 350px; background-color: #FFFAED; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px; box-shadow: 0 0 10px #d4d4d4; position: relative; }
.container.playground .content .main-col .box .item .image { flex: 1; position: relative; display: flex; width: 100%; align-items: center; justify-content: center; }
.container.playground .content .main-col .box .item .image img { height: 265px; transition: all .5s; position: absolute; bottom: 0; }
.container.playground .content .main-col .box .item:hover img { height: 310px;}
.container.playground .content .main-col .box .item:hover i { right: 20px;}
.container.playground .content .main-col .box .item label { color: #292929; font-family: 'Livvic-SemiBold'; font-size: 25px; padding: 10px 40px; text-align: center; }
.container.playground .content .main-col .box .item i { color: #D41116; position: absolute; right: 30px; bottom: 20px; transition: all .5s; }
.container.playground .content .nav-col { width: 310px; background-color: #FFFAED; border-radius: 15px; box-shadow: 0 0 10px #d4d4d4; padding: 20px 30px; flex-direction: column; display: flex; }
.container.playground .content .nav-col a:link, 
    .container.playground .content .nav-col a:visited { font-family: 'RedHatDisplay-SemiBold'; font-weight: 700; text-decoration: none; color: #29292980; font-size: 20px; padding: 20px 0; border-bottom: #29292940 1px solid; line-height: 30px; }
.container.playground .content .nav-col a:hover, .container.playground .content .nav-col a.active { color: #D41116; }
.container.playground .content .nav-col a:last-child { border-bottom: none; }

.product-detail-container { display: flex; flex-direction: row; position: relative; padding: 50px 0 !important; align-items: flex-start; justify-content: center; background-repeat: no-repeat; background-position: 0 48px; }
.product-detail-container .left-col { flex: 2; align-items: center; display: flex; min-height: 650px; }
.product-detail-container .left-col.no-min-height { min-height: unset; }
.product-detail-container .left-col img.product-image {  }
.product-detail-container .main-col { display: flex; flex-direction: column; flex: 3; }
.product-detail-container .main-col .content { display: flex; flex-direction: column; width: 700px; }
.product-detail-container .main-col .content h5 { font-family: 'Livvic-SemiBold'; font-size: 50px; color: #D41116; margin: 50px  0 0 0; }
.product-detail-container .main-col .product-detail { margin-top: -150px; border: #D41116 1px solid; border-radius: 6px; padding: 25px; max-width: 80%; background-image: url('../img/bg07.png'); }
.product-detail-container .main-col .product-detail h3 { position: relative; font-family: 'RedHatDisplay-SemiBold'; font-size: 20; padding-left: 35px; }
.product-detail-container .main-col .product-detail h3::before { content: ""; display: inline-block; width: 45px; height: 2px; background-color: #D41116; position: absolute; top: 24px; left: 4px; }
.product-detail-container .main-col .product-detail ul { margin-bottom: 25px; }
.product-detail-container .main-col .product-detail li { padding-left: 50px; }

.property-container { display: flex; flex-direction: row; flex-wrap: wrap; margin: 30px 0; }
.property-container .property { display: flex; flex-direction: row; width: 50%; padding: 10px; align-items: center; }
.property-container .property img { width: 85px; margin-right: 15px; }

section.product-desc { position: relative; background-image: url('../img/banner/product-background.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 75px 0; }
section.product-desc h2 { margin: 0 0 10px 0; background: transparent; color: #ffffff; -webkit-text-fill-color: unset; display: block; font-size: 35px; }
section.product-desc p { font-size: 20px; color: #ffffff; margin: 0; text-align: center; line-height: 30px; }
section.product-desc .shadow { background-color: #000000; opacity: .6; position: absolute; right: 0; top: 0; left: 0; bottom: 0; }
section.product-desc .container { position: relative; flex-direction: column; padding: 0 15%; }

/* basin */
.container.playground .content.basin { flex-wrap: wrap; }
.basin-box-container { display: flex; padding: 20px; width: 33%; height: 420px; }
.basin-box-container .basin-box { background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden; background-color: #e8e8e8; border-radius: 15px; box-shadow: 0 5px 10px rgba(0,0,0,0.2); display: flex; flex-direction: column; justify-content: flex-end; }
.basin-box-container .basin-box .links { position: relative; display: flex; flex-direction: column; padding: 30px 40px; background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); }
.basin-box-container .basin-box .links a:link, .basin-box-container .basin-box .links a:hover { font-family: 'RedHatDisplay-SemiBold'; font-size: 25px; text-decoration: none; color: #292929; margin: 20px 0 10px 0; }
.basin-box-container .basin-box .links a:hover { text-decoration: underline; }
.basin-box-container .basin-box .links span { font-size: 18px; color: #707070; }
.basin-box-container .basin-box .links i { color: #D41116; position: absolute; right: 30px; bottom: 20px; transition: all .5s; }
.basin-box-container .basin-box .links:hover i { right: 20px; }

/* Responsive Tasarım */
@media screen and (max-width: 1800px) {
    .container {
        width: 100%;
        padding: 0 50px;
    }

    #banner {
        height: calc(100vh - 58px);
    }

    #product-band .product-box {
        min-width: unset;
    }
}

@media screen and (max-width: 1500px) {
  
  .main-menu-container .container.menu .mainmenu {
    width: 1300px!important;
  }

  .container.playground .content .main-col {
    width: 1100px;
  }
  #banner {
    height: calc(100vh - 258px);
  }
}

@media screen and (max-width: 1229px) {
    .container {
        padding: 0 30px;
    }

    .main-menu-container .container.menu .mainmenu {
      width: 1100px;
    }

    

    section h2 {
        font-size: 42px;
    }

    .card-container {
        flex-wrap: wrap;
        gap: 20px;
    }

    .card {
        flex: 0 0 calc(50% - 10px);
    }

    #surdurulebilirlik {
        flex-direction: column;
    }

    #surdurulebilirlik .leftcol {
        padding: 50px 30px;
    }

    #surdurulebilirlik .rightcol {
        padding: 50px 30px;
    }

    #surdurulebilirlik .rightcol .col {
        width: 100%;
        padding-right: 0;
        margin-bottom: 30px;
    }

    #product-band .product-grid {
        grid-template-columns: repeat(10, 1fr);
    }
    
    #product-band .product-box {
        flex: none;
        width: 100%;
        min-width: unset;
    }
    
    #product-band .product-box .image {
        height: 120px;
    }
    
    #product-band .product-box .image img {
        max-height: 120px;
    }
    
    #product-band .product-box .image:hover img {
        max-height: 150px;
    }
    
    #product-band .product-box label {
        font-size: 14px;
        padding: 6px 8px;
    }
}

@media screen and (max-width: 1024px) {
    body {
        font-size: 14px;
    }

    #topbar {
        height: 70px;
    }

    #topbar .container .logo {
        height: 80px;
        margin-bottom: -15px;
        margin-right: 50px;
    }

    #topbar .container nav {
        gap: 30px;
    }

    #topbar .container nav a {
        font-size: 16px;
    }

    #banner {
        height: calc(100vh - 58px);
    }

    section {
        padding: 40px 20px;
    }

    section h2 {
        font-size: 36px;
    }

    .card {
        flex: 0 0 100%;
    }

    .card .inner h3 {
        font-size: 28px;
    }

    .card .inner p {
        font-size: 16px;
    }

    .dummy-tab-content {
        flex-direction: column;
    }

    .dummy-tab-content .image {
        width: 100%;
        margin-bottom: 30px;
    }

    .dummy-tab-content .title {
        padding: 0 0 20px 0;
    }

    .dummy-tab-content .content p {
        font-size: 20px;
    }

    #message-band .container {
        padding: 0 30px;
    }

    #message-band p {
        font-size: 28px;
    }

    #product-band .product-grid {
        grid-template-columns: repeat(5, 1fr);
    }
    
    #product-band .product-box {
        flex: none;
        width: 100%;
        min-width: unset;
    }
    
    #product-band .product-box .image {
        height: 100px;
        margin-top: 10px;
    }
    
    #product-band .product-box .image img {
        max-height: 120px;
    }
    
    #product-band .product-box .image:hover img {
        max-height: 150px;
    }
    
    #product-band .product-box label {
        font-size: 12px;
        padding: 5px 6px;
    }
}

@media screen and (max-width: 768px) {
    #topredbar {
        min-height: 45px;
    }

    #topredbar a {
        font-size: 16px;
    }

    #topbar {
        height: 60px;
    }

    #topbar .container .logo {
        height: 70px;
        margin-bottom: -10px;
        margin-right: 30px;
    }

    #topbar .container nav {
        display: none;
    }

    #banner {
        height: calc(100vh - 58px);
    }

    #product-band {
        padding: 40px 20px;
    }

    .button-set button label {
        font-size: 20px;
    }

    .dummy-tab {
        flex-wrap: wrap;
    }

    .dummy-tab .tab {
        flex: 0 0 50%;
        padding: 15px;
        border-radius: 0 !important;
    }

    .dummy-tab .tab.selected {
        border-radius: 0 !important;
    }

    .dummy-tab .tab label {
        font-size: 20px;
    }

    .dummy-tab .tab span {
        font-size: 14px;
    }

    #surdurulebilirlik .leftcol .text div h3 {
        font-size: 32px;
    }

    #surdurulebilirlik .leftcol .text div h4 {
        font-size: 24px;
    }

    #surdurulebilirlik .rightcol .col label {
        font-size: 24px;
    }

    #surdurulebilirlik .rightcol .col p {
        font-size: 16px;
    }

    .footer .links {
        flex-direction: column;
        align-items: center;
    }

    .footer .links a {
        border-right: none;
        padding: 10px 0;
    }

    .footer .links a:last-child {
        border-bottom: none;
    }

    #product-band .product-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    #product-band .product-box {
        flex: none;
        width: 100%;
        min-width: unset;
    }
    
    #product-band .product-box .image {
        height: 90px;
    }
    
    #product-band .product-box .image img {
        max-height: 100px;
    }
    
    #product-band .product-box .image:hover img {
        max-height: 200px;
    }
}
@media screen and (max-width: 480px) {


.card .inner p.fronttext {
    font-size: 18px;
    margin-left: 40px;
}

.card .bg-img {
    right: -40px;
}
  #product-band .button-set {
    margin-top: 30px;
}
  #kariyer .main-col.full,
  .form-wrapper,
  .kariyer-form {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box;
  }

  #kariyer .form-group {
    width: 100% !important;
    margin-bottom: 16px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  #kariyer .form-label,
  #kariyer .form-label.flex-start {
    width: 100% !important;
    font-size: 15px !important;
    margin-bottom: 15px !important;
    text-align: left !important;
  }

  #kariyer .form-inputs,
  #kariyer .form-inputs.flex-column,
  #kariyer .form-select-container,
  #kariyer .education-input-container,
  #kariyer .language-options,
  #kariyer .experience-input-container,
  #kariyer .referance-input-container {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 15px !important;
    margin-left: 0 !important;
  }

  #kariyer .form-select-container {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
  }

  #kariyer input[type="text"],
  #kariyer input[type="email"],
  #kariyer input[type="tel"],
  #kariyer input[type="number"],
  input[type="password"],
  #kariyer select,
  #kariyer textarea {
    width: 100% !important;
    max-width: unset !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    display: block !important;
    font-size: 15px !important;
    padding: 10px !important;
    border-radius: 6px !important;
    border: 1px solid #ccc !important;
    background: #fff !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  #kariyer .language-span-container {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    width: 100% !important;
    margin: 8px 0 !important;
  }

  #kariyer .add-button {
    width: 100% !important;
    font-size: 15px !important;
    padding: 10px !important;
  }

  #kariyer .button-container,
  #kariyer .button-set {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  #kariyer .button-set button {
    font-size: 16px !important;
    padding: 12px !important;
  }

  #kariyer .alert {
    font-size: 14px !important;
    padding: 10px !important;
  }

  
  
    #product-band .swiper-slide {
      min-width: 140px;
      max-width: 90vw;
      justify-content: center;
      align-items: center;
      }
      #product-band .product-box {
        margin: 0 auto;
      }

    #product-band .swiper-slide {
      display: flex !important;
      justify-content: center;
      align-items: center;
      height: auto; 
    }
  
    .product-detail-container {
        flex-direction: column;
    }

    .product-detail-container .left-col {
        width: 100%;
    }

    .product-detail-container .container {
        flex-direction: column;
    }

    .product-detail-container .main-col .content {
        width: 100%;
    }

    .product-detail-container .main-col .content p {
        font-size: 20px;
        line-height: 32px;
    }

    .product-detail-container .main-col .product-detail {
        margin-top: -100px;
        max-width: 90%;
        align-self: center;
    }

    .product-detail-container .main-col .product-detail h3 {
        font-size: 20px;
    }

    section.product-desc .container {
        padding: 0 25px;
    }
    .contact-info p {
      line-height: 32px;
    }

    .contact-info h3 {
        margin-top: 16px!important;
    }
    .basin-detail-container .container.playground .content {
      flex-direction: column;
    }
    .basin-detail-container .container.playground .content .main-col.full {
      padding: 0;
      width: 100%;
    }
    .basin-box-container {
      width: 100%;
    }
    .container.playground .content {
      flex-direction: column-reverse;
    }

    .container.playground .content .main-col.full {
        padding: 0;
    }

    .container.playground .content .nav-col {
        width: 100%;
        margin-top: 50px;
    }
    .container.playground .content .left-col {
      width: 100%;
      margin-top: 50px;
    }
    .container.playground .content .main-col {
      width: 100%;
      display: flex;
      justify-content: center;
    }
    .container.playground .header p {
      font-size: 20px;
    }
    #surdurulebilirlik .leftcol .text .arrow{
      height: 150px;
    }
    #surdurulebilirlik .leftcol p {
        margin-left: 46px;
    }
    .container {
        padding: 0 15px;
    }

    #topredbar {
        min-height: 40px;
    }

    #topredbar a {
        font-size: 14px;
    }

    #topbar {
        height: 50px;
    }

    #topbar .container .logo {
        height: 60px;
        margin-bottom: -5px;
        margin-right: 20px;
    }

    #banner {
        height: calc(100vh - 58px);
    }

    section {
        padding: 30px 15px;
    }

    section h2 {
        font-size: 28px;
    }

    .button-set button {
        padding: 12px 20px;
    }

    .button-set button label {
        font-size: 18px;
    }

    .dummy-tab .tab {
        flex: 0 0 100%;
        padding: 10px;
    }

    .dummy-tab .tab label {
        font-size: 18px;
    }

    .dummy-tab .tab span {
        font-size: 12px;
    }

    .dummy-tab-content {
        padding: 15px;
    }

    .dummy-tab-content .content p {
        font-size: 16px;
    }

    #message-band .container {
        padding: 0 15px;
    }

    #message-band p {
        font-size: 20px;
    }

    #surdurulebilirlik .leftcol {
        padding: 30px 15px;
    }

    #surdurulebilirlik .rightcol {
        padding: 30px 15px;
    }

    #surdurulebilirlik .leftcol .text div h3 {
        font-size: 28px;
    }

    #surdurulebilirlik .leftcol .text div h4 {
        font-size: 20px;
    }

    #surdurulebilirlik .rightcol .col label {
        font-size: 20px;
    }

    #surdurulebilirlik .rightcol .col p {
        font-size: 14px;
    }

    .footer .container {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }

    #product-band .product-grid {
        grid-template-columns: repeat(2, 1fr)!important;
        gap: 50px!important;
        padding: 0 10px;
    }
    #product-band .product-box {
        height: 180px;
        min-height: 140px;
        max-width: 95vw;
        margin: 0 auto;
    }
    #product-band .product-box .image {
        height: 120px;
        min-height: 100px;
    }
    #product-band .product-box .image img {
        max-height: 120px;
        width: 90%;
        transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);
    }
    #product-band .product-box .image:active img,
    #product-band .product-box .image:focus img {
        transform: scale(2);
    }
    #product-band .product-box label {
        font-size: 20px;
        padding: 8px 5px 8px 5px;
    }
}

/* Mobil Menü Butonu */
.mobile-menu-btn {
    background: none;
    border: none;
    font-size: 2rem; /* butonun kendisi küçük kalsın */
    cursor: pointer;
    display: none;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%); /* dikey ortala */
    z-index: 1101;
    height: 44px;
    width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.mobile-menu-btn .material-symbols-outlined {
    font-size: 2.4rem !important; /* sadece ikon büyüsün */
    line-height: 1;
}

/* Mobil Menü Paneli */
.mobile-menu-panel {
    position: fixed;
    top: 0;
    right: -100vw;
    width: 80vw;
    max-width: 350px;
    height:100%;
    min-height: 100vh;
    background: #fff;
    box-shadow: -2px 0 10px rgba(0,0,0,0.15);
    z-index: 1100;
    transition: right 0.3s cubic-bezier(.4,0,.2,1);
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    overflow-y: auto;
}
.mobile-menu-panel.open {
    right: 0;
}
.mobile-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #eee;
}
.mobile-menu-logo img {
    height: 40px;
}
.mobile-menu-close {
    background: none;
    border: none;
    font-size: 2rem;
    cursor: pointer;
}
.mobile-menu-links {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1rem;
}
.mobile-menu-item {
    padding: 0.75rem 0;
    font-size: 1.1rem;
    color: #222;
    text-decoration: none;
    border-bottom: 1px solid #f2f2f2;
}
.mobile-menu-item.has-sub {
    position: relative;
    padding: 0;
    border-bottom: 1px solid #f2f2f2;
}
.mobile-menu-item.has-sub .mobile-menu-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    font-size: 1.1rem;
    padding: 0.75rem 0;
    cursor: pointer;
    transition: background 0.2s;
}
.mobile-menu-item.has-sub.active .mobile-menu-title {
    background: #f8f8f8;
    color: #b00;
}
.mobile-menu-item.has-sub .dropdown-arrow {
    font-size: 1.3rem;
    margin-left: 8px;
    transition: transform 0.2s;
}
.mobile-menu-item.has-sub.active .dropdown-arrow {
    transform: rotate(180deg);
}
.mobile-sub-menu {
    display: none;
    background: #fafafa;
    padding: 0.5rem 1rem 0.5rem 1.5rem;
    border-left: 2px solid #b00;
    border-radius: 0 0 6px 6px;
    margin-bottom: 0.5rem;
}
.mobile-menu-item.has-sub.active .mobile-sub-menu {
    display: block;
}
.mobile-sub-menu a {
    display: block;
    padding: 0.5rem 0;
    color: #333;
    font-size: 1rem;
    text-decoration: none;
    border-bottom: 1px solid #eee;
}
.mobile-sub-menu a:last-child {
    border-bottom: none;
}
.mobile-menu-social {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid #eee;
    justify-content: center;
}

/* Mobilde göster, desktopta gizle */
@media (max-width: 991px) {
    .mobile-menu-btn {
        display: block !important;
    }
    nav, .social {
        display: none !important;
    }
}

/* Desktopta gizle, mobilde göster */
@media (min-width: 992px) {
    .mobile-menu-panel {
        display: none !important;
    }
}

/* Swiper responsive ayarları */
@media screen and (max-width: 1229px) {
    #surdurulebilirlik .leftcol .text .arrow{
        height: 130px;
    }
    #product-band .product-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media screen and (max-width: 1024px) {
    #product-band .product-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width: 768px) {
    #product-band .product-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

@media screen and (max-width: 480px) {
    #product-band .product-grid {
        grid-template-columns: repeat(1, 1fr);
        gap: 15px;
    }
}







/* FATİH */


.sub-title {
    margin-top: 9px;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: 0;
    font-weight: 400;
  }
  .form-wrapper {
    width: 100%;
    margin: 0 auto;
  }
  .kariyer-form {
    margin-top: 55.5px;
    width: 100%;
    box-sizing: border-box;
    flex-direction: column;
  }
  .form-group {
    display: flex;
    margin-bottom: 32px;
    align-items: center;
    width: 100%;
  }
  .form-label {
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0;
    font-weight: 600;
    width: 20%;
    min-width: 20%;
    margin-top: 7.5px;
    margin-bottom: 7.5px;
  }
  .form-inputs {
    display: flex;
    width: 80%;
    margin-left: 40px;
  }
  .flex-column {
    display: flex;
    flex-direction: column;
  }
  .form-select {
    height: 48px;
    width: 30%;
    min-width: 200px;
    line-height: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    border: 1px solid #d41116;
    border-radius: 10px;
    padding: 11px 16px 11px 24px;
    margin-right: 40px;
  }

  .form-select:focus {
    outline: none;
  }
  .form-input {
    height: 48px;
    width: 30%;
    min-width: 200px;
    line-height: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    border: 1px solid #d41116;
    border-radius: 10px;
    padding: 11px 0px 11px 24px;
    margin-right: 40px;
  }
  .form-input:focus {
    outline: none;
  }
  .form-textarea {
    height: 100%;
    width: 100%;
    line-height: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    border: 1px solid #d41116;
    border-radius: 10px;
    padding: 11px 0px 11px 24px;
  }
  .form-textarea:focus {
    outline: none;
  }
  .form-select-container {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
  }
  .form-select-container .form-select {
    width: 12.5%;
    min-width: 72px;
    padding: 11px 6.3px 11px 16px;
  }
  .separator {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    color: #292929;
    opacity: 0.5;
    padding: 8px 11px 8px 11px;
  }
  .form-radio-container {
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .radio-options {
    display: flex;
    gap: 40px;
    width: 100%;
  }

  .radio-option {
    display: flex;
    align-items: center;
    cursor: pointer;
    position: relative;
    font-size: 18px;
    gap: 8px;
    font-weight: 500;
    letter-spacing: 0;
    color: #292929;
  }

  .radio-option input[type="radio"] {
    display: none;
  }

  .custom-radio {
    width: 20px;
    height: 20px;
    border: 2px solid #d41116;
    border-radius: 4px; /* Kare köşeler */
    position: relative;
    box-sizing: border-box;
  }

  .custom-radio::after {
    content: "";
    width: 10px;
    height: 10px;
    background-color: #d41116;
    border-radius: 50%; /* Yuvarlak iç nokta */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: 0.2s ease;
  }

  .radio-option input[type="radio"]:checked + .custom-radio::after {
    transform: translate(-50%, -50%) scale(1);
  }
  .radio-text {
    opacity: 0.5;
  }
  .form-hr {
    border: 1px solid #292929;
    opacity: 0.25;
    margin-top: 32px;
    margin-bottom: 32px;
    width: 100%;
  }
  .small-input {
    width: 12.5%;
    font-size: 20px;
  }
  .medium-input {
    width: 20%;
    font-size: 18px;
    margin-right: 10px;
    margin-bottom: 10px;
  }

  .margin-right-0 {
    margin-right: 0px;
  }

  .margin-bottom-40 {
    margin-bottom: 40px;
  }

  .language-options {
    width: 100%;
  }
  .language-span-container {
    display: flex;
    gap: 24px;
    margin-bottom: 24px;
  }
  .language-type-span {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 100%;
    color: #292929;
    width: 18%;
    margin-right: 40px;
    display: block;
    text-align: center;
  }

  .language-span {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 100%;
    color: #292929;
    display: flex;
    width: 6%;
    align-items: center;
    margin-right: 40px;
  }

  .experience-input-container {
    display: flex;
    width: calc(100%);
    flex-wrap: wrap;
    margin-bottom: 16px;
  }

  .experience-add-button-container {
    display: flex;
    align-items: center;
    justify-content: end;
    width: 100%;
    height: 28px;
  }
  .button-container {
    display: flex;
    justify-content: end;
    width: 100%;
    margin-top: 40px;
  }
  .send-button {
    width: 22%;
    height: 80px;
    background-color: transparent;
    color: #292929;
    border: 1px solid #d41116;
    border-radius: 10px;
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 100%;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 0px 16px 24px;
  }

  .send-button span {
    display: flex;
  }
  .send-button img {
    width: 35px;
    height: 35px;
  }

  .education-input-container {
    display: flex;
    width: 100%;
  }
  .referance-input-container {
    display: flex;
    width: 100%;
    margin-bottom: 16px;
  }
  .referance-add-button-container {
    display: flex;
    align-items: center;
    justify-content: end;
    width: calc(100% - 50% + 40px);
    height: 28px;
  }

  .add-button {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    color: #d41116;
    border: none;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 100%;
    cursor: pointer;
  }

  .flex-start {
    align-self: flex-start;
  }




  /* ARAMA SONUÇLARI */

  .search-header-container {
    margin-top: 64px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .search-header-container h2 {
    font-size: 50px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0;
  }
  .search-result-text-container {
    margin-bottom: 56px;
  }
  .search-result-text-container span {
    font-size: 25px;
    font-weight: 600;
  }
  .text-red {
    color: #d41116;
  }
  .padding-0 {
    padding: 0 !important;
  }

  .search-results-container {
    width: 100%;
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    gap: 24px 32px; /* dikey yatay */
  }
  .search-result-item {
    flex: 0 0 calc(50% - 16px);
    background-color: #ffffff;
    box-shadow: 0px 0px 20px 0px #00000026;
    border-radius: 10px;
  }

  .search-result-item-header {
    padding: 32px 24px 10px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .search-result-item-header span {
    font-size: 30px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0;
  }
  .search-result-item-header img {
    width: 40px;
    height: 40px;
  }

  .search-result-item-content {
    padding: 0px 79px 0px 24px;
  }
  .search-result-item-content p {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 5; /* 4 satır göster, sonrası ... */
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .padding-bottom-12 {
    padding-bottom: 12px !important;
  }

  .search-result-not-found {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 71px;
    margin-bottom: 195px;
  }
  .search-result-not-found span {
    font-size: 35px;
    font-weight: 600;
    line-height: 100%;
    letter-spacing: 0;
  }

  /* tablet */

  @media (max-width: 768px) {
    .search-result-item {
      flex: 0 0 calc(100% - 16px);
    }
    .search-result-not-found {
      flex-direction: column;
      text-align: center;
    }
  }
  /* phone */
  @media (max-width: 480px) {
    .search-result-item {
      flex: 0 0 calc(100% - 16px);
    }
    .search-result-not-found {
      flex-direction: column;
      text-align: center;
    }
  }


  /* SSS */

  .padding-0 {
    padding: 0 !important;
  }

  .sss-container {
    width: 100%;
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
  }
  .sss-item {
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0px 0px 20px 0px #00000026;
    border-radius: 10px;
    margin-bottom: 24px;
  }
  .sss-item-question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 32px 66px 10px 66px;
    gap: 116px;
    cursor: pointer;
  }
  .sss-item-question p {
    font-size: 20px;
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0;
    color: #292929;
  }
  .sss-item-question img {
    width: 40px;
    height: 40px;
  }

  .sss-item-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
  }
  .sss-item-answer.active {
    max-height: 500px; /* Tahmini maksimum yükseklik */
  }
  .sss-item-answer p {
    font-size: 20px;
    font-weight: 400;
    padding: 0px 144px 32px 144px;
    color: #292929;
    line-height: 100%;
    letter-spacing: 0;
    cursor: pointer;
  }
  .arrow-active {
    transform: rotate(90deg);
  }


  /* İLETİŞİM */

  
  .maps-div iframe {
    width: 100%;
    height: 100%;
  }
  .contact-row {
    width: 100%;
    min-height: 553px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    /* top 90 bottom 48 left right 260  */
    padding: 48px 26px 48px 26px;
  }
  .contact-div {
    width: 30%;
    height: 100%;
  }
  .maps-div {
    width: 34%;
    height: 525px;
  }
  .contact-image {
    height: 100%;
    border-radius: 10px;
  }
  .contact-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .contact-info {
    width: 100%;
    height: 100%;
    margin-top: 42px;
    display: flex;
    flex-direction: column;
  }
  .contact-info h3 {
    font-size: 35px;
    font-weight: 700;
    color: #292929;
    line-height: 100%;
    letter-spacing: 0;
    margin: 0;
    margin-bottom: 16px;
  }
  .contact-info p {
    font-size: 20px;
    font-weight: 400;
    color: #000000;
    line-height: 100%;
    letter-spacing: 0;
    margin: 0 0 16px 0;
  }
  .info-box {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
  }
  .info-box-item span {
    font-size: 20px;
    font-weight: 700;
    color: #000000;
    line-height: 32px;
    letter-spacing: 0;
    margin: 0;
  }
  .info-box-item a {
    font-size: 20px;
    font-weight: 400;
    color: #000000;
    line-height: 32px;
    letter-spacing: 0;
    text-decoration: none;
  }

  @media (max-width: 768px) {
    .contact-row {
      flex-direction: column;
      gap: 30px;
    }
    .contact-info {
      margin-top: 0px;
    }
    .contact-div,
    .maps-div {
      width: 100% !important;
    }
  }

  .contact-section {
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 0;
  }

  .contact-section > *:nth-child(1) {
    background-color: #fffaed;
    padding-top: 90px;
  }

  .contact-section > *:nth-child(n + 2):nth-child(odd) {
    background-color: #f7f7f7;
  }

  .info-box a{
    color: #000;
    text-decoration: none;
}

.education-input-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}

.education-input-container > * {
  flex: 1 1 0;
  min-width: 120px;
  max-width: 100%;
  box-sizing: border-box;
}