/* Minification failed. Returning unminified contents.
(7,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(8,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(9,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(13,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(14,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(16,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(17,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(18,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(19,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(20,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2468,26): run-time error CSS1030: Expected identifier, found '.'
(2468,35): run-time error CSS1031: Expected selector, found ')'
(2468,35): run-time error CSS1025: Expected comma or open brace, found ')'
(2479,33): run-time error CSS1030: Expected identifier, found '.'
(2479,42): run-time error CSS1031: Expected selector, found ')'
(2479,42): run-time error CSS1025: Expected comma or open brace, found ')'
(2483,23): run-time error CSS1030: Expected identifier, found '.'
(2483,32): run-time error CSS1031: Expected selector, found ')'
(2483,32): run-time error CSS1025: Expected comma or open brace, found ')'
(2488,23): run-time error CSS1030: Expected identifier, found '.'
(2488,32): run-time error CSS1031: Expected selector, found ')'
(2488,32): run-time error CSS1025: Expected comma or open brace, found ')'
(3592,39): run-time error CSS1030: Expected identifier, found '.'
(3592,52): run-time error CSS1031: Expected selector, found ')'
(3592,52): run-time error CSS1025: Expected comma or open brace, found ')'
(3597,39): run-time error CSS1030: Expected identifier, found '.'
(3597,52): run-time error CSS1031: Expected selector, found ')'
(3597,52): run-time error CSS1025: Expected comma or open brace, found ')'
(4882,15): run-time error CSS1039: Token not allowed after unary operator: '-grid-gap'
(4892,19): run-time error CSS1039: Token not allowed after unary operator: '-card-padding'
(4893,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(4894,27): run-time error CSS1039: Token not allowed after unary operator: '-card-radius'
(4894,48): run-time error CSS1039: Token not allowed after unary operator: '-card-radius'
(4895,32): run-time error CSS1039: Token not allowed after unary operator: '-color-border'
(4896,32): run-time error CSS1039: Token not allowed after unary operator: '-transition'
(4896,62): run-time error CSS1039: Token not allowed after unary operator: '-transition'
(4907,35): run-time error CSS1039: Token not allowed after unary operator: '-color-border'
(4911,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(4924,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(4941,17): run-time error CSS1039: Token not allowed after unary operator: '-color-text-muted'
(4951,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(4981,22): run-time error CSS1039: Token not allowed after unary operator: '-gradient-btn'
(4982,17): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(4983,32): run-time error CSS1039: Token not allowed after unary operator: '-transition'
(4983,62): run-time error CSS1039: Token not allowed after unary operator: '-transition'
(4993,22): run-time error CSS1039: Token not allowed after unary operator: '-gradient-featured'
(4994,17): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5014,17): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5020,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5023,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(5033,17): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5037,22): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5038,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(5055,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(5056,27): run-time error CSS1039: Token not allowed after unary operator: '-card-radius'
(5056,48): run-time error CSS1039: Token not allowed after unary operator: '-card-radius'
(5057,32): run-time error CSS1039: Token not allowed after unary operator: '-color-border'
(5061,16): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(5091,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(5275,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5276,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5885,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5905,28): run-time error CSS1039: Token not allowed after unary operator: '-card-padding'
(7229,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7230,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7231,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7232,13): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
@charset "UTF-8";

/* ==========================================================================
   Variables
   ========================================================================== */
:root {
    --color-bg: #f5f5f5;
    --color-white: #ffffff;
    --color-text: #111111;
    --color-text-muted: #333333;
    --color-red: #D91016;
    --color-border: #ececec;
    --gradient-btn: linear-gradient(135deg, #e5156a 0%, #e8183a 100%);
    --gradient-featured: linear-gradient(135deg, #c80d72 0%, #d3101f 50%, #dc3b17 100%);
    --font-base: "Roboto", Arial, Helvetica, sans-serif;
    --container-width: 1336px;
    --gutter: 52px;
    --grid-gap: 26px;
    --card-padding: 32px;
    --card-radius: 48px;
    --transition: 0.25s ease;
}

body {
    overflow-x: hidden;
}

body,
html {
    font-family: "Roboto-Regular";
    font-size: 16px;
    line-height: 1.75rem;
    font-weight: normal;
    color: #000000;
    
}

strong {
    font-family: "Roboto-Black";
}

iframe {
    display: block;
    margin-bottom: 15px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-30 {
    margin-bottom: 30px;
}

.pb-90-60-30{
    padding:90px 0;
}

.no-scroll {
    overflow-y: hidden;
    height:100vh;
}

.toggler {
    display: none;
}

.has-submenu .toggler {

display:inline-block;
transform:rotate(90deg);

}


* {
    box-sizing: border-box;
}

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

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

.colorSectionSiva {
    background-color: #f8f8f8;
}

.Error-message {
    display: none;
    margin-bottom: 15px;
    background: #b7150d;
    padding: 5px 15px;
    border-radius: 50px;
}

.backModal {
    position: absolute;
    left: 25px;
    top: 25px;
    cursor: pointer;
    filter: invert(1);
}

.grecaptcha-badge{
  bottom:100px !important;
  z-index:9999 !important;
}

.showMobile {
    display: none;
}

.arbonaUrediNaslov {
    font-size: 2.6rem;
    font-family: "Roboto-Bold";
    margin-bottom: 50px;
}

.arbonaClubPrijavaNaslov {
    margin-bottom: 15px;
    font-size: 1.777rem;
    font-family: "Roboto-Bold";
}

/*heading*/
h1 {
    font-size: 2.9rem;
    margin-bottom: 60px;
    font-family: "Roboto-Bold";
}

h2 {
    font-size: 2.6rem;
    font-family: "Roboto-Bold";
    margin-bottom: 50px;
}

h3 {
    font-size: 2.2rem;
    font-family: "Roboto-Bold";
    margin-bottom: 30px;
}

h4 {
    font-size: 1.777rem;
    font-family: "Roboto-Bold";
    margin-bottom: 30px;
}

h5 {
    font-size: 1.333rem;
    font-family: "Roboto-Bold";
    margin-bottom: 30px;
}

h6 {
    font-size: 1rem;
    font-family: "Roboto-Bold";
}

.main-title h1 {
    font-size: 4.209rem;
    /*67.34px;*/
    font-family: "Roboto-Regular";
    margin-bottom: 0;
}

.main-title h2 {
    font-size: 3.157rem;
    /*50.52px;*/
    font-family: "Roboto-Bold";
    margin-bottom: 0;
}

.mainSub-title.arbonaClub {
    left: 50%;
    text-align: center;
}

.mainSub-title h1 {
    margin-bottom: 0.5rem;
    font-size: 3.2rem;
}

.mainSub-title h2 {
    font-family: "Roboto-Light";
    margin-bottom: 0.5rem;
    font-size: 2.2rem;
}

/*buttons*/
.btn-primary {
    border-radius: 50px;
    padding: 8px 30px;
    font-size: 18px;
    text-decoration: none;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: -moz-fit-content;
    width: fit-content;
    /*white-space: nowrap;*/
    min-width:100px;
    text-decoration:none;
}

.btn-primary.white {
    border: 2px solid white;
    color: #ffffff;
    white-space: nowrap;
    text-decoration: none;
    margin-bottom: 30px;
}

        .btn-primary.white:hover {
            box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
        }

    .btn-primary.black {
        border: 1px solid #000000;
        color: #000000;
        /*white-space: nowrap;*/
    }

        .btn-primary.black:hover {
            border: 1px solid #ED1B25;
            background-color: #ED1B25;
            color: #ffffff;
            /*white-space: nowrap;*/
        }

        .btn-primary.black.download {
            padding: 5px 30px;
            margin-top:15px;
        }

        .btn-primary.black.download img {
            margin-left:10px;
        }

    .btn-primary.black.download:hover img {
        filter:invert(1);
    }


.btn-primary.red {
    padding: 10px 25px;
    color: #ffffff;
    background-color: #ED1B25;
    border-radius: 50px;
    display: block;
    align-items: center;
    border: 1px solid #ED1B25;
    /*  max-width: 150px; */
    justify-content: center;
    margin-top: 15px !important;
    text-align: center;
}

        .btn-primary.red:hover {
            border: 1px solid #000000;
            background-color: #ffffff;
            color: #000000;
        }

.seeAll {
    font-family: "Roboto-Bold";
    font-size: 20px;
    text-decoration: none;
    padding-bottom: 5px;
    text-decoration: none;
}

    .seeAll.black {
        border-bottom: 2px solid #000000;
        color: #000000;
    }

    .seeAll.white {
        border-bottom: 1px solid #ffffff;
        color: #ffffff;
        width: -moz-fit-content !important;
        width: fit-content !important;
    }

.usluge-red {
    color: #ffffff;
    padding: 7px 35px 6px 35px;
    background-color: #ED1B25;
    border: 2px solid #ED1B25;
    border-radius: 50px;
}

.usluge-red:hover,
.mainSub-title .btn-primary.usluge-red:hover {
    color: #ffffff;
    background-color: #bb131c;
    border-color: #bb131c;
}

/*switchevi*/
.userSwitchMobile {
    position: relative;
}

.desktopHide {
    display: none;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 35px 0px 50px 0px;
}

.logoWrap {
    width: 260px;
}

    .logoWrap img {
        width: 100%;
        height: auto;
    }

nav {
    /*margin: 0 auto;*/
}


.menu {
    display: flex;
    justify-content: space-evenly;
    align-items: flex-end;
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    top: 15px;
}

    .menu li {
        display: flex;
        align-items: center;
        position: relative;
        margin-right:15px;
    }

        .menu li a {
            display: inline-block;
            padding: 15px 15px;
            color: #000000;
            position: relative;
            text-decoration: none;
            font-size: 16px;
            font-family: "Roboto-Medium";
            white-space: nowrap;
            height: 100%;
            width: 100%;
        }

            .menu li a:hover {
                color: #ED1B25;
            }

            .menu li a:focus,
            .menu li a:active {
                color: #000000;
            }

    .menu .expand::after, .lang.active::before {
        content: "";
        width: 100%;
        height: 5px;
        display: inline-block;
        position: absolute;
        right: 0%;
        bottom: -2px;
        background-color: #ED1B25;
        border-radius: 50px;
        transition: all 0.2s ease-in-out;
    }

    .menu li .kontakt {
        color: #ffffff;
        padding: 7px 35px 6px 35px;
        background-color: #ED1B25;
        border-radius: 50px;
        position: relative;
        top: -7px;
        margin: 0 0px 0px 50px;
    }

    .menu .cta-kontakt.expand::after,
    .menu .searchSwitchDesktop.expand::after {
        display: none;
    }

    .menu li .kontakt:hover,
    .menu li .kontakt:active,
    .menu li .kontakt:focus {
        color: #ffffff;
        background-color: #bb131c;
    }

    .menu li .kontakt.active::after,
    .menu .trazilica.active::after {
        display: none;
    }

.submenu {
    display: none;
    position: absolute;
    z-index: 10;
    top: 50px;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: 10;
    background-color: #ffffff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
    width: 250px;
    border-radius: 5px;
    padding: 30px 25px;
}

    .submenu.registracija {
        width: -moz-fit-content;
        width: fit-content;
    }

    .submenu li a {
        line-height: normal;
        font-size: 0.9375rem;
        /*15px;*/
        font-family: "Roboto-Regular";
        padding: 0;
        white-space: normal;
        margin-bottom: 15px;
    }

    .submenu li:last-child a {
        margin-bottom: 0;
    }

.menu .expand .submenu {
    display: block;
}

    .menu .expand .submenu li a::after {
        display: none;
    }

.menu .close {
    display: none;
}

.menu .has-submenu:hover .submenu {
    display: block;
}

.menu .has-submenu:hover .toggler,
.has-submenu.expand .toggler {
    transform: rotate(-90deg);
}

.dark-overlay {
    display: none;
}

.mobile-nav {
    display: none;
}

.menu li .lang, 
.jezici .lang
{
    position: relative;
    color: #000000;
    font-size: 1rem;
    text-decoration: none;
    font-family: "Roboto-Medium";
    white-space: nowrap;
    padding: 15px 7px 15px 15px;
    display: inline-block;
    padding: 15px 20px 15px 10px;
}

.lang::after {
    position: absolute;
    right: 0px;
    top: 21px;
    display: inline-block;
    content: "";
    width: 11px;
    height: 11px;
    background-image: url(../img/caretForLang.svg);
    background-size: 100% 100%;
}

.lang:hover {
    color: #ED1B25;
}

    .lang:hover::after {
        background-image: url(../img/carret-red.svg);
        transform: rotate(90deg);
    }

.userBox {
    margin-left: 15px;
    width: 45px;
    height: 45px;
}

.userBox.logout-user .user {
    background-color:#ED1B25;
}

.userBox.logout-user .user img {
    filter:invert(1) brightness(400%);
}

.menu li .user, .mobile-nav .user {
    position: relative;
    padding: 10px 11px;
    background-color: #efefef;
    border-radius: 50%;
    display: flex;
    align-items: center;
    top: -3px;
}

.registracija {
    display: none;
    position: absolute;
    top: 65px;
    right: 5px;
    background-color: #ffffff;
    color: #000;
    flex-direction: column;
    padding: 20px 25px;
    margin: 0;
    z-index: 11;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
}

.registracija a{
    margin:5px 0 5px 0;
}

.subLang {
    display: none;
    position: absolute;
    top: 65px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #ffffff;
    color: #000;
    flex-direction: column;
    padding: 20px 25px;
    margin: 0;
    z-index: 11;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    border-radius: 5px;
}

.menu li .subLang a,
.jezici .subLang a,
.menu li .registracija a {
    flex-direction: column;
    width: -moz-fit-content;
    width: fit-content;
    color: #000000;
    position: relative;
    text-decoration: none;
    font-size: 1.125rem;
    /*18px;*/
    font-family: "Roboto-Regular";
    white-space: nowrap;
    padding: 0px !important;
    margin-bottom: 7px;
    line-height: normal;
    font-size: 15px;
}

    .menu li .subLang a:hover, 
    .jezici .subLang a:hover{
        color: #ED1B25;
    }

.menu li .registracija a {
    right: 5px;
}

.menu li .trazilica {
    padding: 15px 0px 15px 15px;
    top: -1px;
}

.search-icon {
    height: 22px;
}

/* SERACH*/
.searchBox {
    display: none;
    justify-content: center;
    width: 100%;
    max-width: 1320px;
    position: absolute;
    top: 140px;
    left: 50%;
    transform: translate(-50%, 0);
    background-color: #f6f6f6;
    padding: 70px 15px;
    z-index: 10;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
}

    .searchBox input {
        height: 45px;
        padding-right: 45px;
    }

.inputWrap {
    position: relative;
}

.closeSearch {
    position: absolute;
    right: 16px;
    top: 10px;
    cursor: pointer;
    transition: ease-in-out 0.04s;
}

.btn-search {
    width: 40px;
    position: absolute;
    right: 10px;
    top: -3px;
    border: none;
    outline: none;
    height: 100%;
    background-color: transparent;
}

    .btn-search::after {
        content: " ";
        display: inline-block;
        width: 20px;
        height: 20px;
        background-image: url(../img/search-red.svg);
        background-size: 100% 100%;
        position: absolute;
        right: 10px;
        top: 21px;
        z-index: 10;
        cursor: pointer;
    }

.searchSuggestion {
    margin: 30px 0 0px 0;
}

.searchSuggestion ul {
    margin:0 0 30px 0;
    padding:0;
    list-style-type:none;
}

.searchSuggestion ul li a {
   /* text-decoration: none;*/
    color: #ED1B25;
}

.searchSuggestion h5 {
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-weight:bold;
}

.searchHeader {
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-weight: bold;
}

.ostaliPojmovi ul {
    display:flex;
    flex-wrap:wrap;
}

.ostaliPojmovi ul li {
    margin-right:10px;
}

 .searchRezSlika ul {
    display:flex;
    flex-wrap:nowrap;
}

    .searchRezSlika ul li {
        max-width:225px;
        overflow:hidden;
    }


    .searchRezSlika a:not(.btn-primary.red) {
        display: inline-block;
        text-decoration: none;
        padding-right: 15px;
    }

.searchRezSlika a .searchTitle {
    text-transform: none;
    color: #000;
    margin-top: 15px;
    line-height:1.2;
    font-weight:bold;
}



/*end search*/
.mobileMenuToggler {
    display: none;
}

/*sadržaj*/
.videoBox {
    position: relative;
    height: 700px;
    overflow: hidden;
    background-image: url(../img/sarena-refularshape.svg);
    background-size:cover;
}

.replayVid {
    display: block;
    position: absolute;
    z-index: 10;
    left: 0%;
    bottom: -130px;
    background: transparent;
    border: none;
    outline: 0;
    width: 70px;
    height: 70px;
}

    .replayVid::before {
        display: inline-block;
        content: "";
        width: 100%;
        height: 100%;
        background-image: url(../img/replayBtn.svg);
        background-size: 100% 100%;
    }

.arbonaIntro {
    width: 100vw;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    z-index: -1;
}

.videoOverlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.37);
}

#myVideo {
    position: absolute;
    top: 0;
    left: 0;
}


