@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,900');

html {
  height: 100%;
  font-size: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  line-height: 1.4;
}
html, body {
  position: relative;
  font-family: 'Roboto', sans-serif;
  color: #2E2E2E;
  font-size: 16px;
}
body {
  overflow-x: hidden;
}
body * {
  box-sizing: border-box;
}
p, h1, h2, h3 {
  position: relative;
}

p {
  margin-top: 0;
}


/**
 * Generic
 */
a, input[type="submit"] {color: #E30613;text-decoration: none;transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;border: 0;}
a:hover, a:active, a:focus {text-decoration: none;}
img {display: block;max-width: 100%; height: auto;}
.col-md-50 {float: left; width: 50%;}
.col-md-100 {float: left; width: 100%;}
.container {max-width: 1640px; margin: 0 auto;}
.layout-sidebar-first {width: 20%; float: left;}
.layout-content {width: 100%; float: left;}
.has-sidebar-first .layout-content {width:80%;}
.has-sidebar-first.has-sidebar-second .layout-content {width:60%;}
body:not(.path-frontpage) main > .container {padding: 0 80px;}
.page-title {text-transform: uppercase; font-size: 3.2em; margin: 0.3em 0 0.3em; color: #4A4A4A; font-weight: 900; text-align: center;}

/*Header*/
.site-logo {max-width: 410px; display: block; margin: 1.5em auto 0;}
.region-header {background: url(../images/bg-header.jpg) no-repeat bottom center; background-size: 100%; display: inline-block; width: 100%;}
#block-sodicom-main-menu, .block-superfish {text-align: center; margin-top: 1em;}
.region-header .menu-item {float: left;}
ul.menu, #superfish-main {display: inline-block; margin: 0;}
.region-header .menu a {color: #505050; font-weight: 700; text-transform: uppercase; display: block; padding: 1em;}
ul.menu a.is-active, .region-header .menu a:hover {color: #E30613;}

/*Breadcrumb*/
.breadcrumb {padding: 3em 80px 1em;}
.breadcrumb a {color: #2E2E2E;}
.breadcrumb a:hover {color: #E30613;}
.breadcrumb li:before {content: ' > ';}

/*Slider*/
.slick-arrow {z-index: 10; position: absolute; top: 50%; transform: rotate(45deg) translateY(-50%); width: 46px; height: 46px; border: 1px solid red; overflow: hidden; text-indent: -9999px; transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; background: none; padding: 0; transform-origin: center; border: 0;}
.slick-arrow.slick-prev {left: 1em; border-bottom: 8px solid white; border-left: 8px solid white;}
.slick-arrow.slick-next {right: 3em; border-top: 8px solid white; border-right: 8px solid white;}
.slick-arrow.slick-prev:hover, .slick-arrow.slick-next:hover {border-color: #E30613;}

/*Slider links*/
.field--name-field-boutons-liens {display: flex; flex-wrap: wrap; justify-content: center; position: relative; margin-top: -40px;}
.field--name-field-boutons-liens a {display: block; width: 280px; min-height: 80px; border-radius: 40px; background: #E30613 url(../images/bg-link.png) 20px center no-repeat; margin: 0 1em; color: white; padding: 0.8em 69px 0 76px; font-size: 1.1em;}
.field--name-field-boutons-liens a:hover, .home-content a:hover {background-color: black;}

/*home*/
.path-frontpage article .field--name-body {display: flex; flex-wrap: wrap; background: #f3f3f3; margin: 3em 0;}
.path-frontpage article .field--name-body > div {width: 50%;}
#map {width: 50%; height: 100%; min-height: 590px;}
.home-content {padding: 2em;}
.home-content h1 {color: #606060; font-size: 2.8em; margin: 0.5em 0.5em 0.8em; line-height: 1;}
.home-content p {padding-left: 5em;}
.home-content a, input[type="submit"] {display: inline-block; border-radius: 40px; background: #E30613 url(../images/bg-link.png) 12px center no-repeat; margin: 1em 0 0; color: white; padding: 0.8em 1.5em 0.8em 3em; background-size: 30px; border: 0; min-width: 180px; text-align: left}
.home-content a:hover, input[type="submit"]:hover {background-color: black;}

/*Footer*/
#block-footerbloc1 {text-align: center; display: inline-block; width: 100%; overflow: hidden; margin-top: 2em;}
.footer-1__logo-wrapper {max-width: 240px; margin: 0 auto; position: relative;}
.footer-1__logo-wrapper:before {content: ""; width: 1000px; height: 1px; top: 50%; left: -1020px; background: #707070; position: absolute;}
.footer-1__logo-wrapper:after {content: ""; width: 1000px; height: 1px; top: 50%; right: -1020px; background: #707070; position: absolute;}
.footer-1__title {font-weight: 700; color: #4aad1e; font-size: 1.5em; margin: 1.5em 0;}
.footer-2__wrapper {display: flex; flex-wrap: wrap;}
.footer-2__row {width: 20%; text-align: center; padding: 0 3em;}
.footer-2__row__img-wrapper {width: 56px; height: 56px; border-radius: 50%; background: #4aad1e; margin: 0 auto 1em; position: relative;}
.footer-2__row__img-wrapper img {margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.footer-2__wrapper .footer-2__row:first-child .footer-2__row__img-wrapper, .footer-2__wrapper .footer-2__row:last-child .footer-2__row__img-wrapper {background: black;}
.footer-2__row__title {font-size: 1.25em; font-weight: 700; margin-bottom: 0.5rem;}
#block-footerbloc3 {text-align: center; padding: 1em;}
footer a {color: #2E2E2E;}
footer a:hover {color: #000000;}
a.lk-more {font-weight: 700; color: #4aad1e;}
#block-footerbloc2 p {margin-bottom: 0.3rem;}

/*Paragraphe titre de section*/
.field--name-field-paragraphe-s- > div {margin-bottom: 2em;}
.paragraph--type--titre-de-section h2 {color: #E62833; font-size: 3rem; font-weight: bold; margin: 0.4em 0 0; padding-bottom: 0.4em; border-bottom: 1px solid #B9B9B9; line-height: 1;}

/*Paragraphe illustre*/
.paragraph--type--paragraphe-illustre {display: inline-block; width: 100%; margin-bottom: 2em;}
.img-left > div {float: left; width: 50%;}
.img-right > div {float: right; width: 50%;}
.par-70 {display: inline-block; width: 70%; margin: 0 15%;}
.paragraph--type--paragraphe-illustre .par-100 .field--name-field-texte {padding: 6em 6em 2em;}
.paragraph--type--paragraphe-illustre .par-70 .field--name-field-texte {padding: 2em 4em 2em;}
.field--name-field-texte h2 {margin-top: 0; line-height: 1.2; font-size: 1.5em; color: #E62833; font-weight: 700;}

/*Paragraphe colonnes*/
.paragraph--type--colonnes {margin: 0 -80px 4em;}
.field--name-field-colonne {display: flex; flex-flow: row wrap; justify-content: flex-start;}
.paragraph--type--colonne {display: flex; flex-flow: column nowrap;}
.col-4 .field--name-field-colonne > div {width: 25%; display: flex; flex-flow: row wrap; justify-content: flex-start; padding: 0 0.5em;}
.col-3 .field--name-field-colonne > div {width: 33.33333%; display: flex; flex-flow: row wrap; justify-content: flex-start; padding: 0 1.5em;}
.field--name-field-image-en-bas-de-colonne {margin-top: auto;}
.bg-grey-1 {background: url(../images/bg-header.jpg) no-repeat top center; background-size: 100%; padding: 1.5em 1em 2em;}
.field--name-field-titre-de-colonne {font-size: 1.3em; color: #E62833; font-weight: 700; text-transform: uppercase; margin: 0.3em 0 0.6em; max-width: 340px;}
body:not(.page-node-type-contact) .col-3 .field--name-field-texte-de-colonne {margin-top: auto;}
.field--name-field-texte-de-colonne img {margin: 0 0.5em 0.5em 0;}

/*Liste des promotions*/
.view-promotions .views-row {display: inline-block; width: 100%; margin-bottom: 2em;}
.views-field-field-image-promo {float: left; margin: 0 1em 0.5em 0; max-width: 40%;}
.view-promotions .views-field-title {font-size: 1.3em; color: #E62833; font-weight: 700; margin: 0.3em 0 0.6em;}
.views-field-field-lien-de-la-promo a {font-size: 1.3em; font-weight: 700; color: #363636; padding: 0.2em 0 0 40px; position: relative;}
.views-field-field-lien-de-la-promo a:before {width: 34px; height: 34px; content: ""; position: absolute; left: 0; top: 0; border-radius: 50%; background: #747474 url(../images/arrow.png) no-repeat center; transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;}
.views-field-field-lien-de-la-promo a:hover {color: #E62833;}
.views-field-field-lien-de-la-promo a:hover:before {background-color: #E62833;}

/*Contact*/
.page-node-type-contact .field--name-field-paragraphe-s- > .field__item:first-child .paragraph--type--colonnes {padding-top: 1em; border-top: 1px solid #B9B9B9;}
.field--name-field-formulaire-associe {width: 50%; float: left; padding-right: 2em;}
.webform-submission-form label {display: block;}
.webform-submission-form .form-text, .webform-submission-form .form-email {max-width: 398px; height: 36px; border: 1px solid #D5D5D5; width: 100%; padding: 0.5em;}
.page-node-type-contact .field__label {font-size: 1.3em; color: #E62833; font-weight: 700; margin: 0;}
#edit-markup {margin-top: 0;}
.role-webmaster .toolbar-icon-system-admin-config, .role-webmaster .toolbar-icon-help-main {display: none !important;}

@media (max-width: 1340px) {
	.footer-2__row {padding: 0 1em;}
	.home-content h1 {font-size: 2.2em;}
	.page-title {font-size: 3em;}
	.paragraph--type--titre-de-section h2 {font-size: 2.3rem;}
	.par-70 {width: 84%; margin: 0 8%;}
	.paragraph--type--paragraphe-illustre .par-70 .field--name-field-texte {padding: 2em;}
	.paragraph--type--paragraphe-illustre .par-100 .field--name-field-texte {padding: 4em 4em 2em;}
}	

@media (max-width: 1200px) {
	.bg-grey-1 {background: #f8f8f8;}
	.field--name-field-texte-de-colonne img {max-width: 35%;}
	.field--name-field-titre-de-colonne {font-size: 1.2em;}
}

@media (max-width: 980px) {
	.field--name-field-boutons-liens a {width: 200px; min-height: 63px; font-size: 1em; padding: 0.5em 40px 0 65px; background-position: 10px center;}
	.footer-2__row {width: 33.333333%; margin-bottom: 2em;}
	.footer-2__wrapper {justify-content: center;}
	.region-header .menu a {padding: 1em 0.5em; font-size: 0.9em;}
	.home-content h1 {font-size: 1.6em;}
	.slick-arrow {width: 36px; height: 36px;}
	.region-header {background-size: inherit; background-position: top right;}
	.page-title {font-size: 2.3em;}
	.paragraph--type--titre-de-section h2 {font-size: 1.9rem;}
	.paragraph--type--paragraphe-illustre .par-100 .field--name-field-texte {padding: 2em;}
	.par-70 {width: 100%; margin: 0;}
	.col-3 .field--name-field-colonne > div {padding: 0 0.5em;}
}	

@media (max-width: 768px) {
	#superfish-main-toggle {display: block; width: 100%; color: white; text-transform: uppercase; font-weight: 700; padding: 1em; background: #E30613;}
	ul.sf-menu.sf-accordion.sf-expanded, ul.sf-menu.sf-accordion li.sf-expanded > ul {background: #f3f3f3;}
	.region-header .menu a {text-align: center;}
	.slick-arrow.slick-prev {border-bottom: 5px solid white; border-left: 5px solid white;}
	.slick-arrow.slick-next {border-top: 5px solid white; border-right: 5px solid white;}
	.path-frontpage article .field--name-body > div {width: 100%;}
	#map {width: 100%; min-height: 450px;}
	.field--name-field-boutons-liens a {margin-bottom: 1em;}
	.path-frontpage article .field--name-body {margin-top: 1em;}
	body:not(.path-frontpage) main > .container {padding: 0 15px;}
	.breadcrumb {padding: 1em 15px;}
	.paragraph--type--colonnes {margin: 0 0 2em;}
	.col-3 .field--name-field-colonne > div {width: 50%;}
	.field--name-field-colonne {justify-content: center;}
	.col-4 .field--name-field-colonne > div {width: 50%; margin-bottom: 2em;}
	.field--name-field-formulaire-associe {width: 100%; padding-right: 0;}
	.webform-submission-form .form-text, .webform-submission-form .form-email {max-width: 100%;}
}

@media (max-width: 560px) {
	.footer-2__row {width: 50%; padding: 0 0.6em;}	
	.img-left > div, .img-right > div {width: 100%;}
	.img-left > div img, .img-right > div img {margin: 0 auto;}
	.paragraph--type--paragraphe-illustre .par-100 .field--name-field-texte {padding: 2em 0 0;}
	.paragraph--type--paragraphe-illustre {margin-bottom: 0;}
	.field--name-field-paragraphe-s- > div {margin-bottom: 1em;}
	.paragraph--type--paragraphe-illustre .par-70 .field--name-field-texte {padding: 1em 0 0;}
	.page-title {font-size: 1.6em;}
	.paragraph--type--titre-de-section h2 {font-size: 1.25rem;}
	.views-field-field-image-promo {width: 100%; max-width: 100%;}
}	

@media (max-width: 470px) {
	.home-content p {padding-left: 2em;}
	.col-4 .field--name-field-colonne > div, .col-3 .field--name-field-colonne > div {width: 100%;}
	html, body {font-size: 15px;}
}