/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


#wrapper, #main, main, #content { height: auto !important; min-height: 0 !important; overflow: visible !important; }

.home-start h1, .subpage-banner h1 {
	font-size: 60px;
}

.home-solution h2, .autogate-why h3, .home-why .banner h3, .home-know h3, .home-test h3, .autogate-about h2, .autogate-why h3, .autogate-feature h3, .autogate-system h3, .autogate-security h3, .product-contact h3, .motor-feature h3, .motor-system h3, .contact-showroom h3, .contact-about h3, .home-follow h3, .home-customers h3 {
	font-size: 30px;
}

.home-solution h3, .autogate-why h4, .home-why .banner h4, .home-know h4, .home-test h4, .autogate-about h3, .autogate-why h4, .autogate-feature h4, .autogate-system h4, .motor-feature h4, .motor-system h4, .support-information h3, .gallery-premium h3, .gallery-kl h3 {
	font-size: 24px;
}

body p, body .banner p, section ul li {
font-size: 16px;
}

.img.round-img img, .banner.round-img {
border-radius: 20px;
	overflow: hidden;
}

a.button {
	padding: 5px 30px !important;
}

a.button span {
	letter-spacing: 1px;
	text-transform: uppercase;
	font-size: 12px;
	margin-top: 5px;
}

a.button.white span {
	color: rgba(66, 67, 66, 1);
}

.home-start .col {
	padding-bottom: 0 !important;
}

.accordion-title {
	background: rgba(26, 23, 23, 1);
	padding-left: 15px;
}

.accordion-title span {
	color: #FFF;
}

.accordion-title.active {
	background: rgba(66, 67, 66, 1);
}

.accordion .accordion-inner {
	background: rgba(66, 67, 66, 1);
	color: #FFF;
	padding-left: 15px;
}

.accordion .accordion-inner a {
	color: #FFF;
}

.accordion .accordion-title button {
	background: url(/wp-content/uploads/2026/06/Arrow-6.png) center center no-repeat;
	background-size: 12px auto;
	right: 5px;
	opacity: 1;
	left: auto;
	width: 15px;
}

.accordion .accordion-title button i {
	opacity: 0;
}

.contact-showroom .accordion .accordion-title {
	letter-spacing: 2px;
	font-weight: 500;
}

.home-test .col.left-border > .col-inner {
	border-left: #FFF 3px solid;
	padding-left: 15px;
}

.support-information .icon-box {
	align-items: center;
}

.support-information a.button {
	margin-bottom: 0;
}

/* Vertical Tab Navigation */
.product-banner .vertical-tabs {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
  z-index: 10;
}

.product-banner .vertical-tabs .tab-item {
  display: flex;
  align-items: center;
  gap: 0;
  cursor: default;
  text-decoration: none;
}

.product-banner .vertical-tabs .tab-item .tab-label {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  padding: 16px 6px;
  transition: color 0.25s ease;
}

.product-banner .vertical-tabs .tab-item .tab-bar {
  width: 3px;
  align-self: stretch;
  background: rgba(255, 255, 255, 0.2);
  transition: background 0.25s ease;
}

/* Active tab: underline text, solid bar, no pointer events */
.product-banner .vertical-tabs .tab-item.is-active .tab-label {
  color: #ffffff;
/*   text-decoration: underline; */
/*   text-underline-offset: 3px;
  text-decoration-thickness: 1px; */
}
.product-banner .vertical-tabs .tab-item.is-active .tab-bar {
  background: #ffffff;
}
.product-banner .vertical-tabs .tab-item.is-active {
  pointer-events: none;
}

.product-banner .col-inner {
	padding: 0 30px;
}

/* Link tab: hover states */
.product-banner .vertical-tabs a.tab-item:hover .tab-label {
  color: #ffffff;
}
.product-banner .vertical-tabs a.tab-item:hover .tab-bar {
  background: rgba(255, 255, 255, 0.6);
}

