@charset "utf-8";
/* CSS Document */

/*--RESET--*/
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, conclusion, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
conclusion, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
    animation: fadingbody 1.5s ease-in-out 0s forwards;
}
@keyframes fadingbody {
		0%   { opacity:0; }
		100% { opacity:1; }
	}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*--FIN RESET--*/

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
body {
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-family: Montserrat, Arial, "sans-serif";
    font-weight:normal;
    color: #333;
    line-height: 2em;
    background:#f1ece8;
}
@media (min-width: 1000px) {
    body {
        border: solid 20px white;
    }
}

h1, h2, h3, h4 {
    font-family: "Libre Baskerville", Times New Roman, serif;
    font-weight:400;
    line-height: 1.25;
    margin: 0;
    padding:0;
    color: #000;
    text-transform: none;
}
h1 {
    font-size: 4em;
    margin: 0 0 20px 0;
    word-break: inherit;
}
    h1 > strong {
        font-weight: normal;
		font-style: italic;
    }
h2 {
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 1px;
}
    h2:after {
        content: "";
        display: block;
        width: 40px;
        height: 1px;
        background: #333;
        margin: 20px 0 30px 0;
    }
.secteur > h2 {
    font-family: "Montserrat", Arial, "sans-serif";
    text-align: center;
    font-size: .8em;
    letter-spacing: 2px;
}
    .secteur > h2:after {
        width:20px;
        margin: 20px auto 0 auto;
    }
h2.center:after {
    margin: 20px auto 30px auto;
}
h3 {
    font-size: 1.5em;
    line-height: 1.5;
    margin-bottom: 10px;
}
h4 {
    font-family: "Montserrat", Arial, "sans-serif";
    line-height: 1.5em;
}
b, strong {
    font-weight: bold;
    color: #000;
}
em {
    font-style: italic;
}
a, a:active, a:link, a:visited {
    color: inherit;
    background: none;
    text-decoration: none;
    padding: 2px;
    -moz-box-shadow: 0 -4px 0 inset #d8c018;
    -webkit-box-shadow: 0 -4px 0 inset #d8c018;
    box-shadow: 0 -4px 0 inset #d8c018;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    transition: all .5s;
    transition-property: box-shadow;
}
    a:hover {
        color: #000;
        -moz-box-shadow: 0 -26px 0 inset #d8c018;
        -webkit-box-shadow: 0 -26px 0 inset #d8c018;
        box-shadow: 0 -26px 0 inset #d8c018;
        -moz-transition: all .5s;
        -webkit-transition: all .5s;
        transition: all .5s;
        -moz-transition-property: box-shadow;
        -webkit-transition-property: box-shadow;
        transition-property: box-shadow;
    }

a.lien,
a.lien:active,
a.lien:link,
a.lien:visited {
    float: none;        
    display:block;
    width:fit-content;
    max-width:90%;
    margin:40px auto 20px auto;
    padding:12px 28px;
    text-align: center;
    text-decoration: none;
    font-weight:bold;
    color: #222;
    line-height: 1.2;
    background: #e5ca19;
    -moz-border-radius: 200px;
    -webkit-border-radius: 200px;
    border-radius: 200px;
    -moz-transition: all .5s;
    -webkit-transition: all .5s;
    transition: all .5s;
    -moz-transition-property: background, color, box-shadow;
    -webkit-transition-property: background, color, box-shadow;
    transition-property: background, color, box-shadow;
}
    a.fondblanc,
    a.fondblanc:active,
    a.fondblanc:link,
    a.fondblanc:visited {
        -moz-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #fff, 10px 10px 0 0 #d8c018;
        -webkit-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #fff, 10px 10px 0 0 #d8c018;
        box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #fff, 10px 10px 0 0 #d8c018;
    }
    a.fondbeige,
    a.fondbeige:active,
    a.fondbeige:link,
    a.fondbeige:visited {
        -moz-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #d8c018;
        -webkit-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #d8c018;
        box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #d8c018;
    }
    a.lien.fondblanc:hover,
    a.lien.fondbeige:hover{
        color: #fff;
        /*background: #d8c018;
        background: #2437b3;*/
        background:#007379;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
        a.lien.arrright:after,
        a.lien.arrright:active:after,
        a.lien.arrright:link:after,
        a.lien.arrright:visited:after {
            content: "\2192";
            display: inline-block;
            color:inherit;
            margin-left: 15px;
        }
        a.lien.arrbottom:after,
        a.lien.arrbottom:active:after,
        a.lien.arrbottom:link:after,
        a.lien.arrbottom:visited:after{
            content: "\2193";
            display: inline-block;
            color:inherit;
            margin-left: 15px;
        }
            a.lien:hover:after,
            a.lien.arrbottom:hover:after{
                color:white;
                margin-left: 10px;
                -moz-transition: all .5s;
                -webkit-transition: all .5s;
                transition: all .5s;
                -moz-transition-property: margin;
                -webkit-transition-property: margin;
                transition-property: margin;
            }
        a.lien.arrleft:before,
        a.lien.arrleft:active:before,
        a.lien.arrleft:link:before,
        a.lien.arrleft:visited:before{
            content: "\2190";
            display: inline-block;
            color:inherit;
            margin-right: 15px;
        }
            a.lien.arrleft:hover:before{
                color:white;
                margin-right: 10px;
            }

p {
    margin: 0 0 10px 0;
    display: block;
}
blockquote {
    max-width: 70%;
    margin: 0 auto;
    padding:0;
    font-family: "Libre Baskerville", "Made Dillan", "Cervo Neue", Arial, "sans-serif";
    font-weight:400;
    font-size: 22px;
    color: #000;
    text-transform: none;
    text-align: center;
    line-height: 1.5em;
    position:relative;
}
blockquote:before {
    content: "";
    width: 15px;
    height: 15px;
    position: absolute;
    top: -20px;
    left: -20px;
    border-top: solid 2px #d8c018;
    border-left: solid 2px #d8c018;
    animation: blinker 8s step-start infinite;
}
blockquote:after {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: -20px;
    right: -20px;
    border-bottom: solid 2px #d8c018;
    border-right: solid 2px #d8c018;
    animation: blinker 8s step-start infinite;
}
@keyframes blinker {
    10% {
        opacity: 1;
    }    
    12% {
        opacity: 0;
    }
    13% {
        opacity: 1;
    }    
    16% {
        opacity: 0;
    } 
    17% {
        opacity: 1;
    }
}
blockquote.large {
    max-width:80%;
}
blockquote.full {
    max-width:none;
}
blockquote.right {
    float: right;
}
blockquote.left {
    float: left;
}
@media (min-width: 800px) {
    blockquote {
        max-width: 35%;
    }
}
@media (min-width: 1200px) {
    blockquote {
        font-size: 28px;
    }
}

ul { 
    margin: 0 0 20px 0;
    padding: 0;
    list-style: none;
}
li { 
    margin: 0 0 10px 30px;
    padding: 0;
}
    li:before {
      content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
      color: #d8c018; /* Change the color */
      font-weight: bold; /* If you want it to be bold */
      display: inline-block; /* Needed to add space between the bullet and the text */
      width: 1em; /* Also needed for space (tweak if needed) */
      margin-left: -1em; /* Also needed for space (tweak if needed) */
    }
img {
    touch-action: manipulation;
    width:100%;
}
/* ---------- HEADER ---------- */
.header {
    width: 100%;
    max-width: 90%;
    display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 40px 0 0 0;
    margin: 0 auto;
	border-bottom: solid 1px #d9cdc6;
}
.header > h1,
.header > h1 > a,
.header > h1 > a:active,
.header > h1 > a:link,
.header > h1 > a:visited {
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    margin: 20px 0;
    display: inline-block;
    z-index: 10;
    background: none;
    padding: 0;
    color: #222;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-text-shadow: none;
    -webkit-text-shadow: none;
    text-shadow: none;
    transition: all .5s;
    transition-property: text-shadow;
}
    .header > h1 a:hover {
        -moz-text-shadow: 0 1px 1px rgba(241, 236, 232, 0.5), 3px 6px 0 #d8c018;
        -webkit-text-shadow: 0 1px 1px rgba(241, 236, 232, 0.5), 3px 6px 0 #d8c018;
        text-shadow: 0 1px 1px rgba(241, 236, 232, 0.5), 3px 6px 0 #d8c018;
        -moz-transition: all .25s;
        -webkit-transition: all .25s;
        transition: all .25s;
        -moz-transition-property: text-shadow;
        -webkit-transition-property: text-shadow;
        transition-property: text-shadow;
    }
    .header > h1 > strong,
    .header > h1 > a > strong {
        display: block;
        font-size: 32px;
    }
    .header > h1 > em,
    .header > h1 > a > em,
    .header > h1 > em > #voyage,
    .header > h1 > a > em > #voyage {
        display: block;
        margin-top: 5px;
    }
