/*

Theme Name: Advanced Creation

Description: Advanced Creation WebSite

Version: 1.0

Author: Advanced Creation

Author URI: http://www.advanced-creation.com/


*/



/****************************************/

/************** 1. Colours **************/

/****************************************/

/*

	Button Grey  : #636363

	Orange : #f9ae3b

	Font: #333

	Font input : #5C6061

	line, border : #a5a5a5

*/

/****************************************/

/************** 2. Reset **************/

/****************************************/


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* remember to define focus styles! */

:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */

ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	vertical-align: top;
	font-weight: 500;
}

/*= GRID 
------------------------------------------*/
.pad01 { padding:0 0 22px 22px; }


/****************************************/

/************** 3. General **************/

/****************************************/

header, nav, section, footer {
	margin: 0 auto;
	width : 1024px;
}
#portfolioPost .company { width:1024px; }

#wrapHeader, #wrapNav, #wrapFooter { width : 100%; }

html, body {
	height: 100%;
}

body {
	font: 0.85em 'OpenSans_Regular', Helvetica, sans-serif;
	webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	color: #333;
	line-height: 28px;
	margin: 0;
	width: 100%;
	margin : auto;
}

strong {
	color: #F9AE3B;
}

.shadowSlider {
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
}

.shadowTitre {
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
}

.shadowTexte {
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.05);
}

.shadowBarre {
	-webkit-box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);
	-moz-box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);
	box-shadow: inset 0 0px 1px rgba(0, 0, 0, 0.1), 0 1px 0 rgba(255, 255, 255, 0.15);
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

.effetBoite {
	border: 1px solid #e3e3e3;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

.clear {
	clear: both;
}

.fr { float:right; }
.fl { float:left; }

a { color:#F9AE3B; text-decoration:none; }

/****************************************/

/************** 4. Les boutons **********/

/****************************************/

.button {
	color: #fff;
	display: inline-block;
	position:relative;
	background-color: #636363;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius : 5px;
	font-size: 19px;
	line-height: 19px;
	text-align: center;
	text-decoration: none;
	padding: 9px 16px;
	cursor: pointer;
	text-decoration:none;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	border-color: #0044cc #0044cc #002a80;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	border:none;
}
.button.small { padding:5px 10px; font-size:15px; line-height:15px; }

.button.ar {  padding:5px 25px 5px 10px; }
.button.al {  padding:5px 10px 5px 25px; }

.arrow { width:15px; height:15px; display:block; background-repeat:no-repeat; background-image:url(images/arrowbt.png); position:absolute; }
.button.small > .arrow { top:5px; }
.button.ar > .arrow { right:5px; }

.arrow.ab { background-position:0 0; }
.arrow.at { background-position:0 -15px; }

.button.current, .button:hover, .button:active, .button:focus {
	background: #f9ae3b; color: #fff; text-decoration:none;
}
h1 > .button.small { top:10px; }

/** Share buttons	 **/
#shareButtons { margin-bottom: 15px; }
#shareButtons:after { content:''; display:block; clear:both; }
#shareButtons .buttons .button { display: inline-block; background-color: transparent; box-shadow: none; border-radius: 0; border-color: transparent; padding: 0; margin: 0 10px 0 0; float: left; }
#portfolioPost #links #shareButtons, #portfolioPost #links #shareButtons .buttons, #portfolioPost #links #shareButtons .buttons .button { width:auto; }
#shareButtons .buttons .googleplus, #portfolioPost #links #shareButtons .buttons button { margin: 0 10px 0 0; }
#shareButtons .buttons .googleplus, #portfolioPost #links #shareButtons .buttons .googleplus { width: 57px; }
#portfolioPost #links #shareButtons { margin-top: 10px; }
#container:after { clear:both; content:''; display:block; }

/****************************************/

/************** 5. Les polices **********/

/****************************************/

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



/****************************************/
/************** 6. Le header ************/
/****************************************/

/* Header */

#wrapHeader {
	background: url('images/bg-header.jpg') repeat-x;
}

header {
	height: 147px;
	margin: 0 auto;
}

#logo {
	float : left;
	padding: 24px 0 0;
}

