body{
	font-family: "Open sans", sans-serif;
}

h1{
	font-size: 48px;
}
h1, h2, h3, h4, h5{
	font-family: "playfair display", sans-serif;
}

p {padding: 0;}
a, a:visited {
	text-decoration: none;
	color: #333333;
}

.idk_paddingtop150 {padding-top: 150px;}
.idk_paddingtop100 {padding-top: 100px;}
.idk_paddingtop50 {padding-top: 50px;}
.idk_paddingtop30 {padding-top: 30px;}
.idk_paddingtop10 {padding-top: 10px;}
.idk_paddingbot50 {padding-bottom: 50px;}
.idk_paddingbot30 {padding-bottom: 30px;}
.idk_paddingbot10 {padding-bottom: 10px;}
.idk_margintop50 {margin-top: 50px;}
.idk_margintop150 {margin-top: 150px;}
.idk_margintop100 {margin-top: 100px;}
.idk_margintop30 {margin-top: 30px;}
.idk_margintop10 {margin-top: 10px;}
.idk_marginbot50 {margin-bottom: 50px;}
.idk_marginbot30 {margin-bottom: 30px;}
.idk_marginbot10 {margin-bottom: 10px;}


/*header*/
.idk_header_icons {
	display: flex;
	flex-direction: row;
  justify-content: end;
	gap: 24px;
}

.idk_title_bar {
	height: 1px;
	background-color:#E4E0DB ;
	
}
.idk_title h2{
	font-size: 40px;
	font-weight: 400;
  line-height: 1.5;
}

/*hero naslovna*/

.idk_hero{
	position: relative;
	
	height: 600px;

}

.idk_hero_ostali{
	position: relative;
	
	height: 500px;

}

.idk_hero_ostali .container {
  height: 100%;
  display: flex;
  justify-content: center; 
  align-items: center;     
}

.idk_hero_image{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
  object-fit: cover;
}

.idk_hero_image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
object-position: center;
}
.idk_hero_content{
	
 position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 1;
  color: white;
}
.idk_hero .container {
  height: 100%;
  display: flex;
  justify-content: center; 
  align-items: center;     
}

