/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-top: 3rem;
  /*padding-bottom: 3rem;*/
  color: #5a5a5a;
}

.featurette-image { opacity:.75; transition: all .5s ease-in-out; }
.featurette-image:hover { opacity:1 }

.navbar-brand img { height:80px; }
.breadcrumb { border-bottom:1px solid var(--gray_color); padding-bottom:.5em; }

#checkVatService_data { border-radius: .25rem; position:relative; }
#close_checkVatService_data { right:.5em; top:.25em; position:absolute; color:red; display:none;}

/* */
a { text-decoration: none; color: var(--main_color_half); transition: color .15s ease-in-out;}
a:hover { color: var(--main_color) !important; }
/**/
.navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(255,255,255,1) !important;
}
.mt-7 { margin-top:7em !important; }
.navbar-brand:hover { color:#fff !important; }

.link-light { color:rgba(255,255,255,.55) !important; }
.link-light:hover { color:#fff !important; }

.fa-heading-icon { background:var(--main_color); width:140px; height:140px; color:#fff; font-size:2em; margin: auto; line-height: 140px; }

.text-muted { opacity: .5; }

.bg-dark { background: var(--main_color) !important }

.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.modal-header {
    background-color:var(--main_color);
    color:#fff;
}

.modal-footer {
    background-color:#dee2e6;
}

#login_error_txt { color:var(--main_color); font-weight:bold; }

#error_empty_basket, #error_payment { display:none; }

.uppercase { text-transform: uppercase }

.inquiry-link { background-color: rgba(255,255,255,.45); color:var(--main_color) !important; transition: all .15s ease-in-out;}
.inquiry-link:hover { background-color: transparent;}

footer { background:url("javno/footer-bg.jpg") no-repeat; background-size:cover; min-height:250px; background-position:center top; position:relative;}

.footer-text { position: absolute; bottom: 1em; left:2em; color:#ddd; }
.footer-scroll-up { position: absolute; bottom: 1em; right:2em;}
.footer-text a, .footer-scroll-up a { color:#ddd !important; }
.footer-text a:hover, .footer-scroll-up a:hover { color:#fff !important; }

  input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
  }

#pw_ok {
    display: none;
    color: #5cb854;
}

@media (min-width: 768px) {
    .bd-placeholder-img-lg {
      font-size: 3.5rem;
    }
}

#totop a:link {text-decoration:none !important;}

.carousel-indicators [data-bs-target] { height: 10px; background-color: var(--main_color); }
.carousel-indicators { bottom: 10%; }

/* CONTACT FORM; */
#form_holder { width:100%; height:100%;   display: flex; align-items: center;}

.form-signin {
  width: 100%;
  /*height: 100%;*/
  max-width: 330px;
  padding: 15px;
  margin: auto;
  background:#f5f5f5;
  text-align: center;
  padding-top: 40px;
  padding-bottom: 40px;
  border:1px solid #f1f1f1;
  border-radius:.5em;
}

.form-signin .checkbox {
  font-weight: 400;
}

.form-signin .form-floating:focus-within {
  z-index: 2;
}

.form-signin input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}  

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 45%;
  z-index: 10;
}

.carousel-caption h1 { font-weight:bold; text-shadow:2px 2px 2px #333; font-size: calc(1.375rem + 2vw);}

.carousel-caption p { color:var(--main_color); font-weight:bold; text-shadow:1px 1px 1px #333; font-size: calc(1.375rem + 1vw) !important;}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 100vh;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 100%;
  object-fit: cover;
}


/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 400;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  /* rtl:remove */
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    /*margin-top: 7rem;*/
  }
}


/* BASKET */
.uppercase { text-transform: uppercase; }

#shop_tabs i { font-size:1.3em !important;}
#shop_tabs .active_tab, 
#shop_tabs .inactive_tab { background-color:var(--main_color); color:#fff; height:3em !important; line-height:3em !important; border-left:1px solid var(--bs-gray-300); position:relative; }
#shop_tabs .inactive_tab { background-color:var(--bs-gray-300); color:var(--main_color); }
	
.tab3 {
    /*border-color: var(--gray_light) transparent var(--gray_light) var(--gray_light) !important;*/
}
.tab3 {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.5em 0 1.5em 1.5em;
    border-color: var(--bs-gray-300) transparent var(--bs-gray-300) var(--main_color);
    position: absolute;
    top: 0;
    right: -1px;
}

#agree, #same_delivery, #rememberme, #taxpayer, .big_check {
    -ms-transform: scale(1.5); /* IE */
    -moz-transform: scale(1.5); /* FF */
    -webkit-transform: scale(1.5); /* Safari and Chrome */
    -o-transform: scale(1.5); /* Opera */
    transform: scale(1.5);
    cursor:pointer;
    /*margin-left:-1rem !important;*/
}
.big_check {
	/*margin-left:0 !important;*/
}

/* VIDEO */

.bg-dark-60 {  margin:3em 0; }
/*
.bg-dark-60::before {
    position: absolute;
    background: rgba(34, 34, 34, 0.8);
    content: " ";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    
}
*/
.video-box {
    text-align: center;
    padding: 40px 0;
    z-index:1000;
}

.video-title {
    letter-spacing: 4px;
    font-size: 30px;
    margin: 10px 0 0;
}

.video-title, .video-subtitle { color:#fff !important }

.font-alt { letter-spacing: 2px; }

.video-section {
    position: relative;
    padding: 140px 0;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}

a.video-pop-up { display:inline-block;  color:rgba(255, 255, 255, .75);  transition: all .5s ease-in-out; border:1px solid transparent; font-size:2em; border-radius:50%; width:2em; height:2em; line-height:2em;}

a.video-pop-up:hover { 
    border:1px solid rgba(255, 255, 255, .5);
    color:#fff !important;
    background:var(--main_color);
}

.ekp-links { margin-left:2em;}
#scrollup a:hover { color:#fff !important; }
#scrollup { display:none; background-color:var(--main_color); color:#fff; padding:10px 15px; position:fixed; bottom:8em; right:1em; cursor:pointer; transition: 0.5s; opacity:.75; }
#scrollup:hover { background-color:var(--main_color); color:#fff !important; opacity:1; }

.img-ekp { width:300px; opacity:.75; transition: all .5s ease-in-out;}
.img-ekp:hover { opacity:1}

.footer-facebook {
    position: absolute;
    bottom: 5em;
    right: 1em;
}

.footer-facebook a { color: #ddd !important; opacity:.75; transition: 0.5s; width:44px; height:44px; line-height:44px; display: inline-block;
text-align: center;
background: var(--main_color);}
.footer-facebook a:hover { opacity:1;}

/* cookies */
#cookie_div {
    position: fixed;
    bottom: 0px;
    padding: 20px;
    text-align: center;
    width: 100%;
    z-index: 1000;
    background: var(--main_color);
    color: #ffffff;
}

#close_cookie_div {
    color: rgba(255,255,255,.7);
    position: absolute;
    top: 10px;
    right: 10px;
}
#close_cookie_div:hover{ color:rgba(255,255,255,1) !important}
/* /cookies */