html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100vh;
    font-family: 'Open Sans', sans-serif;
    overflow-x: hidden;
    position: relative;
}

* {
    box-sizing: border-box;
}

#microdata {
    position: absolute;
    top: -9999px;
    left: -9999px;
}

.uskoro {
    display: block;
    width: 800px;
    height: 800px;
    margin: 0 auto;
    margin-top: 150px;
    text-align: center;
}

.uskoro img {
    position: relative;
    margin-top: 50px;
}

@media only screen and (max-width: 730px) {

    .uskoro {
        width: 360px;
        height: 480px;
        margin-top: 110px;
    }
    
    .uskoro img {
        position: relative;
        margin-top: 50px;
    }
} 

.uk-navbar-container:not(.uk-navbar-transparent) {
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}

.uk-iconnav > li > a {
    margin-left: 25px;
}

.uk-offcanvas-bar {
    background: #0abde3;
}

.uk-offcanvas-bar .uk-active a {
    color: #fff !important;
}

.uk-grid > * {
    padding-left: 0;
}

.prim--tekst {
    color: #0abde3 !important;
}

.zeleni {
    color: #44bd32;
}

.crveni {
    color: #e84118;
}

.primarni--gumb {
    background: #0abde3;
    color: #fff;
    border-radius: 2px;
}

.primarni--gumb:hover {
    background: #48dbfb;
    color: #fff;
}

.sekundarni--gumb {
    background: #01a3a4;
    color: #fff;
}

.sekundarni--gumb:hover {
    background: #00d2d3;
    color: #fff;
}

.uk-button-default {
    border: 1px solid #0abde3;
}

.uk-button-default:hover {
    border: 1px solid #48dbfb;
}

.senka {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1) !important;
}

.blue--bkgd {
    background: #0abde3;
    color: #fff !important;
}

.white--text {
    color: #fff !important;
}

.prim--tekst {
    color: #0abde3;
}

.osencen--tekst {
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.15);
}

.pisani--tekst {
    font-family: 'Kaushan Script', cursive;
    color: #fff !important;
    opacity: 1;
}

.pisani--tekst--dark {
    font-family: 'Kaushan Script', cursive;
    color: #444 !important;
    opacity: 1;
}

#slajder h1.pisani--tekst {
    font-size: 85px;
}

#slajder h2.pisani--tekst {
    font-size: 40px;
}

p.tamna--pozadina {
    padding: 10px 25px;
    background-color: rgba(0, 0, 0, 0.2);
    color: #fff;
    width: auto;
    border-radius: 30px;
}

.uk-overlay-primary {
    background: rgba(34, 34, 34, 0.2);
}

.uk-logo {
    margin-left: 25px;
}

a.gab--logo {
    background: url(../img/logo.png) no-repeat scroll left top transparent;
    height: 50px;
    width: 125px;
}

a:hover {
    text-decoration: none;
}

.uk-grid {
    margin-left: 0 !important;
}

.uk-active a {
    color: #0abde3 !important;
}

.uk-active a:hover {
    color: #48dbfb !important;
}

.uk-button {
    border-radius: 3px;
    box-shadow: 0 5px 5px -2px rgba(0, 0, 0, 0.3);
}

.uk-button:hover {
    color: #fff;
}

.uk-divider-icon {
    background-image: url(../img/gab-hr.png);
}

.uk-divider-icon.lite {
    background-image: url(../img/gab-hr-lite.png);
}

.uk-section {
    padding-top: 50px;
    padding-bottom: 50px;
}

.top--margin {
    margin-top: 80px;
}

.padding--mali {
    padding: 10px 30px !important;
}

/* Navigacija */

#navigacija {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
}

#skriveniMobMeni .uk-offcanvas-bar .uk-nav-primary li a {
    color: rgba(255, 255, 255, 0.8);

}

.uk-accordion-title::before {
    display: none;
}

.uk-accordion-title {
    font-size: 24px;
}


/* Social networks */

#social {
    display: block;
    position: fixed;
    right: -1px;
    top: 25%;
    width: 45px;
    height: auto;
    border: 1px solid rgba(0, 0, 0, 0.1);
    text-align: center;
    line-height: 43px;
    font-size: 24px;
    background: #fff;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}

.social--single {
    display: block;
    margin-top: 5px;
    color: #0abde3;
    transition: color .3s ease-out;
}

.social--single:hover {
    color: #48dbfb;
}

[class*='uk-navbar-dropdown-bottom'] {
    margin-top: 0 !important;
}

/* POČETNA STRANICA */

/* Slajder */

#slajder {
    margin-top: 80px;
}

/* Promo sa slikom */
/* .promo--slika--mala {
    font-weight: 100;
    height: 200px;
    background-attachment: fixed;
    position: relative;
} */

