@charset "utf-8";
/* CSS Document */

@font-face {
font-family: 'Cormorant';
src: url('../fonts/cormorant-inf-sb.woff') format('woff');
font-weight: 600;
font-style: normal;
}

@font-face {
font-family: 'Unna';
src: url('../fonts/unna-light.woff') format('woff');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-lightitalic.woff') format('woff');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-italic.woff') format('woff');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-medium.woff') format('woff');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-mediumitalic.woff') format('woff');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-bold.woff') format('woff');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Unna';
src: url('../fonts/unna-bolditalic.woff') format('woff');
font-weight: 700;
font-style: italic;
}


@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Light.woff') format('woff');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Light.woff') format('woff');
font-weight: 300;
font-style: italic;
}

@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-LightItalic.woff') format('woff');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Medium.woff') format('woff');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-MediumItalic.woff') format('woff');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Bold.woff') format('woff');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-BoldItalic.woff') format('woff');
font-weight: 700;
font-style: italic;
}

@font-face {
font-family: 'Icomoon';
src: url('../fonts/icomoon33.woff') format('woff');
font-weight: normal;
font-style: normal;
}

[class*="icon"],
*::before,
*::after,
.bx-controls-direction a {
font-family: 'icomoon' !important;
speak: none;
font-style: normal;
font-weight: normal !important;
font-variant: normal;
text-transform: none;
/*line-height: 1;*/
}


html {
height: 100%;
box-sizing: border-box;
}

*, *::before, *::after {
box-sizing: inherit;
}

:root {
--deep-blue: #002945;
--medium-blue: #355887;
--light-blue: #BFCFE6;
--light-grey: #f4f4f4;
--bright-red: #d80000;
--dark-red: #900;
--yellow: #ffcc00;
--imagebg: #dadada;
--charcoal: #444;



--thin-lemonade: #ffffe1;
--ice: #ebf4fa;
--bluegrey: #bdccdd;
--gold: #fcd600;
--orange: #ffb648;
--green: #2cad56;
--teal: #3d7883;
--metallic-lighter: #ededef;
--metallic-light: #e0e0e4;
--metallic-medium: #cbccd3;
--metallic-dark: #a6a8b4;
--metallic-darker: #797c8e;
--background: #f7f7f7;
--grey: #d5d5d2;
--dim: #a4a4a4;
--hardgrey: #c7c7c2;
--softgrey: #ccc;
--mediumgrey: #999;
--lead: #666;
--anthracite: #333;
--button: linear-gradient(0deg, rgba(135,139,154,1) 0%, rgba(157,160,172,1) 100%);
--button-rollover: linear-gradient(0deg, rgba(36,138,68,1) 0%, rgba(44,173,86,1) 100%);
--button-rollover-red: linear-gradient(0deg, rgba(161,24,31,1) 0%, rgba(202,23,32,1) 100%);

}

body {
min-height: 100vh;
margin: 0;
padding: 0;
font-family: 'Unna', serif;
font-size: 22px;
line-height: 1.2;
font-weight: 400;
color: #000;
hyphens: manual;
background-color: var(--deep-blue);
}

/*** main containers ***/

.wrapper {
max-width: 1920px;
margin: 0 auto;
min-height: 100vh;
display: grid;
}

.content {
display: grid;
grid-template-rows: auto 1fr auto;
}


header {
display: grid;
grid-template-columns: min-content 1fr max-content;
align-items: start;
padding: 40px;
color: #fff;
gap: 25px;
}
header a {
color: #fff;
text-decoration: none;
}
header a:hover,
header .current a {
color: var(--yellow);
}

.header-left {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
gap: 25px;

}


.header-left a {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
border-right: 1px solid var(--medium-blue);
}
.site_logo img {
width: 100px;
}
.site_title {
padding: 15px 25px 0 20px;
font-family: 'Cormorant';
font-size: 28px;
line-height: 1.1;
text-transform: uppercase;
}
.site_title span {
display: block;
}
#navmain,
.header-right {
padding-top: 20px;
}


.header-right {
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: flex-end;
gap: 30px;
}

