/***************/
 /* MAIN STYLES */
/***************/

body { margin: 130px 25px 25px 25px; background: #007DCC url(/portals/9/CDMT/pictures/title.jpg) no-repeat left top; font: 13px Tahoma, Arial, Helvetica, Sans-Serif; text-align: left; }
h1   { margin-top: 0px; font-size: 25px; font-weight: normal; color: #AA3311; }
h2   { font-size: 19px; font-weight: normal; color: #006080; }
h3   { font-size: 17px; font-weight: normal; color: #333399; }
p    { margin-top: 0px; padding-top: 0px; }
form { margin-bottom: 0px; }

a:link          { text-decoration: none; color: #800000;}
a:visited       { text-decoration: none; color: #800000;}
a:active        { text-decoration: none; color: #800000; border-bottom: 1px solid #FF0000;}
a:hover         { text-decoration: none; color: #800000; border-bottom: 1px solid #FF0000;}

a.black:link    { text-decoration: none; color: #000000;}
a.black:visited { text-decoration: none; color: #000000;}
a.black:active  { text-decoration: none; color: #000000; border-bottom: 1px solid #000000;}
a.black:hover   { text-decoration: none; color: #000000; border-bottom: 1px solid #000000;}

a.blue:link     { text-decoration: none; color: #000080;}
a.blue:visited  { text-decoration: none; color: #000080;}
a.blue:active   { text-decoration: none; color: #000080; border-bottom: 1px solid #0000FF;}
a.blue:hover    { text-decoration: none; color: #000080; border-bottom: 1px solid #0000FF;}

a.green:link    { text-decoration: none; color: #008000;}
a.green:visited { text-decoration: none; color: #008000;}
a.green:active  { text-decoration: none; color: #008000; border-bottom: 1px solid #00A000;}
a.green:hover   { text-decoration: none; color: #008000; border-bottom: 1px solid #00A000;}

a.red:link      { text-decoration: none; color: #800000;}
a.red:visited   { text-decoration: none; color: #800000;}
a.red:active    { text-decoration: none; color: #800000; border-bottom: 1px solid #FF0000;}
a.red:hover     { text-decoration: none; color: #800000; border-bottom: 1px solid #FF0000;}

  /***********************/
 /* SEPARATE DIV STYLES */
/***********************/

#tabdiv           { background-color: #007DCC; border: 0px; text-align: left; margin: 0px; padding: 0px; height: 25px; min-width: 800px; }
#contentdiv       { background-color: #FFFFFF; border: 1px solid #000000; text-align: left; margin: 0px; padding: 20px 10px 10px 10px; min-width: 1200px; max-width:120% }
/*#contentdiv       { background-color: #FFFFFF; border: 1px solid #000000; text-align: left; margin: 0px; padding: 20px 10px 10px 10px; min-width: 800px; }*/

#deleteinitial    { display: inline; }
#deleteconfirm    { display: none; }

#checklistdiv     { background-color: #DDEEFF; overflow: auto; width: 400px; height: 300px; border: 0px; padding-left: 5px; font-size: 11px; }
#googlemap        { width: 700px; height: 400px; border: 1px solid #999999; float: left; margin-bottom: 10px; }
#googlecontrols   { width: 160px; height: 390px; border: 1px solid #999999; float: left; margin-left: 10px; margin-bottom: 10px; overflow: auto; padding: 5px;}

#tabdiv ul                            { font-size: 11px; background-color: #007DCC; color: #000000; padding: 0px; margin: 0px; width: 100%; }
#tabdiv ul li                         { display: inline; white-space: nowrap; }
#tabdiv ul li a                       { border: 1px solid #000000; padding: 4px 7px 4px 7px; background-color: #99BBFF; color: #000000; margin: 0px 4px 0px 0px; float: left; }
#tabdiv ul li a:active                { border: 1px solid #000000; background-color: #BBDDFF; color: #800000; }
#tabdiv ul li a:hover                 { border: 1px solid #000000; background-color: #BBDDFF; color: #800000; }
#tabdiv ul li.tabcurrent a            { border: 1px solid #000000; padding: 4px 7px 4px 7px; background-color: #DDEEFF; color: #000000; margin: 0px 4px 0px 0px; float: left; }
#tabdiv ul li.tabcurrent a:active     { border: 1px solid #000000; background-color: #DDEEFF; color: #800000; }
#tabdiv ul li.tabcurrent a:hover      { border: 1px solid #000000; background-color: #DDEEFF; color: #800000; }

#googlecontrols ul                    { margin-left: 12px; padding-left: 12px; }
#googlecontrols h2                    { margin-top: 0px; }

#divgallery 						{background-color:#DDEEFF;vertical-align:top;font-size: 0; padding-bottom:20px; }
#divgallery a 						{background-color:#DDEEFF;border:0; font-size: 16px;  overflow: hidden; display: inline-block; max-width:150; width:calc(20%-8px); height: 165px; margin-top: 16px; margin-bottom: 4px; margin-right: 16px;}
#divgallery a:hover				{border-bottom:0px;}
#divgallery a:hover img			{transform: scale(1.15);}
#divgallery a:nth-of-type(2n) {margin-right: 0;}
#divgallery .figure 				{margin: 0;}
#divgallery .figcaption 		{margin: 0;}
#divgallery img 					{border: none; width 150; height: 100px;  display: block;  background: #ccc; transition: transform .2s ease-in-out;}
#divgallery img:hover 			{transform: scale(1.2);}
#divgallery label 				{text-align:left; font: 12px Tahoma, Arial, Helvetica, Sans-Serif; margin-top:55px; color: #000000;  text-indent: -15px;}


/*
#divgallery tr	{vertical-align:top}
#divgallery td	{vertical-align:top}
#divgallery .p a {  display: inline;  font-size: 13px;  margin: 0;}
#divgallery .p {  text-align: center;  font-size: 13px;  padding-top: 100px;}

@media screen and (min-width: 50em) {
#divgallery 	a { width: 300px; height: calc((20%-8px)*0.6666666);  }  	
#divgallery a:nth-of-type(2n) {    margin-right: 8px;  }  	
#divgallery a:nth-of-type(4n) {    margin-right: 0;  }
*/
}

  /**********/
 /* TABLES */
/**********/

.tablemain               { border: 1px solid #999999; }
.tablemain tr            { background-color: #BBDDFF; vertical-align: middle; }
.tablemain tr.even       { background-color: #DDEEFF; vertical-align: middle; }
.tablemain td            { padding: 4px; margin: 0px; vertical-align: middle; }
.tablemain td.plain      { padding: 4px; margin: 0px; vertical-align: middle; }
.tablemain td.small      { padding: 4px; margin: 0px; vertical-align: middle; text-align:center; }
.tablemain td.unused 	 { background-color: #eaeaea; padding: 4px; margin: 0px; vertical-align: middle; text-align:center; }
.tablemain td.label      { padding: 4px; margin: 0px; text-align: left; font-weight: bold; vertical-align: middle; }
.tablemain td.required   { padding: 4px; margin: 0px; text-align: left; font-weight: bold; color: #990000; vertical-align: middle; }
.tablemain td.data       { padding: 4px; margin: 0px; font-size: 11px; background-color: #DDEEFF; vertical-align: middle; }
.tablemain td.spacer     { padding: 4px; margin: 0px; background-color: #FFFFFF; }
.tablemain td.nopadding  { padding: 0px; margin: 0px; }
.tablemain th            { padding: 4px; margin: 0px; background-color: #99BBFF; }
.tablemain th a:link     { text-decoration: none; color: #000000; }
.tablemain th a:visited  { text-decoration: none; color: #000000; }
.tablemain th a:active   { text-decoration: none; color: #000000; border-bottom: 1px solid #FF0000; }
.tablemain th a:hover    { text-decoration: none; color: #000000; border-bottom: 1px solid #FF0000; }

.tablemain td.functions          { font-size: 11px; color: #BBDDFF; }
.tablemain tr.even td.functions  { font-size: 11px; color: #DDEEFF; }

.tablelayout             { border: none; padding: 0px; margin: 0px; }
.tablelayout tr          { vertical-align: top; }
.tablelayout td          { padding: 0px; margin: 0px; }

.tableoptions            { border: none; padding: 0px; margin: 0px; width: 100% }
.tableoptions tr         { background-color: #DDEEFF; vertical-align: middle; }


  /*****************/
 /* FORM ELEMENTS */
/*****************/

input                         { font: 11px Tahoma, Arial, Helvetica, Sans-Serif; color: #000000; }

input.data                    { border: none; }
input.button                  { font-size: 13px; background-color: #BBDDFF; border: 1px solid; padding: 2px; border-top-color: #888888; border-left-color: #888888; border-right-color: #444444; border-bottom-color: #444444; }
input.bigbutton               { font-size: 13px; background-color: #BBDDFF; border: 1px solid; padding: 5px; border-top-color: #888888; border-left-color: #888888; border-right-color: #444444; border-bottom-color: #444444; }
input.smlbutton               { font-size: 11px; background-color: #BBDDFF; border: 1px solid; padding: 0px; border-top-color: #888888; border-left-color: #888888; border-right-color: #444444; border-bottom-color: #444444; }
input.checkbox                { border: none; background-color: #DDEEFF;}
input.dataentry               { width: 100px; }
input.dataentrycheckbox			{ border: none; background-color: #DDEEFF; width: 15px; height: 15px;  padding: 0; margin:0;  vertical-align: bottom;  position: relative;  *overflow: hidden;}
label 								{ font: 11px Tahoma, Arial, Helvetica, Sans-Serif; color: #000000;  text-indent: -15px;}

textarea                      { font: 11px Tahoma, Arial, Helvetica, Sans-Serif; color: #000000; background-color: #FFFFFF; border: 1px solid #999999;}
textarea.dataentry				{ width: 100px;}
textarea:disabled 				{ background-color: #E6E6E6; }

select                        { font: 11px Tahoma, Arial, Helvetica, Sans-Serif; color: #000000; background-color: #FFFFFF; border: 1px solid #999999; -ms-box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box; box-sizing:content-box;}
select.dataentry					{ width: 100px; padding: 1px 1px;}

select:disabled 					{ background-color: #E6E6E6; }
select option [disabled] 		{ background-color: #E6E6E6; }
select:[disabled] 				{ background-color: #E6E6E6; }

  /**************/
 /* EXCEPTIONS */
/**************/

.pale     							{ color: #999999; font-size: 11px; }
.small    							{ font-size: 11px; }
.warning  							{ color: #A00000; font-weight: bold; }


  /**************************/
 /* EPOCH CALENDAR CONTROL */
/**************************/

table.calendar               { font-family: Helvetica, Arial, sans-serif; font-size: 0.8em; border-collapse: collapse; background-color: white; border: solid #999999 1px; background-color: white; width: 215px; text-align: center; -moz-user-select: none; }
table.calendar a             { }
table.calendar a:hover       { }
table.calendar input         { font-size: 10px; }
table.calendar select        { font-size: 10px; }
table.calendar td            { border: 0; font-size: 10px; text-align: center; }
table.calendar th            { border: 0; font-size: 10px; text-align: center; }
div.mainheading              { margin: 2px; }

table.cells                  { border-collapse: collapse; border: solid #CCCCCC 1px; cursor: pointer; empty-cells: show; margin: 0 6px 0 6px; }
table.cells th               { border: solid #CCCCCC 1px; text-align: center; font-weight: bold; color: #0054E3; width: 22px; }
table.cells th.wkhead        { border-right: double #CCCCCC 3px; cursor: default; width: 22px; }
table.cells td               { border: solid #CCCCCC 1px; vertical-align: top; text-align: center; font-weight: bold; height: 20px; }
table.cells td.wkhead        { background-color: white; text-align: center; border-right: double #CCCCCC 3px; color: #0054E3; }
table.cells td.noselect      { background-color: #EEEEEE; color: #BBBBBB; text-decoration: line-through; cursor: default; }
table.cells td.hlday         { background-color: #99FF99; }
table.cells td.wkday         { background-color: #DDDDDD; }
table.cells td.wkend         { background-color: #DDDDDD; }
table.cells td.curdate       { background-color: #DDDDDD; }
table.cells td.cell_selected { background-color: #99CCFF; color: black; }
table.cells td.notmnth       { background-color: #FFFFFF; color: #CCCCCC; }
table.cells td.notallowed    { background-color: white; color: #EEEEEE; font-style: italic; }
table.cells td.hover         { background-color: #999999; }
table.cells td div           { padding: 1px; margin: 0; }


/* SLIMBOX */
#lbOverlay 							{position: fixed;	z-index: 9999;	left: 0;	top: 0;	width: 100%;	height: 100%;	background-color: #000;	cursor: pointer;}
#lbCenter, #lbBottomContainer {position: absolute;	z-index: 9999;	overflow: hidden;	background-color: #fff;}
.lbLoading 							{background: #fff url(/portals/9/CDMT/pictures/loading.gif) no-repeat center;}
#lbImage 							{position: absolute;	left: 0;	top: 0;	border: 10px solid #fff;	background-repeat: no-repeat;}
#lbSlide								{display: block;	position: absolute;	width: 100%;}
#lbPrevLink, #lbNextLink 		{display: block;	position: absolute;	top: 0;	width: 50%;	outline: none;	font-size: 100000px;  /* Workaround needed for IE */	overflow: hidden;     /* Workaround needed for IE */	color: #666;}
#lbPrevLink 						{left: 0;}
#lbPrevLink:hover 				{background: transparent url(/portals/9/CDMT/pictures/labelprev.gif) no-repeat 0 15%;}
#lbNextLink 						{width: 100%;	right: 0;}
#lbNextLink:hover 				{background: transparent url(/portals/9/CDMT/pictures/labelnext.gif) no-repeat 100% 15%;}
#lbBottom 							{font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;	font-size: 10px;	color: #666;	line-height: 1.4em;	text-align: left;	border: 10px solid #fff;	border-top-style: none;}
#lbCloseLink 						{display: block;	float: right;	width: 66px;	height: 22px;	background: transparent url(/portals/9/CDMT/pictures/labelclose.gif) no-repeat center;	margin: 5px 0;	outline: none;}
#lbCaption, #lbNumber 			{margin-right: 71px;}
#lbCaption 							{font-weight: bold;}


/* Uploading animation to "page content" */
.spinner {position: absolute; display:inline-block; border: 6px solid #f3f3f3;  border-radius: 50%;  border-top: 6px solid #3498db;  border-bottom: 6px solid #3498db;  width: 12px;  height: 12px;  -webkit-animation: spin 2s linear infinite;  animation: spin 2s linear infinite;}
@-webkit-keyframes spin {  0% { -webkit-transform: rotate(0deg); }  100% { -webkit-transform: rotate(360deg); }}
@keyframes spin {  0% { transform: rotate(0deg); }  100% { transform: rotate(360deg); }}