﻿:root {
    --carahsoft-blue: #32499c; /* replacement for #0d6efd*/
    --carahsoft-blue-light: #2647bf;
    --carahsoft-blue-washed: color-mix(in srgb, var(--carahsoft-blue), white 10%);
    --bs-blue: var(--carahsoft-blue);
    --bs-body-font-size: 0.875rem;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: "Lato", sans-serif;
    min-height: 100%;
}

@media screen and (max-width: 991.98px) {
    :root {
        --bs-gutter-x: 2rem;
    }
}

a {
    color: var(--carahsoft-blue);
    outline: none;
    text-decoration: none;
}

    a:hover {
        color: var( --carahsoft-blue-light);
    }

.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: var(--carahsoft-blue);
    border-color: var(--carahsoft-blue);
}

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

    .btn-check:focus + .btn-primary, .btn-primary:focus {
        color: #fff;
        background-color: var(--carahsoft-blue-light);
        border-color: #0a58ca;
        box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
    }


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: var(--carahsoft-blue);
}

.nav-link{
    color: var(--carahsoft-blue);
}

.form-check-input:checked {
    background-color: var(--carahsoft-blue);
    border-color: var(--carahsoft-blue);
}


.event-location svg, .event-cpe svg, .event-date svg {
    margin-right: 6px;
}

/*
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// X-Large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }

// XX-Large devices (larger desktops, 1400px and up)
@media (min-width: 1400px) { ... }


@media (max-width: 575.98px) {
}

// `md` applies to small devices (landscape phones, less than 768px)
@media (max-width: 767.98px) {
}

// `lg` applies to medium devices (tablets, less than 992px)
@media (max-width: 991.98px) {
}

// `xl` applies to large devices (desktops, less than 1200px)
@media (max-width: 1199.98px) {
}

// `xxl` applies to x-large devices (large desktops, less than 1400px)
@media (max-width: 1399.98px) {
}
*/