.mainTitle-wrap {
    position: relative;
    height: calc(100% - 50px);
    display: flex;
    justify-content: center;
    /*align-items: center;*/
    padding: 60px 0;
    flex-direction: column;
    /*top: -30px;*/
}

.videoBox .mainTitle-wrap {
    height: 100%;
    top:unset;
}

.mainTitle-wrap.club {
    justify-content: center;
    top: -20px;
}

.mainTitle-wrap.club{
    justify-content:center;
}

.main-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #ffffff;
    padding-right: 15px;
    text-align: center;
}

    .main-title h2 {
        font-family: "Roboto-Light";
        margin-bottom: 20px;
    }

    .main-title a {
        color: #ffffff;
        background-color: #ED1B25;
        padding: 15px 40px;
        font-family: "Roboto-Bold";
        border-radius: 50px;
        font-size: 1.25rem;
        text-decoration: none;
        display: inline-block;
    }

        .main-title a:hover {
            background-color: #bb131c;
        }

.traka {
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 100%;
    height: 100px;
}

    .traka img {
        width: 100%;
        height: 100%;
    }

.bg-right {
    margin-bottom: 60px;
}

.prednosti .sekcijaText {
    padding: 0px 30px 0 0;
    margin-bottom: 0px;
}


/*.prednosti.bg-right {
    padding: 0px 0px 70px 0px;
}*/
.has-bg {
    padding: 90px 0px;
}

.no-bg {
    padding: 70px 0px 70px 0px;
}

.flex.hp-ikone {
    flex-wrap: wrap;
    justify-content: center;
}

.hp-ikone a {
    width: 33.33%;
    max-width: 480px;
    text-decoration: none;
    color: #000000;
}

.ikonaTextBox {
    display: flex;
    align-items: flex-start;
}

.i-1,
.i-2,
.i-3 {
    margin-bottom: 60px;
}

.ikonaTextBox img {
    width: 100px;
    margin-bottom: 15px;
}

.textMali {
    padding: 0px 30px;
}

.sekcijaText2.akademija .textMali {
    padding: 0;
}

    .sekcijaText2.akademija .textMali h4 {
        margin-top: 60px;
    }

        .sekcijaText2.akademija .textMali h4:first-child {
            margin-top: 0px;
        }

    .sekcijaText2.akademija .textMali img {
        border-radius: 0 !important;
        margin-bottom: 0 !important;
    }

.textMali h3 {
    margin-bottom: 30px;
    white-space: nowrap;
    transition: ease-in-out 0.3s;
    transform: translateX(0px);
}

.hp-ikone a:hover .ikonaTextBox h3 {
    transition: ease-in-out 0.3s;
    transform: translateX(15px);
}

.flex {
    display: flex;
}

.ma {
    margin: 0 auto;
}

.mt-90 {
    margin-top: 90px;
}

.mt-30 {
    margin-top:30px !important;
}

.mt-60 {
    margin-top: 60px;
}

.custom-predlozak ul, .ul-2 ul {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    list-style-type: none;
    margin-bottom: 30px;
    padding: 0;
}

    .custom-predlozak ul li {
        width: 85%;
        position: relative;
        padding-left: 25px;
        line-height: 30px;
    }

        .custom-predlozak ul li::before {
            content: "";
            display: inline-block;
            position: absolute;
            left: 0px;
            top: 7px;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: #ffffff;
        }

.bg-sarena {
    background-image: url(../img/bg-sarena.svg);
    background-size: 100% 100%;
    background-position: left center;
    color: #ffffff;
}

.bg-sarena.cover {

    background-size:cover;

}

.homepage .bg-sarena .sekcijaText h4,
.homepage .bg-slovo .sekcijaText h4,
.bg-sarena .swiper-wrapper .sekcijaText h4 {
    font-family: "Roboto-Regular";
    position: relative;
    padding-left: 55px;
}

.bg-sarena .sekcijaText h4::before,
.bg-slovo .sekcijaText h4::before {
    display: inline-block;
    content: "";
    width: 50px;
    height: 2px;
    position: absolute;
    top: 10px;
    left: 0;
    background-image: url(../img/crtica.svg);
    background-size: 100% 100%;
}

.bg-sarena a {
    /*text-decoration:underline;*/
    color:#fff;
}

.verticalImgBoxLeft {
    display: flex;
}

    .verticalImgBoxLeft img {
        max-width: 50%;
        border-radius: 16px;
    }

        .verticalImgBoxLeft img:nth-child(2) {
            display: inline-block;
            position: relative;
            top: 90px;
            left: 40px;
        }

.sekcijaText {
    padding-left: 90px;
    position: relative;
    height: 100%;
}

    .sekcijaText.blank {
        padding-right: 90px;
        position: relative;
        height: 100%;
    }

    .sekcijaText h3,
    .sekcijaText h4 {
        margin-bottom: 30px;
    }

.bg-slovo {
    position: relative;
}

    .bg-slovo::before {
        content: "";
        display: inline-block;
        width: 60%;
        height: 90%;
        position: absolute;
        left: -70px;
        bottom: -30px;
        background: url(../img/slovo-a-sekcija.svg);
        background-size: 100% 100%;
        color: #000000;
        z-index: -1;
    }

.verticalImgBoxRight {
    padding: 0px 60px;
    text-align: center;
    display: flex;
}

    .verticalImgBoxRight img {
        max-width: 53%;
        border-radius: 16px;
    }

        .verticalImgBoxRight img:first-child {
            display: inline-block;
            position: relative;
            top: 90px;
            right: 40px;
        }

.homepage .bg-slovo h4,
.bg-slovo .swiper-wrapper h4 {
    font-family: "Roboto-Regular";
    position: relative;
    padding-left: 55px;
}

.homepage .bg-slovo h4::before,
.homepage .bg-slovo h5::before,
.bg-slovo .swiper-wrapper h4::before,
.bg-slovo .swiper-wrapper h5::before {
    display: inline-block;
    content: "";
    width: 50px;
    height: 2px;
    position: absolute;
    top: 10px;
    left: 0;
    background-image: url(../img/crtica-crna.svg);
    background-size: 100% 100%;
}

.sekcijaText .seeAll {
    position: absolute;
    bottom: -90px;
}

.bg-tamnoSiva {
    background-image: url(../img/bg-tamnoSiva.svg);
    background-size: 100% 100%;
    background-position: left center;
    background-repeat: no-repeat;
    color: #ffffff;
    position: relative;
    overflow: hidden;
}

    .bg-tamnoSiva::after {
        content: "";
        display: inline-block;
        width: 1000px;
        height: 860px;
        background-image: url(../img/slovo-bgTamnosiva.svg);
        background-repeat: no-repeat;
        position: absolute;
        right: 15%;
        bottom: -40%;
        transform: rotate(-1deg);
        background-size: auto auto;
    }

    footer .bg-tamnoSiva::after {
        display:none;
    }

.bg-svijetloSiva {
    background-image: url(../img/bg-svijetloSiva.svg);
    background-size: 100% 100%;
    background-position: left center;
    background-repeat: no-repeat;
    color: #000000;
    position: relative;
    overflow: hidden;
}

.bg-polaznici {
    background-image: url(../img/bg-polaznici.svg);
    background-size: 100% 100%;
    background-position: left center;
    background-repeat: no-repeat;
    color: #000000;
    position: relative;
    overflow: hidden;
}

.hp-naseUsluge {
    background-color:#363636;
    color:#fff;
}

.hp.bg-sarena {
    position:relative;
}

.hp.bg-sarena::before {
    display: inline-block;
    content: "";
    width: 100%;
    height: 200px;
    position: absolute;
    left: 0;
    top: -1px;
    background-color: #363636;
    z-index: -1;
}

.hp-naseUsluge .textMali {
    color: #fff;
}

.blogoviSlider,
.knjiznicaSlider {
    width: 120vw;
    overflow: hidden;
}

    .blogoviSlider .swiper-wrapper,
    .knjiznicaSlider .swiper-wrapper {
        display: flex;
        flex-wrap: nowrap;
        margin-bottom: 60px;
        width: 120%;
    }

    .blogoviSlider .swiper-slide,
    .knjiznicaSlider .swiper-slide {
        width: -moz-fit-content;
        width: fit-content;
        margin-right: 25px;
    }

.blogoviSlider a, .officeItem {
    color: #ffffff;
    text-decoration: none;
    width: 460px;
    display: inline-block;
}

    .knjiznicaSlider a {
        display: inline-block;
        width: 460px;
    }

    .blogoviSlider a img {
        border-radius: 16px;
    }

    .blogoviSlider .imgBox,
    .knjiznicaSlider .imgBox {
        overflow: hidden;
    }

    .blogoviSlider.predlozeno a {
        width: 390px;
    }

    .knjiznicaSlider .imgBox,
    .knjiznica .imgBox {
        border: 1px solid #E2E2E2;
        border-radius: 16px;
        text-align: center;
    }

.imgBox {
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 30px;
}

.knjiznicaSlider {
    color: #000000;
    padding-top: 60px;
}

    .knjiznicaSlider a {
        color: #000000;
        text-decoration: none;
    }

.officeSlider {
    /*width: 120%;*/
}

.blogoviSlider .blogCategory,
.knjiznicaSlider .blogCategory,
.officeSlider .officeCity {
    font-size: 18px;
    text-transform: uppercase;
}

.blogoviSlider .blogTitle,
.knjiznicaSlider .blogTitle,
.knjiznica .blogTitle,
.officeSlider .officeAddress,
.officeSlider .officeTel {
    font-size: 20px;
    font-family: "Roboto-Bold";
}


.slider-pag {
    position: relative;
}

.swiper-nav {
    display: flex;
    justify-content: space-between;
    width: 100px;
    margin-bottom: 30px;
}

.swiper-button-next,
.swiper-button-prev {
    display: inline-block;
    position: relative;
    left: 0;
    width: 40px;
    height: 40px;
    border: 1px solid #ffffff;
}

.certifikatiSliderWrapper {
    overflow: hidden;
}

.certifikatiSlider .swiper-button-next,
.certifikatiSlider .swiper-button-prev {
    border: 1px solid #656565;
}

.swiper-button-right {
    right: 0;
}

.swiper-button-next::after {
    display: inline-block;
    content: "";
    position: absolute;
    top: 9px;
    left: 7px;
    width: 25px;
    height: 20px;
    background-image: url(../img/right-arrow-slider.svg);
    background-size: 100% 100%;
}

.swiper-button-prev::after {
    display: inline-block;
    content: "";
    position: absolute;
    top: 9px;
    left: 7px;
    width: 25px;
    height: 20px;
    background-image: url(../img/left-arrow-slider.svg);
    background-size: 100% 100%;
}

.certifikatiSlider .swiper-button-next::after,
.certifikatiSlider .swiper-button-prev::after {
    filter:invert(1);
}

.certifikatiSlider .swiper-slide {
    display:flex;
    justify-content:center;
    align-items:center;
    width: 250px;
    height:160px;
    border-radius: 16px;
    border: 1px solid #525252;
    padding:15px;
    margin:30px 60px 60px 0;
}

.certifikatiSlider .swiper-slide img {
    max-height:100%;
}

    .swiper-pagination-bullets.swiper-pagination {
        position: static;
        text-align: center;
    }

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 15px 0 0;
    background-color: #aaaaaa;
}

.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active {
    background-color: #ED1B25;
}

ol {
    padding-left: 15px;
}

/*newsletter forma*/
.newsletter {
    position: relative;
}

.form-group {
    margin-bottom: 25px;
}

.newsletter h2 {
    margin-bottom: 25px;
}

.newsletter p {
    font-size: 18px;
    margin-bottom: 25px;
    width: 80%;
}

.form-check-input {
    margin-top: 0;
}

.newsletter input[type=email] {
    display: inline-block;
    height: 45px;
    border: 0;
    outline: 0;
    border-radius: 24px;
    width: 70%;
    margin-right: 15px;
    padding: 7px 15px;
}

.newsletter input[type=checkbox]:checked {
    outline: 1px solid #ED1B25;

}

.newsletter .btn-primary {
    margin-top: 0;
}

.newsletter label {
    display: inline-block;
    margin-left: 10px;
}

/*custom checkmark*/
.checkbox {
    width: 18px;
    height: 18px;
    position: relative;
    top: -5px;
}

.social {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 52%;
    transform: translate(0%, -50%);
    height: 100%;
}

    .social ul {
        margin-bottom: 0;
        padding: 7px 0px 0px 0px;
        list-style-type: none;
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        height: 100%;
        align-items: center;
    }

        .social ul li {
            padding: 3px 0px 3px 0px;
        }

            .social ul li a img {
                transition: transform 0.3s;
                filter: brightness(200%);
                width: 25px;
                height: 25px;
            }

                .social ul li a img:hover {
                    transform: scale(1.3, 1.3);
                }

.certifikati {
    margin: 0 auto;
    width:200%;
}

    .certifikati ul {
        width: 100%;
        max-width: 1920px;
        display: flex;
        list-style-type: none;
        justify-content: space-evenly;
        align-items: center;
        margin: 10px auto 0 auto;
    }

        .certifikati ul li {
            display: flex;
            align-items: center;
            margin: 15px 3% 0px 0px;
            text-align: center;
            width: 90px;
            height: 90px;
        }

        .certifikati ul .tf500 {
            width: 250px;
            height: auto;
        }

.bg-siva {
    background: url(../img/bg-siva.svg);
    background-size: 100% 100%;
    background-position: left center;
    color: #ffffff;
}

.hp.klijenti {
    background-color: #656565;
    color: #fff;
    position: relative;
    padding: 90px 0 60px 0;
}

.hp.klijenti::after {
    display: inline-block;
    content: "";
    width: 100%;
    height: 250px;
    background-color: #656565;
    position:absolute;
    bottom:-249px;
    left:0;
    z-index:0;
  

}

.hp.klijenti .has-bg {
    padding: 90px 0px 60px 0;
}

.reference ul,
.reference2 ul {
    width: 100%;
    display: flex;
    list-style-type: none;
    justify-content: center;
    align-items: center;
    margin: 0 0 30px 0;
    padding: 0;
    flex-wrap: wrap;
}

    .reference ul li,
    .reference2 ul li {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0px 15px 15px 0px;
        width: 155px;
        height: 30px;
        margin: 20px 45px 20px 0px;
    }

    .reference2 ul li {
        margin: 20px 25px 20px 0px;
        justify-content: center;
    }

        .reference ul li img,
        .reference2 ul li img {
            display: inline-block;
            opacity: 0.9;
            max-height: 45px;
        }

.footer1 {
    position: relative;
    padding: 30px 15px 30px 15px;
    color: #fff;
    position: relative;
    z-index: 2;
}


.kosiFooter .footer1::before {
   /* content: "";
    display: inline-block;
    width: 100%;
    height: 170%;
    position: absolute;
    bottom: 0;
    background-color: #F8F8F8;
    text-align: center;
    background-size: 100% 120%;
    z-index: -1;
    overflow: hidden;*/
}

.footer1::before {
   /* content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left:0;
    background-color: #F8F8F8;
    text-align: center;
    background-size: 100% 120%;
    z-index: -1;*/
}

.footer1::after {
  /*  content: "";
    display: inline-block;
    position: absolute;
    z-index: -1;
    width: 330px;
    height: 100%;
    background-image: url(../img/slova-a-footer.svg);
    background-size: 100% 100%;
    right: -80px;
    bottom: -30px;*/
}

.foo-logo {
    color: #ED1B25;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 200px;
    margin: 0 auto 60px auto;
    text-align: center;
}

    .foo-logo a {
        color: #ED1B25;
        text-decoration: none;
    }

.footer1 ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    justify-content: center;
    flex-wrap:wrap;

}

    .footer1 ul li a {
        display: inline-block;
        padding: 0px 15px;
        text-decoration: none;
        color: #ffffff;
        white-space:nowrap;
    }

footer.has-bg {
    padding: 90px 0px 0px 0;
    position: relative;
    overflow: hidden;
}

footer::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 250px;
    background-color: #363636;
    position: absolute;
    right: 0;
    bottom: 00px;
    background-size: auto auto;
}

footer.bg-tamnoSiva::after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 90%;
    background-image: url(../img/slovo-bgTamnosiva.svg);
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    right: 0;
    bottom: 0;
    background-size: auto 100%;
    transform: rotate(6deg);
}

footer .has-bg {
    padding:90px 0 0 0;
}

    footer a {
        color: #fff;
        text-decoration: none;
    }

        footer a:hover {
            color: #ED1B25;
        }

    footer ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

        footer ul li {
            font-size: 14px;
            line-height: 24px;
        }

            footer ul li:first-child {
               /* font-weight: bold;*/
            }

.hp.foo {
    position: relative;
    padding: 90px 0px 0px 0;
}

.hp.foo::after {
    display: inline-block;
    content: "";
    width: 100%;
    height: 230px;
    position: absolute;
    left: 0;
    bottom: -30px;
    background-color: #363636;
    background-image:none;
}

