/*
Kate style
*/

/******************/
/*******VAR********/
/******************/
:root{
/*color*/
--wh: #ffffff;
--blk: #32373B;
--beige: #f5f1e8;
--beigefonce: #ebe3d0;
--bleu: #1c2445;
--bleufonce: #141a28;
--orange: #e5684b;
--jaune: #f2bc6a;
/*radius*/
--r4: 4px;
/*background*/
--bbl: var(--bleu) url('../img/pic_bg_bleu.svg') repeat left top;
--bbe: var(--beige) url('../img/pic_bg_beige.svg') repeat left top;
/*contour spécifique*/
--stroke-size: 1px;
--stroke-color: var(--bleufonce);
}

/******************/
/*******LIENS******/
/******************/
a:link {
color: var(--blk);
}
a:visited {
color: var(--blk);
}
a:active,
a:hover {
color: var(--kate);
}

/******************/
/******POLICES*****/
/******************/
/*NUNITO*/
@font-face {
  font-family: 'nunito';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-300.woff2') format('woff2'),
}
@font-face {
  font-family: 'nunito';
  font-style: italic;
  font-weight: 300;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-300italic.woff2') format('woff2'),
}
@font-face {
  font-family: 'nunito';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-regular.woff2') format('woff2'),
}
@font-face {
  font-family: 'nunito';
  font-style: italic;
  font-weight: 400;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-italic.woff2') format('woff2'),
}
@font-face {
  font-family: 'nunito';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-700.woff2') format('woff2'),
}
@font-face {
  font-family: 'nunito';
  font-style: italic;
  font-weight: 700;
  src: local(''),
       url('../fonts/nunito-sans-v18-latin-700italic.woff2') format('woff2'),
}

/*BEBAS NEUE*/
@font-face {
  font-family: 'bebas';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/bebas-neue-v15-latin-regular.woff2') format('woff2'),
}

/*BEBAS NEUE*/
@font-face {
  font-family: 'mynerve';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/mynerve-v7-latin-regular.woff2') format('woff2'),
}

/*global*/
body{
font-family: 'nunito';
font-weight: 400;
font-size: 15px;
color: var(--bleu);
}
h1, h2, h3, h4, h5, h6{
display: block;
}

/******************/
/****STRUCTURE*****/
/******************/
.widzmain{
width: 954px;
margin-right: auto;
margin-left: auto;
}
.beige_area{
    /*background: var(--bbe);*/
}
.blue_area{
    padding-bottom: 26px;
    /*background: var(--bbl);*/
}
.op_step_first,
.op_step_third{
    background: var(--bbe);
}
.op_step_twice{
    background: var(--bbl);
}
.op_step_first{
    padding-top: 34px;
    overflow: hidden;
}
.op_step_third{
    padding-bottom: 35px;
}
.op_area_main{
    display: block;
    padding: 34px 34px 0;
    position: relative;
}
.op_step_first .op_area_main{
    padding: 34px;
}

/******************/
/******HEADER******/
/******************/
#logo{
position: relative;
}
#logo img{
position: relative;
z-index: 2;
}
#logo a{
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 3;
}

/******************/
/******FOOTER******/
/******************/

/******************/
/*******PAGES******/
/******************/
.page_hentry_wrapp{
    display: block;
    padding: 24px 24px 108px;
    background: var(--beige);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    margin-top: 36px;
    margin-right: 104px;
    position: relative;
}
.page_hentry_wrapp:after{
    content: '';
    height: 64px;
    background: url('../img/fond_tuiles_orange.png') repeat center;
    background-size: 80% auto;
    border-top: 2px solid var(--bleu);
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 2;
}