a#searchswitch {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 38px;
font-size: 20px;
/*line-height: 38px;
text-align: center;*/
color: var(--deep-blue);
border-radius: 4px;
background-color: var(--light-blue);
}
a#searchswitch::before {
display: block;
content: "\f002";
}

a#searchswitch:hover {
background-color: var(--yellow);
}

.header-right .link {
font-size: 24px;
}
.header-right .link .icon {
font-size: 44px;
line-height: 1;
}

.header-right .link a {
display: flex;
flex-flow: row nowrap;
align-items: center;
gap: 10px;
color: var(--light-blue);
}
.header-right .link a:hover {
color: var(--yellow);
border-color: var(--yellow);
}

.header-right .link.uk {
display: none;
}
.header-right .link.uk a {
display: block;
font-size: 32px;
line-height: 1;
/*border: 1px solid var(--light-blue);*/
}





main {
position: relative;
padding: 60px 40px;
background-color: var(--light-grey);
}
.home main p,
.library_item {
font-weight: 300;
}




/** navigation **/

#navmain {
position: relative;
font-family: "Roboto";
font-size: 17px;
font-weight: 500;
}
#navmain a {
display: block;
border: none;
font-size: 16px;
}
#navmain a:hover {
color: var(--yellow);
}

a#navmainswitch {
height: 46px;
width: 270px;
margin-bottom: 20px;
line-height: 46px;
text-transform: uppercase;
font-size: 16px;
background-color: var(--medium-blue);
border-radius: 4px;
padding: 0 15px;
}
a#navmainswitch::after {
display: block;
float: right;
content: "\e953";
font-size: 24px;
}
a#navmainswitch.expand {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
a#navmainswitch.expand::after {
content: "\e95a";
float: right;
}
#contents {
display: none;
width: 270px;
position: absolute;
left: 0;
top: 60px;
background-color: var(--medium-blue);
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
box-shadow: 0 36px 36px -10px rgba(0,0,0,0.6);
z-index: 10;
}
#contents ul {
list-style: none;
padding: 0 15px 25px;
margin: 0;
border-top: none;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}

#contents li {
margin-top: 15px;
padding-top: 15px;
border-top: 1px dotted var(--light-blue);
}
#contents li:first-child {
margin-top: 10px;
}

#contents .current a {
text-indent: -18px;
margin-left: 18px;
text-indent: 0;
}

#contents .current a::before {
content: "\e90e";
display: inline-block;
width: 18px;
font-size: 14px;
margin-left: -18px;
}



/** end navigation **/




footer {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
gap: 40px;
padding: 60px 40px 80px;
font-family: "Roboto";
font-size: 15px;
line-height: 1.3;
color: #fff;
font-weight: 400;
}

footer .address {
line-height: 1.4;
}

footer .social .links {
text-align: center;
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: flex-start;
gap: 20px;
}
footer .social .label {
margin-bottom: 10px;
}
footer .social .label_mini {
display: block;
font-size: 12px;
font-weight: 700:
line-height: 1;
}

footer .social a.icon {
display: block;
font-size: 40px;
}


footer .support {
max-width: 370px;
display: flex;
flex-flow: row nowrap;
align-items: center;

}
footer .support img {
width: 100px;
margin-left: 10px;
}



footer span {
display: block;
}
footer a {
color: var(--light-blue);
text-decoration: none;
}
footer a:hover {
color: var(--yellow);
text-decoration: none;
}


/*** end main containers ***/


img {
display: block;
}

h1 {
font-weight: 500;
font-size: 38px;
margin: 30px 0;
line-height: normal;
}

.blogpage .article-body h1,
.main-body  h1.standard,
.blogpage h1.standard,
.repository .newsblock.section-title h1,
.vijesti .article-body h1 {
font-family: 'Unna', serif;
font-weight: 400;
color: #000;
padding: 0;
line-height: normal;
text-transform: none;
border: none;
}
.repository .newsblock.section-title h1 {
font-size: 38px;
}
.blogpage.about .article-body h1,
.documents .article-body h1  {
margin: 50px 0 40px;
}

