
/*------------------------------------------------------------------
[Master Stylesheet]

Project:	AutoDistribution
Version:	1.0
Last change:	01/06/2009
Assigned to:	Pui-Ching CHAU
Primary use:	Website
-------------------------------------------------------------------*/

.right {
	float: right;
}

.left {
	float: left;
}

body {
	background-color: #3b3b3b;
	font: normal .78em/1 Arial, Helvetica, sans-serif;
}

#main {
	background-color: white;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
}

	#header {
		height: 36px;
		padding: 1em 0;
	}
		
		#topnav, #top-sidebar {
			height: 36px;
			line-height: 36px;
			position: relative;
		}
		
		#topnav {
			list-style: none;
			float: left;
			padding: 0;
			width: 640px;
			margin: 0 10px;
		}
		
			#topnav li {
				float: left;
			}
			
				#topnav li a {
					background: transparent url('../imgs/topnav.png') no-repeat scroll 0 0;
					display: block;
					height: 36px;
					text-indent: -9999px;
				}
				
				body.home #topnav #home {
					background-position: 0 -72px;
				}
				
					#topnav #home {
						background-position: 0 0;
						width: 80px;
					}
				
					#topnav #home:hover {
						background-position: 0 -36px;
					}
				
				body.demo #topnav #demo {
					background-position: -80px -72px;
				}
				
					#topnav #demo {
						background-position: -80px 0;
						width: 99px;;
					}
				
					#topnav #demo:hover {
						background-position: -80px -36px;
					}
				
				body.abo #topnav #abo {
					background-position: -182px -72px;
				}
				
					#topnav #abo {
						background-position: -182px 0;
						width: 160px;
					}
					
					#topnav #abo:hover {
						background-position: -182px -36px;
					}
				
				body.qui #topnav #qui {
					background-position: -343px -72px;
				}
				
					#topnav #qui {
						background-position: -343px 0;
						width: 144px
					}
					
					#topnav #qui:hover {
						background-position: -343px -36px;
					}
					
				body.contact #topnav #contact {
					background-position: -343px -72px;
				}
				
					#topnav #contact {
						background-position: -489px 0;
						width: 148px;
					}
					
					#topnav #contact:hover {
						background-position: -489px -36px;
					}
				
	
		 #top-sidebar {
		 	background: url('../imgs/bg-index-top-right.png') no-repeat top left;
			float: left;
			width: 287px;
		 }
		 
		 	#top-sidebar p {
				color: white;
				margin: 0; padding-left: 1em;
			}
			
			#top-sidebar a {
				text-transform: uppercase;
				color: yellow;
				font-weight: bold;
				font-size: 120%;
				text-decoration: none;
				padding-left: 1em;
			}
			
			#top-sidebar a:hover {
				text-decoration: underline;
			}
	
	#content {
		margin-bottom: 13px;
	}
		
		#highlight {
			margin-bottom: 1em;
			width: 940px;
			height: 467px;
		}
			
			#hl-content {
				width: 480px;
				margin-top: 8em;
				color: #3a3a3a;
			}
			
				#hl-content h3 {
					font-size: 150%;
					font-weight: bold;
					padding-bottom: .5em;
				}
				
				#hl-content p {
					font-size: 120%;
				}
				
				#hl-menu {
					margin-top: 1.5em;
				}
				
				#hl-menu li {
					float: left;
					display: inline;
				}
				
				#hl-menu li a {
					background: url('../imgs/highlight-menu.png') no-repeat scroll 0 0;
					display: block;
					line-height: 31px;
					width: 161px;
					color: white;
					font-weight: bold;
					text-decoration: none;
					margin-right: 1em;
					text-indent: 1em;
				}
				
					#hl-menu #hl-menu1 {
						background-position: 0 0;
						width: 161px;
					}
				
					#hl-menu #hl-menu1:hover {
						background-position: 0 -31px;
					}
					
					#hl-menu #hl-menu2 {
						background-position: -162px 0;
						width: 161px;
						text-indent: 3em;
					}
				
					#hl-menu #hl-menu2:hover {
						background-position: -162px -31px;
					}
		
		#linkbox li {
			background: url('../imgs/linkbox.png') no-repeat top left;
			float: left;
			height: 176px;
			width: 228px;
			margin-right: 7px;
		}
		
		#linkbox li:hover {
			cursor: pointer;
		}
			#linkbox .last,
			#linkbox li:last-child {
				margin-right: 0;
			}
			
			/*#linkbox .header {
				background-image: url('../imgs/linkbox.png');
			}*/
			
				#linkbox .header h3 {
					color: white;
					font-size: 130%;
					font-weight: bold;
					margin: 0;
					padding: 1.3em 0 0 0.5em;
					width: 210px;
				}
				
				#linkbox p {
					color: #3a3a3a;
					padding: .6em 1em 0 1.6em;
				}
			
			#linkbox #lb1 .header,
			#linkbox #lb2 .header,
			#linkbox #lb3 .header,
			#linkbox #lb4 .header {
				height: 74px;
				width: 92px;
			}
			
			/*#linkbox #lb1 .header {
				background-position:  0 -176px;
			}
			
			#linkbox #lb2 .header {
				background-position:  0 -250px;
			}
			
			#linkbox #lb3 .header {
				background-position:  0 -324px;
			}
			
			#linkbox #lb4 .header {
				background-position:  0 -398px;
			}*/
		
		#left-content,
		#right-content {
			margin-top: 2em;
		}
		
			#left-content ul,
			#right-content ul {
				padding: 1em;
			}
			
			#left-content li,
			#right-content li {
				border-bottom: 1px dotted gray;
			}
			
				#left-content li:last-child,
				#right-content li:last-child {
					border-bottom: none;
				}
				
				#left-content p,
				#right-content p {
					padding: 1em;
				}
		
		#left-content h2 {
			font-size: 130%;
			padding-bottom: 0.75em;
			color: #43a3f4;
			padding-left: 1em;
		}
		
		#left-content .paragraph {
			border-top: 1px dotted gray;
			padding-bottom: 18em;
		}
		
			#left-content .paragraph li {
				border: none;
				list-style: disc;
				list-style-position:inside;
				padding-bottom: .5em;
			}
			
			#left-content .emphasis {
				color: #0987ea;
				font-size: 110%;
				font-weight: bold;
			}
			
				#left-content .paragraph a#souscrire {
					background: transparent url('../imgs/btn-souscrire.png') no-repeat 0 0;
					display: block;
					width: 415px;
					height: 100px;
					text-indent: -9999px;
				}
				
				#left-content .paragraph a#souscrire:hover {
					background-position: 0 -110px;
				}
		
		#right-content {
			width: 287px;
			background: #f3f3f3 url('../imgs/bg-right-content-bottom.png') no-repeat bottom;
		}
		
			#right-content h3 {
				background: url('../imgs/bg-right-content-top.png') no-repeat;
				height: 35px;
				line-height: 35px;
				color: white;
				font-weight: bold;
				font-size: 110%;
				padding-left: 1em;
			}
			
			#right-content a {
				text-decoration: none;
				color: #42a1ed;
				font-weight: bold;
			}
			
			#right-content a:hover {
				text-decoration: underline;
			}
			
			#legal #right-content li {
				list-style: none;
				display: block;
				background: url('../imgs/fl-bloc-liste.png') no-repeat 0 1.1em;
				padding: 1em;
			}
			
			#legal #right-content li:hover {
				background: url('../imgs/fl-bloc-liste-2.png') no-repeat 0 1.1em;
			}
			
			#legal #right-content a {
				color: #3b3b3b;
				display: block;
				width: 100%;
			}
			
			#legal #right-content a:hover {
				color: #42a1ed;
				text-decoration: underline;
			}
	
