/*
The style sheet is done as a JSP in order to allow constants
to be declared
*/





























@font-face {
  font-family: 'dotsfont';
  src: url('../bootstrap/fonts/dotsfont.eot');
  src: url('../bootstrap/fonts/dotsfont.eot?#iefix') format('embedded-opentype'),
       url('../bootstrap/fonts/dotsfont.woff') format('woff'),
       url('../bootstrap/fonts/dotsfont.ttf') format('truetype'),
       url('../bootstrap/fonts/dotsfont.svg#dotsfontregular') format('svg');
}

/*Main body styles*/

body
{
	font-family: 'Roboto', sans-serif;
	color: #444444;
	padding-left: 5px #EFEFEF;
	height: 100%;
	font-size: 85%;
}

#slider {
    height:100%;
	width:100%;
}

div#footer {
	width: 100%;
	margin-right: 10px;
	_margin-right: 0px; /* Only IE6 reads this and changes the value to 0 px */
}

div#mainpage {
	width: 100%;
	left: 0px;
}

div#toggle {
    height: 100%;
    margin:0px;
    display: table-cell;
    vertical-align:top;
}

div#main {
    vertical-align:top;
    height: 100%;
    padding-left: 6px;
	padding-bottom: 6px;
	overflow-x: auto;
	
}

div#scrollwrapper {
	height:16px;
	display: none;
	overflow-x: auto;
	overflow-y: hidden;
	height:16px;
}
div#topscroll {
    width: 1300px;
    height:16px;

}

div#container {
	border: 0px;
	margin: 0px;
	padding: 0px;
	width: 100%;
	padding-right: 15px;
}

div#logoncontainer {
	border: 0px;
	margin: 0px;
	padding: 0px;
	width: 100%;
}

div#logonscreen {
	font-size: 170%;
	background-color: #EEEEEE;"
}

div#logonscreen input[type=button], input[type=submit] {
    -webkit-border-radius: 3;
    -moz-border-radius: 3;
    border-radius: 3px;
    background-color: #009FE3;
    border: 10px lightgray;
    color: WHITE;
    padding: 8px 8px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    margin: 4px 2px;
    cursor: pointer;
}

a#forgotpassword {
	font-size: 80%;
}

div#logonscreen input[type=text], input[type=password] {
	font-size: 70%;
	width: 300px;
}

.alerttext {
	color: red;
}
 
h1
{
	font-size: 120%;
	font-weight: bold;
	margin-top:0.6em;
	margin-bottom:0.2em;
	color: #000064;
}

.h1inline
{
	font-size: 120%;
	font-weight: bold;
	margin-top:1em;
	margin-bottom:0.2em;
	color: #000064;
	display: inline;
}

h2
{
	font-size: 100%;
	margin-top:0.5em; margin-bottom:0;
	color: #000064;
}

.h2inline
{
	font-size: 100%;
	margin-top:0.5em; margin-bottom:0;
	color: #000064;
	display: inline;
}

h3
{
	font-size: 100%;
	margin-top:0.5em; margin-bottom:0;
}

ol li {
  counter-increment: listStep
}

ol li:before {
  content: counter(listStep) ". ";
}

ol {
  list-style: none;
  counter-reset: listStep;
   padding-left: 5px;
}

ul {
  display: block;
  list-style-type: disc;
  margin-top: 1em;
  margin-bottom: 1 em;
  margin-left: 0;
  margin-right: 0;
  padding-left: 20px;
}

input[type=button], input[type=submit] {
    -webkit-border-radius: 3;
    -moz-border-radius: 3;
    border-radius: 3px;
    background-color: #009FE3;
    border: 5px lightgray;
    color: WHITE;
    padding: 4px 4px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 4px 2px;
    cursor: pointer;
}

input[type=button]:active, input[type=submit]:active {
    background-color: #CCCCCC;
}

button:disabled, input[type=button]:disabled, input[type=submit]:disabled {
    background-color: lightgray;
}

select:not([multiple]) {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid darkgrey;
    outline:0;
	height:29px;
    padding-left:3px;
    padding-right:3px;
	vertical-align:middle;    
	background-color: white;
  }

input[type=text], input[type=password] {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid darkgrey;
    outline:0;
    height:27px;
    padding-left:3px;
    padding-right:3px;
	vertical-align:middle;
  }

input[type=checkbox] {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid darkgrey;
    outline:0;
    height:27px;
	width:20px;
    padding-left:3px;
    padding-right:3px;
	vertical-align:middle;
  }

input[type=radio] {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid darkgrey;
    outline:0;
    height:27px;
	width:20px;
    padding-left:3px;
    padding-right:3px;
	vertical-align:middle;
  }

textarea {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid darkgrey;
    outline:0;
    padding-left:3px;
    padding-right:3px;
  }

a {
	line-height: 27px;
	text-decoration: underline;
	color: #444444;
}

a:hover, .sidebox a:focus, .sidebox a:active {
	background-color: #CCE5FF;
}

div#masthead {
	width: 100%;
	background-color: #009FE3;
}

div#mastheadtop {
	width: 100%;
	height:27px;
	background-color: #009FE3;
	color: WHITE;
	font-weight: bold;
	font-size: 85%;
}

div#mastheadtop table tr td a {
	color: WHITE;
	text-decoration: none;
}

div#mastheadtop table tr td a:hover {
	background-color: #F5D04B;
	color: WHITE;
}