.home .main-body h1,
.newsblock.section-title h1,
.search_results_page h1 {
display: block;
margin: 0 0 40px;
padding: 0 0 10px;
font: 700 normal 14px/normal "Roboto";
color: var(--deep-blue);
text-transform: uppercase;
border-bottom: 1px dotted var(--deep-blue);
}
.home .main-body h1 {
margin: 0 0 30px;
}



h2 {
font-weight: 500;
font-size: 28px;
margin: 40px 0 30px;
line-height: normal;
}

/*.article-body h2:nth-of-type(1) {
margin-top: 0;
}*/

h3 {
font-weight: 500;
font-size: 26px;
margin: 30px 0 20px;
line-height: normal;
}

.infoboxes {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
grid-template-rows: auto;
gap: 40px;
margin-bottom: 50px;
font-size: 18px;
font-weight: 300;
}

.infoboxes .item {
position: relative;
height: 100%;
display: flex;
flex-direction: column;
padding: 30px 30px 65px;
color: #fff;
background: var(--deep-blue) ;
}
.infoboxes h3 {
margin: 0 0 20px;
font-size: 24px;
font-weight: 500;
line-height: normal;
}

.infoboxes .item p {
margin: 0;
line-height: 1.3;
}
.infoboxes .item ul {
margin: 15px 0 0;
}

.infoboxes img {
width: 100%;
margin: 20px 0;
}
.infoboxes a {
text-decoration: none;
color: var(--light-blue);
}
.infoboxes a:hover {
color: var(--yellow);
}

.searchfield,
.not-found {
font: 400 normal 18px/normal "Roboto";
}



/*** Blog ***/

.home .main-body {
display: grid;
grid-template-columns: 4fr minmax(260px, 1fr);
grid-template-rows: auto;
gap: 40px;
/*align-items: stretch;*/
}

.newsblock, .side_column {
position: relative;
/*padding-bottom: 65px;*/
}
/*.blogpage .newsblock, .side_column {
padding-bottom: 0;
}*/
.repository .newsblock {
max-width: 980px;
margin: 0 auto;
}

.blog {
/*margin: 0 0 40px;*/
display: grid;
justify-content: center;
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
grid-template-rows: auto;
gap: 40px;
}

.blogpage .special {
max-width: 1426px;
display: grid;
grid-template-columns: 1fr 4fr;
grid-template-rows: auto;
gap: 30px;
flex-flow: row nowrap;
margin: 0 auto 60px;
padding: 30px;
color: #fff;
font-weight: 300;
background-color: var(--deep-blue);
}

.special h3 {
margin: 0 0 30px;
font-size: 30px;
color: var(--light-blue);
line-height: normal;
font-weight: 400;
}
.special .image_block img {
width: 100%;
}
.special a {
color: #fff;
}
.special a:hover {
color: var(--yellow);
}

.special p:last-child {
margin-bottom: 0;
}



.blogpage .newsblock {
max-width: 1426px;
margin: 0 auto;
}



.blog_item {
background-color: #fff;
}
.blog_item .inner {
height: 100%;
display: flex;
flex-direction: column;
}
.blog_image {
flex: 0;
background-color: var(--imagebg);
}
.blog_item img {
width: 100%;
height: 100%;
}
.blog_item .intro {
margin: 0;
font-weight: 300;
position: relative;
flex: 1;
padding: 30px 30px 65px;
}
.article_date,
.readmore a {
font-family: "Roboto";
font-size: 13px;
font-weight: 500;
line-height: 1;
}
.info_item .article_date {
display: inline-block;
padding: 4px 8px 5px;
background: var(--light-blue);
}

.blog_item .intro p {
margin-bottom: 0;
}

.blog_item .intro h3 {
margin: 10px 0 15px;
font-size: 30px;
line-height: normal;
font-weight: 400;
}
.blog_item h3 a,
.info_item h3 a {
color: #000;
text-decoration: none;
}
.blog_item h3 a:hover,
.info_item h3 a:hover {
color: var(--medium-blue);
}
.blog_item .readmore,
.infoboxes .item .readmore {
width: 100%;
position: absolute;
bottom:0;
left: 0;
}
.readmore a {
display: block;
padding: 20px 30px 30px;
font-weight: 700;
color: var(--medium-blue);
text-decoration: none;
text-transform: uppercase;
}
.readmore a::after {
content: "\e5c8";
display: block;
float: right;
font-size: 16px;
line-height: 13px;
}

