/* DESKTOP VERSION CSS */
*{padding:0px;margin:0px;}
HTML{ width:100%;}
BODY {
    width:100%;
    height: 100%;
    margin: 0px;
    padding:0px;
    font-size:16px;
    overflow-x: hidden;
    overflow-y: scroll;
    color:var(--text);
    font-family:regular,sans-serif;

}


/* VARIABLES */


:root {
    
    --button:#E8BE5C;
    --hover:#001D3E;
    --disabled:#A7A7A7;
    --font:#001D3E;
    --background:#CECFCE;  
    --main: #169;
    --secondary:#58B;
    --neutral:#E7E7EA;
    --text:#666;
    --main_gradient:radial-gradient(50% 50% at 50% 50%, #99C75B 0%, rgba(153, 199, 91, 0) 100%);
    --pg: #4488aa;
    --slyel_20:rgba(254,193,39,.2);
    --fl:24px;
    --fxl:36px;
    --fm:20px;
    --fn:16px;
    --fs:14px;
    --fxs:12px;
    --fxxs:9px;
    --th:rgba(86,191,12,.05);
    --negative_color:#eee;
    --width_inner:900px;
    --width_min: 800px;
    --menu_width:1100px;
      --A: #7CE2;
      --B: #7CE4;
      --C: #7CE3;
      --D: #7CE1;
      --E: #FFF;
}

@font-face {font-family: icons; src: url(font-awesome/fonts/FontAwesome.otf);}
@font-face {font-family: g_icons; src: url('fonts/google_icons.ttf');}

.hidden, .desktop_off, .ERRporuka,
.events_pages.hide_main .oblast_zaglavlja,
.events_pages.hide_main .oblast_futera,
.catalog_search,
.userBar,.doff,
.mobile_baner{display: none!important;}


img {width: 100%; height:auto;}
a{text-decoration:none;outline:none;}
.icons, .index .searchDugme {font-family: icons;}
.g_icon{font-family: g_icons}
.active_page{display: block!important;}
.flex{display:flex;}
.app_messages{
    text-align: center;
    padding: 30px 20px;
    width:80%;
    margin:30px auto 0 auto;
    background: #fff;
    color:#f33;
    font-size:var(--fn);
    min-height: 80px;

}
.pageBody{min-height:35vw;}
.pageBody table{border-collapse: collapse; margin:30px auto; width:var(--width_inner)}
.pageBody table td, .pageBody table th{border: solid 1px #000;padding: 10px;}
figure{margin:auto; padding:20px 0;}
figcaption{display: block; padding: 20px; color:var(--text);margin:auto; text-align: center;line-height:1.3em;}
.float.float_left{float:left;max-width:400px;margin:0 20px 20px 0}
.image_cnt{display:block; min-width:400px; padding:20px 0;width:100%;}
.image_cnt img{display:block; width:auto;max-height:350px;margin:auto; max-width:100%}
.image_cnt.img_center{width: 100%; max-width:var(--width_inner); margin:auto;}
.image_cnt.img_fullwidth{max-width: var(--width_inner); margin: auto;}
.image_cnt.img_fullwidth img{display: block;width: 100%;}
.float_container{
    display: flow-root;max-width: var(--width_inner); margin:auto
}
.float_container .image_cnt{max-width: 45%;}
.float_container .image_cnt img{height:auto;}
.float_container p, .flex_item p{padding: 1.4em 0 0 0;}
.rectangle{
  box-sizing: border-box;
  border: 1px solid transparent;
}

/*glavni meni*/

/*GLAVNI MENI*/
.glavni_meni .menutype_51{
    max-width:1100px;
    padding: 17px;
}
.glavni_meni{width:100%; margin:-20px auto 0 0;background: linear-gradient(to bottom, #125, #116699); box-shadow: 0px -3px 14px 8px #1255}
.glavni_meni >ul{display: flex;z-index: 20; justify-content:center;list-style: none;position:relative;box-sizing:border-box;flex-grow: 1;width:1100px; margin: auto;}
.glavni_meni >ul > li{ text-align: center; display:block;position:relative;padding: 0 6px 0 16px; width:100%; border-left:1px solid #eee6;
line-height:1em;
}
.glavni_meni >ul > li:last-child{border-right:1px solid #eee6}
.glavni_meni >ul > li >a{ position: relative;text-decoration: none; display: block;width: 100%; 
     color: #eee; font-size:14px; text-transform: uppercase; text-align: center; }
.glavni_meni >ul >li ul{display: none;width:280px;}
.glavni_meni >ul >li ul  a{
    font-size: 16px!important; 
    text-decoration: none;display:block; 
    color:inherit; padding: 30px 10px 2px 10px; 
    border-bottom:1px solid #aaa;
    background: #fff;
    
        ;}
.glavni_meni li ul{position: absolute;font-size: 14px;
    top:34px;left:0; right: 0;
    list-style-type: none;
    box-shadow: 0 4px 3px 0 rgba(0,0,0,0.7), 0 2px 4px 0 rgba(0,0,0,9);
    height:auto; overflow:show;
    padding: 0;
    text-align: left
}
.glavni_meni .mainMenuOver li{ width:100%; text-align: left; border-bottom: .5px solid #555a}
.glavni_meni .mainMenuOver li a{ color: var(--darkblue);padding:10px 20px 10px 20px;font-size: 16px;display:block;}
.glavni_meni .mainMenuOver li a:hover{ color: #354597; background: #aacc;
}

/*BANNER*/
.baner_slide_title{
    position: absolute;
    bottom:160px;
    left:40px;
    font-size:40px;
    color:var(--main);
    background: #fffa;
    padding: 20px 40px;
    pointer-events: none;
}

.baner_slide_title:after{
    content:"Pročitajte više";
    bottom: -80px;left: 0;
    display:block;
    position: absolute;
    background: var(--main);
    color:#eee;
    font-size:26px;
    padding: 20px 80px;
    cursor:pointer;
 
}
.popup_baner{
display:none}

#reklama{
    position: absolute;
    top:-60px;right:2px;
    z-index: 200;   
    display: flex;
    justify-content: flex-end;

}
#reklama a{
    display: block;
    padding: 0;margin: 0;
    width: auto;
}
#reklama img{
    display: block;
    padding: 0;
    height:100px;
   
    box-shadow: -2px 2px 12px 2px  #5557;
}

/*header*/
.microsite_header{height: 100px;}
.top_row.flex{
    justify-content: space-between;
    align-items: center;

}
.logo_cnt{
    width:200px;
}
.middle_top{
    width:380px;
    display: flex;
    flex-direction: column;
    position: relative;
    

}
.potpis{
    position: absolute;
    bottom: -50px; right:0;
    width:220px;
    filter:hue-rotate(30deg) saturate(4) opacity(.5);
    rotate: -8deg;
    margin: auto;
    
}
.right_top{
    flex-grow: 1;
    _padding: 0 40px;
    box-sizing: border-box;
   position: relative;
    background: red;
   
}
#meshContainer{
    position: absolute;
bottom: -82px;    right: 3px;
}
.right_top img{
    padding: 30px 0 10px 0;
    display: block;
    width: 100%;
    max-width: 90%
}
/* FLEX TEMPLATES*/
.flex.cols_2{
    display: flex;
    gap:20px;
    justify-content: space-evenly;
    align-items: center;
    margin:20px auto;
    max-width: var(--width_inner);

        
}
.flex.cols_2 .flex_item{
    flex-grow: 1;
    flex-basis: 0;
}
.flex.cols_2 .image_cnt{max-width: 45%;}
.flex.cols_2 .image_cnt img{display: block;height: auto;}

/* INDEX */
.index.catid_1 .blockWrapper{
    width: var(--width_inner);
    margin: auto;
    padding: 40px 0 130px 0;
    text-align: center;
}
.index.catid_1 .blockWrapper h2{
    padding: 10px 0 30px;
    color:var(--main);
}
.index.catid_1 .blockWrapper p{
    line-height:1.8em;
}

/* PAGES */
.page #coll_middle{
    max-width:1200px;
    margin:auto;
    padding: 40px 0;
}
.page #pageBody{

    box-sizing:border-box;
}
.page .pageTitle, .page .catTitle{
    padding: 20px 0 0 0;
    border-bottom:1px solid var(--main);
    color:var(--main);
    width: var(--width_inner);
    margin: auto;
    box-sizing: border-box;
}
.page h2{
    padding: 40px 0 16px;
    color:var(--secondary);
     margin: auto;
     max-width: var(--width_inner);
}
.page h3{color:var(--secondary);
padding: 40px 0 16px;
    max-width: var(--width_inner);
    box-sizing: border-box;
    margin: auto;
}
.page p{
    line-height: 1.8em;
    color:var(--text);
    box-sizing: border-box;
    margin: auto;
    max-width: var(--width_inner);
    padding: 10px 0
}
.page p a{
    color:inherit;
    text-decoration: underline;
}
.page ul, .page ol{
    margin: auto;
    padding: 20px 0;
    box-sizing: border-box;
    line-height: 1.8em;
    color:var(--text);
    max-width: var(--width_inner);
    list-style-position: inside;
    padding-left: 1.5em;
}
.page ul.microsite_wrapper{
    padding-left: 0;
}

/* STRANICE */

/* PREPORUKA */


.microsite_wrapper{
    display: block;
    list-style: none;
    max-width: 960px
}
 .microsite_wrapper .page-cID
{
    padding: 0 0 38px 0;
}
 .microsite_wrapper .antrafile{
    line-height: 1.6em;
}

.microsite_wrapper .page-cID a{
    color:inherit;
}

/* FOOTER */
.oblast_futera{
    background: var(--main);
    display: flex;
    margin: auto;
}
.footer_cnt{
    width: var(--width_inner);
    display: flex;
    justify-content: center;align-items: center;
    gap:20px;
    margin: auto;
    padding: 60px 0 160px 0;
}
.footer_cnt .footer_col{
    display: flex;
    justify-content: space-evenly;
    align-items:center;
    flex-grow: 1;
    flex-basis: 0;
    max-width: 33%;
        
}
.footer_cnt .footer_col li{
    
}
.footer_cnt a{
    display: block;
}
.footer_cnt img{
    display: block;
    width: 100%; 
}

.social_link{
    width:80px;
}

.page p a{
    color:var(--main);
}
.page p a:visited{
    color:var
}

a[href*="facebook.com"]::before {
  content: "\f082";
  font-family:icons;
  display: inline-block;
  margin-right: 6px;
  font-size: 0.9em;
  color: #3b5998;
   font-size:16px;
}

.social_link a:before{
    display: none
}


/*video*/

.video_flex{gap:10px; justify-content: space-between;}
.catid_180 .pageBody iframe{margin:auto; display: flex;}

    
@media (min-width: 1500px) {
.events.catid_52 .home_cnt{
    padding: 0;
    position: relative;
}   
}