/* TH 2021-08-23 (b367, Issue 791): css file for color variables */
	/* TH 2023-10-30 (trunk): Removed. Moved these into CTPage so we can control the version number
	@ import url(central_var.css);
	@ import url(sidemenu_master_1.css?v=1);	/ *must be placed at the top * /
	
	/ * TH 2023-02-10 (b426, issue 886): Added google chart override css * /
	@ import url(googlechart_override.css);
	*/

	body {
		/* RS 2018-04-04 (b247, General UI) change main font to oxygene */
		/* RS 2020-03-23 (Trunk, UI): Use the same Open Sans font as customizr on info.rcampus.com */
		font-family: 'Open Sans', 'Oxygen', verdana, arial, helvetica, sans-serif;
		font-size:8pt; 
		background-color:#ffffff;
		color:#000000;
		margin-top:0px;
		margin-left:0px;  /* needed for items in frames such as quickpost */
		margin-right:0px;	/* needed for items in frames such as quickpost */
	}

	/*
	.fullpage {  covers the entire screen 
		text-align: center;
		background-color:white;		
	}
	*/
	
	
	img {
		border: none;
	}
	
	img.poweredby {  /* default border is none (skin borders may vary) */
		border: none;
	}
	
	.pagecontent { /* covers all content, but not the margin */
		/* RS 2017-04-05 (issue 462, b221): removed border from page content
		border: 1px solid #eeeeee; */
		background-color: #ffffff;  /* make sure the fullpage color of skins don't spill over into page content */
		width: 100%;  /* make content cover the width of allocated real estate */
	}

	.pagecontent_mid { /* the frame around the content */
		border-color: white;
		border-style: solid;
		background-color: white;  /*covers the left over area in case pagecontent_core doesn't cover the content */
	}

	.pagecontent_core { /* the actual content inside the pagecontent_mid (between page title and page footer) */
		background-color:white;
		/* important: without the line-height internet explorer may hide parts of the content.  this was suggested
			by https://www.positioniseverything.net/explorer/peekaboo.htm.  an example of content affected
			by this is pages in an xsite specially their titles 
		*/
		line-height:1.2;   
		
		/* TH 2024-07-30 (b452, issue 930): Added padding */
		padding: 15px; 
	}
	
	/* TH 2018-06-26 (b235, UI): Added. Fix the issue with border around page content with it's clicked	*/
	div.pagecontent_core:focus {
		outline: none;
	}
	
	/* begin: used in conjunction with listheading */
	.large {
		font-size:large;
	}

	.small {
		font-size:small;
	}

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

	/* end: used in conjunction with listheading */

	a:link, span.fakelink { /* fakelink is a span that takes the same attributes as a link */
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
	}
	
	a:visited {
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
	}

	a:hover {
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link_hover);
	}

	form {
		margin-bottom:0;	/*avoid the extra blank line at the bottom of forms */
	}
	
	ul.cleanlist { /*suppress extra whitespace above and to the left of list */
		list-style-type: none; /* needed by firefox */
		margin: 5px; 	/* needed by all */
		padding: 0px;  /* needed by netscape */
	}
	
	li { /*list-style-type: circle;*/
		list-style-position: outside; /*keep the bullet to the outside of paragraph */
	}
	
	sup, sub {
		font-size:90%;
	}

	
	
	.strikethrough, .linethrough {
		text-decoration : line-through;
	}
	
	.smallcaps {
		font-variant : small-caps;
	}

	.generic, .genericl, td {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9pt;
	}

	.genericlarge {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:11pt;
	}
	
	.genericsmall, .genericsmalll {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
	}

	.generictiny, .generictinyl {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8px;
	}

	.genericc {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		text-align:  center;
	}

	.genericsmallc {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10px;
		text-align:  center;
	}

	.generictinyc {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8px;
		text-align:  center;
	}

	.genericr {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		text-align:  right;
	}

	.genericsmallr {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10px;
		text-align:  right;
	}

	.generictinyr {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8px;
		text-align:  right;
	}

	p.justify {
		text-align:justify;
		font-size : 8pt;
	}
	
	p.largeinitial {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		text-align:justify;
		text-indent: 1em;
		font-size : 8pt;
	}
	
	p.largeinitial:first-letter {
		/*float: left;*/
		font-size: 200%;
	}

	.textindent {
		text-indent: 10pt;
	}

	.bold {  /* also needed for fckeditor */
		font-weight:bold;
	}
 
	.notextdecoration {
		text-decoration: none;
	}
	
	.dots_blue { /*horizontal rule made of dots in silver */
		color: silver;
		font-size:8px;
		text-align:center;
		background-image: url(../images/dots/dot_blue.gif);
	}
	
	/* generic border placed around tables */
	.border {
		
		/* RS 2022-11-16 (b418): change border color */
		border: solid #bbb;   /*#b4d0dc;*/
		border-width : 1px 1px 1px 1px;
	}

	.popupborder {
		border: ridge 6px;
	}
	
	.orange {
		color: #ff6633;
	}

	.fg-pastelblue {
		color: #006699;
	}

	.blink {
		text-decoration: blink;
	}

	.italic {
		font-style: italic;
	}
	
	.timedisplay {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10px;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_link); /* steelblue */
	}

	a.plaingray {
		text-decoration: none;
		color: #808080; /*gray;*/
	}

	a.gray {
		color: #808080; /*gray;*/
	}
	
	a.msgnormal {
		font-size:9pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color: #3366cc;
	}
	
	a.msghighpriority {
		font-size:9pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color: #990000;
	}
	
	.msgcontentlist {
		font-size:7pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color: #777;
	}
	
	/* 
	.sidemenuitem1 { /* level one is a heading * /
		/*font-family: verdana, arial, helvetica, sans-serif;* /
		font-size:9pt; 
		/*background-image:url(../images/tabs/images/tab_s_m.gif);* /
		/*background-color: #cceeff;* /
		color: white; /*#005555; * /
		padding: 2 5 2 5;
		/*
		border-width: 0 0 0 1;
		border-color: #cceeff;
		border-style: solid;* /
		
		font-weight: normal;
	}

	.sidemenuitem2, .sidemenuitem { /*level 2 is the default * /
		/*font-family:verdana, arial, helvetica, sans-serif;* /
		font-size:12px;
		padding: 1 1 1 1;  /* don't remover 1px padding or the top border created by sidemenuitemselected won't show * /
	}

	.sidemenuitem3 {
		/*font-family:verdana, arial, helvetica, sans-serif;* /
		font-size:11px;
		/* text-indent: 10px;  doesn't work in ns.  use padding * /
		padding: 1 1 1 10;	/* don't remover 1px padding or the top border created by sidemenuitemselected won't show * /
	}

	.sidemenuitem4 {
		/*font-family:verdana, arial, helvetica, sans-serif;* /
		font-size:10px;
		padding: 1 1 1 20;	/* don't remover 1px padding or the top border created by sidemenuitemselected won't show * /
	}

	.sidemenuitem5 {
		/*font-family:verdana, arial, helvetica, sans-serif;* /
		font-size:9px;
		padding: 0 0 0 30;	/* don't remover 1px padding or the top border created by sidemenuitemselected won't show * /
	}
	*/
	
	/*  RS 2022-12-01 (b418, UI): newer style rounded box START */
	.roundedbox {
		border:1px solid silver; 
		border-radius: 7px;
		box-sizing: border-box; /* needed to stop right border from getting cut off */

	    display: table; /* keep content inside the div. */
	}

	.roundedbox.shadow, .roundedbox.shadowsolid {
		box-shadow: 5px 5px 5px #888888;
	}

	.roundedbox.shadowinout {
		box-shadow: inset 0px 0px 4px #bbb, 0px 0px 5px #888888;
	}

	.roundedbox.pixelated {
		border-style: dotted;
	}

	.roundedbox.glass {
		box-shadow: inset 2px 2px 0px lightsteelblue, 2px 3px 0px lightsteelblue;
    	border-color: lightsteelblue;
	}

	.roundedbox-content {
		padding: 15px;
	}

	/* newer style rounded box title */
	.roundedbox > .boxtitle, 
	.roundedbox > .boxtitle1,
	.roundedbox > .boxtitlewhite {
		font-size: 1rem;
		font-weight: bold;
		padding: 10px;
		border-bottom: 1px solid silver;
		text-align: left;
		background-color: whitesmoke;
		border-radius: 6px 6px 0 0;
	}

	/* newer style rounded box title */
	.roundedbox > .boxtitle, 
	.roundedbox > .boxtitle1 {
		color:#777;
	}

	/* newer style rounded box title */
	.roundedbox > .boxtitlewhite {
		color:white;
	}
	/*  RS 2022-12-01 (b418, UI): newer style rounded box END  */

	/* older style rounded box title */
	.boxtitle, .boxtitle1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:13px;
		color:#ff6633;
		font-weight: bold;
	}

	/* older style rounded box title */
	.boxtitlewhite {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:13px;
		color:white;
		font-weight: bold;
	}

	.headline, .headline1 {
		font-size:30px; 
		font-variant:small-caps; 
		color: #777; 
	}

	.headline7 {
		font-size:30px; 
		font-variant:small-caps; 
		color:#0099ff; 
	}

	.headlineunderlined, .headlineunderlined1 {
		font-size:30px; 
		font-variant:small-caps; 
		color: #777; 
		border-bottom:1px solid #777;
	}

	.headlineunderlined7 {
		font-size:30px; 
		font-variant:small-caps; 
		color:#0099ff; 
		border-bottom:1px solid #0099ff;
	}


	/* RS 2018-008-31 (trunk): consolidating all section title fonts */
	.sectiontitle, .sectiontitle1,
	.sectiontitlec, .sectiontitlec1,
	.SectionTitleBordered,  
	.sectiontitlebordered, .sectiontitlebordered1,
	.sectiontitleborderedc, .sectiontitleborderedc1,
	.sectiontitle2,
	.sectiontitlec2,
	.SectionTitleBordered2,
	.sectiontitlebordered2,
	.sectiontitleborderedc2,
	.sectiontitle3,
	.sectiontitlec3,
	.sectiontitle4,
	.sectiontitlebordered4,
	.sectiontitleborderedc4,
	.sectiontitlec4,
	.sectiontitle5,
	.sectiontitlebordered5,
	.sectiontitle6,
	.sectiontitlec6,
	.sectiontitlebordered6,

	/* TH 2020-02-25 (b324, issue 715): Add a new section title class for matrix folio*/
	.sectiontitlebordered7,
	.sectiontitleborderedc6,
	.sectiontitleunderlined, .sectiontitleunderlined1,	
	.sectiontitleunderlined2,
	.sectiontitleunderlined3,
	.sectiontitleunderlined4,
	.sectiontitleunderlined5,
	.sectiontitleunderlined6,
	.sectiontitleunderlined7 {
		font-size:18px;
		font-family: 'Montserrat', 'Open Sans', verdana, arial, helvetica, sans-serif;
	}

	/* RS 2018-008-31 (trunk): consolidating all section title and border padding */
	.sectiontitle, .sectiontitle1,
	.sectiontitlec, .sectiontitlec1,
	.SectionTitleBordered,  
	.sectiontitlebordered, .sectiontitlebordered1,
	.sectiontitleborderedc, .sectiontitleborderedc1,
	.sectiontitle2,
	.sectiontitlec2,
	.SectionTitleBordered2,
	.sectiontitlebordered2,
	.sectiontitleborderedc2,
	.sectiontitle3,
	.sectiontitlec3,
	.sectiontitle4,
	.sectiontitlebordered4,
	.sectiontitleborderedc4,
	.sectiontitlec4,
	.sectiontitle5,
	.sectiontitlebordered5,
	.sectiontitle6,
	.sectiontitlec6,
	.sectiontitlebordered6,

	/* TH 2020-02-25 (b324, issue 715): Add a new section title class for matrix folio*/
	.sectiontitlebordered7,
	.sectiontitleborderedc6	{
		padding: 10px;
	}


	/* RS 2018-008-31 (trunk): consolidating all section title underlined padding */
	.sectiontitleunderlined, .sectiontitleunderlined1,	
	.sectiontitleunderlined2,
	.sectiontitleunderlined3,
	.sectiontitleunderlined4,
	.sectiontitleunderlined5,
	.sectiontitleunderlined6,
	.sectiontitleunderlined7 {
		padding: 10px 10px 5px 10px;
	}



	.sectiontitle, .sectiontitle1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_gray);
	}

	.sectiontitlec, .sectiontitlec1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_gray);
		text-align:center; 
	}

	.sectiontitleunderlined, .sectiontitleunderlined1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_gray);
		border: solid var(--rs_sectiontitle_gray); 
		border-width: 0px 0px 1px 0px;  		
	}
	
	.SectionTitleBordered,  /* RS 2013-03-24: backward compatibility - need to keep this casing for fck */
	.sectiontitlebordered, .sectiontitlebordered1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		color:#333;
		border: solid 1px #eeeeee;
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/dblshade_silverwhite_vert_60.gif);*/
		background-color:#eeeeee;
		/* background-image:url(../images/backgrounds/shade_silverwhite_vert_60.png); */
	}

	.sectiontitleborderedc, .sectiontitleborderedc1 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		color:#333;
		border:solid 1px silver;
		background-color:#eeeeee;
		/*background-image:url(../images/backgrounds/dblshade_silverwhite_vert_60.gif);*/
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_silverwhite_vert_60.png);*/
		text-align:center; 
	}

	.sectiontitle2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);  /*orange*/
	}

	.sectiontitlec2 {
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);  /*orange*/
		text-align:center; 
	}
	
	.sectiontitleunderlined2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);/*orange*/
		border: solid var(--rs_sectiontitle_orange); /*orange */ 		
		border-width: 0px 0px 1px 0px; 
	}

	.SectionTitleBordered2,  /* RS 2013-03-24: backward compatibility - need to keep this casing for fck */
	.sectiontitlebordered2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);
		border: solid 1px #ffd4b7; 
		background-color: #fff1ea;
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_orangewhite_vert_60.png);*/
	}

	.sectiontitleborderedc2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);
		border: solid 1px #ffd4b7; 
		background-color: #fff1ea;
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_orangewhite_vert_60.png);*/
		text-align:center; 
	}
	
	.sectiontitlesmall {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_gray);		
		font-weight: bold;
	}

	.sectiontitlesmall2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);  /*orange*/
		font-weight: bold;
	}

	.sectiontitlesmall3 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_sectiontitle_blue);  /*blue*/
		font-weight: bold;
	}

	.sectiontitleborderedsmall {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_gray);		
		font-weight: bold;
		border: solid 1px #eeeeee;
		background-color:#eeeeee;
	}

	.sectiontitleborderedsmall2 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_orange);  /*orange*/
		font-weight: bold;
		border: solid 1px silver;
		background-color: #fff1ea;
	}

	.sectiontitle3 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_black);
	}
	
	.sectiontitlec3 {
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_black);;
		text-align:center;
	}

			

	.sectiontitleunderlined3 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_black);;
		border: solid var(--rs_sectiontitle_black);; 
		border-width: 0px 0px 1px 0px;  		
	}

	.sectiontitle4 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/*color:#006666; dark blue green*/
	}

	.sectiontitlebordered4, .sectiontitleborderedc4, .sectiontitleunderlined4  {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/*color:#006666; dark blue green*/
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		border:1px solid var(--rs_blue); /*RCampus blue*/
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_bluewhite_vert_60.gif);*/
	}

	.sectiontitleborderedc4 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/*color:#006666; dark blue green*/
		/*border:1px solid #0c95be; *//*RCampus blue*/
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_bluewhite_vert_60.gif);*/
		text-align:center;
	}

	.sectiontitlec4 {
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/*color:#006666; dark blue green*/
		text-align:center;
	}
	
	.sectiontitleunderlined4 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/*color:#006666; dark blue green*/
		/*border: solid #008888;*/ /*darker blue green*/
		border-width: 0px 0px 1px 0px;  		
	}


	/* RS 2020-04-06 (Trunk): cosolidationg sectinontitle 4 colors */
	.sectiontitle4,
	.sectiontitlebordered4,
	.sectiontitleborderedc4,
	.sectiontitlec4,
	.sectiontitleunderlined4 {
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_blue); /*RCampus blue*/
	}

	.sectiontitle5 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_pink); /*pink*/
	}

	.sectiontitlebordered5 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		color:#333; 
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(/images/backgrounds/shade_silverwhite_vert_60.jpg);*/
	}
	
	.sectiontitleunderlined5 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_pink); 					/*pink*/
		border: solid var(--rs_sectiontitle_pink); /*pink*/
		border-width: 0px 0px 1px 0px;  
				
	}
	
	
	
	.sectiontitle6 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_green);  /*green*/
	}

	.sectiontitlec6 {
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_green);  /*green*/
		text-align:center; 
	}
	
	.sectiontitleunderlined6 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_green);/*green*/
		border: solid var(--rs_sectiontitle_green); /*green */ 		
		border-width: 0px 0px 1px 0px; 
	}

	.sectiontitlebordered6 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_green);	/*green */ 
		border: solid 1px var(--rs_sectiontitle_green);  /*green */ 
		background-color: #eeffcc; /*green */ 
		/*background-image: url(../images/backgrounds/shade_greenwhite_vert_60.png);*/
	}

	.sectiontitleborderedc6 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color:var(--rs_sectiontitle_green); /*green */ 
		border: solid 1px var(--rs_sectiontitle_green); 
		background-color: #eeffcc; /*green */ 
		/* RS 2018-08-31 (trunk): consolidated   background-image:url(../images/backgrounds/shade_greenwhite_vert_60.png);*/
		text-align:center; 
	}
	
	
	
	.sectiontitleunderlined7 {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;   RS 2018-08-31 (trunk): consolidated */
		color:#996600; 					/* brown */
		border: solid #996600;  /* brown */
		border-width: 0px 0px 1px 0px;
  		
	}

	/* TH 2020-02-25 (b324, issue 715): Added. New section title class for matrix folio*/
	.sectiontitlebordered7 {
		background-color:#62A9FF;
		color: white;
		font-weight: bold;
	}
	/*--------------------------------------------------------------*/
	.sectionheading, sectionheading1 {
		/*font-family:tahoma, verdana, geneva, arial, helvetica, sans-serif; */
		/*font-size:18px;*/		
		color:black;
	}

	.sectionheading2 {  /* orange */
		/*font-family:tahoma, verdana, geneva, arial, helvetica, sans-serif; */
		/*font-size:18px;*/	
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_sectiontitle_orange);
	}

	.sectionheading3 {  /* blue */
		/*font-family:tahoma, verdana, geneva, arial, helvetica, sans-serif; */
		/*font-size:18px;*/		
		color:#417fbf; 
	}

	.sectionheading4 {  /* green */
		/*font-family:tahoma, verdana, geneva, arial, helvetica, sans-serif; */
		/*font-size:18px;*/	
		color:#1baa37;
	}
	/*--------------------------------------------------------------*/
	.sectionheadingstretch, sectionheadingstretch1 {  
		/*font-family:tahoma, verdana, geneva, arial, helvetica, sans-serif; */
		/*font-size:18px;*/	
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_sectiontitle_orange);	/* orange */
		letter-spacing: 7px;
}
	
	/* RS 2020-03-23 (Trunk, UI): Use Montserrat for all headers */
	.sectionheadingstretch, sectionheadingstretch1,
	.sectionheading, sectionheading1,
	.sectionheading2,
	.sectionheading3,
	.sectionheading4,
	.sectionheadingstretch, sectionheadingstretch1,
	.searchsectionheading {
		font-family: 'Montserrat', 'Open Sans', verdana, arial, helvetica, sans-serif;
	}


	/* RS 2020-03-23 (Trunk, UI): Consolidate header sizes */
	.sectionheadingstretch, sectionheadingstretch1,
	.sectionheading, sectionheading1,
	.sectionheading2,
	.sectionheading3,
	.sectionheading4,
	.sectionheadingstretch, sectionheadingstretch1,
	.searchsectionheading {
		font-size:18px;
	}

	/*--------------------------------------------------------------*/
	.searchsectionheading {
		background-color:#8cc6c6;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:18px;*/
		color: white;
	}
	
	
	.searchmargin {
		background-color:#99cccc;
	} 

	.searchbody {
		background-color:#d1e9e9;
	}
	
	.searchoverlap {
		background-color:#6ab5b5;
	}
	
	
		/* how to: begin */
	.howto_sectiontitle {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:14pt;
		background-color:#fafafa;
		color:#555;
		font-weight: bold;
	}

	.howto_question {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:11pt; 
		background-color:#ffffff;
		color: #0099ff;
		font-weight: normal;
	}

	.howto_step {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9pt;
		background-color:#ffffff;
		color:#000000;
	}

	.howto_shortcut {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		background-color:#ffffff;
		color:#000000;
	}
	
	.howto_border {
		border:1px dashed silver; 
		margin:5px; 
		padding:5px;
	}
		/* how to: end */

	/* faq question */
	.faqquestion {
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		font-weight:bold;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
	}
		
	.faqanswer {
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		font-weight:normal;
		color: #003333;
	}
	/* end: faq question */

		
		
	.testclass {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
	}

	.testtitle {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		font-weight: bold;
	}

	.question {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* TH 2021-04-26 (trunk): Minor UI change */
		font-size:1.3em;
	}
	
	.questionnum {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		font-weight: bold;
	}

	/* MS 2017-12-06 (Issue 512, b246) change font size and padding */
	.answer {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size: 1.3em;
		/* padding: 0 0 10px 0;  RS 2018-01-03 (b246): removed.  It overrides table cell padding when showin answers */
		
		/* TH 2023-05-26 (b434, issue 896): Add border around the answer */
		/* TH 2023-09-18 (b441, issue 905): Removed border
		border: 1px solid silver;
		padding: 2em;
		*/
	}


	.answernum {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		font-weight: bold;
		
		/* TH 2020-11-24 (b342, issue 338): Add width the answer number */
		width: 20px;
		display:inline-block;
	}

	.assignmenttitle	{
		color : #2c2c2c;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:14pt;
		font-weight: bold;
		text-align: center;
		background-color:#99ccff;
	}

	.assignmentinfo	{
		color: #0099cc;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* TH 2022-03-23 (b401, issue 842-N10): Make font size bigger */
		font-size:11pt;
		font-weight: bold;
	}

	.assignmentcontent	{
		color : black;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		font-weight: normal;
	}


	.copyright {
		text-align:center;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		color: #888888; /*#1f1f1f;*/
	}

	/* RS 2018-06-19 (Trunk, UI): Begin consolidate and modernize message and errormessage */
	.message, .errormessage, 
	.DataEntryError,
	.dataentryerror {
		text-align:left;

		/* RS 2021-02-09 (trunk): changed left padding from 3 to 2 */
		padding: 1em 1em 1em 2em;  /* larger padding left to leave room for icon */
		box-sizing: border-box;		 /* without it, padding pushes text outside the box */
		background-repeat: no-repeat;
		background-position: .5em;  /* left position */
	}

	.DataEntryError,  /* 2015-08-28: keep orig format, still used on some pages */
	.dataentryerror {
		font-size:9pt;
		box-sizing: border-box;  /* without it, padding pushes text outside the box */
		color: white;
		font-weight: bold;
		background-color:#ff0000;

		/* RS 2021-02-09 (trunk): removed, replace with FA char */
		/*background-image:url(../images/icons/16/warning.gif);*/
	}

	.message, .errormessage {   /* message displayed on top of ctheader (from session.message)*/
		font-size:12pt;
		font-weight: normal;
		width: 100%;
	}
		
	.message {
		color: #333;
		background-color: #01eefe;
		background-image: url(../images/icons/32/lightbulb_on.gif);
	}

	.errormessage{		/* error message displayed at top of ctheader */
		color: white;
		background-color:#ff0000;

		/* RS 2021-02-09 (trunk): removed, replace with FA char */
		/*background-image: url(../images/icons/32/warning.gif);*/
	}
	/* RS 2018-06-19 (Trunk, UI): End consolidate */

	/* RS 2021-02-09 (trunk): Added. Make dataentryerror match the new alert UI */
	.DataEntryError::before,  /* keep orig format, still used on some pages */
	.dataentryerror::before,
	.errormessage::before {
		
		/* TH 2024-02-01 (trunk): Change the error message X icon to the warning icon */
		content: "\f071";
		font-family: "Font Awesome 5 Pro";
		left:-1em;
		position:relative;
		
		/* TH 2022-02-25 (trunk): Added padding */
		padding-left:1em;
	}	


	/* RS 2022-11-16 (b418): separated .input from input as it's applied to input containers like td, div etc. */
	.input {

	} 

	/* RS 2022-11-16 (b418): updating and combining with jq */
	/* only apply to textual input and not submit/button. */
	input[type=text], input[type=passsword], input[type=number], input[type=date], input[type=time], 
	select, 
	textarea {
		/*text-align:				left;*/
		/*font-family: verdana, arial, helvetica, sans-serif;*/  /*needed for textareas */
		/* RS 2022-11-16 (b418): enlarge all input and text boxes */
		font-size: .95rem !important; /* 10pt; 8pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		font-weight: normal;
		z-index:1;

		/* RS 2022-11-16 (b418): from jq_xxxxx */
		background-color: white !important;
		border-style: solid !important;
		border-width: 1px !important;
		padding: 5px !important;

	}

	/* RS 2022-11-16 (b418): Added. Only apply to buttons  */
	input[type=submit], input[type=button]
	
	/* TH 2024-02-022 (trunk): Added. Apply this css to <a> tag with the class button
	 as well to keep them uniformed in size */
	, a.button
	{
		/*text-align:				left;*/
		/*font-family: verdana, arial, helvetica, sans-serif;*/  /*needed for textareas */
		font-size: .95rem !important; /* 10pt; 8pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		font-weight: normal;
	}

	input.text {
		/*font-family: sans-serif;*/

		/* RS 2022-11-16 (b418): removed.  Use input above */
		/*font-size: 10pt;*/ /*8pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
	}


	/* RS 2022-11-16 (b418): from jq_xxxxx */
	input[type=button], input[type=submit],
	input.button, input.submit {
		text-align:				center;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/*font-size:	10pt; 7pt;*/ /* RS 2021-06-08 (b368): increase font sizes */

		margin:3px;  /* RS 2021-07-09 (b368): add some margin for when buttons wrap */
	}

	input.noborder  {
		border:none;
	}

	input.homepage {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:					10pt; /*9pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		font-weight:				bold;
		text-align:					right;
	}

	.inputinvalid {
		text-align:				left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:				10pt; /*9pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		color:						#000000;		/* black */
		background-color : #ffdead;		/* navajowhite */
		
		/* TH 2024-02-01 (trunk): Added red border around invalid inputs */
		border: 1px solid red !important;
	}

	.inputr {
		text-align:				right;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:				10pt; /*8pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
	}
	
	/* works in netscape only */
	input:focus {
		text-align:left;  	/* important: needed for netscape when inputr is used because the cursor doesn't show when inside an empty box */
	}

	.inputsmall {
		font-size: 9pt; /*8pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		/*font-family: sans-serif;*/
		color: black;
	}
	
	.inputtiny {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 8pt; /* 6.5pt;*/ /* RS 2021-06-08 (b368): increase font sizes */
		color: black;
	}

	/* RS 2016-07-27 (b213): generic readonly */
	.readonly {
		background-color:whitesmoke;
	}

	/* SC 2016-05-19 (issue 440, b215): inputs that are readonly, use whitesmoke background */
	input[readonly] {
		background-color:whitesmoke;
	}
	
		/* begin: tree styles */
	a.treeitem1 {
		/*font-family: sans-serif;*/
		font-size: 9pt;
		color: #000066;
		text-indent: 0px;
	}
	a.treeitem2 {
		/*font-family: sans-serif;*/
		font-size: 9pt;
		color: #333399;
		text-indent: 22px;
	}
	a.treeitem3 {
		/*font-family: sans-serif;*/
		font-size: 9pt;
		color: #004400;
		text-indent: 30px;
	}
	a.treeitem4 {
		/*font-family: sans-serif;*/
		font-size: 8pt;
		color: #666600;
		text-indent: 38px;
	}
	a.treeitem5 {
		/*font-family: sans-serif;*/
		font-size: 8pt;
		font-style:italic;
		color: #006600;
		text-indent: 46px;
	}

	.treelevel1 {
		background-color: #c1c1c1
	}

	.treelevel2 {
		background-color: #c6c6c6
	}

	.treelevel3 {
		background-color: #cfcfcf
	}

	.treelevel4 {
		background-color: #dddddd
	}

	.treelevel5 {
		background-color: #eeeeee
	}

		/* end: tree styles */

		/* begin: top menu bar where faculty central logo is */

	body.titlebarbody{
		background-color: #ffffee;
	}

	div.titlebarall {
		position: absolute;
		top: 3px;
		left: 5px;
	}

	div.titlebartitle {
		font-size: 11pt;
		font-weight: bold;
		/*font-family: sans-serif;*/
	}

	div.titlebarlinks {
		font-size: 8pt;
		font-weight: bold;
		/*font-family: sans-serif;*/
		color: black;
		text-decoration: none;
	}


	a.titlebarlinks {
		/*font-family: sans-serif;*/
		font-size: 8pt;
		font-weight: bold;
		color: black;
		text-decoration: none;
	}


	.submenuwarning{ /*default for submenus.  see specifics in topmenu_xxx.css */
		background-color:red; 
		color:white;
		text-decoration:blink;
	}
	
	/* the next two submenucontaineruncurrent styles must be exaclty this way or either ie or ns would act up */
	table.submenucontainercurrent {		/* table container of the uncurrent submenu bars. */
		background-color:white;  /* same shade as the image */
		/* background-image:url(/images/backgrounds/shade_silverwhite_vert_60.jpg);*/
	}

	td.submenucontainercurrenttitle {		/* td container of the uncurrent submenu bars */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 11px;
		color:#cc3300;
	}	

	.loginbutton {
		border-bottom:1px solid silver;
		margin: 2px;
		text-align:center;
	}

	a.loginbutton {
		text-decoration:none;
		color: #0099ff;
	}
	
	td.submenucontainercurrent {		/* td container of the uncurrent submenu bars */
		padding: 0px 0px 0px 0px;
	}

		
		/* end: top menu bar where faculty central logo is */


	.smallfont{
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
	}

		/* begin: footer section */
	a.footermenu {
		/*font-family: sans-serif;*/
		font-size: 9pt;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */ /*white;*/
		text-decoration: none;
		/*background-color: white; */
		padding: 2px;
		line-height: 1.4;  /* RS 2017-04-17 (b221): added */
	}

	.labelfooter {
		/*font-family: sans-serif;*/
		font-size: 9pt;
		color: black;
	}

		/* end: footer section */

	p.indented  {
		text-indent:	0.15in;
	}


	h1 {
		
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:2.1rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color:          #000000;
		/*font-weight:bold;*/
	}

	h2 {
		
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:1.9rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color:     #000000;
		/*font-weight:bold;*/
	}

	h3, div.h3{
		/* text-align:center; */
		
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:1.7rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color:#000000;
		/*font-weight:bold;*/
	}

	div.homepagename {
		font-size:16pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-weight:	bold;
		font-style:		italic;
	}

	div.homepageedittext {
		font-size:9pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
	}

	h4, div.h4{
		/* text-align:center; */
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:1.5rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		color:#000000;
		/* font-weight:bold;*/
	}

	h5 {
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:1.3rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* RS Removed: bad color
		color:#0000ff;*/
	}

	h6 {
		/* TH 2023-05-26 (b434, issue 896): UI. Increase size */
		font-size:1.1rem;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* RS Removed: bad color
		color: #0000ff;*/
	}

	/* RS 2020-03-23 (Trunk, UI):  Use 'Montserrat' font family for all h1...h6*/
	h1,h2,h3,h4,h5,h6 {
		font-family: 'Montserrat', sans-serif;
		
		/* TH 2023-05-26 (b434, issue 896): all the <h> tag will be aligned left */
		text-align: left;
	}

	div.labeltop{
		text-align:center;
		vertical-align:baseline;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9pt;
		font-weight:bold;
	}

	div.tblheading{
		text-align:center;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12pt;
		font-weight:bold;
	}

		/* begin: hints */

	.hint {
		position: absolute;
		z-index: 100;
		color: #333333;
		background-color: #ccffcc;
		padding: 5px;
		/*				border: solid 1pt green; */
		top: 0px;
		left: 500px;
		width: 200px;
		visibility: hidden;
	}

	a.hintref {
		color: green;
	}
		/* end: hints */

		/* begin: edit button bars */
	td.buttonbarborder {/* the outer table of a menu bar which gives it the border effect */
		background-color: #f5f5f5; /*whitesmoke*/
	}

	tr.buttonbar { /* the background of a menubar */
		background-color: #f5f5f5; /*whitesmoke*/
	}
		/* end: edit button bars */



	.infobitetitle {
		color: #0099cc;
		font-size:10px;
		/*font-family: verdana, arial, helvetica, sans-serif;*/

	}
	
	.infobitecontent {
		color: #660066;
		font-size:10px;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-weight:normal;
	}
		
	/* begin: show list pages */
	.listborder, .listborder1 {   /* the outer table of a list which gives it the border effect */
		
		/* RS 2022-11-16 (b418): change color from blue to gray */
		background-color: #bbb;   /*#b4d0dc;*/	/*pastel blue*/
	}

	.listtitle, .listtitle1 {   /* the title section of a bordered list */
		background-color: #ecf8ff;	/*pastel blue light*/
	}

	.listborder2 {   /* the outer table of a list which gives it the border effect */
		background-color: #ddb7ba;	/*pastel pink*/
	}

	.listtitle2 {   /* the title section of a bordered list */
		background-color: #fff5f6;	/*pastel pink*/
	}

	.listborder3 {   /* the outer table of a list which gives it the border effect */
		background-color: #a8dda0;  /*pastel green*/
	}
	
	.listtitle3 {   /* the title section of a bordered list */
		background-color: #e0ffe3;	/*pastel green light*/
	}
	
	.listborder4 {   /* the outer table of a list which gives it the border effect */
		background-color: #ff9999;
	}
	
	.listtitle4 {   /* the title section of a bordered list */
		background-color: #ffffff;
	}

	.listborder5 {   /* the outer table of a list which gives it the border effect */
		background-color: #808080; /*gray;*/
	}
	
	.listtitle5 {   /* the title section of a bordered list */
		background-color: #aaaaaa; /* gray */
		color: white;
	}


	/* gray combination */
	.listborder6 {   /* the outer table of a list which gives it the border effect */
		background-color: #808080; /*gray;*/
	}
	
	.listtitle6 {   /* the title section of a bordered list */
		background-color: #f5f5f5; /*whitesmoke*/
	}

	.listborder10 {   /* the outer table of a list which gives it the border effect */
		background-color: #808080; /*gray;*/
	}
	
	.listtitle10 {   /* the title section of a bordered list */
		background-color: #f5f5f5; /*whitesmoke*/
	}



	td.menubarborder {/* the outer table of a menu bar which gives it the border effect */
		background-color: #a0b8e8;
	}

	td.description	{
		font-size:14pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		background-color:  #d3d3d3;
		padding: 3px;
	}

	.listaction	{  /* actions done on a list item.  see rostermatcheditf for an example */
		font-size:8pt;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		background-color:  white;
		color: #ff6600;
	}


	tr.menubar { /* the background of a menubar */
		background-color: #a0b8c8;
	}

	/* list tables */
	.listtoptitle { /*use on before the table starts.  see gradableslistshowf.cfm
	for a sample */
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:11pt;
		font-weight:bold;
		color: teal;
	}

	a.listtableheadingon, a.listtableheadingon:visited {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 12px;
		color: #333333;
		font-weight:normal;
	}

	a.listtableheadingon:hover {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 12px;
		color: black;
		font-weight:normal;
	}

	a.listtableheadingoff,  a.listtableheadingoff:visited {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 12px;
		color: #666;
		font-weight:normal;
	}

	a.listtableheadingoff:hover {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size: 12px;
		color: black;
		font-weight:normal;
	}

	.msglisttableheading {  /* table heading */
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:normal;
		background-color:#fee;
		background-image:url(/images/backgrounds/curve1.jpg);
		color: #111;
		/*zzborder-width: 1px 0px 1px 1px;
		zzborder-color: #fcc;
		zzborder-style: solid;
		*/
	}
	
	.msglistcontainer_forum {
		background-color: #ffcccc;
	}

	.msglistcontainer_email {
		background-color: #55ddee;
	}


	/* Begin: New listtable naming */
	.listtable.heading {
		text-align:left;
		/* background: url(/images/backgrounds/shade_silverwhite_vert_60.jpg) repeat-x; << Remove */
		color: #333333;
	  	
	  	/* TH 2023-01-11 (trunk, issue 882.4): UI changes*/
		background-color: whitesmoke;
		border: 1px solid #eee;
	  
	}	

	.listtable.large {
		padding: 2px 5px 2px 5px;
	}
	/* End: New listtable naming */

	.listtableheading {  /* table heading */
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		/* TH 2022-05-05 (b402, issue 849): Change css of the table heading */
		font-size:10pt;
		font-weight:normal;
		/*
		background-image: url(../images/pixels/pixelvertshadowblue.gif);
		background-color: #cceeff; #3399ff; /*#d1e9e9; #ffcc33; #ffcc66; #004400;*/
		background:whitesmoke;
		color: #333333;/*#575757;*/
		border-bottom: 1px solid silver;
	}
	
	.listtableheadingr {  /* table heading */
		text-align:right;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:normal;
		/*
		background-image: url(../images/pixels/pixelvertshadowblue.gif);
		background-color: #cceeff; #3399ff; /*#d1e9e9; #ffcc33; #ffcc66; #004400;*/
		background:url(/images/backgrounds/shade_silverwhite_vert_60.jpg) bottom repeat-x;
		color: #333333; /*#575757;*/
	}

	.listtableheadingc {  /* table heading */
		text-align:center;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:normal;
		/*
		background-image: url(../images/pixels/pixelvertshadowblue.gif);
		background-color: #cceeff; #3399ff; /*#d1e9e9; #ffcc33; #ffcc66; #004400;*/
		background:whitesmoke;
		color: #333333; /*#575757;*/
		border-bottom: 1px solid silver;
	}

	.listtableheading2 {  /* table heading 2 with a different color */
		background-color: #f5deb3; /*wheat*/
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #575757;
	}

	.listtableheading3 {  /* table heading 2 with a different color */
		background-color:#cccccc; /*silver*/
		background-image:url(/images/backgrounds/shade_silverwhite_vert_60.jpg); 
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #575757;
	}

	.listtableheadingsmall {  /* table heading. goes hand in hand with tr.listtableheading */
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		background-color: #d1e9e9; /*#ffcc33; #ffcc66; #004400;*/
		color: #222222;/*#575757;*/
	}

	.listtableheadingsmallr {  /* table heading. goes hand in hand with tr.listtableheading */
		text-align:right;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		background-color: #d1e9e9;  /*#ffcc33; #ffcc66; #004400;*/
		color: #222222;/*#575757;*/
	}

	.listtableheadingsmallc {  /* table heading. goes hand in hand with tr.listtableheading */
		text-align:center;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		background-color: #d1e9e9;  /*#ffcc33; #ffcc66; #004400;*/
		color: #222222;/*#575757;*/
	}

	.listsectionheading{/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #000066;
		background-color: #ccffcc;
	}

	.listsectionheading2 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #000066;
		background-color: #b0c4de; /* lightsteelblue */
	}

	.listsectionheading3 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #000066;
		background-color: #ffdab9; /*peachpuff*/
	}

	.listsectionheading4 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9px;
		font-weight:bold;
		color: #000066;
		background-color: #d8bfd8; /*thistle*/
	}



	.listsectionheadinglarge{/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:bold;
		color: #000066;
		background-color: #ccffcc;
	}

	.listsectionheadinglarge2 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:bold;
		color: #000066;
		background-color: #b0c4de; /* lightsteelblue */
	}

	.listsectionheadinglarge3 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:bold;
		color: #000066;
		background-color: #ffdab9; /*peachpuff*/
	}

	.listsectionheadinglarge4 {/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:12px;
		font-weight:bold;
		color: #000066;
		background-color: #d8bfd8; /*thistle*/
	}


	div.listsectionheadingsmall{
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8px;
		font-weight:bold;
		color: #000066;
	}

	/*	tr.listsectionheading{   section heading. goes hand in hand with div.listsectionheading
		background-color: #f5f5f5; 
	
	*/
	
	.listtablefooting {  /* table footing */
		background-color:#deb887;
		text-align:left;
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:10pt;
		font-weight:bold;
		color: black;
		font-style : italic;
	}

	.listsectionfooter{
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:8pt;
		font-weight:bold;
		color: black;
		background-color: #f5f5f5; /*whitesmoke*/  /*#006600;*/
	}


	div.listsectionbreak{/* section heading. goes hand in hand with tr.listsectionheading */
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:9pt;
		font-weight:bold;
		font-style : italic;
		color: black;
	}

	tr.listsectionbreak{/* section heading. goes hand in hand with div.listsectionheading */
		background-color: #004400;  /*#006600;*/
	}

	/* RS 2017-04-12 (b221): adding auto dark/light stripes to tables. Needed for tables with sorting */
	tr.listitemrow:nth-child(even) {
		background-color: whitesmoke;
	}

	tr.listitemrow:nth-child(odd) {
		background-color: white;
	}
	
	/* RS 2017-03-28: add highlight to all table rows */
	tr.listitemrow:hover,
	tr.listitemrowlight:hover, tr.listitemrow0:hover, tr.listitemrowno:hover, tr.listitemrowfalse:hover,
	tr.listitemrowdark:hover, tr.listitemrow1:hover, tr.listitemrowyes:hover, tr.listitemrowtrue:hover,
	table.listitem tr:hover {

		/* TH 2024-03-20 (trunk): Removed the shadow when hovering and changed it to changing the background color
		 of the row
	   box-shadow: 0px 0px 10px #777;
	   -webkit-box-shadow: 0px 0px 10px #777;
	   -moz-box-shadow: 0px 0px 10px #777; */

	   background-color: #fafafa; /* for older browsers that don't support gradient */
	}
	
	.listitemrowlight, .listitemrow0, .listitemrowno, .listitemrowfalse {  /* list row with light background.*/
		background-color: white;     /*#ffffee; light mustard */
	}

	.listitemrowdark, .listitemrow1, .listitemrowyes, .listitemrowtrue {  /* list row with dark background.*/
		
		/* RS 2022-11-16 (b418): change color */
		background-color: #fafafa;   /* #eeeedd; dark mustard */
	}

	.messagerow_forum_0 {  /* list row */
		background-color: #fff;  /*#ddf4ff ;*/
	}

	.messagerow_forum_1 {  /* list row */
		background-color: #ffe;  /*#ddf4ff ;*/
	}

	.messagerow_forum_unread {  /* list row for unreadmessages.*/
		background-color:#fef; 
	}

	.messagerow_email_0 {  /* list row */
		background-color: #fff;  /*#ddf4ff ;*/
	}

	.messagerow_email_1 {  /* list row */
		background-color: #feffff;  /*#ddf4ff ;*/
	}

	.messagerow_email_unread {  /* list row for unreadmessages.*/
		background-color:#eff; 
	}


	/*
	.listitemrow0 {   list row 
		background-color: #ffffff;
	}

	.listitemrow1 {  list row 
		background-color: #ffffee;
	}
	*/
	.listitemrow2 {  /* list row with light background.*/
		background-color:  #eeffff; /*#ffff99*/
	}

	.listitemrow3 {  /* list row with light background.*/
		background-color: #ffeeee;/*#ffcc99;*/
	}

	.managerosterheaderleft { 
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:16px; 
		color:#333333; 
		background-color:#ceffe7;	
	}

	.managerosterheadersmallleft {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		font-size:11px; 
		color:#333333; 
		background-color:#ceffe7;	
	}

	.managerosterheaderright {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		 font-size:16px; 
		 color:#333333; 
		 background-color:#c1ebff;
	}

	.managerosterheadersmallright {
		/*font-family: verdana, arial, helvetica, sans-serif;*/
		 font-size:11px; 
		 color:#333333; 
		 background-color:#c1ebff;
	}

	.managerosterleftlight {
		background-color: #fbfffb;	
	}

	.managerosterleftdark {
		background-color: #f0fff0;	
	}

	.managerosterrightlight {
		background-color: #f7ffff;	
	}

	.managerosterrightdark {
		background-color: #f0faff;	
	}


	tr.inforow {  /* list row with dark background.*/
		background-color: whitesmoke   /* #eeeedd; dark mustard */
	}


	/* RS 2017-04-12 (b221): consolidate classes for font size */
	.listitem, .listitemr, .listitemc, a.listitem,
	.msglistitem, .msglistitemr, .msglistitemc, 
	.listitembold, .listitemboldr, .listitemboldc {
		font-size:1.2em;  /* 8pt; */
	}


	.listitemr {
		text-align:  right;
	}

	.listitemc {
		text-align:  center;
	}

	.msglistitemr {
		text-align:  right;
		/*zzborder-width: 0px 0px 1px 1px;
		zzborder-color: #fcc;
		zzborder-style: solid;
		*/
	}

	.msglistitemc {
		text-align:  center;
		/*zzborder-width: 0px 0px 1px 1px;
		zzborder-color: #fcc;
		zzborder-style: solid;
		*/
	}

	.listitembold {
		font-weight:bold;
	}

	.listitemboldr {
		text-align:  right;
		font-weight:bold;
	}

	.listitemboldc {
		text-align:  center;
		font-weight:bold;
	}

		/* end: show list pages */


		/* begin: form elements */

	.normall {
		text-align:  left;
		font-size:9pt;
		font-weight: normal;
	}

	.normalr {
		text-align:  right;
		font-size:9pt;
		font-weight: normal;
	}

	.normalc {
		text-align:  center;
		font-size:9pt;
		font-weight: normal;
	}

	.required {
		color:#cc3333;
	}
	
	.requiredbold {
		color: #cc3333;
		font-weight:bold;
	}


	/* RS 2020-03-30 (trunk): Consolidate and reorganize labels */

	/* Label alignments */
	.labelrequiredl, .labelrequired,
	.labelsmalll, .labelsmall,
	.labell, .label {
		text-align:left;
	}

	.labelrequiredc,
	.labelsmallc,
	.labelc{
		text-align:center;
	}

	.labelrequiredr,
	.labelsmallr,
	.labelr {
		text-align:  right;
	}

	/* Label font sizes */
	.labelrequiredl, .labelrequired,
	.labelrequiredc,
	.labelrequiredr,
	.labell, .label,
	.labelc, 
	.labelr {
		
		/*TH 2022-11-14 (Issue 878, b418): Change to same font-size as bootstrap label */
		font-size:11pt;
	}


	.labelsmallrequiredl, .labelsmallrequired,
	.labelsmallrequiredc,
	.labelsmallrequiredr,
	.labelsmalll, .labelsmall,
	.labelsmallc,
	.labelsmallr {
		font-size: 9pt;
	}

	/* Label colors */
	.labell, .label,
	.labelc, 
	.labelr,
	.labelsmalll, .labelsmall,
	.labelsmallc,
	.labelsmallr {
		
		/* RS 2022-11-16 (b418): Change to #333. */
		color: #333;
	}


	/* required Label colors */
	.labelsmallrequiredl, .labelsmallrequired,
	.labelsmallrequiredc,
	.labelsmallrequiredr,
	.labelrequiredl, .labelrequired,
	.labelrequiredc,
	.labelrequiredr {
		color: #cc3333;

	}


	div.checkbox {
		text-align:  left;
		font-size:8pt;
		font-weight: bold;
	}


	.example {

		/* TH 2018-04-04 (b248, issue 560): CHange the color of the dashed border so it's more noticable */
		border: 1px dashed #ddd;
		background-color:#ffe;
		font-size: .8em;
		padding: 3px;
	}


	.labelexample {
		text-align:left;
		font-size:8pt;
		/*background-color: #ffffee;*/
	}

	.balloon {
		text-align:left;
		font-size:10px;
		color: #555555;
		background-color: white;
		
		/* TH 2022-06-15 (b407, issue 855): Added padding and border to balloon */
		padding:5px;
		border: 1px solid #aaa;
	}

	/* TH 2022-06-15 (b407, issue 855): Added shadow class for balloon */
	.balloon.shadow {
		box-shadow: 3px 3px 5px silver;
	}

	table.balloon td {
		font-size: 0px; /*used for balloon borders to make sure they are not thickened */
	}


	table.balloon td.content {
		font-size: 8pt;
	}

	/* TH 2022-06-15 (b407, issue 855): Added align right and align center for nested div */
	.div-align-center {margin: auto;}
	.div-align-right {margin-left: auto; margin-right: 0;}

	div.directions {
		text-align:	left;
		font-size:	9pt;
		text-indent: 15px;
		background-color: #ffffee;
	}

	div.radio {
		text-align:		left;
		font-size:	9pt;
		font-weight:	bold;
	}

		/* end: form elements */

	div.headingc
	{
		text-align:			center;
		font-size:			12pt;
		font-weight: 		bold;
	}

	div.headingl
	{
		text-align:			left;
		font-size:			12pt;
		font-weight: 		bold;
	}

	.sitetitle{
		text-align:left;
		font-size:12pt;
		font-weight:bold;
		color: black;
	}

	/*	RS 2022-11-18 (b418, UI): added for page title icons */
	.pageiconcontainer {
	}

	/*	RS 2022-11-18 (b418, UI): added for page title  */
	.pagetitlecontainer {
	}

	/*	RS 2022-11-18 (b418, UI): removed "table" to convert table to div */
	.pagetitleframe {
		/* TH 2024-07-30 (b452, issue 930): Remove the border
		border-color: white;
		border-style: solid; */
		
		/* TH 2024-07-30 (b452, issue 930): Added border right */
		border-right: 1px solid silver;
	}

	/*	RS 2022-11-18 (b418, UI): removed "table" to convert table to div */
	.pagetitlebox {
		border-bottom: 1px solid silver;
		/* TH 2024-07-30 (b452, issue 930): Removed margin
		margin-bottom: 14px;*/  /* RS 2021-06-08 (b368) */

		/*	RS 2022-11-18 (b418, UI): added "table" bgcolor here */
		/* TH 2024-07-30 (b452, issue 930): Changed background color */
		background:whitesmoke;

		/*	RS 2022-11-18 (b418, UI): added this to keep floating div inside, or the border goes above page title */
		display: flex;
	}
	
	/* RS 2020-03-23 (Trunk, UI): Consolidate the two h1 classes (see next class) */
	h1.pagetitlewide{			
		letter-spacing: 2px;
	}

	/* RS 2020-03-23 (Trunk, UI): Consolidate the two h1 classes also remove size and change color */
	h1.pagetitlewide, h1.pagetitle{
		text-align:left;
		font-size:13pt;
		color: #555;
		font-weight:normal;
		/*adjust space around the text and override default margin and padding */

		/* RS 2022-11-19 (b418, UI): after converting table to div, set left/right margin to 10px to keep the
			text closer to icon */
		margin: 10px;
		/*padding: 0px 0px 0px 0px;*/
	}

	/* RS 2020-03-23 (Trunk, UI): remove size and weight an add spacing */
	h2.pagesubtitle{ /* seo-friendly */
		text-align:left;
 		letter-spacing: 2px;
		font-size:11pt;
		font-weight:normal;
		color:#0099ff;
		/*adjust space around the text and override default margin and padding */
		/* RS 2022-11-19 (b418, UI): after converting table to div, set left/right margin to 10px to keep the
			text closer to icon */
		margin: 5px 10px 10px 10px;
		padding: 0px 0px 0px 0px;
	}

	.pagesidetitle {
		text-align:right;
		font-size:12px;
		font-weight:bold;
		color:#999;
		letter-spacing: 1px;
	}
	
	/*span.label {
		background-color:#ffffe1;
		text-align:  right;
		color:    red;
		font-weight: bold;
		border:medium;
	}

	span.input {
		background-color:#ffffee;
		text-align:left;
		color:    blue;
		text-align:   left;
	}
	*/

	span.smallfont
	{
		font-size:					9pt;
		font-weight:				bold;
	}

	basefont {
		font-size: 9pt;
	}


		/* begin: inline menu bars */

	.menutitle {  /* used for button bar title */
		font-size: 10px;
		font-weight: bold;
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
	}

	/* div.menuitem{
		font-family: sans-serif;
		font-size: 9pt;
		font-weight: bold;
		color: white;
		position: relative;
		top: 0;
		left: 0;
	don't use borders anywhere on a page...  netscape will extend the height of the item
		border: 1px;
		border-style: outset outset outset outset;
		border-color : white;
	}

	div.menuitem {
		font-size: 9pt;
		color: white;
		background-color: #006600;
	}
	*/

	/* used in ctbutton */
	a.menuitem, a.menuitem.visited {
		font-size: 9pt;
		/*border-style: outset outset outset outset;*/
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
		text-decoration: none;
		background-color: white; 
		padding-right:2px; 
		padding-left:2px; 
		border:solid 1px silver;
	}

	/* disabled version of a.menuitemplain */
	.menuitem_disabled {
		font-size: 9pt;
		/*border-style: outset outset outset outset;*/
		color: silver;
		text-decoration: none;
		background-color: white; 
		padding-right:2px; 
		padding-left:2px; 
		border:solid 1px silver;
	}
	
	a.menuitem:hover {
		font-size: 9pt;
		/*border-style: outset outset outset outset;*/
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link_hover); /*orange dark */
		text-decoration: none;
		background-color: white; 
		padding-right:2px; 
		padding-left:2px; 
		border:solid 1px #ff8833; /*orange light */
	}

	a.menuitemplain, a.menuitemplain:visited {
		font-size: 8pt;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
		background-color : white;
		text-decoration: none;
		border:solid silver;
		border-width: 0px 0px 0px 0px;
	}
	
	a.menuitemplain:hover {
		font-size: 8pt;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
		background-color : white;
		text-decoration: none;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		border:solid var(--rs_link); /* steelblue */
		border-width: 0px 0px 1px 0px;
	}
	
	/* disabled version of a.menuitemplain */
	.menuitemplain_disabled {
		font-size: 8pt;
		color: silver;
		background-color : white;
		text-decoration: none;
	}

	
	

	

	/* items in a list such as message thread */
	a.itemselected {
		font-size: 8pt;
		color: #ff3300; /*orange*/
		text-decoration: none;
		font-weight: normal;
	}

	a.itemoff {
		font-size: 8pt;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */	
	}

	a.itemoff:hover {
		font-size: 8pt;
		color: #ff6600;	
	}





	.menuitemplain {
		font-size: 8pt;
		color: blue;
		background-color : white;
		text-decoration: none;
	}

	
		/* note: don't assign a background color here.  netscape will get confused. */
	.menuitemoff {
		font-size: 9pt;
		color: white;
		position: relative;
		top: 0;
		left: 0;
		/* don't use borders anywhere on a page... netscape will extend the height of the item border: 1px;
		border-style: outset outset outset outset;
		border-color : white;
	*/
	}


	.menuitemon {
		font-size: 9pt;
		color: white;
	/*  don't use borders anywhere on a page...  netscape will extend the height of the item
		border: 1px;
		border-style:  solid solid solid solid;
	*/
	}

	.menuitemselected {
		font-size: 9pt;
		color: white;
		/*      position: relative;
		top: 0;
		left: 0;
	*/
	/*  don't use borders anywhere on a page...  netscape will extend the height of the item
		border: 1px;
		border-style:  inset inset inset inset;
	*/
	}

	/* obsolete 
	table.menuitembordercolor {  
		background-color: #006699; 
	}

	table.menuitembordercolorplain {
		background-color: silver;
	}
	*/
	
	td.menuitemselected {  /*see also jsfactmenu.js */
		background-color: #004400;
	}


	/*
	td.menuitemoff {   
		background-color: #0099cc;
	}
	*/
	

	/* end: inline menu bars */

	
	/* used in schoolpicker to select city initials */
	.threedbutton {
		margin:1px; 
		width:15px; 
		border:1px solid #eee; 
		background-image:url(/images/backgrounds/shade_silverwhite_vert_60.jpg); 
		text-decoration:none;
	}

	.threedbuttonselected {
		margin:1px; 
		width:15px; 
		border:1px solid #ffcc00; 
		background-image:none; 
		text-decoration:none;
		color: #ff6600;
	}
	

	div.listing
	{
		text-align:		left;
		font-size:		9pt;
	}

	.warning, .warningnormal
	{
		font-size:		9pt;
		color: #660033
	}

	.warningbig
	{
		font-size:		11pt;
		font-weight:	bold;
		color: #660033
	}

	.warningmessage	{
		font-size:			9pt;
		color: #660033
	}

	.help			{
		font-size: 9pt;
		text-indent:		0.0in;
	}
	body.help			{
		background-color:		#ffffec;
	}

	textarea.normal
	{
		font-size:			9pt;
	}


	/*  begin: popup menu */
	.popupmenucontainer { 
		border: 1px solid silver;
		background-color:#f8f8f8;
	}
	
	.popupmenutitlebar {
		text-align: right;
		background-color:silver;
	}

	.popupmenuitem {
		font-size:8pt;
		padding: 2px;
	}

	.popupmenuitemdisabled {
		color:#777777;
	}
	
	a.popupmenuitem {
		color: black;
		text-decoration: none;
	}
	
	

	/*  end: popup menu */
	

	/* begin calendar */
	.calendartableheading {  /* table heading */
		text-align:left;
		font-size:11px;
		font-weight:bold;
		/*background-image: url(../images/pixels/pixelvertshadowblue.gif);*/
		background-color: #cceeff; /*#3399ff; /*#d1e9e9; #ffcc33; #ffcc66; #004400;*/
		color: #555555;/*#575757;*/
	}

	.calendarrow{
		background-color: #ffffff;
	}

	.calendarrowday{
		background-color: #ffffff;
	}

	.calendarrownight{
		background-color: #eeeeee;
	}


	.calendarleftheading{
		font-size:11px;
		font-weight:bold;
		background-color: #fefefe;
	}

	.calendarleftheadingc{
		font-size:11px;
		font-weight:bold;
		background-color: #fefefe;
		text-align:center;
	}

	a.calendarleftheading{
		font-size:11px;
		font-weight:bold;
		color: #555555;
	}

	div.calendardatenum{
		
		/* RS 2022-11-16 (b418): change color from blue to gray */
		border: solid #bbb;   /*#b4d0dc;*/
		border-width : 1px 1px 1px 1px;
		width:15px;
		height:15px;
		font-size:8pt;
		text-align: center;
		background-color: #ffffcc;
	}

	a.calendardatenum {
		text-decoration: none;
	}

	div.calendardatenumtoday{
		border: solid #0099ff;
		border-width : 1px 1px 1px 1px;
		width:15px;
		height:15px;
		font-size:8pt;
		text-align: center;
		background-color:#64b1ff;
	}

	a.calendardatenumtoday {
		font-weight: bold;
		color: white;
		text-decoration: none;
	}

	.calendarlistitemlight {
		font-size:8pt;
		background-color: #ffffff;
	}

	.calendarlistitemdark {
		font-size:8pt;
		background-color: #ffffee;
	}

	.calendarlistitemoff {
		font-size:8pt;
		background-color: #eeeeee;
	}

	.calendaritemdue, 
	.calendaritemdue0, /* normal priority */
	a.calendaritemdue0  {
		font-size:11px;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
	}

	.calendaritemdue, 
	.calendaritemdue1, /* high priority */
	a.calendaritemdue1  {
		font-size:11px;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link_hover);
	}

	.calendaritemtime, a.calendaritemtime  {
		font-size:11px;
		color: #222222;
	}

	.calendaritemstart, a.calendaritemstart  {
		font-size:10px;
		color: #808080; /*gray*/
	}
	.calendardateselector {
		width:auto;
		font-weight:bold;
		font-size:10pt;
		color: #006699;
	}
	
	.classfinderday0 { /*classfinder day off */
		font-size:10px;
		color: #ddd;
		background-color: white;
		border-bottom: 3px double #ddd;
		width: 11px;
		text-align:center;
	}
	.classfinderday1 { /*classfinder day on */
		font-size:10px;
		color: black;
		background-color: white;
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		border-bottom: 3px solid var(--rs_link); /* steelblue */
		width: 11px;
		text-align:center;
	}
	
	/* end calendar */


	/* used in ctbutton */
	/* RS 2022-11-16 (b418): added section to consolidate */
	.rsbuttoncontainer, .rsbuttonplaincontainer {  /* container for a single button and its image */
		/* background-color: white; 
		border:solid silver; */
		margin: 2px;  /* RS 2022-11-16 (b418): increased to sparate from other items */
		white-space: nowrap;  /* fixing for IE: don't wrap buttons */

		/* RS 2022-11-16 (b418): added */
		display:inline-block; 	/* needed for places that buttons are cut off (classeditf.cfm in class schedule) */
		padding: 2px;			/* add some whitespace*/
		border-radius: 3px;		
		font-size: .9rem;
	}
		/* RS 2022-11-16 (b418): removed span and moved most styles to consoliate below */
	.rsbuttoncontainer {  /* container for a single button and its image */
		/*background-color: white; */
		/*padding-right:2px; 
		padding-left:2px; */
		/*border:solid silver;*/
		background-color: white; 
		border:solid silver;
		border-width: 1px 1px 1px 1px;
		/*margin: 1px; */
		/*white-space: nowrap;*/  /* fixing for IE: don't wrap buttons */
	}

	/* RS 2022-11-16 (b418): removed span and moved most styles to consoliate below */
	.rsbuttonplaincontainer {  /* container for a single plain button and its image */
		/*! background-color : white; */
		/*! border:solid silver; */
		border-width: 0px 0px 1px 0px;
		/* margin: 2px;	*//*separate the buttons so they don't look like a single contiguous button */
		/*white-space: nowrap;*/  /* fixing for IE: don't wrap buttons */
	}

	/* disabled version of a.rsbuttonplain */
	.rsbutton_disabled {
		/* RS 2022-11-16 (b418): removed to get container font
		font-size: 9pt;*/
		/*border-style: outset outset outset outset;*/
		color: silver;
		text-decoration: none;
		/*background-color: white; */
		/*padding-right:2px; 
		padding-left:2px; */
		/*border:solid 1px silver;*/
	}
	
	/* TH 2022-03-23 (b401, issue 842-2): Added class for button selected */
	.rsbutton_selected {
		color: white !important;
		background-color: gray !important;
	}

	a.rsbutton, a.rsbutton.visited {
		/* RS 2022-11-16 (b418): moved to rsbuttoncontainer class
		font-size: 9pt;*/

		/*border-style: outset outset outset outset;*/
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
		text-decoration: none;
		/*background-color: white; */
		/*padding-right:2px; 
		padding-left:2px; */
	}

	a.rsbutton:hover {
		/* RS 2022-11-16 (b418): moved to rsbuttoncontainer class
		font-size: 9pt;*/

		/*border-style: outset outset outset outset;*/
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link_hover); /*orange dark */
		text-decoration: none;
		/*background-color: white; */
		/*padding-right:2px; 
		padding-left:2px; */
		/*border:solid 1px #ff8833; orange light */
	}

	a.rsbuttonplain, a.rsbuttonplain:visited {
		/*font-size: 8pt; */
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		color: var(--rs_link); /* steelblue */
		/*background-color: white; */
		text-decoration: none;
		/*border:solid silver;
		border-width: 0px 0px 1px 0px;*/
	}
	
	a.rsbuttonplain:hover {
		/*font-size: 8pt; */

		/* TH 2020-5-29 (b332, issue 722-38): Add !important so it doesnt get override by bootstrap*/
		color: #f63 !important;
		/* background-color: #4682b4;*/ /* steelblue */

		/* TH 2020-5-29 (b332, issue 722-38): Add !important so it doesnt get override by bootstrap*/
		/* text-decoration: none !important;
		border:solid #f83;
		border-width: 0px 0px 2px 0px; */
	}
	
	/* disabled version of a.rsbuttonplain */
	.rsbuttonplain_disabled {
		/* font-size: 8pt; */
		color: silver;
		background-color : white;
		text-decoration: none;
	}


	.rsbuttonplain {
		/*font-size: 8pt; */
		color: blue;
		/*background-color: white; */
		text-decoration: none;
	}
	
	span.rsbuttontabcontainer {  /* container for a single button and its image */
		margin: 1px;
	}

	td.rsbuttontab { 
		background-image:url(/images/borders/roundedheadergrygradient/images/top.gif);
		text-align:center;
		vertical-align:bottom;
		padding: 0px 0px 3px 0px;  /*make text display 3px from the bottom of tab */
	}	

	a.rsbuttontab, a.rsbuttontab:visited, a.rsbuttontab:link  { 
		/* font-family: "trebuchet ms", verdana, arial, helvetica, sans-serif;*/
		font-size:14px;
		text-decoration:none;
		margin: 0px 5px 0px 5px;
		color:#444;
	}
	
	a.rsbuttontab:hover {
		text-decoration:underline;
		color:#000;
	}
	
	/* end: rsbuttons */
	
	.termplanneron {
		font-size: 8pt;
		text-align:  center;
		background-color:#ffffcc;
		border: 1px solid #ccc;
	}

	.termplannerconflict {
		font-size: 8pt;
		text-align:  center;
		background-color: #ff0066;
		border: 1px solid #ccc;
	}


	/* begin: quick post */
	td.quickpost_title {
		text-align:center;
		font-size:8pt;
		
		
		/* TH 2020-02-19 (b351, issue 778): Removed the bold font
		font-weight:bold;*/
		color:#555;
	}

	table.quickpost_title, tr.quickpost_title {
		/* TH 2020-02-19 (b351, issue 778): Removed the background color on the qp title
		background: #f5f5f5 url("/images/backgrounds/shade_silverwhite_vert_60.jpg");*/
		border-bottom: 1px solid #ccc;
	}

	/* TH 2024-07-11 (b399, issue 929): css fior the quick post title */
	.card-header.quickpost_title {
		display:flex;
		padding:0.75rem !important;
	}

	.quickpost_topic {
		text-align:left;
		font-size:12px;
		font-weight:bold;
		color: #333;
		background-color:#eee;
		text-decoration:none;
		border-bottom: 1px dashed silver;
		padding: 10px 5px 10px 5px;
	}

	.quickpost_nick {
		text-align:left;
		
		/* TH 2020-02-19 (b351, issue 778): Larger font size */
		font-size:11pt;
		font-weight:bold;
		color: #006699;
		text-decoration:none;
	}

	.quickpost_msg {
		text-align:left;
		
		/* TH 2020-02-19 (b351, issue 778): Larger font size */
		font-size:11pt;
		font-weight:normal;
		color: #333;
		white-space: normal;  /*RS 2013-03-24: block nowrap from containing TD */
	}
	
	/* TH 2020-02-19 (b351, issue 778): New classes for the qp flags and the toggle */
	.quickpost_flag {
		display:inline-block; 
		width: 16px;
		margin-right: 1em;
	}
	
	.quickpost_flag_toggle {
		font-size: 1.5em;
		cursor: pointer;
	}

	.quickpost_bg0 {
		background-color:#f5f5f5;	
	}

	.quickpost_bg1 {
		background-color:#fff;
	}

	/* end: quick post */		
	
	/* begin: toolbar */
	.toolbarcontainer {
		background-color:#aaa;
		background-image:url(/images/backgrounds/shade_silverwhite_vert_60.jpg);
		border: 1px solid #777;
		color: #333;
		text-align:center;
	}

	td.toolbarbutton {
		border:1px solid #aaa;
		background-color:#eeefef; 
		text-align:center;
	}	

	a.toolbarbutton {
		font-size:9px;
		text-decoration:none;
		color: #555;
	}	
	/* end: toolbar */
	
	/* site builder toolbar */
	div.sitebuilderbutton {
		position:absolute; 
		
		/* TH 2024-07-30 (b452, issue 930): Increase the z-index so that it go above the menu */
		z-index: 99; 
		/*border:1px solid green;*/

		/* add transparency */
		/* doesn't work with ie, makes button dissappear
		filter:alpha(opacity=70);   	/* ie * /
		-moz-opacity:0.7;		/* netscape* /
		-khtml-opacity: 0.7;		/* older safari * /
		opacity: 0.7;			/* most common: firefox, safari, opera * /
		*/
	}
	
	img.sitebuilderbutton {
		position:relative;   /*needed by ns or the image gets cut off*/
	}

	a.sitebuilderbutton, a.sitebuilderbutton:visited {
		/*position:relative; 
		top=-12px;
		left=0px;*/
		text-decoration:none;
		padding: 0px;
		font-size:9px; 
		color:#fff; 
		
		/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
		background-color:var(--rs_link_hover);
		border: 1px ridge #ccc;
	}
	
	a.sitebuilderbutton:hover {
		color: #fff;
		font-size: 15px;
	}

	/* end: site builder toolbar */
	
	sup.cents {
		font-size: 70%;
	}
	
	/* begin rubric */
	
	/* RS 2022-11-16 (b418, UI): added for subjective score input box */
	input.rubrow_subjectivescoreinput {
		width: 90%;
		font-size: 1.6rem !important; 
		margin-bottom:0.5em;
	}

	/* RS 2020-12-01 (b353, issue 763): Added section for rubric feeback area. */
	.rubfeedbackplusview-title {
		font-size:1.1em;
		font-weight:bold;
		border: 3px solid silver;
		padding:5px;
		background-color:#eee;
	}
	
	.rubfeedbackplusview-body {
		border-style:solid;
		border-color:silver;
		border-width: 0 3px 3px 3px;
		position:relative; 
		top:-3px;
		padding:5px 5px 5px 50px;
		background-color:white;
	}

	.rubfeedbackplusview-body-elm {
		border-top: 1px solid #ddd; 
		margin-top:5px;
	}

	.rubfeedbackplusview-author {
		margin-left:5em; 
		font-style:italic;
	}
	/* RS 2020-12-01 (b353, issue 763): end Add. */
	
	/* TH 2020-12-01 (b353, issue 763): Added. Css class for the score of aggregated report */
	.rubrow-criteriascore {
		text-align:right;
		background: #eee;
		padding: 5px;
		margin-top: 10px;
		font-size: 1.3em;
	}

	.rubrow0	{  /* criteria left column cell in edit */
		padding: 6px;
	 	padding-left: 25px;
	 	background-color: #fff; 
	}

	.rubrow0show {  /* criteria ??? */
		padding: 6px;
	 	padding-left: 25px;
	 	background-color:blue; 
	}
	
	.rubrow0col 	{  /* criteria cell in edit */
	 cursor:pointer;
	 background-color:#fff; 
	 padding: 6px;
	 
	}

	.rubrow0colshow  {  /* dark criteria cell in preview*/
	 cursor:pointer;
	 background-color:#fefefe; 
	 padding: 6px;
	 
		/* RS 2015-03-24 (b173, issue 519) */
		/* TH 2024-03-14 (trunk, issue 918): Remove the border
		border: 1px solid #C0C0C0;
		border-width: 0 1px 1px 0; */
	}


	.rubrow0lightcol {  /* criteria ??? */
	 cursor:pointer;
	 background-color:red; padding: 6px;
	
	}

	.rubrow0lightcolshow  {  /* light criteria cell in preview */
	 cursor:pointer;
	 background-color:#ffffff; 
	 padding: 6px;

		/* RS 2015-03-24 (b173, issue 519) */
		/* TH 2024-03-14 (trunk, issue 918): Remove the border
		border: 1px solid #C0C0C0;
		border-width: 0 1px 1px 0; */
	}

	.rubrow0colover  {  /* criteria grader mouse over */
	 cursor:pointer;
	 background-color:#ffffdf; 
	 padding: 6px;
	 
	}

	/* TH 2024-03-07 (b454, issue 918-6): Add a background color to the rubric */
	table.rubric {
		background-color: #bbb;
	}
	
	/* RS 2015-03-24 (b173, issue 519): added. criteria title cells */
	table.rubric > tbody > tr > td:first-child {
		
		/* TH 2024-03-07 (b454, issue 918-6): Change the background color of the section */
		background-color: #fcfcfc;  /* RS 2020-07-26 (trunk): lighten the color to white */

		/* TH 2024-03-07 (b454, issue 918-6): Remove the border of the matrix
		border-width: 1px 1px 1px 1px; */
	}
	
	/* TH 2022-03-28 (b367, issue 843): Added. css for the rubricmap-cell */
	table.rubric > tbody > tr > td.rubricmap-cell {
		border-width: 1px 1px 1px 1px;
	}

	/* RS 2015-03-24 (b173, issue 519): added rubric header cell 
	table.rubric > tbody > tr:first-child > td {
		font-size: 2em;
	 	border-radius: 8px;
		-moz-border-radius: 8px;
	}
	*/

	table.rubric textarea.rubcomment {
		height:100px; 
		width:150px;
		float: left;  /* float so the feedback plus and attachment buttons show next to it */
	}

	
	/* RS 2015-03-24 (b173, issue 519): added. subrubric title */ 
	table.rubric td.rubrow2colshowhead .rubtitle,
	table.rubric td.mtxrow2colshowhead .rubtitle,

	/*KP 2014-11-17: Add another case for div format */
	div.rubrow2showhead span.rubtitle,
	
	/* TH 2024-07-11 (b399, issue 929): Add matrix class */
	div.mtxrow2colshowhead span.rubtitle {
		
		/* TH 2021-12-22 (b389, issue 829-WL5): Make the subrubric title bigger */
		font-size: 1.7em;
		color: white;
	}
	
	/* TH 2024-07-11 (b399, issue 929): Add padding */
	div.rubrow2showhead span.rubtitle,
	div.mtxrow2colshowhead span.rubtitle {
		padding-left: 10px;
	}

	/* TH 2024-03-28 (trunk, UI): Added. Fix the rubric/matrix header css, give it a white font and add some spacing between
	 the title and the description */
	table.rubric td.mtxrow2colshowhead .cell-desc,
	table.rubric td.rubrow2colshowhead .cell-desc{
		color:white;
		margin-top:10px;
		display:block;
	}

	/* RS 2015-03-24 (b173, issue 519): added. section title */ 
	table.rubric td.rubrow1colshowhead .rubtitle,
	table.rubric td.mtxrow1colshowhead .rubtitle,

	/*KP 2014-11-17: Add another case for div format */
	div.rubrow1showhead span.rubtitle,
	
	/* TH 2024-07-11 (b399, issue 929): Add matrix class */
	div.mtxrow1colshowhead span.rubtitle {
		
		/* TH 2021-12-22 (b389, issue 829-WL5): Make the divider title bigger */
		font-size: 1.5em;
		color: #333;
	}


	/* beign: rubric grade */
	table.rubric td.rubcellselected,

	/*KP 2014-11-17: Add another case for div format */
	div.rubcellselected {  /*selected/graded cell*/
		background-color:#2499ff;  /* RS 2018-03-08 (b237, UI) */
		color:white;

		/* TH 2024-03-14 (trunk, issue 918): Removed. Moved into rub-cell css 
		padding: 6px;
		border-radius: 5px;

		/* TH 2019-06-07 (b292, issue 641): Added pointer when cursor go over the rubric cell
		 indicate that user can click on the cell */
		cursor:pointer;
		*/
	}

	table.rubric td.rubcellunselected,

	/*KP 2014-11-17: Add another case for div format */
	div.rubcellunselected {  /*unselected/not graded cell*/
		background-color:#fff;
		color:steelblue;

		/* TH 2024-03-14 (trunk, issue 918): Removed, moved into rub-cell css
		padding: 6px;
		/ * RS 2015-03-24 (b173, issue 519): added. round rubric cell corners * / 
		
		border-radius: 5px; 

		/ * TH 2019-06-07 (b292, issue 641): Added pointer when cursor go over the rubric cell
		 indicate that user can click on the cell * /
		cursor:pointer;
		*/
	}

	/* ES 2015-09-03 (Issue 250, b139): css style for self assessment scores applied to each table cell */
	table.rubric td.rubselfcellselected,

	/*KP 2014-11-17: Add another case for div format */
	div.rubselfcellselected {  /*selected/graded cell*/
		background-color:#F09900;
		color:white;
		padding: 6px;

		/* TH 2019-06-07 (b292, issue 641): Added pointer when cursor go over the rubric cell
		 indicate that user can click on the cell */
		cursor:pointer;
	}

	/* TH 2024-01-19 (b446, issue Issue 912): Selected cell class for 100% aggreement cell
	 that are suggested to moderator */
	/* TH 2024-01-31 (trunk): Change the of the class so that it is easier to understand, 
	 change the background color*/
	table.rubric td.confidence_high,
	div.confidence_high { 
		background-color:#117864;
		color:white;
		padding: 6px;
		cursor:pointer;
	}

	/* TH 2024-01-19 (b446, issue Issue 912): Selected cell class for partial aggreement cell
	 that are suggested to moderator */
	/* TH 2024-01-31 (trunk): Change the of the class so that it is easier to understand, 
	 change the background color*/
	table.rubric td.confidence_moderate,
	div.confidence_moderate {  /*selected/graded cell*/
		background-color:#6fa23b;
		color:white;
		padding: 6px;
		cursor:pointer;
	}

	/* TH 2024-01-31 (trunk): Added class for low level of confidence */
	 table.rubric td.confidence_low,
	 div.confidence_low {  /*selected/graded cell*/
		 background-color:#1cbd9e;
		 color:white;
		 padding: 6px;
		 cursor:pointer;
	 }
	
	/* TH 2024-01-31 (trunk): Added class */
	.selected_by {
		text-transform: capitalize;
	}
	
	/* RS 2018-01-06 (Issue 250, b139): css style for self assessment scores when viewed by evaluator */
	table.rubric td.rubselfcellselmixview,

	/*KP 2014-11-17: Add another case for div format */
	div.rubselfcellselmixview {  
		border: 3px solid lightcoral !important;	/* RS 2018-03-08 (b237, UI) */
		border-radius: 5px;				/* RS 2018-03-08 (b237, UI): reduce rounded corners */
	}

	/*TH 2018-01-09 (b246): css style for the buttons (attachment and feedbackplus) */
	a.rubricrowbutton {
		margin: 5px;
		float: left;
		padding : 3px;
	}

	/*TH 2018-01-09 (b246): change font awesome icon-size */
	a.rubricrowbutton i {
		font-size: 1.7em;
	}

	/*TH 2018-01-09 (b246): css style for the number on the file icon (represent the numbers of files attached) */
	a.rubricrowbutton strong {
		font-family: verdana, arial, helvetica, sans-serif;
		font-size: 8pt;
		color:palevioletred;
	}

	/*TH 2018-01-09 (b246): css style for the check mark on the comment icon (represent that there's a commente) */
	a.rubricrowbutton i.checkmark {
		font-size: 0.8em;
	}

	/*TH 2018-01-09 (b246): css style for the icons when there's no feedback or attachment */
	a.rubricrowbutton span.highlight_false i, 
	a.rubricrowbutton span.highlight_NO i /* Has to be UPPER case NO */
	{ 
		color:#BFBFBF;
	}

	/*TH 2018-01-09 (b246): css style to hide the check marks or the number of files when there's nothing in the cell */
	a.rubricrowbutton span.highlight_false i.checkmark, 
	a.rubricrowbutton span.highlight_NO i.checkmark, /* Has to be UPPER case NO */
	a.rubricrowbutton span.highlight_false strong, 
	a.rubricrowbutton span.highlight_NO strong  /* Has to be UPPER case NO */ 
	{
		display: none;
	}


	/*TH 2018-01-09 (b246): css style for the icons when there are feedback or attachment */
	a.rubricrowbutton span.highlight_true i, 
	a.rubricrowbutton span.highlight_YES i /* Has to be UPPER case YES */ 
	{
		color: #1c94c4;
	}

	/*TH 2018-01-09 (b246): css style for the student's feedback icon*/
	/* RS 2018-03-08 (b237): renamed */
	a.rubricrowbutton i.selfassessmentcomment {	
		top: 2px;
		color: lightcoral;	/* RS 2018-03-08 (b237, UI) */
		position: relative;
	}

	/*KP 2014-11-17: subjective grading in vertical view*/
	.rub-cell-subj-grading {
		margin-left: 5px;
		clear: both;
	}

	/*KP 2014-11-12: tr specifications (full view) */
	tr.rubrow0lightcolshow  {
		font-size: 1.3em;
	}

	.rub-criteria-divider {
		margin-top: 10px;
		height: 1px;
		background-color: silver;

		/* TH 2024-07-11 (b399, issue 929): Removed
		margin-right: 5px;
		margin-left: 5px;*/
		clear: both;
	}

	.rub-cell-title {
		margin-right: 5px;
		margin-left: 5px;
	}

	/*KP 2014-11-12: Cell title section area*/
	.rub-title-col {
		background-color: #0080d5;
		color: white;
	}
	
	/*TH 2021-04-22 (b364, issue 782): New class for the title */
	.rub-cell-coltitle {
		font-size: 1.3em;
		padding-bottom: 9px;
	}

	.rub-title-row {
		background: #eee;
	}

	.rub-cell-row {

		/* ES 2015-09-25 (b154): change 'margin-top' (from 10%) to a vlaue with absolute units. Otherwise,
			in side-by-side view of vertical mode, rubric cell height changes when expanding/shrinking
			left/right panes */
		margin-top: 20px;
	}

	/* TH 2024-07-11 (b399, issue 929): Added css for the hidden cells */
	.rub-cell-row > div.rub-cell-hidden {
		min-height: 30px;
	}

	#rub-right.rub-listview .rub-cell-row div.rub-cell-moved,
	#rub-right.rub-listview .rub-cell-row div.rub-cell-hidden {
		display:none;
	}

	.rub-cell-desc-toggle {
		display: inline;
		clear: both;
		padding-top: 5px;
	}
	
	/* TH 2024-07-30 (b452, issue 930): Added. Css to add ellipses to text if 
		it's too long in the cell */
	#rub-right div.matrixcellstatus-text {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	/*TH 2021-09-01 (trunk): Added class for hidden cell in the rubric */
	.rub-cell-hidden,
	
	/* TH 2024-04-01 (b456, issue 922-1): Added class for cell moved */
	.rub-cell-moved {
		background: repeating-linear-gradient(135deg, #eee, #EAEAEA 5px, white 5px, white 10px);
		position: relative;
	}

	/* TH 2024-04-01 (b456, issue 922-1): Class for cell that are moved to cover */
	.rub-cell-moved > .jumptocell-link {
		font-style: normal;
		font-variant: normal;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		
		/* TH 2024-07-25 (b459, issue 929): Make the arrow smaller */
		font-size: 1.5rem;
		margin: auto;
		text-align: center;	
	}

	.mtxcellbox.rub-cell-moved::before {
		font-size: 12px;
	}

	.cell-desc-cont {
		padding: 0px 8px 8px 8px;
	}

	/*KP 2014-11-12: Cell criteria buttons */
	.rub-cell {
		background-color: white;
		
		/* TH 2023-12-06 (b446, issue 912): Add position relative so we can float element inside the cell
		 using absolute positioning */
		position: relative;
		
	}
	
	/* TH 2024-03-14 (trunk, issue 918): Added. Css to be applied to every criteria cell
	 of the rubric */
	table.rubric td.rub-cell,
	div.rub-cell {
		padding: 6px;

		/* TH 2024-03-14 (trunk, issue 918): Removed rounded border
		border-radius: 5px; */
	}

	.rub-cell-selected {
		background-color:#2499ff;  /* RS 2018-03-08 (b237, UI) */
		color:white;
		border-radius: 5px;
	}

	.rub-cell-selected-hover:hover {
		background-color:#003399;
		color: white;
	}

	div.rub-cell {
		float: left;
		border: 0.2em solid silver;
		border-radius: 1em;
		margin-left: 2%;
	}

	div.rub-cell-selected {
		border: 0.2em solid #354668;
	}

	.rub-cell-selected p {
		color: white;
	}

	.rub-cell-score-overlay {
		background-color: white;
		border-radius: 1em;
		background-color: #354668;
		cursor: pointer;
	}

	.rub-cell-title-score {
		float: left;
		border-top-left-radius: 1em;
		border-top-right-radius: 1em;
		margin-left: 2%;

		/* TH 2020-04-23 (b334, issue 723-4): Change rubric headers css to match table view */
		background-color: #0080d5;
		margin-top: 1.7em;
		border: 0.2em solid #0080d5;
		border-bottom: none;
		color: white;
	}

	/*KP 2014-11-12: Cell criteria weight*/
	.rub-cell-score-value {
		font-size: 1em;
		font-weight: bold;
	}

	.rub-cell-compact-title {
		font-size: 1.5em;
		padding: 8px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.rub-cell-score-title {
		font-size: 1em;
		padding: 8px 0px 0px 0px;
		font-weight: bold;
	}
	
	/* TH 2021-09-03 (trunk): Added. Button bar for grading the rubric, give user easier access to the
	 save grade button */
	/* TH 2022-01-06 (b391, issue 832): Changed to more generic names and add the fixed top css */
	.element-fixed-position {
		position: fixed;
		width: 100%;
		
		/* TH 2021-09-03 (trunk): Change background color and padding */
		/* TH 2021-09-29 (b382, issue 816): Add transparency */
		/* RS 2022-11-16 (Issue 878, b418): Changed color and transparency */
		background-color: #575757d4;
		font-size: 1.5em !important;
		z-index: 1;
		padding: 7px; 	
	}
	
	.element-position-bottom {
		bottom: 0;
		border-bottom: 3px solid white;
		/* TH 2021-09-29 (b382, issue 816): More padding, add border top */
		padding-top: 15px;
		border-top: 2px solid #ccc;
	}
	
	/* TH 2022-01-06 (b391, issue 832): add the fixed top css */
	.element-position-top {
		top: 0;
		border-top: 3px solid white;
		/* TH 2021-09-29 (b382, issue 816): More padding, add border top */
		padding-bottom: 15px;
		border-bottom: 2px solid #ccc;
	}

	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.ui-tooltip, .rs-arrow:after {
		background: white;
		border: 2px solid #aaaaaa;
	}

	.ui-tooltip {
		padding: 10px 20px;
		color: white;
		border-radius: 20px;
	}

	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.rs-arrow {
	   width: 70px;
	   height: 16px;
	   overflow: hidden;
	   position: absolute;
	   left: 50%;
	   margin-left: -35px;
	   bottom: -16px;
	}

	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.rs-arrow.top {
	  	top: -16px;
	   bottom: auto;
	}

	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.rs-arrow.left {
	   left: 20%;
	}
	  
	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.rs-arrow:after {
	   content: "";
	   position: absolute;
	   left: 20px;
	   top: -20px;
	   width: 25px;
	   height: 25px;
	   -webkit-transform: rotate(45deg);
	   -ms-transform: rotate(45deg);
	   transform: rotate(45deg);
	}

	/* 2023-01-06 (b422, issue 883): Change the name to rs-arrow to avoid conflict with bootstrap */
	.rs-arrow.top:after {
	   bottom: -20px;
	   top: auto;
	}

	.rubrow0colover  {  /* criteria grader mouse over */
	 cursor:pointer;
	 background-color:#ffffdf; 
	 padding: 6px;
	}

	.rub-criteria-title-desc {
		font-size: 1.2em;
		color: #777;
		margin-left: 5px;
	}
	
	.rub-tooltip {
		border-width: 2px 0;
		border-color: #08d008;
		background-color: #eee;
		border-style: solid;
		border-radius: 5px;
	}

	td.rubricicon {
		background-color:white;
	}
		
	a.rubcellselected:link, a.rubcellselected:visited  {
		display:block;
		width:100%; 
		text-decoration:none;
		color:#ffffff;
		height:100%;
	}

	/* ES 2015-09-03 (Issue 250, b139): *** css style for self assessment scores applied to each table cell */
	a.rubselfcellselected:link, a.rubselfcellselected:visited  {
		display:block;
		width:100%; 
		text-decoration:none;
		color:#ffffff;
		height:100%;
	}

	a.rubcellunselected:link, a.rubcellunselected:visited {
		display:block;
		width:100%;
		text-decoration:none;
		height:100%;
	}

	a.rubcellselected:hover,

	/* TH 2019-06-07 (b292, issue 641): Added addition class, needed so that when user hover over the cell 
	 it will highlight/change color */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	table.rubric.rubgrading td.rubcellselected:hover,

	/*KP 2014-11-17: Add another case for div format */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	div.rub-right.rubgrading div.rubcellselected:hover {  /*selected/graded cell*/
		background-color:#003399;
		color: white;
		
		/* TH 2024-03-14 (trunk, issue 918): Added cursor for when hovering only */
		cursor: pointer;
	}

	/* ES 2015-09-03 (Issue 250, b139): *** css style for self assessment scores applied to each table cell */
	a.rubselfcellselected:hover,

	/* TH 2019-06-07 (b292, issue 641): Added addition class, needed so that when user hover over the cell 
	 it will highlight/change color */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	table.rubric.rubgrading td.rubselfcellselected:hover,

	/*KP 2014-11-17: Add another case for div format */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	div.rub-right.rubgrading div.rubselfcellselected:hover {
		background-color:#D05500;
		color: white;
		
		/* TH 2024-03-14 (trunk, issue 918): Added cursor for when hovering only */
		cursor: pointer;
	}

	a.rubcellunselected:hover,

	/* TH 2019-06-07 (b292, issue 641): Added addition class, needed so that when user hover over the cell 
	 it will highlight/change color */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	table.rubric.rubgrading td.rubcellunselected:hover,

	/*KP 2014-11-17: Add another case for div format */
	/* TH 2024-03-14 (trunk, issue 918): Added additional css class to act as a flag to 
	 trigger the hover effect only while grading the rubric and not when viewing the score
	 or viewing the report */
	div.rub-right.rubgrading div.rubcellunselected:hover {  /*unselected/not graded cell*/
		
		/* TH 2021-09-01 (trunk): Change the rubricgrade hovering from gray to light blue*/
		background-color:LightSkyBlue;
		color:black;
		
		/* TH 2024-03-14 (trunk, issue 918): Added cursor for when hovering only */
		cursor: pointer;
	}
	/* end: rubric grade */
	

	
	.rubrow1, .rubrow1col {  /* section edit*/
	 	padding: 6px;
	 	padding-left: 15px;
		background-color:#ccc; 
	}

	.rubrow1show, .rubrow1colshow {  /* section show*/
	 	padding: 6px;
		background-color:#cad6dd; 
		
	}

	/*KP 2014-11-20: used for if section is directly after title row in vertical view*/
	div.rubrow1show {
		clear: both;
	}

	.rubrow2, .rubrow2col {  /* sub-rubric edit */
	 background-color:#354668;
	 color:white;
	 padding: 6px;
	}
	

	/*KP: 2014-11-12: Generic class for dark blue rows*/
	.rubrow2show { /* sub-rubric row show */
		background-color: #354668;
		color: white;
	}

	/*KP: 2014-11-12: tr specifications (full view) */
	tr.rubrow2show {
		padding-left: 5px;
	}

	/*KP: 2014-11-12: div specifications (vert view) */
	div.rubrow2show {
		font-size: 0.9em;
		padding-bottom: 1em;
	}

	/*KP: 2014-11-12: b specifications for div (vert view) */
	div.rubrow2show b {
		padding: 0.5em;
	}

	/*KP: 2014-11-10: Generic class for dark blue columns */
	.rubrow2colshow { /* sub-rubric column show */
		background-color: #354668;
		color:white;
	}

	/*KP: 2014-11-10: Only for tds */
	td.rubrow2colshow { /* sub-rubric column show */
		padding-left: 5px;
	}

	/*KP 2014-11-12: Generic class for iRubric img wrapper*/
	.rub-logo-wrapper {
		padding-top: 0.5em;
	}

	/*KP 2014-11-12: div specifications (vert view)*/
	div.rub-logo-wrapper {
		padding-right: 0.5em;
		overflow: hidden;
	}

	/*KP 2014-11-17: document side by side grading*/
	#rub-document-left {
		width: 69%;
		float: left
	}

	.rub-expand-left {
		float: right;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 40px 20px 40px 0;
		border-color: transparent gray rgba(245, 219, 219, 0) transparent;
		margin-right: 0;
		top: 300px;
		position: relative;
		opacity: .5;
	}

	.rub-expand-right {
				float: right;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 40px 0 40px 20px;
		border-color: transparent transparent rgba(245, 219, 219, 0) gray;
		margin-right: 0;
		top: 300px;
		position: relative;
		opacity: .5;		
	}

	/* RS 2015-03-24 (b173, issue 519): section row 1 
		RS 2020-05-02 (trunk): only apply to td and not tr, use border radius on the right to match cells;
	*/
	td.rubrow1showhead, td.rubrow1colshowhead,
	td.mtxrow1showhead, td.mtxrow1colshowhead {  
		padding: 12px 6px;
		/* RS 2020-05-02 (trunk): Removed, it's overwritten by td:first-child;
		background-color:#cad6dd; */
		font-size: 1.2em;

		/* RS 2020-07-26 (trunk): Removed border radius
		border-radius: 0 13px 13px 0;*/
	}

	/* TH 2024-03-07 (b454, issue 918-6): Added. Give the subrubric of the matrix a darker color */
	td.mtxrow1showhead, td.mtxrow1colshowhead {
		background-color: #ddd !important;
	}	

	.rubrow2, .rubrow2col {  /* sub-rubric edit */
		background-color:#354668;
		color:white;
		padding: 6px;
	}
	

	/* RS 2015-03-24 (b173, issue 519): subrubric row 1 cell show */
	.rubrow2colshowhead,
	.mtxrow2colshowhead {
	 	padding: 10px;
	 	font-size: 1.2em;

	 	/* RS 2020-07-26 (trunk): Removed border radius
		border-radius: 		8px 8px 0 0;
	 	-moz-border-radius: 8px 8px 0 0; */

		/* TH 2024-03-07 (b454, issue 918-6): Remove the border
	 	border: 1px solid silver;
	 	border-width: 1px 0 1px 1px; */
	 	color:white;
	}


	tr.rubrow2show { /* sub-rubric row show */
	 /* RS 2015-03-24 (b173, issue 519): changed color */
	 background-color:#eee;
	 color:white;
	 padding-left: 5px;
	}


	/* RS 2015-04-03 (b173, issue 519): first cell of subrubric row (criteria header) */
	tr.rubrow2show > td:first-child {
	 	background: #ddd;
		border: medium none;
		border-radius: 0;

		/* TH 2024-03-14 (trunk, issue 918): Remove border
		border-left: 1px solid silver; */
	}



	.rubrow2colshow,
	.mtxrow2colshow { /* sub-rubric column show */
		/* (b173, issue 519): changed */
		 background-color:	#0080d5;	/* RS 2018-03-08 (b237, UI) */

		/* TH 2024-03-07 (b454, issue 918-6): Remove the border
		border-style: solid;
		border-width: 1px 1px 0px 1px; */

	 	color:white;

		/* (b173, issue 519): put padding all around */
	 	padding: 5px;
	 
	 
	}

	/* (b173, issue 519): added for newer browsers */
	/* RS 2018-03-08 (b237, UI) */
	.rubrow2colshowhead, rubrow2colshow  {
		background: linear-gradient(to bottom, rgb(36, 153, 255), #1d80d6) repeat scroll 0% 0% transparent;
	}
		
	.mtxrow2colshowhead, mtxrow2colshowhead {
		background: linear-gradient(to bottom, #333, #666) repeat scroll 0% 0% transparent;
	}




	.rubbuttoncontainer {
		background-color:#eee;
	}
	
	/* end rubric */
	
	/* begin matrix */
	.mtxrow0	{  /* criteria left column cell in edit */
		padding: 6px;
	 	padding-left: 25px;
	 	
	 	/* TH 2024-04-17 (trunk): The background of the row title column keeps repeating and looks weird */
	 	background-color: #fcfcfc;  /* Match the actual matrix assessment color */
		/* background: #111 url(../images/backgrounds/longshade_black2.jpg); */
 
	}

	.mtxrow0show {  /* criteria ??? */
		padding: 6px;
	 	padding-left: 25px;
	 	background-color:orange; 
	}
	
	.mtxrow0col 	{  /* criteria cell in edit */
	 cursor:pointer;
	 background-color:#fff; 
	 padding: 6px;
	 
	}

	.mtxrow0colshow  {  /* dark criteria cell in preview*/
	 cursor:pointer;
	 background-color:#fefefe; 
	 padding: 6px;
	 
	}
		

	.mtxrow0lightcol {  /* criteria ??? */
	 cursor:pointer;
	 background-color:red; 
	 padding: 6px;
	}

	.mtxrow0lightcolshow  {  /* light criteria cell in preview */
	 cursor:pointer;
	 background-color:#ffffff; 
	 padding: 6px;
	}
	
	.mtxrow0colover  {  /* criteria grader mouse over */
	 cursor:pointer;
	 background-color:#ffffdf; 
	 padding: 6px;
	 
	}

	table.matrix {
		background-color:#ddd;  /* this causes a fill which puts a 1px border between and around cells.  does not
									work in the print view */
		width:99%;
	}
	
	table.matrix td {  /* applies to all cells */
	}
	
	/* beign: matrix grade */
	table.matrix td.mtxcellselected {  /*selected/graded cell*/
		background-color:#3333ff;
		color:white;
		padding: 6px;
	}

	table.matrix td.mtxcellunselected {  /*unselected/not graded cell*/
		background-color:#fff;
		color:steelblue;
		padding: 6px;
	}
	
	td.matrixicon {
		background-color:white;
	}
		
	a.mtxcellselected:link, a.mtxcellselected:visited  {
		display:block;
		width:100%; 
		text-decoration:none;
		color:#ffffff;
		height:100%;
	}

	a.mtxcellunselected:link, a.mtxcellunselected:visited {
		display:block;
		width:100%;
		text-decoration:none;
		height:100%;
	}

	a.mtxcellselected:hover {  /*selected/graded cell*/
		background-color:#003399;
		color: white;
	}

	a.mtxcellunselected:hover {  /*unselected/not graded cell*/
		background-color:#ddd;
		color:black;
	}
	/* end: matrix grade */
	

	
	.mtxrow1, .mtxrow1col {  /* section edit*/
	 	padding: 6px;
	 	padding-left: 15px;
		background-color:#ccc; 
	}

	.mtxrow1show, .mtxrow1colshow {  /* section show*/
	 	padding: 6px;
		background-color:#cad6dd; 
		
	}

	.mtxrow2, .mtxrow2col {  /* sub-matrix edit */
	
	 /* TH 2024-04-17 (trunk): The background of the row title column keeps repeating and looks weird */
	 background: #444;
	 color:white;
	 padding: 6px;
	}
	
	.mtxrow2show { /* sub-matrix row show */
	 	 background: #111 url(../images/backgrounds/longshade_black2.jpg);
		color:white;
	 padding-left: 5px;
	}

	.mtxrow2colshow { /* sub-matrix column show */
		background: #111 url(../images/backgrounds/longshade_black2.jpg);
	 	color:white;
	 padding-left: 5px;
	 
	}
	

	/* end matrix */
	
	/* RS 2022-11-16: added. Set font size for rubric cell desc, row desc and column desc to override the one set for all text areas */
	textarea.rdesc, textarea.cdesc, textarea.celldesc {
	    font-size: 10pt !important;
	}

	/* rubric cell desc */
	textarea.celldesc {
		/* RS 2016-11-04: changed width to 95% from 150px */
		width:95%; height:125px;
	}
	input.ctitle, input.rtitle { 
		/* RS 2016-11-04: changed width, added margin, increased font size 
			RS 2017-05-18: Width changed from 95 to 85% or it would stick out of table cell
		*/
		width: 85%;
		margin: 5px;
		font-size: 1.5em;
	}
	input.cweight, input.rweight { 
		width:50px; 
	}

	/* TH 2019-08-14 (b154, issue 265): Change the width and height of the textarea of criteria description when creating/editing a rubric */
	textarea.cdesc, textarea.rdesc { 
		width: 95%;
		height: 80px;
	}		
	
	.testimonial {
		border:1px solid #fee;
		background-color:#ffe;
		margin: 2px;
	}
	
/*fckeditor begion*/


/* for firefox... mark as important, otherwise it becomes black 
a[href] {
	color: #0000ff !important;	
}
*/



/*
	just uncomment the following block if you want to avoid spaces between
	paragraphs. remember to apply the same style in your output front end page.
*/


p, ul, li
{
	margin-top: 0px;
	margin-bottom: 0px;
}

/*
	the following are some sample styles used in the "styles" toolbar command.
	you should instead remove them, and include the styles used by the site
	you are using the editor in.
*/

.Title,  /* RS 2013-03-24: backward compatibility - need to keep this casing for fck */
.title
{
	font-weight: bold;
	font-size: 18px;
	color: #cc3300;
}

.Code,  /* RS 2013-03-24: backward compatibility - need to keep this casing for fck */
.code
{
	border: 1px dashed silver;
	padding: 5px;
	margin: 5px;
	color: #000066;
	font-family: 'courier new' , monospace;
	background-color: #e5e5e5;
}

/*fckeditor end */


.bookmarkbutton {
	text-decoration:none;  
	padding:2px; 
}

/*vote star*/
.star_y{
	width:10px; 
	height:10px; 
	background:url(../images/icons/vote_star.gif); 
	float:left;
}

.star_n{
	width:10px; 
	height:10px; 
	background:url(../images/icons/vote_star.gif) 0 10px; 
	float:left;
}


/*  begin: header banner for menu */
	/* needed by firefox to stop the menu from wrapping */
	#topmenumystuff { 
		float:left;
	}
	
	/* stop the menus from initially showing vertically */
	#topmenumystuff li, #topmenuareas li { 
		display:inline;
	}

	/* this is to override the previous style to make sure submenus are showing vertically */
	#topmenumystuff li li, #topmenuareas li li{ 
		display:list-item;
	}

	/* set padding for topmenumystuff to stop it from overlapping during inital load, and also to prevent
		extra space left for menu icon */
	#topmenumystuff li { 
		padding:4px 10px 4px 10px;  
	}

	/* fix padding for submenus */
	#topmenumystuff li li { 
		padding:5px 0px 5px 3px; 
	}

	.staticmenu_counter {
		border-radius:30%;
		background-color:red;
		color:white;
		/*position:relative;*/
		top:-6px;
		left:-14px;
		display:auto;
		padding:0 3px 0 3px;
	}
	a.staticmenu {
		text-decoration: none;

		/* TH 2024-07-30 (b452, issue 930): Removed.
		font-size: 0.8em; */
	}

	a.staticmenu, a.staticmenu:link, a.staticmenu:visited {
		color:#0099ff;
	}
	
	a.staticmenu:hover {
		color:#ff9900;
	}


 /* hide the horizontal bar sub-menu indicator, but not any of the vertical */
	  #topmenumystuff li.hassubmenu.yuimenubaritem em.submenuindicator { 
		 visibility: hidden;
		 width: 0px;
		 height: 0px;
		 padding: 0px 0px 0px 0px;
		 margin: 0px 0px 0px 0px;
	  }
	  
	  /*
	  #topmenumystuff li.hassubmenu.yuimenubaritem li.hassubmenu.yuimenuitem em.submenuindicator { 
		 visibility: inherit;
		 width: 8px;
		 height: 8px;
		 margin: 0px -16px 0px 10px;
	  }
		*/

	  /* change horizontal bar delimiter - shows use of 'first-of-type' */
	  #topmenumystuff li.yuimenubaritem, #topmenuareas li.yuimenubaritem {
		 border-color: eee;
	  }
	  
	  /*make the first menu item a little taller to detach menu dividers from menu's bottom border */
	  #topmenumystuff li.yuimenubaritem.first-of-type {
		 margin-bottom: 2px;
	  }	 
	  
	/* remove additional padding on the left of topmenuareas */
	#topmenuareas li { 
		padding:1px 7px 1px 7px;  
	}


	table#topmenu_areas {
	}
	
	table#topmenu_areas td {
		padding: 2px 4px 2px 4px;
		text-align:center;
	}
	
	table#topmenu_areas td a {
		display:block; 
		color: #888; /*#00aaff;*/
		font-weight: normal;
		font-size: .8em;
	}	

	table#topmenu_areas td a:hover {
		color:#ff6600;
	}	

