body {margin:0; background-color:#f7f6f3; font-family:Verdana; font-size:12px;}
textarea { padding-top:8px;}
a { text-decoration:none; }
a:hover { text-decoration:underline; }

.panel {display:inline-block; margin:8px; vertical-align:top; box-shadow: inset 0px 1px 10px #ddd; background-color: #fafbfd; text-align:left; padding-bottom:15px; border-radius:3px; }
.panelHeader {background-color:#bdc2ca; color:#005bca; font-size:14px; font-weight:bold; text-align:center; line-height:29px; height:29px; margin-bottom:15px; border-top-left-radius:3px; border-top-right-radius: 3px; }
.panelWrap {padding:12px;}

.panelThick { border:8px solid #aaa;  border-radius:15px; background-color:#fff; text-align:left; padding:20px; padding-left:28px; margin:0 auto; }
.panelHeaderThick { color:blue; font-size:24px; line-height:40px; height:40px; }
.panelWrapThick {padding:12px;}

.panelLogin { border:none;  text-align:left; }
.panelHeaderLogin { margin:20px; }
.panelWrapLogin {padding:12px;}

.panelMessage { display:inline-block; border:1px solid #e9e9e9; border-radius:5px; background-color:#fff; text-align:left; }
.panelHeaderMessage { }
.panelWrapMessage {padding:20px;}

.panelNone { border:none;  text-align:left; }
.panelHeaderNone { margin:0; }
.panelWrapNone {padding:0;}


.fieldWrap {display:inline-block; margin-left:6px;}
.labelMode0 {font-size:12px; color:#828890; display:block; margin-bottom:4px; margin-left:5px;}
.labelMode1 {font-size:12px; color:#828890; margin-bottom:4px; display:inline-block; text-align:right; }
.inputMode0 { display:block; position:relative; }
.inputMode1 { display:inline-block; position:relative; }
.optionLabel { font-size:12px; color:#828890; margin-bottom:4px; display:inline-block; }
.tooltip { position:absolute; top:-45px; width:800px; }
.labelErrMsg {display:none;}
.input {height:20px; font-size:12px; margin-bottom:10px; border:1px solid #ccc; border-radius:4px; color:#333; padding-left:6px;}
.textarea {font-size:12px; margin-bottom:10px; border:1px solid #ccc; border-radius:4px; color:#333; padding-left:6px;}
.fileType {height:20px; font-size:12px; margin-bottom:10px; border:1px solid #ccc; border-radius:4px; color:#333;}
.select {height:25px; line-height:18px; }
.radio {height:10px;}
.noSubmit {border:1px solid #ccc; border-radius:4px; background-color:white; display:inline-block; color:#666; font-size:12px; margin-bottom:10px; padding:2px 4px 4px 4px; line-height:16px; height:16px;}
.button, .submit {margin:10px 3px 10px 3px; padding:7px 25px; border-style:none; border-radius:5px; background-color:#407ac6; color:#fff;}
.button:hover, .submit :hover {cursor:pointer; background-color:#609ad6; color:#eee;}

.hideEl { -webkit-animation:animateHideEl; -webkit-animation-duration:.4s; -webkit-animation-fill-mode:forwards; animation-name: animateShow; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateHideEl { from {opacity:100;} to {opacity:0; display:none;} }
@keyframes animateHideEl { from {opacity:100;} to {opacity:0; display:none; } }


.showBar li { padding-bottom:19px; }
.showBar { -webkit-animation:animateShow; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name: animateShow; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateShow { from {height:0px;} to {height:50px;} }
@keyframes animateShow { from {height:0px;} to {height:50px;} }

.hideBar li {  padding-bottom:6px;  }
.hideBar { -webkit-animation:animateHide; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name: animateHide; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateHide { from {height:50px;} to {height:0px;} }
@keyframes animateHide { from {height:50px;} to {height:0px;} }

.largeImage { -webkit-animation:animateLargeImage; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name:animateLargeImage; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateLargeImage { from {height:28px; width:81px; left:20px; top:50px; } to {height:59px; width:170px; left:0; top:10px;} }
@keyframes animateLargeImage { from {height:28px; width:81px; left:20px; top:50px; } to {height:59px; width:170px; left:0; top:10px;} }

.shrinkImage { -webkit-animation:animateShrinkImage; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name: animateShrinkImage; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateShrinkImage { from {height:59px; width:170px; left:0; top:10px; } to {height:28px; width:81px; left:20px; top:50px;} }
@keyframes animateShrinkImage { from {height:59px; width:170px; left:0; top:10px; } to {height:28px; width:81px; left:20px; top:50px;} }




.largeMenu { -webkit-animation:animateLargeMenu; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name:animateLargeMenu; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateLargeMenu { from {top:44px;} to {top:31px;} }
@keyframes animateLargeMenu { from {top:44px;} to {top:31px;} }

.shrinkMenu { -webkit-animation:animateShrinkMenu; -webkit-animation-duration:.7s; -webkit-animation-fill-mode:forwards; animation-name: animateShrinkMenu; animation-duration: .7s; animation-fill-mode:forwards; }
@-webkit-keyframes animateShrinkMenu { from {top:31px;} to {top:44px;} }
@keyframes animateShrinkMenu { from {top:31px;} to {top:44px;} }

#userMenuDiv { position:absolute; top:22px; right:1px; font-size:10px; background-color:#fff; box-shadow: 0px 2px 10px #888; border-radius:2px; z-index:1001; overflow:hidden; }
.userMenuList { list-style-type:none; padding:12px; white-space:nowrap; }
.userMenuList a { text-decoration:none; color:#555; padding:8px; display:block; border-radius:3px; }
.userMenuList a:hover { cursor:pointer; background-color:#60a5d9; color:white; }

#tooltipTxt { background-color:#ffc; border:1px solid #ccc; border-radius:2px; padding:8px; display:inline-block; font-family: Lucida Grande,Helvetica,Arial,Verdana,sans-serif; font-size: 10px; box-shadow:0 1px 20px #555; }
/*Added textalign:center 8/15/2018*/
#outerWrapper { width:964px; margin:0 auto; margin-bottom:100px; padding-top:150px; box-shadow: 0px 2px 20px #ccc; background-color:#fff; text-align:center; }
#bodyWrapper { padding-bottom:75px; text-align:center; }
#greyOut { left:0; top:0; width:100%; height:100%; position:absolute; background-color: #333; display:none; z-index:2000; }
#loginForm_panel { margin:0 auto; display:block; }
#sendLogin { margin-top:15px; margin-bottom:15px; }
#changeList {max-height:150px; overflow:auto;}

.modal { display: none; position: fixed; z-index: 200; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); }
.panelState {font-weight:bold; float:right; padding-right:10px; position:relative; top:-38px; cursor:pointer; }

input[type=file] { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; }
input[type=file] + label { font-size:12px; color: white; background-color: #407ac6; display: inline-block; padding-top:7px; padding-bottom:7px; padding-left:25px; padding-right:25px; border-radius:5px;}
input[type=file]:focus + label, input[type=file] + label:hover { background-color: #609ad6; }
input[type=file] + label { cursor: pointer; }
input[type=file]:focus + label { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px; }
input[type=file] + label * { pointer-events: none; }

.menu {text-decoration:none; font-family:Verdana; font-size:14px; font-weight:bold; list-style:none; float:right;}     
.menu li {display:inline; margin-left:40px; color:#fff}
.menu li:hover {border-bottom: 4px solid #aaa; color:#ccc; cursor:pointer;}

.newMessage { font-size:14px; text-decoration:none; font-weight:bold; margin-left:10px; }
.newMessage:link { text-decoration:none; font-family: Verdana, Helvetica, Sans-Serif, Arial;}
.newMessage:hover { text-decoration:underline; font-family: Verdana, Helvetica, Sans-Serif, Arial; cursor:pointer }