.readmore a:hover {
color: var(--deep-blue);
}


.infoboxes .readmore a {
color: var(--light-blue);
}
.infoboxes .readmore a:hover {
color: var(--yellow);
}





/** About Blog **/

.about .blog_item {
color: #fff;
background-color: var(--deep-blue);
}
.about .blog_item .intro h3 a {
color: var(--light-blue);
}
.about .blog_item .intro h3 a:hover {
color: var(--yellow);
}
.about .readmore a {
color: var(--light-blue);
}
.about .readmore a:hover {
color: var(--yellow);
}



/** end About Blog **/






/** Info Blog **/

.single_column_blog {
display: grid;
grid-template-columns: 1fr;
gap: 40px 0;
}
.info_item {
padding-bottom: 25px;
border-bottom: 1px dotted #000;
}
/*.single_column_blog .info_item:last-child {
border: none;
}*/

.info_item h3 {
margin: 15px 0;
font-size: 22px;
font-weight: 500;
}

.info_item p {
margin: 0 0 15px;
}

.info_item .readmore a {
padding: 15px 0 5px;
}

.morenews {
/*position: absolute;
left: 0;
bottom: 0;*/
padding-top: 40px;
}
.morenews a {
font: 700 normal 15px/normal "Roboto";
color: var(--medium-blue);
text-transform: uppercase;
text-decoration: none;
}
.morenews a::after {
content: "\e5c8";
display: block;
float: left;
font-size: 22px;
margin-right: 5px;
}
.morenews a:hover {
color: var(--deep-blue);
}



/** end Info Blog **/


/** blog pagination **/

.pagination {
font-family: "Roboto", sans-serif;
font-size: 15px;
font-weight: 700;
margin: 50px 0 0;
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: center;
}
.searchres .pagination {
margin: 40px 0 0;
}
.documents .pagination,
.search_results_page .pagination {
justify-content: flex-start;
}

.pagination div {
flex: 0;
text-align: center;
margin: 10px;
}

.pagination div:first-child,
.pagination div:last-child {
display: none;
}


.pagination a {
display: block;
width: 34px;
height: 34px;
line-height: 34px;
text-align: center;
color: #000;
background-color: #fff;
border-radius: 17px;
text-decoration: none;
}
.pagination a:hover {
color: #fff;
background-color: var(--deep-blue);
text-decoration: none;
}
.pagination div.active a {
color: #fff;
background-color: var(--medium-blue);
}
.pagination div.disabled a {
color: #000;
background-color: #ccc;
}
.pagination div.disabled a:hover {
background-color: #ccc;
}

.pagination span {
display: block;
width: 34px;
height: 34px;
line-height: 34px;
text-align: center;
color: #000;
background-color: #fff;
border-radius: 17px;
}

.pagination span:hover {
color: #fff;
background-color: var(--deep-blue);
}
.pagination .disabled span,
.pagination .disabled span:hover {
color: #000;
background-color: #ccc;
}



.pagination span.prev::before,
.pagination span.next::before {
font-size: 20px;
line-height: 34px;
text-align: center;
}
.pagination span.prev::before {
content: "\e5c5";
}
.pagination span.next::before {
content: "\e5c8";
}

/** end blog pagination **/



/*** end Blog ***/


.documents .category-list {
max-width: 800px;
margin: 0 auto;
}



/*** Article ***/

.article_container {
max-width: 800px;
margin: 0 auto;
}
article {
line-height: 1.3;
}
.catname {
font: 700 normal 14px/normal "Roboto";
margin: 0 0 30px;
}

.catname a {
display: block;
padding: 0 0 10px;
color: var(--medium-blue);
text-transform: uppercase;
text-decoration: none;
border-bottom: 1px dotted var(--deep-blue);
}
.catname a:hover {
color: var(--deep-blue);
}

article .article_date span {
display: inline-block;
font-size: 14px;
padding: 6px 12px;
background: #fff;
}