/*  end: header banner for menu */


/* begin rightsidebar */

#rightsidebar ul {
	list-style-type: none; /* needed by firefox */
	margin: 5px; 	/* needed by all */
	padding: 0px;  /* needed by netscape */
}

#rightsidebar li {
	padding: 6px 2px 6px 2px;
	border-bottom: 1px solid white;
	/*background-image:url(../images/backgrounds/shade_lightsilverwhite_vert_60.jpg);*/
	background-position: top;
	background-repeat:repeat-x;
}

#rightsidebar li a {
	text-decoration:none;
}

#rightsidebar .header {
	border-bottom: 1px solid silver;
	padding: 1px 3px 1px 3px;
	margin-bottom: 3px;
	white-space:nowrap;	
}

table.rubric {
	/* RS 2015-03-24 (b173, issue 519): Removed
	background-color:#ddd; */ /* this causes a fill which puts a 1px border between and around cells.  does not
								work in the print view */
	/* TH 2024-03-07 (b454, issue 918-6): Change the width to 100% to fit the page and line up with other div */
	width:100%;

	/* RS 2015-03-24 (b173, issue 519): added: add a border and background */
	border-spacing: 1.1px;  /* RS 2024-06-27 (trunk): border keeps disappearing when it's at 1px in Firefox.  1.1px fixed the issue.*/
	border-collapse: separate !important;

	/* RS 2018-03-08 (b237, UI): removed */
	/* background: #e0e0e0; 
	border: 5px solid #e0e0e0;
	border-radius: 5px; */
}

