/*!
Theme Name: Theme by mrdesign
Theme URI: http://underscores.me/
Author: Manon Roudaut
Author URI: https://manonroudaut.com/
Description: Wordpress theme by mrdesign
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: wpmrdesign
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Theme by mrdesign is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Elements
# Media
# Mixins
# Modules
	## Accessibility
	## Alignments
	## Clearings
	## Infinite scroll
# Navigation
	## Links
	## Menus
# Site
	## Pages
# Typography
# Variables
	## Colors
	## Columns
	## Structure
	## Typography
# Normalize

--------------------------------------------------------------*/
/*============================================================
                            COLORS
==============================================================*/
/*----- Base -----*/
/*----- Shade of blue -----*/
/*----- Other colors -----*/
/*----- Gradient -----*/
/*----- Box shadow -----*/
/*----- Background -----*/
/*----- Text -----*/
/*----- Border -----*/
@font-face {
    font-family: "protexregular";
    src: url(../font/protex.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
}

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
	 ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
    line-height: 1.15;
    /* 1 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

*,
*:before,
*:after {
    /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

/* Sections
	 ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
    margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 1 */
    overflow: visible;
    /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}

/* Text-level semantics
	 ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
    background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
    /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Lists
	 ========================================================================== */
ul,
ol {
    margin: 0;
    padding: 0 0 0 5%;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li > ul,
li > ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}

dt {
    font-weight: bold;
}

dd {
    margin: 0 1.5em 1.5em;
}

/* Embedded content
	 ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
    border-style: none;
    /*Remove the border on images inside links in IE 10.*/
    height: auto;
    /* Make sure images are scaled correctly. */
    max-width: 100%;
    /* Adhere to container width. */
}

figure {
    margin: 1em 0;
    /* Extra wide images within figure tags don't overflow the content area. */
}

/* Forms
	 ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
    /* 1 */
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    outline-offset: -2px;
    /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */
}

/* Interactive
	 ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

/* Misc
	 ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
    display: none;
}

/**
 * Field
 */
button,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
    color: #19171c;
    background-color: transparent;
    border: none;
    border-radius: none;
    padding: 3px;
}
button:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
    border-color: #19171c;
}
button:active,
button:focus,
input[type="text"]:active,
input[type="text"]:focus,
input[type="email"]:active,
input[type="email"]:focus,
input[type="url"]:active,
input[type="url"]:focus,
input[type="password"]:active,
input[type="password"]:focus,
input[type="search"]:active,
input[type="search"]:focus,
input[type="number"]:active,
input[type="number"]:focus,
input[type="tel"]:active,
input[type="tel"]:focus,
input[type="range"]:active,
input[type="range"]:focus,
input[type="date"]:active,
input[type="date"]:focus,
input[type="month"]:active,
input[type="month"]:focus,
input[type="week"]:active,
input[type="week"]:focus,
input[type="time"]:active,
input[type="time"]:focus,
input[type="datetime"]:active,
input[type="datetime"]:focus,
input[type="datetime-local"]:active,
input[type="datetime-local"]:focus,
input[type="color"]:active,
input[type="color"]:focus,
textarea:active,
textarea:focus {
    outline: none;
}

select {
    border: 1px solid #fef7ef;
}

textarea {
    width: 100%;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
    color: #19171c;
    font-family: "Muli", sans-serif;
    font-size: 14px;
    font-size: 1em;
    line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
}

h2 {
    font-family: "protexregular", "Muli", sans-serif;
    font-size: 4em;
}

h3 {
    font-weight: 900;
    font-size: 1.5em;
}

h5 {
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.subtitle {
    font-weight: 900;
    font-size: 1.1em;
}

.center {
    text-align: center;
}

/*------------------- Title back --------------------*/
.title-header {
    opacity: 0.2;
    margin-bottom: -0.35em;
    margin-left: -0.15em;
    font-size: 4.5em;
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.title-back {
    font-family: "protexregular", "Muli", sans-serif;
    margin-bottom: -0.35em;
    color: #f4cba2;
}

@media screen and (max-width: 992px) {
    h2 {
        font-size: 5rem;
    }
    .title-header {
        font-size: 7vw;
    }
}

@media screen and (max-width: 768px) {
    h2 {
        font-size: 2rem;
    }
    .title-header {
        font-size: 10vw;
    }
}

p {
    margin-bottom: 1em;
}

dfn,
cite,
em,
i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 13.125px;
    font-size: 0.9375em;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code,
kbd,
tt,
var {
    font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    font-size: 13.125px;
    font-size: 0.9375em;
}

abbr,
acronym {
    border-bottom: 1px dotted #4c4b55;
    cursor: help;
}

mark,
ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
/*================================================*/
/*                PAGES CAREERS                   */
/*================================================*/
/*------------- Career --------------*/
.presentation-career {
    margin-bottom: 10%;
}
.presentation-career .job-society {
    text-transform: uppercase;
}
.presentation-career .job-place-ul {
    padding: 0;
}
.presentation-career .job-place {
    list-style-type: none;
    padding-left: 1.6em;
    background: url(../image/place.svg) no-repeat left center;
    height: 1.5em;
}
.presentation-career h3 {
    text-transform: uppercase;
}
.presentation-career .grid-container article:nth-child(2n) .grid-content {
    background-color: #f0722d;
}
.presentation-career .grid-container article:nth-child(4n) .grid-content {
    background-color: #f2925e;
}
.presentation-career .grid-container article a:active,
.presentation-career .grid-container article a:visited {
    color: #ffffff;
}
.presentation-career .grid-container article .grid-content {
    color: #ffffff;
    margin-top: 30px;
}
.presentation-career .grid-container article .grid-content:hover,
.presentation-career .grid-container article .grid-content:focus {
    background-color: #f4cba2;
    color: #19171c;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
}

#protex-jobsoffers {
    text-align: center;
}
#protex-jobsoffers a,
#protex-jobsoffers input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#protex-jobsoffers a::before,
#protex-jobsoffers input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#protex-jobsoffers a:active,
#protex-jobsoffers a:visited,
#protex-jobsoffers input[type="submit"]:active,
#protex-jobsoffers input[type="submit"]:visited {
    color: #f0722d;
}
#protex-jobsoffers a:hover,
#protex-jobsoffers a:focus,
#protex-jobsoffers input[type="submit"]:hover,
#protex-jobsoffers input[type="submit"]:focus {
    color: #ffffff;
}
#protex-jobsoffers a:hover::before,
#protex-jobsoffers a:focus::before,
#protex-jobsoffers input[type="submit"]:hover::before,
#protex-jobsoffers input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*------------- Job --------------*/
#jobs {
    position: relative;
    margin-top: 25%;
}

.jobs-header {
    position: absolute;
    top: 0;
    width: 100%;
    padding-top: 4em;
    padding-bottom: 1em;
    background-color: #f4cba2;
}
.jobs-header a,
.jobs-header input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.jobs-header a::before,
.jobs-header input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.jobs-header a:active,
.jobs-header a:visited,
.jobs-header input[type="submit"]:active,
.jobs-header input[type="submit"]:visited {
    color: #f0722d;
}
.jobs-header a:hover,
.jobs-header a:focus,
.jobs-header input[type="submit"]:hover,
.jobs-header input[type="submit"]:focus {
    color: #ffffff;
}
.jobs-header a:hover::before,
.jobs-header a:focus::before,
.jobs-header input[type="submit"]:hover::before,
.jobs-header input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.jobs-header .page-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.jobs-header a {
    margin-bottom: 2%;
}
.jobs-header .apply {
    color: #19171c;
    border-color: #19171c;
}
.jobs-header .apply:before {
    background: #19171c;
    border-color: #19171c;
}

.job-presentation {
    padding-top: 2%;
    padding-bottom: 10%;
}
.job-presentation h3 {
    margin: 5% 0;
    color: #f45905;
    text-transform: initial;
}
.job-presentation .subtitle {
    margin-top: 5%;
    letter-spacing: 0.1em;
}

.job-resume,
#job-apply {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.job-resume a,
.job-resume button,
#job-apply a,
#job-apply button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.job-resume a:hover,
.job-resume a:focus,
.job-resume a:active,
.job-resume button:hover,
.job-resume button:focus,
.job-resume button:active,
#job-apply a:hover,
#job-apply a:focus,
#job-apply a:active,
#job-apply button:hover,
#job-apply button:focus,
#job-apply button:active {
    color: #ffffff;
}
.job-resume a::before,
.job-resume button::before,
#job-apply a::before,
#job-apply button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.job-resume a:hover::before,
.job-resume a:focus::before,
.job-resume button:hover::before,
.job-resume button:focus::before,
#job-apply a:hover::before,
#job-apply a:focus::before,
#job-apply button:hover::before,
#job-apply button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.job-resume a,
#job-apply a {
    font-weight: 900;
}

.job-border {
    border: solid 5px #fef7ef;
}

#job-apply {
    background-color: #19171c;
}
#job-apply .apply-name {
    margin: 0;
}
#job-apply .entretien {
    font-size: 0.9em;
    margin: 0;
}

@media screen and (max-width: 768px) {
    .jobs-header {
        padding-top: 6em;
    }
}

@media screen and (max-width: 576px) {
    .jobs-header {
        padding-top: 8em;
    }
    .jobs-header .page-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }
    .jobs-header a {
        width: 80%;
    }
    #jobs {
        margin-top: 45vh;
    }
}

/*================================================*/
/*    Group number : home-page + about-page       */
/*================================================*/
#group-number {
    margin-top: -5%;
    z-index: 99;
    position: relative;
}
#group-number .title-back {
    color: #4c4b55;
    font-size: 3em;
}

