
:root{
  --titlecolor: #001C7D;
  --secondcolor: #16FABE;
  --dark-900: #02112a;
  --dark-700: #031a3a;
  --light-section: #f4f9ff;
  --glass: rgba(255,255,255,0.06);
  --container-max: 1100px;
}

*{box-sizing:border-box}
body{
  font-family: "Montserrat", sans-serif;
  margin:0;
  color:#000;
  background:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-size:18px;
  line-height:1.6;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
a{
  color:var(--titlecolor);
  text-decoration: none;
  font-weight: 500;
}
b, strong {
    font-weight: 500;
}
.o-hidden{
  overflow:hidden;
}
.image-title{
  width:80px;
}
.gallery-images .image-title{
  width:100%;
}
.res_vid {
  padding-top:3rem;
  padding-bottom:3rem;
}
.res_vid iframe{
  width:100%;
}
.container{
  padding-right: 30px;
  padding-left: 30px;
}

/* HERO */
.header{
  /*background-image:  url('../images/header.webp');*/
  background-size:cover;
  background-position:center;
  position:relative;
}
.header video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video covers the entire container */
  z-index: -1; /* Places the video behind other content in the header */
}
#particles-js{
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position:absolute;
}

/* NAV */
.navbar{
  background:transparent;
  padding-top:1rem;
  padding-bottom:1rem;
}
.navbar .navbar-brand .brand-text {
  line-height:1;
  font-weight:400;
  font-size:1.75rem;
  text-transform: uppercase;
}
.navbar .navbar-brand .brand-text .text-second{
  line-height:1;
  font-weight:700;
  font-size:1.75rem;
  color:var(--secondcolor);
  display:block;
}
.navbar .nav-link{
  color:var(--secondcolor);
  font-weight:600;
  padding:0.5rem 1.5rem 0.5rem 0;
  text-transform: uppercase;
  font-size:0.9rem;
}
.navbar .nav-link:hover{
  color:#fff;
}
/* Osnovni stilovi za toggler dugme */
.navbar-toggler {
  border: none;
  padding: 4px 8px;
  outline: none;
  box-shadow: none;
}

.navbar-toggler:focus {
  box-shadow: none;
}

/* Kreiranje custom hamburger ikone */
.navbar-toggler-icon {
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  vertical-align: middle;
  background-image: none;
  position: relative;
}

/* Tri horizontalne crte */
.navbar-toggler-icon::before,
.navbar-toggler-icon::after,
.navbar-toggler-icon {
  transition: all 0.3s ease-in-out;
  border-radius: 4px;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: var(--secondcolor);
  transition: all 0.3s ease-in-out;
}

.navbar-toggler-icon::before {
  top: 10px;
  transform: rotate(0deg);
}

.navbar-toggler-icon {
  background-color: var(--secondcolor);
  height: 4px;
  top: 50%;
  transform: translateY(-50%);
}

.navbar-toggler-icon::after {
  bottom: 10px;
  transform: rotate(0deg);
}

/* Transformacija u X kada se meni otvori */
/* Bootstrap dodaje .show klasu na .navbar-collapse kada se meni otvori */
.navbar-collapse.show ~ .navbar-toggler .navbar-toggler-icon::before,
.navbar-collapse.collapsing ~ .navbar-toggler .navbar-toggler-icon::before {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.navbar-collapse.show ~ .navbar-toggler .navbar-toggler-icon,
.navbar-collapse.collapsing ~ .navbar-toggler .navbar-toggler-icon {
  background-color: transparent;
}

.navbar-collapse.show ~ .navbar-toggler .navbar-toggler-icon::after,
.navbar-collapse.collapsing ~ .navbar-toggler .navbar-toggler-icon::after {
  bottom: 50%;
  transform: translateY(50%) rotate(-45deg);
}

/* Alternativno rešenje - koristi se aria-expanded atribut */
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  background-color: transparent;
}

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
  bottom: 50%;
  transform: translateY(50%) rotate(-45deg);
}