.quoteHeader {
	float : right;
	padding : 45px 30px 0 0;
}

.quoteHeader p {
	font-size: 15px;
	line-height: 18px;
	padding: 2px 0 0;
	text-align: center;
}

/* Nav */

#wrapNav {
	background : #f9ae3b;
}

nav { height: 31px; }

nav ul {
	padding: 4px 0;
}

nav ul li {
	float: left;
}

nav ul li a { padding: 4px 20px; color: #FFF; text-transform: uppercase; display: block; font-size: 15px; line-height: 15px; letter-spacing: 1px; text-decoration: none; }

nav ul li + li {
	border-left: 2px solid #FFF;
	-webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1), -1px 0 0 rgba(0, 0, 0, 0.1);
	-moz-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1), -1px 0 0 rgba(0, 0, 0, 0.1);
	box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1), -1px 0 0 rgba(0, 0, 0, 0.1);
	-pie-box-shadow: none;
}

nav ul li.current > a, nav ul li > a:hover, nav ul li > a:focus, nav ul li > a:active, nav ul li.current-menu-item > a, nav ul li.current-post-ancestor > a,nav ul li.current-page-ancestor > a { color: #333; text-decoration:none; }

nav ul li.home a {
	background: url('images/home.png') no-repeat;
	background-position: 0 0;
	text-indent : -3000px;
	width: 17px;
	height: 17px;
	margin: 3px 20px 0 0;
	padding: 0;
	
}


nav ul li.home > a:hover , nav ul li.home.current-menu-item > a {
	background-position: 0 -17px;
}

#wrap_content_top {
	background: url('images/bgContentTop.jpg') repeat-x;
	width: 100%;
	height: 50px;
}

/****************************************/

/************** 7. Le Footer ************/

/****************************************/

/* Footer */

#wrapFooter {
	position : absolute;
	bottom : 0;
	background : #f9ae3b;
}

footer {
	width: 1024px;
}

footer p {
	font-size: 14px;
	color : #fff;
	padding : 10px 10px;
	line-height: 20px;
	letter-spacing: 2.75px;
	text-transform : uppercase;
}

footer span.companyName { color : #000; text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.45); border-right:1px solid #000; padding:0 25px;}
footer span.address, footer span.phone, footer span.professional { color:#FFF;  padding:0 25px; }   

/* La banderolle foncée */

#wrapContentBottom {
	width: 100%;
	height: 50px;
	background: url('images/bgContentBottom.jpg') repeat-x;
}

/****************************************/

/************** 7. Le Contenu ***********/

/****************************************/

body {
	position : relative;
	height: 100%;
}

#wrapContent {
	position: relative;
	min-height: 100%;
}

section { padding-bottom: 110px; position:relative; }
section + section { margin-top:-110px; }

/* Slider */

.slideImage {
	/*
	margin : 30px 40px 10px 0;
	float: left;
	*/
}

.slideTexte {
	/*float: left;*/
	height:100%;
	width:47%;
	left:50%;
	top:0;
	position:absolute;
}

.slideTexte h1 {
	font-size: 50px;
	line-height: 60px;
	color: #333;
	margin: 30px 0 5px 0;
	padding: 0 0 3px 0;
}

.slideTexte h2 {
	font-size: 25px;
	color: #F9AE3B;
	line-height: 30px;
	margin: 0 0 20px 0;
	padding: 0 0 3px 0;
}

.slideTexte p {
	font-size: 20px;
	line-height: 24px;
	color: #333333;
	margin: 0 0 10px 0;
}

.slideTexte .button {
	display: inline-block;
	margin-top: 15px;
}

.flexslider {
	border: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	margin-bottom: 40px;
}

.slider ul li {
	display : block;
}

/* La navigation du slider */

#mainContent .flex-control-nav {
	opacity: 0;
}

#mainContent .flex-control-nav:hover {
	opacity: 1;
}

