@charset "UTF-8";

@font-face {
  font-family: "Switzer-Regular";
  src: url("../fonts/Switzer-Regular.woff2") format("woff2"),
    url("../fonts/Switzer-Regular.woff") format("woff"),
    url("../fonts/Switzer-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Switzer-Medium";
  src: url("../fonts/Switzer-Medium.woff2") format("woff2"),
    url("../fonts/Switzer-Medium.woff") format("woff"),
    url("../fonts/Switzer-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Switzer-Italic";
  src: url("../fonts/Switzer-Italic.woff2") format("woff2"),
    url("../fonts/Switzer-Italic.woff") format("woff"),
    url("../fonts/Switzer-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}

:root {
  --default-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Ubuntu, "Helvetica Neue", Helvetica, Arial, "PingFang SC",
    "Hiragino Sans GB", "Microsoft Yahei UI", "Microsoft Yahei",
    "Source Han Sans CN", sans-serif;
  --headings-font-family: "neue-haas-grotesk-display",
    var(--default-font-family);
  --font-family: "Switzer-Regular", var(--default-font-family);
  --font-family-medium: "Switzer-Medium", var(--default-font-family);
  --font-family-italic: "Switzer-Italic", var(--default-font-family);
  --font-weight-regular: 500;
  --font-weight-medium: 600;
  --size: 15px;
  --radius: 20px;
  --white: #fff;
  --black: #000;
  --main-color: #494949; /* text */
  --main-color-hover: #026ff8; /* text hover */
  --main-color-dark: #141414; /* text tmavy */
  --main-bg-color: #fff; /* bg */
  --main-bg-color-grey: #0f0f11; /* tmavo siva */
  --main-bg-color-grey-medium: #404550; /* stredna siva */
  --main-bg-color-grey-light: #e6e9f1; /* svetlo siva */
  --main-bg-color-custom: #00a9ea; /* modra */
  --bg-color-red: 0;
  --bg-color-green: 0;
  --bg-color-blue: 0;
}

html {
  font-size: 18px;
}
body {
  font-family: var(--font-family);
  color: var(--main-color);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  background-color: var(--main-bg-color);
}
h1,
h2,
h3,
h4 {
  line-height: 100%;
  font-weight: normal;
  margin: 0;
  padding: 0;
}
a:link,
a:visited {
  color: var(--main-color);
  -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  -webkit-transition: color 0.2s ease-in-out,
    border-bottom-color 0.2s ease-in-out;
  -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  text-decoration: none;
  
}
a:hover {
  color: var(--main-color-hover);
  border-bottom-color: transparent;
}
.cta_button {
  display: inline-flex;
  align-items: center;
  background-color: transparent;
  padding: 3px;
  border-width: 2px !important;
  border-style: solid;
  overflow: hidden;
}
.cta_button__a {
  color: var(--main-color) !important;
  border-color: var(--main-bg-color-custom) !important;
}
.cta_button__b,
.cta_button__c {
  color: var(--white) !important;
  border-color: var(--white) !important;
}
.cta_button .text {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: clamp(10px, 2vw, 30px);
}
.cta_button .arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 45px;
  aspect-ratio: 1;
  border-radius: 50%;
}
.cta_button .arrow i {
  font-size: 1.44rem;
}
@keyframes bgcolor-a {
  0% {
    color: var(--main-color);
    background-color: transparent;
  }
  100% {
    color: var(--white);
    background-color: var(--main-bg-color-custom);
  }
}
@keyframes bgcolor-b {
  0% {
    color: var(--white);
    background-color: transparent;
  }
  100% {
    color: var(--main-color-dark);
    background-color: var(--white);
  }
}
@keyframes bgcolor-c {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: var(--white);
  }
}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.cta_button__a:hover .arrow {
  animation: bgcolor-a 0.3s ease forwards 0.3s;
}
.cta_button__b:hover .arrow {
  animation: bgcolor-b 0.3s ease forwards 0.3s;
}
.cta_button__c .arrow {
  color: var(--main-bg-color-custom) !important;
}
.cta_button__c:hover .arrow {
  color: var(--main-bg-color-custom) !important;
  animation: bgcolor-c 0.3s ease forwards 0.3s;
}
.cta_button:hover .arrow i {
  animation: rotate 0.3s ease forwards;
}


/* Base-styles ............................. */

.content {
  position: relative;
  overflow: hidden;
}
.container-fluid-custom {
  padding-left: max(1rem, 12.5%);
  padding-right: max(1rem, 12.5%);
}
.box_margin {
  margin-bottom: calc(var(--size) * 2);
}
.box_margin2 {
  margin-bottom: var(--size);
}
.box_margin3 {
  margin-bottom: calc(var(--size) * 4);
}
.box_padding {
  padding-left: calc(var(--size) * 6);
  padding-right: calc(var(--size) * 6);
}
.box_padding_vertical {
  padding-top: calc(var(--size) * 7);
  padding-bottom: calc(var(--size) * 7);
}
.box_padding_vertical-small {
  padding-top: calc(var(--size) * 3);
  padding-bottom: calc(var(--size) * 3);
}
.img-object-fit {
  object-fit: cover;
}
.higher-z-index {
  z-index: 100;
}
.isolation {
  isolation: isolate;
}
.custom-relative {
  position: absolute;
}
.text-bold {
  font-family: var(--font-family-medium);
}
.text-italic {
  font-family: var(--font-family-italic);
}
.radius-default {
  border-radius: var(--radius);
}
.row-smaller-gutters {
  margin-left: -5px;
  margin-right: -5px;
}
.row-smaller-gutters > [class^="col-"],
.row-smaller-gutters > [class*=" col-"] {
  padding-left: 5px;
  padding-right: 5px;
}
.container_bg__light {
  background-color: var(--main-bg-color-grey-light);
}
.container_bg__dark {
  background-color: var(--main-bg-color-grey);
}
.container_bg__custom {
  background-color: var(--main-bg-color-custom);
}
.container_bg_img {
  top: 0;
  left: 15px;
  width: calc(100% - 30px);
  height: 100%;
}
.img-container {
  width: 100%;
  height: 90%;
  bottom: 0;
  overflow: hidden;
}
.img-container__rounded-left {
  border-top-left-radius: calc(var(--radius) * 6.66);
  right: 0;
}
.img-container__rounded-right {
  border-top-right-radius: calc(var(--radius) * 6.66);
  left: 0;
}
.career-section .img-container__rounded-right {
  height: 82%;
}

.title_box {
  position: relative;
}
.title_box > * {
  position: relative;
  font-family: var(--headings-font-family);
  font-weight: var(--font-weight-medium);
  color: var(--main-color-dark);
  line-height: 1.2em;
}
.text-white .title_box > * {
  color: var(--white);
}
.title_box :is(h1, h2) {
  font-size: calc(28px + (42 - 28) * ((100vw - 320px) / (1920 - 320)));
}
.title_box small {
  font-size: 100%;
  color: inherit;
}

/* Quarter-Bg */

.quarter-bg {
  position: absolute;
  top: 0;
  z-index: -10;
  width: 0;
    height: 0;
    border-right: 27vw solid transparent;
    border-bottom: 27vw solid transparent;
    border-left: 27vw solid var(--main-bg-color-custom);
}
.quarter-bg__custom {
  background-color: var(--main-bg-color-custom);
}
.quarter-bg__grey {
  /*background-color:var(--main-bg-color-custom);*/
}
.quarter-bg__left {
  left: 0;
  
}
.quarter-bg__right {
  right: 0;
  border-bottom-left-radius: 100%;
}

/* Header ............................................................... */

header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: clamp(15px, 2vw, 40px);
  padding-bottom: clamp(15px, 2vw, 40px);
  z-index: 900;
}
.header.scroll {
  position: fixed;
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: var(--main-color-dark);
  animation: animateNav 0.4s linear;
}
.header:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: clamp(100px, 10vw, 200px);
  z-index: -1;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.9) 30%,
    rgba(0, 0, 0, 0) 100%
  );
}
.header.scroll:before {
  display: none;
}
@keyframes animateNav {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}