.owl-carousel .owl-item .number-block {
    padding: 8% 5%;
    width: 100%;
    background-color: white;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    color: #4c4b55;
}
.owl-carousel .owl-item .number-block img {
    width: 25%;
    margin: auto;
}

.owl-carousel .owl-item .item {
    margin: 0 3%;
    width: 100%;
}

/*================================================*/
/*                   FOOTER                       */
/*================================================*/
/*-------------------- Base ----------------------*/
.site-footer {
    position: relative;
}

.footer-block {
    max-width: 340px;
    margin-right: 0;
    margin-left: auto;
    padding: 5% 5% 5% 0;
}

.footer-block-odd {
    height: 100%;
    max-width: 860px;
    margin-right: auto;
    margin-left: 0;
    padding: 5% 0 5% 5%;
}

/*-------------------- Contact ----------------------*/
#footer-contact {
    box-shadow: 5px 5px 10px rgba(25, 23, 28, 0.16);
    position: relative;
    z-index: 10;
}
#footer-contact .contact-desc {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    background-color: #f45905;
    color: #ffffff;
}
#footer-contact .contact-desc a,
#footer-contact .contact-desc input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #ffffff;
    color: #ffffff;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#footer-contact .contact-desc a::before,
#footer-contact .contact-desc input[type="submit"]::before {
    content: "";
    background: #ffffff;
    border: solid 2px #ffffff;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#footer-contact .contact-desc a:focus,
#footer-contact .contact-desc a:visited,
#footer-contact .contact-desc input[type="submit"]:focus,
#footer-contact .contact-desc input[type="submit"]:visited {
    color: #ffffff;
}
#footer-contact .contact-desc a:hover,
#footer-contact .contact-desc a:focus,
#footer-contact .contact-desc input[type="submit"]:hover,
#footer-contact .contact-desc input[type="submit"]:focus {
    color: #19171c;
}
#footer-contact .contact-desc a:hover::before,
#footer-contact .contact-desc a:focus::before,
#footer-contact .contact-desc input[type="submit"]:hover::before,
#footer-contact .contact-desc input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#footer-contact .contact-info {
    background-color: #f4cba2;
}
#footer-contact .society-contact {
    list-style: none;
    font-size: 0.9em;
}
#footer-contact .society-contact a,
#footer-contact .society-contact button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
#footer-contact .society-contact a:hover,
#footer-contact .society-contact a:focus,
#footer-contact .society-contact a:active,
#footer-contact .society-contact button:hover,
#footer-contact .society-contact button:focus,
#footer-contact .society-contact button:active {
    color: #19171c;
}
#footer-contact .society-contact a::before,
#footer-contact .society-contact button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
#footer-contact .society-contact a:hover::before,
#footer-contact .society-contact a:focus::before,
#footer-contact .society-contact button:hover::before,
#footer-contact .society-contact button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#footer-contact .society-contact .link-list {
    display: -webkit-box;
    display: flex;
    min-height: 5em;
    -webkit-box-align: center;
    align-items: center;
}
#footer-contact .society-contact .link-list img {
    height: 3em;
}
#footer-contact .society-contact .link-list a {
    margin-left: 1em;
}
#footer-contact .head-coor {
    padding: 0;
}

/*-------------------- Infos ------------------------*/
#footer-info .site-branding {
    background-color: #ffffff;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
#footer-info .site-branding img {
    max-width: 50%;
}

#footer-info .site-info {
    background-color: #19171c;
    color: #ffffff;
}
#footer-info .site-info a,
#footer-info .site-info button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
#footer-info .site-info a:hover,
#footer-info .site-info a:focus,
#footer-info .site-info a:active,
#footer-info .site-info button:hover,
#footer-info .site-info button:focus,
#footer-info .site-info button:active {
    color: #ffffff;
}
#footer-info .site-info a::before,
#footer-info .site-info button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
#footer-info .site-info a:hover::before,
#footer-info .site-info a:focus::before,
#footer-info .site-info button:hover::before,
#footer-info .site-info button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#footer-info .site-info .info-lign p {
    margin: 0;
}
#footer-info .site-info .info-right {
    margin-top: 5%;
    color: #8a8a90;
    font-size: 0.9em;
}
#footer-info .site-info .info-right .info-design p {
    padding-right: 0.3em;
}
#footer-info .site-info .info-right .info-design a {
    color: #8a8a90;
    margin-top: -0.5em;
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (max-width: 576px) {
    #footer-info .site-branding img {
        max-width: 75%;
    }
}

@media screen and (max-width: 992px) {
    .footer-block {
        margin: auto;
        text-align: center;
        max-width: 100%;
    }
    .footer-block-odd {
        margin-right: 15px;
    }
}

@media screen and (min-width: 992px) {
    .confidentiality {
        text-align: right;
    }
}

/*============================================================*/
/*                     FILTERS & SWITCH                       */
/*============================================================*/
/*--------------------------------------------------------------
## Filter
--------------------------------------------------------------*/
.filters {
    padding-top: 5%;
}
.filters a,
.filters button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.filters a:hover,
.filters a:focus,
.filters a:active,
.filters button:hover,
.filters button:focus,
.filters button:active {
    color: #19171c;
}
.filters a::before,
.filters button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.filters a:hover::before,
.filters a:focus::before,
.filters button:hover::before,
.filters button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.dropdown #dropdownMenuButton,
.dropdown #dropdownSectorButton {
    border-color: #fef7ef;
    color: #19171c;
    background-color: #fef7ef;
    box-shadow: none;
    border-radius: 0;
    padding-right: 5%;
}

.dropdown .filter-active:before,
.dropdown .filter-sector-active:before,
.dropdown .filter-feature-active:before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    padding: auto;
}

.dropdown .dropdown-item:focus,
.dropdown .dropdown-item:hover {
    background-color: transparent;
}

.dropdown button {
    padding-top: 1em;
}

.filter-button {
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    padding-bottom: 1em;
}
.filter-button p {
    margin-bottom: 0;
}
.filter-button .link-arrow {
    background: url(../image/arrow.svg) no-repeat;
    width: 0.8em;
    -webkit-transform: rotate(0);
    transform: rotate(0);
}
.filter-button::after {
    content: none;
}

.show .link-arrow {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.dropdown-menu {
    border: none;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    border-radius: 0;
}

/*Secteur page liste des marques*/
.dropdown-sector {
    min-width: 40rem;
}

.dropdown-fullwidth {
    min-width: 90vw;
}

/*Carrière*/
.career-filters {
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.career-filters .recrutment {
    text-align: right;
}
.career-filters .recrutment a {
    padding-top: 1em;
    color: #f45905;
}
.career-filters .recrutment a:before {
    background-color: #f45905;
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    /*Fullwidth*/
    .dropdown-fullwidth {
        font-size: 0.8em;
        min-width: 40vw;
    }
    .dropdown-fullwidth .filter {
        padding: 0.5em 0;
    }
    .dropdown-item {
        padding-top: 0;
        padding-bottom: 0;
    }
    /*Secteur page liste des marques*/
    .dropdown-sector {
        min-width: 40vw;
    }
}

@media screen and (max-width: 576px) {
    .search-container {
        margin-top: 30px;
        padding: 2% 15px;
    }
    .career-filters .recrutment {
        text-align: left;
    }
}

@media screen and (min-width: 1280px) {
    /*Fullwidth*/
    .dropdown-fullwidth {
        min-width: 1280px;
    }
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
/*================================================*/
/*                 CONTENU MENU                   */
/*================================================*/
/*-------------------- Base ----------------------*/
a {
    color: #19171c;
}
a:hover,
a:focus,
a:visited,
a:active {
    color: #19171c;
    outline: none;
}

.menu-container .row {
    margin: 0;
}

.menu-container .grid {
    padding-right: 10px;
    padding-left: 10px;
}

.menu-container .link-sectors {
    padding-right: 5px;
}

.menu-container .link-company {
    margin-top: 20px;
}

.menu-container .link-block {
    padding: 1.3em 1.3em 1em 1.3em;
    height: 100%;
    width: 100%;
}

.menu-container .link-block-black {
    background-color: #19171c;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
    color: #ffffff;
}
.menu-container .link-block-black h5 {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.menu-container .link-block-black h5::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.menu-container .link-block-black:hover h5,
.menu-container .link-block-black:focus h5,
.menu-container .link-block-black:active h5 {
    color: #ffffff;
}
.menu-container .link-block-black:hover h5::before,
.menu-container .link-block-black:hover h5::before,
.menu-container .link-block-black:focus h5::before,
.menu-container .link-block-black:focus h5::before,
.menu-container .link-block-black:active h5::before,
.menu-container .link-block-black:active h5::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.menu-container .link-block-orange {
    background-color: #f4cba2;
    height: 45%;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.menu-container .link-block-orange h5 {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.menu-container .link-block-orange h5::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.menu-container .link-block-orange:hover h5,
.menu-container .link-block-orange:focus h5,
.menu-container .link-block-orange:active h5 {
    color: #19171c;
}
.menu-container .link-block-orange:hover h5::before,
.menu-container .link-block-orange:hover h5::before,
.menu-container .link-block-orange:focus h5::before,
.menu-container .link-block-orange:focus h5::before,
.menu-container .link-block-orange:active h5::before,
.menu-container .link-block-orange:active h5::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*-------------------- Block Color ----------------------*/
.menu-container h5 {
    font-size: 1em;
    margin-bottom: 0.2rem;
}

.menu-container ul {
    list-style: none;
}

.grid-orange-light {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.link-collapse {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: start;
    align-items: flex-start;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.sectors {
    background-color: #f45905;
    color: #ffffff;
}
.sectors a,
.sectors button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.sectors a:hover,
.sectors a:focus,
.sectors a:active,
.sectors button:hover,
.sectors button:focus,
.sectors button:active {
    color: #ffffff;
}
.sectors a::before,
.sectors button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.sectors a:hover::before,
.sectors a:focus::before,
.sectors button:hover::before,
.sectors button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.sectors button {
    text-align: left;
}

.contact {
    background-color: #f0722d;
    color: #ffffff;
}
.contact a,
.contact button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.contact a:hover,
.contact a:focus,
.contact a:active,
.contact button:hover,
.contact button:focus,
.contact button:active {
    color: #ffffff;
}
.contact a::before,
.contact button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.contact a:hover::before,
.contact a:focus::before,
.contact button:hover::before,
.contact button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.contact .contact-link {
    cursor: pointer;
}

.link-group #collapse-group {
    width: 100%;
}

.link-group .link-block {
    background-color: #19171c;
    color: #ffffff;
    text-align: center;
    display: block;
}
.link-group .link-block h5 {
    position: relative;
    overflow: hidden;
    display: inline-block;
    font-size: 0.9em;
    margin: 0;
    padding: 0.3em 0;
}
.link-group .link-block h5::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.link-group .link-block:hover h5::before,
.link-group .link-block:focus h5::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (min-width: 576px) {
    #collapse-group {
        display: -webkit-box;
        display: flex;
    }
    #group-button {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .menu-container .link-block-black {
        min-height: 30vh;
    }
    .link-collapse .menu-button {
        cursor: context-menu;
    }
    .link-collapse .menu-button::before {
        content: none;
    }
    .collapse:not(.show),
    #collapse-secteur,
    #collapse-products,
    #collapse-skills {
        display: block;
        height: auto !important;
    }
    #skills-button {
        display: none;
    }
}

@media screen and (min-width: 1600px) {
    .menu-container .link-block {
        padding: 2em 2em 1.4em 2em;
    }
}

@media screen and (max-width: 768px) {
    .menu-container .grid {
        margin-bottom: 10px;
    }
    .menu-container .grid-content-left {
        margin-bottom: 0;
    }
    .menu-container .link-sectors {
        padding-right: 20px;
        padding-left: 20px;
        padding-bottom: 10px;
    }
    .menu-container .link-company {
        margin: 0 auto;
    }
    .menu-container .contact ul {
        display: none;
    }
}

@media screen and (max-width: 576px) {
    .link-menu .menu-container {
        padding-top: 20vh;
    }
    .menu-container .link-group .link-block {
        text-align: left;
    }
    .link-group {
        margin-right: 5px;
        margin-left: 5px;
        margin-bottom: 10px;
    }
    #collapse-group {
        background-color: #19171c;
    }
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation,
.link-menu {
    clear: both;
}
.main-navigation .menu-content,
.link-menu .menu-content {
    position: fixed;
    height: 0;
    width: 100%;
    overflow: auto;
    -webkit-transform: translateY(-150%);
    transform: translateY(-150%);
    -webkit-transition: 1s ease-in-out;
    transition: 1s ease-in-out;
}
.main-navigation ul,
.link-menu ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.menu-container {
    padding-top: 10vh;
}

.nav-bg {
    background-color: #ffffff;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}

#masthead {
    position: fixed;
    width: 100%;
    z-index: 99999;
}
#masthead .logo-nav {
    background-color: #ffffff;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    z-index: 9999;
}
#masthead .logo-nav .site-branding {
    padding: 0;
}
#masthead .logo-nav .site-branding img {
    max-width: 5em;
}