#mainContent .flex-control-nav li a {
	background: #fff;
	border: 2px solid #f9ae3b;
}

#mainContent .flex-control-nav li a:hover {
	background: #fff;
	opacity: 0.5;
}

#mainContent .flex-control-nav li a.flex-active {
	background: #f9ae3b;
	box-shadow: none;
	cursor: pointer;
}

#mainContent:hover .flex-control-nav {
	opacity: 1;
}

/****************************************/

/************** 7. Le Portfolio *********/

/****************************************/
/* Tous les thunmbails sont caches par defaut saut le premier */
.featuredThumbnail a {
	display: none;
	position: relative;
	margin-bottom: 10px;
}
.featuredThumbnail a:first-child { display:block; }



#portfolio li:hover .loupe, #portfolio li:hover .loupeBlack, .featuredThumbnail a:hover > .loupe, .featuredThumbnail a:hover >.loupeBlack {
	display: block;
}

.featuredThumbnail a img { display: block;	max-width:100%; height:auto; }

.featuredThumbnail a .loupe, .featuredThumbnail a .loupeBlack {
	display: none;
	position: absolute;
	margin-top: -25px;
	margin-left: -25px;
	top: 50%;
	left: 50%;
	width: 59px;
	height: 59px;
	z-index: 1;
}

.featuredThumbnail a .loupe {
	background:url(images/loupeWhite.png) no-repeat;
}

.featuredThumbnail a .loupeBlack {
	background:url(images/loupe.png) no-repeat;
}

.featuredThumbnail img {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	height: 129px;
}

#portfolio ul {
	position: relative;	
}

#portfolio ul #container li {
	float: left;
	width: 230px;
	height:253px;
}

#container .grid-sizer {
	width: 20%;	
}

.isotope-pad01 { padding: 18px 13px; }
.isotope-pad02 { padding: 5px 10px; }

#filters > li { position: relative; margin: 8px 0; }
#portfolio #filters a { color: #000000; padding-left: 30px; }
#portfolio #filters a:hover, #portfolio #filters .selected { color: #F9AE3B; text-decoration:none; }
#portfolio #filters a:before { content: ""; display: inline-block; width: 16px; height: 16px; box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8); margin-right: 10px; position: absolute; left: 0; bottombottom: 1px; top: 2px; }
#portfolio #filters .selected:before { content: "\2713"; font-size: 20px; font-weight: 700; line-height: 15px; }
section#portfolio { width: 100%; }

.description {
	height: 90px;
	background: url("images/bgPortfolio.png") repeat-x;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	width:100%;
	overflow:hidden;
	background-size:contain;
}

.description h2 {
	text-transform: uppercase;
	color: #4D4D4D;
	font-size: 14px;
	line-height: 14px;
	letter-spacing: 0.5px;
	margin: 0 0 4px 0;
	padding: 0;
}

.description p {
	color: #f6f6f6;
	font-size: 12px;
	line-height: 15px;
}

/* Le filtre aside dans la page portfolio */

#portfolio aside {
	float:left;
	box-shadow: 3px 3px 15px #ccc;
	-webkit-box-shadow: 3px 3px 15px #ccc;
	-moz-box-shadow: 3px 3px 15px #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:18px 0 20px 0;
	width: 15%;
	min-width:180px;
}

#portfolio aside h2 {
	font-size: 25px;
	padding: 8px 0;
	color: #F9AE3B;	
}

/* Portfolio container effect when reducing the window */
#portfolio #container li { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }

/* Les post de portfolio */

/* Partie texte */

#portfolioPost h1 {
	color: #5C6061;
	font-size: 30px;
	line-height: 30px;
	margin: 0 0 10px 0;
	padding: 0 0 0 1.5%;
}

#portfolioPost .company { position:absolute; z-index:5; background:url(images/bg-80w.png) repeat; padding:10px 0; }
#portfolioPost .company p { color:#636363; }

#portfolioPost p, #portfolioPost #services ul li {
	color: #333333;
	font-size: 14px;
	line-height: 16px;
	margin-bottom: 5px;
}

