
/* COLORS */

body {
	color: #454545;
	font-size: 1vw;
}

a, a:visited {
	color: darkgreen;
}

.tableheaderbackground a:visited {
	color: white;
}

button.label {
    background-color: white;
}

button.activityprint, button.activityexcel {
	border:0;
}

input.vbrndb-button, button.vbrndb-button {
    background-color: #00683E;
    border: 1px solid #006838;
    border-radius: 5px;
    padding: 4px 6px;
    font-size: 8pt;
    font-weight: 900;
    color: white;
    cursor: pointer;
}

input.vbrndb-button:hover{
	box-shadow: 2px 2px 4px #ccc;
}

input.vbrndb-button:active{
	background-color: #e8f1ce;
	color: #006838;
	border: .5px solid #333;
}

.lightrowbackground, .lightrow {
	background-color: #fff;
}

.darkrowbackground, .darkrow {
	background-color: #e8f1ce;  /* #e8f1ce */
}

.tableheaderbackground {
	background-color: #006838;
	color: #fff;
}

.tableheaderbackground a:link {
	color: #fff;
}

table#reporttable {
/*     width: 100%; */
}

.hoverColor { 
	color: #447548;
}
/* Dialog Box */
div.transBg {
	width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 999;
    position: fixed;
    top: 0;
    left: 0;
}

.confDialog {
    background-color: white;
    width: 50%;
    height: 30%;
    left: 25%;
    top: 25%;
    position: absolute;
    border-radius: 10px;
    padding: 2em;
    box-shadow: 5px 5px rgb(0 0 0 / 15%);
}

p.confirm {
    text-align: center;
    font-size: 12pt;
    color: #006838;
    margin: 3em 0 0;
}

div.cancelDialog {
    font-size: 12pt;
    float: right;
}

div.choice button {
    margin: 1em 1em 0 0;
    font-size: 12pt;
    padding: 5px 10px;
    cursor: pointer;
}

div.choice {
    text-align: center;
    margin: 2em;
}

/* Loading spinner */
div.loader {
	
  margin-left: auto;
  margin-right: auto;
  border: 6px solid #f3f3f3;
  border-radius: 50%;
  border-top: 6px solid #006838;
  border-bottom: 6px solid #006838;
  width: 30px;
  height: 30px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari  - spinner */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

p.loader {
	text-align: center;
	margin-top: 1vw;
}

/*HEADER STYLES*/

.sectionsubheader pink {color: pink;}

div#personSearchResults {
    margin-bottom: 3vw;
}

div.loginMenuItems {
    color: #333;
    border-left: solid #666 1px;
    position: relative;
    top: 4px;
    border-right: solid #666 1px;
    border-bottom: solid #666 1px;
    padding: 5px 0;
	box-shadow: 1px 1px #eee;
    text-align: left;
}

div.headerToolbar {
    padding: 0 2em 2em;
    display: flex;
}

div.headerToolbar button.vbrn_button{
	background-color: white;
	padding: .5em;
	border: .5px solid #ccc;
	border-radius: 3px;
	margin-right: .25em;
}

div.headerToolbar button.vbrn_button:hover, input.vbrn_button:hover{
	box-shadow: 1px 1px #ccc;
}

input.vbrn_button{
	background-color: white;
	padding: .5em;
	border: .5px solid #ccc;
	border-radius: 3px;
	margin-right: .25em;
	cursor: pointer;
}

div.headerToolbar button.vbrn_button:active,input.vbrn_button:active{
	background-color: #ccc;
	border: .5px solid #333;
}


div.headerToolbar a, div.headerToolbar a:visited {
    color: unset;
    text-decoration: unset;
}

h2.switchUserDialog {
    text-align: center;
    text-transform: capitalize;
    color: darkgreen;
}

select#switchUserList {
    margin-left: auto;
    margin-right: auto;
    display: block;
    margin-top: 2em;
    font-size: 11pt;
}

button.button-select{
	background-color: #f6f6f6 !important; 
}

div.loginMenuItems a {
	color: #333 !important;
}

.loginmenuitem {
	cursor: pointer;
    padding: 7px 5px;
}

.loginmenuitem i {
    padding-right: 5px;
}

.loginMenuItems{
	text-transform: none;
}



div#loginMenu {
    font-size: 9pt;
    width: fit-content;
    float: right;
}