.copy {
    background-color: #363636;
    font-size: 14px;
    padding: 25px 0px;
    border-top: 1px solid #fff;
    color: #ffffff;
    position: relative;
    z-index:2;
}

.copyLinks ul {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style-type: none;
}

    .copyLinks ul li {
        margin-right: 40px;
        font-weight: normal;
        white-space: nowrap;
    }

        .copyLinks ul li a {
            text-decoration: none;
            color: #ffffff;
            font-weight: normal;
        }

.foo-social {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

    .foo-social a {
        margin-right: 15px;
        display: flex;
        align-items: baseline;
        justify-content: center;
    }

/*usluge*/
.subpageImg {
    position: relative;
    min-height: 400px;
    /*height: 500px;*/
    background-image: url(../img/Arbona-promo-6.jpg);
    background-size: cover;
    background-position: center center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.subPageButtons {
    padding: 10px 0 0 0;
   
}

.subPageButtons a {
    display:inline-block;
    padding: 4px 20px;
    text-decoration: none;
    margin: 0 10px 10px 0;
    border-radius: 50px;
    color: #ffffff;
    background-color: rgba(255,255,255,0.3);
    font-size:14px;
}

.subpageImg.maliHeader {
    min-height: 300px;
}

.mainSub-title {
    position: static;
    top: 50%;
    color: #ffffff;
    padding:  0 15px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    height: 100%;
}


    .mainSub-title .btn-primary {
        margin-top: 20px;
        padding: 8px 40px 8px 40px;
    }

        .mainSub-title .btn-primary:hover {
            background-color: #ED1B25;
            border: 2px solid #ED1B25;
        }

.boxStudije {
    position: relative;
    border-radius: 17px;
    margin-right: 15px;
}

    .boxStudije:last-child {
        margin-right: 0;
    }

.linkWrap .boxStudije .text span {
    transition: ease-in-out 0.3s;
    transform: translateX(0px);
}

.linkWrap:hover .boxStudije .text span {
    transform: translateX(10px);
}

.imgWrap {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 17px;
    position: relative;
}

.gradientOverlay {
    position: absolute;
    border-radius: 17px;
    overflow: hidden;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 2;
}

.text {
    position: absolute;
    bottom: 100px;
    color: #ffffff;
    padding: 0px 20px;
    z-index: 3;
}

.klijent {
    display: inline-block;
    width: 100%;
    font-size: 18px;
    font-family: "Roboto-Medium";
    text-transform: uppercase;
    letter-spacing: 2px;
}

.naslov {
    display: inline-block;
    width:80%;
    font-size: 25px;
    font-family: "Roboto-Bold";
    line-height: 1.2;
}

.go {
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-size: 100% 100%;
    position: relative;
    bottom: 25px;
    left: 43%;
    transform: none;
    transition: ease-in-out 0.2s;
    z-index: 4;
}

    .go::after {
        display: inline-block;
        content: "";
        width: 20px;
        height: 20px;
        position: absolute;
        left: 14px;
        top: 15px;
        background-size: 100% 100%;
    }

    .go:hover {
        transform: scale(1.1);
    }

    /*coloredFirst*/
    .go.coloredFirst {
        background-image: url(../img/color.jpg);
        background-size: cover;
    }

        .go.coloredFirst::after {
            background-image: url(../img/arrow-white.svg);
        }

        .go.coloredFirst:hover {
            background-image: none;
            background-color: #fff;
        }

            .go.coloredFirst:hover::after {
                background-image: url(../img/arrow-red-right.svg);
            }

    /*whiteFirst*/
    .go.whiteFirst {
        background-image: none;
        background-color: #fff;
    }

        .go.whiteFirst::after {
            background-image: url(../img/arrow-red-right.svg);
        }

        .go.whiteFirst:hover {
            background-image: url(../img/color.jpg);
            background-size: cover;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
        }

            .go.whiteFirst:hover::after {
                background-image: url(../img/arrow-white.svg);
            }

.bg-slovo.bg-left::before {
    left: unset;
    right: -70px;
    bottom: 0;
    height: 75%;
    z-index: -1;
}

.homepage .sekcijaText h5,
.swiper-wrapper .sekcijaText h5 {
    padding-left: 55px;
    position: relative;
}

.sliderHolder {
    position: relative;
}

.rezultatiSlider {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding-bottom: 15px;
}

    .rezultatiSlider .swiper-wrapper {
        padding-bottom: 90px;
        width: 100%;
    }

    .rezultatiSlider .swiper-slide {
        width: 100%;
    }

.rezItem1 .verticalImgBoxLeft {
    padding-left: 70px;
}

/* svi ul koji ce dodavat skroz saržaj u GA moraju imati klasu custom*/
.custom, .no-bg ul,
.innerSection ul,
.inner-content ul,
.prednosti ul,
.modulBox ul {
    margin: 15px 0;
    padding: 0;
    list-style-type: none;
}

.custom li, .no-bg div:not(.certifikati) ul li,
.innerSection div:not(.pagination):not(.poslovnice):not(.tags):not(.shareSocial) ul li,
.inner-content ul:not(.pagination):not(.poslovnice):not(.tags):not(.shareSocial) li,
.prednosti ul li,
.modulBox ul li {
    padding-left: 25px;
    position: relative;
    line-height: 30px;
}

.custom li::before,
.no-bg ul li::before,
.prednosti ul li::before,
.inner-content ul li::before,
.modulBox ul li::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 0px;
    top: 7px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #ED1B25;
}

.no-bg .certifikati ul li::before,
.innerSection .pagination li::before,
.innerSection .poslovnice ul li::before,
.innerSection .tags li::before,
.innerSection .shareSocial li::before,
.inner-content .pagination li::before,
.inner-content .poslovnice ul li {
    content: none;
}

.swiper-button-prev.rez {
    display: inline-block;
    position: absolute;
    left: -10px;
    width: 45px;
    height: 45px;
    border: none;
    opacity: 1;
    z-index: 5;
}

.swiper-button-next.rez {
    display: inline-block;
    position: absolute;
    right: 0px;
    left: unset;
    width: 45px;
    height: 45px;
    border: none;
    opacity: 1;
    z-index: 2;
}

.swiper-button-prev.rez::after {
    display: inline-block;
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-image: url(../img/sliderColorBtn-left.svg);
    background-size: 100% 100%;
}

.swiper-button-next.rez::after {
    display: inline-block;
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-image: url(../img/sliderColorBtn-right.svg);
    background-size: 100% 100%;
}

.caseStudyAll {
    padding: 60px 0px;
}

.naslovFilterWrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

    .naslovFilterWrap h3 {
        margin-bottom: 0;
    }

.filterBtn {
    padding: 12px 25px;
    color: #ffffff;
    background-color: #ED1B25;
    border-radius: 50px;
    display: flex;
    align-items: center;
    border: 0;
    min-width: 150px;
    justify-content: center;
}

.selectBtn {
    display: inline-block;
    width: 100%;
    padding: 8px 25px;
    border: 1px solid #CECECE;
    border-radius: 50px;
    height: 55px;
    text-align: left;
    background-color: transparent;
    position: relative;
    font-size: 15px;
    color: #8A8888;
}

.selectBtn.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0;
    display: inline-block;
    width: 22px;
    height: 22px;
    background-image: url(../img/dropdown-arrow-white.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    filter: invert(1);
    position:absolute;
    right:25px;
    top:15px;
}

.selectWrap .dropdown-item {
    font-family: Roboto-Regular;
}
.selectWrap .dropdown-item:hover {
    font-family: Roboto-Regular;
}

.forma-akademija .selectWrap .dropdown-menu  li label {
    /*display:inline-block !important;*/
    width:calc(100% - 25px);
    cursor:pointer;
    padding-left:10px;
    
}

.forma-akademija .selectWrap .dropdown-menu li {
    display: flex;
}

.selectWrap .checkbox {
    border: 1px solid #cecece;
    position:relative;
    top:5px;
}


.dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0;
    display: inline-block;
    width: 22px;
    height: 22px;
    background-image: url(../img/dropdown-arrow-white.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.dropdown-menu {
    width: 100%;
    border: 0;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.16);
    margin: 5px 0 0 0 !important;
    border-radius: 10px;
    padding: 20px !important;
}

    .dropdown-menu li {
        padding: 0 !important;
        margin: 0 !important;
    }

.dropdown-item {
    padding: 0px;
    margin-bottom: 10px;
    font-size: 15px;
    white-space: normal;
}

.dropdown-menu li:last-child a {
    margin-bottom: 0px;
}

.dropdown-menu li::before {
    display: none !important;
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item:active {
    background-color: transparent;
    color: #ED1B25;
}

.innerSection .btn-primary {
    margin: 30px auto;
}

.bg-sarena .go:hover {
    transform: scale(1.1);
}

.innerSection {
    padding: 0px 0px 60px 0;
}

    .innerSection .blogItem1 {
        margin-bottom: 60px;
    }

.blogItem1 a {
    color: #000;
    text-decoration: none;
}

.innerSection .blogCategory {
    font-size: 16px;
    text-transform: uppercase;
}

.innerSection .blogTitle {
    font-size: 18px;
    font-family: "Roboto-Medium";
}

.innerSection .imgBox {
    margin-bottom: 15px;
    position: relative;
}

.blogItem1 .imgBox img {
    margin-bottom: 0px;
}

.innerSection .stamp {
    position: absolute;
    bottom: 20px;
    width: 47px;
    height: 47px;
    left: 65%;
    transform: translate(-25%, 0);
}

.innerSection .btn-primary {
    margin: 0;
}

.innerSection .btn-primary.red.mt-30 {
    margin: 30px 0 0 0 !important;
}

.inner-content img {
   border-radius: 16px;
    /*margin-bottom: 30px;*/
}

.inner-content p {
    margin-bottom: 30px;
}

.tabCategoryIntro{
  /*  text-align:center;*/
    margin-bottom:20px;
}

.tabCategory {
    display: flex;
    /*justify-content: center;*/
    justify-content:flex-start;
    flex-wrap: wrap;
    margin-bottom:30px;
    margin-top:15px;
}

.tabCategory a {
    display: inline-block;
    margin: 0px 7px 15px 7px !important;
}

.timeRead {
    font-size: 14px;
    color: #8A8888;
    margin-top: -5px;
    line-height:1.4;
}

.predlozeno .timeRead {
    color: #ffffff;
}

.karijeraSpecImg1 {
    position: relative;
    padding:30px 0 0 0;
}

    .karijeraSpecImg1 img {
        position: absolute;
        right: 0;
        top: 50%;
        width: 45%;
        max-width: 753px;
        height: auto;
        max-height: 465px;
        transform: translateY(-45%);
    }

.karijeraBox {
    text-align: center;
    padding-bottom: 60px;
    max-width: 320px;
}

    .karijeraBox h4 {
        position: relative;
        text-transform: uppercase;
        margin-bottom:30px;
    }

        .karijeraBox h4:after {
            content: "";
            display: inline-block;
            width: 70px;
            height: 7px;
            background-image: url(../img/color-line.png);
            background-size: 100% 100%;
            background-position: center;
            position: absolute;
            bottom: -16px;
            left: 50%;
            transform: translate(-50%, 0%);
        }

.sekcijaText2 {
    padding-left: 60px;
    position: relative;
    height: -moz-fit-content;
    height: fit-content;
}

    .sekcijaText2.akademija {
        padding-left: 90px;
    }

.ikonaTextBox.razlog {
    width: 100%;
    margin-bottom: 60px;
}

.karijeraSpecImg2 {
    position: relative;
    padding-bottom: 60px;
}

    .karijeraSpecImg2 img {
        position: absolute;
        right: 0;
        top: 50%;
        width: 45%;
        max-width: 753px;
        height: auto;
        max-height: 465px;
        transform: translateY(-45%);
    }

.newsletter.black input {
    /* border: 1px solid #000000; */
    outline: 1px solid #000000;
}

    .newsletter.black input[type=email]::-moz-placeholder {
        color: #000000;
    }

    .newsletter.black input[type=email]::placeholder {
        color: #000000;
    }

.newsletter.black .Error-message {
    color: #fff;
}

.nwsletter_ok {
    display: inline-block;
    background: #ed0b75;
    padding: 5px 15px;
    color: #fff;
    border-radius: 50px;
    margin-bottom: 15px;
}

.karijeraSpecImg2 h3 {
    margin-bottom: 30px;
}

.moduliWrap {
    padding-bottom: 60px;
}

.moduliWrap.hp {
    padding-bottom: 0px;
}

.moduliWrap .row{
    justify-content:center;
}

.moduliWrap a {
    text-decoration:none;
}

.modulBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #ffffff;
    border-radius: 0 50px 0 50px;
    border: 1px solid #E2E2E2;
    color: #000000;
    padding: 30px 40px 40px 40px;
    position: relative;
    text-align: center;
    height: 100%;
    transition: all 0.1s ease-in-out;
}

.modulBox:not(.parentBox .modulBox):hover {
    background-image: url(../img/color.jpg);
    color: #ffffff;
    background-size: cover;
}

    .modulBox h4 a {
        color: #000000;
        text-decoration: none;
    }

    .modulBox:hover:not(.parent .modulBox) h4 a {
        color: #ffffff;
    }

.modulBox:not(.parent .modulBox):hover ul,
.modulBox:not(.parent .modulBox):hover ul a {
    color: #fff;
}

.modulBox:not(.parent .modulBox):hover li::before {
    background-color: #fff;
}


.parentBox .go.coloredFirst:hover {
    background-image: url(../img/color.jpg);
}

    .parentBox .go.coloredFirst:hover::after {
        background-image: url(../img/arrow-white.svg);
    }

.parentBox:hover .modulBox {
    background-image: url(../img/color.jpg);
    color: #ffffff;
    background-size: 100% 100%;
    background-position: center center;
}

.parentBox:hover .go.coloredFirst {
    background-image: none;
    background-color: #ffffff;
}


.parentBox:hover .go.coloredFirst::after {
    background-image: url(../img/arrow-red-right.svg);
}

.moduliWrap.hp .go.coloredFirst {
    display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
    font-weight:bold;
    font-size:18px;
}

.moduliWrap.hp a:hover .go.coloredFirst,
.moduliWrap.hp .parentBox:hover .go.coloredFirst
{
    color: #f7403a;
}

.moduliWrap.hp span.go.coloredFirst::after {
    background-image: none;
}


.parentBox:hover .modulBox h4 a {
    color: #ffffff;
}

.modulBox .go {
    bottom: -25px;
}

/* .parentBox-4:hover .go.coloredFirst {
    background-image: none;
    background-color: #ffffff;
}

.parentBox:hover .go.coloredFirst::after {
    background-image: url(../img/arrow-red-right.svg);
} */
.verticalImgBoxLeft.akademija {
    height: 100%;
    overflow: hidden;
    border-radius: 16px;
    justify-content: center;
}

    .verticalImgBoxLeft.akademija img {
        width: auto;
        height: 100%;
        max-width: unset;
        max-height: unset;
    }

.sekcijaText2.akademija {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

    .sekcijaText2.akademija h4 {
        margin-bottom: 15px;
    }

    .sekcijaText2.akademija .textMali {
        /* margin-bottom: 60px; */
    }

.cijeneWrap {
    margin-bottom: 60px;
}

.cijenaBox {
    background-color: #FFE5E5;
    border-radius: 0px 50px 0px 50px;
    display: flex;
    padding: 40px 35px;
    color: #000000;
    justify-content: space-between;
    height: 100%;
}

    .cijenaBox h5 {
        margin-bottom: 16px;
        font-weight: bold;
    }

    .cijenaBox .btn-primary:hover {
        color: #ffffff;
        background: url(../img/color.jpg);
        background-size: cover;
        background-position: center center;
        border: 1px solid transparent;
    }

.infos {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

    .infos .btn-primary {
        font-size: 16px;
        padding: 7px 30px;
        margin-top: 25px;
        bottom: 0px;
        width: -moz-fit-content;
        width: fit-content;
    }

    .infos h5 {
        margin-bottom: 0.5rem;
    }

    .infos p {
        margin-bottom: 0px;
    }

.iznos {
    position: relative;
    color: #000000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-left: 20px;
}

    .iznos:after {
        display: inline-block;
        content: "";
        width: 2px;
        height: 100%;
        background-color: #9F0000;
        position: absolute;
        left: 0px;
        top: 0;
    }

    .iznos .eur,
    .iznos .kn {
        white-space: nowrap;
    }

    .iznos .eur {
        font-family: "Roboto-Bold";
        font-size: 1.777rem;
    }

.predavaci .imgBox {
    margin-bottom: 30px;
}

.namePredavaca {
    font-size: 1.333rem;
    font-family: "Roboto-Bold";
}

.programPredavaca {
    font-size: 1rem;
    color: #656565;
    margin-top: 5px;
}

.polazniciHolder {
    position: relative;
}

.polazItem {
    border-radius: 16px;
    overflow: hidden;
    max-width: 80%;
    position: relative;
    margin: 0 auto 60px auto;
    text-align: right;
}

    .polazItem img {
        border-radius: 16px;
    }

.polazInfo {
    position: absolute;
    right: 0;
    bottom: 0;
    width: -moz-fit-content;
    width: fit-content;
    padding: 25px 45px;
    border-radius: 10px 0 0 10px;
    color: #ffffff;
    font-size: 18px;
    font-family: "Roboto-Bold";
    line-height: 24px;
    text-align: center;
    background: url(../img/color.jpg);
    background-size: cover;
    background-position: center center;
}

.polazniciSlider {
    margin-bottom: 60px;
    overflow: hidden;
    position: relative;
}

    .polazniciSlider .sekcijaText2 {
        height: 100%;
        display: flex;
        align-items: center;
        padding-left: 0;
    }

    .polazniciSlider .swiper-button-prev.rez {
        left: 0;
    }

    .polazniciSlider .swiper-button-next.rez {
        right: 20px;
    }

.swiperFoto .swiper-button-prev {
    background: url(../img/color.jpg);
    background-size: cover;
    padding: 10px;
    border-radius: 50%;
    color: #fff;
    right: auto;
    left: 15px;
    position: absolute;
    border: none;
    top: 40%;
    transform: translateY(-40%);
}

    .swiperFoto .swiper-button-prev::after {
        top: 11px;
        left: 11px;
        width: 18px;
        height: 18px;
    }

.swiperFoto .swiper-button-next {
    background: url(../img/color.jpg);
    background-size: cover;
    padding: 10px;
    border-radius: 50%;
    color: #fff;
    right: 15px;
    left: auto;
    position: absolute;
    border: none;
    top: 40%;
    transform: translateY(-40%);
}

    .swiperFoto .swiper-button-next::after {
        top: 11px;
        left: 11px;
        width: 18px;
        height: 18px;
    }

.sekcijaText3 h4 {
    font-family: "Roboto-Medium";
}

.inner-content a, .faqSection .accordion-header {
    color: #000000;
    font-family: "Roboto-Medium";
    text-decoration: none;
    transition: all .3s ease-out;
}

.inner-content a:hover {
    color: #ED1B25;
    font-family: "Roboto-Medium";
    text-decoration: none;
}

.faqSection .accordion-header,
.faqSection .accordion-header:hover {
    font-size: 18px;
    font-family: "Roboto-Bold";
    cursor: pointer;
}

.faqSection .accordion-header:hover {
    color: #ED1B25;
}

article a,
.prednosti .sekcijaText a:not(.btn-primary.red),
.ul-2 a {
    color: #ED1B25;
    text-decoration: underline;
}

article a:hover,
.prednosti .sekcijaText a:hover,
.ul-2 a:hover{
    color: #000000;
}

.accordion-header[href="javascript:void(0);"] {
    cursor: initial;
}

.backToTop {
    display: flex;
    position: fixed;
    bottom: 80px;
    left: 20px;
    width: 45px;
    height: 45px;
    border-radius: 50px;
    background-color: #D91016;
    z-index: 20;
    justify-content: center;
    align-items: center;
    display:none;
}

    .backToTop::after {
        display: inline-block;
        position: absolute;
        top: 12px;
        content: "";
        width: 11px;
        height: 17px;
        background-image: url(../img/ios-arrow-right.svg);
        transform: rotate(-90deg);
        background-size: 10px auto;
        background-repeat: no-repeat;
        margin: 0 auto;
    }

    .backToTop:hover {
        opacity: 0.8;
    }


.iframe.is-zpopup {
    right:5px !important;
    bottom:10px !important;

}

.grecaptcha-badge {
    bottom: 86px !important;
}
    /*accordion*/
.accordion-item {
    border: none;
    border-bottom: 1px solid #E6E6E6;
    position: relative;
    padding: 15px 60px 15px 0;
}

.accordion-button {
    font-size: 1.33rem;
    padding-left: 0;
    display: inline-block;
    width: 50px;
    height: 100%;
    position: absolute;
    right: 0;
    background-color: transparent;
    top: 0;
    border-radius: 0;
    border: none;
}


    .accordion-button:focus {
        box-shadow: none;
        border: none;
    }

    .accordion-button:not(.collapsed) {
        background: none;
        color: #000000;
        box-shadow: none;
    }

    .accordion-button.collapsed::after {
        display: inline-block;
        content: "";
        width: 20px;
        height: 20px;
        background-image: url(../img/carret-red.svg);
        background-size: 100% 100%;
        background-position: center center;
        color: #000000;
        position: absolute;
        top: 10px;
        right: 15px;
        transform: rotate(0deg);
    }

    .accordion-button:not(.collapsed)::after {
        display: inline-block;
        content: "";
        width: 20px;
        height: 20px;
        background-image: url(../img/carret-red.svg);
        background-size: 100% 100%;
        background-position: center center;
        color: #000000;
        position: absolute;
        top: 10px;
        right: 15px;
        transform: rotate(90deg);
    }

.accordion-body {
    padding: 30px 20px;
}

.poslovnice ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    margin-bottom: 30px;
}

.quickInfo {
    margin: 15px 0 30px 0;
    padding: 40px 40px;
    /* box-shadow: 0px 0px 10px rgba(0,0,0,0.1);*/
    border: 2px solid #ED1B25;
    border-radius: 16px;
    margin-bottom: 60px;
}

.quickInfo ul {
    margin: 0;
    list-style-type: none;
    margin-bottom: 30px;
}

        .quickInfo ul li {
            padding-left: 0 !important;
            margin-right: 25px;
        }

            .quickInfo ul li:hover svg {
                fill: #ED1B25;
            }

            .quickInfo ul li svg {
                margin-right: 7px;
                position: relative;
                top: -2px;
            }

.quickInfo h2 {
    font-size: 1.777rem;
    margin-bottom:15px;
}

.quickInfo p {
    margin-bottom: 15px !important;
}

.poslovnice ul li {
    padding-left: 0 !important;
}

    .poslovnice ul li:first-child {
        font-size: 1.25rem;
        font-family: "Roboto-Bold";
        margin-bottom: 10px;
    }

    .poslovnice ul li::before, .quickInfo ul li::before {
        display: none !important;
    }

    .poslovnice ul li svg {
        margin-right: 7px;
        position: relative;
        top: -2px;
    }

    .poslovnice ul li a:hover svg {
        fill: #ED1B25;
    }

.karta {
    margin: 30px 0 60px 0;
}

.mainTitle-wrap .breadcrumbs {
    padding: 15px 0px 15px 15px;
}

.mainTitle-wrap .breadcrumbs ul li a{
    color:#ffffff;
}

.mainTitle-wrap .breadcrumbs ul li::before {
    background-image: url(../img/caretWhite.svg);
}

.mainTitle-wrap .breadcrumbs ul li:last-child {
    font-family: 'Roboto-Bold';
    font-weight: bold;
}

.breadcrumbs {
    padding: 15px 0px 0px 0px;
}


    .breadcrumbs ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
        display: flex;
        flex-wrap: wrap;
    }

    .breadcrumbs ul li {
        padding-left: 15px;
        position: relative;
        margin: 0px 5px 0px 0px;
    }

            .breadcrumbs ul li a {
                text-decoration: none;
                color: #000;
                font-size: 14px;
                font-family: "Roboto-Regular";
                color: #888585;
                transition: all .3s ease-out;
            }

            .breadcrumbs ul li:hover a {
                color: #ED1B25;
                font-family: "Roboto-Regular";
            }
.mainTitle-wrap .breadcrumbs ul li:hover a {
    color: #cacaca;
}

.breadcrumbs ul li::before {
    display: inline-block;
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    background-image: url(../img/caretForLang-grey.svg);
    background-size: 100% 100%;
    left: 0;
    top: 10px;
    transform: rotate(-90deg);
    filter: brightness(105%);
}

            .breadcrumbs ul li:first-child {
                padding-left: 0;
            }

                .breadcrumbs ul li:first-child::before {
                    display: none;
                }

            .breadcrumbs ul li:hover::before {
                background-image: url(../img/carret-red.svg);
                transform: none;
            }

            .mainTitle-wrap .breadcrumbs ul li:hover::before {
                background-image: url(../img/caretWhite.svg);
                transform: rotate(-90deg);
            }
/*forme*/
.innerSection.forme {
    padding: 30px 0;
}

.kontaktForma {
   margin-bottom: 60px;
}

form label {
    display: block;
    padding-left: 5px;
    margin-bottom: 7px;
}

form input:not(input[type=checkbox]) {
    display: inline-block;
    width: 100%;
    padding: 8px 25px;
    border: 1px solid #CECECE;
    border-radius: 50px;
    height: 55px;
}

.form-select option {
    padding: 2px 0px;
}

form input[type=submit] {
    padding: 8px 45px !important;
}

    form input[type=submit]:hover {
        background-color: #bb131c;
    }

.newsletter input[type="submit"] {
    width: fit-content;
    border: 2px solid white;
    color: #ffffff;
    white-space: nowrap;
    padding: 8px 30px;
    padding: 8px 30px;
    background-color: transparent;
    height: unset;
}

    .newsletter input[type="submit"]:hover {
        box-shadow: 0 0 10px rgba(0,0,0,0.4);
        background-color: transparent;
    }

input[type="submit"].btn-primary.karijeraNewsletter {
    width: fit-content;
    color: #000000;
    white-space: nowrap;
    padding: 8px 30px;
    padding: 8px 30px;
    background-color: transparent;
    height: unset;
}

input[type="submit"]:hover.btn-primary.karijeraNewsletter {
    background-color: transparent;
}



.form-check-input:checked {
    background-color: #ED1B25;
    border-color: #ED1B25;
    box-shadow: none;
}

form input:focus,
form textarea:focus,
.newsletter input[type=email]:focus,
.newsletter input[type=checkbox]:focus
{
    border: 1px solid rgba(237, 27, 37, 0.4) !important;
    outline: none;
    box-shadow: 0px 0px 10px rgba(237, 27, 37, 0.4) !important;
}

    form input:focus::-moz-placeholder, form textarea:focus::-moz-placeholder {
        font-size: 12px;
        color: #8A8888;
    }

    form input:focus::placeholder,
    form textarea:focus::placeholder {
        font-size: 12px;
        color: #8A8888;
    }

form textarea {
    display: inline-block;
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #CECECE;
    border-radius: 5px;
    min-height: 150px;
}

form input.btn-primary,
.forma-kontakt .btn-primary,
.forma-login .btn-primary,
.forma-reg .btn-primary,
.forma-akademija .btn-primary {
    margin: 0;
    background-color: #ED1B25;
    border: 1px solid #ED1B25;
    color: #fff;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
}

.forma-kontakt .btn-primary:hover,
.forma-login .btn-primary:hover,
.forma-reg .btn-primary:hover {
    background-color: transparent;
    border: 1px solid #000000;
    color: #000000;
}

.forma-reg .privola {
    width: 90%;
   /* margin-left: 10px;*/
    font-size: 13px;
    line-height: 20px;
    margin-top: -8px;
}

.loginForma {
   /* padding-right: 35px;*/
}

.loginForma,
.registrationForma {
    text-align: left;
    width:100%;
}

.regForma {
    padding-left: 45px;
    border-left: 1px solid #efefef;
}

::-moz-placeholder {
    font-size: 14px;
}

::placeholder {
    font-size: 14px;
}

.forma-kontakt ul {
    display: flex;
    align-items: center;
    margin-bottom: 60px;
}

    .forma-kontakt ul li {
        padding-left: 0 !important;
        display: flex;
        align-items: center;
        flex-direction: row;
        margin-right: 30px;
    }

        .forma-kontakt ul li img {
            height: 20px;
            width: 20px;
            border-radius: 0;
            margin-right: 10px;
            margin-bottom: 0;
        }

        .forma-kontakt ul li::before {
            display: none !important;
        }

/*foto galerija*/
.fotogalerija {
    display: flex;
    margin-bottom: 30px;
}

    .fotogalerija .swiper-slide {
        width: 320px;
    }

    .fotogalerija img {
        border-radius: 16px;
    }

.lg-next, .lg-prev {
    background: url(../img/color.jpg);
    background-size: cover;
    padding: 10px;
    border-radius: 50%;
    color: #fff;
}

.lg-backdrop.in {
    opacity: 0.85;
}

.pagiancija {
    text-align: center;
}

.pagination {
    margin: 30px auto !important;
    list-style-type: none;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

    .pagination li {
        padding-left: 0;
    }

        .pagination li::before {
            display: none;
        }

    .pagination .page-item .page-link {
        font-size: 15px;
        font-family: "Roboto-Regular";
        border: none;
        color: #000;
    }



    .pagination .page-item a:hover {
        background: none;
        color: #ED1B25;
    }

    .pagination .page-item .page-link:focus {
        background-color: transparent;
        box-shadow: 0px 0px 5px rgba(237, 27, 37, 0.2);
    }


.active > .page-link, .page-link.active {
    background-color: transparent;
}

.pagination .page-item.active a {
    color: #ED1B25;
    border-bottom: 2px solid #ED1B25;
}


.field-error {
    border: 1px solid rgba(237, 27, 37, 0.4) !important;
    outline: none;
    box-shadow: 0px 0px 10px rgba(237, 27, 37, 0.4) !important;
}

.alert-danger.msg-error {
    padding: 0px 0 0 0px;
    border: none;
    background-color: transparent;
    color: #ED1B25;
    font-size: 0.75rem;
    margin-top: 7px;
}


#privolaError2 {
    padding: 0px 0 0 0px;
    border: none;
    background-color: transparent;
    color: #ED1B25;
    font-size: 0.75rem;
}

.alert-danger {
    color: #ED1B25;
    background-color: transparent;
    border: none;
    font-size: 1.5rem;
    text-align: left;
    padding: 0;
    margin-bottom: 30px;
}

/*.alert-success {
    color: #146c43;
    background-color: transparent;
    border: none;
    padding: 0;
    font-size: 1.5rem;
    text-align: left;
    margin-bottom: 30px;
}*/

.floatKontakt {
    display: flex;
    position: fixed;
    top: 50%;
    left: calc(100% - 35px);
    border-radius: 8px 0px 0px 8px;
    background-image: url(../img/sarena-refularshape.jpg);
    background-size: cover;
    max-height: 100px;
    overflow: hidden;
    z-index: 99;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 3s ease-in-out;
}

.floatKontakt.wide {
    left: unset;
    right: 0;
}


.floatKontakt .floatIkone {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5px;
    justify-content: space-around;
    width: 40px;
}

.floatIkone img {
    filter: invert(100%);
    height: 25px;
    width: 25px;
    cursor:pointer;
}

.floatKontakt.wide .floatIkone {
    display: none;
}

.floatImg {
    width: 60px;
}

.floatImg img {
    height: 100%;
    width: auto;
    max-width: 80px;
    cursor: pointer;
}

.floatKontakt ul {
    width: 80%;
    list-style-type: none;
    margin: 0;
    padding: 7px 7px 7px 15px;
}

        .floatKontakt ul li {
            color: #ffffff;
            font-size: 15px;
            line-height: 22px;
            white-space:nowrap;
        }

            .floatKontakt ul li:first-child {
                font-weight: bold;
            }

            .floatKontakt ul li a {
                text-decoration: none;
                color: #ffffff;
                position: relative;
            }

                .floatKontakt ul li a:hover {
                    opacity: 0.8;
                    color: #ffffff;
                }

        .floatKontakt ul .telNum a, .floatKontakt ul .email a {
            padding-left: 23px;
        }

            .floatKontakt ul .telNum a::before {
                position: absolute;
                display: inline-block;
                content: "";
                width: 15px;
                height: 15px;
                background: url(../img/ios-telephone-outline.svg);
                background-size: 100% 100%;
                left: 0;
                top: 0;
                filter: invert(100%);
            }

            .floatKontakt ul .email a::before {
                position: absolute;
                display: inline-block;
                content: "";
                width: 15px;
                height: 15px;
                background: url(../img/ikona-email.svg);
                background-size: 100% 100%;
                left: 0;
                top: 2px;
                filter: invert(100%);
            }

.floatKontakt .floatClose {
    display: block;
    position: relative;
    top: 5px;
    right: 10px;
    cursor: pointer;
}

.floatKontakt .floatClose img {
    filter: brightness(1000%);
}


/*templates*/
.resultNumbers {
    margin: 30px auto 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}

.resultSingle {
    /*  padding:25px; */
    border-radius: 10px;
    /* margin: 25px 0px 0px 0; */
    border-radius: 16px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, .15);
    width: auto;
    padding: 16px 30px;
    margin: 0 8px 8px 0;
}