@media (min-width: 500px) {
    .header > h1 > em > #voyage,
    .header > h1 > a > em > #voyage {
        display: inline;
    }
}
@media (min-width: 800px) {
    .header {
        flex-flow: row nowrap;
        align-items: center;
    }    
    .header > h1 > strong,
    .header > h1 > a > strong {
        font-size: 24px;
    }
    .header > h1,
    .header > h1 > a,
    .header > h1 > a:active,
    .header > h1 > a:link,
    .header > h1 > a:visited {
        text-align:  left;
        margin: 0 0 10px 0;
    }
}

.menu {
    display: inline-block;
    list-style-type: none;
    width: 100%;
}
.menu ul,
.menu li {
    display: flex;
    flex-flow: column wrap;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
    list-style-image: none;
    padding: 0;
    margin:0;
    text-align: right;
}
.menu li {
    border-top: solid 1px #d9cdc6;
    padding-top:10px;
    width:100%;
    position: relative;
}
.menu li:last-child {
    padding-bottom:10px;
}
.menu li:before {
    display: none;
}
.menu li:after {
    content: "\203A";
    opacity: .66;
    color: inherit;
    position: absolute;
    top: 0;
    right: 7px;
    transition: right .25s;
}
.menu li:hover:after {
    opacity:1;
    right: 0;
    color: #d8c018;
}
.menu li.active:after {
    display: none;
}
.menu li > a,
.menu li > a:active,
.menu li > a:link,
.menu li > a:visited {
    margin: 0 5px;
    padding: 0;
    background: none;
    display: block;
    text-align: right;
    line-height: 1em;
    color: #222;
    font-size: .9em;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-text-shadow: none;
    -webkit-text-shadow: none;
    text-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-transition: all .5s;
    -webkit-transition: all .5s;
    transition: all .5s;
    -moz-transition-property: color, text-shadow;
    -webkit-transition-property: color, text-shadow;
    transition-property: color, text-shadow;
}
    .menu li > a:hover {
        color: #d8c018;
        -moz-text-shadow: 0 1px 1px #fff;
        -webkit-text-shadow: 0 1px 1px #fff;
        text-shadow: 0 1px 1px #fff;
        -moz-transition: all .25s;
        -webkit-transition: all .25s;
        transition: all .25s;
    }