div#loginMenu p {
   display: inline;
    margin: 0 .25em;
}

p#loginControl {
    border-left: white solid 1px;
    padding-left: .5em;
}

#headernavbar {
	background: #74a856;
	color: #fff;
	text-transform: uppercase;
	padding: 5px 10px 5px 10px;
	height: 1em;
}
#headernavbar ul {
	
	white-space: nowrap;
	display: inline;
	border-right: none;
}
#headernavbar li {
	border-left: 1px solid #fff;
}

#headernavbar li:first-child {	
	border-left: none;
}

#headernavbar li, #headernavbar form {
	
	display: inline;
	list-style-type: none;
	padding: 0 8px;
}
#headernavbar a {
	/*color: #fff;*/
	text-decoration: none;
}

div.headerToolbar button#createLogin, div.headerToolbar button#fixLogin {
	background-color: #ffc0cb40;
}

/* styling for modal dialog confs */

p#statusMessage, p#confPrompt, p#mailListErrorMsg {
    text-align: center;
    font-size: 14pt;
    color: #006838;
}

/* for jquery ui menu popup */

.menuoverflow{
	height: 200px;
}

.ui-selectmenu-icon {
	z-index: 999999;
}

.ui-selectmenu-text, .ui-selectmenu-menu {
	z-index: 99999;
	margin-left: auto;
	margin-right: auto !important; /* important overrides ui-jquery style */
	font-size: 11px;
}

span#switchUserList-button {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.ui-widget {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 1.25em;
}

/* END ui menuselect */


.action-label { 
	background-color: #fff; 
}

.rowdivider {
	border-bottom: 1px solid #e8f1ce;
}

table.personlist, .tableborder {
	color: #222;
}

table.personlist a, .tableborder a {
	color: #222;
}

.rowicon i, .rowicon p {
	color: #444;
}

/* 
.demographicsData, .emailListData, {
    border: #DAE0DB 1px solid;
}
 */

.personsectionheader {
    color: #333;
}

.personsectiontable, .persongranttable, .demographicssectiontable, .emaillistsectiontable, .externalgrantssectiontable, .participantrelationshipsectiontable, .authorityrelationshipsectiontable {
    background-color: #DAE0DB;
}

.DataTable {
    border: #DAE0DB 1px solid;
}

fieldset.grouping { 
	border: 1px solid #DAE0DB;
	margin: 0;
	border-radius: 0px 0px 5px 5px; 
}

/* 
.action-entry { 
	background-color: #E8F9CF; 
}

.action-entry-sub { 
	background-color: #E8F9CF; 
}
 */
 
button { cursor:pointer; }
		

.action-label { 
	vertical-align: top; 
	width: 200px; 
	background-color: #fff; 
}

.displayPersonGrant { 
	width: 630px; 
	margin:0; 
	border: 1px solid #DAE0DB; 
	border-radius: 0px 0px 5px 5px;
}

.pifwarning {
	background-color: pink;
}

.pink {
	background-color: pink;
}

/* 
#projectyearprint, #projectyearexcel { 
	background-color: #E8F9CF; 
}

#demographicsprint { 
	background-color: #E8F9CF;
}

#demographicsexcel { 
	background-color: #E8F9CF;
}
 */

#subheader td {
    text-decoration: underline;
}

#bpiwarning a {
	color: red;
}

#menuitems h1 {
    /*background-color: #006838;*/
}


/* FONTS */

pre {
	font-family: arial, sans-serif;
}

input, textarea {
	font-family: arial, sans-serif;
}

table, td, tr {
	font-size: 1vw;
	font-family: arial, sans-serif; 
}

table a {
	font-family: arial, sans-serif; 
}

div.feedback {
    color: #74A854;
    font-size: 10pt;
}

p.mlField {
	font-size: 12pt;
	margin: 0;
}

.sectionheader {
	font-size: 2vw; 
	font-weight: 600;
	font-family: arial, sans-serif;
	text-transform: capitalize;
	font-family: arial, sans-serif;
}

.sectionsubheader, #subLabel { 
	font-size: 1vw; 
	font-weight: 600; 
	text-transform: capitalize;
	font-family: arial, sans-serif;
}

.label { 
	font-size: .9vw; 
	font-weight: 600; 
	text-transform: capitalize; 
	color: #222;
}