/*Hentry*/
.page_title{
display: block;
line-height: 39px;
margin-bottom: 20px;
font-size: 35px;
font-family: 'bebas';
color: var(--bleu);
text-transform: uppercase;
}
.page_title_wizpic_pic{
    display: block;
    width: auto;
    max-width: 33%;
}
.page_title_wizpic_pic img{
    display: block;
    width: 100%;
    height: auto;
}
.page_title_hidden{
    display: block;
    position: absolute;
    top: -9999px;
    left: -9999px;
}
.page_hentry h2{
line-height: 31px;
margin-bottom: 6px;
font-size: 25px;
font-family: 'bebas';
text-transform: uppercase;
}
.page_hentry h3{
line-height: 22px;
margin-bottom: 6px;
font-size: 18px;
font-family: 'bebas';
}
.page_hentry p{
line-height: 19px;
margin-bottom: 13px;
}
.page_hentry ul{
padding: 0;
margin: 0 0 13px;
}
.page_hentry ul li{
line-height: 19px;
padding: 0 0 0 14px;
margin: 0;
position: relative;
}
.page_hentry ul li:before{
content: '';
width: 4px;
height: 4px;
background: var(--bleu);
border-radius: 90px;
position: absolute;
top: 11px;
left: 1px;
}
.page_hentry b,
.page_hentry strong{
font-weight: 700;
}
.page_hentry em{
font-style: italic;
}
.page_hentry img{
width: auto;
max-width: 100%;
height: auto;
}
.page_hentry img.page_hentry_pic_illu_pic{
    display: block;
    float: right;
    width: auto;
    max-width: 216px;
    margin: -105px 0 32px 10px;
}
.page_hentry .gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.page_hentry .gallery dl.gallery-item{
    display: block;
    width: calc((100% / 3) - 10px + (10px / 3))!important;
    margin: 0!important;
}
.page_hentry .gallery dl.gallery-item dt{
    display: block;
    width: 100%;
    height: fit-content;
}
.page_hentry .gallery dl.gallery-item dt img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 5px;
    border: 2px solid var(--bleu)!important;
}

/*404*/
#page_404{
display: flex;
flex-wrap: wrap;
padding: 94px 0 94px;
}
#page_404_ill_block{
width: 36.5%;
margin: 0 9.8% 0 0;
}
#page_404_ill_block object{
width: 100%;
max-width: 511px;
height: auto;
margin: auto;
}
#page_404_ill_main{
flex: 1;
padding-top: 53px;
}

