@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&family=Work+Sans:wght@200;400;500&display=swap');

/*#region NAVBAR*/
.onama-nav-container{
    display: flex;
    justify-content: end;
    width: 1475px;
    display: none;
    opacity: 0;
    transition: opacity 0.3s;
}
.onama-nav{
    background-color: rgba(45, 57, 70, 0.92);
    padding: 12.5px 38px;
    padding-bottom: 22.5px;
    font-size: 15px;
    margin-right: 200px;
}
.show{
    display: flex !important;
}
.show-opacity{
    opacity: 1 !important;
}
.onama-nav > *{
    padding: 13.5px 0px;
}
.onama-nav > *:not(:last-child){
    border-bottom: 1px solid #707070;
}
.navbar{
    position: absolute;
    z-index: 3;
    overflow: hidden;
    width: 100%;
    display: flex;
    justify-content: center;
    align-content: center;
    transition: padding 0.7s;
    color: white;
    padding-top: 50px;
    padding-bottom: 40px;
}
.nav-background{
    position: absolute;
    width: 100%;
    background: linear-gradient(360deg, rgba(111, 120, 128, 1) 0%, rgba(111, 120, 128, 0.4) 100%);
    opacity: 0;
    height: 165px;
    transition: opacity 0.7s, height 0.7s;
    z-index: 3;
    mix-blend-mode: multiply;
}
.nav-background-static{
    opacity: 1 !important;
}
.nav-header{
    position: absolute;
    z-index: 4;
    font-size: 20px;
    display: flex;
    justify-content: end;
    color: white;
    height: 60px;
    transition: height 0.7s, font-size 0.7s;
    max-width: 1740px;
    width: 100%;
    margin-right: 30px;
}
.nav-header-container{
    display: flex;
    justify-content: center;
}
.nav-header > *{
    padding-top: 5px;
    display: flex;
    align-items: center;
}
.nav-tel{
    padding-right: 25px;
    padding-left: 25px;
    margin: 0px;
    background-color: rgb(255,0,0);
}
.nav-tel i{
    margin-right: 10px;
    margin-left: 5px;
}
.nav-info{
    font-size: 16px;
    font-weight: 300;
    color: white;
    padding-top: 10px;
    padding-right: 5%;
    padding-left: 5%;
}
.nav-lang{
    padding: 0px;
    display: flex;
    gap: 3px;
    color:rgba(255, 255, 255, 0.4);
    font-family: 'Work Sans', sans-serif;
}
.nav-lang > *{
    display:flex;
    align-items: center;
    height: 100%;
    background-color: #2D3946;
    padding: 0px 18px;
}
.nav-lang .fa-facebook{
    font-size: 30px;
    transition: font-size 0.7s;
}
.nav-lang a{
    font-size: 18px;
    transition: font-size 0.7s;
}
.navbar.navbar-small{
    padding-top: 20px;
    padding-bottom: 15px;
}
.nav-header.navbar-small{
    height: 40px;
    font-size: 18px !important;
}
.nav-background.navbar-small{
    opacity: 1;
    height: 110px;
}
.nav-header.navbar-small .fa-facebook{
    font-size: 25px;
}
.nav-header.navbar-small a{
    font-size: 15px !important;
}
.nav{
    display: flex;
    justify-content: space-between;
    width: 1450px;
    margin-right: 15px;
    margin-left: 30px;
}
.nav-items{
    white-space: nowrap;
    gap: 53px;
    display: flex;
    align-items: flex-end;
    z-index: 1;
}
.nav-items > div{
    padding: 0px 6px;
    padding-bottom: 8px;
    font-size: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.nav-current{
    box-shadow: inset 0px -3px 0px white !important;
}
.nav-items > a:hover{
    color:white;
}
.nav-ham{
    display: none;
    justify-content: end;
    align-items: center;
    font-size: 35px !important;
}
.nav-ham i{
    cursor: pointer;
}
.dropdown{
    display: none;
    top: 0;
    position: fixed;
    opacity: 0;
    transition: opacity 0.3s;
    flex-direction: column;
    color: white;
    background-color: rgba(83, 83, 83, 0.94);
    width: 100%;
    height: 100vh;
    padding-top: 95px;
    text-align: center;
    z-index: 4;
    font-size: 28px;
    font-weight: 600;
}
.dropdown > *{
    margin-bottom: 25px;
}
.dropdown > *:nth-last-of-type(2){
    margin-bottom: 50px;
}
.dropdown .onama-nav{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 45px;
}
.dropdown .onama-nav >*{
    width: 130px;
}
.dropdown .buttons{
    display: flex;
    justify-content: center;
    gap: 10px;
    color: #74879A;
}
.dropdown .buttons > *{
    border: #74879A 1px solid;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 71px;
    height: 61px;
    cursor: pointer;
}
.dropdown .buttons a{
    font-size: 32.5px;
}
@media (max-height: 820px) {
    .dropdown > *{
        margin-bottom: 2vh !important;
    }
    .dropdown{
        font-size: 3.6vh;
    }
    .dropdown .onama-nav{
        font-size: 1.82vh;
    }
    .dropdown .buttons > *{
        width: 8.6vh;
        height: 7.4vh;
        font-size: 4vh !important;
    }
    .dropdown .buttons :nth-of-type(2){
        font-size: 2.5vh !important;
    }
    .dropdown{
        padding-top: 11.9vh;
    }
}
/*#endregion*/
/*#region FOOTER*/
.footer .row{
    margin: 0px !important;
}
.footer{
    margin-top: 25px;
    padding-top: 75px;
    padding-bottom: 100px;
    background: linear-gradient(360deg, rgba(0,0,0,1) 0%, rgb(56, 71, 87) 100%);
    color: white;
    text-align: center !important;
}
.footer p{
    margin-bottom: 10px;
    color:rgba(255, 255, 255, 0.6);
    font-size: 16px;
}
.footer-booking{
    position: relative;
    display: flex;
    justify-content: center;
    text-align: center;
    background:url("background2.jpg");
    color: white;
    margin-top: 98px;
    height: 747px;
}
.footer-booking-container{
    padding: 12% 0;
    margin: 0px 15px;
    width: 100%;
    max-width: 1040px;
    font-family: 'Work Sans', sans-serif;
    z-index: 1;
}
.footer-booking-container form{
    display: flex;
    flex-direction: column;
}
.footer-booking-container form > *{
    gap: 15px;
}
.footer-booking-container .footer-btn{
    height: 55px;
    width: 100%;
}
.footer-booking-container .checkbox{
    margin: 0px;
    padding: 10px;
}
.footer-booking-container input:not(.checkbox){
    padding-left: 5%;
    background: white;
    border: none;
    opacity: 0.8;
    height: 55px;
    width: 100%;
}
.footer-booking-container input::placeholder{
    color: #74879A;
}
.footer-booking-h{
    font-weight: 500;
}
.footer-booking-p{
    font-weight: 400;
}
.footer-datepick{
    color-scheme: dark;
    background: rgba(0,0,0,0.7) !important;
    border: none;
    padding-right: 10px;
}
.footer-booking .naruci-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255,0,0, 0.7) !important;
}
.footer-booking-bg{
    background: linear-gradient(rgb(50, 63, 71), gray);
    opacity: 0.99;
    width: 100%;
    height: 747px;
    margin-top: -747px;
    mix-blend-mode: multiply;
}

