@font-face {
    font-family: 'BebasNeueRegular';
    src: url('../fonts/BebasNeue-webfont.eot');
    src: url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/BebasNeue-webfont.woff') format('woff'),
         url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('../fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'OpenSansCondensedLight';
    src: url('../fonts/OpenSans-CondLight-webfont.eot');
    src: url('../fonts/OpenSans-CondLight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-CondLight-webfont.woff') format('woff'),
         url('../fonts/OpenSans-CondLight-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-CondLight-webfont.svg#OpenSansCondensedLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansCondensedLightItalic';
    src: url('../fonts/OpenSans-CondLightItalic-webfont.eot');
    src: url('../fonts/OpenSans-CondLightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-CondLightItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-CondLightItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-CondLightItalic-webfont.svg#OpenSansCondensedLightItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansCondensedBold';
    src: url('../fonts/OpenSans-CondBold-webfont.eot');
    src: url('../fonts/OpenSans-CondBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-CondBold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-CondBold-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-CondBold-webfont.svg#OpenSansCondensedBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'RabioheadRegular';
    src: url('../fonts/rabiohead-webfont.eot');
    src: url('../fonts/rabiohead-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/rabiohead-webfont.woff') format('woff'),
         url('../fonts/rabiohead-webfont.ttf') format('truetype'),
         url('../fonts/rabiohead-webfont.svg#RabioheadRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


body{
	font:normal 16px/22px Helvetica, Arial, Verdana, sans-serif;
	font-size:12px;
	font-weight:300;
	background:url(../images/interface/BGTexture-b.jpg) #375ca9 center 0 repeat-y;
}
/*#page1{
	background:url(../images/interface/BGPage1.png) transparent 0 0 repeat;
	background-attachment:fixed;
}
#page2{
	background:url(../images/interface/BGPage2.png) transparent 0 0 repeat;
	background-attachment:fixed;
}
#page3{
	background:url(../images/interface/BGPage3.png) transparent 0 0 repeat;
	background-attachment:fixed;
}
#page4{
	background:url(../images/interface/BGPage4.png) transparent 0 0 repeat;
	background-attachment:fixed;
}*/
/*Headers*/
h1{
	
}
h2{
	font-family: 'BebasNeueRegular';
	margin-bottom:10px;
	margin-top:10px;
	font-size:30px;
	font-weight:100;
	color:#1b4692;
	color:#444;
	text-shadow: 1px 0 1px white;
}
/*GRADIENTS*/
.cssgradients h2{
	/*CSS3 - Gradient */
	/*background: -webkit-linear-gradient(#385ca9, #1b4692);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size:30px;
	padding-top:1px;*/
}
h3{
	font-family: 'BebasNeueRegular';
	margin-bottom: 10px;
	font-size: 20px;
	font-weight: 100;
	color: #444;
	/*color: #e57259;*/
}
h4{
	
}

/*Misc*/
hr{
	margin-top:15px;
	border-left:0;
	border-right:0;
	border-top:0;
	border-bottom:1px solid #ccc;
	clear:both;
}
span{
	
}
p.info{
	
}
.telDelegate{
	
}
div.clear{
	clear:both;
}
.hidden{
	display:none;
}
p b, div b{
	/*color: #e57259;*/
	font-weight:600;
}
p strong{
	/*color: #e57259;*/
	font-weight:600;
}
p a{
	color:#3479bb;
}
p a:hover{
	color:#444;
}
.alert{
	display:none;
	color:#F33;
	position:relative;
	top:-15px;
	left:0;
	margin-bottom:-15px;
}
.fb_container{
	position:absolute;
	right:14px;
	top:-20px;
	width:231px;
	height:76px;
	background:url('../images/interface/facebook-container.png') transparent 0 0 no-repeat;
}
form .wisp, form .wisper{
	position: absolute;
	top: -9000px;
}
/*Sementic*/
header{
	width:100%;
	height:92px;
	background:#f2f2f2;
	background:url(../images/interface/gradient_squares.png) #f2f2f2 0 0 repeat;
}
.boxshadow header{
	/*CSS3 Box Shadow*/
	-moz-box-shadow: 0px 3px 12px #444;
	-webkit-box-shadow: 0px 3px 12px #444;
	box-shadow: 0px 3px 12px #444;
}
	header .content{
		position:relative;
		width:940px;
		height:92px;
		margin:0 auto;
	}
	header .content .logo{
		float:left;
		width:225px;
		height:54px;
		background:url('../images/interface/Smarketinc-logo.png') transparent 0 -54px no-repeat;
		margin-top:18px;
	}
	header .content .logo:hover{
		background-position:0 0;
	}
	header .content nav ul{
		position:absolute;
		right:0;
		bottom:5px;
	}
	header .content nav ul li{
		position:relative;
		float:left;
		margin-right:20px;
	}
	header .content nav ul li a{
		font-family: 'BebasNeueRegular';
		font-size:21px;
		font-weight:100;
		color:#999;
		color:#444;
		background:#f2f2f2;
		background:transparent;
		/*letter-spacing:1px;*/
	}
	header .content nav ul li img{
		display:none;
	}
	header .content nav ul li.active a, header .content nav ul li:hover a{
		color:#1b4692;
	}
	
	/*GRADIENTS*/
	.cssgradients header .content nav ul li.active a, .cssgradients header .content nav ul li:hover a{
		/*CSS3 - Gradient */
		background: -webkit-linear-gradient(#385ca9, #1b4692);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	
	header .content nav ul li.active img, header .content nav ul li:hover img{
		display:inline;
	}
#conteneur{
	width:980px;
	height:auto;
	margin:0 auto;
}
	#contentWrap{
		position:relative;
		width:99999px;
		height:auto;
		padding:50px 0;
		/*background:url('../images/interface/BGBonhommes.png') transparent 0 0 no-repeat;*/
	}
	section{
		position:relative;
		float:left;
		width:940px;
		height:auto;
		margin-right:2000px;
		font-family: 'OpenSansCondensedLight';
		font-size:14px;
		color:#444;
		letter-spacing:1px;
		overflow:hidden;
		padding:20px;
		background:white;
		border:1px solid #CCC;
	}
	.borderradius section{
		/*CSS3 Border Radius*/
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
	}
	.rgba section{
		background:rgba(255, 255, 255, .97);
	}
	section #hybridSlideshow{
		margin-bottom:100px;
	}
	section #thumbs{
		
	}
	section #thumbs .thumb{
		cursor:pointer;
		position:relative;
		float:left;
		width:219px;
		height:auto;
		margin-right:21px;
	}
	section #thumbs .thumb a{
		color:#1b4692;
	}
	section #thumbs .thumb a:hover{
		color:#444;
	}
	section #thumbs .thumb .normal{
		margin-bottom:10px;
	}
	section #thumbs .thumb .hover{
		display:none;
		position:absolute;
		top:0;
		left:0;
	}
	section #thumbs .thumb h2{
		font-family: 'BebasNeueRegular';
		margin-bottom:10px;
		font-size:20px;
		font-weight:100;
		color:#9F9F9F;
	}
	section #thumbs .thumb p{
		font-size:14px;
		font-family: 'OpenSansCondensedLight';
		color:white;
		color:#C6C7C8;
	}
	section #thumbs .thumb:hover .hover{
		display:block;
	}
	.js section #thumbs .thumb:hover .hover{
		display:none;
	}
	section #thumbs .thumb:hover h2{
		color:#444;
	}
	section #thumbs .thumb:hover p{
		color:#444;
	}