.main_logo {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 100;
  
  max-height:100px;
}
.main_logo img {
  width: clamp(300px, 20vw, 500px);
}
.header.scroll .main_logo img {
  width: 200px;
}
.buttons_wrapper {
  top: 50%;
  right: calc(var(--size) * 6);
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  gap: clamp(0.3rem, 1.2vw, 0.7rem);
  z-index: 5;
}
.buttons_wrapper a {
  width: clamp(30px, 2.5vw, 45px);
  aspect-ratio: 1;
  background-color: var(--main-bg-color-custom);
}
.buttons_wrapper a:hover {
  background-color: color-mix(
    in srgb,
    var(--main-bg-color-custom) 70%,
    white 30%
  );
}

.mainNavigation {
  padding: 0;
}
.mainNavigation .navbar-nav {
  margin: 0;
}
.mainNavigation a.nav-link {
  position: relative;
  font-family: var(--font-family-medium);
  font-size: 1rem;
  color: var(--white) !important;
  line-height: 40px;
  padding: 0 !important;
  border-bottom: 0;
}
.mainNavigation .navbar-nav--a {
  gap: clamp(15px, 2vw, 60px);
}
.mainNavigation .navbar-nav--b {
  margin-right: clamp(8rem, 10vw, 11rem);
  gap: clamp(15px, 2vw, 60px);
}
.mainNavigation a.nav-link span {
  position: relative;
  display: inline-block;
}
.mainNavigation a.nav-link span:after {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: "";
  width: 0;
  height: 2px;
  background-color: var(--main-bg-color-custom);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}