/* Slider sloj popunjava cijeli hero i stoji iza sadržaja */
.idk_hero_slider{
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

/* Slick unutrašnje visine da popuni 100% hero visine */
.idk_hero_slider .slick-list,
.idk_hero_slider .slick-track,
.idk_hero_slider .slick-slide,
.idk_hero_slider .slick-slide > div{
  height: 100%;
}

/* Slike popunjavaju herо bez deformacije */
.idk_hero_slider img.idk_hero_image{
  position: absolute;      /* isto ponašanje kao tvoja single hero slika */
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}



/*slider pocetna*/

.idk_card {
  background-color: rgba(228, 224, 219, 0.25); /* 25% providno */
  border: 1px solid #E4E0DB;
  padding: 40px 20px;
  height: 250px;                
  display: flex;               
  flex-direction: column;      
  justify-content: center;     
  align-items: center;         
  text-align: center;          
  transition: all 0.3s ease;
}

.idk_card:hover {
  background-color: #E4E0DB; /* boja na hoveru */
}

.idk_card3{
  background-color: white;
  border: 1px solid #E4E0DB ;
  display: flex;               
  flex-direction: column;      
  justify-content: center;     
  align-items: center;         
  text-align: center;
  padding: 40px 20px;
  height: 200px; 
  margin-bottom: 20px;
}
/*
.idk_card:hover {
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  transform: translateY(-5px);
}
*/
.idk_card_icon {
  min-height: 80px;
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
  object-fit: contain;
}
.idk_card_icon1 {
  min-height: 120px;
  min-width: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  margin-top: 15px;
  object-fit: contain;
}

.idk_card_icon2 {
  min-height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
  
  object-fit: contain;
}



.idk_card_icon img {
  max-width: 100%;
  max-height: 100%;
}


.idk_card_title {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1px;
  margin-top: 0;   
}

.idk_frame {
  position: relative;
  display: inline-block;
}

.idk_frame_img {
  display: block;
  max-width: 100%;
  height: auto;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
}

/* okvir s razmakom oko slike */
.idk_frame::after {
  content: "";
  position: absolute;
  top: -15px;   /* razmak gore */
  left: -15px;  /* razmak lijevo */
  right: -15px; /* razmak desno */
  bottom: -15px;/* razmak dolje */
  border: 2px solid #E4E0DB;
  z-index: 1;
}
.idk_popup_overlay{
  position: fixed;
  inset: 0;
  display: none;               /* vidljivost kontrolira JS */
  justify-content: center;
  align-items: center;
  background: rgba(0,0,0,.6);
  z-index: 10000;              /* iznad svega */
}
.idk_popup_box{
  background:#fff;
  padding:24px;
  max-width:560px;
  width:90%;
  border-radius:12px;
}

.idk_popup_actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 16px;
}
.idk_popup_box h3{ color:#003E66; font-weight:600; margin-bottom:10px;}
.idk_popup_box p{ color:#333; margin-bottom:24px; line-height:1.5; font-size:15px;}
.idk_popup_actions{ display:flex; justify-content:center; gap:14px;}
.idk_btn_cancel,.idk_btn_confirm{ border:none; padding:10px 20px; border-radius:8px; cursor:pointer; transition:.25s; font-weight:500;}
.idk_btn_cancel{ background:#E4E0DB; color:#333;}
.idk_btn_cancel:hover{ background:#d2ceca;}
.idk_btn_confirm{ background:#003E66; color:#fff;}
.idk_btn_confirm:hover{ background:#005187;}

@keyframes popupIn{ from{opacity:0; transform:scale(.9)} to{opacity:1; transform:scale(1)} }



.idk_btn_outline {
  display: inline-block;
  padding: 12px 40px;
  border: 3px solid #E4E0DB;   /* boja okvira */
  background-color: transparent;
  color: #333;                 /* boja teksta */
  font-family: 'Georgia', serif;
  font-size: 22px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.idk_btn_outline:hover {
  background-color: #e5e1dc;   /* pozadina na hover */
  color: #000;                 /* boja teksta na hover */
}

 /************ BEFORE–AFTER SLIDER (full CSS) ************/
 /* Sve unutar wrappera koristi border-box da margine/linije ne bježe */
.before-after-wrapper,
.before-after-wrapper * {
	box-sizing: border-box;
        }

        /* Okvir sa borderom – bez paddinga (padding rješavamo kroz inset na .image-container) */
        .before-after-wrapper {
            position: relative;
            width: 100%;
            
            height: 280px;
            /* 280px vidljive slike + 2*20px unutrašnji "padding" */
            overflow: hidden;
            border: 2px solid #E4E0DB;
            margin-bottom: 25px;
            background: #fff;
            /* opciono: podloga ispod slika */
        }

        /* Zona za slike – uvučena 20px sa svih strana (efekat “paddinga” unutar bordera) */
        .image-container {
            position: absolute;
            inset: 20px;
            /* top/right/bottom/left = 20px */
            width: auto;
            height: auto;
        }

        /* Obje slike su iste dimenzije i složene jedna preko druge */
        .image-container img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: left;
            display: block;
            user-select: none;
            -webkit-user-drag: none;
        }

        /* After ispod, Before iznad, ali punih dimenzija – ne mijenjamo širinu slike */
        .after-image {
            z-index: 1;
        }

        /* Maskiranje Before slike preko clip-path; --reveal je procenat vidljivog lijevog dijela */
        .before-image {
            position: absolute;
            inset: 0;
            z-index: 2;
            overflow: hidden;
            width: 100%;
            height: 100%;
            --revealX: 50%;
            /* default (radi i bez JS-a) */
            clip-path: polygon(0 0, var(--revealX) 0, var(--revealX) 100%, 0 100%);
            will-change: clip-path;
        }

        .before-image img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: left;
            display: block;
        }

        /* Klizač (vertikalna linija) */
        .slider-bar {
            --barW: 4px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 50%;
            width: var(--barW);
            background: #fff;
            z-index: 3;
            transform: translateX(-50%);
            cursor: ew-resize;
            touch-action: none;
        }

        /* Ručka na sredini linije */
      .slider-handle{
  position:absolute; top:50%; left:50%;
  width:38px; height:38px;
  border-radius:50%;
  background-color:#fff;                 /* samo boja, bez shorthand-a */
  background-image:url('../images/slider_icon.svg'); /* prilagodi .. putanju! */
  background-repeat:no-repeat;
  background-position:center;
  background-size:14px 14px;
  transform:translate(-50%,-50%);
  z-index: 4;                             /* iznad linije, ako treba */
}


		

        /* UX sitnice */
        .slider-bar:active,
        .slider-bar:focus {
            outline: none;
        }

        .before-after-wrapper:has(.slider-bar:active) .slider-handle {
            box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
        }

        /* Spriječi selekciju dok se vuče */
        .image-container,
        .slider-bar,
        .slider-handle {
            user-select: none;
            -webkit-user-drag: none;
        }



		/* === Post Card === */
.idk_post_card,
.idk_post_card * { box-sizing: border-box; }

.idk_post_card{
  display: flex;
  flex-direction: column;
  
  height: 500px;
  background: #fff;
  border: 2px solid #E4E0DB;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
  margin-bottom: 50px;
}

.idk_post_card:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* Gornja slika */
.idk_post_thumb{
  display: block;
  width: 100%;
  height: 315px;
  aspect-ratio: 16/9;     /* drži proporciju kao na slici */
  background: #f5f5f5;
  overflow: hidden;
}
.idk_post_thumb img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Telo kartice */
.idk_post_body{
  padding: 16px 18px 12px;
  height: 150px;
}

.idk_post_meta{
  font-size: .85rem;
  color: #6c757d;
  margin-bottom: .35rem;
}

.idk_post_title{
  margin: 0 0 .5rem;
  font-size: 1.25rem;
  line-height: 1.3;
  color: #111;
}
.idk_post_title a{
  color: inherit;
  text-decoration: none;
}


.idk_post_excerpt{
  margin: 0 0 .75rem;
  color: #7c7c7c;
}

/* Donji CTA red kao na prikazu */
.idk_post_cta{
  margin-top: auto;               /* gura CTA na dno */
  display: block;
  padding: 14px 18px;
    /* tanka linija iznad CTA */
  color: #6c757d;
  text-decoration: none;
  font-weight: 500;
}
.idk_post_cta:hover{
  color: #2B4C81;                 /* tvoja plava */
}

/* Sitne prilagodbe za manje ekrane */
@media (max-width: 575.98px){
  .idk_post_title{ font-size: 1.15rem; }
  .idk_post_cta{ padding: 12px 16px; }
}




/*newsletter forma**/

.idk_newsletter{
	height: 180px;
	border: 3px solid #E4E0DB;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	padding: 50px 100px;
}
.idk_newsletter p{
	font-size: 16px;
}

.idk_newsletter h4{
	font-size: 20px;
	font-weight: bold;
}
/* === Email subscribe (match mockup) === */
.idk_subscribe, .idk_subscribe * { box-sizing: border-box; }

.idk_subscribe{
  display: flex;
  align-items: center;
  width: 100%;
  height: 48px;
  background: #fff;
  border: 1px solid #E4E0DB;
  border-radius: 2px;
  overflow: hidden;
}

.idk_subscribe input{
  flex: 1;
  height: 100%;
  border: 0;
  padding: 0 14px;
  font-size: 16px;
  color: #333;
  min-width: 0;                /* spriječi širenje na manjim ekranima */
}

.idk_subscribe input::placeholder{ color: #b5b5b5; }
.idk_subscribe input:focus{ outline: none; }

/* Desni dio – svijetla pozadina + vertikalna linija */
.idk_btn_flat{
  height: 100%;
  padding: 0 18px;
  border: 0;
  border-left: 1px solid #E4E0DB;  /* unutrašnja vertikalna linija */
  background: #F3F1EE;
  color: #2b2b2b;
  font-weight: 700;
  border-radius: 0;                /* iOS reset */
  cursor: pointer;
}

.idk_btn_flat:hover{ filter: brightness(0.97); }
.idk_btn_flat:focus-visible{ outline: 2px solid #2B4C81; outline-offset: -2px; }

/* Visually hidden helper (ako nemaš Bootstrap) */
.visually-hidden{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* Po želji: manja visina na mobitelu */
@media (max-width: 575.98px){
  .idk_subscribe{ height: 44px; }
}

/* Wrapper da lijepo poravna kvadratić i tekst */
.idk_checkbox{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  line-height: 1.4;
}

/* Custom kvadratni checkbox */
.idk_checkbox input[type="checkbox"]{
  appearance:none; -webkit-appearance:none;
  position: relative;           /* <— novo */
  width: 20px; height: 20px; margin:0;
  border: 2px solid #E4E0DB; border-radius: 3px;
  background:#fff; display:inline-grid; place-content:center;
  cursor:pointer;
}

/* Check znak (crtica u obliku ✓ izvučena iz granica) */
.idk_checkbox input[type="checkbox"]::after{
  content:"";
  position:absolute;
  width: 6px;                   /* tanji krak */
  height: 12px;                 /* duži krak */
  border-right: 2px solid #fff; /* koristimo DESNI + DONJI rub */
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);     /* 45° daje ✓, ne ˅ */
  left: 50%; top: 50%;
  translate: -50% -60%;         /* fino centriranje u kvadratu */
  opacity: 0;                   /* skriveno dok nije čekirano */
}

/* Kad je čekirano – lagano plava pozadina i bijeli check */
.idk_checkbox input[type="checkbox"]:checked{
  border-color: #2B4C81;
  background: #2B4C81;
}
.idk_checkbox input[type="checkbox"]:checked::after{
  border-color: #fff;
  opacity:1;
}

/* Fokus (tipkovnica) radi pristupačnosti */
.idk_checkbox input[type="checkbox"]:focus-visible{
  outline: 2px solid #2B4C81;
  outline-offset: 2px;
}

/* Link u labeli */
.idk_checkbox label a{
  color: inherit;

 
}

/*footer*/
 .idk_footer{
	background-color: #E4E0DB;
 }

.idk_footer_content{
	display: flex;
	flex-direction: column;
	gap: 60px;
}

.idk_footer_social{
	display: flex;
	flex-direction: row;
	gap: 30px;
	justify-content: center;
}

.idk_footer_nav {
	display: flex;
	flex-direction: row;
	gap: 30px;
	justify-content: center;
}

.idk_icon_footer{
	height: 24px;
}



/*about us*/
.idk_card1{
	border: 2px solid #E4E0DB;
	display: flex;
	flex-direction: column;
	gap: 35px;
	justify-content: center;
	align-items: center;
	height: 350px;
	padding: 30px;
  transition: background-color 0.3s ease;
}

.idk_card1:hover {
  background-color: rgba(228, 224, 219, 0.25); /* 25% providno */
  
}

.idk_card_content p{color: #777777;}

/*blog kategorije*/
/* Glavna traka sa tabovima */
.idk_tabs_head {
  border-bottom: 2px solid #e0e0e0; /* tanka siva linija ispod svih tabova */
  margin-bottom: 30px;
}

/* Pojedinačni tabovi */
.idk_tablink {
  border: none;                  /* uklanja default border */
  background: none;              /* nema pozadine */
  color: #555;                   /* osnovna boja teksta */
  font-weight: 500;
  padding: 10px 15px;
  position: relative;            /* za pseudo-element ispod */
  transition: color 0.3s ease;
}

/* Hover efekat */
.idk_tablink:hover {
  color: #000;
}

/* Aktivni tab */
.idk_tablink.active {
  color: #000;
  font-weight: 600;
}

/* Donja linija (underline) samo kod aktivnog taba */
.idk_tablink.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;                 /* poravnanje sa borderom ispod */
  width: 100%;
  height: 3px;
  background-color: #000;    /* glavna brand boja */
  border: none !important;   /* blago zaobljena linija */
}

/* Uklanja default Bootstrap bordere */
.idk_tablink,
.idk_tablink:hover,
.idk_tablink.active {
  border: none !important;       /* briše okvir */
  background: transparent !important; /* nema pozadine */
  box-shadow: none !important;   /* uklanja sjenku ako je ima */
}


/*clanak*/
.idk_clanak{
	gap: 60px;
}

.idk_content {
  height: 520px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.idk_content_img {
  height: 100%;
  width: 100%;
  object-fit: cover;   /* popuni okvir */
  border-radius: 6px;  /* opcionalno */
}


.idk_social_kontakt{
	display: flex;
	flex-direction: row;
	gap: 60px;
	justify-content: center;
}

.idk_kontakt{
	display: flex;
	flex-direction: column;
}

/* Layout */
.idk_form {
  max-width: 640px;      /* po želji: stavi 100% u grid koloni */
  margin: 0 auto;
}

/* Label iznad polja, centriran */
.idk_label {
  display: block;
  text-align: center;
  margin: 18px 0 8px;
  color: #222;
  font-size: 14px;
}

/* Inputi i textarea – tanki sivi border kao na slici */
.idk_input,
.idk_textarea {
  width: 100%;
  border: 1px solid #e6e6e6;
  background: #fff;
  padding: 12px 14px;
  outline: none;
  transition: border-color .2s ease;
}

.idk_input { height: 48px; }
.idk_textarea { resize: vertical; }

/* Fokus i greška */
.idk_input:focus,
.idk_textarea:focus {
  border-color: #000;
}
/*.idk_input:invalid,
.idk_textarea:invalid {
  /* ne bojimo crveno dok korisnik ne pokuša poslati
}
*/

/* Dugme submit – crna traka, full width */
.idk_submit {
  margin-top: 18px;
  width: 100%;
  height: 48px;
  background: #000;
  color: #fff;
  border: none;
  letter-spacing: .06em;
  cursor: pointer;
  transition: opacity .2s ease;
}
.idk_submit:disabled {
  opacity: .55;
  cursor: not-allowed;
}

/* Checkbox red */
.idk_consent_wrap {
  margin-top: 14px;
}
.idk_check_label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 14px;
  line-height: 1.4;
  color: #333;
}
.idk_check_label input[type="checkbox"] {
  width: 18px; height: 18px;
  margin-top: 2px;
}

/* Mali tekst greške */
.idk_error {
  display: block;
  margin-top: 6px;
  color: #b00020;
  min-height: 1em;
}

/* Optional: reset margine prvog labela */
.idk_form .idk_label:first-of-type { margin-top: 0; }


.idk_social_icons{
	height: 35px;
	width: 35px;
}

.idk_card2 {
  background-color: white;
  
  padding: 40px 20px;
  height: 220px;                
  display: flex;               
  flex-direction: column;      
  justify-content: center;     
  align-items: center;         
  text-align: center;          
  transition: all 0.3s ease;
}

.idk_card2:hover{
  background-color: #E4E0DB;
}


/* Wrapper da strelice stoje sa strane */
.idk_slider_wrapper {
  position: relative;
}

/* Strelice */
.idk_slider_prev,
.idk_slider_next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  font-size: 40px;    /* osnovna veličina */
  color: #d9d6d2;     /* svijetlo siva */
  cursor: pointer;
  z-index: 100;
  transition: color .3s ease;
}

/* Hover efekat */
.idk_slider_prev:hover,
.idk_slider_next:hover {
  color: #000;
}

/* Pozicije na desktopu */
.idk_slider_prev { left: -40px; }
.idk_slider_next { right: -40px; }


.idk_contact_img{
  height: 360px;
  width: 100%;
  margin-bottom: 20px;
}
.idk_map{
  width: 100%;
  height: 360px;
}
.idk_contact_img img{
  height: 100%;
  width: 100%;
}
.idk_phonenav img{
  margin-right: 8px;
}



/* Arrows positioning inside hero */
.idk_slider_prev1,
.idk_slider_next1{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  border: none;
  background: #E4E0DB;
  width: 46px;
  height: 46px;
  line-height: 46px;
  text-align: center;
  font-size: 22px;
  color: #fff;
  border-radius: 50%;
  cursor: pointer;
  transition: opacity .2s ease, background .2s ease;
  opacity: .9;
}
.idk_slider_prev1:hover,
.idk_slider_next1:hover{ background: rgba(0,0,0,0.5); opacity: 1; }

.idk_slider_prev1{ left: 18px; }
.idk_slider_next1{ right: 18px; }

/* osiguraj da overlay content ne blokira klik po cijeloj širini */
.idk_hero .container{ position: relative; z-index: 2; }

/* slider sloj je ispod svega */
.idk_hero_slider{ position: absolute; inset: 0; z-index: 0; overflow: hidden; }

/* slick visine 100% hero-a */
.idk_hero_slider .slick-list,
.idk_hero_slider .slick-track,
.idk_hero_slider .slick-slide,
.idk_hero_slider .slick-slide > div{ height: 100%; }

/* slike u hero-u */
.idk_hero_slider img.idk_hero_image{
  position: absolute; top:0; left:0; width:100%; height:100%;
  object-fit: cover; object-position: center; display:block;
}

/* Full-bleed hero: izlazi iz parent .container širine */
.idk_hero{
  position: relative;
  height: 600px;          /* što si tražio */
  width: 100%;           /* zauzmi cijelu širinu viewporta */
  max-width: 100%;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;       /* spriječi horizontalni scroll zbog 100vw */
}

/* Slick/slider sloj i dalje preko cijelog hero-a */
.idk_hero_slider,
.idk_hero_slider .slick-list,
.idk_hero_slider .slick-track,
.idk_hero_slider .slick-slide,
.idk_hero_slider .slick-slide > div{
  height: 100%;
}

/* Slike popunjavaju cijeli hero */
.idk_hero_slider img.idk_hero_image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}


/* 1) "Prava" širina viewporta (bez scrollbara) */
:root { --vw: calc(100vw - (100vw - 100%)); }

/* 2) Hero full-bleed na cijelu širinu ekrana, visina ostaje 600px */
.idk_hero{
  position: relative;
  height: 600px;
  width: var(--vw);
  max-width: var(--vw);
  margin-left: calc(50% - var(--vw) / 2); /* izbije iz bilo kakvog parent paddinga */
  overflow: hidden;
}

/* 3) Ako body ima default margin/padding – ukloni */
html, body { margin: 0; padding: 0; }

/* 4) Slick mora zauzeti punu širinu + 100% visine hero-a */
.idk_hero_slider,
.idk_hero_slider .slick-list,
.idk_hero_slider .slick-track,
.idk_hero_slider .slick-slide,
.idk_hero_slider .slick-slide > div{
  width: 100%;
  height: 100%;
}

/* 5) Slike ispunjavaju slajd do ruba */
.idk_hero_slider img.idk_hero_image{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center; display: block;
}

.idk_stickybtn{
  position:fixed;
  top:80px;
  right:0;
  display:block;
  text-align:left;
  opacity: 0.65;
  background-color:#E4E0DB;
  color:black;
  font-size:14px;
  overflow:hidden;
  width:100px;
  border-radius:7px 0px 0px 7px;
  text-decoration:none;
  padding:14px;
  line-height:1.4;
  z-index: 9999;
   text-align: center;

}
.idk_stickybtn1{
  position:fixed;
  top:200px;
  right:0;
  display:block;
  text-align:left;
  opacity: 0.65;
  background-color:#E4E0DB;
  color:black;
  font-size:14px;
  overflow:hidden;
  width:100px;
  border-radius:7px 0px 0px 7px;
  text-decoration:none;
  padding:10px;
  line-height:1.4;
  z-index: 9999;
 text-align: center;
}

.idk_stickybtnlogo{
  height:15px;
  margin-top:10px;
  vertical-align:middle;
  width:auto;
  
}
.idk_stickybtn1:hover{
  background-color: #c5c0ba;
  transition: 0.3s ease;
}
.idk_stickybtn:hover{
  background-color: #c5c0ba;
  transition: 0.3s ease;
}


/* ===== DESKTOP ===== */
@media (min-width: 1025px) {
  .idk_sticky_toggle { display: none !important; }
  .idk_sticky_panel {
    position: static;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto;
  }
  .idk_stickybtn,
  .idk_stickybtn1 {
    position: fixed;
    right: 0;
    z-index: 9999;
    display: block;
  }
}

/* ===== MOBILE/TABLET ===== */
@media (max-width: 1024px) {
  .idk_sticky {
    position: fixed;
    right: 0;
    bottom: 40px;
    z-index: 9999;
  }

  /* TOGGLE dugme */
  .idk_sticky_toggle {
    position: fixed;
    right: 0;
    bottom: 40px;
    background: #E4E0DB;
    color: #000;
    border: 0;
    height: 46px;
    padding: 0 16px 0 14px;
    border-radius: 10px 0 0 10px;
    box-shadow: 0 6px 16px rgba(0,0,0,.18);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    cursor: pointer;
    transition: background .25s ease;
    z-index: 10001;
  }
  .idk_sticky_toggle:hover { background: #c5c0ba; }

  /* Strelica animacija (rotacija kad je otvoreno) */
  .idk_toggle_icon {
    transition: transform 0.35s ease;
  }
  .idk-sticky--open .idk_toggle_icon {
    transform: rotate(180deg);
  }

  /* PANEL */
  .idk_sticky_panel {
    position: fixed;
    right: 0;
    top: 0;
    height: 100vh;
    width: 120px;
    z-index: 9999;
    transform: translateX(120%);
    transition: transform .35s cubic-bezier(.22,.61,.36,1);
    pointer-events: none;
  }
  .idk-sticky--open .idk_sticky_panel {
    transform: translateX(0);
    pointer-events: auto;
  }

  /* Dugmad unutar panela */
  .idk_sticky_panel .idk_stickybtn,
  .idk_sticky_panel .idk_stickybtn1 {
    position: absolute;
    right: 0;
    z-index: 9999;
    display: block;
    opacity: 0;
    transform: translateX(22px);
    transition: transform .38s cubic-bezier(.22,.61,.36,1), opacity .38s ease;
    pointer-events: none;
  }
  .idk_sticky_panel .idk_stickybtn { top: 80px; }
  .idk_sticky_panel .idk_stickybtn1 { top: 200px; }

  .idk-sticky--open .idk_sticky_panel .idk_stickybtn {
    opacity: 1; transform: translateX(0); pointer-events: auto; transition-delay: .02s;
  }
  .idk-sticky--open .idk_sticky_panel .idk_stickybtn1 {
    opacity: 1; transform: translateX(0); pointer-events: auto; transition-delay: .10s;
  }
}






/* RESPONSIVE PRILAGODBE */

/* <=1200px */
@media (max-width: 1199.98px) {
  .idk_slider_prev, .idk_slider_next {
    font-size: 36px;
  }
  .idk_slider_prev { left: -20px; }
  .idk_slider_next { right: -20px; }
}

/* <=992px (tablet) */
@media (max-width: 991.98px) {
  .idk_slider_prev, .idk_slider_next {
    font-size: 32px;
  }
  .idk_slider_prev { left: -10px; }
  .idk_slider_next { right: -10px; }
}

/* <=768px (mali tablet / mob) */
@media (max-width: 767.98px) {
  .idk_slider_prev, .idk_slider_next {
    font-size: 28px;
  }
  .idk_slider_prev { left: 5px; }
  .idk_slider_next { right: 5px; }
}

/* <=576px (mobiteli) */
@media (max-width: 575.98px) {
  .idk_slider_prev, .idk_slider_next {
    font-size: 24px;
  }
  .idk_slider_prev { left: 5px; }
  .idk_slider_next { right: 5px; }
}




/* ===================== TABLETI I MANJI (≤991.98px) ===================== */
@media (max-width: 991.98px) {
  .idk_flip_box {
    width: 100%;
    min-height: 300px;
    overflow: hidden;
 
  }

  .idk_flip_inner {
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
  }

  .idk_flip_front,
  .idk_flip_back {
    position: absolute;
    inset: 0;
    width: 100%;
    max-width: 100%;
    padding: 20px;
    box-sizing: border-box;
    
  }

  .idk_flip_front h3 {
    font-size: 22px;
    margin-bottom: 10px;
  }

  .idk_flip_icon {
    width: 60px;
    max-height: 60px;
    margin-left: 12px;
  }

  .idk_flip_back ul {
    margin: 0;
    padding-left: 20px;
  }

  .idk_flip_back li {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 10px;
  }
}

/* ===================== MALI TABLETI / VELIKI MOB (≤767.98px) ===================== */
@media (max-width: 768px) {
  .idk_flip_box { min-height: 260px; }

  .idk_flip_front h3 { font-size: 20px; }

  .idk_flip_icon { width: 50px; max-height: 50px; }

  .idk_flip_back li { font-size: 14px; }

}

/* ===================== MOBITELI (≤575.98px) ===================== */
/* ===== MOBITELI (≤575.98px) — flip ostaje, tekst staje u box ===== */
@media (max-width: 575.98px) {
  .idk_flip_box {
    position: relative;
    width: 100%;
    height: 300px;              /* kompaktna, ali dovoljna visina */
    overflow: hidden;           /* rubovi ostaju uredni */
    
  }

  .idk_flip_inner {
    position: relative;
    width: 100%;
    height: 100%;               /* važno za apsolutne plohe */
    transform-style: preserve-3d;
  }

  .idk_flip_front,
  .idk_flip_back {
    position: absolute;
    inset: 0;                   
    width: 100%;
    box-sizing: border-box;
    padding: 36px 20px;         
  
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
  }

  /* prednja: malo manji naslov/ikona */
  .idk_flip_front h3 {
    font-size: 18px;
    line-height: 1.3;
    margin: 0 0 10px;
  }
  .idk_flip_icon {
    width: 40px;
    max-height: 40px;
    margin-left: 8px;
  }

  
  .idk_flip_back {
    overflow-y: auto;                 
  }
  .idk_flip_back > :first-child {    
    margin-top: 0 !important;
  }
  .idk_flip_back ul {
    margin: 0;
    padding-left: 20px;              
  }
  .idk_flip_back li {
    font-size: 14px;
    line-height: 1.55;               
    margin-bottom: 10px;              
    word-break: break-word;           
  }
}



@media (max-width: 575.98px) {
  .idk_flip_back{
    overflow-y: auto;                 /* zadržavamo scroll */
    padding: 56px 18px 18px !important; /* ↓ spusti sadržaj (povećaj po potrebi) */
    box-sizing: border-box;
  }

 
  .idk_flip_back > :first-child { margin-top: 0 !important; }

  /* da se bulleti ne lijepe uz rub */
  .idk_flip_back ul{
    margin: 0 !important;
    padding-left: 20px;
    list-style-position: inside;      /* bulleti 100% unutar boxa */
  }
}


/* =============== TABLET & MANJE (≤991.98px) =============== */
@media (max-width: 991.98px) {
  /* Box spacing */
  .idk_box_front { padding: 16px 20px; }
  .idk_box_front h3 { font-size: 22px; letter-spacing: .3px; }

  .idk_box_back { padding: 22px 24px; }

  /* Variations: 2 kolone na tabletu */
  .idk_variations .row { row-gap: 16px; }
  .idk_variations .col { 
    flex: 0 0 50%;
    max-width: 50%;
    text-align: center;
  }

  /* skini vertikalne linije/dividere ako ih ima */
  .idk_variations .col { border-left: none !important; }
  .idk_variations .col + .col { border-left: none !important; }

  .idk_variations h5 { font-size: 16px; margin-bottom: 6px; }
  .idk_variations h3 { font-size: 22px; margin: 0; }

  /* Dugme */
  #bookNowBtn { 
    width: 100%;
    padding: 10px 14px;
    font-size: 16px;
  }

  /* Checkbox red: poravnanje i manji font */
  .form-check { 
    display: flex; 
    align-items: flex-start; 
    gap: 10px; 
    text-align: left; 
  }
  .form-check-input { margin-top: .35rem; }
  .form-check-label { font-size: 14px; line-height: 1.45; }
}

/* =============== MALI TABLET / VEĆI MOB (≤767.98px) =============== */
@media (max-width: 767.98px) {
  .idk_box_front h3 { font-size: 20px; }
  .idk_box_back { padding: 18px 20px; }

  /* 1 kolona odavde naniže */
  .idk_variations .col { 
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* umjesto vertikalnih – tanki horizontalni razdjelnik među stavkama */
  .idk_variations .col { border-top: 1px solid rgba(0,0,0,.08); padding-top: 12px; }
  .idk_variations .col:first-child { border-top: none; padding-top: 0; }

  .idk_variations h5 { font-size: 15px; }
  .idk_variations h3 { font-size: 20px; }

  #bookNowBtn { font-size: 15px; padding: 10px; }
  .form-check-label { font-size: 13.5px; }
}

/* =============== MOBITELI (≤575.98px) =============== */
/* MOBITEL (≤575.98px) — full width, bez vertikalnih, kratke horizontalne */
@media (max-width: 575.98px) {
  .idk_box_back { padding: 14px 12px !important; }

  .idk_variations .row{
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 0;
  }

  /* Svaka stavka puni red, bez VERTIKALNIH linija */
  .idk_variations .col,
  .idk_variations [class*="col-"]{
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 12px 0 !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;   
    border-bottom: 1px solid #999;
    position: relative;
  }

  /* Ukloni pseudo-elemente koji crtaju vertikalne trake */
  .idk_variations .col::before,
  .idk_variations .col::after,
  .idk_variations [class*="col-"]::before,
  .idk_variations [class*="col-"]::after{
    content: none !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }

  /* DODAJ KRATKU HORIZONTALNU liniju samo između stavki */
  .idk_variations .col:not(:first-child)::before{
    content: "";
    display: block;
    height: 1px;
    background: rgba(0,0,0,.15);
    width: calc(100% - 40px);   /* kraća od containera (20px lijevo/desno) */
    margin: 12px auto;          /* centrirana linija */
  }

  /* Button i checkbox ostaju full width containera */
  #bookNowBtn{
    display: block !important;
    width: 100% !important;
    margin: 16px 0 !important;
    padding: 12px !important;
    font-size: 15px;
  }
  .form-check{ display:flex; gap:10px; width:100% !important; text-align:left; }
  .form-check-input{ margin-top:.35rem; flex:0 0 auto; }
  .form-check-label{ flex:1 1 auto; line-height:1.45; }
}


.idk_search_form input {
  width: 100%;
  height: auto;
  padding: 10px 15px;
  font-size: 18px;
}

.idk_slide{
	height: 520px;
}
.idk_slide img{
	height: 100%;
  width: 100%;
  object-fit: cover;

}
.idk_slide1{
	height: 250px;
}

.slick-slide {
      margin: 0 10px;
  }

 .idk_hero_slider .slick-slide {
      margin: 0 0px;
  }

  /* the parent */
  .slick-list {
      margin: 0 -10 px;
  }


   /* Clean Slick Dots – only circles */
.idk_slider .slick-dots {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 14px 0 4px;
  padding: 0;
  list-style: none;
}

.idk_slider .slick-dots li {
  width: 10px;
  height: 10px;
}

.idk_slider .slick-dots li button {
  font-size: 0;         /* hide numbers */
  line-height: 0;
  padding: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgb(236, 235, 235);     /* inactive = grey */
  border: none;
  cursor: pointer;
}

/* Remove Slick’s default generated content */
.idk_slider .slick-dots li button:before {
  content: none !important;
}

/* Active dot */
.idk_slider .slick-dots li.slick-active button {
  background: #E4E0DB;  /* active = blue */
  transform: scale(1.1);
}


#lightcase-nav a {
	color: #FFFFFF !important;
}

a.lightcase-icon-close {
	color: #FFFFFF !important;
}

.sharethis-inline-share-buttons{
  z-index: 0 !important;
}

/*flip box*/
.idk_flip_box {
  perspective: 1000px;
  height: 300px; /* prilagodi po želji */
  cursor: pointer;
}

.idk_flip_inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.5s;
  transform-style: preserve-3d;
}

.idk_flip_box.flipped .idk_flip_inner {
  transform: rotateY(180deg);
}

.idk_flip_front,
.idk_flip_back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  border: 1px solid #ddd;
  
  background: linear-gradient(
  to top,
  #ffffff 0%,
  #f1efed 50%,
  #ebe8e4 75%,
  #e4e0db 100%
);
  padding: 30px;
  text-align: center;
}

.idk_flip_front h3 {
  font-weight: bold;
  color: #333;
}

.idk_flip_back {
  background: #E4E0DB;
  transform: rotateY(180deg);
  display: flex;
  align-items: center;
  justify-content: center;
}

.idk_flip_icon{
  height: 35px;
  width: 35px;
 margin-left: 25px ;
}


/*expand box*/
.idk_box {
  border: 1px solid #ddd;
  
  background: linear-gradient(
    to top,
    #ffffff 0%,
    #f1efed 50%,
    #ebe8e4 75%,
    #e4e0db 100%
  );
  cursor: pointer;
  transition: all 0.5s ease;
}

/* početno stanje */
.idk_box_front {
  display: block;
  padding: 10px;
}
.idk_box_back {
  display: none;
  padding: 60px 150px; /* tvoj zahtjev */
}

/* aktivni (drugi) prikaz */
.idk_box.expanded .idk_box_front {
  display: none;
}
.idk_box.expanded .idk_box_back {
  display: block;
}

/* Dividers between variations */
.idk_variations .col {
  position: relative;
}

/* linija desno osim na zadnjem */
.idk_variations .col:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 10%;
  right: 0;
  width: 1px;
  height: 80%;
  background-color: #ccc;
}

#bookNowBtn {
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.2);
  border: none; /* opciono ako ne želiš border */
}