footer{
	width:100%;
	height:247px;
	background:#f2f2f2;
	background-color:#f2f2f2;
	background:url(../images/interface/gradient_squares.png) #f2f2f2 0 0 repeat;
}
.boxshadow footer{
	/*CSS3 Box Shadow*/
	-moz-box-shadow: 0px 3px 12px black;
	-webkit-box-shadow: 0px 3px 12px black;
	box-shadow: 0px 3px 12px black;
}
footer .contentz{
	position:relative;
	width:940px;
	height:auto;
	margin:0 auto;
}
footer .contentz p.copy{
	position:absolute;
	right:0;
	font-family: 'OpenSansCondensedLight';
	font-size:14px;
	color:#444;
}
footer .contentz ul{
	width:670px;
	height:93px;
	margin:0 auto;
}
footer .contentz ul li{
	width:93px;
	height:93px;
	float:left;
	margin-right:51px;
	cursor:pointer;
}
footer .contentz ul li.services{background:url('../images/interface/iconFooterSercives.png') transparent 0 0 no-repeat;}
footer .contentz ul li.portfolio{background:url('../images/interface/iconFootePortfolio.png') transparent 0 0 no-repeat;}
footer .contentz ul li.apropos{background:url('../images/interface/iconFooteApropos.png') transparent 0 0 no-repeat;}
footer .contentz ul li.contact{background:url('../images/interface/iconFooterContact.png') transparent 0 0 no-repeat;margin-right:0;}
footer .contentz ul li:hover{
	background-position:0 -93px;
}
/*
*SECTIONS
*/
section#accueil{
	overflow:visible;
}
/*PORTFOLIO*/
section#portfolio{
	
}
section#portfolio #viewer{
	display:none;
	width:940px;
}
section#portfolio #viewer .btRetour{
	float:right;
}
section#portfolio #viewer .content{
	float:left;
	margin-right:35px;
}
section#portfolio #viewer .content ul li{
	margin-bottom:25px;
}
section#portfolio #viewer .content ul li .bordered{
	border:1px solid #CCC;
}
section#portfolio #viewer aside{
	display:none;
	float:left;
	width:235px;
	text-align:right;
}
section#portfolio #viewer aside p{
	margin:10px 0;
}
section#portfolio #viewer aside a{
	float:right;
	padding:5px;
	background:#f2f2f2;
	font-size:12px;
	margin-bottom:15px;
	clear:both;
}
	.borderradius section#portfolio aside a{
		/*CSS3 Border Radius*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
	}
section#portfolio #viewer aside a:hover{
	border-bottom:2px solid #444;
	border-right:2px solid #444;
}
section#portfolio #viewer aside ul li a{
	color:#1b4692;
	background:none;
}
section#portfolio #viewer aside ul li a:hover{
	color:#444;
}
section .listeThumbs .thumb{
	position:relative;
	cursor:pointer;
	float:left;
	margin-right:8px;
	margin-left:8px;
	margin-bottom:10px;
	width:217px;
	height:210px;
	overflow:hidden;
}
section .listeThumbs .thumb .imageContainer{
	position:relative;
	width:217px;
	height:159px;
	overflow:hidden;
}
section .listeThumbs .thumb .original{
	position:relative;
	display:inline;
}
section .listeThumbs .thumb .hoverEffect{
	position:relative;
	display:inline;
}
/*section#portfolio .listeThumbs .thumb:hover .original{
	display:none;
}
section#portfolio .listeThumbs .thumb:hover .hoverEffect{
	display:inline;
}*/
section .listeThumbs .thumb h3{
	margin: 4px 0 -7px 0;
}
section .listeThumbs .thumb img{
	zzzborder:1px solid #CCC;
}
section .filtre{
	float:left;
	width:850px;
	height:58px;
	margin-bottom:10px;
	margin-top:-5px;
}
section .filtre h4{
	float:left;
}
section .filtre li{
	cursor:pointer;
	float:left;
	margin-left:5px;
	padding:5px;
	background:#f2f2f2;
	font-size:12px;
}
section .filtre ul li ul{
	display:none;
}
section .filtre ul li:hover ul, section#portfolio .filtre ul li.active ul{
	display:block;
}
section .filtre ul li ul li{
	cursor:pointer;
	float:left;
	margin-left:2px;
	padding:0 3px;
	background:white;
	color:#444;
	font-size:11px;
}
section .filtre li:hover, section#portfolio .filtre li.active{
	background:#1b4692;
	color:white;
}
section .filtre ul li ul li:hover, section#portfolio .filtre ul li ul li.active{
	background:#999;
	color:white;
}
.borderradius section .filtre li{
	/*CSS3 Border Radius*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}


/*À PROPOS*/
section#apropos nav, section#nouvelles nav{
	float:left;
	width:120px;
	margin-right:50px;
}
section#apropos nav ul li, section#nouvelles nav ul li{
	padding:5px 10px;
	background:#CCC;
	text-align:center;
	font-family: 'BebasNeueRegular';
	margin-bottom:1px;
}
section#apropos nav ul li:hover, section#apropos nav ul li.active, section#nouvelles nav ul li:hover, section#nouvelles nav ul li.active{
	background:white;
}
section#apropos nav ul li a, section#nouvelles nav ul li a{
	display:block;
	width:100%;
	height:100%;
}
section#apropos .content, section#nouvelles .content{
	float:left;
	width:770px;
	height:auto;
}
section#apropos .content .imageContainer, section#nouvelles .content .imageContainer{
	width:770px;
	height:270px;
	background:#CCC;
}

