body, html{padding: 0; margin: 0; background-color:lightgrey;}

.main{height: 100%; width: 100%}

.header{padding: 0; margin: 0 auto;width: 100%;background-color:lightgrey; position: absolute; height: 80px;}

.logo-box{float: left; width:200px;height: 55px; padding-left: 10px; padding-top: 5px; padding-right: 5px; padding-bottom: 5px;margin-top: 10px; position: absolute;}

.title-box{/*border-bottom: 2px solid #ffff33;*/ text-align: center; font-weight: bold; width:390px; font-family:'Oswald'; padding:5px; font-size: 50px;  color: #ffff33; letter-spacing: 4px; }

.main-container{height: 500px;width:100%; margin-top: 80px; position:absolute;}

.login-container{margin:auto;width: 400px; height: 450px;}

.div-box{width:380px; padding:10px;}

.login-box{width: 400px; margin-top: 150px;height: 399px; background-color:#6667AB; border-radius: 10px; box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);transition: 0.3s;}

.loginLabel-box{color: white; text-align:center; font-family: 'Roboto Condensed', sans-serif; font-weight: bold; font-size: 18px; width: 300px; margin: auto;}

.userlogin-box{font-family: 'Roboto Condensed', sans-serif; margin-top: 30px;}

.label-top{font-size: 18px; text-align:center; width: 400px;}

.text-bottom{margin-top: 10px; width: 380px; text-align:center;}

.text-d{text-align:center; border: 1px solid #a3a3a3; border-radius: 10px; font-family: 'Roboto Condensed', sans-serif; font-size: 16px; padding: 8px 10px;  Width:200px; Height:30px;}

.userPwd-box{font-family: 'Roboto Condensed', sans-serif; margin-top: 30px;}

.panelClass{position:absolute;}

.messageAlertbox{width: 380px; font-family: 'Roboto Condensed', sans-serif; font-size: 12px; /*font-weight: bold;*/}

.alertContainer{margin-top: 10px; /*border: 1px solid #faad14; background-color: #faad14; */padding: 15px 0px 0px 20px; }

.clearButton-box{width: 380px; text-align:center;}

.loginButton-box{width: 380px; text-align:center;}

.btn-clear{font-family: 'Roboto Condensed', sans-serif; font-size: 16px; font-weight: bold; width: 200px; background-color: #49b675; color: white; padding: 10px 6px; margin: 8px 0; border: none; border-radius: 10px;cursor: pointer;}

.btn-login{font-family: 'Roboto Condensed', sans-serif; font-size: 16px; font-weight: bold; width: 200px; background-color: #003366; color: white; padding: 10px 6px; margin: 8px 0; border: none; border-radius: 10px;cursor: pointer;}

.btn-clear:hover{background-color: #77c897; color:black;}

.btn-login:hover{background-color: #72A0C1; color:black;}


/* DELETE WARNING POP UP*/

.div-warn-panel{width:400px; height: 165px;}

.div-warning{width:430px; height: 125px;}

.panelClass-3{position:absolute; width: 400px; height: 145px;}

.warnBox{width: 390px;font-family: 'Roboto Condensed', sans-serif; font-size: 14px;height: 100px;}

.warn-info{padding-top: 10px; height: 40px; width: 390px;}

.warn-text{font-size: 18px; text-align:center;}

.warn-button{margin-top: 10px; width: 420px; height: 40px;}

.confirm-button-left{width:200px; float:left; height: 45px;}

.confirm-button-right{width:200px; float:right; height: 45px;}

.y-button{float: right; font-family: 'Roboto Condensed', sans-serif; text-align: center; font-size: 14px; font-weight: bold; width: 60px; background-color: #63b521; color: white; padding: 6px 2px; margin: 8px 0; border: none; border-radius: 4px;cursor: pointer;}

.n-button{float: left; font-family: 'Roboto Condensed', sans-serif; text-align: center; font-size: 14px; font-weight: bold; width: 60px; background-color: #c23b22; color: white; padding: 6px 2px; margin: 8px 0; border: none; border-radius: 4px;cursor: pointer;}

.warnTitle{font-weight: bold; font-size: 18px; color: white; text-align: center; background-color: #ce501e; padding:2px;width: 395px;}

.warnContainer{height: 95px; font-size: 20px; background-color: white; padding-top: 10px; padding-left: 10px;width: 390px;}

.div-warn{width:390px;height: 60px;}

.warnClosebutton{background-color :#ce501e; color:white; padding:2px;text-align :center; width:395px;}

.btnclose{background-color: grey; color:black;width:60px;cursor:pointer;border:none;padding:2px 2px;}

.btnhome{background-color: grey; color:black;width:60px;cursor:pointer;border:none;padding:2px 2px;}


/*MESSAGE ALERT*/

.div-error{width:980px; height: 130px; }

.panelClass{position:absolute; width: 585px; top: 667px; left: 599px; height: 122px;}

.modalBackground {height:100%;background-color:lightgrey; filter:alpha(opacity=70);opacity:0.7;}

.messageAlertbox{width: 585px;font-family: 'Roboto Condensed', sans-serif; font-size: 14px; /*font-weight: bold;*/}

.messageTitle{font-weight: bold; font-size: 18px; color: white; text-align: center; background-color: #bc2d29; padding:2px; }

.alertContainer{padding-top: 5px; height: 30px; font-size: 20px; padding: 15px 0px 0px 20px; background-color: white; text-align:center; }

.closebutton{background-color :#bc2d29; color:white; padding:2px;text-align :center;}

.btnclose{background-color: grey; color:black;width:60px;cursor:pointer;border:none;padding:2px 2px;}