html{margin: 0; padding: 0; height: 100%;}
body{margin: 0; padding: 0; height: 100%; background-color: #006BB5; background: radial-gradient(#FFFFFF 80%, #006BB5); background-attachment: fixed; background-repeat: no-repeat;}

label{font-size: 10pt; color: #808080;}

@font-face{font-family: bonveno; src: url(fonts/bonveno.woff);}

a:link{font-family: Arial; color: #006BB5; text-decoration: none;}
a:visited{font-family: Arial; color: #006BB5; text-decoration: none;}
a:hover{font-family: Arial; color: #006BB5; text-decoration: underline;}
a:active{font-family: Arial; color: #006BB5; text-decoration: none;}

.main{width: 100%; position: absolute; height: 100%; text-align: center; margin-left: auto; margin-right: auto; margin-top: 0; font-family: Verdana; font-size: 18pt; color: #000000;}

.topleft{z-index: 98; font-family: bonveno; font-size: 20pt; color: #066BB5; position: absolute; margin-left: 0; margin-top: 0; width: 300px; text-align: center; height: 100px; line-height: 100px; background-color: #A0A0A0; transition: all 1s ease;}

.firstlogin-open{min-width: 340px; position: fixed; left: 0; right: 0; width: 90%; max-width: 1200px;  margin-left: auto; margin-right: auto; background-color: #FFFFFF; color: #000000; font-size: 24pt; font-family: bonveno; text-align: center; z-index: 2000; min-height: 100px; padding: 30px; transition: all 0.5s ease;}
.firstlogin-closed{position: fixed; left: -90%; height: 90%; width: 90%; margin-top: 3%; margin-bottom: auto; margin-left: 95%; margin-right: auto; background-color: #FFFFFF; color: #000000; font-family: bonveno; text-align: center; z-index: -1; opacity: 0; visibility: hidden; transition: all 0.5s ease;}
.usethis{position: relative; top: 2px; position: absolute; display: inline; right: 5px; font-size: 8pt; cursor: pointer; font-weight: bold; font-family: Verdana; min-width: 50px; text-align: right; background-color: #FFFFFF;}
.shadow{z-index: 3000; margin-bottom: 6px; transition: all 0.3s ease; box-shadow: 0 8px 10px -5px rgba(0,0,0,0.4);}
.no-shadow{z-index: 3000; margin-bottom: 6px; transition: all 0.3s ease;}

.topleft_cover{z-index: 99; font-family: Verdana; font-size: 20pt; color: #066BB5; position: absolute; margin-left: 0; margin-top: 0; width: 300px; text-align: center; background-color: #A0A0A0; opacity: 0; height: 100px; cursor: pointer;}

.portal-box{position: relative; display: table; height: 400px; width: 90%; min-width: 800px; max-width: 1200px; background-color: #F0F0F0; font-family: bonveno; font-size: 12pt; color: #A0A0A0; margin-top: 150px; margin-left: auto; margin-right: auto; overflow: auto; padding: 0px; }

.left-frame{display: table-cell; min-width: 290px; padding: 0px; margin: 0px;}

.menu-off{width: 290px; height: 100px; line-height: 100px; font-size: 24pt; color: #F0F0F0; text-align: center; background-color: #808080; cursor: pointer; border-left: 1px #000000 solid; border-top: 1px #000000 solid; border-bottom: 1px #000000 solid; font-weight: bold; transition: all 0.5s ease;}
.menu-off:hover{background-color: #AEAEAE; transition: all 0.5s ease;}

.menu-on{width: 290px; height: 100px; line-height: 100px; font-size: 24pt; color: #A0A0A0; font-weight: bold; text-align: center; background-color: #F0F0F0; border-left: 1px #000000 solid; border-top: 1px #000000 solid; border-bottom: 1px #000000 solid; transition: all 0.5s ease;}

.content-frame{display: table-cell; vertical-align: top; height: 400px; width: 100%; border-left: 0px #F0F0F0 solid; border-right: 1px #000000 solid; border-top: 1px #000000 solid; border-bottom: 1px #000000 solid; background-color: #F0F0F0; overflow: hidden; opacity: 1; padding-left: 20px; margin: 0px;}

.page{height: 403px; margin: 0px; padding: 0px; overflow: auto;}

.biglogin input,button,submit,reset{font-size: 20pt;}

.authbox{position: absolute; width: 60%; height: 100px; background-color: #006BB5; text-align: center; font-size: 14pt; color: #FFFFFF; font-family: Verdana; margin-left: 0px; left: 300px; margin-top: 0px; border-bottom-right-radius: 10px; text-shadow: 1px 1px 3px #A0A0A0; min-width: 500px;}

.overlay-off{position: fixed; width: 100%; height: 100%; background-color: #000000; opacity: 0.0; z-index: -1; visibility: hidden;}
.overlay-on{position: fixed; width: 100%; height: 100%; background-color: #000000; opacity: 0.6; z-index: 100; visibility: visible;}
.message-pane-closed{width: 500px; height: 500px; position: fixed; z-index: -1; background-color: #FFFFFF; opacity: 0; visibility: hidden; border-radius: 10px; left: 50%; margin-left: -250px; margin-top: 150px; transition: all 0.3s ease;}
.message-pane-open{width: 500px; height: 500px; position: fixed; z-index: 101; background-color: #FFFFFF; opacity: 1; visibility: visible; border-radius: 10px; left: 50%; margin-left: -250px; margin-top: 150px; box-shadow: 5px 5px 5px #000000; transition: all 0.3s ease;}

input[type=radio]{border: 1px #000000 solid; box-shadow: 0px 4px 8px rgba(0,0,0,0.3); font-size: 12pt; border-radius: 10px; padding: 4px; cursor: pointer;}
input, textarea, select, button{border: 1px #000000 solid; box-shadow: 0px 4px 8px rgba(0,0,0,0.3); font-size: 12pt; border-radius: 14px; background-color: #FFFFFF; outline: none; padding: 4px; padding-left: 15px; margin-left: auto; margin-right: auto; cursor: pointer;}
input:focus,textarea:focus,select:focus{background-color: #B3F0FF;}
textarea{overflow: hidden; resize: none;}
[type=button]{padding: 10px; font-family: Verdana; font-size: 14pt;}
label input{display: none;}
label span{box-shadow: 0px 4px 8px rgba(0,0,0,0.3); border-radius: 4px; width: 15px; height: 15px; display: inline-block; background: url("../images/checkbox-blank.gif"); cursor: pointer;}
[type=checkbox]:checked + span{background: url("../images/checkbox-checked.gif");}

.contact-link{position: absolute; height: 20px; width: 300px; font-family: Verdana; font-size: 12pt; top: -20px; right: 10px;}

.mbox{border: 1px #006BB5 solid; background-color: #F0F0F0; width: 460px; height: 460px; margin: auto; margin-top: 20px;}
.mbox-item{padding: 4px; position: relative; text-align: left; margin: 4px; background-color: #FFFFFF; color: #000000; font-family: Verdana; font-size: 10pt;}
.mbox-bold{font-weight: bold;}

.m-read{font-weight: normal; color: #808080; font-family: Arial; font-size: 12pt;}
.m-unread{font-weight: bold; color: #000000; font-family: Arial; font-size: 12pt;}
.data-text{color: #006BB5;}
.home-header{margin-left: auto; margin-right: auto; width: 90%; background-color: #A0A0A0; color: #006BB5; font-size: 18pt; font-family: bonveno; border-radius: 10px; box-shadow: 4px 4px 8px #A0A0A0; margin-top: 10px; padding: 10px; font-weight: bold; min-width: 500px;}
.home-item{margin-left: auto; margin-right: auto; background-color: #FFFFFF; margin-top: 10px; color: #000000; box-shadow: 4px 4px 8px #A0A0A0; width: 90%; padding: 5px; position: relative; min-width: 400px;}
.list-item{margin: 2px; background-color: #F0F0F0; font-size: 10pt; color: #808080; padding-left: 50px; width: auto; text-align: left; border-radius: 5px; transition: all 0.3s ease; position: relative; font-family: Arial; font-weight: normal;}
.list-item:hover{background-color: #AEAEAE; color: #808080; cursor: pointer; transition: all 0.3s ease;}
.list-item-noclick{margin: 2px; background-color: #F0F0F0; font-family: Verdana; font-size: 10pt; color: #000000; width: auto; text-align: left; padding-left: 4px; border-radius: 5px; font-weight: normal; position: relative;}
.inf-box{margin-right: auto; margin-left: auto; padding: 10px; margin-top: 10px; margin-bottom: 10px; width: 90%; background-color: #FFD895; font-family: Arial; font-size: 12pt; color: #6C3A24; border-radius: 10px; box-shadow: 3px 3px 10px #A0A0A0; border: 1px #000000 solid;}
.data-box{width: 90%; min-width: 400px; border: 1px #A0A0A0 solid; font-family: Verdana; font-size: 12pt; color: #000000; background-color: #F0F0F0; margin-top: 10px; margin-bottom: 10px; margin-left: auto; margin-right: auto; font-weight: normal; text-align: left; overflow: hidden;}
.data{vertical-align: top; display: inline-block; padding-left: 10px; width: 45%; margin-top: 2px; margin-bottom: 2px;}
.pymt-box{position: relative; margin-right: auto; margin-left: auto; padding: 10px; margin-top: 10px; margin-bottom: 10px; width: 90%; background-color: #FFFFFF; font-family: Arial; font-size: 24pt; color: #006BB5; border-radius: 10px; min-width: 400px;}
.pymt-button{position: relative; min-width: 146px; width: 25%; height: 60px; display: inline-block; background-color: #FFFFFF; border-radius: 5px; box-shadow: 3px 3px 5px #000000; cursor: pointer; border: 1px #A0A0A0 solid; vertical-align: top;}
.setting-box{width: 90%; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 10px; padding: 10px; border: 1px #000000 solid; background-color: #FFFFFF; color: #000000; font-family: Arial; font-size: 12pt; font-weight: normal; text-align: left; padding-left: 30px;}
.pdnotice-on{position: relative; visibility: visible; opacity: 1; width: auto; padding-top: 15px;}
.pdnotice-off{visibility: hidden; opacity: 0; transition: all 0.4s ease; z-index: -1; height: 0px; padding: 0px; overflow: hidden;}
.pdnoticebox{position: relative; visibility: visible; opacity: 1; margin-left: auto; margin-right: auto; width: 90%; border: 2px #FF0000 solid; font-family: Arial; font-size: 18pt; color: #FF0000; font-weight: bold;}
.pdnotice-off .pdnoticebox{height: 0px; opacity: 0; visibility: hidden; z-index: -1; overflow: hidden;}


.lo-img{right: 20px; top: 2px; position: absolute; height: 21px; width: 21px; cursor: pointer;}
.lo-box{height: 0px; width: 0px; visibility: hidden; opacity: 0;}
.lo-img:hover > .lo-box{height: auto; width: 100px; font-family: Verdana; color: #808080; font-size: 10pt; background-color: #A0A0A0; box-shadow: 2px 2px 5px #808080; position: absolute; visibility: visible; opacity: 1; margin-top: -24px; right: -90px; z-index: 2000; cursor: pointer; line-height: 30px; font-weight: normal; border-radius: 2px; text-align: center; text-shadow: none; border: 1px #000000 solid;}
.lo-menu{background-color: #F0F0F0; margin: 1px;}
.h-black{color: #006BB5;}
.h-black:hover{color: #006BB5; text-decoration: underline;}