﻿:root, :root.light, :root .light {
    /* --------------------------- Gradient Background -------------------------- */
    /* Replacing falcon Blue - #4695ff with Green - #0F9A49, #1970e2 with #83B985 */
    --falcon-bg-shape-bg: #293756;
    --falcon-bg-shape-bg-dtl: linear-gradient(-45deg, #667DAF, #293756);
    --falcon-bg-shape-bg-ltd: linear-gradient(45deg, #293756, #667DAF);
    --falcon-line-chart-gradient: linear-gradient(-45deg, #014ba7, #0183d0);
    --falcon-card-gradient: linear-gradient(-45deg, #83B985, #293756);
    --falcon-progress-gradient: linear-gradient(-45deg, #83B985, #0F9A49);
    --falcon-bg-circle-shape: none;
    --falcon-bg-circle-shape-bg: #293756;
    --falcon-modal-shape-header: linear-gradient(-45deg, #83B985, #293756);
    --falcon-modal-shape-header-bg: #4494ff;
    /* Datatable pagination - Green Override */
    /* Replacing falcon Blue - #2c7be5 with Green - #0F9A49 */
    --falcon-pagination-active-bg: #293756;
    --falcon-pagination-active-border-color: #293756;
    --falcon-navbar-vertical-link-active-color: #293756;
    --falcon-dropdown-link-active-bg: #293756;
}

/* Button Primary Updates */

.bg-primary {
	background-color: #507cad !important;
}

.btn-primary {
	color: #fff;
	background-color: #507cad;
	border-color: #507cad;
}

	.btn-primary:hover {
		background-color: #6093cd;
		border-color: #6093cd;
	}

	.btn-primary:active {
		background-color: #6093cd;
		border-color: #6093cd;
	}

/* Button Primary Updates */

.color-primary-light {
	color: #badbff;
}
a.color-primary-light:hover {
	color: #e3f0ff;
}

/* ==================== Social Icon Coloring from Profile/Edit Page ================ */
.is-filled > .col-3 > .fa-instagram {
	background: -webkit-gradient(linear, left top, left bottom, from(#f99949), to(#c82d8e));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #c82d8e !important;
}

.is-filled > .col-3 > .fa-linkedin {
    color: #0077b5 !important;
}

.is-filled > .col-3 > .fa-facebook-square {
    color: #4267b2 !important;
}

.is-filled > .col-3 > .fa-twitter-square {
    color: #1da1f2 !important;
}


#trustwaveSealImage {
    margin-left: 25px;
    height: 50px;
}

.sidebar {
    background: linear-gradient(180deg, #1f1f1f, #212121) !important;
}

.login-page .page-header .container {
    padding-top: 11vh;
}

.redIvyText {
    color: #ab1e1e !important;
}

.redIvyBackgroundColor {
    background-color: #b8251d;
}

.font-weight-half-bold {
    font-weight: 400 !important;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

.gradientHr {
    border: 0;
    height: 2px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

/* If applied to a parent div, it will vertically center it's contents '*/
.flexbox {
    display: flex;
    align-items: center;
}

.flexbox-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

#trustwaveSealImage {
    margin-left: 25px;
    height: 50px;
}

.sidebar {
    background: linear-gradient(180deg, #1f1f1f, #212121) !important;
}

.redIvyText {
    color: #ab1e1e !important;
}

.redIvyBackgroundColor {
    background-color: #b8251d;
}

.font-weight-half-bold {
    font-weight: 400 !important;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

.gradientHr {
    border: 0;
    height: 2px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}


/* If applied to a parent div, it will vertically center it's contents '*/
.flexbox {
    display: flex;
    align-items: center;
}

.flexbox-center {
    display: flex;
    justify-content: center;
    align-items: center;
}


@media (min-width: 1200px) {
	.navbar-vertical.navbar-expand-xl .navbar-vertical-toggle {
		display: none !important;
	}
}