.mainNavigation a.nav-link:hover span:after {
  width: 100%;
  opacity: 1;
}
.mainNavigation li.dropdown a.nav-link:hover span:after {
  display: none;
}

.mainNavigation .dropdown-menu {
  background-color: transparent;
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
}
.mainNavigation .dropdown-menu a.dropdown-item {
  font-size: 0.94rem !important;
  color: var(--white);
  line-height: 30px !important;
  background-color: var(--main-bg-color-custom);
  margin-left: 0 !important;
  border-bottom: 1px solid
    color-mix(in srgb, var(--main-bg-color-custom) 50%, white 50%);
  z-index: 1100;
}
.mainNavigation .dropdown-menu a.dropdown-item:first-child {
  border-top-left-radius: 0.823em;
  border-top-right-radius: 0.823em;
}
.mainNavigation .dropdown-menu a.dropdown-item:last-child {
  border-bottom: 0;
  border-bottom-left-radius: 0.823em;
  border-bottom-right-radius: 0.823em;
}
.mainNavigation .dropdown-menu a.dropdown-item:hover {
  color: var(--white);
  background-color: color-mix(
    in srgb,
    var(--main-bg-color-custom) 70%,
    white 30%
  );
}

/* Dropdown Transition */

.mainNavigation .dropdown-menu {
  display: block;
  visibility: hidden;
  opacity: 0;
  transform: translateY(50px);
  transition: 0.5s ease all;
}
.mainNavigation .dropdown-menu.show {
  display: block;
  visibility: visible;
  opacity: 1;
  transform: translateY(0px);
  transition: 0.5s ease all;
}

/* Rslider ............................................................... */