/*#endregion*/
/*#region NARUDZBA*/
.narudzba-widget{
    width: 470px;
    padding: 25px 0px;
    background-color: rgba(255,255,255,0.34);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.narudzba-widget form{
    display: flex; 
    flex-direction: column;
    gap: 4px;
    width: 360px;
}
.narudzba-widget form input{
    padding: 15px;
    background-color: #E7E7E7;
    color: #74879A;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    border: none;
}
.narudzba-widget form .terms-check{
    display: inline-flex;
    text-align: start;
    font-family: 'Work Sans', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: white;
    padding-bottom: 10px;
    margin-top: 15px;
}
.radno-vrijeme-home{
    color: white;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 225px;
    opacity: 0.8;
    font-weight: 300;
    font-size: 15px;
}
.radno-vrijeme-home p{
    font-weight: 300;
    font-size: 15px;
    font-family: 'Poppins', sans-serif;
}
.radno-vrijeme-home h4{
    font-size: 20px;
}
/*#endregion*/
/*#region LAYOUT*/
.content-center{
    display: flex; 
    justify-content: center;
}
/*#endregion*/
/*#region LANDING*/
.landing-container{
    width: 1430px;
    padding-top: 160px;
    z-index: 1;
    margin-right: 10px;
    margin-left: 30px;
}
.landing-row{
    display: flex;
    justify-content: center;
}
.landing-rectangle{
    background: url("rectangle.svg");
    mix-blend-mode: multiply;
    width: 100%;
    height: 423px;
    position: absolute;
    top: 685px;
    display: flex;
    justify-content: center;
    padding-right: 15px
}
.landing-rectangle > div > div{
    top: 200px;
    width: 466px;
    height: 205px;
    background: transparent url("rectangle2.svg") 0% 0% no-repeat padding-box;
    background-size: cover;
    mix-blend-mode: overlay;
    opacity: 0.71;
}
.landing-rectangle > div{
    width: 1460px;
    display:flex;
    justify-content: end;
    align-items: flex-end;
}
.landing{
    min-height: 1170px;
    height: 100%;
    width: 100%;
    background: transparent url("wallpaper.jpg") 0% 0% no-repeat padding-box;
    background-size: cover;
    background-position: center;
}
.landing-about{
    margin-bottom: 150px;
    margin-right: 15px;
    font-size: 20px;  
    color:white; 
    font-weight: 600; 
    max-width: 645px;
    opacity: 0.7;
}
.landing-about > p{
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    font-weight: 600;
}
.landing-about-mobile{
    display: none;
}
.landing-about-container{
    width: 100%;
    max-width: 960px;
    display: flex;
    justify-content: center;
    align-items: end;
}
.landing-bg-mobile{
    display: none;
}
/*#endregion*/
/*#region AKTUALNO-HOME*/
.aktualno-teaser{
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1240px;
    gap: 35px;
    margin-left: 20px;
}
.aktualno-teaser img{
    width: 100%;
    height: auto;
    object-fit: contain;
}
.aktualno-teaser-container{
    margin-top: 100px;
    width: 1320px;
    display: flex;
    justify-content: end;
}
.aktualno-teaser-content{
    width: 100%;
    max-width: 516px;
    margin: auto 0;
}
.aktualno-teaser-name{
    font-weight: 400;
    font-size: 17px;
    color: #9D0C03;
    letter-spacing: 4.25px;
    margin-bottom: 10px;
}
.aktualno-teaser-title{
    font-size: 35px;
    font-weight: 600;
    margin-bottom: 10px;
}
.aktualno-teaser-text{
    margin-bottom: 35px;
    letter-spacing: 0.75px;
    line-height: 20px;
    color: #2D3946;
}
/*#endregion*/
/*#region IZDVOJENA-USLUGA*/
.izdvojena-usluga-container{
    height: 899px;
    width: 100%;
    background: transparent url("pic5.jpg") 0% 0% no-repeat padding-box;
    margin-top: 84px;
    display: flex;
    justify-content: end;
    align-items: center;
}
.izdvojena-usluga-mobile{
    display: none;
    width: 100%;
    max-width: 600px;
    margin: auto;
    margin-top: 80px;
    background-color: #9D0C03;
    box-shadow: 0px 30px 100px -30px rgb(153, 153, 153);
}
.izdvojena-usluga-mobile > a > div{
    padding: 38px;
    color: #FFF5F5;
    opacity: 0.97;
}
.izdvojena-usluga-mobile .izdvojena-usluga-name{
    font-size: 15px;
    margin-bottom: 15px;
}
.izdvojena-usluga-mobile .izdvojena-usluga-title{
    font-size: 25px;
    margin-bottom: 15px;
}
.izdvojena-usluga-mobile .izdvojena-usluga-text p{
    font-size: 15px;
}
.izdvojena-usluga-mobile .img{
    content: url("pic6.jpg")
}
.izdvojena-usluga{
    color: white;
    height: 474px;
    width: 944px;
    opacity: 1;
}
.izdvojena-usluga-content{
    position: relative;
    color: #FFF5F5;
    margin-top: -474px;
    height: 100%;
    padding-top: 81px;
    padding-left: 121px;

}
.izdvojena-usluga-bg{
    background: #9D0C03;
    opacity: 0.63;
    box-shadow: 10px 10px 99px #00000047;
    mix-blend-mode: multiply;
    height: 100%;
    width: 100%;
}
.izdvojena-usluga-name{
    margin-bottom: 30px;
    letter-spacing: 5px;
    font-weight: 400;
}
.izdvojena-usluga-title{
    font-size: 35px;
    max-width: 530px;
    font-weight: 600;
    line-height: 45px;
}
.izdvojena-usluga-text{
    max-width: 570px;
}
.izdvojena-usluga-text p{
    font-size: 17px;
    font-weight: 400;
    line-height: 30px;
}
/*#endregion*/
/*#region IZDVOJENI-SAVJETI*/
.izdvojeni-savjeti{
    display: flex;
    justify-content: center;
    margin-top: 91px;
    text-align: center;
    color: #2D3946;
    padding: 0px 20px;
}
.izdvojeni-savjeti > div{
    width: 100%;
    max-width: 868px;
}
.izdvojeni-savjeti p{
    max-width: 760px;
    margin: auto;
}
.izdvojeni-savjeti-name{
    margin-bottom: 55px;
    font-size: 40px;
    font-weight: 600;
}
.izdvojeni-savjeti .btn-round{
    margin-top: 56px;
    display: inline-block;
}
/*#endregion*/
/*#region GALERIJA-HOME*/

.galerija-home-container{
    margin-top: 80px;
}
.galerija-home-mobile{
    display: none;
}
.galerija-home-mobile img{
    width: 100%;
}
.galerija-home-mobile > div{
    width: 100%;
    max-width: 600px;
}
.galerija-home-bg{
    background: linear-gradient(#74879A30, white);
    opacity: 0.24;
    height: 393px;
}
.galerija-home{
    position: relative;
    margin-top: -393px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.galerija-home-name{
    color: #74879A;
    font-size: 40px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 53px;
    margin-top: 87px;
}
.galerija-home .btn-round{
    margin-top: 50px;
}
.swiper, .swiper-container{
    width: 100%;
    max-width: 1440px;
    position: relative;
}
.swiper-container{
    padding: 0px 75px;
}
.swiper-slide{
    -webkit-user-drag: none;
    user-select: none;
    height: 338px;
    object-fit: contain;
}
.swiper-button-next, .swiper-button-prev {
    color:rgba(0, 0, 0, 0);
    width: 110px;
    height: 110px;
    background-size: contain;
    margin-top: -40px;
    z-index: 2;
}
.swiper-button-next{
    background-image: url("swiper-button-next.svg");
    margin-right: -10px;
}
.swiper-button-prev{
    background-image: url("swiper-button-prev.svg");
}
/*#endregion*/
/*#region CJENIK*/
.cjenik-bg{
    content: url("cjenik-bg.jpg");
    object-fit: cover;
    z-index: 0;
    height: 1400px;
    object-position: top;
    width: 100%;
}
.cjenik h1{
    margin-bottom: 60px;
}
.cjenik-grid{
    width: 100%;
    max-width: 835px;
    margin: auto;
}
.cjenik-grid > div{
    width: 100%;
    max-width: 347px;
    padding-bottom: 45px;
    float: left;
    clear: left;
    display: block;
    margin-bottom: 10px;
    position: relative;
}
.cjenik-grid > div:nth-child(2n){
    float: right;
    clear: right;
}
.cjenik-grid > div:nth-child(odd){
    margin-right: 135px;
}
.cjenik-title{
    color: red;
    font-size: 30px;
    font-weight: 600;
}
.cjenik-item{
    display: flex;
    justify-content: space-between;
    font-size: 18px;
    color: #707070;
    font-family: 'Work Sans', sans-serif;
    font-weight: 400;
    padding: 8px 0px;
}
.cjenik-item:not(:nth-of-type(1)){
    border-top: 1px solid #d1d1d1;
}
.cjenik-item strong{
    font-weight: 600;
    font-size: 18px;
    color: rgb(56, 56, 56);
    padding: 0px 5px;
}
.cjenik{
    margin-top: calc(-1400px + 423px);
}
/* anchor price (cijena na 10.9.2026.) under each price */
.cjenik-col-sidrena{
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
    text-align: right;
}
.cjenik-col-sidrena > :nth-child(2){
    margin-top: 2px !important;
}
.cjenik-sidrena{
    font-size: 12px;
    line-height: 1.3;
    color: #8a8a8a;
    white-space: nowrap;
}
.cjenik-akcija{
    display: inline-block;
    margin-left: 6px;
    padding: 0px 6px;
    font-size: 12px;
    color: #fff;
    background: #ef7d00;
    border-radius: 3px;
    vertical-align: middle;
}
.cjenik-napomena{
    clear: both;
    max-width: 835px;
    margin: 0px auto;
    padding: 10px 15px 60px;
    font-family: 'Work Sans', sans-serif;
}
.cjenik-napomena p{
    font-size: 14px;
    color: #707070;
    margin-bottom: 8px;
}
.cjenik-napomena a,
.cjenik-arhiva a{
    color: #ef7d00;
}
/* price list archive */
.cjenik-arhiva-body{
    max-width: 835px;
    margin: 0px auto;
    padding: 0px 15px 80px;
    font-family: 'Work Sans', sans-serif;
}
.cjenik-arhiva-body > p{
    color: #707070;
}
.cjenik-arhiva-body .cjenik-title{
    margin-top: 40px;
}
.cjenik-arhiva-item{
    align-items: center;
}
.cjenik-arhiva-broj{
    font-size: 14px;
    color: #a0a0a0;
    margin-left: 6px;
}
.cjenik-arhiva-links{
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}
.cjenik-arhiva-links a{
    font-weight: 600;
    font-size: 15px;
    color: rgb(56, 56, 56);
    border: 1px solid #d1d1d1;
    border-radius: 4px;
    padding: 2px 12px;
    text-decoration: none;
    background: #fff;
}
.cjenik-arhiva-links a:hover{
    color: #fff;
    background: #74879A;
    border-color: #74879A;
}
.footer-cjenik{
    margin-top: 10px;
}
/*#endregion*/
/*#region KONTAKT*/
.kontakt-bg{
    content: url("kontakt-bg.jpg");
    object-fit: cover;
    z-index: 0;
    height: 1280px;
    object-position: top;
    width: 100%;
}
.kontakt{
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: calc(-1280px + 423px);
}
.kontakt h1{
    margin-bottom: 25px;
}
.kontakt p{
    margin: 0px;
    color: #545C66 !important;
}
.kontakt > div{
    width: 100%;
    max-width: 715px;
    padding-bottom: 50px;
}
.kontakt > div:nth-of-type(1){
    border-bottom: #707070 1px solid;
    margin-bottom: 30px;
}
.kontakt-karta{
    max-width: 958px;
    width: 100%
}
.kontakt-karta-mobile{
    display: none;
}
/*#endregion*/
/*#region FRIZERSKI*/
.frizerski-container{
    display: flex;
    justify-content: center;
    margin-top: calc(-1280px + 423px);
}
.frizerski{
    width: 100%;
    max-width: 711px;
}
.frizerski-bg{
    content: url("frizerski-bg.jpg");
    object-fit: cover;
    z-index: 0;
    height: 1280px;
    object-position: top;
    width: 100%;
}
.frizerski > div{
    padding-bottom: 20px;
}
.frizerski > div:nth-of-type(2){
    border-bottom: #707070 1px solid;
    margin-bottom: 30px;
}
.frizerski > p{
    margin: 0px;
}
.frizerski > .images{
    padding: 0px;
    margin-top: 40px;
    margin-bottom: 60px;
    width: 100%;
    align-items: center;
    display: flex;
}
.frizerski > .images > *{
    padding: 0px;
    width: 50%;
}
.frizerski .page-title{
    margin-bottom: 50px;
}
/*#endregion*/
/*#region GALERIJA*/
.galerija-bg{
    object-fit: cover;
    z-index: 0;
    height: 1080px;
    object-position: bottom;
    width: 100%;
    content: url("galerija-bg.jpg")
}
.galerija h1, .galerija p{
    margin-bottom: 40px;
}
.galerija p{
    padding: 0px 7px;
}
.galerija .images{
    max-width: 708px;
    margin-bottom: -95px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: auto;
}
.galerija .images > *{
    margin-bottom: 16px;
    width: 100%;
}
.galerija{
    margin-top: calc(-1080px + 423px);
}
/*#endregion*/
/*#region AKTUALNO*/
.aktualno{
    margin-top: calc(-1080px + 423px);
}
.aktualno .page-title{
    margin-bottom: 60px;
}
.aktualno p{
    margin: 0px;
}
.aktualno-post{
    padding-bottom: 50px;
    margin-bottom: 36px;   
    text-align: center;
}
.aktualno-post:not(:last-child){
    border-bottom: #707070 1px solid;
}
.aktualno-post img{
    width: 100%;
    margin-bottom: 36px;
}
.aktualno-post-title{
    margin-bottom: 25px;
}
/*#endregion*/
/*#region SAVJETI*/
.savjeti{
    margin-top: calc(-1400px + 423px);
}
.savjeti-bg{
    object-fit: cover;
    z-index: 0;
    height: 1400px;
    object-position: top;
    width: 100%;
    content: url("savjeti-bg.jpg");
}
.savjeti .page-title{
    margin-bottom: 40px;
}
.savjeti p{
    margin-bottom: 65px;
}
.savjeti-pitanje{
    width: 100%;
    height: 135px;
    margin-top: 25px;
    font-size: 18px;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: rgba(116, 135, 154, 0.14);
    transition: background-color 0.4s, padding 0.4s;
    cursor: pointer;
    padding: 0px 10px;
    text-align: center;
}
.savjeti-pitanje:hover{
    background: #FF1717;
    padding-bottom: 10px;
    color: white;
}
.savjeti-odgovor{
    background: white;
    padding: 80px 130px;
    box-shadow: 10px 10px 20px #00000017;
    margin-bottom: -25px;
}
.savjeti-odgovor p{
    color: #74879A;
    font-size: 20px;
    margin: 0px;
}
.savjeti-odgovor h1{
    color: #2D3946 !important;
    font-size: 22px !important;
    margin-bottom: 40px;
}
/*#endregion*/
.btn-round{
    font-size: 20px;
    padding: 10px 0;
    border-radius: 25px;
    border: 1px solid #74879A;
    color: #74879A;
    cursor: pointer;
    width: 100%;
    max-width: 331px;
    text-align: center;
}
.btn-hover-red:hover{
    background: #FF0000;
    color: white;
    border-color: rgba(0, 0, 0, 0);
}
.checkbox{
    border: 1px solid white !important;
    margin-right: 20px;
    border-radius: 0px !important;
}
.checkbox:not(:checked){
    background: none !important;
}
.naruci-btn{
    background-color: #FF0000;
    padding: 20px;
    font-size: 20px;
    font-weight: 600;
    color: white;
    cursor: pointer;
    font-family: 'Poppins', sans-serif;
    border: none;
}
html, body{
    margin: 0px;
    padding: 0px;
}
body{
    font-family: 'Poppins', sans-serif;
    color: black;
}
h1{
    font-size: 40px;
}
h3{
    font-size: 20px;
}
a{
    text-decoration:none !important;
    color: unset;
}
a:hover{
    color: unset;
}
p{
    font-family: 'Work Sans', sans-serif;
    font-size: 15px;
}
p a{
    color: #db2b1f !important;
}

.cookie-banner {
    position: fixed;
    bottom: 0px;
    width: 100%;
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 15px;
    background-color: rgba(255,0,0, 0.8);
    color: white;
    z-index: 10;
    padding: 15px 10px;
  }
.cookie-banner p{
    text-align: center;
    margin-bottom: 0px;
}
.close-cookie-banner {
cursor: pointer;
color: white;
border-color: white;
transition: background-color 0.2s
}
.close-cookie-banner:hover {
background-color: rgb(240, 0, 0);
}

.form-status{
    position: fixed;
    top: 0px;
    width: 100%;
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    background-color: rgba(0, 165, 0, 0.9);
    color: white;
    z-index: 10;
    padding: 15px 10px;
    text-align: center;
}
.form-status p{
    margin: 0px;
    font-size: 16px;
    width: 100%;
}
.close-form-status{
    cursor: pointer;
    margin-right: 25px;
}
.xdsoft_current{
background: #DB2B1F !important;
box-shadow: none !important;
}
.xdsoft_today:not(.xdsoft_current){
    color: #DB2B1F !important;
}
.xdsoft_datetimepicker{
    z-index: 1 !important;
    border: none !important;
    padding-bottom: 0px !important;
}
.xdsoft_label{
    z-index: 1  !important;
}
.page{
    padding-top: 100px;
    width: 1194px;
    background: rgba(255, 255, 255, 0.9);
}
.page-container{
    width: 100%;
    display: flex;
    justify-content: center;
    z-index: 1;
}
.page h1{
    color: #74879A;
    text-align: center;
    font-weight: 600;
    font-size: 50px;
}
.page h2{
    color: #74879A;
    text-align: center;
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 30px;
}
.page p{
    color: #2D3946;
    text-align: center;
}
.nav-logo :nth-child(1){
    font-size: 20px;
    font-weight: 500;
    line-height: 37px;
}
.nav-logo :nth-child(2){
    font-size: 40px;
    font-weight: 500;
    line-height: 37px;
}
.footer a{
    color: unset !important;
}
.footer a:hover{
    color: white !important;
}
.cjenik-col{
    display: flex;
    justify-content: end;
    width: 155px;
}
.cjenik-col > *{
    padding: 0px !important;
}
.cjenik-col > :nth-child(2){
    margin-top: 4px;
}
@media (max-width: 450px){
    .frizerski > .images{
        flex-direction: column;
    }
    .frizerski > .images >*{
        width: 100%;
    }
}
@media (max-width: 900px){
    .aktualno-teaser-container{
        margin-top: 70px;
    }
    .nav-logo :nth-child(1){
        font-size: 15px;
        line-height: 27px;
    }
    .nav-logo :nth-child(2){
        font-size: 30px;
        line-height: 27px;
    }
    .nav-tel{
        padding-right: 0px;
        padding-left: 0px;
    }
    .cookie-banner{
        flex-direction: column;
    }
    .kontakt > div{
        padding-bottom: 40px;
    }
    .kontakt > div:nth-of-type(1){
        margin-bottom: 40px;
    }
    .aktualno.page{
        padding-left: 0px;
        padding-right: 0px;
    }
    .aktualno .page-title{
        margin-bottom: 40px;
    }
    .aktualno-post-title{
        font-size: 20px !important;
        margin-bottom: 20px !important;
    }
    .aktualno-post p{
        font-size: 14px;
    }
    .aktualno-post-container{
        max-width: 500px !important;
    }
    .aktualno-post > *:not(img){
        padding-left: 15px;
        padding-right: 15px;
    }
    .frizerski p:nth-of-type(1){
        font-size: 14px;
    }
    .frizerski .page-title{
        margin-bottom: 30px;
    }
    .savjeti-pitanje{
        font-size: 15px;
        margin-top: 10px;
        height: 100px;
    }
    .savjeti-odgovor{
        margin:0px;
        box-shadow: none;
        padding: 0px;
        padding-top: 30px;
        padding-bottom: 20px;
    }
    .savjeti-odgovor h1{
        font-size: 20px;
        margin-bottom: 20px !important;
    }
    .savjeti-odgovor p{
        font-size: 16px;
    }
    .savjeti .page-title{
        margin-bottom: 18px;
    }
    .savjeti p{
        margin-bottom: 20px;
        font-size: 14px;
    }
    .kontakt-karta{
        display: none;
    }
    .kontakt-karta-mobile{
        display: block;
        margin-bottom: -60px;
    }
    .page{
        margin-top: 0px;
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 50px;
        width: 100%;
        max-width: 100%;
    }
    .page h1{
        font-size: 30px;
        margin-bottom: 40px;
    }
    .galerija h1{
        margin-bottom: 25px;
        margin-left: 30px;
        margin-right: 30px;
    }
    .galerija p{
        margin-left: 30px;
        margin-right: 30px;
    }
    .galerija{
        padding-left: 0px;
        padding-right: 0px;
    }
    .cjenik-bg{
        max-height: 400px;
        width: 100%;
        height: auto;
        content: url("cjenik-bg-mobile.jpg");
        object-position: center;
        margin-top: 60px;
    }
    .kontakt-bg{
        max-height: 250px;
        height: auto;
        content: url("kontakt-bg-mobile.jpg");
        object-position: center;
        margin-top: 160px;
    }
    .frizerski-bg{
        max-height: 250px;
        height: auto;
        content: url("frizerski-bg-mobile.jpg");
        object-position: center;
        margin-top: 160px;
    }
    .savjeti-bg{
        max-height: 400px;
        height: auto;
        content: url("savjeti-bg-mobile.jpg");
        object-position: center;
        margin-top: 100px;
    }
    .galerija-bg{
        max-height: 339px;
        height: auto;
        object-position: center;
        margin-top: 60px;
        content: url("galerija-bg-mobile.jpg");
    }
    .kontakt h1{
        margin-bottom: 18px;
    }
    .cjenik-title{
        font-size: 25px;
    }
    .cjenik-item{
        font-size: 16px;
    }
    .cjenik-grid > div{
        display: block;
        margin: 0px !important;
        max-width: 100%;
        padding-bottom: 60px;
    }
    .izdvojena-usluga-container{
        display: none;
    }
    .izdvojena-usluga-mobile{
        display: block;
    }
    .swiper-container{
        display: none;
    }
    .galerija-home-mobile{
        display: block;
    }
    .galerija-home-name{
        margin-top: 28px;
        margin-bottom: 10px;
        font-size: 25px;
    }
    .galerija-home .btn-round{
        margin-top: 23px;
    }
    .izdvojeni-savjeti{
        margin-top: 50px;
    }
    .izdvojeni-savjeti > div{
        max-width: 600px;
    }
    .izdvojeni-savjeti p{
        font-size: 14px;
        margin-bottom: 20px;
    }
    .izdvojeni-savjeti .btn-round{
        margin-top: 23px;
    }
    .izdvojeni-savjeti .savjeti-pitanje{
        margin: auto;
        margin-top: 8px;
        max-width: 600px;
    }
    .izdvojeni-savjeti-name{
        font-size: 25px;
        margin-bottom: 8px;
    }
    .aktualno-teaser{
        flex-direction: column;
        align-items: center;
        margin: 0px;
    }
    .aktualno-teaser > *{
        max-width: 600px !important;
    }
    .aktualno-teaser-content{
        padding: 0 20px;
    }
    .aktualno-teaser-name{
        font-size: 15px;
    }
    .aktualno-teaser-title{
        font-size: 25px;
    }
    .aktualno-teaser-text{
        font-size: 14px;
    }
    .narudzba-widget{
        max-width: 470px;
        width: 100%;
        background-color: #D0D6DD;
    }
    .narudzba-widget form{
        width: 70vw;
        max-width: 360px;
        min-width: 306px;
    }
    .narudzba-widget input:not(.checkbox){
        background-color: #F5F6F8 !important;
    }
    .narudzba-widget form .terms-check{
        color: #74879A;
        border-color: #74879A;
    }
    .narudzba-widget form .checkbox{
        border-color: #74879A !important;
    }
    .footer-booking{
        margin-top: 60px;
        background-image: url("background2-mobile.jpg");
        background-size: cover;
    }
    .footer-booking-container{
        max-width: 600px;
    }
    .footer-booking form > *{
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .footer-booking form > * > *{
        width: 100% !important;
    }
    .footer-booking form{
        height: 100%;
    }
    .landing{
        background: none;
        min-height: unset;
    }
    .landing-about{
        display: none;
    }
    .landing-about-mobile{
        font-size: 16px;
        font-family: 'Poppins', sans-serif;
        font-weight: 600;
        margin: 0px 5%;
        z-index: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 450px;
        color: #2D3946;
    }
    .landing-about-mobile p{
        margin: 0px;
    }
    .narudzba-widget{
        position: absolute;
        top: 500px;
    }
    .landing-bg-mobile{
        display: block;
        width: 100%;
        height: 846px;
        object-fit: cover;
        padding-top: 150px;
        content:url("wallpaper-mobile.jpg");
    }
    .landing-container{
        margin: 0px;
        padding: 0px;
    }
    .landing-rectangle{
        display: none;
    }
    .landing-row{
        flex-direction: column;
        gap: 15px;
    }
    .landing-row > *{
        display: flex;
        justify-content: center;
    }
    .radno-vrijeme-home{
        display: none;
    }
    .nav-background{
	    position: fixed;
        opacity: 1;
        height: 160px;
        background: linear-gradient(360deg, rgba(0,0,0,1) 0%, rgba(80, 102, 124, 0.6) 100%);
        top: 0px;
        transition: top 0.3s;
    }
    .navbar{
	    position: fixed;
        padding-top: 78px;
        padding-bottom: 15px;
        top: 0px;
        transition: top 0.3s;
    }
    .navbar h1{
        font-size: 30px;
    }
    .navbar h3{
        font-size: 15px;
    }
    .nav-header{
	    position: fixed;
        margin: 0px;
        justify-content: center;
        top: 0px;
        transition: top 0.3s;
    }
    .nav-header > *{
        width: 100%;
        justify-content: center;
    }
    .nav-header .nav-info{
        background: black;
        font-size: 12px;
        padding-bottom: 10px;
    }
    .nav-items, .nav-lang{
        display: none;
      }
    .nav-ham{
        display: flex !important;
    }
    .nav-scroll{
        top: -60px !important;
    }
    .galerija-home-container{
        margin-top: 40px;
    }
    .frizerski-container{
        padding-left: 0px;
        padding-right: 0px;
    }
    .frizerski > *:not(img){
        padding-left: 30px;
        padding-right: 30px;
    }
    .izdvojena-usluga-title{
        line-height: 30px;
    }
}
#datetimepicker2::placeholder{
    color: white;
}
.footer p:nth-last-of-type(1){
    font-size: 12px;
}
.xdsoft_inline{
    min-width: 306px !important;
    margin: auto;
}
.terms-check{
    font-size: 12px;
}

.hvala{
    height: min-content;
    padding-top: 90px;
    padding-bottom: 90px;
    box-shadow: inset 0px 0px 0px 15px greenyellow;
}
.hvala h1{
    margin-bottom: 20px;
    color: #6F787F;
}
.hvala p{
    font-weight: 600;
    font-size: 20px;
    color: #6F787F;
}