html {
background: #E5F3FF url(../img/bodyback.gif) repeat-x; 
font: normal 75%/1.5em "Lucida Grande", Lucida, Verdana, sans-serif;
color: #000; /* <-- main font color */
}
body { text-align: center; }

/* -- UTILITY -- */
.padding {padding: 20px;}
.clear {clear:both;display:block;overflow:hidden;width:0;height:0}

.col1, .col2, .col3, .subcol1, .subcol2 {display:inline; float:left; position:relative;}

.col1 { width: 820px; }
.col2 { width: 560px; }
.col3 { width: 240px; }

	.subcol1 { width: 270px; }  /* -- column's that you can use under a page like about -- */
	.subcol2 { width: 300px; }

.center { margin: 0 50px; } 
.right { margin-left: 20px; }
.border { border-bottom: 1px solid #BFD8EC; padding-bottom: 10px; margin-bottom: 20px; }

#skip { display: none; }
/* -- end UTILITY -- */

/* -- Main div -- */
#wrapper {
	text-align: left;
	width: 860px;
	margin: 21px auto 20px auto;
	background-color: #fff;
	border: 1px solid #BFD8EC;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}

#header { margin-bottom: 30px; }

#footer { border-top: 1px solid #BFD8EC; padding-top: 10px; margin: 15px 0;}

#logo { float: left; }

#featuredwork { float: left; padding-bottom: 15px;}

#title, #slogan { 
	border-bottom: 1px solid #BFD8EC; 
	margin-bottom: 15px;
	padding-bottom: 15px;
	text-transform: uppercase;
}
	#title .alt, #slogan .alt, .col3 .alt { color: #48648E; font-weight: bold;  }
	#title em { font-weight: bold; }
	
#testimonials { 
	width: 238px;
	background: #C8E6FF url(../img/boxtop.gif) no-repeat 0 top;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #BFD8EC;
 }

.servdesc { 
	background: #C8E6FF url(../img/boxtop.gif) no-repeat 0 top;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-bottom: 2px solid #BFD8EC;
 }
.servdesc .padding { padding-top: 0; }

#badge { 
	width: 238px;
	background: #C8E6FF url(../img/boxtop.gif) repeat-x 0 top;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #BFD8EC;
 }


#look { border-top: 1px solid #BFD8EC; border-bottom: 1px solid #BFD8EC; margin: 20px 0 15px; padding: 10px 0; }
.text, #copy { float: right; }
.text img { float: left; margin-right: 20px;}


/* -- Font section -- */
h1 { text-indent: -999em; background: url(../img/logo.jpg) no-repeat; width: 250px; height: 110px; }

