#realisations    {position:relative; top:0; left:0; text-align: justify;}

#realisations p.medium_titre_3 span.small {font-size:1.5rem; line-height: 1.7rem;}
#realisations p.medium_titre_3 span.tiny {font-size:.9rem;}
#realisations .titre_box p.medium_titre_3 {padding-right:1.1rem; text-transform:inherit; color: #bebebe; text-transform: capitalize; text-align: right; margin:0}
#realisations .grey_box {width:100%; padding:1rem; margin:0 auto 1rem 0 ; background-color:#f1f1f1; color:var(--ShipColor); border-radius:1rem;}
#realisations p.medium_titre_3 {margin:0 auto 1rem auto; line-height:1.5rem; font-size:1.4rem; color:var(--ShipColor); text-transform: inherit; text-align: left;}
#realisations #toptitre p.medium_titre_3 {font-size:1.9rem; line-height: 1.9rem; margin-bottom:0.3rem;}

#realisations #intro p.medium_titre_3 {font-size:1.7rem; text-align: center;}
#realisations #intro p {margin-bottom:.8rem}

/* start books */
#realisations #books {position:relative; top:0; left:0; margin-bottom:3rem}
#realisations #books .flex_contener {display:flex; flex-wrap:wrap; margin:0 auto;}
#realisations #books .flex_contener .left_bloc {width:100%;}
#realisations #books .flex_contener .left_bloc p {margin-bottom: .8rem;}
#realisations #books .flex_contener .right_bloc {width:100%;}
#realisations #books .flex_contener .right_bloc .img_c_flex {display:flex; justify-content: flex-end; align-items: center;}
#realisations #books .flex_contener .right_bloc .img_c_flex .imgC img {width:10rem; margin:0 .5rem .8rem 0}
#realisations #books .flex_contener .right_bloc p.dispo {margin:1rem 0 1rem 2rem; padding:0rem 2rem; text-align: center; font-size:.9rem; font-style:italic;}
#realisations #books .flex_contener .right_bloc a.my_btn:link {margin-left:1rem}
#realisations #books .flex_contener .right_bloc a.my_btn:hover {background-color: cadetblue;}
/* end books */

/* start away */
#realisations #away {position:relative; top:0; left:0; margin-bottom:3rem}
#realisations #away .grey_box .flex_contener {display:flex; flex-direction: column; flex-wrap:wrap; margin:0 auto;}
#realisations #away .flex_contener .left_bloc {width:100%; text-align: justify;}
#realisations #away .flex_contener .left_bloc p {margin-bottom: .8rem;}
#realisations #away .flex_contener .left_bloc p.credits {font-size:.95rem; font-style:italic;}
#realisations #away .flex_contener .right_bloc {height:12rem}
#realisations #away .grey_box .my_btn, #realisations #adhesions .grey_box .my_btn:not(.browser-default) {width:50rem; text-align:center; margin:2rem auto 0 auto}
#realisations #away .grey_box .my_btn:hover, #realisations #adhesions .grey_box .my_btn:hover:not(.browser-default) {background-color:var(--BGFooterColor)}
#realisations #away .grey_box .my_btn span, #realisations #adhesions .grey_box .my_btn span:not(.browser-default) {font-size:.85rem;}

/* start livret */
#realisations #livret {position:relative; top:0; left:0; margin-bottom:3rem}
#realisations #livret .grey_box .flex_contener {display:flex; flex-direction: column; flex-wrap:wrap; margin:0 auto; cursor:pointer}
#realisations #livret .flex_contener .left_bloc {display:flex; flex-direction:row-reverse; width:100%; flex-wrap:wrap; margin:0 auto;}
#realisations #livret .flex_contener .left_bloc .imgc {width:10rem; height:15rem; background-position: center top; background-repeat: no-repeat; background-size: cover;cursor: pointer;}
#realisations #livret .flex_contener p.sp {display: block; font-size:.90rem; font-style:italic; text-align: center; margin:1rem auto;}
#realisations #livret .flex_contener .right_bloc {margin:.8rem 0 0 0}
#realisations #livret .flex_contener .right_bloc p {margin-bottom: .8rem;}
#realisations #livret .flex_contener .right_bloc p:first-child {text-align: center;}
#realisations #livret .flex_contener .right_bloc a.my_btn {padding: .3rem 2rem; display: inline-block;}
/* end livret */

