/* Please follow and use the bootstrap media breakpoints:  https://getbootstrap.com/docs/4.3/layout/overview/  */
/* Mobile first design (991px and smaller width is being treated as mobile at this time) */

body {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.33;
    color: #333333;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    background-color: white;
    word-wrap: break-word;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* This pushes the footer down so that any "page bottom" widgets are sitting
   over the footer and not white-space below footer. See OTTER-14712. */
.layout-main-content-wrapper {
    min-height: calc(100vh - 320px)
}

/* .stackable-page-component :
To be used on the top-level div or other element of each main component on the leadgen pages. Adds consistent spacing
between each item. Needs to be on it's own div so it doesn't affect the margin of other elements set by bootstrap. */
body .stackable-page-component {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;;
    margin-left: 0;
    margin-right: 0;
}

/*Default is Dice blue*/
body .full-width-line {
    border-bottom: 1px solid var(--blue) !important;
    margin-top: 1rem;
    margin-bottom: 2rem;
    width: 100%;
}

/*Can override with Dice red or other colors if needed*/
body .full-width-line.red {
    border-bottom: 1px solid var(--red) !important;
}

body .full-width-line.gray {
    border-bottom: 2px solid var(--gray200) !important; /* 2px on purpose */
}

.text-dice-red {
    color: var(--red) !important;
}

@media (min-width: 768px) {
    body {
        font-size: 18px;
    }
}

@media (min-width: 992px) {
    body .stackable-page-component {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }
}

/* --------------------------------------------------------------------------------------------- */
/* Below here: leadgen theme kit declarations declared within CMS instead of separate theme kit. */
/* --------------------------------------------------------------------------------------------- */

/* BUTTON PRIMARY / SECONDARY */
.btn-primary, .btn-secondary {
    color: #fff;
    background-color: #cc0000;
    border-color: #cc0000;
}
.btn-primary:hover, .btn-secondary:hover {
    color: #fff;
    background-color: #e31717;
    border-color: #e31717;
}
.btn-primary.disabled, .disabled.btn-secondary,
.btn-primary:disabled, .btn-secondary:disabled {
    color: #fff;
    background-color: #cc0000;
    border-color: #cc0000;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active {
    color: #fff;
    background-color: #a30000;
    border-color: #a30000;
}
.btn-primary.focus, .btn-primary:focus, .focus.btn-secondary, .btn-secondary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
}

/* BUTTON OUTLINE */
.btn-outline-primary {
    color: #cc0000;
    border-color: #cc0000;
}
.btn-outline-primary:hover {
    color: #fff;
    background-color: #cc0000;
    border-color: #cc0000;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: #cc0000;
}
.btn-outline-primary:focus, .btn-outline-primary.focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
}
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: #cc0000;
    border-color: #cc0000;
}

/* BUTTON IN .DROPDOWN-TOGGLE */
.show > .dropdown-toggle.btn-secondary, .show > .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #e31717;
    border-color: #e31717;
}
.show > .btn-primary.dropdown-toggle:focus, .show > .dropdown-toggle.btn-secondary:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(204, 0, 0, 0.5);
}