.home-why .text-box, .autogate-feature .slider .row, .motor-feature .slider .row {
	padding: 0 60px;
}

.flickity-page-dots {
    margin: 0 8px;
}

.slider-nav-left .flickity-page-dots {
    left: 15px; /* Move dots to the left */
    line-height: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    text-align: left; /* Change from center to left alignment */
	width: 30px;
    bottom: 50%;
}

.flickity-page-dots .dot {
	border-color: #fff;
    border-width: 0;
    background: #FFF;
    opacity: 1;
    width: 8px;
    height: 8px;
    margin-bottom: 15px;
}

/* Active dot with ::after border ring */
.flickity-page-dots .dot.is-selected {
    position: relative;
	opacity: 1;
}

.flickity-page-dots .dot.is-selected::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 1);
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.autogate-about .flickity-page-dots, .autogate-system .flickity-page-dots {
	bottom: -15px;
}

.autogate-about .flickity-page-dots .dot, .autogate-system .flickity-page-dots .dot {
	border-color: rgba(217, 217, 217, 1);
    background: rgba(217, 217, 217, 1);
}

.autogate-about .flickity-page-dots .dot.is-selected, .autogate-system .flickity-page-dots .dot.is-selected {
	background: rgba(66, 67, 66, 1);
}

.autogate-about .flickity-page-dots .dot.is-selected::after, 
.autogate-system .flickity-page-dots .dot.is-selected::after {
    border: 2px solid rgba(0,0,0);
}

.home-solution a.button {
	min-width: 300px;
	max-width: 100%;
}

.flickity-page-dots {
	bottom: -15px;
}

.support-information h3 {
    font-size: 30px !important;
}

.wpml-ls-legacy-list-horizontal a {
	padding: 0 7px;
}

.wpml-ls-legacy-list-horizontal a span {
	color: hsla(0, 0%, 100%, .8);
	text-transform: uppercase;
	font-size: 13px;
	font-family: Dosis, sans-serif;
	font-weight: 700;
}

.wpml-ls-legacy-list-horizontal a:hover span, .wpml-ls-legacy-list-horizontal a.is-active span {
	color: #FFF;
}

.header-wrapper.stuck .wpml-ls-legacy-list-horizontal a span {
color: hsla(0, 0%, 40%, .85);
}

.header-wrapper.stuck .wpml-ls-legacy-list-horizontal a:hover span, .header-wrapper.stuck  .wpml-ls-legacy-list-horizontal a.is-active span {
hsla(0, 0%, 7%, .85);
}

@media only screen and (max-width: 48em) {

.home-start h1, .subpage-banner h1 {
	font-size: 36px;
}

.home-solution h2, .autogate-why h3, .home-why .banner h3, .home-know h3, .home-test h3, .autogate-about h2, .autogate-why h3, .autogate-feature h3, .autogate-system h3, .autogate-security h3, .product-contact h3, .motor-feature h3, .motor-system h3, .contact-showroom h3, .contact-about h3, .home-follow h3, .home-customers h3,.support-information h3 {
	font-size: 24px;
}

.home-solution h3, .autogate-why h4, .home-why .banner h4, .home-know h4, .home-test h4, .autogate-about h3, .autogate-why h4, .autogate-feature h4, .autogate-system h4, .motor-feature h4, .motor-system h4, .support-information h3, .gallery-premium h3, .gallery-kl h3 {
	font-size: 18px;
}

body p, body .banner p, section ul li {
font-size: 14px;
}
	
	.home-solution a.button {
		min-width: 0;
	}
	
	.home-know .small-8 .icon-box {
		padding-left: 15px;
	}
	
	.home-why .text-box, .autogate-feature .slider .row, .motor-feature .slider .row {
		padding: 0;
	}
	
	.autogate-about ul {
		margin-bottom: 0;
	}
	
	.autogate-about ul li {
		margin-bottom: 0;
	}
}