.menu li.active  > a,
.menu li.active  > a:active,
.menu li.active  > a:link,
.menu li.active  > a:visited {
    -moz-text-shadow: 0 1px 1px #fff;
    -webkit-text-shadow: 0 1px 1px #fff;
    text-shadow: 0 1px 1px #fff;
    -moz-box-shadow: 0 -8px 0 inset hsl(53,80%,47%,.5);
    -webkit-box-shadow: 0 -8px 0 inset hsl(53,80%,47%,.5);
    box-shadow: 0 -8px 0 inset hsl(53,80%,47%,.5);
    padding: 0 6px;
}
.menu.small {
    display: inline-block;
    position: absolute;
    top: 10px;
    right: 0;
}
.menu.small > ul {
    display: flex;
    flex-flow: row wrap;
    gap: 0;
    justify-content: center;
    align-items: center;
}
.menu.small li {
    border-top: none;
    padding:0;
    width:auto;
}
.menu.small li,
.menu.small li.active {
    display: inline-block;
    letter-spacing: 0;
    text-align: inherit;
    font-family: "Montserrat", "Cervo Neue", Arial, "sans-serif";
    opacity: .8;
    font-size: 10px;
    line-height: 1.5em;
    padding: 0;
    margin: 0 0 0 16px;
    text-transform: none;
}
.menu.small li > a,
.menu.small li > a:active,
.menu.small li > a:link,
.menu.small li > a:visited,
.menu.small li.active > a,
.menu.small li.active > a:active,
.menu.small li.active > a:link,
.menu.small li.active > a:visited {
    display: inline-block;
    letter-spacing: 0;
    text-align: inherit;
    font-family: "Montserrat", "Cervo Neue", Arial, "sans-serif";
    opacity: .8;
    font-size: 10px;
    line-height: 1.5em;
    padding: 0;
    margin: 0;
    text-transform: none;
}
.menu.small li:first-child {
    margin-left:0;
}
.menu > ul > li > ul.children {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    line-height: 1.4em;
    left: 0;
    width: 100%;
    background: rgba(216,192,24,.96);
    border-top: solid 1px #fff;
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
    text-align: center;
    -moz-box-shadow: 0 2px 4px rgba(0,0,0,.15);
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,.15);
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    -webkit-transition: opacity .75s ease,visibility 0s ease .75s;
    -o-transition: opacity .75s ease,visibility 0s ease .75s;
    transition: opacity .75s ease,visibility 0s ease .75s;
}
    .menu > ul > li:hover > ul.children {
        opacity: 1;
        visibility: visible;
        pointer-events: all;
        color: #fff;
        -webkit-transition: opacity .25s ease,visibility 0s ease;
        -o-transition: opacity .25s ease,visibility 0s ease;
        transition: opacity .25s ease,visibility 0s ease;
    }
.menu ul.children > li {
    border-bottom: solid 1px rgba(255,255,255,.25);
}
.menu ul.children > li:hover {
    background: #333;
}
.menu ul.children li > a,
.menu ul.children li > a:active,
.menu ul.children li > a:link,
.menu ul.children li > a:visited {
    text-align: center;
    font-size: 18px;
    text-transform: none;
    padding: 14px 6px;
    letter-spacing: 0.025em;
}
    .menu ul.children li:hover > a,
    .menu ul.children li:hover > a:active,
    .menu ul.children li:hover > a:link,
    .menu ul.children li:hover > a:visited {
        color:white;
        -moz-text-shadow: solid 1px #222;
        -webkit-text-shadow: solid 1px #222;
        text-shadow: solid 1px #222;
    }

@media (min-width: 800px) {
    .menu {
        width:auto;
    }
    .menu ul {
        margin-bottom: 20px;
    }
    .menu ul,
    .menu li {
        align-items: flex-end;
    }
    .menu li {
        border-top:none;
        padding-top:0;
        width:auto;
        margin-left: 20px;
    }
        .menu li:first-child {
            margin-left: 0;
        } 
        .menu li:last-child {
            padding-bottom:0;
        }
    .menu li:after {
        display: none;
    }
    .menu li > a,
    .menu li > a:active,
    .menu li > a:link,
    .menu li > a:visited {
        font-family: "Libre Baskerville", "Made Dillan", "Cervo Neue", Arial, "sans-serif";
        font-size: 18px;
        text-transform: none;
    }
}
@media (min-width: 1100px) {
    .menu.small > ul {
        justify-content: flex-end;
    }
        .menu.small li {
                margin-left: 16px;
        }
    .menu.small li:before {
        content: "";
        display: inline-block;
        width: 1px;
        height: 7px;
        background-color: #d9cdc6;
        position: relative;
        left: 0;
        bottom: 0;
        margin: 0 16px 0 0;
    }
    .menu.small li:first-child:before,
    .menu.small li:nth-child(2):before {
        display: none;
    }
    .menu ul,
    .menu li {
        flex-flow: row nowrap;
        gap: 0;
        text-align: center;
        margin-bottom: 0;
    }
    .menu li {
        display: inline-block;
        margin-left: 20px;
        position: relative;
    }
}


.icon {
  width: 11px;
  height: 11px;
  display: inline-block;
  vertical-align: middle;
  color: #333;
  fill: currentColor;
}
.icon.big {
    width:32px;
    height:32px;
}

/* ---------- HOME ---------- */
body.home {
    overflow: inherit;
}
.home-wrapper {
    width:100%;
    padding: 40px 0 0 0;
}
.home-wrapper > h2 {
    font-size: 32px;
    color: #fff;
    padding: 0 0 0 20px;
    display: block;
    position: absolute;
    top: 295px;
    left: 0;
    z-index: 10;
    text-align: left;
}
    .home-wrapper > h2 > strong {
        color: #f1ece8;
        -webkit-text-stroke: 2px #d8c018;
        text-stroke: 2px #d8c018;
        -webkit-text-fill-color: transparent;
        text-fill-color: transparent;
    }
    .home-wrapper > h2:after {
        display: none;
    }