.obavijesti article .article_date span {
padding: 6px 12px;
background: var(--light-blue);
}


.nodate article .article_date {
display: none;
}

.blogpage.about article .article_date {
display: none;
}

article a {
color: var(--medium-blue);
}
article a:hover {
color: var(--deep-blue);
}
article a.pdf-link {
text-decoration: none;
}
article a.pdf-link::before {
content: "\e93e";
vertical-align: middle;
font-size: 0.818em;
line-height: 1;
padding: 0 3px 6px 0;
}


.article_image {
margin: 0 0 40px;
background: #fff;
border: 16px solid #fff;
}
.article_image img,
.album img {
width: 100%;
height: 100%;
}

.album {
margin: 60px 0;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 2px;
}
article .album p {
position: relative;
margin: 0;
padding: 0;
min-height: 160px;
background: var(--charcoal);
}
article .album p::before {
content: "";
padding-top: 100%;
}
.album a.image-link {
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
.album a.image-link img {
width: 100%;
height: 100%;
object-fit: contain;
border: 10px solid transparent;
/*border: 10px solid transparent;*/
}
.image-paragraph {
margin: 30px 0;
background: #fff;
border: 16px solid #fff;
}
.image-paragraph img {
width: 100%;
}


article p,
article ul {
margin: 20px 0;
}


/** Pagenav **/

.pagenav {
display: flex;
flex-flow: row nowrap;
margin: 70px 0 0;
font-family: "Roboto";
font-size: 14px;
font-weight: 700;
line-height: 22px;
text-transform: uppercase;
padding-top: 15px;
border-top: 1px dotted #333;
}

.pagenav .prev,
.pagenav .next {
flex: 1 50%;
display: flex;
}

.pagenav .prev {
padding-right: 15px;
}

.pagenav .next {
justify-content: flex-end;
text-align: right;
padding-left: 15px;
}
.pagenav a {
color: var(--medium-blue);
text-decoration: none;
}
.pagenav a.inactive,
.pagenav a.inactive:hover {
color: #999;
cursor: default;
text-decoration: none;
}

.pagenav a:hover {
color: var(--deep-blue);
text-decoration: none;
}
.prev::before,
.next::after {
font-size: 22px;
}
.pagenav .prev::before {
content: "\e5c5";
padding-right: 6px;
}
.pagenav .next::after {
content: "\e5c8";
padding-left: 6px;
}

/** end Pagenav **/


/*** end Article ***/






.sliderwrap {
background: var(--light-blue);
margin-top: 60px;
padding: 30px 40px 40px;
}
.sliderwrap h1{
margin: 0 0 20px;
font-family: "Roboto";
font-size: 22px;
font-weight: 700;
color: var(--deep-blue);
}

ul.slider {
margin: 0;
}

/*.parallel_docs {
display: flex;
flex-flow: row wrap;
margin: 30px 0 0;
gap: 40px;
}
.parallel_docs span {
display: block;
margin-top: 10px;
font-family: "Roboto";
font-size: 15px;
font-weight: 500;
text-align: center;
}*/


.repository .article_container {
max-width: 980px;
}
.newsblock.section-title h1,
.documents .category-list h1,
.nodate article h1 {
margin-top: 0;
padding-bottom: 10px !important;
border-bottom: 1px dotted #333 !important;
}
.repository .blog {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
grid-template-rows: auto;
gap: 40px;
margin: 40px 0;
place-items: center center;
}
.repository .blog figure {
margin: 0;
}
.repository .blog .blog_item {
background-color: transparent;
}
.repository .blog .blog_item figcaption {
margin-top: 15px;
font-family: "Roboto";
font-size: 15px;
font-weight: 500;
text-align: center;
background-color: transparent;
}
.repository .blog .blog_item .intro {
margin: 0;
padding: 0;
}
.repository .blog img {
width: 100%;
}

.figure-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
grid-template-rows: auto;
gap: 40px;
margin: 40px 0;
place-items: center center;
}
.figure-grid figure {
margin: 0;
}
.figure-grid figcaption {
margin-top: 10px;
font-family: "Roboto";
font-size: 15px;
font-weight: 500;
text-align: center;
}
.figure-grid img {
width: 100%;
}