.idk_flip_back{
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* glatko na mobilnim uređajima */

}

/* Back strana neka ne bude centrirana, nego od vrha nadole */
.idk_flip_back{
  flex-direction: column;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;

}

/* samo ako želiš osigurati da prvi element nema dodatni “skok” */
.idk_flip_back > :first-child { 
  margin-top: 0;
}

.idk_flip_back p{
  padding-left: 15px;
}

/* ===========================
   Minimalist thin scrollbar (kao na slici)
   =========================== */

.idk_flip_back {
  max-height: 72vh;          /* po želji */
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;

  /* samo malo prostora s desne strane */
 
}

/* Firefox */
.idk_flip_back {
  scrollbar-width: thin;
  scrollbar-color: #aaa transparent; /* thumb, track */
}

/* Chromium / WebKit */
.idk_flip_back::-webkit-scrollbar {
  width: 8px;
}
.idk_flip_back::-webkit-scrollbar-track {
  background: transparent;
}
.idk_flip_back::-webkit-scrollbar-thumb {
  background-color: #aaa;
  border-radius: 10px;
}
.idk_flip_back::-webkit-scrollbar-thumb:hover {
  background-color: #999;
}
.idk_flip_back::-webkit-scrollbar-thumb:active {
  background-color: #888;
}

