/*	Theme Name:  Atelier Alu
	Theme URI: https://alu.aeb-projets.dev
	Description: Atelier Alu
	Version: 1
	Author: A l'Encre bleue
	Author URI: https://alencrebleue.com
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-family: 'Overpass', sans-serif;
    font-style: normal;
    color: #2F2F2F;
}

html {
    margin: 0 !important;
}

body {
    background: #fff;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ul {
    list-style-type: none;
}

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

body {
    -webkit-font-smoothing: antialiased;
}

section {
    overflow: hidden;
}

blockquote {
    box-shadow: 0 3px 6px #00000029;
    padding: 0.25em 1.5em;
    background: rgba(255, 142, 223, 0.25);
    border-left: 5px solid #0072BC;
    margin: 1.5em 0;
    font-weight: 600;
}

/*-----------------------*\
    MARGE SUR MENU ADMIN (lorsque le menu est en fixe, il est caché en partie)
\*------------------------------------*/
.logged-in.admin-bar header {
    margin-top: 32px;
}

.logged-in.admin-bar #wpadminbar {
    z-index: 999999;
}

/*------------------------------------*\
    LA GRID
\*------------------------------------*/
* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.container {
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    width: 90%;
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.row>* {
    float: left;
    width: 100%;
}

.row::after {
    content: "";
    display: block;
    clear: both;
}

@media screen and (min-width:1200px) {
    .container {
        max-width: 1140px;
    }
}

@media screen and (min-width:1100px) and (max-width:1199px) {
    .container {
        max-width: 1060px;
    }
}

@media screen and (max-width:1099px) {
    .container {
        max-width: 90%;
    }
}

@media screen and (min-width:800px) {
    .row>* {
        padding-left: .9375em;
        padding-right: .9375em;
    }
}

/* Typographie */
h2 {
    font-size: 45px;
    line-height: 50px;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
}

h3 {
    font-size: 25px;
    line-height: 22px;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
}

p {
    font-weight: 400;
    font-size: 17px;
    line-height: 22px;
}

/*------------------------------------*\
    MAIN
\*------------------------------------*/
/* global box-sizing */
a {
    color: #0072BC;
    text-decoration: none;
}

a:hover {
    color: #ff0000;
}

a:focus {
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
}

input:focus {
    outline: 0;
}

:focus {
    outline: none;
}

/* IMG POUR WISIWYG */
img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
.attachment img,
.widget-container img {
    max-width: 100%;
    height: auto;
}

.alignleft,
img.alignleft {
    display: inline;
    float: left;
    margin-right: 24px;
    margin-top: 4px;
}

.alignright,
img.alignright {
    display: inline;
    float: right;
    margin-left: 24px;
    margin-top: 4px;
}

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

img.alignleft,
img.alignright,
img.aligncenter {
    margin-bottom: 12px;
}

hr {
    border: none;
}

hr.small {
    margin: 0.5em 0;
}

hr.medium {
    margin: 1em 0;
}

hr.large {
    margin: 2em 0;
}

@media only screen and (min-width: 801px) {
    .bloc-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .bloc-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .bloc-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.3%;
        flex: 0 0 33.3%;
        max-width: 33.3%;
    }

    .bloc-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .bloc-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .bloc-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66%;
        flex: 0 0 16.66%;
        max-width: 16.66%;
    }

    .bloc-2-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66%;
        flex: 0 0 66.66%;
        max-width: 66.66%;
    }

    .bloc-3-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .bloc-2-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 40%;
        flex: 0 0 40%;
        max-width: 40%;
    }

    .bloc-3-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 60%;
        flex: 0 0 60%;
        max-width: 60%;
    }

    .bloc-4-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 80%;
        flex: 0 0 80%;
        max-width: 80%;
    }
}

/*------------------------------------*\
    MISC
\*------------------------------------*/
::selection {
    background: #424242;
    color: #FFF;
    text-shadow: none;
}

::-webkit-selection {
    background: #424242;
    color: #FFF;
    text-shadow: none;
}

::-moz-selection {
    background: #424242;
    color: #FFF;
    text-shadow: none;
}

