/* ----------Main Settings-------------*/
:root {
  --general-site-padding: 30px 70px 80px 70px;
  --bg2-color: #312a29;
  --body-bg-color: #FFE4C4;
  --primary-color: #FF4500;
  --secondary-color: #FF8C00;
  --text-color: rgb(99, 53, 21);
  --extra-color: #ff6347; }

html {
  scroll-behavior: smooth; }

body {
  color: var(--text-color);
  font-family: Arial, Helvetica, sans-serif; }

.general-site {
  padding: var(--general-site-padding); }

.container-fluid {
  background-color: var(--body-bg-color);
  padding: 0; }

main {
  line-height: 1.8em !important; }

main h1 {
  color: var(--primary-color);
  margin-bottom: 30px; }

h2,
h3,
h4,
h5 {
  color: var(--primary-color);
  margin-bottom: 30px; }

ul li {
  list-style: none; }

.zoznam li::before {
  content: ">";
  display: inline-block;
  width: 1em;
  margin-left: -1em;
  color: var(--primary-color);
  font-weight: bold; }

span {
  color: var(--primary-color);
  font-weight: bolder; }

a {
  text-decoration: none;
  color: var(--primary-color); }

a:hover {
  text-decoration: none;
  font-weight: bold;
  color: var(--primary-color); }

.image {
  border: none !important;
  box-shadow: none !important; }

/*  ------------Header settings-----------*/
.navbar-toggler {
  background-color: var(--bg2-color) !important;
  color: var(--primary-color) !important; }

.navbar-toggler:hover {
  color: var(--secondary-color) !important; }

.front-line {
  background: #FF4500;
  background: -moz-linear-gradient(top, #FF4500 0%, #ff6347 50%, #FF4500 100%);
  background: -webkit-linear-gradient(top, #FF4500 0%, #ff6347 50%, #FF4500 100%);
  background: linear-gradient(to bottom, #FF4500 0%, #ff6347 50%, #FF4500 100%);
  color: white; }

.front-line a,
.front-line a:hover {
  color: white; }

.logo {
  text-align: left; }

.logo h1 i {
  color: #ffc107;
}

.info {
  text-align: right; }

.jumbotron {
  background-image: url(images/Header_sauna.jpg);
  background-size: cover;
  height: 380px;
  position: relative;
  margin: 0 !important; }

.jumbotron h1 {
  background-color: white;
  color: black;
  font-size: 10vw;
  /* Responsive font size */
  font-weight: bold;
  margin: 0 auto;
  /* Center the text container */
  padding: 10px;
  text-align: center;
  /* Center text */
  position: absolute;
  /* Position text */
  top: 50%;
  /* Position text in the middle */
  left: 50%;
  /* Position text in the middle */
  transform: translate(-50%, -50%);
  /* Position text in the middle */
  mix-blend-mode: screen;
  /* This makes the cutout text possible */
  opacity: 0.5; }

/* --------------Main Nav Settings ---------*/
.main-nav {
  margin-top: 10px;
  margin-bottom: 10px;
  background-color: var(--body-bg-color) !important; }

.nav-item {
  text-align: center !important; }

.main-nav a {
  color: white !important;
  background-color: var(--primary-color);
  margin-right: 10px;
  border-radius: 90px 90px 90px 90px;
  width: 120px;
  font-size: 1.2em; }

.active a {
  background-color: var(--secondary-color); }

/* ---------Aside settings-------------*/
.aside {
  border-radius: 80px 0px 0px 80px;
  padding-top: 80px;
  padding-bottom: 80px;
  margin-bottom: 60px;
  background-color: var(--bg2-color);
  color: var(--primary-color) !important; }

.aside h3,
a {
  color: var(--primary-color); }

.aside a:hover {
  color: var(--secondary-color); }

.aside img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 70%; }

.aside:hover {
  box-shadow: -2px 5px 19px 3px var(--secondary-color); }

.list {
  position: sticky;
  top: 20px; }

#scroll-list a {
  background-color: var(--bg2-color);
  color: var(--primary-color);
  font-weight: bold; }

#scroll-list a:hover {
  color: var(--secondary-color); }

.list-group-item {
  border: none !important; }

.back {
  margin-left: 45%; }

.back:hover {
  color: var(--secondary-color) !important; }

/*------Index site----------*/
.portfolio {
  padding-left: 60px;
  padding-right: 30px;
  padding-bottom: 60px;
  background-color: var(--bg2-color);
  width: 100%; }

.portfolio a,
a:hover {
  color: var(--text-color); }

.product {
  padding: 0;
  margin: 30px;
  background-color: var(--body-bg-color);
  transition: 0.5s; }

.product:hover {
  box-shadow: -2px 5px 19px 3px var(--secondary-color);
  transform: scale(1.03); }

.product .zoznam li {
  padding-top: 20px;
  padding-bottom: 8px;
  font-weight: bold;
  letter-spacing: unset !important; }

.picture {
  transition: 0.5s;
  position: relative; }

.picture img {
  width: 100%;
  border: none !important;
  position: relative; }

.col-md-6 {
  margin: 0 !important;
  padding: 0 !important; }

.text-block {
  position: absolute;
  bottom: 0;
  background: black;
  /* Fallback color */
  background: rgba(0, 0, 0, 0.5);
  /* Black background with 0.5 opacity */
  color: #f1f1f1;
  /* Grey text */
  width: 100%;
  /* Full width */
  padding: 15px;
  /* Some padding */
  box-shadow: none !important;
  transition: 1.1s;
  max-height: 80px; }

.text-block h3 {
  text-align: center; }

/* ----------- Cena page --------------*/
.tab-price {
  color: var(--body-bg-color) !important; }

table {
  width: 100%;
  background-color: #19334d;
  font-size: 1.2em;
  text-align: left;
  padding: 20px;
  margin: auto; }

td,
th {
  padding: 20px; }

tbody {
  border-collapse: solid #00334d;
  color: #8585ad; }

tbody tr:nth-child(odd) {
  background-color: #244d75; }

tbody tr:nth-child(even) {
  background-color: #1f4061; }

thead th:nth-child(1) {
  width: 15%; }

thead th:nth-child(2) {
  width: 60%; }

thead th:nth-child(3) {
  width: 15%; }

tr td:nth-child(1) {
  color: tomato; }

.well {
  font-weight: bold; }

.cena {
  font-weight: bold;
  background-color: var(--extra-color); }

/*---------contact form settings */
.fixed-contact {
  position: sticky;
  top: 20px; }

.btn-warning {
  background-color: var(--secondary-color) !important; }

input,
textarea,
select {
  border: solid 2px var(--extra-color) !important; }

.btn-warning {
  transition: .7; }

.btn-warning:hover {
  transform: scale(1.1); }

/*--------FAQ-----Card options - accordion- FAQ-------------*/
.card {
  border: none !important; }

.card-header {
  background: #312a29; }

.card-header:hover {
  box-shadow: -2px 5px 19px 3px var(--secondary-color); }

.card button {
  font-weight: bold;
  color: var(--primary-color);
  width: 100%;
  text-align: left;
  text-decoration: none !important; }

.card button:hover {
  color: var(--secondary-color); }

/*----------Galeria-Navigations-------------*/
/* .gallery {
  background-image: url("background.jpg"); } */

.gallery h3 {
  text-align: center;
  border-radius: 90px;
  padding: 5px;
  background-color: var(--bg2-color);
  max-width: 500px; }

.card-gallery {
  width: 300px;
  margin-top: -50px; }

.card-gallery .card-body {
  padding: 0 !important; }

#collapse-gallery {
  background-color: var(--body-bg-color);
  border: none !important; }

.filter-buttons {
  position: sticky;
  top: 0;
  padding-bottom: 5px; }

.filter-buttons button {
  background-color: var(--bg2-color) !important;
  font-weight: bold;
  color: var(--primary-color);
  border-top: none !important;
  border-right: solid var(--primary-color) 3px !important;
  border-bottom: none !important;
  border-left: none !important;
  border-radius: 0 !important; }

.filter-buttons button:last-child {
  border-right: none !important; }

.filter-buttons button:hover {
  color: var(--secondary-color) !important; }

.btn:focus,
.btn:active {
  outline-color: var(--secondary-color) !important;
  box-shadow: none !important;
  color: var(--primary-color) !important; }

#gallery {
  margin-left: 60px;
  margin-right: 60px; }

#gallery h3 {
  margin-top: 50px; }

.filter-buttons {
  background-color: var(--bg2-color) !important;
  display: inline-block; }

.filter-buttons:hover {
  color: var(--secondary-color) !important; }

/* ----------Gallery IMGs settings-----------*/
.gallery {
  border: solid var(--bg2-color) 5px;
  padding-bottom: 80px; }

#gallery img {
  max-height: 400px;
  margin: 10px;
  cursor: pointer;
}

img {
  border: 1px solid #ddd;
  width: 300px;
}

#gallery img:hover {
  box-shadow: 0 0 2px 1px var(--primary-color); }

