@charset "UTF-8";

:root {
	/* Original colors - Backgrounds based on #BFD1FD: http://colorcode.is/from/code/BFD1FD
    --bf_black: #120025;
    --bf_pinstripe: #0000FF;
    --branding_background: #BFD1FD;
    
    --body_background: #FFFFFF;
    --light_background1: #D2FDBF;
    --dark_background1: #5C8AFA;
	*/
	
	/* Color Palette */
    --bf_white: #FFFFFF; /* White */
    --bf_black: #140603;
    --bf_dark1: #11295f;
    --bf_dark2: #081743;
    --bf_med1: #1c3d7c;
/*
    --bf_light1: #747fba;
    --bf_light2: #3c579b;
    
    --bf_light1: #A4A4F7;
*/
    --bf_light1: #d0d1e2;
    --bf_light2: #3c579b;
    --bf_pinstripe: #0000FF;
    
    --bf_highlight_light1: #FFF280;
    --bf_highlight_light2: #FFF9BF;
    --bf_highlight_med1: #FFCC00; /* #F6AA19; */
    --bf_highlight_dark1: #8A6D40; /* #B3A000; #b37d00; */

	/* Branding Colors */
    --body_background: var(--bf_white);
    
    --bf_palette_highlight_background: var(--bf_highlight_med1);
    --bf_palette_highlight_text: var(--bf_black);
    
    --bf_palette_header_background: var(--bf_dark1);
    --bf_palette_header_text: var(--bf_white);
    --bf_palette_header_divider: var(--bf_black);
    
    --bf_palette_nav_background: var(--bf_dark2);
    --bf_palette_nav_text: var(--bf_white);
    --bf_palette_nav_active_background: var(--bf_dark2);
    --bf_palette_nav_active_text: var(--bf_white);
    --bf_palette_nav_divider: var(--bf_black);
    
    --bf_palette_progress_arrow_line: var(--bf_palette_highlight_background);
    --bf_palette_progress_line: var(--bf_black);
    --bf_palette_background: var(--bf_palette_nav_background);
    --bf_palette_text: var(--bf_palette_nav_text);
    --bf_palette_active_background: var(--bf_med1);
    --bf_palette_active_text: var(--bf_palette_nav_active_text);
    
    --bf_palette1_background: var(--bf_light1);
    --bf_palette1_text: var(--bf_black);
    
    --bf_palette2_background: var(--body_background);
    --bf_palette2_text: var(--bf_black);
    
    --bf_palette3_background: var(--bf_light1);
    --bf_palette3_text: var(--bf_black);
    
    --bf_sidebox_background1: var(--bf_highlight_light1);
    --bf_sidebox_background2: var(--bf_highlight_light2);
    --bf_sidebox_label: var(--bf_highlight_dark1);
	
	/* Color palette based on https://paletton.com/#uid=13+0u0kmgozcH-vi3sEp+kyuTft , then using the most common color blindness filter */
}

/* --------------------------------------------------
    Header & Navigation
   -------------------------------------------------- */
.bf_header_logo {
    background: linear-gradient(to right, rgba(255,255,255,1) 150px, var(--bf_palette_header_background) 80%);
    color: var(--bf_palette_header_text);
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: var(--bf_palette_header_divider);
    
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 0px;

    position: relative;
}

.bf_header_logo .bf_nav_topright {
    text-align: center;
    margin-top: 0px;
}
.bf_header_logo .bf_nav_topright li {
    float: none;
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: middle;
    zoom: 1;
    padding: 0px;
    margin: 0px;
}

.bf_header_logo .bf_nav_topright .nav-pills .nav-link {
    color: var(--bf_palette_header_text);
    
    font-size: 1.15em;
    text-decoration: none;    
    line-height: 1em;
}
.bf_header_logo .bf_nav_topright .nav-pills .nav-link:hover {
    color: var(--bf_palette_header_text);
    background-color: var(--bf_palette_nav_background);
}
.bf_header_logo .bf_nav_topright .nav-pills .nav-link.active {
    color: var(--bf_palette_header_text);
    background-color: var(--bf_palette_nav_background);
    font-size: 1.25em;
}

.bf_header_menu {
    background-color: var(--bf_palette_nav_background);
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-bottom-color: var(--bf_palette_nav_divider);
    padding-top: 5px;
    padding-bottom: 5px;
}

.bf_header_menu .active {
    color: var(--bf_palette_nav_active_text);
    background-color: var(--bf_palette_nav_active_background);
    font-weight: bold;
    text-decoration: underline;
}