/*** Styles used within the body of a form **/

.readonlyTable
{
	background-color: #DDDDDD;
}

.readonly
{
    -webkit-border-radius: 3;
    -moz-border-radius: 3;
    border-radius: 3px;
	background-color: #DDDDDD;
	border: 5px solid #DDDDDD;
}

.readonlylistbox
{
	background-color: #DDDDDD;
	color:red;
	font-weight: bold;
}

table.mainbody {
	width: 100%;
	height: 100%;
}

.mainbody td {
	padding-left: 10px;
}

.readonlybold
{
	background-color: #DDDDDD;
	border: 2px solid #DDDDDD;
	font-weight: bold;
}

.editable
{
	background-color: white;
}

/*Navigation and main page table styles*/
table.buttonpanel {
	width: 400px;
}

table.footer
{
	border-top:1px solid #009FE3;
	width: 100%;
}

span.copyright
{
	font-weight: bold;
	font-family: 'Roboto', sans-serif;
	color: white;

}

div#navigation-both {
	width: 100%;
	background-color: #009FE3;
	display: inline-block;
}

div#navigation-panelhide {
	line-height: 2em;
	background-color: #009FE3;
	color: white;
	float: left;
	width: 20px;
	height: 33px;
	border: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: top;
}

div#navigation-panelhide a {
	color: white;
	padding-left: 5px
}

div#navigation-summary {
	background-color: #009FE3;
	color: WHITE;
	float: left;
	height: 33px;
	border: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: center;
	font-size: 110%;
	line-height: 28px;
}

div#sidebox {
	background-color: #009FE3;
}

div#navigation-summary  a {
	color: WHITE;
	display:block;
	padding-left:5px;
    padding-right:5px;
	text-decoration: none;
}

div#navigation-summary  a:hover {
	background-color: #F5D04B;
	color: WHITE;
	text-decoration: underline;
}

div#left-summary {
    background: #009FE3;
	float: left;
	width: 300px;
	margin-bottom: 0px;
	margin-left: -10px;
	margin-top: 0px;
	margin-right: 0px;
	_margin-right: 0px; /* Only IE6 reads this and changes the value to 0 px */
	padding-left: 5px;
	border-left: 0px;
}

div#left-summary-box {
	float: left;
	border-right: 1px solid;
	border-bottom: 1px solid;
	padding: 5px;
	width: 20%;
}

div#footer {
	background-color: #009FE3;
	color: WHITE;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 70%;
	text-align: right;
}

div#topNav {
	background-color: #009FE3;
	width:100%;
	height:3px;
	float: left;
	color: WHITE;
	line-height: 1.25em;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 0;
}

div#navigation {
	width:86%;
	float: left;
	background-color: #009FE3;
	border: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	line-height: 1.75em;
}

div#bottomNav {
	background-color: #009FE3;
	width:100%;
	height:3px;
	float: left;
	color: WHITE;
	line-height: 1.25em;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 0;
}

div#bottomNav a {
	color: WHITE;
	text-decoration: none;
}

div#bottomNav a:hover {
  text-decoration: underline;
}

div#viewdiv {
	text-align: left;
	float: left;
}

.popupmenutitle .ui-dialog-titlebar {
    background: #009FE3;
	color: white;
}

/*** LEFT HAND MENU STYLES ***/

hr { height:0px;
     border:0px;
     border-top: 1px solid lightgray;
}


td.leftnavbar {
	background-color:#F5D04B;
	border: 1px solid #009FE3;
	padding: 10px;
}

.leftnavbarcontents td {
}

td.leftnavbar a {
	text-decoration: none;
}

td.leftnavbar a:hover {
	text-decoration: underline;
}

select {
font-family: 'Roboto', sans-serif;
		    font-size: 1.0em;
	}

	option.faint {
		color: #808080;
	}

	input {
		font-family: 'Roboto', sans-serif;
		font-size: 1.0em;
	}

	button {
		font-family: 'Roboto', sans-serif;
		font-size: 1.0em;
		color: WHITE;
	}



	textarea {
		font-family: 'Roboto', sans-serif;
		font-size: 1.0em;
	}



/* Table for a list of results (e.g. after a search) */

table.display
{
	border:0px;
	-webkit-border-radius: 6;
	-moz-border-radius: 6;
	border-radius: 6px;
    border-bottom: #036 1px solid;
    border-left: #036 1px solid;
    border-right: #036 1px solid;
    border-top: #036 1px solid;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;
	width: 100%
}

table.display th
{
    background-color: #CCC;
    color: #036;
	font-weight: bold;
    text-align: left;
}

table.display td a {
	text-decoration: underline;
}

table.display td {
	vertical-align: top;
}

table.display th a {
	color: #036;
	font-weight: bold;
	text-decoration: none;
}

table.displaymultirow
{
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;
	width: 100%;
}
table.displaymultirow th
{
    background-color: #CCC;
    color: #036;
	font-weight: bold;
}

table.displaymultirow td a {
	text-decoration: underline;
}

table.displaymultirow td {
	vertical-align: top;
}

table.displaymultirow th a {
	color: #036;
	font-weight: bold;
	text-decoration: none;
}


table.displayspecial
{
	width: 100%;
}

table.displayspecial th
{
    background-color: #DDDDDD;
    color: #036;
	font-weight: bold;
}

