/*
	Theme Name: Prazno
	Theme URI: 
	Author: Prazno
	Author URI: 
	Description: Prazno
	Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@font-face {
    font-family: 'dokbold';
    src: url('dok-bold.eot');
    src: url('dok-bold.eot?#iefix') format('embedded-opentype'),
         url('dok-bold.woff2') format('woff2'),
         url('dok-bold.woff') format('woff'),
         url('dok-bold.ttf') format('truetype'),
         url('dok-bold.svg#dokbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

:root{
	font-size: 125% !important;
	--txt: #690067;
	--txt2: #790076;
	--bck: FloralWhite;
	--pro: 1.25rem;
	--pro-po: .75rem;
}

html{margin:0;padding:0;}
body{
	margin:0;padding:0;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-variation-settings: "slnt" 0;
	font-size: 1rem;
	line-height: 1.25rem;
	color: var(--txt);
	background-color: var(--bck);
}
*, *:before, *:after {box-sizing:  border-box !important;}

em, i{
	font-style: italic;
	font-variation-settings: "slnt" -10;
}

p{
	margin: 0;
	float: left; position: relative;
	width: 100%;
}
p+p{
	padding-top: var(--pro);
}

@supports (font-variation-settings: "slnt" -10) {
	em, i {
		font-family: 'Inter';
		font-variation-settings: "slnt" -10;
		font-style: normal;
	}
}

/* NOT ADMIN TEMP -------------------------------------------- */

h1.no{
	width: 100%;
	float: left; position: relative;
	text-align: center;
	font-size: 4rem;
	line-height: calc(var(--pro) * 4);
	height: 100vh;
	margin: 0;
	padding: calc(50vh - (var(--pro) * 6)) 0;
}
h1.no::before{
	content: '\25CF';
	font-size: 7.5rem;
	line-height: calc(var(--pro) * 4);
	display: block;
	text-align: left;
	font-family: "Inter", sans-serif;
	clear: right;
	padding-left: var(--pro);
}
h1.no::after{
	content: '\25A0';
	font-size: 6rem;
	line-height: calc(var(--pro) * 4);
	display: inline;
	display: block;
	text-align: right;
	font-family: "Inter", sans-serif;
	clear: left;
	padding-right: var(--pro);
}

/* BASIC -------------------------------------------- */

header, main, footer, section{
	width: 100%;
	float: left; position: relative;
	padding: var(--pro-po);
}

main{
	min-height: 80vh;
	padding: var(--pro-po) var(--pro-po) calc(var(--pro) * 4) var(--pro-po);
}

.home main{
	padding-left: 0;
	padding-right: 0;
}


/*header, main, footer{
	box-shadow: 0 var(--pro-po) var(--pro-po) calc(var(--pro-po) * (-1)) var(--txt2);
}*/

a, a:link, a:visited{
	color: var(--txt);
	text-decoration: none;
	opacity: 1;
	transition: opacity .5s ease-in-out;
}
a:hover, a:active{
	color: var(--txt);
	text-decoration: none;
	opacity: .5;
	transition: opacity .25s ease-in-out;
}

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

.ikns{font-family: 'dokbold';}

/* HEADER -------------------------------------------- */

header h1, header p.logo{
	font-weight: 700;
	font-size: 2rem;
	line-height: calc(var(--pro) * 2);
	margin: 0;
	padding: 0 var(--pro-po) !important;
	width: 50%;
	float: left; position: relative;
	padding: var(--pro-po);
}

nav{
	width: 50%;
	float: left; position: relative;
	margin: 0;
	padding: calc(var(--pro) * .775) var(--pro-po) var(--pro-po);
	font-weight: 700;
}

nav ul{
	width: 100%;
	float: left; position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}
