@charset "UTF-8";

/*--------------------------------------------------------------
# Font & Color Variables
# Help: https://bootstrapmade.com/color-system/
--------------------------------------------------------------*/
/* Fonts */
:root {
  --default-font: "Roboto",  system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --heading-font: "Montserrat",  sans-serif;
  --nav-font: "Lato",  sans-serif;
}

/* Global Colors - The following color variables are used throughout the website. Updating them here will change the color scheme of the entire website */
:root { 
  --background-color: #ffffff; /* Background color for the entire website, including individual sections */
  --default-color: #3c4049; /* Default color used for the majority of the text content across the entire website */
  --heading-color: #112344; /* Color for headings, subheadings and title throughout the website */
  --accent-color: #01b2b2; /* Accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out */
  --surface-color: #ffffff; /* The surface color is used as a background of boxed elements within sections, such as cards, icon boxes, or other elements that require a visual separation from the global background. */
  --contrast-color: #ffffff; /* Contrast color for text, ensuring readability against backgrounds of accent, heading, or default colors. */
}

.text-align-center{
    text-align: center;
}

.no-underline {
  text-decoration: none;
}

.highlight-text{
    color: var(--accent-color);
    position: relative;
}

.video{
    min-height: 500px;
    max-height: 600px;
    object-fit: cover; 
    height:100%;
    width:100%;
    overflow: auto;
}

.highcharts-figure {
    min-width: 250px;
    max-width: 800px;
    margin: 1em auto;
}

input[type="number"] {
    min-width: 50px;
}

.highcharts-description {
    margin: 0.3rem 10px;
}

.h2_bold{
    font-size: 45px !important;
    font-weight: 800 !important;
}



/* Backgrounds & Colors */

.teal{
    color: var(--accent-color)!important;
}

.bcg-teal{
    background-color: var(--accent-color)!important;
}

.white{
    color: white !important;
}

.bcg-white{
    background: white!important;
}

.text-teal{
    color: var(--accent-color)!important;
}

.text-green{
    color: #4cd137!important;
}

.text-teal-dark{
    color: #146c6c !important;
}

.text-white{
    color: white !important;
}
.text-red{
    color: #d63031 !important;
}




/* End of Backgrounds & Colors */

/* Margins, Paddings & Heights (Including Customs) */

.margin-left-inherit{
    margin-left:inherit;
}

.margin-right-inherit{
    margin-right:inherit;
}

.margin-horizontal-inherit{
    margin-left:inherit;
    margin-right:inherit;
}

.padding-left-inherit{
    padding-left:inherit;
}

.padding-right-inherit{
    padding-right:inherit;
}

.padding-horizontal-inherit{
    padding-left:inherit;
    padding-right:inherit;
}


/* End of Margins, Paddings & Heights */


/* Page Specific */
 .card-min-height-500px{
    /* Used in Executive Summary First */
    min-height:500px;
 }





/* End of Page Specific */

/* Tables */

.td-bcg-teal{
    background-color: var(--accent-color)!important;
    color:white;
}

/* Tables */