/***search ***/

.modal {
  position: relative;
  width: 100%;
  max-width: 400px;
  margin: -30vh auto 0;
  padding: 30px;
  font-family: "Roboto";
  background: #f4f4f4;
  border-radius: 6px;
}
.modal h3 {
font-size: 18px;
font-weight: 400;
text-align: center;
color: #000;
margin: 0 auto 25px;
}
.modal h3 span {
display: inline-block;
padding: 0 20px 5px;
border-bottom: 1px solid #333;
}
.inputfield {
width: 100%;
padding: 0 10px;
background-color: transparent;
border: none;
font: 400 16px/52px 'Roboto', sans-serif;
text-align: center;
color: #666;
background: #fff;
border-radius: 4px;
}
.inputfield:focus {
outline: none;
color: #000;
}
.inputfield:focus::placeholder {
  color: transparent;
}
.searchbutton {
display: block;
width: 80px;
margin: 20px auto 0;
font: 500 16px/40px "Roboto", sans-serif;
border: none;
text-align: center;
color: #fff;
border-radius: 4px;
cursor: pointer;
outline: none;
background-color: #2E3138;
}
.searchbox:focus .searchbutton {
color: #000;
}
.searchbutton.popup {
font: 400 20px/40px "icomoon", sans-serif;
}
.searchbutton:hover,
.searchbutton:active {
background: #c31e3c;
}
#advancedSearch {
display: none;
}

.new-search {
margin-top: 60px;
padding: 10px 0 0;
font: 600 16px/22px "Roboto", sans-serif;
border-top: 1px dotted var(--deep-blue);
}
.new-search a {
text-decoration: none;
text-transform: uppercase;
}
.new-search a::before {
display: inline-block;
vertical-align: baseline;
content: "\f002";
padding-right: 5px;
color: #000;
}




/***end search ***/


.video {
/*max-width: 630px;*/
text-align: center;
margin: 30px 0;
background-color: #fff;
border: 16px solid #fff;
}
.video iframe, .video object {
display: block;
margin: auto;
}
.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.video .videoWrapper iframe,
.video .videoWrapper object {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.note {
font-size: 0.818em;
padding: 10px;
background: #fff;
}





/*** to top ***/
.fixed {
display: none;
height: 40px;
position: fixed;
bottom: 2px;
right: 2px;
z-index: 100;
}

.fixed a {
display: block;
width: 40px;
height: 40px;
line-height: 40px;
font-size: 20px;
text-align: center;
color: #000;
text-decoration: none;
box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.6);
background-color: var(--yellow);
}
.fixed a:hover,
/*.fixed a:focus,*/
.fixed a:active {
color: #fff;
background-color: var(--bright-red);
}
/*** end to top ***/




/**** bx slider ****/

.bx-wrapper {
position: relative;
padding: 0;
*zoom: 1;
-ms-touch-action: pan-y;
touch-action: pan-y;
line-height: 1;
}
.bx-wrapper img {
width: 100%;
display: block;
}
.bxslider {
margin: 0;
padding: 0;
}
ul.slider {
list-style: none;
}
ul.slider li {
max-width: calc((100vw - 160px) / 6);
}
.bx-viewport {
-webkit-transform: translatez(0);
}
.bx-wrapper .bx-loading {
min-height: 50px;
background: url('../img/bx_loader.gif') center center no-repeat transparent;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
}
.bx-wrapper .bx-controls-direction a {
display: block;
width: 32px;
font-size: 32px;
line-height: 32px;
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
z-index: 9999;
text-align: center;
text-decoration: none;
color: var(--deep-blue);
}
.bx-wrapper .bx-controls-direction a:first-child {
left: -34px;
}
.bx-wrapper .bx-controls-direction a:last-child {
right: -34px;
}
.bx-wrapper .bx-controls-direction a:hover {
color: var(--medium-blue);
}
.bx-wrapper .bx-controls-direction a.disabled {
display: none;
}
.bx-wrapper .bx-caption {
position: absolute;
bottom: 0;
left: 0;
background: #002945;
background: rgba(0, 41, 69, 0.8);
width: 100%;
font-family: "Roboto";
font-size: 13px;
font-weight: 500;
color: #fff;
padding: 10px;
}

