﻿header {
    background-color: #be1d2c !important;
}
.secondnav {
    background-color: #9E0917;
    display: flex;
    justify-content: space-between;
    width: 100%;
}

    .secondnav div {
        padding: 12px 12px;
    }

        .secondnav div:first-child {
            width: 70%;
            order: 1;
            background-color: black;
            color: white;
            border-radius: 50px 0 0 0;
            text-align: center;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0px 100px;
            font-family: 'Linecut';
            text-transform:uppercase;
            font-size:15px;
        }


.dark-mode .secondnav div:first-child {
    background-color: white;
    color: black;
}

.secondnav div:first-child a {
    text-decoration:none;
    color:white;
    transition: all ease-in-out 0.5s;
}


.dark-mode .secondnav div:first-child a {
    color: black;
}

.secondnav div:first-child a:hover {
    color: #be1d2c;
    cursor: pointer;
}


.secondnav div:last-child {
    width: 30%;
    order: -1;
    font-family: TextBoldPS;
    font-size: 15px;
    text-align:center;
}


header .nav-link object {
    pointer-events: none;
    margin:0px 20px;
}

header .nav-link {
    transition: transform ease 0.6s;
}

    header .nav-link:hover {
        transform: scale(1.4) !important;
    }

    header .nav-link.active {
        filter: invert(0.9);
    }


/*FOOTER*/


footer {
    position: relative !important;
    bottom: 0 !important;
    width: 100%;
    background-color: #be1d2c !important;
    padding: 70px 0 50px 0;
    text-align: start !important;
    font-family: 'BoldPS'
}

    footer ul {
        line-height: 1.6;
        padding: 0;
        margin: 0;
        list-style: circle !important;
        color: white !important;
    }

    footer .nostylelist {
        list-style: none !important;
    }

footer .col-sm-3 h2 {
    word-wrap: break-word; /* Omogućava prelamanje dugog teksta */
    overflow-wrap: break-word; /* Alternativno za prelamanje reči */
    white-space: normal; /* Sprečava da tekst bude na jednoj liniji */
    font-family: 'Trianglecut';
    color:white;
    text-align:start !important;
    font-size: 30px !important;
    padding-bottom: 0 !important;
}

.instafollownaslov{
text-transform:uppercase;
font-family:'TextBoldItalicPS' !important;
}

footer .nav-link object {
    pointer-events: none;
}

footer .nav-link {
    transition: all ease 0.6s;
}

    footer .nav-link:hover {
        transform: scale(1.2) !important;
        cursor:pointer;
    }

.footerlogo {
    border-right: 2px black solid;
    font-size: 14px;
    height: 195px;
}

.dark-mode .footerlogo {
 border-right: 2px white solid
}

.navigation ul {
line-height:2.3;
}

    .navigation ul a {
        padding-bottom: 4px;
        border-bottom: 1px white solid;
        text-decoration: none;
        color: white;
    }


.footer a:hover {
    color:black !important;
    cursor:pointer;
}



.wpbo a{
text-decoration:none;
color:white;
}

.footer p {
color:white;
}


.mobile {
    display: none;
}

.offcanvas-header {
    background: #be1d2c;
    border-bottom: 5px solid white;
}

.dark-mode .offcanvas-header {
    border-bottom: 5px solid black;
}

    .offcanvas-header button {
        background-color:transparent;
        border:none;
        color: white !important;
        font-size:20px;
        transition:transform ease 0.5s;
    }

    .offcanvas-header button:hover {
        transform:scale(1.3)
    }

.offcanvas-body {
    background: #be1d2c;
    position: relative;
}

.offcanvas {
width:100% !important;
}
/*TELEFON*/
@media (max-width: 750px) {
    .desktop {
    display:none !important; 
   }

    .mobile {
    display:block;
    }

        .mobile ul {
        padding-top:10%;
        }

        .mobile .offcanvas-body li object{
        width:120px;
        margin-bottom:15px;
        }

    header .nav-link:hover {
        transform: scale(1.2) !important;
    }

    .menubtn {
    background-color:transparent;
    border:none;
    color:black;
    font-size:30px;
    }

    .dark-mode .menubtn {
        color: white;
    }

    .secondnavmobile {
        width: 100%;
        margin-top: 60px;
        text-align: center;
        padding: 7px 0;
        line-height: 1.5;
    }
        .secondnavmobile a {
            font-size: 13px;
            padding: 7px;
            color: white;
            text-decoration: none;
            opacity: 0.6;
            font-family: 'BoldPS';
        }

        .secondnavmobile a:hover {
            opacity:1;
        }

        .secondnavmobile hr {
        color:white;
        }

       .dark-mode .secondnavmobile hr {
            color: black;
        }

       /*FOOTER MOBILE*/


    footer {
        padding: 50px 0 50px 0;
    }

        footer .container100 {
        margin: 0 0 !important;
        padding:0 50px !important;
        }

        footer ul {
            padding: 0 0 20px 0;
        }

    .instafollownaslov {
        text-align:center;
        padding-top:20px;
    }
    .center-container {
        display: flex !important;
        align-items: center !important; 
        justify-content: center !important; 
        margin-bottom:30px;
        }

}


/*TABLET*/
@media (min-width: 750px) and (max-width: 1000px) {

        .secondnav div {
            padding: 12px 5px;
        }

            .secondnav div:first-child {
                width: 80%;
                align-items: center;
                padding: 0px 10px 0 30px;
                font-size: 12px;
            }


    .secondnav div:last-child {
        width: 30%;
        font-family: 'NormalPS';
        font-size: 10px;
        text-align: start;
        color:white;
    }


    footer .container100{
    margin-right: 20px !important;
    margin-left: 20px !important;
    padding: 0 !important;
    }

        .footerlogo object {
        width:100px !important
        }


    footer .col-sm-3 h2 {
        font-size: 25px !important;
    }
}