.home-wrapper > .couv {
    z-index: 1;
    width: 100%;
}
.home-wrapper > p {
    display: block;
    width: 100%;
    margin: 40px 0 80px 0;
    padding: 0 40px;
    font-family: "Montserrat", "Cervo Neue", Arial, "sans-serif";
    font-size: 16px;
    font-weight:600;
    line-height: 2em;
}
@media (min-width:450px) {
    .home-wrapper > h2 { font-size: 44px; top: 315px; }
}
@media (min-width:600px) {
    .home-wrapper > h2 { font-size: 62px; top: 335px; padding-left: 30px; }
}
@media (min-width:700px) {
    body.home {
        width: 100%;
        overflow: hidden;
    }
    .home-wrapper {
        padding: 40px 100px 0 100px;
    }
    .home-wrapper > h2 {
        color: #000;
        top: 270px;
        left: 100px;
        padding: 0 30px;
    }
    .home-wrapper > h2 > strong {
        -webkit-text-stroke: 1px #d8c018;
        text-stroke: 1px #d8c018;
    }
    .home-wrapper > .couv {
        z-index: 1;
        position: relative;
        left: 437px;
        top: auto;
        width: auto;
    }
    .home-wrapper > p {
        display: block;
        position: absolute;
        top: 440px;
        z-index: 2;
        width: 420px;
        margin: 0;
        padding: 0 0 0 40px;
    }
}
@media (min-width:950px) {
    .home-wrapper > h2 {
        font-size: 90px;
        top: 240px;
    }
}
@media (min-width:1520px) {
    .home-wrapper > h2 {
        top: 300px;
        left: 100px;
        /* The typing effect */
        width: fit-content;
        overflow: hidden; /* Ensures the content is not revealed until the animation */
        min-height: 95px;
        padding-right: 10px;
        border-right: 3px solid #d8c018; /* The typwriter cursor */
        white-space: nowrap; /* Keeps the content on a single line */
        margin: 0 auto 20px auto; /* Gives that scrolling effect as the typing happens */
        animation: typing 2.5s steps(40, end), blink-caret .75s step-end infinite;
    }
    /* The typing effect */
    @keyframes typing {
      from { width: 0 }
      to { width: 100% }
    }
    /* The typewriter cursor effect */
    @keyframes blink-caret {
      from, to { border-color: transparent }
      50% { border-color: #d8c018; }
    }
}

/*---------- PROJETS ----------*/
.wrapper {
    width:80%;
    overflow-x:hidden;
    margin:0 auto;
}
h1 {
    font-size: 2.1em;
    overflow-wrap:break-word;
}
@media (min-width: 500px) {
    h1 {
    font-size: 3.1em;
    }
}
@media (min-width: 1100px) {
    .wrapper {
        width:90%;
    }
    .anim {
        width:100%;
        display:flex;
        flex-flow: row nowrap;
        align-items: stretch;
        align-content: space-between;
    }
    h1 {
        font-size: 4em;        
    }
    .anim h1 {
        overflow-wrap:normal;
        /* The typing effect */
        width: fit-content;
        overflow: hidden; /* Ensures the content is not revealed until the animation */
        min-height: 72px;
        padding-right: 10px;
        white-space: nowrap;  /* Keeps the content on a single line */
        -webkit-animation: typing 2.5s ease-out;
        animation: typing 2.5s ease-out;
    }
    .anim h2 {
        font-size: 1em;
        text-transform: uppercase;
        letter-spacing: 1px;
        overflow-wrap:normal;
        /* The typing effect */
        width: fit-content;
        overflow: hidden; /* Ensures the content is not revealed until the animation */
        min-height: 18px;
        padding-right: 10px;
        white-space: nowrap;  /* Keeps the content on a single line */
        opacity:0;
        -webkit-animation: typing 2.5s ease-out 2.5s forwards;
        animation: typing 2.5s ease-out 2.5s forwards;
    }    
    /* The typing effect */
    @-webkit-keyframes typing {
        from { width: 0; opacity:0; }
        to { width: 25%; opacity:1; }
        to { width: 100%; }
    }
    @keyframes typing {
        from { width: 0; opacity:0; }
        to { width: 25%; opacity:1; }
        to { width: 100%; }
    }
}

.txt {
    display:block;
	width: 80%;
    margin:40px auto;
}
.txt.secteur {
    display:block;
    width:100%;
    margin:100px auto 20px auto;
}
.txt.centre {
    text-align: center;
}
@media (min-width: 1000px) {
    .txt {
        width: 66%;
    }
    .txt.secteur {
        margin:40px auto 0 auto;
    }
}
.intro {
    margin-top: 80px;
}
.deuxcol {
	display: flex;
    flex-flow: column wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
}
    .deuxcol > h3,
    .deuxcol > p {
        width:100%;
        flex-grow: 1;
    }
.centrvertic {
    align-items: center !important;
}
@media (min-width: 1000px) {
    .deuxcol {
        flex-flow: row nowrap;
        gap: 30px;
    }
        .deuxcol > h3:nth-child(2),
        .deuxcol > p:nth-child(2) {
            margin-top: 20px;
        }
}
.contacter {
    margin: 20px auto 0 auto;
    padding-top: 15px;
    font-size: .95em;
    font-weight: 500;
    line-height: 1.7em;
    max-width: 90%;
    text-align: center;
    border-top:solid 1px #d9cdc6;
}
.contacter > em {
    font-style: normal;
    display: block;
}
.contacter a,
.contacter a:active,
.contacter a:link,
.contacter a:visited {
    font-weight: bold;
}
@media (min-width: 1000px) {
    .contacter {
        max-width: 80%;
    }
}

.wide,
.xwide,
.full {
	display:block;
	width:100%;
	margin:0 auto;
}
    .overlayleft,
    .overlayright {
        margin: 3px auto;
}
.couv.overlayleft {
    z-index:10;
}
.rotation {
        transform: rotate(-1deg);
    }
.scotch {
    position: relative;
}
    .scotch:after {
        content: "";
        display: block;
        position: absolute;
        width: 60px;
        height: 25px;
        top:-10px;
        left: calc(50% - 30px);
        margin:0 auto;
        background-color: #d8c018;
        opacity: .5;
        transform: rotate(-5deg);
        box-shadow: 0 1px 2px rgba(0,0,0,.25);
    }
.scotch > .wide,
.scotch > .xwide,
.scotch > .full {
    width:92%;
}
@media (min-width: 1000px) {
    .wide,
    .scotch > .wide {
        width:50%;
    }
    .xwide,
    .scotch > .xwide {
        width:66%;
    }
    .full,
    .scotch > .full {
        width:96%;
    }
    .overlayleft {
        position: relative;
        right: -10px;
        margin:0;
    }
    .overlayright {
        position: relative;
        top: 25px;
        left: -10px;
        margin:0;
    }
}
.paysage {
    width:100%;
    max-width:80%;
    height:600px;
    background-size: cover;
    background-position: center;
    margin: 0 auto;
}
.couvtarifs {
    display: block;
    background-image: url(../img/photographe-tourisme-voyage-outdoor/photographe-tourisme-voyage-outdoor-reportage-portrait-kalao-studio-54.jpg);
}
.diptyque {
    width:100%;
    max-width:90%;
    margin: 0 auto;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    align-content: space-between;
}
.couv {
    background-color: black;
    position: relative;
    overflow:hidden;
}
.couv > .lienrubrique > img{ 
    width:100%;
    opacity: .6;
    transform: scale(1.08);
    transition: transform 1s;
}
.couv:hover > .lienrubrique > img {
    transform: scale(1.16);
}
.couv .lienrubrique {
    box-shadow: none;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    border:0;
}
.lienrubrique .rubrique {
    position: absolute;
    left: 50%;
    top: 50%;
    transform:translate(-50%, -50%);
    color: #ccc;
    font-family: "Libre Baskerville", "Made Dillan", "Cervo Neue", Arial, "sans-serif";
    text-transform: uppercase;
    font-size:14px;
    line-height:1.25;
    letter-spacing: 3px;
    text-shadow: 0 1px 3px rgba(0,0,0,.4);
    transition: all .5s;
    transition-property: color, letter-spacing;
}
.rubrique > em {
    display: block;
    color: white;
    font-size:24px;
    font-style: italic;
    letter-spacing: 1px;
    transition: all .5s;
    transition-property: color, letter-spacing;
}
.couv:hover > .lienrubrique > .rubrique,
.couv:hover > .lienrubrique > .rubrique > em {
    color:#e5ca19;
    letter-spacing: 5px;
}
.rubrique:after {
    content: "→";
    display: inline-block;
    color: inherit;
    opacity: .5;    
    position: absolute;
    top: 35%;
    right: -30px;
    transition-duration: .5s;
    transition-property: right, opacity;
}
.couv:hover > .lienrubrique > .rubrique:after {
    right:-40px;
    opacity:1;
}
@media (min-width: 1000px) {
    .rubrique {
        font-size:18px;
    }
    .rubrique > em {    
        font-size:32px;
    }
}

.imgscroll {
    display: block;
    width:100%;
    max-width:500px;
    height:400px;
    position: relative;
}
.imgscroll > .blog,
.imgscroll > .livre {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/livre-coulisses-photo-30-photos-decryptees-clement-racineux-tonton-photo-couv-3D.png) no-repeat;
    background-size: contain;
    z-index: 0;
    position: absolute;
    top: 0;
    left: 0;
    background-position: center-top;
    background-position-x: 50%;
    background-position-y: 0%;
}
.imgscroll > .blog {
    background: url(../img/apprendre-photo-blog-tonton-photo.jpg) no-repeat;
	-webkit-background-size:cover;
    background-size: cover;
    -webkit-animation: animatedBackground 20s 1;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes animatedBackground {
			from { background-position: 0 0; }
			to { background-position: 0 100%; }
		}

/*---------- ICONOGRAPHIE ----------*/
.icono {
    width:90%;
    padding: 0;
    margin: 0 auto;
    display:block;
}
.icono > a {
    padding: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-transition: none;
    -webkit-transition: none;
    transition: none;
}
.icono > picture,
.icono > img,
.icono > a,
.icono > picture > a > img,
.icono > a > img {
    width: 100%;
    display: block;
    margin: 2px auto;
    position: relative;
}
    .icono > blockquote {
        width: 100%;
        max-width: 80%;
        flex-grow:1;
        margin: 120px auto;
        text-align: left;
    }
    .ombredecalee {
        -moz-box-shadow: 3px 5px 10px rgba(0,0,0,.25);
        -webkit-box-shadow: 3px 5px 10px rgba(0,0,0,.25);
        box-shadow: 3px 5px 10px rgba(0,0,0,.25);
    }
@media (min-width: 1000px) {
    .icono {
        width:90%;
        padding: 25px 0;
        margin: 0 auto;
        display:flex;
        flex-flow: row wrap;
        align-items: center;
        align-content: space-between;
    }
    .icono > picture,
    .icono > img,
    .icono > a {
        width: 100%;
        max-width: 37%;
        margin: 40px auto;
        flex-grow:1;
        display: inline-flex;
    }
    .icono a > img{
        width: 100%;
    }
    .icono .petite,
    .icono a .petite{
        max-width: 45%;
    }    
    .icono .tiers,
    .icono a .tiers{
        max-width: 30%;
        display: block;
    }        
    .icono .quart,
    .icono a .quart{
        max-width: 22%;
    }
    .icono .remontegauche,
    .icono a .remontegauche{
        margin: 20px auto 20px 40px;
        position: relative;
        top: -70px;
    }
    .icono .remontedroite,
    .icono a .remontedroite{
        margin: 20px 40px 20px auto;
        position: relative;
        top: -100px;
    }
    .icono .remontecentre,
    .icono a .remontecentre{
        margin: 20px auto 20px auto;
        position: relative;
        top: -80px;
    }
    .decalagedroite {
        margin:0 5% 0 auto;
    }
    .decalagegauche {
        margin:0 auto 0 5%;
    }
    .bordurevide {
        -moz-box-shadow: 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
        -webkit-box-shadow: 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
        box-shadow: 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
    }
    .bordurevide-ombre {
        -moz-box-shadow: 1px 3px 5px rgba(0,0,0,.2), 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
        -webkit-box-shadow: 1px 3px 5px rgba(0,0,0,.2), 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
        box-shadow: 1px 3px 5px rgba(0,0,0,.2), 18px 18px 0 -1px #f1ece8, 18px 18px 0 0 #d8c018;
    }
    .bordurepleine {
        -moz-box-shadow: -14px 14px 0 0 #d9cdc6;
        -webkit-box-shadow: -14px 14px 0 0 #d9cdc6;
        box-shadow: -14px 14px 0 0 #d9cdc6;
    }
    .bordurepleine-ombre {
        -moz-box-shadow: 1px 3px 5px rgba(0,0,0,.2), -14px 14px 0 0 #d9cdc6;
        -webkit-box-shadow: 1px 3px 5px rgba(0,0,0,.2), -14px 14px 0 0 #d9cdc6;
        box-shadow: 1px 3px 5px rgba(0,0,0,.2), -14px 14px 0 0 #d9cdc6;
    }
    .ombre {
        -moz-box-shadow: 0 3px 10px rgba(0,0,0,.3);
        -webkit-box-shadow: 0 3px 10px rgba(0,0,0,.3);
        box-shadow: 0 3px 10px rgba(0,0,0,.3);
    }
    .icono > blockquote {
        width: 100%;
        max-width: 40%;
        flex-grow:1;
        margin: 0 auto;
        text-align: left;
    }
}
@media (min-width: 1000px) {
    .icono img.petite remontegauche,
    .icono a img.petite remontegauche{
        top: -100px;
    }
    .icono img.petite remontedroite,
    .icono a img.petite remontedroite{
        top: -240px;
    }
    .icono img.petite remontecentre,
    .icono a img.petite remontecentre{
        top: -120px;
    }
    .icono > blockquote {
        width: 100%;
        max-width: 35%;
        flex-grow:1;
        margin: 0 auto;
        text-align: left;
    }
}

/*---------- FORMULAIRE CONTACT ----------*/
.descriptif-formulaire {
    display: block;
    margin: 0 auto;
    padding: 60px 0;
}
    .descriptif-formulaire > .contenu {
        padding: 20px 0 0 0;
        display:flex;
        flex-flow: column wrap;
        justify-content: space-between;
        gap:40px;
        align-items: center;
    }
        .descriptif-formulaire > .contenu > img {
            width:100%;
            max-width: 300px;
            -ms-border-radius: 100%;
            -moz-border-radius: 100%;
            -webkit-border-radius: 100%;
            border-radius: 100%;
        }
.formulaire {
    width: 80%;
    display: block;
    margin: 0 auto 40px auto;
    padding: 0;
    position: relative;
}
.champ {
    display:flex;
    flex-flow: column wrap;
    width:100%;
    justify-content: space-between;
    align-items: flex-end;
    /*gap: 20px;*/
    margin: 40px 0;
    /*border-bottom: solid 1px #d9cdc6;*/
}
.merci {
    display: block;
    text-align: center;
    margin:160px auto 0 auto;
    line-height: 1.3em;
    font-weight: bold;
    font-size:16px;
}
@media (min-width: 1000px) {
    .champ {
        flex-flow: row nowrap;
    }    
    .descriptif-formulaire > .contenu {
        flex-flow: row nowrap;
    }
    .descriptif-formulaire > .contenu > img {}
}
@media (min-width: 1000px) {
    .descriptif-formulaire {
        width: 80%;
        display: block;
        margin: 0 auto;
    }
}
@media (min-width: 1200px) {
    .descriptif-formulaire {
        width: 66%;
    }
    .formulaire {
        width: 100%;
        max-width: 66vw;
        padding: 0;
    }
}
form {
    padding: 0 0 20px 0;
    margin: 0;
}
dt,
dd {
    padding: 0;
    margin: 0;
}
.titre {
    margin: 60px auto 20px auto;
}
form .mel {
    display: none;
}
label {
    line-height: 1.3em;
    display: block;
    width: 100%;
    padding: 0 20px 10px 0;
}
label > em {
    display: block;
}
.champ > label {
    position: relative;
}
.champ > label:after {
    content: "";
    display: block;
    width: 1px;
    height: 18px;
    position: absolute;
    right: 0;
    top:8px;
    /*background-color: #d9cdc6;*/ /* The typwriter cursor */
    margin-left: 10px;
    /*animation: blink-cursor .75s step-end infinite;*/
}
/* The typewriter cursor effect */
@keyframes blink-cursor {
     from, to { background-color: transparent; }
    50% { background-color: #d9cdc6; }
}
.nousconnaitre {
        margin-top:40px;
    }
    .nousconnaitre > dt > label:after {
        display: none;
    }
.budgetclient {
    margin: 0 auto;
    text-align: center;
}
.budgetclient > label,
.budgetclient > select {
    display: block;
    text-align: center;
    margin: 0 auto;
}
    .budgetclient > label:after {
        display: none;
    }

.budgetclient > select#field-budgetmin {
    margin-right:auto;
}

@media (min-width: 1000px) {
    label {
        width: 40%;
        
    border-bottom: solid 1px #d9cdc6;
    }
    .budgetclient > label,
    .budgetclient > select {
        display: inline;
        text-align: left;
    }
    .budgetclient > select#field-budgetmin {
        margin-right: 20px;
    }
}
input,
textarea,
select,
button {
    font-family: Montserrat, "Cervo Neue", Arial, "sans-serif";
    font-size: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px 0;
    width: 100%;
    /*background:transparent;*/
    border:0;
    border-bottom: solid 1px #d9cdc6;
    transition: all .5s;
    transition-property: border-bottom;
    position: relative;
    background: url(blink10.gif) no-repeat center left transparent;
}
input:focus,
textarea:focus,
select:focus {
    outline: none;
    border-bottom: solid 3px #d8c018;
    background: none;
    -moz-transition: all .25s;
    -webkit-transition: all .25s;
    transition: all .25s;
    transition-property: border-bottom;
}
input:selected,
input:visited,
textarea:selected,
textarea:visited,
select:selected,
select:visited {
    outline: none;
    border-bottom: solid 3px #d8c018;
    background: none;
    -moz-transition: all .25s;
    -webkit-transition: all .25s;
    transition: all .25s;
    transition-property: border-bottom;
}
button:focus {
    outline:none;
}
input#budgetmin,
input#budgetmax {
    width: auto;
    min-width: 50%;
    text-align: center;
}
input#budgetmin {
    margin-right: auto;
}
@media (min-width: 700px) {
    input#budgetmin,
    input#budgetmax {
        min-width:inherit;
        max-width: 30%;
    }
    input#budgetmin {
        margin-right: 20px;
    }
}
button {
    width: 100%;
    display: block;      
    background:#e5ca19;
    padding: 20px;
    margin: 40px auto 0 auto;
    border: none;
    cursor: pointer;
    font-family: Montserrat, "Cervo Neue", Arial, "sans-serif";
    font-size: 16px;
    font-weight: bold;
    color: inherit;  
    -moz-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #e5ca19;
    -webkit-box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #e5ca19;
    box-shadow: 1px 2px 3px rgba(0,0,0,.2), 10px 10px 0 -1px #f1ece8, 10px 10px 0 0 #e5ca19;
    -ms-border-radius: 200px;
    -moz-border-radius: 200px;
    -webkit-border-radius: 200px;
    border-radius: 200px;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    transition: all .5s;
    -moz-transition-property: background-color, box-shadow;
    -webkit-transition-property: background-color, box-shadow;
    transition-property: background-color, box-shadow;
}
button:after {
    content: "→";
    display: inline-block;
    position: relative;
    left: 10px;
    -moz-transition: left .5s;
    -webkit-transition: left .5s;
    transition: left .5s;
}
    button:hover {
        background: #d8c018;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    button:hover:after {
        left: 20px;
        -moz-transition: left .25s;
        -webkit-transition: left .25s;
        transition: left .25s;
    }

