/*!
Theme Name: viviana Plus
Theme URI: http://underscores.me/
Author: Tina Šimurina
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: viviana-plus
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

viviana Plus is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

/* fontovi za web */
/* Lora za naslove */
/* Open Sans za sve ostalo */

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root
{
	--naslov-font-boja: #293039;
	--tekst-font-boja: #51565d;
	/* --pozadina-tamna: #d4e2d2; */
	--pozadina-tamna: #fdfdf9;
}



h1, h2, h3, h4, h5, h6
{
	font-family: "Lora", serif;
	font-weight: 700;
	font-style: normal;
	color: var(--naslov-font-boja); 
}

h2, h3, h4, h5, h6
{
	margin-top: 30px;
}

h1
{
	font-size: 36px;
	line-height: 54px;
}

h2
{
	font-size: 32px;
	line-height: 38px;
}

h3
{
	font-size: 26px;
	line-height: 32px;
	font-weight: 500;
}

p, body, time
{
	font-family: "Open Sans", sans-serif;
	font-weight: 400;
	font-style: normal;	
	font-size: 18px;
	line-height: 28px;
	color: var(--tekst-font-boja);	
}

.container-fluid
{
	margin: 0;
	padding: 0;
}

.site-header
{
	background-color: var(--pozadina-tamna);
}


/* nabrajanje u člancima */
article ul li
{
	list-style: none;
	margin-top: 10px;
}

article ul li:before
{
    content: "\f058";
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    margin-left: -25px;
    margin-right: 10px;
    color: var(--pozadina-tamna);
    font-size: 18px;
}

/* glavna navigacija */
/* bijeli font */
nav a, nav a:hover, nav a:active, nav a:visited, nav a:link, p.navbar, .navbar svg
{
	text-decoration: none;
	color: var(--tekst-font-boja);
	text-transform: uppercase;
}

/* bijela boja hamburger izbornika */
button.navbar-toggler, span.navbar-toggler.icon, button.navbar-toggler:hover
{
	text-decoration: none;
	color: var(--tekst-font-boja);
}

/* 15px odmaka s lijeve strane između svake stavke navigacije */
ul.navbar-nav > li
{
	margin-left: 15px;
}


/* Animirana donja linija ispod navigacije (samo na desktopu) */
@media (min-width: 992px) {

    .navbar-nav .nav-link {
        position: relative;
        display: inline-block;
        padding-bottom: 4px;
    }

    .navbar-nav .nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 0%;
        height: 2px;
        background-color:var(--tekst-font-boja); /* boja linije = boji fonta */
        transition: width 0.3s ease-in-out;
    }

    .navbar-nav .nav-link:hover::after,
    .navbar-nav .nav-link:focus::after {
        width: 100%;
    }

    /* opcionalno: aktivna stavka */
    .navbar-nav .current-menu-item > .nav-link::after {
        width: 100%;
    }
}


/**************************************************+/


/* naslovnica */
blockquote {
  margin: 0 auto;
  padding: 0;
  position: relative;
  width: 80%;
  min-width: 400px;
  max-width: 820px;
  font-size: 1.25vw;
  line-height: 1.4;
  text-rendering: optimizeLegibility;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-osx-fon-smoothing: grayscale;
}

blockquote p:first-of-type:before {
  content: '\201c';
  position: absolute;
  left: -.5em;
}

blockquote p:last-of-type:after {
  content: '\201d';
  position: absolute;
}

blockquote footer {
  position: relative;
}

blockquote footer:before {
  content: '–';
  position: absolute;
  left: -.6em;
}

@media screen and (max-width: 1600px) {
  blockquote {
    font-size: 2vw;
  }
}

@media all and (max-width: 1200px) {
  blockquote {
    font-size: 2.5vw;
  }
}

@media all and (max-width: 600px) {
  blockquote {
    font-size: 18px;
  }
  blockquote {
    width: 100%;
    min-width: 100%;
  }
}


/**************************************************+/

/* blog objava */

/* klasa koja sadrži podatke o autoru, datumu objave i ikone za share na društvenim mrežama */
.autor-objave 
{
	margin: 15px 0 15px 0;
}

.autor-objave p
{
	font-size: 1rem;
	font-weight: 300;
	display: inline-block;
	margin: 0px;
	color: var(--tekst-font-boja);
}