table.rubric td {  /* applies to all cells. */

	/* RS 2015-03-24 (b246, issue self assessment): added.  Give all cells a default border */ 
	/* TH 2024-03-07 (b454, issue 918-6): Remove border
	border-width: 0 1px 1px 0;
	border-color: silver;
	border-style: solid; 8 */
	
	/* TH 2024-03-07 (b454, issue 918-6): Consilidate with the same css below, change to 15px */
	padding: 15px;
}

a.mtxcellclickable:link, a.mtxcellclickable:visited {
	display:block;
	width:100%;
	text-decoration: none;
	height:100%;
	color: #333;
}

a.mtxcellclickable:hover {  /*selected/graded cell*/
	color: #555;
}


/* RS 2017-01-10 (b246, conituing b173): Changes to css are hiding the border.  Adding a new class to handle common attributes of matrixcellstatus */
/* RS 2020-07-26 (trunk): Consolidate the next two classes */
table.rubric td.matrixcellstatus ,
.matrixcellstatus_, .matrixcellstatus_0, .matrixcellstatus_1, .matrixcellstatus_2, .matrixcellstatus_3, .matrixcellstatus_4, .matrixcellstatus_5 {

	/* RS 2020-07-26 (trunk): reduced radius  to 2*/
	/* TH 2024-03-07 (b454, issue 918-6): Remove rounded corners
	-moz-border-radius: 2px;
	border-radius: 2px; */

	/* TH 2024-03-07 (b454, issue 918-6): Remove border */
	border:0px solid silver;

	background-color: #f5f5f5;  /*light silver*/

}