nav ul li{
	width: calc(100% / 7 * 2);
	float: left; position: relative;
	margin: 0;
	padding: 0;
}
nav ul li:last-child{
	width: calc(100% / 7);
	float: left; position: relative;
	margin: 0;
	padding: 0;
}
nav ul li ul{
	width: calc(100% + var(--pro));
	padding: 0 var(--pro-po);
	position: absolute;
	top: calc(var(--pro) * 2);
	left: calc(-1 * var(--pro-po));
	height: 0;
	z-index: 9999;
	overflow: hidden;
	transition: height .5s ease-in-out;
	background: var(--bck);
}
nav ul li:hover ul{
	height: calc(var(--pro) * 6);
	transition: height .25s ease-in-out;
}
nav ul li ul li{
	width: 100%;
	float: left; position: relative;
}
nav ul li ul li:last-child{
	width: 100%;
	float: left; position: relative;
	padding-top: var(--pro);
}
nav ul li ul li+li{
	padding-top: var(--pro);
}

nav ul a{
	width: 100%;
	float: left;
	position: relative;
}

.lang-item a{text-align:right;}

/* INTRO -------------------------------------------- */

.intro{
	padding-bottom: calc(var(--pro) * 2);
	padding-top: calc(var(--pro) * 2);
}

.intro p{
	font-weight: 500;
	font-size: 2rem;
	line-height: 1.25em;
	margin: 0;
	padding: 0 var(--pro-po);
}
.intro p:first-child::before{
	content: '\25CF \00A0';
	font-family: 'dokbold';
	font-size: 1em;
	line-height: 0;
	display: inline;
}
.intro p:last-child::after{
	content: ' \25A0';
	font-family: 'dokbold';
	font-size: 1em;
	line-height: 0;
	display: inline;
}

/* LISTA SECTION -------------------------------------------- */

.listing{
	padding: var(--pro-po) calc(var(--pro-po) * 4);
}

.testimonials{
	padding: var(--pro) calc(var(--pro-po) * 2);
}
/* ARTICLES -------------------------------------------- */

article{
	width: calc(100% / 3);
	float: left; position: relative;
	padding: var(--pro-po) calc(var(--pro-po) * 4);
	text-align: center;
}
article:nth-of-type(3n+1){
	clear: left;
}

article h2{
	font-weight: 700;
	font-size: 1.5rem;
	line-height: calc(var(--pro) * 1.5);
	margin: 0;
	padding: 0;
}

article .img{
	width: 100%;
	padding-top: 100%;
	overflow: hidden;
	float: left; position: relative;
	background: transparent;
	border-radius: 50%;
	transition: border-radius .5s ease-in-out, background .5s ease-in-out;
}
article:first-child .img{
	border-radius: 50%;
}
article:hover .img{
	background: var(--txt2);
	border-radius: 0;
	transition: border-radius .25s ease-in-out, background .25s ease-in-out;
}
article img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0; padding: 0;
}

.testimonials article{
	width: calc(100% / 3);
	float: left; position: relative;
	padding: calc(var(--pro) * 2) calc(var(--pro-po) * 2);
	border-top: .1rem solid var(--txt);
}
.testimonials article p{
	text-align: left;
	padding-left: var(--pro);
}
.testimonials article p+p{
	text-indent: calc(var(--pro) * 2);
	padding-top: 0;
}
.testimonials article p.osoba{
	text-align: left;
	font-size: .75rem;
	line-height: calc(var(--pro) / 4 * 3);
	font-weight: 600;
	padding-left: var(--pro);
	padding-top: var(--pro);
	text-indent: 0;
}
.testimonials article p.osoba::before{
	content: '\2014';
	position: absolute;
	left: calc(var(--pro) * (-1));
	top: var(--pro);
}
.testimonials article p:first-child::before{
	content: '\25CF';
	font-size: 2em;
	line-height: 0;
	position: absolute;
	left: calc(var(--pro) * (-1));
	top: calc(var(--pro) * .375);
	vertical-align: calc(var(--pro-po) * (-.5));
}
	


/* INTRO -------------------------------------------- */

.single h1, .page h1, .home .hed h2{
	margin: 0;
	font-size: 3rem;
	line-height: calc(var(--pro) * 3);
	padding: var(--pro) var(--pro-po) calc(var(--pro) * 3);
	float: left; position: relative;
	width: 100%;
	clear: both;
}

.hed{
	float: left; position: relative;
	width: calc(100% / 3);
	padding-bottom: calc(var(--pro) * 2);
}
.home .hed h2{
	padding-bottom: 0;
}
.home .hed{
	padding-bottom: 0;
}

