/* CSS for HTML structures generated by ExSite::HTML */

/* Buttons in ExSite.css */

/* Icon */

div.icon {
    float:left;
    width:110px;
    height:115px;
    text-align:center;
    overflow:hidden;
}
div.icon img {
    padding:10px;
    border-width:0px;
}
div.icon a { 
    font-size:9pt;
    text-decoration:none;
    color:#333;
    font-weight:normal;
}

/* Popups */

div.popup {
    border-left: 2px solid #e6e4c1;
    border-top: 2px solid #e6e4c1;
    border-right: 2px solid #8c863e;
    border-bottom: 2px solid #8c863e;
    background-color:#ffffcc;
    color:black;
    padding:10px;
    display:none;
    z-index:10;
    width:300px;
    position:absolute;
    left:30px;
    top:-20px;
}
span.popup_p { 
    position:relative;
}
a.popup_close {
    display:block;
    color:#666;
    float:right;
    text-align:center;
    border:1px solid #8c863e;
    padding:2px;
    width:40px;
    font-size:xx-small;
}
a.popup_close:hover {
    background-color:#e6e4c1;
    text-decoration:none;
}

div.overlay {
     display:none;
     position: fixed;
     left: 0px;
     top: 0px;
     width:100%;
     height:100%;
     text-align:center;
     background-image:url(overlay.png);
     z-index: 1000;
}
div.overlayBox {
     width:300px;
     height:300px;
     margin: 100px auto;
     background-color: #fff;
     border:2px solid #000;
    -webkit-border-radius:20px;    
    -moz-border-radius:20px;    
     padding:25px;
     text-align:left;
}

div.help_popup {
    border-left: 2px solid #e6e4c1;
    border-top: 2px solid #e6e4c1;
    border-right: 2px solid #8c863e;
    border-bottom: 2px solid #8c863e;
    background-color:#ffffcc;
    color:black;
    padding:10px;
    position:relative;
    width:300px;
    z-index:10;
    display:none;
}
span.help_hotspot {
    border:1px solid #8c863e; 
    padding-left:2px; 
    padding-right:2px; 
    font-size:80%; 
    color:#8c863e; 
    background-color:#e6e4c1
    position:relative; 
    top:-2px;
}

span.help_hotspot,span.tooltip_hotspot {
    border:1px solid #8c863e; 
    padding-left:2px; 
    padding-right:2px; 
    font-size:80%; 
    color:#565438; 
    position:relative; 
    top:-2px;
}

/* spacer (for padding around boxes, tables, etc) */

div.spacer {
    margin-bottom:10px;
    margin-right:10px;
}

/* Boxes */

div.box {
    margin-bottom:10px;
}
div.boxhead {
    background:url(barbg.png);
    font-weight:bold;
    padding:5px;
    text-align:center;
    position:relative;
    border-style:solid;
    border-width:1px 1px 0px 1px;
    border-color:#bbb;
}
div.boxpane {
    background-color:white;
    padding:20px;
    border:1px solid #bbb;
}

div.errorbox div.boxhead {
    background-color: #cc0000;
}
div.errorbox div.boxpane {
    border:2px #cc0000 solid; 
}

div.scrollpane {
    background-color:white;
    overflow:auto;
    height:400px;
    padding:20px;
    border:1px solid #bbb;
}
div.croppane {
    background-color:white;
    overflow:hidden;
    height:200px;
    padding-top:20px;
    padding-left:20px;
    padding-right:20px;
    padding-bottom:0px;
    border:1px solid #bbb;
}

/* Framed Boxes */

div.framebox {
    margin-bottom:2px;
    margin-right:10px;
}
div.framehead {
    position:relative;
    left:10px;
    z-index:1;
}
span.framehead {
    padding-left:8px;
    padding-right:8px;
    padding-top:2px;
    padding-bottom:2px;
    font-weight:bold;
    font-size:12px;
    background-color:#dde;
}
div.framepane {
    position:relative;
    top:-8px;
    z-index:0;
    padding:14px;
    border:1px solid #999;
}

