@import url('./bootstrap-5.3.5/bootstrap.min.css');

:root {
    --bs-primary-rgb: 38, 54, 69;
    --bs-secondary-rgb: 211, 228, 243;
    --bs-info-rgb: 51, 122, 183;
    --bs-btn-primary-rgb: 51, 122, 183;
    --bs-box-shadow-lg: 0 0 24px rgba(0, 0, 0, 0.5);
}

.btn-primary {
    --bs-btn-bg: rgb(var(--bs-btn-primary-rgb))!important;
    --bs-btn-border-color: rgb(var(--bs-btn-primary-rgb))!important;
    --bs-btn-active-bg: rgb(var(--bs-btn-primary-rgb));
    --bs-btn-active-border-color: rgb(var(--bs-btn-primary-rgb));
}

.btn-primary:hover {
    background-color: rgba(var(--bs-btn-primary-rgb), 0.75)!important;
    border-color: rgba(var(--bs-btn-primary-rgb), 0.75)!important;

}

.link-info:hover {
    color: rgb(var(--bs-info-rgb))!important;
    text-decoration: none!important;
}

.link-info:focus {
    color: rgb(var(--bs-info-rgb))!important;
    text-decoration: none!important;
}

.link-info.hover-white:hover {
    color: rgb(253, 253, 253)!important;
}

.form-check-input:checked {
    background-color: rgb(var(--bs-btn-primary-rgb))!important;
    border-color: rgb(var(--bs-btn-primary-rgb))!important;
}

.bg-black-50 {
    background-color: rgba(0, 0, 0, 0.5)!important;
}

.text-white-50 {
    color: #b9b9b9!important;
}

.fs-6 {
    font-size: 0.65rem!important;
}

.fs-5 {
    font-size: 0.85rem!important;
}

.fs-4 {
    font-size: 1rem!important;
}

.opacity-25-hover:hover {
    opacity: 0.25!important;
}

.opacity-100-hover:hover {
    opacity: 1!important;
}

.shadow-none-hover:hover {
    box-shadow: none!important;
}

.duration-200 {
    transition-duration: 0.2s!important;
}

.duration-500 {
    transition-duration: 0.5s!important;
}

.duration-750 {
    transition-duration: 0.75s!important;
}

.duration-1000 {
    transition-duration: 1s!important;
}

.duration-2000 {
    transition-duration: 1s!important;
}

.w-0 {
    width: 0!important;
}

.h-0 {
    height: 0!important;
}

.modal-width {
    width: calc(100% - 1rem)!important;
    max-width: 720px!important;
}

.modal-padding {
    padding: 1rem!important;
    padding-bottom: 0.25rem!important;
}

@media only screen and (min-width: 768px) {
    .modal-width {
        width: 720px!important;
        max-width: none!important;
    }
    
    .modal-padding {
        padding: 2rem!important;
        padding-bottom: 0.25rem!important;
    }
}

@media only screen and (min-width: 992px) {
    .modal-width {
        width: 960px!important;
    }
    
    .modal-padding {
        padding: 4rem!important;
        padding-bottom: 0.25rem!important;
    }
}

@media only screen and (min-width: 1200px) {
    .modal-width {
        width: 1140px!important;
    }
    
    .modal-padding {
        padding: 6rem!important;
        padding-bottom: 0.25rem!important;
    }
}