/* malo deblji na mobitelima radi hvatanja */
@media (max-width: 575.98px) {
  .idk_flip_back::-webkit-scrollbar {
    width: 10px;
  }
}

@media (max-width: 991.98px){
  .idk_flip_back{
    /* prostor da sadržaj ne “udari” u gornji rub kad je box plići */
    padding-top: 48px !important;
    padding-right: 18px !important;
    padding-bottom: 18px !important;
    padding-left: 18px !important;
  }
  .idk_flip_back > :first-child{ margin-top: 0 !important; }
}

/* ========== MALI MOB (≤575.98px): još malo više prostora ========== */
@media (max-width: 575.98px){
  .idk_flip_back{
    /* po potrebi podigni na 56–64px */
    padding-top: 45px !important;
  }
  .idk_flip_back::-webkit-scrollbar{ width:10px; } /* lakše za prst */
}


.idk_flip_back{
  display: block !important;              /* prekida d-flex iz HTML-a */
  align-items: flex-start !important;      /* safety ako d-flex ostane negdje */
  justify-content: flex-start !important;
  overflow-y: auto;
  box-sizing: border-box;
}

/* Sakrij bočne trake (idk_title_bar) na ekranima manjim od 992px */
@media (max-width: 991.98px) {
  .idk_title_bar {
    display: none !important;
  }
}