.action-label { 
	vertical-align: top; 
	width: 200px; 
}	

.action-sub-body span { 
	font-size: 7pt; vertical-align: bottom; 
}

.menuitemlabel {
	font-size: .8vw;
	font-weight: 600; 
}

.rowicon i {
	font-size: 2vw; 
}

.rowicon p {
	text-transform: capitalize;
}

.personsectionheader {
    font-size: 1.2vw;
    font-weight: 600;
}

.action-sub-body span { 
	font-size: 7pt; 
}

.pifwarning {
	font-size: 8pt;
	font-weight: 700;
}

.gen-name {
	font-size: 2vw;
    font-weight: 600;
    text-transform: capitalize;
}

.gen-email, .gen-phone {
	font-size: 1.25vw;
}

.gen-status {
	font-weight: 600;
}

.pubtextBold {
    padding-right: 5px;
}

#subLabel { 
	font-size: 8pt; 
	font-weight: 600; 
	text-transform: capitalize; 
}

#bpiwarning {
	font-size: 10px;
	color: red;
	font-weight: 700;
}

#content {
    color: black;
    font-family: arial, sans-serif;
    font-size: 1vw;
}

#menuitems h1 {
    color: #fff;
	font-size: 10px;
}



/* DIMENSIONS */

form {
	margin: 0;
	padding: 0;
}



p.RequiredField {
    padding: 1em 0;
}

p.Field {
	margin: 0;
}

input.FieldInput {
    padding: 5px;
}


table.personlist, .tableborder {
	width: 50%;
	border: .05em solid #e8f1ce;
}

table.personlist td, .tableborder td {
	padding: .25em;
}


.menuitem {
	min-height: 2em;
	display: inline-block;
	width: 100%;
	padding: .25em 0;
}
.menuitem a {
	display: block;
	padding: .2em 0;
}

.menuitem.top {
	border: 0;
}

.menuitem i {
	padding: 0 .5em 0 0;
}

.menuitemlabel {
	padding: .75em 0;
	border-bottom: .05em solid #e8f1ce; 
}



.action-entry { 
	padding: 3px 0 0 0; 
	border-collapse: collapse;
	width: 100%;
}

.action-entry-sub { 
	margin: 0 0 0 0; 
	padding: 3px 0 0 0; 
	border-collapse: collapse;
	width: 100%;
}

.action-body-viewApp { 
	padding-left: 10px; 
}

.action-sub-body { 
	display: inline-flex; 
}

.action-label { 
	padding: .5em 0 .5em 0;
}

.sectionheader { 
	margin: 0px; 
}

.sectionsubheader { 
	margin: 0 0 20px 0; 
	padding-left: 10px; 
}

.selAllButton {
display: block;
margin: 1em 0;
}

.rowicon {
	width: 10%;
	text-align: center;
	padding: 1.5vw;
}

.rowicon p {
	margin: 0;
}

#viewApplications, #reviewerSelect, #applicationTasks, #viewAPR, #PIFReview, #RPPRSubmission, #StudentAdd { 
	border-top: 1px #ccc solid; 
	padding: 0; 
	width: 75%;
}

#reviewertable td, #reviewtable td, #reporttable td {
	padding: .5vw;
}

#reviewertable, #reviewtable, #reporttable {
	border: 1px solid #ccc;
	border-collapse: collapse;
}

#reporttable {

}

#appformsubmit { 
	margin-left: 5px; 
}

.demographicsData, .emailListData, .personSection {
    padding: 25px;
    border-radius: 0 0 5px 5px;
    width: 630px;
    margin-bottom: 10px;
    border: #DAE0DB 1px solid;
}

.personSection input, .personSection select, .personSection textarea {
    width: 250px;
    margin: 2px 0;
}

.personSection input[type=checkbox], .personSection input[type=tel], .personSection input[type=date]{
	width: unset;
	margin: unset;
}

.personsectionheader {
    padding: .5vw;
}

.personsectiontable, .persongranttable, .demographicssectiontable, .emaillistsectiontable, .externalgrantssectiontable, .participantrelationshipsectiontable, .authorityrelationshipsectiontable {
    width: 630px;
    margin: 1vw 0 0;
}

.pstflat {
    border-radius: 5px 5px 0 0;
}

.pstrounded {
    border-radius: 5px;
}

.DataTable {
    padding: 25px;
    border-radius: 0 0 5px 5px;
    width: 600px;
}

