/*Change the global font and color*/
.custom-font {
    font-family: Myriad Pro;
    color: #000000;
}

/*Applies the background colour and text colour to the header, media and document cards headers */
.bg-header-custom, .card-header.bg-header-custom {
    background-color: #40a946;
    color: #000000;
}

/* The styling for the link in the label for the terms and conditions checkbox on the login screen */
.terms-link, .terms-link:hover
{
    color:#0073dd;
}

/*Applies the font colour to the login form title*/
.text-login-custom 
{
    color: #40a946;
}

/* The styling for the breadcrumb links at the top of the page */
.breadcrumb-container a, .breadcrumb-container a:hover
{
    color:##ffffff;
}

/*Styling for the main title on each page*/
.text-header-custom 
{
    color: #000000;
}

/*Sets the colour of icons and loading spinner*/
.color-icon 
{
    color: #40a946;
}

/*Sets the background colour and font colour of the login form*/
.bg-login-custom 
{
    background-color: lightgray;
    color: inherit;
}


/*Sets the style for all buttons*/
.starportal .btn-custom, .starportal .btn-custom:hover
{
    background-color: #0073dd !important;
    border-color:#0073dd !important;
    color:white !important;
}

/* Sets the style for all H1 elements (headings) */
h1
{
    font-size: 1.8rem !important; 
}
/* Sets the style for all H2 elements (subheadings) */
h2
{
    font-size: 1.75rem !important;
}

/* Set the style for the footer and links bar. Note that these can be split and styled separately..*/
.footer-bar, .links-bar
{
background-color:#40a946;
  
}


/* Set the style for the links in the links bar (top) and footer bar(bottom). Note the 'a' and '!important' which are important to ensure the 
   built-in Bootstrap style is overridden. The links can be styled different for the links bar and footer if needed, but splitting the rules below into
   separate rules for each section - see CSS general guidelines for how to do this */
.links-bar a, footer a
{
    /* background-color: grey; */
	/* Top values is bottom nav bar text colour */
	/* Second values is bottom nav bar mouse over text colour */
	/* lower values are the colour when you press on the text */
    color:#ffffff !important;
}
.links-bar a:hover, footer a:hover
{
    color:lightgrey !important;
}
.links-bar a:active, footer a:active
{
    color:#ffffff !important;
}
.links-bar a:disabled, footer a:disabled
{
    color:#aaaaaa !important;
}

/* The style for when an input in the wizard is focused - note the input. at the beginning of the selector */
input.form-control:focus
{
    border-color: ##40a946;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(253 126 20 / 25%);
}

/* The styling to append torequired fields - can specify the color and content. Default is an asterisk */
.required::after
{
  content:" *";
  color:#990000;
}

/* Styling for the horizontal lines above and below segments on certain pages */
.border-bottom
{
    border-bottom: 1px solid rgba(0,0,0,0.2);
}
.border-top
{
    border-top: 1px solid rgba(0,0,0,0.2);
}

/* The styling for the text counter message */
.text-counter
{
  color: #606060;
  font-size:0.8em;
}
.text-counter.text-danger
{
    color:#0073dd;
}

/* The styling for the box warning a user when they have already nominated */
.already-responded
{
  font-weight: 400;
  color:#990000;
  font-size:1em;
  margin:1em 0;
  background:khaki;
  padding:1em;
  border-radius: 1em;
}

*:focus, .btn:focus, button:focus, textarea:focus
{
    border-color:#5eb2ff !important;
    box-shadow: 0 0 0 0.2rem rgb(0 115 221 / 25%) !important;
}