table.displayspecial td a {
	text-decoration: underline;
}

table.displayspecial td {
	vertical-align: middle;
}

table.displayspecial th a {
	color: #036;
	font-weight: bold;
	text-decoration: none;
}

tr.odd
{
    background-color: #E5FFFF;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;
}

tr.even
{
    background-color: #CCE5FF;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 2px;
}

/* Display of a form */
.tabContent
	{
		border:0px;
		-webkit-border-radius: 6;
		-moz-border-radius: 6;
		border-radius: 6px;
		padding-left:2px;
		padding-right:2px;
		padding-top:2px;
		padding-bottom:2px;
		line-height:27px;
		border-left:1px solid lightgray;
		border-bottom:1px solid lightgray;
		border-right:1px solid lightgray;
		border-top:1px solid lightgray;
		background-color: #f7f7f7;
	}

table.tabContent th {
	font-weight: bold;
}

.modal .tabContent {
	width: 100%;
}

.modal .tabContent textarea	{
	width: 98%;
}

/* Display of a list */
.tabContentList
	{
		padding: 2px;
		border:0px;
		line-height:27px;
		background-color:#FFFFFF;
		border-left:1px solid #009FE3;
		border-bottom:1px solid #009FE3;
		border-right:1px solid #009FE3;
		border-top:1px solid #009FE3;
	}

.tabContentList select:not([name^="pagination"]):not([name$="commentsind"])
	{	
		max-width:90%;
  }

.formButtons
	{
		border:0px;
		width: 100%;
	}

.formButtons.input[type=button]
	{
		color: WHITE;
		background-color:#FFFFFF;
	}

.formButtons.input[type=submit]
	{
		color: WHITE;
		background-color:#FFFFFF;
	}

.fixedWidth {
		width: 675px;
}

table.tabForm {
	border-left:15px;
}

.tabContent th
	{
	font-weight: bold;
    text-align: left;
	line-height: 15px;
	width: 22%;
	}

table.homeList
{
	color:black;
	}

table.homeList td
{
	height: 35px;	/* Controls spacing of home page links list */
}

table.homelist a, table.homelist a:visited {

}

table.subform
{
    border-bottom: #036 1px solid;
    border-left: #036 1px solid;
    border-right: #036 1px solid;
    border-top: #036 1px solid;
}

/* Controls appearance of supporting document list */
.suppdoc ul
{
list-style-type: none;
padding: 0;
margin: 0;
}

.suppdoc
{
width: 100%;
}
.suppdoc li
{
	color: #888888;
	font-weight: bold;
    padding-left: 30px;
    padding-top: 10px;
    background-image: url(../images/pdficon.gif);
    background-repeat: no-repeat;
    background-position: 5px 11px;
}

.suppdoc li a, .suppdoc li a:visited {
	font-weight: bold;
}


body div#hovertext
{
	position: absolute;
	background: yellow;
	border: black 1px solid;
	padding:2px;
	-moz-border-radius:5px;
}
body div#hovertext p
{
	margin:0;
	padding:0;
	color: white;
	font:11px/12px verdana,arial,serif;
}

body div#hovertext p em
{
	display:block;
	margin-top:3px;
	color:#f60;
	font-style:normal;
	font-weight:bold;
}

/*New styles for the new tabs used in the 'tab' tag and using divs*/
div.tabbedPage {
}

div.inactiveTab, div.activeTab {
	float: left;
	vertical-align: top;
}

div.inactiveTab a, div.activeTab a {
	line-height: 2em;
  	display: block;
  	padding: 0 1em;
	font-weight: bold;
	text-decoration: none;
}

div.inactiveTab, div.inactiveTab a {
	background-color: #009FE3;
	color: #FFFFFF;
	font-size: 85%;
}

div.inactiveTab a:hover {
	background-color: #F5D04B;
	color: WHITE;
	text-decoration: underline;
}

div.activeTab, div.activeTab a {
	background-color: #F5D04B;
	color: WHITE;
	font-size: 85%;
}

div.inactiveSubTab, div.activeSubTab {
	float: left;
	vertical-align: top;
}

div.inactiveSubTab a, div.activeSubTab a {
	line-height: 2em;
  	display: block;
  	padding: 0 1em;
	font-weight: bold;
	text-decoration: none;
}

div.inactiveSubTab, div.inactiveSubTab a {
	background-color: darkgray;
	color: #FFFFFF;
	font-size: 85%;
}

div.inactiveSubTab a:hover {
	background-color: #029CDA;
	color: WHITE;
	text-decoration: underline;
}

div.activeSubTab, div.activeSubTab a {
	background-color: #029CDA;
	color: WHITE;
	font-size: 85%;
}


div.tabRow .inactiveTab a, div.tabRow .activeTab a {
	font-family: 'Roboto', sans-serif;
	font-size: 106%;
	font-weight: normal;
	line-height: 18px;
}

div.tabContents {
	clear: left;
	padding-left:0px;
	padding-right:0px;
	padding-top:0px;
	padding-bottom:0px;
}

div.tabContent {
	clear: left;
}

/*Old styles for the tabs that use tables*/
.tabContainer {
	background-color:#FFFFFF;
	padding-right:1px;
	padding-left:1px;
	padding-top:1px;
	padding-bottom:1px;
}

.tabContainer th {
    font-weight: normal;
    text-align: left;
}