/******************/
/*****ONE PAGE*****/
/******************/
/*bt*/
.op_area_bt{
    display: block;
}
.op_area_bt_main{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.op_area_bt_item{
    display: block;
    line-height: 17px;
    padding: 5px 34px;
    border: 2px solid var(--bleu);
    font-size: 21px;
    font-family: 'mynerve';
    color: var(--bleu);
    font-weight: 400;
}
.op_area_bt_item a{
    color: var(--bleu);
    text-decoration: none;
}
.op_area_bt_item:first-child{
    background: var(--jaune);
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.op_area_bt_item:last-child{
    background: var(--orange);
    border-left: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

/*titres*/
.op_section_title{
    display: block;
    font-size: 95px;
    font-family: 'bebas';
    color: var(--wh);
    -webkit-text-stroke: var(--stroke-size) var(--stroke-color);
    text-shadow: 3px 2px 0px var(--bleu);
}
a.op_section_title{
    color: var(--wh);
    text-decoration: none;
}
.op_section_shop_title_strap .op_section_title{
    font-size: 90px;
}
.op_section_project_title_strap .op_section_title{
    color: var(--bleu);
    -webkit-text-stroke: var(--stroke-size) var(--wh);
    text-shadow: 3px 2px 0px var(--wh);
}
.op_section_site_title{
    padding-top: 30px;
    position: relative;
    z-index: 4;
}
.op_section_site_title .op_section_title{
    line-height: 100px;
    font-size: 140px;
    text-shadow: 6px 3px 0px var(--bleu);
    font-weight: 400;
}
.op_section_title_strap{
    display: block;
    padding: 40px 0 12px 178px;
    margin: 0 0 29px;
    position: relative;
}
.op_section_title_strap .op_section_title{
    transform: rotate(-2deg);
    position: relative;
    z-index: 4;
}
.op_section_title_bubble{
    display: flex;
    width: 229PX;
    height: 146px;
    background: url('../img/Bulle-orange_Fond-bleu.svg') no-repeat center;
    position: absolute;
    top: 0;
    left: -30px;
    z-index: 3;
}
.op_section_project_title_strap .op_section_title_bubble{
    background: url('../img/Bulle-beige_Fond-jaune.svg') no-repeat center;
}
.op_section_title_bubble_span{
    display: block;
    line-height: 65px;
    margin: 54px auto auto 54px;
    font-size: 65px;
    font-family: 'bebas';
    color: var(--beige);
    font-style: italic;
    transform: rotate(-5deg);
}
.op_section_project_title_strap .op_section_title_bubble_span{
    margin: 50px auto auto 34px;
    font-size: 55px;
    color: var(--bleu);
}
.op_section_contact_title_strap .op_section_title_bubble_span{
    margin: 50px auto auto 28px;
    font-size: 55px;
}
/*top video strap*/
.op_section_video_wrapper{
    margin-top: -24px;
    margin-bottom: 14px;
    position: relative;
    z-index: 3;
}
.op_section_video_main{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    position: relative;
    z-index: 2;
}
.op_section_video_menu_cols{
    display: flex;
    width: 204px;
}
.op_section_video_menu_part{
    display: block;
    line-height: 19px;
    background: var(--wh);
    font-size: 19px;
    font-family: 'mynerve';
    color: var(--bleu);
    font-weight: 400;
    text-align: center;
}
.op_section_video_menu_part_label_upper{
    text-transform: uppercase;
}
.op_section_video_menu_part_label_span{
    display: inline-block;
}
.op_section_video_menu_part_label_span:after,
.op_section_video_menu_part_label_span:before{
    content: '.';
    display: inline-block;
    font-size: 23px;
    font-weight: bold;
}
.op_section_video_menu_part_label_span:before{
    margin-right: 3px;
}
.op_section_video_menu_part_label_span:after{
    margin-left: 3px;
}
.op_section_video_menu_head{
    padding: 12px 0 5px;
    border-bottom: 2px solid var(--bleu);
}
.op_section_video_menu_foot{
    padding: 5px 0 12px;
    border-top: 2px solid var(--bleu);
}
.op_section_video_menu_bt_block{
    display: block;
    background: url('../img/fond_tuiles_jaune.png') no-repeat center;
    background-size: 200%;
}
.op_section_video_menu_bt{
    display: block;
    width: 98px;
    height: 158px;
    margin: 0 auto;
    background: var(--bleu);
    position: relative;
}
.op_section_video_menu_bt:before{
    content: '';
    display: block;
    width: 42px;
    height: 109px;
    mask: url('../img/Menu.svg') no-repeat center;
    -webkit-mask: url('../img/Menu.svg') no-repeat center;
    mask-size: 100% auto;
    -webkit-mask-size: 100% auto;
    background-color: var(--wh);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    transition: all 0.3s;
}
.op_section_video_menu{
    display: block;
    box-sizing: border-box;
    width: 100%;
    border: 2px solid var(--bleu);
    border-radius: 5px;
    margin: auto 0 0 0;
}
.op_video_block{
    flex: 1;
    display: block;
    height: 415px;
    border: 2px solid var(--bleu);
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}


.op_video_block_video {
    display: block;
    width: 100%;
    height: 100%;
    margin: auto;
    object-fit: cover;
    position: absolute;
    inset: 0px;
    z-index: 2;
    transition: 0.3s;
}



.op_video_block_iframe{
    display: block;
    position: absolute;
    top: -4px;
    right: -4px;
    bottom: -4px;
    left: -4px;
}
.op_video_block_iframe p {
    height: 0;
    padding-bottom: 62%;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
.op_video_block_iframe p iframe {
    height: 100%;
    width: 100%;
    border-radius: 5px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.op_section_video_pic{
    display: block;
    width: /*187px*/237px;
    height: auto;
    position: absolute;
    right: -44px;
    bottom: 89px;
    z-index: 3;
    animation: float-ellipse-tilt 8s linear infinite;
    will-change: transform;
    transform-origin: 50% 50%;
}
@keyframes float-ellipse-tilt {
    0% {
        transform: translate(44px, -89px) translate(0, -10px) rotate(0deg);
    }
    25% {
        transform: translate(44px, -89px) translate(20px, 0) rotate(5deg);
    }
    50% {
        transform: translate(44px, -89px) translate(0, 10px) rotate(0deg);
    }
    75% {
        transform: translate(44px, -89px) translate(-20px, 0) rotate(-5deg);
    }
    100% {
        transform: translate(44px, -89px) translate(0, -10px) rotate(0deg);
    }
}

/*adresse*/
.op_section_address_strap{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 68px;
}
.op_section_address_block{
    flex: 1;
    display: block;
    padding: 18px;
    background: var(--orange);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    text-align: center;
}
.op_section_address_line_top{
    display: block;
    line-height: 40px;
    font-size: 40px;
    font-family: 'bebas';
    color: var(--beige)!important;
    font-style: italic;
}
.op_section_address_line_bottom{
    display: block;
    line-height: 17px;
    font-size: 17px;
    font-family: 'nunito';
    color: var(--beige);
}
.op_section_address_logo{
    display: block;
    width: 182px;
    /*height: 93px;*/
    background: var(--bleu) url('../img/Art_Factory_Logo.svg') no-repeat center;
    background-size: auto 70%;
    border-radius: 5px;
}

/*shop mozaik*/
.op_section_shop_pres_strap{
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin: 0 40px 109px 0;
}
.op_section_shop_pres_mozaik{
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.op_section_shop_single{
    display: block;
    width: calc((100% / 2) - 7px + (7px / 2));
    position: relative;
}
.op_section_shop_single_pic_cols{
    display: block;
    height: 252px;
    border: 2px solid var(--bleu);
    border-radius: 5px;
    margin: 0 14px 11px 0;
    position: relative;
    z-index: 2;
}
.op_section_shop_single_pic{
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    margin: auto;
    object-fit: cover;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
/*mozaik labels*/
.op_section_single_label{
    display: block;
    line-height: 17px;
    padding: 5px 0;
    background: var(--jaune);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    font-size: 18px;
    font-family: 'mynerve';
    color: var(--bleu);
    text-align: center;
}
.op_section_shop_single .op_section_single_label{
    position: absolute;
    top: 236px;
    right: 0;
    bottom: unset;
    left: 14px;
    z-index: 3;
}

/*shop cols*/
.op_section_shop_pres_cols{
    display: block;
    width: 266px;
    padding-top: 71px;
    position: relative;
}
.op_section_shop_pres_content{
    display: block;
    padding: 78px 0 0;
    background: url('../img/fond_tuiles_orange.png') no-repeat center top;
    background-size: 200%;
    border: 2px solid var(--bleu);
    border-radius: 5px;
}
.op_section_shop_pres_title{
    display: block;
    line-height: 27px;
    padding: 11px 11px;
    background: var(--bleu);
    font-size: 25px;
    font-family: 'bebas';
    color: var(--wh);
    text-transform: uppercase;
    font-weight: 400;
}
.op_section_shop_pres_hentry{
    display: block;
    padding: 11px 14px;
    background: var(--beige);
}
.op_section_shop_pres_hentry.page_hentry p{
    line-height: 15px;
}

/*Hygiène*/
.op_section_hygi{
    display: block;
    background: var(--bleu);
    border-radius: 5px;
    margin-bottom: 40px;
    color: var(--wh);
    position: relative;
}
.op_section_hygi_content{
    display: flex;
    flex-wrap: wrap;
    padding: 44px 40px 34px 50px;
}
.op_section_hygi_pic{
    display: block;
    width: 190px;
    position: relative;
}
.op_section_hygi_pic img{
    display: block;
    max-width: 90%;
    height: auto;
    margin: auto 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}
.op_section_hygi_hentry{
    flex: 1;
    position: relative;
}
.op_section_hygi_title{
    display: block;
    line-height: 25px;
    padding: 8px 24px 7px;
    background: var(--beige);
    border: 2px solid var(--orange);
    border-radius: 5px;
    font-size: 25px;
    font-family: 'mynerve';
    color: var(--orange);
    position: absolute;
    top: -61px;
    right: 0;
}

/*artiste*/
.op_section_artist{
    display: block;
    margin: 0 40px 34px 0;
    position: relative;
}
.op_section_artist_content{
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.op_section_artist_col_left{
    flex: 15;
    padding-top: 23px;
    position: relative;
}
.op_section_artist_col_left_title{
    display: block;
    width: fit-content;
    line-height: 25px;
    padding: 8px 82px 7px;
    background: var(--bleu);
    border: 2px solid var(--jaune);
    border-radius: 5px;
    margin: 0 auto;
    font-size: 25px;
    font-family: 'mynerve';
    color: var(--jaune);
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3;
}
.op_section_artist_hentry{
    display: block;
    padding: 36px 26px 20px;
    background: var(--beige);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    position: relative;
    z-index: 2;
}
.op_section_artist_hentry_title{
    display: inline-block;
    line-height: 19px;
    margin-bottom: 10px;
    font-size: 19px;
    font-family: 'mynerve';
    color: var(--bleu);
    font-weight: 400;
    text-align: center;
}
.op_section_artist_hentry_title:before,
.op_section_artist_hentry_title:after{
    content: '.';
    display: inline-block;
    font-size: 23px;
    font-weight: bold;
}
.op_section_artist_col_right{
    flex: 11;
    padding-top: 70px;
    position: relative;
}
.op_section_artist_pic{
    display: block;
    width: fit-content;
    height: auto;
    border: 2px solid var(--jaune);
    border-radius: 5px;
    margin: 0 auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3;
}
.op_section_artist_pic img{
    display: block;
    width: 157px;
    border-radius: 5px;
}
.op_section_artist_right_hentry{
    display: block;
    padding: 96px 17px 28px;
    background: var(--jaune);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    position: relative;
    z-index: 2;
    font-size: 25px;
    font-family: 'bebas';
    color: var(--bleu);
    text-transform: uppercase;
    font-weight: 400;
}
.op_section_artist_right_hentry ul li{
    line-height: 27px;
}
.op_section_artist .op_section_title_bubble{
    width: 146px;
    height: 92px;
    background-size: 100%;
    top: unset;
    right: -80px;
    bottom: 70px;
    left: unset;
    z-index: 4;
}
.op_section_artist .op_section_title_bubble .op_section_title_bubble_span{
    display: flex;
    gap: 5px;
    margin: 36px 0 auto 32px;
    transform: unset;
}
.op_section_artist .op_section_title_bubble a.ldg_social_item_link {
    display: flex;
    width: 32px;
    height: 32px;
    font-size: 0;
}
.op_section_artist .op_section_title_bubble a.ldg_social_item_link:before {
    width: 32px;
    height: 32px;
    background-color: var(--wh);
}

/*info boutique*/
.op_section_info_shop{
    display: block;
    margin: 0 40px 0 0;
    background: url('../img/fond_tuiles_jaune.png') repeat center;
    background-size: 50%;
    border: 2px solid var(--bleu);
}
.op_section_info_shop_hentry{
    display: block;
    padding: 10px 12px 12px;
    line-height: 29px;
    font-size: 27px;
    font-family: 'bebas';
    color: var(--wh);
    font-style: italic;
    text-transform: uppercase;
    font-weight: 400;
    text-shadow: 3px 2px 0px var(--bleu);
    text-align: center;
}

/*projets*/
.op_section_project_mozaik_strap{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    position: relative;
}
.op_section_project_mozaik_strap:not(:last-of-type){
    margin-bottom: 143px;
}
.op_section_project_single{
    flex: 1;
    position: relative;
}
#op_section_project_single_02:before,
#op_section_project_single_06:before{
    content: '';
    height: 64px;
    background: url('../img/fond_tuiles_orange.png') repeat center;
    background-size: 100%;
    position: absolute;
    right: 0;
    left: 0;
    z-index: 4;
}
#op_section_project_single_02:before{
    border: 2px solid var(--beige);
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    bottom: 0;
}
#op_section_project_single_06:before{
    border: 2px solid var(--beige);
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    top: 0;
}
.op_section_project_single .op_section_single_label{
    width: fit-content;
    padding: 5px 15px;
    background: var(--beige);
    margin: 0;
    position: absolute;
    right: 35px;
    left: 35px;
    z-index: 5;
}
.op_section_project_single_pic{
    display: block;
    border: 2px solid var(--beige);
    border-radius: 5px;
    position: relative;
    z-index: 2;
}
.op_section_project_single_pic img{
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    margin: auto;
    object-fit: cover;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
#op_section_project_single_01{
    flex: 3;
}
#op_section_project_single_02{
    flex: 4;
}
#op_section_project_single_06{
    flex: 2;
}
#op_section_project_single_01 .op_section_single_label,
#op_section_project_single_03 .op_section_single_label,
#op_section_project_single_04 .op_section_single_label,
#op_section_project_single_06 .op_section_single_label{
    bottom: -13px;
}
#op_section_project_single_11 .op_section_single_label{
    bottom: -34px;
}
#op_section_project_single_02 .op_section_single_label{
    top: -18px;
    left: auto;
}
#op_section_project_single_05 .op_section_single_label,
#op_section_project_single_07 .op_section_single_label,
#op_section_project_single_08 .op_section_single_label,
#op_section_project_single_09 .op_section_single_label,
#op_section_project_single_10 .op_section_single_label{
    top: -18px;
}
#op_section_project_single_06 .op_section_single_label{
    margin: 0 auto;
    right: 0;
    left: 0;
}
#op_section_project_single_01 .op_section_project_single_pic,
#op_section_project_single_02 .op_section_project_single_pic{
    height: 500px;
}
#op_section_project_single_03 .op_section_project_single_pic,
#op_section_project_single_04 .op_section_project_single_pic,
#op_section_project_single_05 .op_section_project_single_pic{
    height: 613px;
}
#op_section_project_single_06 .op_section_project_single_pic,
#op_section_project_single_07 .op_section_project_single_pic{
    height: 623px;
}