#portfolioPost p {
	width: 85%;
	text-align: justify;	
}

#portfolioPost #services ul {
	list-style: inside;
}

#portfolioPost #services  ul li {
	display: list-item;
	list-style:none;
}

#portfolioPost h2 {
	color: #000;
	font-size: 18px;
	line-height: 18px;
	margin: 0;
	padding: 0 0 10px 0;
}

#portfolioPost #about, #portfolioPost #services, #portfolioPost #links {
	float: left;
	width: 30%;
	padding: 0 1.5%;
}
#portfolioPost #about strong { font-weight:bold; }

#portfolioPost #links {
	float: left;
	padding: 5px 15px;
}

#portfolioPost #links div {
	width: 90%;
	text-align: left;
}

#portfolioPost #quotePortfolio {
	width: 200px;	
}

#portfolioPost #links .url {
	font-size: 14px;
	line-height: 14px;
	font-weight: bold;
	margin-bottom: 10px;
}

#portfolioPost .url a {
	color: #636363;
	text-decoration: none;
	letter-spacing:1px;
}

#portfolioPost .url a:hover {
	color: #000;
}


/* Partie slide */

#portfolioPost #slider.flexslider { margin:10px 0 5px; }

#portfolioPost #slider ul li img {
	display: block;
}

#portfolioPost #carousel ul li { margin: 5px; max-width:250px; }


#portfolioPost #carousel ul li:first-child {
	margin-left: 0;	
}

#portfolioPost #carousel ul li img { display: block; opacity: 1; cursor: pointer; }


/* On force l'affichage du premier element du slideshow */
#portfolioPost #slider ul li:first-child { display: block; opacity:1; }

/* Fleches */
#portfolioPost #slider .flex-direction-nav .flex-prev, #portfolioPost #carousel .flex-direction-nav .flex-prev { background-image: url(images/left-arrow.png);  }
#portfolioPost #slider .flex-direction-nav .flex-next, #portfolioPost #carousel .flex-direction-nav .flex-next { background-image: url(images/right-arrow.png); }
#portfolioPost #slider .flex-direction-nav a, #portfolioPost #carousel .flex-direction-nav a { display: block; position: absolute; cursor: pointer; opacity: 0.75; background-repeat:no-repeat; background-position:0 0; background-size:cover; top: 50%; }
#portfolioPost #slider .flex-direction-nav a {  width: 35px; height: 89px; margin-top: -45px;  }
#portfolioPost #carousel .flex-direction-nav a { width: 23px; height: 58px; margin-top: -29px; }
/* Hover */
#portfolioPost #slider .flex-direction-nav a:hover, #portfolioPost #carousel .flex-direction-nav a:hover  { background-position:0 100%; opacity: 1; }
/** Positionnement des fleches */
#portfolioPost #slider .flex-direction-nav .flex-next, #portfolioPost #carousel .flex-direction-nav .flex-next  { right: 5px; }
#portfolioPost #slider .flex-direction-nav .flex-prev, #portfolioPost #carousel .flex-direction-nav .flex-prev { left: 5px; }


#portfolioPost #carousel.flex-direction-nav li {
	display: inherit;
	width: inherit;
	height: inherit;
	float: inherit;
	padding: 0;
}

#portfolioPost #carousel .flex-direction-nav .flex-disabled, #portfolioPost #slider .flex-direction-nav .flex-disabled { opacity: 0 !important; }

/*=HOMEPAGE 
----------------------------*/
#home_services > h2 { font-size:25px; line-height:25px; font-weight:bold; text-align:center; text-transform:uppercase; margin:25px 0 25px; }

/****************************************/

/************** 8. Les services *********/

/****************************************/

.sidebar_services {
	float: left;
	width: 25%;
	box-shadow: 3px 3px 15px #ccc;
	-webkit-box-shadow: 3px 3px 15px #ccc;
	-moz-box-shadow: 3px 3px 15px #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin-bottom: 20px;
}
.wp_services_sidebar  { padding: 0px 0 22px 22px; }