/* Dodatni stilovi za bolje korisničko iskustvo */
.navbar-toggler:hover .navbar-toggler-icon,
.navbar-toggler:hover .navbar-toggler-icon::before,
.navbar-toggler:hover .navbar-toggler-icon::after {
  opacity: 0.8;
}
.header.sticky .navbar{
  position:fixed;
  width:100%;
  background-image: url(../images/header.webp);
  background-size: cover;
  background-position: center;
  z-index: 100;
  top: 0;
}
.header.sticky .navbar .navbar-brand .brand-text .text-second{
  font-size:1rem;
  color:var(--secondcolor);
}
.header.sticky .navbar .navbar-brand .brand-text {
  font-size:0.83rem;
}
main.nothome.sticky-content {
  margin-top:100px;
}
/* HERO */
.hero{
  min-height:72vh;
  padding-top:6rem;
  padding-bottom:6rem;
  display:flex;
  align-items:center;
}
.hero .subtitle{
  letter-spacing:1px;
  color:var(--secondcolor);
  font-weight:400;
  margin-bottom:0;
  font-size:2.87rem;
}
.hero h1{
  font-size:5.2rem;
  font-weight:400;
  letter-spacing:1px
}
.hero .accent{
  display:block;
  color:var(--secondcolor);
  font-weight:700;
}
h2{
  position: relative;
  padding-left: 20px;
  color:var(--titlecolor);
  font-size:1.96rem;
  font-weight:700;
}
h2::before{
  content: "";
  position: absolute;
  left: -16px;
  top: 16px; /* Center vertically */
  width: 2rem; /* Length of the slash */
  height: 6px; /* Thickness of the slash */
  background-color: var(--secondcolor);; /* Color of the slash */
  transform: rotate(-60deg) skewX(30deg); /* Rotate for diagonal line */
  transform-origin: top; /* Ensure rotation is from the left edge */
}
h2.main-title{
  font-size:3.3rem;
  margin-top:4rem;
  margin-bottom:4rem;
  padding-left: 40px;
}
h2.main-title::before {
    width: 3.3rem;
    top: 26px;
    left: -10px;
    height: 8px;
}

.kockice{
  box-shadow: 0px 8px 32px 0px rgba(203, 211, 227, 0.8);
  background-color: #fff;
  height:100%;
}
.kockice:hover{
  background-color: rgba(0, 28, 125, 1);
  color:#fff;
}
.content-body p{
  font-weight: 300;
}
.content-body a{
  color:var(--titlecolor);
  font-weight: 500;
  text-decoration: none;
}
/*Udruzenje */
.udruzenje img{
  width:100%;
}

/*Vesti*/
.news{
  background-color:rgba(235, 242, 255, 1);
}
.news .item .con , .aktivnosti  .item .con{
    margin: -120px 20px 75px;
    padding: 15px 15px 25px 15px;
    background-color: #fff !important;
    border: 1px solid #fff;
    border-radius: 0;
    overflow: hidden;
    -webkit-transition: .2s cubic-bezier(.3, .58, .55, 1);
    transition: .2s cubic-bezier(.3, .58, .55, 1);
    bottom: -55px;
    position: relative;
}
.news .item img, .aktivnosti  .item img {
    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-filter: brightness(100%);
    width:100%;
}
.news .item:hover img, .aktivnosti  .item:hover img {
    -webkit-filter: none;
    filter: none;
    -webkit-transform: scale(1.09, 1.09);
    transform: scale(1.09, 1.09);
    -webkit-filter: brightness(75%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.news .item:hover .con, .aktivnosti  .item:hover .con {
    bottom: 0;
}
.news h5 , .aktivnosti  h5  {
  font-weight:600;
  color:var(--titlecolor);
  font-size:1.386rem;
  text-decoration: none;
}
.news a .category{
  color:#000;
  font-size:0.9rem;
}
.news .item, .aktivnosti .item{
position: relative;
overflow: hidden;
margin-bottom: 20px;
}
.news .owl-theme .owl-dots .owl-dot span, .aktivnosti .owl-theme .owl-dots .owl-dot span {
    -webkit-backface-visibility: visible;
    display: block;
    width: 12px;
    height: 12px;
    margin: 5px 7px;
    filter: Alpha(Opacity=100);
    opacity: 1;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #16FABE;
    background: transparent !important;
    transition-property: opacity;
    transition-duration: 200ms;
    transition-timing-function: ease;
}
.news .owl-theme .owl-dots .owl-dot.active span, .aktivnosti .owl-theme .owl-dots .owl-dot.active span {
    background:#16FABE !important;
}
.owl-dots{
  display: flex;
  justify-content: center;
}
.aktivnosti .owl-carousel .owl-dots.disabled{
  justify-content: center;
}
.news-info{
  min-width:320px;
  margin-bottom:2rem;
}
.news-author{
  font-size:1.277rem;
  font-weight: 600;

}
.social a:hover circle {
       fill: #001C7D; /* Changes the fill color to red on hover */
   }

#news .button span.kategorija{
  text-transform: lowercase;
  color:#fff;
}
#news .button:hover span.kategorija{
  color:var(--titlecolor);
}