/* TH 2024-03-07 (b454, issue 918-6): Because of the css change above, the evaluatee mini matrix lost border and looks weird, add the border
 back with this class */
.mtxcellbox {
	border:1px solid silver;
}

 /* XX 2021-06-08 (b368) */
.matrixcelltabstatus_, .matrixcelltabstatus_0, .matrixcelltabstatus_1, .matrixcelltabstatus_2, .matrixcelltabstatus_3, .matrixcelltabstatus_4, .matrixcelltabstatus_5,

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixcelltabstatus_6 {
	border-top: 5px solid;
}

/* XX 2021-06-08 (b368) */
table.rubric td.matrixcellstatus_0,
.matrixcellstatus_0, .matrixcellstatus_,
.matrixcelltabstatus_0, .matrixcelltabstatus_ {  /* started */

	/* RS 2020-07-26 (trunk): increase yellow border intensity since the thickness is reduced */
	border-color:silver; /*yellow */ 
}

/* RS 2020-07-26 (trunk): GIve legend a smaller padding than cells */
.matrixcellstatus_, .matrixcellstatus_0, .matrixcellstatus_1, .matrixcellstatus_2, .matrixcellstatus_3, .matrixcellstatus_4, .matrixcellstatus_5,

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixcellstatus_6 {
	padding: 3px;
}

/* RS 2020-07-26 (trunk): Give all cells a padding for airiness */
/* TH 2024-03-07 (b454, issue 918-6): Removed. Consolidate with the identical css above
table.rubric td {
	padding: 10px;
} */

/* Adding a second class for table.rubric td to avoid overwriting */
table.rubric td.matrixcellstatus_,
table.rubric td.matrixcellstatus_0,
.matrixcellstatus_, matrixcellstatus_0 {  /* not started */
}


/* Adding a second class for table.rubric td to avoid overwriting */
/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_1,
.matrixcellstatus_1,
.matrixcelltabstatus_1 {  /* started */

	/* RS 2020-07-26 (trunk): increase yellow border intensity since the thickness is reduced */
	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	border-color: #ff0 !important; /*yellow */ 
}

/* TH 2024-07-11 (b399, issue 929): Css for the header button bar in the matrix cell */
.header_matrixcellstatus,
.matrix-header-buttonbar {
	opacity: 95%;
	justify-content:end;
}

.header_matrixcellstatus a,
.matrix-header-buttonbar a.nav-link {
	font-size: 0.7rem;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    color: #555 !important;
    margin-left: 5px;
    border-width: 0 1px;
    border-color: white;
}

.header_matrixcellstatus a:hover,
.matrix-header-buttonbar a.nav-link:hover {
	background-color: #fafafa !important;
}

.matrix-header-buttonbar a.nav-link::before {
	display: none !important;
}

.header_matrixcellstatus a > i {
	font-size: 1rem !important;
	/* TH 2025-01-15 (trunk, issue 943): BS5 migration
	margin-right: 5px; */
	
	/* TH 2025-01-09 (trunk): UI. Add height to icon to line up the different icons */
	height: 18px;
}

.matrix-header-buttonbar a.nav-link i {
	font-size: 1.2rem !important;
}

.header_matrixcellstatus span {
	/* TH 2025-01-15 (trunk, issue 943): BS5 migration
	padding-left:3px; */
	
	/* TH 2025-01-09 (trunk): UI. Make the font size smaller for the label */
    font-size: 9pt;
}

/* Adding a second class for table.rubric td to avoid overwriting */
/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_1,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.header_matrixcellstatus_1,
.matrixcellstatus_1 {  /* started */

	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	background-color: #ffe !important;
}

/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_2,
.matrixcellstatus_2,
.matrixcelltabstatus_2 {  /* started */

	/* RS 2020-07-26 (trunk): increase yellow border intensity since the thickness is reduced */
	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	border-color: #d08aff !important;  /*purple*/ 
}

/* Adding a second class for table.rubric td to avoid overwriting */
table.rubric td.matrixcellstatus_2,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.header_matrixcellstatus_2,
.matrixcellstatus_2 {  /* submitted  */
	 
	 /* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	 background-color: #f9f2ff !important; /*efdfff;*/
}