.autor-objave time
{
	font-size: 1rem;
	font-weight: 300;
	color: var(--tekst-font-boja);
}

time::before
{
	font-family: "FontAwesome";
	content: "\f073";
}

/* dijeljenje blog objave na društvenim mrežama */ 
.podijeli-clanak-na-drustvenim-mrezama
{
    width: 100%;
    border-top: 2px solid #d4e2d2;
    margin-top: 30px;
    padding-top: 10px;
}

.podijeli-clanak-na-drustvenim-mrezama p
{
	padding-bottom: 5px;
	margin-bottom: 0px;
}

.ikone-drustvenih-mreza
{
	display: block;
}

.ikone-drustvenih-mreza a.social-btn
{
	text-decoration: none;
	color: #51565d;
	font-size: 1.8rem;
}

.ikone-drustvenih-mreza a.social-btn:hover
{
	color: #d4e2d2;
}

i.fa-facebook-f, i.fa-linkedin-in, i.fa-twitter
{
	transition: all 300ms linear;
}

i.fa-facebook-f:hover, i.fa-linkedin-in:hover, i.fa-twitter:hover
{
	transform: scale(1.1);
}


/* uvodni odlomak, tj. excerpt */ 
.uvodni-odlomak
{
	margin: 0 0 35px 0;
}

.uvodni-odlomak p
{
	font-style: italic;
	font-family: "Lora", serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 28px;
}

/* glavni vizual blog objave */
.blog-key-visual
{
	padding: 0;
	margin: 0 0 35px 0;
	overflow: hidden;
	border-radius: 24px;
}

.blog-key-visual img
{
	width: 100%;
	max-height: 450px;
	display: block;
	object-fit: cover;
}

.glavni-sadrzaj
{
	margin: 0 0 60px 0;
}

.tekst-objave
{
	margin: 0 20px 0 20px;
	padding: 0 20px;
}


/* o autorici, ispod blog objave */
.blog-autor
{
	display: flex;
	padding: 60px;
	margin-top: 60px;
	border-radius: 24px;
	background-color: #f4fcfa;
	box-sizing: border-box;
}

.blog-autor .fotka-autora
{
	width: 120px;
	height: 120px;
	display: block;
	flex: 0 0 120px;
	overflow: hidden;
	margin: 0 40px 0 0;
	border-radius: 100%;
	color: #51565d;
	box-sizing: border-box;
}

@media screen and (max-width: 991px)
{
	.blog-autor .fotka-autora
	{
		margin-bottom: 20px;
	}
}

.blog-autor .fotka-autora img
{
	display: inline;
	width: 100%;
	height: auto;
	max-width: 100%;
}

.blog-autor .o-autoru
{
	display: block;
	box-sizing: border-box;
}

.blog-autor .ime-autora
{
	 font-size: 24px;
	 line-height: 30px;
	 margin-bottom: 8px;
	 color: #293039;
}

.blog-autor h4.ime-autora
{
	display: block;
	margin: 0 1.33em 0 0;
	font-weight: 800;
}

.blog-autor .kratki-opis
{
	display: block;
	font-size: 18px;
	font-weight: 700;
	line-height: 28px;
	margin-bottom: 20px;
	color: #94a299;
	margin-bottom: 20px;
}

.blog-autor .o-autoru p
{
	color: #51565d;
	display: block;
	font-size: 18px;
	line-height: 28px;
	font-weight: 400;
	font-style: normal;
}
/* ********************************* */

/* povezani članci ispod blog objave */
.povezani-clanci
{
	color: #51565d;
	margin-bottom: 35px;
}

h2.povezani-clanci-podnozje::after
{
	display: block;
    content: "";
    width: 250px;
    height: 2px;
    background: #d4e2d2;
    border-radius: 20px;
    margin-top: 5px;
    margin-bottom: 15px;
}

.povezani-clanci a, .povezani-clanci a:link, .povezani-clanci a:hover, .povezani-clanci a:visited, .povezani-clanci a:active
{
	text-decoration: none;
	color: #51565d;	
}

.col-md-3.povezani-clanak
{
	margin: 0px 10px;
	padding: 0px 10px;
}

.povezani-clanak img
{
	border-radius: 10px;
	margin: 0 0 15px 0;
	overflow: hidden;
	width: 100%;
	height: 225px;
	object-fit: cover;
}