.pridruzise{
  /*background-image:  url('../images/header.webp');*/
  background-color:#000628;
  background-size:cover;
  background-position:center;
  /*padding-top:6rem;
  padding-bottom:6rem;*/
}
.pridruzise p{
  color:#fff;
  margin:0;
  line-height: 1.4;
}
.pridruzise .button, .form__button .button, .clanstvo .button, #news .button{
  background:rgba(0, 28, 125, 1);
  padding:1rem 2rem;
  color:#fff;
  margin:0;
  line-height: 1;
  font-weight:700;
  font-size:1.56rem;
  display: inline-block;
    margin-top: 2rem;
    margin-bottom: 2rem;
    text-decoration: none;
    border:0;
    cursor: pointer;
}
.pridruzise .button span, .form__button .button span, .clanstvo .button span, #news .button span{
  color:var(--secondcolor);
}
.pridruzise .button:hover, .form__button .button:hover, .clanstvo .button:hover, #news .button:hover{
  background:var(--secondcolor);
  color:var(--titlecolor);
}
.pridruzise .button:hover span, .form__button .button:hover span, .clanstvo .button:hover span, #news .button:hover span{
  color:#fff;
}
.slider-wrap {
    position: absolute;
    height: 378px;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
    z-index: 0;
}
.slider-wrap img{
  width:100%;
}
.slide-item>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@keyframes fadezoom {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.2);
  }
}

.pridruzise .slick-animation {
  animation: fadezoom 5s 0s forwards;
}
.pridruzise .slick-slide{
  display:flex;
  flex-direction: column;
  justify-content: center;
}
.pridruzise .button{
  margin-bottom:0;
}

  .pridruzise .slick-track, .pridruzise {
      height: 404px;
  }
  .slider-wrap {
    height: 405px;
}
.slider-mask {
    height: 404px;
}

.content-wrap{
  position:relative;
  height: 378px;
}
/* sections */
.section-title{color:var(--dark-900);font-weight:700}
.bg-light-section{background:var(--light-section);}