.single h2, .page h2{
	margin: 0;
	font-size: 2rem;
	line-height: calc(var(--pro) * 2);
	padding: calc(var(--pro) * 2) var(--pro-po);
	float: left; position: relative;
	width: calc(100% / 3);
	clear: both;
}

.txt{
	float: left; position: relative;
	width: calc(100% / 3);
	padding: calc(var(--pro) * 2.5) var(--pro)var(--pro) var(--pro-po);
}

.yt + .txt{
	padding-top: var(--pro-po)
}

.home .txt{
	padding-top: var(--pro-po);
}

.single p, .page p{
	margin: 0;
	padding: 0;
	float: left; position: relative;
	width: 100%;
}
.single p+p, .page p+p{
	padding-top: var(--pro);
}

.hed p{
	padding: 0 var(--pro-po);
	width: 50%;
}
.hed p+p{
	padding-top: 0;
}
.hed p:nth-of-type(3), .hed p:nth-of-type(3){
	width: 100%;
	font-weight: 500;
	font-size: 1.5rem;
	line-height: 1.25em;
	padding-top: var(--pro);
	text-align: left;
}

.single iframe, .page iframe{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}
.single p:has(iframe), .page p:has(iframe){
	padding-top: 100%;
}


.yt{
	float: left; position: relative;
	width: calc(100% / 3 * 2);
	padding: var(--pro-po);
	padding-top: calc(100% / 3 - (var(--pro) * 0.75));
}
.single .yt iframe, .page .yt iframe{
	position: absolute;
	top: var(--pro);
	left: var(--pro-po);
	height: calc(100% - var(--pro));
	width: calc(100% - (var(--pro) * 1.25));
}


.slika{
	float: left; position: relative;
	width: calc(100% / 3 * 2);
	padding: var(--pro) var(--pro-po);
}
.page .slika{
	float: left; position: relative;
	width: calc(100% / 3);
	padding: var(--pro) var(--pro-po);
}
.page .slika img{
	width: 100%;
}

.single img, .page img{
	width: 50%;
	padding-right: var(--pro-po);
	height: auto;
	float: left; position: relative;
	padding-top: var(--pro);
}
.single img:nth-of-type(1), .single img:nth-of-type(2){
	padding-top: 0;
}
.single img:nth-of-type(even){
	padding-right: 0;
	padding-left: var(--pro-po);
}


/* FOOTER -------------------------------------------- */

footer{
	background: var(--txt2);
	color: var(--bck);
	min-height: calc(var(--pro) * 10);
}
footer a, footer a:link, footer a:visited{
	color: var(--bck);
}
footer a:hover, footer a:active{
	color: var(--bck);
}

footer nav, footer p{
	float: right;
}

footer nav ul li ul{
	background: var(--txt2);
}

footer p, .single footer p, .page footer p{
	width: 50%;
	padding: calc(var(--pro) * .775) var(--pro-po) var(--pro-po);
	font-weight: 300;
	font-size: .75rem;
	opacity: .5;
}
footer nav{
	font-weight: 500;
}

nav.s{
	width: 100%;
	padding: calc(var(--pro) * .775) var(--pro-po) var(--pro-po) calc(50% + var(--pro-po));
	float: left;
	position: relative;
}
nav.s ul li, nav.s ul li:last-child{
	width: calc(100% / 7 * 2);
}

::selection, .footer p::selection{
	color:var(--bck) !important;
	background:var(--txt2) !important;
}
::-moz-selection, .footer p::-moz-selection{
	color:DarkBlue !important;
	background:White !important;
}


/* formulari -------------------------------------------- */

.wpcf7, .wpcf7 label, .wpcf7 input, .wpcf7 textarea, .wpcf7-not-valid-tip{
	width: 100%;
	float: left; position: relative;
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: var(--pro);
	color: var(--txt);
}

div.wpcf7{
	padding: calc(var(--pro) * 2) 0 0;
}