textarea {
    width: 100%;
    line-height: 1.5em;
    padding: 20px 0;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    box-sizing: border-box;
}
textarea#message {
    /*min-height:200px;*/
}
select {
    display: inline;
    text-align: left;
    margin: 0 20px 0 0;
	color: #333;
}
select option {
    /*text-align: center;*/
}
.etoile { /*asterisque de champ obligatoire*/
    display: inline;
    color: red;
    margin-left: 5px;
}


/*---------- RENVOI HAUT DE PAGE ----------*/
.backtotop {
    display:block;
    width:90%;
    text-align: center;
    padding:40px 0 20px 0;
    margin:0 auto;
    opacity: .7;
    transition: opacity .75s;
}
.backtotop:hover {
    opacity:1;
    transition-duration: .25s;
}
    .backtotop > a {
        font-size:32px;
        -webkit-box-shadow:0 0 0 inset #d8c018;
        box-shadow:0 -2px 0 inset #d8c018;
    }
        .backtotop > a:hover {
            -webkit-box-shadow:0 -36px 0 inset #d8c018;
            box-shadow:0 -12px 0 inset #d8c018;
        }
.backtotop > a > .icon {
    width:18px;    
    height:18px;
    transform: translateY(0px);
    transition: transform .75s;
    }
.backtotop > a:hover > .icon {
    transform: translateY(-10px);
    transition-duration: .25s;
}

