﻿
/*--------------------HEADER--------------------*/

#quik-search-btn {
    margin-left: 15px;
    margin-right: 15px;
}

/*-------------------PAGINACIJA------------------*/
.pagination-area {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-top: 20px;
}

.dugmic {
    padding: 6px 12px;
    background-color: #D81517;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

    .dugmic:hover {
        background-color: #9ca0a6;
    }

.textP.polje {
    width: 40px;
    text-align: center;
    font-weight: bold;
}
.img-mob {
    height: 60% !important;
}
/*---------------------ČLANAK---------------------*/
.clanak-title:hover {
    color: #D81517;
}
/*--------------------POČETNA--------------------*/
.header-transparent:after {
    height: 95px !important;
}
/*.owl-stage-outer {
    background-color: #f2f2f2;
}*/

.news-outer {
    background-color: #f2f2f2;
    padding-bottom: 0px;
}
.news-info {
    background-color: #fcfcfc;
    border-radius: 5px;
    margin: 10px;
    width: 270px;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    cursor: grab;
}
.news-nav {
    position: absolute;
    left: 48%;
    top: 82%;
}

/*Slajder na početnoj*/
.main-slider {
    width: 1000%;
}
/*Naslov-o nama na Default*/
.titleOnama {
    text-align: center;
    color: #333333;
    font-size: 22px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 0px;
    line-height: normal;
    margin-bottom: 5px;
    letter-spacing: 0.5px;
    background: #fff;
    width: auto;
    border-radius: 15px;
}

#onama li {
    font-size: 15px;
    line-height: 2.1;
}

#onama {
    list-style-type: none;
    padding-left: 0; /* ukloni defaultni razmak s lijeve strane */
}
.baner-web {
    display: block !important;
}

.baner-mob {
    display: none !important;
}


/*--------------------LOGIN--------------------*/
/*Login forma*/
.dlab-form {
    border-radius: 5px;
}

/*Zapamti i remamber me*/
#loginDiv {
    display: flex;
    justify-content: center;
    text-align: center;
}


.bottom a {
    font-size: 18px;
    font-weight: bold;
    text-decoration: underline;
}

.bottom {
    position: center;
    width: 100%;
}

.dlab-bnr-inr:before {
    display: none !important;
}

.p-a30 {
    padding: 30px;
    background-color: #f5f6f6;
}
.brand-box:hover {
    cursor: pointer !important;
}
.btn-osvjezi {
    width: 40%;
    display: flex;
    justify-content: center;
    height: 20px;
    align-items: center;
    font-size: 15px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 25px;
}
/*--------------------KATEGORIJE--------------------*/
#news-title-main {
    font-family: Raleway, sans-serif;
    font-weight: 600;
    text-align: center;
    background-color: #fff;
    width: auto;
    border-radius: 15px;
}


.news-title {
    font-size: 15px !important;
    overflow: hidden !important;
    min-height: 47px;
    max-height: 48px;
}

    .myBox {
        border: 1px solid #e9e9e9;
    }

.product-item .sale {
    position: absolute;
    right: -5px;
    top: 10px;
    z-index: 2;
}

.site-button-secondry:after, .site-button:after {
    background-color: #ffffff;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.1;
    position: absolute;
    top: 0;
    transform: skewX(25deg);
    transition: all 0.5s ease 0s;
    width: 0;
    z-index: -1;
}

.product-item .sale:after {
    border-right: 5px solid rgba(0, 0, 0, 0);
    border-top: 4px solid #8f0000;
    bottom: 1px;
    content: "";
    position: absolute;
    right: 0;
}

.myPriceBox {
    font-size: 18px;
    line-height: 25px;
    height: 60px;
}

    .myPriceBox del {
        font-size: 14px;
    }


#containerKosarica {
    padding-top: 170px;
}
/*--------------------ARTIKAL--------------------*/

/*Slika artikla*/
.slider-artikal {
    position: relative;
    max-width:600px;
    width: 100%;
    height: auto;
    margin: 50px auto;
    overflow: hidden;
    border-radius: 10px;
}

.slides-artikal {
    display: flex;
    width: 100%;
    height: 100%;
    transform: translateX(0);
    /*transition: transform 0.5s ease-in-out;*/
}
.slides-artikal.animated {
    transition: transform 0.5s ease-in-out;
}

    .slides-artikal img {
        width:100%;
        min-width: 100%;
        height: auto;
        display: block;
        /*object-fit: cover;*/
    }

.nav-artikla {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem;
    color: white;
    background: rgba(0, 0, 0, 0.5);
    padding: 5px 10px;
    cursor: pointer;
    user-select: none;
    z-index: 10;
}