/* cards */
.card{border:0;border-radius:10px;overflow:hidden}
.news-card img, .card-activity img{height:240px;object-fit:cover}
.feature{background:#fff;border-radius:12px}

/*vesti*/

#news{
  padding:0 0 6rem;
}
.news4 {
    position: relative;
    margin-bottom: 90px;
}
.news4:last-child {
    margin-bottom: 0px;
}
.news4 figure {
    margin: 0;
    position: relative;
    width: 66.666667%;
    margin-left: auto;
}
.news4.left figure {
    margin-left: 0;
    margin-right: auto;
}
.news4 figure img:hover {
    transform: scale(0.95);
}
.news4 .caption {
    background: #fff;
    position: absolute;
    left: 0;
    top: 50%;
    width: 50%;
    padding: 5% 4% 5% 0%;
    -ms-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.news4.left .caption {
    left: auto;
    right: 0;
    background: #fff;
    padding: 5% 0% 5% 4%;
}
.news4 .caption h4 {
    font-size: 1.56rem;
    color: rgba(0, 28, 125, 1);
    font-weight: 600;
    line-height: 1.2em;
}


.news4:nth-of-type(2n) figure {
    margin-left: 0;
    margin-right: auto;
}
.news4:nth-of-type(2n) .caption {
    left: auto;
    right: 0;
    background: #fff;
    padding: 5% 0% 5% 4%;
}
.news4 figure img {
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    width: 100%;
}
.news4 figure img:hover {
    transform: scale(0.95);
}
.news4 a{
  text-decoration: none;
}
a .news-date{
  font-size:0.80rem;
  color:#000;
  text-decoration: none;
}
a .news-content-short{
  color:#000;
  font-weight: 300;
  font-size:1.125rem;
  text-decoration: none;
}
.news-details h2.main-title{
  margin-bottom:2rem;
}
.news-details .news-date{
  margin-bottom:2rem;
}
.news-details .news-author{
  margin-bottom:2rem;
}
.news-details .content-body img{
  width:100%;
}

/*clanstvo */
.clanstvo .kocka{
  background-color: rgba(244, 247, 253, 0.6);
  box-shadow:0px 8px 32px 0px rgba(203, 211, 227, 0.8);
  height:100%;
}
.clanstvo .kocka h5{
  font-weight: 600;
  color:var(--titlecolor);
  font-size:1.190rem;
}
.clanstvo ul{
  list-style-type: square;
  padding-left: 1rem;
}
.clanstvo ul li{
  margin-left: 0.5rem;
  padding-left: 0;
  position: relative;
  font-weight: 300;
  font-size:1.06rem;
}
.clanstvo ul li::marker {
  color:var(--titlecolor);
    font-size: 1.5em;
}

/*formular */

.modal{
  background:  rgba(244, 247, 253, 1);
  --bs-modal-width: 700px;
  --bs-modal-border-width: 0;
  --bs-modal-bg: rgba(244, 247, 253, 1);
}
.modal-header {
    display: flex;
    justify-content: space-between;
    border-bottom:0;
  }
.modal-title{
  font-size:1.555rem;
  color:rgba(0, 28, 125, 1);
  line-height: 1;
  font-weight: 400;
  text-transform: uppercase;
  border-bottom:0;

}
.modal-title div{
  font-weight: 700;
}
.modal-body input, .contact input{
  border:0;
  border-bottom:1px solid rgba(0, 0, 0, 0.2);
  margin-left: 20px;
  margin-bottom: 30px;
  padding:5px;
  height: 24px;
  background: transparent;
  font-size:1.3rem;
  font-weight: 400;
      width: 100%;
}
.contact input{
  margin-bottom: 50px;
}
.modal-dialog {
        max-width: 100% !important;
        margin-right: auto;
        margin-left: auto;
    }
.modal-body input:focus, .contact input:focus{
  outline: none;
  border:none;
  border-bottom:1px solid rgba(0, 0, 0, 0.2);
  background:#fff;
}
.modal-body h5, .contact h5{
  font-weight:600;
  color:var(--titlecolor);
  padding:4rem 0 3rem;
  font-size:1.5rem;
}
.modal .controls, .contact .controls{
  width:80%;
}
.modal .controls p{
  line-height:1.3;
}
.modal form, .contact form{
  display: flex;
  justify-content: center;
}
.modal .label, .contact .label{
  display:flex;
  width: 100%;
  white-space: nowrap;
  position:relative;
}
.contact{
  padding-bottom: 6.5rem;
}
.contact textarea{
  border:1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0;
}
.message{
  font-size:0.8rem;
  color:red;
  display:none !important;
}
.invalid-feedback {
    position: absolute;
    right: 13px;
    text-align: right;
    top: 25px;
    font-size: 0.7em;
}
.btn-close-with-text {
  /* Reset Bootstrap's default close button styles */
  background: none; /* Remove the default background image icon */
  opacity: 1; /* Ensure text is fully visible */
  padding: 0.375rem 0.75rem; /* Add padding for better text appearance */
  font-size: 1rem; /* Adjust font size as needed */
  color: #000; /* Set text color */
  border: 0; /* Add a border for a more button-like look */
  border-radius: 0.25rem; /* Add rounded corners */
  /* Add hover and focus styles if desired */
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn-close-with-text:hover {
  background-color: none;
  border-color: #dae0e5;
}

.btn-close-with-text:focus {
  outline: 0;

}
.btn-close-with-text {
  position: relative;
  margin-right: 30px;
  width: 30px; /* Adjust as needed */
  height: 30px; /* Adjust as needed */
  display: inline-block; /* Or block, depending on layout */
  text-transform: none;
}

.btn-close-with-text::before,
.btn-close-with-text::after {
  content: '';
  position: absolute;
  background-color: black; /* Color of the cross */
  width: 100%; /* Full width of the container */
  height: 2px; /* Thickness of the cross lines */
  top: 64%;
  left: 70px;
  transform: translateY(-50%); /* Center vertically */
}

.btn-close-with-text::before {
  transform: translateY(-50%) rotate(45deg); /* First line, rotated 45 degrees */
  -webkit-transition: -webkit-transform 0.5s ease;
    transition: -webkit-transform 0.5s ease;
    -o-transition: transform 0.5s ease;
    transition: transform 0.5s ease;
    transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.btn-close-with-text::after {
  transform: translateY(-50%) rotate(-45deg); /* Second line, rotated -45 degrees */
  -webkit-transition: -webkit-transform 0.5s ease;
    transition: -webkit-transform 0.5s ease;
    -o-transition: transform 0.5s ease;
    transition: transform 0.5s ease;
    transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}
.btn-close-with-text:hover:after, .btn-close-with-text:hover:before {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
}

/*Upravni odbor */

.team .item {
    margin-bottom: 30px;
}
.team .img img{
    width:100%;
}
.team .info {
    text-align: center;
    padding: 30px 20px;
    position: relative;
    overflow: hidden;
}
.team .item:hover .info .social {
    top: 0;
}
.team .info h3{
    font-weight: 500;
    color:var(--titlecolor);
    font-size:1.3rem;
    padding-top: 0.5rem;
    padding-bottom: 1rem;
}
.team .info p{
    font-weight: 300;
    line-height: 1.3;
    margin-bottom: 0;
}
.team .info .social {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f4f4f4;
    -webkit-transition: all .4s;
    transition: all .4s;
}
.full-width {
    width: 100%;
}
.team .info .social span{
  display: flex;
    justify-content: center;
    flex-direction: column;
    margin-left: 10px;
    color: #000;
    font-weight: 300;
    }
.valign {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
/*Publikacije */
.publikacije .info {
  font-weight: 300;
}
.publikacije .info h3{
  color:var(--titlecolor);
  margin-bottom:1rem;
  font-size:1.78rem;
  font-weight: 600;
}
.publikacije a .info p {
  color:#000;
}
.publikacije .item {
  height: 100%;
}
.publikacije .item:hover {
  background:#F4F7FD;
}

@media (max-width: 991.98px) {
    .news4 figure {
        width: auto;
        margin: 0;
    }
    .news4 .caption {
        position: relative;
        left: 0;
        top: 0;
        width: auto;
        padding: 30px;
        -ms-transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}



/* CTA */
.cta-section{
  background-image:  url('../images/header.webp');
  background-size:cover;
  background-position:center;
}
.btn-cta{background:var(--secondcolor);color:#001f2b;border-radius:30px;padding:0.8rem 1.4rem;font-weight:700;box-shadow:0 8px 30px rgba(0,224,199,0.12)}

/* footer */
.footer{
  background:#011455;
  padding-top:5rem;
  padding-bottom:5rem;
}

.footer .brand-text,.footer a .brand-text {
  line-height:1;
  font-weight:400;
  font-size:1.36rem;
  text-transform: uppercase;
  color:#fff;
}
.footer .brand-text .text-second{
  line-height:1;
  font-weight:700;
  font-size:1.36rem;
  color:var(--secondcolor);
  display:block;
}
.footer-nav, .footer-links{
  list-style-type: none;
}
.footer-nav, .footer-links a{
  text-decoration: none;
  color:var(--secondcolor);
  font-weight:500;
  font-size:0.9rem;
}
.footer-nav .nav-item{
  padding-right:1rem;
  color:var(--secondcolor);
  text-transform: uppercase;
  font-weight:600;
  font-size:0.9rem;
}
.footer-nav .nav-item a:hover{
  color:#fff;
}

/*Cookie*/
.cookiealert {
    font-size: 18px;
		font-weight:200;
		position: fixed;
 		bottom: 0;
 		width: 100%;
 		margin: 0 !important;
		padding:100px 20%;
 		z-index: 10000;
 		opacity: 0;
 		visibility: hidden;
 		border-radius: 0;
 		transform: translateY(100%);
 		transition: all 500ms ease-out;
		background: #F4F7FD;
		color:#3e525f;
}
.cookiealert.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
    transition-delay: 1000ms;
}
.cookiealert .acceptcookies {
    display: block;
    margin: 30px auto;
    vertical-align: baseline;
    font-weight: 400;
    background: var(--titlecolor);
    padding: 20px;
    font-size: 20px;
    line-height: 1;
    border-radius: 0;
    border: 0;
    color: #fff;
    cursor:pointer;
		transition: 0.3s;
		text-transform: none;
}
.cookiealert a {
    color:var(--titlecolor);
		font-weight:500;
}
.cookiealert .acceptcookies:hover {
    background: var(--secondcolor);
    color:var(--titlecolor);
}


/* Cookie Modal Styles */
        .cookie-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.7);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 10000;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
            backdrop-filter: blur(5px);
        }

        .cookie-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        .cookie-modal {
            background: white;
            border-radius: 12px;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
            max-width: 500px;
            width: 90%;
            max-height: 80vh;
            overflow-y: auto;
            transform: translateY(-50px);
            transition: transform 0.3s ease;
        }

        .cookie-overlay.active .cookie-modal {
            transform: translateY(0);
        }

        .cookie-header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 20px;
            border-radius: 12px 12px 0 0;
            text-align: center;
        }

        .cookie-header h2 {
            font-size: 1.5rem;
            margin-bottom: 8px;
        }

        .cookie-header .cookie-icon {
            font-size: 2rem;
            margin-bottom: 10px;
        }

        .cookie-body {
            padding: 25px;
        }

        .cookie-text {
            font-size: 14px;
            line-height: 1.6;
            color: #555;
            margin-bottom: 20px;
            text-align: left;
        }

        .cookie-links {
            margin: 15px 0;
            text-align: center;
        }

        .cookie-links a {
            color: #667eea;
            text-decoration: none;
            font-size: 13px;
            margin: 0 10px;
            border-bottom: 1px solid transparent;
            transition: border-color 0.3s ease;
        }

        .cookie-links a:hover {
            border-bottom-color: #667eea;
        }

        .cookie-buttons {
            display: flex;
            gap: 12px;
            margin-top: 25px;
            flex-wrap: wrap;
        }

        .cookie-btn {
            flex: 1;
            min-width: 120px;
            padding: 12px 20px;
            border: none;
            border-radius: 6px;
            font-size: 14px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .cookie-btn.accept {
            background: #4CAF50;
            color: white;
        }

        .cookie-btn.accept:hover {
            background: #45a049;
            transform: translateY(-1px);
        }

        .cookie-btn.decline {
            background: #f44336;
            color: white;
        }

        .cookie-btn.decline:hover {
            background: #da190b;
            transform: translateY(-1px);
        }

        .cookie-status {
            margin-top: 20px;
            padding: 15px;
            border-radius: 6px;
            font-weight: 600;
            text-align: center;
        }

        .cookie-status.accepted {
            background: #d4edda;
            color: #155724;
            border: 1px solid #c3e6cb;
        }

        .cookie-status.declined {
            background: #f8d7da;
            color: #721c24;
            border: 1px solid #f5c6cb;
        }


/*Paginacija*/
.pagination{
  padding:4rem 1rem 5rem 1rem;
  display:flex;
  justify-content: space-between;
}

.prev,
.next{
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #16FABE;
  border-left: 2px solid #16FABE;
}
.next{
 transform: rotate(135deg);
}

.prev{
 transform: rotate(-45deg);
}
.next::after,
.prev::after{
  content: "";
  display: block;
  width: 2px;
  height: 38px;
  background-color: #16FABE;
  transform: rotate(-45deg) translate(12px, 3px);
  left: 0;
  top: 0;
}
.pag_link{
  display:flex;
}
a.pag_link .pag_text_prev, a.pag_link .pag_text_next{
  color:var(--titlecolor);
}
.pag_text_prev{
  font-weight:400;
  font-size:1rem;
  letter-spacing: 0%;
  margin: -10px 0px 0px 36px;
}
.pag_text_next{
  font-weight:400;
  font-size:1rem;
  letter-spacing: 0%;
  margin: -10px 36px 0px 0px;

}

.videodetector {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videodetector iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border:0;
}
.remove-videodetector{
	display:none;
}

/* responsive tweaks */
@media (max-width:991.98px){
  /*.hero h1{font-size:2.4rem}*/
}
@media (max-width:768px){
  .container {
        max-width: 100%;
    }
  .hero .subtitle {
    font-size: 5vw;
}
  .hero h1{font-size:12vw}

.modal .label,.contact .label {
    flex-direction: column;
}
.modal input, .contact input {
    margin-left: 0;
}
}
@media (max-width:576px){
  .navbar .navbar-brand .brand-text {
    font-size:4.8vw;
  }
  .navbar .navbar-brand .brand-text .text-second{
    font-size:4.8vw;
  }
  .navbar .nav-link{padding:.4rem .5rem}
  h2 {
    font-size: 5.5vw;
}
  h2.main-title {
    font-size: 10vw;
  }
}
