/*Z.PE - The shortest URL shortener*/
/*Filename: styles.css*/


body {
	font:75%/140% "Avenir","Helvetica Neue","HelveticaNeue","Lucida Grande","Hiragino Kaku Gothic Pro","Bitstream Vera Sans",Helvetica,Arial,Verdana,sans-serif;
	text-align:center;
	color:#000;
}
#bookmarklet {width:780px; margin:0 auto 10px auto; text-align:right;}
	#bookmarklet a {
		cursor:move;
		background:url(../assets/book_next.gif) 0px 1px no-repeat;
		padding-left:20px;
	}
/*header*/
#header {
	background:url(../assets/header_bot_bg.gif) bottom repeat-x #00678c;
	padding:10px 0 12px 0;
	margin-bottom:1px;
}
	.wrap-header {width:780px; margin:0 auto; text-align:left;}
	#header h1 a {
		color:#fff;
		display:block;
		width:165px; height:66px;
		background:url(../assets/zpe_logo.gif) no-repeat;
		text-indent:-2000em;
		z-index:99999;
	}
	#branding {float:left; width:280px; padding-top:10px;}
	.topr {width:500px; float:left;}
		#adv468 {margin-bottom:10px; line-height:0; text-align:right;}
		/*navigation*/
		#navi {}
			#navi ul {float:right; margin:0;}
			#navi ul li {
				float:left;
				margin-right:2px;
				background:url(../assets/menu_inactive_tl.gif) top left no-repeat;
			}
				#navi ul li a {
					background:url(../assets/menu_inactive_tr.gif) top right no-repeat;
					padding:6px 15px 0 15px;
					display:inline-block;
					height:22px;
					color:#000;
				}
				#navi ul li a:hover {color:#f90;}
				#navi ul li h2 {font-size:120%;}
			#navi ul li.active {background:url(../assets/menu_active_tl.gif) top left no-repeat;}
			#navi ul li.active a {background:url(../assets/menu_active_tr.gif) top right no-repeat; color:#069}
			#navi ul li.active a:hover {color:#f90;}
/*footer*/
	#footer {
		background:#68d3fa;
		border-top:solid 4px #eee;
		padding:10px 0;
		margin-top:20px;
		color:#fff;
		overflow:hidden;
	}
	.wrap-footer {width:780px; margin:0 auto; text-align:left;}
		#footer a {color:#fff; font-weight:bold; margin-right:5px;}
		#footer a:hover {color:#f90;}
		#footer .links {float:right; margin:-16px 0 0 0;}
