/* Color options
 *   #00659C  DACOR Blue
 *   #009999  DACOR Teal
 */
body {
	background: #FFFFFF URL(/images/office/bg.png);
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10pt;
}
h1 {
	font-family: "Century Gothic", Arial;
	font-weight: normal;
	color: #009999;  /* or for Blue #00659C */
}
h2 {
	font-family: "Century Gothic", Arial;
	font-weight: bold;
	color: #009999;
}
h3 {
	font-family: "Century Gothic", Arial;
	font-weight: normal;
	color: #009999;
}
h4, h5, h6 {
	color: #009999;
}
strong, b {
	font-weight: bold;
}
a:hover, a:visited, a:link, a:active {
	color: #0000FF;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

select {
	font-family: "Courier New";
	font-size: 10pt;
}
select:active,
select:focus {
	background-color: #FFFFE6;
}
select option {
	font-family: "Courier New";
	font-size: 10pt;
	background-color: #FFFFE6;
	color: black;
}

input[type=button],
input[type=submit],
input[type=reset],
button {
    display: inline-block;
    padding: 5px 10px;
	border: 1px solid #009999;
	border-radius: 20px;
    background-color: #009999;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
}
input[type=button].green,
input[type=submit].green,
input[type=reset].green,
button.green {
    background-color: #339933;
}
input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover,
button:hover {
	border: 1px solid #009999;
	background-color: #D2D2D2;
	color: #009999;
}
input[type=checkbox],
input[type=radio] {
}
input[type=text]:active,
input[type=text]:focus,
textarea:active,
textarea:focus {
	background-color: #FFFFE6;
}
input:required {
	border: 1px solid #FF0000;
}

.content-box {
	display: inline-block;
	margin: 10px 5px;
	padding: 5px;
	border: 2px solid #009999;
	border-radius: 10px;
	background-color: #FFFFFF;
}

div.content-box div.error {
	display: block;
	margin: 5px 0px;
	padding: 10px;
	border-radius: 5px;
	background-color: #FFCCCC;
}

div.content-box div.success {
	display: block;
	margin: 5px 0px;
	padding: 10px;
	border-radius: 5px;
	background-color: #CCFFCC;
}

div.content-box div.notice {
	display: block;
	margin: 5px 0px;
	padding: 10px;
	border-radius: 5px;
	background-color: #CCE6FF;
}

div.system-error {
	display: block;
	width: 100%;
	margin: 10px 5px;
	padding: 5px;
	border-radius: 5px;
	background-color: #FFCCCC;
	text-align: left;
}

div.system-success {
	display: block;
	width: 100%;
	margin: 10px 5px;
	padding: 5px;
	border-radius: 5px;
	background-color: #CCFFCC;
	text-align: left;
}

div.system-notice {
	display: block;
	width: 100%;
	margin: 10px 5px;
	padding: 5px;
	border-radius: 5px;
	background-color: #CCE6FF;
	text-align: left;
}

span.error   { color: #FF0000; }
span.success { color: #00FF00; }
span.notice  { color: #0000FF; }
span.status-ACTIVE { color: #008000 }
span.status-CLOSED { color: #FF0000 }
span.status-HOLD   { color: #FF0000 }
span.status-NEW    { color: #0000FF }

table.stripped tr:nth-child(odd) td {
	background-color: #CCCCCC;
}
table.stripped tr:nth-child(even) td {
	background-color: #E6E6E6;
}
td.label { font-weight: bold; }
.row-odd { background-color: #CCCCCC; }
.row-even { background-color: #E6E6E6; }
.fancy .label { background-color: #E6E6E6; }
.fancy .value { background-color: #FFFFE6; font-weight: bold; }

dd {
	margin-bottom: 10px;
}

@media screen and (max-width: 400px) {
	table.phone-safe td {
		display: inline-block;
		width: 100%;
		margin: 0;
		padding: 5px;
		border: 0;
	}
}