.slider-wrapper .owl-carousel .animated {
  -webkit-animation-duration: 1000ms;
  animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.slider-wrapper .owl-carousel .owl-animated-in {
  z-index: 0;
}
.slider-wrapper .owl-carousel .owl-animated-out {
  z-index: 1;
}
.fadeOutScale {
  animation-name: fadeOutScale;
}
@keyframes fadeOutScale {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.fadeInScale {
  animation-name: fadeInScale;
}
@keyframes fadeInScale {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.slider-wrapper {
  width: 100%;
  height: 100dvh;
}
.slider-wrapper .owl-carousel,
.slider-wrapper .item {
  height: 100dvh;
}
.slider-wrapper-in {
  height: 40dvh;
}
.slider-wrapper-in .owl-carousel,
.slider-wrapper-in .item {
  height: 40dvh;
}
.carousel-content-wrapper {
  color: var(--white);
  background-color: rgba(0, 0, 0, 0.25);
}
.carousel-content {
  position: relative;
  padding-bottom: 5vh;
  padding-top: clamp(2.5rem, 4vw, 4rem);
  /*border-top: 1px solid var(--white);*/
  z-index: 2;
  background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
}
.carousel-title {
  font-family: var(--headings-font-family);
  font-size: clamp(1.8rem, 3vw, 3.77rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.2;
}
.slider-description {
  font-size: 1.11rem;
}
a.slider-circle-button {
  background-color: var(--white);
  color: var(--main-color-dark);
  width: clamp(40px, 2vw, 70px);
  aspect-ratio: 1/1;
  font-size: 1.5rem;
}
a.slider-circle-button:hover {
  background-color: color-mix(
    in srgb,
    var(--main-bg-color-custom) 70%,
    white 30%
  );
  color: var(--white);
}
.slider-bullets {
  font-size: 1rem;
  line-height: 1.6;
}
.slider-bullets li {
  position: relative;
  margin-bottom: 0.75rem;
  padding-left: 1.1rem;
}
.slider-bullets li::before {
  content: "\2022";
  position: absolute;
  top: 0.1rem;
  left: 0;
  color: var(--white);
  font-size: 1.2rem;
  line-height: 1;
}
.slider-quarter {
  position: absolute;
  bottom: 0;
  right: 0;
  /*width: 42vw;
  aspect-ratio: 1 / 1;
  background-color: var(--main-bg-color-custom);
  */
  opacity: 0.7;
  z-index: 1;
  
      border-left: 42vw solid transparent;
    border-top: 42vw solid transparent;
    border-right: 42vw solid var(--main-bg-color-custom);
}
.slider-image {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -5;
}

/* Main-Content ............................................................... */

.owl-navigation {
  display: flex;
  gap: clamp(1rem, 1.5vw, 4rem);
}
.owl-navigation .btn {
  width: clamp(50px, 2.5vw, 70px);
  aspect-ratio: 1;
  font-size: 1.33rem;
  color: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--white);
  padding: 0;
  border-radius: 50%;
}
.owl-navigation .btn:hover {
  color: var(--white);
  background-color: var(--main-bg-color-custom);
}
.owl-navigation .btn:focus,
.owl-navigation .btn.focus {
  box-shadow: none;
}

/* About-Us */

.corner-text {
  bottom: clamp(1rem, 5vw, 3rem);
  left: 50%;
  font-family: var(--headings-font-family);
  font-size: clamp(1.37rem, 3vw, 2.66rem);
  font-weight: var(--font-weight-medium);
  color: var(--white);
  text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
  line-height: 1.1;
  text-align: center;
  position: absolute;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 10;
}
.corner-text small {
  display: block;
  font-family: inherit;
  font-size: clamp(3rem, 7vw, 8.33rem);
  font-weight: inherit;
  line-height: 1;
}
.corner-text.section-heading-label {
  top: clamp(1.5rem, 4vw, 3rem);
  left: calc(var(--size) * 6);
  bottom: initial;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.corner-text.cta-contact-heading {
  position: relative;
  top: clamp(1.5rem, 4vw, 3rem);
  left: calc(var(--size) * 6);
  bottom: initial;
  text-align: left;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  margin-bottom: 2.5rem;
}
.corner-text.cta-contact-heading small {
  font-size: clamp(2rem, 5vw, 5.55rem);
}
.corner-text.cta-contact-heading span {
  color: var(--main-bg-color-custom);
}

/* Offer */

.offer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 2vw, 2rem);
}
.offer-card {
  border-radius: calc(var(--radius) * 2);
  overflow: hidden;
  isolation: isolate;
}
.offer-image-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.offer-card img {
  object-fit: cover;
  transition: transform 0.5s ease;
  height: 100%;
}
.offer-card:hover img {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}
.offer-content {
  top: 0;
  left: 0;
  padding: clamp(1rem, 2.5vw, 2.5rem);
  color: var(--white);
  z-index: 2;
}
.offer-card .offer-title {
  font-family: var(--headings-font-family);
  font-weight: var(--font-weight-medium);
  font-size: clamp(1.57rem, 1.8vw, 2.67rem);
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 0rem;
}
.offer-description-wrapper {
  overflow: hidden;
  transition: max-height 0.5s ease;
  max-height: 0;
}
.offer-card:hover .offer-description-wrapper {
  max-height: 300px;
}
.offer-description {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  gap: clamp(1rem, 2.5vw, 2.5rem);
  flex-wrap: nowrap;
  display: flex;
  pointer-events: none;
}
.offer-card:hover .offer-description {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.offer-button {
  background-color: var(--white);
  color: var(--main-bg-color-custom);
  width: clamp(40px, 2vw, 70px);
  aspect-ratio: 1/1;
  font-size: 1.5rem;
  flex-shrink: 0;
}
.offer-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.3);
  transition: opacity 0.6s ease;
  z-index: 1;
}
.offer-card:hover::before {
  background-color: rgb(0 169 234 / 75%);
}

/* News */

.news-section .card {
  overflow: hidden;
  border-radius: var(--radius);
}
.news-section .card:hover .card-img-top {
  filter: brightness(0.7);
}
.news-section .card-body {
  padding: clamp(1rem, 2vw, 2.5rem);
}
.news-section .card-title {
  font-family: var(--font-family-medium);
  font-size: clamp(1.25rem, 1.4vw, 1.33rem);
  color: var(--main-color-dark);
  line-height: 1.2;
}
.news-section .card-text {
  color: var(--main-color);
  margin: 0;
}

/* Career */

.career-offer h3.career-offer-title {
  font-family: var(--font-family-medium);
  font-size: 1.33rem;
  line-height: 1.2;
}
.career-offer h3.career-offer-title a {
  color: var(--white);
  border-bottom: 0;
}
.career-offer h3.career-offer-title a:hover {
  color: var(--main-color-hover);
}
.career-offer-description {
  color: color-mix(in srgb, var(--white) 65%, var(--main-bg-color-grey));
}

/* Fence-Types */

.fence-title {
  font-family: var(--headings-font-family);
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.2;
}
.fence-title a {
  color: var(--main-bg-color-custom);
  border-bottom-color: transparent;
}
.fence-title a:hover {
  color: var(--main-color-dark);
  border-bottom-color: inherit;
}
.fence-description .col-md-3 {
  font-size: 1rem;
}
.fence-description .border-left {
  border-left: 1px solid var(--main-bg-color-custom) !important;
}
.fence-description .border-right {
  border-right: 1px solid var(--main-bg-color-custom) !important;
}

/* Product-Tabs */

.product-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem;
  border-bottom: 0;
}
.product-tabs .nav-link {
  background-color: var(--main-color-dark);
  color: var(--white);
  font-family: var(--font-family-medium);
  font-size: clamp(0.7rem, 1.2vw, 1.33rem);
  padding: clamp(0.5rem, 1.5vw, 1.5rem) clamp(1rem, 1.5vw, 4rem);
  border: none;
  border-radius: 0;
}
.product-tabs .nav-link:hover,
.product-tabs .nav-link.active {
  color: var(--white);
  background: var(--main-bg-color-custom);
}
.product-pattern-grid {
  display: grid;
  gap: clamp(1rem, 2vw, 2rem);
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}
.product-pattern-grid a img {
  width: 100%;
  height: auto;
  border-radius: 0.25rem;
  display: block;
}
.product-pattern-grid a:hover img {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

/* Product-Types */

.product-types-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: clamp(1rem, 3vw, 2rem);
  justify-items: center;
}
.product-type img {
  max-width: 100%;
  height: auto;
}
.product-type:hover img {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

/* Product-Video */

.video_container {
  height: 70dvh;
}
.video_container a.img-nav {
  isolation: isolate;
}
.video_container a.img-nav:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background: rgba(24, 24, 25, 0.3);
}
.video_container a.img-nav:hover:before {
  background: rgba(24, 24, 25, 0);
}
.video_container a.img-nav > img {
  z-index: -1;
}
.video_container a.img-nav .img-nav-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.video_container a.img-nav .img-nav-icon img {
  width: clamp(60px, 6vw, 130px);
  opacity: 0.75;
}
.video_container a.img-nav:hover .img-nav-icon img {
  opacity: 1;
}

