#branding-wrapper {
	background: var(--header-background-color);
	border: solid;
	border-image: url('../images/rub.svg') 33.8% 0 / 0 0 12px / 0px 0 11px round;
	overflow-x: hidden;
}

.site-branding {
	padding: 5.44rem 11.9%;
	align-items: flex-start;
	max-width: 1680px;
	margin: auto;
	position: relative;
	border-image: none;
	display: block;
	font-size: 1.2rem;
}

#header-main-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

#language-and-icons {
	padding: 0.938rem 5.3%;
}

.site-branding p {
	color: #3d3d3d;
	line-height: 1.25;
	text-align: center;
}


#HAZUlogo {
	display: block;
	position: absolute;
	width: 9.52%;
	height: auto;
	top:30px;
	left:6.31%;
	min-width: 90px;
}

#HAZUlogo img {
	width: 100%;
}

#Strossmayer-naslovna {
	width: 47.34%;
	height: auto;
	flex: none;
 }

 #Strossmayer-naslovna img {
	 max-width: 100%;
	 max-height: none;
 }

#header-vertical-column-flex {
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-between;
	align-items: center;
	margin-top: 3%;
	width: 45%;
}

#header-vertical-column-flex :not(:last-child) {
	margin-bottom: 1.3em;
}

#sjat-ce-ti-ime {
	margin: 0 4.55%;
}

.header-divider {
	margin: 0 auto;
	width: 77.5%;
}

#site-navigation {
	position: absolute;
	right: 5%;
	top: 6.69%;
}

#primary {
	padding: 4.38rem 11.90%;
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	max-width: 1680px;
	margin: 0 auto;
}

@media (min-width: 1680px) {
	#primary {
		padding: 4.38rem 200px;
	}
}

.group-wrapper {
	flex: 1 1 40%;
	text-decoration: none;
}

a.group-wrapper,
a.group-wrapper:link,
#primary a.group-wrapper:visited {
	color:var(--text-color);
}

#primary a.group-wrapper:hover {
	color: var(--pronounced-color);
}

.group-wrapper:nth-of-type(odd) {
	margin-right: 5%;
}

.group-wrapper img {
	width: 100%;
}


.front-box figcaption {
	text-align: center;
	margin-top: 2rem;
	font: 1.5rem / 1.3 Spectral, serif;
}

/* 1.5rem(24px) @ 23.4rem(374.4px) increasing to 2.2rem(35.2px) @ 105rem(1680px) */
/* Ems strongly recommended on media queries! */
@media (min-width: 23.4em) {
	.front-box figcaption {
	  font-size: calc(1.5rem + ((1vw - 0.23399999999999999rem) * 0.8578));
	  /* Where: 0.8578 = 100 * font-size_difference / viewport_width_difference */

	  /* Safari resize fix */
	  min-height: 0vw;
	}
 }
 /* Prevent scaling beyond this breakpoint */
 @media (min-width: 105em) {
	.front-box figcaption {
	  font-size: 2.2rem;
	}
 }


/* 1.2rem(19.2px) @ 48rem(768px) increasing to 2.2rem(35.2px) @ 105rem(1680px) */
/* Ems strongly recommended on media queries! */
@media (min-width: 48em) {
	.site-branding p {
		font-size: calc(1.2rem + ((1vw - 0.48rem) * 1.7544));
		/* Where: 1.7544 = 100 * font-size_difference / viewport_width_difference */

		/* Safari resize fix */
		min-height: 0vw;
	}
}
/* Prevent scaling beyond this breakpoint */
@media (min-width: 105em) {
	.site-branding p {
		font-size: 2.2rem;
	}
}


#content {
	padding-bottom: 0;
}

/* footer */

.entry-footer {
	background: var(--header-background-color);
	border: solid;
	border-image: url('../images/rub.svg') 33.8% 0 / 12px 0 0 / 11px 0 0 round;
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	align-items: center;
	padding: 2em 11.90% 1.5em;
}


a.footer-icon {
	display: flex;
	flex-flow: column;
	align-items: center;
	text-decoration: none;
	transition: filter 0.5s;
	color: var(--text-color);
	width: 24%;
}

.footer-icon:hover {
	filter: brightness(0) saturate(100%) invert(14%) sepia(56%) saturate(3644%) hue-rotate(342deg) brightness(93%) contrast(98%);
}

.footer-icon img {
	height: auto;
	width: 5rem;
}

/* 5rem(80px) @ 23.4rem(374.4px) increasing to 6.25rem(100px) @ 105rem(1680px) */
/* Ems strongly recommended on media queries! */
@media (min-width: 23.4em) {
	.footer-icon img {
	  width: calc(5rem + ((1vw - 0.23399999999999999rem) * 1.5319));
	  /* Where: 1.5319 = 100 * width_difference / viewport_width_difference */

	  /* Safari resize fix */
	  min-height: 0vw;
	}
 }
 /* Prevent scaling beyond this breakpoint */
 @media (min-width: 105em) {
	.footer-icon img {
	  width: 6.25rem;
	}
 }




.footer-icon div {
	text-transform: uppercase;
	font-size: 1rem;
	margin-top: 1em;
	text-align: center;
}

/* 1rem(16px) @ 23.4rem(374.4px) increasing to 1.3rem(20.8px) @ 105rem(1680px) */
/* Ems strongly recommended on media queries! */
@media (min-width: 23.4em) {
	.footer-icon div {
	  font-size: calc(1rem + ((1vw - 0.23399999999999999rem) * 0.3676));
	  /* Where: 0.3676 = 100 * font-size_difference / viewport_width_difference */

	  /* Safari resize fix */
	  min-height: 0vw;
	}
 }
 /* Prevent scaling beyond this breakpoint */
 @media (min-width: 105em) {
	.footer-icon div {
	  font-size: 1.3rem;
	}
 }



@media (min-width:1680px) {
	.entry-footer {
		padding-left: calc((100% - 1280px) / 2);
		padding-right: calc((100% - 1280px) / 2);
	}
}

@media (max-width: 90em) {
	.site-branding {
		padding-top: 6.04%;
		padding-bottom: 6.04%;
	}
}

@media (max-width: 47.999em) {
	.group-wrapper:nth-of-type(odd) {
		margin-right: 0;
	}
	.group-wrapper {
		flex-basis: auto;
		width: 100%;
	}
	a.footer-icon {
		width: 49.5%;
		margin-bottom: 2em;
	}
	.entry-footer {
		margin-bottom: -2em;
	}
	#header-vertical-column-flex,
	#Strossmayer-naslovna {
		width: 100%;
	}
	.site-branding {
		padding: 4.06rem calc(2.8125rem + ((1vw - 3.75px) * 21.6837)) 6%;
		/* Note: The calc base value (2.8125rem) MUST be stated in REM to maintain accessibility */
		/* Where: 21.6837 = 100 * padding_difference / viewport_width_difference */

		/* Safari resize fix */
		min-height: 0vw;
	}

	#HAZUlogo {
		top: 20px;
	}

	#site-navigation {
		top: 20px;
	}

}

	/* 45px @ 375px increasing to 130px @ 768px */
@media (max-width: 48em) {



	#header-main-wrapper {
		flex-wrap: wrap;
	}


	.entry-footer {
		padding-left: 5%;
		padding-right: 5%;
	}

 }