.sidebar_services ul {
	display: block;
	width: 220px;
	padding-bottom: 15px;
	border-bottom: 1px #ccc solid;	
}

.sidebar_services ul a {
	color: #000;
	text-decoration: none;
}

.sidebar_services ul a:hover {
	color: #F9AE3B;
}

.sidebar_services ul li {
	font-size: 14px;
	line-height: 24px;	
}

.sidebar_services h2 {
	font-size: 24px;
	line-height: 60px;	
}

#services form input, #services form textarea {
	width: 192px;
	margin: 0;	
}

#services form textarea {
	height: 50px;
	max-width: 192px;
}

#services form {
	font-size: 15px;
	line-height: 24px;	
}

#services form p {
	margin-bottom: 9px;	
}

#services form #send {
	width: inherit;
	height: 40px;
	padding: 9px 26px;	
	border: none;
}

#services #content {
	float: left;
	width: 75%;
	
}
#services .wp_content { padding: 0 0 10px 60px; }

#services #content h1 {
	font-size: 50px;
	line-height: 50px;
	padding: 8px 0;	
}

#services #content h2 {
	font-size: 25px;
	padding: 8px 0;
	color: #F9AE3B;
}

#services #content #servicesContent p {
	font-size: 20px;
	line-height: 24px;
	text-align: justify;
	padding: 22px 0;
}

#services #content #servicesContent {
	padding-bottom: 20px;
	border-bottom: 1px #ccc solid;	
	margin-bottom:15px; 
}

#services #content #servicesContent a.button {
	position: relative;
	padding-left: 40px;
}

#services #content #servicesContent a #bonhomme {
	width: 20px;
	height: 23px;
	position: absolute;
	left: 10px;
	top:6px;
	background: url(images/bonhomme.png) no-repeat;
}

/*= SERVICES ALL
-------------------------------------------------------*/
ul.all_services p{ font-size: 12px; line-height: 14px; }
ul.all_services h3 {	font-size: 15px; line-height: 19px;	 }
ul.all_services figure { width: 30%;  position: relative; float: left; display: block;  background-position:0 0; background-repeat:no-repeat; background-size:cover; }
ul.all_services figure:hover { background-position:0  100%; }
ul.all_services .texteService { float: left;  width:70%; }
ul.all_services .texteService .wp_texteService  { padding: 0 0 0 13px;	 }
ul.all_services li { display: block; width: 33%; height: 115px; float: left; }
ul.all_services li .wp_li_services { padding: 0 11px 20px 11px; }
ul.all_services a { cursor: pointer; color: #000; text-decoration: none; display: block; }
	
	/*=SERVICE ON SERVICE PAGE
	--------------------------------------------*/
	#services ul.all_services figure { height: 63px; }
	
	/*=SERVICE ON  HOMEPAGE
	--------------------------------------------*/
	#home_services ul.all_services figure { width:80px; height:80px; }


/* Les pages des services, seul le contenu de droite change */

#services aside ul .active a{
	color: #F9AE3B;
}

#services #content.postPage figure {
	width: 65px;
	height: 65px;
	position: relative;
	float: left;
	margin: 10px 20px 0 0;
	background-size:cover;
	background-position:0 0;
}
#services #content.postPage figure:hover { background-position:0 100%; }


#services #content.postPage #servicesContent h2 {
	padding-bottom: 15px;	
}

#services #content.postPage #servicesContent p {
	/*width: 415px; 
	float: right;*/
	font-size: 16px;
	line-height: 18px;
	padding: 15px 0;
}

#services #content.postPage #pageImage {
	float: right;
	margin: 30px 0 30px 15px;
}

#services #content.postPage h3 {
	font-size: 24px;
	line-height: 60px;	
	text-align:center;
}

#services #content.postPage .slides {
	padding: 0;	
}

#services #content.postPage .slides li {
	padding: 0;
	margin: 0 5px 0 0;
	width: 215px;
	height: 130px;	
}

