* {text-rendering:optimizelegibility;}
*, *:before, *:after {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}

body, html {width:100%; font:var(--Default); color:black;}

:root {
    --Default: 100 1rem 'Open Sans', sans-serif;
    --BlueNavy: #0955a4;
    --GoldNavy:goldenrod;
    --ShipColor:#0c0c55;
    --BGColor: #d7ecfa;
    --ParisColor: #154b67;
    --BGBoxColor: #b7d8e99c;
    --TopMenuColor:#c4d7ff;
    --BGFooterColor:#819db2;
    --PresqueNoir: #323232;
    --PoppinsFont: 200 1.2rem "Poppins", sans-serif;
    --CardoFont: 400 1rem 'Cardo', serif;
    --OpenFont: 400 1rem 'Open Sans', sans-serif;
    --montserraCollo: 700 1rem "Montserrat", sans-serif
}

.left {float:inherit}

.text_shadow {text-shadow:1px 1px 2px rgb(80, 80, 80);}

h1, h2, h3, h4, h4, h6 {line-height:100%; letter-spacing:0rem;}
h1 {margin:0; font-family:'Stardos Stencil', cursive;}
h2 {margin:0; font-family: "Poppins", sans-serif;}
h3 {margin:0; font-family: "Poppins", sans-serif;}
h4 {margin:0; font-family: "Poppins", sans-serif;}
h5 {margin:0; font-family: "Poppins", sans-serif;}
h6 {margin:0; font-family: "Poppins", sans-serif;}

blockquote {margin:0; border:none; padding:0}