.action-entry { 
	padding: 3px 0 0 0; 
	border-collapse: collapse;
}

.action-entry-sub { 
	margin: 0 0 0 0; 
	padding: 3px 0 0 0; 
	border-collapse: collapse;
}

td.action-body-cusnumaward, td.action-body-cuscomp, tr.action-body-cuscomp { 
	vertical-align: top; 
	padding: 1vw 0 0;
}


td.action-body-awardprojyr, tr.action-body-demographics, td.action-body-repaward, tr.action-body-apr {
    padding: 1vw 0;
}

td.action-body-cusnumaward {
    padding: 1vw 0 1vw 1vw;
}

.label { 
	display: inline; 
}

.action-label { 
	vertical-align: top; 
	width: 200px;
}

.action-body-viewApp { 
	padding-left: 10px; 
}

.action-sub-body { 
	display: inline-flex; 
}

.action-sub-body span { 
	vertical-align: bottom; 
}

.pifwarning {
	padding: 10px;
	border-radius: 5px;
}

.pifwarning p {
	padding: 0;
	margin: 0;
	margin: 0px;
}

.gen-name {
	margin: 25px 0 0 10px;
}

.gen-email, .gen-email-alt, .gen-phone {
	margin: 0 0 0 10px;
}

.gen-institution {
	margin: 25px 0 0 10px;
}

div.viewPersonForm, div.viewActivityForm {
    padding: 1vw;
}

div.viewPersonSection, div.viewActivitySection, div.viewStudentAddForm {
    margin-left: 200px;
    background-color: unset;
    padding: unset;
}

div.viewPersonSection div.viewPersonForm, div.viewActivitySection div.viewActivityForm, div.viewStudentAddForm {
	display: inline-block;
}

div.viewPersonForm p, div.viewActivityForm p {
    font-weight: 900;
    font-size: 11px;
}

#action-entry-fixedwidth { 
	width: 120px; 
}

#reportawardtotals, #customcompliance, #awardsprojectyear, #demographics, #customnumberawardees, #apr, #viewPerson, #activityReport, #viewStudentsAdded, #pubsreport { 
	border-top: 1px #ccc solid; 
	padding: 0px; 
	width: 95%;
}

#reportFormat { 
	vertical-align: top; 
	padding-left: 30px;  
}

#reportFormat p { 
	padding-right: 5px; 
	display: block;
}

#projectyearprint, #projectyearexcel,#complianceprint,#complianceexcel { 
	border: 0px; 
}

#cuscomp-options { 
	vertical-align: top; 
}

#demographicsprint,#peopleprint { 
	margin-top: 15px; 
	padding-left: 10px; 
	border: 0px; 
}

#demographicsexcel,#peopleexcel { 
	margin-top: 0px; 
	padding-left: 10px; 
	border: 0px; 
}

#bpiwarning {
	padding: 5px;
}

#content {
    padding-right: 10px;
    padding-left: 10px;
}

#menuitems h1 {
    margin: 8px -10px 0 -10px;
    padding: .5em 0px .5em 10px;  
}

/* Student Awards Report */

.studentAwardAssociations {
    border: 1px solid #ccc;
    padding: 10px;
}

.studentAwardAssociations input {
    border: 0;
    background-color: white;
    color: black;
    margin: 0;
    padding: 0;
    font-size: 9pt;
}

p.noneassigned {
    margin-left: 2vw;
    color: #666;
    font-style: italic;
}

div.subheader {
    color: #006838;
    font-size: 14px;
    font-weight: 900;
    margin: 1vw 0 0;
}

input.stulabel {
    font-size: 10px;
    font-weight: 900;
    margin-top: 1vw;
}

input.studentname, input.studenttype, input.awardname, input.startdate, input.enddate {
    width: 120px;
}

input.studentemail {
	width: 200px;
}

div.row {
    border-bottom: 1px solid #ccc;
    padding: .25vw 0;
}

/* CURSORS AND MISC. */

.hoverColor { 
	cursor: pointer;
}

.pointer { 
	cursor: pointer; 
	color: #447548;
}

#greendot { width: 10px; height: 10px; background-color: green; border-radius: 10px;  margin-left: 25px; }

#reddot { width: 10px; height: 10px; background-color: red; border-radius: 10px;  margin-left: 25px; }





