/* Fonty */
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=Lora:ital,wght@0,400;1,400;1,600&family=Open+Sans:wght@500;600&display=swap");

/* Zmienne */
:root {
  --background: #eee;
  --color: #333;
  --fontSize: 16px;
}
/* Kod do całej strony */
* {
  font-family: "Lora", serif;
  font-size: var(--fontSize);
  color: var(--color);
}

body {
  margin: 0px;
}

nav {
  font-size: 1.15em;
}
.nav-brand {
  font-weight: 600;
}
.nav-item a {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  text-transform: uppercase;
}

nav a {
  text-decoration: none;
}

/* Znikający nav */
.landingnav {
  background-color: transparent;
}
/* Logotyp Facebooka */
.logo-nav {
  opacity: 0.85;
}
.logo-nav:hover {
  opacity: 0.7;
  transform: scale(1.15);
  transition: ease-in-out 0.4s;
}
.text-navbar {
  color: var(--color) !important;
  font-weight: 700;
  /* Animacja tekstu */
  --s: 0.1em; /* the thickness of the line */
  --c: var(--color); /* the color */

  color: #0000;
  padding-bottom: var(--s);
  background: linear-gradient(90deg, var(--c) 50%, #000 0)
      calc(100% - var(--_p, 0%)) / 200% 100%,
    linear-gradient(var(--c) 0 0) 0% 100% / var(--_p, 0%) var(--s) no-repeat;
  -webkit-background-clip: text, padding-box;
  background-clip: text, padding-box;
  transition: 0.5s;
}

.text-navbar:hover {
  --_p: 100%;
}
#navbarNavDropdown {
  max-width: 900px;
}
#header {
  padding: 0%;
}

/* Landing Page */

.overlay-bg {
  background-image: url("../Elements/landing.webp");
  background-position: center;
}

.overlay {
  background-repeat: no-repeat;
  background-size: cover;

  min-height: 93vh;
}

.widget {
  font-family: "Open Sans", sans-serif;
  font-size: 22px;
  font-weight: 600;
}
.widget-item {
  min-height: 12vh;
  color: #eee !important;
}
@media (max-width: 576px) {
  .widget-sm-text {
    font-size: 16px;
  }
}

/* Kampery na głównej */
@media (max-width: 567px) {
  .kamper-image {
    height: 50vh;
  }
}
@media (max-width: 768px) and (min-width: 568px) {
  .kamper-image {
    height: 70vh;
  }
}
@media (min-width: 769px) and (max-width: 992px) {
  .kamper-image {
    height: 50vh;
  }
}
@media (min-width: 992px) {
  .kamper-image {
    height: 45vh;
  }
}
.kampery-bg {
  background-color: #aaa;
  padding: 0;
}
.kamper-image {
  opacity: 90%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  position: relative;
  z-index: 0;
}
.kamper-image:hover {
  opacity: 100%;
  transform: scale(1.03, 1.03);
  z-index: 2;
  transition: ease-in 0.2s;
  text-shadow: 0 0 0.3em #333, 0 0 0.3em #333, 0 0 0.3em #333;
}

.kamper-text {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "lato", sans-serif;
  font-weight: 900;
  font-size: 4em;
  color: White;
}
.kampery a {
  text-decoration: none;
}
.burstner {
  background-image: url("../Elements/kampery/burstner_ixeo_time_670.webp");
}
.carado {
  background-image: url("../Elements/kampery/carado_t334.webp");
}
.hymer {
  background-image: url("../Elements/kampery/hymer_van_314.webp");
}
.knaus {
  background-image: url("../Elements/kampery/knaus_skyti_650mf.webp");
}
.transport {
  background-color: var(--background);
}
/* Mapa Google */
@media (max-width: 567px) {
  .mapa {
    width: 300px;
    height: 200px;
  }
}
@media (max-width: 768px) and (min-width: 568px) {
  .mapa {
    width: 500px;
    height: 300px;
  }
}
@media (min-width: 769px) and (max-width: 992px) {
  .mapa {
    width: 500px;
    height: 300px;
  }
}
@media (min-width: 993px) and (max-width: 1200px) {
  .mapa {
    width: 650px;
    height: 400px;
  }
}
@media (min-width: 1200px) {
  .mapa {
    width: 100%;
    min-height: 300px;
  }
}