/* ================
==== COOKIES  =====
==================*/
/* BANDEAU COOKIE */
#cookie-notice .cookie-notice-container {
    display: block;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .04);
}

#cookie-notice,
#cookie-notice * {
    color: #fff;
}

body #cookie-notice .cn-button:not(.cn-button-custom) {
    color: #000;
    font-weight: 500;
}

@media screen and (max-width:422px) {
    body #cookie-notice .cn-button:not(.cn-button-custom) {
        margin: 0.5em;
    }
}

/*------------------------------------*\
    Modifié
\*------------------------------------*/

/* Section 1 */

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

#b1 {
    background-color: #393938;
}

#b1 .bloc-1 {
    position: relative;
}

#logoAlu {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media screen and (max-width:600px) {
    #b1 .container {
        max-width: 100%;
        margin: 0;
        width: 100%;
    }

    #imgAlu {
        height: 380px;
        width: 100%;
        object-fit: fill;
    }

    #logoAlu {
        height: 290px;
    }
}

/* Section 2 */

#b2 .bloc-2:first-child {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#b2 .bloc-2:nth-child(2) {
    padding-left: 0;
}

#b2 h3 {
    margin-bottom: 2em;
    font-size: 19px;
    font-weight: 300;
}

#b2 p {
    font-size: 16px;
    font-weight: 300;
    padding-right: 2em;
}

.exp_sf {
    color: #ff0400;
    font-weight: 700;
}

#trace1 {
    position: absolute;
    width: auto;
}

#b2 .container {
    position: relative;
}

#b2 .container:after {

    position: absolute;
    content: "";
    background-image: url(/wp-content/themes/alu/images/trace.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 465px;
    height: 661px;
    right: -21.2%;
    top: 20%;
}

@media screen and (max-width:1275px) {
    #b2 .container:after {
        display: none;
    }

    #b2 .bloc-2:first-child {
        position: relative;
    }

    #b2 .bloc-2:first-child:before {
        position: absolute;
        content: url(/wp-content/themes/alu/images/petite_trace.svg);
        left: -9%;
        top: 5%;
    }
}

@media screen and (min-width:926px) and (max-width:1030px) {
    #b2 .bloc-2:first-child:before {
        left: -10%;
    }
}

@media screen and (max-width:940px) {
    #b2 img {
        height: 350px;
        width: 100%;
    }
}

@media screen and (max-width:925px) {
    #b2 .bloc-2:first-child:before {
        left: -11%;
    }

    #b2 h3 {
        margin-bottom: 1em;
    }
}

@media screen and (max-width:910px) {
    #b2 p {
        padding-right: 0;
    }
}

@media screen and (max-width:853px) {
    #b2 h3 {
        line-height: 1.2;
    }

    #b2 p {
        line-height: 1.2;
    }
}

@media screen and (min-width:801px) and (max-width:840px) {
    #b2 .bloc-2:first-child:before {
        left: -12%;
    }
}

@media screen and (max-width:800px) {
    #b2 .bloc-2:first-child:before {
        display: none;
    }

    #b2 .bloc-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    #b2 .bloc-2:first-child {
        padding-right: 10px;
    }
}

@media screen and (max-width:741px) {
    #b2 .bloc-2:nth-child(1) {
        order: 2;
    }

    #b2 .bloc-2:nth-child(2) {
        order: 1;
    }

    #b2 .bloc-1 {
        order: 3;
    }

    #b2 .bloc-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    #b2 .bloc-2:first-child {
        margin: 2em 0;
        padding-right: 0;
    }

    #b2 .bloc-2:nth-child(2) {
        margin-top: 4px;
    }
}

@media screen and (min-width:409px) and (max-width:467px) {
    #b2 img {
        height: 250px;
    }
}

@media screen and (min-width:363px) and (max-width:408px) {
    #b2 img {
        height: 200px;
    }
}

@media screen and (max-width:362px) {
    #b2 img {
        height: 175px;
    }
}

@media screen and (max-width:325px) {
    #b2 .bloc-2:first-child {
        margin: 1em 0;
    }
}