/* Menu Boxes */

div.menubox {
    border:1px solid #bbb;
    background-color:white;
    padding:0px;
    margin-bottom:10px;
    margin-right:10px;
}
td.menubox_vmenu {
    padding:0px;
    background-color:#ccc;
    border-right:1px solid #bbb;
    width:150px;
}
td.menubox_vmenu a {
    display:block;
    width:122px;
    padding:8px;
    padding-right:20px;
    text-decoration:none;
    color:#666;
}
td.menubox_vmenu a:hover {
    background-color:#999;
    color:white;
}
td.menubox_vmenu a#thistab {
    background-color:#777;
    color:white;
}
div.menuboxpane {
    background-color:white;
    padding:20px;
}

a.boxcontrol img {
	height:18;
	width:18;
	background-color:white;
	border:0px solid white;
}

/* TabBox */

.tabpane { 
    background-color:white; 
    padding: 20px;
    border:1px #bbb solid;
    margin-bottom:10px;
}

.tabbar {
    display: inline-block;
    position:relative;
    top:1px;
}
.tabbar:after {
    content: ".";
    display: block;
    height: 0;	
    font-size:0;
    clear: both;
    visibility:hidden; 
}

.tab {
    float:left;
    width:125px;
    padding:4px;
    padding-left:10px;
    margin-right:5px;
    background:url(barbg.png);
    cursor:pointer;
    border:1px #bbb solid;
    -webkit-border-top-left-radius:4px;    
    -webkit-border-top-right-radius:4px;    
    -moz-border-radius-topleft:4px;    
    -moz-border-radius-topright:4px;
}
.tab:hover {
    background-position:5px;
    color:black;
}
.thistab {
    background:white;
    color:black;
    cursor:default;
    border:1px #bbb solid;
    border-bottom:1px solid white;
}
.thistab:hover {
    background-color:white;
    color:black;
}
div.tabbox {
    margin-bottom:10px;
    margin-right:10px;
}
.tabnopane { 
    padding: 0px;
    border-top:1px #bbb solid;
    margin-bottom:10px;
    margin-right:10px;
}

/* Accordion Box */

table.accordionbox { 
    border:1px #bbb solid; 
    border-collapse:collapse; 
    background-color:white;
    width:100%;
    margin-bottom:10px;
    margin-right:10px;
}
table.accordionbox td { 
    border:1px #bbb solid; 
    padding:0px; 
}
table.accordionbox th.accordioncontrol { 
    border:1px #bbb solid; 
    padding:4px; 
    background:url(barbg.png);
    cursor:pointer;
    color:#666;
    text-align:left;
}
table.accordionbox th.accordioncontrol:hover { 
    color:black;
}
.accordioncontrolicon img {
    background-color:white;
    border:0px solid white;
}
div.accordionpane {
    padding:8px;
}

/* Dynamic Lists */

div.list { 
    margin-left: 9px; 
}
div.listitem a {
    text-decoration:none;
}
div.listitem a:hover {
    text-decoration:underline;
}
div.listitem div.list {
    margin-left:20px;
}
a.listcontrol {
    text-decoration:none;
}
a.listcontrol img {
    border: 0px solid white;
}
/* for using [+] and [-] graphics, not arrows
a.listcontrol:hover {
    background-color:#ffff66;
}
*/

/* bar objects */

td.barPadding {  /* right padding */
  width:100%;
}
td.barSeparator { /* vertical 'rule' separator */
  border-left:1px solid #bbb;
}

/* toolbar - a bar with multiple segments, containing buttons */

