@charset "utf-8";
/* CSS Document */

		body {
			font-family: 'Nunito', 'Roboto', sans-serif;
			font-size: 0.875rem; /* 14px */
					color: var(--sp-comp, #4B4B4B);} /* testing */

		h1, h2, h3, h4, h5, h6 {
		  font-family: 'Nunito', sans-serif;} /* testing */

		h1 	{	
			font-weight: 700;
			/* color: #1e85bb; fallback-older-browsers */
			color: var(--sp-blue4,#1E85BB);
			font-size: 3rem;} /* 48px */

		h2 	{	
			font-weight: 700;
			color: var(--sp-blue4,#1E85BB);
			font-size: 1.5rem;} /* 24px */

		.lnk {text-decoration: none; color: inherit} /* --- var(--sp-blue4,#1E85BB) ----- */
		.lnk:hover {text-decoration: none; color: var(--sp-blue3)}

/* --------------General Placeholder ---------------- */

		input::placeholder {
			  color: var(--sp-wit,#FFFFFF); } 

		input:focus {
		  outline: none;border-color: var(--sp-wit,#FFFFFF);} /* remove form border on focus */


/* -----------Custom dropdown - Firefox compatible - scoped to .Proj class */
select.Proj {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  min-width: 250px;
  color: var(--sp-dgrey, #7F7F7F);
  padding: 4px 30px 4px 15px;
  border-radius: 20px;
  border: 1px solid var(--sp-mgrey, #CACACA);
  cursor: pointer;
  background: white url("../images-25/arrow-9.svg") right 10px center / 15px no-repeat;
  font-size: 1rem;
  line-height: 1.5;
}

select.Proj:hover {
  border-color: #1E85BB;
}

select.Proj:focus {
  outline: none;
  border-color: #1E85BB;
  box-shadow: 0 0 0 3px rgba(30, 133, 187, 0.1);
}

select.Proj:active {
  border-color: #1E85BB;
}

/* Firefox specific fix for dropdown arrow */
@supports (-moz-appearance: none) {
  select.Proj {
    padding-right: 30px;
  }
}

/* IE10+ specific styles */
select.Proj::-ms-expand {
  display: none;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* --------------image buttons ---------------- */

.image-but {
  background-color:rgba(255,255,255,0.00); 
  background-image: url('../images-25/up-down2.svg'); 
  background-repeat: no-repeat;
  background-position: center;
  width: 17px;  
  height: 14px; 
  border: none;
  cursor: pointer;
  color: transparent; /* Hide text */
  font-size: 0; /* Hide text */
	padding-top: 10px} /* Hide text */

/* ------ Fonts ---- */

			.sp_body {font-size: 1rem; color: var(--sp-dgrey,#7F7F7F);}						/*--16px--*/
			.head16 {font-size: 1rem; color: #1E85BB; font-weight: 700; text-decoration: none}/*--16px--*/

			.sp_head1 {font-size: 1.5rem; color: var(--sp-dgrey,#7F7F7F);}					/*--24px--*/		
			.sp_head2 {font-size: 2rem; color: var(--sp-blue4,#1E85BB);font-weight: 700}	/*--32px--*/

			.sp_head3 {font-size: 1.25rem; color: var(--sp-blue4,#1E85BB);font-weight: 700} 	/*--20px--*/
			.sp_head4 {font-size: 1.25rem; color: var(--sp-dgrey,#7F7F7F);font-weight: 700} 	/*--20px--*/
			.sp_head4l {font-size: 1.25rem; color: var(--sp-dgrey,#7F7F7F);} 				/*--20px--*/	
			.head20 {font-size: 1.25rem; color: #29AAE2; font-weight: 700;
					padding: 30px 0px 10px;} /*--20px--*/

/* ------Notes page & fonts ---- */
			.note_h1 	{	
			font-weight: 700;
			color: var(--sp-blue4,#1E85BB);	  
			font-size:1.75rem !important;  } /*--28px--*/

			.note_12gr {font-size: 0.75rem; color: var(--sp-dgrey,#7F7F7F);}  /*--12px--*/
			.note_12 {font-size: 0.75rem; line-height: 1;}
			.note_12b {font-size: 0.75rem; font-weight: 700; color: var(--sp-blk, #000000)}
			.note_12blue {font-size: 0.75rem; font-weight: 700; color: var(--sp-blue4,#1E85BB)}
			.note_12pd {font-size: 0.75rem; line-height: 1; padding-bottom: 10px;}
			.note_14 {font-size: 0.875rem; color: var(--sp-dgrey,#7F7F7F);font-weight: 700; } /*--14px--*/
			.note_pd {padding: 8px 4px 20px 4px;}


/* -------------test btn only ---------------- */

.btn-pri-12 {
    background: var(--sp-blue4,#1E85BB); 
    color: #ffffff;
	border-radius: 15px;
	margin: 2px;
	font-size: 0.75rem; /*12px*/
	border: none;
	text-align: center;
		padding: 2px 10px;}

.btn-pri-12:hover, .btn-pri-12:focus, .btn-pri-12:active, .btn-pri-12.active, .open > .dropdown-toggle.btn-pri-12 {
    background: #fff; 
	color: var(--sp-blue4,#1E85BB);
	border: solid #1E85BB;
	border-width: thin;
	text-decoration: none}

.btn-rev-12 {
    background: #ffffff; 
    color: var(--sp-blue4,#1E85BB);
	border-radius: 15px;
	margin: 2px;
	font-size: 0.75rem; /*12px*/
	border: solid #1E85BB;
	border-width: thin;
	text-align: center;
		padding: 2px 10px;}

.btn-rev-12:hover, .btn-rev-12:focus, .btn-rev-12:active, .btn-rev-12.active, .open > .dropdown-toggle.btn-rev-12 {
    background: var(--sp-blue4,#1E85BB) ; color: #fff }

	/* -----primary light grey------ */
.btn-grey {
    background: var(--sp-lgrey, #EDF1F4); 
    color: var(--sp-dgrey, #7F7F7F);
	border-radius: 20px;
	margin: 2px;
	font-size: 0.875rem;  /* 14px */
	border: solid var(--sp-lgrey, #EDF1F4);
	border-width: thin;
		padding: 2px 10px}

.btn-grey:hover, .btn-grey:focus, .btn-grey:active, .btn-grey.active, .open > .dropdown-toggle.btn-grey {
    background: var(--sp-dgrey, #7F7F7F); 
	color: var(--sp-lgrey, #EDF1F4); 
	text-decoration: none }

	/* -----primary white------ */
.btn-rev-15 {
    background: #ffffff; 
    color: var(--sp-blue4,#1E85BB);
	border-radius: 20px;
	margin: 2px;
	font-size: 0.875rem;  /* 14px */
	border: solid #1E85BB;
	border-width: thin;
		padding: 2px 10px}

.btn-rev-15:hover, .btn-rev-15:focus, .btn-rev-15:active, .btn-rev-15.active, .open > .dropdown-toggle.btn-rev-15 {
    background: var(--sp-blue4,#1E85BB); 
	color: #fff; 
	text-decoration: none }

.btn-rev-16 {
    background: #ffffff; 
    color: var(--sp-blue4,#1E85BB);
	border-radius: 20px;
	margin: 2px;
	font-size: 0.875rem;  /* 14px */
	border: solid #1E85BB;
	border-width: thin;
		padding: 2px 10px;
		font-weight: bold}

.btn-rev-15:hover, .btn-rev-15:focus, .btn-rev-15:active, .btn-rev-15.active, .open > .dropdown-toggle.btn-rev-15 {
    background: var(--sp-blue4,#1E85BB); 
	color: #fff; 
	text-decoration: none }

.btn-primary {
	background: var(--sp-blue4,#1E85BB); 
	color: #ffffff;
	border-radius: 20px;	/* was 15px */
	margin: 4px 2px;
	font-size: 0.875rem;  /* 14px */
	font-weight: 500;
	text-align: center;
	border: solid var(--sp-blue4,#1E85BB);
	border-width: thin;
	padding: 2px 10px}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
	background: #ffffff; 
	color: var(--sp-blue4,#1E85BB);
	border: solid var(--sp-blue4,#1E85BB);
	border-width: thin;  
	text-decoration: none} 

.btn-primary:active, .btn-primary.active {
	background: var(--sp-blue4,#1E85BB); 
	box-shadow: none;}

	/* -----SPprimary blue TEST------ */

.sp-primary {
    background: var(--sp-blue4,#1E85BB); 
    color: #ffffff;
	border-radius: 20px;	/* was 15px */
	margin: 2px;
	font-size: 0.875rem;  /* 14px */
	font-weight: 500;
	text-align: center;
	border: solid var(--sp-blue4,#1E85BB);
	border-width: thin;
	padding: 2px 10px}

.sp-primary:hover, .sp-primary:focus, .sp-primary:active, .sp-primary.active, .open > .dropdown-toggle.sp-primary {
    background: #ffffff; 
	color: var(--sp-blue4,#1E85BB);
	border: solid var(--sp-blue4,#1E85BB);
	border-width: thin;  
	text-decoration: none} 

.sp-primary:active, .sp-primary.active {
    background: var(--sp-blue4,#1E85BB); 
    box-shadow: none;}
	
	/* ---btn-primary variations ---- */

.btn-dgrey {
    background: var(--sp-dgrey,#7F7F7F); 
    color: #ffffff;
	border-radius: 20px;	/* ---- was 15px ----- */
	margin: 2px;
	font-size: 0.875rem;  /* 14px */
	font-weight: 500;
	text-align: center;
	border: solid var(--sp-dgrey,#7F7F7F);
	border-width: thin;
	padding: 2px 10px}

.btn-dgrey:hover, .btn-dgrey:focus, .btn-dgrey:active, .btn-dgrey.active, .open > .dropdown-toggle.btn-dgrey {
    background: #ffffff; 
	color: var(--sp-blue4,#1E85BB);
	border: solid #1E85BB;
	border-width: thin;  
		text-decoration: none} 

.btn-dgrey:active, .btn-dgrey.active {
    background: var(--sp-blue4,#1E85BB); 
    box-shadow: none;}


 /* Styles end */