/* Product-Gallery */

a.gallery_nav {
  aspect-ratio: 4/3;
  border-radius: var(--radius);
}
a.gallery_nav:hover img {
  filter: brightness(0.7);
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

/* Footer ............................................................... */

.footer {
  font-size: 0.89rem;
  line-height: 1.6;
}
.footer address,
.footer a {
  color: color-mix(in srgb, var(--white) 65%, var(--main-bg-color-grey));
  margin: 0;
  border-bottom: 0;
}
.footer a:hover {
  color: var(--white);
}
.footer_top_text {
  font-size: clamp(1.25rem, 1.7vw, 1.675rem);
  line-height: 1.2;
}
.footer_top_text span {
  color: color-mix(in srgb, var(--white) 65%, var(--main-bg-color-grey));
}
.footer_top_logo img {
  width: clamp(250px, 25vw, 500px);
  margin-top: 0.5rem;
}
.footer_middle {
  border-top: 1px solid
    color-mix(in srgb, var(--white) 40%, var(--main-bg-color-grey));
  border-bottom: 1px solid
    color-mix(in srgb, var(--white) 40%, var(--main-bg-color-grey));
}
.footer_middle h3 {
  font-size: clamp(1rem, 1.3vw, 1.125rem);
  color: var(--white);
}
.footer_bottom_logo img {
  width: clamp(150px, 5vw, 210px);
}
.footer_bottom .list-inline .list-inline-item:not(:last-child) {
  margin-right: 0.25rem;
}
.footer_bottom .list-inline .list-inline-item:not(:last-child):after {
  content: "|";
  padding-left: 0.5rem;
  color: color-mix(in srgb, var(--white) 65%, var(--main-bg-color-grey));
}

/* Effects ............................. */

a,
.cta_button .arrow,
.cta_button .arrow i,
.mainNavigation a.nav-link span:after,
.mainNavigation .dropdown-menu a.dropdown-item,
.buttons_wrapper a,
a.slider-circle-button,
.news-section .card .card-img-top,
.product-tabs .nav-link,
.product-type img,
.product-pattern-grid a img,
.video_container a.img-nav:before,
.video_container a.img-nav .img-nav-icon img,
a.gallery_nav img {
  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear;
}

/* RESPONSIVE STRUCTURE
--------------------------------------- */

@media screen and (max-width: 1920px) {
  html {
    font-size: 16px;
  }
}

@media screen and (max-width: 1366px) {
  :root {
    --radius: 14px;
  }
  .cta_button .arrow {
    width: 32px;
  }
  .cta_button .arrow i {
    font-size: 1.31rem;
  }
  html {
    font-size: 14px;
  }
  .box_margin {
    margin-bottom: var(--size);
  }
  .box_margin3 {
    margin-bottom: calc(var(--size) * 2);
  }
  .box_padding {
    padding-left: calc(var(--size) * 4.66);
    padding-right: calc(var(--size) * 4.66);
  }
  .box_padding_vertical {
    padding-top: calc(var(--size) * 5);
    padding-bottom: calc(var(--size) * 5);
  }
  .buttons_wrapper {
    right: calc(var(--size) * 4.66);
  }
  .corner-text.section-heading-label {
    left: calc(var(--size) * 4.66);
  }
}

@media screen and (max-width: 1200px) {
  .box_padding {
    padding-left: calc(var(--size) * 2);
    padding-right: calc(var(--size) * 2);
  }
  .box_padding_vertical {
    padding-top: calc(var(--size) * 4);
    padding-bottom: calc(var(--size) * 4);
  }
  .buttons_wrapper {
    right: calc(var(--size) * 2);
  }
  .corner-text.section-heading-label {
    left: calc(var(--size) * 2);
  }
}

@media screen and (max-width: 991px) {
  .container-fluid-custom {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .box_margin3 {
    margin-bottom: var(--size);
  }
  .box_padding {
    padding-left: var(--size);
    padding-right: var(--size);
  }
  .box_padding_vertical {
    padding-top: calc(var(--size) * 3);
    padding-bottom: calc(var(--size) * 3);
  }
  .header {
    position: fixed !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    background-color: var(--main-color-dark);
    animation: none !important;
  }
  .header:before {
    display: none;
  }
  .header + div,
  .header + section {
    margin-top: 64px;
  }
  .main_logo {
    top: 8px !important;
    left: 15px;
    -webkit-transform: translate(0) !important;
    transform: translate(0) !important;
  }
  .main_logo img {
    width: 150px !important;
  }
  .mainNavigation .nav-item {
    text-align: center;
    margin-left: 0;
  }
  .buttons_wrapper {
    top: 17px;
    right: 80px;
    transform: translateY(0);
    -webkit-transform: translateY(0);
  }
  .mainNavigation .navbar-nav {
    gap: 1rem;
  }
  .mainNavigation .navbar-nav--b {
    margin-right: 0;
  }
  .mainNavigation a.nav-link {
    font-size: 1.12rem;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 10px;
  }
  .mainNavigation a.nav-link:before {
    display: none;
  }
  .mainNavigation li.dropdown a.nav-link:hover span:after {
    display: block;
  }
  .mainNavigation .dropdown-menu a.dropdown-item {
    text-align: center;
  }
  .mainNavigation .dropdown-menu {
    height: 0;
    visibility: visible;
    opacity: 0;
    transform: translateY(0);
    transition: 0.5s ease all;
  }
  .mainNavigation .dropdown-menu.show {
    display: block;
    height: auto;
    visibility: visible;
    opacity: 1;
    transform: translateY(0px);
    transition: 0.5s ease all;
  }
  .mainNavigation .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }
  .slider-wrapper {
    height: calc(100dvh - 64px);
  }
  .slider-wrapper .owl-carousel,
  .slider-wrapper .item {
    height: calc(100dvh - 64px);
  }
  .slider-wrapper-in {
    height: 40dvh;
  }
  .slider-wrapper-in .owl-carousel,
  .slider-wrapper-in .item {
    height: 40dvh;
  }
  .carousel-content-wrapper {
    background-color: rgba(0, 0, 0, 0.45);
  }
  .carousel-content {
    padding-bottom: 0;
    padding-top: 0;
    border-top: 0;
  }
  .slider-quarter {
    width: 25vw;
    opacity: 0.95;
  }
  .corner-text.section-heading-label {
    left: var(--size);
  }
}

@media screen and (max-width: 767px) {
  .cta_button__colorswitch {
    color: var(--main-color) !important;
    border-color: var(--main-bg-color-custom) !important;
  }
  .cta_button__colorswitch:hover .arrow {
    animation: bgcolor-a 0.3s ease forwards 0.3s;
  }
  .custom-relative {
    position: relative;
  }
  .container_bg_img {
    left: 0;
    width: 100%;
    height: auto;
  }
  .img-container {
    height: auto !important;
    aspect-ratio: 16/9 !important;
  }
  .corner-text {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    text-shadow: none;
    text-align: left;
    position: relative;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    margin-bottom: -2rem;
    padding-top: 2rem;
    padding-left: 1rem;
  }
  .corner-text.cta-contact-heading {
    margin-bottom: 0;
  }
  .offer-grid {
    grid-template-columns: 1fr;
  }
  .fence-description .border-left {
    border-left: 0 !important;
  }
  .fence-description .border-right {
    border-right: 0 !important;
  }
  .product-types-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .product-pattern-grid {
    grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  }
}

@media screen and (max-width: 575px) {
  .product-types-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.loader{
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:999999999;
    background-color:rgba(0,0,0,0.8);
}
.loader .outside,.loader .inside{
        position:absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        margin:auto;
    }
.loader    .outside{width:15em;
             height:15em;
             border-radius:50%;
             font-size:10px;
             text-indent:-9999em;
             border-top:.3em solid rgba(67,169,200,0.7);
             border-right:.3em solid rgba(67,169,200,0.3);
             border-bottom:.3em solid rgba(67,169,200,0.3);
             border-left:.3em solid rgba(67,169,200,1);
             -webkit-transform:translateZ(0);
             -ms-transform:translateZ(0);
             transform:translateZ(0);
             -webkit-animation:loader 1.1s infinite linear;
             animation:loader 1.1s infinite linear;
             &:after{border-radius:50%;width:15em;height:15em}
    }
 .loader   .inside{
        background-image:url('../images/main_logo.png');
        background-position:50% 50%;
        background-repeat:no-repeat;
        -webkit-transform:translateZ(0);
        -ms-transform:translateZ(0);transform:translateZ(0);
        -webkit-animation:zoom 1.1s infinite linear;
        animation:zoom 1.1s infinite linear;
        max-width: 110px;
        background-size: contain;
    }
	.park-box h2{color:var(--main-bg-color-custom)}
	
.services-box h3{ color:var(--main-bg-color-custom);}
.services-box img{max-width:100px;margin-bottom:15px;}
.services-list .wrapper{border-radius:15px;background:#ddd;padding:35px;}
.services-list img{border-radius:15px;}
.services-list h3{ color:var(--main-bg-color-custom);}
.services-list ul{ list-style-type:disc}
.services-list-tab .nav-tabs .nav-link{color:var(--main-bg-color-custom);font-size: 1.45rem;}
.services-list-tab .nav-tabs .nav-link.active{background: #ddd;color:#333;border-bottom: 0;}
.services-list-tab .tab-content > .active {
    border-radius:0 0 15px 15px;
    background: #ddd;
	
}