
.progress {
	margin-bottom: 15px;
}
.progress-bar { 
	background-color: #00549e;
}
.radio-toolbar {
	margin-bottom: 25px; 
	display: block;
}
.radio-toolbar input[type="radio"] {
  display: none;
}

.radio-toolbar label {
  display: inline-block;
  background-color: #fff;
  padding: 4px 11px;
  font-family: Arial;
  font-size: 16px;
  cursor: pointer;
  border: 1px solid #bbb;
}

.radio-toolbar label:hover {
  background-color: #f5f5f5;
}

.radio-toolbar input[type="radio"]:checked+label {
  background-color: #bbb;
}

label { font-weight: bold;  }
label.error { font-weight: normal; color: red; margin-top: 5px; }
.form-control.error {     border-color: #dc3545; }
input.form-check-input.error {
  outline: 1px solid red;
  -moz-appearance: none;
}

.btn-primary { background-color: #00549e; border-color: #00549e;   color: #fff !important; padding: 5px 10px !important;     border-radius: .25rem !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #58595b;
    border-color: #58595b; /*set the color you want here*/
}
.btn-secondary { background-color: #58595b; color: #fff !important;  border: 1px solid #58595b !important; padding: 5px 10px !important; border-radius: 10px !important; font-size: 16px; letter-spacing: 1px; }

.mainimage  { margin: 15px 0;  width: 100%; max-width: 900px; padding:10px;  }
.subimage { margin-bottom: 15px; height: 100px; width: auto; }

.highlight h3 { padding-bottom: 0;     font-size: 20px !important; }
    
.highlight {  padding: 15px 20px; margin: 10px 0 20px 0; background-color: #f5f5f5; border-radius: 15px; }
.highlight ul {     margin-bottom: 0px; padding-inline-start: 20px; }
.highlight li {     font-size: .9em; line-height: 1.5em; }
.highlight em { color: #666; }

.score { margin-top: 10px; border-radius: 15px; display:inline-block; padding: 5px 20px; font-size: 90%; }
.nav-tabs {
    margin-top: 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #333; 
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover { border: 1px solid #333; border-bottom-color: transparent;  }

.nav-tabs a { 
	font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px; 
    color: #666 !important;
}

.nav-tabs .active a { color: #000 !important; }

.nav-tabs > li > a:hover, .nav-tabs > li > a:focus  {
  border-color: #fff #fff #666;
  background-color: #fff;
}
h4.snapshot  { color: #000 !important; font-size: 18px !important; line-height: 1.2; }


.gray { color: #666; }


/* table layout */
.legend  { margin: 15px 0;   }
.legend th, .legend td { vertical-align: top; padding: 5px 10px; font-size: .9em; line-height: 1.5em; }


/* apply bootstrap 4 styles to bootstrap 3 */
.mb-4 {
    margin-bottom: 1rem!important;
}
.with-errors { font-size: 80%; }

.fade {
    opacity: 1;
 }


/* BREAKPOINT for mobile */ 
@media screen and (max-width:767px)  {
	body {
	    font-size: 11pt !important;
	    line-height: 1.5em !important;
	}
	.nav-link {
	    padding: .25rem .5rem;
	
	}
	.legend th, .legend td {
	    padding: 3px 8px;
	}

	
	.tab-content>.tab-pane {
	display: block !important;
	opacity: 1 !important; 
	border-bottom: 1px solid #ddd;
	margin: 20px 0;
	}
	.nav-tabs { display: none !important; }
}