/* start souvenirs */
#realisations #souvenirs {position:relative; top:0; left:0; margin-bottom:3rem}
#realisations #souvenirs .grey_box .flex_contener {display:flex; flex-direction: column; flex-wrap:wrap; margin:0 auto; cursor:pointer}
#realisations #souvenirs .flex_contener .left_bloc {display:flex; flex-direction: column; flex-wrap:wrap; margin:0 auto; width:100%;}
#realisations #souvenirs .flex_contener .left_bloc .imgc {width:100%; height:15rem; margin-right: 1rem; border:.7rem solid white;background-position: center top; background-repeat: no-repeat; background-size: cover;cursor: pointer;}
#realisations #souvenirs .flex_contener p.sp {display: block; font-size:.90rem; font-style:italic; text-align: center; margin:1rem auto;}
#realisations #souvenirs .flex_contener .right_bloc {margin:1rem 0 0 1.5rem}
#realisations #souvenirs .flex_contener .right_bloc p {margin-bottom: .8rem;}
#realisations #souvenirs .flex_contener .right_bloc a.my_btn {padding: .3rem 2rem; margin-bottom:.4rem}
/* end souvenirs */

/* start parcours */
#realisations #parcours {position:relative; top:0; left:0; margin-bottom:3rem}
#realisations #parcours p {margin-bottom:.8rem}
#realisations #parcours .grey_box .text_contener {width:100%}
#realisations #parcours .grey_box .localisation_contener {display: flex; flex-direction:column; width:100%; margin:1rem 0; justify-content:flex-start; align-items:flex-start;}
#realisations #parcours .grey_box .localisation_contener .left_bloc, #realisations #parcours .grey_box .localisation_contener .right_bloc {display: flex; flex-direction: column; justify-content:center; width:100%; height:fit-content; padding:1.5rem; cursor:pointer;}
#realisations #parcours .grey_box .localisation_contener .left_bloc div.imgc {display:none;}
#realisations #parcours .grey_box .localisation_contener .left_bloc p.t1 {font-style:italic; text-align: center;}
#realisations #parcours .grey_box .localisation_contener .left_bloc p.t2 {text-align: center;}
#realisations #parcours .grey_box .localisation_contener .left_bloc p.t3 {margin-top:.5rem; font-style:italic; text-align: center;} 
#realisations #parcours .grey_box .localisation_contener .left_bloc img.exterieur {margin: auto; width:100%;}
#realisations #parcours .grey_box .localisation_contener .right_bloc div.imgc {display:none;}
#realisations #parcours .grey_box .localisation_contener .right_bloc p.t1 {font-style:italic; text-align: center;}
#realisations #parcours .grey_box .localisation_contener .right_bloc p.t2 {text-align: center;}
#realisations #parcours .grey_box .localisation_contener .right_bloc p.t3 {margin-top:.5rem; font-style:italic; text-align: center;} 
#realisations #parcours .grey_box .localisation_contener .right_bloc img.exterieur {display: block; margin: auto; width:100%;}
/* end parcours */