.nav-btn {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

#lang-switch {
    margin-right: 15px;
}
#lang-switch .lang-item {
    display: inline;
}
#lang-switch a {
    color: #f4cba2;
    font-weight: 900;
    text-transform: uppercase;
}
#lang-switch a:hover,
#lang-switch a:focus {
    color: #f0722d;
}
#lang-switch .current-lang a {
    color: #f45905;
}
#lang-switch .current-lang a:hover,
#lang-switch .current-lang a:focus {
    color: #f45905;
}

/*------ Menu content -------*/
.toggled .menu-content {
    height: 100%;
    top: 0;
    bottom: 0;
    background-color: #ffffff;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/*---------------------------------------------------
## Menu Burger
----------------------------------------------------*/
.menu-toggle {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.menu-toggle .menu-title {
    font-weight: 900;
    text-transform: uppercase;
    color: #4c4b55;
    margin: 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.menu-toggle label {
    position: relative;
    width: 20px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    margin: 1em;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    text-align: left;
}
.menu-toggle div,
.menu-toggle div:before,
.menu-toggle div:after {
    background: #4c4b55;
    position: absolute;
    height: 4px;
    width: 30px;
    border-radius: 20px;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.menu-toggle label div:first-child {
    top: 4px;
    -webkit-transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s, -webkit-transform 0.15s;
}
.menu-toggle label div:nth-child(2) {
    top: 12px;
    -webkit-transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s, -webkit-transform 0.15s;
}
.menu-toggle label div:nth-child(3) {
    top: 20px;
    -webkit-transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, -webkit-transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s;
    transition: top 0.15s 0.15s, transform 0.15s, -webkit-transform 0.15s;
}

.menu-toggle:hover .menu-title,
.menu-toggle:focus .menu-title,
.toggled .menu-toggle .menu-title {
    color: #19171c;
}

.menu-toggle:hover div,
.menu-toggle:hover div:before,
.menu-toggle:hover div:after,
.menu-toggle:focus div,
.menu-toggle:focus div:before,
.menu-toggle:focus div:after,
.toggled .menu-toggle div,
.toggled .menu-toggle div:before,
.toggled .menu-toggle div:after {
    background: #19171c;
}

/*------ Animation -------*/
.toggled .menu-toggle div:first-child {
    top: 14px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: top 0.15s, -webkit-transform 0.15s 0.15s;
    transition: top 0.15s, -webkit-transform 0.15s 0.15s;
    transition: top 0.15s, transform 0.15s 0.15s;
    transition: top 0.15s, transform 0.15s 0.15s, -webkit-transform 0.15s 0.15s;
}

.toggled .menu-toggle div:nth-child(2),
.toggled .menu-toggle div:nth-child(3) {
    top: 14px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition: top 0.15s, -webkit-transform 0.15s 0.15s;
    transition: top 0.15s, -webkit-transform 0.15s 0.15s;
    transition: top 0.15s, transform 0.15s 0.15s;
    transition: top 0.15s, transform 0.15s 0.15s, -webkit-transform 0.15s 0.15s;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
    /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    -webkit-clip-path: none;
    clip-path: none;
    color: #f45905;
    display: block;
    font-size: 12.25px;
    font-size: 0.875em;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
    outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
    content: "";
    display: table;
    table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
    clear: both;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Animations
--------------------------------------------------------------*/
/*------------------- Title Header --------------------*/
.scroll-header {
    -webkit-transform: scale(1);
    transform: scale(1);
}

/*------------------- Title scale --------------------*/
.title-scale {
    opacity: 0.5;
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.scroll-title {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

/*------------------- Title & block translate --------------------*/
.title-translate {
    opacity: 0.5;
    -webkit-transform: translate(-1em);
    transform: translate(-1em);
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.scroll-translate {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0);
}

/*------------------- Image scale --------------------*/
.scale-img {
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.scroll-scale {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.bgimg-content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.scale-bgimg {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.scroll-scalebg {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/*------------------- Logo scale --------------------*/
.custom-logo-link img {
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.custom-logo-link:hover img,
.custom-logo-link:focus img {
    -webkit-transform: scale(1);
    transform: scale(1);
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*================================================*/
/*                     SITE                       */
/*================================================*/
/*-------------------------------------------------
## BASE
--------------------------------------------------*/
html {
    box-sizing: border-box;
}

body {
    background-color: #fef7ef;
    overflow-x: hidden;
}

.page-container {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
}

ul {
    list-style: square;
    margin-bottom: 1em;
}

a {
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    outline: none;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
a:hover,
a:focus,
a:active,
a:visited {
    text-decoration: none;
}

.grid-title {
    padding: 1% 3%;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
}

.nomargin {
    margin: 0;
}

.white-block {
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    display: block;
    height: 25em;
}
.white-block .block-title {
    background-color: #ffffff;
    padding: 15% 5% 2% 5%;
}

.link-arrow {
    height: 1.2em;
    width: 1.2em;
    background: url(../image/arrow-white.svg) no-repeat;
    background-size: contain;
    -webkit-transform: translateX(15px);
    transform: translateX(15px);
    -webkit-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

.scale-block {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.scale-block:hover,
.scale-block:focus {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

.row-nomarg {
    margin-right: 0;
    margin-left: 0;
    
        
}

/*-------------my*/
.justify-content-center{
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-around;
}

.min-img {
    min-height: 10em;
}

.orangeline {
    background-color: #f45905;
    height: 15px;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    
    display: none;
}

.block-color {
    background-color: #f2925e;
}
.block-color .bcolor {
    position: relative;
    background-color: #19171c;
    color: #ffffff;
    padding: 5%;
}
.block-color .bcolor a,
.block-color .bcolor input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.block-color .bcolor a::before,
.block-color .bcolor input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.block-color .bcolor a:active,
.block-color .bcolor a:visited,
.block-color .bcolor input[type="submit"]:active,
.block-color .bcolor input[type="submit"]:visited {
    color: #f0722d;
}
.block-color .bcolor a:hover,
.block-color .bcolor a:focus,
.block-color .bcolor input[type="submit"]:hover,
.block-color .bcolor input[type="submit"]:focus {
    color: #ffffff;
}
.block-color .bcolor a:hover::before,
.block-color .bcolor a:focus::before,
.block-color .bcolor input[type="submit"]:hover::before,
.block-color .bcolor input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.block-color .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
}

.society-link {
    list-style: none;
    margin-top: 2%;
    
    /*---------------my*/
    display: flex;
    display: -webkit-flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: space-around;
    
}
.society-link img {
    display: block;
    height: 3em;
    margin: auto;
}
.society-link a {
    padding: 0.5em;
}

.basic-content {
    padding: 5%;
}
.basic-content a,
.basic-content button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.basic-content a:hover,
.basic-content a:focus,
.basic-content a:active,
.basic-content button:hover,
.basic-content button:focus,
.basic-content button:active {
    color: #19171c;
}
.basic-content a::before,
.basic-content button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.basic-content a:hover::before,
.basic-content a:focus::before,
.basic-content button:hover::before,
.basic-content button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.basic-content h3 {
    padding-top: 3%;
}
.basic-content a {
    margin-bottom: -0.75em;
}

/* Spinner */
@-webkit-keyframes donut-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes donut-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#button-spin {
    display: inline-block;
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-left-color: #19171c;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    -webkit-animation: donut-spin 1.2s linear infinite;
    animation: donut-spin 1.2s linear infinite;
}

.content-page-base {
    margin-top: -15%;
}
.content-page-base a,
.content-page-base button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.content-page-base a:hover,
.content-page-base a:focus,
.content-page-base a:active,
.content-page-base button:hover,
.content-page-base button:focus,
.content-page-base button:active {
    color: #19171c;
}
.content-page-base a::before,
.content-page-base button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.content-page-base a:hover::before,
.content-page-base a:focus::before,
.content-page-base button:hover::before,
.content-page-base button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.content-page-base h3 {
    margin-top: 5%;
}

.base-link a,
.base-link input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.base-link a::before,
.base-link input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.base-link a:active,
.base-link a:visited,
.base-link input[type="submit"]:active,
.base-link input[type="submit"]:visited {
    color: #f0722d;
}
.base-link a:hover,
.base-link a:focus,
.base-link input[type="submit"]:hover,
.base-link input[type="submit"]:focus {
    color: #ffffff;
}
.base-link a:hover::before,
.base-link a:focus::before,
.base-link input[type="submit"]:hover::before,
.base-link input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*---------------------------------------------------
## Header
----------------------------------------------------*/
.page-header,
.page-header-block {
    height: 100vh;
}

.page-bg {
    height: 70%;
}

.bg-blue {
    height: 100%;
    background: linear-gradient(
        135deg,
        rgba(244, 203, 162, 0.75),
        rgba(244, 89, 5, 0.85) 50%
    );
}
.bg-blue .blue-title {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 100%;
    color: #ffffff;
}
.bg-blue .blue-title p {
    max-width: 70%;
    margin-top: 2%;
    text-align: center;
}

/*--------------- Header block color ----------------*/
.pres-container {
    height: 100%;
}

.pres-content {
    width: 50%;
    height: 100%;
    padding: 3%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
    background-color: #19171c;
    box-shadow: 5px 5px 10px rgba(25, 23, 28, 0.16);
    color: #ffffff;
}

.pres-content-img {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
    box-shadow: 5px 5px 10px rgba(25, 23, 28, 0.16);
    color: #ffffff;
    text-align: center;
    overflow: hidden;
    min-height: 35vh;
}
.pres-content-img .title-header {
    opacity: 0.5;
}

.pres-content-blue {
    background-color: #f45905;
}

/*--------------------------------------------------------------
## Grid
--------------------------------------------------------------*/
.grid-content {
    height: 25em;
    padding: 5%;
    background-color: #f45905;
    color: #ffffff;
}

/*--------------------------------------------------------------
## Img BG
--------------------------------------------------------------*/
.skill-template {
    position: relative;
    overflow: hidden;
}
.skill-template .skill-img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/*--------------------------------------------------------------
## Cookies
--------------------------------------------------------------*/
#cookie-notice #cn-notice-text .button-cookie {
    color: #8a8a90;
    transition: 0.3s;
}
#cookie-notice #cn-notice-text .button-cookie:hover {
    color: #f45905;
}

#cookie-notice #cn-notice-buttons .button-cookie {
    background: #19171c;
    transition: 0.3s;
}
#cookie-notice #cn-notice-buttons .button-cookie:hover {
    background: #f45905;
}

/*--------------------------------------------------------------
## Captcha
--------------------------------------------------------------*/
.grecaptcha-badge {
    z-index: 999;
}

/*--------------------------------------------------------------
## Search
--------------------------------------------------------------*/
.search-container {
    position: relative;
}
.search-container .search {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 1.5em;
}
.search-container .search #global-search {
    border-bottom: 2px solid #ffffff;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.search-container .search #global-search:hover,
.search-container .search #global-search:focus {
    border-bottom-color: #19171c;
}
.search-container .search .loup {
    background: url(http://protavicchina.local/wp-content/themes/wpmrdesignen/images/loup.svg) no-repeat;
    height: 1.2em;
    width: 1.2em;
    background-size: contain;
}
.search-container #search-results {
    position: absolute;
    max-height: 90vh;
    overflow-y: scroll;
    right: 0;
    left: 0;
    box-shadow: 5px 5px 10px rgba(25, 23, 28, 0.16);
    background-color: #ffffff;
}
.search-container #search-results .result-content {
    padding: 0.5em;
    display: -webkit-box;
    display: flex;
}
.search-container #search-results .result-content:hover .link-search::before,
.search-container #search-results .result-content:focus .link-search::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.search-container #search-results .link-search {
    position: relative;
    overflow: hidden;
}
.search-container #search-results .link-search::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.search-container #search-results .s-marque {
    background: url(http://protavicchina.local/wp-content/themes/wpmrdesignen/images/marques.svg) no-repeat;
    background-size: content;
    margin-right: 2%;
    width: 1px;
    padding: 5%;
}
.search-container #search-results .s-sector {
    background: url(http://protavicchina.local/wp-content/themes/wpmrdesignen/images/sector.svg) no-repeat;
    background-size: content;
    margin-right: 2%;
    width: 1px;
    padding: 5%;
}
.search-container #search-results .s-feature {
    background: url(http://protavicchina.local/wp-content/themes/wpmrdesignen/images/features.svg) no-repeat;
    background-size: content;
    width: 1px;
    margin-right: 2%;
    padding: 5%;
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (max-width: 1325px) {
    .site-pad {
        padding-right: 15px;
        padding-left: 15px;
    }
}

@media screen and (max-width: 768px) {
    .page-header,
    .page-header-block {
        height: 100%;
    }
    .page-header-block .pres-container {
        padding-top: 50%;
    }
    .page-header-block .pres-content {
        height: 100%;
    }
    .pres-content {
        width: 100%;
        height: 70%;
    }
}

@media screen and (max-width: 576px) {
    .search-container {
        display: none;
    }
    .bg-blue .blue-title {
        font-size: 0.8em;
    }
}

@media screen and (min-width: 992px) {
    .basic-content {
        margin-top: -20vh;
    }
}

/*--------------------------------------------------------------
## Import
--------------------------------------------------------------*/
/*================================================*/
/*                  TEMPLATE HOME                 */
/*================================================*/
/*------------------- Base ---------------------*/
#home-norms a,
#home-norms input[type="submit"],
#home-innovation a,
#home-innovation input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #ffffff;
    color: #ffffff;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#home-norms a::before,
#home-norms input[type="submit"]::before,
#home-innovation a::before,
#home-innovation input[type="submit"]::before {
    content: "";
    background: #ffffff;
    border: solid 2px #ffffff;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#home-norms a:focus,
#home-norms a:visited,
#home-norms input[type="submit"]:focus,
#home-norms input[type="submit"]:visited,
#home-innovation a:focus,
#home-innovation a:visited,
#home-innovation input[type="submit"]:focus,
#home-innovation input[type="submit"]:visited {
    color: #ffffff;
}
#home-norms a:hover,
#home-norms a:focus,
#home-norms input[type="submit"]:hover,
#home-norms input[type="submit"]:focus,
#home-innovation a:hover,
#home-innovation a:focus,
#home-innovation input[type="submit"]:hover,
#home-innovation input[type="submit"]:focus {
    color: #19171c;
}
#home-norms a:hover::before,
#home-norms a:focus::before,
#home-norms input[type="submit"]:hover::before,
#home-norms input[type="submit"]:focus::before,
#home-innovation a:hover::before,
#home-innovation a:focus::before,
#home-innovation input[type="submit"]:hover::before,
#home-innovation input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

#home-header a,
#home-header button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
#home-header a:hover,
#home-header a:focus,
#home-header a:active,
#home-header button:hover,
#home-header button:focus,
#home-header button:active {
    color: #ffffff;
}
#home-header a::before,
#home-header button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
#home-header a:hover::before,
#home-header a:focus::before,
#home-header button:hover::before,
#home-header button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*------------------- Presse ---------------------*/
#home-presse {
    margin-top: 10%;
    background-color: #ffffff;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
#home-presse .subtitle {
    z-index: 10;
    position: relative;
}
#home-presse .presse-content {
    padding: 5% 5% 0 5%;
}
#home-presse .presse-content a,
#home-presse .presse-content button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
#home-presse .presse-content a:hover,
#home-presse .presse-content a:focus,
#home-presse .presse-content a:active,
#home-presse .presse-content button:hover,
#home-presse .presse-content button:focus,
#home-presse .presse-content button:active {
    color: #19171c;
}
#home-presse .presse-content a::before,
#home-presse .presse-content button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
#home-presse .presse-content a:hover::before,
#home-presse .presse-content a:focus::before,
#home-presse .presse-content button:hover::before,
#home-presse .presse-content button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#home-presse .presse-link {
    padding: 0 5% 5% 5%;
}
#home-presse .presse-link a,
#home-presse .presse-link input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#home-presse .presse-link a::before,
#home-presse .presse-link input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#home-presse .presse-link a:active,
#home-presse .presse-link a:visited,
#home-presse .presse-link input[type="submit"]:active,
#home-presse .presse-link input[type="submit"]:visited {
    color: #f0722d;
}
#home-presse .presse-link a:hover,
#home-presse .presse-link a:focus,
#home-presse .presse-link input[type="submit"]:hover,
#home-presse .presse-link input[type="submit"]:focus {
    color: #ffffff;
}
#home-presse .presse-link a:hover::before,
#home-presse .presse-link a:focus::before,
#home-presse .presse-link input[type="submit"]:hover::before,
#home-presse .presse-link input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#home-presse .presse-image {
    min-height: 10em;
    position: relative;
}
#home-presse .presse-image .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
}

