/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* FONTS */
@font-face {
    font-family: "AileronRegular";
    src: url("../font/AileronRegular.otf") format("opentype");
}

@font-face {
    font-family: "AileronLight";
    src: url("../font/AileronLight.otf") format("opentype");
}

@font-face {
    font-family: "AileronBold";
    src: url("../font/AileronBold.otf") format("opentype");
}

@font-face {
    font-family: "AileronBlack";
    src: url("../font/AileronBlack.otf") format("opentype");
}

@font-face {
    font-family: "AileronUltraLight";
    src: url("../font/AileronUltraLight.otf") format("opentype");
}

body {
    font-family: "AileronRegular";
    color:#443E42;
    width:100%;
}

ul {
    list-style-type: none;
    margin:0;
    padding:0;
}

.header_content .nav li {
    font-family: "AileronBlack" !important;
    text-transform: uppercase;
    color:#BE0022;
    font-size:3em;

    min-width:16% !important;
}

.header_active_menu {
    color:#BE0022 !important;
}

span.btn_icon {
color:#000; !important;
}

.uppercase {
    text-transform: uppercase;
}

.red_title {
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#BE0022;
    font-size:3em;
}

.red_title_small {
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#BE0022;
    font-size:1.5em;
}

.white_title {
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#fff;
    font-size:3em;
}

.red {
    color:#BE0022;
}

.aileronbold {
    font-family: "AileronBold";
}

button:focus {outline:0;}
input:focus {outline:0;}


.main_container {
    width:80%;
    margin:0 10%;
    margin-bottom:80px;
    float:left;
}

.main_container_blanc {
    width:80%;
    margin:0 10%;
    margin-bottom:80px;
    float:left;
}

.fleche_bas {
    z-index:10000;
}

.fleche_bas a {
    color:red;
}

.nav li a {
    border:none !important;
    box-shadow: none !important;

}
.header_content .nav li a {
    padding:0 !important;
}

.nav li:before {
    border:none !important;
    box-shadow: none !important;
}

.footer {
float:left;
}

/* ==========================================================================
   PICTOGRAMMES HABILLAGE
   ========================================================================== */

/* HOMEPAGE */

.intro_soleil1 {width:5%; max-width:60px; min-width:30px; margin-left:30%; margin-top:80px;}
@media screen and (max-width: 800px) {.intro_soleil1 {margin-top:30px;}}

.intro_soleil1 img {width:70%;}

.intro_soleil2 {width:8%; max-width:90px; min-width:45px; margin-left:67%;}

.intro_soleil2 img {width:80%;}

.intro_barre1 {
    width:30%;
    height:10px;
    background-color:#342F33;
    margin-left:50%;
}

.intro_barre2 {
    width:20%;
    height:10px;
    background-color:#342F33;
    margin-left:18%;
}

.langues_home_container {
    position:absolute;
    bottom:10px;
    right:0;
}

.langues_home {
    font-family:"AileronLight";
    padding:10px 0 10px 0 !important;
    text-align: right;
}

.langues_home .active_lang {
    font-family:"AileronBold";
    color: #BE0022;
}

.langues_home a {
    color: #443E42;
}

.langues_home a:hover {
    color: #BE0022;
}

/* GROUPE */
.histo_barre1 {
    width:10%;
    height:10px;
    background-color:#342F33;
    margin-left:5%;
}
.histo_circle_top {
    width:50px;
    position: relative;
    top:-15px;
    margin-left:30px;
    margin-bottom:20px;
}
.histo_circle_top img {
    width:100%;
}
@media screen and (max-width: 780px) {.histo_container_top {display:none;}}


.histo_boules {
    margin-left:75%;
    width:10%;
}
.histo_boules img {
    width:100%;
}
/* EXPERTISES */

.container_exp_row {width:100%; float:left; height:90px; }
.cxr_top {padding-top:30px;}

@media screen and (max-width: 750px) {
    .cxr_bot_ach {padding-bottom:100px;}
    .cxr_bot_fab {padding-bottom:190px;}
    .cxr_bot_qua {padding-bottom:190px;}
    .cxr_bot_log {padding-bottom:250px;}
}

@media screen and (max-width: 480px) {
    .cxr_bot_ach {padding-bottom:100px;}
    .cxr_bot_fab {padding-bottom:170px;}
    .cxr_bot_qua {padding-bottom:130px;}
    .cxr_bot_log {padding-bottom:180px;}
}
.exp_intro_img_container {width:100%; max-width:500px; margin:0 auto;}
.exp_intro img {width:100%;}

.icon_exp_ach_barre {width:20%; max-width:166px; min-width:83px; margin-left:60%; margin-top:20px; float:left;} .icon_exp_ach_barre img {width:100%;}
.icon_exp_ach_circle_top {width:3%; max-width:26px; min-width:13px; margin-left:5%; margin-top:20px; float:left;
    position:relative; top:-10px;} .icon_exp_ach_circle_top img {width:100%;}

.icon_exp_ach_boules {width:20%; max-width:174px; min-width:87px; float:left;
    position:relative; left:-150px; top:-100px;} .icon_exp_ach_boules img {width:100%;}
.icon_exp_ach_circle_bot {width:10%; max-width:54px; min-width:27px; margin-left:13%; float:left;
    position:relative; top:30px;} .icon_exp_ach_circle_bot img {width:100%;}
.icon_exp_ach_soleil {width:15%; max-width:100px; min-width:50px; margin-left:33%; float:left;} .icon_exp_ach_soleil img {width:100%;}


.icon_exp_fab_soleil {width:8%; max-width:50px; min-width:25px; float:left; margin-left:55%;} .icon_exp_fab_soleil img {width:100%;}

.icon_exp_fab_soloball {width:15%; max-width:88px; min-width:44px; margin-left:13%; float:left;
    position:relative; top:60px;} .icon_exp_fab_soloball img {width:100%;}
.icon_exp_fab_redball {width:3%; max-width:18px; min-width:9px; margin-left:31%; float:left;
    position:relative; top:120px;} .icon_exp_fab_redball img {width:100%;}
.icon_exp_fab_solcontour {width:15%; max-width:102px; min-width:51px; margin-left:19%; float:left;
    position:relative; top:10px;} .icon_exp_fab_solcontour img {width:100%;}


.icon_exp_qua_barre_top {width:3%; max-width:12px; min-width:10px; margin-left:10%; float:left;} .icon_exp_qua_barre_top img {width:100%;}
.icon_exp_qua_soloballext {width:15%; max-width:188px; min-width:94px; margin-left:50%; float:left;} .icon_exp_qua_soloballext img {width:100%;}

.icon_exp_qua_solcontour {width:10%; max-width:122px; min-width:61px; float:left;
    position:relative; left:-50px;} .icon_exp_qua_solcontour img {width:100%;}
.icon_exp_qua_barre_bot {width:3%; max-width:20px; min-width:10px; margin-left:60%; float:left;} .icon_exp_qua_barre_bot img {width:100%;}


.icon_exp_log_solcomplex {width:12%; max-width:70px; min-width:35px; margin-left:6%; float:left; position:relative; top:-10px;} .icon_exp_log_solcomplex img {width:100%;}
.icon_exp_log_sol8balls {width:5%; max-width:50px; min-width:25px; margin-left:42%; float:left;
    position:relative; top:30px;} .icon_exp_log_sol8balls img {width:100%;}
.icon_exp_log_barre_top {width:3%; max-width:20px; min-width:10px; margin-left:8%; float:left;
    position:relative; top:85px;} .icon_exp_log_barre_top img {width:100%;}

.icon_exp_log_soloball {width:20%; max-width:140px; min-width:70px; margin-left:10%; float:left;
    position:relative; top:100px;} .icon_exp_log_soloball img {width:100%;}