.resultBroj {
    position: relative;
    color: #ED1B25;
    font-size: 32px;
    padding: 0 0 8px 0;
    font-family: 'Roboto-Black';
    font-weight: 900;
}

    /*.resultBroj::after {
        content: "";
        width: 3px;
        height: 35px;
        background-color: #EFEFEF;
        position: absolute;
        right: 0px;
        top: 15px;
    }*/


.resultSingle:last-child .resultBroj::after {
    display: none;
}

.resultDescription {
    font-size: 16px;
    line-height: 1.2;
}

.dvaJedanStupac {
    position: relative;
}

    .dvaJedanStupac .row .col-md-6:first-child {
        padding-right: 35px;
    }

    .dvaJedanStupac .row .col-md-6:nth-child(2) {
        padding-left: 35px;
    }

    .dvaJedanStupac::before {
        position: relative;
    }

.inner-content .lajsnaTemplate {
    border-radius: 0;
    margin-bottom: 90px;
    width: 100%;
}

.dvaStupca h3:not(.predlozakCaseStudy .dvaStupca h3), .hasAfter h3, .predlozakCaseStudy h2 {
    position: relative;
    margin-bottom: 40px;
}

.dvaStupca h3:not(.predlozakCaseStudy .dvaStupca h3)::after, .hasAfter h3::after, .predlozakCaseStudy h2::after {
    content: "";
    display: inline-block;
    width: 70px;
    height: 7px;
    background-image: url(../img/color-line.png);
    background-size: 100% 100%;
    background-position: center;
    position: absolute;
    bottom: -20px;
    left: 0;
}