table.toolbar {
  width:100%;
  padding:0px;
  border-collapse:collapse;
  margin-bottom:10pt;
}
table.toolbar td {
  background:url(barbg.png);
  padding:5px;
  margin:0px;
  height:35px;
  border:1px solid #bbb;
  font-size:80%;
}
table.toolbar a {
  padding:5px;
  height:18px;
  background-color:#f0f0f0;
  border:1px solid #bbb;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  font-weight:normal;
  color:black;
  text-decoration:none;
  margin-left:3px;
}
table.toolbar a:hover {
  text-decoration:none;
  background-color:white;
  border:1px solid #999;
}
table.toolbar a:active {
  background-color:yellow;
}

/* pathbar - a bar showing a cookie crumb path */

table.pathbar {
  background:url(barbg.png);
  width:100%;
  border:1px solid #bbb;
  padding:0px 0px 0px 10px;
  border-collapse:collapse;
  margin-bottom:10px;
}
table.pathbar td {
  padding:0px 0px 0px 5px;
  margin:0px;
  height:35px;
  font-size:80%;
  text-align:center;
  white-space:nowrap;
}
table.pathbar a {
  font-weight:normal;
  color:#666;
  text-decoration:none;
  padding:10px;
}
table.pathbar a:hover {
  text-decoration:none;
  color:black;
}
table.pathbar td.pathLast a {
  font-weight:bold;
}
table.pathbar td.pathSeparator {
  padding:0px;
  width:12px;
  min-width:12px;
  background:url(pathbarbg.png);
}

/* menubar - a bar divided into button-like links */

table.menubar {
  width:100%;
  padding:0px 0px 0px 10px;
  border-collapse:collapse;
  margin: 0px 0px 10px 0px;
}
table.menubar td {
  border:1px solid #bbb;
  margin:0px;
  font-size:80%;
  text-align:center;
  padding:0px;
  height:35px;
}
table.menubar a {
  display:block;
  background:url(barbg.png);
  font-weight:normal;
  color:#666;
  text-decoration:none;
  padding:10px;
}
table.menubar a:hover {
  text-decoration:none;
  color:black;
  background-position:0 -10px;
}

/* iconbar - similar to toolbar, but uses icons */

table.iconbar {
  width:100%;
  padding:0px 0px 0px 10px;
  border-collapse:collapse;
  margin: 0px 0px 10px 0px;
  border:1px solid #bbb;
  background:url(barbg.png);
}
table.iconbar td {
  margin:0px;
  font-size:70%;
  text-align:center;
  padding:0px;
  height:40px;
}
table.iconbar a {
  display:block;
  font-weight:normal;
  color:#666;
  text-decoration:none;
  padding:10px 20px 5px 20px;
}
table.iconbar a:hover {
  text-decoration:none;
  color:black;
  background-color:#f0f0f0;
}
table.iconbar a img {
  border:none;
  margin-bottom:3px;
}

/* basicbar - just a bar... */

table.basicbar {
  background:url(barbg.png);
  width:100%;
  border:1px solid #bbb;
  padding:0px 0px 0px 10px;
  border-collapse:collapse;
  margin: 10px 0px 10px 0px;
}
table.basicbar td {
  padding:5px 5px 5px 15px;
  margin:0px;
  height:35px;
  font-size:80%;
}
table.basicbar a {
  font-weight:normal;
  color:black;
  text-decoration:underline;
}

/* Arrows */

.arrowbox {
  height:11px;
  width:11px;
  padding:2px 1px 0px 1px;
  display:inline-block;
}
.arrow_up {
  width:0;
  height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-bottom:10px solid blue;
}
.arrow_down {
  width:0;
  height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:10px solid blue;
}
.arrow_left {
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-right:10px solid blue;
}
.arrow_right {
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:10px solid blue;
}
.arrow_up:hover {
  border-bottom:10px solid red;
  cursor:pointer;
}
.arrow_down:hover {
  border-top:10px solid red;
  cursor:pointer;
}
.arrow_left:hover {
  border-right:10px solid red;
  cursor:pointer;
}
.arrow_right:hover {
  border-left:10px solid red;
  cursor:pointer;
}