.promo--slika {
    position: relative;
    font-weight: 100;
    width: 100%;
    height: auto;
    background: #fff;
    background-attachment: fixed;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 50% 0%;
}

.promo--slika--mala {
    position: relative;
    font-weight: 100;
    width: 100%;
    height: 200px;
    background: #fff;
    background-attachment: fixed;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 50% 0%;
}

.promo--slika--velika {
    min-height: 300px;
    background-attachment: fixed;
    position: relative;
}

#promoSlika {
    height: 500px;
    background-image: url(../img/slajder/1.jpg);
    background-attachment: fixed;
}

#promoSlikaFront {
    background-image: url(/img/servisi.jpg);
}

.promo--inner {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

/* Sekcija 2 */

.promo--proslave {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: stretch;
}

.promo--proslave--single {
    display: inline-block;
    width: auto;
    min-width: 30%;
    max-width: 45%;
    text-align: center;
    padding: 0 20px;
    /* color: #fff !important; */
    border: 1px solid rgba(255, 255, 255, 0);
    border-radius: 5px;
    transition: border .3s ease-out;
}

/* .promo--proslave--single:hover {
    border: 1px solid rgba(255, 255, 255, 0.5);
} */

.promo--proslave--single i {
    font-size: 32px;
    padding: 20px;
    border: 1px solid #444;
    border-radius: 50%;
}

.gumb--detaljnije {
    display: inline-block;
    background: #0abde3;
    padding: 12px 30px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    box-shadow: 0 5px 5px -2px rgba(0, 0, 0, 0.1);
    margin-top: 15px;
    transition: all .3s ease-out;
}

.gumb--detaljnije:hover {
    background: #48dbfb;
    color: #fff;
}

/* Promo 2 sa slikom */

#promoSlika2 {
    background-image: url(../img/Gabbiano1.JPG);
}

/* Sekcija 3 slike */

.glavna--slider--mali {
    margin: 0 auto;
    margin-top: 50px;
}

.glavna--slider--mali img {
    height: 250px;
    margin-right: 20px;
}

.galerije--linkovi a {
    margin: 10px 8px;
}


/* Testimonial */

.citat--single {
    display: inline-block;
    width: auto;
    min-width: 30%;
    max-width: 65%;
    text-align: center;
    padding: 20px;
    color: #444;
    border: 1px solid rgba(255, 255, 255, 0);
    border-radius: 5px;
    transition: border .3s ease-out;
}

.citat--single img {
    width: 200px;
    height: 200px;
    border-radius: 50%;
}

.citati:before, .citati::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: '\f10d';
    font-size: 65px;
    color: #444 !important;
    position: relative;
    opacity: .1;
}

.citati:before {
    left: -350px;
    top: 0px;
}

.citati:after {
    right: -350px;
    top: 150px;
}

.citati {
    height: auto;
}

.citati.uk-slideshow-items {
    min-height: 330px !important;
    height: auto;
}

/* Pre-footer */

#promoSlika3 {
    background-image: url(../img/footer-2.jpg);
}

#footerGabbiano {
    background-image: url(/img/footer-gabbiano.JPG);
}

#footerProslave {
    background-image: url(../img/footer-proslave.JPG);
}

#footerPoslovni {
    background-image: url(../img/footer-poslovni.jpg);
}

#footerMarina {
    background-image: url(../img/footer-marina.jpg);
}

#footerKontakt {
    background-image: url(../img/footer-kontakt.jpg);
}

/* Footer */

.page-footer {
    padding-top: 20px;
    color: #48dbfb;
    background-color: #576574;
}

.footer-copyright {
    background-color: #222f3e;
    height: 50px;
    line-height: 50px;
}

.page-footer h3, 
.page-footer h2 {
    color: #48dbfb;
}

.page-footer a {
    text-decoration-style: dotted !important;
    color: #0abde3;
}

.footer--inner, 
.ponuda--menija {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: stretch;
    margin-top: 35px;
}

.footer--inner .footer--inner--single, 
.ponuda--menija .meni--single {
    display: inline-block;
    width: 30%;
    margin-bottom: 35px;
}

.footer--inner .footer--inner--single > i {
    font-size: 24px;
    padding: 15px;
    border: 1px solid #48dbfb;
    border-radius: 50%;
}

.footer--inner .footer--inner--single > p {
    margin-bottom: 0;
    padding-bottom: 0;
}

.footer--social {
    margin-top: 0 !important;
    padding-bottom: 20px;
}

.footer--social i {
    margin-left: 10px;
}


/* Promo sa slikom na stranicama */

.promo--slika--stranica {
    position: relative;
    width: 100%;
    height: 400px;
    background: #fff;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#oGabbianu {
    background-image: url(../img/o-gabbianu-banner.jpg);
}