#services #content.postPage .flexslider {
	height: 130px;
	background: #fff;
	border: none;
	position: relative;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	/*
	box-shadow: 3px 3px 15px #ccc;
	-webkit-box-shadow: 3px 3px 15px #ccc;
	-moz-box-shadow: 3px 3px 15px #ccc;
	-o-box-shadow: 3px 3px 15px #ccc; 
	*/
	zoom: 1;	
}

#services #content.postPage .slides li img {
	width: 215px;
	height: 130px;
	display: block;
}

#services #content.postPage .flexslider .flex-direction-nav a {
	width: 45px;
	height: 45px;
	display: block;
	background: url(images/bgDirectionNav.png) no-repeat 0 0;
	position: absolute;
	top: 50%;
	cursor: pointer;
}
#services .flex-direction-nav .flex-prev { left:0; }
#services .flex-direction-nav .flex-next { right:0; }


#services #content.postPage .flexslider .flex-direction-nav .flex-next {
	background-position: -53px 0;
}

#services #content.postPage .flexslider .flex-direction-nav li {
	display: inherit;
	width: inherit;
	height: inherit;
	float: inherit;
	padding: 0;
}

#services #content.postPage .flexslider .flex-direction-nav .flex-disabled {
	opacity: 0 !important;	
}

/****************************************/

/************** 9. Contact   ************/

/****************************************/
#contact { height: 600px; }

#contact #contentForm {
	width: 650px;
	margin-top: 10px;
	float: left;
	padding-left: 190px;
	border-right: 1px solid #CCCCCC;
}

#contact #contentForm h1 {
	font-size: 50px;
	line-height: 50px;
	padding: 8px 0 0;	
}

#contact #contentForm h2 {
	font-size: 25px;
	padding: 0 0 27px 0;
	color: #F9AE3B;
}

#contact #contentForm form input {
	height: 21px;	
}

#contact #contentForm form input, #contact #contentForm form textarea {
	width: 240px;
	margin: 0;
	padding: 0;
}

#contact #contentForm form p {
	width: 400px;
	text-align: left;
	position: relative;	
	padding: 0 50px 0 0;
	font-size: 19px;
	line-height: 27px;
	margin: 0 0 5px 0;
}

#contact #contentForm form span {
	position: absolute;
	left: 200px;
}

#contact #contentForm form textarea {
	display: block;
	width: 242px;
	height: 100px;
	max-width: 242px;
	margin-top: 5px;
}

#contact #contentForm form #send {
	width: inherit;
	height: 40px;
	padding: 9px 26px;	
	border: none;
	position: absolute;
	top: 35px;
	width:100px;
}

/* Partie de droite */

#contact #findUs {
	width: 293px;
	margin-top: 10px;
	float: left;
	padding-left: 30px;
}

#contact #findUs h2, #contact #findUs h3 {
	font-size: 21px;
	line-height: 45px;
	margin: 20px 0 15px 0;
	border-bottom: 1px #ccc solid;
	font-weight:bold;
}

#contact #findUs p {
	font-size: 16px;
	line-height: 20px;	
	margin-bottom: 	13px;
}

#contact #findUs iframe {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;
	
}

/****************************************/

/************** 10. Plugin   ************/

/****************************************/

#plugin {
	padding: 0 0 110px 100px;
}

#plugin h1 {
	font-size: 50px;
	line-height: 50px;
	padding: 8px 0;	
}

#plugin h2 { font-size: 25px; padding: 8px 0 15px 0; color: #F9AE3B; }

/* La partie aside */

#plugin aside {
	width: 170px;
	float: right;	
}

#plugin aside a, #plugin aside div {
	margin-bottom: 5px;
	color: #FFF;
	font-size: 19px;
	line-height: 19px;
	text-align: center;
	display: block;
	text-decoration: none;
}

#plugin aside #free {
	background: #39B34A;
}

#plugin aside #price {
	background: #f9ae3b;
}

