/* MartiusWeb 2 - 2010
 * (cc) Martin "Martius" Richard
 */

/* global styles */
body
{
	background: #e8edf3;/* url('../images/main/bg.jpg') top center no-repeat;*/
	font-family: "Corbel", "Trebuchet Ms", Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0;
}
img
{
	border: 0;
}
#wrapper
{
	background: #FFFFFF url('../images/main/wrapper.png') bottom left repeat-x;
	min-height: 400px;
}

/* header */
header
{
	display: block;
	background: url('../images/main/header.png') bottom left repeat-x;
	height: 100px;
}
header a
{
	display: block;
	text-decoration: none;
	width: 390px;
	padding-top: 80px;
	background: url('../images/main/title.png') left bottom no-repeat;
	margin: 0 auto;
}
header a:hover
{
	background-position: -390px bottom;
}
header span
{
	visibility: hidden;
}

/* footer */
footer
{
	display: block;
	background: url('../images/main/footer.png') repeat-x;
	min-height: 100px;
	padding-top: 10px;
	margin: 0 auto;
	font-size: 0.8em;
}
footer a
{
	text-decoration: none;
	color: #0066CC;
}
footer a:hover { color: #003399; }
footer .wrapper div
{
	display: table-cell;
	width: 180px;
	padding: 0 10px;
}
footer h2
{
	font-weight: normal;
	text-shadow: 0px 1px #FFFFFF;
	margin: 0 0 10px 0;
}
footer p
{
	margin: 5px 0;
	text-align: justify;
}
footer ol
{
	padding-left: 20px;
}
footer div.wrapper
{
	margin: 0 auto;
	width: 800px;
}
p.icoTwitter, p.icoFacebook
{
	height: 16px;
	min-height: 16px;
	background-position: left 50%;
	background-repeat: no-repeat;
	padding-left: 20px;
}
p.icoTwitter { background-image: url('../images/icons/twitter_16.png'); }
p.icoFacebook { background-image: url('../images/icons/facebook_16.png'); }
#twitter_martiusweb { padding: 0; }
#twitter_martiusweb ul
{
	padding: 0;
	list-style: none;
	text-align: justify;
}

/* social aside */
#wrapper aside#social
{
	display: block;
	margin: 10px;
	padding-top: 4px;
	float: right;
}
#wrapper aside#social img
{
	border: 0;
}

/* navigation */
nav
{
	display: block;
	padding: 10px 0;
}
nav ol
{
	height: 20px;
	margin: 0 0px 0 0;
	padding: 10px 20px;
	list-style: none;
	background: #F5F3F4;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
nav li
{
	display: table-cell;
	width: 3%;
	text-align: center;
}
nav a
{
	color: #A9A7A8;
	text-decoration: none;
	text-shadow: 0px 1px #FFFFFF;
}
nav a:hover { color: #7A7A7A; }

/* search */
#search fieldset
{
	margin: 0 0 10px 0;
	padding: 0;
	border: 0;
}
#q
{
	height: 18px;
	background: url('../images/icons/q.png') no-repeat 2px 50%;
	padding-left: 20px;
	width: 130px;
}
#q , #search input[type="submit"]
{
	border: 1px #79A6D8 solid;
	background-color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

/* content */
#content
{
	padding: 0 100px 25px 100px;
}
#content h2
{
	font-weight: normal;
	text-align: center;
	text-shadow: 0px 1px #EFEFEF;
	font-size: 1.5em;
	margin: 15px 0;
	color: #79A6D8;
}
#content h2 a
{
	color: #79A6D8;
	text-decoration: none;
}
#content h2 a:hover { background-color: #FFFEED; }
#content h2 a.update-title:visited { color: #6699CC; }
div.articles#all-post, div.articles#tags-summary, div.articles#tag-entries
{
	display: table-cell;
	padding-right: 20px;
	width: 81%;
}
div.articles#one-post
{
	overflow: auto;
}
#content pre
{
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 20px 0px 5px 10px;
	background: url('../images/content/code_bg.png') no-repeat 10px 0px #E8EDF3;
}
#content pre ol { font-size: 1.1em; }
#content dl { font-size: 0.9em; }
#content blockquote
{
	background: #E8EDF3;

}
#content a.search
{
	background: url('../images/icons/q.png') no-repeat 2px 50%;
	padding-left: 20px;
}
.articles article
{
	display: block;
	margin: 25px 0;
	border-top: 1px #CCCCCC solid;
	padding-top: 20px;
	width: 100%;
	overflow: hidden;
}
.articles article.first, aside#sidebar article, .one-post-page article
{
	border:0;
	padding-top: 0;
}
ul.tags a, div.feeds a, article a, #comments-area a, #navlinks a
{
	text-decoration: none;
	color: #0066CC;
}
ul.tags a:hover, div.feeds a:hover, article a:hover, #comments-area a:hover, #navlinks a:hover { color: #003399; }
ul.tags a:hover { border-bottom: 1px #CCCCCC dotted; }
#navlinks { text-align: center; font-size: 1.2em; }
#content p
{
	font-size: 0.9em;
	margin: 5px 0;
}
#content li, #content blockquote { font-size: 0.9em; }
article p
{
	text-align: justify;
}
div.feeds
{
	text-align: center;
}

/* Sidebar */
aside#sidebar
{
	display: table-cell;
	width: 200px;
	/*
	position: absolute;
	top: 170px;
	right: 0px;
	margin: 0 5px; 
	*/
}
aside#sidebar a
{
	color: #666666;
	text-decoration: none;
}
aside#sidebar a:hover { border-bottom: 1px dotted #79A6D8; }
aside#sidebar a:visited   { color: #777777; }
aside#sidebar div
{
	background: #E8EDF3;
	border: 1px #CCCCCC solid;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	box-shadow: 0 0 3px #CCCCCC;
	-moz-box-shadow: 0 0 3px #CCCCCC;
	-webkit-box-shadow: 0 0 3px #CCCCCC;
	margin: 10px 0;
	padding-bottom: 5px;
	border: 1px solid #79A6D8; /* #BCD0ED; */
}

aside#sidebar h2
{
	color: #79A6D8;
	text-shadow: 0 1px #FFFFFF;
	margin: 0;
}
aside#sidebar img { border: 0; }
#sidebar div
{
	margin: 20px 0;
}
aside#sidebar p, aside#search form { margin: 0; padding: 0; }
aside#sidebar #search p { text-align: center; }
aside#sidebar .syndicate ul
{
	margin: 0;
	padding-left: 10px;
	list-style: none;
}
aside#sidebar .syndicate li
{
	font-size: 0.7em;
	margin: 2px 0;
}
aside#sidebar .syndicate a { font-size: 1.3em; }
aside#sidebar p
{
	text-align: justify;
}
aside#sidebar div.articles
{
	padding-left: 5px;
	padding-right: 5px;
}
aside#sidebar div.articles p
{
	font-size: 0.8em;
}
aside#sidebar h3, aside#sidebar h3 a
{
	color: #79A6D8;
	margin: 5px 0;
	font-weight: normal;
	font-size: 1em;
	text-align: center;
}

/* progress-bar */
#progressBar
{
	width: 302px;
	height: 22px;
	border: 1px #939393 solid;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#progressBar div
{
	margin: 1px;
	padding: 1px 0 1px 10px;
	background: url('../images/main/progress.png');
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 15px;
	height: 18px;
	color: #555555;
}

/* user box */
.user
{
	margin: 15px 0 10px 0;
	text-align: center;
	font-size: 0.8em;
}
.user-avatar
{
	width: 50px;
	height: 50px;
	margin: 0 5px;
	padding: 10px;
	background: url('../images/avatars/avatar_bg.png') no-repeat;
	float: right;
}
.user-nickname
{
	background: url('../images/icons/user.png') no-repeat 0 50%;
	padding-top: 2px;
	padding-left: 20px;
	display: inline;
}
.user-date
{
	background: url('../images/icons/calendar.png') no-repeat 0 50%;
	padding-left: 20px;
	display: inline;
}
.user-feed, .feed
{
	background: url('../images/icons/rss.png') no-repeat 0 50%;
	padding-left: 20px;
	display: inline;
}

/* Tags */
.tags
{
	margin: 0;
	padding: 0;
	text-align: justify;
}
.tags a { text-decoration: none; }
.tags li
{ display: inline; }
.tag0 { font-size: 75%; }
.tag10 { font-size: 80%; }
.tag20 { font-size: 90%; }
.tag30 { font-size: 100%; }
.tag40 { font-size: 110%; }
.tag50 { font-size: 120%; }
.tag60 { font-size: 140%; }
.tag70 { font-size: 150%; }
.tag80 { font-size: 160%; }
.tag90 { font-size: 170%; }
.tag100 { font-size: 180%; }
.post-tags { margin: 0; padding: 0; }
.post-tags li
{
	font-size: 0.8em;
	display: inline;
	background: url('../images/icons/tag.png') no-repeat;
	padding-left: 20px;
}

/* Comments */
#comments-area
{
	border-top: 1px #CCCCCC dotted;
	margin-top: 10px;
	padding-top: 20px;
}
.comment_count
{
	background: url('../images/icons/comment.png') no-repeat;
	padding-left: 20px;
}
#comments
{
	width: 55%;
	display: table-cell;
	padding-bottom: 60px;
}
#comment-form { margin-bottom: 60px; }
#comments dt
{
	padding-bottom: 23px;
	background: url('../images/comments/speak.png') no-repeat 100px bottom;
	font-size: 0.9em;
	margin-top: 10px;
}
#comments dd
{
	margin-top: 0;
	padding: 0px;
	background: #E1E8F0;
	color: #666666;
}
#comments p
{
	padding: 0px 10px;
}
.comments-tl, .comments-tr, .comments-bl, .comments-br
{
	display: block;
	width: 5px;
	height: 5px;
	background-repeat: no-repeat;
}
.comments-tl { background-image: url('../images/comments/tl.png'); width: 100%; }
.comments-bl { background-image: url('../images/comments/bl.png'); width: 100%; }
.comments-tr { background-image: url('../images/comments/tr.png'); float: right; }
.comments-br { background-image: url('../images/comments/br.png'); float: right; }
.comment-number
{
	font-size: 1.2em;
	text-decoration: none;
}
#comment-form
{
	margin-left: 5%;
	margin-bottom: 10px;
	display: table-cell;
	width: 40%;
}
#comment-form p
{
	text-align: left;
}
#comment-form fieldset
{
	border: 0;
}

/* Accessibility */
aside#access-prelude
{
	display: none;
}
.access-info { display: none; }

/* Pagination */
.pagination
{
	width: 100%;
	margin: 0 auto;
	padding: 10px;
	text-align: center;
}
.pagination a
{
	padding: 0 5px;
	text-decoration: none;
	text-decoration: none;
	color: #0066CC;
}
.pagination a:hover
{
	border-bottom: 1px #003366 dotted;
}
.pagination-first , .pagination-last{ font-size: 1.3em; }
.pagination-prev, .pagination-next { font-size: 1.1em; }
form#pagination-jump
{
	display: inline;
}

/* Landing page */
article#landingpage
{
	border-bottom: 2px #F5F3F4 solid;
	padding: 0 10px 5px 10px;
	background-color: #FFFEED;
}
article#landingpage a
{
	text-decoration: none;
}
article#landingpage a.article-subject
{
	color: #003366;
}

/* 404 */
.error404 p { text-align: center; }
.error404 #q { width: 200px; }

/* archive */
div.archive-year
{
	width: 2%;
	display: table-cell;
	padding: 0 20px;
}
div.archive-year ul
{
	padding-left: 0;
	list-style: none;
}
div.archive-year h3
{
	font-weight: normal;
	text-shadow: 0 1px #EFEFEF;
	font-size: 1.8em;
	text-align: center;
}

/* contact */
#comment-form.contactme { margin-left: 0; }

/* tutos */
#subcategories ul
{
	margin: 0;
	padding-left: 25px;
	list-style-image: url('../images/icons/category.png');
}

/*
 * == Special:TutoCSS ==
 */
.tuto-css-browsers-short
{
	text-align: center;
	padding: 0;
	list-style-type: none;
}
.tuto-css-browsers img
{
	position: relative;
	top: 10px;
}
.tuto-css-browsers-short li { display: inline; }
.tuto-css-colors li
{
	float: left;
	width: 100px;
	height: 50px;
	list-style: none;
	margin: 2px;
}
.tuto-css-text-align li
{
	width: 20%;
	font-size: 0.8em;
	border: 1px black solid;
	margin: 5px;
	padding: 5px;
	float: left;
	list-style: none;
}
.tuto-css-text-align code { font-weight: bold; font-size: 1.2em; color: red; }
a.tuto-css-no-sprite
{
	background: url('/public/cours-xhtml/sprites-separated_01.png');
	display: block;
	width: 100px;
	height: 25px;
	padding-top: 5px;
	text-align: center;
}
a.tuto-css-no-sprite:hover
{
	background: url('/public/cours-xhtml/sprites-separated_02.png');
	color: #FEFEFE;
}