@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

body,html {
  font-family: "Roboto", sans-serif!important;
  color: #000;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  height: 100%;

}

::selection {
    background: #FC5000;
    color: #fff;
}

a my-link{
   cursor:pointer;
	color: #000;
}

a:hover {
  color: #FC5000!important;
	text-decoration: none!important;
}

a {
	text-decoration: none;	
}

/* Colors */

.lubex-orange{
  color: #FC5000;
}

.lubex-grey{
  color: #747474;
}

/* Navbar */

.navbar-top {
  font-size: 14px;
  color: #000;
  font-weight: bold;
}

.nav-link{
  color: #000!important;
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,102,203, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: rgb(255,102,203);
} 
.nav-block {
  height: 100px;
}

.navbar-right {
  /* margin-right: 5%; */
}

/* Hero */
.swiper-container-1 {
    width: 100%;
    height: 783px;
    overflow: hidden;
  }
  .swiper-slide {
    width: 100%;
    height: 100%;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    overflow: hidden;
  }

  .slide-x{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
  }

  .hero-title{
    font-size: 50px;
    font-weight: bold;
  }

  .hero-desc{
    font-size: 17px;
  }

  .hero-select{
    height: 100px;
    border: 2px solid #FC5000;
    border-radius: 4px;
  }

.hero-select select{
    height: 100%;
    border: none;
    width: 100%;
    padding-left: 10px;
  }

  .search-button{
    height: 100%;
    width: 62%;
    border: 2px solid #FC5000;
    background-color: #FC5000;
    color: #fff;
    outline: none;
  }

  .bootstrap-select .dropdown-toggle .filter-option {
    height: 100% !important;
    text-align: center;
    display: flex;
    align-items: center;
}

.dropdown-item.active, .dropdown-item:active{
  background-color: #3e3e3e!important;
}

  button.btn.dropdown-toggle.btn-light.bs-placeholder{
    height: 100%;
  }

  
  button.btn.dropdown-toggle.btn-light{
    height: 100%;
}

.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #FC5000;
}

.swiper-button-next1,.swiper-button-prev1{
  color: #fff;

}

.slide-x-black{
  position: absolute;
  left: 0;
  bottom: 0;

}

  /* Lubex Section */

  a.icon-link{
    font-size: 18px;
    font-weight: 600;
    color: #2e2e2eb4;
  }

  a.icon-link-active {
    color: #000;
    font-weight: 600;
    position: relative;
  }

  .links{
    gap: 20px;
  }

  .gaps{
    gap: 10px;
  }
  
  .links a {
    color: #000; 
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    position: relative; 
  }
  
  .links a::after {
    content: ''; 
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%; 
    height: 3px;/
  }
  
  .links .icon-link-active {
    color: #FC5000; 
  }
  
  .links .icon-link-active::after {
    background-color: #FC5000; 
  }
  
  .links a::after {
    background-color: #000;
  }
  

  a.icon-link:active, a.icon-link:focus, a.icon-link:hover {
    color: #FC5000;
    
  }

  .lubex-card-all,.lubex-card-w{
    min-width: 348px;
    height: 400px;
  }

  .lubex-card {
    position: relative;
    height: 100%;
    width: 100%;
  }
  
  .lubex-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: -1;
    border-radius: 8px;

  }

  .lubex-card-overlay-passive{
    display: none;
  }
  
  

.lubex-card-image{
  z-index: -1;
  position: absolute;
  min-width: 100%;
  height: 100%;
}

.lubex-card-image-passive{
  display: none;
}


  .lubex-card-badge,.lubex-card-title{
    font-size: 23px;
    font-weight: bold;
    color: #fff;
  }

  
  .lubex-card-link{
    font-size: 16px;
    color: #fff;
    font-weight: bold;
  }

  .lubex-card-badge-black,.lubex-card-title-black{
    color: #000;
  }
  
  .lubex-card-link-black{
    color: #FC5000!important;
    font-weight: bold;
  }

  .lubex-card-desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
  }


  .lubex-card-desc-active {
    justify-content: flex-end;
  }

  .lubex-card-hover-image{
    display: none;
  }

  .lubex-card-hover-image-active{
    display: block;
    width: 100%;
    height: 100%;
    margin: auto;
  }
  
  img.lubex-card-hover-image-active{
    width: 247px;
    height: 223px;
  }

  .lubex-card-active{
    background-color: #FC500026;
    border-radius: 8px;
  }
  
  .swiper2 {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .swiper-button-next.ileri2,.swiper-button-prev.geri2{
    color: #FC5000;
  
  }

.swiper-button-next.ileri2 {
    left: -5%;
    top: 95%;
}

.swiper-button-prev.geri2 {
    left: -10%;
	top: 95%;
}

  /* Sektörel */


  img.sektor-img{
    max-width: 100%;
  }

  .sektor-title{
    font-size: 17px;
    color: #000;
    font-weight: bold;
  }

  .sektor-btn{
    color: #FC5000;
    font-size: 17px;
    font-weight: bold;
  }

  .sectionp{
    padding-left: 35px;
    padding-right: 25px;
  }

  .card-images{
    height: auto;
    object-fit: contain;
    max-width: 100%;
  }

  .card{
    height: 400px;
    width: 100%;
  }

  /* Why Lubex */

  .lubex-why{
    font-size: 40px;
    color: #FC5000;
  }

  .accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background-color: transparent;
    box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}