/*---------- CONCLUSION ----------*/
.silhouette {
    display: block;
    width: 80px;
    height: 80px;
    background: url(../img/photographe-06.svg) no-repeat center center;
    background-size: contain;
    margin: 40px auto 20px auto;
    padding:0;
    border: none;
    outline: none;
}
/*---------- VAGUE ----------*/
.vague {
    display: block;
    width: 100%;
    min-height: 50px;
    background: url(../img/wave2.svg) no-repeat bottom center;
    background-size: 100%;
    margin: 0;
    padding-top: 80px;
    border: none;
    outline: none;
    position: relative;
    bottom: -1px;
}
.reverse {
    -ms-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    margin-top: 0;
    bottom: 0;
    top: -1px;
}
.vague-ligne {
    display: block;
    width: 100%;
    min-height: 260px;
    background: url(../img/wave-line.svg) no-repeat center center;
    background-size: 100%;
    margin: 0;
    border: none;
    outline: none;
    position: relative;
    bottom: -1px;
}
.separation {
    width:100%;
    max-width: 80%;
    height:1px;
    background-color:#d9cdc6;
    padding:0;
    margin:120px auto;
    
}
.separationpetite {
    width:100%;
    height:20px;
    padding:0;
    margin:0 auto;    
}
.separationmoyenne {
    width:100%;
    height:40px;
    padding:0;
    margin:0 auto;    
}
@media (min-width: 800px) {
    .vague {
        min-height: 147px;
        padding-top: 40px;
    }
}
@media (min-width:1200px) {
    .separation {
        max-width:70%;
    }
}
/*---------- conclusion ----------*/
.conclusion {
    background:#fff;
    margin: 0;
    padding: 80px 0 10px 0;
    position: relative;
}
.conclusion h1 {
    text-align: center;
    margin-bottom: 40px;
}
.conclusion h1:after {
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background: #333;
    margin: 20px auto 0 auto;
}
.conclusion > .wrapper {
    width:100%;
    margin:0 auto;
    padding: 25px 40px 60px 40px;    
    background:#fff;
    display: flex;
    flex-flow: column wrap;
    align-items: flex-start;
    align-content: space-between;
    gap:40px;
}
.conclusion picture {
    border:solid 10px #f2f2f2;
    transform: rotate(-1deg);
}
.conclusion picture,
.conclusion a {
    max-width:100%;
    display:flex;
}
.formulaire > .conception {
    width:auto;
    position: absolute;
    bottom: -40px;
    left:50%;
    transform:translate(-50%, -50%);
    max-width:none;
    margin:40px auto 0 auto;
    padding-bottom: 3px;
    border-bottom: solid 1px transparent;
    font-size:11px;
    color: #a69a92;
    text-align: center;
    letter-spacing: 2px;
    line-height: 1.25;
    -webkit-box-shadow:none;
    box-shadow:none;
    transition: all .5s;
    transition-property: color, border-bottom-color;
}
    .conclusion a:hover,
    .formulaire > .conception:hover {
        color:#bfa915;
        border-bottom-color: #bfa915;
    }