.povezani-clanak h3
{
	color: #51565d;
	font-size: 28px;
	line-height: 32px;
	margin: 0 0 15px 0;
}

p.autor-povezani-clanci
{
	margin: 0 0 15px 0;
	font-size: 0.9em;
	font-weight: 700;
}

.povezani-clanak p
{
	margin: 0 0 30px 0;
}

.btn, .btn:link, .btn:active, .btn:visited, .btn:hover
{
	padding: 5px 35px;
	font-size: 1rem;
	line-height: 1.5;
	vertical-align: middle;
	cursor: pointer;
	border-radius: 5px;
	border: 1px solid #51565d;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
	margin: 0 0 10px 0;
}

.btn:hover
{
	background-color: #f4fcfa;
}

.btn::after
{
	font-family: "FontAwesome";
	content: "\f08e";
	display: inline-block;
	padding-left: 5px;
}

/* ********************************* */


/* uređenje stranice kategorije koja prikazuje sve objave */
.content-archive img
{
	width: 100%;
	height: 300px;
	object-fit: cover;
	margin-bottom: 20px;
	border-radius: 20px;
}

.content-archive h2
{
	color: #222;
	font-size: 24px;
	line-height: 30px;
}

.content-archive p
{	
	color: #222;
	font-size: 20px;
	line-height: 24px;
}

.content-archive btn
{
	background-color: #000;
	border-color: #000;
	color: #fff;
	padding: 10px 30px;
}
/* ********************************* */


/* uređenje stranica */
/* vrh stranica - isti za sve: h1 i breadcrumbs */

.site_header > .page_banner
{
	margin-top: 118px;
}

.page_banner
{
	overflow: hidden;
	padding: 55px 0 62px;
	background-color: #f4fcfa;
}

.decoration_wrapper
{
	z-index: 1;
	position: relative;
	display: block;
}

.vrh-stranice
{
	padding: 0 15px;
	
}

.stupac-unutar-vrha
{
	padding: 15px;
	flex: 0 0 auto;
}

.unutar-vrha-stranice
{
	margin: -15px;
	display: flex;
	flex-wrap: wrap;
}

.page_title
{
	font-size: 54px;
	font-weight: 800;
	line-height: 60px;
}


[class*=unordered_list]
{
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style-type: none;
}

.breadcrumb_nav > li:not(:last-child)
{
	position: relative;
	padding-right: 36px;
}

.breadcrumb_nav > li
{
	font-weight: 600;
}

li
{
	display: list-item;
	text-align: match-parent;
}

.breadcrumb_nav > li:not(:last-child):after
{
	top: 2px;
	right: 13px;
	font-size: 14px;
	content: "\f105";
	position: absolute;
	font-family: "FontAwesome";
}

i.fa-regular.fa-house
{
	font-weight: 600;
	text-decoration: none;
	color: #94a299;
}

.page_banner.decoration_item.shape_leaf_1
{
	left: 0;
}

.page_banner.decoration_item
{
	top: 50%;
	transform: translateY(-50%);
}

.decoration_wrapper.decoration_item
{
	z-index: -1;
	position: absolute;
}

.shape_leaf_1 img
{
	height: auto;
	max-width: 100%;
}

div.decoration_item.shape_leaf_1
{
	display: block;
}

.page_banner .decoration_item.shape_leaf_2
{
	right: 0;
}

.page_banner .decoration_item
{
	top: 50%;
	transform: translateY(-50%);
}

.decoration_wrapper .decoration_item
{
	z-index: -1;
	position: absolute;
	display: block;
}

div.decoration_item.shape_leaf_2 img
{
	height: auto;
	max-width: 100%;
	vertical-align: middle;
}

/* ******************************************** */

/* sadržaj stranice */
article.sadrzaj-stranice
{
	margin: 35px 0 35px 0;
}


article.sadrzaj-stranice p
{
	padding: 0 30px;
}

article.sadrzaj-stranice ul
{
	padding: 0 30px;
}

article.sadrzaj-stranice > ul.wp-block-list
{
    margin-left: 40px;
}

article.sadrzaj-stranice > div.wp-block-image
{
	margin: 30px 0;
	padding: 0;
}