/*contents*/
.wrap-body {width:780px; margin:0 auto; text-align:left;}
#contents {width:600px; float:right;}
#sidebar {width:160px; float:left; margin-right:20px;}

	#completed {margin-bottom:20px; position:relative}
		#completed #close {position:absolute; top:7px; right:7px; padding:0; margin:0;}
		#completed p {margin:10px 0; padding:0 15px;}
		#completed label {display:block; margin-bottom:3px;}
		#surl {width:200px; font-weight:bold; color:#369;}
		#completed .butcopy {/*margin:5px 0 0 0;*/ vertical-align:middle; margin:7px 0 0 5px;}
		#originalurl {font-weight:bold;}
	#urlerror {margin-bottom:20px; position:relative;}
		#errormessage {text-align:center; font-size:14px; color:#F33; font-weight:bold;}
		#errorurl {text-align:center; font-size:12px; color:#333;}
		#moreerror {text-align:left; font-size:11px; color: #999;}
		#urlerror #close2 {position:absolute; top:7px; right:7px; padding:0; margin:0;}
	
	#createURL {
		background:url(../assets/fade_divider.gif) bottom center no-repeat;
		margin-bottom:0;
		padding-bottom:15px;
	}
		#createURL h3 {
			background:url(../assets/lbl_create.gif) no-repeat;
			width:277px; height:40px;
			text-indent:-2000em;
			margin-bottom:15px;
		}
		#createURL textarea {
			background:url(../assets/textarea_bg.gif) top left no-repeat;
			border:solid 2px #68d3fa;
			padding:5px;
			width:586px; height:70px;
		}
		#createURL p {margin:10px 0;}
		.butcreate {display:inline-block;}
		.butcreate a {
			background:url(../assets/but_shorten.gif) no-repeat;
			width:104px; height:39px;
			display:block;
			text-indent:-2000em;
		}
			.butcreate a:hover, .butcreate a:active, .butcreate a:focus {background:url(../assets/but_shorten_active.gif) no-repeat;}
	#faq h4 {
		color:#6a6a6a;
		font-size:18px;
		font-family:Verdana, Geneva, sans-serif;
		width:335px; height:18px;
		font-weight:bold;
		margin-bottom:15px;
	}
		#faq p {margin:10px 0;}
		#faq ol li {margin:20px 0;}
		#faq ul {margin:10px 25px; list-style:disc;} #faq ul li {list-style:disc; margin:5px 0;}
	
	#ol-01, #ol-02, #ol-03, #ol-04, #ol-05, #ol-06, #ol-07, #ol-08, #ol-09 {padding-left:40px;}
	#ol-01 {background:url(../assets/bullet_01.gif) no-repeat;}
	#ol-02 {background:url(../assets/bullet_02.gif) no-repeat;}
	#ol-03 {background:url(../assets/bullet_03.gif) no-repeat;}
	#ol-04 {background:url(../assets/bullet_04.gif) no-repeat;}
	#ol-05 {background:url(../assets/bullet_05.gif) no-repeat;}
	#ol-06 {background:url(../assets/bullet_06.gif) no-repeat;}
	#ol-07 {background:url(../assets/bullet_07.gif) no-repeat;}
	#ol-08 {background:url(../assets/bullet_08.gif) no-repeat;}
	#ol-09 {background:url(../assets/bullet_09.gif) no-repeat;}
	
/*message box*/
.msgbox {background:url(../assets/complete_topbg.gif) top no-repeat;}
.wrap-msgbox {background:url(../assets/complete_botbg.gif) bottom no-repeat; padding:15px 15px 10px 15px;}
	.msgbox p {margin:10px 0;}
.butcopy {display:inline-block;}
.butcopy a {
	background:url(../assets/but_copy.gif) no-repeat;
	width:86px; height:33px;
	display:block;
	text-indent:-2000em;
}
.butcopy a:hover {background:url(../assets/but_copy_active.gif) no-repeat;}
.txt {
	background:url(../assets/txt_bg.gif) top repeat-x;
	border:solid 2px #68d3fa;
	height:20px;
}
/*data pre style*/
.subpage {}
	.subpage h3 {border-bottom:solid 1px #68d3fa; margin-bottom:20px; padding-bottom:10px;}
	.subpage ul {list-style:disc; margin:15px} .subpage ul li {list-style:disc}
	.subpage ol {list-style:decimal; margin:15px;} .subpage ol li {list-style:decimal;}
	.subpage p {margin:0 0 15px 0;}
	.subpage blockquote {margin:15px 30px; padding:10px; border:solid 1px #ccc; border-left:solid 2px #f90;}
		.subpage blockquote p {margin:5px 0;}
	.align-center {text-align:center;}
	.subpage table {
	border-collapse:collapse;
	margin:10px 0;
	width:100%;
	border-top:solid 2px #f90;
}
.subpage table th {
	font-weight:bold;
	color:#000;
	padding:3px 4px;
	border:solid 1px #ddd;
	background:#eee;
}
.subpage table td {
	padding:3px 4px;
	border:solid 1px #ddd;
}
/*pre style*/
h1, h2, h3, h4, h5, strong {font-weight:bold;} em {font-style:italic;}
/*ul {list-style:square; margin:15px;} ul li {list-style:square;}
ol {list-style:decimal; margin:15px;} ol li {list-style:decimal;}
blockquote {margin:15px;}*/
h1 {font-size:160%;} h2 {font-size:150%;} h3 {font-size:140%;} h4 {font-size:120%;} h5 {font-size:100%;}
a:link, a:visited {color:#069; text-decoration:none;} a:hover {color:#f90}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */