/*
Theme Name: Amexio
Author: The NetMedia Group
Description: Amexio WP Theme
*/

@import'themestyle.css';

/* Text format */
.txtItalic {
	font-style: italic;
}
.txtBold {
	font-weight: bold;
}

/* Display format */
/* Link definition. */
a:link, a:visited {
	color: #1a3f6d;
	cursor: pointer;
	text-decoration: none;
}

a:link:hover, a:visited:hover {
	color: #ea690b;
	text-decoration: none;
}

a.external-link-new-window, a.mail {
	font-weight: bold;
}

/* List with amexio bullet. */
.amexioList li {
	list-style-type: none;
	background: url(./images/list-style.png) no-repeat;
}

.arrowList li {
	background: url("./images/arrow1.png") no-repeat scroll left 8px rgba(0, 0, 0, 0);
	list-style-type: none;
	min-width: 167px;
	padding-left: 15px;
}

.arrowList li a {
	font-size: 15px;
	line-height: 24px;
}

/* List for logos. */
ul.logoList {
    float: left;
	margin-bottom: 15px;
}

ul.logoList li {
    float: left;
    list-style-type: none;
    margin-right: 5px;
}

ul.logoList li img {
    max-width: 100%;
    vertical-align: middle;
}

/* List in post. */
.post ul {
	margin-left: 20px;
}
.post ul li {
	color: #777777;
	line-height: 25px;
	list-style-position: inside;
	list-style-type: disc;
	margin-right: 20px;
}

/* Configuration for post with image on left side and text on right site. Used to get something on the left with image and text on the right site. And paragraph never comes under the image. */
/* Like the sidebar with post. Be careful with the maximum size on wrapper, do not exceed it. */
/* Left part with images. */
.textImg .images {
	float: left;
	width: 200px;
}

.textImg.landscape .images {
	width: 320px;
}

/* Left part with text. */
.textImg .text {
	float: right;
	width: 725px;
}

.textImg.landscape .text {
	width: 620px;
}

/* Banner format */
#banner {
	background: no-repeat scroll 0 0 / cover rgba(0, 0, 0, 0);
	background-position: left top;
	clear: both;
	padding-top: 48px;
	width: 100%;
}

#banner a, #banner a:visited {
	color: #fff;
}

/* Override link in slide show in banner. Link color should not be #fff */
#banner .slides .slide a, #banner .slides .slide a:visited {
	color: #1a3f6d;
}

#banner .slides .slide a:hover {
	color: #ea690b;
}

#banner.medium_banner {
	background-image: url("./images/default-banner.jpg");
	border-color: #ec660d;
	border-style: solid;
	border-width: 2px 0;
	height: 175px;
	padding-top: 40px;
}

#banner.large_banner {
	background-image: url("./images/welcome-banner.jpg");
	height: 355px;
}

/* Text formatting in banner. */
/* Default text formatting under banner. */
#banner h1 {
	font-size: 40px;
}

#banner h2 {
	font-size: 31px;
	font-weight: 400;
}

/* Sub element under baners */
#banner .wrapper {
	position: relative;
	height: 100%;
}

/* Push list to right side */
#banner .rightList {
	right: 15px;
	position: absolute;
	top: 10px;
}

/* Text formatting in medium banner. */
/* Default text formatting under banner. */
.medium_banner * {
	color: #fff;
	font-family: Open sans,sans-serif;
	text-shadow: 1px 2px 2px #000;
}

/* Text formatting in post. */
.post h4 {
	padding-top: 14px;
}

/* Content */
#content {
	/* padding-bottom: 72px; */
	padding-top: 54px;
}

body.home #content {
    padding-top: 82px;
}

/* Text formatting for slidebar linked to post. */
#sidebar.postsSidebar {
	float: left;
	width: 250px;
}

.postsSidebar ul {
	margin-bottom: 20px;
}

/* Link formatting in the sidebar linked to post. */
.postsSidebar a {
	border-bottom: 1px solid #999999;
	display: block;
	font-size: 14px;
	font-weight: bold;
	padding: 15px 0;
	text-transform: uppercase;
}

/* Definition for link on the current selection or pointer over the link. */
.postsSidebar li.current_page_item a {
	color: #ea690b;
}

