@CHARSET "UTF-8";

/* ------------------------------------------------------------------------------
   ----- Base / Default ---------------------------------------------------------
   ------------------------------------------------------------------------------ */

BODY {
	margin: 0px auto;
	padding: 10px;
	font-family: "Lucida Grande", verdana, arial, helvetica, sans-serif;
	color: #202020;
	background-color: #99ACC0;
}

TABLE {
	border: 0px;
	margin: 0px;
}

IMG {
	behavior: url(scripts/iepngfix.htc);
	border: 0px;
}

/* ------------------------------------------------------------------------------
   ----- Page Layout ------------------------------------------------------------
   ------------------------------------------------------------------------------ */

DIV#main-page {
	border: thin solid #000000;
	text-align: left;
	background-color: #FFFFFF;
	width: 90%;
	min-width: 750px;
	background-color: #FFFFFF;
	padding: 10px;
	margin: 0px auto;
	display: table;
}

DIV#main-header {
	font-size: xx-large;
	font-weight: bold;
	padding: 10px;
}

DIV#main-footer {
	border: thin solid #000000;
	text-align: right;
	background-color: #0000FF;
	color: #FFFFFF;
	font-size: xx-small;
	padding: 5px;
}

/* ------------------------------------------------------------------------------
   ----- Images -----------------------------------------------------------------
   ------------------------------------------------------------------------------ */

IMG.icon {
	vertical-align: middle;
	margin-right: 10px;
}

IMG.mini-icon {
	vertical-align: middle;
	margin-right: 5px;
}

/* ------------------------------------------------------------------------------
   ----- Message boxes ----------------------------------------------------------
   ------------------------------------------------------------------------------ */

DIV.box-error {
	color: #880000;
	background-color: #FFDDDD;
	border: thin solid #FF0000;
	text-align: left;
	vertical-align: middle;
	padding: 20px;
}

DIV.box-info {
	color: #000088;
	background-color: #DDDDFF;
	border: thin solid #0000FF;
	text-align: left;
	vertical-align: middle;
	padding: 20px;
}

DIV.box-warning {
	color: #000000;
	background-color: #FFFFDD;
	border: thin solid #FFFF00;
	text-align: left;
	vertical-align: middle;
	padding: 20px;
}

DIV.box-confirm {
	color: #000000;
	background-color: #FFFFDD;
	border: thin solid #FFFF00;
	text-align: center;
	vertical-align: middle;
	padding: 20px;
	margin: 10px 100px 10px 100px;
	font-weight: bold;
}

/* ------------------------------------------------------------------------------
   ----- Lists ------------------------------------------------------------------
   ------------------------------------------------------------------------------ */

TABLE.list-box {
	background-color: #FFFFFF;
	border: thin solid #000000;
	margin: 0px;
}

TD.listheader {
	font-size: large;
	font-weight: bold;
	background-color: #DDDDDD;
}

TD.searchbox {
	background-color: #DDDDDD;
	text-align: right;
	vertical-align: middle;
}

TD.notebox {
	font-size: small;
	background-color: #F8F8F8;
	padding: 5px;
}

TD.colheader {
	font-size: small;
	background-color: #444488;
	color: #FFFFFF;
	font-weight: bold;
	text-align: left;
}

TD.colheader-right {
	font-size: small;
	background-color: #444488;
	color: #FFFFFF;
	font-weight: bold;
	text-align: right;
}