.dvaStupcaBorder {
    margin-top: 40px;
}

    .dvaStupcaBorder .borderBox {
        border-radius: 16px;
        border: 1px solid #E2E2E2;
        padding: 45px;
        height: 100%;
    }

.inner-content .dvaStupcaBasic .noDecor {
    margin: 0;
    padding: 0;
}

    .inner-content .dvaStupcaBasic .noDecor li {
        list-style-type: none;
        display: flex;
        align-items: center;
        padding-left: 0px !important;
        margin-bottom: 20px;
    }

        .inner-content .dvaStupcaBasic .noDecor li::before {
            display: none !important;
        }

        .inner-content .dvaStupcaBasic .noDecor li img {
            margin-right: 15px;
            margin-bottom: 0;
        }


.tags, .shareSocial {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:30px;
}

.tags span {
    display: inline-block;
    position: relative;
    padding-left: 25px;
    margin-right: 10px;
    margin-bottom: 10px;
}


.tags span::before {
    display: inline-block;
    content:"";
    width: 20px;
    height: 18px;
    position: absolute;
    left: 0;
    top:4px;
    background-image: url(../img/ios-pricetag-outline.svg);
    background-size:100% 100%;
}

.tags ul, .shareSocial ul {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}
.tags ul li {
    list-style-type: none;
    padding: 0px 15px;
    border-radius: 50px;
    border: 1px solid #cecece;
    margin-right: 7px;
    margin-bottom: 7px;
    font-size: 14px;
}

.shareSocial span {
    display: inline-block;
    position: relative;
    margin-right: 10px;
    margin-bottom: 10px;
}

.shareSocial ul li {
    position:relative;
    top:-3px;
    padding-left:0 !important;
}

.shareSocial ul li a {
    width: 35px;
    height: 35px;
    border-radius: 50px;
    background-color: #ED1B25;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    transition: 0.2s all ease-in-out;
    padding: 8px;
}

.shareSocial ul li a:hover {
    background-color: #D91016;
}

.shareSocial ul li a img {
    height: 20px;
    margin-bottom: 0;
    border-radius: 0px;
}

.author{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    flex-wrap:wrap;
    
}

.predlozakCaseStudy,
.predlozakOnama,
.predlozakUslugeNovi,
.prednosti
 {
    margin-top: 60px;
}

.naslovFilterWrap {
    margin-top: 30px;
}

.naslovFilterWrap.blogFilterWrap{
    display:none;

}

.predlozakCaseStudy .author {
    margin-bottom: 30px;
    flex-direction: row-reverse;
}

.authorLink:hover {
    color: #000000 !important;
}

.autorWrap {
    font-size:14px;
    line-height:17px;
    text-align:right;
    padding:15px 0px;
}

.predlozakCaseStudy .autorWrap {
    text-align: left;
}

.autorWrap div:last-child {
    color: #8A8888;
}

.autorSlika {
    display: flex;
    width: 70px;
    height: 70px;
    text-align: center;
    overflow: hidden;
    border-radius: 50%;
    margin-left: 15px;
}

.predlozakCaseStudy .autorSlika {
    margin: 0 15px 0 0;
}

.autorSlika img,
.slikaAutoraVelika img {
    border-radius: 0;
    width: 100%;
    height: auto;
    margin-bottom: 0;
    object-fit:cover;
}

.autorProfile {

    margin-bottom:60px;
    padding:30px 0;

}

.slikaAutoraVelika {
    border-radius: 50%;
    overflow: hidden;
    margin-right: 25px;
}

.oAutoru {

padding:30px 0 0 0;

}

.autorSocial {
    margin: 30px 0 15px 0;
}
/*pozadine ispravak*/
.bg {
     position:relative;
     padding:150px 0;
     margin:90px 0;
}

.bg::before {
    display: inline-block;
    content: "";
    position: absolute;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background-image: url(../img/bijelaLajsnaGornja.svg);
    background-size:100% 100%;
    background-repeat:no-repeat;
}

.bg::after {
    display: inline-block;
    content: "";
    position: absolute;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background-image: url(../img/bijelaLajsnaDonja.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.bg.color {
    background-image: url(../img/sarena-refularshape.svg);
    background-size: cover;
    color:#ffffff;
}

.bg.svijetloSiva {
    background: #F8F8F8;
}

.boxBorder {
    border: 1px solid #E2E2E2;
}

.cardsSection {
    padding-top: 30px;
}

.cardsSection .cards {
    border-radius: 16px;
}

.cards {
    background-color: #ffffff;
    padding: 50px 35px;
    height: 100%;
    overflow: hidden;
    color: #000;
    justify-content: flex-start;
    margin: 0 0 30px 0;
}

.modulBox.cards {
    background-color: #ffffff;
    padding: 50px 35px;
    height: 100%;
    overflow: hidden;
    color: #000;
    justify-content: flex-start;
    margin: 0 0 30px 0;
    position: relative;
}

.cards .partnerBadge {
    font-size: 40px;
    font-weight: bold;
    text-transform: uppercase;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    padding: 35px;
    border-radius: 50%;
    justify-content: center;
    margin: 0 auto 30px auto;
    width: 125px;
    height: 125px;
    white-space: nowrap;
    color: #fff;
}

.partnerBadge.wl {
    background-color: #ED0B75;
}

.partnerBadge.cd {
    background-color: #F53641;
}

.partnerBadge.dr {
    background-color: #FA521D;
}

.cards h3, .cards h5 {
    text-align: center;
}

.cards ul li {
    padding-left: 25px;
    position: relative;
    line-height: 30px;
}

.cards ul li::before {
    display: inline-block;
    position: absolute;
    left: 5px;
    top: 7px;
    content: "";
    width: 7px;
    height: 13px;
    border-bottom: 2px solid #ed1b25;
    border-right: 2px solid #ed1b25;
    transform: rotate(45deg);
    border-radius: 0;
    background: none;
}

.decoration {
    position: relative;
}

.decoration::before {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    right: -30px;
    bottom: -70px;
    background: url(../img/slovo-a-sekcija.svg);
    background-size: 100% 100%;
    z-index: 0;
}

.cardsContent {
    position: relative;
    z-index: 2;
}

.banner {

margin:60px 0px;

}

.spremniSuradnja {
    margin: 0 auto;
    text-align: center;
}

.spremniSuradnja .btn-primary {
    margin: 0 auto;
}

.modalPrijava {
    display:none;
}

    .modalPrijava.show {
        position: fixed;
        top: 0px;
        left: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.4);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
        overflow-y: auto;
        height: 100%;
    }

.modalRegistration {
    display: none;

}

    .modalRegistration.show {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.4);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
        overflow-y: auto;
        height: 100%;
    }

.modalHvala {
display: none;
}

.modalHvala.show {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0,0,0,0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
    overflow-y: auto;
    height: 100%;
}

.modalWebPod {
    display: none;
}

    .modalWebPod.show {
        position: fixed;
        top: 0px;
        left: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.4);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
        overflow-y: auto;
        height: 100%;
    }

    .PrijaviteSeLink{
        text-align: left !important;
        color: red;
    }

.modalArbonaUpit {
    display: none;
}

    .modalArbonaUpit.show {
        position: fixed;
        top: 0px;
        left: 0;
        width: 100%;
        background-color: rgba(0,0,0,0.4);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
        overflow-y: auto;
        height: 100%;
    }

.modalArbonaUpit .quickInfo ul {
    justify-content: center;
    align-items: center;
    margin-bottom:0;
}

.modalArbonaUpit .modalContent{
    text-align:left;
}

.modalArbonaUpit .inner-content h4,
.modalArbonaUpit .inner-content p {
    text-align: center;
}

.modalArbonaUpit .modalContent .btn-primary{
 width:100%;

}

.modalArbonaUpit .forma-kontakt .row:last-child .form-group {
    margin-bottom:0;
}

.PrijaviteSeLink {
    text-align: left;
    color: red;
}


.modalCallMe {
    display: none;
}

.modalCallMe.show {
    position: fixed;
    top: 0px;
    left: 0;
    width: 100%;
    background-color: rgba(0,0,0,0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
    overflow-y: auto;
    height: 100%;
}

.modalContent {
    padding: 45px 35px 35px 35px;
    background-color: #ffffff;
    position: absolute;
    border-radius: 16px;
    display: flex;
    /*justify-content: center;*/
    align-items: center;
    flex-direction: column;
    max-width: 700px;
    text-align:center;
    top:35px;
    overflow-y:auto;

   
}

.modalContent .kontaktForma {
    margin-bottom: 0;
    width: 100%;
}

.modalContent.afterBlog {
    top: 0;
    border: 1px solid #000000;
    margin: 0 auto 60px auto;
    max-width: unset;
}

    .modalContent.afterBlog .modalContactPerson{
        font-size:18px;
    }

    .modalContent.afterBlog .tick {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

        .modalContent.afterBlog .tick li {
            margin-right:25px;
         }

        .modalHeader {
            display: flex;
            justify-content: space-evenly;
            align-items: center;
        }

.modalHeader .logoModal.short{
    width:70px;
    margin-right:15px;
}

.modalContent h4 {
    margin-bottom: 15px;
}

.modalContent .tick{
    column-count:2;
}

.modalContactPerson p{
    margin:0px 0 30px 0;
}

.modalContactPerson .row{
    align-items:center;
}

.modalContactInfo h5 {
    margin-bottom: 0px;
}

.modalPerson img{
    border-radius:16px;
}

.modalContent .btn-primary {
    height: unset;
    white-space:normal;
    line-height:1.2;
}
.modalContent .btn-primary:hover {
    height: unset;
    white-space: normal;
    line-height: 1.2;
}

.modalContactPerson .btn-primary{
    width:100%;
}

.modalContactInfo a {
    color: #000;
    text-decoration: none;
    white-space: nowrap;
}

.modalContactInfo a:hover{
    color:#ED1B25;
}


.modalContent .forgottenPass {
    text-decoration: none;
    font-weight: bold;
    color: #000;
    width: 100%;
}

.modalContent .prijaviSe {
    width: 100%;
    text-align: center;
    background-color: #cf1921;
    border-color: #cf1921;
}

.modalContent a{
    color:#000000;
    text-decoration:none;
    transition:all 0.2s ease-in-out;
}

.modalContent a:hover{
    color:#ED1B25;
}

.modalContent p {
    text-align: center;
}

.modalContent .registrirajSe {
    width: 100%;
}

.modalContent .googleLogin,
.modalContent .facebookLogin {
    text-align: center;
    position: relative;
    width: 48%;
}

.modalContent .googleLogin img,
.modalContent .facebookLogin img {
    height: 25px;
    width: auto;
    margin-right: 10px;
}

.modalContent .googleLogin:hover img,
.modalContent .facebookLogin:hover img{
    filter:invert(1);
}

.loginForma .btn-primary {
    margin: 0;
    background-color: #ED1B25;
    border: 1px solid #ED1B25;
    color: #fff;
    display: inline-block;
    width: -moz-fit-content;
}

.loginForma .btn-primary:hover {
    background-color: transparent;
    border: 1px solid #000000;
    color: #000000;
}

.closeModal {
    position: absolute;
    right: 25px;
    top: 25px;
    cursor: pointer;
}

.logoModal {
    width:180px;
    margin-bottom: 30px;
}


.clanstvo {
    background-color:#fff;
    border-radius:16px;
    max-width:500px;
    margin:60px auto;
    color:#000;
    padding:35px;
    text-align:center;
}

.tipClanstva {
    width:125px;
    height:125px;
    color:#fff;
    font-size:55px;
    font-weight:bold;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color:#ED1B25;
    border-radius:50%;
    margin:0 auto 30px auto;

}

.clanstvo ul {
    margin:30px 0;
    padding:0;
}

.tick {
    margin: 15px 0;
    padding: 0;
}

.clanstvo ul li, .tick li {
    list-style-type:none;
    padding-left:20px;
    position:relative;
    text-align:left;
    margin-bottom:10px;
}

.clanstvo ul li::before, .tick li::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 5px !important;
    left: 0px !important;
    width: 7px !important;
    height: 13px !important;
    border-bottom: 2px solid #ED1B25;
    border-right: 2px solid #ED1B25;
    transform: rotate(45deg);
    border-radius: unset !important;
    background-color: transparent !important;
}

.cijenaClanstva {
    color: #ED1B25;
    font-size:35px;
    font-weight:bold;
    margin-bottom:15px;
}

.clanstvo .btn-primary {
    margin:30px auto;
    text-decoration:none;
}

.videoTestmonials .imePolaznika,
.videoTestmonials .tvrtkaPolaznika {
    font-weight: bold;
    font-size: 20px;
}

.videoTestmonials .swiper-wrapper{
    display:flex;
}

.videoTestmonials .swiper-slide{
    display:inline-block;
    width:460px;
    margin-right:25px;
    text-decoration:none;
    cursor:pointer;
    margin-bottom:60px;
}

.videoTestmonials .swiper-slide img {
    border-radius: 16px;
    overflow: hidden;
}


.clipBox {
    max-height: 500px;
    overflow: hidden;
    position: relative;
}

.clipBox::after {
    display: inline-block;
    content: "";
    width: 100%;
    height: 30px;
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 31%, rgba(255,255,255,0.8267682072829132) 47%, rgba(255,255,255,0.5466561624649859) 72%, rgba(255,255,255,0) 92%);
    position: absolute;
    left: 0;
    bottom: 0;
}

#vrcMeda {
    position: absolute;
    left: -9999px;
    opacity: 0;
    height: 0;
    width: 0;
    overflow: hidden;
    pointer-events: none;
}

.captchaDigit {
    text-decoration: underline;
    text-decoration-color: #b5b5b3;
    text-decoration-thickness: 2px;
    position: relative;
    top: -1px;
    margin-left: 2px;
    font-size: 16px;
}

.captchaWrap {
    display: inline-block;
    padding-left: 5px;
    letter-spacing: 3px;
}

    .captchaWrap img {
        width: 65px;
        height: auto;
        position: relative;
        top: -2px;
    }

.dorucakPrijavaForma {
    margin-top: 60px;
    margin-left: -2px;
    width: 90%;
}

.ArbonaDorucakText {
    padding: 0px 30px 0 0;
}

.emptySpaceDesktop {
    display: block;
}

.emptySpaceMobile {
    display: none;
}

.modulBox ul {
    text-align: left;
    max-width: 75%;
    margin: 15px auto 0 auto;
}

.modulBox ul a {
    color: #000;
    text-decoration: underline;
    transition: all .3s ease-out;
}

.modulBox ul a:hover {
    opacity: .7;
}

.modul-price {
    margin: 15px 0 0 0;
    font-weight: bold;
    font-size: 20px;
}


.flip{
    display:flex;
    margin-bottom:60px;
}

.flipImgBox{
    width:30%;
    
}

.flipImgBox img {
    object-fit: cover;
    height:100%;
}

.flipText{
    width:70%;
    padding:0 0 0 90px;

}

.flipSides .flip:nth-child(odd) {
    flex-direction: row-reverse;
}

.flipSides .flip:nth-child(odd) .flipText {
    padding: 0 90px 0 0;
}

.faqSection .accordion-button:not(.collapsed)::after {
    display: inline-block;
    content: "";
    width: 25px;
    height: 25px;
    background-size: 100% 100%;
    background-position: center center;
    position: absolute;
    top: 13px;
    right: 15px;
    background-image: url(../img/icon-minus.svg);
    transform: none;
    transition: all 0.2s ease-in-out;
}


.faqSection .accordion-button.collapsed::after {
    display: inline-block;
    content: "";
    width: 25px;
    height: 25px;
    background-size: 100% 100%;
    background-position: center center;
    position: absolute;
    top: 13px;
    right: 15px;
    background-image: none;
    background-image: url(../img/icon-plus.svg);
    transform: none;
    transition:all 0.2s ease-in-out;
}

.predlozakBlogNovi .heroImage {
    margin: 0 auto 60px auto;
    text-align: center;
    padding:0 15px;
}

aside{
    margin-bottom:60px;
}

aside h4 {
    margin-bottom: 15px;
}