button.accordion-button{
  font-size: 20px;
  font-weight: 500;
  color: #000!important;
}

.accordion-button{
  background-color: transparent;
}

.accordion-bg{
  position: absolute;
  max-width: 75%;
  bottom: 0;
  left: 0;
  opacity: 0.5;
}



/* Brand Slider */

.brands-bg{
  background-color: #000;
  
}

.brand-image{
  opacity: 0.5;
  max-width: 100%;
  
}

.brand-play{
  max-width: 100%;
  height: auto;
  position: absolute;
	cursor: pointer;
}

.lubex-item-img{
  max-width: 100%;
  max-width: auto;
}

.brand-btn{
  max-width: 340px;
  text-align: center;
  background-color: #FC5000;
  padding: 10px 20px;
  color: #fff;
  font-weight: bold;
}


/* Urunler */
.search-content{
  background-color: #FC5000;
}

.bread-content{
  background-color: #000;
  color: #fff;
}

.breadcrumb{
  background-color: transparent!important;
}

.breadcrumb-item a,.breadcrumb-item+.breadcrumb-item::before{
  color: #fff;
  opacity: 0.5;
}

li.breadcrumb-item.active{
  color: #fff;

}

.bread-title{
  font-size: 50px;
  font-weight: bold;
  /* max-width: 1200px; */
}

.product-sect{
  position: relative;
  background-color: #fff;
  border: 2px solid #EBEBEB;
  border-radius: 8px;
  z-index: 1;
}

.product-title-image{
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.card-product{
  border: 2px solid #EBEBEB;
  padding: 10px;
  text-align: center;
  border-radius: 8px;
}

.product-btn{
  background-color: #FC5000;
  color: #fff;
  padding: 5px 60px;
  border-radius: 4px;
  font-weight: bold;
}

.orange-count{
  color: #FC5000;
  font-weight: 600;
  font-size: 16px;
}

.product-image{
	max-height: 250px;
}

.product-search,.product-search:focus,.product-search:active,.product-search:visited,.product-search:hover,.product-search:focus-visible{
background: #FC5000;
    color: #fff;
    border-radius: 4px;
  height: 54px;
  padding: 10px;
  border: 1px solid #FFF;
  outline: none;
}

input#form1::placeholder {
    color: #fff;
}

.form-check{
  display: flex;
  align-items: center;
}

.form-check-input{
  width: 24px;
  height: 24px;
}

.form-check-input:checked {
  background-color: #FC5000;
  border-color: #FC5000;
}

.form-check-input:focus {
  border-color: #FC5000;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(253, 121, 13, 0.25);
}


.form-check-label{
  font-weight: bold;
  font-size: 15px;
  margin-left: 15px;
  margin-top: 10px;
}

.product-top{
  height: 55px;
}

.margin-left{
  margin-left: 10px;
}


.product-select-top{
  gap: 16px;
  padding-right: 5%!important;
	padding-left: 0px!important;
}

.header-select{
  width: 100%!important;
  height: 54px;
}

.header-select button.btn.dropdown-toggle.btn-light {
  background-color: #FC5000;
  outline: none;
}


.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
  background-color: transparent;
  color: #fff;
}

.filter-option-inner-inner {
  color: #000;
}



.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover{
  color: #fff!important;
}

.btn-light:not(:disabled):not(.disabled).active, .btn-light:not(:disabled):not(.disabled):active, .show>.btn-light.dropdown-toggle{
  background-color: transparent!important;
}

.bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
  outline: none!important;
  outline: 0px!important;
  outline-offset: 0px!important;
}

.filtre-button{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background-color: #fff;
  border: none;
  outline: none;
  padding: 0px 20px;
  width: 173px;
  height: 54px;
  color: #FC5000;
  font-weight: bold;
  border-radius: 4px;
}

.footer-menu{
  display: flex;
  gap: 20px;
  list-style: none;
}