/*CONTACT*/
section#contact aside{
	float:left;
	width:185px;
	margin-right:50px;
}
section#contact .content{
	float:left;
	width:705px;
	height:auto;
}
section#contact aside a{
	color:#114594;
}
section#contact aside a:hover{
	color:#444444;
}
section#contact .content form{
	width:753px;
	height:509px;
	background:url('../images/interface/BGFormContact.png') transparent 0 0 no-repeat;
	margin-left:-32px;
}
section#contact .content form fieldset{
	padding:70px;
}
section#contact .content form label{
	font-family: 'BebasNeueRegular';
	font-size:30px;
	font-weight:100;
	color:#444;
	margin-right:25px;
	margin-bottom:25px;
	display:block;
}
section#contact .content form input[type="text"]{
	font-family: 'OpenSansCondensedLightItalic';
	font-size:15px;
	float:left;
	background:none;
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px dashed #b4b4b4;
	height:30px;
	line-height:30px;
	width:308px;
	margin-top:-10px;
	color:#1b4692;
}
section#contact .content form textarea{
	font-family: 'OpenSansCondensedLightItalic';
	font-size:15px;
	width:308px;
	min-width:308px;
	max-width:308px;
	height:157px;
	min-height:157px;
	max-height:157px;
	margin-bottom:25px;
	color:#1b4692;
}
section#contact .content form textarea:focus, section#contact .content form input[type="text"]:focus{
	outline:none;
}
	.rgba section#contact .content form textarea{
		/*CSS3 - Rgba*/
		background:rgba(255, 255, 255, .75);
	}
	.rgba section#contact .content form textarea:focus{
		/*CSS3 - Rgba*/
		background:rgba(255, 255, 255, .25);
	}