.conclusion > ul {
    display:flex;
    flex-flow: column wrap;
    align-items: flex-start;
    align-content: space-between;
    width: 100%;
    max-width:80%;
    margin: 60px auto 0 auto;
    list-style-type: none;
}
.conclusion > ul > li {
    width: 100%;
    margin: 0 30px 15px 0;
    font-size: .95em;
    line-height: 1.5;
    text-align: center;
}
.conclusion > ul > li:before { display: none; }
.conclusion > ul > li > a,
.conclusion > ul > li > a:active,
.conclusion > ul > li > a:link,
.conclusion > ul > li > a:visited {
    font-family: "Libre Baskerville", "Made Dillan", "Cervo Neue", Arial, "sans-serif";
    font-size: 16px;
    text-transform: none;
    text-decoration: none;
    box-shadow: none;
    transition: all .25s;
    transition-property: color;
}
@media (min-width: 800px) {
    .conclusion > .conditions {
        max-width: 35%;
    }
}
@media (min-width: 1000px) {
    .conclusion > .wrapper {
        max-width: 90%;
    }
    .conclusion > ul { flex-flow: row wrap; }
}
@media (min-width: 1200px) {
    .conclusion {
        margin: 0 auto;
    }
    .conclusion > .wrapper {
        flex-flow: row nowrap;
        align-items: center;
    }
    .conclusion picture,
    .conclusion > a {
        width: 100%;
        max-width: 37%;
        flex-grow: 1;
        display: inline-flex;
    }
    .conclusion > ul { flex-flow: row nowrap; }
    .conclusion > ul > li { margin: 0 10px; text-align: left; }
    .conclusion > ul > li:first-child { margin-left: 0; }
    .conclusion > ul > li:last-child { text-align: right; margin-right: 0; border-bottom: 0; }
}
/*---------- FOOTER ----------*/
.footer {
    max-width:70%;
    margin:0 auto;
    text-align: center;
}
.footer > .menu {
    margin:0 auto 20px auto;
}
.footer > .menu ul,
.footer > .menu li {
    align-items: center;
    justify-content: center;
}
.footer > .menu li {
    margin-left:0;
}
.footer > .menu li:last-child {
    border-bottom: solid 1px #d9cdc6;
    padding-bottom: 10px;
}
.footer > .menu li > a {
    display: inline-block;
    text-align: inherit;
    font-family: "Montserrat", "Cervo Neue", Arial, "sans-serif";
    opacity: .8;
    font-size: 11px;
    line-height: 1.5em;
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}
    .footer > .menu li > a:hover {
        color: #bfa915;
    }