.tabContainer td {
	padding-left: 0px;
}

td.tabsTop {
	border-bottom: 1px solid #009FE3;
	vertical-align: top;
	padding-left: 0px;
}


td.tabsMiddle {
	border-right: 1px solid #009FE3;
	border-bottom: 1px solid #009FE3;
	padding-left: 0px;
}

td.tabsBottom {
	border-right: 1px solid #009FE3;
	padding-left: 0px;
}

ul.cornerTabs {
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
  vertical-align: top;
  font-size: 100%;
  width: 100%;
}

ul.cornerTabs li {
  float: left;
  line-height: 18px;
  color: WHITE;
  background: #F5D04B;
  vertical-align: top;
  border-right: #F5D04B 1px solid;
}

ul.cornerTabs li.active {
  float: left;
  line-height: 18px;
  color: WHITE;
  background: url(images/tab-right-active.gif) no-repeat top right;

}

ul.cornerTabs span.active {
  padding: 0 6px;
  background: #F5D04B;
  text-decoration: none;
  color: WHITE;
  float: left;
  line-height: 18px;
  display: block;
  font-size: 90%;
  font-weight: normal;
}

.cornerTabs li a {
  padding: 0 6px;
  background: #009FE3;
  text-decoration: none;
  color: WHITE;
  float: left;
  line-height: 18px;
  display: block;
  font-size: 90%;
  font-weight: normal;
}

ul.cornerTabs a:hover {
  background: #F5D04B;
  color: WHITE;
  text-decoration: underline;
}

ul.childTabs {
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
  vertical-align: top;
}

ul.childTabs li {
  float: left;
  line-height: 18px;
  background: #F5D04B;
  vertical-align: top;
  border-right: #F5D04B 1px solid;
}

ul.childTabs li.active {
  float: left;
  line-height: 18px;
  background: url(images/tab-right-active.gif) no-repeat top right; ;
}

ul.childTabs span.active {
  padding: 0 6px;
  background: #F5D04B;
  text-decoration: none;
  color: WHITE;
  float: left;
  line-height: 18px;
  display: block;
  font-size: 90%;
  font-weight: normal;
}

.childTabs li a {
  padding: 0 6px;
  background: darkgray;
  text-decoration: none;
  color: white;
  float: left;
  line-height: 18px;
  display: block;
  font-size: 90%;
  font-weight: normal;
}

ul.childTabs a:hover {
  background: #F5D04B;
  color: WHITE;
  text-decoration: underline;
}

table {
    font-size: 1.0em;
}

table {
	margin: 0;
	padding: 0;
	border: 0;
}

table.answerGrid {
	background-color: #E7E7E7;
	border: 1px solid darkgray;
}

table.guidanceNotes {
	background-color: #E7E7E7;
	border: 1px solid darkgray;
	width: 100%;
}



table.answerGridPrint td {
	border: 1px solid darkgray;

}

table.answerGridPrint {
	border: 1px solid darkgray;
	border-collapse: collapse;
}