input[type="text"], input[type="password"], input[type="email"], input[type="number"], select, textarea, div.jfilestyle label {display:block; margin:.4rem auto 0 auto; padding:.4rem; border:1px solid #a3a0a0; border-radius:.3rem; color:var(--ShipColor);}
input[type="submit"], button[type="submit"], button {display:block; font-size:1rem; margin:1.2rem auto 0 auto; padding:.5rem 4rem; border-radius:.2rem; border:inherit}
input[type="file"] {background-color: green;}
input:invalid:not[contact], textarea:invalid {border-color: red; background-color:#ff94943b;}
input:valid, textarea:valid {border-color:green}

.my_btn {display: block; padding: .52rem 2rem; text-align: center; margin: 0 auto 0 auto; border: inherit; border-radius: 3px; color: white; background-color: var(--BlueNavy);}


/* Modals */
.modal {background-color:white; max-height:50rem}
#modal1 {width:45vw;}
#modal2 {width:45vw}
#modal3, #modal4 {width:30vw}
#modal5 {width:900px}
#modal3, #modal4 h4 {font-size:4rem;}
.modalsv2 .modal-content {padding:0; margin-bottom:0rem;}
.modalsv2 h4 {text-align:center; font:var(--Default); padding:1.5rem 0; color:var(--PresqueNoir);}
.modalsv2 .modal-footer {display:flex; justify-content:center; margin-bottom:.5rem; align-items:center; background-color: #e5f0fb; border-top:1px solid grey}
.modalsv2 .modal-footer button {font-size:1.5rem; font-weight:400; line-height:.3rem; padding:1.5rem 2.5rem; background-color:var(--TopMenuColor); border:none; margin:0 .4rem}
.modalsv2 .modal-footer button:hover {box-shadow: inset 0px 0px 19px -3px rgba(178, 134, 206, 0.43);}
#modal2 cite {text-align:center; font-size:1.2rem; display:block;}
#modal6 {width:22rem}
#modal6 .modal-content {text-align:center;}
#modal6 h4 {padding:.6rem;}
#modal6 .modal-content p {font-size:.8rem; font-weight:400}
#modal6 .modal-footer {margin-bottom:0}
#modal6 .my_btn {display:block; font-size:.9rem; padding:.52rem 3rem; height:2.27rem; margin:0 auto 0 auto; color:white; background-color:var(--BlueNavy);}
#modal6 .my_btn:hover {background-color:var(--ShipColor); transition:.6s cubic-bezier(.14,.7,.93,.5);}

#modalplaquette, #modalplaquette img, #modalbooklogos, #modalbooklogos img {width:41vh}

.wrapper {position:relative; width:100%; padding:0 0.5rem; margin: 0 auto;}



/* bakup 
header:not(.mod,) div.top p {font-family:var(--PoppinsFont); color:white; margin-left:.2rem; font-size:1.1rem; font-weight:400; align-self:center; cursor:pointer;}
div.medaillon_contener img:not(.bandeau_logo) {width:3rem;height:3rem}
div.medaillon_contener img.bandeau_logo {width:7rem;height:7rem}

main nav {position:absolute; display:none; width:100%; height:inherit; padding:.6rem .5rem 1rem .5rem; line-height:inherit; color:white; background-color:var(--BlueNavy); border-bottom-left-radius:6px; border-bottom-right-radius:6px; z-index:1000}
main nav .triggerclosecontener {display:flex; justify-content:flex-end;}
main nav span#triggerclose {height:auto; font-size:2rem; color:white; cursor:pointer}
main nav .menuc {display:flex; margin-top:-1.5rem; flex-direction:column;}
main nav .menuc .cols {display:flex; justify-content:flex-start; align-items:center; flex-direction: column; margin:0 0;}
main nav .menuc div:last-child {border:none}
main nav .menuc .cols a:link, main nav .menuc .cols a:visited {font-size:1.3rem; text-transform:capitalize; color:white; text-decoration:none; line-height:2.6rem; text-align:center; min-width:17rem; border-bottom:1px dotted #dfdfdf; border-radius: 2% / 58%;}
main nav .menuc .cols a:hover {background-color:var(--ShipColor); transition: background-color 1s;}
main nav .menuc .rs {display:flex; width:100%; justify-content:center; align-items:center; padding:.6rem 0; margin:5rem auto 0 auto; background-color:var(--ShipColor); border-radius:.5rem}
main nav .menuc .rs img {width:2.40rem; height:2.40rem; margin:0 .3rem; cursor:pointer;}
*/

header:not(.mod) {position:sticky; top:0; left:0; background-color:var(--ShipColor); z-index:500}
header:not(.mod).isSticky {opacity:1;}
div.top {display:flex; height:3rem; justify-content:space-between; align-items:center;}

div.flags_contener {display:flex; justify-content:flex-start; align-items:center; margin-left:1rem}
div.dr_contener {cursor:pointer;}
div.flags_contener div#fr {margin-right:1rem}
div.flags_contener div#en {margin-right:.5rem}
div.dr_contener img {display:block; width:1.845rem; height:1.333rem; margin:0 auto; border:1px solid #ffffff8f}
div.dr_contener span {display:block; margin:.2rem auto 0 auto; font-size:.75rem; color:white}

div.togglemenuc {margin-left:1rem}
div.togglemenu {display:flex; align-items:center;}
div.togglemenu:hover, div.espacemembres:hover {background-color:var(--BlueNavy); transition: background-color 1.2s;}
p#buttonmenu {color:white;}
p#buttonmenu .material-icons {line-height:inherit; font-size:2rem;}


header:not(.mod,) div.top p {font-family:var(--PoppinsFont); color:white; margin-left:.2rem; font-size:1.1rem; font-weight:400; align-self:center; cursor:pointer;}
div.medaillon_contener img:not(.bandeau_logo) {width:3rem;height:3rem}
div.medaillon_contener img.bandeau_logo {width:7rem;height:7rem}

section#menu_level1 {background-color: var(--BlueNavy);}
div.togglemenu span.material-icons {color:white; font-size:2rem; cursor:pointer; margin:0 auto 0 auto;}

main nav {position:relative; width:100%; height:100vh; padding:.6rem 0 1rem 0; line-height:inherit; box-shadow:inherit; color:white; background-color:var(--BlueNavy); border-bottom-left-radius:6px; border-bottom-right-radius:6px; z-index:1000}
main nav .triggerclosecontener {display:flex; justify-content:flex-end;}
main nav span#triggerclose {height:auto; font-size:2rem; color:white; cursor:pointer}
main nav .menuc {display:flex; flex-direction:column; margin-top:.8rem}

main nav .menuc .cols {display:flex; justify-content:flex-start; flex-direction: column; margin:0 .7rem;}
main nav .menuc .cols .cols_inner {display:flex; justify-content: space-between; align-items: center; border-bottom:1px solid #5d7cb6;}
main nav .menuc .cols .cols_inner span.opa {opacity:.5; cursor:pointer;}
main nav .menuc div:last-child {border:none}
main nav .menuc .cols a:link, main nav .menuc .cols a:visited {font-size:1.3rem; padding:0 .5rem; text-transform:capitalize; color:white; text-decoration:none; line-height:2.6rem; width:100%;}
main nav .menuc .cols a:hover {background-color:var(--ShipColor); transition: background-color 1s;}
main nav .menuc .rs {display:flex; width:100%; justify-content:center; align-items:center; padding:.6rem 0; margin:5rem auto 0 auto; border-radius:.5rem}
main nav .menuc .rs img {width:2.40rem; height:2.40rem; margin:0 .3rem; cursor:pointer;}

.titre_box {position: relative; top: 0; left: 0; width:100%; margin: 0rem auto 0 auto; }
.titre_box p:first-child {font: var(--CardoFont); font-size: 2.8rem; color: #bebebe; text-align: center;}


.fade-in {opacity:1;}
.opa0{opacity:0;}
.opa5{opacity:0.5;}
.reveal-visible {opacity: 1; transition: .6s cubic-bezier(.14,.7,.93,.5);}
.top_pos {margin-top:-18rem; transition: 1s linear;}
.bottom_pos {margin-top:-6rem; transition: 1s linear;}

.tooltip {position:relative; display:inline-block;}
.tooltip .tooltiptext {position:absolute; visibility:hidden; width:90%; top:15rem; left:1rem; font-size:.7rem; background-color:var(--ShipColor); color:#fff; text-align:center; border-radius:6px; padding:5px 0; z-index:1;
}
.tooltip:hover .tooltiptext {visibility: visible;}

/* Start NewMenu */
header#newmenu:not(.mod) {position:sticky; top:0; left:0; align-items:center; border-bottom:1px solid var(--GoldNavy); background-color:var(--ShipColor); z-index:500}
header#newmenu:not(.mod).isSticky {opacity:1;}
header#newmenu:not(.mod) .wrapper {width:95%}

header#newmenu div.newmenutop {display:flex; width:100%; height:100%; justify-content:center; align-items:center;}
header#newmenu div.newmenutop div.left_contener {display:flex; width:fit-content; justify-content:flex-start; height:100%; align-items:center;}
header#newmenu div.newmenutop div.left_contener div.titre_contener h1 {font-size:1.3rem; color:white;}
header#newmenu div.newmenutop div.left_contener div.titre_contener h2 {font-size:1rem; color:white;}
header#newmenu div.newmenutop div.centerbloc {display:flex; height:100%;}
header#newmenu div.newmenutop div.centerbloc div.togglecontener {position:relative; display:flex; justify-content:center; align-items:center; height:100%; margin:0 auto;}
header#newmenu div.newmenutop div.centerbloc div.togglecontener a, header#newmenu div.newmenutop div.centerbloc div.togglecontener p, div.right_contener a:visited, header#newmenu .right_contener {color:white; font-size:.9rem; cursor:pointer;}
header#newmenu div.newmenutop div.centerbloc div.togglecontener a:hover, header#newmenu div.newmenutop .right_contener:hover {color:#ffe6a9;}
header#newmenu div.newmenutop div.centerbloc div.togglecontener span.dot, header#newmenu div.newmenutop div.centerbloc .button-collapse span.dot {margin:0 .5rem; font-size:.8rem; color:var(--GoldNavy)}
header#newmenu div.newmenutop div.right_contener {display:flex; height:100%;; justify-content: flex-end;}

header#newmenu .togglemenuc {width:100%; margin:0 auto;}
header#newmenu .button-collapse {display:flex; align-items:center; height:100%;}
header#newmenu .button-collapse a {color:white; font-size:.9rem; cursor:pointer;} 

/*End NewMenu */



#inside_nav {position:relative; top:0; left:0;}
#inside_nav .inside_nav_contener {display:flex; flex-direction: column; width:100%; padding:.5rem; justify-content:center; margin:1rem auto 5rem auto; border-radius:.5rem; background-color:#aabac3fa;}
#inside_nav .inside_nav_contener .left_btn {background-color:var(--ShipColor); margin-top:.3rem;}
#inside_nav .inside_nav_contener .left_btn a {background-color:var(--ShipColor);}
#inside_nav .inside_nav_contener .right_btn {display:flex; margin-top:.3rem;}
#inside_nav .inside_nav_contener .right_btn a {width:100%; padding:.8rem 3rem;}
.my_btn:hover {background-color: var(--ShipColor); transition: .6s cubic-bezier(.14,.7,.93,.5)}

/* start main_accueil */
#main_accueil {position:relative; top:0; left:0; margin-bottom:1.1rem}
#main_accueil .flex_contener {display:flex; flex-direction:column; justify-content:flex-start; margin:2rem auto 0 auto; align-items:center; text-align:center}
#main_accueil .flex_contener blockquote {width:21rem;}
#main_accueil .flex_contener blockquote h1 {width:21rem; margin:auto; font-size:3rem; color:var(--ShipColor); line-height:2.6rem}
#main_accueil .flex_contener blockquote:nth-child(1) p {font:var(--PoppinsFont); font-size:1.7rem; color:red; font-weight:400}
#main_accueil .flex_contener img.blason {width:13rem; margin-top:1rem;}
#main_accueil .flex_contener blockquote:nth-child(3) p {font:var(--PoppinsFont); font-size:1.2rem; margin-top:3rem; color:var(--PresqueNoir); font-weight:400; line-height:1.2rem}
#main_accueil .top_slide {position:relative; height:15.5rem; overflow:hidden; margin:2rem auto 3rem auto}
/* end main_accueil */


.overflow-ellipsis {text-overflow: ellipsis;}

#modal1 .flex_contener, #modal2 .flex_contener, #modal3 .flex_contener {display:flex; justify-content:space-evenly; align-items:flex-start; padding:2rem 0 1rem 2rem;}
#modal1 .flex_contener div.tg_lilly {width:8.41rem; height:16.72rem; background-image:url('../images/v2/bureau/06.jpg'); background-position:center center; background-repeat: no-repeat; background-size:cover;}
#modal1 .flex_contener .medaillon_contener, #modal2 .flex_contener .medaillon_contener, #modal3 .flex_contener .medaillon_contener {width:7rem; margin:2.4rem auto 2.3rem auto}
#modal1 .flex_contener div.text_contener, #modal2 .flex_contener div.text_contener, #modal3 .flex_contener div.text_contener {width:34rem; margin-left:1rem;}
#modal1 .flex_contener div.text_contener p.titre, #modal2 .flex_contener div.text_contener p.titre, #modal3 .flex_contener div.text_contener p.titre {font:var(--Default); font-size:1.3rem;}
#modal1 .flex_contener div.text_contener blockquote, #modal2 .flex_contener div.text_contener blockquote, #modal3 .flex_contener div.text_contener blockquote {width:30rem; font-size: 0.85rem;}
#modal1 .flex_contener div.text_contener blockquote p, #modal2 .flex_contener div.text_contener blockquote p, #modal3 .flex_contener div.text_contener blockquote p {margin-top:.5rem; text-align:justify;}
#modal1 .flex_contener div.text_contener blockquote iframe, #modal2 .flex_contener div.text_contener blockquote iframe, #modal3 .flex_contener div.text_contener blockquote iframe {width:31.25rem; height:18.75rem; padding-top:2rem;}
#modal1 .legende_contener, #modal2 .legende_contener, #modal3 .legende_contener {width:40rem; margin:0 auto; font-size:.7rem; font-style:italic; text-align:justify;}
#modal1 .legende_contener p:nth-child(2), #modal2 .legende_contener p:nth-child(2), #modal3 .legende_contener p:nth-child(2) {margin-top:.5rem}
#modal2 .flex_contener div.philip_a_dur {width:8.41rem; height:16.72rem; background-image:url('../images/v2/bureau/07.jpg'); background-position:center center; background-repeat: no-repeat; background-size:cover;}
#modal3 .flex_contener div.text_contener blockquote img {width:30rem; height:18rem; object-fit:cover; margin-top:2rem;}
/* end association */
/* end association */

.text-wrapper {line-height: 1.6;}
.text-more {margin-left: 5px;}
.toggle-btn {display: inline-block; margin-top: 8px; cursor: pointer; background: none; border: none; color: #04621b; font-weight:400; text-decoration: underline;}