h2 { color: #444; font-size: 30px; line-height: 1.15em; }
	
h3 {
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 1.5em;
	color: #425E8D;
}
	#testimonials h3, #badge h3 { border-bottom: 1px solid #BFD8EC; padding-bottom: 5px; margin-bottom: 20px; color: #484848; }
	#featuredwork h3, #folioslider h3 { font-size: 14px; text-transform: uppercase; font-weight: bold; }
	.col3 h3 { text-transform: uppercase; font-size: 14px; margin-bottom: 20px; }
	.servdesc h3 { font-size: 24px; text-transform: uppercase; font-weight: bold; color: #6880A6; margin-bottom: 20px; }	
	#bottom h3 img, #badge h3 img, #testimonials h3 img { float: left; margin-right: 10px;}
	 
h4 { font-size: 14px; text-transform: uppercase; color: #343434; margin-bottom: 20px; line-height: 1.5em; }
	
p { font-size: 12px; margin-bottom: 1em; }
	#look p { font-size: 24px; color: #8f8f8f;  margin-bottom: 0; text-transform: uppercase; float: left; padding-top: 7px; }
		#look em { color: #5e5e5e; }
	.big { 	margin: 0 2px 0 10px; font-size: 42px; color: #6880A6; }
	.euro { font-size: 20px; }
	.price { text-align: right;	margin-top: 20px; margin-bottom: 0;}
	.slogan { color: #666; }
		.slogan strong { color: #484848; font-weight: bold; }
	.secslogan { font-size: 14px; margin-bottom: 20px; }
	.contactintro { font-size: 14px; line-height: 1.5em; margin-bottom: 20px; }
	#desc p { font-size: 14px; line-height: 1.5em; }
	.highlight { font-size: 16px; line-height: 1.5em; }
	.sign { text-align: right; margin-bottom: 20px; color: #343434;}
	.last { margin: 0; }
	.required { float: left; font-size: 10px; color: #999; }
	#featuredwork p { line-height: 1.5em }
	#footer p { margin-bottom: 0; }

.services li {
	list-style-position: inside;
	line-height: 2em;
	list-style-image: url(../img/liarrow.gif);
	border-bottom: 1px dotted #BFD8EC;	
	margin-bottom: 5px;
}

#content li {
	line-height: 2em;
	margin-bottom: 5px;
	list-style-type: disc;
	list-style-position: inside; }

#copy p {
	color: #b2b2b2;
	font-size: 10px;
	text-align: right;
}

/* -- Button's section --*/

#seebtn  { 
	text-indent: -999em;
	background: url(../img/seeport.gif) no-repeat;
	width: 139px;
	height: 34px;
	margin-left: 20px;
	float: right;
	}

.morebtn a { 
	text-indent: -999em;
	display: block;
	background: url(../img/readmore.png) no-repeat;
	width: 114px;
	height: 28px;
	float: right;
	overflow: hidden;
	}
	
.viewmorebtn a { 
	text-indent: -999em;
	display: block;
	background: url(../img/viewmore.png) no-repeat;
	width: 116px;
	height: 28px;
	margin-left: auto;
	float: right;
	overflow: hidden;
	}

.morebtn a:hover, .viewmorebtn a:hover, #seebtn:hover  { 
		opacity: .8;
	}

.more {
	float: right;
	text-decoration: none;
	color: #6880A6;
	font-size: 11px;
	padding-right: 14px; 
	}
	
	.more:hover {
		text-decoration: none;
	}
	
/* -- IMG section -- */	

#aboutimg { 
	width: 558px;
	border: 1px solid #BFD8EC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	margin-bottom: 20px;
	}
	
#aboutimg img { 
	width: 554px;
	height: 140px;
	margin: 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	 }

#mainimg { 
	width: 558px;
	border: 1px solid #BFD8EC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	}
	
#mainimg img { 
	width: 554px;
	height: 184px;
	margin: 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	 }
	 
.botimg img { 
	width: 236px;
	height: 84px;
	margin: 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
 }

.topimg img { 
	width: 236px;
	height: 84px;
	margin: 2px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
 }

 .topimg { 
 	width: 240px;
	 border: 1px solid #BFD8EC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	margin-bottom: 10px;
 }

.topimg:hover, #mainimg:hover, .imgbox li:hover { background: #6880A6; border: 1px solid #6880A6; }

.botimg { 
 	width: 240px;
	 border: 1px solid #BFD8EC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	margin-top: 20px;
 }

/* -- Services page img section -- */

.imgbox { 
	float: left;
	margin-bottom: 10px;
	padding-top: 10px;
 }
 
.imgbox li { 
	margin: 10px;
	float: left;
	display: block;
	width: 98px;
	height: 98px;
	background-color: #f1f1f1;
	border: 1px solid #BFD8EC;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}
	
	.imgbox img { 
		width: 94px;
		height: 94px;
		margin: 2px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	 }
	
	.imgboxalt { margin-left: 20px; }

/* -- Portfolio small img -- */	
.folioimg { width: 240px; float: left; margin-bottom: 20px; border-bottom: 1px solid #BFD8EC; line-height: 1.5em; }

/* -- Portfolio next & prev button -- */	
#nextBtn2 a { float: right; text-indent: -999em; background-image: url(../img/next.gif); width: 260px; height: 45px; display: block; overflow: hidden;}		
#prevBtn2 a { float: left; text-indent: -999em; background-image: url(../img/prev.gif); width: 114px; height: 45px; display: block; overflow: hidden; }	
	#nextBtn2 a:hover, #prevBtn2 a:hover { 
		opacity: .8;
	}
/* -- slide box -- */

#ribbon { position: absolute; z-index: 1; left: 35px; top: -1px; }
#mask {	position: absolute; }
#maskalign {position: absolute; }

#slider li { 
	width:820px;
	height:231px;
	overflow:hidden; 
	list-style: none;
}
	
#slidebox {	
	text-align: center;
	position:relative;
	width:820px; 
}	
	