.wpcf7 label{
	font-size: .75rem;
	line-height: calc(var(--pro) * .75);
	text-transform: uppercase;
	letter-spacing: .06em;
	font-weight: 600;
	padding-bottom: calc(var(--pro) * .25);
}

.wpcf7 br{
	width: 100%;
	float: left; position: relative;
	height: calc(var(--pro) * .25);
	content: " ";
}

.wpcf7-not-valid-tip{
	font-size: .75rem !important;
	line-height: calc(var(--pro) * .75);
	font-weight: 500 !important;
	text-transform: none;
	letter-spacing: .02em;
	padding-top: calc(var(--pro) * .25);
	padding-bottom: calc(var(--pro) * .25);
}

.wpcf7 input, .wpcf7 textarea{
	outline: none;
	border: var(--txt) solid .1rem;
	border-radius: calc(var(--pro) * .5);
	background: White;
	padding: calc(var(--pro) * .25);
	margin: 0;
	padding-bottom: calc(var(--pro) * .25)
}

.wpcf7 input[type=submit]{
	color: var(--bck);
	background: var(--txt2);
	cursor: pointer;
	transition: color .5s ease-in-out, background .5s ease-in-out;
}
.wpcf7 input[type=submit]:hover, .wpcf7 input[type=submit]:active{
	color: var(--txt);
	background: var(--bck);
	cursor: pointer;
	transition: color .25s ease-in-out, background .25s ease-in-out;
}

.wpcf7 form .wpcf7-response-output{
	border: none;
}

	
header nav i.fa{
	display: none;
}
	
.grecaptcha-badge{display: none !important;}
	

/* RESP -------------------------------------------- */


@media only screen and (min-width: 1921px) {
	header, main, footer{
		width: 1920px;
	    margin-left: calc(50% - 960px);
		margin-right: calc(50% - 960px);
	}
}

@media only screen and (max-width: 1580px) {
	article{
	    padding: var(--pro-po) calc(var(--pro-po) * 2);
	}
}

@media only screen and (max-width: 1440px) {
	.txt, .single .slika, .page .slika, .single .video, .page .video, .hed, .yt{
		width: 50%;
	}
	.page .slika{
		margin-left: 50%;
	}
	.listing {
		padding: var(--pro-po) calc(var(--pro-po) * 2);
	}
	article{
	    padding: var(--pro-po) calc(var(--pro-po) * 4);
	}
		
	.slika{
		float: left; position: relative;
		width: calc(100% / 3 * 2);
		padding: var(--pro) var(--pro-po);
	}

	.single img, .page img{
		width: 100%;
		padding-right: 0;
		height: auto;
		float: left; position: relative;
		padding-top: var(--pro);
	}
	.single img:nth-of-type(1){
		padding-top: 0;
	}
	.single img:nth-of-type(2){
		padding-top: var(--pro);
	}
	.single img:nth-of-type(even){
		padding-right: 0;
		padding-left: 0;
	}
	.single img+img, .page img+img{
		padding-top: var(--pro);
	}
}

@media only screen and (max-width: 1340px) {
	article{
	    padding: var(--pro-po) calc(var(--pro-po) * 2);
	}
	.testimonials article p{
		text-align: left;
	}
	.testimonials article p+p{
		text-indent: 0;
		padding-top: var(--pro-po);
	}
}

@media only screen and (max-width: 1040px) {
	.testimonials article{
		width: 100%;
	}
	.testimonials article p{
		text-align: justify;
	}
	.testimonials article p+p{
		text-indent: calc(var(--pro) * 2);
		padding-top: 0;
	}
}