/*------------------- News ---------------------*/
#home-news {
    margin-top: 15%;
    margin-bottom: 10%;
}
#home-news h2 {
    text-align: center;
}
#home-news .subtitle {
    color: #19171c;
}

.owl-nav {
    text-align: center;
    font-weight: 900;
    color: #f4cba2;
    font-size: 4.5em;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    max-width: 640px;
    margin: 0 auto;
}
.owl-nav .owl-prev {
    margin: 1%;
}
.owl-nav .owl-next {
    margin: 1%;
}
.owl-nav span:focus {
    outline: none;
}

.owl-dots {
    text-align: center;
    margin-top: -4.2em;
}
.owl-dots span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #f4cba2;
    display: block;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
    border-radius: 30px;
}
.owl-dots .active span {
    background: #f45905;
}

.owl-stage {
    display: -webkit-box;
    display: flex;
}

.owl-item {
    display: -webkit-box;
    display: flex;
    height: auto;
}

.item {
    margin: 3%;
    height: 95%;
    background-color: #ffffff;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
.item a,
.item button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.item a:hover,
.item a:focus,
.item a:active,
.item button:hover,
.item button:focus,
.item button:active {
    color: #19171c;
}
.item a::before,
.item button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.item a:hover::before,
.item a:focus::before,
.item button:hover::before,
.item button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.item .home-image {
    height: 15em;
}
.item .text {
    padding: 5% 5% 10% 5%;
}
.item .text h5 {
    margin-top: 0;
}
.item .date {
    font-size: 0.9em;
    color: #8a8a90;
    margin-bottom: 0;
}

/*------------------- About ---------------------*/
#home-about {
    min-height: 25em;
    padding-top: 8%;
    text-align: center;
    background-color: #f4cba2;
}