.google-maps {
  position: relative;
  height: 0;
  overflow: hidden;
  width: 100% !important;
  height: 100% !important;
  min-height: 300px;
}
.google-maps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* Strony kamperów */
.naglowek {
  background: linear-gradient(0.25turn, #ffae00, #ffee00, #ffae00);
}
.naglowek-text {
  text-transform: uppercase;
  font-family: "Lato", sans-serif;
  font-weight: 600;
}

.naglowek-text:hover {
  text-shadow: -1px -1px 5px #fff, 1px 1px 5px #000;
  transition: 0.2s;
}
/* Karuzela */
/* Zmiana indicatorów */
.carousel-indicators button {
  height: 10px !important;
  width: 10px !important;
  margin: 0 10px !important;
  border-radius: 100%;
  background-color: #ffffff !important;
}
.carousel-indicators li {
  width: 1rem;
  height: 1rem;
  border: 1px solid;
  border-radius: 50%;
  background-color: #e0e0e0;
}

.carousel-indicators .active {
  background-color: #000000;
}
.spec-text {
  text-transform: uppercase;
  font-family: "Lato", sans-serif;
  font-weight: 600;
}
/* Karty cenników */
.cena-head {
  color: white;
  padding: 20px;
}
.head-orange{
  background-color: #ff6600;
}
.head-blue{
  background-color: #0872A5;
}
.body-orange{
  background: linear-gradient(0.5turn, #ffbe00, #ffee00);
}
.body-blue{
  background: linear-gradient(0.5turn, #71B4D5, #A4D3EA);
}
.cena-body {
  padding: 40px;
  font-family: "Lato", sans-serif;
  font-size: 20px;
  font-weight: 600;
}
.cena-h {
  font-family: "Lato", sans-serif;
  font-size: 50px;
  font-weight: 900;
  margin-bottom: 0px;
}
.cena-footer {
  background-color: #efefef;
}
.cena-button-orange {
  background-color: transparent;
  border: 2px solid #ff6600;
  color: #ff6600;
}
.cena-button-blue {
  background-color: transparent;
  border: 2px solid #0872A5;
  color: #0872A5;
}
.cena-button-orange:hover{
  background-color: #ff6600;
  border: 2px solid #ff6600;
  color: white;
}
.cena-button-blue:hover{
  background-color: #0872A5;
  border: 2px solid #0872A5;
  color: white;
}

/*Napisz*/
.napisz {
  min-height: 30vw;
  background-image: linear-gradient(
      to right bottom,
      rgba(255, 255, 255, 0.2),
      rgba(170, 170, 170, 0.2)
    ),
    url(../Elements/napisz-back.webp);
  background-size: cover;
  background-position: center;
}
.napisz input,
.napisz textarea {
  background-color: rgba(102, 102, 102, 0.7);
  border-color: #666;
  color: #aaa;
}
.napisz input::placeholder,
.napisz textarea::placeholder {
  color: #ccc;
}
.napisz input:focus,
.napisz textarea:focus {
  background-color: rgba(102, 102, 102, 0.7);
  border-color: #333;
}
/*Linki*/
.tel {
  color: #666 !important;
  text-decoration: none;
}
a.footer-link:link {
  color: #666 !important;
  text-decoration: none;
}
a.footer-link:hover {
  color: #999 !important;
  transition: ease-in-out 0.3s;
}
a.footer-link:visited {
  color: #666 !important;
  text-decoration: none;
}
a.footer-link:visited:hover {
  color: #999 !important;
  transition: ease-in-out 0.3s;
}

/* Stopka */

.footer-text {
  color: #666 !important;
}
.footer-text:hover {
  color: #999 !important;
  transition: ease-in-out 0.3s;
}
.wykonanie {
  background-color: #000;
  color: #666;
}