/* ------------------------------------------------------------------------
	Redefintion
------------------------------------------------------------------------- */

	* { margin: 0; padding: 0; border: 0; }
	
	body {
		font: 62.5%/1.2 Georgia, Times, Serif;
		color: #fff;
		background: url(../media/images/all/backgrounds/bodyBackground.jpg) top left repeat fixed;
	}
	
	p, ul, ol {
		margin: 0 0 15px 0;
	}
	
	a:focus { outline: none; }


/* ------------------------------------------------------------------------
	General Classes
------------------------------------------------------------------------- */




/* ------------------------------------------------------------------------
	Shell
------------------------------------------------------------------------- */

	#container {
		position: absolute;
		top: 0; left: 0;
		height: 100%; width: 100%;
	}

	ul#menu {
		position: fixed;
		margin: 80px 20px 0 265px;
		list-style: none;
		text-align: right;
	}
	
		ul#menu a { color: #fff; text-decoration: none; }
		ul#menu a:hover { color: #d8e8b2; }
		ul#menu .selected a { color: #d8e8b2; text-decoration: line-through; }

	#page {
		width: 880px;
		font-size: 1.3em;
		margin: 0 0 0 50px;
	}
	
		#page #content {
			float: left;
			width: 545px;
			margin: 0 0 0 330px;
			background: #636363;
		}
		
			#page #content .about {
				padding: 5px 15px 5px 20px;
				font-size: 0.8em;
				color: #fff;
				background: #636363;
			}
			
				#page #content .about ul {
					float: left;
					list-style: none;
					margin: 0;
				}
				
					#page #content .about ul li {
						display: block;
						float: left;
						margin: 0 10px 0 0;
					}
				
				#page #content .about .content { clear: both; }
				
				#page #content .about .content div {
					padding: 10px 0 1px 0;
					color: #232323;
					font-size: 1.4em;
					font-style: italic;
					display: block;
				}
				
					#page #content .about .content h4 {
						font-weight: normal;
						font-size: 1.2em;
					}

				#page #content .about a {
					color: #fff;
					text-decoration: none;
				}
					#page #content .about a:hover { text-decoration: underline; }
				
				#page #content .about h2 {
					float: right;
					font-size: 0.8em;
					font-weight: normal;
					margin: 2px 0 0 0;
				}
				
				#page #content .projects {
					list-style: none;
				}
				
					#page #content .projects li {
						position: relative;
						margin: 80px 0 0 0;
					}
					
						#page #content .projects li h3 {
							position: relative; top: -5px;
							font-size: 2.2em;
							font-weight: normal;
							text-indent: 23px;
						}
							#page #content .projects li h3 em { float: left; }
							#page #content .projects li h3 a {
								float: left;
								margin: 18px 0 0 5px;
							}
							
							#page #content .projects li p.workDone {
								float: right;
								background: #484848;
								padding: 10px;
								margin: 0;
							}
							
							#page #content .projects li div.counter {
								float: right;
								color: #484848;
								background: #d2f5ff;
								padding: 10px;
							}
							
							#page #content .projects li div.counter a { color: #484848; text-decoration: none; }
							
							#page #content .projects li .moreInfo div {
								color: #d2f5ff;
								position: relative;
								line-height: 1.8em;
								padding: 25px 25px 1px 25px;
								margin: 0;
								clear: both;
								background: url(../media/images/all/backgrounds/fadedBackground.png) top left repeat;
							}
							
							#page #content .projects li .moreInfo small { color: #fff; }
							
							#page #content .projects li .moreInfo p.closeButton {
								display: block;
								width: 82px; height: 28px;
								overflow: hidden;
								position: absolute;
								bottom: -43px; right: 0;
							}
							
							#page #content .projects li .moreInfo a.closeButton {
								display: block;
								width: 82px; height: 28px;
								text-indent: -10000px;
								background: url(../media/images/en/buttons/closeButtonInfo.gif) top left repeat;
							}
							
							#page #content .projects li .visitSite {
								position: absolute;
								bottom: 0; right: 4px;
							}
							
								#page #content .projects li .visitSite a {
									color: #fff;
									padding: 2px 3px;
									background: #000;
									text-decoration: none;
									font-size: 0.8em;
								}
									#page #content .projects li .visitSite a span { color: #d8e8b2; }
							
							#page #content .projects li ul.pictures {
								list-style: none;
								position: relative;
								width: 545px; height: 450px;
								overflow: hidden;
								clear: both;
							}
								#page #content .projects li ul.pictures li {
									display: block;
									position: absolute;
									top: -1px; left: 0;
									margin: 0;
								}
								
									#page #content .projects li ul.pictures li a span {
										display: none;
										position: absolute;
										top: 0; left: 0;
										width: 547px; height: 450px;
										text-indent: -10000px;
										background: url(../media/images/all/backgrounds/fullSizeBackground.png) top left no-repeat;
									}
									#page #content .projects li ul.pictures li a:hover span { display: block; }


/* ------------------------------------------------------------------------
	Titles / Buttons
------------------------------------------------------------------------- */

	#logo_leRustik { position: fixed; float: left; margin: 0 50px 0 0; }

		#logo_leRustik a {
			display: block;
			text-indent: -10000px;
			background: url(../media/images/all/logos/logo_leRustik.png) top left no-repeat;
			width: 196px; height: 432px;
		}
	
	a.info {
		display: block;
		width: 12px; height: 12px;
		text-indent: -10000px;
		background: url(../media/images/all/backgrounds/moreInfo.gif) top left no-repeat;
	}
	
	.codedBy {
		position: fixed;
		bottom: 0; left: 980px;
		background: #d8e8b2;
		color: #484848;
		padding: 0px;
	}
	
		.codedBy a { color: #484848; text-decoration: underline fixed; }


/* ------------------------------------------------------------------------
	Miscellaneous
------------------------------------------------------------------------- */

	.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 */