.homepage #group-number {
    margin-top: -20vh;
    margin-bottom: 10%;
}

/*------------------- Products ---------------------*/
#home-products {
    padding: 5%;
}
#home-products a,
#home-products input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#home-products a::before,
#home-products input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#home-products a:active,
#home-products a:visited,
#home-products input[type="submit"]:active,
#home-products input[type="submit"]:visited {
    color: #f0722d;
}
#home-products a:hover,
#home-products a:focus,
#home-products input[type="submit"]:hover,
#home-products input[type="submit"]:focus {
    color: #ffffff;
}
#home-products a:hover::before,
#home-products a:focus::before,
#home-products input[type="submit"]:hover::before,
#home-products input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#home-products .list-group {
    height: 100%;
}
#home-products .hp-block {
    max-width: 60%;
    margin-right: 0;
    margin-left: auto;
    padding: 5%;
    background-color: rgba(255, 255, 255, 0.8);
}
#home-products .hp-block h2 {
    color: #f2925e;
    margin-bottom: 5%;
}
#home-products .title-home-products {
    margin-bottom: 0;
    z-index: 9;
}

/*------------------- Sectors ---------------------*/
#home-application {
    margin: 0 auto 10% auto;
    padding-top: 20%;
}
#home-application .subtitle {
    z-index: 9;
    position: relative;
}

#page-market {
    height: 60vh;
}

.block-sector-container {
    padding-bottom: 30px;
    
    width: 33%;
    padding: 20px;
}

.block-sector {
    padding: 0;
    position: relative;
    height: 19em;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    overflow: hidden;
    
    
    
}
.block-sector .home-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.block-sector .home-image:before {
    content: "";
    color: #ffffff;
    background-color: rgba(244, 89, 5, 0.75);
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
}
.block-sector .title {
    margin-bottom: 0;
    color: #ffffff;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 1.5em;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6);
    z-index: 1;
}
.block-sector:hover .home-image,
.block-sector:focus .home-image {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}
.block-sector:hover .home-image:before,
.block-sector:focus .home-image:before {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.sector-container a:hover,
.sector-container a:focus,
.sector-container a:visited,
.sector-container a:active {
    color: #ffffff;
}

/*------------------- Norms ---------------------*/
#home-norms {
    background-color: #19171c;
    color: #ffffff;
}
#home-norms .page-container {
    padding: 5% 0;
}
#home-norms h5 {
    margin-bottom: 7%;
}

/*------------------- Innovation ---------------------*/
#home-innovation {
    background-color: #f45905;
    color: #ffffff;
}
#home-innovation .page-container {
    padding: 5% 0;
}
#home-innovation h5 {
    margin-bottom: 7%;
}

/*------------------- Society ---------------------*/
#home-society {
    padding-top: 10%;
    text-align: center;
}
#home-society a,
#home-society button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
#home-society a:hover,
#home-society a:focus,
#home-society a:active,
#home-society button:hover,
#home-society button:focus,
#home-society button:active {
    color: #19171c;
}
#home-society a::before,
#home-society button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
#home-society a:hover::before,
#home-society a:focus::before,
#home-society button:hover::before,
#home-society button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#home-society article {
    max-width: 60%;
    margin: auto;
    z-index: 99;
    position: relative;
}
#home-society img {
    display: block;
    margin: 2% auto 0 auto;
}

/*------------------- Group ---------------------*/
#home-group {
    margin-top: 10%;
    text-align: center;
}
#home-group .white-block {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
    position: relative;
    overflow: hidden;
}
#home-group .white-block .home-image {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
#home-group .white-block .subtitle {
    text-transform: uppercase;
    width: 100%;
    padding: 5%;
    background-color: #ffffff;
    z-index: 1;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}
#home-group .white-block .subtitle p {
    margin: 0;
}
#home-group .white-block:hover .home-image,
#home-group .white-block:focus .home-image {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}
#home-group .white-block:hover .subtitle,
#home-group .white-block:focus .subtitle {
    color: #ffffff;
    background-color: #19171c;
}
#home-group .white-block:hover .subtitle .link-arrow,
#home-group .white-block:focus .subtitle .link-arrow {
    height: 1.2em;
    width: 1.2em;
    background: url(../image/arrow-white.svg) no-repeat;
    background-size: contain;
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
}

/*------------------- Newsletter ---------------------*/
#newsletter {
    margin: 10% auto;
}
#newsletter h5 {
    padding-top: 2%;
    text-transform: initial;
}
#newsletter form {
    position: relative;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
#newsletter form #email {
    border: none;
    width: 100%;
    padding: 2% 3%;
    color: #ffffff;
    background-color: #f45905;
}
#newsletter form #email::-webkit-input-placeholder {
    color: #fef7ef;
}
#newsletter form #email:-ms-input-placeholder {
    color: #fef7ef;
}
#newsletter form #email::-ms-input-placeholder {
    color: #fef7ef;
}
#newsletter form #email::-moz-placeholder {
    color: #fef7ef;
}
#newsletter form #email::placeholder {
    color: #fef7ef;
}
#newsletter form #newsletter-button {
    height: 100%;
    width: 100%;
    padding: 2% 0;
}
#newsletter form #newsletter-feedback {
    position: absolute;
    bottom: 0;
    font-size: 0.7em;
    margin: -2em 20px;
}

.success {
    color: #6dc82a;
}

.error {
    color: #c7002e;
}

/*------------------- Protex ---------------------*/
#protex {
    margin-bottom: 10%;
    margin-top: 10%;
    background-color: #ffffff;
}
#protex .bcolor {
    background-color: #f4cba2;
    color: #19171c;
}
#protex .bcolor .protex-desc {
    padding-left: 2%;
}
#protex .bcolor a {
    border: solid 2px #19171c;
    color: #19171c;
}
#protex .bcolor a::before {
    content: "";
    background: #19171c;
    border: solid 2px #19171c;
}
#protex .bcolor a:active,
#protex .bcolor a:visited {
    color: #19171c;
}
#protex .bcolor a:hover,
#protex .bcolor a:focus {
    color: #ffffff;
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (max-width: 1200px) {
    #home-products .hp-block {
        max-width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .homepage #group-number {
        margin-top: -20%;
    }
    #home-skills {
        margin-top: -20vh;
    }
    .action .vb-content {
        padding-top: 10%;
    }
    .action .vb-img {
        height: 300px;
        margin-top: 30px;
        margin-bottom: 30px;
    }
    #home-products .list-group {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
    }
    #newsletter .scale-img {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 576px) {
    #home-header {
        padding-top: 15%;
    }
    #home-skills {
        margin-top: 5%;
    }
    .homepage #group-number {
        margin-top: -10%;
    }
    #home-about {
        min-height: 10em;
    }
    #home-products .list-group {
        font-size: 0.8em;
    }
    #home-products .link-arrow {
        display: none;
    }
    #home-group .group-block {
        margin-bottom: 30px;
    }
    #newsletter .button-news {
        margin-top: 15px;
    }
    #home-norms,
    #home-innovation,
    #home-society {
        text-align: center;
    }
}

/*================================================*/
/*                     CONTACT                    */
/*================================================*/
/*----------------- Header -------------------*/
.contact-header {
    min-height: 100vh;
}
.contact-header .page-bg {
    height: 70vh;
}

