﻿
a { color: blue; text-decoration: none; }
a:hover { text-decoration: underline; cursor: pointer; }
body {
	line-height: 1.2;
    background-color: white;
    border-style: none;
    color: black;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    -webkit-text-size-adjust: 100%;
    margin: 0;
    padding: 0;
    align-content: center;
}
h1 {
    font-size: 150%;
    font-weight: normal;
    color:#808080;
    margin: 0 0 3px 0;
    text-align: left;
    text-decoration: none;
}
h2 {
    font-size: 120%;
    font-weight: lighter;
    color: darkred;
    margin: 5px 0 5px 0;
	padding: 0;
    text-align: left;
}
h3 {
    font-size: 110%;
    font-weight: lighter;
    color: darkblue;
    margin: 3px 0 2px 0;
    padding: 0;
    text-align: left;
}
h4 {
    font-size: 100%;
    font-weight: normal;
    color: #404040;
    margin: 5px 10px 10px 0;
	padding: 0;
    text-align: left;
}
hr { color: gray; background-color: gray; width: 100%; height: 1px; margin: 0; border: none; }
hr.questionDivider { color: gray; background-color: gray; width: 80%; height: 1px; margin-left: 10%; border: none; }
hr.thick { color: lightblue; background-color: lightblue; width: 100%; height: 3px; margin: 0; border: none; }
i { font-style:italic;}
img {
    border: none;
    padding: 0;
    margin: 0;
}
input[type=file]::file-selector-button { margin-left: 0; padding: 0 10px 0 10px; cursor:pointer;}

