@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-stretch: 75% 100%;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Italic-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-stretch: 75% 100%;
    font-style: italic;
}

:root {
    --bs-font-sans-serif: 'Open Sans', sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
}

#header-logo {
    width: 170px;
    height: 100px;
    object-fit: cover;
}


#testimonianze-carousel {
    min-height: 52rem;
}

/* Hero Image Shape */
.hero-img-shape {
    clip-path: polygon(4% 100%, 25% 0%, 100% 0%, 100% 100%);
}

.hero-img {
    max-height: 500px;
    object-fit: cover;
}

/* Text Content Responsiveness */
.text-content {
    padding-left: 1rem;
    padding-right: 1rem;
}

.bar-content-edit {
    z-index: 1;
    position: relative;
}

main .bar-content-edit {
    z-index: 99;
}

.bar-content-edit a {
    top: -5px;
    left: -10px;
    position: absolute;
    cursor: pointer;
    border-radius: 20px;
    background-color: #979899;
    padding: 8px;
    opacity: 0.6;
    transition: 300ms;
}

.bar-content-edit a .icon {
    display: none;
}

.bar-content-edit a:hover {
    padding: 4px 10px;
    opacity: 1;
}

.bar-content-edit a:hover .icon {
    display: inline-block;
}

.tab-pane {
    min-height: 400px;
}

.card-bottom-shadow {
    background: linear-gradient(
        180deg,
        rgba(52, 58, 64, 0) 41.37%,
        #343a40 100%
    );
}

.two-columns {
    column-count: 2;
    column-gap: 2.5rem;
}

.small, small {
	font-size: .875em !important;
}

/*lg media query*/
@media screen and (min-width: 992px) {
    #testimonianze-carousel {
        min-height: 28rem;
    }
}

/*md media query*/
@media screen and (min-width: 768px) and (max-width: 991px) {
    #testimonianze-carousel {
        min-height: 34rem;
    }
}

/*sm media query*/
@media screen and (min-width: 576px) and (max-width: 767px) {
    #testimonianze-carousel {
        min-height: 41rem;
    }
}

@media (min-width: 576px) {
    #header-logo {
        width: 225px;
    }
}

@media (max-width: 991px) {
    .two-columns {
        column-count: 1;
    }
}