/* Formatting for testimonial. */
#testimonials {
	clear: both;
	margin-bottom: 96px;
	padding-top: 25px;
}

#testimonials p {
    color: #777777;
    font-size: 14px;
    line-height: 25px;
    margin-bottom: 15px;
}

#testimonials .carousal {
	position: relative;
	padding-bottom: 50px;
}

#testimonials .carousal .nav {
	background: left top no-repeat;
	display: block;
	height: 36px;
	margin-top: -13px;
	position: absolute;
	top: 50%;
	width: 18px;
}

#testimonials .carousal .next {
	background-image: url("./images/next.jpg");
	right: 5px;
}

#testimonials .carousal .previous {
	background-image: url("./images/prev.jpg");
	left: 5px;
}

#testimonials .carousal ul {
    padding: 0 50px;
}

#testimonials .carousal ul li {
    float: left;
	padding: 0 60px 10px 40px;
    width: 50%;
}

#testimonials .carousal ul li figure {
	border: 2px #1a3f6d solid;
	border-radius: 3px;
	box-shadow: 0 0 8px rgba( 1, 1, 1, 0.5);
	float: left;
	margin-right: 15px;
	margin-bottom: 8px;
	position: relative;
}

#testimonials .carousal ul li h5 {
    color: #26376d;
	font-size: 16px;
	margin-bottom: 10px;
}

#testimonials .carousal ul li h6 {
    /* color: #777777; */
	color: #26376d;
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	margin-bottom: 10px;
}

#testimonials .carousal ul li p {
	font-size: 12px;
	line-height: 18px;
}


/* Formatting in pageContent. */
/* Set #content because there is a definition in the main theme file. */
#content.pageContent {
	background: none;
	margin-bottom: 15px;
	padding: 0;
	padding-top: 30px;
}

/* h2 def in pageContent. */
.pageContent h2 {
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 46px;
	line-height: 45px;
	margin-bottom: 50px;
}

#pageTitle {
	color: #1a3f6d;
	font-size: 48px;
	font-weight: bold;
	margin-bottom: 32px;
	text-align: center;
}


/* Formatting in main for page content. */
#main.mainShadow {
	background: url(./images/clients-main-bg.jpg) no-repeat left top;
	float: right;
	min-height: 420px;
	padding-left: 70px;
	width: 675px;
}

.pageContent #main h2 {
	clear: both;
	color: #ea690b;
	font-size: 22px;
	margin-bottom: 30px;
	text-transform: uppercase;
}

.pageContent #main h3 {
	color: #334679;
	float: left;
	font-size: 26px;
	font-weight: 400;
	line-height: 55px;
	margin-right: 20px;
}

/* Slide formating. */
.pageContent .slideshow .colSlide .column {
	border-right: 1px solid #a5a5a5;
	float: left;
	margin-bottom: 30px;
	margin-right: 10px;
	padding-right: 10px;
	width: 32%;
}

.pageContent .slideshow .colSlide .column:last-child {
	border: 0 none;
	margin-right: 0;
}

#main .slideshow .slide h3 {
	border-bottom: 2px solid #e96b0b;
	color: #1a3f6d;
	float: none;
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	margin-bottom: 10px;
	margin-right: 20px;
	padding-bottom: 10px;
	text-transform: uppercase;
}

#main .slideshow .slide p {
	color: #000000;
	font-size: 14px;
	line-height: 20px;
	text-align: justify;
}

/* Formatting for footer. */
#footerClient img.alignleft {
	margin-bottom: 30px;
}

#footerLinks {
	background: #1A3F6D;
	margin-bottom: 10px;
	padding: 50px 0;
}

#footerLinks ul {
	margin-bottom: 25px;
}

#footerLinks li {
	list-style-type: none;
	margin-bottom: 10px;
}

#footerLinks li a {
	color: #fff;
	font-size: 15px;
	line-height: 24px;
	font-family: 'Open Sans', sans-serif;
}

#footerLinks li a:hover {
	color: #ea690b;
	text-decoration: none;
}

/* Specific page css */
/* Intranet access */
.access-intranet {
	background: url("./images/intranet-button.jpg") no-repeat scroll center top / 200px 32px rgba(0, 0, 0, 0);
	color: #ffffff;
	float: right;
	font-family: 'Nobile',sans-serif !important;
	font-size: 18px;
	font-weight: bold;
	height: 32px;
	padding: 10px 0;
	position: relative;
	right: -21px;
	text-align: center;
	width: 200px;
}