.contact-title {
    margin-top: 5%;
}
.contact-title a,
.contact-title button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.contact-title a:hover,
.contact-title a:focus,
.contact-title a:active,
.contact-title button:hover,
.contact-title button:focus,
.contact-title button:active {
    color: #19171c;
}
.contact-title a::before,
.contact-title button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.contact-title a:hover::before,
.contact-title a:focus::before,
.contact-title button:hover::before,
.contact-title button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*----------------- Coordonées -------------------*/
.contact-element {
    position: relative;
    min-height: 4em;
    margin: 0;
    padding-left: 4em;
    list-style: none;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.contact-element a,
.contact-element button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.contact-element a:hover,
.contact-element a:focus,
.contact-element a:active,
.contact-element button:hover,
.contact-element button:focus,
.contact-element button:active {
    color: #19171c;
}
.contact-element a::before,
.contact-element button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.contact-element a:hover::before,
.contact-element a:focus::before,
.contact-element button:hover::before,
.contact-element button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.contact-element p {
    margin: 0;
}
.contact-element::before {
    content: "";
    background: url(../image/place-hover.svg) no-repeat left center;
    background-size: 1.9em;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.contact-phone::before {
    background: url(../image/phone-hover.svg) no-repeat left center;
    background-size: 1.9em;
}

.contact-mail::before {
    background: url(../image/mail-hover.svg) no-repeat left center;
    background-size: 1.9em;
}

.contact-in::before {
    background: url(../image/social-media-hover.svg) no-repeat left center;
    background-size: 1.9em;
}

/*------------ Coordonées sur fond bleu : contact / menu --------------*/
.contact-white {
    font-size: 0.9em;
    z-index: 9;
}
.contact-white .contact-link {
    color: #ffffff;
}
.contact-white .contact-element {
    min-height: 3em;
    padding-left: 3em;
}
.contact-white .contact-element a,
.contact-white .contact-element button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.contact-white .contact-element a:hover,
.contact-white .contact-element a:focus,
.contact-white .contact-element a:active,
.contact-white .contact-element button:hover,
.contact-white .contact-element button:focus,
.contact-white .contact-element button:active {
    color: #ffffff;
}
.contact-white .contact-element a::before,
.contact-white .contact-element button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.contact-white .contact-element a:hover::before,
.contact-white .contact-element a:focus::before,
.contact-white .contact-element button:hover::before,
.contact-white .contact-element button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.contact-white .contact-element::before {
    background: url(../image/place.svg) no-repeat left center;
    background-size: 1.7em;
}
.contact-white .contact-phone::before {
    background: url(../image/phone.svg) no-repeat left center;
    background-size: 1.7em;
}
.contact-white .contact-mail::before {
    background: url(../image/mail.svg) no-repeat left center;
    background-size: 1.7em;
}
.contact-white .contact-in::before {
    background: url(../image/social-media.svg) no-repeat left center;
    background-size: 1.9em;
}

/*------------------ Formulaire -------------------*/
.form-button {
    padding: 1em 2em;
    color: #f45905;
    border: 2px solid #f45905;
    background-color: #fef7ef;
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}
.form-button:hover,
.form-button:focus {
    color: #ffffff;
    background: #f45905;
}

/*------------ Formulaire de contact --------------*/
.form-title {
    padding-top: 5%;
    text-align: center;
}

#contact-form {
    margin-bottom: 10%;
}
#contact-form .frm_form_title,
#contact-form .frm_description,
#contact-form .frm_submit,
#contact-form p {
    text-align: center;
}
#contact-form .frm_button_submit {
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
#contact-form input,
#contact-form select,
#contact-form textarea {
    box-shadow: 5px 5px 10px rgba(25, 23, 28, 0.16);
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

/*------------ Implantations --------------*/
.implantations-contact {
    margin-top: 10%;
    margin-bottom: 10%;
}
.implantations-contact .switch-element .list-group {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    flex-direction: row-reverse;
}
.implantations-contact .switch-element #list-tab .list-group-contact {
    -webkit-box-pack: center;
    justify-content: center;
    border-right: solid 15px #fef7ef;
    border-left: solid 15px #fef7ef;
}
.implantations-contact .switch-element #list-tab .list-group-contact .subtitle {
    margin-bottom: 0;
}
.implantations-contact
    .switch-element
    #list-tab
    .list-group-contact
    .link-arrow {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.implantations-contact
    .switch-element
    #list-tab
    .list-group-contact:hover
    .link-arrow,
.implantations-contact
    .switch-element
    #list-tab
    .list-group-contact:focus
    .link-arrow {
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
}
.implantations-contact .switch-element #list-tab .active:focus .link-arrow,
.implantations-contact .switch-element #list-tab .active:hover .link-arrow,
.implantations-contact .switch-element #list-tab .active .link-arrow {
    -webkit-transform: translateX(25px);
    transform: translateX(25px);
}
.implantations-contact .switch-block {
    background-color: #19171c;
    color: #ffffff;
    margin: 0 15px;
    padding: 0 5% 5% 5%;
}
.implantations-contact .switch-block a,
.implantations-contact .switch-block button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.implantations-contact .switch-block a:hover,
.implantations-contact .switch-block a:focus,
.implantations-contact .switch-block a:active,
.implantations-contact .switch-block button:hover,
.implantations-contact .switch-block button:focus,
.implantations-contact .switch-block button:active {
    color: #ffffff;
}
.implantations-contact .switch-block a::before,
.implantations-contact .switch-block button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.implantations-contact .switch-block a:hover::before,
.implantations-contact .switch-block a:focus::before,
.implantations-contact .switch-block button:hover::before,
.implantations-contact .switch-block button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.implantations-contact .switch-block .country {
    width: 100%;
    padding-bottom: 1em;
    padding-top: 2em;
    border-bottom: 2px solid #f4cba2;
    color: #f4cba2;
    text-transform: uppercase;
    font-weight: 900;
}
.implantations-contact .switch-block .subtitle {
    margin-top: 2em;
}

@media screen and (max-width: 768px) {
    .implantations-contact .switch-element #list-tab {
        font-size: 0.9em;
    }
    .implantations-contact .switch-element #list-tab .list-group-contact {
        border-right: none;
        border-left: none;
        padding: 0;
    }
    .implantations-contact .switch-block {
        margin: 0;
    }
}

@media screen and (max-width: 576px) {
    .implantations-contact .switch-element #list-tab .list-group-contact {
        border-bottom: solid 15px #fef7ef;
    }
    .implantations-contact .switch-element #list-tab .list-group-item {
        height: 5em;
    }
}

/*================================================*/
/*                TEMPLATE ABOUT                  */
/*================================================*/
/*------------------- History --------------------*/
#history-title .title-back {
    position: relative;
    z-index: -999;
}

#history {
    position: relative;
}
#history:before {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    height: 100%;
    border-left: thick dotted #f4cba2;
}
#history .history-block {
    max-width: 53%;
    padding: 3% 5%;
    margin-right: 0;
    margin-left: auto;
}
#history .history-block .history-content {
    padding: 5%;
    background-color: #f45905;
    color: #ffffff;
    -webkit-transform: translateX(-10%);
    transform: translateX(-10%);
    -webkit-transition: 1s;
    transition: 1s;
    position: relative;
}
#history .history-block .history-content:before {
    content: "";
    position: absolute;
    top: 42%;
    left: -23px;
    display: inline-block;
    height: 0;
    width: 0;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-right: 24px solid #f45905;
}
#history .history-block h3 {
    margin: 0;
}
#history .history-block .date {
    color: #f4cba2;
}
#history .history-block:nth-child(3n) .history-content {
    background-color: #f0722d;
}
#history .history-block:nth-child(3n) .history-content:before {
    border-left-color: #f0722d;
    border-right-color: #f0722d;
}
#history .history-block:nth-child(3n + 1) .history-content {
    background-color: #f2925e;
}
#history .history-block:nth-child(3n + 1) .history-content:before {
    border-left-color: #f2925e;
    border-right-color: #f2925e;
}
#history .scroll-img .history-content {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

@media screen and (min-width: 992px) {
    #history .history-block:nth-of-type(odd) {
        margin-right: auto;
        margin-left: 0;
    }
    #history .history-block:nth-of-type(odd) .history-content {
        -webkit-transform: translateX(10%);
        transform: translateX(10%);
        -webkit-transition: 1s;
        transition: 1s;
    }
    #history .history-block:nth-of-type(odd) .history-content:before {
        right: -23px;
        left: auto;
        border-right: 0;
        border-left: 24px solid #f45905;
    }
    #history .history-block:nth-of-type(odd) h3:before {
        left: -9.3%;
    }
    #history .history-block:nth-child(3n) .history-content:before {
        border-left-color: #f0722d;
        border-right-color: #f0722d;
    }
    #history .history-block:nth-child(3n + 1) .history-content:before {
        border-left-color: #f2925e;
        border-right-color: #f2925e;
    }
    #history .scroll-img:nth-of-type(odd) .history-content {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@media screen and (max-width: 768px) {
    #history:before {
        right: 95%;
    }
    #history .history-block {
        max-width: 95%;
    }
}

/*------------------- Group --------------------*/
#group {
    background-color: #f4cba2;
}
#group .skill-img {
    left: 40%;
}
#group .group-content {
    max-width: 60%;
    padding: 5% 2%;
    background-color: #f4cba2;
    position: relative;
    z-index: 9;
}
#group h3 {
    margin-bottom: 5%;
}
#group .number-title {
    margin: 5% 0 8% 0;
}

@media screen and (max-width: 768px) {
    #group .skill-img {
        left: 0;
        bottom: 70%;
    }
    #group .group-content {
        max-width: 100%;
        margin-top: 60%;
    }
}

/*================================================*/
/*         TEMPLATE TECHNOLOGY & PRODUCT          */
/*================================================*/
.application-container {
    height: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
}

