/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.

----------------------------------------------------------*/
HTML {
  padding: 0px;
  border: 0px;
  font-size: 100%;
  vertical-align: baseline;
  font-family: inherit;
  margin: 0px;
  outline: 0;
  background-color: #fff;
}

BODY {
  padding: 0px;
  border: 0px;
  vertical-align: baseline;
  margin: 0px;
  outline: 0;
  padding-right: 0px;
  padding-left: 0px;
  padding-bottom: 0px;
  margin: 0px;
  font: 1rem Arial, Helvetica, sans-serif;
  color: #444;
  padding-top: 0px;
  background-color: Transparent;
  background-image: none;
}

a:link {
  color: #034af3;
  text-decoration: underline;
}

a:visited {
  color: #505abc;
}

a:hover {
  color: #1d60ff;
  text-decoration: none;
}

a:active {
  color: #12eb87;
}

p, ul {
  margin-bottom: 20px;
  line-height: 1.6em;
}

header, #header,
footer, #footer,
nav, #nav,
section, #main {
  display: block;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
  font-size: 1.5em;
  color: #000;
}

h1 {
  font-size: 2em;
  padding-bottom: 0;
  margin-bottom: 0;
  margin: 0;
}

h2 {
  margin: 0;
  padding: 0 0 10px 0;
}

h3 {
  font-size: 1.2em;
}

h4 {
  font-size: 1.1em;
}

h5, h6 {
  font-size: 1em;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
header, #header {
  margin-bottom: 0px;
  color: #000;
  padding: 0;
  background-image: url("images/bg_header.jpg");
  height: 95px;
}

header div.inside, #header div.inside {
  width: 910px;
  margin: 0 auto;
  padding-left: 10px;
}

header h1, #header h1 {
  font-weight: bold;
  padding: 5px 0;
  margin: 0;
  color: #fff;
  border: none;
  line-height: 2em;
  font-size: 32px !important;
  text-shadow: 1px 1px 2px #111;
}

#main {
  background-color: #fff;
  width: 910px;
  margin: 0 auto;
  padding-left: 10px;
  background-color: white;
  padding-top: 15px;
}

footer,
#footer {
  background-color: #fff;
  color: #999;
  padding: 10px 0;
  text-align: center;
  line-height: normal;
  margin: 0 0 30px 0;
  font-size: 0.9em;
  border-top: 1px solid #ddd;
  width: 910px;
  margin: 0 auto;
  margin-top: 20px;
}

img {
  border: 0;
}

/* MISC  
----------------------------------------------------------*/
.clear {
  clear: both;
}

.error {
  color: Red;
}

div#title {
  display: block;
  float: left;
  text-align: left;
  height: 58px;
  overflow: hidden;
}

#logindisplay {
  font-size: 0.9em;
  display: block;
  text-align: right;
  margin: 0px;
  color: #333;
  padding-top: 5px;
}

#logindisplay a:link {
  color: #333;
  text-decoration: none;
}

#logindisplay a:visited {
  color: #333;
  text-decoration: none;
}

#logindisplay a:hover {
  color: #333;
  text-decoration: underline;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
  color: #ff0000;
}

.field-validation-valid {
  display: none;
}

.input-validation-error {
  border: 1px solid #ff0000;
  background-color: #ffeeee;
}

.validation-summary-errors {
  margin: 10px;
  font-weight: bold;
  color: #ff0000;
}

.validation-summary-valid {
  display: none;
}