/* Section 3 */

#b3 {
    margin: 4px 0;
}

#b3 img {
    height: 100%;
}

#b3 .bloc-3:first-child {
    padding-right: 2px;
}

#b3 .bloc-3:nth-child(2) {
    padding: 0 2px;
}

#b3 .bloc-3:last-child {
    padding-left: 2px;
}

#b3 h3 {
    color: #ffffff;
    font-size: 28px;
    font-weight: 100;
}

.filtre {
    position: relative;
    height: 100%;
    overflow: hidden;
}

.filtre img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

/* Hover pour les 3 pages 
.filtre:hover img {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}*/

.hover {
    /* supprimer cursor quand il y aura les 3 pages */
    cursor: auto;
    position: absolute;
    opacity: 1;
    z-index: 99;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(221, 21, 19, 0.5);
}

.hoverBloc {
    position: absolute;
    text-align: center;
    width: 100%;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#b3 .container {
    position: relative;
}

#b3 .container:after {
    position: absolute;
    content: url(/wp-content/themes/alu/images/petite_trace.svg);
    right: -5%;
    top: 62%;
}

@media screen and (min-width:871px) and (max-width:1050px) {
    #b3 .container:after {
        top: 55%
    }

    #b3 h3 {
        font-size: 25px;
    }
}

@media screen and (max-width:870px) {
    #b3 .container:after {
        right: -5.3%;
        top: 50%
    }

    #b3 h3 {
        font-size: 20px;
    }
}

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

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2),
    #b3 .bloc-3:last-child {
        padding-left: 0.9375em;
        padding-top: 0;
        padding-bottom: 0;
        padding-right: 0.9375em;
        height: 300px;
    }

    #b3 .container:after {
        display: none;
    }

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2) {
        margin-bottom: 4px;
    }

    #b3 .bloc-3 img {
        width: 100%;
        object-fit: cover;
    }

    #b3 h3 {
        font-size: 28px;
    }
}

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

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2),
    #b3 .bloc-3:last-child {
        padding-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        padding-right: 0;
    }
}

@media screen and (min-width:409px) and (max-width:467px) {
    #b3 h3 {
        font-size: 26px;
    }

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2),
    #b3 .bloc-3:last-child {
        height: 250px;
    }
}

@media screen and (max-width:408px) {
    #b3 h3 {
        font-size: 24px;
    }

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2),
    #b3 .bloc-3:last-child {
        height: 200px;
    }
}

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

    #b3 .bloc-3:first-child,
    #b3 .bloc-3:nth-child(2),
    #b3 .bloc-3:last-child {
        height: 175px;
    }
}

/* Section 4 */
#b4 {
    padding: 1em 0;
    background: #393938;
}

#b4 .bloc-1 {
    position: relative;
    max-width: 760px;
    margin: auto;
    z-index: 10;
}

#b4 h2 {
    color: #ff0400;
    font-size: 19px;
    text-align: center;
    font-weight: 400;
    margin-bottom: 1em;
    position: relative;
}

#b4 .gform-theme--foundation .gform_fields {
    grid-row-gap: 20px;
}

#gform_fields_1 input {
    min-height: 50px;
    border-radius: 0;
}

#gform_fields_1 input,
#gform_fields_1 textarea {
    font-weight: 500;
    font-size: 16px;
}

#gform_1 #choice_1_7_1 {
    min-height: auto;
}

#label_1_7_1 {
    color: #ffffff;
}

#champ-obli {
    color: #ffffff;
    font-style: italic;
    font-size: 14px;
}

#gform_1 .gform_footer {
    float: right;
    margin: 0;
}

#gform_submit_button_1 {
    background-color: #ff0400;
    border: 2px solid #ff0400;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0.25em 2em;
    line-height: 36px;
    border-radius: 0;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

#gform_submit_button_1:hover {
    background: #a90401;
    border: 2px solid #a90401;
}

#gform_confirmation_message_1 {
    color: white;
    text-align: center;
}

#b4 .container {
    position: relative;
}