#products-container h5 {
    margin-bottom: 5%;
}

/*----------- Switch Product ---------------*/
#myTab .switch-link {
    background-color: #ffffff;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    font-weight: 900;
    padding: 3%;
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

#myTab p {
    margin-bottom: 0.3em;
    padding: 0.5em 1em;
}

#myTab .switch-product {
    position: relative;
}

#myTab .link-arrow {
    background: url(../image/arrow.svg) no-repeat;
    width: 0.8em;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transition: 0.35s ease-in-out;
    transition: 0.35s ease-in-out;
}

#myTab .active {
    background-color: #f45905;
    color: #ffffff;
}
#myTab .active .link-arrow {
    background: url(../image/arrow-white.svg) no-repeat;
    width: 0.8em;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

/*----------- Product list ---------------*/
.product-container {
    background-color: #ffffff;
    padding: 5%;
    margin-top: 5%;
    margin-bottom: 5%;
    height: 100%;
}
.product-container .product-title {
    font-weight: 900;
    border-bottom: solid 2px #f4cba2;
    padding-bottom: 3%;
}
.product-container .product-title p {
    margin-bottom: 0;
}
.product-container .product-title .product-color {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.product-container .product-title .circle-block {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: end;
    justify-content: flex-end;
}
.product-container .product-title .circle-color {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
.product-container .product-content .subtitle {
    margin-top: 2em;
    margin-bottom: 0.3em;
    color: #f45905;
}

/*----------- Product Table---------------*/
#product-table .product-table-container {
    display: -webkit-box;
    display: flex;
    margin-top: 5%;
}
#product-table .product-table-container .item-container {
    -webkit-box-flex: 0;
    flex: 0 0 75%;
    max-width: 75%;
    overflow-x: scroll;
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);
    display: -webkit-box;
    display: flex;
}
#product-table .product-table-container .item-container .item-prod {
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);
    min-width: 30%;
    margin-right: 5px;
    margin-left: 5px;
}
#product-table .product-table-container #product-filter {
    background-color: #f0722d;
    color: #ffffff;
    -webkit-box-flex: 0;
    flex: 0 0 25%;
    max-width: 25%;
}
#product-table .product-table-container #product-filter #param-color {
    padding: 1em;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
#product-table .product-table-container #product-filter #param-color p {
    margin-bottom: 0;
}
#product-table .product-table-container #product-filter .product-param {
    cursor: pointer;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
#product-table .product-table-container #product-filter .product-param:hover {
    background-color: #f45905;
}
#product-table .product-table-container #product-filter .active-asc,
#product-table .product-table-container #product-filter .active-asc:hover,
#product-table .product-table-container #product-filter .active-desc,
#product-table .product-table-container #product-filter .active-desc:hover {
    position: relative;
    background-color: #f45905;
}
#product-table .product-table-container #product-filter .active-asc::before {
    content: "↑";
    color: #ffffff;
    position: absolute;
    width: 15px;
    height: 100%;
    right: 0;
}
#product-table .product-table-container #product-filter .active-desc::before {
    content: "↓";
    color: #ffffff;
    position: absolute;
    width: 15px;
    height: 100%;
    right: 0;
}

#product-table .item-prod {
    background-color: #ffffff;
    padding: 0;
}
#product-table .item-prod .product-param {
    padding: 0.5em 1em;
    height: 4em;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
#product-table .item-prod .product-param p {
    margin-bottom: 0;
}

/*----------- Modal leaf download ---------------*/
#leafModal a,
#leafModal input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#leafModal a::before,
#leafModal input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#leafModal a:active,
#leafModal a:visited,
#leafModal input[type="submit"]:active,
#leafModal input[type="submit"]:visited {
    color: #f0722d;
}
#leafModal a:hover,
#leafModal a:focus,
#leafModal input[type="submit"]:hover,
#leafModal input[type="submit"]:focus {
    color: #ffffff;
}
#leafModal a:hover::before,
#leafModal a:focus::before,
#leafModal input[type="submit"]:hover::before,
#leafModal input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/*----------- Features description ---------------*/
#technology-desc {
    padding-top: 4%;
    background-color: #ffffff;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    
    /*my*/
    display: flex;
    display: -webkit-flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
}

.technology-img {
    position: relative;
    overflow: hidden;
    min-height: 30em;
    
    /*my*/
    width: 50%;
}

.technology-img .bgimg-content {
    display: flex;
    align-items: center;
}

.features-content {
    padding: 10% 5% 5% 7%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
    background-color: #f4cba2;
    width: 50%;
}
.features-content .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
}
.features-content h3 {
    margin-bottom: 5%;
}

#products-container {
    margin: 10% auto;
}

@media screen and (min-width: 768px) {
    #product-table .product-table-container #product-filter #param-name {
        height: 5em;
        padding-top: 1em;
    }
}

@media screen and (max-width: 768px) {
    #product-table .product-table-container #product-filter {
        max-width: 100%;
        min-width: 40%;
    }
    #product-table .product-table-container .item-container {
        max-width: 60%;
    }
    #product-table .product-table-container .item-container .item-prod {
        min-width: 100%;
    }
}

@media screen and (max-width: 576px) {
    .product-title h3 {
        text-align: center;
        margin-bottom: 7%;
    }
    #product-table .product-table-container #product-filter {
        min-width: 50%;
    }
    #product-table .product-table-container .item-container {
        max-width: 50%;
    }
}

/*================================================*/
/*                TEMPLATE SECTORS                */
/*================================================*/
/*------------------- Header ---------------------*/
.page-header-secteur {
    padding-top: 40vh;
}

.sector-content {
    width: 80%;
    padding: 3%;
    background-color: #f45905;
    color: #ffffff;
}

#sector-page {
    margin-top: 10%;
    margin-bottom: 10%;
}

.sector-container {
    margin-top: 30px;
    padding: 0;
    position: relative;
    min-height: 30em;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
}
.sector-container .sector-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: all ease-out 0.5s;
    transition: all ease-out 0.5s;
}
.sector-container .title {
    margin-bottom: 0;
    padding: 3%;
    text-align: center;
    color: #ffffff;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 1.5em;
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6);
    z-index: 1;
}
.sector-container .sector-content {
    padding: 8%;
    z-index: 5;
    background-color: #19171c;
    -webkit-transform: translateX(-97%);
    transform: translateX(-97%);
    opacity: 0.5;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
}
.sector-container .sector-content a,
.sector-container .sector-content button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.sector-container .sector-content a:hover,
.sector-container .sector-content a:focus,
.sector-container .sector-content a:active,
.sector-container .sector-content button:hover,
.sector-container .sector-content button:focus,
.sector-container .sector-content button:active {
    color: #ffffff;
}
.sector-container .sector-content a::before,
.sector-container .sector-content button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.sector-container .sector-content a:hover::before,
.sector-container .sector-content a:focus::before,
.sector-container .sector-content button:hover::before,
.sector-container .sector-content button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.sector-container .sector-content a {
    margin-bottom: -0.65em;
}
.sector-container .sector-content .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
    z-index: -1;
}
.sector-container:hover .sector-image,
.sector-container:focus .sector-image {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}
.sector-container:hover .sector-content,
.sector-container:focus .sector-content {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

@media screen and (max-width: 768px) {
    .sector-container {
        min-height: 35em;
    }
}

/*--------------- Application -----------------*/
#applications,
#videos {
    margin-top: 5%;
    margin-bottom: 5%;
    text-align: center;
}

#applications .title-scale {
    color: #f45905;
}

.appgrid-container {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: stretch;
    justify-content: stretch;
}

.application-grid {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.application-grid .grid-title {
    width: 100%;
    min-height: 7em;
    padding: 1% 3%;
    text-transform: uppercase;
    background-color: #19171c;
    color: #ffffff;
}

.grid2 {
    margin-top: 3%;
    padding: 3%;
    height: 100%;
    background-color: #f4cba2;
}

.grid3 {
    position: relative;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
    background-color: #ffffff;
}
.grid3 .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
    box-shadow: none;
}
.grid3 .appli-list {
    padding: 5%;
    height: 100%;
}

/*--------------- Technologies link -----------------*/
.techno-appli {
    margin: 15px auto;
    
    width: 33%;
}
.techno-appli .white-block {
    position: relative;
    overflow: hidden;
    height: 100%;
    background-color: #ffffff;
}
.techno-appli .white-block .block-img {
    height: 12em;
}
.techno-appli .white-block .block-title {
    padding-top: 5%;
}

/*--------------- File download -----------------*/
#file-container {
    margin: 10% auto;
}

.file-img {
    background: url(../image/file.svg) no-repeat center;
}

.file-content {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: stretch;
    align-items: stretch;
    margin: 2% 15% 2% 0;
}
.file-content .file-title {
    background-color: #f4cba2;
    padding: 2% 0 0.2% 2%;
    -webkit-box-flex: 2;
    flex-grow: 2;
    margin-right: 2%;
}
.file-content .file-link {
    background: url(../image/download.svg) no-repeat top center, #f0722d;
    background-size: 65%;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    width: 4em;
}
.file-content .file-link:hover,
.file-content .file-link:focus {
    background: url(../image/download.svg) no-repeat top center, #19171c;
    background-size: 70%;
}
.file-content .modal {
    z-index: 99999;
}
.file-content .modal-content {
    background-color: #fef7ef;
}
.file-content .modal-content .frm_description {
    font-weight: 900 !important;
}

