@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Protest+Strike&display=swap');


.strong {font-weight: 900; font-size: 1.5em}



h1.card-title {

	font-size: 1.5em;

	background-color: #1e1e1e;

	color: #ddd;

}



.ig-card {

	background-color: #1e1e1e;

	color: #ddd;
    height: 100%;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;

}

.ig-card:hover {
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.50);
}

.ig-right {

    align-content: end;

}

.image-wrapper {

    width: 100%; /* Full width of the parent column */

    height: 200px; /* Set the desired height */

    overflow: hidden; /* Ensures that oversized parts of the image are hidden */

    display: flex;

    align-items: center; /* Vertically center the image */

    justify-content: center; /* Horizontally center the image */

    background-color: #f8f9fa; /* Optional: background color for better aesthetics */

}



.image-wrapper img {

    width: 100%; /* Scale image to fit width */

    height: 100%; /* Scale image to fit height */

    object-fit: cover; /* Ensures the image fills the wrapper while maintaining its aspect ratio */

}



.background-none {

	background: none;

}

/* mine.css */



/* General Body Style */

body {

    font-family: "Montserrat", sans-serif;

    background-color: #121212;

    color: #ddd;

    line-height: 1.6;

}



/* Links */

a, a:hover, a:focus {

    color: #ffffff;

    text-decoration: none;

}



/* Navigation Bar */

.navbar {

    background-color: #1e1e1e;  /* Dark background */

    border: none;

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);

    vertical-align: middle;

}



.navbar-brand {

    font-weight: bold;

}



.navbar-dark .navbar-nav .nav-link {

    color: #ddd;

}



.navbar-dark .navbar-nav .nav-link:hover {

    color: #ffffff;

    background-color: #333;

    border-radius: 5px;

}





.btn-circle {

    border-radius: 50%;

    background-color: #444;

    color: #ffffff;

    border: none;

    padding: 15px;

    font-size: 18px;

    transition: background-color 0.3s;

}



.btn-circle:hover {

    background-color: #555;

}



/* Content Sections */





.dark-section {

    background-color: #1e1e1e;

    color: #ddd;

}



.section-heading {

    color: #ffffff;

    font-size: 2.5em;

    margin-bottom: 20px;

}



/* Privacy List */

.privacy-list {

    list-style: none;

    padding-left: 0;

}



.privacy-list li {

    margin-bottom: 10px;

    font-size: 1.1em;

}



.gallery img {

    border-radius: 8px;

    margin-bottom: 15px;

    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);

    transition: transform 0.3s;

}



.gallery img:hover {

    transform: scale(1.05);

}



/* Footer (if needed) */

.footer {

    background-color: #1e1e1e;

    color: #888;

    padding: 20px 0;

    text-align: center;

}



/* Form Inputs */

input[type="text"], input[type="email"], textarea {

    background-color: #2c2c2c;

    color: #fff;

    border: 1px solid #444;

    padding: 10px;

    width: 100%;

    margin-bottom: 15px;

    border-radius: 5px;

}



input[type="text"]:focus, input[type="email"]:focus, textarea:focus {

    border-color: #666;

    outline: none;

}



/* Accessibility Enhancements */

h2, h3, h4 {

    color: #ffffff;

}



ul {

    margin-top: 20px;

}



strong {

    color: #cccccc;

}



.img-fluid { margin: 0 auto; }





html {

    width: 100%;

    height: 100%;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    margin: 0 0 35px;

    font-family: "Protest Strike", sans-serif;
    font-weight: 400;

    letter-spacing: 1px;

}



h3 {

	font-size: 1.5em;

}



p {

    margin: 0 0 25px;

    font-size: 18px;

    line-height: 1.5;

}



@media(min-width:768px) {

    p {

        margin: 0 0 35px;

        font-size: 20px;

        line-height: 1.6;

    }

}



a {

    color: #fff;

    -webkit-transition: all .2s ease-in-out;

    -moz-transition: all .2s ease-in-out;

    transition: all .2s ease-in-out;

}



a:hover,

a:focus {

    text-decoration: none;

    color: #c5c5c5;

}



.light {

    font-weight: 400;

}



.navbar-custom {

    margin-bottom: 0;

    border-bottom: 1px solid rgba(255,255,255,.3);

    text-transform: uppercase;

    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;

    background-color: #000;

}



.navbar-custom .navbar-brand {

    font-weight: 700;

}



.navbar-custom .navbar-brand:focus {

    outline: 0;

}



.navbar-custom .navbar-brand .navbar-toggler {

    padding: 4px 6px;

    font-size: 16px;

    color: #fff;

}



.navbar-custom .navbar-brand .navbar-toggler:focus,

.navbar-custom .navbar-brand .navbar-toggler:active {

    outline: 0;

}



.navbar-custom a {

    color: #fff;

}



.navbar-custom .nav li a {

    -webkit-transition: background .3s ease-in-out;

    -moz-transition: background .3s ease-in-out;

    transition: background .3s ease-in-out;

}



.navbar-custom .nav li a:hover {

    outline: 0;

    color: rgba(255,255,255,.8);

    background-color: transparent;

}



.navbar-custom .nav li a:focus,

.navbar-custom .nav li a:active {

    outline: 0;

    background-color: transparent;

}



.navbar-custom .nav li.active {

    outline: 0;

}



.navbar-custom .nav li.active a {

    background-color: rgba(255,255,255,.3);

}