.bf_header_menu a {
    color: var(--bf_palette_nav_text);
    background-color: var(--bf_palette_nav_background);
    
    /* Tweak Bootstrap settings to make regular and dropdown menus look the same */
    padding-left: 1.0em;
    padding-right: 1.0em;
    display: inline-block;
    height: auto;
}

.bf_header_menu a:hover {
    color: var(--bf_palette_nav_text);
    background-color: var(--bf_med1);
}

.bf_header_menu .dropdown-menu {
    background-color: var(--bf_med1);
    padding-top: 0px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 8px;
}

.bf_header_menu .dropdown .show {
    background-color: var(--bf_med1);
}

.bf_header_menu .dropdown-menu a {
    color: var(--bf_palette_nav_text);
    background-color: var(--bf_med1);
    
    /* Tweak Bootstrap settings to make regular and dropdown menus look the same */
    padding-left: 1.0em;
    padding-right: 1.0em;
    display: inline-block;
    height: auto;
}

.bf_header_menu .dropdown-menu a:hover {
    color: var(--bf_palette_nav_text);
    background-color: var(--bf_palette_nav_background);
}

/* Format the cell phone menu icon */
/* The Bootstrap collapsing menu requires .navbar-dark or .navbar-light, so we are customizing these classes. */
.navbar-dark .navbar-nav .nav-link {
    /* The Bootstrap .navbar-dark class shades the text. This turns off the shading. */
    color: var(--bf_palette_nav_text);
    
    /* Adjust size of rounded-pills to match the rest of the menu */
    padding-left: 1.0em;
    padding-right: 1.0em;
}

.navbar-dark .navbar-toggler {
    border-width: 2px;
}

.navbar-dark .navbar-toggler:focus {
	/* Hide the default shadow when selected. */
    color: var(--bf_palette_nav_background);
}

.navbar-dark .navbar-toggler:hover {
    background-color: var(--bf_med1);
}

/* Format HR in menu */
.navbar-dark .navbar-nav .nav-item hr {
    color: var(--bf_palette_nav_text);
}

/* --------------------------------------------------
    Footer
   -------------------------------------------------- */
.footer {
    background-color: var(--bf_palette_header_background);
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: var(--bf_palette_header_divider);
    
    text-align: center;
    
    font-size: 0.75em;
    line-height: 1.5em;
    color: var(--bf_palette_header_text);
    
    padding: 3px;
    margin-top: 25px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px; 
}

/* --------------------------------------------------
    Body
   -------------------------------------------------- */
body {
	background-color: var(--body_background);
	margin: 0px;
	padding: 0px;
    
    font-family: "Crimson Pro", sans-serif;
    font-weight: 400;
    font-size: 1.5em;
    line-height: 1.5em;
}

p {
	margin-bottom: -0.5em;
	
	+ p {
		/* Add space between subsequent paragraphs */
        margin-top: 1.25em;
    }
}

h1 {
	font-weight: bold;
	margin-top: -0.5em;
}

h2 {
    font-weight: bold;
}

h3 {
    font-weight: bold;
    margin-bottom: auto;
}

h4 {
    font-weight: bold;
    margin-bottom: auto;
}

ul {
	margin-bottom: 0em; /* Removes gap between sections when columns wrap */
}

ul.tight{
	margin-top: 0.25em;
	line-height: 1.15em;
}

li {
	margin-top: 0.25em;
}

.outer_wrapper {
	margin: 0px;
	padding: 0px;
}

.main {
	z-index: 0;
	position: relative;
	min-height: 500px;
	margin-top: 0px;
	padding: 0px;
}

.body_base {
    padding-top: 25px;
    padding-bottom: 25px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 25px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px; 
}

.body_summary {
    /* For cell phone size screens (XSM size) */
    background-color: var(--bf_palette_highlight_background);
    color: var(--bf_palette_highlight_text);
    text-align: center;
    
    padding-left: 30px;
    padding-right: 30px;
    
    /* Remove margin to mesh with menu on small screens */
    margin-top: 0px;
}
@media (min-width: 576px ) and (max-width: 992px) {
    /* On tablet size screens (SM MD size) the title will overflow if we do not reduce the border-radius */
    .body_summary {        
        width: 85%;
        margin-top: 15px;
        margin-left: auto;
        margin-right: auto;
    
        border-radius: 60px;
        padding-left: 40px;
        padding-right: 40px;
    }
}
@media (min-width: 992px) {
    /* Add formating when larger than XS (576px) */
    .body_summary {     
        width: 85%;
        margin-top: 15px;
        margin-left: auto;
        margin-right: auto;
    
        border-radius: 100px;
        padding-left: 60px;
        padding-right: 60px;
    }
}