#b4 .container:before {
    position: absolute;
    content: "";
    background-image: url(/wp-content/themes/alu/images/trace.svg);
    transform: rotate(180deg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 465px;
    height: 661px;
    left: -30%;
    top: 10%;
    z-index: 1;
}

@media screen and (max-width:1175px) {
    #b4 .container:before {
        display: none;
    }
}

@media screen and (max-width:800px) {
    #b4 h2:after {
        position: absolute;
        content: "";
        background-image: url(/wp-content/themes/alu/images/petite_trace.svg);
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        width: 52px;
        height: 72px;
        right: 24%;
        top: -16%;
    }
}

@media screen and (min-width:469px) and (max-width:640px) {
    #b4 h2:after {
        right: 15%;
    }
}

@media screen and (min-width:366px) and (max-width:468px) {
    #b4 h2:after {
        right: 4%;
    }
}

@media screen and (max-width:365px) {
    #b4 h2:after {
        right: -1%;
    }
}

@media (min-width: 640px) {
    #b4 .gform-theme--foundation .gform_fields {
        grid-column-gap: 30px;

    }

    #input_1_1_6_container {
        padding-left: 24px;
    }
}

@media screen and (max-width:639px) {
    #input_1_1_6_container {
        padding-top: 8px;
    }
}

/* Footer */

footer {
    background-color: #393938;
}

footer .row {
    align-items: center;
}

footer p,
footer a {
    color: white;
}

footer p {
    font-size: 14px;
    font-weight: 700;
}

footer a,
.credit {
    font-size: 10px;
    font-weight: 300;
}

footer img {
    width: 228px;
    height: 124px;
}

footer .bloc-2-3 {
    display: flex;
    flex-direction: column;
    text-align: center;
}

footer .bloc-3 {
    display: flex;
    justify-content: flex-start;
}

@media screen and (max-width:800px) {
    footer .bloc-2-3 {
        order: 2;
        margin-bottom: 1em;
    }

    footer .bloc-3 {
        order: 1;
        justify-content: center;
    }
}

/* Toute section */

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

    #b2,
    #b3,
    #b4 {
        margin-top: 2em;
    }
}

/* Header */

#menu-aeb {
    background-color: #393938;
    padding: 16px 0;
}

header img {
    width: 228px;
    height: 124px;
    float: left;
}

/* Page ML et PC */

#intro-page {
    background: #5c5c5c;
    padding: 3em 0;
}

#intro-page h1 {
    font-size: 50px;
    color: #ffffff;
    text-align: center;
}

.ariane p,
span {
    color: #FFF;
    text-align: center;
}

#breadcrumbs a {
    color: #FFF;
}

#breadcrumbs a:hover {
    color: #ff0400;
}

#mlpc {
    padding: 3em 0;
}

#mlpc h2 {
    line-height: 1.2;
    margin: 1em 0 0.5em;
    color: #cf0400;
}

#mlpc h3 {
    line-height: 1.2;
    margin: 1em 0 0.5em;
    color: #cf0400;
}

#mlpc h4 {
    line-height: 1.2;
    margin: 1em 0 0.5em;
    color: #000;
}

#mlpc h5 {
    text-decoration: underline;
    color: #000;
}

#mlpc p {
    font-size: 16px;
}

#mlpc a {
    color: #2F2F2F
}

#mlpc a:hover {
    color: #ff0400
}

#mlpc ol {
    padding-left: 1em;
}

#privacy-policy p {
    margin: 1em 0;
}

@media screen and (min-width: 769px) {
    #mlpc h2 {
        font-size: 36px;
    }

    #mlpc h3 {
        font-size: 28px;
    }

    #mlpc h4 {
        font-size: 20px;
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
    #mlpc h2 {
        font-size: 30px;
    }

    #mlpc h3 {
        font-size: 24px;
    }

    #mlpc h4 {
        font-size: 18px;
    }
}

@media screen and (max-width: 480px) {
    #mlpc h2 {
        font-size: 24px;
    }

    #mlpc h3 {
        font-size: 20px;
    }

    #mlpc h4 {
        font-size: 16px;
    }
}