.prev {
    left: 10px;
}

.next {
    right: 10px;
}

/*Slika artikla - Kraj*/


.sale-det {
    position: absolute;
    right: 0;
}

.text-white {
    display: flex;
    justify-content: center;
    font-size: 30px;
    text-align: center;
}

.btnPrint {
    font-size: 20px;
}

    .btnPrint i:hover {
        color: red;
    }

.tableHeader tr th {
    padding: 15px;
    color: #fff;
    background-color: #d42427;
}

.extraDescr {
    overflow: hidden;
    height: 46px;
}
.spnVc {
    color: #cb2429;
    font-size: 15px;
}
/*Cijena u detaljno*/
.product-price {
    font-size: 24px;
}
/*Ikona košarice u nav*/
.fa-shopping-bag {
    color: #fff;
    font-size: 22px;
}
/*--------------------MOJ-PROFIL--------------------*/
#custom-margin {
    margin-top: 150px !important;
}

/*--------------------KOŠARICA--------------------*/
.input-text.qtyUser {
    width: 60px;
}

.cart-remove-item {
    font-size: 25px;
    color: #417ab5;
}

.alert-ad-cart-max {
    display: none;
    position: fixed;
    left: 0%;
    top: 0%;
    width: 100%;
    height: 100%;
    z-index: 9998;
    background: center no-repeat #fff;
    opacity: 0.9;
    text-align: center;
}

.hNas {
    height: 47px;
    font-size: 17px;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

.header-transparent .main-bar {
    background-color: rgb(0 0 0 / 44%);
}

/*--------------------PROMJENA LOZINKE-popup--------------------*/


.overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    transition: opacity 500ms;
    visibility: hidden;
    opacity: 0;
    z-index: 999;
    margin-top: 150px;
}

    .overlay:target {
        visibility: visible;
        opacity: 1;
    }

.popup {
    position: relative;
    margin: 100px auto;
    padding: 20px 30px;
    background: #fff;
    border-radius: 5px;
    width: 300px;
    max-width: 400px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    z-index: 1000;
    font-family: Arial, sans-serif;
}

    .popup h3 {
        margin-top: 0;
        color: #333;
        text-align: center;
    }

    .popup .close {
        position: absolute;
        top: 15px;
        right: 20px;
        text-decoration: none;
        font-size: 24px;
        color: #333;
        font-weight: bold;
        cursor: pointer;
    }

        .popup.close:hover {
            color: #d81517;
        }

    .popup input[type="password"], .popup input[type="text"] {
        height: 25px;
        width: 100%;
        padding: 10px;
        margin-top: 5px;
        border-radius: 4px;
        border: 1px solid #ccc;
        box-sizing: border-box;
        font-size: 14px;
    }

    #showPassword {
        margin-top: 10px;
        margin-right: 5px;
        cursor: pointer;
        width: 30px;
        height: auto;
    }
    .popup label {
        cursor: pointer;
    }


.popup .site-button {
    height: auto;
    margin-top: 20px;
    width: 70%;
    padding: 10px;
    background-color: #d81517;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
}

/*--------------------MEDIA-responsive--------------------*/


@media (max-width: 480px) {
    .text-white {
        font-size: 24px;
    }

    #custom-margin {
        margin-top: 0px;
    }
    #upcoming {
        margin-top: -75px;
    }
}

@media only screen and (max-width: 768px) {
    .woo-entry {
        width: 100%;
        overflow: scroll;
    }

    #custom-margin {
        margin-top: 0px !important;
    }

    .box {
        width: 70%;
    }

    .popup {
        width: 70%;
    }
    /*Banner na vrhu kategorija, logina...*/

    .bnrTop {
        display: none;
    }
    .dlab-info {
        background-color: #fcfcfc;
        border-radius: 5px;
       margin-top:0px !important;
        width: auto;
        text-align: center;
    }
    .baner-web {
        display: none !important;
    }

    .baner-mob {
        display: block !important;
    }
    .onama-div-mob{
        margin-top: -320px !important;
    }
}

@media (max-width: 1024px) {
    .text-white {
        font-size: 45px;
    }
}


#custom-margin {
    margin-top: 0px;
}


.text-white {
    font-size: 30px;
}

#containerKosarica {
    padding-top: 50px;
}
/*Sider u proizvodima*/
.side-bar, .widget, .dlab-accordion {
    width: 100% !important;
    box-sizing: border-box;
}

.acod-body {
    width: 100% !important;
}


.acod-body {
    width: 100% !important;
    box-sizing: border-box;
}
#web-design-1 strong {
    font-weight: bold !important;
}