table.goalList {
	background-color: #CCE5FF;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

table.goalList th {
	padding: 5px;
}

table.goalList td {
	padding: 5px;
}

table.reviewList {
	background-color: lightgrey;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

table.reviewList th {
	padding: 5px;
}

table.reviewList td {
	padding: 5px;
}


tr.GOAL td {
	background-color: #CCE5FF;
	border-top: 1px solid gainsboro;
	border-bottom: 1px solid gainsboro;
}

tr.STEP td {
	background-color: #E5FFFF;
	border-bottom: 1px solid darkgray;
}

tr.goalReviewRowHEADER td {
	font-weight: bold;
	background-color: blue;
	border-bottom: 1px solid darkgray;
}

tr.goalTask {
	background-color: gainsboro;
}

p, td {
	font-size: 1.0em;
	padding: 0;
	margin: 0;
}

div {
	font-size: 1.0em;
}


ul.cornerTabsSec span.active {
  padding: 0 1em;
  line-height: 2em;
  background: #F5D04B;
  text-decoration: none;
  color: #FFFFFF;
  float: left;
  display: block;
}

ul.cornerTabsSec {
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
  vertical-align: top;
}

ul.cornerTabsSec li {
  float: left;
  background: #DAC8EC;
  vertical-align: top;
}

ul.cornerTabs li.active {
  float: left;
  line-height: 2em;
  background: #DAC8EC;
}

ul.cornerTabsSec span.active {
  padding: 0 1em;
  background: #F5D04B;
  text-decoration: none;
  color: #009FE3;
  float: left;
  display: block;
  font-weight: normal;
}

.cornerTabsSec li a {
  padding: 0 1em;
  background: #DAC8EC;
  text-decoration: none;
  color: #009FE3;
  float: left;
  display: block;
  font-weight: normal;
}

ul.cornerTabsSec a:hover {
  background: #F5D04B;
	text-decoration: none;
}

ul li.errorbullet {
	list-style-type: square;
}

.box {
  font-size: 1.0em;
}

/* rounded corner box
================================== */

.box {
  width: 300px;
  background: url(images/bottom-left.gif) no-repeat left bottom;
}

.box-outer {
  background: url(images/bottom-right.gif) no-repeat right bottom;
  padding-bottom: 5%;
}

.box-inner {
  background: url(images/top-left.gif) no-repeat left top;
}

.box h2 {
  background: url(images/top-right.gif) no-repeat right top;
  padding-top: 5%;
  line-height: 1;
  margin: 0;
}


.box h2, .box p {
  padding-left: 5%;
  padding-right: 5%;
}


h2.news {
	border-bottom: 1px solid #009FE3;
}

.sidebox {
  background: #009FE3;
  padding-left: 0px;
  width: 300px;
}

.sidebox-outer {

  padding-bottom: 0px;
}

.sidebox-inner {
  background-colour: #009FE3;
  padding-top: 0px;
}



.sidebox h2.top {
  padding-top: 0px;
  padding-bottom: 0px;
  line-height: 27px;;
  padding-left: 10px;
  padding-right: 10px;
}

.sidebox h2 {
  padding-top: 0px;
  line-height: 27px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 0px;
}

.sidebox p, .sidebox a, .sidebox hr, .sidebox input, .sidebox select {
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
  font-family: 'Roboto', sans-serif;
}

.sidebox a {
	line-height: 27px;
	text-decoration: none;
	background-color: #009FE3;
	color: WHITE;
}

.sidebox a:hover, .sidebox a:focus, .sidebox a:active {
	background-color: #F5D04B;
	color: WHITE;
	text-decoration: underline;
}

td.justify, p.justify{
	text-align:justify;
	padding-right: 5px;
}

hr.sidebox {
	width: 180px;
}

.imagemiddle {
	vertical-align: middle;
	border: 0px;
	padding: 0px;
	margin: 0px;
}

div.worksheet-printable {
	margin:20px 20px 20px 20px;
}

h2.printMainTitle {
	font-size: 120%;
	font-weight: bold;
	border-bottom: 1px solid black;
}

div.answerGrid {
	background-color: #E7E7E7;
	border: 1px solid darkgray;
}


/* progress bar */

table.progressBar tr td.progressBarDone {
	background-color: green;
}

table.progressBar tr td.progressBarNotDone {
	background-color: red;
}

/* goal progress bar */

table.goalProgressBar {
	border-width: 0px;
	border-style: none;
	padding: 0px;
}

table.goalProgressBar tr td {
	white-space: nowrap;
	border-style: none;
	border-width: 0px;
}

/* provider registration new look */
form#providerRegistrationForm {
  margin: 0;
  padding: 0;
  font-size: 100%;
  min-width: 560px;
  max-width: 620px;
  width: 590px;
  margin-left: 200px;
}

form#providerRegistrationForm fieldset {
  clear: both;
  font-size: 100%;
  border-color: #000000;
  border-width: 1px 0 0 0;
  border-style: solid none none none;
  padding: 10px;
  margin: 0 0 0 0;
}

form#providerRegistrationForm fieldset legend {
  font-size: 150%;
  font-weight: normal;
  color: #000000;
  margin: 0 0 0 0;
  padding: 0 5px;
}

label {
  font-size: 100%;
}

form#providerRegistrationForm div {
  clear: left;
  display: block;
  zoom: 1;
  margin: 5px 0 0 0;
  padding: 1px 3px;
}

form#providerRegistrationForm div fieldset {
  clear: none;
  border-width: 1px;
  border-style: solid;
  border-color: #666666;
  margin: 0 0 0 144px;
  padding: 0 5px 5px 5px;
  width: 197px;
}

form#providerRegistrationForm div fieldset legend {
  font-size: 100%;
  padding: 0 3px 0 9px;
}

form#providerRegistrationForm div.required fieldset legend {
  font-weight: bold;
}

form#providerRegistrationForm div label {
  display: block;
  float: left;
  width: 130px;
  padding: 3px 5px;
  margin: 0 0 5px 0;
  text-align: left;
}

form#providerRegistrationForm input[type="text"]{
	width: 400px;
	float: left;
}

form#providerRegistrationForm select {
	width: 200px;
	float: left;
}

form#providerRegistrationForm div#submitButtons {
	text-align: center;
}

form#providerRegistrationForm div.required label {
	font-weight: bold;
}

#moretabsTable {
	z-index: 100 !important ;
}

.ui-tooltip-content {
    font-size:12pt;
    font-family:Calibri;
}

#togglenav {
  height: 20px;
  width: 30px;
  background-color: #009FE3;
  border: 0px solid;
  border-top: 0px solid;
  border-bottom-right-radius: 2em;
  font-size: 10pt;
  color: WHITE;
  cursor: pointer;
  z-index: 100;
}

/* Dashboard */

.chartrowholder {
    width: 1053px;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    white-space: nowrap;
    position: relative;
    border: 0;
	padding: 0;
  }