section#contact .content form input[type="submit"]{
	float:right;
	font-family: 'BebasNeueRegular';
	font-size:25px;
	font-weight:100;
	color:#444;
	display:block;
	padding:5px 5px 1px 5px;
	border:1px solid #444;
	background:none;
}
section#contact .content form input[type="submit"]:hover{
	color:#1b4692;
}
	.boxshadow section#contact .content form input[type="submit"]:hover{
		/*CSS3 - Shadow*/
		-moz-box-shadow:inset 1px 0px 6px #646464;
		-webkit-box-shadow:inset 1px 0px 6px #646464;
		box-shadow:inset 1px 0px 6px #646464;
	}
section#contact .content form table tr td:first-child{
	text-align:right;
}

/*
*FEATURES
*/
#hybridSlideshow #canvas{
	position:relative;
	width:940px;
	height:338px;
	background:transparent;
	overflow:hidden;
}
.borderradius #hybridSlideshow #canvas{
	/*CSS3 BORDER RADIUS*/
	-moz-border-radius-topleft:20px;
	-webkit-border-top-left-radius:20px;
	border-top-left-radius:20px;
	-moz-border-radius-topright:20px;
	-webkit-border-top-right-radius:20px;
	border-top-right-radius:20px;
}
	#hybridSlideshow #canvas .content{
		position:relative;
		top:0;
		left:0;
		width:9999px;
	}
	#hybridSlideshow #canvas ul.row{
		float:left;
	}
	#hybridSlideshow #canvas .cornerLeft{
		position:absolute;
		top:0;
		left:0;
		z-index:5;
	}
	#hybridSlideshow #canvas .cornerRight{
		position:absolute;
		top:0;
		right:0;
		z-index:5;
	}
	#hybridSlideshow ul#dots{
		position:absolute;
		z-index:5;
		right:14px;
		bottom:55px;
	}
	#hybridSlideshow ul#dots li{
		width:30px;
		height:13px;
		margin-bottom:7px;
		background:url('../images/interface/hybridSlideshow/dots.png') transparent 0 -13px no-repeat;
		cursor:pointer;
	}
	#hybridSlideshow ul#dots li.active{
		background-position:0 0;
	}