/*--------------- Website link -----------------*/
#website-link {
    margin-top: 10%;
}
#website-link a,
#website-link input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
#website-link a::before,
#website-link input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
#website-link a:active,
#website-link a:visited,
#website-link input[type="submit"]:active,
#website-link input[type="submit"]:visited {
    color: #f0722d;
}
#website-link a:hover,
#website-link a:focus,
#website-link input[type="submit"]:hover,
#website-link input[type="submit"]:focus {
    color: #ffffff;
}
#website-link a:hover::before,
#website-link a:focus::before,
#website-link input[type="submit"]:hover::before,
#website-link input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
#website-link .row-link {
    -webkit-box-pack: center;
    justify-content: center;
}
#website-link a,
#website-link a:visited,
#website-link a:active {
    color: #19171c;
    border-color: #19171c;
}
#website-link a:before,
#website-link a:visited:before,
#website-link a:active:before {
    background: #19171c;
    border-color: #19171c;
}
#website-link a:hover,
#website-link a:focus,
#website-link a:visited:hover,
#website-link a:visited:focus,
#website-link a:active:hover,
#website-link a:active:focus {
    color: #ffffff;
}
#website-link p {
    margin-bottom: 0;
}
#website-link .weblink-content {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

@media screen and (max-width: 1280px) {
    .sector-content {
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .appli-list {
        margin-top: 30px;
        height: auto;
    }
    .application-grid {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
    }
    .application-grid .grid-title-standard,
    .application-grid .appli-description-standard {
        width: 100%;
        margin-bottom: 15px;
    }
    .application-grid .title-img {
        width: 100%;
        min-height: 10em;
    }
    .grid2 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        flex-direction: column-reverse;
    }
    .file-content {
        margin: 2% 0;
        font-size: 0.9em;
    }
}

@media screen and (max-width: 576px) {
    .grid3 {
        margin: 15px;
    }
}

/*================================================*/
/*                TEMPLATE SKILLS                 */
/*================================================*/
.main-skill {
    margin-bottom: 5%;
}

.skills-link {
    padding-top: 4%;
    margin-bottom: 5%;
}
.skills-link a,
.skills-link input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.skills-link a::before,
.skills-link input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.skills-link a:active,
.skills-link a:visited,
.skills-link input[type="submit"]:active,
.skills-link input[type="submit"]:visited {
    color: #f0722d;
}
.skills-link a:hover,
.skills-link a:focus,
.skills-link input[type="submit"]:hover,
.skills-link input[type="submit"]:focus {
    color: #ffffff;
}
.skills-link a:hover::before,
.skills-link a:focus::before,
.skills-link input[type="submit"]:hover::before,
.skills-link input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.skills-link .skills-button {
    width: 100%;
}
.skills-link .link-active a {
    color: #19171c;
    border-color: #19171c;
}
.skills-link .link-active a:before {
    content: none;
}

.skill-template a,
.skill-template button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.skill-template a:hover,
.skill-template a:focus,
.skill-template a:active,
.skill-template button:hover,
.skill-template button:focus,
.skill-template button:active {
    color: #19171c;
}
.skill-template a::before,
.skill-template button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.skill-template a:hover::before,
.skill-template a:focus::before,
.skill-template button:hover::before,
.skill-template button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.skill-template ul {
    margin-bottom: 1em;
}

/*-------------------- Header --------------------*/
#skill .header-content {
    height: 80%;
}

.pres-content-skill {
    padding: 2% 3% 0 3%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

/*-------------------- Block --------------------*/
.skill-bloc-container {
    margin-bottom: 10%;
    margin-top: 10%;
}
.skill-bloc-container .title-back {
    text-align: center;
    margin-bottom: -3%;
}
.skill-bloc-container .skill-grid {
    padding-bottom: 30px;
}
.skill-bloc-container .skill-block {
    height: 100%;
    background-color: #ffffff;
    padding: 5% 2% 2% 2%;
    margin: 2%;
    box-shadow: 4px 4px 8px rgba(76, 75, 85, 0.16);
}
.skill-bloc-container .skill-block .skill-illu {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.skill-bloc-container .skill-block img {
    height: 8em;
    margin: auto;
}
.skill-bloc-container .skill-block .content {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
}

/*-------------------- Section --------------------*/
.white-section {
    background-color: #ffffff;
}
.white-section a {
    font-weight: 900;
    color: #f0722d;
}
.white-section a:hover,
.white-section a:focus,
.white-section a:active {
    color: #f0722d;
}
.white-section a::before {
    background-color: #f0722d;
}
.white-section .section-content {
    max-width: 60%;
    padding: 5%;
    position: relative;
    z-index: 9;
    background-color: #ffffff;
}
.white-section .section-content .orangeline {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
}
.white-section .skill-img {
    left: 40%;
}

.black-section {
    background-color: #19171c;
}
.black-section a,
.black-section button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
    color: #ffffff;
}
.black-section a:hover,
.black-section a:focus,
.black-section a:active,
.black-section button:hover,
.black-section button:focus,
.black-section button:active {
    color: #ffffff;
}
.black-section a::before,
.black-section button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.black-section a:hover::before,
.black-section a:focus::before,
.black-section button:hover::before,
.black-section button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.black-section .section-content {
    max-width: 60%;
    margin-right: 0;
    margin-left: auto;
    padding: 5%;
    color: #ffffff;
    position: relative;
    z-index: 9;
    background-color: #19171c;
}
.black-section .section-content .orangeline {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 15px;
    height: auto;
}
.black-section .skill-img {
    right: 40%;
}

/*--------------------------------------------------------------
## Medias queries
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
    #skill {
        margin-bottom: 20%;
    }
    .black-section .section-content {
        max-width: 100%;
        margin-top: 60%;
    }
    .black-section .skill-img {
        right: 0;
        bottom: 70%;
    }
    .white-section .section-content {
        max-width: 100%;
        margin-top: 60%;
    }
    .white-section .skill-img {
        left: 0;
        bottom: 70%;
    }
}

/*================================================*/
/*               PAGE IMPLANTATION                */
/*================================================*/
.filters-society {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    list-style: none;
}
.filters-society a,
.filters-society button {
    position: relative;
    overflow: hidden;
    padding: 0.3em 0;
}
.filters-society a:hover,
.filters-society a:focus,
.filters-society a:active,
.filters-society button:hover,
.filters-society button:focus,
.filters-society button:active {
    color: #19171c;
}
.filters-society a::before,
.filters-society button::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: #19171c;
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    -webkit-transform: translateX(-101%);
    transform: translateX(-101%);
}
.filters-society a:hover::before,
.filters-society a:focus::before,
.filters-society button:hover::before,
.filters-society button:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.filters-society li {
    margin: 0 2%;
}
.filters-society .filter-active:before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

#society {
    margin-bottom: 10%;
}
#society .acf-map {
    margin-top: -5%;
    height: 70vh;
}

.link-implantations a,
.link-implantations input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.link-implantations a::before,
.link-implantations input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.link-implantations a:active,
.link-implantations a:visited,
.link-implantations input[type="submit"]:active,
.link-implantations input[type="submit"]:visited {
    color: #f0722d;
}
.link-implantations a:hover,
.link-implantations a:focus,
.link-implantations input[type="submit"]:hover,
.link-implantations input[type="submit"]:focus {
    color: #ffffff;
}
.link-implantations a:hover::before,
.link-implantations a:focus::before,
.link-implantations input[type="submit"]:hover::before,
.link-implantations input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

@media screen and (max-width: 576px) {
    .filters-society {
        display: block;
    }
}

/*================================================*/
/*                 TEMPLATE 404                   */
/*================================================*/
.error-404 {
    min-height: 100vh;
}
.error-404 a,
.error-404 input[type="submit"] {
    font-size: 0.8em;
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
    padding: 1em 2em;
    border: solid 2px #f0722d;
    color: #f0722d;
    overflow: hidden;
    position: relative;
    z-index: 1;
    margin: 5% 0;
}
.error-404 a::before,
.error-404 input[type="submit"]::before {
    content: "";
    background: #f0722d;
    border: solid 2px #f0722d;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(-120%);
    transform: translateX(-120%);
    -webkit-transition: -webkit-transform 0.25s ease-in;
    transition: -webkit-transform 0.25s ease-in;
    transition: transform 0.25s ease-in;
    transition: transform 0.25s ease-in, -webkit-transform 0.25s ease-in;
    z-index: -1;
}
.error-404 a:active,
.error-404 a:visited,
.error-404 input[type="submit"]:active,
.error-404 input[type="submit"]:visited {
    color: #f0722d;
}
.error-404 a:hover,
.error-404 a:focus,
.error-404 input[type="submit"]:hover,
.error-404 input[type="submit"]:focus {
    color: #ffffff;
}
.error-404 a:hover::before,
.error-404 a:focus::before,
.error-404 input[type="submit"]:hover::before,
.error-404 input[type="submit"]:focus::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
.error-404 .row {
    margin-top: 15%;
}
.error-404 .white-block {
    background-color: #ffffff;
    padding: 5%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
}
.error-404 .img-404 {
    background: url(../image/404.jpg) no-repeat center;
    background-size: cover;
    min-height: 25em;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    z-index: -99;
}

@media screen and (max-width: 768px) {
    .error-404 .row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        flex-direction: column-reverse;
        overflow: hidden;
    }
    .error-404 .img-404 {
        -webkit-transform: scale(1);
        transform: scale(1);
        margin-bottom: -50px;
    }
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
    /* Theme Footer (when set to scrolling) */
    display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
    display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Medias
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
    max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
    display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

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

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
    margin-bottom: 1.5em;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}
.gallery-columns-2 .gallery-item {
    max-width: 50%;
}
.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
    max-width: 25%;
}
.gallery-columns-5 .gallery-item {
    max-width: 20%;
}
.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-caption {
    display: block;
}

.row-nomarg-list {
    display: flex;
	display: -webkit-flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-content: center;
	align-items: center;
	justify-content: flex-start;
    
}

#switch-list {
    display: none!important;
}

#product-list{
   display: none;    
}