.footer > .conditions {
    display: block;
    max-width: 70%;
    margin:0 auto;
    font-size:11px;
    color: #a69a92;
    text-align: left;
    letter-spacing: 1px;
    line-height: 1.5;
}
    .footer > .conditions > a {
        color: #bfa915;
        -moz-box-shadow: 0 -1px 0 inset #d8c018;
        -webkit-box-shadow: 0 -1px 0 inset #d8c018;
        box-shadow: 0 -1px 0 inset #d8c018;
        -moz-transition: box-shadow .25s;
        -webkit-transition: box-shadow .25s;
        transition: box-shadow .25s;
    }
        .footer > .conditions > a:hover {
            -moz-box-shadow: 0 -2px 0 inset #bfa915;
            -webkit-box-shadow: 0 -2px 0 inset #bfa915;
            box-shadow: 0 -2px 0 inset #bfa915;
        }
.conclusion > .conception,
.footer > .conception {
    display: block;
    max-width: 70%;
    margin: 10px auto 40px auto;
    padding-bottom: 3px;
    text-decoration:none;
    font-size:11px;
    color: #a69a92;
    text-align: center;
    letter-spacing: 1px;
    line-height: 1.25;
    -webkit-box-shadow:none;
    box-shadow:none;
    transition: all .5s;
    transition-property: color, border-bottom-color;
}
    .conclusion > .conception:hover,
    .footer > .conception:hover {
        color:#bfa915;
    }
@media (min-width: 800px) {
    .footer > .menu li:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }
}
@media (min-width: 1100px) {
 .footer > .menu li {
    margin-left:20px;
}
    .footer > .menu li:first-child {
            margin-left: 0;
        }
    .footer > menu li > a {
        margin: 0 0 0 10px;
    }
    .footer > .menu li:before {
        content: "";
        display: inline-block;
        width: 1px;
        height: 7px;
        background-color: #d9cdc6;
        position: relative;
        left: 0;
        bottom: 0;
        margin: 0 16px 0 0;
    }
        .footer > .menu li:first-child:before {
            display:none;
        }
}
/*---------- FAQ ----------*/
.FAQ {}
.FAQ h1 {
    text-align: center;
    margin-bottom: 80px;
}
.FAQ h1:after {
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background: #333;
    margin: 20px auto 0 auto;
}
.qr {
    display: flex;
    flex-flow: column wrap;
    align-items: flex-start;
    align-content: space-between;
    gap: 20px;
    margin: 0;
    padding: 40px 0;
    border-bottom: solid 1px #d9cdc6;
}
    .qr:before {
        display: none;
    }
.qr:first-child {
    padding-top:0;
}
.qr > h2 {
    line-height: 1.5;
    margin-right: 20px;
    text-transform: none;
    letter-spacing: 0;
    font-style: italic;
    font-size: 20px;
}
    .qr > h2:after {
        width:25px;
        margin: 10px 0 5px 0;
    }
.qr > .answer {
    width:100%;
    flex-grow: 1;
    margin:0;
}

@media (min-width: 1100px) {
    .qr {
        display: flex;
        flex-flow: row nowrap;
        align-items: flex-start;
        align-content: space-between;
        gap: 20px;
        border-bottom: solid 1px #d9cdc6;
    }
        .qr > h2 {
            min-width: 25%;
            max-width: 25%;
            font-weight: normal;
        }
            .qr > h2:after {
                display:none;
            }
}


/*--------PERSONNALISATION FANCYBOX----------*/
iframe {
    padding: 0;
    margin: 0;
    width: 100%;
    max-width: 720px;
    max-height: 405px;
    border: none;
}
.fancybox-slide--iframe .fancybox-content {
    background: #fff;
    max-height: 414px;
    max-width: 720px;
    padding: 0;
    margin: 0;
    border: none;
    overflow: hidden!important;
    -moz-box-shadow:0 0 100px rgba(0,0,0,.6);
    -webkit-box-shadow:0 0 100px rgba(0,0,0,.6);
    box-shadow:0 0 100px rgba(0,0,0,.6);
}