/* Core Stuff */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-size: 1rem;
    line-height: 1.5em;
    color: #262626;
	font-family: 'Trebuchet MS', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #055E48;
	line-height: 1.2;
}

a {
    color: #055E48;
    text-decoration: none;
}

a:hover {
    color: #55B578;
}

img {
max-width: 100%;
height: auto;
}


.texte-vert1 {
color: #055E48;
}
.texte-vert2 {
color: #55B578;
}

.img-border {
border: 4px solid #55B578;
}

.img-ronde {
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.img-right {
float: right;
margin: 0px 0px 10px 20px;
}
.img-left {
float: left;
margin: 0px 20px 10px 0px;
}


pre {
    background: #F0F0F0;
    margin: 1rem 0;
    border-radius: 2px;
}

blockquote {
    border-left: 10px solid #eee;
    margin: 0;
    padding: 0 2rem;
}

hr {
width: 100%;
max-width: 500px;
margin: 30px auto;
border-top: 2px solid #55B578;
border-bottom: 0;
}

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

/* Utility Classes */
.wrapper {
    width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}

.padding {
    padding: 3rem 1rem;
}

.left {
    float: left;
}

.right {
    float: right
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.small {
font-size: 0.5em;
}

/* Content Styling */
.header .padding {
    padding: 10px 20px;
}

.header {
    background-color: #fff;
    color: #262626;
	border-bottom: 5px solid #055E48;
	line-height: 100%;
}

.header a {
    color: #fff;
}

.header .logo {
    display: inline-block;
}

.header #contact-reseaux {
position: absolute;
right: 0;
top: 5px;
}
#contact-reseaux div {
float: right;
line-height:28px;
padding: 0 10px;
}
#contact-reseaux div.middle {
border-left: 1px solid #055E48;
border-right: 1px solid #055E48;
}

#contact-reseaux a.lien-vert1 {
	background: #55B578;
	padding: 5px 10px;
}
#contact-reseaux a.lien-vert2 {
	background: #055E48;
	padding: 5px 10px;
}

.footer {
    background-color: #55B578;
	border-top: 5px solid #055E48;
	color: #fff;
}
.footer a {
color: #fff;
}

.footer .padding  {
padding: 20px;
}

.footer .left {
margin-right: 20px;
width: 20%;
}
.footer .right {
margin-left: 20px;
width: 20%;
}

/* Menu Settings */
.main-nav {
position: absolute;
right: 0;
bottom: 0;
}
.main-nav ul {
    text-align: right;
    letter-spacing: -1em;
    margin: 0;
    padding: 0;
}

.main-nav ul li {
    display: inline-block;
    letter-spacing: normal;
	margin: 0 10px;
	position: relative;
}

.main-nav ul li:first-child {
display: none;
}
.main-nav ul li ul li:first-child {
display: block;
}

.main-nav ul li:nth-child(2) {
max-width: 120px;
white-space: normal;
}


.main-nav ul li a {
    position: relative;
    display: block;
    line-height: 1.2em;
    color: #055E48;
    padding: 10px;
    white-space: nowrap;
	text-transform: uppercase;
	font-weight: bold;
	text-align:center;
}

.main-nav ul li:nth-child(2) a {
white-space: normal;
    text-align: center;
}

.main-nav ul li a span {
text-transform: none;
color: #262626;
font-size: 0.7em;
font-weight: normal;
line-height: 1em;
}

.main-nav > ul > li > a {
}

/*Active dropdown nav item */
.main-nav ul li:hover > a {
    background-color: #055E48;
	color: #fff;
}

/* Selected Dropdown nav item */
.main-nav ul li.selected > a {
    background-color: #055E48;
    color: #fff;
}

.main-nav ul li:hover > a span, .main-nav ul li.selected > a span {
	color: #fff;
}

.main-nav ul li.selected ul li.selected > a {
    background: none;
    color: #055E48;
}

/* Dropdown CSS */

.main-nav ul li ul {
    position: absolute;
    background-color: #55B578;
    min-width: 100%;
    text-align: left;
    z-index: 999;

    display: none;
}
.main-nav ul li ul li {
    display: block;
}

/* Dropdown CSS */
.main-nav ul li ul ul {
    left: 100%;
    top: 0;
}

.main-nav ul li ul li a {
text-transform: inherit;
	font-weight: normal;
	color: #fff;
	padding: 5px 0;
	border-bottom: 1px dashed #fff;
}
.main-nav ul li ul li:last-child a {
border-bottom: 0;
}
.main-nav ul li ul li:hover > a {
background: none;
color: #055E48;
}

/* Active on Hover */
.main-nav li:hover > ul {
    display: block;
}

/* Child Indicator */
.main-nav .has-children > a {

}


/* mobile nav */

.toggle,
[id^=drop] {
	display: none;
}


/**********content*****************/


table.nos-offres td {
padding: 10px 40px;
}

a.bouton {
color: #fff;
background-color: #55B578;
background-image: url(../images/fleche1.png);
background-position: right 10px center;
background-repeat: no-repeat;
display: inline-block;
padding: 8px 40px 8px 15px;
border: 1px solid #55B578;
}
a.bouton:hover {
color: #55B578;
background-color: #fff;
background-image: url(../images/fleche2.png);
}