#op_section_project_single_08 .op_section_project_single_pic,
#op_section_project_single_09 .op_section_project_single_pic{
    height: 518px;
}
#op_section_project_single_col{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 12px;
    height: 600px;
}
.op_section_project_single_v{
    flex: 1;
}
#op_section_project_single_col .op_section_project_single_pic{
    height: 100%;
}
#op_section_project_single_double{
    flex: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 12px;
}
.op_section_project_social_block{
    display: block;
    width: 100%;
}
.op_section_project_social_strap{
    display: block;
    line-height: 40px;
    padding: 20px 0;
    background: var(--orange);
    border: 2px solid var(--wh);
    border-radius: 5px;
    margin: 0 0 6px;
    font-size: 38px;
    font-family: 'bebas';
    color: var(--wh);
    font-style: italic;
    text-align: center;
}
.op_section_project_social_block a.ldg_social_item_link {
    display: inline-block;
    width: 27px;
    height: 27px;
    margin-left: 8px;
    vertical-align: middle;
}
.op_section_project_social_block a.ldg_social_item_link:before {
    width: 27px;
    height: 27px;
    background-color: var(--wh);
}
.op_section_project_social_sub{
    display: block;
    line-height: 21px;
    font-size: 21px;
    font-family: 'mynerve';
    color: var(--beige);
    text-align: center;
}