.navbar-custom .nav li.active a:hover {

    color: #fff;

}



@media(min-width:768px) {

    .navbar-custom {

        padding: 20px 0;

        border-bottom: 0;

        letter-spacing: 1px;

        background: 0 0;

        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;

        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;

        transition: background .5s ease-in-out,padding .5s ease-in-out;

    }



    .navbar-custom.top-nav-collapse {

        padding: 0;

        border-bottom: 1px solid rgba(255,255,255,.3);

        background: #000;

    }

}



.home {

	color: #fff;

    background: url(../img/intro-bg.jpg) no-repeat bottom center scroll;

    background-color: #000;

}



.kamen_ostalo {

	

    background: url(../img/cnc_pila-bg.jpg) no-repeat bottom center scroll;

    background-color: #000;

	color: #fff;

}



.kuhinje {

    background: url(../img/kuhinje_i_radne_ploce-bg.jpg) no-repeat bottom center scroll;

    background-color: #000;

	color: #fff;

}



.kamen_na_groblju {

	color: #fff;

    background: url(../img/restauracija-bg.jpg) no-repeat bottom center scroll;

    background-color: #000;

}



.klupice {

	background: url(../img/Stepenice_pozadina.jpg) no-repeat bottom center scroll;

    background-color: #000;

	color: #fff;

}

.intro {

    display: table;

    width: 100%;

    height: auto;

    text-align: center;

    -webkit-background-size: cover;

    -moz-background-size: cover;

    background-size: cover;

    -o-background-size: cover;

}



.intro .intro-body {

    display: table-cell;

    vertical-align: middle;

}







.intro .intro-body .intro-text {

    font-size: 18px;

}

.intro {

    height: 30vh;


}

@media(max-width:767px) {
    .intro.kamen_ostalo {

        height: 45vh;

    }
}

@media(min-width:768px) {

    .intro {

        height: 60vh;

        padding: 0;

    }
    .intro .intro-body .brand-heading {

        font-size: 50px;
    
    }


    .intro .intro-body .brand-heading {

        font-size: 50px;

    }



    .intro .intro-body .intro-text {

        font-size: 26px;

    }

}





@-webkit-keyframes pulse {    

    0% {

        -webkit-transform: scale(1);

        transform: scale(1);

    }



    50% {

        -webkit-transform: scale(1.2);

        transform: scale(1.2);

    }



    100% {

        -webkit-transform: scale(1);

        transform: scale(1);

    }

}



@-moz-keyframes pulse {    

    0% {

        -moz-transform: scale(1);

        transform: scale(1);

    }



    50% {

        -moz-transform: scale(1.2);

        transform: scale(1.2);

    }



    100% {

        -moz-transform: scale(1);

        transform: scale(1);

    }

}



.download-section {

    width: 100%;

    padding: 50px 0;

    color: #fff;

    background: url(../img/stepeniste.jpg) no-repeat center center scroll;

    background-color: #000;

    -webkit-background-size: cover;

    -moz-background-size: cover;

    background-size: cover;

    -o-background-size: cover;

}



#map {

    width: 100%;

    height: 200px;

    margin-top: 100px;

}



@media(min-width:767px) {

    .content-section {

        padding-top: 50px;

    }

    .content-section {

        padding: 30px 0;
    
    }

    .download-section {

        padding: 100px 0;

    }



    #map {

        height: 400px;

        margin-top: 250px;

    }

}



.btn {

    border-radius: 0;

    text-transform: uppercase;

    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;

    font-weight: 400;

    -webkit-transition: all .3s ease-in-out;

    -moz-transition: all .3s ease-in-out;

    transition: all .3s ease-in-out;

}



.btn-default {

    border: 1px solid #42dca3;

    color: #42dca3;

    background-color: transparent;

}



.btn-default:hover,

.btn-default:focus {

    border: 1px solid #42dca3;

    outline: 0;

    color: #000;

    background-color: #42dca3;

}



ul.banner-social-buttons {

    margin-top: 0;

}



@media(max-width:1199px) {

    ul.banner-social-buttons {

        margin-top: 15px;

    }

}



@media(max-width:767px) {

    ul.banner-social-buttons li {

        display: block;

        margin-bottom: 20px;

        padding: 0;

    }



    ul.banner-social-buttons li:last-child {

        margin-bottom: 0;

    }

}



footer {

    padding: 50px 0;

}



footer p {

    margin: 0;

}



::-moz-selection {

    text-shadow: none;

    background: #fcfcfc;

    background: rgba(255,255,255,.2);

}



::selection {

    text-shadow: none;

    background: #fcfcfc;

    background: rgba(255,255,255,.2);

}



img::selection {

    background: 0 0;

}



img::-moz-selection {

    background: 0 0;

}



.map-container {

    position: relative;

    overflow: hidden;

    width: 100%;

    padding-top: 56.25%; /* Aspect Ratio 16:9 */

}



.map-container iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}



ul {

list-style-type: none;	

}

ul.style-disc {
    list-style-type: disc;
}
.bg-gray {
    background-color: #2a2a2a;
}
.bg-gray ul {
    list-style-type: disc;
}
.custom-style {
    height: 350px;
    object-fit: cover;
}
.custom-style2 {
    height: 600px;
    object-fit: cover;
}
.card-body {
    display: flex;
    justify-content: center;
    align-items: center;
}