.tableOfContent, .recommendedRead, .tagoviBox {
    border-radius: 16px;
    padding: 25px 20px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
    margin-bottom: 30px;
    background-color: #ffffff;
}



.tableOfContent ol li a,
.tableOfContent ul li a {
    color: #000;
    text-decoration: none;
}

.tableOfContent ol li a:hover,
.tableOfContent ul li a:hover {
    color: #ED1B25;
}

.recommendedRead .imgBox{
    margin-bottom:15px;
}

.recommendedRead .blogCategory{
    text-transform:uppercase;
    font-weight:600;
    line-height:normal;
    margin-bottom:10px;
}

.recommendedRead .blogTitle {
    line-height: 1.4;
    font-weight: 600;
    margin-top:7px;
}

.tagoviBox ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}

.tagoviBox ul li{
    color:#ED1B25;
    border:1px solid #ED1B25;
    border-radius:50px;
    padding:0px 10px;
   /* min-width:60px;*/
   white-space:nowrap;
    text-align:center;
    margin: 0 10px 10px 0;
    transition: all 0.2s ease-in-out;
}

.tagoviBox ul li a{
    color:#ED1B25;
    text-decoration:none;
}

.tagoviBox ul li:hover{
    background:#ED1B25;
    
}

.tagoviBox ul li:hover a {
    color: #ffffff;
}

article{
    padding:0 0 0 25px;
}

article h1{
    margin-bottom:30px;
}

/*article h3 {
    font-family: 'Roboto-Regular';
}*/

article .authorAndTimeStamp {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.authorAndTimeStamp .author {
    display: flex;
    align-items: center;
    width: fit-content;
    margin-bottom: 15px;
}

.authorAndTimeStamp .autorSlika {
    order: 1;
    margin-right: 15px;
}

.authorAndTimeStamp .autorWrap {
    order: 2;
    text-align:left;
   
}

.authorAndTimeStamp .authorLink {
    text-decoration: none;
    color: #000;
    
}

.dateAndTime,
.dateAndIcon, 
.timeAndIcon{
    display: flex;
    align-items: center;
    white-space:nowrap;
}

.dateAndIcon{
    margin-right:15px;
}

.dateAndIcon img, .timeAndIcon img{
    margin-right:5px;
}

.announcement {
    border-radius: 16px;
    background-color: #fee5e8;
    padding: 25px;
    margin-bottom: 30px;
}

article section {
    margin-bottom: 30px;
}


.accordion-body a {
    color: #D91016;
}

.accordion-body a:hover{
    color:#000;
}

.podnaslov-h3 {
    font-family: 'Roboto-Regular';
    font-size: 2rem;
}

.predlozakBlogNovi .heroImage picture img{
    border-radius:16px;
}

.izdvojeni {
    margin: 0 0 40px 0;
}

.blogTitle {
    font-family: 'Roboto-Medium';
}

.recommended-tagovi-mobile {
    display: none;
}

.tableOfContent-inner ul {
    list-style: none;
    padding-left: 0;
}

/* 404 */

.fOf404 ul{
    list-style-type:none;
    margin:0;
    padding:0;
    column-count:2;
    
}

.fOf404 ul li{
    margin-bottom:20px;
    padding-left:0 !important;
   
}

.fOf404 ul li a {
    display: flex;
    line-height:24px;
    align-items:center;
}

.fOf404 ul li a img {
    height:40px;
    margin-right: 20px;
    border-radius: 0;
}

.fOf404 ul li::before {
    display: none;
}

.buttons404 {
    margin:0 auto;
    display:flex;
    flex-direction:column;
    width:fit-content;
   
}

.buttons404 a {
    text-align: center;
    margin-bottom:15px;
    font-size:18px;
}

.buttons404 a:hover{
    transform:scale(1.07);
}

.buttons404 a:first-child {
    border-radius: 50px;
    background-color: #ED1B25;
    color: #ffffff;
    min-width: 300px;
    padding: 10px 35px;
}

.buttons404 a:last-child {
    border-radius: 50px;
    border:2px solid #000000;
    background-color: #ffffff;
    color: #000000;
    min-width: 300px;
    padding: 10px 35px;
}

.f0f-unchangeable {
    margin-top: 60px;
}

.iframeWrap{
    padding-bottom:56.25%;
    position:relative;
    margin-bottom:30px;
}

.iframeWrap iframe {
    position:absolute;
    width:100%;
    height:100%;
}

/* akademija slider */



.akademijaSlider .swiper-wrapper {
    align-items: stretch;
    padding-bottom:90px;
}

.akademijaSlider .swiper-slide {
    max-width: 400px;
    height: auto;
    align-items: stretch;
}

.akademijaSlider .swiper-button-next, .akademijaSlider .swiper-button-prev {
    border-color:#000000;
}

.akademijaSlider .swiper-button-next::after, .akademijaSlider .swiper-button-prev::after{
    filter:invert(1);
}

/* moduls grid - akademijaModuli */
.modules .icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.modules {
    padding: 92px 0 112px;
}

.modules__title {
    font-size: 44px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 52px;
}

.modules__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--grid-gap);
}

/* ==========================================================================
   Module card
   ========================================================================== */
.module-card {
    display: flex;
    flex-direction: column;
    min-height: 378px;
    padding: var(--card-padding);
    background-color: var(--color-white);
    border-radius: 0 var(--card-radius) 0 var(--card-radius);
    box-shadow: 0 0 0 1px var(--color-border);
    transition: transform var(--transition), box-shadow var(--transition);
}

.module-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.06);
}

.module-card__head {
    
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-border);
}

.module-card:not(.module-card--featured) .module-card__head a {
    color: var(--color-red);
    text-decoration: none;
}



.module-card__label {
    display: block;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-red);
}

.module-card__title {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 0;
    
}

.module-card__info {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 24px 0 0 0;
    font-size: 16px;
    color: var(--color-text-muted);
}

.module-card__info li {
    display: flex;
    align-items: center;
    gap: 14px;
}

.module-card__info .icon {
    color: var(--color-red);
}

.module-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: auto;
    padding-top: 32px;
}

.module-card__price {
    font-size: 16px;
    font-weight: 500;
}

.module-card__price strong {
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
}

.module-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--gradient-btn);
    color: var(--color-white);
    transition: transform var(--transition), box-shadow var(--transition);
}

.module-card__btn:hover {
    transform: translateX(4px);
    box-shadow: 0 8px 16px rgba(229, 21, 90, 0.35);
}

/* Featured card (Svi moduli) */
.module-card--featured {
    background: var(--gradient-featured);
    color: var(--color-white);
    box-shadow: none;
}


.module-card--featured .module-card__head a {
    color: #ffffff;
    text-decoration: none;
}

.module-card--featured .module-card__label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.module-card--featured .module-card__label {
    margin-bottom: 0;
    color: var(--color-white);
}

.module-card__badge {
    padding: 4px 12px;
    border-radius: 20px;
    background-color: var(--color-white);
    font-size: 13px;
    font-weight: 600;
    color: var(--color-red);
    white-space: nowrap;
}

.module-card--featured .module-card__head {
    border-bottom-color: rgba(255, 255, 255, 0.3);
}

.module-card--featured .module-card__info,
.module-card--featured .module-card__info .icon {
    color: var(--color-white);
}

.module-card--featured .module-card__btn {
    background: var(--color-white);
    color: var(--color-red);
}

.module-card--featured .module-card__btn:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   Contact card
   ========================================================================== */
.contact-card {
    grid-column: span 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 48px 80px 48px 56px;
    background-color: var(--color-white);
    border-radius: 0 var(--card-radius) 0 var(--card-radius);
    box-shadow: 0 0 0 1px var(--color-border);
}

.contact-card a:not(.btn-primary){
    color:var(--color-red);
}

.contact-card__text {
    max-width: 360px;
    font-size: 27px;
    font-weight: 500;
    line-height: 1.3;
    font-weight:600;
}

.contact-card__details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
}

.contact-card__list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.contact-card__list li {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 18px;
    font-weight: 700;
    color: var(--color-red);
    white-space: nowrap;
}

.contact-card__list .icon {
    width: 16px;
    height: 16px;
}

.contact-card__list a:hover {
    text-decoration: underline;
}



@media all and (min-width: 1440px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1360px;
    }
}


@media all and (min-width: 1640px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1560px;
    }
}


@media all and (max-width:1440px) {
    .hp-ikone a:nth-child(4),
    .hp-ikone a:nth-child(5)
    /* .i-4,
    .i-5  */ {
        width: 50%;
    }

    .logoWrap {
        width: 220px;
    }

    .sekcijaText {
        margin-bottom: 100px;
    }

    .rezultatiSlider .swiper-wrapper {
        padding-bottom: 0;
    }

    .rezultatiUsluge {
        padding: 70px 0px 0px 0px;
    }
}


@media all and (max-width:1400px) {

    header {
        flex-wrap: wrap;
    }

    .logoWrap {
       /* width: 100%;*/
        text-align: center;
    }


    .menu li a {
        font-size: 16px;
    }

    .search-icon {
        width: 23px;
        height: 23px;
    }

    .verticalImgBoxLeft img {
        max-width: 53%;
    }

        .verticalImgBoxLeft img:nth-child(2) {
            left: 30px;
            top: 100px;
        }

    .verticalImgBoxRight img:first-child {
        right: 30px;
    }


    .sekcijaText {
        margin-bottom: 65px;
    }

        .sekcijaText.blank {
            padding-right: 50px;
        }

    .verticalImgBoxRight {
        padding: 0;
    }

    .blogoviSlider a,
    .knjiznicaSlider a {
        width: 390px;
    }

    .naslov {
        font-size: 22px;
    }

    .iznos .eur {
        font-size: 1.3rem;
    }
}

@media all and (max-width:1399px) {

   
	
    .cijenaBox {
        padding: 25px;
    }

   /* .mb-60 {
        margin-bottom: 00px;
    }*/

    /* .menu li a {
        padding: 12px 12px;
    } */


    .logoWrap img {
        width: 200px;
    }

    .menu {
        top: 10px;
    }

	.menu li a{
		    padding: 15px 11px;
	}

    .menu li .kontakt {
        padding: 5px 28px;
        margin: 0px 5px;
        top: -9px;
    }

    .userBox {
        position:relative;
        top:-2px;
    }

    .lang::after {
        right: -3px;
        top: 22px;
    }

    .polazItem {
        padding-left: 30px;
    }

    .dorucakPrijavaForma {
        margin-top: 10px;
    }
}

@media (max-width: 1280px) {
    :root {
        --gutter: 40px;
        --grid-gap: 20px;
    }

    .contact-card {
        padding: 48px;
    }
}


    @media all and (max-width:1199px) {

        nav {
            margin: unset;
        }

        .naslovFilterWrap.blogFilterWrap {
            margin-top: 0;
        }

        .showMobile,
        .naslovFilterWrap.blogFilterWrap {
            display: block;
        }

        .userSwitchMobile {
            display: block;
        }

        .showDesktop {
            display: none;
        }


        .logoWrap {
            width: 200px;
        }

        .btn-search::after {
            top: 16px;
        }

        .menu .has-submenu:hover .submenu {
            display: none;
        }


        .menu li a {
            padding: 15px 9px;
            font-size: 15px;
        }

        .menu li .kontakt {
            padding: 5px 20px;
            margin: 0px 10px;
            top: -10px;
        }

        .submenu li a {
            padding: 0;
        }

        .lang::after {
            right: -5px;
            top: 21px;
        }

        .videoBox {
            height: 450px;
        }

        h1 {
            font-size: 2.8rem;
            margin-bottom: 30px;
        }

        h2 {
            font-size: 2.4rem;
            margin-bottom: 30px;
        }

        h3 {
            font-size: 2.2rem;
            margin-bottom: 30px;
        }

        h4, .quickInfo h2 {
            font-size: 1.77rem;
            margin-bottom: 15px;
        }

        h5 {
            font-size: 1.33rem;
            margin-bottom: 15px;
        }

        h6 {
            font-size: 1rem;
            margin-bottom: 15px;
        }

        .replayVid {
            bottom: -90px;
            width: 65px;
            height: 65px;
        }


        .main-title h1 {
            font-size: 3rem;
            font-family: "Roboto-Bold";
        }

        .main-title h2 {
            font-size: 2.7rem;
            font-family: "Roboto-Light";
        }

        .mainSub-title h1 {
            font-size: 2.9rem;
        }

        .mainSub-title h2 {
            font-size: 1.9rem;
        }

        .main-title a {
            font-size: 1.125rem;
            padding: 12px 40px;
        }

        .flex {
            flex-wrap: wrap;
        }

        .hp-ikone a {
            width: 50%;
        }


        .verticalImgBoxLeft img:nth-child(2) {
            left: 25px;
        }

        .verticalImgBoxRight img:first-child {
            right: 25px;
        }

        .btn-primary {
            font-size: 18px;
            padding: 6px 25px;
        }


        .bg-tamnoSiva::after {
            bottom: -14%;
            transform: rotate(1deg);
            right: -8%;
        }

        .sekcijaText.blank {
            padding-left: 0px;
            margin-bottom: 30px;
            height: fit-content;
        }

        .certifikati ul {
            flex-wrap: wrap;
            justify-content: center;
        }

        .certifikati ul li {
            margin: 15px 25px 0px 0px;
        }

        .certifikati ul li img {
            width: 90%;
        }

        .reference ul li {
            height: 20px;
        }

        .seeAll {
            font-size: 16px;
        }

        .blogoviSlider a,
        .knjiznicaSlider a {
            width: 350px;
        }

        .newsletter .flex {
            flex-wrap: nowrap;
        }

        .newsletter input[type="email"] {
            width: 100%;
        }

        .copyLinks ul li {
            margin-right: 15px;
        }

        /* .subpageImg {
        height: 400px;
    }*/

        .filterBtn {
            padding: 10px 20px;
        }

        .customBlokovi .flex {
            flex-wrap: nowrap;
        }

        .naslovFilterWrap {
            margin-bottom: 30px;
        }

        .naslov {
            font-size: 18px;
            line-height: 1.3rem;
        }

        .modulBox {
            padding: 25px;
        }

        .sekcijaText2 {
            padding-right: 0;
        }

        .hp-ikone a {
            max-width: unset;
        }

        .ikonaTextBox.razlog {
            margin-bottom: 15px;
        }

        .sekcijaText2.akademija {
            padding-left: 60px;
        }


        .sekcijaText2 .textMali {
            padding: 0 0 0 30px;
            margin-bottom: 30px;
        }

        .ikonaTextBox img {
            width: 90px;
        }

        .ikonaTextBox .textMali h3 {
            margin-bottom: 15px;
        }

        .cijenaBox {
            flex-direction: column-reverse;
            justify-content: flex-end;
            padding: 30px 25px;
        }

        .iznos {
            justify-content: unset;
            align-items: normal;
            padding-left: 0;
            padding-bottom: 20px;
            width: 100%;
        }

        .iznos:after {
            width: 100%;
            height: 2px;
            top: unset;
            bottom: 0;
        }

        .infos {
            padding-bottom: 0px;
            padding-top: 15px;
        }

        .opis {
            /* height: 80px; */
        }

        .infos .btn-primary {
            margin-top: 15px;
        }

        .predavaci {
            margin-bottom: 30px;
        }

        .predavaci .imgBox {
            margin-bottom: 15px;
        }

        .namePredavaca {
            font-size: 1.25rem;
        }

        .innerSection .stamp {
            left: 60%;
        }

        .inner-content p {
            margin-bottom: 30px;
        }

        .bg-svijetloSiva {
            background-size: cover;
        }

        .rezultatiSlider .sekcijaText {
            padding-right: 30px;
        }

        .swiper-button-next.rez {
            right: 0px;
        }

        .polazInfo {
            padding: 10px 15px;
            font-size: 16px;
        }

        form input:not(input[type="checkbox"]) {
            height: 45px;
        }

        .jezici .subLang {
            padding: 15px 20px 10px 25px;
            position: absolute;
            top: 50px;
            width: 80px;
            justify-content: center;
        }

        .jezici .subLang a {
            display: inline-block;
            font-size: 16px;
            /* padding: 0px 0px 15px 0px;*/
            width: 100%;
            display: inline-block;
            margin-bottom: 10px;
        }

        .mobileMenuToggler {
            display: block;
            margin: 0 0 0 15px;
        }

        .mobileMenuToggler img {
            height: 20px;
        }

        .mobile-nav {
            display: flex;
            align-items: center;
            justify-content: space-around;
            margin: 0;
            padding: 0;
            list-style-type: none;
            position: relative;
            top: 7px;
        }

        .jezici {
            position: relative;
            top: 2px;
        }

        .userBox {
            margin: 0 0 0 15px;
            position: static;
        }

        .mobile-nav .user {
            position: static;
        }

        .user img {
            height: 22px;
        }


        .lang {
            padding-right: 15px;
        }

        .lang::after {
            right: 0px;
            top: 21px;
        }

        /*  .lang.active::after {
        transform: rotate(90deg);
    }*/

        .subLang {
            top: 35px;
            right: -33px;
        }

        .searchBox {
            top: 0px;
        }

        .menu {
            position: fixed;
            display: block;
            opacity: 0;
            right: -320px;
            top: 0;
            width: 320px;
            height: 100%;
            padding: 30px 15px 30px 15px;
            overflow-y: auto;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
            background-color: #ffffff;
            z-index: 100;
            -webkit-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
            -webkit-transform: translateX(350px);
            transform: translateX(350px);
        }

        .menu li {
            display: flex;
            position: static;
            justify-content: space-between;
            flex-wrap: wrap;
            margin-right: 0;
        }

        .userSwitchMobile {
            position: relative;
        }

        .menu.active {
            right: 0px;
            opacity: 1;
            -webkit-transform: translateX(0);
            transform: translateX(0);
            -webkit-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
            padding: 50px 0px;
        }

        .dark-overlay.active {
            display: block;
            position: fixed;
            right: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(41, 1, 1, 0.85);
            z-index: 90;
        }

        .menu .close {
            display: block;
            position: absolute;
            right: 15px;
            top: 20px;
        }

        .menu li .kontakt {
            margin: 0;
            background-color: transparent;
            color: #000000;
            position: static;
            padding: 10px 15px;
        }

        .menu li .kontakt:hover {
            color: #ED1B25;
            background-color: transparent;
        }

        .menu li a {
            padding: 10px 15px;
            position: relative;
            width: fit-content;
            font-size: 16px;
            width: 80%;
        }

        .menu li .toggler {
            display: none;
        }

        .menu .has-submenu .toggler {
            width: 45px;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
            padding: 10px 15px;
        }

        .menu .has-submenu:hover .toggler {
            transform: rotate(90deg);
        }

        .menu .has-submenu.expand .toggler {
            transform: rotate(-90deg);
        }


        .menu .expand::after {
            display: none;
        }

        .mobile-nav li {
            margin: 0 0 0 15px;
        }


        .jezici {
            margin-right: 0px;
            display: flex;
            align-items: center;
            position: relative;
        }


        .subLang a::after {
            display: none !important;
        }

        .menu li .kontakt:hover {
            background-color: transparent;
        }

        .menu .cta-kontakt a::after,
        .menu .cta-kontakt.expand a::after {
            display: none;
        }

        .submenu {
            position: static;
            transform: none;
            box-shadow: none;
            padding: 0px 25px;
        }

        .submenu li a {
            padding: 5px 0px;
            margin-bottom: 9px;
            width: 100%;
        }

        .menu .has-submenu.expand > .submenu {
            display: block;
        }



        .registracija {
            right: -55px;
            top: 50px;
        }

        .registracija a {
            text-decoration: none;
            color: #000000;
            /* margin-bottom: 10px; */
        }

        .registracija a:last-child {
            margin-bottom: 0;
        }

        .modulBox.cards {
            justify-content: center;
            padding: 35px 35px;
        }

        .certifikatiSlider .swiper-slide {
            width: 200px;
            height: 120px;
            margin: 30px 30px 60px 0;
        }

        .dorucakPrijavaForma {
            margin-top: 20px;
        }

        .flipImgBox {
            width: 50%;
        }

        .flipText {
            width: 50%;
            padding: 0 0 0 60px;
        }

        .flipSides .flip:nth-child(odd) .flipText {
            padding: 0 60px 0 0;
        }
    }

