/* To be able to move the footer to the bottom even if the page has little to no content. Footer must have margin top set to auto. */
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

@media (max-width: 576px) {
    .container {
        padding-left: 5vw;
        padding-right: 5vw;
    }
}

.logo-margin {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    object-fit: cover;
    width: 32px;
    height: 32px;
    max-width: 32px;
    max-height: 32px;
}

@font-face {
    font-family: 'Cllarin';
    src: url('../webfonts/1001-fonts/cllarin/cllarin.ttf');
}

@font-face {
    font-family: 'Dancing Script';
    src: url('../webfonts/google-fonts/dancing-script/DancingScript-VariableFont_wght.ttf');
}

@font-face {
    font-family: 'Cormorant Garamond';
    src: url('../webfonts/google-fonts/cormorant-garamond/CormorantGaramond-Medium.ttf');
    font-weight: 500;
    /* medium */
    font-style: normal;
}

@font-face {
    font-family: 'Cormorant Garamond';
    src: url('../webfonts/google-fonts/cormorant-garamond/CormorantGaramond-SemiBold.ttf');
    font-weight: 600;
    /* semi-bold */
    font-style: normal;
}

@font-face {
    font-family: 'Cormorant Garamond';
    src: url('../webfonts/google-fonts/cormorant-garamond/CormorantGaramond-Bold.ttf');
    font-weight: 700;
    /* bold */
    font-style: normal;
}

.artsy-font {
    font-family: 'Cllarin', cursive;
    font-weight: 500;
}

.serif-font {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 500;
    /* medium */
}

.serif-font-bold {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 700;
    /* bold */
}

.serif-font-semi-bold {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 600;
    /* semi-bold */
}

/* Change button style to be custom. */
.btn-primary {
    --bs-btn-bg: #739072;
    /* Or: #709775 */
    --bs-btn-border-color: #739072;
    /* Or: #709775 */
    --bs-btn-hover-bg: #5b725a;
    --bs-btn-hover-border-color: #5b725a;
    --bs-btn-active-bg: #5b725a;
    --bs-btn-active-border-color: #5b725a;
    --bs-btn-disabled-bg: #739072;
    /* Or: #709775 */
    --bs-btn-disabled-border-color: #739072;
    /* Or: #709775 */
    font-family: 'Cormorant Garamond', serif;
    font-size: large;
}

.btn-secondary {
    --bs-btn-bg: #8caf8b;
    /* Or: #709775 */
    --bs-btn-border-color: #8caf8b;
    /* Or: #709775 */
    --bs-btn-hover-bg: #739072;
    --bs-btn-hover-border-color: #739072;
    --bs-btn-active-bg: #739072;
    --bs-btn-active-border-color: #739072;
    --bs-btn-disabled-bg: #8caf8b;
    /* Or: #709775 */
    --bs-btn-disabled-border-color: #8caf8b;
    /* Or: #709775 */
    font-family: 'Cormorant Garamond', serif;
    font-size: large;
}

/* For equal size of list items in cards for shooting packages */
.card-list-spacing-single {
    height: 3.5rem;
}

.card-list-spacing-double {
    height: 5rem;
}

.slogan {
    font-size: 4rem;
}

.slogan-2 {
    font-size: 3.5rem;
}

.slogan-3 {
    font-size: 3.5rem;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
}

@media (max-width: 992px) {
    .slogan-3 {
        font-size: 2.5rem;
    }
}

@media (max-width: 576px) {
    .slogan-3 {
        font-size: 3rem;
    }
}

.num-images-font-size {
    font-size: 1.5rem;
}

.price-font-size {
    font-size: 2.5rem;
}

@media (min-width: 576px) and (max-width: 992px) {
    .price-font-size {
        font-size: 1.8rem;
    }
}

/* Carousel height shall be slimmer in Desktop View. */
@media (min-width: 1025px) {
    .carousel-item {
        height: calc(100vh - 93px - 160px);
        /* navbar height: 93px; top browser bar: 143-161 px */
    }
}

/* @media (min-width: 576px) {
    .icon {
        height: 2vw;
    }
} */

.navbar-toggler {
    margin-right: 5vw;
}

/* Hide navbar dropdown arrows, since there are custom arrows used. */
.dropdown-toggle::after {
    display: none;
}

/* Grouping navbar dropdowns and their corresponding arrows */
.dropdown-toggle-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    padding-right: 0.5em;
}

/* Custom navbar dropdown arrow */
.dropdown-toggle-arrow {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
    cursor: pointer;
    /* position: absolute; */
    /* top: 50%; */
    /* right: 0; */
    /* transform: translateY(-50%); */
    color: #575757;
    /* as serif-font-semi-bold */
}

/* Due to missing padding of navbar items when navbar is collapsed (collapsed when width <= 992px) */
@media (max-width: 992px) {

    .navbar-nav>.nav-item {
        padding-left: 10px;
        padding-right: 10px;
    }
}

.dropdown-item:active {
    background-color: rgba(0, 0, 0, 0.2);
}

.bg-julie {
    background-color: #FDF7E4 !important;
}

footer {
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .1);
}

.package-shadow {
    box-shadow: 0 0 15px rgba(0, 0, 0, .4);
}

.cookie-banner-shadow {
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
}

.text-underline-hover {
    text-decoration: none;
}

.text-underline-hover:hover {
    text-decoration: underline;
}

@media (min-width: 992px) {
    .news-separation {
        border-left: 1px solid rgba(0, 0, 0, 0.176);
    }
}