TD.colheader A:link { color: #DDDDFF; text-decoration: none; }
TD.colheader A:visited { color: #DDDDFF; text-decoration: none; }
TD.colheader A:active { color: #DDDDFF; text-decoration: none; }
TD.colheader A:hover { color: #DDDDFF; text-decoration: underline; }

TD.row1 {
	font-size: small;
	background-color: #F0F0F0;
	white-space : nowrap;
	padding: 3px;
}

TD.row2 {
	font-size: small;
	background-color: #F8F8F8;
	white-space : nowrap;
	padding: 3px;
}
	
/* ------------------------------------------------------------------------------
   ----- Menus ------------------------------------------------------------------
   ------------------------------------------------------------------------------ */

DIV#main-menu {
	border: thin solid #000000;
	text-align: right;
	background-color: #0000FF;
	color: #FFFFFF;
	font-size: x-small;
	font-weight: bolder;
	padding: 10px;
	white-space : nowrap;
}

DIV#main-menu A:link { color: #FFFFFF; text-decoration: none; }
DIV#main-menu A:visited { color: #FFFFFF; text-decoration: none; }
DIV#main-menu A:active { color: #FFFFFF; text-decoration: none; }
DIV#main-menu A:hover { color: #FFFFFF; text-decoration: underline; }

DIV.floating-menu {
	text-align: left;
	color: #0000FF;
	font-size: medium;
	font-weight: bold;
	padding: 5px;
}

DIV.floating-menu A:link { color: #0000FF; text-decoration: none; }
DIV.floating-menu A:visited { color: #0000FF; text-decoration: none; }
DIV.floating-menu A:active { color: #0000FF; text-decoration: none; }
DIV.floating-menu A:hover { color: #0000FF; text-decoration: underline; }

DIV.floating-menu-mini {
	text-align: left;
	color: #0000FF;
	font-size: x-small;
	font-weight: bold;
	padding: 5px;
}

DIV.floating-menu-mini A:link { color: #0000FF; text-decoration: none; }
DIV.floating-menu-mini A:visited { color: #0000FF; text-decoration: none; }
DIV.floating-menu-mini A:active { color: #0000FF; text-decoration: none; }
DIV.floating-menu-mini A:hover { color: #0000FF; text-decoration: underline; }

/* ------------------------------------------------------------------------------
   ----- Forms ------------------------------------------------------------------
   ------------------------------------------------------------------------------ */
fieldset ol {
	margin: 0px;
	padding: 0em 1em 0em 1em;   
	list-style: none;  
}  
fieldset li {   
	padding-bottom: 10px;  
}

TABLE.form-box {
	width: 100%;
	margin: 0px;
}

INPUT {
	border: thin solid #000000;
}

TEXTAREA {
	border: thin solid #000000;
}

SELECT {
	border: thin solid #000000;
}

INPUT.submit {
	border: 3px double #999999;
	border-top-color: #CCCCCC;
	border-left-color: #CCCCCC;
	background-color: #FFFFFF;
	background-image: url('ui/button-bg.gif');
	background-repeat: repeat-x;
	color: #333333;
	font-weight: bold;
	font-family: Verdana, Helvetica, Arial, sans-serif;
}

BUTTON {
	border: 3px double #999999;
	border-top-color: #CCCCCC;
	border-left-color: #CCCCCC;
	background-color: #FFFFFF;
	background-image: url('images/button-bg.gif');
	background-repeat: repeat-x;
	color: #333333;
	font-weight: bold;
	font-family: Verdana, Helvetica, Arial, sans-serif;
}

TD.form-header {
	font-size: large;
	font-weight: bold;
	background-color: #DDDDDD;
}

TD.form-subsection, DIV.form-section-header {
	background-color: #444488;
	color: #FFFFFF;
	font-weight: bold;
	text-align: left;
	border: thin solid #000000;
	font-size: medium;
}

DIV.form-section-container { 
  width: 95%;
  margin: 5px auto;
	clear: both;
	font-weight: bold;
}

OL.walign LABEL {
	display: block;
	float: left;
	margin-right: 5px;
}

DIV.form-section-header {
	padding: 10px;
	border: none;
	margin-bottom: 10px;
	margin-top: 20px;
}

TD.form-tag {
	padding: 10px;
	text-align: right;
	font-weight: bold;
	white-space : nowrap;
}

TD.form-input {
	padding: 10px;
	text-align: left;
}

FIELDSET.form-fieldset {
  border: 1px dotted #cccccc;
}

FIELDSET.form-fieldset LEGEND {
	padding-top: 10px;
	font-size: large;
	font-weight: bold;
}

DIV.form-device {
	border-left: 5px solid #444488;
	margin-left: 25px;
	padding-left: 5px;
	font-weight: normal;
}

DIV.form-section-container textarea {
	width: 100%;
}

/* ------------------------------------------------------------------------------
   ----- Views ------------------------------------------------------------------
   ------------------------------------------------------------------------------ */

TABLE.view-box {
	background-color: #EEEEEE;
	border: thin solid #000000;
	margin: 0px;
}

TD.view-header {
	padding: 10px;
	font-size: x-large;
	font-weight: bold;
	background-color: #DDDDDD;
}

TD.view-subsection {
	padding: 10px;
	background-color: #DDDDDD;
	color: #000000;
	text-align: left;
	font-size: medium;
}

TD.view-desc {
	padding: 10px;
	font-weight: bold;
	text-align: right;
	vertical-align: text-top;
}

TD.view-text {
	padding: 10px;
	text-align: left;
}

TABLE.view-photo {
	background-color: #DDDDDD;
	border: thin solid #000000;
	margin: 0px;
}

DIV.view-link A:link { color: #0000FF; text-decoration: none; }
DIV.view-link A:visited { color: #0000FF; text-decoration: none; }
DIV.view-link A:active { color: #FF0000; text-decoration: underline; }
DIV.view-link A:hover { color: #FF0000; text-decoration: underline; }

TD.view-calendar-day {
	font-size: medium;
	background-color: #444488;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
}

TD.view-calendar-box {
	background-color: #FFFF99;
	color: #000000;
	text-align: center;
	border: thin solid #000000;
	cursor: hand;
	cursor: pointer;
}

TD.view-calendar-box-today {
	background-color: #AAAAFF;
	color: #000000;
	text-align: center;
	border: thin solid #000000;
	cursor: hand;
	cursor: pointer;
}

DIV.view-calendar-day-number {
	font-size: large;
	font-weight: bold;
}	

DIV.view-calendar-event {
	font-size: xx-small;
}

/* ------------------------------------------------------------------------------
   ----- Dashboard --------------------------------------------------------------
   ------------------------------------------------------------------------------ */

TABLE.db-box-ok {
	text-align: center;
	background-color: #EEEEEE;
	border: thin solid #000000;
	margin: 0px;
	cursor: hand;
	cursor: pointer;
}

TABLE.db-box-down {
	text-align: center;
	color: #880000;
	background-color: #FFDDDD;
	border: thin solid #000000;
	margin: 0px;
	cursor: hand;
	cursor: pointer;
}

TABLE.db-box-off {
	text-align: center;
	color: #000000;
	background-color: #DDDDDD;
	border: thin solid #000000;
	margin: 0px;
	cursor: hand;
	cursor: pointer;
}

TABLE.db-box-alert {
	text-align: center;
	color: #7E3117;
	background-color: #FFE0B0;
	border: thin solid #000000;
	margin: 0px;
	cursor: hand;
	cursor: pointer;
}

TD.db-header-ok {
	font-size: large;
	font-weight: bold;
	background-color: #88FF88;
	padding: 10px;
	cursor: hand;
	cursor: pointer;
}

TD.db-header-down {
	font-size: large;
	font-weight: bold;
	background-color: #FF8888;
	padding: 10px;
	cursor: hand;
	cursor: pointer;
	text-decoration: blink;
}

TD.db-header-off {
	font-size: large;
	font-weight: bold;
	background-color: #AAAAAA;
	padding: 10px;
	cursor: hand;
	cursor: pointer;
}

TD.db-header-alert {
	font-size: large;
	font-weight: bold;
	background-color: #FFA060;
	padding: 10px;
	cursor: hand;
	cursor: pointer;
	text-decoration: blink;
}

TD.db-body {
	padding: 10px;
	cursor: hand;
	cursor: pointer;
}

DIV.calendar-header {
	font-size: medium;
	font-weight: bold;
}

TD.calendar-text {
	vertical-align: text-top;
	font-size: small;
	border: thin solid #000000;
}

TABLE.calendar-box {
	background-color: #FFFFFF;
	border: thin solid #000000;
	margin: 0px;
}

TD.calendar-title {
	font-size: large;
	font-weight: bold;
	background-color: #DDDDDD;
}

TD.calendar-day {
	font-size: small;
	background-color: #444488;
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
	white-space : nowrap;
	border: thin solid #000000;
}

/* ------------------------------------------------------------------------------
   ----- Status -----------------------------------------------------------------
   ------------------------------------------------------------------------------ */

DIV.status-inv {
	color: brown;
	font-weight: bold;
}

DIV.status-up {
	color: green;
	font-weight: bold;
}

DIV.status-down {
	color: red;
	font-weight: bold;
}

DIV.status-pre {
	color: blue;
	font-weight: bold;
}

DIV.status-dead {
	color: #888888;
	font-weight: bold;
}

DIV.status-remote {
	color: #FF6600;
}

/* ------------------------------------------------------------------------------
   ----- Page Navigation --------------------------------------------------------
   ------------------------------------------------------------------------------ */

IMG.nav-icon {
	vertical-align: middle;
	margin-right: 5px;
	margin-left: 5px;
}

DIV.nav {
	text-align: right;
	color: #FFFFFF;
	font-size: medium;
	font-weight: normal;
	padding: 10px;
}

DIV.nav A:link { color: #FFFFFF; text-decoration: none; }
DIV.nav A:visited { color: #FFFFFF; text-decoration: none; }
DIV.nav A:active { color: #FFFFFF; text-decoration: none; }
DIV.nav A:hover { color: #FFFFFF; text-decoration: underline; }

/* ------------------------------------------------------------------------------
   ----- Community Calendar Preview ---------------------------------------------
   ------------------------------------------------------------------------------ */

/* Originals
.time {font-family:sans-serif; color: blue; font-weight:bold; font-size: 30px;}
.timend {font-family:sans-serif; color: blue; font-weight:800; font-size: 20px;}
.sdesc {font-family:sans-serif; color: black; font-weight:bold; font-size: 44px;}
.ldesc {font-family:sans-serif; color: black; font-weight:bold; font-size: 24px;}
.loc {font-family:sans-serif; color: blue; font-weight:bold; font-size: 20px;}
.comment {font-family:serif; color: black; font-weight:normal; font-size: 20px;}
*/

.time {font-family:sans-serif; color: blue; font-weight:bold; font-size: 18px;}
.timend {font-family:sans-serif; color: blue; font-weight:800; font-size: 12px;}
.sdesc {font-family:sans-serif; color: black; font-weight:bold; font-size: 24px;}
.ldesc {font-family:sans-serif; color: black; font-weight:bold; font-size: 14px;}
.loc {font-family:sans-serif; color: blue; font-weight:bold; font-size: 12px;}
.comment {font-family:serif; color: black; font-weight:normal; font-size: 12px;}

.which-day {
	font-size: 28px;
	font-weight: bold;
}

/* ------------------------------------------------------------------------------
   ----- Date Picker ------------------------------------------------------------
   ------------------------------------------------------------------------------ */

/* the div that holds the date picker calendar */
.dpDiv {
	}


/* the table (within the div) that holds the date picker calendar */
.dpTable {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #505050;
	background-color: #ece9d8;
	border: 1px solid #AAAAAA;
	}

/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
	}


/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
	}


/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {
	}


/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
	}


/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
	border: 1px solid #ece9d8;
	}


/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	}


/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
	background-color: #aca998;
	border: 1px solid #888888;
	cursor: pointer;
	color: red;
	}


/* the table cell that holds the name of the month and the year */
.dpTitleTD {
	background-color: #444488;
}


/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD {
	}


/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
	}


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
	background-color: #CCCCCC;
	border: 1px solid #AAAAAA;
	color: black;
	}


/* additional style information for the text that indicates the month and year */
.dpTitleText {
	font-size: 12px;
	color: white;
	font-weight: bold;
	}


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 
.dpDayHighlight {
	color: #4060ff;
	font-weight: bold;
	}


/* the forward/backward buttons at the top */
.dpButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: black;
	background: #d8e8ff;
	font-weight: bold;
	padding: 0px;
	}


/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: black;
	background: #d8e8ff;
	font-weight: bold;
	}