﻿ /*Checkboxes styles*/
.list-checkbox {padding:0;margin:0;list-style:none;}
.list-checkbox li {margin-top:5px;padding:0;}

input[type="checkbox"] {display: none;}
input[type="checkbox"] + label {color:#666; display: block;position: relative;line-height:1.5;padding-left:22px;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none; font-size:95%!important;}
input[type="checkbox"] + label:hover{color:#333;}
input[type="checkbox"] + label:last-child {margin-bottom: 0;}
input[type="checkbox"] + label:before {content: '';display: block;width:12px;height:12px;border:1px solid var(--bs-primary);position: absolute;left:0;top:4px;opacity: .9;-webkit-transition: all .12s, border-color .08s;transition: all .12s, border-color .08s;}
input[type="checkbox"]:checked + label:before {width:8px;top:0px;left:4px;border-radius: 0;border-width:2px; opacity: 1;border-top-color: transparent;border-left-color: transparent;-webkit-transform: rotate(45deg);transform: rotate(45deg);}

input[type="radio"]:checked,[type="radio"]:not(:checked) {position: absolute;left: -9999px;}
input[type="radio"]:checked + label,[type="radio"]:not(:checked) + label{position: relative;padding-left:25px;cursor: pointer;display: inline-block;margin-bottom:0;}
input[type="radio"]:checked + label:before,[type="radio"]:not(:checked) + label:before {content: '';position: absolute;left: 0;top:3px;width:18px;height: 18px;border: 2px solid var(--bs-primary);border-radius: 100%;background: #fff;}
input[type="radio"]:checked + label:after,[type="radio"]:not(:checked) + label:after {content: '';width: 12px;height: 12px;background: var(--bs-primary);position: absolute;top:6px;left:3px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
input[type="radio"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
input[type="radio"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}

.irs--round .irs-handle {border-color:var(--bs-primary)!important}
.irs--round .irs-bar, .irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single {background-color:var(--bs-primary)!important}

.prod-left-panel .card {position:relative;z-index:0;}
.prod-left-panel .card-header {background-color:#606060;}
.prod-left-panel .list-checkbox {margin-left:15px}
.table-prod thead th {font-weight:normal;background-color:#606060;color:#fff;}
.table-prod .btn{padding:0.15rem 0.5rem;border:0px;background-color:transparent}
.table-prod .btn:hover{background-color:var(--bs-primary)}
.table-prod .btn .bi{font-size:1.3rem;}
.icon-sorting {cursor:pointer}

.projgrid a:hover{border-color:var(--bs-secondary)!important}

.product-details table td{padding-left:0!important;}

.downloads .accordion-button::after {display: none}

.downloads .accordion-button::before {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    margin-left: 0;
    content: "";
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16">  <path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
    background-size: 100%;
    position: absolute
}

.downloads .borchure {
    min-width: 100px
}

.downloads .datasheet {
    min-width: 100px
}

.downloads .manual {
    min-width: 80px
}

.downloads .accordion-button:not(.collapsed)::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dash" viewBox="0 0 16 16">  <path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8"/></svg>');
}

.downloadsaccordian .border-btm {
    border-bottom: 1px solid rgba(0,174,239, 0.25);
}

    .downloadsaccordian .border-btm:last-child {
        border: 0px
    }

.downloads .accordion-button {
    color: var(--bs-primary);
}
.downloads .accordion-button:not(.collapsed) {
    color: var(--bs-secondary)!important;
    background-color: transparent !important;
    /* box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color); */
}

@media (max-width:767px) {
.downloads h6, .downloads .h6 {font-size: 0.938rem !important}
.downloads .borchure {min-width: 100px}
.downloads .datasheet {min-width: 100px}
.downloads .manual {min-width: 80px}
.list-checkbox li{margin-top:0;}
.prod-left-panel .offcanvas-md {background-color:transparent!important;}
.prod-left-panel .offcanvas-md .rounded-4 {border-top-left-radius:0!important; border-bottom-left-radius:0!important; border:0!important;}
.offcanvas-md.offcanvas-start{ background:rgba(var(--bs-primary-rgb),.5)!important; -webkit-backdrop-filter: blur(25px);backdrop-filter: blur(25px)}
.prod-left-panel .card{background:none!important;}
.prod-left-panel .card .card-body *{color:#FFF!important;}
input[type="checkbox"] + label:before{border-color:#FFF;}
}

@media (max-width:767px) {
.downloads .accordion-body {background: #fff !important}
.downloads .accordion-button:not(.collapsed) {color: #000;font-weight: 600;background-color: #eee !important;}
}

@media(max-width:640px) {
.contact-address{max-width:80%;}
.contact-address br{display:none;}
}
@media(max-width:769px) {
.contact-form-bg .text-white{color:rgb(19,85,131)!important}
.contact-form-bg{background:#EEE!important;}
.contact-form-bg .blur-bg{background:#FFF !important; border-color:rgb(19,85,131)!important}
.contact-form-bg .btn{border:#FFF 1px solid!important; background:rgb(19,85,131)!important}
.contact-form-bg .btn:hover, .contact-form-bg .btn:focus{background:#c5d661!important; color:rgb(19,85,131) !important;}
}
@media(min-width:768px) {
.contact-form-bg{background:url(../images/contact-form-bg.jpg) no-repeat center center; background-attachment:fixed; }
.blur-bg{background-color:rgba(0, 0, 0, 0.2);-webkit-backdrop-filter: blur(20px);backdrop-filter: blur(20px);}
.contact-form-bg .blur-bg{ border-color:rgba(255, 255, 255, .9)!important;}
.contact-form-bg .blur-bg .form-control{background-color: rgba(255, 255, 255, .2);border-color:rgba(255, 255, 255, .9) !important;}
.contact-form-bg .blur-bg .form-control + label{color:#FFF;}
.contact-form-bg .blur-bg .form-floating>.form-control-plaintext~label,
.contact-form-bg .blur-bg .form-floating>.form-control:focus~label,
.contact-form-bg .blur-bg .form-floating>.form-control:not(:placeholder-shown)~label,
.contact-form-bg .blur-bg .form-floating>.form-select~label,
.contact-form-bg .blur-bg .form-floating > .form-select{ font-weight:500; color:#dbdbdb!important;}
.contact-form-bg .blur-bg .form-floating>.form-control:focus,
.contact-form-bg .blur-bg .form-floating>.form-control:not(:placeholder-shown),
.contact-form-bg .blur-bg .form-floating > .form-select{ color:#FFF!important;background-color: rgba(255, 255, 255, .2)!important;}
.contact-form-bg .blur-bg .form-floating > .form-control-plaintext ~ label::after,
.contact-form-bg .blur-bg .form-floating > .form-control:focus ~ label::after,
.contact-form-bg .blur-bg .form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.contact-form-bg .blur-bg .form-floating > .form-select ~ label::after{background-color:transparent!important; }
.contact-form-bg .blur-bg .form-floating > .form-select option{color:#000!important;}
}

.timeline .swiper-button-next.swiper-button-disabled, .timeline .swiper-button-prev.swiper-button-disabled{color:#DDD!important; background:var(--bs-light); border-color:#DDD!important; opacity:1!important;}
.timeline .swiper-button-next, .timeline .swiper-button-prev{ border-color:rgb(19,85,131); color:rgb(19,85,131); width:40px; height:40px;background:var(--bs-light); top:28px; border-radius:50px!important;}
.timeline .swiper-button-next:hover, .timeline .swiper-button-prev:hover{ background:var(--bs-primary)!important; color:#FFF!important;}
.timeline .swiper-button-next:after, .timeline  .swiper-button-prev:after{font-size:18px!important;}
.timeline .swiper-button-prev{left:0;}
.timestamp {
  width: 100%; 
  margin-bottom: 20px;
  padding: 0px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-weight: 500; 
}
.status {
  height:100%;
  display: flex;
  justify-content: center;
  border-top: 4px solid var(--bs-secondary);
  position: relative;
  transition: all 200ms ease-in ;
}
.status > div{width:92%;height:100%; padding:35px!important;line-height:1.9!important; margin-top:25px; border:rgba(255,255,255,.2) 1px solid;}
.status > div{background-color:rgba(var(--bs-dark-rgb), 0.5)!important;-webkit-backdrop-filter: blur(15px);backdrop-filter: blur(15px);}
.status > div, .status > div *{color:#FFF;}
.status:before {
  content: '';
  width: 25px;
  height: 25px;
  background-color: var(--bs-primary);
  border-radius: 25px;
  border: 4px solid var(--bs-light);
  position: absolute;
  top: -15px;
  left: calc(50% - 12px); 
  transition: all 200ms ease-in;
}
.status:after {
  content: '';
  width: 25px;
  height: 25px;
  border-bottom: 15px solid var(--bs-white);
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  position: absolute;
  top: 0px;
  left: calc(50% - 14px); 
  transition: all 200ms ease-in;
  opacity:.3;
}
.swiper-control {
  text-align: right;
}

.bg-success-stories-bg{background:url(../images/success-stories-bg.jpg) top center no-repeat; background-attachment:fixed;}

.masthead-about{background:url(../images/masthead-about.jpg) no-repeat center center; background-size:cover;}
.masthead-service_support{background:url(../images/masthead-service_support.jpg) no-repeat center center; background-size:cover;}
.masthead-downloads{background:url(../images/masthead-downloads.jpg) no-repeat center center; background-size:cover;}
.masthead-manufacturing{background:url(../images/masthead-manufacturing.jpg) no-repeat center center; background-size:cover;}
.masthead-about{background:url(../images/masthead-about.jpg) no-repeat center center; background-size:cover;}
.masthead-contact{background:url(../images/masthead-contact.jpg) no-repeat center center; background-size:cover;}
.masthead-applications{background:url(../images/masthead-applications.jpg) no-repeat center center; background-size:cover;}
.mastheads-pro-details{background:url(../images/mastheads-pro-details.jpg) no-repeat center center; background-size:cover;}

@media(min-width:768px) {
.bg-about-img{max-width:1920px; margin:0 auto;}
.bg-about-img, .bg-about-img .container{position:relative;}
.bg-about-img .container{z-index:2;}
.bg-about-img:after{content:''; position:absolute; width:50%; height:100%; right:0; top:0;}
.bg-about-img:after{background:url(../images/about-intro-bg.jpg) no-repeat right top; background-size:100% auto;}
}