/*
Theme Name: AUTO-MOTO KOMERC
Theme URI: 
Author: the WordPress team
Author URI: https://www.facebook.com/sasovicnikola
Description: Privatna tema za WordPress
Version: 2.0
Text Domain: autokuke.com
*/

@import url("css/bootstrap.min.css");
@import url("css/album.css");

*, html {
    scroll-behavior: smooth !important;
}

body{    
    padding-top: 3.2rem!important;
}
.search{
    background-color: #1A64B8;
    padding-top: 1rem;
}
.bg-gradient{
    background-image: var(--bs-gradient) !important;
}
.d-grid {
  display: grid !important;
}
.carousel-caption span{
    margin: 0;
    color: white;
    font-size: 50px;
    font-weight: bolder;
    text-shadow: 0 0 10px rgba(0,0,0, 1)
}
@media (max-width: 992px){
    .carousel-caption span{
        font-size: 30px;
        font-weight: bold;
    }
}
@media (max-width: 768px){
    .carousel-caption span{
        font-size: 20px;
        font-weight: bold;
    }
}
@media (max-width: 576px){
    .carousel-caption span{
        font-size: 16px;
        font-weight: bold;
    }
}
.rounded-3 {
    border-radius: var(--bs-border-radius-lg) !important;
}
.shadow{
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}
.ms-auto{
    margin-left: auto;
}
.masthead-index {
    min-height: 30rem;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    padding-top: 8rem;
    padding-bottom: 8rem;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), url(../img/autodeors-internet-prodaja-auto-delova.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.masthead-kuke {
    min-height: 30rem;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    padding-top: 8rem;
    padding-bottom: 8rem;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), url(img/euro-kuke/auto-kuke-header.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.masthead-ulja {
    min-height: 30rem;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    padding-top: 8rem;
    padding-bottom: 8rem;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), url(../img/motorna-ulja-header.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.call-center{
    border: 3px solid #fff;
    border-radius: 100%;
    font-size: 100px;
}
.text-main{
    text-transform: uppercase;
    font-style: italic;
    text-shadow: 2px 2px black;
}
.text-shadow{    
    text-shadow: 1px 1px black;
}
@media (max-width: 768px){
    .specs{
        text-align: center;
    }
}
.ms-3 {
    margin-left: 1rem !important;
}
footer{
    background-color: black;
    color: white;
}
.gap-2 {
    gap: .5rem !important;
}
.text-bg-dark {
    color: #fff !important;
    background-color: RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important;
}
@media (min-width: 992px) {
    .me-lg-auto {
        margin-right: auto !important;
    }
}
@media (min-width: 992px) {
    .my-lg-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}
.overflow-hidden{
    overflow: hidden !important;
}
.list-item-mt{
    margin-top: 100px;
}
#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 30px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 10px; /* Some padding */
  font-size: 12px; /* Increase font size */
}

.contact{
    border: 0px!important;
    width: auto;
}

.contact a{
    font-size: 14px;
    color: #fff;
    text-decoration: none;
}

.viber {
    background: #9B51E0;
    background: linear-gradient(180deg, rgba(155, 81, 224, 1) 0%, rgba(141, 73, 204, 1) 50%);
    color: #fff;
    width:100px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.viber:hover{
    background: #944dd6;
    background: linear-gradient(180deg, rgba(148, 77, 214, 1) 0%, rgba(111, 49, 168, 1) 50%);
}

.whatsapp {
    background: #25D366;
    background: linear-gradient(180deg, rgba(37, 211, 102, 1) 0%, rgba(30, 179, 85, 1) 50%);
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    color: #fff;
    width:100px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.whatsapp:hover {
    background: #21b858;
    background: linear-gradient(180deg, rgba(33, 184, 88, 1) 0%, rgba(25, 140, 67, 1) 50%);
}

.fast_contact{
    color:#fff;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    width:100px;
    padding-top: 5px;
    padding-bottom: 5px;
}

footer{
    background-color: RGBA(var(--bs-dark-rgb), var(--bs-bg-opacity, 1)) !important;
    color: darkgray!important;
}

footer h4{
    text-transform: uppercase;
    font-size: 1.3rem;
    font-weight: bold;
    line-height: 1.2;
}

table{
    border: 1px solid #000;
    width: 100%
}

td{
    padding: 5px;
}

.download{
    background-color: #dc3545;
    font-weight: bold;
    text-align: center;
    color: #fff;
    background-image: var(--bs-gradient) !important;
}

.download a{
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
}

.image-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 220px; /* možeš menjati visinu */
    overflow: hidden;
    background: #fff;
}

.image-wrapper img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* ili cover ako hoćeš crop */
}

.brands{
    text-transform: uppercase;
    font-style: italic;
    background-color: #F6F6F7;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    color: #ccc;
}

.brands:hover{
    background-color: white;
}

.brands-title{
    font-size: 15px;
    font-weight: bolder;    
}

.brands-title a{
    color: #ccc;
    text-decoration: none;
}