/* Both the Label Tag and the style formLabel MUST agree */
label {          
    float: left;
    text-align: right;
    width: 180px;
    margin-right: 2px;
    padding-top: 2px;
}
legend { font-size: 110%; color: darkblue; padding : 0; text-align: left; margin-bottom: -20px;}
li { color: black; padding-top: 2px; padding-bottom: 0;}
ol { padding-inline-start: 40px;  margin-top: 0; margin-bottom: 5px;}
p.indent { margin: 4px 0 5px 20px; }
p.sidebar { font-size: 8pt; color: #808080; margin: 10px 5px 10px 5px;}
select { 
    font-family: Arial, Helvetica, sans-serif;
    color: blue;
    text-align: left;
    border: none;
    -webkit-box-shadow: 0 -1px blue inset;
    -moz-box-shadow: 0 -1px blue inset;
    box-shadow: 2px 2px #606060 inset;
    margin: 0;
    padding: 2px 0 0 5px;
}
strong {color: red; font-weight: normal;}
table { border-spacing: 0; white-space:normal;}
td.fieldset { width: fit-content; vertical-align: top;}
td.center { text-align: center; padding-left: 2px; padding-right: 2px; }
td.left {text-align: left; padding-right: 2px;}
td.right {text-align: right; padding-left: 2px; }
th { text-align: left; }
th.columnHeading {color: darkred; font-weight: lighter; text-align: center; }
td.htmlCode { padding-left: 20px; }
ul { font-weight: normal; margin-top: 0; margin-bottom: 5px;}
ul { padding-inline-start: 40px;}
ul.messagebox { margin: 5px 0 5px 10px;}
ul.messagebox li { padding-bottom: 2px;}
ul.gridPost {
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: 1vmin;
}
ul.gridPost li { margin-top: 20px; padding-left: 0; padding-right: 0; }
a.gridLink, .gridLinkDisabled {
    margin: 0;
    padding: 5px 10px 5px 10px;
    font-size: 110%;
    color: black;
    vertical-align: middle;
    text-align: center;
    border: solid 1px darkslategray;
    border-radius: 15px;
    background-color:lightgray;
}
a.gridLink:hover { color: black; background-color: lightgoldenrodyellow; text-decoration: none;}
.gridLinkDisabled { color: #808080; background-color: white; }

.aboutTable { width: 100%;}
.aboutSection { vertical-align: top; padding-top: 10px; padding-right: 5%; }
.aboutSeparator{ border: solid 2px lightgray; margin-left: 0; width: 95%;  }
.aboutTitle { font-size: 120%; font-weight: lighter; color: darkred; padding : 20px 0 0 0; text-align: left;}
.aboutText { font-size: 110%; padding: 5px 10px 5px 0; text-align: left;}
.aboutPhoto { max-width: 320px; max-height: 240px;}
.bulletin {width: calc(100% - 30px); margin:0 15px 0 15px; border: solid 1px gray; background-color: aliceblue; padding: 10px; vertical-align: top; }
.bulletinTitle { color: darkred; font-size: 120%; font-weight: bolder;}
.bulletinText { font-size: 110%;}
.championshipTable { width: 100%; border-collapse:collapse;}
.championshipText { width: 70%; vertical-align: top; text-align: left; padding-right: 50px; }
.championshipLink { width: 30%; vertical-align: middle; text-align: center; color: darkred; border:solid 1px gray; padding: 10px;}
.championshipLink:hover { background-color: lightgray; }
.championshipLogo { width: 150px; margin: 20px; }
.championshipPhoto { max-width: 60%; max-height: 600px; margin-left: 10%; border: none; }
.championshipCaption { font-size: 150%; color: blue; text-align: left; padding-left: 10%; }
.contactForm   { width: 100%; text-align: left; border: solid 1px gray; padding: 20px;}
.contactForm td { padding-left: 20px; padding-right: 20px;}
.contactTable { width: 50%; background-color:aliceblue;}
.directoryContact { font-size: 120%; color: darkred;}
.divBody { position: absolute; width: calc(100% - 380px); left: 190px; padding-top: 10px; }

/* The list of Zone/Club name */
.divClubs {margin-top: 10px; }
.divClubs ul li { display: block; color: blue; margin: 10px 0 0 0;}
.divClubs ul li.clubNoWebsite { display: block; color: black; font-size: 120%; margin: 10px 0 0 0;}
.divClubs ul li:hover ul {display: block;}
/* The Quick News displayed when user hovers over Zone/Club name */
.divClubs ul li ul {
    position: absolute;
    left: 300px;
    width: 400px;
    display: none;
    list-style-type: none;
}
.divClubs ul li ul li { 
    color: darkblue;
    background: lightgray; 
    padding: 20px;
    margin: -20px 0 0 0;
    width: 400px;
    display: list-item;
}
.divClubs ul li ul li ul { padding-left: 20px; position:inherit; display: list-item; padding: 0; list-style-type: square; list-style-position: inside; width: 380px;}
.divClubs ul li ul li ol { padding-left: 20px; position:inherit; display: list-item; padding: 0;} 
.divClubs ul li ul li ul li { width: 380px; margin: 0; padding-top: 5px; padding-bottom: 0; }
.divClubs ul li ul li ol li { width: 380px; margin: 0; padding-top: 5px; padding-bottom: 0; } 
.divClubs ul li ul li ul li::marker { content:box;}

.divFieldset, .divFieldsetSmall {width: fit-content;  padding: 5px 5px 0 5px;}
.divFieldsetSmall label { width: 60px; }
.divFieldset p, .divFieldsetSmall p { line-height: 1; margin: 2px 0 0 0;}
.divFullPage {
    margin: 0;
    padding: 5px;
    border: 0;
    margin-top: 10px;
    color: black;
    font-size: 110%;
    width: 100%;
}
.divFullPage p { margin-bottom: 10px;}
.divPublic { position: absolute; width: calc(100% - 190px); left: 190px; padding-top: 10px; }
.divTree a.treeLink {
    text-decoration: none; 
    font-size: 120%;
    color: black;
    margin-left: 20px;
    min-width: 480px;
}
.divTree a.treeLink:hover { text-decoration: underline; font-weight: bold;}
.divTree a.treeLink:visited { text-decoration: none; font-weight: normal;}
.divZone { position: absolute; width: calc(100% - 210px); left: 190px; padding-top: 10px; }
.footnote { font-size: 9pt; font-weight:lighter; vertical-align: bottom; }
.formFootnote { font-size: 9pt; font-weight:lighter; vertical-align: bottom; }
.formCheckbox input {width:18px; height:18px; margin: 3px 0 0 0;}
.formHide { visibility: collapse; }
.formImage {border: none; width: 400px; position: relative;}
.formImage:hover { 
    position: absolute; 
    display:block; 
    z-index:99; 
    left:10%; 
    width:80%;
}
.formInput, .formInputCenter, .formInputRight, .formUpload, .formDetails, .formHTML {
    font-family: Arial, Helvetica, sans-serif;
    color: blue;
    text-align: left;
    padding: 2px 0 0 5px;
}
.formDetails { width: 98%; border:solid 1px lightgray; background-color: #E9E9E9; color:black; text-align: left; padding: 3px; margin-bottom: 3px; min-height: 15px; }
.formHTML { color: black; border: none; padding: 5px; max-height: 800px; }
.formInput:focus {background-color: #FFFFAA;}
.formInputCenter {text-align: center; padding: 0;}
.formInputCenter:focus {background-color: #FFFFAA;}
.formInputRight {text-align: right; padding: 0 5px 0 0;}
.formInputRight:focus { background-color: #FFFFAA; }
.formInputSelect:focus { background-color: #FFFFAA; }
.formInput:disabled , .formInputCenter:disabled, .formInputRight:disabled , .formInputSelect:disabled {
    background-color: #E9E9E9; 
    color:black;
    -webkit-text-fill-color:black; 
    -webkit-opacity: 1;
}
.formLabel, .formLabelNarrow, .formLabelInline, .formLabelTiny  {
    text-align: right;
    margin-right: 2px;
    padding-top: 2px;
    vertical-align: bottom;
}
.formLabel { float: left; width: 180px;}
.formLabelNarrow { float: left; width: 120px; }
.formLabelTiny { float: left; width: 60px; }
.formLabelTitle {
    float: left;
    width: 180px;
    text-align: right;
    margin-right: 2px;
    padding-top: 5px;
    font-size: 110%;
    vertical-align: bottom;
}
.formUpload { color: white; }
.grid { border: none; font-size: 100%; } 
.grid a { color: darkred; border-top: solid 2px white; border-right: solid 2px gray; border-bottom: solid 2px gray; border-left: solid 2px white; padding: 2px 10px 2px 10px; font-size:85%; text-decoration: none; }
.grid a:hover { color: white; background-color: darkred; }
.grid th {
    padding: 8px 10px 8px 10px;
    color: darkred; 
    border: none;
    font-weight: lighter;
    text-align: center;
    vertical-align: middle; 
}
.grid th.Sort a { font-size: 100%; padding: 2px 10px 2px 10px; }
.grid th.right {text-align: right; }
.grid th.left {text-align: left; }
.grid th.center {text-align: center; }
.grid th.colHidden { color: white; font-size: 1px; margin: 0; padding: 0; width: 1px; }
.grid td {
    padding: 4px 10px 4px 10px;
    color: darkblue; 
    border: none;
    text-align: right;
    vertical-align: middle; 
}
.grid td.date {text-align: right; min-width: 80px;}
.grid td.right {text-align: right; }
.grid td.left {text-align: left; }
.grid td.center {text-align: center; }
.grid td.colHidden { color: white; font-size: 1px; margin: 0; padding: 0; width: 1px; }
.grid td.colNarrow { text-align: left; margin: 0; padding: 0; color: red;}
.gridFooter td { padding: 3px 10px 3px 10px; color: black; border: none; text-align: right; vertical-align: middle; }
.gridFooterThin { line-height: 1px;}
.gridHeader { text-align: center; color: darkred; text-decoration: none; }
.gridHeader a { color: darkred; }
.gridHeader a:hover { color: white; background-color: darkred; text-decoration: none;}
.gridInput { font-family: Arial, Helvetica, sans-serif; color: blue; text-align: center; width: 50px; padding: 2px 0 2px 0; }
.gridInput:focus {background-color: #FFFFAA;}
.gridPager td { margin: 0; padding: 3px 0 3px 10px; border: none;text-align: left;}
.gridPager input { margin: 8px 0 5px 20px; padding: 2px; border: none; background-color: white;}
.gridPager input:hover { background-color: darkred; cursor: pointer; }
.gridRow { background-color: white; }
.gridAlternateRow { background-color: #F7F6F3; }
.gridSortAscending { background-color: #D8FFD8; }
.gridSortDescending { background-color: #FFD8D8; }
.gridHeader {
    text-align: center;
    color: darkred;
    text-decoration: none;
}
.gridHeader a { color: darkred; }
.gridHeader a:hover { color: white; background-color: darkred; text-decoration: none;}
.gridInput {
    font-family: Arial, Helvetica, sans-serif;
    color: blue;
    text-align: center;
    width: 50px;
    padding: 2px 0 2px 0;
}
.gridPager {background-color: white;}
.gridPager input { padding: 0; margin: 0; vertical-align: middle;}
.gridRow { background-color: white; color: darkblue;}
.gridRow a { color: darkred; text-decoration: none;}
.gridRow a:hover { color: white; background-color: darkred; text-decoration: none;}
.gridAlternateRow { background-color: #F7F6F3; color: darkblue;}
.gridAlternateRow a {color: darkred; text-decoration: none;}
.gridAlternateRow a:hover { color: white; background-color: darkred; text-decoration: none;}
.gridSortAscending { background-color: #D8FFD8;}
.gridSortDescending { background-color: #FFD8D8;}

.imgAbout { max-width: 320px; max-height: 320px; vertical-align: top; }
.imgEvent { max-height: 350px; vertical-align: top; padding-left: 50px;}
.imgLink { width: 100px; padding-right: 40px; vertical-align: middle; }
.imgLinkLarge { width: 150px; margin-right: 40px; }
.imgLinkSmall { width: 80px; margin-top: 20px; margin-right: 10px; }
.imgSponsor { max-width: 150px; vertical-align: top; margin-left: 20px;}
.instructions { color: gray; padding: 30px; font-size: 120%; text-align: left; vertical-align: top; max-width: 40%;}
.linkButton, .btn {
    height: 24px;
    border: solid 1px gray;
    border-radius: 12px;
    margin: 5px; 
    padding: 1px 10px 2px 10px;
    background-color: lightgoldenrodyellow;
    color: black;
    text-align: center;
    font-size: 80%;
    vertical-align: middle;
    cursor: none;
}
.btn {margin: 5px 0 0 0;}
.linkButton:hover { background-color: palegoldenrod; text-decoration: none; font-weight: bold; cursor: pointer;}
td.linkPhoto { border: none; padding-left: 5px;}
td.linkPhoto:hover { border: solid 1px gray; }
.messageError {
    display:block;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px 20px 5px 20px;
    color: darkred;
    background-color:lightpink;
    border-style:solid;
    border-color: red;
    font-size: 120%;
}
.messageInfo {
    display:block;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px 20px 5px 20px;
    color: red;
    background-color:white;
    border-style:solid;
    border-color: red;
    font-size: 120%;
}
.messageWarning {
    display:block;
    margin-top: 10px;
    margin-bottom: 5px;
    font-size: 120%;
    color: darkblue;
}
.newsTitle { font-size: 120%; color: darkred;}
.pageContainer { width: 100%; margin: 0; padding: 0; }
.pageIntro { color: black; font-size: 100%;}
.pageIntro li {color: black; font-size: 100%; padding-bottom: 0;}
.pageTitle {
    font-size: 150%;
    font-weight: normal;
    color: #808080;
    margin: 0 0 5px 0;
    text-align: left;
    position: relative;
    top: 5px;
}
.questionTable { margin: 0 10px 0 10px;}
.questionAsk { border: solid 1px darkgray; background-color: white; padding: 10px; text-align: center; font-size: 120%; }
.questionImage { max-height: 100px; max-width: 100px;}
.quote { font-family: Georgia, 'Times New Roman', Times, serif; font-style: italic; }
.tableLegal td {text-align: left; vertical-align: top; }
.tableLegal img {margin: 0 20px 0 0; }
.tableQuestion { width: 100%; }
.tableQuestion th { padding-left: 5px; padding-right: 5px; color: darkred; font-weight:lighter;}
.tableQuestion td { padding: 10px 5px 10px 5px; color: darkblue; font-weight:lighter; border-bottom: solid 1px lightgray; vertical-align: top;}
.tableQuestion td.date { width: 17%; font-size: 120%;}
.tableQuestion td.question { width: 33%; font-size: 120%;}
.tableQuestion td.response { font-size: 120%;}

/* Directory Tree Control */
.treeTitle       { font-weight: normal; font-size: 120%; color: darkred; text-decoration: none; }
.treeZone        { font-size: 120%; font-weight: normal; color: darkblue; cursor:none; text-decoration: none; border: solid 1px gray; background-color: aliceblue; padding: 0 20px 0 20px; height: 28px; min-width: 400px;}
.treeClub        { font-size: 100%; color: darkred; cursor:none; text-decoration: none; }
.treeContact     { font-size: 120%; color: darkred;}
.treeAddress     { font-size: 90%; font-weight: lighter; color: black; cursor:none; text-decoration: none; padding-top: -5px;}
.treeTitle:hover { cursor:default; text-decoration: none; }
.treeZone:hover  { cursor:default; text-decoration: none; }
.treeClub:hover  { cursor:default; text-decoration: none; }
.treeZoneAddress:hover { cursor:default; text-decoration: none; }
.treeClubAddress:hover { cursor:default; text-decoration: none; }
.treeAddress:hover     { cursor:default; text-decoration: none; }

.uploadTitle       { font-size: 133%; color: darkred; font-weight: bold; cursor:none; text-decoration: none; }
.uploadFolder      { font-size: 120%; color: darkblue; cursor:none; text-decoration: none; }
.uploadSubFolder   { font-size: 110%; color: darkred; font-weight: lighter; cursor:none; text-decoration: none; }
.uploadL3Folder    { font-size: 110%; color: chocolate; font-weight: lighter; cursor:none; text-decoration: none; }
.uploadFile        { font-size: 90%; color: black; cursor:none; text-decoration: none; padding-left: 20px;}
.uploadTitle:hover { cursor:default; text-decoration: none; }
.uploadFolder:hover  { cursor:default; text-decoration: none; }
.uploadSubFolder:hover  { cursor:default; text-decoration: none; }
.uploadFile:hover     { cursor:pointer; color: blue; text-decoration: underline; }

.zoneTable { border-right: solid 20px transparent;}
.zoneTable td { vertical-align: top;}
.zoneTable tr:first-child td { border-top: 0;}
.zoneTable td:first-child { border-left: 0;}
.zoneClubs { font-size: 100%;}
.cellNews { vertical-align: top; padding-top: 30px;}
.yearSelect { font-size: 150%; font-weight: lighter; color: blue; text-align: center; margin: 10px 0 0 10px; padding: 5px 30px 5px 30px;}
.zoneNews { border: solid 1px gray; padding: 10px; font-size: 120%; background-color: aliceblue; vertical-align: top; text-align: left; width: 100%; }
.zoneNewsletter { border: none; width: 150px;}
.zonePhoto { border: none; max-width: 100%; max-height: 400px; }
.zoneMap {
    height: 24px;
    border: solid 1px gray;
    border-radius: 12px;
    margin: 5px 20px 5px 20px;
    padding: 1px 10px 2px 10px;
    background-color: honeydew;
    color: black;
    text-align: center;
    font-size: 80%;
    vertical-align: middle;
}
.zoneMap:hover { background-color: palegreen; text-decoration: none; font-weight: bold; cursor: pointer;}

/* ******************** Site Master Header Area ************************ */
.tableHeader {margin: 0; padding:0px; border: none; width: 100%; text-align: left; }
.headerImg {
    border: none;
    margin: 5px 0 0 5px;
    width: 145px;
}
.headerLeft {
    margin: 0;
    padding: 0 0 0 10px;
    background: white;
    text-align: left;
    height: 105px;
    width: 180px;
}
.headerCenter {
    margin: 0;
    padding: 0 0 0 30px;
    vertical-align: middle;
    text-align: center;
    font-size: 240%;
    height: 105px;
    width: calc(100% - 460px);
}
.headerRight {
    vertical-align:middle;
    text-align: left;
    height: 105px;
    width: 280px;
}
.headerLogin, .btnNext, .btnPrevious {
    font-size: 105%;
    font-weight: normal;
    text-decoration: none;
    height: 30px;
    margin: 0;
    padding: 10px 5px 10px 5px;
    vertical-align: middle;
    text-align: center;
    color: white;
    border: 2px solid lightgray;
    background: -webkit-gradient(linear, top, bottom, from(#cccccc), to(#444444));
    background: -webkit-linear-gradient(90deg, #cccccc, #444444);       /* Safari  */
    background: -moz-linear-gradient(90deg, #cccccc, #444444);          /* Firefox */
    background: -ms-linear-gradient(90deg, #cccccc, #444444);           /* IE      */
    background: -o-linear-gradient(top, #cccccc, #444444);              /* Opera   */
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}
.headerLogin { width: 100%;}
.headerLink { font-size: 105%; text-decoration: none; color: white; text-decoration: underline; padding: 2px 5px 2px 5px;}
.headerLink:hover { color: darkred; background-color: white; text-decoration: none; }
.headerLogin:hover, .btnNext:hover, .btnPrevious:hover {background: white; color: black; text-decoration: none; }

/* The following have both Screen and Print styles */
@media screen {
.btnActionCancel {
    position: fixed;
    right: 170px;
    height: 26px;
    border-radius: 15px;
    margin: 0 20px 0 0;
    padding: 1px 15px 0 15px;
    color: red;
    vertical-align: middle;
}
.btnActionCancel:hover {
    color: white;
    background-color: red;
}
.btnCancel {
    height: 30px;
    border-radius: 15px;
    margin: 5px 20px 0 0;
    padding: 2px 15px 0 15px;
    color: red;
    vertical-align: middle;
}
.btnCancel:hover { color: white; background-color: red;}
a.btnDelete, a.btnCancelUpdate {
    font-size: 90%;
    color: red;
    background-color: lightgray;
    margin: 1px 0 1px 5px;
    border: solid 1px gray;
    border-radius: 5px;
    padding: 2px 5px 2px 5px;
    vertical-align: middle;
}
a.btnDelete:hover, a.btnUpdateCancel:hover { color: white; background-color: red;}
a.btnEdit, a.btnUpdate {
    font-size: 80%;
    color: darkred;
    background-color: lightgray;
    border: solid 1px gray;
    border-radius: 5px;
    margin: 1px 0 1px 5px;
    padding: 2px 5px 2px 5px;
    vertical-align: middle;
}
a.btnEdit:hover, a.btnUpdate:hover { color: white; background-color: darkred;}
a.btnCancelUpdate, a.btnUpdate { font-size: 100%; height: 50px; margin: 30px 10px 30px 20px; }
a.linkClub { font-size: 120%; color: blue;}
a.linkZone { font-size: 120%; color: darkred;}
.btnLogin {
    height: 30px;
    width: 360px;
    border-radius: 15px;
    margin: 5px 0 0 0;
    padding: 2px 15px 0 15px;
    vertical-align: middle;
}
.btnLogin:hover { color: black; background-color: lightgreen;}
.btnMap, .btnNoMap {
    height: 30px;
    min-width: 380px;
    margin: 5px 20px 5px 0;
    padding: 2px 15px 0 15px;
    color: black;
    background-color: gainsboro;
    text-align: left;
    vertical-align: middle;
    font-size: 120%;
}
.btnMap { color: blue;}
.btnMap:hover { background-color: white; font-weight: bold; cursor: pointer; }
.btnNext { position: absolute; right: 25%; height: 30px; width: 80px; padding: 2px 5px 0 5px; font-size: 90%; }
.btnPrevious { position: absolute; left: 0; height: 30px; width: 80px; padding: 2px 5px 0 5px; font-size: 90%; }

.btnSelect {
    font-size: 120%;
    font-weight: normal;
    color: blue;
    text-decoration: none;
    margin: 10px 0 0 0;
    padding: 10px 0 0 10px;
    vertical-align: middle;
    width: 385px;
    height: 50px;
    background: -webkit-gradient(linear, top, bottom, from(#eeeeee), to(#888888));
    background: -webkit-linear-gradient(90deg, #eeeeee, #888888);       /* Safari  */
    background: -moz-linear-gradient(90deg, #eeeeee, #888888);          /* Firefox */
    background: -ms-linear-gradient(90deg, #eeeeee, #888888);           /* IE      */
    background: -o-linear-gradient(top, #eeeeee, #888888);              /* Opera   */
}
.btnSubmit {
    height: 30px;
    border-radius: 15px;
    margin: 5px 20px 0 0;
    padding: 2px 15px 0 15px;
    color: black;
    background-color: lightgoldenrodyellow;
    vertical-align: middle;
}
.btnSubmit:hover { color: black; background-color: lightgreen; }
.btnSubmit:disabled { color: #808080; background-color: #F0F0F0; }

/* LEFT Menu Styles */
#menu	{
	position: absolute;
	left: 0;
    top: 105px;
	margin: 0;
	padding: 0;
}
#menu h2 {
    text-transform: none;
    text-decoration: none;
    font-size: 110%;
    font-weight: lighter;
    display: block;
    white-space: nowrap;
    margin: 10px 0 0 0;
    padding: 5px 0 5px 10px;
    width: 160px;
}
#menu a {
    color: white;
    font-size: 120%;
    font-weight: normal;
    text-decoration: none;
    display: block;
    margin: 0;
    padding: 10px 0 0 10px;
    height: 27px;
    width: 160px;
    background: -webkit-gradient(linear, top, bottom, from(#555555), to(#cccccc));
    background: -webkit-linear-gradient(90deg, #555555, #cccccc);       /* Safari  */
    background: -moz-linear-gradient(90deg, #555555, #cccccc);          /* Firefox */
    background: -ms-linear-gradient(90deg, #555555, #cccccc);           /* IE      */
    background: -o-linear-gradient(top, #555555, #cccccc);              /* Opera   */
}
#menu a:hover { font-size: 110%; background: white; color: black; border: solid 1px darkgray;}
#menu a.footerLink { font-size: 8pt; color: #808080; border: none; background: none; text-decoration: none; margin: 0; padding: 0;}
#menu a.active {
    color: white;
    font-size: 110%;
    font-weight: normal;
    text-decoration: none;
    display: block;
    margin: 0;
    padding: 10px 0 0 10px;
    height: 27px;
    width: 160px;
    background: white;
    color: black; 
    border: solid 1px darkgray;
}
#menu a:hover { font-size: 110%; background: white; color: black; border: solid 1px darkgray;}
#menu ul { list-style: none; margin: 0;  padding: 0; width: 160px;}
#menu li { list-style: none; margin: 2px 0 0 0; padding: 0 0 0 0; width: 160px;}
#menu li.active {
    font-size:120%;
    font-weight:normal;
    margin:0;
    padding:10px 0 0 10px;
    height:27px;
    width:160px;
    background-color: white;
    color:slategray;
    border: solid 1px gray;
}

/* RIGHT ACTION Menu Styles */
#actionMenu {
    position: fixed;
    right: 0;
    top: 105px;
    margin: 0;
    padding: 0;
    width: 180px;
}
#actionMenu h2 {
    text-transform: none;
    text-decoration: none;
    font-size: 110%;
    font-weight: lighter;
    display: block;
    white-space: nowrap;
    margin: 10px 0 0 0;
    padding: 5px 0 5px 10px;
    width: 180px;
}
#actionMenu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 180px;
}
#actionMenu li {
    list-style: none;
    margin: 2px 0 0 0;
    padding: 0 0 0 0;
    width: 180px;
}
#actionMenu a {
    color: white;
    font-size: 120%;
    font-weight: normal;
    text-decoration: none;
    display: block;
    margin: 0;
    padding: 8px 0 0 10px;
    height: 27px;
    width: 180px;
    background: -webkit-gradient(linear, top, bottom, from(#555555), to(#cccccc));
    background: -webkit-linear-gradient(90deg, #555555, #cccccc);       /* Safari  */
    background: -moz-linear-gradient(90deg, #555555, #cccccc);          /* Firefox */
    background: -ms-linear-gradient(90deg, #555555, #cccccc);           /* IE      */
    background: -o-linear-gradient(top, #555555, #cccccc);              /* Opera   */
}
#actionMenu a:hover { font-size: 110%; background: white; color: black; border: solid 1px darkgray;}
#actionMenu a:active { background-color: black; color: white; border: solid 1px darkgray;}
#actionMenu .actionActive {
    font-size:120%;
    font-weight:normal;
    margin:0;
    padding:10px 0 0 10px;
    height:25px;
    width:180px;
    background-color: white;
    color:slategray;
    border: solid 1px gray;
}

/* USEFUL LINKS and SPONSOR Menu Style */
#linkMenu {
    position:page;
    left: 180px;
    bottom: 0;
    margin: 0;
    padding: 0;
}
#linkMenu img.linkImage { max-width: 140px; max-height: 100px; border: none; }
#linkMenu a { border: none; text-decoration: none; background-color: white; padding-right: 20px;}
#linkMenu a:hover { text-decoration: none; border: 1px solid lightgray;}
#sidebar { 
    margin: 20px 5px 10px 5px;
    font-size: 8pt;
    font-weight: lighter;
    color: #808080;
    border: none;
}
#sidebar p {margin-bottom: 10px; }
#sidebar a {text-decoration: none; }

/* End of Screen styles */
}

@media print {
.btnCancel { display: none;}
.btnActionCancel { display: none;}
.btnLogin { display: none;}
.btnSubmit { display: none;}
.divBody { position: absolute; left: 0; width: 1040px;}
.divFooter { display: none;}
.divHeader { display: none;}
.grid a { color: darkred; border: none; font-size:100%;}
.gridRow a { display: none;}
.gridAlternateRow a { display: none;}
.tableHeader { display: none;}

#menu	{ display: none; width: 0;}
#menu h2 { width: 0;}
#menu a { width: 0;}
#menu ul { width: 0;}
#menu li { width: 0;}
#actionMenu { display: none; width: 0;}
#actionMenu h2 { width: 0;}
#actionMenu a { width: 0;}
#actionMenu ul { width: 0;}
#actionMenu li { width: 0;}
#linkMenu { display: none; width: 0;}
#linkMenu img { display: none; }
/* End of Print styles */
}

/* Modifiers */
.Black {color: black;}
.Blue {color: blue;}
.DarkBlue {color: darkblue;}
.DarkRed {color: darkred;}
.Gray {color: gray;}
.Green {color: green;}
.Magenta {color: magenta; }
.Red {color: red;}
.White {color: white;}
.Right { text-align: right; }
.Left { text-align: left; }
.Center { text-align: center;}
.Top { vertical-align: top;}
.Middle { vertical-align: middle;}
.Bottom { vertical-align: bottom;}
.Small { font-size: 90%;}
.Large { font-size: 110%; font-weight: lighter; }
.XL { font-size: 130%; font-weight: lighter;}
.W100 { table-layout: fixed; width: 100%;}
.W70 { width: 70%; }
.W60 { width: 60%; }
.W50 { width: 50%; }
.W40 { width: 40%; }
.W35 { width: 35%; }
.W15 { width: 10%; }