.footer-link a{
  color: #000;
	font-size: 15px;
  font-weight: bold;
}

.product-desc-bold{
  font-weight: bold;
}

.product-detail-sec{
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 20px;
}

.product-detail{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
  align-items: center;
  margin: 20px 0px;
}


.product-image-2{
  max-width: 250px;
  height: auto;

}

.product-badge{
  background-color: #FC5000;
  color: #fff;
  border-radius: 4px;
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px;
  margin-top: 5px;
  margin-right: 5px;
}

.product-litre{
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 10px;
}

.orange-title{
  color: #000!important;
  font-weight: bold!important;
  font-size: 20px!important;
}

.orange-titles{
  color: #FC5000;
  font-weight: bold;
}

.card-header{
  background-color: transparent!important;
}

.btn.focus, .btn:focus {
  outline: 0;
  box-shadow: 0 0 0!important;
}


.bg-overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 0;
}

.sektorel-title{
  color: #fff;
  text-align: center;
}

.sektoren-sec{
  position: relative;
  top: -200;
  height: 100vh;
}

.accordion-x-img{
  position: absolute;
  left: 0;
  bottom: 0;
  opacity: .5;
  z-index: -1;
}

a.card-text{
  color: #000;
}

.left-menu{
	font-weight: normal!important;
}

iframe.arac {
    display: block;       /* iframes are inline by default */
    background: #000;
    border: none;         /* Reset default border */
    width: 100%;
    height: 130vh;
}

iframe.ytframe {
    height: 600px;
    width: 100%;
}

input#Model,input#Yil{
	background-color: #f8f9fa;
}

:focus-visible {
    outline: none;
	background-color: #f8f9fa;
}

.p-20{
	padding: 20px;
}

.section-sticky {
	position: sticky;
    top: 75px;
    z-index: 5;
}

.bootstrap-select .dropdown-menu li a {
	text-transform: uppercase;

}
a.card-text.active {
    color: #fc5000 !important;
    font-weight: bold;
}

a.lubex-card-link.text-center {
	color: #fff;	
}



.contact-info {
	display: flex;
	justify-content: unset;
    align-items: center;
    gap: 20px;
    
}

.contact-left {
	display: flex;
    flex-direction: column;
	gap: 20px;
}

.form-control{
	height: 54px!important;
}

.form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #FC5000!important;
    outline: 0;
    box-shadow: none!important;
}

.submit-btn{
	    padding: 20px;
    border: none;
    background: #FC5000;
    color: #fff;
}

.submit-btn:hover {
    background: #fc5000de;
}

button:focus {
    outline: 1px dotted;
    outline: 0px!important;
}


iframe#lubexFrame {
height: 100vw;	
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 900px!important;
        margin: 1.75rem auto;
    }
	

}

.modal {
	background-color: #0000004f !important;
}

.close {
    float: right;
    font-size: 2.5rem!important;
    font-weight: 700;
    line-height: 1;
    color: #fff!important;
    text-shadow: none;
    opacity: .5;
}

.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: transparent!important;
    background-clip: padding-box;
    border: 0px!important;
    border-radius: 0px!important;
    outline: 0;
}

.modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 0px!important;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px);
}

@media (-webkit-device-pixel-ratio: 1.25) {
	
	  body {
    font-size: 0.8em; /* Font boyutunu %20 küçültmek için */
		  }
    .navbar-top {
    font-size: 14px;
    color: #000;
    font-weight: bold;

  }
}

@media (-webkit-device-pixel-ratio: 1.50) {
	
	  body {
    font-size: 0.8em; /* Font boyutunu %20 küçültmek için */
		  }
    .navbar-top {
    font-size: 11px;
    color: #000;
    font-weight: bold;

  }
}


.dogrulamaKodAlani {
	    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 15px;
}

input#dogrulamaCevap {
	    height: 40px;
    margin-bottom: 0px;
    width: 100%;
}

.file-box {
    background-color: #fff;
    border: 2px solid #EBEBEB;
    border-radius: 8px;
	    min-height: 170px;
	gap: 20px;
}

i.file-icon.fas.fa-file-pdf {
	font-size: 50px;
}

a.box-link {
    color: #000;
}




   .social-icons {
            display: flex;
            gap: 10px; /* İkonlar arası boşluk */
            list-style: none;
            padding: 0;
        }

        .social-icons li {
            display: flex;
        }

        .social-icons svg {
            width: 25px;
            height: 25px;
            fill: #000; /* İkon rengi */
            transition: fill 0.3s ease;
        }

        .social-icons svg:hover {
            fill: #FC5000; /* Üzerine gelince renk değişimi */
        }