#plugin aside #compatibility {
	margin-bottom: 10px;
	text-align: center;
	color: #636363;
	padding: 15px 8px 120px 8px;
	background: url(images/compatibility.png) no-repeat 40px 300px;
	background-color: #ececec;
	cursor: inherit;
}

#plugin aside div p {
	border-bottom: 1px solid #636363;
	padding: 15px 0;
	margin-bottom: 10px;
}

#plugin aside a span, #plugin aside div p {
	font-size: 14px;	
}

/* La navigation secondaire */

#plugin > ul { float: left; border-bottom: 1px solid #d1d1d1; width: 700px; margin:0; }

#plugin > ul li {
	float: left;
	border: 1px solid #d1d1d1;
	margin-bottom: -1px;
	font-size: 20px;
	line-height: 24px;
	color: #4D4D4D;
	font-weight: bold;
}

#plugin > ul li + li {
	margin-left: 7px;
}

#plugin > ul li a {
	display: block;
	padding: 10px 25px;
	font-size: 20px;
	line-height: 24px;
	font-family: AvantGarde, Helvetica, sans-serif;
	color: #4D4D4D;
	text-decoration: none;
	font-weight: bold;
}

/*  Le contenu de chaque sous page */

#plugin #content {
	width: 750px;
	float: left;
	padding: 20px 0 0 20px;
	margin-bottom: 30px;
	border-left: 1px solid #d1d1d1;	
}

#plugin #content h3 {
	font-size: 20px;
	line-height: 24px;
	color: #F9AE3B;
	font-weight: bold;
	margin-top: 20px;
}

#plugin #content a {
	color: #F9AE3B;
	text-decoration: none;	
}

#plugin #content p, #plugin #content ul li {
	font-size: 18px;
	line-height: 22px;
}

#plugin #content p {
	padding: 5px 0 0 0;
	text-align: justify;
}

#plugin #content ul {
	list-style: disc inside;	
}

#plugin #content img {
	display: block;
	width: 600px;
}
#plugin #content img.ajax-loader{ width:inherit; }

#plugin ul .active {
	background: #e4e4e4;	
}

/* Le formulaire de la sous page support */

#content #contentForm {
	padding: 30px 0 0 0;	
}

#contentForm input[type="text"], #contentForm input[type="email"],#contentForm textarea { margin-bottom:15px; }

/****************************************/

/************** 11. Stripe  *************/

/****************************************/

#purchase h1 {
	font-size: 40px;
	line-height: 50px;
	padding: 8px 0;
}

/* Le premier formulaire de contact */

#purchase form {
	padding: 30px 0 50px 0;
}

#purchase #issueForm p {
	display: inline-block;
	padding-left: 100px;
	font-size: 19px;
	line-height: 27px;
	background: #ffcccc;
	border:1px solid #ff6666;
	text-align: center;
	color: #333;
	margin: 10px 6px 3px 6px;
	padding: 3px 100px 3px 100px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

#purchase form input {
	height: 27px;	
	width: 280px;
	margin: 0;
	padding: 0;
	position: absolute;
	left: 320px;
	top: 0;
}

#purchase form p {
	width: 600px;
	text-align: left;
	position: relative;	
	padding: 0 50px 0 0;
	font-size: 19px;
	line-height: 27px;
	margin: 0 0 5px 0;
	min-height:21px;
}

#purchase form #send {
	width: inherit;
	height: 40px;
	padding: 9px 26px;	
	border: none;
	top: 35px;
	left: 0;
	width:120px;
	position:relative;
}

/* La page de payment */

#stripe h1 {
	font-size: 40px;
	line-height: 50px;
	padding: 8px 0;
}

#stripe h2 {
	font-size: 25px;
	padding: 8px 0 27px 0;
	color: #F9AE3B;
}

#stripe p {
	font-size: 18px;
	line-height: 22px;	
}

#stripe #summary {
	padding-bottom: 40px;	
}

#stripe #summary #box {
	box-shadow: 3px 3px 15px #ccc;
	-webkit-box-shadow: 3px 3px 15px #ccc;
	-moz-box-shadow: 3px 3px 15px #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 22px;
	width: 400px;
	margin-bottom: 20px;	
}