a.access-intranet, a.access-intranet:hover {
	color: #ffffff;
}

/* Welcome page */
/* Bloc display */
.bloc {
	border: 1px solid #FCD1B0;
	float: left;
	margin-bottom: 30px;
	margin-right: 1%;
	padding: 10px 3.7%;
	position: relative;
}

/* When display two bloc */
.semi {
	width: 49%;
}

/* Heading in bloc */
.bloc h2 {
	color: #eb6c00;
	font-size: 28px;
	font-weight: normal;
}

.bloc h4 {
	color: #999999;
	margin-bottom: 15px;
	font-size: 20px;
	font-style: italic;
	font-weight: normal;
}

/* List in bloc */
.bloc li {
	color: #333333;
	font-size: 14px;
	line-height: 30px;
	padding-left: 35px;
}

/* Link in bloc list, change default color */
.bloc li a {
	color: #333333;
}

/* Client page */
.clients img.alignleft { /* A mettre ailleurs, alignLeft s'utilise aussi ailleurs ? */
	margin-bottom: 0;
}

#content.clients .excerpt p {
	color: #000000;
	font-size: 15px;
	font-weight: bold;
	text-align: justify;
	line-height: 20px;
}

/* Jobs page */
/*.jobs #main .post p {
	color: #2c3267;
}*/

#apply-for-job {
	background: #27366a;
	border-radius: 5px;
	color: #fff;
	display: inline-block;
	float: right;
	font-size: 26px;
	font-weight: bold;
	max-width: 242px;
	padding: 15px;
}


/* Life page */
.laviechez h3 a:hover {
	color: #ea690b;
	text-decoration: none;
}

.laviechez h3 a:visited:hover {
	text-decoration: none;
}

/* Company key points */
.keyPoints {
}

.keyPoints .keyPoint {
	float: left;
	padding: 7px;
	position: relative;
	width: 45%;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}

.keyPoints .keyPoint:last-child {
	float: right;
}

/* Contact page */
#contact-map {
	float: right;
}

#contact-form {
	float: left;
	max-width: 355px;
	padding-left: 24px;
	/* padding-top: 45px; */
	width: 100%;
}
#contact-form li {
	margin-bottom: 18px;
}
#contact-form li label {
	color: #8d8b8d;
	float: left;
	font-size: 14px;
	font-weight: normal;
	line-height: 26px;
}
#contact-form li label span.required {
	color: #eb6703;
}
#contact-form li .textbox {
	color: #8d8b8d;
	border: 1px solid #b2b2b2;
	float: right;
	font-size: 14px;
	padding: 5px;
	width: 235px;
}
#contact-form li select {
	border: 1px solid #b2b2b2;
	color: #8d8b8d;
	float: right;
	font-size: 14px;
	padding: 3px 5px 3px 0;
	width: 235px;
}
#contact-form li textarea {
	border: 1px solid #b2b2b2;
	color: #8d8b8d;
	float: right;
	font-size: 14px;
	height: 110px;
	padding: 5px;
	resize: none;
	width: 235px;
}
#contact-form li input[type='submit'] {
	background: #eb6703;
	border: 1px solid #c55602;
	border-radius: 2px;
	color: #fff;
	float: right;
	font-size: 14px;
	font-weight: bold;
	padding: 5px 15px;
	position: relative;
	text-transform: uppercase;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}
#contact-form br {
	display: none;
}
#contact-form .wpcf7-form-control-wrap {
	display: block !important;
}
#contact-form .wpcf7-not-valid-tip {
	display: none !important;
	position: absolute !important;
}
#contact-form .wpcf7-not-valid {
	background: #eedcdc;
	border: 1px solid #F00 !important;
}

#addresses {
	margin-bottom: 20px;
	padding: 60px 12% 0;
}
#addresses .address {
	background: #f9f9f9;
	border: 1px solid #1a3f6d;
	border-radius: 6px;
	float: left;
	padding: 7px;
	position: relative;
	height: 180px;
	width: 45%;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	margin-bottom: 15px;
}