.body_summary h1 {
	margin-bottom: -.3em;
}

.body_summary p {
    line-height: 1em;
	margin-top: 1em;
}

.body1 {
    background-color: var(--bf_white);
    color: var(--bf_palette1_text);
    
    /* Remove white space because without a border is looks like more space than the other sections */
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 10px;
}

.body2 {
    background-color: var(--bf_palette2_background);
    color: var(--bf_palette2_text);
    padding-top: 25px;
    
    border-top: 3px solid #e5e5e5;
    border-bottom: 3px solid #e5e5e5;
    
    border-style: solid;
    border-width: 3px;
    border-radius: 2.0rem;
    border-color: var(--bf_dark1);
}

.body3 {
    background-color: var(--bf_palette3_background);
    color: var(--bf_palette3_text);
    padding-top: 25px;
    
    border-style: solid;
    border-width: 3px;
    border-radius: 2.0rem;
    border-color: var(--bf_dark1);
}

h1 .bf_section_icon {
    flex-direction: column;
    margin-top: 0.25em;
    margin-bottom: 0.25em;
    vertical-align: middle;
    width: 64px;
    height: auto;
}

h1 a .bf_section_icon:hover {
    border-style: solid;
    border-width: 3px;
    border-radius: 1.0rem;
    border-color: var(--bf_dark1);
    background: var(--bf_palette1_background);
    background-color: var(--bf_palette1_background);
    
    padding: 4px;
    transition: 0.4s;
}

/* --------------------------------------------------
    Lists
   -------------------------------------------------- */
.bf_icon_list .bf_icon_list_icon {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.25em;
    align-items: left;
    justify-content: center;
    width: 64px;
    height: auto;
}
.bf_icon_list .bf_icon_list_icon:hover {
    border-style: solid;
    border-width: 3px;
    border-radius: 1.0rem;
    border-color: var(--bf_dark1);
    background: var(--bf_palette1_background);
    background-color: var(--bf_palette1_background);
    
    padding: 4px;
	transition: 0.4s;
}

.bf_icon_list .bf_icon_list_text {
    background: var(--bf_palette1_background);
    background-color: var(--bf_palette1_background);
    border-style: solid;
    border-width: 3px;
    border-radius: 2.0rem;
    border-color: var(--bf_dark1);
    margin-bottom: 0.25em;
    margin-left: 0.25em;
    padding-left: 1em;
    padding-right: 1em;
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: left;
    justify-content: center;
    
    line-height: normal;
    padding-top: 0.10em;
    padding-bottom: 0.10em;
} 
.bf_icon_list .bf_icon_list_text:link {
	color: inherit;
	text-decoration: inherit;
}
.bf_icon_list .bf_icon_list_text:visited {
	color: inherit;
	text-decoration: inherit;
}
.bf_icon_list .bf_icon_list_text:hover {
	background-color: var(--bf_palette_active_background);
	color: var(--bf_palette_active_text);
	font-weight: bold;
	transition: 0.8s;
}

/* --------------------------------------------------
    Side Boxs
   -------------------------------------------------- */
.sidebox {  
    padding: 5px;
    margin-top: 15px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    border-style: solid;
    border-width: 3px;
    border-radius: 1.0rem;
    border-color: var(--bf_dark1);
    background: linear-gradient(to top, var(--bf_sidebox_background1) 0px, var(--bf_sidebox_background2) 80%);
}

.sidebox_header {
    color: var(--bf_black); 
    font-weight: bold;
}

.sidebox_lable {
    font-size: 0.75em;
    line-height: 1.5em;
    color: var(--bf_sidebox_label);  
    font-weight: bold;
}

.sidebox_text {
    font-size: 0.75em;
    line-height: 1.0em;
    color: var(--bf_sidebox_label);  
    font-weight: normal;
    text-decoration: none;
    padding-left: 1.5em;
    padding-bottom: 0.5em;
}

.sidebox_link {
    color: var(--bf_sidebox_label);  
    font-weight: normal;
    text-decoration: none;
}

/* --------------------------------------------------
    Images
   -------------------------------------------------- */
.portrait  {
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
}

.portrait_placeholder  {
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 10px;
    margin-bottom: 10px;
    
    height: 200px;
    width: 200px;
    border: 1px dashed black;
    background: #E3F2FD;
}

/* --------------------------------------------------
    Formatting
   -------------------------------------------------- */
.spacer {
    line-height: 15px;
	margin: 0px;
	padding: 0px;
}