.chartholderdiv {
    height: 272px;
    width: 253px;
    position: relative;
    white-space: nowrap;
	display: inline-block;
	border-right: 1px solid #DDD;
	border-bottom: 1px solid #DDD;
	padding: 0 3px 0 3px;
  }

 .chartdiv {
    position: absolute;
    width: 250px;
    height: 100%;
    display: inline-block;
    	padding: 0 3px 0 3px;
  }

  .chartcentrelabel {
    width: 40px;
    height: 22px;
    position: absolute;
    top: 118px;
    text-align: center;
    cursor: default;
    background: #f7f7f7;
  }

  .chartcentrelabelpie {
    top: 120px;
    left: 63px;
  }

  .chartcentrelabelgauge {
    top: 112px;
    left: 61px;
  }

  .chartcentrelabelgauge p {
    line-height: 0.5;
    padding:0;
    margin: 4px;
    line-height: 0.5;
    font-size: 17pt;
    color: #444444;
  }


  .chartcentrelabelgauge p.oftotal, .chartcentrelabelgauge p.oftotal a {
    line-height: 1.0;
    font-size: 10pt;
    color: #999999;
  }

  .chartcentrelabel a {
    line-height: 0.5em;
    text-align: center;
  }

  .chartcentrelabelpie p {
    line-height: 0.5;
    padding:0;
    margin: 4px;
    line-height: 0.5;
    font-size: 17pt;
    color: #444444;
  }

  .chartdialogdiv {
  	display:none;
  	background: #E5FFFF !imnportant;
  }

  .largechartholderdiv {
    background: #E5FFFF;
    height: 475px;
    width: 545px;
    position: relative;
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: hidden;
	display: inline-block;
	padding: 0 3px 0 3px;
  }

  .largechartdiv {
    width: 100%;
    height: 100%;
    display: inline-block;
    padding: 0 3px 0 3px;
  }

  .largechartcentrelabel {
    width: 80px;
    height: 44px;
    position: absolute;
    top: 205px;
    left: 105px;
    text-align: center;
    cursor: default;
    background: #E5FFFF;
  }

  .largechartcentrelabelpie {
    top: 212px;
    left: 133px;
  }

  .largechartcentrelabelgauge {
    top: 200px;
    left: 131px;
  }

  .largechartcentrelabel a {
    line-height: 0.5;
  }

  .largechartcentrelabelpie p {
    padding:0;
    margin: 4px;
    line-height: 0.5;
    font-size: 30pt;
    color: #444444;
  }

  .largechartcentrelabelgauge p {
    padding:0;
    margin: 4px;
    line-height: 0.5;
    font-size: 30pt;
    color: #444444;
  }

  .largechartcentrelabelgauge p.oftotal, .largechartcentrelabelgauge p.oftotal a {
    line-height: 2.5;
    font-size: 15pt;
    color: #999999;
  }

  .chartnodatatitle {
    position: absolute;
    top: 0px;
    left: 3px;
    width: 230px;
    height: 30px;
    text-align: left;
    vertical-align: top;
    padding:0;
    margin: 4px;
    font-size: 11pt;
    font-weight: bold;
    color: #444444;
    overflow: hidden;
  }

  .chartnodatamessage {
    position: absolute;
    top: 100px;
    left: 0px;
    width: 230px;
    height: 100px;
    text-align: center;
    vertical-align: middle;
    padding:0;
    margin: 4px;
    font-size: 11pt;
    color: #444444;
  }

 .ui-accordion-content  {
      background: #f7f7f7;
      padding: 0 !important;
  }

  .ui-dialog .ui-dialog-content {
    border: 0;
    padding: .5em 1em;
    background: #f7f7f7;
    overflow: auto;
    zoom: 1;
  }

  .ui-widget {
  	font-family: 'Roboto', sans-serif;
  }

.google-visualization-tooltip{
    z-index: 1000;
 }

  .chartactions {
    height: 22px;
    position: absolute;
    top: 244px;
    right: 102px;
    cursor: default;
	display: flex;
    align-items: center;
    text-align: right;
  }

  .largechartactions {
    height: 22px;
    position: absolute;
    top: 450px;
    right: 200px;
    cursor: default;
	display: flex;
    align-items: center;
    text-align: right;
  }

  .filterspan {
  	display: flex;
    align-items: center;
  }

  .chartprefilterlabel {
    height: 22px;
    position: absolute;
    top: 20px;
    left: 0px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 8pt !important;
  }

  .chartprefilterselectholder {
    height: 22px;
    position: absolute;
    top: 32px;
    left: 0px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 8pt !important;
  }
  .chartprefilterselect {
    position: relative;
  	width: 165px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 8pt !important;
  }

  .largechartprefilterlabel {
    height: 22px;
    position: absolute;
    top: 17px;
    left: 0px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 10pt !important;
  }

  .largechartprefilterselectholder {
    height: 22px;
    position: absolute;
    top: 32px;
    left: 0px;
    cursor: default;
	display: flex;
    align-items: center;
    text-align: right;
  }

  .largechartprefilterselect {
  	width: 250px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 10pt !important;
  }

  .filterspanwithborder {
    -moz-border-radius:3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    border: solid 1px #CCCCCC;
    padding: 0px;
    background: #E8E8E8;
  }

  .dashicon {
  	padding: 4px;
  	cursor: pointer;
  }

  .acctitlerightside {
    float:right;
    line-height:20px;
    text-align:right;
    font-size: 10pt;
  }

  .acctitlerightside a {
    color: #009FE3 !important;
  }

/* Custom Select HTML select replacement styles */

/* The container must be positioned relative: */
.custom-select {
  position: relative;
  font-family: 'Roboto', sans-serif;
}

.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-items div, .select-selected, .select-readonly {
  color: #444444;
  padding: 2px 16px 2px 4px;
  cursor: pointer;
  min-height: 20px;
}

.custselfilter {
  color: #444444;
  background-color: white;
  background-image: url('../images/searchicon.png'); /* Add a search icon to input */
  background-repeat: no-repeat;
  background-position: left center;
  padding: 2px 16px 2px 20px;
  cursor: pointer;
  min-height: 16px;
  border: 1px solid transparent;
  border-color: transparent #848484 #848484 #848484;
}