.icon_exp_log_barre_bot {width:3%; max-width:20px; min-width:10px; margin-left:32%; float:left;
    position:relative; top:10px;} .icon_exp_log_barre_bot img {width:100%;}

.expertises_mobile {
    display:none;
}




@media screen and (max-width: 750px) {
    .expertises_pc {display:none;}
    .expertises_mobile {
        display:block;
    }
}


/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

/* FadeIn SIMPLE */
.fadeIn {
    -webkit-animation: fadeIn 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeIn 500ms; /* Firefox < 16 */
    -ms-animation: fadeIn 500ms; /* Internet Explorer */
    -o-animation: fadeIn 500ms; /* Opera < 12.1 */
    animation: fadeIn 500ms;
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0;}
    100% { opacity: 1;}
}
@-o-keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

/* FadeIn LEFT/RIGHT */
.fadeInLeft {
    -webkit-animation: fadeInLeft 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeft 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeft 500ms; /* Internet Explorer */
    -o-animation: fadeInLeft 500ms; /* Opera < 12.1 */
    animation: fadeInLeft 500ms;
}

@-webkit-keyframes fadeInLeft {
    0% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeft {
    0% {opacity: 0; -o-transform: translateX(-500px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeft {
    0% {opacity: 0; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(-500px);}
    100% {opacity: 1; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(0);}
}

.fadeInRight {
    -webkit-animation: fadeInRight 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInRight 500ms; /* Firefox < 16 */
    -ms-animation: fadeInRight 500ms; /* Internet Explorer */
    -o-animation: fadeInRight 500ms; /* Opera < 12.1 */
    animation: fadeInRight 500ms;
}

@-webkit-keyframes fadeInRight {
    0% {opacity: 0; -webkit-transform: translateX(500px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInRight {
    0% {opacity: 0; -o-transform: translateX(500px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInRight {
    0% {opacity: 0; -webkit-transform: translateX(500px); -o-transform: translateX(500px); transform: translateX(500px);}
    100% {opacity: 1; -webkit-transform: translateX(500px); -o-transform: translateX(500px); transform: translateX(0);}
}

/* FadeIn ROTATE LEFT/RIGHT */
.fadeInRotateLeft {
    -webkit-animation: fadeInRotateLeft 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInRotateLeft 500ms; /* Firefox < 16 */
    -ms-animation: fadeInRotateLeft 500ms; /* Internet Explorer */
    -o-animation: fadeInRotateLeft 500ms; /* Opera < 12.1 */
    animation: fadeInRotateLeft 500ms;
}

@-webkit-keyframes fadeInRotateLeft {
    0% {opacity: 0; -webkit-transform: translateX(-500px) rotate(0deg);}
    100% { opacity: 1; -webkit-transform: translateX(0) rotate(360deg);}
}
@-o-keyframes fadeInRotateLeft {
    0% {opacity: 0; -o-transform: translateX(-500px) rotate(0deg);}
    100% {opacity: 1; -o-transform: translateX(0) rotate(360deg);}
}
@keyframes fadeInRotateLeft {
    0% {opacity: 0; -webkit-transform: translateX(-500px) rotate(0deg); -o-transform: translateX(-500px) rotate(0deg); transform: translateX(-500px) rotate(0deg);}
    100% {opacity: 1; -webkit-transform: translateX(-500px) rotate(360deg); -o-transform: translateX(-500px) rotate(360deg); transform: translateX(0) rotate(360deg);}
}

.fadeInRotateRight {
    -webkit-animation: fadeInRotateRight 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInRotateRight 500ms; /* Firefox < 16 */
    -ms-animation: fadeInRotateRight 500ms; /* Internet Explorer */
    -o-animation: fadeInRotateRight 500ms; /* Opera < 12.1 */
    animation: fadeInRotateRight 500ms;
}

@-webkit-keyframes fadeInRotateRight {
    0% {opacity: 0; -webkit-transform: translateX(500px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInRotateRight {
    0% {opacity: 0; -o-transform: translateX(500px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInRotateRight {
    0% {opacity: 0; -webkit-transform: translateX(500px); -o-transform: translateX(500px); transform: translateX(500px) rotate(0deg);}
    100% {opacity: 1; -webkit-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0) rotate(360deg);}
}

/* FadeInLeft DELAYED SOFT */

.fadeInLeft2 {
    -webkit-animation: fadeInLeft2 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeft2 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeft2 500ms; /* Internet Explorer */
    -o-animation: fadeInLeft2 500ms; /* Opera < 12.1 */
    animation: fadeInLeft2 500ms;
}

@-webkit-keyframes fadeInLeft2 {
    0% {opacity: 0; -webkit-transform: translateX(-500px);}
    20% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeft2 {
    0% {opacity: 0; -o-transform: translateX(-500px);}
    20% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeft2 {
    0% {opacity: 0; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(-500px);}
    20% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% {opacity: 1; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(0);}
}

.fadeInLeft3 {
    -webkit-animation: fadeInLeft3 3s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeft3 3s; /* Firefox < 16 */
    -ms-animation: fadeInLeft3 3s; /* Internet Explorer */
    -o-animation: fadeInLeft3 3s; /* Opera < 12.1 */
    animation: fadeInLeft3 3s;
}

@-webkit-keyframes fadeInLeft3 {
    0% {opacity: 0; -webkit-transform: translateX(-500px);}
    33% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeft3 {
    0% {opacity: 0; -o-transform: translateX(-500px);}
    33% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeft3 {
    0% {opacity: 0; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(-500px);}
    33% {opacity: 0; -webkit-transform: translateX(-500px);}
    100% {opacity: 1; -webkit-transform: translateX(-500px); -o-transform: translateX(-500px); transform: translateX(0);}
}

/* FadeInLeft DELAYED ROUGH */

/* Level 1 */
.fadeInLeftDelayed1 {
    -webkit-animation: fadeInLeftDelayed1 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeftDelayed1 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeftDelayed1 500ms; /* Internet Explorer */
    -o-animation: fadeInLeftDelayed1 500ms; /* Opera < 12.1 */
    animation: fadeInLeftDelayed1 500ms;
}

@-webkit-keyframes fadeInLeftDelayed1 {
    0% {opacity: 0; -webkit-transform: translateX(-300px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeftDelayed1 {
    0% {opacity: 0; -o-transform: translateX(-300px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeftDelayed1 {
    0% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    100% {opacity: 1; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(0);}
}

/* Level 2 */
.fadeInLeftDelayed2 {
    -webkit-animation: fadeInLeftDelayed2 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeftDelayed2 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeftDelayed2 500ms; /* Internet Explorer */
    -o-animation: fadeInLeftDelayed2 500ms; /* Opera < 12.1 */
    animation: fadeInLeftDelayed2 500ms;
}

@-webkit-keyframes fadeInLeftDelayed2 {
    0% {opacity: 0; -webkit-transform: translateX(-300px);}
    50% {opacity: 0; -webkit-transform: translateX(-300px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeftDelayed2 {
    0% {opacity: 0; -o-transform: translateX(-300px);}
    50% {opacity: 0; -o-transform: translateX(-300px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeftDelayed2 {
    0% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    50% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    100% {opacity: 1; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(0);}
}

/* Level 3 */
.fadeInLeftDelayed3 {
    -webkit-animation: fadeInLeftDelayed3 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeftDelayed3 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeftDelayed3 500ms; /* Internet Explorer */
    -o-animation: fadeInLeftDelayed3 500ms; /* Opera < 12.1 */
    animation: fadeInLeftDelayed3 500ms;
}

@-webkit-keyframes fadeInLeftDelayed3 {
    0% {opacity: 0; -webkit-transform: translateX(-300px);}
    66% {opacity: 0; -webkit-transform: translateX(-300px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeftDelayed3 {
    0% {opacity: 0; -o-transform: translateX(-300px);}
    66% {opacity: 0; -o-transform: translateX(-300px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeftDelayed3 {
    0% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    66% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    100% {opacity: 1; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(0);}
}

/* Level 4 */
.fadeInLeftDelayed4 {
    -webkit-animation: fadeInLeftDelayed4 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeftDelayed4 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeftDelayed4 500ms; /* Internet Explorer */
    -o-animation: fadeInLeftDelayed4 500ms; /* Opera < 12.1 */
    animation: fadeInLeftDelayed4 500ms;
}

@-webkit-keyframes fadeInLeftDelayed4 {
    0% {opacity: 0; -webkit-transform: translateX(-300px);}
    75% {opacity: 0; -webkit-transform: translateX(-300px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeftDelayed4 {
    0% {opacity: 0; -o-transform: translateX(-300px);}
    75% {opacity: 0; -o-transform: translateX(-300px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeftDelayed14 {
    0% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    75% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    100% {opacity: 1; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(0);}
}

/* Level 5 */
.fadeInLeftDelayed5 {
    -webkit-animation: fadeInLeftDelayed5 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInLeftDelayed5 500ms; /* Firefox < 16 */
    -ms-animation: fadeInLeftDelayed5 500ms; /* Internet Explorer */
    -o-animation: fadeInLeftDelayed15 500ms; /* Opera < 12.1 */
    animation: fadeInLeftDelayed5 500ms;
}

@-webkit-keyframes fadeInLeftDelayed5 {
    0% {opacity: 0; -webkit-transform: translateX(-300px);}
    80% {opacity: 0; -webkit-transform: translateX(-300px);}
    100% { opacity: 1; -webkit-transform: translateX(0);}
}
@-o-keyframes fadeInLeftDelayed5 {
    0% {opacity: 0; -o-transform: translateX(-300px);}
    80% {opacity: 0; -o-transform: translateX(-300px);}
    100% {opacity: 1; -o-transform: translateX(0);}
}
@keyframes fadeInLeftDelayed5 {
    0% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    80% {opacity: 0; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(-300px);}
    100% {opacity: 1; -webkit-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateX(0);}
}

/* CARRIERES/CONTACT FadeIn TOP */
.fadeInTop {
    -webkit-animation: fadeInTop 500ms; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadeInTop 500ms; /* Firefox < 16 */
    -ms-animation: fadeInTop 500ms; /* Internet Explorer */
    -o-animation: fadeInTop 500ms; /* Opera < 12.1 */
    animation: fadeInTop 500ms;
}

@-webkit-keyframes fadeInTop {
    0% {-webkit-transform: translateY(-500px);}
    100% {-webkit-transform: translateY(0);}
}
@-o-keyframes fadeInTop {
    0% {-o-transform: translateY(-500px);}
    100% {-o-transform: translateY(0);}
}
@keyframes fadeInTop {
    0% {-webkit-transform: translateY(-500px); -o-transform: translateY(-500px); transform: translateY(-500px);}
    100% {-webkit-transform: translateY(-500px); -o-transform: translateY(-500px); transform: translateY(0);}
}

/* ==========================================================================
   HOMEPAGE
   ========================================================================== */

.index_intro {
    font-family: "AileronLight";
    text-transform: uppercase;
    font-size:2.5em;
    margin-left:18%;
    margin-top:90px;
    margin-bottom:75px;
    text-align:left;
}



.alt_index_intro {

    margin-left:18%;
    margin-top:90px;
    margin-bottom:75px;
    text-align:left;
}

.alt_index_intro span {
    font-family: "AileronBlack";
    font-size:2.5em;
}

.alt_index_intro div#intro_small {
    font-size:1.2em !important;
}

#intro_warning {
    display:none;
}

.backhome_alt_intro {
    float:left;
    margin-left:18%;
    margin-top:15px;
}

@media screen and (max-width: 750px) {
    .index_intro {margin-left:10%; margin-top:55px;}
    .alt_index_intro {margin-left:10%; margin-top:55px;}
    .backhome_alt_intro {margin-left:10%;}
    .intro_barre2 {margin-left:10%;}
}
@media screen and (max-width: 400px) {
    .index_intro br {margin-left:5%;display:none;}
    .alt_index_intro {margin-left:5%; margin-top:55px;}
    .backhome_alt_intro {margin-left:5%;}
    .intro_barre2 {margin-left:5%;}
}

.index_intro span {
    font-family:"AileronBlack";
}


.home_bg_row {
    padding-bottom:50px;
}

/* ==========================================================================
   GROUPE
   ========================================================================== */

.groupe_ul li {
    list-style-type:none;
    width:100%;
    float:left;
}

.groupe_general_cut {
    float:left;
    width:100%;
    height:1px;
    background-color:#a7a9ac;
    margin-top:10px;
}

.groupe_titre {
    font-family:"AileronBlack";
    width:100%;
    float:left;
    padding-bottom:50px;

}

.historique_bg {
    background-color: #F2F2F2;
}

.texte_historique {
    padding:0px 12%;
}

.groupe_valeurs_container {
    position:relative;
    width:100%;
    float:left;
}
.groupe_valeurs_container img {
    position:absolute;
}

#gp_icon1 {left:-50px; top:3px;}
#gp_icon2 {left:-47px; top:-6px;}
#gp_icon3 {left:-32px; top:-10px;}
#gp_icon4 {left:-47px; top:-15px;}
#gp_icon5 {left:-30px; top:-3px;}
#gp_icon6 {left:-45px; top:5px;}



.groupe_valeurs_item {
    font-family: "AileronBlack";
    color:#443E42;
    font-size:2em;
    padding-top:30px;
    position:relative;
    left:60px;
}

@media screen and (max-width: 450px) {
    .groupe_valeurs_item {float:left;left:10px;}
    .groupe_valeurs_container img {position:relative; height:50px;}
    #gp_icon1 {left:0; top:0;}
    #gp_icon2 {left:0; top:0;}
    #gp_icon3 {left:0; top:0;}
    #gp_icon4 {left:0; top:0;}
    #gp_icon5 {left:0; top:0;}
    #gp_icon6 {left:0; top:0;}
}

.gvi_light {
    font-family: "AileronLight";
}

.groupe_valeurs_cut {
    color:#BE0022;
    font-size:4em;
    width:33%;
    float:left;
    padding-top:30px;
    padding-bottom:30px;
    position:relative;
    left:100px;

}
@media screen and (max-width: 450px) {
    .groupe_valeurs_cut {left: 50px;}
}
.chiffres_cles_bg {
    background-color:#BE0022;
    margin:0;
    color:#fff;
}

.chiffres_left,
.chiffres_right {
    margin:auto;
}

.chiffres_left {
    border-right:1px solid #fff;
}

.chiffres_subcontainer {
    margin:auto;
}

.chiffres_subcontainer ul {
    text-align:center;
    margin:auto;
}

.chiffres_subcontainer ul li{
    display:inline-block;
}

.chiffres_cut {
    background-color:#443E42;
    width:2px;
    height:250px;
    margin-top:35px;
}


ul.chiffres_annees {
    width:20%;
    text-align:center;
}



.chiffres_annees li {
    display:inline-block;
    float:left;
    width:100%;
}

.chiffres_intitule {
    text-align:center;
    float:left;
    width:100%;
    margin:auto;
    font-family: "AileronBold";
    margin-top:30px;
    color:#222222;
}

.groupe_plan_row {
    height:400px;
}



@media screen and (max-width: 1250px) {.groupe_plan_row {height:300px;}}
@media screen and (max-width: 920px) {.groupe_plan_row {height:250px;}}
@media screen and (max-width: 600px) {.groupe_plan_row {height:200px;}}
@media screen and (max-width: 480px) {.groupe_plan_row {height:150px;}}
@media screen and (max-width: 380px) {.groupe_plan_row {height:120px;}}
@media screen and (max-width: 320px) {.groupe_plan_row {height:100px;}}






.implantations {
    margin-top:40px;
}

.implant_item {
    width:33%;
    float:left;
}

.imp_pays {font-size:2em;}
.imp_company {font-size:2em; font-family: "AileronBold";}
.imp_site {color:#BE0022;}
.imp_details {color:#4e5b6c; font-family: "AileronLight"; margin-bottom:30px;}

.certif_row {
    width:100%;
    float:left;
    margin-bottom:10px;
}

.certif_item {
    width:300px;
    float:left;
}

.certif_name {
    /* color:#BE0022; */
    font-family: "AileronBold";
}

.certif_cgv {
    margin-top:50px;}
}

/* ==========================================================================
   PRODUITS
   ========================================================================== */
.produits_title {
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#BE0022;
    font-size:3em;
}

.prd_row {
    margin-bottom:30px;
    width:100%;
    float:left;
}

.prd_item {
    font-family: "AileronBold";
    text-transform: uppercase;
    color:#BE0022;
    font-size:1.5em;
    width:90%;
    margin:0 auto;
    margin-bottom:50px;
}



.prd_item_title ul li:nth-child(1) {
    font-size:2em;
}

.prd_item_title ul li:nth-child(2) {
    font-size:3em;
}

.prd_item ul {
    float:left;
}

.prd_item1 ul,
.prd_item4 ul {
    float:right;
    text-align:right;
}

.prd_item img {
    float:left;
}


@media screen and (max-width:750px)  {
    .prd_item {width:100% !important; margin:0 !important;}
    .prd_item_title ul li:nth-child(2) {font-size:1.8em !important;}
}
/* Images */

.prd_row {width:100%; position:relative;}
.prd_row img {width:100%; float:left;}


#etude1 {width:60%;}
#prd_item1_title {width:40%; float:left;}

#etude2 {width:48%; float:left;}
#etude3 {width:48%; float:right;}

#prd_item2_title {width:40%; float:left;}
#fil1 {width:60%; float:right;}
#bg_fil_circle {width:100%;position:absolute; margin-left:30%; top:-190px; z-index: -1;}
#bg_fil_circle img {position:relative;}

#fil2 {width:48%; float:left;}
#fil3 {width:48%; float:right;}

#bg_cordon_balls {width:60%;position:absolute; left:-150px; top:-150px; z-index: -1;}
#bg_cordon_balls img {position:relative;}
#prd_item3_title {width:40%; float:left;}
#cordon1 {width:60%; float:right;}

#cordon2 {width:48%; float:left;}
#cordon3 {width:48%; float:right;}

.prd_item4_row1 {position:relative;}

#armoire1 {width:48%; float:right;}
#bg_armoire_bolts {width:20%;position:absolute; margin-left:50%; top:-400px; z-index: -1;}
#bg_armoire_bolts img {position:relative;}
#armoire2 {width:48%; float:left;}
#prd_item4_title {width:40%; float:right;}

#armoire3 {width:60%; float:left;}

/* ==========================================================================
   EXPERTISES
   ========================================================================== */

#exp_intro {
    font-family: "AileronBlack";
    font-size:2.5em;
    text-align:center;
    margin-top:10px;
}

#exp_intro div {
    margin-bottom:40px;
}

#exp_intro img {
    max-width:100%;
}

.expertises_left_menu_container {
    position:fixed;
    top:180px;
    left:20%;
    z-index:30000 !important;
}
@media screen and (max-width: 1900px) {.expertises_left_menu_container {left:20%;}}
@media screen and (max-width: 1800px) {.expertises_left_menu_container {left:18%;}}
@media screen and (max-width: 1700px) {.expertises_left_menu_container {left:15%;}}
@media screen and (max-width: 1600px) {.expertises_left_menu_container {left:12%;}}
@media screen and (max-width: 1500px) {.expertises_left_menu_container {left:9%;}}
@media screen and (max-width: 1400px) {.expertises_left_menu_container {left:7%;}}
@media screen and (max-width: 1300px) {.expertises_left_menu_container {left:4%;}}
@media screen and (max-width: 1200px) {.expertises_left_menu_container {left:2%;}}
@media screen and (max-width: 1100px) {.expertises_left_menu_container {left:0;}}

.expertises_left_menu_mobile {
    display:none;
}
.expertises_no_menu_title {
    display:none;

    font-family: "AileronBlack";
    text-transform: uppercase;
    text-align: center;
    font-size:1.5em;
    margin-top:30px;
}

.expertises_left_menu_mobile li {
    display:inline-block;
    float:left;
}

@media screen and (max-width: 1050px) {
    .expertises_left_menu {display:none;}
    .expertises_left_menu_container {top:90px; background-color: #F2F2F2; width: 100%}
    .expertises_left_menu_mobile {display:block; width:90%; margin:0 auto;}
}
@media screen and (max-width: 1000px) {
    .expertises_left_menu_container {top:55px;}
}

@media screen and (max-width: 750px) {
    .expertises_left_menu_mobile {display:none;}
    .expertises_no_menu_title {display:block;}
}

.expertises_left_menu {
    float:left;
    width:15%;
}

.expertises_left_menu li,
.expertises_left_menu_mobile li {
    text-transform:uppercase;
    font-family: "AileronBold";
}
.expertises_left_menu li {
    margin-bottom:10px;

}

.expertises_left_menu_mobile li {
    padding:0 15px;
    border-right:1px solid #4e5b6c;
}
.expertises_left_menu_mobile li:last-child {
    border:none;
}
.expertises_left_menu a,
.expertises_left_menu_mobile a {
    text-decoration:none;
    color:#443E42;
}

.expertises_left_menu a:hover, .expertises_left_menu a:focus,
.expertises_left_menu_mobile a:hover, .expertises_left_menu_mobile a:focus, .expertises_left_menu_mobile a:active {
    color:#BE0022;
}

.expertises_left_menu_tab {
    position:absolute;
    left:12%;
    top:112px;
    z-index:10000;
}

.expertises_left_menu_tab ul.nav li a {
    font-family: "AileronBold" !important;
    font-size :16px;
    font-weight:500;
    color:#443E42;
}

@media screen and (max-width: 1900px) {.expertises_left_menu_tab {left:12%;}}
@media screen and (max-width: 1800px) {.expertises_left_menu_tab {left:12%;}}
@media screen and (max-width: 1700px) {.expertises_left_menu_tab {left:12%;}}
@media screen and (max-width: 1600px) {.expertises_left_menu_tab {left:12%;}}
@media screen and (max-width: 1500px) {.expertises_left_menu_tab {left:9%;}}
@media screen and (max-width: 1400px) {.expertises_left_menu_tab {left:7%;}}
@media screen and (max-width: 1300px) {.expertises_left_menu_tab {left:4%;}}
@media screen and (max-width: 1200px) {.expertises_left_menu_tab {left:2%;}}
@media screen and (max-width: 1100px) {.expertises_left_menu_tab {left:0;}}

.expertises_left_menu_tab li {
    border:none !important;
    text-transform: uppercase !important;
    font-family: "AileronRegular";
    font-size:1em !important;
    text-align: left !important;
    display:block !important;
    float:left !important;
}

.expertises_left_menu_tab a {
    padding:0 !important;
}

.expertises_right_container {
    float:left;
    margin-left:4%;
    width:81%;

}

.exp_div{
    text-transform: uppercase;
    margin-left:200px;
    font-size:1.2em;
}

.exp_div li {
    margin-bottom:30px;
    font-family: "AileronLight";
}

.exp_div li span {
    font-family: "AileronBold";
}

.expertises_left_menu button {
    background-color:#fff !important;
    border:none !important;
    text-transform: uppercase;
    font-size:1.2em !important;
}

#exp_developper div {
    position:relative;
}

#exp_developper img {
    position:relative;
    max-width:100%;
    margin-top:220px;
    margin-bottom:100px;
}

/* ==========================================================================
   MARCHES
   ========================================================================== */

.marches_intro {
    font-family: "AileronLight";
    text-transform: uppercase;
    font-size:2.2em;
    line-height:1.2;
    margin-left: 0;
    margin-top:50px;
    text-align:center;
}

.marches_intro span {
    font-family: "AileronBlack";
    color:#BE0022;
}
@media screen and (max-width: 400px) {.marches_intro br {display:none;}}


.marches_soleil {width:5%; max-width:60px; min-width:30px; margin-left:15%;margin-bottom:30px;}
@media screen and (max-width: 800px) {.intro_soleil1 {margin-top:30px;}}

.marches_soleil img {width:70%;}

.marches_container {
    margin-left:13%;
    padding:0;
}
@media screen and (max-width: 991px) {.marches_container {margin-left:8%;}}
@media screen and (max-width: 600px) {.marches_container {margin-left:4%;}}


.marches_item {
    padding:0;
}

div.marches_txt {
    text-transform:uppercase;
    font-family: "AileronBlack";
    font-size:1.5em;
    color:#443E42;
    line-height:1;
}

div.marches_imgs {
    width:120px;
    height:120px;
    margin-bottom:5px;
    position:relative;
}

div.marches_imgs img {
    position:absolute;
    bottom:0;
}

/* ==========================================================================
   CARRIERES
   ========================================================================== */

.carrieres_bg {
    background-color:#BE0022;
    color:#fff;
}



.carrieres_join {
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#fff;
    font-size:3em;
    float:left;
    width:100%;
    margin-top:20px;
    margin-bottom:40px;
}

.carrieres_join .container {
    padding:0;
}

.carrieres_title {
    font-family: "AileronBold";
    width:100%;
    float:left;
    text-transform: uppercase;
    color:#fff;
    font-size:1.5em;
    margin-bottom:20px;
}

.carrieres_title span {
    border-bottom:3px solid #fff;
}

.carrieres_intro {
    font-weight: bold;
    margin-bottom:20px;
    float:left;

}

.carrieres_engagements {
    font-family: "AileronLight";
    list-style-type: none;
    margin:0;
    padding:0;
    float:left;

}

.carrieres_engagements span {
    font-family: "AileronBold";
}

.carrieres_engagements li {
    margin-bottom:20px;
}

.carrieres_engagements li a {
    color:#fff;
    border-bottom:1px solid #fff;
}

.carrieres_engagements_cop li {
    width:100%;
    float:left;
}


.cop_li_link {
    height:50px;
}

.gc_logo_div { width:88%;float:left;}
.gc_logo_ul {margin:0;}
.gc_logo_divimg {width:12%;float:left; border:1px solid white;}
.gc_logo_divimg img {width:100%;}
.gc_logo_divimg_mobile {display:none; }

@media screen and (max-width: 980px) {
    .gc_logo_div { width:75%}
    .gc_logo_divimg {width:20%; float:right;}
}

@media screen and (max-width: 480px) {
    .gc_logo_div { width:100%}
    .gc_logo_divimg {display:none;}
    .gc_logo_divimg_mobile {display:block;}
    .gc_logo_divimg_mobile img {width:120px; border:1px solid white;}
}

.carrieres-bouton-cop {
    font-family:"AileronLight" !important;
    color: #fff !important;
    padding: 6px 10px 6px 10px !important;
    border:1px solid #fff !important;
    background:none !important;
    border-radius:0 !important;
    font-size:1em !important;
    float:left !important;

    margin-bottom:10px;
    line-height:20px;

    text-align: center;

    cursor: pointer;
}


.carrieres-bouton-cop:hover,
.carrieres-bouton-cop:focus {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    background-color:#fff !important;
    color:#BE0023 !important;
    border:1px solid #BE0023 !important;
}


/* OFFRES */
.offre_container .row {
    margin-left:0;
    margin-right:0;
}

.offre_container .nav-tabs {
    margin:0;
    float:left;
}



.offre_titre {
    text-transform: uppercase;
    font-family: "AileronBlack";
    color:#BE0022;
    font-size:2em;
    margin-bottom:10px;
}

.offre_pdf_link {
    float:left;
    margin-top:13px;
    margin-left:15px;
}

.offre_pdf_link img {
    width:36px;
}

.offre_missions span {
    font-weight: bold;
}

.offre_sous-titre {
    text-transform: uppercase;
    font-family: "AileronBlack";
    margin-bottom:5px;
}
.offre_sous-titre_line {
    text-transform: uppercase;
    font-family: "AileronBlack";
}

.offre_contenu {
    margin-bottom:15px;
}

.offre_missions ul {
    margin-top:10px;
}

.offre_missions ul li {
    margin-left:20px;
}

.offre_missions ul li:first-child {
    margin-left:0;
    text-decoration: underline;
}

.postulez {
    text-transform: uppercase;
    font-family: "AileronBlack";
    font-size:2em;
    margin-bottom:20px;
}

/* ITEM OFFRES DISPLAY */
.item_no_offres_row {display:block; margin-top:50px;}
.item_offres_row {margin-top:50px;}
.item_offres_row_mobile {display:none;}

@media screen and (max-width: 1050px) {
    .all_postes {display: none;}
    .item_offres_row {display:none;}
    .item_offres_row_mobile {display:none;}
}

.item_offres a {
    display:block;
    width:200px;
    height:200px;
    border:3px solid #443E42;
    text-transform:uppercase;
    text-decoration:none;
    padding:20px;
    font-family:"AileronBold";
    font-size:1.2em;
    color:#443E42;
    background-image: url("../img/offres_arrow_bg.png");
}
.item_offres a:hover {
    background-image: url("../img/offres_arrow_bg_red.png");

}

@media screen and (max-width: 720px) {.item_offres a {width:120px; height:120px; font-size:0.8em; padding:10px; text-align:center;}}
@media screen and (max-width: 420px) {.item_offres a {width:100px; height:100px; font-size:0.6em;}}
@media screen and (max-width: 320px) {.item_offres a {width:80px; height:80px; font-size:0.5em;}}

.item_offres a:hover {
    border-color:#BE0022;
    color:#BE0022;
}
.form_offre {

}

.form_offre .col-md-3 {
    padding:0;
    margin-right:50px;
}
.postes_line {
    margin-bottom:20px;
}

.form_offre label {

}
.form_offre .postes_line label {
    font-family:"AileronUltraLight";
}
.form_offre input {
    -webkit-border-radius: 0;
    border-radius: 0;
    border:none;
    border-bottom: 3px solid #443E42;
    margin:0;
    padding:0;
    font-family:"AileronBold";
    background-color:transparent !important;
}

.form_offre input:hover,
.form_offre input:focus {
    border-color:#BE0022;
    color:#BE0022;
}

.form_offre .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.form_offre .inputfile + label {
    border:1px solid #443E42;
    color:#443E42;
}

.form_offre .inputfile:focus + label,
.form_offre .inputfile + label:hover {
    color:#BE0022;
    border:1px solid #BE0022;
}

.form_offre .inputfile:focus + label {
    outline: 1px dotted #443E42;
    outline: -webkit-focus-ring-color auto 5px;
}

.form_offre .inputsend_offres {
    font-family:"AileronLight" !important;
    float:left !important;
    color: #fff !important;
    background-color:#BE0022 !important;
    padding: 6px 40px 6.1px 40px !important;
    position:relative !important;
    top:15px !important;
    border:1px solid #BE0022 !important;
    border-radius:0 !important;
    font-size:1em !important;
}

.form_offre .inputsend_offres:hover,
.form_offre .inputsend_offres:focus {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    background-color:#fff !important;
    color:#BE0022 !important;
}
/* ==========================================================================
   CONTACT
   ========================================================================== */

.contact_join {
    z-index:-1;
    font-family: "AileronBlack";
    text-transform: uppercase;
    color:#fff;
    font-size:3em;
    width:100%;
    float:left;
    margin-top:20px;
    margin-bottom:20px;
}

/* ################################################################ */
/* ###################### PAGE CONTACT ############################ */
/* ################################################################ */


.contact_form {
    width:100%;
}

.contact_form ul {
    list-style-type: none;
    padding:0;
    margin-top:0;
}

.contact_form li {
    margin-top:30px;
}

.contact_form label {
    font-family:"AileronUltraLight";
    margin-bottom:0;
}

.label_font_bold {
    font-family:"AileronRegular" !important;
}

.contact_form input,
.contact_form select {
    -webkit-border-radius: 0;
    border-radius: 0;
    border:none;
    border-bottom: 3px solid #fff;
    margin:0;
    background-color:#BE0022;
    color:#fff;
    padding:0;
    font-family:"AileronBold";
}

.contact_form input:hover,
.contact_form input:focus {
    border-color:#c8c8c8;
}


.contact_form select {
    padding:0;
}

.contact_form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.contact_form option {
    backgrond-color:none;
}

.contact_form textarea {
    background-color: #BE0022;
    color:#fff;
}

.contact_form .red_spark {
    color:#fff;
}

.red_spark {
    color:#BE0022;
}

.form_left_block,
.form_right_block {
    width:50%;
    float:left;
    margin-bottom:40px;
}



.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    color: #fff;
    padding: 5px 40px;
    border:1px solid #fff;
}

.inputfile:focus + label,
.inputfile + label:hover {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    background-color:#fff;
    color:#BE0023;
    border:1px solid #BE0023;
}

.inputfile + label {
    cursor: pointer; /* "hand" cursor */
}

.inputfile:focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

#inputsend {
    font-family:"AileronLight" !important;
    color: #fff !important;
    padding: 6px 10px 6px 10px !important;
    border:1px solid #fff !important;
    background:none !important;
    border-radius:0 !important;
    font-size:1em !important;

    width:150px;
    line-height:20px;

}

#inputsend:hover,
#inputsend:focus {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    background-color:#fff !important;
    color:#BE0023 !important;
    border:1px solid #BE0023 !important;
}

.block_pj_send {
    width:100%;
    margin-top:15px;
    float:left;
}

.block_pj {
    float:left;
}
.block_send {
    float:right;
}

@media screen and (max-width: 600px) {
    .block_pj {float:left; width:100%;}
    .block_send {float:left; width:100%; margin-top:15px;}
}



#uploaded_file {
    display:none;
}

.uploaded_file_block_2 {
    width:100%;
}


#fileList {
    float:left;
    width:100%;
    border-bottom:3px solid #fff;
    margin-top:15px;
}

@media screen and (max-width: 600px) {#fileList{display:none;}}

#fileList ul, #fileList li {list-style-type: none; margin:0; padding:0;}
#fileList_cv ul, #fileList_cv li {list-style-type: none; margin:0; padding:0;}
#fileList_lm ul, #fileList_lm li {list-style-type: none; margin:0; padding:0;}

.label-file {
    font-family:"AileronLight" !important;
    color: #fff !important;
    padding: 6px 10px 6px 10px !important;
    border:1px solid #fff !important;
    background:none !important;
    border-radius:0 !important;
    font-size:1em !important;
    float:right !important;

    line-height:20px;
    width:150px;
    text-align: center;

    cursor: pointer;
}

.label-file:hover,
.label-file:focus {
    -webkit-transition: ease 0.6s;
    -moz-transition: ease 0.6s;
    -ms-transition: ease 0.6s;
    -o-transition: ease 0.6s;
    transition: ease 0.6s;
    background-color:#fff !important;
    color:#BE0023 !important;
    border:1px solid #BE0023 !important;
}
/* ###################### LEFT BLOCK ############################ */
.left_inputs,
.right_inputs{
    width:40%;
    float:left;
    font-family:"AileronBold";
}

.right_inputs {
    margin-left:30px;
}


/* ###################### RIGHT BLOCK ############################ */
.form_right_block select {
    width:100%;
}

.form_right_block textarea {
    width:100%;
    border: 1px solid #c8c8c8;
}

.frb_client_1 {
    width:48%;
    margin-right:2%;
    float:left;
    margin-bottom:30px;
}

.frb_client_2 {
    width:48%;
    margin-left:2%;
    float:left;
    margin-bottom:30px;
}

.votre_message_container {
    border:1px solid #fff;
    padding:10px;
}

.votre_message_container textarea {
    border:none;
    width:90%;
    padding:0;
}

.backhome_button {
    text-decoration:none;
    color:#fff;
}

.contact_form .slide-style-button {
    text-decoration:none;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: color;
    -o-transition-property: color;
    -moz-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    padding: 5px 40px;
    margin-top:10px;
    float:right;
    border:none;
    -webkit-border-radius: 0;
    border-radius: 0;
    background: #BE0023;
    color: #FFFFFF;
}

.contact_form .slide-style-button:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255,0.2);
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    -moz-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transition-property: transform;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform, -o-transform;
    -moz-transition-property: transform, -moz-transform;
    transition-property: transform, -webkit-transform, -moz-transform, -o-transform;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.contact_form .slide-style-button:hover,
.contact_form .slide-style-button:focus,
.contact_form .slide-style-button:active {
    color: #fff;
}

.contact_form .slide-style-button:hover:before,
.contact_form .slide-style-button:focus:before,
.contact_form .slide-style-button:active:before {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    -moz-transform: scaleX(1);
    transform: scaleX(1);
}


#form_erreurs {
    float:left;
    color:#fff;
    margin:0;
    margin-top:20px;
    padding:0;
    width:100%;
}

#form_erreurs_offre {
    float:left;
    margin:0;
    margin-bottom:10px;
    padding:0;
    width:100%;
}



@media screen and (max-width: 950px) {
    .form_left_block,
    .form_right_block {
        width:100%;
        float:left;
    }
}

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

    .left_inputs {

        width:45%;
        float:left;
    }



    .right_inputs{
        margin-left:10%;

        width:45%;
        float:right;
    }

    .left_inputs li,
    .right_inputs li {
        width:100%;
        overflow:hidden;
    }
}



/* ==========================================================================
   FOOTER
   ========================================================================== */

.footer {
    background-color:#fff;
    width:100%;
    padding:10px 0 20px 0;
}

.footer_groupe {
    position:absolute;
    bottom:0;
}

.footer a {
    color:#443E42;
    text-decoration:none;
}

.footer a:hover {
    color:#BE0023;
}


.sitemap {
    background-color:#F2F2F2;
    color:#BE0022;
}

.sitemap a {
    color: #BE0022;
}

.sitemap a:hover {
    color: #443E42;
}

.sitemap .col-xs-12 {
    padding:0;
}


.footer_logo {
    width:100px;
    padding:10px 0 10px 0 !important;
    margin-top:20px;
}



.footer_logo img {
    width:100%;
}

.footer_nav {
    margin-bottom:30px;
}
.footer_nav li {
    display:inline-block;
    float:left;
    font-family:"AileronBold";
    padding:10px 0 5px 0 !important;

}

.footer_nav li:nth-child(1) {text-align:left;}
.footer_nav li:nth-child(2) a {padding-left:10%;}
.footer_nav li:nth-child(3) a {padding-left:20%;}
.footer_nav li:nth-child(4) {text-align:right;}
.footer_nav li:nth-child(4) a {padding-right:20%;}
.footer_nav li:nth-child(5) {text-align:right;}
.footer_nav li:nth-child(5) a {padding-right:10%;}
.footer_nav li:nth-child(6) {text-align:right;}

@media screen and (max-width: 1000px) {
    .footer_nav li:nth-child(2) a {padding-left:0;}
    .footer_nav li:nth-child(3) a {padding-left:0;}
    .footer_nav li:nth-child(4) a {padding-right:0;}
    .footer_nav li:nth-child(5) a {padding-right:0;}
    .footer_nav li:nth-child(1), .footer_nav li:nth-child(4) {text-align: left;}
    .footer_nav li:nth-child(2), .footer_nav li:nth-child(5) {text-align: center;}
    .footer_nav li:nth-child(3), .footer_nav li:nth-child(6) {text-align: right;}
}

.footer-ml-lkn {
    border-bottom: 5px solid #BE0022;
    margin-bottom:10px;
}

.mentions-legales_footer {
    font-family:"AileronLight";
    padding:5px 0 7px 0 !important;
    float:left;
}

@media screen and (max-width: 600px) {.mentions-legales_footer {font-size:0.8em;}}

.linkedin_footer {
    font-size:2em;
    padding:5px 0 0 0 !important;
    float:right;
    position:absolute;
    right:0;
    bottom:0;

}

.linkedin_footer a {

}

.linkedin_footer i {

}

.footer .active_lang {
    color:#BE0023;
    font-family:"AileronBold";
}



.langues {
    font-family:"AileronLight";
    float:right;
    padding:10px 0 10px 0 !important;
}

@media screen and (max-width: 1450px) {.contact_titre p, .contact_form {width:80% !important;}}
@media screen and (max-width: 1060px) {.contact_titre p, .contact_form {width:85% !important;;}}
@media screen and (max-width: 780px) {.contact_titre p, .contact_form {width:90% !important;;}}
@media screen and (max-width: 480px) {.contact_titre p, .contact_form {width:95% !important;;}}


/* ==========================================================================
   MENTIONS LEGALES
   ========================================================================== */

.mentions-legales_content a {
    color:#BE0022;
}

.mentions-legales_content a:hover {
    color:#443E42;
}
.ml_red_title {
    margin-bottom:40px;
}

.ml_title {
    font-family: "AileronBlack";
    margin-bottom:10px;
    text-transform: uppercase}

.ml_item {
    margin-bottom:30px;
}

.ml_item span {
    font-family: "AileronBold";
}

.mentions-legales_content li {
    margin-bottom:10px;

}

/* ==========================================================================
   BACKHOME
   ========================================================================== */
a.red_link  {
    color:#BE0022 !important;
}

a.red_link:hover {
    color:#443E42 !important;
}
/* ==========================================================================
   ANIMATIONS
   ========================================================================== */

.slide-style-button {
    text-decoration:none;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: color;
    -o-transition-property: color;
    -moz-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    padding: 5px 10px;
    margin-top:5px;
    border:none;
    -webkit-border-radius: 0;
    border-radius: 0;
    background: #BE0022;
    color: #FFFFFF;
}

.slide-style-button:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255,0.2);
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    -moz-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transition-property: transform;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform, -o-transform;
    -moz-transition-property: transform, -moz-transform;
    transition-property: transform, -webkit-transform, -moz-transform, -o-transform;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.slide-style-button:hover,
.slide-style-button:focus,
.slide-style-button:active {
    color: #fff;
}

.slide-style-button:hover:before,
.slide-style-button:focus:before,
.slide-style-button:active:before {
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    -moz-transform: scaleX(1);
    transform: scaleX(1);
}


/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */
.isolated_container {
    float:left;

margin-bottom:15px;

}
.rgpd_container {
    border:1px solid #fff;
    padding:0 15px;
}

.isolated_container img.ext_link{width:12px;}
.isolated_container a,
.isolated_container a:hover,
.isolated_container a:visited,
.isolated_container a:focus
{color:#fff;}

@media screen and (max-width: 1000px) {
    .isolated_container {
    margin-right:15px;}


@media screen and (max-width: 1700px) {
    .header_menu {top:20px; width:100%;}
    .header_menu li {width:10%; text-align:center; font-size:0.9em;}
    .header_menu li.header_menu_logo { width:25%;}

    .main_container {width:75%; margin:0 12.5%; margin-top:140px; margin-bottom:80px;}
    .main_container_blanc {width:75%; margin:0 12.5%; margin-top:60px; margin-bottom:80px;}

    .carrieres_join, .contact_join {font-size:2.2em; width:100%; padding-top:20px;}


    .quotetitle input {font-size:23px; height:36px; width:36px; top:-47px;}

    .groupe_valeurs_item {font-size:1.7em;}
    .groupe_valeurs_cut {font-size:1.7em;}

    ul.chiffres_annees {font-size:0.9em;}


    .imp_pays {font-size:1.7em;}
    .imp_company {font-size:1.7em;}
    .imp_site {font-size:0.9em;}
    .imp_details {font-size:0.9em; margin-bottom:30px;}


    .marches_intro, .index_intro {font-size:2.2em;}
    .alt_index_intro span {font-size:2.2em;}

    .marches_intro {margin-top:20px;}

    .red_title, .white_title {font-size:2.4em;}
    .produits_title, .carrieres_title {font-size:1.5em;}

    div.marches_txt {font-size:1.7em;}
    div.marches_imgs {width:110px; height:110px;}
    div.marches_imgs img {width:100%;}


    .prd_item {font-size:1.4em;}


    #exp_intro {font-size:1.4em;}

    .expertises_left_menu {float:left; width:15%;}
    .expertises_left_menu li {margin-bottom:10px; font-size:0.9em;}
    .expertises_right_container {float:left;margin-left:4%;width:81%;}

    .exp_div {margin-left:150px; font-size:1.3em;}
    .exp_div li {margin-bottom:30px;}

}

@media screen and (max-width: 1350px) {
    .header_menu li {width:10%; text-align:center; font-size:0.8em;}

    .main_container {width:80%; margin:0 10%; margin-top:130px; margin-bottom:80px;}
    .main_container_blanc {width:80%; margin:0 10%; margin-top:60px; margin-bottom:80px;}

    .carrieres_join, .contact_join {font-size:1.9em; width:100%; padding-top:20px;}



    .quotetitle input {font-size:23px; height:33px; width:33px; top:-40px;}

    .groupe_valeurs_item {font-size:1.5em;}
    .groupe_valeurs_cut {font-size:1.5em;}

    ul.chiffres_annees {font-size:0.8em;}

    .imp_pays {font-size:1.5em;}
    .imp_company {font-size:1.5em;}
    .imp_site {font-size:0.8em;}
    .imp_details {font-size:0.8em; margin-bottom:30px;}


    .marches_intro, .index_intro {font-size:2em;}
    .alt_index_intro span {font-size:2em;}

    .red_title, .white_title {font-size:2.2em;}
    .produits_title, .carrieres_title {font-size:1.5em;}

    div.marches_txt {font-size:1.3em;}
    div.marches_imgs {width:100px; height:100px;}


    .prd_item {font-size:1.3em;}


    .expertises_left_menu {float:left; width:15%;}
    .expertises_left_menu li {margin-bottom:10px; font-size:0.8em;}
    .expertises_right_container {float:left;margin-left:4%;width:81%;}

    #exp_intro {font-size:1.3em;}

    #exp_developper img {margin-top:180px; margin-bottom:180px;}


    .exp_div {margin-left:150px; font-size:1.1em;}
    .exp_div li {margin-bottom:30px;}
}
@media screen and (max-width: 1200px) {
    .marches_intro, .index_intro {font-size:1.8em;}
    .alt_index_intro span {font-size:1.8em;}

}
@media screen and (max-width: 1000px) {
    .header_menu li {width:10%; text-align:center; font-size:0.7em;}

    .main_container {width:85%; margin:0 7.5%; margin-top:130px; margin-bottom:80px;}
    .main_container_blanc {width:85%; margin:0 7.5%; margin-top:50px; margin-bottom:80px;}

    .carrieres_join, .contact_join {font-size:1.7em; width:100%; padding-top:16px;}


    .quotetitle input {font-size:18px; height:30px; width:30px; top:-32px;}

    .groupe_valeurs_item {font-size:1.3em;}
    .groupe_valeurs_cut {font-size:1.3em;}

    .groupe_contenu.container {
        margin-bottom:50px;
    }

    ul.chiffres_annees {font-size:0.7em;}
    .chiffres_left {
        border:none !important;
    }

    .chiffres_left,
    .chiffres_right {
        margin-bottom:50px;
    }

    .imp_pays {font-size:1.3em;}
    .imp_company {font-size:1.3em;}
    .imp_site {font-size:0.7em;}
    .imp_details {font-size:0.7em; margin-bottom:30px;}

    .marches_intro, .index_intro {font-size:1.5em;}
    .alt_index_intro span {font-size:1.5em;}

    .red_title, .white_title {font-size:1.9em;}
    .produits_title, .carrieres_title {font-size:1.5em;}
    .red_title_small {font-size:1.3em;}
    div.marches_txt {font-size:1em;}
    div.marches_imgs {width:90px; height:90px;}


    .prd_item {font-size:1.1em;}
    #bg_cordon_balls {width:60%;position:absolute; left:-120px; top:-90px; z-index: -1;}
    #bg_armoire_bolts {width:20%;position:absolute; margin-left:50%; top:-250px; z-index: -1;}


    .expertises_left_menu {float:left; width:15%;}
    .expertises_left_menu li {margin-bottom:10px; font-size:0.7em;}
    .expertises_right_container {float:left;margin-left:4%;width:81%;}

    #exp_intro {font-size:1.2em;}
    #exp_intro div {margin-bottom:50px;}

    #exp_developper {margin-left:0;}
    #exp_developper img {margin-top:150px; margin-bottom:150px;}

    .exp_div {margin-left:150 px; font-size:1em;}
    .exp_div li {margin-bottom:30px;}


}

@media screen and (max-width: 750px) {
    .header_menu li {width:10%; text-align:center; font-size:0.6em;}

    .main_container {width:90%; margin:0 5%; margin-top:130px; margin-bottom:80px;}
    .main_container_blanc {width:90%; margin:0 5%; margin-top:40px; margin-bottom:80px;}

    .carrieres_join, .contact_join {font-size:1.5em; width:100%; padding-top:14px;}



    .quotetitle input {font-size:14px; height:25px; width:25px; top:-25px;}

    .groupe_valeurs_item {font-size:0.8em;}
    .groupe_valeurs_cut {font-size:0.8em;}

    .chiffres_subcontainer {width:100%;}
    ul.chiffres_annees {font-size:0.6em; width:20%;}


    .imp_pays {font-size:0.8em;}
    .imp_company {font-size:0.8em;}
    .imp_site {font-size:0.6em;}
    .imp_details {font-size:0.6em; margin-bottom:30px;}


    .marches_intro, .index_intro {font-size:1.2em;}
    .alt_index_intro span {font-size:1.2em;}


    .red_title, .white_title {font-size:1.3em;}
    .red_title_small {font-size:1em;}

    .produits_title, .carrieres_title {font-size:1.5em;}

    div.marches_txt {font-size:0.8em;}
    div.marches_imgs {width:70px; height:70px;}


    .prd_item {font-size:1em;}
    #bg_cordon_balls {width:50%;position:absolute; left:-70px; top:-70px; z-index: -1;}
    #bg_armoire_bolts {width:20%;position:absolute; margin-left:50%; top:-160px; z-index: -1;}


    #exp_intro {font-size:1.1em;}
    #exp_intro div {margin-bottom:40px;}

    #exp_developper img {margin-top:120px; margin-bottom:120px;}

    /*
    .expertises_left_menu {width:100%;}
    .expertises_left_menu button {padding:0; text-align:center;}
    .expertises_left_menu li {display:inline-block; text-align:center; margin-bottom:20px; font-size:0.5em; width:19%;}*/
    .expertises_right_container {margin-left:0;width:100%;}

    .exp_div {margin-left:0; font-size:1em;}
    .exp_div li {margin-bottom:15px;}
}
@media screen and (max-width: 600px) {

    #bg_cordon_balls {width:50%;position:absolute; left:-60px; top:-60px; z-index: -1;}
    #bg_armoire_bolts {width:20%;position:absolute; margin-left:50%; top:-130px; z-index: -1;}

    #inputsend, .label-file, #fileList {
       width:100% !important;
        float:left !important;
        text-align:center;
    }

    .inputfile + label {
        text-align:center;
        width:100% !important;
        float:left;
    }

}
@media screen and (max-width: 480px) {
    .header_menu li {width:10%; text-align:center; font-size:0.5em;}

    .main_container {width:95%; margin:0 2.5%; margin-top:130px; margin-bottom:80px;}
    .main_container_blanc {width:95%; margin:0 2.5%; margin-top:30px; margin-bottom:80px;}

    .carrieres_join, .contact_join {font-size:1.3em; width:100%; padding-top:12px;}


    .quotetitle input {font-size:11px; height:25px; width:25px; top:-22px;}

    .groupe_valeurs_item {font-size:0.6em;}
    .groupe_valeurs_cut {font-size:0.6em;}

    .chiffres_subcontainer {width:100%;}
    ul.chiffres_annees {font-size:0.5em; width:20%;}

    .imp_pays {font-size:0.6em;}
    .imp_company {font-size:0.6em;}
    .imp_site {font-size:0.5em;}
    .imp_details {font-size:0.5em; margin-bottom:30px;}

    .marches_intro, .index_intro {font-size:1em;}
    .alt_index_intro span {font-size:1em;}


    .red_title, .white_title {font-size:1.3em;}
    .produits_title, .carrieres_title {font-size:1.3em;}

    div.marches_txt {font-size:0.6em;}
    div.marches_imgs {width:50px; height:50px;}


    .prd_item {font-size:0.8em;}
    #bg_cordon_balls {width:70%;position:absolute; left:-60px; top:-60px; z-index: -1;}
    #bg_armoire_bolts {width:20%;position:absolute; margin-left:50%; top:-100px; z-index: -1;}


    #exp_intro {font-size:1em;}
    #exp_intro div {margin-bottom:30px;}

    #exp_developper img {margin-top:80px; margin-bottom:80px;}

    /*
    .expertises_left_menu {width:100%;}
    .expertises_left_menu button {padding:0; text-align:center;}
    .expertises_left_menu li {display:inline-block; text-align:center; margin-bottom:20px; font-size:0.5em; width:19%;}*/
    .expertises_right_container {margin-left:0;width:100%;}

    .exp_div {margin-left:0px; font-size:1em;}
    .exp_div li {margin-bottom:15px;}
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after,
    *:first-letter,
    *:first-line {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}