/* start audio */
#realisations #audio {margin-bottom:3rem}
#realisations #audio .grey_box p:nth-child(2) {width:100%}
#realisations #audio .grey_box .flex_contener {display:flex; flex-direction:column; flex-wrap:wrap; margin:2rem auto 1rem auto;}
#realisations #audio .grey_box .flex_contener .left_bloc {width:100%; border: 1px solid grey; padding:1rem;}
#realisations #audio .grey_box .flex_contener .left_bloc a:link, #realisations #audio .grey_box .flex_contener .left_bloc a:visited {display:block; color:#039be5; text-decoration:none;}
#realisations #audio .grey_box .flex_contener .left_bloc a:hover {color:var(--ShipColor);}
#realisations #audio .grey_box .flex_contener .left_bloc p {margin-bottom: .8rem;}
#realisations #audio .grey_box .flex_contener .right_bloc {display:flex; flex-direction: column; align-items: center; justify-content: space-between; width: 100%; border: 1px solid grey; padding:1rem; }
#realisations #audio .flex_contener .right_bloc p:first-child {width:15rem; margin-bottom:.5rem; font-size:.9rem; text-align:center;}
#realisations #audio .grey_box .flex_contener .right_bloc img {width:9rem}
#realisations #audio .flex_contener .right_bloc div:nth-child(2) {margin-right:.7rem}
#realisations #audio .flex_contener .right_bloc div:nth-child(2) p, #realisations #audio .flex_contener .right_bloc div:nth-child(3) p {width:5rem; font-size:.8rem; margin:0 auto;}
#realisations #audio .flex_contener .right_bloc .qr_contener {display:flex; align-items: center; justify-content: center;}

#realisations #audio div#descr {display:flex; flex-direction:column; justify-content:flex-start; align-items:flex-start; width:100%; padding-top:2rem;}
#realisations #audio div#descr p.st {margin-bottom:.2; font-weight:400; font-size:1rem}
#realisations #audio div#descr div.d1 blockquote p, #realisations #audio .grey_box div#descr div.d2 blockquote p, #realisations #audio .grey_box div#descr div.d3 blockquote p,  #realisations #audio .grey_box div.escape blockquote p {font-size:1rem; margin-bottom:0; line-height:inherit}
#realisations #audio div#descr div.d1,
#realisations #audio div#descr div.d2 {display:flex; width:100%; flex-direction: column;}
#realisations #audio div#descr div.d1 .left_bloc,
#realisations #audio div#descr div.d2 .left_bloc {width:100%; height:8rem; background-position: center -4rem; margin-bottom:1rem; background-repeat: no-repeat; background-size: cover;}
#realisations #audio div#descr div.d1 .right_bloc, #realisations #audio div#descr div.d2 .right_bloc { width:100%;}
#realisations #audio div#descr div.d1 .left_bloc {background-image:url("https://www.ussixthfleet-villefranche.com/images/v2/realisations/audio1.jpg");}
#realisations #audio div#descr div.d2 .left_bloc {background-image:url("https://www.ussixthfleet-villefranche.com/images/v2/realisations/audio2.jpg"); margin-top:.4rem}
#realisations #audio div#descr div.d2 ul {padding-left:1rem;}
#realisations #audio div#descr div.d2 ul li {margin-bottom:0; line-height:inherit;}
#realisations #audio .my_btn:hover:not(.browser-default)#descr a, .escape a {margin-left:.5rem; text-decoration:none; font-style:italic; color:white}
/* end audio */

/* start bowden */
#realisations #bowden {margin-bottom:3rem}
#realisations #bowden .grey_box .flex_contener {display:flex; flex-direction: column; width: 100%; flex-wrap:wrap; margin:1rem auto 1rem auto;}
#realisations #bowden .flex_contener .left_bloc {position:relative; width: 100%;}
#realisations #bowden .flex_contener .left_bloc .imgc {height:17rem; border:.7rem solid white; background-image:url("https://www.ussixthfleet-villefranche.com/images/v2/realisations/bowden1.jpg"); background-position: center top; background-repeat: no-repeat; background-size: cover;}
#realisations #bowden .flex_contener p.sp {display: block; font-size:.90rem; font-style:italic; text-align: center; margin:1rem auto;}
#realisations #bowden .flex_contener .right_bloc {width:100%; margin:1rem 0 0 0}
#realisations #bowden .flex_contener .right_bloc p {margin-bottom: .8rem;}
#realisations #bowden .flex_contener .right_bloc p:nth-child(8) {text-align: center; margin-bottom:.4rem}
#realisations #bowden .flex_contener .right_bloc a.my_btn {font-size:.8rem; padding: .3rem 2rem; display: inline-block;}
/* end Bowden */