/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_3,
.matrixcellstatus_3,
.matrixcelltabstatus_3 {  /* started */

	/* RS 2020-07-26 (trunk): increase yellow border intensity since the thickness is reduced */
	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	border-color: #adff5b !important;  /*purple*/ 
}

/* Adding a second class for table.rubric td to avoid overwriting */
table.rubric td.matrixcellstatus_3,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.header_matrixcellstatus_3,
.matrixcellstatus_3 {  /* accepted */
	
	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	 background-color: #e9ffd2 !important;  /*d5ffd5*/
}

/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_4,
.matrixcellstatus_4,
.matrixcelltabstatus_4 {  /* returned */

	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	border-color: #ffb482 !important;  /*orange*/ 
}

/* Adding a second class for table.rubric td to avoid overwriting */
table.rubric td.matrixcellstatus_4,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.header_matrixcellstatus_4,
.matrixcellstatus_4 {  /* returned */

	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	 background-color: #ffe8d9 !important;
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
table.rubric td.matrixcellstatus_6,
.matrixcellstatus_6,
.matrixcelltabstatus_6 {  /* Unacceptable */
	 border-color: red !important; /*blue*/
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
table.rubric td.matrixcellstatus_6,
.header_matrixcellstatus_6,
.matrixcellstatus_6 {  /* Unacceptable */
	background-color: #ffe1e1 !important;
}

/* Adding a second class for table.rubric td to avoid overwriting */
/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
table.rubric td.matrixcellstatus_5,
.matrixcellstatus_5,
.matrixcelltabstatus_5 {  /* completed */

	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	 border-color: #71c6ff !important; /*blue*/
}

/* Adding a second class for table.rubric td to avoid overwriting */
table.rubric td.matrixcellstatus_5,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.header_matrixcellstatus_5,
.matrixcellstatus_5 {  /* completed */

	/* TH 2024-04-01 (b456, issue 922-1): Added important so it doesnt get override by bootstrap */
	background-color: #e1f7ff !important;
}

/* ES 2015-09-03 (Issue 250, b139): generic settings for rubric legend */
.rubcellreceivedscore, .rubcellselfassessment {
	/* RS 2018-03-08 (b237, UI): reduced roundness */
	padding: 5px 10px; border-radius: 5px;
}

/* ES 2015-09-03 (Issue 250, b139): rubric legend -- received score */
.rubcellreceivedscore {
	border: 5px solid #3333ff;
	background-color: #3333ff;
	color: white;
}

/* ES 2015-09-03 (Issue 250, b139): rubric legend -- self assessment */
.rubcellselfassessment {
	border: 3px solid lightcoral;	/* RS 2018-03-08 (b237, UI) */
}

/* ES 2015-09-03 (Issue 250, b139): added two new classes for rubric legend. They will behave similarly to matrix legend for event hover */
/* TH 2020-10-08 (b344, issue 749-UI): Remove highlighting effect if not inside the matrix	*/
table.rubric .matrixcellstatus_:hover, 
table.rubric .matrixcellstatus_0:hover, 
table.rubric .matrixcellstatus_1:hover, 
table.rubric .matrixcellstatus_2:hover, 
table.rubric .matrixcellstatus_3:hover, 
table.rubric .matrixcellstatus_4:hover, 
table.rubric .matrixcellstatus_5:hover, 

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
table.rubric .matrixcellstatus_6:hover, 
table.rubric .rubcellreceivedscore:hover, 
table.rubric .rubcellselfassessment:hover,

/* TH 2021-05-24 (b368, UI): Added. Hover effect on different statuses  */
/* TH 2024-07-11 (b399, issue 929): Removed and create a matrix-shadow class
.matrixcellstatus_:hover, 
.matrixcellstatus_0:hover, 
.matrixcellstatus_1:hover, 
.matrixcellstatus_2:hover, 
.matrixcellstatus_3:hover, 
.matrixcellstatus_4:hover, 
.matrixcellstatus_5:hover, */
.rubcellreceivedscore:hover, 
.rubcellselfassessment:hover,

/* TH 2024-07-11 (b399, issue 929): Add new class */
.matrix-shadow:hover {
	-moz-box-shadow: 	0px 0px 10px #555;
	-webkit-box-shadow: 0px 0px 10px #555;
	box-shadow: 		0px 0px 10px #555;
	position: relative;

	/* TH 2018-1-2 (b139, issue 250) Changing the background will mess up the legends that have solid color backgound and white text
	background-color: white;*/
}

/* RS 2021-05-21 (b368, UI): use a different border for matrix cover */
.matrixcover,

/* TH 2024-04-17 (trunk): Added. Give cell cover the same css and matrix cover */
.cellcover {
	
	/* TH 2024-04-01 (b456, issue 922-1): Chang the css style */
	border-width: 2px !important;
	border-radius: 0 !important;
	width:99%; 
	
	/* TH 2025-01-15 (trunk, issue 943): BS5 migration */
	height:100% !important; 
	padding:0 !important;
} 

.matrixcover .matrixcoverlist {
	width: 4em;
} 

/* TH 2020-10-08 (b344, issue 749-UI): Add pointer cursor */
/* TH 2023-03-23 (b426, issue 889): Removed
.matrixetee-progress {
	cursor: pointer;
}*/

.matrixcellbutton {
	float: right;
	background-color:#eee;
	background-image:url(../images/backgrounds/shade_silverwhite_vert_60.png);
	border: 1px solid #eee;
	padding: 3px;
	margin: 5px;
	text-decoration: none;
	font-weight: bold;
}

/* TH 2020-10-08 (b344, issue 749-UI): Class for the labels of assessment section in
 matrix cell */
.mtxcell-astlabel {
	color: #666666;
	display: inline-block;
	width: 80px;
}

/* TH 2019-06-03 (b292, issue 641): Added an additional class matrixcellclosebutton, both will have different content
 but same css  */
.matrixcellopenbutton,
.matrixcellclosebutton {
	/* TH 2020-09-22 (b344, issue 749-7f): Removed. We use bootstrap to line up
	 the button/icon now so it's not necessary to float
	 float: right; */
	background-color:#eee;
	background-image:url(../images/backgrounds/shade_silverwhite_vert_60.png);
	border: 1px solid #eee;
	 padding: 2px;
	margin: 2px;
	text-decoration: none;
	visibility: visible;  /* hidden doesnt' work on ie and other versions of ff */
}

/* TH 2019-06-05 (b292, issue 641): Added. Class for the icon that replace matrix [open cell] button when the 
 matrix row collapsed */
.matrixcellopenicon,
.matrixcellcloseicon {
	/* TH 2020-09-22 (b344, issue 749-7f): Removed. We use bootstrap to line up
	 the button/icon now so it's not necessary to float
	 float: right; */
	padding: 2px;
	margin: 2px;
	text-decoration: none;
	visibility: visible;  /* hidden doesnt' work on ie and other versions of ff */
	color:#aaa;
}

/* TH 2024-03-07 (b454, issue 918-6): Added. Css for the text inside the open/close matrix icon */
.matrixcellopenicon .matrixcellopenclosetext,
.matrixcellcloseicon .matrixcellopenclosetext {
	font-size:0.45em;
	color:#333;
}

.matrixcellstatus_:hover .matrixcellopenbutton, 
.matrixcellstatus_0:hover .matrixcellopenbutton, 
.matrixcellstatus_1:hover .matrixcellopenbutton, 
.matrixcellstatus_2:hover .matrixcellopenbutton, 
.matrixcellstatus_3:hover .matrixcellopenbutton, 
.matrixcellstatus_4:hover .matrixcellopenbutton, 
.matrixcellstatus_5:hover .matrixcellopenbutton,

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixcellstatus_6:hover .matrixcellopenbutton
{
	visibility: visible;  /*don't show by default*/
	color: #333;
}


/* begin: apps page */
ul.apps-features {
	padding-left: 0;
}

ul.apps-features li { 
	margin-left:30px;
	padding: 5px;
	list-style-image:url(/images/icons/12/nav_down_right_red.png);
}

.graybordertable table {
	border-color: #ccc;
	border-width: 1px 1px 0 0;
	border-style:solid;
	border-spacing: 0;
}

.graybordertable td, .graybordertable th {
	border-color: #ccc;
	border-width: 0 0 1px 1px;
	border-style: solid;
	margin: 0;
	padding: 3px;
	background-color: #fff;
}


.apps-subheader-text {
	color: #669a00;
	font-size: 12pt;
	margin: 10px 0;
}

.apps-sideheader-text {
	color: #669a00;
	font-size: 10pt;
	margin: 15px 0 10px 0;
	border-bottom: 1px solid #669a00;
}
.apps-body-text {
	margin: 10px;
	/*font-family: arial,helvetica,sans-serif;*/
	font-size: 1.2em;
	color: #4c4c4c;
}

.clear-both {
	clear:both;
}
.apps-benefit-text {
	font-size: 12px;
	float:left;
	margin-right: 15px;
	width: 30%;
}
.expandedcontent-text {
	margin:5px 0 0 20px;
	color: #999;
}

.apps-section-title {
	color: #690; 
	font-size: 13pt;
	margin-bottom: 15px;
}

.apps-feature-title {
	color: #aed066;
	font-size: 2em;
}

.apps-feature-container {
	float:left; 
	width:30%; 
	margin-right:15px;
}

/* end: apps page */


.tagbuttoncontainer {
	line-height:25pt;
	font-size:1.2em;

	/* TH 2020-08-07 (trunk, issue 722-65): Add margin  */
	margin: 15px;
}

.tagbutton {
	border:1px solid silver;
	white-space:nowrap;
	
	/*TH 2020-08-07 (b722-65): Add some more padding to the tag buttons */
	padding: 5px 8px 5px 5px;
	margin-right: 1em;
}

/* KP 2014-08-26: Styling for Notification system */
.notice_list_container {
	background-color: #000000
}

.notice_row_0 {
	background-color: #fff; 
}

.notice_row_1 {
	background-color: #E6E6E6;
}

.notification_table {
	width: 100%;
}

.notification_icon {
	width: 20px;
	height: 20px;
}

.notification_icon_compact {
	height: 10px;
	width: 10px;
	margin: auto;
}

.notification_table_compact {
	width: 100%;
	border: 3px solid #e3e3e3;
	-webkit-box-shadow: -3px 4px 5px -1px rgba(50, 50, 50, 0.76);
	-moz-box-shadow:    -3px 4px 5px -1px rgba(50, 50, 50, 0.76);
	box-shadow:         -3px 4px 5px -1px rgba(50, 50, 50, 0.76);
	cellspacing: "0";
	border-collapse: collapse;
}
 
.notification_menu_icon {
	cursor: pointer;
	
	/* TH 2024-07-30 (b452, issue 930): Added padding top */
	padding-top:5px;
}


#arrow_up {
	display: none;
	position: absolute;
	width: 0; 
	height: 0; 
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
	border-bottom: 9px solid #E3E3E3;
}

#notification_window {
	display: none;
	position: absolute;
	top: 35px;
	right: 0px;
	width: 25%;
	z-index: 1003;
	background-color: #e3e3e3;
}

.notice_date_column {

}

.notice_content_column {

}

.notification_dismiss_column {
	width: 1%;
}

.notification_flag_column {
	width: 1%;
}

.notification_read_f {
	background-color: #E3E3E3;
}

.notification_read_t {
	background-color: #FFFFFF;
}

/* KP 2014-09-08: rubricgradeeditf matrix cell highlighting */
.cell_notification {
	width: 96%;
	height: 24px;
	margin: auto;
	border-radius: 20px;

	/* TH 2024-07-11 (b399, issue 929): Remove the margin
	margin-bottom: 7px;*/
}

.cell_notification_inactive {
	display:none;
}

.notification_flag_t {
	background-color: #FF0000;
}

.notification_circle {
	border-radius:50%;
	background-color:#3777FF;
	float:left;
	text-align:center;
	right:15px;
	width:15px;
	height:15px;
}

.notification_text_container {
	float:left;
	padding-left:4px;
}

.cell-desc-text {
	overflow:hidden;
	height:5em;
}

.readMoreButton {
	text-decoration:underline;
	
	/* TH 2024-01-03 (b446, issue 912): Change text color to gray */
	color: #555;
	text-align: right;
	cursor:pointer;
	font-size: .85em;
}

.clickable { 
	cursor:pointer; 
}

/* ES 2015-10-05 (Issue 374, b184): position Enabled and Disabled toggle buttons together */
.cb-enable, .cb-disable, .cb-enable span, .cb-disable span { 

	/* show both enabled and disabled buttons on the same */
	display: block;
	float: left; 
}

/* ES 2015-10-05 (Issue 374, b184): style Enabled and Diaabled toggle button captions 
	https://devgrow.com/iphone-style-switches/
*/
.cb-enable span, .cb-disable span {
	font-weight: bold;	/* show bold captions (i.e. "Enable" and "Disable") */
	padding: 6px; 	/* toggle button dimensions */ 
}

/* ES 2015-10-05 (Issue 374, b184): show one-sided border for Enabled (on left) and Disabled (on right) */
.cb-enable { 
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px; 
	border-width: 1px 0 1px 1px;
}
.cb-disable { 
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	border-width: 1px 1px 1px 0;
}
.cb-enable, .cb-disable {
	border-style: solid;
	border-color: silver;
	background-color: white;
	color: black;
	box-shadow: 4px 5px 8px #333;
}

/* ES 2015-10-05 (Issue 374, b184): selected toggle button CSS */
.cb-disable.selected { 

	/* setup background color for selected disabled button */
	background: linear-gradient(rgba(146,146,146,255), rgba(100,100,100,255)); 
}
.cb-enable.selected { 

	/* setup background color for selected enabled button */
	background: linear-gradient(rgba(125,177,29,255), rgba(79,129,15,255)); 
}
.cb-disable.selected span, .cb-enable.selected span { 
	color: #fff; 	/* set text color to white */
}

/* ES 2015-10-05 (Issue 374, b184): style container for toggle buttons */
.rubrowsel {
	width: 150px;  /* keep the buttons in one row */
	position: relative;
	left: 5em;

	/* ES 2015-10-09 (b193): re-position button, so it would not hide row title */
	top: -0.5em;
}
.rubrowsel label { 
	cursor: pointer; 	/* show cursor */
}
.rubrowsel input { 
	display: none; 	/* hide radio buttons */
}

/* ES 2015-10-09 (b193): fading div used in participent list to items near the bottom */
.semitransparentbar {
	height: 30px;

	/* start with white which continues for 40% and transition to transparent */
	background-image: linear-gradient( 0deg, white, white 40%, transparent);

	/* position absolute within parent DIV */
	position: absolute;

	/* show fading text at the left bottom corner */
	bottom: 0px;
	left: 0px;

	/* extend this element to full size of parent DIV */
	width: 100%;
}

/* TH 2024-03-07 (b454, issue 918-6): Css for the semi transparent bar inside the expand collapse 
 in the case of partial collapsing */
.ExpandCollapseSeeMore.semitransparentbar {
	cursor:pointer;
	background-image: linear-gradient( 0deg, white, white 10%, transparent);
}

/* ES 2015-10-13 (b193): class for number of recipients shown on the side of evaluator/evaluatee lists */
.numselrcpsection {
	font-size: 1.5em;
	color: #555
}

/* SC 2016-08-01 (b213): class for button circle (e.g. 'go' button) */

/* NW 2020-05-27 (b335, Issue 726): Prepend a in front of the class to override bootstrap css */
a.button-circle {
	background-color: #0099ff;
	border-radius: 3em;
	padding: .5em;
	text-decoration: none;
	font-weight: bold;
	color: white !important;
	font-size: .9em;
}

/* additional style for jq input */
.jq_input, .jq_textarea, .jq_select {
	/* RS 2022-11-16 (b418): moved to input, select, etc above 
	padding: 5px;
	*/
}

/* additional style for jq input */
.jq_textarea, .jq_select {
	/* RS 2022-11-16 (b418): moved to textarea, selec above 
	background-color:#fafafa;
	*/
}

/* additional style for jq input */
.jq_button {
	/* RS 2022-11-16 (b418): moved to button above
	font-size: 1.2em; 
	*/
}

/* SC 2016-08-12 (b226): class for Skipping messages for Random Sampling */
.randomsampling {
	padding: 2px 2px 2px 20px;  /* extra padding on the left to show the icon */
	background-repeat:no-repeat;
	background-position:left;
}

/* warning_0 indicates success (no errors) */
.randomsampling_warning_0 {
	background-color:white;
}

.randomsampling_warning_1 {
	background-color:LightYellow;
}

.randomsampling_warning_2 {
	background-color:WhiteSmoke;
}

.randomsampling_warning_3 {
	background-color:LightPink;
}

.randomsampling_warning_4 {
	background-color:Gold;
}

/* warning_0 indicates success (no errors) */
.randomsampling_warning_0_icon {
	background-image:url(../images/icons/16/check.png);
}

.randomsampling_warning_1_icon {
	background-image:url(../images/icons/16/warning_ylw.png);
}

.randomsampling_warning_2_icon {
	background-image:url(../images/icons/16/warning_blk.png);
}

.randomsampling_warning_3_icon {
	background-image:url(../images/icons/16/warning_blu.png);
}

.randomsampling_warning_4_icon {
	background-image:url(../images/icons/16/warning_org.png);
}

/* end class for Skipping messages for Random Sampling */

/* SC 2016-08-18 (b226): Random Sampling History classes for 'li' */
li.randomsamplinghistory {
	padding:0.15em 0 0.5em 1.5em;
	margin-bottom:0.2em;
	margin-top:0.2em;
	text-indent:0.4em;
	font-weight:bold;
	list-style:none;
	background-repeat:no-repeat;
}

/* 'randomsamplinghistory_0' indicates that it is an active document (in the folder) */
li.randomsamplinghistory_0_icon {
	background-image:url(../images/icons/16/document.png);	
}

/* 'randomsamplinghistory_1' this indicates that the document was sampled out */
li.randomsamplinghistory_1_icon {
	background-image:url(../images/icons/16/document_inactive.png);	
}

/* end Random Sampling History classes for 'li' */


/* MM 2016-09-08 (issue 462, b221): footer classes */

/* footer headers that display at the bottom of the screen */
.footer-grid-header {
	font-size: 1.1em;
	background-color: #EEE;
	font-weight: bold;
	color: #555;
	padding: 7px;
}

/* footer links that display at the bottom of the screen */
.footer-grid-links {
	margin-left: 10px;
}

/* end footer classes */


/* EA 2016-09-6 (issue 462, b222): Static menu classes */

/* for the glyphicon on the ctstaticmenu, just resizing and making them white to make them more visible */
.glyphicon-ctstaticmenu {
	font-size: 1.5em;
	color: #ffffff;
}

/* Incase someone hovers over the glyphicons in the ctstaticmenu they will be white to be visible*/
.glyphicon-ctstaticmenu:hover {
	color: white;
}

/* for Form elements like login button  */
.staticmenuform {
	padding-top:5px;
	margin:5px;
}

#menu-main.hover{
	color: #0099FF;
}

/* AC 2014-11-07: (Comments Only) [lines 3272-3294] added css */
.rubrowsuggest, tr.rubrowsuggest {
	background-color: #FFA584;
}

tr.rubrowsuggest td {
	background-color: #FFA584;
}


tr.rubrowsuggest td:first-child {
	/* RS 2020-07-26 (trunk): Removed radius
	border-radius: 10px 0px 0px 10px;*/

}


tr.rubrowsuggest td:last-child {
	/* RS 2020-07-26 (trunk): Removed radius
	border-radius: 0px 10px 10px 0px;*/
}

.radiobuttonbar {
	position:relative;
	margin-left:25px;
}

/* MS 2017-11-28 (Issue 521, b246) circles a question number (used in quiz page) */
a.questionnumber, span.questionnumber {
	font-size: 2em;
	border: 1px solid silver;
	padding: 9px 15px;
	margin: 5px 10px;
	display: inline-block;
	border-radius: 30px;
	float: left;
	text-decoration: none;
	
	/* TH 2023-09-18 (b441, issue 905): Added white background */
	background-color: white;
}

a.questionnumber:hover {
	background-color: silver; 
	border-color: gray; 
}


/* MS 2017-12-06 (Issue 512, b246) add space around question description */
.questiondescription {
	margin: 0 10px 20px 10px;
	font-size: 1.2em;
}

/* MS 2017-12-06 (Issue 512, b246) a container that wraps question table and answer table. It draws vertical bar for each container and outer line */
.question_box {
	/* TH 2023-09-18 (b441, issue 905): Removed css
	border: 1px solid #ddd; /*draw a outer line */
	margin: 0 0 10px; /* add some space between each question row */
	padding-left: 10px;	/* left vertical bar for each container */
	background: #65AD49; /* green */
	*/
}

/* TH 2023-09-18 (b441, issue 905): Added question header */
.question_header {
	background-color:#EFF8FB;
}

/* MS 2017-12-06 (Issue 512, b246) rounded button that shows question type */
.questiontype_button {
	background-color: #0097A7; /* blue */
	border: none;
	color: white; /* text color inside button */
	padding:3px; /* size of button */
	text-align: center; 
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px; /* create space around button */
	border-radius: 4px /* add rounded corners to button */
}

/* TH 2017-12-14 (Issue 516, b246) fade in and out class */
.icons_fade_in {
	opacity : 1;
}

.icons_fade_out {
	opacity : 0;
}

/* TH 2017-12-14 (Issue 516, b246) class for the icons bar when it transition from fade in to out */
.icons_container_hover{
	display : none;
	position : absolute;
	vertical-align : middle;
	transition : opacity .7s ease-in-out;
}

.icons_container_hover a{
	text-decoration: none;
}

/* TH 2017-12-14 (Issue 516, b246) class for the arrow icon for the icons bar */
.icons_container_arrow {
	display:block;
}

/* TH 2018-06-14 (b235, UI): change for fontawesome upgrade */
.fa-facebook-hover:hover i {
	color:#3b5998;
}
.fa-google-plus-g-hover:hover .fa-circle{
	color:#d62d20;
}
.fa-linkedin-in-hover:hover .fa-circle{
	color:#0077B5;
}
.fa-twitter-hover:hover .fa-circle{
	color:#1da1f2;
}
.fa-envelope-hover:hover .fa-circle{
	color:#9ACD32;
}

.fa {
	cursor: pointer;
}

.cursor_pointer {
	cursor: pointer;
}

/* TH 2018-03-29 (Issue 488, b247): Added classes to customize fa-ban icon styling */
.ban, .ban0,
.ban:link, .ban:visited,
.ban0:link, .ban0:visited  {
	color: red;
	text-decoration: none;
}

.ban:hover,
.ban0:hover {
	color: #dd0000;	/* slightly dark red */
	text-decoration: none;
}

.ban1,
.ban1:link, .ban1:visited {
	color: orange;
	text-decoration: none;
}

.ban1:hover {
	color: darkorange;
	text-decoration: none;
}

/* TH 2018-03-29 (Issue 488, b247): Added colors */
.color_red {
	color: red;
}

.color_orange {
	color: #ff6633;
}

.color_blue {
	color: #0099ff;
}

.color_green {
	color: #669900;
}

/* TH 2018-04-04 (Issue 560, b248): Added. CSS for modernized registration page */
/* This is the container for the bootstrap form
	TODO: Incorporate into CTroundedbox */
.form-container{
 	margin: 0px auto;
	padding: 10px 5%;
	text-shadow: none;
	box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.31);
	border-spacing:0;
	border:1px solid whitesmoke;
}

span.input-group-addon i {
	color: #009edf;
}

.input-tooltip{
	position: absolute;
	width: 200px;
	padding: 7px 10px;
	top:0;
	left:105%;
	display: none;
	z-index: 1000;
}

.input-tooltip:after{
	position: absolute;
	content: " ";
	height: 0;
	width: 0;
	right: 100%;
	top: 10px;
	border-top: 21px solid transparent;
	border-bottom: 21px solid transparent;
	border-right: 21px solid #009edf;
	border-width: 10px;
	margin-top: -10px;
}

@media screen and (max-width: 900px) {
	.input-tooltip {
		position: absolute;
		width: 200px;
		padding: 7px 10px;
		top: 100%;
		left: 50%;
		display: none;
		z-index: 1000;
	}
	
	.input-tooltip:after{
		position: absolute;
		content: " ";
		height: 0;
		width: 0;
		right: 0;
		top: -10px;
		border-left: 21px solid transparent;
		border-bottom: 21px solid #009edf;
		border-right: 21px solid transparent;
		border-width: 10px;
		margin-top: -10px;
	}
}

/* TH 2018-04-06 (UI, b235): Added. Progress bar CSS styling 
	Source: https://jsfiddle.net/Misiu/y1Lo3qh1/ 
*/
.progress {
	width: 100%;
	margin: 20px auto;
	text-align: center;
	white-space: nowrap;
	padding-bottom: 40px;
}

.progress .step-circle,
.progress .step-bar {
	display: inline-block;
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 40px;
	border: 1px solid #d5d5da;
	vertical-align:top;
}

.progress .step-bar {
	position: relative;
	width: 80px;
	height: 6px;
	margin: 0 -5px 17px -5px;
	border-left: none;
	border-right: none;
	border-radius: 0;
	top:16px;
	vertical-align:top
}

.progress .step-circle .step-label {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	border-radius: 32px;
	
	/* TH 2022-08-23 (b414, issue 870): Minus 1px to the margin because after
	 some font changes globally, the label are shifted downward  */
	/* RS 2022-11-16 (Issue 878, b418): increased margin to fit it better */
	margin-top: 4px;
	color: #b5b5ba;
	font-size: 17px;
}

.progress .step-circle .step-title {
	color: #b5b5ba;
	font-size: 13px;
	line-height: 18px;
	margin-left: -30px;
	display: block;
	width: 100px;
	margin-top: 5px;
}

span.step-title {
	text-align: center;
	display: block;
	font-weight: bold;
}

a.step-breadcrumb {
	text-align: center;
	display: block;
	font-weight: bold;
	line-height: 18px;
	margin-left: -30px;
	width: 100px;
	white-space: normal;
	border: 2px solid;
	border-radius: 5px;
	padding-left: 3px;
	padding-right: 3px;
	border-top: none;
	border-bottom: none;
}

/* Done / Active */
.progress .step-bar.done,
.progress .step-circle.done {
	background: #eee;
}