#promoVencanja {
    background-image: url(../img/vencanja-banner.jpg);
}

#promoPoslovni {
    background-image: url(../img/poslovni-banner_sm.jpg);
}

#promoMarina {
    background-image: url(../img/marina-banner_sm.jpg);
}

#promoKontakt {
    background-image: url(../img/gab_mapa.jpg);
}

#promoGalGabbiano {
    background-image: url(../img/galerije/gabbiano/Gabbiano3.JPG);
}

#promoGalBasta {
    background-image: url(../img/galerije/basta/Basta1sm.jpg);
}

#promoGalExclusive {
    background-image: url(../img/galerije/exclusive/exclusive_new.jpg);
}

#promoGalMarina {
    background-image: url(../img/galerije/marina/marina.jpg);
}

#docekNoveGodine {
    background-image: url(../img/nova-godina-gabbiano.jpg);
}

/* Stranica O Gabbianu */

#gabbianoKuhinja {
    background-image: url(../img/nasa-kuhinja.jpg);
    color: #fff !important;
}

.slider--veliki img {
    height: 400px;
    margin-right: 20px;
}



/* GALERIJE */

.slider--galerije img {
    height: 250px;
    margin-right: 20px;
}

video { 
	width:100%;
	max-width:800px;
	height:auto;
	margin: 0 auto;
}

/* POPUP */

.gab--popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    max-height: 90vh;
    min-width: 300px;
    width: 500px;
    max-width: 95vw;
    z-index: 10000;
    display: none;
}

.gab--popup .gab--popup--inner {
    position: relative;
    display: block;
    background-color: white;
    border-radius: 10px;
    width: 100%;
    height: 100%;
    padding: 25px 15px;
}

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

.gab--popup img:hover {
    cursor: pointer;
}

.gab--popup a.close--popup {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(45deg);
    top: 5px;
    right: 5px;
    width: 40px;
    height: 40px;
    padding: 10px;
    border-radius: 50%;
    color: #161616;
    background-color: white;
    font-size: 40px;
    line-height: 15;
}

.popup--overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.85);
    z-index: 9999;
    display: none;
}

.popup--overlay.visible, 
.gab--popup.visible {
    display: block;
}

.blur {
    filter: blur(5px);
}

/* STRANICA DOČEK 2020 */

.gradient {
    position: relative;
    background: #000;
    /* padding: 1% 35px; */
}

.gradient .bend {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    z-index: 1;
}

.gradient .bend h2 {
    font-weight: 300;
    color: rgba(255, 255, 255, 0.8);
}

.gradient .bend h2.sala {
    position: absolute;
    top: 40%;
    left: 50%;
    font-weight: normal;
    transform: translate(-50%, -50%) rotate(-15deg);
    text-shadow: 0 0 7px rgba(0, 0, 0, 1);
}

.gradient .premium img {
    width: 55%;
    height: auto;
    margin-top: 20px;
}

.gradient .ny2020 {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 0;
}

/* .gradient .premium {
    height: 480px;
    background-image: url(/img/bend.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 40%;
    background-position: 50% 10%;
}

.gradient .exclusive {
    height: 480px;
    background-image: url(/img/bend2.png);
    background-repeat: no-repeat;
    background-position: 50% 100%;
} */




@media only screen and (max-width: 960px) {

    .citati.uk-slideshow-items {
        min-height: 400px !important;
        height: auto;
    }

    .citat--single {
        max-width: 85%;
    }

    #slajder h1.pisani--tekst {
        font-size: 55px;
    }
    
    #slajder h2.pisani--tekst {
        font-size: 25px;
    }

    .uk-text-large {
        font-size: 1.2rem;
        line-height: 1.2;
    }

    .slider--veliki img {
        height: 300px;
        margin-right: 20px;
    }
} 

@media only screen and (max-width: 730px) {

    .footer--inner .footer--inner--single, 
    .ponuda--menija .meni--single {
        width: 90%;
    }

    .citat--single {
        max-width: 85%;
    }

    video { 
		max-width:500px;
	}
} 

@media only screen and (max-width: 640px) {
    .promo--proslave--single {
        max-width: 95%;
        margin: 0 auto;
        margin-top: 15px;
    }

    #social {
        width: 30px;
        line-height: 25px;
        font-size: 16px;
    }

    .social--single {
        margin: 3px 0;
    }

    video { 
		max-width:360px;
	}

    .citati.uk-slideshow-items {
        min-height: 500px !important;
        height: auto;
    }

    .citat--single {
        /* max-width: 95% !important; */
        width: 95%;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .promo--slika--stranica {
        height: 250px;
    }
}