/*********** RESPONSIVE ***********/


/*header*/

@media (max-width: 991.98px) {

  /* -- Global header spacing -- */
  header .idk_paddingtop50 { 
    padding-top: 20px !important;
  }

  /* ===== 1. Gornji red (telefon | logo | ikone) ===== */
  /* Svaki kol ide cijelom širinom i centrira se */
  header .row.justify-content-between.align-items-center > [class^="col-lg-"] {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
  }

  /* Redoslijed: 1) Logo, 2) Telefon, 3) Ikone */
  header .row.justify-content-between.align-items-center > div:nth-child(2) { order: 1; } /* logo */
  header .row.justify-content-between.align-items-center > div:nth-child(1) { order: 2; } /* phone */
  header .row.justify-content-between.align-items-center > div:nth-child(3) { order: 3; } /* icons */

  /* Telefon: malo prostora i poravnanje */
  header .row.justify-content-between.align-items-center > div:nth-child(1) a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    line-height: 1;
  }
  header .row.justify-content-between.align-items-center > div:nth-child(1) img {
    width: 18px;
    height: 18px;
  }

  /* Logo: smanji ako je prevelik */
  header .row.justify-content-between.align-items-center > div:nth-child(2) img.img-fluid {
    max-height: 56px;
    width: auto;
    margin-bottom: 15px;
  }

  /* Ikone društvenih mreža: veći tap-area i razmak */
  .idk_header_icons {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 8px;
  }
  .idk_header_icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px; height: 40px;           /* veći dodir */
    border-radius: 50%;
  }
  .idk_header_icons img {
    max-width: 20px;
    height: auto;
  }

  /* ===== 2. Donji red (bar | meni | bar) ===== */
  /* Trake se skrivaju na mobu */
  header .row.idk_paddingtop50.align-items-center .idk_title_bar {
    display: none !important;
  }

  /* Kolone u jedan stupac */
  header .row.idk_paddingtop50.align-items-center > [class^="col-lg-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .idk_hero_content h1{
    font-size: 30px;
  }