@media (max-width: 1024px) {
    :root {
        --gutter: 32px;
    }

    .modules {
        padding: 64px 0 80px;
    }

    .modules__title {
        font-size: 38px;
        margin-bottom: 40px;
    }

    .modules__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 32px;
        padding: 40px var(--card-padding);
        grid-column: span 1;
    }

    .contact-card__list{
        margin:0;
        padding:0;
    }

    .contact-card__text {
        max-width: none;
    }
}

    @media all and (max-width:991px) {

        .contact-card {
            grid-column: span 2;
        }

        .module-card--featured {
            grid-column: span 2;
        }

        .pb-90-60-30 {
            padding: 60px 0;
        }


        header {
            padding: 25px 0px 30px 0px;
        }

        .cijenaBox {
            flex-direction: row;
            justify-content: space-between;
            padding: 35px;
        }

        .infos {
            padding-top: 0px;
            width: fit-content;
        }

        .iznos {
            position: relative;
            color: #000000;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding-left: 20px;
            width: fit-content;
            padding-bottom: 0px;
        }

        .iznos:after {
            width: 2px;
            height: 100%;
            left: -10px;
            top: 0;
        }

        .iznos .eur {
            font-size: 1.6rem
        }



        .trazilica {
            /* position: relative; */
            /* top: 2px; */
        }


        .search-icon {
            /* height:100%; */
            /* width:auto; */
        }






        .flex.hp-ikone {
            margin-bottom: -20px;
        }

        .textMali {
            padding: 0 15px;
        }

        .textMali h3 {
            margin-bottom: 15px;
        }

        .ikonaTextBox img {
            width: 70px;
        }

        .i-1,
        .i-2,
        .i-3,
        .i-4,
        .i-5 {
            margin-bottom: 15px;
        }

        .hp-ikone a:nth-child(4),
        .hp-ikone a:nth-child(5) {
            width: 100%;
        }

        .bg-tamnoSiva,
        .bg-sarena,
        .bg-siva,
        .bg-svijetloSiva,
        .bg-polaznici {
            background-size: cover;
        }


        .bg-sarena ul, .ul-2 ul {
            margin-bottom: 30px !important;
        }

        .bg-sarena ul, .ul-2 ul {
            margin-bottom: 30px !important;
        }

        .bg-sarena.classic {
            /*to je sareni bg sa jako malo sadržaja gdje je cover lose izveden*/
            background-size: 100% 100%;
        }

        .bg-sarena,
        .bg-tamnoSiva,
        .bg-siva,
        .bg-svijetloSiva,
        .bg-polaznici {
            padding: 60px 0;
        }

        .no-bg {
            padding: 40px 0 40px 0;
        }

        .hp-ikone a {
            width: 100%;
            max-width: unset;
        }

        .ikonaTextBox img {
            width: 100px;
        }

        .sekcijaText {
            padding-left: 0;
            margin-top: 80px;
            margin-bottom: 0;
        }

        .sekcijaText {
            margin-top: 90px;
        }

        .sekcijaText.blank {
            margin-top: 100px;
        }

        .sekcijaText2 .textMali {
            margin-bottom: 30px;
        }


        .verticalImgBoxLeft img,
        .verticalImgBoxRight img {
            max-width: 35%;
            max-height: 350px;
        }

        .verticalImgBoxRight img:first-child {
            top: 60px;
            right: 0;
            margin-right: 25px;
        }

        .verticalImgBoxLeft img:nth-child(2) {
            top: 60px;
        }

        .verticalImgBoxLeft.akademija img {
            width: 100%;
            height: auto;
        }

        .bg-slovo::before {
            width: 100%;
            height: 100%;
            left: 20%;
            bottom: -31%;
        }


        .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
            display: inline-block;
            width: 12px;
            height: 12px;
            margin: 0 8px 0 0;
        }


        .certifikati ul li {
            width: 75px;
            height: 75px;
        }

        .certifikati ul .tf500 {
            width: 200px;
            height: auto;
        }

        .reference ul li {
            width: 110px;
        }

        .reference2 ul li {
            margin: 20px 15px 20px 0px;
        }

        .reference ul li img, .reference2 ul li img {
            height: unset;
        }

        .footer1 {
            /* padding: 60px 15px 60px 15px;*/
        }

        footer {
            padding: 30px 0px 0px 0;
        }

        .footer1 ul li a {
            padding: 0px 7px;
            white-space: nowrap;
        }

        footer ul {
            margin-bottom: 25px;
        }

        .foo-social {
            margin-top: 15px;
        }

        .copyLinks ul {
            flex-wrap: wrap;
        }

        .copyLinks ul li {
            width: 100%;
            font-size: 13px;
            line-height: 23px;
            margin-right: 15px;
        }

        .customBlokovi {
            padding-bottom: 30px;
        }

        .boxStudije {
            margin-top: 15px;
        }

        .innerSection {
            padding: 0px 0;
            margin-bottom: 60px;
        }

        .go {
            width: 45px;
            height: 45px;
        }

        .go::after {
            display: inline-block;
            content: "";
            width: 15px;
            height: 15px;
            position: absolute;
            left: 15px;
            top: 15px;
            background-image: url(../img/arrow-white.svg);
            background-size: 100% 100%;
        }

        .modulBox h4 {
            margin-bottom: 15px;
        }

        .sekcijaText2.akademija {
            align-items: flex-start;
        }

        .sekcijaText2.akademija .textMali {
            margin-bottom: 0px;
        }

        .sekcijaText2.akademija .textMali h4 {
            margin-top: 30px;
        }

        .sekcijaText2.akademija .textMali h4:first-child {
            margin-top: 0px;
        }



        .sekcijaText2.akademija {
            padding-top: 30px;
            padding-left: 0;
            margin-top: 0;
        }

        .sekcijaText2 {
            padding-right: 0;
            padding-left: 0;
            margin-top: 100px;
        }

        .cijeneWrap {
            margin-bottom: 30px;
        }

        .text {
            bottom: 90px;
        }

        .naslov {
            width: 100%;
            font-size: 18px;
        }

        .klijent {
            font-size: 16px;
        }

        .innerSection .blogItem1 {
            margin-bottom: 30px;
        }

        .prednosti.bg-right {
            padding: 00px 0px 40px 0px;
        }

        .prednosti .sekcijaText {
            margin: 0 0 30px 0;
            padding: 0;
        }

        .prednosti.bg-slovo::before {
            bottom: unset;
            top: -14%;
        }

        .swiper-button-next.rez {
            top: unset;
            left: 55px;
            bottom: 0;
        }

        .sliderHolder {
            padding-bottom: 60px;
        }

        .swiper-button-prev.rez {
            left: 0px;
            top: unset;
            left: unset;
            bottom: 0;
        }

        .rezItem1 .verticalImgBoxLeft {
            padding-left: 0px;
            justify-content: center;
        }

        .innerSection .blogCategory {
            font-size: 15px;
        }

        .innerSection .blogTitle {
            font-size: 16px;
            line-height: 1.3;
        }

        .kontaktForma {
            margin-bottom: 30px;
        }

        .poslovnice ul li:first-child {
            font-size: 1rem;
            font-family: "Roboto-Bold";
            margin-bottom: 10px;
        }

        .newsletter.karijera .flex {
            flex-wrap: wrap;
        }

        .newsletter.karijera .btn-primary {
            margin-top: 15px;
        }

        .polazniciHolder {
            padding-bottom: 30px;
        }

        .polazniciSlider {
            margin-bottom: 0;
        }

        .polazniciSlider .sekcijaText2 {
            margin-top: 0;
        }

        .polazItem {
            padding-left: 0;
            max-width: unset;
        }

        .polazInfo {
            position: relative;
            width: 100%;
            font-size: 16px;
            top: -10px;
            border-radius: 0px 0 16px 16px;
            padding: 10px;
        }

        .polazniciSlider .sekcijaText2 {
            align-items: start;
        }

        .loginForma {
            margin-bottom: 30px;
        }

        .regForma, .loginForma {
            padding: 0;
            border: none;
        }

        .karijeraSpecImg2 .newsletter .flex {
            flex-wrap: wrap;
        }

        .karijeraSpecImg2 .newsletter .btn-primary {
            margin-top: 15px;
        }

        .inner-content img {
            /*margin-bottom: 15px;*/
        }


        .alert-danger, .alert-success {
            font-size: 1rem;
            margin-bottom: 15px;
        }
        /*floatKontakt*/

        .floatKontakt ul {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .floatKontakt ul li {
            font-size: 13px;
            line-height: 18px;
        }


        .floatKontakt .floatIkone {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 5px;
            justify-content: space-around;
            width: 40px;
        }

        .floatIkone img {
            filter: invert(100%);
            height: 25px;
            width: 25px;
        }

        .floatImg img {
            height: 100%;
            width: auto;
            max-width: 80px;
            cursor: pointer;
        }

        .resultBroj {
            font-size: 35px;
        }

        .verticalImgBoxRight {
            justify-content: center;
        }

        .dvaJedanStupac .row .col-md-6:first-child {
            padding-right: 15px;
        }

        .dvaJedanStupac .row .col-md-6:nth-child(2) {
            padding-left: 15px;
        }

        .author {
            justify-content: flex-start;
            width: fit-content;
        }

        .authorLink {
            display: inline-block;
        }

        .autorSlika img,
        .slikaAutoraVelika img {
            margin-bottom: 0;
        }


        .autorSlika {
            order: 1;
            margin-left: 0;
            margin-right: 15px;
        }

        .autorWrap {
            text-align: left;
            order: 2;
        }

        .cardsSection {
            padding-top: 15px;
        }

        .modulBox.cards {
            height: fit-content;
            padding: 35px;
            margin: 0 0 30px 0;
        }

        .cards {
            height: fit-content;
            margin: 0 0 30px 0;
        }

        .hp.klijenti {
            padding: 60px 0 30px 0;
        }

        .ArbonaDorucakText {
            margin-top: 0;
        }

        .dorucakPrijavaForma {
            margin-top: 120px;
        }

        .dorucakSLike {
            margin-top: 30px;
        }

        .flip {
            flex-wrap: wrap;
        }

        .flipImgBox {
            width: 100%;
            margin-bottom: 30px;
        }

        .flipText {
            width: 100%;
            padding: 0;
        }

        .flipSides .flip:nth-child(odd) .flipText {
            padding: 0;
        }

        .quickInfo {
            margin-bottom: 30px;
            border: none;
            padding: 0;
        }
    }


    @media all and (max-width:768px) {
        .container {
            max-width: 100% !important;
            width: 100%;
            padding-left: 20px;
            padding-right: 20px;
        }
    }

    @media all and (max-width: 767px) {

        .pb-90-60-30 {
            padding: 30px 0;
        }

        .mb-60 {
            /* margin-bottom:30px;*/
        }

        .emptySpaceDesktop {
            display: none;
        }

        .emptySpaceMobile {
            display: block;
        }

        .subpageImg.maliHeader {
            min-height: 200px;
        }

        strong {
            font-family: "Roboto-Bold";
        }

        .bg-sarena ul, .ul-2 ul {
            columns: 1;
        }

        header {
            padding: 25px 0px 30px 0px;
        }

        .bg-sarena {
            padding: 50px 0px;
        }


        h1 {
            font-size: 1.802rem;
            margin-bottom: 30px;
            /*28.83px*/
        }

        h2 {
            font-size: 1.602rem;
            /*/25.63px*/
            margin-bottom: 30px;
        }

        h3 {
            font-size: 1.476rem;
            margin-bottom: 15px;
        }

        h4, .quickInfo h2 {
            font-size: 1.28rem;
            margin-bottom: 15px;
        }

        h5 {
            font-size: 1.125rem;
            margin-bottom: 15px;
        }

        h6 {
            font-size: 1rem;
            margin-bottom: 15px;
        }

        .replayVid {
            bottom: -70px;
            width: 50px;
            height: 50px;
        }

        .main-title h1 {
            font-size: 2.5rem;
            font-family: "Roboto-Bold";
        }

        .main-title h2 {
            font-size: 1.5rem;
            font-family: "Roboto-Light";
        }

        .mainSub-title h1 {
            font-size: 2.2rem;
            /*35.2px*/
        }

        .mainSub-title h2 {
            font-size: 1.25rem;
            /*20px*/
        }

        .videoBox {
            height: unset;
            min-height: 200px;
        }

        .traka {
            height: 60px;
        }

        .mainTitle-wrap {
            height: 100%;
            top: unset;
            padding: 10px 20px 70px 20px;
        }

        .videoBox .mainTitle-wrap {
            height: 100%;
            padding: 30px 30px;
        }

        .main-title a {
            font-size: 1rem;
            padding: 8px 20px;
        }

        .btn-primary {
            font-size: 16px;
            padding: 6px 25px;
        }

        .no-bg {
            padding: 40px 0 40px 0;
        }

        .bg-sarena.clasic {
            background-size: cover;
        }

        .bg-tamnoSiva::after {
            bottom: 0;
            right: -30%;
            height: 100%;
            transform: rotate(0deg);
        }

        .flex.hp-ikone {
            justify-content: flex-start;
        }

        .bg-right {
            margin-bottom: 10px;
        }

        .verticalImgBoxLeft img,
        .verticalImgBoxRight img {
            max-width: 48%;
            max-height: 350px;
        }


        .sekcijaText h3,
        .sekcijaText h4 {
            margin-bottom: 15px;
        }

        .certifikati ul li {
            width: 60px;
            height: 60px;
        }

        .certifikati ul .tf500 {
            width: 120px;
            height: auto;
        }

        .reference ul,
        .reference2 ul {
            justify-content: center;
        }

        .reference ul li,
        .reference2 ul li {
            margin: 15px 15px 15px 0px;
            width: 90px;
        }

        .form-group {
            margin-bottom: 15px;
        }

        .footer1 ul li a {
            font-size: 14px;
        }

        .seeAll {
            font-size: 16px;
        }

        .sekcijaText .seeAll {
            position: relative;
            bottom: -30px;
        }

        .footer1 {
            padding: 30px 15px 30px 15px;
        }

        .foo-logo {
            margin: 0 auto 25px auto;
        }

        .footer1::after {
            bottom: -3px;
        }


        .blogoviSlider .swiper-wrapper,
        .knjiznicaSlider .swiper-wrapper {
            margin-bottom: 30px;
        }

        .blogoviSlider a,
        .knjiznicaSlider a,
        .officeItem,
        .videoTestmonials .swiper-slide {
            width: 290px;
        }

        .videoTestmonials .swiper-slide {
            margin-bottom: 40px;
        }

        .blogoviSlider .blogCategory,
        .knjiznicaSlider .blogCategory,
        .videoTestmonials .imePolaznika,
        .videoTestmonials .tvrtkaPolaznika {
            font-size: 16px;
        }

        .officeSlider .officeCity,
        .videoTestmonials .funkcijaPolaznika {
            font-size: 14px;
        }

        .officeSlider .officeAddress, .officeSlider .officeTel {
            font-size: 16px;
        }

        .blogoviSlider .blogTitle,
        .knjiznicaSlider .blogTitle {
            font-size: 18px;
            margin-bottom: 30px;
        }

        .knjiznica .blogTitle {
            margin-bottom: 0;
        }

        .modulBox {
            padding: 45px 25px;
            padding: 10px 25px 20px 25px;
        }

        .imgBox {
            margin-bottom: 15px;
        }

        .subpageImg {
            min-height: 300px;
        }

        .namePredavaca {
            font-size: 1.125rem;
        }

        .polazniciSlider .swiper-button-prev.rez,
        .polazniciSlider .swiper-button-next.rez {
            top: unset;
            bottom: -30px;
        }

        .inner-content h3 {
            margin-bottom: 15px;
        }

        .inner-content .dvaStupca h3 {
            margin-bottom: 30px;
        }

        .innerSection .stamp {
            left: 60%;
        }

        .inner-content .lajsnaTemplate {
            margin-bottom: 60px;
        }

        .prednosti.bg-right {
            margin-bottom: 60px;
        }

        .filterBtn {
            padding: 7px 15px;
        }

        .accordion-button {
            font-size: 1.125rem;
            padding: 15px 0px;
        }

        .accordion-body {
            padding: 15px 0px;
        }

        form input {
            height: 43px;
        }

        form input::placeholder,
        form textarea::placeholder {
            font-size: 15px;
        }

        .forma-kontakt .btn-primary {
            width: 100%;
        }

        .karijeraBox {
            max-width: 100%;
            padding-bottom: 30px;
        }

        .karijeraBox h4 {
            margin-bottom: 30px;
        }

        .karijeraSpecImg2 {
            padding-bottom: 0;
        }

        .karijeraSpecImg1 img,
        .karijeraSpecImg2 img {
            position: static;
            transform: none;
            max-height: unset;
            max-width: unset;
            width: 100%;
        }

        .ikonaTextBox img {
            width: 55px;
        }

        .sekcijaText2 .textMali {
            padding: 0 0 0 15px;
            margin-bottom: 15px;
        }

        .breadcrumbs ul {
            /* margin-bottom: 15px; */
        }

        .polazItem {
            margin: 0 0 15px 0;
        }

        .polazniciHolder h4 {
            margin-bottom: 15px;
        }

        .polazniciSlider {
            margin-bottom: 0px;
            padding-bottom: 60px;
            overflow: visible;
        }

        .polazniciSlider .sekcijaText2 .textMali {
            padding: 0;
        }

        .breadcrumbs {
            padding: 15px 0px 15px 0px;
        }

        .breadcrumbs ul li {
            margin: 0px 5px 0px 0px;
        }

        .social {
            display: inline-block;
            position: static;
            height: fit-content;
            transform: none;
        }

        .social ul {
            flex-direction: row;
            margin: 0;
        }

        .social ul li {
            padding: 0px 25px 0px 0px;
        }

        .inner-content p {
            margin-bottom: 15px;
        }


        .swiperFoto .swiper-button-prev,
        .swiperFoto .swiper-button-next {
            display: none;
        }


        .resultNumbers {
            flex-wrap: wrap;
            margin: 30px auto 30px auto;
        }

        .resultBroj::after, .resultSingle:last-child .resultBroj::after {
            display: block;
            right: calc(50% - 20px);
            transform: scaleX(-50%);
            top: unset;
            bottom: 0px;
            width: 35px;
            height: 3px;
        }

        .dvaStupcaBorder .borderBox {
            padding: 30px 20px;
        }

        .dvaStupca h3::after, .hasAfter h3::after {
            height: 5px;
            bottom: -10px;
        }

        .slikaAutoraVelika {
            max-width: 320px;
        }

        .bg {
            padding: 90px 0;
            margin: 60px 0;
        }

        .bg::before, .bg::after {
            height: 60px;
        }

        .banner {
            margin: 30px 0px;
        }


        .ostaliPojmovi {
            display: none;
        }

        .searchRezSlika ul {
            flex-direction: column;
        }

        .searchRezSlika img {
            display: none;
        }

        .searchRezSlika a .searchTitle {
            font-weight: normal;
            color: #ED1B25;
            margin: 0 0 15px 0;
            text-decoration: underline;
        }


        .searchRezSlika ul li {
            max-width: unset;
        }

        .clanstvo {
            margin: 30px auto 30px auto;
        }

        .modalContent {
            width: 90%;
        }

        .ArbonaDorucakText {
            margin-top: 10px;
        }

        .dorucakPrijavaForma {
            width: 100%;
            margin-top: 100px;
        }

        .predlozakCaseStudy,
        .prednosti,
        .naslovFilterWrap {
            margin-top: 30px;
        }

        .mobilePosition {
            padding: 0px 20px;
            color: #ffffff !important;
        }

        .mobilePosition .autorWrap,
        .mobilePosition .autorWrap div,
        .mobilePosition .breadcrumbs a {
            color: #ffffff !important;
        }

        .mobilePosition .breadcrumbs ul li::before {
            filter: brightness(200%);
        }

        .mobilePosition .breadcrumbs ul li:hover {
            opacity: 0.8;
        }

        .mobilePosition .breadcrumbs ul li:hover::before {
            background-image: url(../img/caretForLang-grey.svg);
            transform: rotate(-90deg);
        }

        .mobilePosition .movable h1,
        .mobilePosition .movable h3 {
            text-align: center;
        }

        .mobilePosition .dateAndTime {
            font-size: 14px;
        }

        .mobilePosition .dateAndTime img {
            filter: grayscale(1) invert(1) brightness(200%);
        }


        .heroImage {
            position: relative;
            /*background: url(../img/sarena-refularshape.svg);
        background-size: cover;*/
            background: #EF275B;
            background: linear-gradient(180deg, rgba(239, 39, 91, 1) 0%, rgba(251, 85, 27, 1) 54%, rgba(255, 255, 255, 1) 87%, rgba(255, 255, 255, 1) 100%);
        }

        /*   .heroImage::before {
        display: inline-block;
        content: "";
        width: 100%;
        height: 150px;
        background: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.13) 27%, rgba(255, 255, 255, 0.35) 52%, rgba(255, 255, 255, 0.56) 72%, rgba(255, 255, 255, 1) 100%);
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 0;
    }*/

        .heroImage picture {
            display: block;
            margin: 0 auto;
            position: relative;
            text-align: center;
            top: 30px;
        }

        .podnaslov-h3 {
            font-size: 23px;
        }

        .mobilePosition .movable h1 {
            margin: 0 0 20px 0;
        }


        aside {
            margin-bottom: 30px;
        }

        .tableOfContent {
            transition: all 0.2s ease-in-out;
            margin-bottom: 0;
        }

        .tableOfContent h4 {
            position: relative;
            padding-right: 25px;
            cursor: pointer;
            margin-bottom: 0;
        }

        .tableOfContent h4::after {
            display: inline-block;
            content: "";
            width: 25px;
            height: 25px;
            position: absolute;
            top: 0px;
            right: 0px;
            background-image: url(../img/icon-plus.svg);
            background-size: 100% 100%;
        }


        .tableOfContent.fixed {
            position: fixed;
            top: 0px;
            left: 15px;
            width: calc(100% - 30px);
            transition: all 0.2s ease-in-out;
            z-index: 5;
        }

        .tableOfContent .tableOfContent-inner {
            height: 0;
            overflow: hidden;
            transition: all 0.2s ease-in-out;
            -webkit-transition: all 0.2s ease-in-out;
        }

        .tableOfContent.expand .tableOfContent-inner {
            height: auto;
            overflow: unset;
            transition: all 0.2s ease-in-out;
            -webkit-transition: all 0.2s ease-in-out;
            margin-top: 15px;
        }

        .tableOfContent.expand h4::after {
            background-image: url(../img/icon-minus.svg);
        }

        .recommended-tagovi-desktop {
            display: none;
        }

        .recommended-tagovi-mobile {
            display: block;
            margin: 20px 0;
        }

        .dateAndTime {
            flex-direction: column;
            justify-content: flex-start;
            align-items: flex-start;
        }

        .authorAndTimeStamp {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .mobilePosition .author {
            flex-wrap: nowrap;
        }

        article {
            padding: 0;
        }

        .blogItem1 {
            margin: 0 0 20px 0;
        }

        .f0f-unchangeable {
            margin-top: 30px;
        }

        .karijeraSpecImg1 {
            padding: 15px 0 0 0;
        }

        .akademijaSlider .swiper-slide {
            max-width: 350px;
        }

        .akademijaSlider .swiper-wrapper {
            padding-bottom: 60px;
        }

       
    }

    @media all and (max-width:639px) {
        .bg-sarena.classic {
            background-size: cover;
        }

        .quickInfo ul {
            flex-direction: column;
        }

        .bg {
            margin: 30px 0;
        }

        .modalContent .d-flex {
            flex-wrap: wrap;
        }

        .modalContent .googleLogin,
        .modalContent .facebookLogin {
            width: 100%;
            margin-bottom: 15px;
        }

        :root {
            --gutter: 16px;
            --grid-gap: 16px;
            --card-padding: 24px;
            --card-radius: 36px;
        }

        .modules {
            padding: 48px 0 64px;
        }

        .modules__title {
            font-size: 32px;
            margin-bottom: 28px;
        }

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


        .module-card {
            min-height: 0;
            grid-column: 1;
        }

        .module-card__head {
            min-height: 0;
        }

        .module-card__title {
            font-size: 22px;
        }

        .module-card__price strong {
            font-size: 32px;
        }

        .contact-card {
            grid-column: auto;
            gap: 15px;
        }

        .contact-card__details {
            width: 100%;
        }

        .contact-card__text {
            font-size: 22px;
        }

        .contact-card__list li {
            font-size: 16px;
            white-space: normal;
            word-break: break-word;
        }
    }

    @media all and (max-width:576px) {

        .filterBox .dropdown {
            float: right;
        }

        .btn-primary {
            width: 100%;
        }

        .main-title .btn-primary, .mainSub-title .btn-primary {
            width: fit-content;
        }

        .logoWrap {
            width: 150px;
        }


        .replayVid {
            bottom: -60px;
            width: 50px;
            height: 50px;
        }

        .main-title {
            top: 45%;
        }

        .main-title h1 {
            font-size: 2.1rem;
        }

        .flex.hp-ikone {
            padding-top: 0;
        }

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

        .sekcijaText2 .textMali {
            text-align: left;
        }

        .ikonaTextBox {
            flex-direction: column;
            align-items: center;
        }

        .ikonaTextBox.razlog {
            flex-direction: column;
            align-items: flex-start;
        }

        .i-1,
        .i-2,
        .i-3,
        .i-4,
        .i-5 {
            margin-bottom: 15px;
        }

        .verticalImgBoxLeft img:nth-child(2) {
            left: 10px;
        }

        .verticalImgBoxRight img:first-child {
            margin-right: 10px;
        }

        .newsletter .flex {
            flex-wrap: wrap;
        }

        .newsletter .btn-primary {
            margin-top: 15px;
        }

        .newsletter p {
            font-size: 16px;
            margin-bottom: 15px;
            width: 100%;
        }


        .footer1 ul {
            flex-direction: column;
            margin: 0 auto;
            text-align: center;
        }

        .footer1::after {
            bottom: -100px;
        }

        .blogoviSlider a,
        .knjiznicaSlider a,
        .officeItem,
        .videoTestmonials .swiper-slide {
            width: 290px;
            margin-right: 15px;
        }

        .swiper-nav {
            width: 85px;
        }

        .swiper-button-prev::after, .swiper-button-next::after {
            top: 7px;
        }

        .swiper-button-next,
        .swiper-button-prev {
            width: 35px;
            height: 35px;
        }

        .swiper-button-next::after,
        .swiper-button-prev::after {
            width: 20px;
            height: 20px;
        }

        .bg-slovo::before {
            display: none;
        }

        .bg-tamnoSiva::after {
            bottom: 0%;
            transform: rotate(1deg);
            right: -70%;
        }

        .newsletter input[type="email"] {
            width: 100%;
            margin-right: 0;
        }

        .certifikati ul li {
            margin: 10px 10px 0px 0px;
        }

        .reference ul li,
        .reference2 ul li {
            max-height: 45px;
        }

        .reference ul li img,
        .reference2 ul li img {
            /*   height: 45px; */
            max-height: 45px;
        }

        .cijenaBox {
            flex-direction: column-reverse;
            justify-content: flex-end;
            padding: 25px;
        }

        .iznos {
            justify-content: unset;
            align-items: normal;
            padding-left: 0;
            padding-bottom: 20px;
            width: 100%;
        }

        .iznos .eur {
            font-size: 1.3rem;
        }

        .iznos:after {
            width: 100%;
            height: 2px;
            top: unset;
            bottom: 0;
            left: 0;
        }

        .infos {
            padding-bottom: 0px;
            padding-top: 15px;
        }

        .infos .btn-primary {
            position: static;
        }

        .naslovFilterWrap {
            flex-direction: column;
            justify-content: flex-start;
            align-items: flex-start;
            margin-bottom: 15px;
        }

        .filterBox {
            width: 100%;
        }

        .filterBtn {
            margin-top: 15px;
        }


        .newsletter.karijera .btn-primary {
            width: 100%;
        }

        form input.btn-primary, .forma-kontakt .btn-primary, .forma-login .btn-primary, .forma-reg .btn-primary,
        .forma-akademija .btn-primary {
            width: 100%;
            text-align: center;
        }


        .newsletter input[type="submit"] {
            width: 100%;
        }

        .foo-social {
            justify-content: flex-start;
        }

        .tipClanstva {
            width: 90px;
            height: 90px;
            font-size: 40px;
        }

        .modalHeader .logoModal.short {
            width: 50px;
        }

        .modalContactInfo {
            font-size: 15px;
        }

        .modalPerson img {
            width: 320px;
            margin-bottom: 20px;
        }

        .modalContactInfo.poslovnice {
            margin-bottom: 15px;
        }

        .modulBox ul {
            width: 100%;
        }

        .fOf404 ul {
            column-count: 1;
        }

        .buttons404 {
            width: auto;
        }

        .buttons404 a:first-child,
        .buttons404 a:last-child {
            font-size: 16px;
            padding: 5px 35px;
        }
    }


    @media all and (max-width: 510px) {
        .authorAndTimeStamp {
            flex-direction: column;
            justify-content: flex-start;
            align-items: flex-start;
        }

        .dateAndTime {
            flex-direction: row;
            justify-content: center;
            width: 100%;
        }
    }


    @media all and (max-width: 475px) {
        .headerContainer {
            padding-left: 15px;
            padding-right: 15px;
        }

        header {
            padding: 15px 0px 15px 0px;
        }

        .logoWrap {
            width: 130px;
        }

        .logoWrap img {
            width: 100%;
        }

        .search-icon {
            width: 20px;
            height: 20px;
        }


        .pagination {
            flex-wrap: nowrap;
        }

        .pagination .page-item:first-child {
            padding-left: 0 !important;
        }

        .pagination .page-item .page-link {
            padding: 0px 5px;
        }

        .akademijaSlider .swiper-slide {
            max-width: 300px;
        }

        .akademijaSlider .modulBox {
            padding: 25px 15px 45px 15px;
        }
    }

    @media all and (max-width:375px) {

        .main-title h1 {
            font-size: 1.8rem;
        }

        .logoWrap {
            width: 130px;
        }

        .mobileMenuToggler {
            margin: 0;
        }

        .mobileMenuToggler img {
            width: 30px;
        }

        .mobile-nav {
            position: static;
        }

        .mobile-nav li {
            margin: 0 10px;
        }

        .userBox {
            margin: 0;
        }

        .dateAndTime {
            flex-wrap: wrap;
        }
    }

    @media all and (max-width:340px) {
        .logoWrap {
            width: 115px;
        }

        .search-icon {
            width: 20px;
            height: 20px;
        }


        .mobile-nav li {
            margin: 0px 8px;
        }
    }