/*contact*/
.op_section_contact{
    display: block;
    margin: 0 0 46px;
    position: relative;
}
.op_section_contact_content{
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    position: relative;
}
.op_section_contact_cols{
    flex: 1;
    position: relative;
    z-index: 2;
}
.op_section_contact_blue_strap{
    display: block;
    line-height: 27px;
    padding: 20px;
    background: var(--bleu);
    border-radius: 5px;
    margin: 0 0 7px;
    font-size: 25px;
    font-family: 'mynerve';
    color: var(--jaune);
}
.op_section_contact_address{
    display: block;
    border: 2px solid var(--bleu);
    border-radius: 5px;
}
.op_section_contact_address_motif{
    display: block;
    height: 80px;
    background: url('../img/fond_tuiles_jaune.png') repeat center;
    background-size: 100%;
}
.op_section_contact_address_motif:first-of-type{
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.op_section_contact_address_motif:last-of-type{
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.op_section_contact_address_hentry_title{
    display: block;
    line-height: 23px;
    margin-bottom: 20px;
    font-size: 21px;
    font-family: 'mynerve';
    color: var(--bleu);
    text-transform: uppercase;
}
.op_section_contact_address_main{
    display: block;
    background: var(--jaune);
    border-top: 2px solid var(--bleu);
    border-bottom: 2px solid var(--bleu);
}
.op_section_contact_address_content{
    display: block;
    padding: 24px 20px;
}
.op_section_contact_address_hentry{
    display: block;
    height: fit-content;
    margin: auto 0;
}
.op_section_contact_address_label{
    display: block;
    line-height: 27px;
    font-size: 25px;
    margin-bottom: 8px;
    font-family: 'bebas';
    color: var(--wh);
    text-transform: uppercase;
}
.op_section_contact_address_datas{
    line-height: 20px;
    font-size: 16px;
    font-weight: 700;
}
.op_section_contact_address_datas a{
    text-decoration: none;
}
.op_section_contact_map{
    display: block;
    border: 2px solid var(--bleu);
    border-radius: 5px;
    margin: 0 0 7px;
}
.op_section_contact_map img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 5px;
}
.op_section_contact_form_bt{
    display: block;
    padding: 20px;
    background: var(--orange);
    border: 2px solid var(--bleu);
    border-radius: 5px;
    color: var(--beige);
    text-align: center;
}
.op_section_contact_form_bt_span{
    display: inline-block;
    line-height: 42px;
    padding: 0 36px 0 0;
    background: url('../img/Fleche_Formulaire.svg') no-repeat center right;
    font-size: 40px;
    font-family: 'bebas';
    font-style: italic;
}
.op_section_contact_pic_block{
    display: block;
    width: /*143px*/243px;
    height: fit-content;
    /*margin: auto;*/
    position: absolute;
    top: 180px;
    /*right: 0;*/
    /*bottom: 0;*/
    left: 360px;
    z-index: 3;
}
.op_section_contact_pic_block img{
    display: block;
    width: 100%;
    height: auto;
}
.op_section_contact_form_main{
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
.op_section_contact_form_pic_col{
    width: 375px;
}
.op_section_contact_form_block .op_section_title_bubble{
    width: 388PX;
    height: 238px;
    background: url('../img/Bulle-beige_Fond-jaune.svg') no-repeat center;
    margin: 0 0 0 -36px;
    position: relative;
    top: unset;
    left: unset;
    z-index: 3;
}
.op_section_contact_form_block .op_section_title_bubble_span{
    line-height: 45px;
    margin: 102px auto auto 74px;
    font-size: 45px;
    color: var(--bleu);
    text-transform: none;
    text-align: center;
}
.op_section_contact_form_pic{
    display: block;
    width: 100%;
    border: 2px solid var(--jaune);
    border-radius: 5px;
    margin-top: -56px;
    position: relative;
    z-index: 2;
}
.op_section_contact_form_pic img{
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 5px;
}
.op_section_contact_form_col{
    flex: 1;
    padding-top: 34px;
}
.op_section_contact_form_intro{
    display: block;
    line-height: 19px;
    padding: 10px 12px;
    background: var(--bleu);
    border-radius: 4px;
    margin-bottom: 7px;
    font-size: 15px;
    font-family: 'nunito';
    color: var(--beige);
    font-style: italic;
}
.footer_nav{
    display: block;
    padding: 16px 0 0;
    font-size: 10px;
    fonbt-weight: 600;
}
.footer_nav ul li{
    display: inline-block;
}
.footer_nav ul li a{
    display: inline-block;
    line-height: 12px;
    color: var(--bleu);
    text-decoration: none;
}
.footer_nav ul li:not(:last-of-type) a:after{
    content: '-';
    display: inline-block;
    margin: 0 1px 0 3px;
}

/*Menu*/
.op_nav_bt{
    display: block;
    width: 26px;
    height: 63px;
    position: absolute;
}
.op_nav_bt:before {
    content: '';
    display: block;
    width: 26px;
    height: 63px;
    mask: url('../img/Menu.svg') no-repeat center;
    -webkit-mask: url('../img/Menu.svg') no-repeat center;
    mask-size: 100% auto;
    -webkit-mask-size: 100% auto;
    background-color: var(--bleu);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    transition: all 0.3s;
}
.op_open_modal_bt{
    display: block;
    padding: 0;
    background: none;
    border: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3;
    cursor: pointer;
}
.op_section_artist_col_right .op_nav_bt,
.op_section_shop_pres_cols .op_nav_bt{
    top: 0;
    right: 0;
}
.op_section_contact .op_nav_bt,
.op_section_project_mozaik_strap .op_nav_bt{
    top: -74px;
    right: 0;
}
.op_section_contact .op_nav_bt:before,
.op_section_artist_col_right .op_nav_bt:before,
.op_section_shop_pres_cols .op_nav_bt:before{
    background-color: var(--orange);
}
.op_section_project_mozaik_strap .op_nav_bt:before{
    background-color: var(--jaune);
}
#op_modal_block.modal {
    display: none;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
}
.op_modal_box {
    display: flex;
    background: var(--bleu);
    border: 2px solid var(--orange);
    border-radius: 5px;
}
.op_modal_box_content{
    flex: 1;
    display: block;
    width: fit-content;
    padding: 36px 34px 32px;
    position: relative;
    line-height: 23px;
    writing-mode: vertical-rl;
    text-orientation: upright;
    font-size: 19px;
    font-family: 'mynerve';
    color: var(--wh);
    text-transform: uppercase;
    /*letter-spacing: -4px;*/
}
.is-safari .op_modal_box_content{
    font-family: 'nunito';
    font-weight: 700;
}
.op_modal_box_content a{
    display: block;
    color: var(--wh);
    text-decoration: none;
}
.op_modal_box_content a:not(:last-of-type){
    margin-left: 15px;
}
.op_modal_box_right{
    display: flex;
    align-items: flex-end;
    width: 86px;
    background: url('../img/fond_tuiles_orange.png') no-repeat center top;
    background-size: auto 150%;
    border-left: 2px solid var(--orange);
}
.op_modal_close {
    display: block;
    width: 86px;
    height: 106px;
    background: var(--orange);
    margin: auto 0 0;
    position: relative;
}
.op_modal_close:before {
    content: '';
    display: block;
    width: 26px;
    height: 63px;
    mask: url('../img/Menu.svg') no-repeat center;
    -webkit-mask: url('../img/Menu.svg') no-repeat center;
    mask-size: 100% auto;
    -webkit-mask-size: 100% auto;
    background-color: var(--beige);
    margin: auto;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    transition: all 0.3s;
}

/*****************/
/***FORMULAIRES***/
/*****************/
.wpcf7-spinner{
    position: absolute;
}
.wpcf7 p{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    line-height: 23px;
}
.wpcf7 .form_label{
    display: block;
    line-height: 20px;
    font-size: 20px;
    font-family: 'mynerve';
    text-transform: uppercase;
}
.wpcf7 span.wpcf7-form-control-wrap{
    display: inline-block;
    width: 49%;
    margin-bottom: 7px;
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="acceptance"],
.wpcf7 span.wpcf7-form-control-wrap[data-name="message"]{
    width: 100%;
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="doc"]{
    width: 68%;
    margin-bottom: 0;
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="experience"],
.wpcf7 span.wpcf7-form-control-wrap[data-name="taille"],
.wpcf7 span.wpcf7-form-control-wrap[data-name="recouvrement"],
.wpcf7 span.wpcf7-form-control-wrap[data-name="emplacement"],
.wpcf7 span.wpcf7-form-control-wrap[data-name="style"]{
    padding-top: 28px;
    position: relative;
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="experience"]:before,
.wpcf7 span.wpcf7-form-control-wrap[data-name="taille"]:before,
.wpcf7 span.wpcf7-form-control-wrap[data-name="recouvrement"]:before,
.wpcf7 span.wpcf7-form-control-wrap[data-name="emplacement"]:before,
.wpcf7 span.wpcf7-form-control-wrap[data-name="style"]:before{
    display: block;
    line-height: 20px;
    font-size: 20px;
    font-family: 'mynerve';
    text-transform: uppercase;
    position: absolute;
    top: 7px;
    left: 0;
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="experience"]:before{
    content: 'Expérience';
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="taille"]:before{
    content: 'Taille';
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="recouvrement"]:before{
    content: 'Recouvrement';
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="emplacement"]:before{
    content: 'Emplacement';
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="style"]:before{
    content: 'Style graphique';
}
.wpcf7 span[data-name="rgpd"]{
    display: inline-block;
    margin-bottom: 9px;
}
.wpcf7 span[data-name="rgpd"] span.wpcf7-checkbox{
    display: inline-block;
}
.wpcf7 span[data-name="rgpd"] span.wpcf7-list-item{
    margin: 0;
}
.wpcf7 span input:not([type='radio']):not([type='checkbox']):not([type='submit']):not([type='file']),
.wpcf7 span select,
.wpcf7 span textarea{
    display: block;
    box-sizing: border-box;
    width: 100%;
    line-height: 15px;
    background: var(--wh);
    border: 2px solid var(--bleu);
    font-size: 15px;
    font-family: 'nunito';
    color: var(--bleu);
}
.wpcf7 span select,
.wpcf7 span input{
    padding: 6px 10px;
    border-radius: 4px;
}
.wpcf7 span input[type='checkbox'],
.wpcf7 span input[type='radio']{
    margin-left: 0;
    font-family: 'nunito';
}
.wpcf7 span select{
    height: 36px;
    appearance: none;
}
.wpcf7 span textarea{
    height: 145px;
    padding: 6px 10px;
    border: 2px solid var(--bleu);
    border-radius: 4px;
}
.wpcf7 .wpcf7-form-control.wpcf7-radio{
    display: block;
    width: 100%;
}
.wpcf7 .wpcf7-form-control .wpcf7-list-item{
    display: block;
    width: 100%;
    margin: 0;
}
.wpcf7 input[type="checkbox"]{
    display: inline-block;
    width: auto;
}
.wpcf7 .wpcf7-list-item-label{
    line-height: 23px;
}

.wpcf7 span input[type='file']{
    box-sizing: border-box;
    width: 100%;
    height: 36px;
    background: var(--bleu);
    font-family: 'nunito';
    color: var(--wh);
}
.wpcf7 span.wpcf7-form-control-wrap[data-name="acceptance"] .wpcf7-list-item-label{
    line-height: 16px;
}
.wpcf7-form input[type='submit']{
    box-sizing: border-box;
    width: 30%;
    height: auto;
    line-height: 15px;
    padding: 6px 0;
    background: var(--bleu);
    border: 2px solid var(--bleu);
    border-radius: 4px;
    margin: 0 0 0 auto;
    font-size: 15px;
    font-family: 'nunito';
    color: var(--jaune);
    text-transform: uppercase;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: all 0.4s;
}
.wpcf7-form input[type='submit']:hover{
    background: var(--jaune);
    color: var(--bleu);
    transition: all 0.4s;
}
.wpcf7_form_control_value{
    display: block;
    lien-height: 17px;
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--gris);
}
.wpcf7 .wpcf7_form_control_wrap_wizselect:after{
    content: '';
    width: 8px;
    height: 15px;
    mask: url('../img/pic_ill_arrow_r.svg') no-repeat center;
    -webkit-mask: url('../img/pic_ill_arrow_r.svg') no-repeat center;
    mask-size: 100% auto;
    -webkit-mask-size: 100% auto;
    background-color: var(--blk);
    transform: rotate(90deg);
    margin: auto 0 auto auto;
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    z-index: 4;
}