html, body {
	height: 100%;
}

body, form {
	margin: 0;
	padding: 0;
}

td {
  vertical-align: middle;
}

th {
  vertical-align: middle;
  white-space: nowrap;
}

.pathbar {
	padding: 10px 10px 0 10px;
}

.screenBody {
  margin: 0 10px;
  clear: both;
}

.screenBodyToolbar {
  margin: 0;
  clear: both;
}

.uplevel {
  text-align: right;
}

.screenTitle {
  margin: 0;
  vertical-align: middle;
}

.screenTitle td {
  padding: 3px 12px 5px 10px;
  vertical-align: middle;
}


.screenTitle img,
.screenTitle td,
.screenTitle input,
.screenTitle select {
  vertical-align: middle;
}

.reportSection {
  margin: 10px 0;
}

.reportTools,
.reportTools img,
.reportTools input,
.reportTools select {
	vertical-align: middle;
}

.reportIndex {
  margin: 15px 0;
}

.reportSection {
  padding-top: 5px;
}

p, hr {
  margin: 5px 0;
}

.screenButtons {
  width: 773px;
}

hr {
  clear: both;
}

/* ---------- list  --------- */

.misc {
  text-align: right;
}

.main input {
	margin-right: 7px;
}
.main .commonButton {
  margin-right: 14px;
}

.misc input {
  margin-left: 7px;
}
.misc .commonButton {
  margin-left: 14px;
}

/* ---------- form  --------- */

.formArea {
	border: 1px solid #D1CBD0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color:#fff;
}

.formFields {
  border-collapse: collapse;
  margin-top: 2px;
}

.formFields td {
  padding: 3px;
  vertical-align: top;
}

.formFields input,
.formFields .commonButton,
.formFields select {
  vertical-align: middle;
}

.formFields td.name,
.formFields td.nameError {
  vertical-align: top;
  padding-left: 0;
  padding-right: 10px;
  padding-bottom: 10px;
  width: 200px;
  float:left;
}

/* ---------- for login --------- */

#login {
  width: 380px;
  margin: auto;
  margin-top: 40px;
}

.cLogo {
	padding-top:150px;
	text-align:center;
}

@media only screen and (min-height: 1200px) {
	.cLogo {
		padding-top:240px;
	}
}
@media only screen and (max-height: 1200px) {
    .cLogo {
        padding-top: 180px;
    }
}
@media only screen and (max-height: 1000px) {
    .cLogo {
        padding-top: 140px;
    }
}
@media only screen and (max-height: 900px) {
    .cLogo {
        padding-top: 100px;
    }
}
@media only screen and (max-height: 736px) {
    .cLogo {
        padding-top: 60px;
    }
}
@media only screen and (max-height: 670px) {
    .cLogo {
        padding-top: 40px;
    }
}
@media only screen and (max-height: 610px) {
	.cLogo {
	   padding-top: 20px;
	}
}

#loginTitle {
  font-size: 19px;
  font-family: Tahoma, Arial, sans-serif, Helvetica, sans-serif;
  color: #CF4F43;
  text-align:center;
  padding-top:15px;
}

#get_password {
	text-align: left;
	padding-left: 0;
}

.formButtons {
	padding:15px 0;
}

#get_password a:link,
#get_password a:visited {
	color: #444444;
}

#loginForm {
	padding: 10px;
}

.formFields {
	padding: 10px;
}

.formFields .colName {
	padding:10px 0;
}
.formFields .colText {
	padding:0;
}
.formFields .colText input {
	width: 100%;
	border: 1px solid #D8DDE6;
	border-radius: 4px;
	border-image-source: initial;
	border-image-slice: initial;
	border-image-width: initial;
	border-image-outset: initial;
	border-image-repeat: initial;
	background-color: #fff;
	font-family: SFS, Arial, sans-serif;
	box-sizing: border-box;
	-webkit-appearance: none;
	font-size: 14px;
	transition: all 0.1s;
	padding: 12px;
}

.btnLogin
{
	-webkit-appearance: none;
	width: 100%;
	background-color: #0070d2;
	color: white;
	transition: all 0.1s;
	border: 1px solid transparent;
	padding: 12px 24px;
	border-radius: 4px;
	border: 0;
	font-size: 14px;
	font-family: SFS, Arial, sans-serif;
	color: white;
	cursor: pointer;
	background-image: none !important;
}
.btnLogin:hover {
	background-color: #004a8a;
}


@media only screen and (max-width: 453px)
{
	#login {
	  width: 100%;
	  margin: auto;
	  margin-top: 40px;
	}
	#loginForm, td {
		font-size:18px !important;
	}


	.formFields .colName {
		padding:5px;
		width: 100%;
		float:none;
	}
	.formFields .colText {
		padding:5px;
		width: 100%;
		float:none;
		text-align:left;
	}
	.formFields .colText input {
		width: 95%;
		padding:5px;
		font-size:18px;
	}
	.btnLogin {
		padding:5px;
		font-size:18px;

	}
}