/*
Theme Name: TAKA BS53 SL
Author: TAKA agencja
Description: Lightweight Bootstrap 5.3 based template focused on gaining site performance without using tons of plugins.
Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
body {
	background-color: #061228;
	color: #cbd0d0;
}
img {
	max-width: 100%;
	height: auto;
}

.logo {
	height: 90px;
}

* {
	font-family: 'Public Sans', sans-serif;
}
h1, h2, h3, .nav-link {
	color: #FFF;
}

.nav-link:hover, .navbar-nav .nav-link.active, .navbar-nav .nav-link:focus {
	color: #cbd0d0;
}
h1, h2 {
	font-size: 2rem;
	text-transform: uppercase;
	font-weight: 700;
}

h2 {
	margin-bottom: 2rem;
}

h3, .h3 {
	font-size: 1.25rem;
	font-weight: 300;
	margin-top: 2rem;
}


.img-offer-caption {
	font-size: 18px;
	font-weight: bold;
	padding: 15px 0;
}
.px-05 {
	padding-right: 0.05rem!important;
	padding-left: 0.05rem!important;
}
.carousel, .carousel-item {
	max-height: 100vh;
}
.carousel-item img {
	height: 100vh;
	width: auto;
}

.carousel-item::after {
	display: block;
        background-image: url(http://localhost/wp-content/uploads/2023/12/mask2.png);
	opacity: 0.1;
        content: " ";
        background-size: contain;
	background-repeat: no-repeat;
        left: 0;
        position: absolute;
        top: 0;
 height: 100vh;
	width: 100%;
        z-index: 2;
}

.animated {
            -webkit-animation-duration: 5s;
            animation-duration: 5s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
        }
          @-webkit-keyframes fadeInLeft {
            0% {
               opacity: 0;
               -webkit-transform: translateX(-20px);
            }
            100% {
               opacity: 1;
               -webkit-transform: translateX(0);
            }
         }
         
         @keyframes fadeInLeft {
            0% {
               opacity: 0;
               transform: translateX(-20px);
            }
            100% {
               opacity: 1;
               transform: translateX(0);
            }
         }
         
         .fadeInLeft {
         -webkit-animation-name: fadeInLeft;
         animation-name: fadeInLeft;
         } 
          
          @-webkit-keyframes fadeInRight {
            0% {
               opacity: 0;
               -webkit-transform: translateX(20px);
            }
            100% {
               opacity: 1;
               -webkit-transform: translateX(0);
            }
         }
         
         @keyframes fadeInRight {
            0% {
               opacity: 0;
               transform: translateX(20px);
            }
            100% {
               opacity: 1;
               transform: translateX(0);
            }
         }
         
         .fadeInRight {
         -webkit-animation-name: fadeInRight;
         animation-name: fadeInRight;
         } 

.carousel-item h1, .carousel-item p {
    text-shadow: 4px 4px 6px rgba(66, 68, 90, 1);
}

#header .container, .dropdown-menu {

        background-color: rgba(6, 18, 40, .4);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
}

.dropdown-item {
	color: #fff;
}

.ikonka {
	width: 80px;
	height: auto;
	margin-bottom: 1rem;
	opacity: 0.7;
	transition: opacity .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.cat-link {
	color: #cbd0d0;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 600;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.cat-link:hover .ikonka {
	opacity: 1;
}

.cat-link:hover {
	color: #ffffff;
}

.dropdown-item.active, .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: #000000;
}

.btn-danger {
	background-color: #dd1e23;
	border-color: #dd1e23;
}

.galeria {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
    justify-content: center;
}

.galeria-item img {
  width: 150px;
  height: auto;
  cursor: pointer;
  border-radius: 4px;
  transition: transform 0.2s;
}

.galeria-item img:hover {
  transform: scale(1.05);
}

.lightbox {
  display: none; 
  position: fixed;
  z-index: 9999;
  padding-top: 60px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.9);
  text-align: center;
}

.lightbox-content {
  max-width: 80%;
  max-height: 80%;
}

.close {
  position: absolute;
  top: 20px;
  right: 35px;
  color: #fff;
  font-size: 40px;
  cursor: pointer;
}

.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  color: #fff;
  font-size: 40px;
  padding: 16px;
  user-select: none;
	text-decoration: none;
}

.prev { left: 20px; }
.next { right: 20px; }