#hybridSlideshow ul#hybridCategories{
	position:relative;
	margin-top:-23px;
}
#hybridSlideshow ul#hybridCategories li{
	float:left;
	width:186px;
	height:46px;
	border-left:1px solid white;
	border-right:1px solid #bcbcbc;
	background:#f2f2f2;
	line-height:46px;
	text-align:center;
	cursor:pointer;
	color:#9f9f9f;
	font-family: 'OpenSansCondensedLight';
	font-size:14px;
}
#hybridSlideshow ul#hybridCategories li.active{
	background:url('../images/interface/hybridSlideshow/BG_active.png') transparent 0 0 no-repeat;
	color:#444444;
}
#hybridSlideshow ul#hybridCategories li.first{
	border-left:none;
	width:187px;
}
.borderradius #hybridSlideshow ul#hybridCategories li.first{
	/*CSS3 BORDER RADIUS*/
	-moz-border-radius-bottomleft:20px;
	-webkit-border-bottom-left-radius:20px;
	border-bottom-left-radius:20px;
}
#hybridSlideshow ul#hybridCategories li.last{
	border-right:none;
	width:187px;
}
.borderradius #hybridSlideshow ul#hybridCategories li.last{
	/*CSS3 BORDER RADIUS*/
	-moz-border-radius-bottomright:20px;
	-webkit-border-bottom-right-radius:20px;
	border-bottom-right-radius:20px;
}

ul.horaire li{
	clear:both;
	border-bottom:1px dotted #ccc;
	height:25px;
	line-height:25px;
}
ul.horaire li span.firstChild{
	float:left;
}
ul.horaire li span{
	float:right;
}


/*
FIXES
*/
.conteneurListeThumbs{
	position: relative;
	overflow: hidden;
	height: 640px;
}
.conteneurListeThumbs .content{
	position:relative;
	top:0;
}
.conteneurListeThumbs .showMore{
	position:absolute;
	bottom:0;
	right:0;
}
.conteneurListeThumbs .showLess{
	position:absolute;
	bottom:0;
	left:0;
}

ul.clients{
	
}
ul.clients li{
	position:relative;
	float: left;
	margin-right: 8px;
	margin-left: 8px;
	margin-bottom: 10px;
	width: 217px;
	height: 90px;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	
	cursor:pointer;
}
ul.clients li .on{
	
}
ul.clients li .off{
	
}