.progress .step-bar.active {
	background: linear-gradient(to right, #EEE 40%, #FFF 60%);
}

.progress .step-circle.done .step-label {
	color: #FFF;
	background: #8bc435;
	box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
}

.progress .step-circle.done .step-title {
	color: #444;
}

.progress .step-bar.done {
	background-color: #8bc435;
}

.progress .step-circle.active .step-label {
	color: #FFF;
	
	/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
	background: var(--rs_blue);
	box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
}

.progress .step-circle.active .step-title {
	
	/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
	color: var(--rs_blue);
}

/* TH 2018-10-15 (trunk01): added. For standards title inside a rubric header, we change the color to white so that it's visible in
 a blue background */ 
table.rubric td.rubrow2colshowhead .standard-align ul.standard-list li,
table.rubric td.mtxrow2colshowhead .standard-align ul.standard-list li {
	color: white;
}

/*TH 2018-10-04 (b253, issue 602): Class for wrapping staticmenu icon with badges */
.icon-wrapper{
	position:relative;
	float:left;
}

/* TH 2019-01-09 (b272, issue 617): Added. Class for the standard meet values */
.std_not_aligned, .std_meet_0, .std_meet_3{
	color: #555;
}

.std_not_meet, .std_meet_1{
	color: #f0f;  /* magenta */
}

.std_meet, .std_meet_2{
	color: #09f;  /* blue */
}

/* TH 2019-02-15 (b272, issue 617): Break down the class to multiple classes */
.std_goal {
	font-weight: bold;
	font-size: 1.5em;
}

/* TH 2019-02-15 (b272, issue 617): Break down the class to multiple classes */
.std_goal_not_met, 
.std_goal_meet_0{
	color: red;
}

/* TH 2019-02-15 (b272, issue 617): Break down the class to multiple classes */
.std_goal_met, 
.std_goal_meet_1{
	color: green;
}

/* TH 2019-02-15 (b272, issue 617): Break down the class to multiple classes */
.std_goal_not_met.std_goal_icon_web::after,
.std_goal_meet_0.std_goal_icon_web::after{
	content: "\2716";	/* x mark */
}
.std_goal_met.std_goal_icon_web::after,
.std_goal_meet_1.std_goal_icon_web::after{
	content: "\2714";	/* check mark */
}
.std_goal_not_met.std_goal_icon_pdf::after,
.std_goal_meet_0.std_goal_icon_pdf::after{
	content: "not met";	/* not met label */
}
.std_goal_met.std_goal_icon_pdf::after,
.std_goal_meet_1.std_goal_icon_pdf::after{
	content: "met";	/* met label */
}

/* TH 2019-04-02 (b281): Class for the subject icons on rubric gallery page */
.faiconlink {
	color : #999;
}

/* TH 2019-04-02 (b281): Class for the subject icons on rubric gallery page */
.faiconlink:hover{
	
	/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
	color: var(--rs_link_hover);
}

/* TH 2019-04-02 (b281): Class for the subject tag on rubric gallery page */
.galleryitembutton {
	border:1px solid silver; 
	white-space:nowrap; 
	padding: 5px; 
	margin-right:1em;
}

/*TH 2019-03-13 (b278, issue 626): CSS for simple tooltip 
Source: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_tooltip*/
/*TH 2021-02-26 (b361, issue 779-3): Added. Different classes for the gradebook and standard
 tooltip, because bootstrap doesnt like tooltip class.
	NOTE: This is a temporary solution, we need to change the class name so it wont conflict with
	bootstrap 
*/
.tooltip,
.std_tooltip,
.gdb_tooltip {
	/* TH 2021-03-02 (trunk): Removed position because it messed with the scrollable container and this doesnt really do anything
	position: relative;*/
	display: inline-block;
	border-bottom: 1px dotted black;
}

/*TH 2021-02-26 (b361, issue 779-3): Added. Different classes for the gradebook and standard
 tooltip, because bootstrap doesnt like tooltip class.
	NOTE: This is a temporary solution, we need to change the class name so it wont conflict with
	bootstrap 
*/
.tooltip .tooltiptext,
.std_tooltip .tooltiptext,
.gdb_tooltip .tooltiptext {
	visibility: hidden;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	z-index: 1;
	bottom: 125%;
	left: 50%;
	margin-left: -50%;
	opacity: 0;
	transition: opacity 0.3s;
	padding-left: 5px;
	padding-right: 5px;
}

/*TH 2021-02-26 (b361, issue 779-3): Added. Different classes for the gradebook and standard
 tooltip, because bootstrap doesnt like tooltip class.
	NOTE: This is a temporary solution, we need to change the class name so it wont conflict with
	bootstrap 
*/
.tooltip .tooltiptext::after,
.std_tooltip .tooltiptext::after,
.gdb_tooltip .tooltiptext::after{
	content: "";
	position: absolute;
	top: 90%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}

/*TH 2021-02-26 (b361, issue 779-3): Added. Different classes for the gradebook and standard
 tooltip, because bootstrap doesnt like tooltip class.
	NOTE: This is a temporary solution, we need to change the class name so it wont conflict with
	bootstrap 
*/
.tooltip:hover .tooltiptext,
.std_tooltip:hover .tooltiptext,
.gdb_tooltip:hover .tooltiptext{
	visibility: visible;
	opacity: 1;
}

/* TH 2024-07-11 (b399, issue 929): Add cell-title class */
.cell-title {
	font-size: 1.2em;
	
	/* TH 2024-07-25 (b459, issue 929): Added padding */
	padding-left: .5em;
}

/* TH 2019-06-03 (b292, issue 641): Added class to cell and row title
 */
.row-title,

/*TH 2019-08-05 (b154, issue 265): Add class rub-criteria-title */
.rub-criteria-title {
	font-size: 1.3em;
}

/* TH 2019-06-03 (b292, issue 641): Added. When the cell description get cut off there're some rough
 edge where the cell description get cut off. This class will give the rough edge a fadeout effect */
.fadeout {
	bottom: 0;
	height: 4em;
	position: absolute;
	width: 100%;
} 

/* TH 2019-06-03 (b292, issue 641): Added. because each cell of the matrix w/ different status have
 different background color, we need to fade to that color  */
.fadebgcolor_, .fadebgcolor_0 { /* not started */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#f5f5f5
	);
}
.fadebgcolor_1 {  /* started */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#ffe
	);
}
.fadebgcolor_2 {  /* submitted */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#f9f2ff
	);
}
.fadebgcolor_3 {  /* accepted */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#e9ffd2
	);
}
.fadebgcolor_4 {  /* returned */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#ffe8d9
	);
}
.fadebgcolor_5 {  /* completed */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#e1f7ff
	);
}

.fadebgcolor_none {  /* No status */
	background: linear-gradient(
		rgba(255, 255, 255, 0) 0%,
		#ffffff
	);
}

/* TH 2019-06-05 (b292, issue 641): Added. Class the the matrix cell status icon, 
 we replace the old icon with new fa icons */
.matrixcellstatusicon {
	font-size : 1.3em;
	color: #aaa;
}

.matrixcellstatusicon__b, .matrixcellstatusicon_0_b {		/* not started background */
	color: white;
}

/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
.matrixcellstatusicon__f, .matrixcellstatusicon_0_f, .matrixcelltabicon_0 {		/* not started */
	color: #888;
}

.matrixcellstatusicon_1_b {		/* started background */
	color: tomato;
}
.matrixcellstatusicon_1_f, .matrixcelltabicon_1 {		/* started foreground */
	color: #FFD700;
}

.matrixcellstatusicon_2_b {		/* returned background */
	color: white;
}
.matrixcellstatusicon_2_f, .matrixcelltabicon_2 {		/* submitted foreground */
	color: #a146de;
}

/* 2019-07-18 (b296, issue 649-16): Added. Badge for number of submitted cells on assessmentlist page */
.matrixstatusbadge_1 {		
	background-color: #FFD700 !important;  /* match the color of matrixcellstatusicon_2_f  */
}

/* 2019-07-18 (b296, issue 649-16): Added. Badge for number of submitted cells on assessmentlist page */
.matrixstatusbadge_2 {		
	background-color: #a146de !important;  /* match the color of matrixcellstatusicon_2_f  */
}

/* TH 2024 (b456, issue 922-3): Added. Css for the new badged submit and completed on 
 assessment list */
.matrixstatusbadge_3 {		
	background-color: #6fa23b !important;  /* match the color of matrixcellstatusicon_3_b */
}

