@charset "UTF-8";
/* Information
-----------------------------------------------------
Title: Afficheur Site CSS
Version: 0.9;
Author: forestk;
Contact: forestk.peace@gmail.com;
Update: 2009.02.28;
-----------------------------------------------------*/

/*	=00 Common Setting
-----------------------------------------------------*/
/* =00-1 Reset Style --------------------------*/
html { overflow-y: scroll!important; }
html { filter: expression(document.execCommand("BackgroundImageCache", false, true)); }
body, a, div,
dl, dt, dd,
ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea,
p, blockquote, th, td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	text-transform: none;
	text-decoration: none;
}
div { zoom: 1; }
table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset, img { border: 0; }
input { vertical-align: middle; }
textarea { overflow: auto; }
address, caption, cite, code,
dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
q:before { content: open-quote }
q:after { content: close-quote }
abbr, acronym { border: 0; }
hr { display: none; }

/* =00-2 Basic Module --------------------------*/
body {
	padding-bottom: 1em;
	background: #FFFFFF;
	line-height: 1.5;
	color: #333333;
	font-size: 12px;
	*font-size: 75%;
	font-family: "Lucida Grande", "Lucida Sans", "Hiragino Kaku Gothic Pro", "HiraKakuPro-W3", "ヒラギノ角ゴ Pro W4", Meiryo, "メイリオ", MS PGothic, "MS Pゴシック", Helvetica, Arial, Osaka, sans-serif;
	text-align: center;
}
* html body { font-family: Helvetica, Arial, sans-serif; }
*+html body { font-family: Helvetica, Arial, sans-serif; }
q { margin: 0 0.2em;}
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
input, textarea { font-family: sans-serif; }

/* =00-3 HyperText Module --------------------------*/
a:link { color: #6782DC; text-decoration: none; }
a:visited { color: #6782DC; text-decoration: none; }
a:hover { text-decoration: underline; }
img { border: none; text-decoration: none; }


/* =00-2 Clear Fix (Yes, I understand this is a hack.)
-------------------------------------------------------------------- */
/* *=Hack Hides from IE-mac \*/
div#content,
div#alpha,
div#alpha div#download a { min-height: 1%; zoom: 1; }
/* *End hide from IE-mac */
div#content:after,
div#alpha:after,
div#alpha div#download a:after {
	clear: both;
	content: " ";
	font-size: 0.1em;
	display: block;
	height: 0.1px;
	line-height: 0;
	visibility: hidden;
}


/*	=01 Header-----------------------------------------------------*/
div#header {
	width: 800px;
	margin: 1em auto;
	text-align: left;
}

/* =01-1 Logo --------------------------*/
	div#header #logo {
		font-family: "Myriad Apple", "Myriad Pro", "Calibri", "Lucida Grande", "Lucida Sans", Helvetica, Arial, Osaka, sans-serif;
		font-size: 275%;
		line-height: 1.2;
	}
		div#header #logo a {
			color: #333333;
			font-weight: bold;
		}
			div#header #logo a:hover { text-decoration: none; }

/* =01-2 Language --------------------------*/
	div#header ul#lang {
		float: right;
		margin-top: -5em;
		text-align: right;
	}
		ul#lang li {
			display: inline;
			float: left;
			margin-left: 1em;
		}
			ul#lang li a {
				padding-left: 20px;
				background-repeat: no-repeat;
				background-position: left center;
			}
			ul#lang li#ja a { background-image: url(./images/ic_jp.gif); }
			ul#lang li#en a { background-image: url(./images/ic_gb.gif); }

		body.ja ul#lang li#ja a,
		body.en ul#lang li#en a {
			cursor: text;
			color: #333333;
			font-weight: bold;
		}
			body.ja ul#lang li#ja a:hover,
			body.en ul#lang li#en a:hover { text-decoration: none; }



/*	=02 Content-----------------------------------------------------*/
div#content {
	width: 800px;
	margin: 1em auto;
	padding: 1em;
	border: 1px solid #CCCCCC;
	border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-o-border-radius: 0.5em;
	-ms-border-radius: 0.5em;
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25);
	text-align: left;
}
	div#content div#alpha { position: relative; }
	div#content div#beta {
		clear: both;
		margin-top: 2em;
	}

/* =02-1 Catch --------------------------*/
	div#content h3#catch {
		text-align: center;
		height: 70px;
		padding-top: 10px;
	}
		div#content h3#catch img {
			-webkit-box-reflect: below -5px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.4, transparent), to(rgba(255,255,255,0.2)));
		}
		body.en div#content h3#catch img {
			-webkit-box-reflect: below -7px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.4, transparent), to(rgba(255,255,255,0.2)));
		}