#stripe #price {
	float: right;
	font-size: 19px;
	line-height: 19px;
	text-align: center;
	color: #fff;
	padding: 10px;
	display: block;	
	background: #f9ae3b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

#stripe #card {
	padding: 30px 0 0 0;	
}

#stripe #cancel {
	margin: 30px 0 10px 0;	
}

/* La page recap */

#recap h1 {
	font-size: 40px;
	line-height: 50px;
	padding: 8px 0;
}

#recap h2 {
	font-size: 25px;
	padding: 8px 0 27px 0;
	color: #F9AE3B;
}

#recap p {
	font-size: 18px;
	line-height: 22px;	
}

#recap #summary {
	padding-bottom: 40px;	
}

#recap #summary #box {
	box-shadow: 3px 3px 15px #ccc;
	-webkit-box-shadow: 3px 3px 15px #ccc;
	-moz-box-shadow: 3px 3px 15px #ccc;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 22px;
	width: 400px;
	margin-bottom: 20px;	
}

/****************************************/
/********** 12. Design company  *********/
/****************************************/
#design-company h1 { font-size: 50px; line-height: 50px; padding: 8px 0; }
#design-company h2 { color: #F9AE3B; font-size: 25px; line-height:28px; padding: 15px 0; }
#design-company #content { font-size: 16px; line-height: 18px; padding: 15px 0; }
#design-company #content ul { list-style: disc inside none; }
#design-company #content li { line-height: 22px; }
/****************************************/
/**********    13. PSD Page     *********/
/****************************************/
#psd > h1 { font-size: 50px; line-height: 50px; padding: 8px 0; }
#psd > #content > h2 { color: #F9AE3B; font-size: 25px; line-height: 28px; padding: 15px 0; }
#psd > #content ul { list-style: disc inside none; margin-bottom:20px; }
#psd .quote-type > li { list-style: none; margin-bottom: 10px; margin-left:15px; }
/****************************************/
/**********   13. Quote Form    *********/
/****************************************/
#quote-form > h1 { font-size: 50px; line-height: 50px; padding: 8px 0; }
#quote-form #content h2 { color: #F9AE3B; font-size: 25px; line-height:28px; padding: 15px 0; }
#quote-form .slider-container, #quote-form  .js-container, #quote-form .responsive-container { padding-bottom: 10px; }
#quote-form .slider-container:after, #quote-form  .js-container:after, #quote-form .responsive-container:after, #quote-form .quote-result:after{ display:block; clear:both; content: ''; }
#quote-form .slider-container > p, #quote-form .js-container > p, #quote-form .responsive-container > p { float: left; margin-right: 20px; }
#quote-form .slider-container + p { display:none; }
#quote-form #slider { float:left; width: 200px; margin-top: 5px; }
#quote-form #slider .progress-bar { transition:none; background-color: #F9AE3B; }
#quote-form #slider-value {  line-height: 24px; font-size:24px; margin-left: 15px; color:#F9AE3B; font-weight:700; margin-top:-6px; border:none; margin-bottom:0; padding:0; width:50px; }
#quote-form .js-container > #js_type { float: left; }
#quote-form .responsive-container > #responsive { float: left; }
#quote-form .quote-result > button { display:block; float:left; }
#quote-form .quote-result > #quote { float:left; margin-top:4px; margin-left: 10px; }
#quote-form .quote-result { padding-bottom: 20px; }
#quote-form p {font-weight: 700; }
#quote-form .info { font-style:italic; font-size:13px; line-height:15px; letter-spacing:0.02em; clear:left; font-weight:400; }
#quote-form input[type="text"], #quote-form input[type="email"], #quote-form textarea { border: 2px solid #636363; border-radius: 3px; box-shadow: none;  margin-bottom: 15px; padding: 5px 10px; width: 400px; }
#quote > p > span { color: #F9AE3B; }
#quote > p > span > input[type="text"] { background-color: rgba(0, 0, 0, 0); border: medium none; width:100px; }