:root {
  --cassiopeia-color-primary: /*#004e80*/ #004e80 !important;
  --cassiopeia-color-link: /*#004e80*/ #004e80 !important;
  --cassiopeia-color-hover: /*#024067*/ #013150 !important;
}



body {font-family: Helvetica, Arial, Sans-Serif !important;}
/*body {font-family: 'Ubuntu', sans-serif !important;}*/

.header {}

.top-logo {text-align:left; width:100%; max-width:320px; float:left; margin-top: 15px; margin-bottom:10px; padding-left:20px;}
@media (max-width: 660px) {
  .top-logo {float:none; text-align:center; width:100%; max-width: 660px; margin:auto; margin-bottom:25px;}
  .top-logo img {max-width:300px;}
}

.top-social {text-align:right; width:100%; max-width:320px; float:right; margin-top: 25px; margin-bottom:; padding-left:25px; padding-right:25px; font-size:25px;}
@media (max-width: 660px) {
  .top-social {float:none; text-align:center; width:100%; max-width: 660px; margin:10px 8px -10px -50px; font-size:25px;}
}


.container-topbar a:link, .container-topbar a:visited {color: #ffffff !important;}
.container-topbar a:hover, .container-topbar a:active {color: #c0c0c0 !important;}


.sidebar-right.card.zvizdac {border: none !important; padding: none !important; box-shadow: none !important; }


/* search display tuning */
.com-finder.finder {margin-top:25px;}
.com-finder.finder .me-2 {padding-bottom:10px;}
.com-finder.finder .form-inline {margin-bottom:25px;}
.com-finder__counter.search-pages-counter {margin-top:25px; margin-bottom:25px;}
.com-finder__results .result__date {font-style:italic; text-transform:uppercase; font-size:12px; color:#004e80;}
.com-finder__results .result__item {border-color: #c0c0c0;}

/* top & footer navigation mobile view & display */
@media (max-width: 660px) {
.collapse.navbar-collapse .mod-menu_dropdown-metismenu {padding-bottom:20px !important;} 
.collapse.navbar-collapse li {padding-left:100px !important;}
.container-footer .navbar {margin-top:20px !important;}
.container-footer li {display:block !important; float:; width:250px;}  
.container-footer .collapse.navbar-collapse {}
}
@media (min-width: 661px) and (max-width: 800px) {
.collapse.navbar-collapse .mod-menu_dropdown-metismenu {padding-bottom:20px !important;} 
.collapse.navbar-collapse li {padding-left:100px !important;}
.container-footer .navbar {margin-top:20px !important;}
.container-footer li {}  
.container-footer .collapse.navbar-collapse {}
}


.offline-card h1 {margin-top:8px !important; margin-bottom:25px !important; text-transform:uppercase !important; font-size:22px !important;}

.pagenavigation {margin-top:35px !important; margin-bottom:35px !important;}

/* Poruke na vrhu stranice iznad i ispod Breadcrumbs */
.grid-child.container-component .mod-articlesnews__item {margin-top:; margin-bottom:20px !important; border:1px solid #d10000 !important; border-radius: 4px !important; text-align:center; font-weight:bold; font-style:italic; color:#ca0000 !important; padding:20px 20px 20px 20px;} 
.main-top.card.poruke {border-color:#d10000 !important; padding:5px 0 5px 0 !important; margin:15px 0 20px 0 !important;}
.main-top.card.poruke .mod-articlesnews__item {border:none !important; padding:0 0 0 0 !important; margin:0 0 0 0 !important;}


.sidebar-right.card {box-shadow: 0px 0px 5px #f0f0f0;}
/*.blog .mod-breadcrumbs.breadcrumb {border: 1px solid #dfe3e7; border-radius: 4px; background: none !important; box-shadow: 0px 0px 5px #f0f0f0;}*/
.blog .mod-breadcrumbs.breadcrumb {border-bottom: 1px solid #dfe3e7; background: none !important; margin-bottom:-10px !important;}
.blog .blog-item {margin-top: 15px;}


.site-grid {margin-top:5px !important;} /* samo na naslovnici */
.blog .site-grid {margin-top:5px !important;}
.blog .mod-breadcrumbs__wrapper {margin-bottom:25px !important;}
.blog .com-content-article.item-pageblog img {width:100%; max-width: 500px; border: 1px solid #cccccc; padding: 2px 2px 2px 2px;}

.blog h1 {
  color:#004e80 !important; 
  margin-top:20px !important;
}

.blog h2 {
  font-size: 20px !important;
  font-family: Helvetica !important;
  font-weight: 500 !important;
  padding-bottom: 7px !important;
  color:#004e80 !important;
  padding-top:25px !important;
}

.blog-items h2 {font-size: 20px !important;}

h3.card-header {
  font-size: 17px !important;
  font-family: Helvetica !important;
  font-weight: 550 !important;
  text-align: center !important;
  padding-top: 15px !important;
  padding-bottom: 11px !important;
}


h1, .h1 {
  font-size: calc(1.375rem + 1.5vw);
  font-family: Helvetica !important;
  font-weight: 500 !important;
}
@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2.0rem;
  }
}

h2, .h2 {
  font-size: calc(1.325rem + 0.9vw);
  font-family: Helvetica !important;
  font-weight: 500 !important;
}
@media (min-width: 1200px) {
  h2, .h2 {
    font-size: 1.5rem;
  }
}

h3, .h3 {
  font-size: calc(1.3rem + 0.6vw);
  font-family: Helvetica !important;
  font-weight: 500 !important;
}
@media (min-width: 1200px) {
  h3, .h3 {
    font-size: 1.25rem;
  }
}

h4, .h4 {
  font-size: calc(1.275rem + 0.3vw);
  font-family: Helvetica !important;
  font-weight: 500 !important;
}
@media (min-width: 1200px) {
  h4, .h4 {
    font-size: 1.0rem;
  }
}

h5, .h5 {
  font-size: 0.75rem;
  font-family: Helvetica !important;
  font-weight: 500 !important;
}

h6, .h6 {
  font-size: 0.5rem;
  font-family: Helvetica !important;
  font-weight: 500 !important;
}

a:link , a:visited {text-decoration: none;}
a:hover , a:active {text-decoration: underline;}

.navbar-toggler.navbar-toggler-right {color: white !important;}



.blog-item img {border: 1px solid #ced4da; padding: 2px 2px 2px 2px;}
.item-page img {width:100%; max-width: 500px; border: 1px solid #ced4da; padding: 2px 2px 2px 2px;}
@media (min-width: 500px) 
{.left.item-image {margin-bottom: 10px !important; margin-right:25px !important;}}
@media (min-width: 500px) 
{.image {margin-bottom: 10px !important; margin-right:25px !important; float:left;}}

/*.blog .left.item-image .caption */ figcaption {
  /* margin-top: -32px !important; */
  /* margin-bottom: 32px !important; ovo je za naslovnicu */
  /* margin-left:15px !important; uključiti ako se pozicionira lijevo umjesto na sredini */
  /* text-align:center !important; */
  /* margin-left:15px !important; */
  /* color:#fff !important; */
  /* font-weight:bold !important; */
  /* text-shadow: 1px 1px 3px #000000 !important; */
  /* text-transform:uppercase; */
  font-style:italic;
  padding-top:2px;
  text-align:center;
}

/* YouTube video CSS settings */
.youtube {
  float:left;
  width:100%; max-width: 500px;
  border: 1px solid #ced4da;
  padding: 2px 2px 2px 2px;
  margin-bottom:10px;
}
@media (min-width: 500px) 
  {.youtube {margin-right:25px !important;}}
.youtube>div {
  position: relative;
  padding-bottom: 56.25%;
  height: 0px;
}
.youtube iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.iframe-video {float:left; width:100%; max-width:500px; display:block; padding-bottom:15px;}
@media (min-width: 500px) {.iframe-video {margin-right:25px !important;}}

.createdby, .category-name, .published { text-transform:uppercase !important; font-size:13px !important; font-weight:bold !important; font-style: italic !important; margin-bottom:-1px !important; }
.article-info.text-muted { margin:15px 0 17px 15px; }

.layout-blog .article-info.text-muted { margin:5px 0 17px 15px; }
.view-category.layout-blog h2 { margin-top:-25px !important; }
.com-content-article.item-pageblog .article-info.text-muted { margin:15px 0 17px 15px; }

.tags { text-transform:uppercase !important; font-weight:bold !important; font-style:italic !important; margin:; text-align:;}
.tags a:link { font-size:11px !important; }
.com-content-article.item-pageblog .tags { margin-top:35px !important; }
/* .view-category.layout-blog .tags.list-inline { display:none !important; } */
.blog-item .tags.list-inline { display:none !important; }

.kategorije { border:1px solid #004e80; width:270px; padding:22px 15px 15px 15px; margin:15px 12px 15px 12px; display:inline-block; text-align:center; text-transform:uppercase; font-weight:bold; font-size:16px; border-radius:3px; }

/* Coockies style */
.jb-cookie .jb-cookie-title { font-size: 16px !important; font-weight: 450 !important; padding-top:16px !important;}
.jb-cookie .jb-color { font-size: 16px !important; padding:13px 0 20px 0 !important; font-weight: 450 !important; }
.jb-cookie .jb-accept { font-size: 16px !important; padding:10px 0 10px 0 !important; font-weight: 450 !important; display: block !important; min-width:150px !important; margin-bottom:16px !important; }
.jb-cookie .jb-cookie-bg.bgcolor { background-color: rgba(0,0,0,0.9) !important; }
.jb-cookie { min-height:35% !important; border:none !important;}

.container-footer li {display: inline-block !important; font-style:; vertical-align: top !important;}

/* ovo vidjeti kak da cijeli blok ide na vrh */
.container-footer nav {display: inline-block !important; vertical-align: top !important;}
.container-footer nav a:hover {color: #ffffff !important;}

/* donate button inside article */
.donate {display:inline-block; border:; background-color:#174b89; color:#ffffff; border-radius:5px; margin-right:5px; margin-top:10px;}
.donate a:link {display:inline-block; border:1px solid #174b89; background-color:#174b89; color:#ffffff; padding:5px 10px 5px 10px; border-radius:5px;}
.donate a:visited {display:inline-block; border:1px solid #174b89; background-color:#174b89; color:#ffffff; padding:5px 10px 5px 10px; border-radius:5px;}
.donate a:hover {display:inline-block; border:1px solid #174b89; background-color:#ffffff; color:#174b89; padding:5px 10px 5px 10px; text-decoration:none !important; border-radius:5px;}
.donate a:active {display:inline-block; border:1px solid #174b89; background-color:#174b89; color:#ffffff; padding:5px 10px 5px 10px; border-radius:5px;}


/* Google Translator specific css */
/* .goog-te-banner-frame.skiptranslate, */
/* body > .skiptranslate { */
/*   display: none !important; */
/* } */
/* body { */
/*   top: 0 !important; */
/* } */

/*.flags {width:28px; height:auto; border:1px solid #ccc; padding:1px 1px 1px 1px;}*/
.flags {width:29px; height:auto; border-radius:3px; border:1px solid #696969;}
.sidebar-right.card.google.translate {display:none;}