:root {
    --color-primary: #FF7400
}


html,
body {
    font-family: "Open Sans", sans-serif;
    font-size: 18px !important;
    background-color: #f9f6f2;
}

h1,
h2 {
    font-family: "Audiowide", sans-serif;
    text-transform: uppercase;
}

h3,
h4,
h5,
h6 {
    font-family: "Exo 2", sans-serif;
}

.text-primary {
    color: var(--color-primary) !important
}

.btn-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.font-exo {
    font-family: "Exo 2", sans-serif;
}

.min-vh-50 {
    min-height: 50vh;
}

.page {
    padding-top: 10vh;
}

.text-gradient-blend {
    background: linear-gradient(90deg,
            black 0%,
            black 30%,
            #ff7400 100%,
            #ff7400 30%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    /* for Firefox */
    color: transparent;
}

.border-primary {
    border-color: #ff7400 !important;

}

.pulse {
    transform-box: fill-box;
    transform-origin: center;
    animation: rippleAnim 1.8s ease-out infinite;
}

.pulse-small {
    transform-box: fill-box;
    transform-origin: center;
    animation: rippleAnimSmall 1.8s ease-out infinite;
}

@keyframes rippleAnim {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    100% {
        transform: scale(4);
        /* Adjust scale as needed */
        opacity: 0;
    }
}


@keyframes rippleAnimSmall {
    0% {
        transform: scale(1);
        opacity: .5;
    }

    100% {
        transform: scale(2);
        opacity: 0;
    }
}


.card-blog-post img {
    height: 200px;
    width: auto;
    object-fit: cover;
}