article.sadrzaj-stranice figure
{
	margin: 30px 0;
	padding:0;
}

article.sadrzaj-stranice figure img
{
	border-radius: 24px;
	width: 100%;
    height: 450px;
    display: block;
    object-fit: cover;
}

/* uređenje kontakt obrasca na dnu stranice */
.konzultacije
{
	padding: 0px 0px 35px 0;
}

.sadrzaj
{
	padding: 0px 15px;
}

.konzultacije_obrazac
{
	overflow: hidden;
	padding: 120px 35px;
	background-color: #f4fcfa;
	border-top-left-radius: 75px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 75px;
    border-bottom-left-radius: 0px
}

@media screen and (max-width: 991px)
{
    .konzultacije_obrazac
    {
        padding: 80px 60px;
        border-radius: 30px;
    }
}

.konzultacije_obrazac.decoration_wrapper
{
	z-index: 1;
	position: relative;
}

.konzultacije_obrazac .section_heading 
{
	margin-bottom: 30px;
}

.section_heading .section_heading_text 
{
	font-size: 42px;
	font-weight: 800;
	line-height: 50px;
	margin-bottom: 15px;
}

h2.section_heading
{
	display: block;
	margin-block-start: 0.83em;
	margin-block-end: 0.83em;
	margin-inline-start: 0px;
}

.btn_wrap
{
	padding: 50px 0px;
}


.btn.narucite-se
{
	padding: 10px 40px;
	overflow: hidden;
	font-weight: 400;
	color: #293039;
	display: inline-flex;
	background-color: #d4e2d2;
	background-attachment: scroll;
	border: 1px solid #d4e2d2;
	font-size: 1.125rem;
	letter-spacing: 0.2px;
	box-shadow: rgba(148, 162, 153, 0.08) 0px 10px 40px 0px;
}

.btn.narucite-se::after
{
	font-family: "FontAwesome";
	content: "\f08e";
	display: inline-block;
	padding-left: 15px;
}

.btn.btn_text
{
	position: relative;
	display: inline-block;
	padding: 12px 0px;
}

.btn.narucite-se:hover, .btn.narucite-se:active, .btn.narucite-se:visited, .btn.narucite-se:link
{
	background-color: #d4e2d2;
	color: #293039;
}

.decoration_wrapper .decoration_item {
	z-index: -1;
	position: absolute;
}

.konzultacije_obrazac .shape_leaf_1
{
	top: -110px;
	right: -200px;
	max-width: 380px;
}

.konzultacije_obrazac .shape_leaf_2 {
	left: -130px;
	bottom: -94px;
	max-width: 380px;
}

.konzultacije_obrazac img
{
	height: auto;
	max-width: 100%;
}

