html {
    scroll-behavior: smooth;
}

.bg-taxiYellow {
    background-color: #fdcf00 !important;
}

nav {
    transition: all ease-in-out 220ms;
    height: 90px;
    background-color: #fdcf00;
}

#mainLogo {
    transition: all ease-in-out 220ms;
    height: 110px;
    transform: translateY(15%);
}

.nav-content {
    transition: all ease-in-out 280ms;
    opacity: 0;
    transform: translateY(15%);
}

.nav-content-collapse {
    z-index: 999;
    transition: all ease-in-out 250ms;
    background-color: #fdcf00;
}

.nav-collapse-btn {
    transition: all ease-in-out 250ms;
    opacity: 0;
    transform: translateY(15%);
}

nav.navScrolled {
    height: 70px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
nav.navScrolled #mainLogo {
    transform: translateY(7px);
    height: 62px;
}
nav.navScrolled .nav-content, nav.navScrolled .nav-collapse-btn {
    opacity: 1;
    transform: translateY(0);
}

.mainBody {
    padding-top: 90px;
}

header {
    min-height: calc(100vh - 90px);
    padding-top: 60px;
}

section {
    padding-top: 85px;
}

.btn {
    border: none !important;
    outline: none !important;
}

.btn-primary {
    background-color: #fdcf00 !important;
}

.myInput, .myInput:focus {
    transition: all ease-in-out 120ms;
    border: none !important;
    outline: none !important;
    box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2) !important;
}
.myInput:focus {
    transform: scale(1.025);
    box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.35) !important;
}

.mainCard {
    transition: all ease-in-out 250ms;
    background-color: black;
    border-radius: 20px;
    /* min-height: 385px; */
    cursor: pointer;
    position: relative;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

.mainCard::before {
    transition: all ease-in-out 250ms;
    position: absolute;
    content: "";
    width: 75%;
    height: 200%;
    transform: rotate(45deg);
    background-color: #fdcf00;
    animation: spinHover 12s linear infinite;
}

.mainCard::after {
    position: absolute;
    content: "";
    inset: 4px;
    background-color: white;
    border-radius: 16px;
}

.mainCard:hover {
    box-shadow: 5px 5px 35px rgba(253, 207, 0, 0.45);
}

.mainCardContent {
    z-index: 1;
}


@keyframes spinHover {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


/* // Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    
}

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    #mainLogo {
        height: 200px;
    }
    nav {
        height: 160px;
    }
    header {
        min-height: calc(100vh - 160px);
        padding-top: 85px;
    }
    .mainBody {
        padding-top: 160px;
    }
    .mainCard {
        min-height: 385px;
    }
    #sekceObjednat {
        background: linear-gradient(90deg, rgba(253, 207, 0, 1), rgba(253, 207, 0, 0.75), rgba(253, 207, 0, 0.15), rgba(253, 207, 0, 0)), url("src/photo1.jpg");
        background-size: cover;
        background-position: top;
        background-attachment: fixed;
    }
}

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* // X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* // XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    
}