.select-readonly {
  background-color: #DDDDDD;
  border: 1px solid #848484;
  border: 1px solid transparent;
  border-color: #848484 #848484 #848484 #848484;
}

.select-selected {
  background-color: White;
  border: 1px solid #848484;
  border: 1px solid transparent;
  border-color: #848484 #848484 #848484 #848484;
}

/* Style the arrow inside the select element: */
.select-selected:after, .select-readonly:after {
  position: absolute;
  content: "";
  top: 7px;
  right: 10px;
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-color: #848484 transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
/*.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 14px;
}
*/

/* style the items (options) */
.select-items div {
  border: 1px solid transparent;
  border-color: transparent #848484 #848484 #848484;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: White;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
  border-color: transparent #848484 #848484 #848484;
  max-height: 400px;
  overflow: auto;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}



/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 512px;
  color: #444444;
  background-color: #E5FFFF;
  text-align: left;
  padding: 16px;
  border-radius: 8px;
  border-style: solid;
  border-width: medium;
  border-color: lightgray;

  position: absolute;
  top: -5px;
  right: 105%;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}

#validationErrorMessagesTable {
  background-color: red;
  padding-right: 20px;
  color: white; 
}

.Error {
  background-color: red;
  padding-right: 20px;
  color: white; 
}

#messagearea {
	width:300px;
}

#erroriconarea {
	float:left;
	width:35px;
	height:35px;
	padding-right:13px;
	padding-top:5px;	
}

strong {
	font-weight: bold;
}

.readonlydiv
{
	background-color: #DDDDDD;
	border: 2px solid #DDDDDD;
	width 577px;
	height 128px;
}
.circle {
  /* (A) SAME WIDTH & HEIGHT - SQUARE */
  width: 20px;
  height: 20px;
 
  /* (B) 50% RADIUS = CIRCLE */
  border-radius: 50%;
 
  /* (C) BACKGROUND COLOR */
  background: white;
  color: #009FE3;
}

.ui-dialog-calendar .ui-dialog-content-calendar {
    border: 0;
    padding: .5em 1em;
    background: white;
    min-height:initial !important;
    overflow: hidden;
    zoom: 1;
}

.ui-dialog-content-calendar-menu {
    border: 0;
    padding: 0 !important;
    background: white;
    min-height:initial !important;
    overflow: hidden;
    zoom: 1;
}

.ui-dialog-calendar-menu-titlebar {
    background: #F5D04B;
    color: white;
    font-size: 12px;
    height: 14px;
    margin-top: 0px;
    margin-left: 0px;
    padding-left: 6px !important;
    border-left: 0px;
    border-top: 0px;
    padding-top: 0px;
    margin-bottom: 2px;
    vertical-align: text-top;
}

.ui-state-active:hover {
    color: white;
    background: #F5D04B;
    font-weight: bold;
}

.ui-accordion-header {
    color: white;
    background-color: #009FE3;
    border-color: #C5C5C5;
    z-index: 99 !important;
}

.ui-accordion-header-active {
    color: white;
    background-color: #F5D04B;
    border-color: #C5C5C5;
    z-index: 99 !important;
}

.ui-accordion-header:hover {
    color: white;
    background-color: #F5D04B;
    border-color: #C5C5C5;
    z-index: 99 !important;
}

.ui-accordion-header-active:hover {
    color: white;
    background-color: #009FE3;
    font-weight: bold;
    border-color: #C5C5C5;
    z-index: 99 !important;
}

.ui-accordion-content {
  font-family: 'Roboto', sans-serif;
  font-size: 95%;
  line-height: 10pt;
  margin: 5px auto;
}

.fc .fc-button-primary {
    color: #fff;
    background-color: #009FE3;
    border-color: #009FE3;
}

.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active {
    color: #fff;
    background-color: #009FE3;
    border-color: #009FE3;
}

.fc-cdp-day-top-div {
    position: absolute;
    left: 8px;
    top: 8px;
}

.fc-cdp-day-column-top-div {
    float:left;
    margin-top: 6px;
    margin-left: 6px;
}

.fc-cdp-day-create {
    width: 16px;
    height: 16px;
    object-position: left top;
    object-fit: contain;
    opacity: 0.3;
    filter: alpha(opacity=20);
}

.fc-cdp-day-create:hover {
    width: 16px;
    height: 16px;
    object-position: left top;
    object-fit: contain;
    opacity: 1.0;
    filter: alpha(opacity=100);
}

.no-close .ui-dialog-titlebar-close {
  display: none;
}

.cdp-cal-comment-header {
    padding-bottom: 4px;
    font-weight: bold;
}

.cdp-cal-comment-body {
    padding-bottom: 8px;
}

.cdp-summary-header {
    font-weight: bold;
    width: 20%; 
    align: left !important;
    white-space: nowrap;
}

.cdp-summary-item {
    width: 99%;
}

/* Newsreel*/

.form-row {
	overflow: hidden;
	margin-top: 2px;
}

.form-row .form-label {
	width: 30%;
	height: 100%;
	float: left;
	font-weight: bold;
}

.form-row .form-field {
	position: relative;
	width: 70%;
 	float: right;
}
.form-row .charCounter {
    position: absolute;
    bottom: 0;
    left: -60px;
    font-size: 80%;
    font-weight: bold;
}