.idk_newsletter {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    text-align: center;
  }

  .idk_newsletter > .col-lg-6,
  .idk_newsletter > .col-lg-5,
  .idk_newsletter > .col-md-7,
  .idk_newsletter > .col-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .idk_subscribe {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
  }

  .idk_subscribe input[type="email"] {
    flex: 1 1 auto;
    height: 48px;
    font-size: 16px;
    padding: 10px 14px;
  }

  .idk_subscribe .idk_btn_flat {
    flex: 0 0 auto;
    height: 48px;
    padding: 0 18px;
    font-size: 16px;
    white-space: nowrap;
  }

  .idk_checkbox {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    margin-top: 12px;
    text-align: left;
  }
  .idk_checkbox input[type="checkbox"] {
    width: 20px; height: 20px;
    margin-top: 2px;
  }
  .idk_checkbox label {
    font-size: 15px;
    line-height: 1.35;
  }

   .idk_footer_content {
    text-align: center;
    row-gap: 20px;
  }
  .idk_footer_content > [class^="col-lg-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .idk_footer_nav,
  .idk_footer_social {
    justify-content: center;
    flex-wrap: wrap;
  }
  .idk_footer_content img.img-fluid {
    max-height: 56px;
    width: auto;
  }
  .idk_footer p {
    font-size: 14px;
    line-height: 1.4;
  }
  .idk_footer hr {
    margin: 20px 0;
  }
  .idk_footer .row.justify-content-around.idk_paddingbot30.idk_paddingtop30 > [class^="col-lg-"] {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
    margin-top: 10px;
  }

  .idk_paddingtop100{
    padding-top: 50px;
  }
  .idk_paddingtop30{
    padding-top: 0px;
  }
   .idk_paddingbot30{
    padding-bottom: 0px;
  }
.idk_card1{
  margin-bottom: 20px;
}

 
  .idk_content {
    height: auto;       /* da se prilagodi sadržaju */
    padding: 20px;      /* malo unutrašnjeg prostora */
    flex-direction: column; /* elementi se slažu jedan ispod drugog */
  }

}