/*-------------Modal Images settings--------------*/


.modal {
  padding: 20px 0 20px 0;
  background-color: black;
}

.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  width: auto;
  overflow: scroll;
  max-height: calc(100vh - 100px);
}

.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;

}
.close:hover,
.close:focus {
color: #bbb;
text-decoration: none;
cursor: pointer;
}

/*---------Footer settings----------*/
footer {
  background-color: var(--primary-color);
  padding-top: 30px;
  color: white;
  height: 300px;
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 350px; }

.contact-footer {
  padding-left: 40px; }

footer hr {
  height: 2px;
  color: white;
  background-color: white;
  border: none; }

footer a {
  color: white; }

footer h4 {
  color: white; }

footer a:hover {
  color: white; }

.social-icons a {
  margin-left: 18px; }

.col-lg-6 {
  padding: 0 !important; }

@media only screen and (max-width: 992px) {
  main {
    width: 100%; }

  #gallery {
    padding-left: 130px; }

  .product {
    width: 100%;
    padding: 0 0 50px 0;
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0;
    transform: none !important;
    box-shadow: none !important; }

  .portfolio {
    padding-top: 20px;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    margin: 0; }

  .nav-item a {
    width: 100%;
    border-radius: 0;
    border-bottom: solid white;
    height: 70px;
    font-size: 1.5rem;
    font-weight: bold;
    padding-top: 15px; }

  .nav-link:hover {
    background-color: var(--secondary-color); }

  h2 {
    margin-left: 10px; }

  .footer-links {
    margin-left: -10px; }

  footer {
    padding-bottom: 500px; }

  .contact-footer {
    margin-top: 30px; }

  .portfolio .zoznam li {
    font-size: 2.1rem;
    padding-left: 20px; }

  .navbar-toggler {
    height: 80px !important;
    width: 80px !important; }

  .general-site {
    font-size: 1.2rem; }

  .text-block {
    bottom: 0;
    min-height: 120px; }

  .portfolio h2 {
    font-size: 2.8rem; }

  .text-block h3 {
    font-size: 3rem;
    padding-top: 13px; }

  .info {
    font-size: 1.5em; } }

/*# sourceMappingURL=custom.css.map */