.form-row .form-field textarea {
    border: 1px solid darkgrey;
}

.form-row .form-field select {
    border: 1px solid darkgrey;
}

.gridtext {
    display: flex;
    align-items: flex-end;
}

.char-count {
    width: 40px;
    display: flex;
    justify-content: right;
    align-items: flex-end;
    font-size: 12px;
}

.textarea-container {
    margin-left: 10px;
}

#newsreelheadingmain {
    font-size: 16px;
    line-height: 1.3;
    color: #029CDA;
    margin: 2px;
    cursor: pointer;
    text-decoration: none;
}

#toparticlesmain {
    font-size: 14px;
    line-height: 1.3;
    color: #029CDA;
    margin: 2px;
    cursor: pointer;
    text-decoration: none;
}


#allcurrentarticlesmain {
    font-size: 12px;
    line-height: 1.3;
    color: #029CDA;
    margin: 2px;
    cursor: pointer;
    text-decoration: none;
}
#articleView {
	padding-right: 30px;
  	padding-left: 20px;	
  	padding-bottom: 20px;	
}
.articleViewHeadline {
	font-size: 25px;
	font-weight: 500;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-left: 20px;
}

div.articleViewBody {
	border-top: 1px solid #ddd;
	font-size: 14px; 
	padding-top: 20px;

  	margin-left: 20px;	
  	padding-bottom: 15px;
}

div.articleViewBody a {
	color: #1d70b8;
}

#newsreelcafe {
	padding: 8px;
    border-top: 1px solid #ddd;
   	border-bottom: 1px solid #ddd; 
}

#newsreeltoparticles {
	padding-top: 5px;
    border-top: 1px solid #ddd;
}
#newsreelcafeheading {
	font-size: 24px;	
	margin: 2px 2px 2px 0px;
	cursor: pointer;
}

.newsreelcafeLink {
	font-weight: normal;
	font-size: 18px;
	color:#029CDA;
	margin:5px;
	 margin: 2px 2px 2px 0px;
	cursor: pointer;
}
.newsreelcafeLink.notViewed {
	font-weight: bold;

}

  .ui-dialog .ui-dialog-content {
 background-color: white;
}


#newsreelcafeallarticles {
	font-size: 24px;
	color:#029CDA;
	 margin: 2px 2px 2px 0px;
	cursor: pointer;
}



#articleInfoCafeAuthor {
	font-size: 12px;
}

#articleInfoCafeCreatedDate {
	font-size: 12px;
	padding-left: 0px;
}

#addarticlecountwarn {
	margin-left: 27px;	
	font-size: 12px;
	font-weight: 500;
}

tr.notViewed {
	font-weight: bold;
}

.homepageHeadline {
	font-weight: normal;
	font-size: 14px;
	color:#029CDA;
	cursor: pointer;
}

.homepageHeadline.notViewed {
	font-weight: bold;
}

#mainsysallarticleslink a {
    margin-left: 26px;
    font-size: 14px;
    text-decoration: underline;
}

#articleMainAuthorDate {
	border-top: 1px solid #ddd;
	padding-top: 10px;
	margin-left: 25px;

}

#articleInfoMainAuthor {
	display:inline;
}

#articleInfoMainCreatedDate {
	display:inline;
	padding-left: 10px;
}

h3#homelabel {
	font-size:24px;
}

h2#nameheader {
	font-size:30px;
}
#articleMainButtons {
	border-top: 1px solid #ddd;
	padding-left: 10px;
	padding-top: 10px;
	margin-right: 30px;
	margin-left:45px;
}
#newArticleDiv {
height:30px;
}
#newArticleButton {
	float:right;

}

#newsreelAdminOtherButtons {
    position: relative;
    left: 118px;
    bottom: 35px;
    width: 220px;
}

#newsreelaccordion {
	padding-bottom: 5px;
}

#toparticlesbullet {
	padding-left: 25px;
}
#mainsysallarticleslink {
	padding-top: 1px;
	}
	
.textareadiv {
	overflow-y:auto;
	overflow-x:auto;
	height:200px;
	width:99%;
	border: 1px solid #CCC;
	background-color:#DDDDDD;
}

table#quicksearchSpan input[type=text] {
            width: 100%;
            box-sizing: border-box;
}

.textDisplayDiv {
	resize:both;
	overflow:auto;
}

em {
    font-style: italic;
}

.pagedTabContentList {
    padding: 2px;
    border:0px;
    line-height:27px;
    background-color:#FFFFFF;
    border-left:1px solid #009FE3;
    border-bottom:1px solid #009FE3;
    border-right:1px solid #009FE3;
    border-top:1px solid #009FE3;
    vertical-align: middle;
    table-layout:fixed;
    overflow: hidden;
}

table.pagedTabContentList th {
    background-color: #CCC;
    color: #036;
    font-weight: bold;
    text-align: left;
    vertical-align: middle;
}

table.pagedTabContentList th a {
    background-color: #CCC;
    color: #036;
    font-weight: bold;
    text-decoration: underline;
}
 
table.pagedTabContentList td {
    vertical-align: middle;
}

table.pagedTabContentList td a {
    text-decoration: underline;
}

div#subcasefilters {
    padding-bottom:5px;
    border-bottom:2px solid #009FE3;
    margin-bottom:5px;
}