/**** end bx slider ****/




@media screen and (max-width: 1600px) {

.infoboxes,
.home .main-body,
.blog  {
gap: 20px;
}

}

@media screen and (max-width: 1440px) {

ul.slider li {
max-width: calc((100vw - 160px) / 5);
}

}



@media screen and (max-width: 1420px) {

.infoboxes  {
grid-template-columns: 1fr 1fr;
}

}


@media screen and (max-width: 1280px) {

ul.slider li {
max-width: calc((100vw - 160px) / 4);
}

.blogpage .special {
grid-template-columns: 1.5fr 4fr;

}



@media screen and (max-width: 1024px) {

header {
padding: 30px;
}
main {
padding: 50px 30px;
}
/*article h1 {
margin: 40px 0 30px;
}*/

footer {
padding: 50px 30px 60px;
}

.infoboxes .item:nth-last-of-type(2),
.infoboxes .item:nth-last-of-type(1) {
display: none;
}
.home .main-body {
display: block;
}

.morenews {
position: static;
padding: 30px 0 0;
}

.single_column_blog {
justify-content: center;
grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
grid-template-rows: auto;
gap: 20px;
}
.info_item {
position: relative;
padding-bottom: 48px;
border-bottom: 1px dotted #000;
}
.info_item .readmore {
position: absolute;
width: 100%;
bottom: 15px;
left: 0
}
.info_item .readmore a {
padding: 0;
}

ul.slider li {
max-width: calc((100vw - 140px) / 3);
}

.side_column {
margin-top: 50px;
}

.blogpage .special {
grid-template-columns: 1.35fr 2fr;


}



@media screen and (max-width: 980px) {

.header-right {
gap: 20px;
}
.header-right .link a .label {
display: none;
}
main {
padding: 40px 30px 35px;
}

ul.slider li {
max-width: calc((100vw - 120px) / 3);
}







}

@media screen and (max-width: 959px) {

footer {
flex-flow: column;
gap: 30px;
}
footer span {
text-align: center;
}

footer .note {
text-align: center;
flex-flow: column;
gap: 10px;
}

}



@media screen and (max-width: 859px) {

.header-left {
gap: 20px;
}
.site_logo img {
width: 80px;
}
.site_title {
padding: 5px 20px 0 15px;
}
#navmain,
.header-right {
padding-top: 10px;
}
#contents {
top: 50px;
}

.infoboxes  {
display: block;
}
.infoboxes .item {
margin-bottom: 20px;
}

}




@media screen and (max-width: 799px) {

header {
grid-template-columns: 1fr 1fr 60px;
grid-template-rows: auto;
grid-template-areas:
"logo logo links"
"navi navi links";
gap: 20px;
}
.site_title {
padding: 15px 20px 0 15px;
}
.site_title span {
display: inline;
}
.site_title span:nth-of-type(1) {
display: block;
}

.header-right .link.uk {
display: block;
}

a#searchswitch {
width: 44px;
height: 32px;
font-size: 18px;
/*line-height: 32px;*/
}

a#overview {
display: none;
}
.header-left {
grid-area: logo;
}
#navmain {
padding-top: 0;
grid-area: navi;
}
.header-right {
flex-flow: column;
/*width: 50px;*/
height: 100%;
justify-content: space-between;
align-items: center;
padding: 0 0 0 10px;
gap: 0;
grid-area: links;
border-left: 1px solid var(--medium-blue);
}

.header-right .link.uk a {
font-size: 26px;
}
.header-right .link .icon {
font-size: 36px;
}
a#searchswitch {
width: 36px;
height: 32px;
font-size: 18px;
/*line-height: 32px;*/
}


a#navmainswitch {
width: auto;
margin: 0;
}
#contents {
width: 100%;
top: 45px;
}
.header-left a {
border: none;
}

.blog_item .intro {
position: relative;
flex: 1;
padding: 30px 30px 65px;
}