.matrixstatusbadge_5 {		
	background-color: #1d99ec !important;  /* match the color of matrixcellstatusicon_5_b  */
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixstatusbadge_6 {		
	background-color: red !important; 
}

.matrixcellstatusicon_3_b, .matrixcelltabicon_3 {		/* returned background */
	color: #6fa23b;
}
.matrixcellstatusicon_3_f {		/* accepeted foreground */
	color: #f0fde2;
	font-size:.8em;	
}

/* 2019-07-18 (b296, issue 649-16): Added. Badge for number of returned cells on assessmentlist page  */
.matrixstatusbadge_4 {		
	background-color: tomato !important; /* match the color of matrixcellstatusicon_4_b */
}

.matrixcellstatusicon_4_b, .matrixcelltabicon_4 {		/* returned background */
	color: tomato;
}
.matrixcellstatusicon_4_f {		/* returned foreground */
	color: white;
	font-size:1em;				/* this font is biggert than others */
}

.matrixcellstatusicon_5_b, .matrixcelltabicon_5 {
	color: #1d99ec;
}
.matrixcellstatusicon_5_f {
	color: white;
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixcellstatusicon_6_b, .matrixcelltabicon_6 {
	color: red;
}
.matrixcellstatusicon_6_f {
	color: white;
}

/* TH 2021-02-19 (b351, issue 778): Add class for the tab status */ 
.matrixcellstatusbullet_0 {
	color: #888;
}

.matrixcellstatusbullet_1 {	
	color: #FFD700;
}

.matrixcellstatusbullet_2 {
	color: #a146de;
}

.matrixcellstatusbullet_3 {
	color: #6fa23b;
}

.matrixcellstatusbullet_4 {		
	color: tomato;
}

.matrixcellstatusbullet_5 {		
	color: #1d99ec;
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.matrixcellstatusbullet_6 {		
	color: red;
}

/*TH 2019-03-13 (b287, issue 638): Add css for the standard map table's cell. 
 the grid help with keeping the label and the icon aligned */
.proficiency-container {
	display: grid;

	/* NW 2020-02-24 (b305, Issue 675): Change one 'title' area to a 'bullet-icon' area for the proficiency bullet. */
	grid-template-areas:'bullet-icon title title title title icon';
}

/* NW 2020-02-24 (b305, Issue 675): Added. Add class so as to not repeat inline style  for the standard map table's cells. */
.proficiency-container .proficiency-title {
	border-bottom: none;
	display: block;
	grid-area: title;
	margin: 0 5px;
}

/* TH 2019-05-02 (b287, issue 638):  Added. Highlight background color of table column and row as 
 mouse hovering over it */
table .hoverhighlight { background-color: #eee; }

/* TH 2019-07-31 (b289, issue 654): Added. Css for the custom setting divs in rubricreportsettingslistc */
.customsettingbox { 
	width: 100%;
	max-width: 600px;
	
	/* RS 2022-11-16 (b418): change color */
	border-top: 1px solid #bbb;   /*#b4d0dc;*/
	
	margin-bottom: 15px;
}

/* TH 2020-01-28 (trunk): Added. Css for embedded items label in the matrix */
.matrixcellsubtitle {
	
	/* TH 2024-07-11 (b399, issue 929): Add css */
	font-size: 0.8rem;
	font-weight: bold;
	color: #4f4f4f;
	margin: .2rem 0 .5rem 0;
	border-bottom: 1px solid whitesmoke;
	padding: 0 0 5px 0;
}

/* TH 2020-02-14 (b324, issue 714): Added. CSS for a newer look for the quick post 
 upload image button */
.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.inputfile + label {

	font-weight: 700;
	display: inline-block;
	overflow: hidden;
	padding: 0.5em;
	color: #1c94c4;
	cursor: pointer; /* "hand" cursor */
}

.inputfile:focus + label,
.inputfile.has-focus + label,
.inputfile + label:hover {
	color: #722040;
}

/* TH 2020-02-14 (b324, issue 714): Added. CSS for a newer look for the quick post scroll bar */
.quickpostmsg::-webkit-scrollbar {
	width: 7px;
	background-color: #F5F5F5;
}
.quickpostmsg::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}
.quickpostmsg::-webkit-scrollbar-thumb {
	background-color: #777;
}

/* NW 2019-11-04 (b305, Issue 675): Added. CSS for proficency level legend and bullets for student dashboard
and competency page */
.legend-item {
	display: inline-block;
	margin: 5px;
}

.legend-item .legend-title {
	display: inline-block;
}

.legend-item .legend-marker {	/* Boxed div displaying color for the legend */
	display: inline-block;
	width: 17px;
	height: 10px;
}

.legend-item .legend-line-marker {
	display: inline-block;
	width: 17px;
	height: 2px;
}

.proficiency-bullet-div {
	margin-right: 10px;
}

/* Bullet used within competency table depicting required/achieved proficiency */
.proficiency-bullet {
	display: inline-block;
	width: 11px;
	height: 11px;
	border-radius: 50%;
}

.performance-color-1 {			/* Color for performance: Well Below */
	background-color: salmon;
}

.performance-color-2,			/* Color for performance: Below */
.proficiency-color-1 {			/* Color for proficiency: Introductory */
	background-color: orange;
}

.performance-color-3 {			/* Color for performance: Meets */
	background-color: gold;
}
	
.performance-color-4,			/* Color for performance: Exceeds */
.proficiency-color-2 {			/* Color for proficiency: Reinforced */
	background-color: lightgreen;
}

.performance-color-5,			/* Color for performance: Exemplary */
.proficiency-color-3 {			/* Color for proficiency: Mastery */
	background-color: skyblue;
}

/* Border for table entry where student isn't a participant of a program */
.na-prg-participant {
	border-right: 1px solid silver;
	border-left: 1px solid silver;
	text-align: center;
}

/* NW 2020-02-25 (b305, Issue 675): Added. Class for the competency grid contents. */
.competency-grid-text {
	text-decoration: none;
	float: left;
}

/* Added to center compentecy cell content and have the content not spill over to the next column */
.competency-content-div {
	display: flex;
	padding: 0 10px;
	justify-content: center;
}

.competencytableheading {
	border-right: 1px solid silver;
	
	/*TH 2021-02-26 (b361, issue 779-3): Added. Important attribute so that it take priority over
	 other classes */
	text-align: center !important;
	
	/* TH 2021-02-23 (b361, issue 779): Added. Max width to competency grid table */
	max-width:15em !important;
}

/* TH 2021-02-26 (b361, issue 779-3): Added. The competency legend below table heading*/
.competencytablelegend {
	width:100%;
	position: absolute;
	bottom:0;
	left:0;
	height:7px;
}

.competency-cell {
	text-align: center;
	border-right: 1px solid silver;
	vertical-align: middle;
}

/* TH 2020-02-25 (b324, issue 715): Style taken from ressharelistshowc */
.sortable-ul {
	padding: 0;
	list-style: none; 
}
.divider {
	 height: 1px;
	 width:100%;
	 overflow: hidden;
	 background-color: #e5e5e5;
}
.bottom_divider {
	margin-bottom: 5px;
}
/* icon row */
.dropdown {
	/* RS 2020-04-25 (trunk): Removed. Adds extra gap between LI items and bottom of the UL
	margin-bottom: 5px;
	*/
}
.dropdown-toggle {
	color: #aaa;
}
.dropdown-toggle:hover {
	color: #000;
}
.doc_icon_toggle_div {
	float: right;
	text-align: right;

	/* TH 2019-03-11 (b240, upgrade bs3 to 4): Added width 100% */
	width:100%;
}
.doc_icon_div {
	float: right;
	text-align: right;
}
.doc_icon {
	display: block;
	font-size: small;
}
/* img row */
/* detail row */
.doc_title {
	font-size: larger;
	white-space : nowrap;
	overflow : hidden;
	text-overflow : ellipses;
}
.doc_file_size {
	color: #666;
}
/* detail toggle row */
.toggle_details {
	font-size: xx-small;
	color: #aaa;
	text-decoration: none; 
	text-align: center; 
	display: block;
}
.toggle_details:hover {
	color: #000;
	text-decoration: none; 
}

.doc_image_div {
	margin : auto;
}

.avatar_image_div {
	float: left;
	background-repeat: no-repeat;
	background-position: top center;
	margin: 0 1em 1em 2em;
	border-radius: 50%;
	border: 1px solid whitesmoke;
	width: 80px;
	height: 80px;
}

/* TH 2020-04-20 (b334, issue 723): Added. Used for CTButtonBar to convert table to divs
https://wisdmlabs.com/blog/responsive-tables-using-css-div-tag/ */
.div-table {
	display: table;
}

.div-table-caption {
	display: table-caption;
	text-align: center;
	font-size: 1.5em;
	font-weight: bold;
}

.div-table-header {
	display: table-header-group;
	background-color: gray;
	font-weight: bold;
}

.div-table-header-cell {
	display: table-cell;
	padding: 10px;
	text-align: justify;
	border-bottom: 1px solid black;
}

.div-table-body {
	display: table-row-group;
}

.div-table-row {
	display: table-row;
}

.div-table-cell {
	display: table-cell;
}

.button-bar-cell {
	white-space:nowrap;
}

/* TH 2020-5-29 (b332, issue 722-38): Added. Few more classes for responsive rubric page */
.rsbuttonplaincontainer {
	margin-right:10px;
}

.rubricactionbar input {
	margin-right:5px;
}

.mediaqueryclass {float:left;}

@media (max-width: 768px) {
	.mediaqueryclass {float:none;}

	.rubricactionbar {
		white-space:normal;
	}

	.rsbuttonplaincontainer {
		margin-right:15px;
	}
}

/* 2023-01-06 (b422, issue 883): Removed. We do show the popover arrow now
.popover .arrow {
	
	/ * TH 2022-06-15 (b407, issue 855): Added important * /
	display: none !important;
} */

/* TH 2022-06-15 (b407, issue 855): Removed. These were added because the popover was
 missing some styling. Figured out how to fix it so no longer needed
.popover {
	z-index: 1000;
	box-shadow: 5px 5px 10px;
}

.popover-body {
	background-color:white;
	padding:5px;
	
}

.popover-header {
	background-color:#eee;
	margin: 0;
	padding:5px;
} */

/* TH 2020-04-23 (b334, issue 723-5): CSS class for the rubric view buttons toggle * /
/* TH 2024-07-25 (b459, issue 929): Removed. Change this to use boootstrap toggles
.rubricviewbtn i{
	color: gray;
	
	/ * TH 2024-07-11 (b399, issue 929): Add css * /
	font-size: 2em;
	vertical-align: middle;
	margin-right:5px;
}
.rubricviewbtn.active i{
	color: limegreen;
} */

/* TH 2020-5-29 (b332, issue 722-45): Added. Make all jquery dialog with max-width95% so that it fit on the phone*/
.ui-dialog {
	max-width: 95%;
}

/* TH 2020-09-09 (b306, Issue 751-4): Added. Jquery ui autocomplete classes, because it doesnt 
 have the class library of autocomplete plugin */
.ui-autocomplete.ui-front {
	max-height: 200px;
	width: 300px;
	overflow-y: auto;   /* prevent horizontal scrollbar */
	overflow-x: hidden; /* add padding to account for vertical scrollbar */
	z-index:1000 !important;
}

.ui-autocomplete li.ui-menu-item {
	margin: 0px;
	padding: 2px 5px;
	cursor: default;
	display: block;
	font: menu;
	background: unset;
	font-size: 12px;
	line-height: 16px;
	overflow: hidden;
}

.ui-autocomplete li.ui-menu-item:nth-child(odd) {
	background-color: white;
}
.ui-autocomplete li.ui-menu-item:nth-child(even) {
	background-color: #eee;
}

.ui-autocomplete li.ui-menu-item .ui-state-active {
	font-weight: normal !important; 
	background: unset;
	background-color: #0a246a;
	color: white;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added class for the quickfeedback div container */
div.rubrowquickfeedback {
	width: 95%;
}

/* TH 2020-09-21 (trunk): Added. On focus class, increase the height of the div, and 
 and the position to absolute so that with the width 90%, it cover the whole screen and not
 just in the cell */
div.rubrowquickfeedback-focus {
	position: absolute;
	font-size: 1.4em;
	left: 2%;
	z-index:1000;
	width: 98%;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. The text area of feedback, the width will be 95% of the div, leaving
 some space for the icon */
textarea.quickfeedbacktextarea {
	width:95%;
	
	/* TH 2024-06-10 (b460, issue 927): Reduce the height of the feedback box */
	/* TH 2024-07-29 (trunk, UI): Increase the height */
	height: 3.2em;
	resize: both;
}

/* TH 2022-08-30 (b413, issue 871): Added. CSS class for the quickfeedback recent link*/
.quickfeedback-recent {
	float:right;

	/* TH 2024-06-10 (b460, issue 927): Remove margin on the recent feedback link
	margin-right:5%; */
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. On focus, float the div left so the icon show right next to the div, 
 and increase the height to match the height of the div */
textarea.quickfeedbacktextarea:focus {
	float:left;
	height: 350px;
	outline: none !important;
	border: 2px solid silver;
}

/* TH 2021-08-26 (b374, issue 812): Added. Css class for the textarea in rubric
 overall feedback */
textarea.overallfeedbacktextarea {
	width:95%; 
	height:150px;

	/* RS 2022-11-16 (b418): removed. It makes the text area hard to see 
	border: none;
	*/

	margin:10px;

	/* RS 2022-11-16 (b418): removed. It is overridden by textarea class
	font-size: 1.2em; 
	*/
}

/* TH 2021-08-26 (b374, issue 812): Added. Css class for the characters counter
 below the textarea, that used to keep track of the characters count the users typed */
div.overallfeedbackcounter {
	width: 95%;
	text-align:right;
	visibility: hidden;
	font-size: 1.5em;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. Class for the icon to close the text area */
div.rubrowquickfeedback-focus i.rubrowquickfeedbackicon-focus {
	color:#666;
	padding: 7px;
	border-radius: 0 7px 7px 0;
	border: 2px solid silver;
	border-left:0;
	background-color: #fafafa;
	position: relative;
	left:-2px;
	top: 15px;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. Class for the counter of character limits */
div.rubrowquickfeedback-focus span.textarea-counter {
	padding:10px;
	background-color:#fafafa;
	float:right;
	margin-right:5%;
	position: relative;
	top:-3px;
	border-radius: 0 0 4px 4px;
	border: 2px solid silver;
	border-top:0;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. on unfocus the css of the feedback div is reverted */
div.rubrowquickfeedback-blur {
	position: initial;
	font-size: 1em;
}

/* TH 2020-09-21 (trunk, issue 722-74): Added. Mediaquery, some customize css for the textarea in smaller 
view port */
@media (max-width: 975px) {
	textarea.quickfeedbacktextarea:focus {
		width:90% !important;
	}

	div.rubrowquickfeedback-focus span.textarea-counter {
		margin-right:10% !important;
	}
}
@media (max-width: 500px) {
	textarea.quickfeedbacktextarea:focus {
		width:80% !important;
	}

	div.rubrowquickfeedback-focus span.textarea-counter {
		margin-right:20% !important;
	}
}

/* TH 2020-08-10 (b344, issue 749-5): Added. New set of css classes to categorized the state of rubric grade
	- scored
	- unscored
	- draft
*/
img.rub-color-scored {
	border-left: 3px solid #99cc00;
}

img.rub-color-draft {
	border-left: 3px solid orange;
}

img.rub-color-unscored {
	border-left: 3px solid red;
}

/* TH 2020-08-10 (b344, issue 749-5): Added. New set of css classes to categorized the state of rubric grade
	- scored
	- unscored
	- draft
*/
.rubicon-status.rub-color-scored {
	color:#99cc00;
}

.rubicon-status.rub-color-draft {
	color:orange;
}

.rubicon-status.rub-color-unscored {
	color:red;
}

span.rubricicon-container .rubicon-status,

/* TH 2023-11-09 (b445, issue 909): Added class for 'a' tag */
a.rubricicon-container .rubicon-status {
	position: absolute !important;
	
	/* TH 2020-12-03 (b353, issue 764-1): Change the Z-index to 1 because the 
	 calendar in gradebook page have z-index 1 and it appear behind the status 
	 icon */
	z-index: 1;
	font-size: 0.8em;
	right: -1px;
	bottom: 2px;
}

/* TH 2023-09-08 (b438, issue 904): Added. Icons for multirater in classroom */
span.rubricicon-container .rubicon-multirater {
	font-size: 1.3em !important;
	color: var(--rs_link);
}

/* TH 2020-08-10 (b344, issue 749-2): Added. New matrix classes UI */
.matrixcreatorattachment {
	font-size: 1.2em;
}

.matrixassessment-container {
	position: relative;
	border-radius: 5px;
	margin-top: 20px;
	border: 1px solid #eee;
	/* min-width: 300px; */
	
	/* TH 2020-10-09 (b344, issue 749-7): increase width to 60% of matrix cell*/
	/* TH 2023-07-18 (b440, issue 901): Increase the size of sections within the matrix cell */
	/* width: 99%; */
	padding: 18px;
	
	/* TH 2024-07-11 (b399, issue 929): Add indentaion */
	margin-left:40px;
}

.matrixassessment-container-full {
	width: 90%;
}

/* TH 2024-07-11 (b399, issue 929): remove the img tag restriction */
.matrixassessment-container .matrixassessment-icon {
	position: absolute;
	top: -15px;
	left: 6px;
	border: 1px solid #eee;
	background-color: white;
	padding: 3px;
	border-radius: 16px;
}

.scroll-button-icon {
	font-size:1.5em;
	text-decoration:none;
	color:silver;
	cursor: pointer;
}

.scroll-button-icon:hover {
	
	/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
	color:var(--rs_link_hover);
}

/* TH 2021-02-26 (b361, issue 779-3): Removed. Moved all scrollable-container to central_s so 
 that they dont apply to print
/ * TH 2020-08-10 (b344, issue 749-6): Added. CSS classes for scrollable table * /
/ * RS 2021-01-24 (trunk): revamped scrollable elements * /
div.scrollable-container {
	max-width: 96vw;
	max-height: 50vh;
	overflow: auto;
	position: relative;
}

.scrollable-container table {
	position: relative;
	border-collapse: separate;
}

.scrollable-container td,
.scrollable-container th {
	padding: 0.25em;
}

/ * consolidate row and column th * /
.scrollable-container thead th,
.scrollable-container tbody th {

	position: -webkit-sticky; / * for Safari * /
	position: sticky;

	/ * Background is needed during scroll, or the text in the header and cell overlay each other.  
		Backgroun-color doesn't work because border-collapse makes the borders disappear when background color is used.
		Use a background image * /
	background: url(/images/pixels/pixelsmoke.gif);

}


/ * top header cells * /
.scrollable-container thead th {
	top:0;  / * column headers need to stay on top * /

	/ * set vertical align to top (needed for curriculum map), and use important to prevent BS from overriding it * /
	vertical-align: top !important;  
}

/ * first header cell (top-left cell) * /
	.scrollable-container thead th:first-child
 {
	left: 0;
	z-index: 100;
}

/ * left cell of each row in body * /
.scrollable-container tbody th {
	left: 0;  / * row headers need to stay on top * /
}

.scrollable-container tbody tr.listitemrow:nth-child(even) .headercol {
	background-color: whitesmoke;
}

.scrollable-container tbody tr.listitemrow:nth-child(odd) .headercol{
	background-color: white;
}
*/

/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_, relationship_0 {  /* not started */
}


/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_1 {

	/* RS 2020-07-26 (trunk): increase yellow border intensity since the thickness is reduced */
	border-color: #ff0; /*yellow */ 
	background-color: #ffe;
}


/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_2 {
	 border-color: #d08aff;  /*purple*/ 
	 background-color: #f9f2ff; /*efdfff;*/
}

/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_3 {  
	border-color: #adff5b;  /* green  66cc00; */ 
	 background-color: #e9ffd2;  /*d5ffd5*/
}

/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_4 {  
	 border-color: #ffb482;  /*orange*/ 
	 background-color: #ffe8d9;
}

/* TH 2020-08-10 (b344, issue 749-6): Adding a second class for table.rubric td to avoid overwriting */
.relationship_5 {
	 border-color: #71c6ff; /*blue*/
	 background-color: #e1f7ff;
}

/* TH 2024-09-13 (b463, issue 932): Added. New cell status "Not Passed" */
.relationship_6 {
	border-color: red;
	background-color: #ffe1e1;
}

.mtxcell-icon {
	font-size:1.5em;
	padding:4px;
}

/* TH 2020-08-10 (b344, issue 749-6): Class to quick access rubric link on matrix page */
.mtxcell-rubassessbtn {
	background-image:url(/images/icons/16/rubric.gif); 
	background-repeat: no-repeat !important; 
	padding-left: 21px !important; 
	padding-top: 2px;
	padding-bottom: 2px; 
	background-position: left center !important;
}

.mtxcell-rubassessbtn > span {
	vertical-align:middle;
}

/* TH 2020-10-07 (b344, issue 749-7): Added. input with search icon */
.input-lefticon input {
	
	/* TH 2023-04-19 (trunk): Added important to make the padding always apply */
	padding-left: 2rem !important; /* needed to place the icon */
	/*margin: 3px;*/ /* margin around the input box */
}

.input-lefticon i {  /* icon element */
	position: absolute; /* move icon into the input box. Don't use relative, it'll push the input box */
	z-index: 2;
	display: block;
	width: 2rem; /* extends the icon to the right into the input box  */
	/*height: 2.375rem;*/
	line-height: 1.9rem; /*keep the icon vertically centered*/
	/* TH 2023-04-19 (trunk): Change the alignment to center */
	text-align: center;
	pointer-events: none;
	color: #aaa;
	
	/* TH 2023-04-19 (trunk): Change font-size */
	font-size: 0.9rem;
}

/* TH 2020-11-17 (trunk): Added. Css class for the alert box to go 
 back to canvas or switch back to admin */
.bottomrightalert {
	position: fixed;
	text-align: center;
	bottom: 5px;
	right: 5px;
	
	/* TH 2024-03-22 (455, UI): Removed. Moved into a different css class 
	background-color: #bd0;
	border-color: #91ab02;
	padding: 10px;
	opacity: 90%;
	font-size: 12pt;
	text-decoration: none;
	border-radius: 15px 0;
	*/
	/*  TH 2022-12-01 (b418, UI): Add Z-index so it stay on top layer of the pages  */
	z-index: 10;
}

/* TH 2024-03-22 (455, UI): Added. css moved from above */
.bottomrightalert > span,

/* TH 2024-03-28 (trunk, UI): Fix the css for the button Switch back to admin */
.bottomrightalert > a {
	display:inline-block;
	background-color: #bd0;
	border-color: #91ab02;
	margin: 5px;
	padding: 10px;
	opacity: 90%;
	font-size: 12pt;
	text-decoration: none;
	border-radius: 15px 0;
}

.bottomrightalert a{
	text-decoration: none;
	font-weight:bold;
		
	/* TH 2024-03-25 (trunk): Change white font to black font */
	color: #555;
}

/*TH 2019-04-30 (b290, issue 634): form backup flag */
.formbackupflag {
	display: inline-block;
	bottom:0;
	position:fixed;
	z-index:150;
	_position:absolute;
	left: 10px;
}

/*TH 2019-04-30 (b290, issue 634): css class that allow drop down menu
 to have sub menus */
.dropdown-submenu {
	position:relative;
}
.dropdown-submenu>.dropdown-menu {
	top:0;
	left:-10rem; /* 10rem is the min-width of dropdown-menu */
	margin-top:-6px;
}

/* rotate caret on hover */
.dropdown-menu > li > a:hover:after {
	text-decoration: underline;
	transform: rotate(-90deg);
} 

/* TH 2024-07-30 (b452, issue 930): Added. Caret icon after the menu
.nav-link > .caret::after {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 0.255em;
	vertical-align: 0.255em;
	content: "";
	border-top: 0.3em solid;
	border-right: 0.3em solid transparent;
	border-bottom: 0;
	border-left: 0.3em solid transparent;
}

/* TH 2021-11-02 (b382, issue 816): Added. Class for the autosave status on 
 the autosave list */
.formautosavedstatus {
	width:8px;
	height:8px;
	border-radius:50%;
	display:inline-block;
}

/* Reverse the color between the 2 autosaves state */
.formautosaved_s{
	
	/* TH 2021-08-23 (b367, Issue 791): Consolidate. Replace color with variable */
	background-color:var(--rs_blue);
}

.formautosaved_a{
	background-color:#99cc00;
}

.formautosaved_d{
	background-color:orange;
}

/* NW 2020-11-11 (b342, Issue 338): Added. Assessment mass update sections. */
.massupdatesection {
	margin-left: 30px;
}

/* TH 2021-02-23 (b361, issue 779): Added. Icon indicate class/course in imported */
.importedclasscourseicon {
	margin-left: 1em;
	color:gray;
	cursor:pointer;
}

/* TH 2021-02-23 (b361, issue 779): Added. Class for the title in competency grid, allow then to
 be compact if the title is too long */
.competencytitle-compact{
	white-space: nowrap;
	overflow: hidden;
	text-overflow:ellipsis;
	text-align: center;
	margin-right:1em;
	margin-left:1em;
}

/* RS 2021-02-09 (trunk): Modified BS Alerts used in CTAlert */
.alert-icon-container, .alert-text-container {
	display: table-cell;
	vertical-align: middle;
}

.alert-icon-container {
	min-width: 40px;
	text-align: center;
	font-size: 1.4rem;
	color: white;
	background-color: rgba(0, 0, 0, 0.25);
	padding: .2rem;
	
	/* TH 2025-01-15 (trunk, issue 943): BS5 migration */
	border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

.alert-text-container {
	color: #2d3a51;
	font-size: 1.2em;
	padding: 1.3em;
	width: 100%;
}

.icon::before {
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;

	margin-left: .5em;
	margin-right: .5em;

	font-family: "Font Awesome 5 Pro";
	/*font-family: "FontAwesome";*/
}

.alert-icon-light::before, .alert-icon-dark::before,
.alert-icon-primary::before 	{content: "\f0eb";} /*lightbulb*/
.alert-icon-secondary::before 	{content: "\f0eb";} /*lightbulb*/
.alert-icon-success::before		{content: "\f00c";} /*Check*/
.alert-icon-danger::before		{content: "\f00d";} /*x*/
.alert-icon-warning::before		{content: "\f071";} /*Exclamation*/
.alert-icon-info::before 		{content: "\f129";} /*Info*/

.alert-icon-container-light		{background-color:#42ae42;}
.alert-icon-container-dark	 	{background-color:#42ae42;}
.alert-icon-container-prmiary 	{background-color:#42ae42;}
.alert-icon-container-secondary {background-color:#d33534;}
.alert-icon-container-success 	{background-color:#42ae42;}
.alert-icon-container-danger 	{background-color:#f00; /*d33534;*/}
.alert-icon-container-warning 	{background-color:#ff5400;}
.alert-icon-container-info	 	{background-color:#3592ff;}

.alert button.close,

/* TH 2023-01-06 (b422, issue 883): Added popover close button class */
.popover button.close {
	/* TH 2021-07-07 (trunk): Removed. Button used to be affected by ctjqueryload
	and we needed this margin for the close button to line up
	After we made some changes to ctjqueryload this margin is not needed anymore and instead screw up the lining
	margin: 0.45rem 1rem;*/
	opacity: 0.75;
}

.alert button.close:hover,

/* TH 2023-01-06 (b422, issue 883): Added popover close button class */
.popover button.close:hover {
	opacity: 1;
}
/* *** End Alerts *** */

/* TH 2021-03-11 (b362, issue 780): Added. Fixed width for the edtiable text area */
.editable-textarea {
	min-width: 400px;
}

/* NW 2021-02-16 (b357, Issue 338): Added. Borders for the table cells in rubric reports. */
.rubrptcellborder_v_top, .rubrptcellborder_v_middle, .rubrptcellborder_v_bottom,
.rubrptcellborder_h_first, .rubrptcellborder_h_middle, .rubrptcellborder_h_last {
	border-style: solid;
	border-color: orange;
}

.rubrptcellborder_v_top, .rubrptcellborder_v_middle, .rubrptcellborder_v_bottom {
	border-width: 0px 1px;
}

.rubrptcellborder_h_first, .rubrptcellborder_h_middle, .rubrptcellborder_h_last {
	border-width: 1px 0px;
}

.rubrptcellborder_v_top {
	border-top-width: 1px;
}

.rubrptcellborder_v_bottom {
	border-bottom-width: 1px;
}

.rubrptcellborder_h_first {
	border-left-width: 1px;
}

.rubrptcellborder_h_last {
	border-right-width: 1px;
}

/* TH 04-23-2021 (trunk, issue 790): Add some new CSS for the etor assignments */
.assignetor-count{
	float: right;
	font-weight: normal;
}

.assignetor-cblabel{
	/* use important to override BS4 display: inline-block */
	display: block !important;
	text-align: center;
	font-size:1.2em;
}

/* TH 2021-06-18 (b368): Added. CSS for lazyloader loading icon */
.lazyload-loading {
	text-align: center;
	margin: 100px auto;
	color: orange;
	font-size: 4em;
}

.page-loader {
	text-align: center;
	margin: 100px auto;
	color: gray;
	font-size: 2em;
}

.page-loader i {
	/* TH 2024-10-18 (trunk): Removed the padding top. This make the icon wobble when it spin
	padding-top:6px;  / *needed to keep the icon centered* /
	*/
	color: var(--rs_blue);
}

/* TH 2021-06-30 (trunk): Added. CSS class for the div that we want to hide
 on rubricgrade page on load */
.rubricgrade-hidden,

/* TH 2024-03-19 (trunk, issue 921): Added. New class for the assessment list page */
.assessmentlist-hidden {
	visibility: hidden;
	opacity:0;
	transition:visibility 0.5s linear,opacity 0.5s linear;
}

/* TH 2021-06-30 (trunk): Added. Css for when we display the hidden element, it 
 add some animation giving it a fade effect */
.rubricgrade-show,

/* TH 2024-03-19 (trunk, issue 921): Added. New class for the assessment list page */
.assessmentlist-show {
	opacity: 1;
	transition:visibility 0.5s linear,opacity 0.5s linear;
}

/* TH 2021-07-02 (b371, issue 800): Added. Css for docview div where we increase the font size
 of txt content */
.docview-text-file {
	font-size: 1.3em;
	word-wrap: break-word;
	white-space: pre-wrap;
}

/* TH 2021-07-12 (b372, issue 802): Added. Color for the clock on assessmentlist  */
.clock_color_blue {
	color:#1d99ec !important;
}

.clock_color_green {
	color:#6fa23b !important;
}

.clock_color_red {
	color:red !important;
}

/* TH 2021-08-27 (trunk): Added. Css class for the gradebook table,
 this allow us to have better looking table header */
.gradebook-table th{
	background: url(/images/pixels/pixelsmoke.gif);
}

/* TH 2021-08-27 (trunk): Added. Css class for the inputbox in the gradebook,
 making them somewhat responsive */
input.input-grade {
	min-width: 3em;
	width: 40%;
	margin:0 !important;
}

input.input-gradenote {
	min-width: 8em;
	width: 90%;
}

/* TH 2021-09-30 (b384, issue 820): Added. Css class for hardcoded style in etee list page */
.evaluatee_assessment {
	clear:both;
	margin-top: 2px; 
	
	/* TH 2025-01-23 (b472, issue 945): Change the padding to reduce the amount of white space */
	padding: 20px 5px 5px 5px;
	border-bottom: 1px solid white;
}

/* TH 2025-01-23 (b472, issue 945): Removed
.evaluatee_assessment_tableview {
	margin: 20px 0 0 20px;
} */

.assessments_container{
	border: 1px solid silver; 
	background-color: #f5f5f5;
}

/* TH 2021-10-18 (b382, issue 816): Added. Classes for the toogle label in 
 matrix/rubric */
.toggle_on {
	font-weight: bold;
	border: 1px solid whitesmoke;
	border-bottom: 3px solid orange;
	padding: 3px;
	color: #4682b4;
	border-radius: 5px 5px 0 0;
}

.toggle_off {
	font-weight: normal;
	background: whitesmoke;
	color: gray;
	border: 1px solid whitesmoke;
	padding: 3px;
	border-radius: 3px 3px 0 0;
}

/* TH 2021-10-29 (b382, issue 816): Added. Class for the archive, autosave list */
li.revision-autosave {
	margin: 10px;
}

/* TH 2021-11-02 (b382, issue 816): Added. Make the archive font size bigger 
 and the autosave font size smaller if it's under an archive */
li.revision-eval {
	font-size: 1.2em;
	
	/* TH 2021-11-05 (b382, issue 816): Change the margins of the list item */
	margin: 10px 0 10px 0;
}

li.revision-eval li.revision-autosave {
	font-size: 0.8em;
}

/* TH 2021-11-30 (b387, issue 826): Added. Div css for the javascript debugger, use to 
 get debug infomation in the timeout development */
.jsdebugger_div {
	position: fixed;
	bottom: 0;
	width: 400px;
	height: 200px;
	overflow: scroll;
	/* TH 2021-09-03 (trunk): Change background color and padding */
	/* TH 2021-09-29 (b382, issue 816): Add transparency */
	background-color: rgba(255, 255, 255, .94);
	z-index: 1000;
	border-bottom: 3px solid white;
	padding: 7px;

	/* TH 2021-09-29 (b382, issue 816): More padding, add border top */
	padding-top: 15px;
	border-top: 2px solid #ccc;
}

/* TH 2021-12-01 (trunk): Added some padding to the recipient table */
.tbl_recipient .recipientrow td:nth-child(2) {
	padding:10px;
}

/* TH 2021-12-17 (b389, issue 829): Added. Class to add linebreak to table
 which can be export to excel */
span.rslinebreak {display: block;}

/* TH 2021-12-22 (b389, issue 829-WL5): Give a padding the the row/criteria that's under 
 a section divider */
/* TH 2024-03-07 (b454, issue 918-6): Only add padding to the div inside criteriaundersection */
.criteriaundersection > .cell-collapsible {
	padding-left:15px;
}

/* TH 2022-01-11 (b394, issue 834): Classes to add to x-editable input, which will attach an
 edit icon, giving a more clear indication that the user can click on the input to edit it */
.editable-icon-before::before, 
.editable-icon-after::after {
	content: '\f044';
	font-family: FontAwesome;
}

.editable-icon-before::before {margin-right:5px;}

.editable-icon-after::after {margin-left:5px;}

/* TH 2021-08-23 (b367, Issue 791): Add css for rubricmap input icons */
.rubricmap-input::-webkit-outer-spin-button,
.rubricmap-input::-webkit-inner-spin-button {
	/* display: none; <- Crashes Chrome on hover */
	-webkit-appearance: none;
	margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.rubricmap-input[type=number] {
	-moz-appearance:textfield; /* Firefox */
}

/* TH 2022-03-23 (b401, issue 842-2): Added class for the quiz questions pins */
.quizquestion_answered {
	color: #03cd03;
	position: relative;
	top: 7px;
	z-index: 100;  
}

.quizquestion_read {
	color : red;
	position:relative; 
	top: 7px;
	z-index: 100;  
}

/* TH 2024-07-11 (b399, issue 929): Add Style the sidebar - fixed full height */
.matrixcell-sidebar {
	position: sticky;
	position: -webkit-sticky;
    display: block !important;
	background-color: white;
	z-index: 1;
	overflow-x: hidden;
	padding-top: 16px;
	border-right: 1px solid #eee;
	width: 100%;
	top:0;
}

/* Style sidebar links */
.matrixcell-sidebar a {
	padding: 16px 10px 16px 10px;
	text-decoration: none;
	font-size: 20px;
	color: #555 !important;
	display: block;
	text-align:center;
}

.matrixcell-sidebar a.section_selected {
	background-color:var(--rs_link);
	color:white !important;
}

/* TH 2024-07-22 (b399, issue 929): Added. Class for the selected section in the cell */
.matrixcell-contents div.section_selected {
	webkit-box-shadow: 0px 0px 10px #555;
    box-shadow: 0px 0px 10px #555;
	transition: box-shadow 0.3s ease-in-out;
}

.matrixcell-sidebar a > i {
	font-size:29px;
	height: 34px;
	display: block;
}

.matrixcell-sidebar a > span {
	font-size: clamp(8pt, 1vw, 10pt);
}

/* Style links on mouse-over */
.matrixcell-sidebar a:hover {
	color: white !important;
	text-decoration:none !important;
	background-color: #555;
}

.matrixcell-sidebar a.section_selected:hover {
	color:#0099ff;
}

.matrixcell-sidebar a > span.submissioncount {
    font-size: 0.6rem;
    text-align: right;
	white-space: nowrap;
}

.matrixcell-sidebar.no-iframe-scroll {
	position: absolute;
	top:unset;
	padding-top: 32px;
}
/* Add media queries for small screens (when the width of the screen is a a little less than medium, change the icon sizes */
/*
@media screen and (max-width: 873px) {
	.matrixcell-sidebar a > i {
		font-size:20px;
		height: 23px;
		display: block;
	}
} */

a.anchor {
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
}

/* TH 2022-05-05 (b402, issue 849): Added. css for the Access code in gradebook */
.gdb_accesscode_input .editable-input > input {
	width: 15ch !important;
}

.gdb_accesscode_input {
	display:inline-block;
	margin-right:15px;
	margin-left:3px;
	border-bottom: 1px dashed silver;
	padding:5px;
	min-width:100px;
	min-height:19px;
}

/* TH 2022-06-15 (b407, issue 855): Added css for the dropdown button color */
.popupmenu-dropdown .dropdown-toggle > i {
	
	/* TH 2023-05-08 (trunk): Change the color becuase the gray make it looks disabled */
	color: var(--rs_link);
}

.popupmenu-dropdown .dropdown-toggle.btn > i {
	color: inherit !important;
}

/* TH 2022-06-30 (b407, issue 854): Added class for the chart container */
.rschartcontainer {
	width:0;
	box-shadow: 5px 5px 5px #ddd;
	margin-bottom: 5px;
	max-width: 92vw;
	padding: 10px;
	border: 1px solid whitesmoke;
}

.graphDiv {
	margin-bottom: 20px;
}

/* TH 2022-06-30 (b407, issue 854): Resizable container class, allow a div
 to be resize by the user */
.resizeable {
	overflow: auto;
}

.resizeable.both {
	resize: both;
}

.resizeable.vertical {
	resize: vertical;
}

.resizeable.horizontal {
	resize: horizontal;
}

/* TH 2022-07-21 (b411, issue 864): Added. Class for the bell notification icon */
/* .bell-notification, */
.bell-notification > i {
	color:var(--rs_link) !important;
}

/* TH 2024-07-11 (b399, issue 929): apply css to the icon */
.bell-notification.inherit > i,
.bell-notification > i.inherit{
	color: #888 !important;
}

/* TH 2022-07-21 (b411, issue 864): Added. Css for the ajax flash message box */
.ajaxsuccessmsg {
	font-family: verdana, arial, helvetica, sans-serif !important; 
	background-color: white !important;
	color: #666 !important;
	z-index: 1000;
	overflow: visible;
	bottom: -35px;
	white-space: nowrap;
	padding: 5px;
	border: 1px solid #666;
	left: -25px;
	display:none;
	position:absolute;
}

.matrixcellstatus-text span{
	font-size:0.65rem;
}

.cell_window {
	z-index: 1000;
}

/*RS 2022-08-22 (b414, issue 870): BEGIN Stepper and step circle */
.stepper {
	display: inline-block;
}

.step-circle,	/* standalone step counter */ 
.stepper .step-num /* Stepper step counter */
{	
	border-radius: 50%;
	/*RS 2022-11-24 (b418, UI): changed color, background color and padding */
	/*color: white;*/
	text-align: center;
	font-size: 1.3em;
	display: inline-block;
	/*padding: .2em 0 0 0;*/
	margin: 0 5px;
	background-color: white;
}

/* standalone step */
.step-circle {
	/*RS 2022-11-24 (b418, UI): changed to px to keep them round */
	width: 35px;
	height: 35px;
	/*padding: .5%;*/

	/*RS 2022-11-24 (b418, UI): removed background color and added a border instead*/
	/*background-color: silver;	*/
	border: 1px solid #ddd;
}

/* Stepper step counter */
.stepper .step-num {	
	border-radius: 50%;
	width: 1.7em;
	height: 1.5em;
	background-color: silver;
}

/* TH 2022-11-16 (b418): Added class for the instructions steps */
.step-vertical {
	border: 1px solid #aaa;
	background-color: whitesmoke;
	border-radius: 5px;
	padding: 10px;
	display: flex;
	margin-top: 20px;
	font-size: 1.4em;
	max-width:95%;
}

.step-vertical .step-title {
	margin:auto 0;
}

.step-description {
	margin:10px 20px;
	font-size:1.2em;
}

.step-vertical .step-count{
	padding-top:5px;
	width: 35px;
}

.stepper .step-caption {
	font-size: 1.3em;
	display: inline-block;
	margin: 0 8px;
	color:  gray;
	margin-right: 2em;
}

.stepper .step-num.active {
	background-color: var(--rs_blue);
	color:  white;
}

.stepper .step-caption.active {
	color: var(--rs_blue);
}
/*RS 2022-08-22 (b414): END Stepper and step circle */

/* RS 2022-08-31 (b415, ui): use in conjuction with font awesome for timepicker */
.rstimepickericon {
	padding: .3em;
	color: gray;
}

/* RS 2022-09-06 (trunk, ui): added for xsite gallery */
table.xsitegallery td {
	border: 1px solid whitesmoke;
	font-size: 1.2rem;
	display: block;
	width: 120px;
	text-align: center;
	height: 120px;
	vertical-align: middle;
	display: table-cell;
}

table.xsitegallery a {
	text-decoration:none;
}

/* TH 2022-10-06 (b416, issue 875): Added. Css class for the toggle icon */
/* TH 2024-03-26 (trunk): Change the color of the toggles */
.publish-toggle > i.fa-check {
	color: var(--rs_toggleswitch_on);
}

.publish-toggle > i.fa-ban {
	color: var(--rs_toggleswitch_off);
}

/* TH 2022-10-17 (b414, issue 877): Added css for instructions */
.instructions {
	margin: 1em 3em 1em 3em;
	font-size: 1.5em;
	color: #555;
	max-width: 800px;
}

/* TH 2022-10-19 (b414, UI): Css for the filter menu in batch assessment */
.filter-sidebar {
	height: 100%;

	/* TH 2023-10-30 (trunk): Change width to min-width so that it can expand if filter title is too long */
	min-width: 220px;
	z-index: 1;
	top: 0;
	left: 0;
	overflow-x: hidden;
	transition: 0.5s;
}

.filter-sidebar.active {
	width: 220px !important;
}

.filter-sidebar.active > .filter-content{
	display:block;
}

.filter-sidebar a {
	text-decoration: none;
	display: block;
	transition: 0.3s;
}

.filter-toggle{
	display:none !important;
	font-size:2em;
	margin-right:10px;
}

.filter-toggle::before {
	content: '\f054';
	font-family: FontAwesome;
}

.filter-sidebar.active > .filter-toggle::before{
	content: '\f078';
	font-family: FontAwesome;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-width: 990px) {
	.filter-sidebar{
		width: 30px;
		
		/* TH 2024-03-19 (trunk, issue 921): Added. unset the min-width on small window size */
		min-width: unset;
	}

	.filter-content{
		display:none;
	}

	.filter-toggle{
		display:block !important;
	}
}

/* TH 2022-11-14 (Issue 878, b418): BEGIN classes for the details and summary tags (expand collapse) in reshareeditc */

/* Class for <details> tag, add silver border */
details.resshare {
	border-top: 1px solid silver;
}

/* Add hover background color to gray */
details.resshare:hover {
	background-color: #f2f5f9;
}

/* Class for <summary> tag (the header).  Bigger font-size and weight */
summary.resshare {
	color: #888;
	font-size: 1.2rem !important;
	padding: 1em !important;
	font-weight: 700;
}

/* class on the content of the expand collapse. Add padding and, font-size and color */
.resshare-description {
	color: #333;
    padding: 1em 4em 2em 2em;
    font-size: 1.2em;
}

/* TH 2023-05-04 (b432, UI): css for the invite descriptions */
.resshare-description > ul > li {
	margin-bottom: 15px;
}

.resshare-detailscontent {
	max-width:900px;
}
/* TH 2022-11-14 (Issue 878, b418): END classes for the details and summary tags (expand collapse) */

/* TH 2023-02-14 (trunk): */
.cfchart_chartcontainer > div {
	max-width: 99% !important;
}

/* TH 2023-03-23 (b426, issue 889): Added. css for the row abbrev input box */
.rubrow-abbreviation-inputdiv {
	padding-left: 5px;
    margin-top: 5px;
}

/* TH 2024-07-11 (b399, issue 929): Added. New matrix classes UI */
.matrixcreatorattachment{
	font-size: 1.4em;
}

.matrixcellattachments > input,
.matrixcellattachments > a {
	margin-bottom:5px !important;
    margin-right: 1em;
    font-size: 0.8rem;
}

.matrixcellcourseworks {
	margin-left: 24px;
	margin-top:10px;
}

.matrixcelldescription,
.attachable_setting_notes,
.matrixdescription {
	padding:20px;
	margin:10px;
	border-radius: 10px;
	background:#fafafa
}

/* TH 2024-08-02 (b452, issue 930): Added. Set the width to line up description and 
 matrix cell boxes */
.matrixcelldescription {
	width: 90%;
}

.matrixcell-contents {
	margin-left: 10px;
	width: 90%;
}

.matrixdescription {
	margin-left:0 !important;
    font-size: .8rem;
	width: 99%;
}

.attachable_setting_notes {
	margin-left:5px;
	font-size: 1.1em;
}

/* TH 2023-06-28 (trunk, issue 900): Added. Css for the bootstrap type ctitemselector */
.itemselector_insidelink {
	float:right;
	margin-left:15px;
}

.active .itemselector_insidelink {
	color:white;
}

.itemselector_search {
	
	/* TH 2024-09-13 (b463, issue 932): Make the width smaller because the search box was pushed out
	 of the dropdown */
	width: 90%;
	margin: 5px 15px !important;
}

.itemselector_content {
	max-height:400px;
	overflow-y:auto;
	line-height: 1.5;
}

.itemselector_header {
	font-weight: bold !important;
}

/* TH 2023-07-18 (b440, issue 901): Added. Css for the group listing for assessments */
.group-item {
	padding-bottom: 5px;
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
}

/* TH 2023-11-10 (b445, issue 909): Css for the multirater div */
#related_assessment_div td{
	font-size:1.2em;
}

#related_assessment_div td.ast_title{
	max-width: 255px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* TH 2024-01-03 (b446, issue 912): Class for the "out of" text under CTMicrograph */
.moderate_outof {
	font-size: 1.4em;
	color: black;
}

/* TH 2024-01-03 (b446, issue 912): Added class for the label for moderated assessment on top
 of the rubric */
.moderate_above_rubric {
	color:var(--rs_blue);
	padding: 15px; 
	border: 2px solid var(--rs_blue);
	font-size: 2em; 
	font-weight:bold; 
	text-align: center;
	margin: 15px;
	border-radius: 4px;
	text-transform: capitalize;
}

/* TH 2024-01-03 (b446, issue 912): Added. Class for the button on the matrix cell for moderating */
.rubcell-consensusbutton {
	text-align: center;
	margin-top: 15px;
	min-height: 35px;
	margin-bottom: 15px;
}
.rubcell-consensusbutton > a {
	display:none;
	font-size:1.2em;
	margin-top:5px;
}

.rubcell-consensusbutton > div {
	padding: 5px;
	width:95%;
	color: white;
}

.rubcell-consensusbutton > div > i {
	font-size:2em;
}

.rubcell-consensusbutton > div > span {
	font-size: 1.4em;
}

/* ----------------------------------------------
  TH 2024-07-30 (b452, issue 930): Top menu CSS 
  --------------------------------------------- */
#topMenuContainer {
	position: sticky;
	top:46px;
	height: 95vh;
	
	/* TH 2024-09-09 (trunk, UI): Change width to flex because seems like the width is not respected 
	 in a flexbox and it will shrink the width */
	flex: 0 0 170px;
	z-index:99;
}

#topMenuContainer .topmenuarea {
	padding : 0;
	
	/* TH 2024-08-29 (trunk, UI): Add padding top to line up with sub menu */
	/* TH 2024-09-23 (trunk, UI): Added more margin so it fall below the submenu*/
	/* padding-top: 10px;*/
}

#topMenuContainer #menu-main > li > a {
	padding: .8em 1em;
	
	/* TH 2024-09-09 (trunk, UI): Added margin */
	margin-top: 5px;
}

#topMenuContainer #menu-main > li.active > .nav-link {
	/* TH 2024-09-09 (trunk, UI): Remove. The contrast is not enough
	text-decoration: underline;

	/ * TH 2024-09-06 (trunk, UI): Add color orange to the selected menu * /
	color: var(--rs_orange)*/
	
	/* TH 2024-09-09 (trunk, UI): Change to add background for active menu */
	background-color: #666;
}

/* TH 2024-09-30 (trunk, UI): Add the not.active attribute so it does not apply to the 
 current selected menu */
/* TH 2025-01-15 (trunk, issue 943): BS5 migration */
#topMenuContainer #menu-main > li:not(.active) > .nav-link.show {
	background: #fafafa;
    color: black;
}

/* TH 2024-08-02 (b452, issue 930): Added. Css for the submenu dropdown */
#topMenuContainer #menu-main > li .dropdown-menu {
	border-radius: 0 !important;
	border-left: none !important;
	box-shadow: gray 10px 10px 10px;
    background-color: #fafafa;
	position: absolute !important;
	top: 4px;
    margin-left: 0px;
}

#topMenuContainer #menu-main > li .dropdown-menu > .dropdown-item {
	padding: 0.25rem 1rem;
}

#topMenuContainer #menu-main > li .dropdown-menu > .dropdown-item:hover {
	color: white;

	/* TH 2024-09-06 (trunk, UI): Fix selected submenu turns white when we hover over it */
	background-color: #444 !important;
}

.topmenu-bg-dark {
	background: #444 !important;
}

/* TH 2024-09-23 (trunk, UI): Remove top and bottom padding */
#submenubar-container {
	padding: 0 1rem;
	min-height: 1px;
}

/* TH 2024-08-02 (b452, issue 930): Added css for the submenu changes */
#submenubar-container span.navbar-text {
	align-self: center;
	padding: 0 !important;

	/* TH 2024-09-06 (trunk, UI): Navbar Text needs to be large */
	font-size: 1.5em;
}

#nav-submenubar .nav-pills .nav-link {
	border-radius: 0 !important;
}

#topMenuContainerBottomSection {
	position: absolute; 
	bottom:8px;
	width:100%;
	text-align:center;
	color:white;
}

#topMenuContainerBottomSection > div.mainmenusocialbar {
	display:flex;
	align-items: center;
	margin-bottom: 10px;
	background-color: gray;
    padding: 5px 0;
}

#topMenuContainer.collapsed #topMenuContainerBottomSection > div.mainmenusocialbar {
    padding: 10px 0;
}

#topMenuContainerBottomSection > div > div,
#topMenuContainerBottomSection > div > a {
	display: block;
	flex-grow: 1;
    flex-basis: 0;
}

#topMenuContainerBottomSection > div a {
	font-size: 1.25rem;
	color: white;
}

#topMenuContainerBottomSection > div a:hover {
	color: var(--rs_link_hover);
}

#topMenuContainer #topMenuToggle {
	padding-top: 5px;
	text-align: center;
	display: block;
	font-size: 1.5rem;
	color: white;
}

