MaxKey/maxkey-webs/maxkey-web-maxkey/src/main/webapp/css/base.css

* { padding:0; margin:0; outline:0; }
body{
	margin: 0;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 0 0 0px;
	font-size: 12px;
	text-align:center;
	float:center;
	font-family: "Arial", "Helvetica", "Verdana", "sans-serif";
}
table td,select,button,input{
	font-size: 12px;
}

table.datatable {
	border: 1px solid #d8dcdf;
	border-collapse:collapse;
	border-spacing:0;
	width: 100%;
}

table.datatable th{
	border: 1px solid #d8dcdf;
	border-collapse:collapse;
	border-spacing:0;
	height: 40px;
}

table.datatable td{
	border: 1px solid #d8dcdf;
	border-collapse:collapse;
	border-spacing:0;
	height: 40px;
	text-align: left;
  	text-indent: 5px;
}

table.datatable td.center{
	border: 1px solid #d8dcdf;
	border-collapse:collapse;
	border-spacing:0;
	height: 40px;
	text-align: center;
  	text-indent: 0px;
}

table.hidetable {
	border-collapse:collapse;
	width: 100%;
	border: 0px;
}

table.hidetable th{
	border: 0px;
	border-collapse:collapse;
	border-spacing:0;
}

table.hidetable td{
	border-collapse:collapse;
	border-spacing:0;
	border: 0px;
}

.form_title_bar{
	width: 100%;
	height: 36px;
  	text-align: left;
  	text-indent: 30px;
  	background-color: #f8f8f8;
}

.form_title_bar a {
  text-decoration: none;
  display: inline-block;
  height: 14px;
  color: #333;
  font-size: 14px;
  font-weight: bold;
  padding: 8px 0;
  vertical-align: central;
}


button,input{
	color: #393939;
}

#topBar{
	text-shadow: 0 1px 0 #fff;
	border-bottom: 1px solid #e5e5e5;
	min-width: 100%;
	align:left;
	height:60px;
	margin-bottom: 1px;
}
#topNav{
	border-bottom: 1px solid #e5e5e5;
}

#navs{
	border-bottom: 1px solid #e5e5e5;
}

#nav_primary{
	background: #414141;
}

#nav_second{
	height:31px;
}
#nav_third{
	/*border-top: 1px solid #e5e5e5;*/
}

.container {
	width: 990px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 10px
}

#mainFrame{
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	width:990px;
	align:center;
}

#footer{
	text-shadow: 0 1px 0 #fff;
	border-top: 1px solid #e5e5e5;
	min-width: 100%;
	height:80px;
	
}

#content{
	margin-top: 10px;
	min-height:480px;
	*height:480px;
	margin-bottom: 10px;
}

#tool_box {
	margin-bottom: 10px;
	border: 1px solid #e5e5e5;
}

#tool_box_left {
	padding-left: 10px;
	float: left;
	height:30px;
	width:50%;
	text-align: left;
	border-right: 1px solid #e5e5e5;
}

#tool_box_right {
	height:32px;
	text-align: right;
	padding-right: 10px;
	width:484px;
}

#advanced_search {
	margin-top: 10px;
	min-height:30px;
	*height:40px;
	border: 1px solid #e5e5e5;
	margin-bottom: 10px;
	display: none;
}

#logout{
	width: 40px;
  	background: #c00 ;
  	color: #fff;
  	font-weight: bold;	
}

#manage{
	width: 40px;
	background-color: #2AA9A9;
	font-weight: bold;	
}

#manage a,#logout a{
	  color: #fff;
}

a {
	color: #4183c4;
	text-decoration: none;
}


input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"] {
	min-height: 27px;
	height: 27px;
	padding: 4px 8px;
	outline: none;
	color: #333;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: right center;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-shadow: inset 0 1px 2px rgba(0,0,0,0.075);
	transition: all 0.15s ease-in;
	-webkit-transition: all 0.15s ease-in 0;
	vertical-align: middle;
	width:90%;
}

textarea {
	min-height: 27px;
	padding: 4px 8px;
	outline: none;
	color: #333;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: right center;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-shadow: inset 0 1px 2px rgba(0,0,0,0.075);
	transition: all 0.15s ease-in;
	-webkit-transition: all 0.15s ease-in 0;
	vertical-align: middle;
	width:90%;
}
input[type="text"]:focus,
input[type="text"].focus,
input[type="password"].focus,
input[type="password"]:focus,
input[type="email"].focus,
input[type="email"]:focus,
input[type="number"].focus,
input[type="number"]:focus,
input[type="tel"].focus,
input[type="tel"]:focus,
input[type="url"].focus,
input[type="url"]:focus,
textarea.focus,
textarea:focus {
	border-color: #51a7e8;
	box-shadow: inset 0 1px 2px rgba(0,0,0,0.075),0 0 5px rgba(81,167,232,0.5)
}

.button,.minibutton {
	position: relative;
	display: inline-block;
	padding: 7px 15px;
	font-size: 13px;
	font-weight: bold;
	color: #333;
	text-shadow: 0 1px 0 rgba(255,255,255,0.9);
	white-space: nowrap;
	background-color: #eaeaea;
	background-image: -moz-linear-gradient(#eaeaea, #eaeaea);
	background-image: -webkit-linear-gradient(#eaeaea, #eaeaea);
	background-image: linear-gradient(#eaeaea, #eaeaea);
	background-repeat: repeat-x;
	border-radius: 3px;
	border: 1px solid #ddd;
	border-bottom-color: #c5c5c5;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05);
	vertical-align: middle;
	cursor: pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-appearance: none
}

.button:hover,.button:active,.button.zeroclipboard-is-hover,.button.zeroclipboard-is-active,.minibutton:hover,.minibutton:active,.minibutton.zeroclipboard-is-hover,.minibutton.zeroclipboard-is-active {
	text-decoration: none;
	background-color: #dadada;
	background-image: -moz-linear-gradient(#dadada, #dadada);
	background-image: -webkit-linear-gradient(#dadada, #dadada);
	background-image: linear-gradient(#dadada, #dadada);
	background-repeat: repeat-x;
	border-color: #ccc #ccc #b5b5b5
}

.button:active,.button.selected,.button.zeroclipboard-is-active,.minibutton:active,.minibutton.selected,.context-menu-container.active .minibutton.switcher,.context-menu-container.active .context-button,.minibutton.zeroclipboard-is-active {
	background-color: #dadada;
	background-image: none;
	border-color: #b5b5b5;
	box-shadow: inset 0 3px 5px rgba(0,0,0,0.15)
}

.button:disabled,.button:disabled:hover,.button.disabled,.button.disabled:hover,.minibutton:disabled,.minibutton:disabled:hover,.minibutton.disabled,.minibutton.disabled:hover {
	opacity: .5;
	color: #666;
	text-shadow: 0 1px 0 rgba(255,255,255,0.9);
	background-image: none;
	background-color: #e5e5e5;
	border-color: #c5c5c5;
	cursor: default;
	box-shadow: none
}

.button.primary,.minibutton.primary {
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #44b549;
	background-image: -moz-linear-gradient(#44b549, #44b549);
	background-image: -webkit-linear-gradient(#44b549, #44b549);
	background-image: linear-gradient(#44b549, #44b549);
	background-repeat: repeat-x;
	border-color: #44b549
}

.button.primary:hover,.minibutton.primary:hover {
	color: #fff;
	background-color: #4aaf33;
	background-image: -moz-linear-gradient(#4aaf33, #4aaf33);
	background-image: -webkit-linear-gradient(#4aaf33, #4aaf33);
	background-image: linear-gradient(#4aaf33, #4aaf33);
	background-repeat: repeat-x;
	border-color: #4aaf33
}

.button.primary:active,.button.primary.selected,.minibutton.primary:active,.minibutton.primary.selected,.context-menu-container.active .primary.minibutton.switcher,.context-menu-container.active .primary.context-button {
	background-color: #569e3d;
	background-image: none;
	border-color: #418737
}

.button.primary:disabled,.button.primary:disabled:hover,.button.primary.disabled,.button.primary.disabled:hover,.minibutton.primary:disabled,.minibutton.primary:disabled:hover,.minibutton.primary.disabled,.minibutton.primary.disabled:hover {
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #60b044;
	background-image: -moz-linear-gradient(#8add6d, #60b044);
	background-image: -webkit-linear-gradient(#8add6d, #60b044);
	background-image: linear-gradient(#8add6d, #60b044);
	background-repeat: repeat-x;
	border-color: #74bb5a #74bb5a #509338
}

.button,.minibutton {
	outline: none
}

.button:focus,.minibutton:focus {
	text-decoration: none;
	border-color: #51a7e8;
	box-shadow: 0 0 5px rgba(81,167,232,0.5)
}

.button img {
	position: relative;
	top: -1px;
	margin-right: 3px;
	vertical-align: middle
}

.button>.octicon {
	vertical-align: middle;
	margin-top: -1px
}

.minibutton {
	padding: 0 10px;
	line-height: 32px;
	box-shadow: none
}

.minibutton:hover .octicon-device-desktop:before {
	background-position: -18px 0
}

.minibutton i {
	font-weight: 500;
	font-style: normal;
	opacity: .6
}

.form_radio_label, .form_checkbox_label{
  display: inline-block;
  text-align: left;
  cursor: pointer;
  margin-right: 1em;
}

.icon_checkbox {
  background: url("../images/checkbox.png") 0 -83px no-repeat;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  display: inline-block;
  margin-top: -0.2em;
}

.icon_checkbox_selected{
  background: url("../images/checkbox.png") 0 -109px no-repeat;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  display: inline-block;
  margin-top: -0.2em;
}

.icon_radiobox {
  background: url("../images/checkbox.png") 0 -5px no-repeat;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  display: inline-block;
  margin-top: -0.2em;
}

.icon_radiobox_selected{
  background: url("../images/checkbox.png") 0 -31px no-repeat;
  width: 16px;
  height: 16px;
  vertical-align: middle;
  display: inline-block;
  margin-top: -0.2em;
}

.select-menu-modal{
	position: absolute;
	display: none;
	z-index: 1989;
	width: 300px;
	margin-top: 4px;
	margin-bottom: 20px;
	overflow: hidden;
	font-size: 12px;
	color: #666;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ccc;
	border: 1px solid rgba(0,0,0,0.15);
	border-radius: 5px;
	box-shadow: 0 3px 12px rgba(0,0,0,0.25);
}

.select-menu-item{
	cursor: pointer;
	line-height: 33px;
	border-bottom: 1px solid #eee;
	display: table;
	table-layout: fixed;
	width: 100%;
	overflow: hidden;
	color: inherit;
	text-align: left;
}
.select-menu-item a{
	text-decoration : none;
}


.select-menu-item a div{
	width: 140px;
	line-height: 33px;
}




.select-menu-item-selected{
	background-color: #4183c4;
	color: #fff;
}

.select-menu-item-selected a{
	color: #fff;
}