.blog_item .intro,
.infoboxes .item {
padding: 30px;
}

.info_item {
padding-bottom: 20px;
}
.blog_item .readmore,
.info_item .readmore,
.infoboxes .item .readmore {
position: static;
}
.readmore a {
padding: 20px 0 0;
}
.info_item .readmore a {
padding: 15px 0 0;
}
.infoboxes .item .readmore a {
padding: 20px 0 0;
}

.pagination {
margin: 40px 0 0;
}

}

@media screen and (max-width: 768px) {

.blogpage .special {
display: block;
}
.special h3 {
margin: 40px 0 30px;
}

}


@media screen and (max-width: 719px) {


body {
font-size: 20px;
}
h1,
.repository .newsblock.section-title h1 {
font-size: 36px;
}

/*.blog_item .intro h3 {
font-size: 28px;
}*/
h2 {
font-size: 26px;
}
h3 {
font-size: 24px;
}

footer {
font-size: 14px;
}

}

@media screen and (max-width: 600px) {

.blogpage.about .article-body h1,
.documents .article-body h1 {
margin: 30px 0;
}

.catname {
font-size: 14px;
}

.sliderwrap h1{
font-size: 20px;
}

.sliderwrap {
margin: 40px -30px 0;
}
ul.slider li {
max-width: calc((100vw - 80px) / 3);
}

}


@media screen and (max-width: 599px) {

.site_logo img {
width: 65px;
}

.site_title {
padding: 12px 0 0 15px;
font-size: 23px;
}
.header-right {
justify-content: space-between;
}

.sliderwrap {
margin: 40px -30px -35px;
}



}



@media screen and (max-width: 480px) {

header {
padding: 20px;
grid-template-columns: 1fr;
grid-template-rows: auto;
grid-template-areas:
"logo"
"navi"
"links";
gap: 10px;
padding-bottom: 0;
}

.header-left {
flex-flow: column;
align-items: center;
}
.header-left a {
flex-flow: column;
align-items: center;
gap: 10px;
}
.site_logo img {
width: 60px;
}

.site_title {
text-align: center;
padding: 0;
}

#navmain {
padding: 10px 0;
}

.header-right {
flex-flow: row;
justify-content: space-around;
align-items: center;
padding: 10px 20vw;
gap: 20px;
grid-area: links;
border: none /*1px solid var(--medium-blue)*/;
margin: 0 -20px;
background: var(--light-blue);
z-index: 1;
}
.header-right .link.uk a {
font-size: 26px;
}
.header-right .link a,
.header-right .link.uk a {
color: var(--deep-blue);
}
.header-right .link a:hover,
.header-right .link.uk a:hover {
color: var(--bright-red);
}

a#searchswitch {
width: 42px;
color: var(--light-blue);
background-color: var(--deep-blue);
}
a#searchswitch:hover {
background-color: var(--bright-red);
}


/*h1 {
font-size: 34px;
}*/


.article_image {
margin: 0 0 30px;
}



main {
padding: 30px 20px;
}
.blog {
grid-template-columns: 1fr;
gap: 30px 0;
}
.blog_item .intro h3 {
font-size: 28px;
}
.blog_item .intro,
.infoboxes .item {
padding: 20px 20px 30px;
}
.newsblock, .side_column {
padding-bottom: 20px;
}
.single_column_blog {
grid-template-columns: 1fr;
gap: 40px 0;
}

.sliderwrap {
margin: 0 -20px -30px;
}

ul.slider li {
max-width: calc((100vw - 80px) / 2);
}

}



@media screen and (max-width: 479px) {

h1,
.blogpage .article-body h1,
.repository .newsblock.section-title h1  {
font-size: 28px;
font-weight: 500;
}


.blog_item .intro h3 {
font-size: 26px;
}



}




@media screen and (max-width: 360px) {

/*.site_title {
font-size: 21px;
}*/

.sliderwrap {
width: 360px;
margin: 0 -20px -30px;
}
ul.slider li {
max-width: none;
}
.sliderwrap h1{
text-align: center;
}

.bx-wrapper .bx-caption {
text-align: center;
}


}