/* =02-2 Download --------------------------*/
		div#alpha p,
		div#alpha div#download {
			clear: left;
			float: left;
			width: 390px;
			font-size: 125%;
		}
		div#alpha p { margin-bottom: 1em; }
			div#alpha p a {
				padding-right: 10px;
				background: url(./images/ic_go.gif) no-repeat right center;
			}

		div#alpha div#download a {
			position: relative;
			display: block;
			padding: 10px;
			background-image: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EEEEEE));
			border-radius: 0.5em;
			-webkit-border-radius: 0.5em;
			-moz-border-radius: 0.5em;
			-o-border-radius: 0.5em;
			-ms-border-radius: 0.5em;
			border: 1px solid #CCCCCC;
			box-shadow: 0 1px 3px rgba(0,0,0,0.1);
			-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
			-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
			-o-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
			-ms-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
			line-height: 42px;
		}
			div#alpha div#download a img {
				float: left;
				margin-right: 10px;
				background: url(./images/ic_down-active.png) no-repeat 80% 80%;
			}
			div#alpha div#download a strong {
				padding-right: 20px;
				background: url(./images/ic_down.png) no-repeat right center;
				font-size: 140%;
				font-weight: bold;
			}
			div#alpha div#download a:hover strong { text-decoration: underline; }
			div#alpha div#download a:active strong { background-image: url(./images/ic_down-active.png); }
			div#alpha div#download a span { display: block; }
			div#alpha div#download a span.afficheur {
				color: #333333;
				font-weight: bold;
			}
			div#alpha div#download a span.requirements {
				color: #999999;
				font-size: 12px;
			}
				
			div#alpha div#download a:hover { text-decoration: none; }

/* =02-3 Slideshow --------------------------*/
		div#alpha div#slideshow {
			position: absolute;
			top: 5px;
			right: 0;
			width: 390px;
		}
			div#alpha div#slideshow img {
				-webkit-box-reflect: below 0 -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.6, transparent), to(rgba(255,255,255,0.25)));
			}
			div#alpha div#slideshow ul {
				width: 44px;
				margin: 0 auto;
			}
				div#alpha div#slideshow ul li { display: inline; }
					div#alpha div#slideshow ul li a {
						overflow: hidden;
						display: block;
						float: left;
						width: 10px;
						height: 0;
						margin: 0 2px;
						padding-top: 10px;
						background: url(./images/btn_slideshow.png) no-repeat;
					}
						div#alpha div#slideshow ul li a:hover { background-position: 0 -10px; }
						div#alpha div#slideshow ul li a:active { background-position: 0 -20px; }
						div#alpha div#slideshow ul li.ui-tabs-selected a { background-position: 0 -30px; }
						@media projection, screen {/* =memo display: none; hide tab-content on screen */
							div#alpha div#slideshow  p.ui-tabs-hide {
								display: none;
							}
						}


/* =02-4 Features --------------------------*/
		div#beta ul.feature { width: 390px; }
		body.en div#beta ul.feature { color: #666666; }
		div#beta ul.first { float: left; }
		div#beta ul.second { float: right; }
			div#beta ul li { clear: both; margin-bottom: 1.25em; }
				div#beta ul li h4 {
					padding-bottom: 5px;
					color: #333333;
					font-weight: bold;
				}
				div#beta ul li p img {
					float: left;
					margin: 0 0.75em 0 0;
				}
	div#beta a.note {
		padding-right: 0.5em;
		vertical-align: top;
		font-size: 75%;
	}
		div#beta ol.note {
			clear: both;
			list-style: decimal inside;
			color: #999999;
			font-size: 75%;
		}
			div#beta ol.note a { margin-left: 0.5em; }


/*	=03 Footer-----------------------------------------------------*/
div#footer {
	position: relative;
	width: 800px;
	margin: 0 auto;
	padding: 0 1em 1em;
	text-align: left;
}

/* =03-1 License --------------------------*/
	div#footer div#license {}
		div#license h5 { font-weight: bold; }

/* =03-2 Credit --------------------------*/
	div#footer ul {
		clear: both;
		color: #999999;
		font-size: 75%
	}
		div#footer ul li {
			display: inline;
			float: left;
			padding-right: 1em;
		}
			div#footer ul li address { display: inline; }

/* =03-3 Sourceforge --------------------------*/
	div#footer p#sourceforge {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 96px;
		height: 31px;
	}
	* html div#footer p#sourceforge { bottom: 15px; }
	*+html div#footer p#sourceforge { bottom: 15px; }


/*	=04 Animation-----------------------------------------------------*/
@-webkit-keyframes catch {
	from {
		opacity: 0;
		-webkit-transform: scale(1.5);
		-webkit-animation-timing-function: ease-out;
	}
	50% {
		opacity: 0.8;
		-webkit-transform: scale(1.1);
		-webkit-animation-timing-function: linear;
	}
	to {
		opacity: 1;
		-webkit-transform: scale(1);
		-webkit-animation-timing-function: linear;
	}
}
div#content h3#catch {
	-webkit-animation-delay: 0.5s;
	-webkit-animation-duration: 1.2s;
	-webkit-animation-name: catch;
}



/*
body.en div#content h3#catch { height: 130px; }
div#header { margin: 1em auto 0; padding-bottom: 1em; background: url(./images/bg_header.png) no-repeat center bottom; }
div#content { margin: 0 auto 1em; background: url(./images/bg_content.png) no-repeat center top; }
*/