@media (max-width: 767.98px) {
  .idk_footer_nav li,
  .idk_footer .list-inline li {
    margin: 4px 8px;
  }
  .idk_footer_social {
    gap: 12px;
  }
  .idk_footer p {
    font-size: 13.5px;
  }
  .idk_footer .list-inline a {
    font-size: 14px;
  }
   .idk_paddingtop100{
    padding-top: 50px;
  }
  .idk_paddingtop30{
    padding-top: 0px;
  }
   .idk_paddingbot30{
    padding-bottom: 0px;
  }
  .idk_card1{
  margin-bottom: 20px;
}
  .idk_content {
    height: 350px;
    padding: 10px;
  }

   .idk_form {
    padding: 10px;
  }

  .idk_label {
    font-size: 14px;
    margin-bottom: 4px;
  }

  .idk_input,
  .idk_textarea {
    width: 100%;
    font-size: 14px;
    padding: 8px 10px;
    margin-bottom: 12px;
  }

    .idk_textarea {
    min-height: 120px;   /* ~4 reda */
    line-height: 1.4;
    resize: vertical;     /* dozvoli povlačenje po visini */
  }

  .idk_submit {
    width: 100%;
    font-size: 15px;
    padding: 10px;
    margin-top: 10px;
  }

  .idk_consent_wrap {
    font-size: 12px;
    line-height: 1.4;
  }

  .idk_check_label span {
    font-size: 12px;
  }

  .idk_error {
    font-size: 11px;
  }
}


@media (max-width: 1199.98px) {
  .idk_footer_nav {
    gap: 10px 20px;
    font-size: 15px;
  }
  .idk_footer_social {
    gap: 10px 16px;
  }
  .idk_footer .list-inline a {
    font-size: 15px;
  }
  .idk_footer_content p {
    font-size: 15px;
  }
  .idk_footer_content img.img-fluid {
    max-height: 48px;
  }
  .idk_footer_nav {
    flex-direction: row;
    gap: 8px;
  }
  .idk_footer_social {
    justify-content: row;
    gap: 14px;
  }
  .idk_footer .list-inline {
    flex-direction: row;
    gap: 6px;
  }
  .idk_footer p {
    font-size: 15px;
    line-height: 1.4;
    margin: 6px 0;
  }
   .idk_paddingtop100{
    padding-top: 50px;
  }

}


/* Jako mali ekrani (max 575.98px) */
@media (max-width: 575.98px) {
  /* Input i button jedan ispod drugog sa RAZMAKOM */
  
  .idk_newsletter h4 { font-size: 1.15rem; }
  .idk_newsletter p  { font-size: 0.95rem; }
  .idk_checkbox label { font-size: 0.95rem; }

.idk_footer_content img.img-fluid {
    height: 70px;
  }
  .idk_footer_nav {
    flex-direction: column;
    gap: 8px;
  }
  .idk_footer_social {
    justify-content: center;
    gap: 14px;
  }
  .idk_footer .list-inline {
    flex-direction: row;
    gap: 6px;
  }
  .idk_footer_content p {
    font-size: 13px;
    line-height: 1.4;
    margin: 6px 0;
  }
   .idk_paddingtop100{
    padding-top: 50px;
    
  }

   .idk_paddingtop30{
    padding-top: 0px;
  }
   .idk_paddingbot30{
    padding-bottom: 0px;
  }
.idk_footer p{font-size: 13px;}

.idk_card1{
  margin-bottom: 20px;
}
.idk_tabs_head.nav-tabs {
    border-bottom: none !important;
  }

   .idk_content {
    height: auto;
    padding: 5px;
  }
 .idk_form {
    padding: 10px;
  }

  .idk_label {
    font-size: 14px;
    margin-bottom: 4px;
  }

  .idk_input,
  .idk_textarea {
    display: block;
    width: 100%;
    font-size: 14px;
    padding: 8px 10px;
    margin-bottom: 12px;
    box-sizing: border-box;
  }

  .idk_textarea {
    min-height: 120px;   /* ~4 reda */
    line-height: 1.4;
    resize: vertical;     /* dozvoli povlačenje visine */
  }

  .idk_submit {
    width: 100%;
    font-size: 15px;
    padding: 10px;
    margin-top: 10px;
  }

  .idk_consent_wrap {
    font-size: 12px;
    line-height: 1.4;
  }

  /* Checkbox i tekst u istom redu */
  .idk_check_label {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 8px;
  }

  .idk_check_label input {
    margin: 3px 0 0 0; /* spusti malo checkbox da se poravna s prvim redom teksta */
  }

  .idk_check_label span {
    font-size: 13px;
    line-height: 1.4;
  }

  .idk_error {
    font-size: 11px;
  }
}

.idk_img_wrapper{
  height: 350px;
  width: 100%;
}
.idk_img_wrapper img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}



