/* Filterable Portfolio Stylesheet */


/* Simple Reset
------------------------------------------------------------ */
html, body, div, h1, h2, ul, li, dl, dd, dt, p { margin: 0; padding: 0; }
ul { list-style: outside disc; }


/* Import Fonts
------------------------------------------------------------ */
@import url(http://fonts.googleapis.com/css?family=Quattrocento);
@import url(http://fonts.googleapis.com/css?family=Lato);


/* Custom Classes
------------------------------------------------------------ */
.group:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; }
* html .group { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */


/* General Styles
------------------------------------------------------------ */
body {  }

#wrap { max-width: 1080px; min-height: 1024px; margin: 0 auto; padding: 1.5em 20px; overflow: hidden; -moz-box-shadow: 0 0 5px #ddd; -webkit-box-shadow: 0 0 5px #ddd; box-shadow: 0 0 5px #ddd; }




/* Filter */
dl { margin-bottom: 3em; color: #777; }
dt, dd { float: left; }
dt { margin-right: 5px; }
.filter li { float: left; }
.filter li:after { content: "/"; }
.filter li:last-child:after { content: ""; }
.filter a { font-family: ubuntu, serif;   padding: 0 10px; color: #777; text-decoration: none; }
.filter a:hover, .current a { color: #4f0d4d; }

/* Portfolio Items */
/*.portfolio li { float: left; margin-right: 0px; margin-bottom: 0; border: 0px solid #ccc; -moz-box-shadow: 0 5px 5px -3px #222; -webkit-box-shadow: 0 5px 5px -3px #222; box-shadow: 0 5px 5px -3px #222; 


}

.portfolio a { display: block; border: 0px solid #fff;  text-decoration: none; }
.portfolio img { width: 174px; height: 174px; display: block; border: 0px solid #ccc;    }

.portfolio li img.hover {
 BACKGROUND: url(thumb_bg.png) no-repeat center center; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none*/

 }
 
 
 
 
 
 /* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Global properties ======================================================== */

/* Global Structure ============================================================= */
.container {
	margin: 0 auto;
	position: relative;

}

	/* Header */
	header{
		height:72px;
		overflow:hidden;
		background:url(../images/header-bg.gif) 0 0 repeat-x;
	}
	
	/*Gallery*/
	#gallery {
		height:496px;
		overflow:hidden;
		background:url(../images/gallerry-bg.gif) 0 0 repeat-x;
	}
	
	/* Content */
	#formulaire {
		float: left;
		margin-left: 20px;
		

	}
	
	/* Sidebar */
	aside{
		float: left;
		width: 472px;
		margin-right:35px;
		margin-left:10px;
		font-family: 'Droid Sans', sans-serif;
	font-size: 105%;
	text-align: justify;
	line-height: 140%;
	font-style:normal;
	color:#4c4c4c;
	margin-top: 0.5em;
	}
			
	/* Footer */
	footer{
		padding:20px 0 22px 0;
		border-top:5px solid #eee;
	}




/* Left & Right alignment */

.fleft { float:left;}
.fright { float:right;}
.clear { clear:both;}

.col-1, .col-2, .col-3 { float:left;}

.alignright { text-align:right;}
.aligncenter { text-align:center;}

.wrapper { 
	width:1080px;
	overflow:hidden;
}

/* The inside class provides consistent padding. To be used often! */
.inside{ padding: 32px 37px 50px 37px; }


/*----- form defaults -----*/
input, select, textarea { 
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	vertical-align:middle;
	font-weight:normal;
}

/*----- other -----*/
figure { margin-bottom:18px;}

.img-indent { 
	margin:0 20px 0 0; 
	float:left;
}
.img-box { 
	width:100%; 
	overflow:hidden; 
	padding-bottom:15px;
}
	.img-box figure { 
		float:left; 
		margin:0 20px 0 0;
		padding:0;
	}

.extra-wrap { 
	overflow:hidden;
}

p {margin-bottom:18px;}
.p1 { margin-bottom:9px;}
.p2 { margin-bottom:18px;}
.p3 { margin-bottom:27px;
}


/*----- txt, links, lines, titles -----*/
a {
	color:#f27f02; 
	outline:none;
}
a:hover{
	text-decoration:none;
}


h2 {
	font-size:30px;
	font-weight:normal;
	color:#a96155;
	margin-bottom:22px;
}
	h2 span {
		color:#8a8a8a;
	}
	 a { color:#242424; }
	h3 a:hover {
		text-shadow: 1px 1px 1px #888; 
	}




/*==================boxes====================*/
.main-box {
	border-top:5px solid #eaeaea;
	background:#000;
	width:900px;
}

.list1 {
	margin-left:12px;
	padding-bottom:18px;
}
.list1 li {
	background:url(../images/arrow1.gif) no-repeat 0 6px;
	padding:0 0 0 12px;
}



/*===== header =====*/
header nav {
	float:right;
}
		header nav ul li {
			float:left;
		}
			header nav ul li a {
				font-size:22px;
				color:#fff;
				height:67px;
				line-height:67px;
				text-decoration:none;
				width:101px;
				text-align:center;
				float:left;
				background:#433b8f;
				background-image: gradient(top, #383282, #484095); /* FF3.6 */
				background-image: -moz-linear-gradient(top, #383282, #484095); /* FF3.6 */
				background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #383282),color-stop(1, #484095)); /* Saf4+, Chrome */
        filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#383282', EndColorStr='#484095'); /* IE6,IE7 */
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#383282', EndColorStr='#484095')"; /* IE8 */
		}
		header nav ul li a.current, header nav ul li a:hover {
			padding-bottom:5px;
		}
		
		header nav ul li:nth-of-type(2) a {
			background:#0184cd;
			background-image: -moz-linear-gradient(top, #017bc8, #018ed3); /* FF3.6 */
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #017bc8),color-stop(1, #018ed3)); /* Saf4+, Chrome */
			filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#017bc8', EndColorStr='#018ed3'); /* IE6,IE7 */
			-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#017bc8', EndColorStr='#018ed3')"; /* IE8 */
		}
		header nav ul li:nth-of-type(3) a {
			background:#7cbc19;
			background-image: -moz-linear-gradient(top, #73b515, #86c31d); /* FF3.6 */
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #73b515),color-stop(1, #86c31d)); /* Saf4+, Chrome */
			filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#73b515', EndColorStr='#86c31d'); /* IE6,IE7 */
			-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#73b515', EndColorStr='#86c31d')"; /* IE8 */
		}
		header nav ul li:nth-of-type(4) a {
			background:#ffbc00;
			background-image: -moz-linear-gradient(top, #ffb500, #ffc300); /* FF3.6 */
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ffb500),color-stop(1, #ffc300)); /* Saf4+, Chrome */
			filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffb500', EndColorStr='#ffc300'); /* IE6,IE7 */
			-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffb500', EndColorStr='#ffc300')"; /* IE8 */
		}
		header nav ul li:nth-of-type(5) a {
			background:#f07502;
			background-image: -moz-linear-gradient(top, #ee6c01, #f27f02); /* FF3.6 */
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ee6c01),color-stop(1, #f27f02)); /* Saf4+, Chrome */
			filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#ee6c01', EndColorStr='#f27f02'); /* IE6,IE7 */
			-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ee6c01', EndColorStr='#f27f02')"; /* IE8 */
		}
		header nav ul li:nth-of-type(6) a {
			background:#d00110;
			background-image: -moz-linear-gradient(top, #d00110, #da0116); /* FF3.6 */
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #d00110),color-stop(1, #da0116)); /* Saf4+, Chrome */
			filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#d00110', EndColorStr='#da0116'); /* IE6,IE7 */
			-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#d00110', EndColorStr='#da0116')"; /* IE8 */
		}







/*===== content =====*/
	

/*--- news list styles ---*/
	.news li {
		overflow:hidden;
		position:relative;
		padding:0 0 26px 84px;
	}
	.news li:last-child {
		padding-bottom:0;
	}
	
		.news li figure {
			width:59px;
			height:59px;
			background:url(../images/date-bg1.gif) no-repeat 0 0;
			position:absolute;
			left:0;
			top:0;
			text-align:center;
			border:3px solid #ebebeb;
			border-radius:4px;
			-moz-border-radius:4px;
			-webkit-border-radius:4px;
			font-size:10px;
			color:#fff;
			text-transform:uppercase;
		}
			.news li figure strong {
				display:block;
				font-size:30px;
				line-height:1.2em;
				margin-bottom:-7px;
				padding-top:4px;
			}
		
		.news li:nth-of-type(4n+2) figure {
			background:url(../images/date-bg2.gif) no-repeat 0 0;
		}
		.news li:nth-of-type(4n+3) figure {
			background:url(../images/date-bg3.gif) no-repeat 0 0;
		}
		.news li:nth-of-type(4n+4) figure {
			background:url(../images/date-bg4.gif) no-repeat 0 0;
		}




.team-list li {
	width:100%;
	overflow:hidden;
	padding-bottom:43px;
}
.team-list li:last-child {
	padding-bottom:0;
}
	.team-list li figure {
		float:left;
		margin:0 20px 0 0;
		padding:0;
	}


/*--- loopedSlider styles ---*/
/*
 * Required 
*/
#loopedSlider .wrap { width:295px; height:295px; overflow:hidden; position:relative;}
#loopedSlider .slides { position:absolute; top:0; left:0; }
#loopedSlider .slides div { position:absolute; top:0; width:295px; display:none; }
/*
 * Optional
*/
#loopedSlider { width:295px; position:relative; clear:both; }
#loopedSlider .nav-controls {
	width:100%;
	overflow:hidden;
	padding-top:10px;
}
#loopedSlider li {
	display:inline;
}
#loopedSlider li a.previous {
	float:left;
}
#loopedSlider li a.next {
	float:right;
}




/*===== footer =====*/
footer {
	color:#fff;
}
	footer .fleft {
		padding-left:40px;
	}
	footer .fright {
		padding-right:40px;
	}


/*----- forms -----*/
#contacts-form { 
	clear:right;
	width:100%;
	overflow:hidden;
}
	#contacts-form fieldset { 
		border:none;
		float:left;
	}
		#contacts-form .field { 
			clear:both;
			padding-bottom:12px;
			margin-bottom:12px;

		}
		
		#contacts-form .question { 
			clear:both;
			padding-bottom:12px;
			margin-bottom:12px;
			font-size:1.2em;
			color:#333;

		}
			#contacts-form label { 
				float:left;
				width:100%;
							font-family: 'Droid Sans', sans-serif;
	font-size: 105%;
	text-align: justify;
	line-height: 140%;
	font-style:normal;
	color:#4c4c4c;
	margin-top: 0.5em;

			}
			#contacts-form input {
				width:205px;
				padding:1px 0 1px 3px;
				background:none;
				border:1px solid #83807d;
				opacity: 0.7;
				float:left;
				font-style: italic;
				color:#000;
				font-size:1.1em;
			}
			
			#contacts-form input.button {
				width:140px;
				height:30px;
				text-align:left;
				border: none;		
				opacity: 1;
				color:#000;
				float:left;
				border:1px solid #999;
				
				
				
			}
			
			#button {
				width:140px;
				height:30px;
				opacity: 1;
				color:#fff;
				background-color: #c8c1c1;
;
				float:left;
				padding-left:5px;
				
				}
				
				
				.button {
				width:100px;
				text-align:left;
				border:none;
				opacity: 1;
				color:#fff;
				float:left;
				margin-left:-110px;
				
				
}
			
				
			#contacts-form input:invalid {
				border-color:red;
			}
			#contacts-form textarea { 
				width:450px;
				height:215px;
				padding:1px 0 1px 3px;
				background:none;
				border:1px solid #83807d;
				opacity: 0.7;
				color:#000;
				margin-bottom:12px;
				overflow:auto;
				float:left;
				font-style: italic;
				font-size:1.1em;
				
			}
			#contacts-form div:last-child {
				padding-left:110px;
			}

/*==========================================*/
 
 
 .contacts {
	padding-bottom:20px;
}
	.contacts li {
		width:100%;
		overflow:hidden;
	}
		.contacts li strong {
			float:left;
			width:95px;
		}


.list1 {
	margin-left:12px;
	padding-bottom:18px;
}
.list1 li {
	background:url(../images/arrow1.gif) no-repeat 0 6px;
	padding:0 0 0 12px;
}