#footer {
	height: 61px;
	background: url('../imgs/bg-footer.png') repeat-x top;
	margin-bottom: 13px;
	color: white;
	font-size: 75%;
}
	
	#footer a {
		text-decoration: none;
		color: white;
	}
	
	#footer a:hover {
		text-decoration: underline;
	}
	
	#footer p {
		padding: 2em;
	}

.hor-dot-line {
	border: solid none none none;
	border-width: 1px 0 0 0;
	border-style: dotted;
	padding: 0 0 1em 1em;
}


#cache {
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.8;
	z-index: 100;
	filter: alpha(opacity=80);
	display: none;
}

#loginForm{
	background: url(../imgs/bg-home-login.png) no-repeat;
	margin:0;
	padding:0;
	width: 449px;
	height: 269px;
	position: absolute;
	top: 150px;
	left: -192px;
	z-index: 200;
	display: none;
	padding: 15px;
}

#loginForm .titre{
	color: #ffdf00;
	font-size: 130%;
	font-weight: bold;
	padding-left: 5px;
}

#loginForm .closeLoginForm{
	position: absolute;
	right: 15px;
	top: 10px
}

#loginForm label{
	display: block;
	color: #ffffff;
	font-size: 120%;
	font-weight: bold;
	margin-bottom: 0px;
	padding-bottom: 0px;
	line-height: 1em;
	margin-top: 20px;

}

#loginForm #email,
#loginForm #password{
	width: 443px;
	color: #000;
	font-size: 120%;
	font-weight: bold;

}


#loginForm #rememberMeLabel{
	margin: 0px;
	font-size: 90%;
	color: #44a3f4;
	display: inline;
	line-height: 1em;
}

#loginForm #bottomLgn{
	margin-top: 25px;
	border-bottom: 1px solid #5f5f5f;
	border-top: 1px solid #5f5f5f;
}

#loginForm #options{
	float: left;
	line-height: 20px;
}

#loginForm #loginbtn{
	float: right;
	margin-top: 8px;
}

#loginForm .lostpassword{
	font-size: 80%;
	color: #a1a1a1;
	padding-left: 5px;
	font-style: italic;
}