/* IDK Menu Start */
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: flex;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
}

#cssmenu:after,
#cssmenu > ul:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

#cssmenu #menu-button {
	display: none;
}

#cssmenu {
	justify-content: center;
}

#cssmenu > ul > li {
	float: left;
}

#cssmenu.align-center > ul {
	font-size: 0;
	text-align: center;
}

#cssmenu.align-center > ul > li {
	display: inline-block;
	float: none;
}

#cssmenu.align-center ul ul {
	text-align: left;
}

#cssmenu.align-right > ul > li {
	float: right;
}

#cssmenu > ul > li > a {
	padding: 21px;
	font-size: 16px;
	text-decoration: none;
	color: #333333;
	text-transform: uppercase;
	display: inline-block;
}

#cssmenu > ul > li:hover > a {
	color: #333333;
	background-color:#E4E0DB ;
}

#cssmenu > ul > li.has-sub > a {
	padding-right: 30px;
}

#cssmenu > ul > li.has-sub > a:after {
	position: absolute;
	top: 28px;
	right: 11px;
	width: 8px;  
	height: 2px;
	display: block;
	background: #333333;
	content: '';
}

#cssmenu > ul > li.has-sub > a:before {
	position: absolute;
	top: 25px;
	right: 14px;
	display: block;
	width: 2px;
	height: 8px;
	background: #333333;
	content: '';
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
}

#cssmenu > ul > li.has-sub:hover > a:before {
	top: 23px;
	height: 0;
}

#cssmenu ul ul {
	position: absolute;
  top: 50px;
	left: -9999px;
  display: flex;
  flex-direction: column;
  z-index: 100;
  border: 2px solid #E4E0DB;
  

}

#cssmenu.align-right ul ul {
	text-align: right;
}

#cssmenu ul ul li {
	height: 0;
  min-width: 300px;
  border-bottom: 1px solid #E4E0DB;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
}

#cssmenu li:hover > ul {
	left: auto;
}

#cssmenu.align-right li:hover > ul {
	left: auto;
	right: 0;
}

#cssmenu li:hover > ul > li {
	height: 35px;
}

#cssmenu ul ul ul {
	margin-left: 100%;
	top: 0;
}

#cssmenu.align-right ul ul ul {
	margin-left: 0;
	margin-right: 100%;
}

#cssmenu ul ul li a {
	padding: 12px 15px;
	width: 300px;
	font-size: 13px;
	text-decoration: none;
	color: black;
	font-weight: 400;
	background: white;
}

#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {
	border-bottom: 0;
}

#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
	color: black;
  background-color: #E4E0DB;
}

#cssmenu ul ul li.has-sub > a:after {
	position: absolute;
	top: 16px;
	right: 11px;
	width: 8px;
	height: 2px;
	display: block;
	background: #333;
	content: '';
}

#cssmenu.align-right ul ul li.has-sub > a:after {
	right: auto;
	left: 11px;
}

#cssmenu ul ul li.has-sub > a:before {
	position: absolute;
	top: 13px;
	right: 14px;
	display: block;
	width: 2px;
	height: 8px;
	background: #333;
	content: '';
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
}

#cssmenu.align-right ul ul li.has-sub > a:before {
	right: auto;
	left: 14px;
}

#cssmenu ul ul > li.has-sub:hover > a:before {
	top: 17px;
	height: 0;
}

@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
	#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {

	display: block;

	
}
  
  #cssmenu ul ul {
    top: 0px;
  }
  
  #cssmenu {
		width: 100%;
    display: block;
	}

	#cssmenu ul {
		width: 100%;
		display: none;
	}

	#cssmenu.align-center > ul {
		text-align: left;
	}

	#cssmenu ul li {
		width: 100%;
		border-top: 1px solid rgba(120, 120, 120, 0.2);
	}

	#cssmenu ul ul li,
	#cssmenu li:hover > ul > li {
		height: auto;
	}

	#cssmenu ul li a,
	#cssmenu ul ul li a {
		width: 100%;
		border-bottom: 0;
	}

	#cssmenu > ul > li {
		float: none;
	}

	#cssmenu ul ul li a {
		padding-left: 25px;
	}

	#cssmenu ul ul ul li a {
		padding-left: 35px;
	}

	#cssmenu ul ul li a {
		color: black;
		background: none;
	}

	#cssmenu ul ul li:hover > a,
	#cssmenu ul ul li.active > a {
		color: black;
	}

	#cssmenu ul ul,
	#cssmenu ul ul ul,
	#cssmenu.align-right ul ul {
		position: relative;
		left: 0;
		width: 100%;
		margin: 0;
		text-align: left;
    justify-content: center;
	}

	#cssmenu > ul > li.has-sub > a:after,
	#cssmenu > ul > li.has-sub > a:before,
	#cssmenu ul ul > li.has-sub > a:after,
	#cssmenu ul ul > li.has-sub > a:before {
		display: none;
	}

	#cssmenu #menu-button {
		display: block;
		padding: 17px;
		
		cursor: pointer;
		font-size: 12px;
		text-transform: uppercase;
		font-weight: 700;
    width: 100%;
	}

	#cssmenu #menu-button:after {
		position: absolute;
		top: 22px;
		right: 17px;
		display: block;
		height: 8px;
		width: 20px;
		border-top: 2px solid black;
		border-bottom: 2px solid black;
		content: '';
	}

	#cssmenu #menu-button:before {
		position: absolute;
		top: 16px;
		right: 17px;
		display: block;
		height: 2px;
		width: 20px;
		background: black;
		content: '';
	}

	#cssmenu #menu-button.menu-opened:after {
		top: 23px;
		border: 0;
		height: 2px;
		width: 15px;
		background: #ffffff;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	#cssmenu #menu-button.menu-opened:before {
		top: 23px;
		background: #ffffff;
		width: 15px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}

	#cssmenu .submenu-button {
		position: absolute;
		z-index: 99;
		right: 0;
		top: 0;
		display: block;
		border-left: 1px solid rgba(120, 120, 120, 0.2);
		height: 46px;
		width: 46px;
		cursor: pointer;
	}

	#cssmenu .submenu-button.submenu-opened {
		background: #262626;
	}

	#cssmenu ul ul .submenu-button {
		height: 34px;
		width: 34px;
	}

	#cssmenu .submenu-button:after {
		position: absolute;
		top: 22px;
		right: 19px;
		width: 8px;
		height: 2px;
		display: block;
		background: #333;
		content: '';
	}

	#cssmenu ul ul .submenu-button:after {
		top: 15px;
		right: 13px;
	}

	#cssmenu .submenu-button.submenu-opened:after {
		background: #ffffff;
	}

	#cssmenu .submenu-button:before {
		position: absolute;
		top: 19px;
		right: 22px;
		display: block;
		width: 2px;
		height: 8px;
		background: #333;
		content: '';
	}

	#cssmenu ul ul .submenu-button:before {
		top: 12px;
		right: 16px;
	}

	#cssmenu .submenu-button.submenu-opened:before {
		display: none;
	}
}

/* IDK Menu End */

@media (max-width: 1200px) {

}