#folioslider li { 
	width: 820px;
	overflow: hidden;
	list-style: none;
}
#folioslider .alt { margin: 0 50px; }	
	
/* -- NEWS home page setup -- */	

.news { float: left; margin-bottom: 10px; border-bottom: 1px dotted #BFD8EC; padding-bottom: 2px; }	
	.news:hover { background-color: #f0f0f0; }	
.date { font-size: 9px; text-transform: uppercase; color: #343434; margin-bottom: 0; }
.news .content { font-size: 10px; margin-bottom: 0; }
	
/* -- contact form -- */
/* Form */

#emailerror {
	margin-bottom: 10px;
	padding: 10px;
	background: #fcc;
	border: 1px solid #ff1600;
	color: #4b4b4b;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#success {
	margin-bottom: 10px;
	padding: 10px;
	background: #d6f1a9;
	border: 1px solid #76993d;
	color: #455a23;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#success p {
	font-size: 16px;
	margin-bottom: 0;
}

#error img {
	width: 20px;
	height: 20px;
	float: left;
	display: block;
	margin-right: 10px;
}

.error {
	color: #99100f;
	margin-bottom: 10px;
	font-size: 20px;
}

#emailerror li {
	margin-left: 10px;
	margin-bottom: 5px;
	list-style-type: disc;
	list-style-position: inside;
}

#submitform { float: left; }

#submitform #Message, #Name, #Email, #Company { 
	width: 540px;
	max-width: 562px;
	margin-bottom: 10px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #BFD8EC;
	padding: 10px;
	color: #666;
	}
	
	#submitform #Name, #Email, #Company { height: 15px; }
	#submitform #Message { height: 170px; }

#submitform label { float: left; text-transform: uppercase; font-size: 10px; }
	
.submit-button { 
	text-indent: -999em;
	background: url(../img/submit.gif) no-repeat;
	border: none;
	height: 45px;
	overflow: hidden;
	margin-bottom: 0; 
	float: right;
	width: 114px; }
	
	.submit-button:hover { 
		opacity: .8;
	}

/* NAVIGATION */

#nav { float: right; }

#nav ul { 
	background: #008ff0 url(../img/nav/menucenter.gif) repeat-x 0 bottom;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	height: 34px;
 }

#nav li {
	list-style: none;
	display: inline;
	margin-left: 10px;
	text-align: left;
	float: left;
}

#nav li.last { margin-right: 15px; }

div#nav a { border: 0; }

#nav a { 
	text-indent: -999em;
	height: 34px; 
	display: block;
	overflow: hidden;
	}

#home a {
	width: 79px;
	background: url(../img/nav/accueil.jpg) no-repeat;
	}
	
	#home a:hover, #home.selected a { 
		background: url(../img/nav/accueil_h.jpg) no-repeat;
	 }

#nav #about { 
	width: 60px;
	background: url(../img/nav/about.gif) no-repeat;
	}
	
	#about a:hover, #about.selected a { 
		background: url(../img/nav/about_h.gif) no-repeat;
	 }

#nav #services { 
	width: 100px;
	background: url(../img/nav/services.jpg) no-repeat;
	}
	
	#services a:hover, #services.selected a { 
		background: url(../img/nav/services_h.jpg) no-repeat;
	 }

#nav #portfolio { 
	width: 105px;
	background: url(../img/nav/temoignage.jpg) no-repeat;
	}
	
	#portfolio a:hover, #portfolio.selected a { 
		background: url(../img/nav/temoignage_h.jpg) no-repeat;
	 }

#nav #contact { 
	width: 79px;
	background: url(../img/nav/contact.jpg) no-repeat;
	}
	
	#contact a:hover,  #contact.selected a { 
		background: url(../img/nav/contact_h.jpg) no-repeat;
	 }
	 	
/* sec nav section */
#secnav { float: left; }

#secnav li { display: inline; font-size: 12px; }

#secnav li a { color: #b2b2b2; text-decoration: none; margin-right: 10px; }
	#secnav li a:hover, #secnav li.selected a { color: #6880A6; }