/**
 * ViewSource CMS4 App
 *
 * This part of the source code is protected by copyright and belongs to the project ViewSource CMS4. Use, modification and distribution
 * are permitted only in accordance with the terms approved by the owner. Any unauthorized copying, sale or distribution of the code is
 * strictly prohibited.
 *
 * @package   ViewSourceCMS4App\css\
 * @copyright Copyright (c) 2002-2026 ViewSource - All Rights Reserved
 * @author    ViewSource - Marko Jevtić <office@viewsource.biz>
 * @license   Proprietary - copying prohibited without written permission from the author
 * @link      https://www.viewsource.biz/
 */

@font-face { font-display: swap; font-family: 'Source Sans 3'; font-style: normal; font-weight: 200; src: url('/include/fonts/source-sans-3-v19-cyrillic_cyrillic-ext_latin_latin-ext-200.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Source Sans 3'; font-style: normal; font-weight: 300; src: url('/include/fonts/source-sans-3-v19-cyrillic_cyrillic-ext_latin_latin-ext-300.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Source Sans 3'; font-style: normal; font-weight: 400; src: url('/include/fonts/source-sans-3-v19-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Source Sans 3'; font-style: normal; font-weight: 500; src: url('/include/fonts/source-sans-3-v19-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2') format('woff2'); }
@font-face { font-display: swap; font-family: 'Source Sans 3'; font-style: normal; font-weight: 600; src: url('/include/fonts/source-sans-3-v19-cyrillic_cyrillic-ext_latin_latin-ext-600.woff2') format('woff2'); }

:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
    --bs-body-font-family: 'Source Sans 3', Arial, sans-serif;
    --bs-body-font-size: 1.25rem;
    --bs-body-font-weight: 300;
    --bs-body-line-height: 1.42857;
    --bs-body-bg: #fff;
    --bs-primary: #000;
    --bs-primary-rgb: 0, 0, 0;
}
[data-bs-theme=dark] { --bs-body-bg: #131313; --bs-primary: #b4b4b4; --bs-primary-rgb: 180, 180, 180; }

.container { --bs-gutter-x: 30px; max-width: none; }
@media (min-width: 768px) { .container { max-width: 750px; } }
@media (min-width: 992px) { .container { max-width: 970px; } }
@media (min-width: 1200px) { .container { max-width: 1170px; } }

html:root { scroll-behavior: auto; }
a { color: #333; text-decoration: none; }
a:hover { color: #ffb700; }
p { margin-bottom: 20px; }
main { padding-top: 80px; }
main:has([data-sn-hero]) { padding-top: 0; }
@media (max-width: 991.98px) { main { padding-top: 70px; } }

h1, .sn-title { font-size: 58px; font-weight: 200; text-align: center; margin: 10px 0 30px; line-height: 1.1; }
.btn-primary { --bs-btn-color: #fff; --bs-btn-bg: #000; --bs-btn-border-color: #000; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #333; --bs-btn-hover-border-color: #333; --bs-btn-active-color: #fff; --bs-btn-active-bg: #333; --bs-btn-active-border-color: #333; border-radius: 0; }

.sn-intro { position: fixed; inset: 0; z-index: 9999; background: #fff; transition: opacity .3s; animation: sn-intro-off 1ms 8s forwards; }
.sn-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: opacity .4s; }
.sn-wipe { position: absolute; top: -1px; left: -1px; width: 102%; height: 102%; pointer-events: none; }
@keyframes sn-intro-off { to { visibility: hidden; } }
@media (scripting: none) { .sn-intro { display: none; } }

.sn-navbar { background: #000; padding: 0; transition: opacity .4s; }
.sn-navbar .navbar-brand { margin: 0; padding: 15px 0; }
.sn-navbar .navbar-brand img { display: block; max-height: 50px; width: auto; }
.sn-navbar .navbar-nav .nav-link { position: relative; padding: 5px; margin: 0 15px; color: #fff; font-size: 20px; font-weight: 500; line-height: 20px; transition: color .3s; }
.sn-navbar .navbar-nav .nav-item:first-child .nav-link { margin-left: 0; }
.sn-navbar .navbar-nav .nav-item:last-child .nav-link { margin-right: 0; padding-right: 0; }
.sn-navbar .nav-link::before, .sn-navbar .nav-link::after { content: '|'; position: absolute; top: 4px; opacity: 0; transition: transform .3s, opacity .2s; }
.sn-navbar .nav-link::before { transform: translateX(20px); }
.sn-navbar .nav-link::after { transform: translateX(-20px); }
.sn-navbar .nav-link:hover::before { opacity: 1; transform: translateX(-10px); }
.sn-navbar .nav-link:hover::after { opacity: 1; transform: translateX(5px); }
.sn-navbar .navbar-toggler { border: 1px solid #fff; border-radius: 0; padding: 8px 10px; }
.sn-navbar .navbar-toggler:focus { box-shadow: none; }
.sn-navbar .navbar-toggler span { display: block; width: 22px; height: 2px; background: #fff; }
.sn-navbar .navbar-toggler span + span { margin-top: 4px; }
@media (scripting: enabled) {
    body:has([data-sn-hero]) [data-sn-nav]:not(.sn-nav-on) .sn-navbar:not(:focus-within) { opacity: 0; pointer-events: none; }
}
@media (max-width: 1199.98px) { .sn-navbar .navbar-nav .nav-link { font-size: 18px; } }
@media (max-width: 991.98px) {
    .sn-navbar .navbar-brand { padding: 10px 0; }
    .sn-navbar .navbar-collapse { padding-bottom: 20px; margin: 0 -15px; }
    .sn-navbar .navbar-nav .nav-item { margin-bottom: 5px; }
    .sn-navbar .navbar-nav .nav-link, .sn-navbar .navbar-nav .nav-item:first-child .nav-link { font-size: 15px; padding: 10px 0; margin: 0 15px; }
    .sn-navbar .nav-link::before, .sn-navbar .nav-link::after { top: 8px; }
}

.sn-hero { height: 100vh; overflow: hidden; background: #fff; }
.sn-hero-in { position: relative; height: 100%; transition: all 500ms ease-out; }
.sn-hero-in.sn-shrunk { transform: scale(.8); }
.sn-hero .vscms-banner-zone, .sn-hero .vscms-banner, .sn-hero picture { display: block; height: 100%; }
.sn-hero picture img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.sn-arrow { position: absolute; left: 50%; bottom: 65px; margin-left: -30px; animation: sn-pulse 2s linear infinite; }
.sn-arrow img { display: block; }
@keyframes sn-pulse { 0%, 100% { bottom: 65px; } 10%, 90% { bottom: 55px; } 25%, 50%, 75% { bottom: 50px; } }

@media (min-width: 767px) and (scripting: enabled) {
    .sn-rev { opacity: 0; transform: translateY(var(--sn-d, 80px)); transition: opacity var(--sn-t, 600ms) cubic-bezier(.36, 0, .64, 1), transform var(--sn-t, 600ms) cubic-bezier(.36, 0, .64, 1); }
    .sn-rev.sn-in { opacity: 1; transform: none; }
    .sn-tim .col:nth-child(1) .sn-rev { --sn-d: 200px; --sn-t: 700ms; }
    .sn-tim .col:nth-child(2) .sn-rev { --sn-d: 150px; --sn-t: 700ms; }
    .sn-tim .col:nth-child(3) .sn-rev { --sn-d: 100px; --sn-t: 700ms; }
    .sn-day.sn-rev { --sn-d: 50px; }
}

.sn-section { padding: 80px 0 160px; text-align: center; }
#Radovi { padding: 120px 0 160px; }
.sn-lead { font-size: 21px; line-height: 34px; margin: 20px 0 50px; }
.sn-lead p:last-child { margin-bottom: 0; }
.sn-tim img { max-width: 100%; }

.sn-ratio { --bs-aspect-ratio: 83.3333%; }
#Radovi .swiper:not(.swiper-initialized) .swiper-slide { width: calc((100% - 90px) / 4); margin-right: 30px; }
@media (max-width: 999.98px) { #Radovi .swiper:not(.swiper-initialized) .swiper-slide { width: calc((100% - 60px) / 3); } }
@media (max-width: 599.98px) { #Radovi .swiper:not(.swiper-initialized) .swiper-slide { width: calc((100% - 30px) / 2); } }
@media (max-width: 449.98px) { #Radovi .swiper:not(.swiper-initialized) .swiper-slide { width: 100%; margin-right: 0; } }
#Radovi .swiper-slide a { display: block; position: relative; }
#Radovi .swiper-slide a::after { content: ''; position: absolute; inset: 0; background: rgba(255, 255, 255, .2); opacity: 0; }
#Radovi .swiper-slide a:hover::after { opacity: 1; }
#Radovi .swiper-button-prev, #Radovi .swiper-button-next { top: 0; bottom: 0; height: 100%; margin: 0; width: calc(25% - 22.5px); background: rgba(0, 0, 0, .5) center center no-repeat; }
#Radovi .swiper-button-prev { left: 0; background-image: url('/design/nesic/arr-left.png'); }
#Radovi .swiper-button-next { right: 0; background-image: url('/design/nesic/arr-right.png'); }
#Radovi .swiper-button-prev::after, #Radovi .swiper-button-next::after, #Radovi .swiper-button-prev svg, #Radovi .swiper-button-next svg { display: none; }
#Radovi .swiper-button-disabled { display: none; }
#Radovi .swiper-button-prev:hover, #Radovi .swiper-button-next:hover { background-color: rgba(70, 70, 70, .5); }
@media (max-width: 999.98px) { #Radovi .swiper-button-prev, #Radovi .swiper-button-next { width: calc(33.333% - 20px); } }
@media (max-width: 599.98px) { #Radovi .swiper-button-prev, #Radovi .swiper-button-next { width: calc(50% - 15px); } }
@media (max-width: 449.98px) { #Radovi .swiper-button-prev, #Radovi .swiper-button-next { width: 20%; } }

.sn-cover { position: relative; min-height: 883px; padding: 70px 0; }
#Edukacija { padding: 89px 0; }
.sn-cover .container { position: relative; z-index: 1; }
.sn-cover-img { position: absolute; inset: 0; }
.sn-cover-img .vscms-banner-zone, .sn-cover-img .vscms-banner, .sn-cover-img picture { display: block; height: 100%; }
.sn-cover-img img { width: 100%; height: 100%; object-fit: cover; }
.sn-cover-text { background: rgba(255, 255, 255, .9); width: 50%; margin: 0 auto; padding: 50px; text-align: center; line-height: 34px; }
.sn-cover-text .sn-title { margin-top: 0; }
.sn-cover-text p:last-child { margin-bottom: 0; }
.sn-cover-text a { color: #ffb700; }
.sn-cover-text a:hover { text-decoration: underline; }
@media (max-width: 1366px) {
    .sn-cover, #Edukacija { min-height: 0; padding-bottom: 0; }
    .sn-cover-img { position: static; }
    .sn-cover-img .vscms-banner-zone, .sn-cover-img .vscms-banner, .sn-cover-img picture { height: auto; }
    .sn-cover-img img { height: auto; display: block; }
    .sn-cover-text { width: 100%; background: none; }
}
@media (max-width: 991.98px) { .sn-cover, #Edukacija { padding-top: 80px; } .sn-cover-text { padding: 25px; } }

.sn-week { text-align: center; margin: 0; }
.sn-day { display: inline-block; width: 13.5%; font-size: 19px; vertical-align: top; }
.sn-day h3 { font-size: 21px; font-weight: 500; margin: 20px 0 0; }
.sn-day h3::after { content: ''; display: block; margin: 10px auto 6px; width: 1.6px; height: 24px; background: #a1a1a1; }

#Lokacija { position: relative; }
#Lokacija .vscms-map { height: 700px; border-top: 1px solid #000; z-index: 0; pointer-events: none; }
#Lokacija .leaflet-tile-pane { filter: grayscale(1); }
#Lokacija .leaflet-control-container { pointer-events: auto; }
#Lokacija .leaflet-control-zoom { display: none; }
.sn-where { position: absolute; left: 50%; top: 40px; transform: translateX(-50%); z-index: 2; background: #000; color: #fff; text-align: center; padding: 30px 80px; }
.sn-where .sn-title { margin: 0 0 10px; }
.sn-where p { font-size: 21px; margin-bottom: 20px; }
.sn-btn { border: 1px solid #fff; border-radius: 0; background: #000; color: #fff; text-transform: uppercase; padding: 12px 40px; font-size: 14px; transition: background .5s, color .5s; }
.sn-btn:hover { background: #fff; border-color: #000; color: #000; }

#Kontakt { background: #131313; color: #fff; padding: 80px 0; }
#Kontakt .sn-title { margin-bottom: 50px; }
#Kontakt .form-control { background: #191919; border: 0; border-bottom: 1px solid #6c6c6c; border-radius: 0; color: #b4b4b4; height: 44px; font-size: 16px; }
#Kontakt textarea.form-control { height: auto; min-height: 210px; }
#Kontakt .btn-primary, #Kontakt .vscms-captcha-refresh { background: #141414; border: 1px solid #6c6c6c; border-radius: 0; color: #b4b4b4; height: 44px; padding: 0 30px; font-size: 15px; font-weight: 400; transition: background .5s, color .5s; }
#Kontakt .btn-primary:hover, #Kontakt .vscms-captcha-refresh:hover { background: #b4b4b4; color: #000; }
.sn-rows { font-size: 17px; font-style: normal; margin: 0; }
.sn-rows div { position: relative; padding-left: 30px; margin-bottom: 12px; }
.sn-rows i { position: absolute; left: 0; }
.sn-rows a { color: #fff; }
.sn-rows a:hover { color: #bbb; }
.sn-signature { border-top: 1px solid #6c6c6c; padding-top: 15px; margin-top: 20px; font-size: 17px; }
.sn-signature a { color: #fff; }
.sn-signature a:hover { color: #bbb; }

.sn-footer { background: #131313; color: #b4b4b4; border-top: 1px solid #333; font-size: 17px; }
.sn-footer a { color: #fff; }
.sn-footer a:hover { color: #bbb; }
body:has([data-sn-hero]) .sn-footer { display: none; }

@media (max-width: 766px) {
    h1, .sn-title { font-size: 50px; }
    :root, [data-bs-theme=light], [data-bs-theme=dark] { --bs-body-font-size: 18px; }
    .sn-lead { font-size: 18px; }
    #Radovi { padding: 120px 0 80px; }
    #Tim { padding: 80px 0; }
    .sn-cover, #Edukacija { padding-top: 40px; }
    .sn-tim .col { margin-bottom: 30px; }
    .sn-day { width: 13%; font-size: 16px; }
    .sn-day h3 { font-size: 16px; }
    .sn-where { padding: 30px; width: 90%; }
    .sn-cover-text a { display: table; color: #fff; background: #ffb700; padding: 4px 25px; margin: 10px auto 0; }
    .sn-cover-text a:hover { background: #000; text-decoration: none; }
}
@media (max-width: 580px) {
    .sn-day { width: 25%; }
    .sn-cover-text { padding: 0; }
    .sn-cover-img { margin-top: 30px; }
}
@media (max-width: 480px) {
    .sn-day { width: 40%; }
    #Lokacija .vscms-map { height: 580px; }
    .sn-where { padding: 23px; width: 78%; }
    .sn-where .sn-title { margin: -8px 0 10px; }
    .sn-where p { font-size: 14px; }
    .sn-btn { padding: 12px 32px; font-size: 13px; }
    .sn-cover-text, .sn-lead { line-height: 28px; font-size: 17px; }
}
@media (max-width: 380px) {
    .sn-where .sn-title { font-size: 42px; }
    .sn-where p { font-size: 18px; }
}