#addresses .address:nth-child(even) {
    float: right;
}

/*
#addresses .address:last-child {
	float: right;
}
#addresses .address:last-child .details p:nth-child(2) span:nth-child(4), #addresses .address:last-child .details p:nth-child(2) span:nth-child(5) {
	display: none
}
*/

#addresses h3 {
	color: #26376d;
	display: table;
	float: left;
	font-size: 18px;
	font-weight: bold;
	height: 115px;
	line-height: 22px;
	text-align: center;
	width: 40%;
}
#addresses h3 span {
	display: table-cell;
	vertical-align: middle;
}

#addresses .details {
	border-left: 1px solid #cccccc;
	height: 164px;
	margin-left: 45%;
	padding: 12px 0px 12px 5%;
}

#addresses p {
	font-size: 12px;
	color: #8d8b8d;
	line-height: 16px;
	margin-bottom: 12px;
}

#addresses p:last-child {
	margin-bottom: 0px;
}

#addresses p span {
	color: #26376d;
}

#addresses p span.title {
	color: #ef882e;
}

#addresses p a {
	color: #26376d;
}

/* Definition according window size */
@media only screen and (max-width: 480px) {
	#testimonials li {
		padding: 0 0 10px;
	}
}


@media (min-width: 768px) {

	#banner, #footerLinks, #content.pageContent {
		display: block !important;
	}

}

@media (max-width: 600px) {

	.bloc {
		width: 100%;
	}

	.pageContent .slideshow .colSlide .column {
		border: 0;
		float: none;
		margin: 0;
		padding: 0;
		width: 100%;
	}

}

@media only screen and (max-width: 767px) {

	/* Testimonial formatting. */
	#testimonials .carousal {
		padding: 0;
	}

	#testimonials .carousal ul li {
		float: none;
		padding: 0 10px 10px;
		width: 100%;
	}

}

@media (max-width: 767px) {

	#banner h1 {
		font-size: 34px;
		text-align: left;
	}

	#banner h2 {
		font-size: 26px;
	}

	.pageContent #pageTitle {
		font-size: 36px;
	}

	/* Company key points */
	.keyPoints .keyPoint {
		float: none;
		margin-bottom: 20px;
		width: 100%;
	}
	
	/* Contact page */
	#contact-map {
		display: none;
	}

	#contact-form {
		float: none;
		margin: 0 auto 50px;
		padding-left: 0px;
		padding-top: 0px;
		width: 100%;
	}

	#content {
		padding-bottom: 0px;
		padding-top: 36px;
	}

	#addresses {
		padding: 0;
	}
	#addresses .address {
		float: none;
		margin-bottom: 20px;
		width: 100%;
	}

	#imgPost {
		display: none;
	}

	/* Intranet access */
	.access-intranet {
		border-radius: 0;
		margin-bottom: 15px;
		padding: 15px 0;
		right: 0 !important;
		width: 100%;
	}

}

@media (max-width: 800px) {

	/* Contact page */
	#contact-map {
		max-width: 375px;
	}

}

@media (max-width: 940px) {

	#footerLinks li a {
		font-size: 13px;
		line-height: 20px;
	}

	/* .clients h3 { */
	.pageContent h3 {
		font-size: 20px;
		line-height: 40px;
	}

	.clients #main img {
		height: 40px;
	}

}

@media (max-width: 1000px) {

	/* Configuration for post with image on left side and text on right site. Used to get something on the left with image and text on the right site. And paragraph never comes under the image. */
	/* Like the sidebar with post. Be careful with the maximum size on wrapper, do not exceed it. */
	/* Left part with images. */
	.textImg .images {
		display: none;
	}

	/* Left part with text. */
	.textImg .text {
		float: none;
		min-height: inherit;
		padding-left: 0;
		width: 100% !important;
	}

	/* Text formatting for slidebar linked to post. */
	/* and for main content. */
	.pageContent #main.mainShadow, .pageContent #sidebar.postsSidebar {
		background: none;
		float: none;
		min-height: inherit;
		padding-left: 0;
		width: 100%;
	}
	
	/* Specific page css */
	/* Welcome page */
	/* Bloc display */
	.bloc h2 {
		font-size: 24px;
	}

	.bloc h4 {
		font-size: 18px;
	}
	
}