*{
box-sizing: border-box;
}
html, body {
max-width: 100%;
overflow-x: clip;
scroll-behavior: smooth;
position: relative;
}
img, video, iframe, svg {
max-width: 100%;
height: auto;
}
a, p, input, select, textarea, table, td, th, span, h1, h2 h3, h4, h5, h6, body, button {font-family: "Barlow", sans-serif;font-optical-sizing: auto;font-style: normal;font-display: swap;margin:0;}
a:hover {
text-decoration: none;
}
input, select, button, textarea {
outline: none;
}
::-webkit-scrollbar{width:5px;}
::-webkit-scrollbar-track{box-shadow:inset 0 0 5px grey;border-radius:5px;}
::-webkit-scrollbar-thumb{background:#F5CD12;border-radius:5px;}
::-webkit-scrollbar-thumb:hover{background:#F5CD1280;}
.container, .container-lg, .container-md, .container-sm, .container-xl {
max-width: 85%;
margin: auto;
}
img{
object-fit:contain;
}
.row {
display: flex;
flex-wrap: wrap;
margin: 0;
}
strong{
font-weight: bold;
}
h1 {
font-size: 65px;
font-weight:600;
line-height: 110%;
}
h2 {
font-size: 35px;
font-weight: 600;
line-height: 130%;
color: #383938;
margin: 0;
margin-bottom: 1rem;
position:relative;
}
h2.desen::before{
content:"";
position:absolute;
width: 20px;
height: 20px;
left: -30px;
top: 3px;
background: url(../img/baslik-after.webp);
background-repeat:no-repeat;
background-size:contain;
transform: rotate(65deg);
transition: 2s;
}
h2.desen.active::before{
transform: rotate(0);
/* left: -20px; */
}
h2.desen{
font-size: 20px;
margin-bottom: 0rem;
color: #000000;
padding-left: 0;
font-weight: 300;
margin-top: 1rem;
margin-bottom: 1rem;
letter-spacing: 2px;
text-transform: uppercase;
}
h3{
margin-block-start:0;
}
h2 strong{color: #DE2431;display: block;}
h3 {font-size: 45px;line-height:120%;margin-bottom: 2rem;color: #06346F;font-weight: 500;}
h4 {font-size: 35px;font-weight: 300;}
h5 {
font-size: 28px;
font-weight: 500;
color: #232324;
line-height: 120%;
margin-bottom: 2rem;
}
h6 {color: #000000;font-size: 25px;font-style: normal;font-weight: 600;line-height: 136%;letter-spacing: 0.125px;position: relative;}
p, li, a, td, th {
list-style-position: outside;
padding: 0;
color: #000000;
font-kerning: none;
font-size: 21px;
font-style: normal;
font-weight: 300;
line-height: 150%;
letter-spacing: 0px;
}
p, a, td, th {
margin-bottom: 2rem;
}
li{
margin-bottom:1rem;
}
span{color: #363636;font-kerning: none;font-size: 16px;font-style: normal;font-weight: 400;line-height: 24px;letter-spacing: 0.16px;}
.row{
margin:0;
--bs-gutter-x: 0;
--bs-gutter-y: 0;
}
.points{cursor:pointer;}
.pt-96{
padding-top:72px;
}
.pb-96{
padding-bottom:72px;
}
.pt-48{
padding-top:36px;
}
.pb-48{
padding-bottom:36px;
}
.padl-5{
padding-left:5%;
}
.padr-5{
padding-right:5%;
}
.mt-96{
margin-top:72px;
}
.mb-96{
margin-bottom:72px;
}
.mt-48{
margin-top:36px;
}
.mb-48{
margin-bottom:36px;
}
.ml-5{
margin-left:5%;
}
.mr-5{
margin-right:5%;
}
.w50{
width: 47.5%;
position:relative;
}
.w50:first-child{
margin-right:2.5%;
}
.w50:last-child{
margin-left:2.5%;
}
.w40:first-child{
margin-right:2.5%;
}
.w40:last-child{
margin-left:2.5%;
}
.w60:first-child{
margin-right:2.5%;
}
.w60:last-child{
margin-left:2.5%;
}
.w50{
width: 47.5%;
position:relative;
}
.w40{
width: 37.5%;
position:relative;
}
.w30{
width:30%;
position:relative;
}
.w20{
width:20%;
position:relative;
}
.w10{
width:10%;
position:relative;
}
.w60{
width:57.5%;
position:relative;
}
.w70{
width:70%;
position:relative;
}
.w80{
width:80%;
position:relative;
}
.w90{
width:90%;
position:relative;
}
.w100{
width:100%;
position:relative;
}
.baslik-pb{
padding-bottom:48px
}
.baslik-mb{
margin-bottom:48px
}
#backtotop::after{
content: "";
position: absolute;
animation: climp 2s infinite;
transition: 0.5s;
width: 120px;
height: 120px;
border: 1px solid #323232;
border-radius: 50%;
left: -15px;
top: -15px;
}
#backtotop::before{
content:"";
position:absolute;
animation: climp2 2s infinite;
transition: 0.5s;
width: 100px;
height: 100px;
border: 1px solid #323232;
border-radius: 50%;
left: -5px;
top: -5px;
}
@keyframes scale{
0%{
transform:scale(1)
}
50%{
transform:scale(1.1)
}
100%{
transform:scale(1)
}
}
@keyframes climp{
0%{
transform:scale(1)
}
50%{
transform:scale(1.1)
}
100%{
transform:scale(1)
}
}@keyframes climp2{
0%{
transform:scale(1)
}
50%{
transform:scale(1.1)
}
100%{
transform:scale(1)
}
}
#backtotop img{
width: 100%;
}
#backtotop{transition:0.5s;display:none;position:fixed;bottom: 50px;right: 50px;z-index:99;font-size:18px;border:none;outline:none;background:transparent;cursor:pointer;width: 90px;height: 90px;padding: 0;display: none!important;}
a{
text-decoration:none;
}
@media (max-width: 900px){
#backtotop{
width: 60px;
height: 60px;
}
#backtotop::after{
width: 90px;
height: 90px;
}
#backtotop::before{
width: 70px;
height: 70px;
}
}
.mobile-menu-links ul li .panel-mm-acc ul li a{font-size:17px;}
.opens .mobile-menu-links ul li{transform:translate(0,0);}
.opens .mobile-menu-links ul li{opacity:1;}
.opens .mobile-menu-kapat-logo .mm-kapat::before{-webkit-transform:translateY(-50%) rotate(225deg);-ms-transform:translateY(-50%) rotate(225deg);transform:translateY(-50%) rotate(225deg);-webkit-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);-o-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);transition:0.9s cubic-bezier(.767, .01, .18, 1.01);-webkit-transition-delay:1.2s;-o-transition-delay:1.2s;transition-delay:1.2s;}
.opens .mobile-menu-kapat-logo .mm-kapat::after{-webkit-transform:translateY(-50%) rotate(135deg);-ms-transform:translateY(-50%) rotate(135deg);transform:translateY(-50%) rotate(135deg);-webkit-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);-o-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);transition:0.9s cubic-bezier(.767, .01, .18, 1.01);-webkit-transition-delay:0.9s;-o-transition-delay:0.9s;transition-delay:0.9s;}
@media (max-width: 1200px){
.mm-acc{background-color:transparent;cursor:pointer;padding:8px 0 8px 0;width:100%;border:0;text-align:left;outline:0;transition:0.4s;color:#fff;font-weight:400;font-size:25px;}
.mm-acc:hover{background-color:transparent;}
.mm-acc:after{content:"\002B";color:#fff;font-weight:300;float:right;margin-left:5px;}
.panel-mm-acc{padding:0 0;max-height:0;overflow:hidden;transition:max-height 0.2s ease-out;}
.panel-mm-acc ul li a{font-size:20px;}
.panel-mm-acc ul li:last-child{border-bottom:0;}
}
@media (max-width: 500px){
.mm-acc{font-size:20px;}
.panel-mm-acc ul li a{font-size:20px;}
}
.mobile-menu-links ul li .panel-mm-acc ul li a{position:relative;font-size:17px;margin-left: 20px;border-bottom:1px solid #00000030}
.mobile-menu-links ul li .panel-mm-acc ul li a::after{
content:"";
position:absolute;
width:8px;
height:2px;
background:#000;
left:-15px;
top:10px
}
.header-mobile .header-mobile-logo img{transition:0.5s;}
@media (min-width: 1200px){
.header-mobile{display:none;}
}
@media (max-width: 1200px){
.header-mobile .seacrhmobile{
width: 30%;
display: flex;
justify-content: flex-end;
align-items: center;
}
.header-mobile .seacrhmobile .arama-btn{
border: 1px solid #000;
}
.header-mobile .seacrhmobile .arama-btn svg{}
.header-mobile .seacrhmobile .arama-btn svg circle{}
.header-mobile .seacrhmobile .arama-btn svg path{}
.header-mobile .header-mobile-logo{width:50%;display:flex;align-items:center;justify-content:flex-start;padding-top:10px;}
.header-mobile .header-mobile-katalog{width: 40%;display:flex;justify-content: end;align-items:center;padding-top: 10px;}
.header-mobile .header-mobile-katalog a{
display: flex;
justify-content: center;
align-items: center;
font-size:20px;
color:#ffffff;
margin: 0;
}
.header-mobile .header-mobile-katalog a img{
margin-right:15px;
width: 38px;
object-fit: contain;
}
.header-mobile .header-mobile-logo a{margin:0;}
.header-mobile .header-mobile-logo img{width: 50%;/* filter: brightness(0) invert(1); */}
.header-mobile .header-mobile-hamburger{width: 20%;display:flex;align-items: flex-end;justify-content:center;margin-left: 0%;flex-direction:column;transform: translate(0px, 6px);}
.sidenav{height:100%;width:0;position:fixed;z-index:99999999999;top:0;left:0;background-color: #ffffff;overflow-x:hidden;transition:0.5s;padding-top:60px;transition-delay:0.5s;}
.mobile-menu-kapat-logo{border-bottom:2px solid #fff;position:relative;padding-bottom:20px;padding-left:2%;padding-right:2%;}
.mobile-menu-kapat-logo .mm-logo{width:50%;display:flex;align-items:center;justify-content:flex-start;}
.mobile-menu-kapat-logo .mm-kapat{width:50%;position:relative;}
.mobile-menu-links{margin-top:5%;}
.mobile-menu-links ul{padding-left:0;margin-bottom:0;}
.mobile-menu-links ul li{list-style:none;border-bottom: 1px solid #000000;margin-bottom:20px;overflow:hidden;opacity:0;transition:1s;}
.mobile-menu-links ul li a{font-size: 20px;color: #002f87;transition:1s;font-weight: 500;}
.mobile-menu-kapat-logo .mm-logo img{
width:50%;
}
.mobile-menu-links h5{
text-align:center;
color:#000000;
font-weight:bold;
}
.mobile-menu-links ul.social img{
width:max-content;
}
.mobile-menu-links ul.social{
display:flex;
justify-content:center;
}
.header-mobile.navbar-mobile-takip{
padding: 0;
}
.header-mobile.navbar-mobile-takip img{
width: 35%;
}
}
@media (max-width: 500px){
.mobile-menu-kapat-logo{padding-bottom:10px;padding-left:0%;padding-right:0%;}
.mobile-menu-kapat-logo .mm-logo img{width:90%;}
.mobile-menu-links ul li a{font-size:30px;}
.header-mobile .header-mobile-logo img{width:60%;margin-bottom:10px;margin-top:10px;transition:0.5s;}
}
@media (max-width: 1200px){
.header-mobile{position:fixed;top:0;left:0;z-index:99999999;transition:0.5s;width:100%;background: #ffffff;padding-top:1%;padding-bottom:1%;}
}
@media (max-width: 900px){
.mobile-menu-links ul li a{font-size:25px;}
}
@media (max-width: 600px){
.mobile-menu-links ul li a{font-size:20px;}
}
.header-mobile-hamburger span:nth-child(2){
background: #de2431;
}
.mobile-menu-links ul li a, .mobile-menu-links ul li button a{color: #000000!important;}
.header-mobile-hamburger span{width: 50px;height: 5px;background: #000000;display:inline-block;margin-bottom:6px;border-radius:10px;}
.mobile-menu-links ul li:nth-child(1){transition-delay:1s;}
.mobile-menu-links ul li:nth-child(2){transition-delay:1.1s;}
.mobile-menu-links ul li:nth-child(3){transition-delay:1.2s;}
.mobile-menu-links ul li:nth-child(4){transition-delay:1.3s;}
.mobile-menu-links ul li:nth-child(5){transition-delay:1.4s;}
.mobile-menu-links ul li:nth-child(6){transition-delay:1.5s;}
.mobile-menu-links ul li:nth-child(7){transition-delay:1.6s;}
.mobile-menu-links ul li:nth-child(8){transition-delay:1.7s;}
.mobile-menu-links ul li:nth-child(9){transition-delay:1.8s;}
.mobile-menu-links ul li:nth-child(10){transition-delay:1.9s;}
.mobile-menu-links ul li a{display:block;margin-bottom: .5rem;}
.mobile-menu-kapat-logo .mm-kapat::before,.mobile-menu-kapat-logo .mm-kapat::after{content:'';width:41px;height:4px;background:#fff;position:absolute;top:18px;right:0;-webkit-transform:translateY(-50%) rotate(0deg);-ms-transform:translateY(-50%) rotate(0deg);transform:translateY(-50%) rotate(0deg);-webkit-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);-o-transition:0.9s cubic-bezier(.767, .01, .18, 1.01);transition:0.9s cubic-bezier(.767, .01, .18, 1.01);}
.mobile-menu-kapat-logo .mm-kapat::before{
background: #000000;
}
.mobile-menu-kapat-logo .mm-kapat::after{
background: #de2431;
}
.mm-acc:after{content:"\002B";color: #de2431;font-weight:300;float:right;margin-left:5px;}
.mm-acc.active-mm-acc:after{content:"-";color: #002f87;font-weight:300;float:right;margin-left:5px;}
@media (max-width: 900px){
.mobile-menu-links ul li a{font-size:25px;}
}
.accordion-mm:after{content:'\002B';color:#fff;font-weight:100;float:right;margin-left:5px;}
.accordion-mm.active-mm:after{content:'-T';color:#fff;font-weight:500;float:right;margin-left:5px;}
@media (max-width: 1200px){
.mm-acc{background-color:transparent;cursor:pointer;padding:8px 0 8px 0;width:100%;border:0;text-align:left;outline:0;transition:0.4s;color: #000;font-weight: 600;font-size:25px;}
.mm-acc:hover{background-color:transparent;}
.panel-mm-acc{padding:0 0;max-height:0;overflow:hidden;transition:max-height 0.2s ease-out;}
.panel-mm-acc ul li a{font-size:20px;}
.panel-mm-acc ul li:last-child{border-bottom:0;}
}
@media (max-width: 500px){
.mm-acc{font-size:20px;color: #000000 !important;font-weight: 500;}
.panel-mm-acc ul li a{font-size:20px;}
}
.absollink{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
z-index: 1;
}
.parallaxpart{background-image:url(../img/parallax-bg.webp);min-height: 600px;background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;position:relative;height: 600px;display:flex;justify-content:center;align-items:center;padding-top: 5%;padding-bottom: 5%;}
.parallaxpart .absoles{
position:absolute;
left:0;
top:0;
width:100%;
object-fit:contain;
}.parallaxpart .absoles2{
position:absolute;
left:0;
bottom:0;
width:100%;
object-fit:contain;
}
.parallaxpart .textdecor h2{
font-size: 50px;
color: #FFFFFF;
}
.parallaxpart .textdecor h2 strong{
color: #F5B335;
display:block;
}
.parallaxpart .textdecor{
width: 85%;
padding-top: 0%;
}
.parallaxpart .textdecor h5{text-align: left;color:#fff;font-weight:500;text-shadow:1px 1px 5px #000;width: 100%;margin: 2rem auto;}
.parallaxpart .textdecor a{color:#fff;}
.parallaxpart .textdecor .put{text-align:center;width: 40%;margin:auto;position:relative;}
.parallaxpart .textdecor .put input{width: 100%;height:60px;display:flex;justify-content:center;align-items:center;border:0;border-radius:50px;padding-left:20px;background:#002f87;background-color: #ffffff37;border: 1px solid #ffffff40;font-size: 130%;}
.parallaxpart .textdecor .put input::placeholder{color:#fff;}
.parallaxpart .textdecor .put button{background:0 0;border:0;outline:0;position:absolute;color: #fff;background: #323232;width: 50%;height: 100%;top: 0;right: -25px;border-radius: 50px;z-index: 9;cursor: pointer;font-size: 110%;}
.parallaxpart .textdecor .put button img{
position:absolute;
right:40px;
top:23px;
transition:1s;
}
.parallaxpart .textdecor .put button:hover img{
right:30px;
}
@media (max-width:1681px){
.parallaxpart .textdecor{transform:translate(0,40px);}
}
@media (max-width:1300px){
.parallaxpart .textdecor .put{width:40%;}
.parallaxpart .textdecor .put input{height:40px;}
}
@media (max-width:600px){
.parallaxpart .textdecor h5{font-size:20px;width:80%;}
.parallaxpart .textdecor p{margin-top:1rem;}
.parallaxpart .textdecor .put{width:70%;}
.parallaxpart{min-height:200px;height:200px;background-size:cover;background-attachment:local;}
.parallaxpart .textdecor{transform:translate(0,0);}
}
.hata{
border-color:red!important;
border-width:3px!important;
}
.cta {
display: flex;
align-items: center;
background-color: #ffcc00;
color: #fff;
font-size: 1rem;
font-weight: 700;
border: 0;
padding: .75rem 1rem;
border-radius: 5rem;
cursor: pointer;
border-top-right-radius: 0;
border-bottom-right-radius: 0
}
.cta:hover {
background-color: #000000;
}
.cta svg,.cta img {
width: 20px;
height: 25px;
margin-right: .5rem;
fill: #000;
transition: transform .2s ease;
object-fit: contain;
}
.cta-fixed-wrap.cta1 {
bottom: 15%;
}
.cta-fixed-wrap.cta2 {
bottom: 45%
}
.cta-fixed-wrap a.absolcta {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
margin: 0;
z-index: 9
}
.cta-fixed-wrap.cta4 button img{
filter: brightness(0);
}
.cta-fixed-wrap.cta4 {
bottom: 8%;
}
.cta-fixed-wrap.cta3 {
bottom: 25%
}
.cta-fixed-wrap {
position: fixed;
right: 0;
animation-delay: .8s;
z-index: 999;
text-align: right;
float: right;
display: flex;
justify-content: flex-end;
overflow: hidden;
border-top-right-radius: 0
}
.cta--fixed {
transition: transform .2s ease
}
.cta--fixed span {
display: block;
transition: transform .2s ease;
color: #000;
margin: 0
}
.cta--fixed:hover span {
color: #fff;
}
.cta--fixed:hover svg {
fill: #fff;
}
body.scrolled .cta--fixed {
transform: translateX(calc(100% - 55px + .35rem))
}
body.scrolled .cta--fixed span {
transform: translateX(100%)
}
body.scrolled .cta--fixed svg {
position: relative;
left: -1px;
margin: 0
}
body.scrolled .cta-fixed-wrap:hover .cta--fixed {
transform: translateX(0%)
}
body.scrolled .cta-fixed-wrap:hover .cta--fixed span {
transform: translateX(5%)
}
.popup-overlay {
position: fixed;
inset: 0;
background: rgba(10, 15, 25, 0.72);
backdrop-filter: blur(6px);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
padding: 20px;
}
.popup-content {
background: #ffffff;
padding: 32px 28px;
border-radius: 14px;
max-width: 420px;
width: 100%;
position: relative;
animation: popupFade .25s ease-out;
box-shadow: 0 20px 60px rgba(0,0,0,0.25);
border: 1px solid rgba(0,0,0,0.06);
}
.popup-content h3 {
margin-top: 0;
margin-bottom: 8px;
font-size: 20px;
font-weight: 700;
letter-spacing: 0.3px;
color: #1a1a1a;
}
.popup-content p {
margin: 0 0 10px 0;
font-size: 11px;
color: #666;
line-height: 1.4;
}
.popup-content input,
.popup-content textarea {
width: 100%;
padding: 12px 14px;
border: 1px solid #e2e6ea;
border-radius: 8px;
margin-bottom: 10px;
font-size: 14px;
background: #fafafa;
transition: all 0.2s ease;
outline: none;
}
.popup-content input:focus,
.popup-content textarea:focus {
border-color: #ffcc00;
background: #fff;
box-shadow: 0 0 0 3px rgba(255, 204, 0, 0.2);
}
.popup-content button {
width: 100%;
padding: 12px 16px;
background: linear-gradient(135deg, #ffcc00, #e6b800);
color: #1a1a1a;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: 600;
letter-spacing: 0.2px;
transition: all 0.2s ease;
}
.popup-content button:hover {
transform: translateY(-1px);
box-shadow: 0 8px 20px rgba(255, 204, 0, 0.25);
}
.close-btn {
position: absolute;
top: 12px;
right: 14px;
font-size: 22px;
cursor: pointer;
color: #666;
transition: 0.2s ease;
}
.close-btn:hover {
color: #000;
transform: rotate(90deg);
}
@keyframes popupFade {
0% {
transform: scale(0.92);
opacity: 0;
}
100% {
transform: scale(1);
opacity: 1;
}
}
.search-trigger { background: none; border: none; cursor: pointer; padding: 0; }
.search-overlay {
position: fixed; inset: 0;
background: rgba(0,0,0,.55);
display: flex; align-items: flex-start; justify-content: center;
padding-top: 80px; z-index: 9999;
opacity: 0; pointer-events: none;
transition: opacity .25s ease;
}
.search-overlay.open { opacity: 1; pointer-events: all; }
.search-box {
width: 100%; max-width: 640px;
background: #fff; border-radius: 12px;
border: 1px solid #e5e5e5; overflow: hidden;
transform: translateY(-12px); transition: transform .25s ease;
}
.search-overlay.open .search-box { transform: translateY(0); }
.search-form { display: flex; align-items: center; padding: 0 16px; height: 56px; gap: 12px; }
.search-input { flex: 1; border: none; outline: none; font-size: 16px; background: transparent; }
.search-btn { height: 34px; padding: 0 16px; border: 1px solid #ddd; border-radius: 8px; background: transparent; cursor: pointer; font-size: 13px; }
.search-btn:hover { background: #f5f5f5; }
.search-close { border: none; background: none; cursor: pointer; font-size: 20px; color: #888; padding: 4px; border-radius: 6px; }
.search-close:hover { background: #f5f5f5; }
.search-divider { height: 1px; background: #eee; margin: 0 16px; }
.search-hints { padding: 12px 16px 14px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.hint-label { font-size: 12px; color: #aaa; }
.hint-tag { font-size: 12px; padding: 4px 10px; border-radius: 20px; border: 1px solid #e5e5e5; color: #666; cursor: pointer; background: #fafafa; }
.hint-tag:hover { border-color: #bbb; color: #333; }
.krcbanner{overflow:hidden;min-height: 450px;background-attachment:fixed;background-position:top;background-repeat:no-repeat;position:relative;background-size:100% 60%;height: 450px;}
.krcbanner .film{width:100%;height:100%;background:linear-gradient(45deg, #0B285F80, transparent);position:absolute;top:0;left:0;}
.krcbanner img{height:100%;object-fit:cover;filter:blur(15px);transition-delay:1s;transition:2s;width:100%;}
.krcbanner.active img{filter:blur(0);}
.krcbanner .izlencetext{position:absolute;left:6%;bottom:15%;width:100%;transition:.5s;transition-delay:.5s;transition-timing-function:ease;z-index:9;}
.krcbanner .izlencetext ul{list-style:none;padding:0;display:flex;justify-content:flex-start;margin-bottom:0;}
.krcbanner .izlencetext ul li{margin-right:10px;}
.krcbanner .izlencetext ul li a{display:flex;justify-content:center;align-items:center;}
.krcbanner .izlencetext ul li a img{display:block;width:max-content;height:max-content;margin-right:10px;}
.krcbanner .izlencetext ul li a{font-weight:400;letter-spacing:.02em;color:#fff;font-size:15px;font-weight:300;}
.krcbanner h1{font-size:55px;font-weight:700;}
@media (min-width: 1200px){
.krcbanner img{/* display:none; */}
.krcbanner img.masaustu{display:block;}
}
@media (max-width: 1200px){
.krcbanner img{display:block;}
.krcbanner .izlencetext{opacity:1!important;}
.krcbanner{margin-top:100px;}
.krcbanner img{width:100%;}
}
@media (max-width: 900px){
}
@media (max-width: 600px){
.krcbanner .izlencetext{position:absolute;left:5%;bottom:30%;width:90%;}
.krcbanner .izlencetext ul li{text-align:left;}
.krcbanner img{object-position:30% 0;}
}
@media (max-width: 1682px){
}
@media (max-width: 1550px){
.krcbanner .izlencetext ul{margin-bottom:1rem;}
}
@media (max-width: 1400px){
}
@media (max-width: 1300px){
.krcbanner .izlencetext ul{margin-bottom:1rem;}
}
@media (max-width: 1200px){
.krcbanner .izlencetext{width:80%;}
.krcbanner .izlencetext ul li a{font-size:10px;}
}
@media (min-width:900px){
.mobil{display:none;}
}
@media (max-width: 900px){
.mobil{display:block;}
.krcbanner{min-height:300px;}
.krcbanner .film{height:auto;}
.krcbanner img{height:300px;}
.krcbanner{height:300px;}
.krcbanner .izlencetext ul li a{font-size:13px;}
.krcbanner .izlencetext ul li{margin-bottom:0;}
}
@media (max-width: 600px){
.krcbanner .film{opacity:0;}
.krcbanner img{height:auto;}
.krcbanner{height:auto;background:#072b4d!important;margin-top:2rem;}
.krcbanner .izlencetext ul li{margin-right:0px;}
.krcbanner .film{z-index:9;}
.krcbanner .izlencetext{z-index:99;}
.krcbanner img{object-position:50%!important;}
.krcbanner{min-height:auto;}
}
@media (prefers-reduced-motion: reduce){
*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important;}
}
@media (max-width: 1681px){
.krcbanner{min-height:550px;height:550px;}
}
@media (max-width: 1550px){
.krcbanner{min-height:450px;height:450px;}
.krcbanner .izlencetext{left:6%;bottom: 10%;}
}
@media (max-width: 1450px){
.krcbanner{min-height:400px;height:400px;}
.krcbanner h1{font-size:45px;font-weight:700;}
}
@media (max-width: 1300px){
.krcbanner{min-height: 350px;height: 350px;}
}
@media (max-width: 1200px){
.krcbanner{margin-top:80px;}
.krcbanner h1{font-size:35px;font-weight:700;}
.krcbanner .izlencetext ul li a{font-size:13px;margin:0;}
.krcbanner .izlencetext ul li a img{display:block;width:20px;height:15px;margin-right:10px;object-fit:contain;}
.krcbanner .film{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg, #1D366680, transparent);}
}
@media (max-width: 900px){
.masaustu{display:none;}
.mobil{display:block;}
.krcbanner img{/* height: 190px; *//* object-fit: cover; */}
.krcbanner{}
.krcbanner h1{font-size:30px;font-weight:700;}
}
@media (max-width: 600px){
.krcbanner img{height:230px;object-fit:cover;width:100%;}
.krcbanner .film{opacity:1;}
.krcbanner .izlencetext ul{margin-bottom:.5rem;margin-top:.5rem;}
.krcbanner{margin-top:60px;}
.krcbanner h1{font-size:20px;font-weight:500;}
.krcbanner .film{opacity:1;z-index:99;background:#1c376799;}
.krcbanner .izlencetext ul li a{font-size:11px;margin:0;}
.krcbanner .izlencetext{left:6%;bottom:15%;}
.krcbanner .izlencetext ul{display:inline-block;}
.krcbanner .izlencetext ul li{margin-right:0px;display:inline-block;width:max-content;}
}
.krcbanner .desenkobanner{
position: absolute;
bottom: 0;
left: 0;
width: 30%;
height: 100%;
z-index: 9;
opacity: 0;
transition: .5s;
transition-delay: 1s;
}
.krcbanner .desenkobanner img{
width: 100%;
height: 100%;
object-fit: contain;
display: block;
}
.krcbanner.active .desenkobanner{
opacity: 1;
}
.anaslide{
position: relative;
width: 100%;
height: 100vh;
overflow: hidden;
}
.anaslide .owl-anaslide{
width: 100%;
height: 100%;
}
.anaslide .owl-anaslide .owl-stage-outer,
.anaslide .owl-anaslide .owl-stage,
.anaslide .owl-anaslide .owl-item{
height: 100%;
}
.anaslide .owl-anaslide .item{
position: relative;
width: 100%;
height: 100vh;
min-height: 640px;
max-height: 900px;
overflow: hidden;
}
.anaslide .owl-anaslide .item .bgs{
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.anaslide .owl-anaslide .item .bgs img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
transform: scale(1.08);
transition: transform 8s ease;
}
.anaslide .owl-anaslide .item .bgs::after{
content: "";
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.35) 45%, rgba(0,0,0,0.15) 100%);
z-index: 2;
}
.anaslide .owl-anaslide .owl-item.active .item .bgs img{
transform: scale(1);
}
.anaslide .owl-anaslide .item .cont{
position: relative;
z-index: 3;
max-width: 86%;
margin: 0 auto;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
padding-bottom: 0px;
}
.anaslide .owl-anaslide .item .cont h1{
width: 50%;
margin-bottom: 2rem;
font-weight: 400;
}
.anaslide .owl-anaslide .item .cont p{
width: 50%;
margin-bottom: 2rem;
}
.anaslide .owl-anaslide .item .cont .cat,
.anaslide .owl-anaslide .item .cont h1,
.anaslide .owl-anaslide .item .cont p,
.anaslide .owl-anaslide .item .cont .actions{
opacity: 0;
transform: translateY(28px);
transition: opacity 0.9s cubic-bezier(.22,.61,.36,1),
transform 0.9s cubic-bezier(.22,.61,.36,1);
will-change: opacity, transform;
color: #fff;
}
.anaslide .owl-anaslide .owl-item .item .cont .cat{
/* position:absolute; */
left: 0%;
top: 15%;
background: #DE2431;
padding: 10px;
border-radius: 10px;
color: #fff;
width: max-content;
margin-bottom: 2rem;
}
.anaslide .owl-anaslide .owl-item.active .item .cont .cat{
opacity: 1;
transform: translateY(0);
transition-delay: 0.15s;
}
.anaslide .owl-anaslide .owl-item.active .item .cont h1{
opacity: 1;
transform: translateY(0);
transition-delay: 0.35s;
}
.anaslide .owl-anaslide .owl-item.active .item .cont p{
opacity: 1;
transform: translateY(0);
transition-delay: 0.55s;
}
.anaslide .owl-anaslide .owl-item.active .item .cont .actions{
opacity: 1;
transform: translateY(0);
transition-delay: 0.75s;
}
.anaslide .owl-anaslide .item .cont .actions .more{
display: inline-flex;
align-items: center;
justify-content: center;
color: #ffffff;
padding: 20px 34px;
border: 1px solid rgba(255,255,255,0.7);
margin-bottom: 0;
letter-spacing: 1px;
transition: 0.3s;
line-height: 1;
font-size: 14px;
}
.anaslide .owl-anaslide .item .cont .actions .more:hover{
background: #de2431;
border-color: #de2431;
color: #ffffff;
}
.anaslide .owl-anaslide .item .cont .actions .navs{
display: flex;
gap: 12px;
position: absolute;
left: 15%;
bottom: 10%;
}
.anaslide .owl-anaslide .item .cont .actions .navs button{
width: 48px;
height: 48px;
border-radius: 50%;
background: transparent;
border: 1px solid rgba(255,255,255,0.7);
color: #ffffff;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s;
padding: 0;
}
.anaslide .owl-anaslide .item .cont .actions .navs button:hover{
background: #de2431;
border-color: #de2431;
}
.anaslide .owl-anaslide .item .cont .actions .navs button svg{
display: block;
}
.anaslide .owl-tab-list{
position: absolute;
left: 0;
bottom: 0;
width: 100%;
background: #0e0e0e80;
/* backdrop-filter: blur(5.5px); */
z-index: 5;
}
.anaslide .owl-tab-list ul{
display: flex;
list-style: none;
padding: 0;
margin: 0 auto;
max-width: 100%;
}
.anaslide .owl-tab-list ul .tab-item{
flex: 1;
text-align: center;
color: #ffffff;
padding: 24px 12px;
cursor: pointer;
letter-spacing: 1px;
margin-bottom: 0;
transition: 0.3s;
user-select: none;
font-size: 13px;
}
.anaslide .owl-tab-list ul .tab-item.active{
border-top: 2px solid #ffffff;
}
.anaslide .owl-tab-list ul .tab-item:hover{
background: rgba(222, 36, 49, 0.35);
}
.anaslide .owl-tab-list ul .tab-item.active{
background: #de2431;
border-top: 2px solid #ffffff;
}
/* Tablet */
@media (max-width: 1199px){
.anaslide{
min-height: 560px;
}
.anaslide .owl-anaslide .item{
min-height: 560px;
}
.anaslide .owl-tab-list ul .tab-item{
padding: 18px 8px;
}
}
/* Mobile: tabları dikey yap, slider yüksekliğini oran koruyacak şekilde küçült */
@media (max-width: 991px){
.anaslide{
height: auto;
max-height: none;
min-height: 0;
}
.anaslide .owl-anaslide .item{
height: 70vh;
min-height: 480px;
max-height: none;
}
.anaslide .owl-anaslide .item .cont{
padding-bottom: 40px;
padding-top: 80px;
}
.anaslide .owl-tab-list{
position: relative;
}
.anaslide .owl-tab-list ul{
flex-direction: column;
}
.anaslide .owl-tab-list ul .tab-item{
text-align: left;
padding: 16px 24px;
border-top: none;
border-left: 2px solid transparent;
}
.anaslide .owl-tab-list ul .tab-item.active{
border-top: none;
border-left: 2px solid #ffffff;
}
}
@media (max-width: 767px){
.anaslide .owl-anaslide .item{
height: auto;
min-height: 420px;
}
.anaslide .owl-anaslide .item .cont{
padding-top: 60px;
padding-bottom: 60px;
}
.anaslide .owl-anaslide .item .cont .cat{
margin-bottom: 20px;
}
.anaslide .owl-anaslide .item .cont p{
margin-bottom: 28px;
}
.anaslide .owl-anaslide .item .cont .actions .more{
padding: 12px 26px;
}
.anaslide .owl-anaslide .item .cont .actions .navs button{
width: 42px;
height: 42px;
}
}
.hakkimizda-krc{
overflow: hidden;
position: relative;
}
.hakkimizda-krc .bgss{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
}
.hakkimizda-krc .bgss img{
width:100%;
height: 100%;
object-fit: contain;
}
.hakkimizda-krc .first,
.hakkimizda-krc .last{
display: block;
white-space: nowrap;
will-change: transform;
pointer-events: none;
user-select: none;
}
.hakkimizda-krc .first{
text-align: left;
}
.hakkimizda-krc .last{
text-align: right;
}
.hakkimizda-krc .first{
font-size: 50px;
font-weight: bold;
color: #DE2431;
display: block;
margin-bottom: 1rem;
line-height: 150%;
}
.hakkimizda-krc .last{
font-size: 50px;
font-weight: bold;
color: #000;
/* display: inline-block; */
line-height: 150%;
text-align: right;
}
.hakkimizda-krc .container .row{
margin-top:4rem;
justify-content: space-between;
}
.hakkimizda-krc .container .w50{}
.hakkimizda-krc .container .w50:last-child{
margin-top: auto;
}
.hakkimizda-krc .container .w50 h2.desen{}
.hakkimizda-krc .container .w50 p{
margin:0;
}
.hakkimizda-krc .rakamlarrow{}
.hakkimizda-krc .rakamlarrow .wrakam h6{
display:inline-block;
font-size: 82px;
line-height: 100%;
margin:0;
transform: translate(-9px, 20px);
color: #363636;
font-weight: 400;
}
.hakkimizda-krc .rakamlarrow .wrakam{
width: 45%;
border-bottom: 1px solid #00000050;
position: relative;
margin-bottom:3rem;
}
.hakkimizda-krc .rakamlarrow .wrakam:nth-child(3){
margin-bottom:0;
}
.hakkimizda-krc .rakamlarrow .wrakam:nth-child(4){
margin-bottom:0;
}
.hakkimizda-krc .rakamlarrow .wrakam::after{
content:"";
position:absolute;
left:0;
bottom:-2px;
width:40%;
height:3px;
background:#E31F2B
}
.hakkimizda-krc .rakamlarrow p{
margin: 0;
display: inline;
width: max-content;
}
.hakkimizda-krc .rakamlarrow span{
font-size: 82px;
line-height: 120%;
}
.hakkimizda-krc .rakamlarrow b{
text-align: right;
width: 100%;
display: inline-block;
transform: translate(-60px, -50px);
}
.hakkimizda-krc .rakamlarrow .odometer{
display: inline-block;
width: max-content;
}
.krc-btn:hover{
color:#E31F2B;
background:#ffffff;
}
.krc-btn{
display:block;
background:#E31F2B;
border:1px solid #E31F2B;
width:max-content;
padding:10px 20px;
border-radius:5px;
color:#ffffff;
margin: 0;
cursor:pointer;
transition:1s;
}
.hakkimizda-krc a.krc-btn{
margin-top:2rem;
}
.sektorel{}
.sektorel h2.desen{
margin-bottom: 0rem;
}
.sektorel h2{
margin-bottom: 3rem;
}
.sektorel .owl-cozumler{}
.sektorel .owl-cozumler .item{
position: relative;
}
.sektorel .owl-cozumler .owl-nav{
display:block!important;
margin-top: 2rem;
}
.sektorel .owl-cozumler .owl-nav button .okimage{
transform: translate(0px, 2px);
}
.sektorel .owl-cozumler .owl-nav button:hover{
background:#DE2431;
border-color:#DE2431!important;
}
.sektorel .owl-cozumler .owl-nav button:hover img{
filter: brightness(0) invert(1);
}
.sektorel .owl-cozumler .owl-nav button{
width:50px;
height:50px;
border: 1px solid #000000!important;
border-radius:50%;
}
.sektorel .owl-cozumler .item .bg{
height: 340px;
overflow: hidden;
width: 100%;
transition:.5s;
}
.sektorel .owl-cozumler .item .bg img{
width: 100%;
height: 100%;
object-fit: cover;
}
.sektorel .owl-cozumler .item .ikon{
position: absolute;
right: 30px;
top: 230px;
transition: 1s;
}
.sektorel .owl-cozumler .item .ikon img{}
.sektorel .owl-cozumler .item .text h6{
width: 70%;
color: #ffffff;
font-weight: 300;
text-shadow: 0px 0px 3px #000000;
}
.sektorel .owl-cozumler .item:hover .text h6{
text-shadow: 0px 0px 0px #000000;
}
.sektorel .owl-cozumler .item:hover .text ul{
opacity:1;
}
.sektorel .owl-cozumler .item .text{
position: absolute;
top: 210px;
left: 0;
padding: 40px;
width: 100%;
transition: 1s;
}
.sektorel .owl-cozumler .item .text ul{
margin-top: 3rem;
margin-bottom: 0;
padding: 0;
opacity: 0;
list-style: none;
transition:1s;
}
.sektorel .owl-cozumler .item .text ul li{
color: #ffffff;
margin-bottom: 0;
position: relative;
font-size: 17px;
margin: 0;
}
.sektorel .owl-cozumler .item .bg::after{
content:"";
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background:transparent;
transition:1s;
}
.sektorel .owl-cozumler .item:hover .bg::after{
background: #DE2431;
}
.sektorel .owl-cozumler .item:hover .bg img{
}
.sektorel .owl-cozumler .item:hover .ikon{
top: 20px;
}
.sektorel .owl-cozumler .item:hover .ikon img{}
.sektorel .owl-cozumler .item:hover .text{
top: 0;
}
.sektorel .owl-cozumler .item:hover .text ul{}
.sektorel .owl-cozumler .item:hover .text ul li{}
.anaurunler{
position: relative;
overflow: hidden;
}
.anaurunler .row{
display: flex;
align-items: stretch;
gap: 3%;
width: 100%;
}
/* SOL PANEL */
.anaurunler .row .tabparent{
width: 32%;
background: #de2431;
clip-path: polygon(0 0, 78% 0, 100% 22%, 100% 100%, 0 100%);
display: grid;
grid-template-columns: 14% auto 20%;
grid-template-rows: 1fr auto auto 1fr;
row-gap: 24px;
min-height: 540px;
align-items: center;
}
.anaurunler .row .tabparent h2{
grid-column: 2;
grid-row: 2;
color: #ffffff;
}
.anaurunler .row .tabparent h2.desen{
color: #ffffff;
}
.anaurunler .row .tabparent ul{
grid-column: 2;
grid-row: 3;
list-style: none;
display: flex;
flex-direction: column;
gap: 6px;
width: 100%;
}
.anaurunler .row .tabparent ul .uruntab{
color: #ffffff;
cursor: pointer;
width: fit-content;
position: relative;
opacity: 0.85;
transition: 0.3s;
}
.anaurunler .row .tabparent ul .uruntab::after{
content: "";
position: absolute;
left: 0;
bottom: 4px;
width: 0;
height: 1px;
background: #ffffff;
transition: 0.4s;
}
.anaurunler .row .tabparent ul .uruntab:hover{
opacity: 1;
}
.anaurunler .row .tabparent ul .uruntab.active{
opacity: 1;
font-weight: 500;
}
.anaurunler .row .tabparent ul .uruntab.active::after{
width: 60%;
}
/* SAÄž PANEL */
.anaurunler .row .urunlerparent{
width: 60%;
display: flex;
flex-direction: column;
gap: 28px;
align-self: center;
margin-right: 0%;
}
.anaurunler .row .urunlerparent .baslikbar{
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
width: 100%;
}
.anaurunler .row .urunlerparent .baslikbar .aktif-baslik{
color: #232323;
font-weight: 500;
letter-spacing: 2px;
}
.anaurunler .row .urunlerparent .baslikbar .navlar{
display: flex;
gap: 14px;
margin-right: 85px;
}
.anaurunler .row .urunlerparent .baslikbar .navlar button{
width: 48px;
height: 48px;
border-radius: 50%;
border: 1px solid #e0e0e0;
background: #ffffff;
cursor: pointer;
color: #232323;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s;
}
.anaurunler .row .urunlerparent .baslikbar .navlar button.next-btn{
background: #de2431;
border-color: #de2431;
color: #ffffff;
}
.anaurunler .row .urunlerparent .baslikbar .navlar button:hover{
background: #de2431;
border-color: #de2431;
color: #ffffff;
}
.anaurunler .row .urunlerparent .baslikbar .navlar button svg{
display: block;
}
/* OWL ITEMS */
.anaurunler .row .urunlerparent .owl-urunler .owl-stage{
display: flex;
}
.anaurunler .row .urunlerparent .owl-urunler .owl-stage .owl-item{
display: flex;
}
.anaurunler .row .urunlerparent .owl-urunler .owl-stage .owl-item > .item{
width: 100%;
}
.anaurunler .row .urunlerparent .owl-urunler .item{
background: #ffffff;
border: 1px solid #e5e5e5;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
transition: 0.35s;
overflow: hidden;
padding: 10px;
margin-left: 10px;
}
.anaurunler .row .urunlerparent .owl-urunler .item .absolelink{
position: absolute;
inset: 0;
z-index: 3;
}
.anaurunler .row .urunlerparent .owl-urunler .item .image{
width: 100%;
aspect-ratio: 4/3;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
background: #ffffff;
}
.anaurunler .row .urunlerparent .owl-urunler .item .image img{
max-width: 72%;
max-height: 85%;
object-fit: contain;
transition: 0.5s;
}
.anaurunler .row .urunlerparent .owl-urunler .item p{
color: #232323;
font-weight: 500;
text-align: center;
width: 78%;
}
.anaurunler .row .urunlerparent .owl-urunler .item .krc-btn{
opacity: 0;
transition: 1s;
}
.anaurunler .row .urunlerparent .owl-urunler .item:hover{
border-color: #de2431;
box-shadow: 0 20px 40px -20px rgba(222,36,49,0.35);
}
.anaurunler .row .urunlerparent .owl-urunler .item:hover .image img{
transform: scale(1.05);
}
.anaurunler .row .urunlerparent .owl-urunler .item:hover .krc-btn{
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
/* RESPONSIVE */
@media (max-width: 991px){
.anaurunler .row{
flex-direction: column;
gap: 40px;
}
.anaurunler .row .tabparent{
width: 100%;
clip-path: polygon(0 0, 85% 0, 100% 15%, 100% 100%, 0 100%);
min-height: 380px;
grid-template-columns: 8% auto 15%;
}
.anaurunler .row .urunlerparent{
width: 100%;
}
}
@media (max-width: 575px){
.anaurunler .row .tabparent{
clip-path: polygon(0 0, 80% 0, 100% 10%, 100% 100%, 0 100%);
min-height: 340px;
}
.anaurunler .row .urunlerparent .owl-urunler .item .krc-btn{
width: 70%;
}
.anaurunler .row .urunlerparent .baslikbar .navlar button{
width: 42px;
height: 42px;
}
}
.anaurunler .row .urunlerparent .uruntab-icerik{
display: none;
width: 100%;
}
.anaurunler .row .urunlerparent .uruntab-icerik.active{
display: block;
animation: uruntabFadeIn 0.5s ease;
}
@keyframes uruntabFadeIn{
from{ opacity: 0; transform: translateY(10px); }
to{ opacity: 1; transform: translateY(0); }
}
.nedenkrc{
position: relative;
text-align: center;
min-height: 100vh;
background: #F2F2F2;
}
.nedenkrc h2{
text-align: center;
margin-bottom: 4rem;
}
.nedenkrc h2.desen{
text-align: center;
display: block;
margin: auto;
width: max-content;
margin-bottom: 1rem;
}
.nedenkrc .backgorsel{
width: max-content;
margin-left: auto;
margin-right: auto;
position: absolute;
left: 35%;
}
.nedenkrc .centergorsel{
width: max-content;
height: max-content;
margin-left: auto;
margin-right: auto;
}
.nedenkrc .backgorsel img{
width: 600px;
height: 600px;
object-fit: contain;
animation: rotate 80s infinite;
}@keyframes rotate{
0%{
transform:rotate(0deg)
}
50%{
transform:rotate(360deg)
}
100%{
transform:rotate(0deg)
}
}
.nedenkrc .centergorsel img{
height: 750px;
width: 750px;
}
.nedenkrc .text-kutu{
position: absolute;
background: #ffffff;
display: flex;
padding: 20px 30px;
max-width: 370px;
align-items: center;
justify-content: flex-start;
text-align: left;
}
.nedenkrc .text-kutu img{
width: 80px;
height: 80px;
object-fit: contain;
margin-right: 10px;
}
.nedenkrc .text-kutu p{
margin: 0;
font-size: 18px;
}
.nedenkrc .text-kutu.kutu-1{
left: 42%;
top: 260px;
}
.nedenkrc .text-kutu.kutu-2{
left: 17%;
top: 460px;
}
.nedenkrc .text-kutu.kutu-3{
left: 65%;
top: 460px;
}
.nedenkrc .text-kutu.kutu-4{
left: 18%;
top: 810px;
}
.nedenkrc .text-kutu.kutu-5{
left: 64%;
top: 810px;
}
.nedenkrc .text-kutu.kutu-6{
left: 40.5%;
top: 970px;
}
.buyuyenhero{
position: relative;
height: 260vh;
background: #ffffff;
}
.buyuyenhero .bh-sticky{
position: sticky;
top: 0;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
margin-left: 5%;
margin-right: 5%;
border-radius: 20px;
}
.buyuyenhero .bh-sticky .bh-gorsel{
--g: 0;
--c: 0;
--w0: 46%;
--h0: 60%;
--r0: 24px;
position: relative;
width: calc(var(--w0) + (100% - var(--w0)) * var(--g));
height: calc(var(--h0) + (100% - var(--h0)) * var(--g));
border-radius: calc(var(--r0) * (1 - var(--g)));
overflow: hidden;
background: linear-gradient(120deg, #2a1c0e, #120a04);
will-change: width, height;
}
.buyuyenhero .bh-sticky .bh-gorsel img{
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-overlay{
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(8,12,16,.85) 0%, rgba(8,12,16,.55) 45%, rgba(8,12,16,.05) 100%);
opacity: var(--c);
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik{
position: absolute;
top: 20%;
left: 3%;
width: 60%;
opacity: var(--c);
transform: translateY(calc((1 - var(--c)) * 40px));
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin{
background: #DE2431;
padding: 80px 40px;
border-radius: 20px;
width: 70%;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin h4{
color: #fff;
font-weight: 500;
margin-bottom: 1rem;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin h4 strong{
color: #F5B335;
display: block;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin p{
color: #e6ebee;
margin-bottom: 1rem;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin a{
font-size: 15px;
border: 1px solid #ffffff;
}
@media (max-width: 1024px){
.buyuyenhero{
height: auto;
}
.buyuyenhero .bh-sticky{
position: relative;
height: auto;
margin-left: 3%;
margin-right: 3%;
}
.buyuyenhero .bh-sticky .bh-gorsel{
width: 100%;
height: 55vh;
border-radius: 20px;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-overlay{
opacity: 1;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik{
top: 50%;
left: 5%;
width: 90%;
opacity: 1;
transform: translateY(-50%);
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin{
width: 70%;
padding: 40px 28px;
}
}
@media (max-width: 768px){
.buyuyenhero .bh-sticky{
margin-left: 4%;
margin-right: 4%;
border-radius: 16px;
}
.buyuyenhero .bh-sticky .bh-gorsel{
height: 50vh;
border-radius: 16px;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-overlay{
background: linear-gradient(180deg, rgba(8,12,16,.15) 0%, rgba(8,12,16,.75) 60%, rgba(8,12,16,.9) 100%);
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik{
top: auto;
bottom: 5%;
left: 0;
width: 100%;
transform: none;
padding: 0 5%;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .container{
max-width: 100%;
padding: 0;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin{
width: 100%;
padding: 24px 20px;
border-radius: 14px;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin h4,
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin p{
margin-bottom: 12px;
}
}
@media (max-width: 480px){
.buyuyenhero .bh-sticky .bh-gorsel{
height: 45vh;
}
.buyuyenhero .bh-sticky .bh-gorsel .bh-icerik .bh-metin{
padding: 20px 18px;
}
}
@media (prefers-reduced-motion: reduce){
.buyuyenhero{
height: 100vh;
}
.buyuyenhero .bh-sticky .bh-gorsel{
--g: 1;
--c: 1;
}
}
.galerti{
background: #D9D9D945;
}
.galerti h2.desen{
margin-bottom:2rem;
width:max-content;margin-left:auto;
margin-right:auto;
}
.galeri-owl .owl-item .item {
height: 650px;
display: flex;
align-items: center;
width: 100%;
padding-bottom: 280px;
}
.galeri-owl .owl-item .item img {
width: 100%;
height: 450px;
object-fit: cover;
border-radius: 20px;
transition: 1.5s
}
.galeri-owl .owl-item.center .item img {
height: 147%;
width: 100%;
transition: 1.5s
}
.galeri-owl .owl-item .item .images {
width: 100%;
height: 100%;
}
.galeri-owl .owl-item .item .text {
position: absolute;
transition: 1.5s;
bottom: 0px;
opacity: 0;
}
.galeri-owl .owl-item.center .item .text {
transition: 1.5s;
opacity: 1;
}
.galeri-owl .owl-item .item h4 {
opacity: 1;
color: #fff;
text-align: center
}
.galeri-owl .owl-item.center .item h4 {
color: #000000;
}
.galeri-owl .owl-nav {
margin: auto;
text-align: center;
margin-top: 2rem;
}
.galerti h3 {
text-align: center;
color: #002456;
font-style: normal;
letter-spacing: -.675px
}
.galerti h3 strong {
display: block
}
@media (max-width: 1550px) {
.galeri-owl .owl-item.center .item img {
height:500px
}
.galeri-owl .owl-item .item {
height: 500px
}
.galeri-owl .owl-item .item img {
height: 400px
}
.galeri-owl .owl-item .item img {
height: 450px
}
}
@media (max-width: 1500px) {
.galeri-owl {
height:640px
}
.galerti h3 {
color: #002456
}
}
@media (max-width: 1400px) {
.galeri-owl .owl-item .item img {
height:300px
}
.galeri-owl .owl-item .item {
height: 400px
}
.galeri-owl .owl-item.center .item img {
height: 400px
}
.galerti h3 {
line-height: normal
}
.galeri-owl {
height: 520px
}
.galeri-owl .owl-item .item img {
height: 300px
}
.galeri-owl .owl-item .item .text {
height: 300px
}
}
@media (max-width: 1300px) {
.pt-48 {
padding-top:30px
}
.pb-48 {
padding-bottom: 30px
}
}
@media (max-width: 1200px) {
.galeri-owl {
height:480px
}
.galeri-owl .owl-nav {
margin: auto;
text-align: center;
margin-top: 2rem
}
}
@media (max-width: 900px) {
.galeri-owl .owl-item .item img {
height:250px
}
.galeri-owl .owl-item.center .item img {
height: 250px
}
.galeri-owl .owl-item .item {
height: 250px
}
.galeri-owl .owl-item .item img {
height: 200px
}
.galeri-owl {
height: 340px
}
.galeri-owl .owl-nav {
margin-top: 1rem
}
}
@media (max-width: 800px) {
.galeri-owl .owl-item .item .text {
height:200px
}
}
@media (max-width: 600px) {
.owl-nav .okimage {
margin-right:0
}
.galerti {
margin-left: 8%;
margin-right: 8%;
padding-top: 0
}
.bggrey {
background: #f8f8f8;
margin-top: 1rem;
margin-bottom: 1rem;
padding-top: 1rem!important;
padding-bottom: 1rem!important
}
.galeri-owl .owl-nav .owl-prev {
margin-right: 5px
}
.galerti.bggrey {
background: #fff!important
}
}
.galerti h1 {
text-align: center;
font-weight: 600;
margin-bottom: 3rem
}
.galerti h1 strong {
line-height: 150%;
color: #f3b40d;
display: block;
font-weight: 400
}
.owl-urunler .owl-nav{
display:none!important;
}
.owl-nav{
display:block!important;
margin-top: 2rem;
}
.owl-nav button .okimage{
transform: translate(0px, 2px);
}
.owl-nav button:hover{
background:#DE2431!important;
border-color:#DE2431!important;
}
.owl-nav button:hover img{
filter: brightness(0) invert(1);
}
.owl-nav button{
width:50px;
height:50px;
border: 1px solid #000000!important;
border-radius:50%;
margin-left:10px;
margin-right:10px;
}
.parallaxpart{
border-top:10px solid #DE2431;
background-image:url(../img/parallax-bg.webp);min-height: 400px;background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;position:relative;height: 400px;display:flex;justify-content:center;align-items:center;padding-top: 5%;padding-bottom: 5%;}
.parallaxpart .absoles{
position:absolute;
left:0;
top:0;
width:100%;
object-fit:contain;
}.parallaxpart .absoles2{
position:absolute;
left:0;
bottom:0;
width:100%;
object-fit:contain;
}
.parallaxpart .textdecor h3{
font-size: 50px;
color: #FFFFFF;
text-align:center;
width:50%;
margin-left:auto;
margin-right:auto;
}
.parallaxpart .textdecor h3 strong{
}
.parallaxpart .textdecor{
width: 85%;
padding-top: 0%;
text-align: center;
}
.parallaxpart .textdecor h5{text-align: left;color:#fff;font-weight:500;text-shadow:1px 1px 5px #000;width: 100%;margin: 2rem auto;}
.parallaxpart .textdecor a{color:#fff;margin-left: auto;margin-right: auto;min-width: 200px;}
.parallaxpart .textdecor .put{text-align:center;width: 40%;margin:auto;position:relative;}
.parallaxpart .textdecor .put input{width: 100%;height:60px;display:flex;justify-content:center;align-items:center;border:0;border-radius:50px;padding-left:20px;background:#002f87;background-color: #ffffff37;border: 1px solid #ffffff40;font-size: 130%;}
.parallaxpart .textdecor .put input::placeholder{color:#fff;}
.parallaxpart .textdecor .put button{background:0 0;border:0;outline:0;position:absolute;color: #fff;background: #323232;width: 50%;height: 100%;top: 0;right: -25px;border-radius: 50px;z-index: 9;cursor: pointer;font-size: 110%;}
.parallaxpart .textdecor .put button img{
position:absolute;
right:40px;
top:23px;
transition:1s;
}
.parallaxpart .textdecor .put button:hover img{
right:30px;
}
@media (max-width:1681px){
.parallaxpart .textdecor{transform:translate(0,40px);}
}
@media (max-width:1300px){
.parallaxpart .textdecor .put{width:40%;}
.parallaxpart .textdecor .put input{height:40px;}
}
@media (max-width:600px){
.parallaxpart .textdecor h5{font-size:20px;width:80%;}
.parallaxpart .textdecor p{margin-top:1rem;}
.parallaxpart .textdecor .put{width:70%;}
.parallaxpart{min-height:200px;height:200px;background-size:cover;background-attachment:local;}
.parallaxpart .textdecor{transform:translate(0,0);}
}
.haberdetay a{
color:#000;
font-weight:bold;
text-decoration:underline;
cursor: pointer;
}
.haberdetay{}
.haberdetay .blogicerik .blog-meta span{
font-weight:bold;
color:#e31f2b
}
.haberdetay .blogicerik{
text-align:center;
}
.haberdetay .w20{
margin-top:auto;
margin-bottom:auto;
}
.haberdetay span time{
display:flex;
justify-content:flex-start;
align-items:center;
}
.haberdetay span img{
width:max-content;
height: max-content;
border-radius: 0;
display: inline-block;
margin: inherit;
}
.haberdetay img{
width: max-content;
height: 450px;
object-fit: contain;
margin-bottom: 3rem;
border-radius: 30px;
margin-left: auto;
margin-right: auto;
}
.haberdetay p{
margin-bottom: 1rem;
}
.haberdetay ul, .haberdetay ol{
margin-bottom: 1rem;
margin-top: 1rem;
list-style: none;
}
.haberdetay ul li{
margin-bottom: .5rem;
}.haberdetay img{
margin-top:2rem
}
.haberdetay h2{
margin: auto;
margin-bottom: 2rem;
color: #df1f2a;
font-size: 28px;
}
.haberdetay h3{
margin-bottom: 2rem;
color: #000;
font-size: 25px;
font-weight: bold;
}
.haberdetay h4{
margin-bottom: .2rem;
color: #111111;
}
.haberdetay h5{
margin-bottom: 2rem;
color: #111111;
}
.haberdetay h6{
margin-bottom: 2rem;
color: #111111;
}
.hata{
border-color:red!important;
border-width:3px!important;
}
.secondnav{
padding-top: 20px;
padding-bottom: 20px;
}
.secondnav ul{
padding: 0;
margin: 0;
list-style: none;
display: flex;
}
.secondnav ul li{
margin-right: 5px;
}
.secondnav ul li a:hover{
background:#E31F2B;
color:#ffffff;
}
.secondnav ul li.dd .dd-menu li a:hover{
color:#fff;
}
.secondnav ul li a{
font-size: 12px;
padding: 15px 20px 15px 20px;
border: 1px solid #E31F2B;
border-radius: 5px;
display: block;
margin: 0;
transition:.5s;
}
.secondnav ul li.active a{
background: #E31F2B;
color: #ffffff;
position:relative;
}
.secondnav ul li.active a::before{
content:"";
width:5px;
height: 25px;
background: #ffffff;
position:absolute;
top: 10px;
left: 10px;
transform:skew(-15deg);
}
/*
a.krc-btn{
display: inline-flex;
align-items: center;
justify-content: center;
background: #E31F2B;
border: 1px solid #E31F2B;
width: max-content;
padding: 10px 20px;
border-radius: 5px;
color: #ffffff;
margin: 0;
transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease, padding 0.5s ease;
position: relative;
overflow: visible;
z-index: 1;
}
BARİYER KOLU (buton üzerinde uzanan çubuk)
a.krc-btn::before{
content: "";
position: absolute;
left: 6px;
bottom: 50%;
width: calc(100% - 22px);
height: 4px;
background: #ffffff;
border-radius: 2px;
transform-origin: left center;
transform: translateY(50%) rotate(0deg);
transition: transform 0.7s cubic-bezier(.34, 1.56, .64, 1);
z-index: 3;
pointer-events: none;
box-shadow: 0 0 0 1px rgba(0,0,0,0.05);
}
a.krc-btn::after{
content: "";
position: absolute;
left: 0;
top: 50%;
width: 10px;
height: 14px;
background: #ffffff;
border-radius: 2px;
transform: translateY(-50%);
z-index: 2;
pointer-events: none;
transition: background 0.4s ease;
}
a.krc-btn:hover{
color: #E31F2B;
background: #ffffff;
border-color: #E31F2B;
padding-left: 26px;
}
a.krc-btn:hover::before{
transform: translateY(50%) rotate(-88deg);
background: #E31F2B;
}
a.krc-btn:hover::after{
background: #E31F2B;
}
*/
.krc-btn{
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
background: #E31F2B;
border: 1px solid #E31F2B;
width: max-content;
padding: 10px 20px 10px 28px;
border-radius: 5px;
color: #ffffff;
margin: 0;
transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease;
position: relative;
overflow: hidden;
z-index: 1;
font-size: 15px;
}
.krc-btn::before{
content: "";
position: absolute;
left: 12px;
top: 50%;
width: 10px;
height: 2px;
background: currentColor;
border-radius: 2px;
transform-origin: left center;
transform: translateY(-50%) rotate(0deg);
transition: transform 0.55s cubic-bezier(.34, 1.4, .64, 1);
opacity: 0.9;
}
.krc-btn:hover{
color: #E31F2B;
background: #ffffff;
border-color: #E31F2B;
}
.krc-btn:hover::before{
transform: translateY(-50%) rotate(-75deg);
}
.slogan{
text-align: center;
}
.slogan h2{
font-weight: 600;
text-align: center;
width: 80%;
margin-left: auto;
margin-right: auto;
margin-bottom: 7rem;
}
.slogan h2 strong{display:inline;font-weight: 600;}
.slogan img{
width: 110px;
height: 70px;
text-align: center;
margin-left: auto;
margin-right: auto;
margin-bottom: 3rem;
}
.slogan .row{}
.slogan .row .w20{
padding-right: 3%;
margin-top: auto;
margin-bottom: auto;
}
.slogan .row .w20 ul{
list-style: none;
padding: 0;
}
.slogan .row .w20 ul li.active{
color:#DE2431;
}
.slogan .row .w20 ul li:after{
content:"";
position:absolute;
left:0;
bottom:-2px;
width:0%;
height:4px;
background:#DE2431;
transition:2s;
}
.slogan .row .w20 ul li.active:after{
width:20%;
}
.slogan .row .w20 ul li{
text-align: left;
font-size: 50px;
color: #2B323A50;
position: relative;
border-bottom: 1px solid #2B323A50;
cursor: pointer;
}
.slogan .row .w40{}
.slogan .row .w40 img{
width: 100%;
height: 100%;
object-fit: cover;
}
.slogan .row .w40{
margin-top: auto;
margin-bottom: auto;
}
.slogan .row .w40 div{}
.slogan .row .w40 div.active{}
.slogan .row .w40 p{
text-align: left;
}
.tarihce{
background: #E31F2B;
position: relative;
overflow: hidden;
color: #ffffff;
}
.tarihce .container .row{
position: relative;
}
/* SOL */
.tarihce .container .row .sol h2.desen{
color: #ffffff;
margin-bottom: 1rem;
}
.tarihce .container .row .sol h2.desen::before{
background: rgba(255,255,255,0.4);
}
.tarihce .container .row .sol h2.desen::after{
background: #ffffff;
}
.tarihce .container .row .sol h2{
color: #ffffff;
line-height: 130%;
font-weight: 300;
margin-bottom: 5rem;
}
/* Yıl vitrin */
.tarihce .container .row .sol .yil-vitrin{
position: relative;
display: inline-flex;
align-items: center;
margin-top: 60px;
padding-left: 90px;
padding-top: 40px;
padding-bottom: 40px;
}
.tarihce .container .row .sol .yil-vitrin::before{
content: "";
position: absolute;
left: 30%;
top: 50%;
transform: translateY(-50%);
width: 420px;
height: 420px;
border: 1px solid rgba(255,255,255,0.35);
border-radius: 50%;
pointer-events: none;
z-index: 1;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin{
color: #ffffff;
font-weight: 300;
line-height: 1;
margin: 0;
display: inline-flex;
position: relative;
z-index: 3;
letter-spacing: -2px;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-sabit{
color: #ffffff;
line-height: 1;
font-size: 215px;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper{
position: relative;
display: inline-block;
overflow: hidden;
line-height: 1;
vertical-align: top;
min-width: 1.3em;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper .yil-degisken{
display: inline-block;
line-height: 1;
color: #ffffff;
font-size: 215px;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper .yil-degisken.leave-up{
position: absolute;
top: 0;
left: 0;
animation: yilCikYukari 0.55s cubic-bezier(.4,0,.2,1) forwards;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper .yil-degisken.leave-down{
position: absolute;
top: 0;
left: 0;
animation: yilCikAsagi 0.55s cubic-bezier(.4,0,.2,1) forwards;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper .yil-degisken.enter-from-down{
animation: yilGelAsagidan 0.55s cubic-bezier(.4,0,.2,1) forwards;
}
.tarihce .container .row .sol .yil-vitrin .yil-metin .yil-degisken-wrapper .yil-degisken.enter-from-up{
animation: yilGelYukaridan 0.55s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes yilCikYukari{
from{ transform: translateY(0); opacity: 1; }
to{ transform: translateY(-100%); opacity: 0; }
}
@keyframes yilCikAsagi{
from{ transform: translateY(0); opacity: 1; }
to{ transform: translateY(100%); opacity: 0; }
}
@keyframes yilGelAsagidan{
from{ transform: translateY(100%); opacity: 0; }
to{ transform: translateY(0); opacity: 1; }
}
@keyframes yilGelYukaridan{
from{ transform: translateY(-100%); opacity: 0; }
to{ transform: translateY(0); opacity: 1; }
}
/* Arka plan yıl */
.tarihce .container .row .sol .yil-vitrin .yil-bg{
position: absolute;
left: 58%;
top: 62%;
color: rgba(255,255,255,0.25);
z-index: 2;
margin: 0;
font-weight: 500;
line-height: 1;
transition: opacity 0.35s ease;
pointer-events: none;
font-size: 215px;
}
.tarihce .container .row .sol .yil-vitrin .yil-bg.gecis{
opacity: 0;
}
/* NAV OKLARI (ortada, dikey) */
.tarihce .container .row .yil-navs{
position: absolute;
left: 50%;
top: 62%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
gap: 12px;
z-index: 5;
}
.tarihce .container .row .yil-navs button{
width: 46px;
height: 46px;
border-radius: 50%;
background: transparent;
border: 1px solid rgba(255,255,255,0.5);
color: #ffffff;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s;
}
.tarihce .container .row .yil-navs button:hover{
background: #ffffff;
color: #E31F2B;
border-color: #ffffff;
}
.tarihce .container .row .yil-navs button:disabled{
opacity: 0.35;
cursor: not-allowed;
}
.tarihce .container .row .yil-navs button:disabled:hover{
background: transparent;
color: #ffffff;
border-color: rgba(255,255,255,0.5);
}
.tarihce .container .row .yil-navs button svg{
display: block;
}
/* SAÄž */
.tarihce .container .row .sag{
padding-left: 8%;
}
.tarihce .container .row .sag .ust-not{
color: #ffffff;
opacity: 0.9;
max-width: 90%;
margin-bottom: 140px;
}
.tarihce .container .row .sag .olaylar-vitrin{
position: relative;
min-height: 500px;
}
.tarihce .container .row .sag .olaylar-vitrin .olay{
padding-top: 20px;
padding-bottom: 20px;
border-bottom: 1px solid rgba(255,255,255,0.3);
opacity: 0;
transform: translateY(15px);
animation: olayGir 0.55s cubic-bezier(.4,0,.2,1) forwards;
}
.tarihce .container .row .sag .olaylar-vitrin .olay:nth-child(1){ animation-delay: 0.15s; }
.tarihce .container .row .sag .olaylar-vitrin .olay:nth-child(2){ animation-delay: 0.28s; }
.tarihce .container .row .sag .olaylar-vitrin .olay:nth-child(3){ animation-delay: 0.41s; }
.tarihce .container .row .sag .olaylar-vitrin .olay:nth-child(4){ animation-delay: 0.54s; }
.tarihce .container .row .sag .olaylar-vitrin .olay:nth-child(5){ animation-delay: 0.67s; }
.tarihce .container .row .sag .olaylar-vitrin .olay:last-child{
border-bottom: none;
}
.tarihce .container .row .sag .olaylar-vitrin .olay h5{
color: #ffffff;
margin-bottom: 8px;
font-weight: 500;
}
.tarihce .container .row .sag .olaylar-vitrin .olay p{
color: #ffffff;
opacity: 0.85;
margin-bottom: 0;
}
@keyframes olayGir{
to{ opacity: 1; transform: translateY(0); }
}
/* RESPONSIVE */
@media (max-width: 991px){
.tarihce .container .row .w50{
width: 100%;
margin: 0;
}
.tarihce .container .row .sag{
padding-left: 0;
margin-top: 40px;
}
.tarihce .container .row .yil-navs{
position: relative;
left: auto;
top: auto;
transform: none;
flex-direction: row;
margin-top: 30px;
width: 100%;
justify-content: center;
}
.tarihce .container .row .sol .yil-vitrin{
padding-left: 70px;
}
.tarihce .container .row .sol .yil-vitrin::before{
width: 180px;
height: 180px;
}
}
@media (max-width: 575px){
.tarihce .container .row .sol .yil-vitrin{
padding-left: 50px;
}
.tarihce .container .row .sol .yil-vitrin::before{
width: 150px;
height: 150px;
}
.tarihce .container .row .sol .yil-vitrin .yil-bg{
left: 60%;
}
}
.sertifikalar h2{
}
.sertifikalar .row .sertifika-kutu{
width: 23%;
margin-top: 2rem;
text-align:center;
}
.sertifikalar .row{justify-content:space-between;}
.sertifikalar .row .sertifika-kutu .sertifika-gorsel{
display:block;
position:relative;
overflow:hidden;
/* border:1px solid #e6e6e6; */
border-radius:.4em;
/* background:#eef1f4; */
cursor:pointer;
width: 100%;
margin-left: auto;
margin-right: auto;
}
.sertifikalar .row .sertifika-kutu .sertifika-gorsel img{
width:100%;
height: 400px;
display:block;
transition:transform .5s ease;
object-fit: contain;
}
.sertifikalar .row .sertifika-kutu .sertifika-gorsel:hover img{transform:scale(1.05);}
.sertifikalar .row .sertifika-kutu h5{margin:0;font-size: 20px;}
@media (max-width:992px){
.sertifikalar .row .sertifika-kutu{width:47%;}
}
@media (max-width:576px){
.sertifikalar .row{justify-content:center;}
.sertifikalar .row .sertifika-kutu{width:100%;}
}
.referanslarimiz{}
.referanslarimiz h2.desen{margin-bottom:2rem;}
.referanslarimiz .row{
justify-content: space-between;
}
.referanslarimiz .referans-kutu{
width: 24%;
margin-top: 2rem;
position: relative;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
padding: 40px;
border: 1px solid #000;
border-radius: 5px;
transition:1s;
}
.referanslarimiz .referans-kutu:hover{
border: 1px solid #DE2431;
}
.referanslarimiz .referans-kutu .absolelink{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9;
margin: 0;
}
.referanslarimiz .referans-kutu img{
height: 160px;
width: 100%;
object-fit: contain;
transition:1s;
}
.referanslarimiz .referans-kutu:hover img{
transform:scale(1.05)
}
.referanslarimiz .referans-kutu h6{
text-align: center;
font-size: 20px;
margin-top: 2rem;
height: 60px;
color: #000000;
transition:1s;
}
.referanslarimiz .referans-kutu:hover h6{
color: #DE2431;
}
.kategoriler .urunkutu .absolelink{
position: absolute;
inset: 0;
z-index: 3;
}
.kategoriler .urunkutu .image{
width: 100%;
aspect-ratio: 4/3;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
background: #ffffff;
}
.kategoriler .urunkutu .image img{
max-width: 72%;
max-height: 85%;
object-fit: contain;
transition: 0.5s;
}
.kategoriler .urunkutu p{
color: #232323;
font-weight: 500;
text-align: center;
margin: 0;
width: 100%;
margin-bottom: 2rem;
}
.kategoriler .row{
justify-content: space-between;
}
.kategoriler .urunkutu{
position: relative;
width: 23%;
border: 1px solid #51515150;
margin-bottom: 2rem;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.kategoriler h2{}
.kategoriler p{}
.kategoriler .urunkutu .krc-btn{
opacity: 0;
transition: 1s;
margin-bottom: 1rem;
}
.kategoriler .urunkutu:hover{
border-color: #de2431;
box-shadow: 0 20px 40px -20px rgba(222,36,49,0.35);
}
.kategoriler .urunkutu :hover .image img{
transform: scale(1.05);
}
.kategoriler .urunkutu:hover .krc-btn{
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.kategoriler .urunkutu:hover .krc-btn::before{
transform: translateY(-50%) rotate(-75deg);
}
.secondnav ul li.dd{
overflow:visible;
position:relative;
cursor:pointer;
border: 1px solid #E31F2B;
border-radius: 5px;
}
.secondnav ul li.dd:hover{
/* background: #ECECEC; */
}
.secondnav ul li.dd:hover .dd-toggle{
color: #e31f2b;
}
.secondnav ul li.dd .dd-toggle{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:100%;
font-weight:700;
background:transparent;
border:none;
cursor:pointer;
}
.secondnav ul li.dd .dd-toggle .dd-ok{
width:12px;
height:12px;
stroke:#232323;
transition:transform .3s ease;
flex-shrink:0;
}
.secondnav ul li.dd.acik .dd-toggle .dd-ok{
transform:rotate(180deg);
}
.secondnav ul li.dd .dd-menu{
list-style:none;
position:absolute;
top:calc(100% + 12px);
left:50%;
transform:translateX(-50%) translateY(-8px);
margin:0;
padding:8px;
min-width:220px;
background:#fff;
border-radius:16px;
box-shadow:0px 8px 24px #00000022;
z-index:50;
opacity:0;
pointer-events:none;
transition:opacity .3s ease, transform .3s ease;
flex-direction: column;
}
.secondnav ul li.dd.acik .dd-menu{
opacity:1;
pointer-events:auto;
transform:translateX(-50%) translateY(0);
}
.secondnav ul li.dd .dd-menu li{
background:transparent;
margin:0;
min-width:0;
overflow:visible;
border-radius:10px;
margin-bottom: .5rem;
}
.secondnav ul li.dd .dd-menu li:hover{
background:#F3F5F8;
}
.secondnav ul li.dd .dd-menu li:hover a{
color: #ffffff;
}
.secondnav ul li.dd .dd-menu li a{
display:block;
width:100%;
text-align:left;
font-size:14px;
font-weight:500;
color:#232323;
padding: 10px 10px;
min-width: 90px;
display: block;
}
.secondnav ul li.dd .dd-menu li.dd-menu-aktif a{
color: #ffffff;
font-weight:700;
background: #E31F2B;
}
@media (max-width:600px){
.secondnav ul li.dd .dd-menu{
min-width:180px;
}
}
.breadcrumb{
padding-top: 6%;
}
.breadcrumb ul{
padding: 0;
list-style: none;
display: flex;
}
.breadcrumb ul li{
margin: 0;
}
.breadcrumb ul li a{
font-size: 15px;
padding: 10px 4px;
}
.breadcrumb ul li:last-child a{
color:#E31F2B;;
font-weight:bold;
}
.urunkat{}
.urunkat .w50{}
.urunkat .w50 img{
width:100%;
height:100%;
object-fit:contain;
position: sticky;
top: 10%;
height: auto;
max-height: 450px;
}
.urunkat .w50 h1{
font-size: 25px;
margin-bottom: 2rem;
}
.urunkat .w50 h6{
margin-bottom: 1rem;
}
.urunkat .w50 p{
margin-bottom: 1rem;
}
.urunkat .w50 p strong{}
.urunkat .w50 p a{}
.urunkat .w50 ul{}
.urunkat .w50 ul li{}
.urunkat .w50 .ikonset{
justify-content: space-between;
margin-top: 2rem;
}
.urunkat .w50 .ikonset .ikonkutu{
width: 30%;
border: 1px solid #DE2431;
border-radius: 5px;
background: #F4F5F8;
padding: 10px 10px;
margin-bottom: 1.5rem;
}
.urunkat .w50 .ikonset .ikonkutu .top{
display: flex;
justify-content: center;
align-items: center;
margin-bottom: .5rem;
}
.urunkat .w50 .ikonset .ikonkutu .top img{
width: 60px;
height: 60px;
object-fit: contain;
margin-right: 15px;
}
.urunkat .w50 .ikonset .ikonkutu .top p{
font-size: 18px;
margin: 0;
}
.urunkat .w50 .ikonset .ikonkutu .bottom{
display: flex;
justify-content: center;
align-items: center;
}
.urunkat .w50 .ikonset .ikonkutu .bottom span{
display: block;
text-align: center;
}
.urunlerteknikozellikler{
position: relative;
}
.urunlerteknikozellikler .container{
border-radius: 20px;
position: relative;
}
.urunlerteknikozellikler .container .tabmenu{
display: flex;
justify-content: center;
gap: 16px;
list-style: none;
padding: 0;
margin: 0;
flex-wrap: wrap;
margin-bottom: 2rem;
margin-top: 0rem;
}
.urunlerteknikozellikler .container .tabmenu .tabteknik{
background: #ffffff;
border: 1px solid #E31F2B;
color: #232323;
cursor: pointer;
line-height: 3;
padding: 0 28px;
border-radius: 6px;
margin: 0;
transition: 0.3s;
letter-spacing: 1px;
user-select: none;
white-space: nowrap;
font-size: 14px;
}
.urunlerteknikozellikler .container .tabmenu .tabteknik.active,
.urunlerteknikozellikler .container .tabmenu .tabteknik:hover{
background: #E31F2B;
color: #ffffff;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik{
display: none;
width: 100%;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik.active{
display: block;
animation: teknikTabFade 0.5s ease;
}
@keyframes teknikTabFade{
from{ opacity: 0; transform: translateY(10px); }
to{ opacity: 1; transform: translateY(0); }
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar{
gap: 3%;
align-items: flex-start;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap{
width: 48.5%;
margin: 0;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .tablo-baslik{
background: #E31F2B;
color: #ffffff;
text-align: center;
line-height: 3;
letter-spacing: 2px;
font-weight: 500;
border-radius: 4px 4px 0 0;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table{
width: 100%;
border-collapse: collapse;
border: 1px solid #ececec;
border-top: none;
margin-bottom: 24px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table tr{
border-bottom: 1px solid #ececec;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table tr:last-child{
border-bottom: none;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table tr:nth-child(even){
background: #fafafa;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table th,
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table td{
padding: 9px 10px;
text-align: left;
line-height: 1.4;
margin: 0;
vertical-align: middle;
font-size: 13px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table th{
color: #232323;
font-weight: 500;
width: 45%;
letter-spacing: 0.5px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table td{
color: #555555;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .teknik-gorseller{
display: flex;
gap: 4%;
flex-wrap: wrap;
justify-content: center;
margin-top: 10px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .teknik-gorseller .teknik-gorsel{
width: 48%;
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .teknik-gorseller .teknik-gorsel img{
max-width: 100%;
height: auto;
display: block;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .teknik-gorseller .teknik-gorsel span{
color: #232323;
letter-spacing: 1px;
text-align: center;
line-height: 1.4;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-metin{
text-align: center;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-metin p{
color: #232323;
line-height: 1.7;
margin: 0 auto;
width: 100%;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar{
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 20px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan{
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
text-align: center;
padding: 22px 12px;
border: 1px solid transparent;
border-radius: 10px;
transition: 0.35s;
cursor: default;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan:hover{
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.04);
transform: translateY(-4px);
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan .ikon{
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan .ikon img{
max-width: 100%;
max-height: 100%;
object-fit: contain;
transition: 0.4s;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan:hover .ikon img{
transform: scale(1.08);
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar .alan span{
color: #232323;
letter-spacing: 1px;
line-height: 1.4;
font-size: 13px;
}
@media (max-width: 1199px){
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar{
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 991px){
.urunlerteknikozellikler .container {
padding: 0px 0% 5%;
}
.urunlerteknikozellikler .container .tabmenu{
position: relative;
left: auto;
top: auto;
transform: none;
margin-top: -70px;
margin-bottom: 40px;
width: 100%;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar{
gap: 30px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap{
width: 100%;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar{
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 575px){
.urunlerteknikozellikler .container .tabmenu{
flex-direction: column;
gap: 10px;
}
.urunlerteknikozellikler .container .tabmenu .tabteknik{
text-align: center;
white-space: normal;
line-height: 1.4;
padding: 12px 20px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .kullanim-alanlar{
grid-template-columns: repeat(2, 1fr);
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table th,
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap table td{
padding: 12px 14px;
}
.urunlerteknikozellikler .container .tekniktab .tab-icerik .tablolar .tablo-wrap .teknik-gorseller .teknik-gorsel{
width: 100%;
}
}
.urunlerteknikozellikler .shadows{
padding: 30px 150px;
box-shadow: 0px 5px 24.6px #00000020;
border-radius: 10px;
}
.teknikservis{}
.teknikservis .w60{}
.teknikservis .w60 h2.desen{}
.teknikservis .w60 h2{}
.teknikservis .w60 p{}
.teknikservis .w60 ul{
padding: 0;
list-style: none;
display: flex;
justify-content: space-around;
align-items: center;
}
.teknikservis .w60 ul li{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-weight: bold;
}
.teknikservis .w60 ul li img{
width: 80px;
height: 80px;
object-fit: contain;
margin-bottom: .3rem;
}
.teknikservis .w40{}
.teknikservis .w40 img{
width: 100%;
height: 100%;
object-fit: contain;
}
.servissurec{
position: relative;
overflow: hidden;
}
.servissurec .container .surec-akis{
position: relative;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
margin-top: 60px;
padding-top: 20px;
}
/* Yatay bağlantı çizgisi */
.servissurec .container .surec-akis .cizgi{
position: absolute;
left: 12.5%;
right: 12.5%;
top: 50px;
height: 2px;
background: #e0e0e0;
z-index: 1;
overflow: hidden;
}
.servissurec .container .surec-akis .cizgi .cizgi-progress{
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
background: linear-gradient(90deg, transparent 0%, #E31F2B 15%, #E31F2B 85%, transparent 100%);
transform: translateX(-100%);
animation: cizgiAk 6s ease-in-out infinite;
}
@keyframes cizgiAk{
0%{ transform: translateX(-100%); }
50%{ transform: translateX(0); }
100%{ transform: translateX(100%); }
}
/* ADIM */
.servissurec .container .surec-akis .adim{
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
animation: adimNefes 6s ease-in-out infinite;
animation-delay: calc(var(--i) * 1.5s);
}
@keyframes adimNefes{
0%, 100%{ transform: translateY(0); }
45%{ transform: translateY(-6px); }
55%{ transform: translateY(-6px); }
}
/* NUMARA (daire) */
.servissurec .container .surec-akis .adim .numara{
width: 70px;
height: 70px;
border-radius: 50%;
background: #E31F2B;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
margin-bottom: 26px;
position: relative;
box-shadow: 0 0 0 0 rgba(227, 31, 43, 0);
animation: numaraAt 6s ease-in-out infinite;
animation-delay: calc(var(--i) * 1.5s);
}
.servissurec .container .surec-akis .adim .numara span{
color: #ffffff;
font-weight: 600;
line-height: 1;
display: inline-block;
transform: scale(1);
transition: transform 0.4s ease;
}
@keyframes numaraAt{
0%, 100%{
box-shadow: 0 0 0 0 rgba(227, 31, 43, 0.5);
transform: scale(1);
}
40%{
box-shadow: 0 0 0 14px rgba(227, 31, 43, 0);
transform: scale(1.12);
}
55%{
box-shadow: 0 0 0 20px rgba(227, 31, 43, 0);
transform: scale(1);
}
}
/* Numara pırıltı yansıması */
.servissurec .container .surec-akis .adim .numara::after{
content: "";
position: absolute;
inset: 0;
border-radius: 50%;
background: radial-gradient(circle at 30% 25%, rgba(255,255,255,0.35) 0%, transparent 45%);
pointer-events: none;
}
/* BAÅžLIK ve METÄ°N */
.servissurec .container .surec-akis .adim h5{
color: #232323;
font-weight: 600;
margin-bottom: 14px;
line-height: 1.3;
}
.servissurec .container .surec-akis .adim p{
color: #555555;
line-height: 1.6;
margin: 0;
max-width: 85%;
}
/* Sırayla vurgulanma efekti (metinler hafif parlar) */
.servissurec .container .surec-akis .adim h5{
animation: baslikParla 6s ease-in-out infinite;
animation-delay: calc(var(--i) * 1.5s);
}
@keyframes baslikParla{
0%, 100%{ color: #232323; }
45%, 55%{ color: #E31F2B; }
}
/* RESPONSIVE */
@media (max-width: 991px){
.servissurec .container .surec-akis{
grid-template-columns: repeat(2, 1fr);
gap: 50px 20px;
}
.servissurec .container .surec-akis .cizgi{
display: none;
}
}
@media (max-width: 575px){
.servissurec .container .surec-akis{
grid-template-columns: 1fr;
gap: 40px;
}
.servissurec .container .surec-akis .adim .numara{
width: 60px;
height: 60px;
}
}
.hizmetlerimiz{
background: #D9D9D945;
}
.hizmetlerimiz .container{}
.hizmetlerimiz .container h2{
}
.hizmetlerimiz .row{
justify-content: space-between;
}
.hizmetlerimiz .row .ikonliste{
margin-top: 3rem;
width: 18%;
text-align: center;
position: relative;
}
.hizmetlerimiz .row .ikonliste::after{
content:"";
position:absolute;
right: -20px;
top:0;
width:1px;
height:100%;
background:#c8c8c8
}
.hizmetlerimiz .row .ikonliste:last-child:after{
width:0px;
}
.hizmetlerimiz .row .ikonliste img{
width: 90px;
height: 90px;
object-fit: contain;
margin-bottom: 1rem;
}
.hizmetlerimiz .row .ikonliste h6{
margin-bottom: 1rem;
}
.hizmetlerimiz .row .ikonliste p{
width: 90%;
margin-left: auto;
margin-right: auto;
}
.teknikservisform{
position: relative;
overflow: hidden;
background: #D9D9D945;
}
.teknikservisform .container .row{
align-items: stretch;
gap: 5%;
}
.teknikservisform .container .row .w50{
width: 47.5%;
margin: 0;
}
.teknikservisform .container .row .form-tarafi h2:last-of-type{
color: #232323;
margin-bottom: 2rem;
}
.teknikservisform .container .row .form-tarafi h2:last-of-type strong{
color: #E31F2B;
display: block;
font-weight: 700;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-row{
display: flex;
gap: 20px;
margin-bottom: 10px;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-row .form-group{
flex: 1;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group{
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 20px;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group.tam{
width: 100%;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group label{
color: #232323;
letter-spacing: 1px;
line-height: 1.3;
font-weight: 500;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group label .zorunlu{
color: #E31F2B;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group input,
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea,
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select{
width: 100%;
padding: 10px 10px;
background: #ffffff;
border: 1px solid #d9d9d9;
border-radius: 6px;
color: #232323;
transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
font-family: inherit;
line-height: 1.4;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group input::placeholder,
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea::placeholder{
color: #a5a5a5;
opacity: 1;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group input:hover,
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea:hover,
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select:hover{
border-color: #b0b0b0;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group input:focus,
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea:focus,
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select:focus{
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.12);
background: #ffffff;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group input.hata,
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea.hata,
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select.hata{
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.15);
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group textarea{
resize: vertical;
min-height: 130px;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap{
position: relative;
width: 100%;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select{
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
padding-right: 42px;
cursor: pointer;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select::-ms-expand{
display: none;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap .select-ok{
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
color: #6d6d6d;
pointer-events: none;
display: inline-flex;
transition: color 0.3s ease, transform 0.3s ease;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select:focus + .select-ok,
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select:hover + .select-ok{
color: #E31F2B;
}
.teknikservisform .container .row .form-tarafi .servis-form .form-group .select-wrap select:focus + .select-ok{
transform: translateY(-50%) rotate(180deg);
}
.teknikservisform .container .row .form-tarafi .servis-form .form-alt{
margin-top: 10px;
}
.teknikservisform .container .row .gorsel-tarafi{
display: flex;
align-items: stretch;
}
.teknikservisform .container .row .gorsel-tarafi .gorsel-wrap{
width: 100%;
height: 100%;
min-height: 500px;
border-radius: 8px;
overflow: hidden;
position: relative;
}
.teknikservisform .container .row .gorsel-tarafi .gorsel-wrap img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
display: block;
transition: transform 8s ease;
}
.teknikservisform .container .row .gorsel-tarafi .gorsel-wrap:hover img{
transform: scale(1.04);
}
@media (max-width: 991px){
.teknikservisform .container .row{
flex-direction: column;
gap: 40px;
}
.teknikservisform .container .row .w50{
width: 100%;
}
.teknikservisform .container .row .gorsel-tarafi{
order: -1;
}
.teknikservisform .container .row .gorsel-tarafi .gorsel-wrap{
min-height: 320px;
}
}
@media (max-width: 575px){
.teknikservisform .container .row .form-tarafi .servis-form .form-row{
flex-direction: column;
gap: 0;
margin-bottom: 0;
}
.teknikservisform .container .row .gorsel-tarafi .gorsel-wrap{
min-height: 240px;
}
}
.haberler{
position: relative;
}
.haberler .container .haber-liste{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
margin-top: 40px;
}
/* KART */
.haberler .container .haber-liste .haber-kart{
background: #ffffff;
border: 1px solid #ececec;
border-radius: 6px;
overflow: hidden;
position: relative;
display: flex;
flex-direction: column;
transition: box-shadow 0.4s ease, transform 0.4s ease, border-color 0.4s ease;
}
.haberler .container .haber-liste .haber-kart .absolelink{
position: absolute;
inset: 0;
z-index: 2;
}
.haberler .container .haber-liste .haber-kart:hover{
border-color: #E31F2B;
box-shadow: 0 25px 50px -25px rgba(227, 31, 43, 0.35);
transform: translateY(-6px);
}
/* GÖRSEL + TARİH */
.haberler .container .haber-liste .haber-kart .gorsel-wrap{
position: relative;
width: 90%;
aspect-ratio: 16 / 10;
overflow: hidden;
/* background: #f5f5f5; */
padding: 16px;
overflow: hidden;
height: 320px;
margin-left: auto;
margin-right: auto;
}
.haberler .container .haber-liste .haber-kart .gorsel-wrap img{
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform 0.7s ease;
}
.haberler .container .haber-liste .haber-kart:hover .gorsel-wrap img{
transform: scale(1.06);
}
.haberler .container .haber-liste .haber-kart .tarih{
position: absolute;
top: 0px;
right: 0px;
background: #E31F2B;
color: #ffffff;
padding: 20px 20px;
z-index: 3;
border-radius: 3px;
box-shadow: 0 6px 18px -6px rgba(227, 31, 43, 0.5);
width: 150px;
text-align: center;
}
.haberler .container .haber-liste .haber-kart .tarih strong{
color: #ffffff;
font-weight: 700;
line-height: 1;
letter-spacing: 1px;
}
.haberler .container .haber-liste .haber-kart .tarih span{
color: #ffffff;
letter-spacing: 1px;
line-height: 1;
opacity: 0.95;
}
/* İÇERİK */
.haberler .container .haber-liste .haber-kart .icerik{
padding: 24px 24px 28px;
display: flex;
flex-direction: column;
flex: 1;
gap: 12px;
}
.haberler .container .haber-liste .haber-kart .icerik .kategori{
color: #E31F2B;
letter-spacing: 1px;
font-weight: 500;
text-transform: none;
line-height: 1;
}
.haberler .container .haber-liste .haber-kart .icerik h5{
color: #232323;
font-weight: 600;
line-height: 1.3;
margin: 0;
transition: color 0.3s ease;
}
.haberler .container .haber-liste .haber-kart:hover .icerik h5{
color: #E31F2B;
}
.haberler .container .haber-liste .haber-kart .icerik p{
color: #6d6d6d;
line-height: 1.6;
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.haberler .container .haber-liste .haber-kart .icerik .krc-btn{
align-self: flex-start;
margin-top: 14px;
opacity: 0;
transform: translateY(10px);
transition: opacity 0.4s ease, transform 0.4s ease;
position: relative;
z-index: 3;
pointer-events: none;
}
.haberler .container .haber-liste .haber-kart:hover .icerik .krc-btn{
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
/* RESPONSIVE */
@media (max-width: 1199px){
.haberler .container .haber-liste{
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
}
@media (max-width: 991px){
.haberler .container .haber-liste{
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 575px){
.haberler .container .haber-liste{
grid-template-columns: 1fr;
}
.haberler .container .haber-liste .haber-kart .icerik{
padding: 20px 20px 24px;
}
.haberler .container .haber-liste .haber-kart .gorsel-wrap .tarih{
padding: 10px 14px;
}
}
.krcbanner.haber h1{
font-size: 35px;
width: 50%;
}
.kariyer{}
.kariyer .w60{}
.kariyer .w60 h2.desen{}
.kariyer .w60 h2{}
.kariyer .w60 p{}
.kariyer .w60 p:last-child{margin-bottom:0;}
.kariyer .w40{}
.kariyer .w40 img{
width:100%;
height:100%;
object-fit:contain;
}
.basvuruformu{
position: relative;
}
.basvuruformu .container h2:last-of-type{
color: #232323;
margin-bottom: 48px;
}
.basvuruformu .container h2:last-of-type strong{
color: #E31F2B;
display: inline;
font-weight: 700;
}
/* BLOK */
.basvuruformu .container .basvuru-form .form-blok{
margin-bottom: 40px;
}
.basvuruformu .container .basvuru-form .form-blok .blok-baslik{
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 24px;
}
.basvuruformu .container .basvuru-form .form-blok .blok-baslik span{
color: #232323;
letter-spacing: 0.5px;
white-space: nowrap;
line-height: 1;
}
.basvuruformu .container .basvuru-form .form-blok .blok-baslik .cizgi{
flex: 1;
height: 1px;
background: #d9d9d9;
}
/* KİŞİSEL BİLGİLER GRID */
.basvuruformu .container .basvuru-form .form-blok .form-grid{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
/* TANITIM GRID */
.basvuruformu .container .basvuru-form .form-blok .tanitim-grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.basvuruformu .container .basvuru-form .form-blok .tanitim-grid .not-alani textarea{
height: 100%;
min-height: 160px;
}
/* FORM GROUP */
.basvuruformu .container .basvuru-form .form-group{
display: flex;
flex-direction: column;
position: relative;
}
/* INPUT / SELECT / TEXTAREA */
.basvuruformu .container .basvuru-form .form-group input[type="text"],
.basvuruformu .container .basvuru-form .form-group input[type="tel"],
.basvuruformu .container .basvuru-form .form-group input[type="email"],
.basvuruformu .container .basvuru-form .form-group textarea,
.basvuruformu .container .basvuru-form .form-group .select-wrap select{
width: 100%;
padding: 16px 20px;
background: #f2f2f2;
border: 1px solid transparent;
border-radius: 4px;
color: #232323;
font-family: inherit;
line-height: 1.4;
transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}
.basvuruformu .container .basvuru-form .form-group input::placeholder,
.basvuruformu .container .basvuru-form .form-group textarea::placeholder{
color: #8a8a8a;
opacity: 1;
}
.basvuruformu .container .basvuru-form .form-group input:hover,
.basvuruformu .container .basvuru-form .form-group textarea:hover,
.basvuruformu .container .basvuru-form .form-group .select-wrap select:hover{
background: #ececec;
}
.basvuruformu .container .basvuru-form .form-group input:focus,
.basvuruformu .container .basvuru-form .form-group textarea:focus,
.basvuruformu .container .basvuru-form .form-group .select-wrap select:focus{
background: #ffffff;
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.12);
}
.basvuruformu .container .basvuru-form .form-group input.hata,
.basvuruformu .container .basvuru-form .form-group textarea.hata,
.basvuruformu .container .basvuru-form .form-group .select-wrap select.hata{
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.05);
}
.basvuruformu .container .basvuru-form .form-group textarea{
resize: vertical;
}
/* SELECT özel ok */
.basvuruformu .container .basvuru-form .form-group .select-wrap{
position: relative;
width: 100%;
}
.basvuruformu .container .basvuru-form .form-group .select-wrap select{
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
padding-right: 44px;
cursor: pointer;
}
.basvuruformu .container .basvuru-form .form-group .select-wrap select::-ms-expand{
display: none;
}
.basvuruformu .container .basvuru-form .form-group .select-wrap .select-ok{
position: absolute;
right: 18px;
top: 50%;
transform: translateY(-50%);
color: #6d6d6d;
pointer-events: none;
display: inline-flex;
transition: color 0.3s ease, transform 0.3s ease;
}
.basvuruformu .container .basvuru-form .form-group .select-wrap select:focus + .select-ok{
color: #E31F2B;
transform: translateY(-50%) rotate(180deg);
}
/* CV YÃœKLEME */
.basvuruformu .container .basvuru-form .form-blok .tanitim-grid .cv-alani{
height: 100%;
}
.basvuruformu .container .basvuru-form .cv-upload{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
min-height: 160px;
border: 1.5px dashed #c9c9c9;
border-radius: 4px;
background: #ffffff;
cursor: pointer;
transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease;
padding: 24px;
margin: 0;
position: relative;
}
.basvuruformu .container .basvuru-form .cv-upload:hover{
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.02);
}
.basvuruformu .container .basvuru-form .cv-upload.dragover{
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.06);
transform: scale(1.005);
}
.basvuruformu .container .basvuru-form .cv-upload.dolu{
border-style: solid;
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.04);
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik{
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
text-align: center;
width: 100%;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-baslik{
display: inline-flex;
align-items: center;
gap: 10px;
color: #E31F2B;
font-weight: 600;
letter-spacing: 0.5px;
line-height: 1;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-baslik svg{
display: block;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-yardim{
color: #8a8a8a;
line-height: 1.4;
letter-spacing: 0.3px;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-secilen{
display: inline-flex;
align-items: center;
gap: 10px;
background: #ffffff;
border: 1px solid #E31F2B;
border-radius: 4px;
padding: 8px 14px;
max-width: 100%;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-secilen .dosya-adi{
color: #232323;
line-height: 1.3;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 220px;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-secilen .dosya-sil{
background: transparent;
border: none;
color: #E31F2B;
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 4px;
line-height: 0;
transition: transform 0.2s ease;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-secilen .dosya-sil:hover{
transform: scale(1.15);
}
/* ALT  KVKK + GÖNDER */
.basvuruformu .container .basvuru-form .form-alt{
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
margin-top: 30px;
flex-wrap: wrap;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk{
display: inline-flex;
align-items: center;
gap: 12px;
cursor: pointer;
user-select: none;
line-height: 1.4;
margin: 0;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk input{
position: absolute;
opacity: 0;
width: 0;
height: 0;
pointer-events: none;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk .kutu{
width: 20px;
height: 20px;
border: 1.5px solid #c9c9c9;
border-radius: 3px;
background: #ffffff;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s;
position: relative;
flex-shrink: 0;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk .kutu::after{
content: "";
width: 6px;
height: 10px;
border: solid #ffffff;
border-width: 0 2px 2px 0;
transform: rotate(45deg) scale(0);
transition: transform 0.25s ease;
margin-top: -2px;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk input:checked + .kutu{
background: #E31F2B;
border-color: #E31F2B;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk input:checked + .kutu::after{
transform: rotate(45deg) scale(1);
}
.basvuruformu .container .basvuru-form .form-alt .kvkk input:focus-visible + .kutu{
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.25);
}
.basvuruformu .container .basvuru-form .form-alt .kvkk input.hata + .kutu{
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.2);
}
.basvuruformu .container .basvuru-form .form-alt .kvkk .metin{
color: #232323;
line-height: 1.4;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk .metin a{
color: #232323;
text-decoration: underline;
margin: 0;
font-size: inherit;
}
.basvuruformu .container .basvuru-form .form-alt .kvkk .metin a:hover{
color: #E31F2B;
}
.basvuruformu .container .basvuru-form .form-alt .gonder-btn{
background: #E31F2B;
color: #ffffff;
border: 1px solid #E31F2B;
border-radius: 4px;
padding: 14px 40px;
cursor: pointer;
letter-spacing: 2px;
font-weight: 600;
transition: 0.35s;
line-height: 1.2;
}
.basvuruformu .container .basvuru-form .form-alt .gonder-btn:hover{
background: #ffffff;
color: #E31F2B;
}
@media (max-width: 991px){
.basvuruformu .container .basvuru-form .form-blok .form-grid{
grid-template-columns: repeat(2, 1fr);
}
.basvuruformu .container .basvuru-form .form-blok .tanitim-grid{
grid-template-columns: 1fr;
}
}
@media (max-width: 575px){
.basvuruformu .container .basvuru-form .form-blok .form-grid{
grid-template-columns: 1fr;
}
.basvuruformu .container .basvuru-form .form-alt{
flex-direction: column;
align-items: stretch;
}
.basvuruformu .container .basvuru-form .form-alt .gonder-btn{
width: 100%;
}
.basvuruformu .container .basvuru-form .cv-upload{
min-height: 140px;
}
.basvuruformu .container .basvuru-form .cv-upload .cv-icerik .cv-secilen .dosya-adi{
max-width: 160px;
}
}
.iletisim{}
.iletisim .w40{}
.iletisim .w40 h2.desen{
margin-bottom:1rem;
}
.iletisim .w40 h2{
margin-bottom:2rem;
}
.iletisim .w40 a{
display: flex;
margin: 0;
align-items: center;
}
.iletisim .w40 a img{
width:40px;
height:40px;
object-fit:contain;
margin-right: 15px;
}
.iletisim .w40 ul {
list-style: none;
padding: 0;
list-style: none;
display: flex;
margin-top: 3rem;
}
.iletisim .w40 ul li{
margin: 0;
}
.iletisim .w40 ul li a{}
.iletisim .w40 ul li a img{}
.iletisim .w60{}
.iletisim .w60 iframe{
height:100%;
}
.iletisimformu{
position: relative;
}
.iletisimformu .container .iletisim-form .form-blok{
margin-bottom: 30px;
}
.iletisimformu .container .iletisim-form .form-blok .blok-baslik{
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 30px;
}
.iletisimformu .container .iletisim-form .form-blok .blok-baslik span{
color: #232323;
letter-spacing: 0.5px;
white-space: nowrap;
line-height: 1;
}
.iletisimformu .container .iletisim-form .form-blok .blok-baslik .cizgi{
flex: 1;
height: 1px;
background: #d9d9d9;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid{
display: grid;
grid-template-columns: 1fr 1.4fr;
gap: 40px;
align-items: stretch;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid .sol-alanlar{
display: flex;
flex-direction: column;
gap: 16px;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid .sag-alan{
display: flex;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid .sag-alan .mesaj-alani{
width: 100%;
display: flex;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid .sag-alan .mesaj-alani textarea{
width: 100%;
min-height: 100%;
height: auto;
resize: vertical;
}
.iletisimformu .container .iletisim-form .form-group{
display: flex;
flex-direction: column;
position: relative;
}
.iletisimformu .container .iletisim-form .form-group input[type="text"],
.iletisimformu .container .iletisim-form .form-group input[type="email"],
.iletisimformu .container .iletisim-form .form-group textarea{
width: 100%;
padding: 18px 22px;
background: #f2f2f2;
border: 1px solid transparent;
border-radius: 4px;
color: #232323;
font-family: inherit;
line-height: 1.4;
transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}
.iletisimformu .container .iletisim-form .form-group input::placeholder,
.iletisimformu .container .iletisim-form .form-group textarea::placeholder{
color: #8a8a8a;
opacity: 1;
}
.iletisimformu .container .iletisim-form .form-group input:hover,
.iletisimformu .container .iletisim-form .form-group textarea:hover{
background: #ececec;
}
.iletisimformu .container .iletisim-form .form-group input:focus,
.iletisimformu .container .iletisim-form .form-group textarea:focus{
background: #ffffff;
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.12);
}
.iletisimformu .container .iletisim-form .form-group input.hata,
.iletisimformu .container .iletisim-form .form-group textarea.hata{
border-color: #E31F2B;
background: rgba(227, 31, 43, 0.05);
}
.iletisimformu .container .iletisim-form .form-alt{
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
margin-top: 20px;
flex-wrap: wrap;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk{
display: inline-flex;
align-items: center;
gap: 12px;
cursor: pointer;
user-select: none;
line-height: 1.4;
margin: 0;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk input{
position: absolute;
opacity: 0;
width: 0;
height: 0;
pointer-events: none;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk .kutu{
width: 20px;
height: 20px;
border: 1.5px solid #c9c9c9;
border-radius: 3px;
background: #ffffff;
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s;
position: relative;
flex-shrink: 0;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk .kutu::after{
content: "";
width: 6px;
height: 10px;
border: solid #ffffff;
border-width: 0 2px 2px 0;
transform: rotate(45deg) scale(0);
transition: transform 0.25s ease;
margin-top: -2px;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk input:checked + .kutu{
background: #E31F2B;
border-color: #E31F2B;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk input:checked + .kutu::after{
transform: rotate(45deg) scale(1);
}
.iletisimformu .container .iletisim-form .form-alt .kvkk input:focus-visible + .kutu{
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.25);
}
.iletisimformu .container .iletisim-form .form-alt .kvkk input.hata + .kutu{
border-color: #E31F2B;
box-shadow: 0 0 0 3px rgba(227, 31, 43, 0.2);
}
.iletisimformu .container .iletisim-form .form-alt .kvkk .metin{
color: #232323;
line-height: 1.4;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk .metin a{
color: #232323;
text-decoration: underline;
margin: 0;
font-size: inherit;
}
.iletisimformu .container .iletisim-form .form-alt .kvkk .metin a:hover{
color: #E31F2B;
}
.iletisimformu .container .iletisim-form .form-alt .gonder-btn{
background: #E31F2B;
color: #ffffff;
border: 1px solid #E31F2B;
border-radius: 4px;
padding: 14px 44px;
cursor: pointer;
letter-spacing: 2px;
font-weight: 600;
transition: 0.35s;
line-height: 1.2;
}
.iletisimformu .container .iletisim-form .form-alt .gonder-btn:hover{
background: #ffffff;
color: #E31F2B;
}
@media (max-width: 991px){
.iletisimformu .container .iletisim-form .form-blok .form-grid{
grid-template-columns: 1fr;
gap: 20px;
}
.iletisimformu .container .iletisim-form .form-blok .form-grid .sag-alan .mesaj-alani textarea{
min-height: 180px;
}
}
@media (max-width: 575px){
.iletisimformu .container .iletisim-form .form-alt{
flex-direction: column;
align-items: stretch;
}
.iletisimformu .container .iletisim-form .form-alt .gonder-btn{
width: 100%;
}
.iletisimformu .container .iletisim-form .form-group input,
.iletisimformu .container .iletisim-form .form-group textarea{
padding: 16px 18px;
}
}
@media (min-width: 1201px){
.anamenuu{
display: block;
}
}
@media (max-width: 1200px){
.anamenuu{
display: none;
}
}
.anamenuu{
position:fixed;
z-index:8;
width: 100%;
}
.anamenuu .takip{
}
.anamenuu .ust-bar{
background: rgba(255,255,255,0.1);
backdrop-filter: blur(6px);
transition: max-height 0.4s ease, opacity 0.4s ease, background 0.4s ease;
max-height: 32px;
overflow: hidden;
opacity: 1;
}
.anamenuu .ust-bar .container{
display: flex;
align-items: center;
height: 32px;
}
.anamenuu .ust-bar .container span{
color: #fff;
text-transform: uppercase;
letter-spacing: 0.5px;
transition: color 0.4s ease;
}
.anamenuu .ana-nav{
background: transparent;
transition: background 0.4s ease, box-shadow 0.4s ease;
}
.anamenuu .ana-nav .container .nav-ic{
display: flex;
align-items: center;
justify-content: space-between;
height: 110px;
transition: height 0.4s ease;
}
.anamenuu .ana-nav .container .nav-ic .logo{
flex-shrink: 0;
margin: 0;
display: flex;
align-items: center;
transition: transform 0.4s ease;
}
.anamenuu .ana-nav .container .nav-ic .logo img{
height: 75px;
width: auto;
transition: height 0.4s ease, filter 0.4s ease;
/* Başta beyaz logo görünmesi için */
filter: brightness(0) invert(1);
}
.anamenuu .ana-nav .container .nav-ic .menu-liste{
display: flex;
align-items: center;
list-style: none;
margin: 0;
padding: 0;
flex: 1;
justify-content: flex-end;
gap: 0;
margin-right: 20px;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li{
position: relative;
margin: 0;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li a{
color: #fff;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 6px;
padding: 30px 16px;
margin: 0;
white-space: nowrap;
transition: color 0.3s ease, padding 0.4s ease;
letter-spacing: 0.3px;
font-size: 16px;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li a svg{
transition: transform 0.3s ease;
opacity: 0.7;
flex-shrink: 0;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li:hover > a{
color: #E31F2B;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li:hover > a svg{
transform: rotate(180deg);
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown{
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(10px);
background: #fff;
border-radius: 12px;
box-shadow: 0 12px 40px rgba(0,0,0,0.15);
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
z-index: 100;
min-width: 220px;
overflow: hidden;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li:hover .dropdown{
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0);
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown ul{
list-style: none;
margin: 0;
padding: 8px 0;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown ul li{
margin: 0;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown ul li a{
color: #333;
padding: 12px 24px;
text-transform: none;
white-space: nowrap;
transition: background 0.2s ease, color 0.2s ease;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown ul li a:hover{
background: #f6f6f6;
color: #E31F2B;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-basit ul li a .kat-ikon{
display: none;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler{
min-width: 280px;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a{
display: flex;
align-items: center;
gap: 14px;
padding: 12px 20px;
position: relative;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a::after{
content: "";
position: absolute;
left: 20px;
right: 20px;
bottom: 0;
height: 1px;
background: rgba(227,31,43,0.1);
transition: background 0.3s ease;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li:last-child a::after{
display: none;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a .kat-ikon{
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a .kat-ikon img{
max-width: 100%;
max-height: 100%;
object-fit: contain;
opacity: 0.75;
transition: opacity 0.3s ease, transform 0.3s ease;
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a:hover .kat-ikon img{
opacity: 1;
transform: scale(1.08);
}
.anamenuu .ana-nav .container .nav-ic .menu-liste li .dropdown-urunler ul li a .kat-ad{
color: inherit;
padding: 0;
margin: 0;
font-weight: 500;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag{
display: flex;
align-items: center;
gap: 12px;
flex-shrink: 0;
}
.nav-sag .arama-btn{
background: none;
border: 1px solid rgba(255,255,255,0.4);
border-radius: 50%;
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #fff;
transition: border-color 0.3s ease, background 0.3s ease, color 0.3s ease;
}
.nav-sag .arama-btn:hover{
border-color: #E31F2B;
background: rgba(227,31,43,0.1);
color: #E31F2B;
}
.nav-sag .dil-sec{
position: relative;
}
.nav-sag .dil-sec .dil-aktif{
background: none;
border: none;
color: #fff;
cursor: pointer;
display: flex;
align-items: center;
gap: 5px;
padding: 8px 12px;
transition: color 0.3s ease;
}
.nav-sag .dil-sec .dil-aktif:hover{
color: #E31F2B;
}
.nav-sag .dil-sec .dil-aktif svg{
transition: transform 0.3s ease;
opacity: 0.7;
}
.nav-sag .dil-sec .dil-dropdown{
position: absolute;
top: 100%;
right: 0;
background: #fff;
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0,0,0,0.12);
min-width: 80px;
opacity: 0;
visibility: hidden;
transform: translateY(8px);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
overflow: hidden;
z-index: 100;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .dil-sec:hover .dil-dropdown{
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .dil-sec:hover .dil-aktif svg{
transform: rotate(180deg);
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .dil-sec .dil-dropdown a{
display: block;
padding: 10px 20px;
color: #333;
margin: 0;
transition: background 0.2s ease;
text-align: center;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .dil-sec .dil-dropdown a:hover{
background: #f5f5f5;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .dil-sec .dil-dropdown a.active{
color: #E31F2B;
font-weight: 600;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .iletisim-btn{
background: #E31F2B;
color: #fff;
border-radius: 6px;
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 14px;
margin: 0;
white-space: nowrap;
transition: background 0.3s ease, padding 0.4s ease;
text-transform: uppercase;
letter-spacing: 0.3px;
font-size: 16px;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .iletisim-btn:hover{
background: #c4161f;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .iletisim-btn svg path{
fill: transparent;
color: #de2431;
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .iletisim-btn svg circle{
}
.anamenuu .ana-nav .container .nav-ic .nav-sag .iletisim-btn svg{
flex-shrink: 0;
opacity: 0.9;
width: 32px;
height: 32px;
background: #ffffff;
border-radius: 50%;
}
.anamenuu.takip .ust-bar{
max-height: 0;
opacity: 0;
padding: 0;
}
.anamenuu.takip .ana-nav{
background: #fff;
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.anamenuu.takip .ana-nav .container .nav-ic{
height: 68px;
}
.anamenuu.takip .ana-nav .container .nav-ic .logo img{
height: 42px;
filter: none;
}
.anamenuu.takip .ana-nav .container .nav-ic .menu-liste li a{
color: #232323;
padding: 22px 16px;
}
.anamenuu.takip .ana-nav .container .nav-ic .menu-liste li:hover > a{
color: #E31F2B;
}
.anamenuu.takip .ana-nav .container .nav-ic .nav-sag .arama-btn{
border-color: rgba(0,0,0,0.15);
color: #232323;
}
.anamenuu.takip .ana-nav .container .nav-ic .nav-sag .arama-btn:hover{
border-color: #E31F2B;
color: #E31F2B;
}
.anamenuu.takip .ana-nav .container .nav-ic .nav-sag .dil-sec .dil-aktif{
color: #232323;
}
.anamenuu.takip .ana-nav .container .nav-ic .nav-sag .dil-sec .dil-aktif:hover{
color: #E31F2B;
}
.anamenuu.takip .ana-nav .container .nav-ic .nav-sag .iletisim-btn{
padding: 10px 22px;
}
.arama-modal{
position: fixed;
inset: 0;
background: rgba(0,0,0,0.65);
z-index: 2000;
display: flex;
align-items: flex-start;
justify-content: center;
padding-top: 15vh;
opacity: 0;
visibility: hidden;
transition: opacity 0.35s ease, visibility 0.35s ease;
backdrop-filter: blur(4px);
}
.arama-modal.aktif{
opacity: 1;
visibility: visible;
}
.arama-modal .arama-modal-ic{
width: 90%;
max-width: 680px;
position: relative;
}
.arama-modal .arama-modal-ic .arama-kutu{
display: flex;
align-items: center;
background: #fff;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 20px 60px rgba(0,0,0,0.25);
transform: translateY(-20px);
transition: transform 0.35s cubic-bezier(.4,0,.2,1);
}
.arama-modal.aktif .arama-modal-ic .arama-kutu{
transform: translateY(0);
}
.arama-modal .arama-modal-ic .arama-kutu input{
flex: 1;
border: none;
padding: 22px 28px;
color: #333;
background: transparent;
}
.arama-modal .arama-modal-ic .arama-kutu input::placeholder{
color: #999;
}
.arama-modal .arama-modal-ic .arama-kutu button{
background: #E31F2B;
border: none;
color: #fff;
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
flex-shrink: 0;
margin: 4px;
border-radius: 12px;
transition: background 0.3s ease;
}
.arama-modal .arama-modal-ic .arama-kutu button:hover{
background: #c4161f;
}
.arama-modal .arama-modal-ic .arama-kapat{
position: absolute;
top: -50px;
right: 0;
background: none;
border: none;
color: #fff;
cursor: pointer;
opacity: 0.7;
transition: opacity 0.3s ease;
}
.arama-modal .arama-modal-ic .arama-kapat:hover{
opacity: 1;
}
.footer{
position: relative;
}
.footer .desen{
position: absolute;
top: 0;
right: 0;
width: 30%;
height: 80%;
}
.footer .desen img{
width: 100%;
height: 100%;
object-fit: contain;
}
.footer .row{}
.footer .row .w40{
background: #2B2B2B;
padding: 60px 5% 140px 5%;
margin: 0;
width: 40%;
}
.footer .row .w40 img{
display: block;
filter: brightness(0) invert(1);
width: 40%;
margin-bottom: 2rem;
}
.footer .row .w40 a img{
width:max-content;
margin: 0;
}
.footer .row .w40 a{
display: flex;
justify-content: flex-start;
align-items: center;
margin-top: 1rem;
color: #ffffff;
margin-bottom: 1rem;
}
.footer .row .w40 ul{
padding: 0;
list-style: none;
display: flex;
justify-content: flex-start;
align-items: center;
margin: 0;
}
.footer .row .w40 ul li{}
.footer .row .w40 ul li a{
margin: 0;
}
.footer .row .w40 ul li a img{}
.footer .row .w40 .desginied{
display: flex;
justify-content: flex-start;
align-items: center;
color: #fff;
position: absolute;
bottom: 0;
gap: 3px;
font-size: 13px;
}
.footer .row .w40 .desginied a{
font-size: 13px;
}
.footer .row .w30 .iletsec{
}
.footer .row .w30 .iletsec a{
margin: 0;
display: flex;
justify-content: flex-start;
align-items: center;
color: #ffffff;
margin-bottom: 3rem;
gap: 10px;
}
.footer .row .w30 .iletsec a img{}
.footer .row .w30{
padding: 60px 2%;
background: #DE2431;
}
.footer .row .w30 .ilet{}
.footer .row .w30 .ilet ul{
padding: 0;
}
.footer .row .w30 .ilet ul li{
list-style:none;
}
.footer .row .w30 .ilet ul li a{
text-transform: uppercase;
color: #ffffff;
}
.footer .row .w30 .ilet ul li a span{
text-transform: uppercase;
color: #ffffff;
font-size:inherit;
}
@media (max-width: 1200px){
.secondnav ul{
flex-wrap: wrap;
gap: 5px;
}
.secondnav ul li{
margin-right: 0;
flex: 0 0 calc((100% - 15px) / 4);
}
}
@media (max-width: 991px){
.secondnav ul li{
flex: 0 0 calc((100% - 10px) / 3);
}
}
@media (max-width: 767px){
.secondnav ul li{
flex: 0 0 calc((100% - 5px) / 2);
}
}
@media (max-width: 480px){
.secondnav ul li{
flex: 0 0 100%;
}
}
.kategoriler .urunkutu .teklif-tetik.absolelink{
cursor: pointer;
}
.teklif-modal{
position: fixed;
inset: 0;
background: rgba(0,0,0,0.65);
z-index: 3000;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
opacity: 0;
visibility: hidden;
transition: opacity 0.35s ease, visibility 0.35s ease;
backdrop-filter: blur(4px);
}
.teklif-modal.aktif{
opacity: 1;
visibility: visible;
}
.teklif-modal .teklif-modal-ic{
background: #fff;
border-radius: 16px;
padding: 40px;
width: 100%;
max-width: 640px;
max-height: 90vh;
overflow-y: auto;
position: relative;
transform: translateY(-20px) scale(0.96);
transition: transform 0.35s cubic-bezier(.4,0,.2,1);
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.teklif-modal.aktif .teklif-modal-ic{
transform: translateY(0) scale(1);
}
.teklif-modal .teklif-modal-ic .teklif-kapat{
position: absolute;
top: 16px;
right: 16px;
background: #f5f5f5;
border: none;
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #333;
transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.teklif-modal .teklif-modal-ic .teklif-kapat:hover{
background: #E31F2B;
color: #fff;
transform: rotate(90deg);
}
.teklif-modal .teklif-modal-ic .teklif-baslik{
margin-bottom: 24px;
padding-right: 40px;
}
.teklif-modal .teklif-modal-ic .teklif-baslik h4{
color: #232323;
font-weight: 600;
margin-bottom: 8px;
}
.teklif-modal .teklif-modal-ic .teklif-baslik p{
color: #666;
margin: 0;
}
.teklif-modal .teklif-modal-ic .teklif-baslik p .teklif-urun-adi{
color: #E31F2B;
font-weight: 600;
font-size: inherit;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-satir{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan{
margin-bottom: 16px;
display: flex;
flex-direction: column;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-satir .teklif-alan{
margin-bottom: 0;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan label{
color: #333;
margin-bottom: 8px;
font-weight: 500;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan label .zorunlu{
color: #E31F2B;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan input[type="text"],
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan input[type="email"],
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan input[type="tel"],
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan textarea{
background: #f8f8f8;
border: 1px solid #e5e5e5;
border-radius: 8px;
padding: 14px 16px;
color: #232323;
width: 100%;
transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
font-family: inherit;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan input:focus,
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan textarea:focus{
border-color: #E31F2B;
background: #fff;
box-shadow: 0 0 0 3px rgba(227,31,43,0.1);
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan input.hata,
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan textarea.hata{
border-color: #E31F2B;
background: rgba(227,31,43,0.03);
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-alan textarea{
resize: vertical;
min-height: 100px;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-kvkk{
margin-top: 8px;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-kvkk label{
display: flex;
align-items: flex-start;
gap: 10px;
cursor: pointer;
font-weight: 400;
margin-bottom: 0;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-kvkk input[type="checkbox"]{
width: 18px;
height: 18px;
margin: 3px 0 0 0;
flex-shrink: 0;
accent-color: #E31F2B;
cursor: pointer;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-kvkk span{
color: #555;
line-height: 1.4;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-kvkk span a{
color: #E31F2B;
text-decoration: underline;
margin: 0;
font-size: inherit;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-btn-alan{
margin-top: 24px;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-btn-alan .krc-btn{
width: 100%;
justify-content: center;
padding: 16px 28px;
border: none;
cursor: pointer;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-sonuc{
margin-top: 16px;
padding: 0;
border-radius: 8px;
text-align: center;
display: none;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-sonuc.basari{
display: block;
padding: 14px;
background: rgba(25,135,84,0.1);
color: #198754;
border: 1px solid rgba(25,135,84,0.3);
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-sonuc.hata{
display: block;
padding: 14px;
background: rgba(227,31,43,0.1);
color: #E31F2B;
border: 1px solid rgba(227,31,43,0.3);
}
@media (max-width: 600px){
.teklif-modal .teklif-modal-ic{
padding: 28px 22px;
border-radius: 12px;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-satir{
grid-template-columns: 1fr;
gap: 0;
margin-bottom: 0;
}
.teklif-modal .teklif-modal-ic .teklif-form .teklif-satir .teklif-alan{
margin-bottom: 16px;
}
}
.sidenav .mobile-menu-links .mm-dil{
display: flex;
gap: 10px;
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,0.1);
}
.sidenav .mobile-menu-links .mm-dil a{
flex: 1;
text-align: center;
padding: 12px;
border: 1px solid rgb(222 30 42);
border-radius: 6px;
color: #fff;
margin: 0;
transition: background 0.3s ease, border-color 0.3s ease;
color: #000000;
}
.sidenav .mobile-menu-links .mm-dil a.active{
background: #E31F2B;
border-color: #E31F2B;
color: #ffffff;
}
.krcbanner.aramabanner{
/* background: #2c2c2c; */
/* min-height: 320px; */
/* display: flex; */
/* align-items: center; */
/* position: relative; */
}
.krcbanner.aramabanner .izlencetext{
/* opacity: 1; */
/* position: relative; */
/* z-index: 2; */
/* width: 86%; */
/* margin: 0 auto; */
}
.krcbanner.aramabanner .izlencetext h1{
color: #fff;
margin-bottom: 16px;
}
.krcbanner.aramabanner .izlencetext h1 span{
color: #ffffff;
font-size: inherit;
}
.arama-sonuc .container .arama-tekrar{
display: flex;
align-items: center;
background: #f8f8f8;
border: 1px solid #e5e5e5;
border-radius: 10px;
overflow: hidden;
max-width: 640px;
margin-bottom: 40px;
}
.arama-sonuc .container .arama-tekrar input{
flex: 1;
border: none;
background: transparent;
padding: 16px 20px;
color: #232323;
}
.arama-sonuc .container .arama-tekrar button{
background: #E31F2B;
color: #fff;
border: none;
padding: 16px 28px;
cursor: pointer;
transition: background 0.3s ease;
}
.arama-sonuc .container .arama-tekrar button:hover{
background: #c4161f;
}
.arama-sonuc .container .sonuc-sayisi{
color: #666;
margin-bottom: 40px;
}
.arama-sonuc .container .sonuc-sayisi strong{
color: #E31F2B;
}
.arama-sonuc .container .sonuc-grup{
margin-bottom: 60px;
}
.arama-sonuc .container .sonuc-grup .row{
/* display: grid; */
/* grid-template-columns: repeat(1, 1fr); */
/* gap: 24px; */
}
.arama-sonuc .container .sonuc-yok{
text-align: center;
padding: 60px 0;
}
.arama-sonuc .container .sonuc-yok h3{
color: #232323;
margin-bottom: 12px;
}
.arama-sonuc .container .sonuc-yok p{
color: #666;
margin-bottom: 32px;
}
.arama-sonuc .container .sonuc-yok .yararli-linkler{
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}
@media (max-width: 1200px){
.arama-sonuc .container .sonuc-grup .row{
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 900px){
.arama-sonuc .container .sonuc-grup .row{
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 600px){
.arama-sonuc .container .sonuc-grup .row{
grid-template-columns: 1fr;
}
.arama-sonuc .container .arama-tekrar button{
padding: 16px 20px;
}
}
/* ============ CTA WIDGET ============ */
.cta-widget{
position: fixed;
bottom: 32px;
right: 32px;
z-index: 999;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 12px;
}
/* Seçenekler */
.cta-widget .cta-secenekler{
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 12px;
pointer-events: none;
}
.cta-widget .cta-secenekler .cta-item{
display: flex;
align-items: center;
gap: 12px;
opacity: 0;
transform: translateY(16px) scale(0.9);
transition: opacity 0.3s ease, transform 0.3s ease;
}
.cta-widget.acik .cta-secenekler{
pointer-events: auto;
}
.cta-widget.acik .cta-secenekler .cta-item{
opacity: 1;
transform: translateY(0) scale(1);
}
/* Etiketler */
.cta-widget .cta-secenekler .cta-item .cta-etiket{
background: #fff;
color: #232323;
border-radius: 8px;
padding: 6px 14px;
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
white-space: nowrap;
pointer-events: none;
transition: opacity 0.3s ease;
opacity: 0;
font-weight: 500;
}
.cta-widget.acik .cta-secenekler .cta-item .cta-etiket{
opacity: 1;
}
/* Butonlar */
.cta-widget .cta-secenekler .cta-item .cta-btn{
width: 52px;
height: 52px;
border-radius: 50%;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 20px rgba(0,0,0,0.18);
transition: transform 0.25s ease, box-shadow 0.25s ease;
flex-shrink: 0;
text-decoration: none;
margin: 0;
}
.cta-widget .cta-secenekler .cta-item .cta-btn:hover{
transform: scale(1.08);
box-shadow: 0 8px 24px rgba(0,0,0,0.22);
}
.cta-widget .cta-secenekler .cta-item .cta-form-tetik{
background: #E31F2B;
color: #fff;
}
.cta-widget .cta-secenekler .cta-item .cta-whatsapp{
background: #25D366;
color: #fff;
}
.cta-widget .cta-secenekler .cta-item .cta-tel{
background: #0e0e0e;
color: #fff;
}
.cta-widget .cta-secenekler .cta-item .cta-tel svg{
stroke: #fff;
}
/* Ana tetikleyici */
.cta-widget .cta-tetik{
width: 60px;
height: 60px;
border-radius: 50%;
background: #E31F2B;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 24px rgba(227,31,43,0.45);
transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
position: relative;
flex-shrink: 0;
color: #fff;
}
.cta-widget .cta-tetik:hover{
transform: scale(1.08);
box-shadow: 0 8px 28px rgba(227,31,43,0.55);
}
.cta-widget.acik .cta-tetik{
background: #333;
box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}
/* İkon geçişi */
.cta-widget .cta-tetik .cta-tetik-ikon{
position: absolute;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.cta-widget .cta-tetik .cta-tetik-ikon svg path{
border-color:#ffffff;
}
.cta-widget .cta-tetik .cta-tetik-ikon.aktif{
opacity: 1;
transform: rotate(0deg) scale(1);
}
.cta-widget .cta-tetik .cta-tetik-ikon.kapali{
opacity: 0;
transform: rotate(-90deg) scale(0.6);
}
.cta-widget.acik .cta-tetik .cta-tetik-ikon.aktif{
opacity: 0;
transform: rotate(90deg) scale(0.6);
}
.cta-widget.acik .cta-tetik .cta-tetik-ikon.kapali{
opacity: 1;
transform: rotate(0deg) scale(1);
}
/* Nabız animasyonu (kapalıyken dikkat çeker) */
.cta-widget:not(.acik) .cta-tetik::after{
content: "";
position: absolute;
inset: 0;
border-radius: 50%;
background: rgba(227,31,43,0.4);
animation: ctaNabiz 2s ease-out infinite;
}
@keyframes ctaNabiz{
0% { transform: scale(1); opacity: 0.7; }
70% { transform: scale(1.6); opacity: 0; }
100% { transform: scale(1.6); opacity: 0; }
}
/* ============ CTA FORM MODAL ============ */
.cta-form-modal{
position: fixed;
bottom: 5%;
right: 10%;
width: 340px;
background: #fff;
border-radius: 16px;
box-shadow: 0 12px 48px rgba(0,0,0,0.18);
z-index: 998;
opacity: 0;
visibility: hidden;
transform: translateY(16px) scale(0.95);
transition: opacity 0.35s ease, transform 0.35s ease, visibility 0.35s ease;
transform-origin: bottom right;
}
.cta-form-modal.aktif{
opacity: 1;
visibility: visible;
transform: translateY(0) scale(1);
}
.cta-form-modal .cta-form-ic{
padding: 28px 24px 24px;
position: relative;
max-height: 80vh;
overflow-y: auto;
}
.cta-form-modal .cta-form-ic .cta-form-kapat{
position: absolute;
top: 14px;
right: 14px;
background: #f5f5f5;
border: none;
width: 34px;
height: 34px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #333;
transition: background 0.25s ease, transform 0.25s ease;
}
.cta-form-modal .cta-form-ic .cta-form-kapat:hover{
background: #E31F2B;
color: #fff;
transform: rotate(90deg);
}
.cta-form-modal .cta-form-ic h4{
color: #232323;
font-weight: 600;
margin-bottom: 6px;
padding-right: 30px;
}
.cta-form-modal .cta-form-ic > p{
color: #666;
margin-bottom: 20px;
font-size: 100%;
}
/* Form alanları */
.cta-form-modal .cta-form-ic .cta-form-satir{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-bottom: 12px;
font-size: 100%;
}
.cta-form-modal .cta-form-ic .cta-form-alan{
margin-bottom: 12px;
display: flex;
flex-direction: column;
}
.cta-form-modal .cta-form-ic .cta-form-satir .cta-form-alan{
margin-bottom: 0;
}
.cta-form-modal .cta-form-ic .cta-form-alan label{
color: #444;
margin-bottom: 6px;
font-weight: 500;
font-size: 70%;
}
.cta-form-modal .cta-form-ic .cta-form-alan label span{
color: #E31F2B;
font-size: 100%;
}
.cta-form-modal .cta-form-ic .cta-form-alan input,
.cta-form-modal .cta-form-ic .cta-form-alan textarea{
border: 1px solid #e5e5e5;
border-radius: 8px;
padding: 10px 14px;
color: #232323;
background: #f8f8f8;
width: 100%;
transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
font-family: inherit;
}
.cta-form-modal .cta-form-ic .cta-form-alan input:focus,
.cta-form-modal .cta-form-ic .cta-form-alan textarea:focus{
border-color: #E31F2B;
background: #fff;
box-shadow: 0 0 0 3px rgba(227,31,43,0.1);
}
.cta-form-modal .cta-form-ic .cta-form-alan textarea{
resize: none;
}
/* KVKK */
.cta-form-modal .cta-form-ic .cta-kvkk label{
display: flex;
align-items: flex-start;
gap: 8px;
cursor: pointer;
font-weight: 400;
margin-bottom: 0;
}
.cta-form-modal .cta-form-ic .cta-kvkk input[type="checkbox"]{
width: 16px;
height: 16px;
margin-top: 2px;
flex-shrink: 0;
accent-color: #E31F2B;
cursor: pointer;
}
.cta-form-modal .cta-form-ic .cta-kvkk span{
color: #555;
line-height: 1.4;
}
.cta-form-modal .cta-form-ic .cta-kvkk span a{
color: #E31F2B;
text-decoration: underline;
margin: 0;
font-size: 100%;
}
/* Gönder butonu */
.cta-form-modal .cta-form-ic .cta-gonder-btn{
width: 100%;
background: #E31F2B;
color: #fff;
border: none;
border-radius: 8px;
padding: 13px;
cursor: pointer;
font-weight: 600;
margin-top: 16px;
transition: background 0.3s ease, transform 0.2s ease;
font-family: inherit;
}
.cta-form-modal .cta-form-ic .cta-gonder-btn:hover{
background: #c4161f;
transform: translateY(-1px);
}
.cta-form-modal .cta-form-ic .cta-gonder-btn:active{
transform: translateY(0);
}
/* Sonuç mesajı */
.cta-form-modal .cta-form-ic .cta-form-sonuc{
display: none;
margin-top: 12px;
padding: 12px;
border-radius: 8px;
text-align: center;
}
.cta-form-modal .cta-form-ic .cta-form-sonuc.basari{
display: block;
background: rgba(25,135,84,0.1);
color: #198754;
border: 1px solid rgba(25,135,84,0.3);
}
.cta-form-modal .cta-form-ic .cta-form-sonuc.hata{
display: block;
background: rgba(227,31,43,0.08);
color: #E31F2B;
border: 1px solid rgba(227,31,43,0.2);
}
/* ============ RESPONSIVE ============ */
@media (max-width: 600px){
.cta-widget{
bottom: 20px;
right: 20px;
}
.cta-widget .cta-tetik{
width: 56px;
height: 56px;
}
.cta-widget .cta-secenekler .cta-item .cta-btn{
width: 48px;
height: 48px;
}
.cta-form-modal{
bottom: 0;
right: 0;
left: 0;
width: 100%;
border-radius: 20px 20px 0 0;
transform: translateY(100%);
transform-origin: bottom center;
}
.cta-form-modal.aktif{
transform: translateY(0);
}
.cta-form-modal .cta-form-ic{
padding: 24px 20px 32px;
max-height: 85vh;
}
.cta-form-modal .cta-form-ic .cta-form-satir{
grid-template-columns: 1fr;
}
}
.cta-form-modal .cta-form-ic .cta-kvkk.detect label{
color: #E31F2B;
}
.cta-form-modal .cta-form-ic .cta-kvkk.detect input[type="checkbox"]{
outline: 2px solid #E31F2B;
outline-offset: 2px;
}
.kategoriler .kategotiall{
margin-bottom:2rem;
}
.sss .container .row{
align-items: flex-start;
gap: 5%;
}
.sss .container .row .w50{
width: 100%;
margin: 0;
}
.sss .container .row .w50 h2:not(.desen) strong{
color: #E31F2B;
}
.sss .container .row .w50 p{
color: #555;
margin-top: 16px;
margin-bottom: 28px;
}
/* LISTE */
.sss .container .row .w50 .sss-liste{
display: flex;
flex-direction: column;
gap: 12px;
margin-top: 2rem;
}
/* ITEM */
.sss .container .row .w50 .sss-liste .sss-item{
border: 1px solid #e8e8e8;
border-radius: 10px;
overflow: hidden;
transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.sss .container .row .w50 .sss-liste .sss-item.acik{
border-color: rgba(227,31,43,0.3);
box-shadow: 0 4px 20px rgba(227,31,43,0.08);
}
/* SORU */
.sss .container .row .w50 .sss-liste .sss-item .sss-soru{
width: 100%;
background: #fff;
border: none;
padding: 20px 24px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
text-align: left;
transition: background 0.3s ease;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-soru:hover{
background: #fafafa;
}
.sss .container .row .w50 .sss-liste .sss-item.acik .sss-soru{
background: #fff;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-soru span{
color: #232323;
font-weight: 500;
line-height: 1.4;
flex: 1;
}
.sss .container .row .w50 .sss-liste .sss-item.acik .sss-soru span{
color: #E31F2B;
}
/* Ok ikonu */
.sss .container .row .w50 .sss-liste .sss-item .sss-soru .sss-ok{
flex-shrink: 0;
color: #999;
transition: transform 0.35s cubic-bezier(.4,0,.2,1), color 0.3s ease;
}
.sss .container .row .w50 .sss-liste .sss-item.acik .sss-soru .sss-ok{
transform: rotate(180deg);
color: #E31F2B;
}
/* CEVAP */
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap{
max-height: 0;
overflow: hidden;
transition: max-height 0.4s cubic-bezier(.4,0,.2,1);
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic{
padding: 0 24px 20px;
border-top: 1px solid #f0f0f0;
padding-top: 16px;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic p{
color: #555;
line-height: 1.7;
margin-bottom: 10px;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic p:last-child{
margin-bottom: 0;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic a{
color: #E31F2B;
margin: 0;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic ul{
padding-left: 20px;
margin-bottom: 10px;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic ul li{
color: #555;
line-height: 1.7;
margin-bottom: 6px;
}
@media (max-width: 900px){
.sss .container .row .w50{
width: 100%;
}
.sss .container .row .w50:last-child{
margin-top: 40px;
}
}
@media (max-width: 600px){
.sss .container .row .w50 .sss-liste .sss-item .sss-soru{
padding: 16px 18px;
}
.sss .container .row .w50 .sss-liste .sss-item .sss-cevap .sss-cevap-ic{
padding: 14px 18px 16px;
}
}