/*==================================================
	M A I N   S T Y L E S
	
	* Last Updated	: YYYY/MM/DD
	* Author 		: Name <mail>
	* Color Key     :
	   * Deep Blue     : #000066 (example) 
	   * Apple Green   : #85b885
==================================================*/
@import 'lib/reset.css';
@import 'lib/utilities.css'; 
@import 'lib/forms.css';
@import 'ie_lte6.css';

/*==================================================
	L A Y O U T 
	Basic page layout
==================================================*/
html { overflow: hidden; }
body { height: 100%; background: url(/images/loading.gif); font: 10px/160% 'Verdana', "Hiragino Kaku Gothic", "ヒラギノ角ゴ Pro W3", sans-serif; text-align: center; color: #000; overflow: hidden;　}
#page { width: 100%; height: 100%; z-index: 10000; text-align: left; position: absolute; top: 0; left: 0; overflow: auto; z-index: 100; }

/*==================================================
	C O M M O N  E L E M E N T S 
	Main HTML elements 
==================================================*/
h1 { font-weight: normal; }
p { line-height: 2em; margin-bottom: 1em; }
li, p, td, th, dd, dt, label, legend { }
a:link { color: #000; }
a:visited { color: #000; }
a:hover { }
a:active { }



/*==================================================
	C O M M O N  S T Y L E S
 	Project specific common design elements   
 ==================================================*/

#background { width: 100%; height: 100%; z-index: 0;　}
#background div { position: absolute; width: 200%; height: 200%; top: -50%; left: -50%; }
#background table { width: 100%; height: 100%; }
#background td { vertical-align: middle; text-align: center; }
#background img { min-height: 50%; min-width: 50%; margin: 0 auto; }

#header { height: 10em; }
#header .title { float: left; width: auto; margin-left: 4%; }
#header .title a { display: block; padding: 0.3em 1em; background: #004b64; font-size: 1.2em; font-weight: bold; color: #fff; text-decoration: none; }
#header .add-post { float: right; margin: 0.5em 1em;}

#blog #post-list { float: right; width: 25%; }
#blog #post-list .list { margin-bottom: 1em; clear: both; }
#blog #post-list .list li { margin-bottom: 0.5em; }
#blog #post-list .list li a { text-decoration: none; background-image: url(/images/transparent.png); padding: 0.3em 1.2em 0.2em 0.6em; }
#blog #post-list .list li a:hover,
#blog #post-list .list li.current a { background: #004b64; color: #fff; }
#blog #post-list .list li a .title  { float: left; width: 70%; font-size: 1.2em; cursor: pointer; }
#blog #post-list .list li a .date { float: right; width: 25%; font-size: 0.8em; text-align: right; cursor: pointer; }
#blog #post-list .pager { margin: 0 1.2em; }

#blog #post { float: left; display: inline; margin: 0 auto 8em 20%; width: 50%; background-image: url(/images/transparent.png); }
#blog #post .header { margin: 2.4em 2.4em 1.8em 2.4em; }
#blog #post .header .title { font-size: 1.6em; margin-bottom: 0.2em; }
#blog #post .header .date { margin-bottom: 0; color: #777; }
#blog #post .header .edit { float: right; width: auto; text-align: right; margin-left: 1.5em; }
#blog #post .header .edit form { display: inline; margin: 0 0 0 1em; }
#blog #post .header .edit form div { display: inline; }
#blog #post .body { margin: 0 2.4em 4em 2.4em; }
#blog #post .body p { font-size: 1.2em; }
#blog #post .body p img { width: 100%; border: 1px solid #aaa; }

#blog .edit form { margin: 5em 30% 0 25%; width: 45%; }
#blog .edit form label { display: none; }
#blog .edit form .error { color: #f00; font-size: 1em; }

#login form { margin: 10em 40%; width: 20%; }
#login form label { display: none; }
#login form .error { color: #f00; }

#bg-images { display: none; }