style.css

vpn虚拟专用网络的一个开源搭建工具

/* Basic Structure */
body{
	font-size: small; 
	font-family: verdana, sans-serif;
	color: #333333; 
	line-height: 140%;
	min-width: 700px;
	background: url(../images/body_back.gif) #FFFFFF repeat-x;
}

#mbody {
	padding: 15px 0;
}

#mbody h2 {
	font: 140% arial,helvetica,verdana,sans-serif;
	border-bottom: 1px solid #CCCCCC;
	margin-bottom: 0;
}

#mbody h1 {
	font: 180% arial,helvetic,sans-serif;
	border-bottom: 1px solid #CCCCCC;
	margin-bottom: 0;
}

#container {
	max-width: 70em;
	margin: 20px auto;
}

/* Login */

#login {
	position: absolute;
	top: 0px;
	left: 70%;
	z-index: 100;
}

/* Header */

#header {
	background: url("../images/header_bl.png") bottom left repeat-x;
	position: relative;
	min-height: 70px;
	height: 5em;
}
#header h1 {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	z-index: 100;
	display: block;
	width: 250px;
	height: 55px;
	background: transparent url("../images/header_logo.gif") no-repeat;
}
#header h2 {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0 0 0 10px;
	font-size: 2px;
	z-index: 100;
}
#header h2 a {
	display: block;
	width: 165px;
	height: 16px;
	background: url("../images/openvpn.gif") no-repeat;
	text-indent: -700em;
	text-decoration: none;
	
}
#header ul {
	position: absolute;
	bottom: 0;
	right: 0;
	margin: 0;
	padding: 0 15px 0 0;
	list-style: none;
	background: url("../images/header_br.gif") no-repeat bottom right;
	z-index: 90;
}
#header li {
	float: right;
	padding: 0 6px 0 0;
	margin: 0 1px 0 0;
}
#header ul a {
	float: left;
	display: block;
	padding: 4px 4px 4px 10px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
}
#header h3 {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0 6px 0 0;
	list-style: none;
	background: url("../images/header_tr.gif") no-repeat top right;
	z-index: 100;
}

/* Principal Structure */

input {
	font-size: small; 
	font-family: verdana, sans-serif;
}

a:link {
	color: #003399;
}
a:visited {
	color: #660099;
}
a:hover {
	color: #333333;
}
a:active {
	color: #000000;
}
ul.compact {
	padding-left: 20px; 
	margin-left: 0px;
}
.title {
	margin-top: 0.3em;
}
.first {
	margin-top: 1em;
}
.item {
	border: #D2D6D6 1px solid;
	padding-left: 5px;
	padding-right: 6px;
	margin-bottom: 10px;
/* special border 4 Firefox */
	-moz-border-radius: 10px;
}
.item a {
	color: #00129C;
    text-decoration: none;
}
.item a:visited {
	color: #00129C;
    text-decoration: none;
}
.item a:hover {
	color: #FC5900;
}

/* Sidebar */

#side {
	float: left;
	width: 23%;
	margin-bottom: 1em;
}
#maincontent {
	margin-left: 25%;
}
#nav:before {
	line-height: 0.1;
	font-size: 1px;
	background: transparent url("../images/menu_tr.gif") no-repeat top right;
	margin: 0;
	height: 9px;
	display: block;
	border-bottom: 1px solid #DDDDDD;
	content: url("../images/key-point_tl.gif");
}
#nav {
	background: #E0E9E9 url("../images/menu_back.gif") right repeat-y;
}
#nav:after {
	display: block;
	padding-top: 0;
	line-height: 0.1;
	font-size: 1px;
	content:  url("../images/key-point_bl.gif");
	margin: 0 0 0 0;
	height: 8px;
	background: transparent url("../images/menu_br.gif") scroll no-repeat bottom right ;
	border-top: 1px solid #FFFFFF;
}
#nav, #nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#nav li {
	display: inline;
	padding: 0;
	margin: 0;
}
#nav li a {
	display: block;
	padding: 6px 10px;
	text-decoration: none;
	background: #EDF2F2;
	border-bottom: 1px solid #DDDDDD;
	border-top: 1px solid #FFFFFF;
	border-right: 1px solid #DDDDDD;
}
#nav li a:hover {
	background: #E0E9E9;
}
.selected a, .selected a:visited {
	color: #FC5900;
}