.validation-summary-errors ul {
  list-style-type: none;
  margin: 0;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label,
.editor-label {
  margin: 1em 0 0 0;
}

.display-field,
.editor-field {
  margin: 0.5em 0 0 0;
}

.text-box {
  width: 30em;
}

.text-box.multi-line {
  height: 6.5em;
}

.tri-state {
  width: 6em;
}

/* Styles for buttons
-----------------------------------------------------------*/
button, .button, .buttonlocked, a.button {
  background: #dddddd;
  border: 1px solid #bbbbbb;
  color: #666;
  cursor: pointer;
  display: inline-block;
  /*font-size: 90%;*/
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 0 8px 0 8px; /*ie9*/
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  padding: 3px;
  background-image: linear-gradient(top, #eeeeee, #dddddd);
  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
  /*----CSS3 properties----*/
  /*----In ie the first couplet sets the alpha value so 00=transparent and ff=opaque)----*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr="#eeeeee", EndColorStr="#dddddd");
  background: -webkit-gradient(linear, 0 0, 0 100%, from(rgb(221, 221, 221)), to(rgb(204, 204, 204)));
  background: -moz-linear-gradient(top, rgb(221, 221, 221), rgb(204, 204, 204));
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

#logindisplay button {
  font-size: 0.9em;
}

button, input.button, x:-moz-any-link {
  padding: 0px 8px 4px 8px;
}

button:hover, .button:hover, .buttonlocked:hover, a.button:hover {
  border-color: #8084a8;
  color: #484a5f;
  text-decoration: none;
  background: #bacfe4;
  background-image: linear-gradient(top, #babee4, #9ca1cd);
  background-image: -o-linear-gradient(top, #bacfe4, #9cc5cd);
  /*CSS3 properties*/
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr="#bacfe4", endColorstr="#9cc5cd");
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#bacfe4), to(#9cc5cd));
  background: -moz-linear-gradient(top, #bacfe4, #9cc5cd);
}

.buttonlocked:hover {
  border-color: #a88c80;
  color: #484a5f;
  text-decoration: none;
  background: #bacfe4;
  background-image: linear-gradient(top, #e4c3ba, #cd9c9c);
  background-image: -o-linear-gradient(top, #e4c3ba, #cd9c9c);
  /*CSS3 properties*/
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr="#e4c3ba", endColorstr="#cd9c9c");
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#e4c3ba), to(#cd9c9c));
  background: -moz-linear-gradient(top, #e4c3ba, #cd9c9c);
}

button:active, .buton:active, a.button:active {
  border-color: #8084a8;
  color: #484a5f;
  text-decoration: none;
  background: #bacfe4;
  background-image: linear-gradient(top, #bacfe4, #9cc5cd);
  background-image: -o-linear-gradient(top, #bacfe4, #9cc5cd);
  /*CSS3 properties*/
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr="#bacfe4", endColorstr="#9cc5cd");
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#bacfe4), to(#9cc5cd));
  background: -moz-linear-gradient(top, #bacfe4, #9cc5cd);
}

button:focus::-moz-focus-inner, .button:focus::-moz-focus-inner {
  border: 1px dotted transparent;
}

#header .inside #title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.5rem;
  font-weight: bold;
}
#header .inside #title img {
  height: 45px;
}

.card {
  float: left;
  width: 250px;
  margin: 10px;
  padding: 10px;
  background-color: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 10px;
}

.card .head {
  font-weight: bold;
  margin-bottom: 10px;
  text-align: center;
}

.card dl dt {
  clear: left;
  float: left;
  line-height: 150%;
}

.card dl dd {
  float: right;
}

.card.w60 dl dd {
  width: 60%;
}

/* Message Styles
-----------------------------------------------------------*/
.messages {
  border: 1px solid #ccc;
  font-weight: bold;
  color: #ff0000;
  margin-bottom: 15px;
}

.message {
  padding: 3px 25px 3px 10px;
}

.validation-summary-errors {
  margin-top: 5px;
  padding: 4px;
}

.messages a {
  font-weight: bold;
}

.message-I {
  background: rgb(230, 241, 201);
  color: rgb(6, 34, 50);
}

.message-W {
  background: rgb(253, 245, 188);
  color: rgb(6, 34, 50);
}

.message-C {
  background: rgb(230, 133, 133);
  color: rgb(6, 34, 50);
}

.validation-summary-errors {
  background: rgb(255, 238, 238);
  border: 1px solid #ccc;
  color: rgb(6, 34, 50);
}

.message-E {
  background: rgb(255, 238, 238);
  color: rgb(6, 34, 50);
}

.perms label {
  margin-left: 5px;
}

.perms p {
  margin: 0px;
  font-size: 0.8em;
  padding: 3px;
  margin-left: 15px;
  background-color: #f5f5f5;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.hidden {
  display: none;
}

.req {
  color: red;
  margin-left: 5px;
}

.confirmemailsent {
  padding: 10px;
  background: #f5f5f5 url("images/icons/black/sand_16.png") no-repeat;
  background-position: 10px 10px;
  padding-left: 30px;
}

div.dialog .icon {
  width: 32px;
  height: 32px;
  background-repeat: no-repeat;
}

div.dialog .icon-error {
  background-image: url("images/dialog/err.png");
}

div.dialog .icon-warning {
  background-image: url("images/dialog/warn.png");
}

div.dialog .icon-info {
  background-image: url("images/dialog/info.png");
}

div.dialog .icon-question {
  background-image: url("images/dialog/help.png");
}

div.dialog .icon-loading {
  background-image: url("images/dialog/loading.gif");
}

img.lookup {
  cursor: pointer;
  vertical-align: middle;
  margin-right: 5px;
  margin-bottom: 2px;
}

.loading {
  position: absolute;
  margin: 5px;
  padding: 25px;
  background-color: #fff;
  color: #000;
  z-index: 100000;
  border: 1px solid #999;
  display: none;
}

.boxedtext {
  border: 1px solid #ddd;
  padding: 5px;
}

.lbl {
  font-weight: bold;
}