@media only screen and (max-width: 940px) {
	.txt, .single .slika, .page .slika, .single .video, .page .video, .hed, .yt{
		width: 75%;
	}
	.page .slika{
		margin-left: 0;
	}
	.yt{
		padding-top: calc(100% / 2 - (var(--pro) * 0.75));
		margin-bottom: var(--pro);
    }
	article{
		width: calc(100% / 2);
	}
	.home article:last-child {
		margin-left: 25%;
		margin-right: 25%;
	}
	article:nth-of-type(3n+1){
		clear: none;
	}
	article:nth-of-type(2n+1){
		clear: left;
	}
	.archive .ajax-load-more-wrap article:nth-of-type(2n+1){
		clear: none;
	}
	.archive .ajax-load-more-wrap article:nth-of-type(3n+1){
		clear: left;
	}
	.archive .ajax-load-more-wrap article:first-child{
		clear: none;
	}
	header h1, header nav, footer nav{
		width: 100%;
	}
	nav.s{
		padding: calc(var(--pro) * .775) var(--pro-po) var(--pro-po);
	}
	footer p{
		width: 100%;
		padding: calc(var(--pro) * 2) var(--pro-po);
	}
	header nav{
		padding-top: calc(var(--pro) * 1.775) ;
	}
	.testimonials article:last-child{
		margin-left: 0;
		margin-right: 0;
	}
	.intro p {
		font-weight: 500;
		font-size: 1.5rem;
		line-height: 1.25em;
	}
	.home .hed{
		width: 100%;
		padding-left: calc(var(--pro) * 2);
		padding-right: calc(var(--pro) * 2);
	}
	.home .hed h2{
		font-size: 2em;
		line-height: 1.25em;
		padding: 0;
	}
	.home .txt{
		width: 100%;
		padding-left: calc(var(--pro) * 2);
		padding-right: calc(var(--pro) * 2);
		padding-bottom: 0;
	}
	
}

@media only screen and (max-width: 740px) {
	.listing {
		padding: var(--pro-po) var(--pro-po);
	}
}


@media only screen and (max-width: 640px) {
	.txt, .single .slika, .page .slika, .single .video, .page .video, .hed, .yt{
		width: 100%;
	}
	.yt{
		padding-top: calc(100% - (var(--pro) * 0.75));
    }
	.hed{
		padding-bottom: var(--pro);
	}
	.single h1, .page h1{
		padding-bottom: calc(var(--pro) * 2);
	}
	article{
		width: 100%;
	    padding: var(--pro-po) calc(var(--pro-po)* 4);
	}
	article:last-child, .home article:last-child {
		margin-left: 0;
		margin-right: 0;
	}
	.intro {
		padding-bottom: var(--pro-po);
	}
	.testimonials article p{
		text-align: left;
	}
}

@media only screen and (max-width: 500px) {
	.testimonials article p{
		text-align: left;
	}
	.testimonials article p+p{
		text-indent: 0;
		padding-top: var(--pro-po);
	}
	
	header{
		padding-bottom: 0;
	}
	
	header nav{
		padding-bottom: 0;
	}
	header nav.m{
		height: calc(var(--pro) * 2.75);
		transition: height .5s ease-in-out;
		overflow: hidden;
	}
	header nav ul.menu{
		padding-top: calc(var(--pro) * 1.25);
	}
	header nav i.fa{
		line-height: var(--pro);
		font-size: 1.75rem;
		display: block;
		float: left;
		position: relative;
		width: 100%;
		padding-bottom: 0;
		cursor: pointer;
	}
	header nav.slow{
		height: calc(var(--pro) * 11);
		overflow: hidden;
		transition: height .25s ease-in-out;
	}
	header nav li, footer nav li{
		width: 100%;
	}
	header nav li+li, footer nav li+li{
		width: 100%;
		padding-top: var(--pro);
	}
	header nav li:last-child, footer nav li:last-child{
		width: 100%;
		padding-top: var(--pro);
	}
	header ul li ul, footer nav ul li ul{
		left: 50%;
		top: 0;
		width: 50%;
	}
	header ul li:hover ul, footer nav ul li:hover ul{
		height: calc(var(--pro) * 5);
	}
	
	.lang-item a{text-align:left;}
	
	header ul li ul, footer nav ul li ul{
		height: auto;
	}
	.intro p {
		font-weight: 500;
		font-size: 1rem;
		line-height: var(--pro);
	}
	.single h1, .page h1{
		font-weight: 700;
		font-size: 2rem;
		line-height: calc(var(--pro)* 2);
	}
	
	nav.s ul li, nav.s ul li:last-child{
		width: 50%;
		padding-top: 0;
	}
	nav.s ul li:nth-of-type(3n){
		padding-top: var(--pro);
	}
}