/* TH 2024-08-29 (trunk, UI): Change the toggle icon to arrow icon */
#topMenuContainer #topMenuToggle > i:before {
	content: "\f33e";
}

/* TH 2024-09-30 (trunk, UI): Added. The css to make the current selected menu, dropdown embedded  on
 the main menu instead of showing on hover 
 position: static !important; make it show below the main menu, display:block make it show all the time. 
 Box-shadow:none; remove the shadow that we show for the normal dropdown menu
 background-color: #666; Give it a different background
 */
#topMenuContainer.expanded #menu-main > li.active .dropdown-menu {
	position: static !important;
	display: block;
	box-shadow: none;
	background-color: #666;
}

/* TH 2024-09-30 (trunk, UI): Since the background for embedded submenu is gray, change the font color to white */
#topMenuContainer.expanded #menu-main > li.active .dropdown-menu .dropdown-item:not(.active) {
	color: #fff;
}

/* TH 2024-09-30 (trunk, UI): Same css as above, the reason we have this css because our main menu can be 
 expanded or collapsed manually or automatically via the size of the screen. Not sure if we have a way to 
 consolidate these 2 css in 1 line or not. */
@media (min-width:768px) {
	#topMenuContainer:not(.collapsed) #menu-main > li.active .dropdown-menu {
		position: static !important;
		display: block;
		box-shadow: none;
		background-color: #666;
	}

	#topMenuContainer:not(.collapsed) #menu-main > li.active .dropdown-menu .dropdown-item:not(.active) {
		color: #fff;
	}
}
/*
#topMenuContainer ul.topmenubar  > li.nav-item > div.dropdown-menu {
	max-width: 160px;
} */

/* Mobile / Tablet */
/* TH 2020-04-28 (trunk): Reduce some padding between submenus in mobile */
@media (max-width:767px) {
	#topMenuContainer:not(.expanded) {
		
		/* TH 2024-09-09 (trunk, UI): Change width to flex because seems like the width is not respected 
	 	in a flexbox and it will shrink the width */
		flex: 0 0 54px;
	}
	
	/* TH 2024-09-23 (trunk, UI): Added more margin so it fall below the submenu
	#topMenuContainer:not(.expanded) .topmenuarea {
		padding-top:15px;
	}*/

	#topMenuContainer:not(.expanded) #menu-main > li.nav-item {
		max-width: 54px;
		text-align: center;
	}

	#topMenuContainer:not(.expanded) #menu-main > li.nav-item i {
		font-size: 1.25rem;
	}
	
	/* TH 2024-09-09 (trunk, UI): Remove the padding for collapsed menu */
	#topMenuContainer:not(.expanded) #menu-main > li > a {
		padding: 0.5rem;
	}

	#topMenuContainer:not(.expanded) #topMenuContainerBottomSection > div {
		flex-direction: column;
		gap: 10px;
	}

	#topMenuContainer:not(.expanded) #topMenuToggle {
		position: static;
		padding-top: 5px;
		text-align: center;
		display: block;
	}
	
	/* TH 2024-08-29 (trunk, UI): If the menu is collapsed, change to arrow point to the right */
	#topMenuContainer #topMenuToggle > i:before {
		content: "\f343";
	}
}

/* TH 2024-08-29 (trunk, UI): If the menu is collapsed, change to arrow point to the right */
#topMenuContainer.collapsed #topMenuToggle > i:before {
	content: "\f343" !important;
}

/* TH 2024-08-29 (trunk, UI): If the menu is expanded, change to arrow point to the left */
#topMenuContainer.expanded #topMenuToggle > i:before {
	content: "\f33e" !important;
}

/*Repeating the same css above for manual collapsed */
#topMenuContainer.collapsed #menu-main > li.nav-item > .nav-link > span {
	display: none !important;
	}
	
#topMenuContainer.expanded #menu-main > li.nav-item > .nav-link > span {
	display:inline !important;
}

#topMenuContainer.collapsed #menu-main > li.nav-item > .nav-link > i {
	display: inline !important;
}

#topMenuContainer.collapsed {
	
	/* TH 2024-09-09 (trunk, UI): Change width to flex because seems like the width is not respected 
	 in a flexbox and it will shrink the width */
	flex: 0 0 54px;
}

/* TH 2024-09-23 (trunk, UI): Added more margin so it fall below the submenu
#topMenuContainer.collapsed .topmenuarea {
	padding-top:15px;
}*/

#topMenuContainer.collapsed #menu-main > li.nav-item {
	max-width: 54px;
	text-align: center;
}

#topMenuContainer.collapsed #menu-main > li.active > .nav-link {
	text-underline-offset: 5px;
}

#topMenuContainer.collapsed #menu-main > li.nav-item i {
	font-size: 1.25rem;
}

/* TH 2024-09-09 (trunk, UI): Remove the padding for collapsed menu */
#topMenuContainer.collapsed #menu-main > li > a {
	padding: 0.5rem;
}

/* TH 2024-08-02 (b452, issue 930): Added css for the icons at the bottom of the main menu */
#topMenuContainer.collapsed #topMenuContainerBottomSection > div {
	flex-direction: column;
	gap: 10px;
}

.topmenuarea {
	height: calc(100vh - 4em);
	align-items: flex-start !important;
}

.topmenubar {
	width: 100%;
}

#xsiteLoginToolbarContainer .navbar.staticmenu {
	padding: 0 1rem;
}

.publish-label {
	font-size:8pt;
	color: #555;
}

/* TH 2024-03-07 (b454, issue 918-6): Added css for the expand collapse icon */
table.rubric > tbody > tr > td .tdRow_ExpandCollapseBtn {
	text-decoration:none;
	font-size:1.2em;
	color:#aaa;
}

/* TH 2024-07-11 (b399, issue 929): Add new css for the expandcollapse icon */
div.rub-cell-row > div.rub-cell-title .tdRow_ExpandCollapseBtn {
	text-decoration:none;
	font-size:1.4em;
	padding-top: 6px;
	margin-right: 5px;
}

table.rubric > tbody > tr > td:first-child .tdRow_ExpandCollapseBtn {
	padding-top: 5px;
	margin-right: 5px;
}

/* TH 2024-03-07 (b454, issue 918-6): Added css for the expand collapse child that has the partial
 collapse */
.expColObjcontent_Partial{
	overflow:hidden;
	position:relative;
}

/* TH 2024-03-19 (trunk, issue 921): Added. New class for the assessment list folder icon */
.assessment_folder {
	color : yellowgreen !important;
}

/* TH 2024-03-19 (trunk, issue 921): Added. New class for the assessment list regular assessment icons */
.assessment_pin_red,
.assessment_document,
.assessment_website {
	color : orange !important;
}

/* ------------------------------------------------------------
   TH 2024-03-19 (trunk, issue 921): Added. New css classes for the UI changes in assessment list
-------------------------------------------------------------- */
table.astlist {
    border: 20px solid whitesmoke;
}
table.astlist tr {
    border: 10px solid whitesmoke; 
}
table.astlist th, table.astlist td {
  padding:20px 10px 20px 10px !important;
}

table.astlist th:first-child, table.astlist td:first-child {
	padding-left:20px !important;
}

/* TH 2024-03-20 (trunk): Aligning top for all the cell in the table, use this instead of adding align="top" to each cell */
table.astlist td {
	vertical-align: top;
}

/* TH 2024-03-20 (trunk): This css override the table sorter icon css and move it in front of the header cell instead of 
 at the end which make it hard to distinguish what cell it belong to in a collapsed table  */
table.astlist.tablesorter-bootstrap thead th.tablesorter-header {
	background-position: left 10px center;
}

/* TH 2024-03-20 (trunk): Related to the above css. The first child we want to give it 20 px   */
table.astlist.tablesorter-bootstrap thead th:first-child.tablesorter-header {
	background-position: left 20px center;
}

/* TH 2024-03-20 (trunk): Because we moved the sorting icon to the front, we have to move the label to make space for it. */
table.astlist.tablesorter-bootstrap thead th:not(.sorter-false).tablesorter-header > div {
	margin-left:10px;
}

/* TH 2024-03-20 (trunk): Bootstrap give a margin-bottom to the <label> tag which make the assessment title off centered  */
table.astlist td .assessmentlist_row label {
	margin-bottom: 0;
}

/* TH 2024-03-20 (trunk): Stacking sometime changed the alignment of the icons due to the changed line height and width,
 this css is specific for the click with cog stack icon  */
.clock-cogs {
	line-height : unset !important;
	width: unset !important;
}
.clock-cogs > .fa-clock {
	padding-left:2px;
}

/* TH 2024-03-20 (trunk): Css for the setting icon that is stacked with the clock icon in assessment list */
.clock-cogs > .fa-cog {
	top: 0.7em;
	left: -0.2em;
	font-size: .8em;
	color: #888;
	text-shadow: 1px -1px white;
}

/* TH 2024 (b456, issue 922-1): Added. Css for the button bar to status quick change
 on the matrix page */
div.quickstatus-buttonbar {
	float: right;
	margin-top: 20px;
}

div.quickstatus-buttonbar > a {
	text-decoration: none;
    display: inline-block;
	font-size: 0.8em;
	
	/* TH 2024-12-02 (b468, issue 936): Change the quick status button */
	border-radius: 1.5em !important;
}

div.quickstatus-buttonbar > a.disable,

/* TH 2024-12-02 (b468, issue 936): Added css class */
div.quickstatus-buttonbar > a.disabled {
	background-color: #fafafa;
    opacity: 0.5;
	cursor: default;
}

/* TH 2024-06-11 (trunk): Added. FONT AWESOME GENERIC BEAT animation 
 that is not avaiable in version 5 */ 
.fa-beat {
	animation:fa-beat 5s ease infinite;
}
@keyframes fa-beat {
	0% {
		transform:scale(1);
	}
	5% {
		transform:scale(1.25);
	}
	20% {
		transform:scale(1);
	}
	30% {
		transform:scale(1);
	}
	35% {
		transform:scale(1.25);
	}
	50% {
		transform:scale(1);
	}
	55% {
		transform:scale(1.25);
	}
	70% {
		transform:scale(1);
	}
}

/* TH 2024-06-27 (trunk): css for the (?) for the instruction tooltip on the rubric */
.rubric-instruction a i {
	color: white;
}

.rubric-instruction a i:hover {
	color: var(--rs_link_hover);
}

/* TH 2024-07-11 (b399, issue 929): Added new css for the grid/sidebyside/split matrix view */
.matrix-sidebyside-grid {
    width: 100%;
    display: flex;
	margin-top: 5px;
}

div.matrix-sidebyside-grid > #matrix_separator {
	cursor: col-resize;
    background-color: #dee2e6;
    width: 15px;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

	position: sticky; /* Make it fixed */
    top: 0; /* Align it to the top of the viewport */
    height: 100vh; /* Make it full height */
}

div.matrix-sidebyside-grid > #matrix_separator:hover{
	background-color: #acb6b9;
	cursor: ew-resize;
}

div.matrix-sidebyside-grid > #matrix_separator > div {
	display: flex;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
	height: 100%;
}

div.matrix-sidebyside-grid > #matrix_separator > div > i {
	
	/*TH 2024-07-22 (b399, issue 929): Change color to gray */
	color: gray;
    -webkit-text-stroke-width: .5px;
    -webkit-text-stroke-color: #aaa;
    font-size: 14px;
}	

div.matrix-sidebyside-grid > .matrixCellContainer {
	width: 80%;
    min-height: 80vh;
    min-width: 10px;
	border: 1px solid whitesmoke;
}

div.matrix-sidebyside-grid > .rubContainer {
	width: 20%;
    min-width: 10px;
	border: 1px solid whitesmoke;
	position: sticky;
	top: 0;
}

.matrixcellsectionheader {
    padding: 1rem 0.4rem !important;
}

.matrixcellsectionheader a {
	color: var(--rs_sectiontitle_gray) !important;
	font-size: 1rem;
}

.matrixcellsectionheader a:hover {
	color: var(--rs_link_hover) !important;
}

ul.mtx-attachments {
	padding-left: 15px;
    margin-left: 0;
    list-style-type: none;
    padding-bottom: 10px;
	background: white;
  	border:1px solid whitesmoke;
}

/* TH 2024-08-02 (b452, issue 930): Remove the parent relationship */
ul.mtx-attachments > li.mtx-attachments-list a{
    text-decoration: none;
}

ul.mtx-attachments li:before {
	font-family: 'Font Awesome 5 Pro';
    margin: 0 8px 0 -20px;
	font-weight: 400;
	
	/* TH 2024-08-02 (b452, issue 930): Line up icons and li */
	vertical-align: top;
}

ul.mtx-attachments li {
	margin-top:5px;
	margin-left: 25px; 
}

/* TH 2024-08-02 (b452, issue 930): Css to truncate the text if it's too long for 
 the cell */
ul.mtx-attachments li > div {
	display: inline-block;
    margin-left: -5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

	/* TH 2024-09-25 (trunk): Change the width to 95% because inside alist item it get pushed down */
    width: 95%;
}

/* TH 2024-08-02 (b452, issue 930): Added css for the section */
ul.mtx-attachments li.mtx-attachments-section a {
	text-decoration: none;
	font-size: 1.2em;
	font-weight: bold;
}

ul.mtx-attachments li.list-26:before {content: '\f00a';} 
ul.mtx-attachments li.list-27:before {content: '\f15c';}
ul.mtx-attachments li.list-44:before {content: '\e06e';}
ul.mtx-attachments li.list-40:before {content: '\f828';}
ul.mtx-attachments li.list-46:before {content: '\f759';}
ul.mtx-attachments li.list-5:before {content: '\f63d';}

/* TH 2024-07-22 (b399, issue 929): Css for the attachment links */
ul.mtx-attachments li.mtx-attachments-section {
	margin-left: 15px;
	margin-top:10px;
}

/* TH 2024-07-25 (b459, issue 929): Css for the attachment sections and icons */ 
ul.mtx-attachments li.mtx-attachments-section:before {
	font-weight: 300 !important;
	font-family: "Font Awesome 6 Pro" !important;
	font-size: 1.2em;
	
	/* TH 2024-08-02 (b452, issue 930): Line up icons and li */
	vertical-align: top;
}
ul.mtx-attachments li.section-ast:before {content: '\f0ce';}
ul.mtx-attachments li.section-sub:before {content: '\f574';}
ul.mtx-attachments li.section-survey:before {content: '\f759';}

/* TH 2024-08-02 (b452, issue 930): Remove parent child relationship */
ul.mtx-attachments > li.mtx-attachments-list.active a {
	border-bottom: 1px solid silver !important;
}

.rubContainer .row-cells-container .cell-content:has(div.cell-title.active),
ul.mtx-attachments > li.mtx-attachments-list.active {
	filter: brightness(56%);
}

.rubContainer .row-cells-container div[id^='divCell_']:has(div.cell-title.active),
.rubContainer .row-cells-container div[id^='divCell_']:has(li.mtx-attachments-list.active) {
	-moz-box-shadow: 	0px 0px 10px #555;
	-webkit-box-shadow: 0px 0px 10px #555;
	box-shadow: 		0px 0px 10px #555;
}

/* TH 2024-08-02 (b452, issue 930): Remove parent child relationship */
ul.mtx-attachments > li.mtx-attachments-list.active a::after,
.rubContainer .cell-content .container-fluid div.cell-title.active::after {
	content: '\f0da';
	font-family: FontAwesome;
	margin-left: 10px;
	font-size: 1.2em;
	color:gray;
}

#rub-right.rub-listview .rub-cell-row div[id^='divCell_']{
	padding: 0px; 
	float: none; 
	margin-top:5px; 
	margin-left: 15px;
}

#rub-right.rub-columnview .rub-cell-row div[id^='divCell_']{
	padding: 0px; 
	margin-left: 3px;
}

#rub-right.rub-columnview .rub-cell-row > .row-cells-container {
	display: flex;
	margin-left: 10px;
	margin-top: 5px;
}

#rub-right .rub-cell-row > .row-cells-container > div[id^='divCell_'] .cell-content {
	padding: 3px;
}

#rub-right.rub-listview .mtxrow1showhead,
#rub-right.rub-columnview .mtxrow1showhead {
	margin-top:15px;
	margin-left:5px;
}

.mtx-cell-actions > input[type="submit"]{
	border-radius: 1.5em !important;
	margin: 5px;
}

.matrixlegendcontainer {
	margin:auto;
	border-collapse: separate !important;
	margin-bottom: 5px;
	width: 100%;
}

.matrixlegendcontainer td > div {
	width: 100%;
	justify-content: center;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.matrixlegendcontainer td > div > span.d-lg-inline-block {
	width: 55px;
	align-self: center;
}

/* TH 2024-08-02 (b452, issue 930): Added */
.etee-matrixcellinfo td {
	font-size: 1.5em;
}

/* TH 2024-10-04 (b464, issue Issue 935): Added. This is the new css for the 
popover for the toggle between new look and classic look for rcampus
NOTE: These css also exists in central_classic.css */
div.siteviewsetting-popover {
	text-align:center;
	padding: 1px 4px;
	font-size: 0.8rem;
}

div.siteviewsetting-popover .close {
	top:0 !important;
	right:0 !important;
	border:none !important;
	color: white !important;
}

div.siteviewsetting-popover a {
	font-size: .8em !important;
	color:white !important;
}

div.siteviewsetting-popover a:not(.close){
	text-decoration: underline !important;
}

div.siteviewsetting-popover a:hover {
	color: black !important;
}

/* TH 2024-11-06 (trunk, UI): Change from using :has pseudo class due to an indiana user
 might have had the option layout.css.has-selector.enabled to false on her browsers. 
 https://stackoverflow.com/questions/54224791/why-has-not-working-in-css-select-parent
*/
div.popover.siteviewsetting-container div.arrow {
	display:none;
}

/* TH 2024-11-06 (trunk, UI): Change from using :has pseudo class due to an indiana user
 might have had the option layout.css.has-selector.enabled to false on her browsers. 
 https://stackoverflow.com/questions/54224791/why-has-not-working-in-css-select-parent
*/
div.popover.siteviewsetting-container div.popover-body {
	padding: 3px;
    background-color: var(--rs_blue);
    color: white;
}

/* TH 2024-10-15 (trunk): Added. If there is something inside the pageheader (lets use table for now because
 most of the xspace has has use table. Add border to separate it with the content */
#pageheadertbl:has(table) {
	border-bottom: 1px solid #c5c5c5;
}

/* TH 2024-10-17 (trunk, UI): Added. Css for the permissions and view section in 
 assessment editc */
.assessmentedit-permission-div {
	margin-left: 20px;
}

.assessmentedit-permission-div ul {
	list-style-type: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.assessmentedit-permission-div div {
	margin-bottom: 10px;
}

/* TH 2024-12-02 (b468, issue 936): Added css for matrix quick action */
.btn-matrixquickaction {
	padding: 1px 5px !important;
	font-size: 0.70rem !important;
	line-height: 1 !important;
	border-radius: 0.3em !important;
	background-color: white !important;
	border-color: silver !important;
}

/* TH 2024-12-16 (trunk, Issue 939): SC SPlan tree UI moved from matrixcellutils.cfm */
.mission-section {
	margin: 10px;
	font-size: 1.2em;
}

.nestedcellnodeinfo {
	padding: 0 10px;  /* override top and bottom to show the status background colors only on left and right  */
	border: 1px solid silver !important;  /* override status border colors  */
}

.nestedcell-subcellcontainer {
	padding:8px;
	font-size: .9rem;
	min-height: 35px;
	
	/* TH 2025-02-24 (b473, issue 947): Added position relative */
	position:relative;
}	

.cellActivitycount {
	margin: 0px 5px;
}


/* Each node container */
.nestedcell-node {
margin: 5px 0;
padding: 0px 10px;
border-radius: 5px;
display: block;
align-items: center;
border: 2px solid white;
}

.nestedcell-node-content {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	
	/* TH 2025-02-24 (b473, issue 947): Add width and pointer cursor */
	width: calc(100% - 50px);
	cursor: pointer;
}

.nestedcell-node-actionbar {
	position: absolute;
	top: 0;
	right: 0;
	padding: 3px;
	background: #f5f5f5;
	box-shadow: -3px 3px 3px #555;
	display:none;
}

/* Indented container for child nodes */
.nestedcell-child-nodes-container {
	padding-left: 20px; /* Indent for child nodes */
	display: none;      /* Initially hide child nodes */
}

/* Square button for +/- */
.nestedcelltoggle-btn {
	width: 20px;
	height: 20px;
	background-color: white;
	color: #0056b3;
	border: 1px solid #ccc;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3px;
	position: relative;
	left: -25px;
	top: 9px;
	float: left;
}

.nestedcelltoggle-btn:hover {
	background-color: #0056b3;
	color: white;
}

/* TH 2025-01-23 (b472, issue 945): Added. Css for the toggle to hide evaluatee matrix */
.showHideSettingDiv {
	display: inline-block;
	margin-left: 15px;
	background-color: #eee;
	padding: 7px;
	border-radius: 8px;
}

.showHideSettingDiv span.label {
	vertical-align:middle;
	font-size:1em;
	margin-right:5px;
}

.showHideSettingDiv .form-switch {
	display:inline-block !important;
	margin-right:5px !important;
	min-height:unset !important;
}

.showHideSettingDiv .form-switch .block-etee-input {
	background-color: lightcoral;
}	
.showHideSettingDiv .form-switch .block-etee-input:checked {
	background-color: limegreen;
	border-color: green;
}

/* TH 2025-03-26 (trunk): Added. Css for the comparison between 2 values, this can be reuse
 in multiple report */
.rs-hshiftbar-wrapper {
	font-family: sans-serif;
	margin: 30px;
}

.rs-hshiftbar-block {
	display: inline-block;
}

.rs-discrepancy-block {
	display: inline-block;
	vertical-align: bottom;
	margin-left: 10px;
	
	/* TH 2025-03-31 (trunk): Added. Increase the fontsize of the icon */
	font-size: 1rem;
}

.rs-hshiftbar-percent-label {
	text-align: center;
	font-weight: bold;
	margin-bottom: 4px;
	
	/* TH 2025-04-02 (trunk): Change font size to be smaller to 
	 add arrows */
	font-size: 12px;
	display: flex;
}

/* TH 2025-03-31 (trunk): Added width of the percent value in the shiftbar */
.rs-hshiftbar-percent-label > div.percent_val {
	width: 40%;
}

/* TH 2025-03-31 (trunk): Added width of the arrows of shift directions */
.rs-hshiftbar-percent-label > div.shift_direction_left,
.rs-hshiftbar-percent-label > div.shift_direction_right {
	color: #888;
	width: 30%;
}

/* TH 2025-03-31 (trunk): aligning the arrows */
.rs-hshiftbar-percent-label > div.shift_direction_left {
	text-align: right;
	
	/* TH 2025-04-02 (trunk): Add padding */
	padding-right: 5px;
}
.rs-hshiftbar-percent-label > div.shift_direction_right {
	text-align: left;
	
	/* TH 2025-04-02 (trunk): Add padding */
	padding-left: 5px;
}

.rs-hshiftbar-container {
	
	/* TH 2025-03-31 (trunk): Increase to 100px */
	width: 100px;
	height: 10px;
	background-color: #fafafa;
	border: 1px solid #ddd;
	position: relative;
	margin: 0 auto;
}

.rs-hshiftbar-fill {
	height: 100%;
	position: absolute;
	top: 0;
}

.rs-hshiftbar-fill.positive {
	left: 50%;
	
	/* TH 2025-03-31 (trunk): Change color */
	background-color: #aaa;
	transform-origin: left;
}

.rs-hshiftbar-fill.negative {
	right: 50%;
	
	/* TH 2025-03-31 (trunk): Change color */
	background-color: #aaa;
	transform-origin: right;
}

.rs-hshiftbar-center-line {
	position: absolute;
	left: 50%;
	top: 0;
	width: 2px;
	height: 100%;
	background-color: #444;
	z-index: 2;
}

/* TH 2025-03-26 (trunk): Overlay css for the first import in assessment, there was a delay when
 a dialog popup so this overlay will prevent user from being confused */
#sync-submissions-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 1.5rem;
	font-family: sans-serif;
}

/* TH 2025-03-31 (trunk): Added colors for different discrepancy levels */
.discrepancyLevel_1 {
	color : green;
}

.discrepancyLevel_2 {
	color : blue;
}

.discrepancyLevel_3 {
	color : #ffae42;
}

.discrepancyLevel_4 {
	color : #ff4433;
}

.discrepancyLevel_5 {
	color : red;
}

/* TH 2025-04-23 (trunk): Added. Css for the description box on the student grade view page */
.description-container {
	position: relative;
	max-height: 9em; /* ~5 lines */
	overflow: hidden;
	line-height: 1.5em;
	transition: max-height 0.3s ease;
	padding: 15px !important;
}

.description-container.expanded {
	max-height: none;
}

.fade-bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3em;
	background: linear-gradient(to bottom, transparent, white);
	display: flex;
	justify-content: end;
	align-items: flex-end;
	cursor:pointer;
	padding-right:10px;
	padding-bottom:5px;
}

.toggle-button {
	background: none;
	border: none;
	color: #007BFF;
	font-size: 1em;
	cursor: pointer;
	z-index: 1;
}

.description-container.expanded .fade-bottom {
	margin-top:5px;
}