/* Custom CSS for Components */
:root {
    --fav-dark-blue: #063D5D;
    --fav-secondary-blue: #0076C2;
    --fav-blue: #00A3FF;
    --fav-primary-text: #2F303C;
    --fav-secondary-text: #7d7d7d;
}

@font-face {
    font-family: Inter-SemiBold;
    src: url(../ttf/inter-semibold.ttf);
}

@font-face {
    font-family: Inter-Medium;
    src: url(../ttf/inter-medium.ttf);
}

@font-face {
    font-family: Inter-Regular;
    src: url(../ttf/inter-regular.ttf);
}

.fav-font-regular {
    font-family: 'Inter-Regular' !important;
}

.fav-font-medium {
    font-family: 'Inter-Medium' !important;
}

.fav-font-semibold {
    font-family: 'Inter-SemiBold' !important;
}

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

.fav-text-secondary {
    color: var(--fav-secondary-text) !important;
}

.fav-text-blue {
    color: var(--fav-blue) !important;
}

.fav-text-darkblue {
    color: var(--fav-dark-blue) !important;
}

.fav-bg-darkblue {
    background-color: var(--fav-dark-blue) !important;
}


.fav-bg-blue {
    background-color: var(--fav-blue) !important;
}

.fav-shadow {
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.04), 0px 4px 8px rgba(0, 0, 0, 0.06);
}

img {
    max-width: 100%;
    height: auto;
}

.badge{
    border-radius: 0px 0px 10px 10px !important;
    letter-spacing: 0.02em !important;
    font-size: 14px !important;
    font-weight: unset !important;
}
.badge-wrap{
    right: 20px;
    top: 0px;
}
.btn:hover{
    background-color: var(--fav-dark-blue) !important;
}
.btn-arrow{
    transition: transform 250ms;
}
.btn:hover .btn-arrow{
    transform: translateX(13px);
}