.form-control
{
	display: block;
	width: 100%;
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	background-clip: padding-box;
	background-color: #fff;
	border: 1px solid #c9ced3;
	appearance: none;
	border-radius: 24px;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.form-group input.form-control, .form-group select.form-select
{
	height: 54px;
}

.form-group .form-control, .form-group .form-select
{
	padding: 0 20px;
	font-size: 16px;
	border-radius: 24px;
	caret-color: #c9ced3;
	background-color: #fff;
	line-height: 28px;
	border: 1px solid #c9ced3;
}

.form-group label
{
	display: block;
	line-height: 1;
	font-size: 16px;
	font-weight: 600;
	padding: 0 0 10px 20px;
}

.form-group
{
	padding: 15px;
}


/* **************************************** */


/* uređenje podnožja */
.pozadina-podnozja-boja
{
	background-color: #b6c0bb;
}

.autor-podnozje
{
	margin-top: 15px;
	font-size: 1.25rem;
	margin-bottom: 15px;
}

p.autor-podnozje, address
{
	color: #fff;
}

a.drustvene-mreze-podnozje > svg
{
	text-decoration: none;
	margin-left: 10px;
	margin-right: 10px;
}

footer a, footer a:hover, footer a:active, footer a:visited, footer a:link
{
	text-decoration: none;
	color: #fff;
}

footer h3
{
	color: #fff;
	margin-top: 0;
}

footer i.fa-solid.fa-envelope, footer i.fa-solid.fa-phone
{
	color: #fff;
}

.pravni-detalji
{
	background-color: var(--pozadina-tamna);
}

p.pravni-dokumenti-detalji
{
	color: #51565d;
}


/* nabrajanje u podnožju - 3. navigacija */
footer ul li
{
	list-style: none;
	margin: 10px 0 0 0;
}

.menu-korisne-informacija-container ul
{
	padding: 0;
}

/* ********************************* */

/* gumb za slanje na vrh */
.fa-angles-up:before {
    content: "\f102";
}

#scrollUp
{
	opacity: 0;
	display: none;
	position: fixed;
    z-index: 2147483647;
    background: #f4fcfa;
    border: 1px solid #f4fcfa;
    border-radius: 5px;
    bottom: 18px;
    font-size: 14px;
    padding: 10px;
    right: 31px;
    text-align: center;
    color: #000;
    box-sizing: border-box;
	text-decoration: none;
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease; /* Tranzicije za sve 3 */
    transform: translateY(20px); /* Gumb je inicijalno pomaknut prema dolje */
}


#scrollUp.show
{
    display: block; /* Prikazivanje kada je aktiviran */
    opacity: 1;
    visibility: visible;
    transform: translateY(0); /* Pomicanje gumba prema gore (s početnog 20px prema dolje) */
}


#scrollUp a, #scrollUp a:link, #scrollUp a:hover, #scrollUp a:visited, #scrollUp a:active
{
	transition: all .2s ease-out 0s;
	text-decoration: none;
}

/* ********************** */

/* sidebar */
@media screen and (max-width: 991px)
{
	.sidebar
	{
		display: none;
	}
}

.sidebar-o-meni
{
	margin-bottom: 35px;
}

.qode-boxed-sidebar
{
	background-color: #d4e2d2;
	text-align: center;
	padding: 50px 47px 60px;
}

.qode-boxed-sidebar img
{
	max-width: 100%;
	height: auto;
	image-rendering: optimizeQuality;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.o-meni-profilna
{
	width: 160px;
	aspect-ratio: auto 160 / 160;
	border-radius: 50%;
}

.qode-boxed-sidebar h5
{
	margin: 24px 0 13px;
	color: #51565d;
}

.qode-boxed-sidebar h6
{
	margin: 14px 0 13px;
	color: #51565d;
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
}

.povezani-clanak-sidebar
{
	display: flex;
	margin-top: 10px;
}

.naslov-clanka-za-sidebar, .slikica-thumbnail
{
	display: block;
}

.attachment-custom-related-articles-small
{
	margin-right: 15px;
	border-radius: 10px;
}

.povezani-clanak-sidebar h3
{
	font-size: 1.1rem;
	font-weight: 400;
	margin-top: 0px;
}

.povezani-clanak-sidebar a, .povezani-clanak-sidebar a:link, .povezani-clanak-sidebar a:hover, .povezani-clanak-sidebar a:active, .povezani-clanak-sidebar a:visited
{
	text-decoration: none;
	font-family: "Lora", serif;
	color: #293039;
}

h2.najnoviji-clanci-sidebar::after
{
	display: block;
    content: "";
    width: 150px;
    height: 2px;
    background: #d4e2d2;
    border-radius: 20px;
    margin-top: 5px;
    margin-bottom: 15px;
}


/* stranica: kontakt */

/* google maps karta */
.kontakt-podaci
{
	margin: 50px 0 35px 0;
}

.karta
{
	margin: 0 0 -10px 0;
	padding: 0;
}

/* obrazac */
.form-group textarea.form-control {
    min-height: 190px;
    padding: 15px 20px 20px;
}

/* lijevi dio s brojevima telefona, adresom i radnim vremenom */
.kutija-za-kontakt-podatke
{
	padding: 15px;
}


@media (min-width: 991px)
{
    .kutija-za-kontakt-podatke
    {
        flex: 0 0 auto;
        /*width: 25%;*/
    }
}

.contact_info_box
{
    padding: 40px;
    overflow: hidden;
    word-break: break-all;
    border-radius: 24px;
    background-color: #f4fcfa;
}

.contact_info_box .item_icon
{
    font-size: 46px;
    margin-bottom: 38px;
    color: #d4e2d2;
}


.info_text a, .info_text a:link, .info_text a:hover, .info_text a:active, .info_text a:visited
{
	text-decoration: none;
	color: #293039;
}





