table.nos-offres a.bouton {
width: 100%;
text-align: left;
}

/*****************blog*****************/

.home .blog-header-image {
	background-image: none !important;
}


.blog .list-item, .home .list-item {
	display: inline-block;
	width: 31%;
	margin: 20px 1%;
	vertical-align: top;
}

.blog h3.p-name, .home h3.p-name {
	margin: 0 0 10px 0;
}
.list-blog-date {
	font-size: 0.9em;
}
.blog-content-item {
	position: relative;
}
.blog-content-item .list-blog-date {
	font-size: 1em;
	position: absolute;
	top: 0;
	right: 0;
}
.blog-content-item .list-blog-title {
	float: left;
	margin-right: 20px;
	
}

.blog-content-item .list-blog-header {
	float: left;
	width: 50%;
	max-width: 450px;
	margin-right: 20px;
	
}

.blog-content-item  .list-blog-padding {
	padding-top: 40px;
}

.blog-content-item a.button , .blog a.button, .home a.button {
color: #fff;
background: #55B578;
display: inline-block;
padding: 8px 15px;
border: 1px solid #55B578;
}
.blog-content-item a.button:hover, .blog a.button:hover, .home a.button:hover {
color: #55B578;
background: #fff;
}

/*********************contact form**************/

#contact-form {
max-width: 400px;
width: 100%;
margin: 0 auto;
}

.form-field  {
margin-bottom: 15px;
}

.form-data input, .form-data textarea {
width: 100%;
padding: 5px 10px;
}

.form-remarque {
    display: none;
}

@media all and (max-width : 1024px) {

.main-nav ul li {
margin: 0 2px;
}
body {
font-size: 0.9rem;
}

}

@media all and (max-width : 980px) {

table.nos-offres td {
padding: 10px 15px;
}
.cc-revoke, .cc-window {
font-size: 12px;
}

}

@media all and (max-width : 880px) {
	
	.main-nav {
	position: relative;
	bottom: -10px;
	}
	.blog .list-item {
	width: 31%;
	margin: 20px 0.9%;
}
	
}

@media all and (max-width : 768px) {

.header .logo {
	margin-top: 35px;
	}

.main-nav {
position:relative;
margin-top: -40px;
bottom: 0;
}

.toggle + a,
	.menu {
		display: none;
	}

	/* Stylinf the toggle lable */
	.toggle {
		display: block;
		background-color: #055E48;
		padding:14px 20px;	
		color:#FFF;
		font-size:17px;
		text-decoration:none;
		border:none;
		float: right;
	}
	
	[id^=drop]:checked + ul {
		display: block;
	}
	
	.main-nav ul li:first-child {
	display: inline-block;
	}
	.main-nav ul {
	text-align: left;
	}
	.main-nav ul li a {
	text-align:left;
	}

	/* Change menu item's width to 100% */
	nav ul li {
		display: block;
		width: 100%;
		background: #55B578;
		margin: 0;
		}
		.main-nav ul li {
		margin: 0;
		border-bottom: 1px dashed #fff;
		}
		.main-nav ul li a {
			padding-left: 25px;
	text-align:left;
	}
		
		.main-nav ul li:nth-child(2) {
		max-width: 100%;
		white-space: nowrap;
		}
		.main-nav ul li:nth-child(2) a {
		white-space: nowrap;
		text-align:left;
		}
		.main-nav ul li a {
		color: #fff;
		}
		
		.main-nav ul li ul {
		display: block;
		position: relative;
		}
		.main-nav ul li ul li {
		padding-left: 50px;
		border-bottom: 0;
		}
		.main-nav ul li ul li a {
	font-weight: bold;
	border-bottom: 0;
}

#body table td {
display: inline-block !important;
width: 100% !important;
height: auto !important;
}

#top.contact #body img {
max-width: 50%;
height: auto;
}

.footer .left, .footer .right {
width: calc(50% - 20px);
}


.blog .list-item {
	width: 47.5%;
	margin: 20px 1%;
}
#contact-reseaux div.last {
    padding-right: 0px;
	padding-left: 1px;
}


}


@media all and (max-width : 540px) {

#contact-reseaux div {
padding: 0 5px;
}
#contact-reseaux div.middle {
border-right: 0;
}
#contact-reseaux div.last {
	position: absolute;
	right: 0;
	top: 30px;
	padding: 0 5px;
}

 .footer .right {
width: 100%;
margin: 20px 0;
}
.footer .right.text-right {
text-align: center;
}

	
}

@media all and (max-width : 490px) {

#top.contact #body img {
max-width: 100%;
height: auto;
}

.blog-content-item .list-blog-header {
    float: inherit;
    width: 100%;
    max-width: 100%;
    margin-right: 0;
}
.blog-content-item .list-blog-padding {
    padding-top: 10px;
}


}

@media all and (max-width : 450px) {
	
	.header .padding {
	padding: 10px;
	}
	
	.header .logo {
		max-width: 190px;
		margin-top: 55px;
	}
	#contact-reseaux div {
		font-size: 0.9em;
line-height: 24px;
	}
	#contact-reseaux div.middle img {
		max-width: 12px;
	}
	#contact-reseaux div.first a {
	padding: 5px;
	}
	
	.blog .list-item {
	width: 100%;
	margin: 10px 0;
}
	
}