@font-face {
    font-family: 'Estrada';
    src: url('../fonts/estrada/Estrada-Signature-free.eot');
    src: url('../fonts/estrada/Estrada-Signature-free.eot?#iefix') format('embedded-opentype'),
         url('../fonts/estrada/Estrada-Signature-free.woff2') format('woff2'),
         url('../fonts/estrada/Estrada-Signature-free.woff') format('woff'),
         url('../fonts/estrada/Estrada-Signature-free.ttf')  format('truetype'),
         url('../fonts/estrada/Estrada-Signature-free.svg#Estrada Signature') format('svg');
}

* {text-rendering:optimizelegibility;}
*, *:before, *:after {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}

:root {
    --TextFont: 'Open Sans', sans-serif;
    --TextColor: #626262;
    --TitlesFont: "Estrada", sans-serif;
    --Times: italic bold 22px 'Times New Roman',Times, serif;
    --TitlesColor: black;
    --MainBGColor: #fdfdfd;
    --SecondaryBGColor: #f3f3f3;
    --WineColor: #7e3d3d;
    --PresqueNoir: #323232;
}


body, html {width:100%; font-family:var(--TextFont); font-size:100%; background-color:var(--MainBGColor);}
a {font-family: var(--TextFont);}
h1, h2, h3, h4 {margin:inherit}
.CurrentText {font-size:1.2rem; text-align:justify; line-height:1.8rem; color:var(--PresqueNoir);}
.MediumText {font-size:1rem; color:var(--PresqueNoir);}
::placeholder {color:#a3a0a0}
input:focus-visible {border:none;}
input:focus {border:none;}

.modal {background-color: var(--MainBGColor); border-radius:.5rem;}
#modal1, #modal2, #modal3 {width:30vw}
#modal4 {width:40vw}
#modal5 {width:20vw}
#modal6 {width:30vw}

.modalsv2 .modal-content {padding:0; margin-bottom:2rem;}
.modalsv2 h4 {text-align:center; font:var(--TextFont); font-size:1.3rem; margin:2.5rem 0 1rem 0; color:var(--TextColor);}
.modalsv2 .modal-content p {text-align:center; color:var(--TextColor); font-weight:400}
.modalsv2 .modal-footer {display:flex; justify-content:center; padding:.8rem 0 1rem 0; align-items:center; background-color: var(--SecondaryBGColor);}
.modalsv2 .modal-footer button {display:block; font-size:1rem; margin:0 1rem; padding:.5rem 4rem; border-radius:.2rem; border:inherit}
.modalsv2 .modal-footer button:hover {box-shadow: inset 0px 0px 19px -3px rgb(143 149 161 / 43%);}
.modalsv2 cite {text-align:center; font-size:.9rem; display:block;}

#modal4 .modal-content p {margin:1rem 0 .5rem 0}
#modal5 .modal-content {height:10rem; margin-bottom:0; background-image:url('../images/Picto_Success100x102.png'); background-repeat:no-repeat; background-position:center center;}
#modal6 .modal-content p {font-size:.9rem}

#mod-loader.modal:not(.modalsv2) .modal-body {padding-top:15px}
#mod-loader.modal:not(.modalsv2) .text-info {font-size:65px; height:80px}

.height-dev {margin:auto 2rem; background-color: #e4f1ab; border:1px solid var(--CoconutColor); padding:0 3rem; line-height:2.3rem; font-size:1.3rem}

pre {font-size:1.5rem;}

.G100 {font-weight:100}
.G300 {font-weight:300}
.G400 {font-weight:400}
.G500 {font-weight:500}

svg image {width:100%; height:100%;}
button:focus{background-color:rgb(123, 174, 230)}

.btn, .btn-large {font-size:1.5rem; padding:1.3rem 5rem; color:inherit; background-color:inherit;}
.btn-small {height:2.1rem}
.btn-small i {font-size:inherit}
.btn-small i.left {margin-right:8px;}
.btn-small i.right {margin-left:8px;}

.btn-very-small i {font-size:inherit}
.btn-very-small i.left {margin-right:6px;}
.btn-very-small i.right {margin-left:6px;}

.btn-very-very-small i {font-size:inherit}
.btn-very-very-small i.left {margin-right:4px;}
.btn-very-very-small i.right {margin-left:4px;}


.BoxShadowed {border: 1px solid #ddd;box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);}
blockquote {margin:0}

.wrapper {position:relative; margin: 0 auto;}
.innerwrap {position:relative; top:0; left:0; margin:0 auto}

main {position:relative;}
header:not(.mod) {position:sticky; top:0; left:0; height:7rem; background-color:var(--SecondaryBGColor); z-index:500}
header:not(.mod).isSticky {opacity:1;}

.reveal {opacity: 0;}
.reveal-visible {opacity: 1; transition: .6s cubic-bezier(.14,.7,.93,.5);}

input[type="text"], input[type="password"], input[type="email"], select, textarea, div.jfilestyle label {display:block; margin:.5rem auto 0 auto; font-size:1rem; padding:.5rem; border:1px solid #a3a0a0; border-radius:.3rem; color:var(--TextColor);}
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}
div.jfilestyle label {width:15rem; margin:0 auto; background-color:#bdbdbd; color:white; border:none}
div.jfilestyle label:hover {background-color:#afaeae;}
div.jfilestyle .count-jfilestyle {background-color:#33a04a; padding:3px 7px; margin-left:1px; border-radius:50%}


div.bottombutton {display:flex; justify-content:center; align-items:center; padding:.5rem 5rem; margin:0 auto; text-align:center; cursor:pointer;}
div.bottombutton p {line-height:1rem;}
div.bottombutton p span {font-size:.8rem}
div.bottombutton span.material-icons {display:inline; font-size:2.2rem; color: green;}

div.downloadc {margin-top:1.7rem; text-align:center; padding-top:.8rem; padding-bottom:1.2rem; cursor:pointer;}
div.downloadc p {line-height:1rem;}
div.downloadc p span {font-size:.8rem}
div.downloadc span.material-icons {font-size:2.2rem; color:#fb5353}

.bordered {padding:2rem; border:1px solid #c7c7c7; background-color:#efefef;}
.rounded {border-radius:.3rem;}
.transparent {background-color:transparent;}


.greenbtn {background-color:#2bbbadab;}
.greenbtn:hover {background-color:#8ce4cc;}
.greenbtn:visited, .greenbtn:focus {background-color:#2bbbadab;}

.redbtn {background-color:#fb5353; color:white; }
.redbtn:hover {background-color:#ff9494; box-shadow: inset 0px 0px 19px -3px rgb(143 149 161 / 43%);}
.redbtn:visited, .redbtn:focus {box-shadow: inset 0px 0px 19px -3px rgb(143 149 161 / 43%);}

.silverbtn {background-color:#f7f7f7;}
.silverbtn:hover {background-color:#ebebeb;}

.greybtn {background-color:#c1c1c1;}
.greybtn:hover {background-color:#f3f3f3;}

.brownbtn {background-color:#d7ccb3}
.brownbtn:hover {background-color:#e9c980;}

.big {padding:2rem 3rem; font-size:1.7rem}

div.loaderc {display:none; width:100%; height:100%; min-height:50px; background-image:url('../images/loader40x40.png'); background-repeat:no-repeat; background-position:center center;}

.opa1 {opacity:.1;}
.opa2 {opacity:.2;}
.opa5 {opacity:.5;}
.opa7 {opacity:.7;}
.opa10 {opacity:1;}

div.top {display:flex; height:7rem; justify-content:space-between; align-items:center;}
div.memberbar {display:flex; width:23rem; margin:1rem 2rem 0 0; justify-content:flex-end; align-items:center;}
div.memberbar .inner {display:flex; flex-direction:column; justify-content:flex-end; align-items:center;}

div.memberbar .inner p:nth-child(1) {font-size:1rem; align-self:flex-start; margin:0 0 .4rem 0}
div.memberbar .inner a:nth-child(3):link, div.memberbar .inner a:nth-child(3):visited, div.memberbar .inner a:nth-child(3):active,
div.memberbar .inner a:nth-child(2):link, div.memberbar .inner a:nth-child(2):visited, div.memberbar .inner a:nth-child(2):active {font-size:.8rem; margin:0 0 .3rem .9rem; color:inherit; align-self:flex-start;}
div.memberbar .inner p:nth-child(4) {font-size:.8rem;  margin:0 0 0 .9rem; align-self:flex-start; cursor:pointer;}
div.memberbar .inner p:nth-child(4) span {font-size:1.1rem; padding-right:.2rem; text-decoration: inherit;}
div.memberbar .inner a:nth-child(3):hover, div.memberbar .inner a:nth-child(2):hover, p:nth-child(4):hover {color:red}


div.togglemenuc {display:flex; width:25rem; align-items:center;}
div.togglemenu {display:flex; align-items:center; padding:.1rem .8rem .1rem .2rem; border:1px solid var(--TextColor); border-radius:3px; background-color:transparent;}
div.togglemenu:hover, div.espacemembres:hover {background-color:#d7ccb3; transition: background-color 1.2s;}
p#buttonmenu {color:var(--TextColor);}
p#buttonmenu .material-icons {line-height:inherit; font-size:2rem;}
header:not(.mod) div.top p {font-family:var(--TextFont); margin-left:.4rem; font-size:1rem; font-weight:400; align-self:center; cursor:pointer;}
div.central {width:8rem; height:7rem;}
div.central svg {margin-top:.3rem;}
div.espmenuc {display:flex; width:25rem; justify-content: flex-end;}
div.espacemembres {display:flex; justify-content:flex-start; align-items:center; width:12rem; padding:.1rem .2rem; border:1px solid var(--TextColor); border-radius:3px; background-color:transparent;}
p#esp .material-icons {line-height:inherit; font-size:2rem; color:var(--TextColor)}
main nav {position:absolute; display:none; top:0; width:100%; line-height:inherit; color:inherit; padding:1rem 1rem 4rem 0rem; background-color:#f5f5f5; z-index:1000}
main nav .triggerclosecontener {display:flex; justify-content:flex-end;}
main nav span#triggerclose {height:auto; font-size:2rem; color:gray; cursor:pointer}
main nav .titlenav {margin-bottom:2rem}
main nav .titlenav h3 {width:100%; padding:inherit; font-size:2rem; color:var(--TextColor); font-weight:300; text-align:center;}
main nav .menuc {display:flex;}
main nav .menuc .cols {display:flex; justify-content:flex-start; align-items:center; flex-direction: column; width:25%; margin:0 0; border-right:1px dotted var(--TextColor)}
main nav .menuc .cols h4 {font-weight:300; font-style:italic; font-size:1.5rem; margin-bottom:.8rem}
main nav .menuc div:last-child {border:none}
main nav .menuc .cols a:link, main nav .menuc .cols a:visited {font-size:1rem; color:inherit; text-decoration:none; line-height:2rem; text-align:center; min-width:19rem; margin-bottom:.8rem; border-bottom:1px dotted gray; border-radius: 2% / 58%;}
main nav .menuc .cols a:hover {background-color: #d7ccb3; transition: background-color 1s;}

.contener {display:flex; flex-direction:column; width:100%; height:33.4rem; justify-content:center; align-items:center; margin-bottom:1rem}

/* start home */
section#home {background-image:url('../images/signature_montesquieu_03.png'); background-repeat:no-repeat;}
section#home .contener .row1 h1 {font-family:var(--TitlesFont); color:var(--TextColor); font-size:6rem; font-weight:300; line-height:9rem}
section#home .contener .row2 {margin-top:3rem}
section#home .contener .row2 p {font-size:2.5rem; font-weight:300; text-align:center; color:var(--WineColor);}
/* end home */

/* start identité */
section#identite {background-image:url('../images/home2.png'); background-repeat:no-repeat;}
section#identite .innerwrap {width:68rem; margin:0 auto 0 auto;}

section#identite .row1 h2,
section#objectifs .row1 h2, 
section#histoire .row1 h2,
section#esp .row2 h2,
section#temoignages .row1 h2,
section#news .row2 h2,
section#agenda .row2 h2,
section#activites .row2 h2, 
section#documentation .row2 h2,
section#article .row2 h2,
section#liens .row2 h2,
section#contact .row2 h2,
section#mentions .row2 h2 {font-family:var(--TextFont); font-size:2rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}

section#identite .row2, section#identite .row3, section#objectifs, section#histoire, section#temoignages {margin-top:1.5rem}
section#identite .row2 p {font-size:1.5rem; font-weight:400; font-style:italic; text-align:center; color:var(--WineColor);}
section#identite .row3 h3, .innerwrap .boxes p:first-child, section#histoire .row2 h3, section#temoignages .row2 h3 {font-size:1.4rem; font-weight:400; font-style:italic; color:var(--WineColor);; margin-bottom:.2rem}
section#identite .row4 {display:flex; justify-content:space-between; align-items:center; margin-top:2rem}
section#identite .row4 img:first-child {width:42rem;}
section#identite .row4 img:nth-child(2) {width:22.5rem; }
/* end identité */

/* start objectifs */
section#objectifs .innerwrap {width:68rem; padding-bottom:3rem;}
section#objectifs .row2 {margin-top:1.5rem;}
section#objectifs .row2 p:last-child {margin-top:1rem;}
section#objectifs .innerwrap:nth-child(2) {display:flex; justify-content:space-between; width:90rem; margin-bottom:1rem}
section#objectifs .innerwrap .boxes {width:29rem;}
section#objectifs .innerwrap .boxes p:first-child  {text-align:center; margin-bottom:.8rem}
section#objectifs .innerwrap .boxes p {margin-bottom:.5rem}
section#objectifs .innerwrap .boxes span {color:var(--WineColor); font-weight:600}
section#objectifs .innerwrap .box1 {background-image:url('../images/buste_montesquieu_03.png');}
section#objectifs .innerwrap .box1 {background-position-x:19rem; background-position-y:bottom; background-size:8.8rem; background-repeat:no-repeat;}
section#objectifs .innerwrap .box2 {background-image:url('../images/2verres_03.png');}
section#objectifs .innerwrap .box2 {background-position-x:center; background-position-y:8.6rem; background-repeat:no-repeat;}
section#objectifs .innerwrap .box3 {background-image:url('../images/2022_003.png');}
section#objectifs .innerwrap .box3 {background-position-x:center; background-position-y:8rem; background-size:9.5rem; background-repeat:no-repeat;}
section#objectifs .innerwrap:nth-child(3) {position:relative; top:0; left:0; width:90rem; padding-bottom:0}
section#objectifs .innerwrap:nth-child(3) img {width:100%; border:1px solid #b1b1b1}
/* end objectifs */

/* start histoire */
section#histoire {background-image:url('../images/signature_montesquieu_03.png'); background-repeat:no-repeat;}
section#histoire .innerwrap {width:68rem;}
section#histoire .row2 {margin-top:1.5rem;}
section#histoire .row3 {display:flex; justify-content:space-between; align-items:center; margin-top:2rem}
section#histoire .row3 img:first-child {width:40rem;}
section#histoire .row3 img:nth-child(2) {width:26.80rem; }
/* end histoire */

/* start temoignges */
section#temoignages {background-image:url('../images/degustfil_03.png'); background-repeat:no-repeat;}
section#temoignages .innerwrap {width:68rem; padding-bottom:3rem;}
section#temoignages .row2 {margin-top:1.5rem;}
section#temoignages .innerwrap:nth-child(2) {display:flex; flex-wrap:wrap; justify-content:space-between; width:84rem; margin-bottom:1rem}
section#temoignages .innerwrap .boxes {width:40rem; margin-bottom:1rem;}
section#temoignages .innerwrap .boxes p:first-child  {text-align:center;}
section#temoignages .innerwrap .boxes p:not(:last-child) {text-align:left; margin-bottom:.5rem}
section#temoignages p:not(:first-child) {font-size:1rem; text-align:left; line-height:1.25rem; margin-bottom:.5rem;}
section#temoignages p.auteur {font-size:.9rem; line-height:1rem; text-align:right;}
/* end temoignges */

/* start bottomNav */


section#bottomNav .innerwrap {display:flex; flex-wrap:wrap; justify-content:space-between; width:68rem; margin-bottom: 10rem;}


/* start espace membres */
section#esp .row1 .innerwrap {width:90rem; padding-top:4rem}
section#esp .row1 h1 {font-family:var(--TitlesFont); color:var(--TextColor); font-size:4rem; text-align:center; font-weight:300; line-height:9rem}
section#esp .row2 .innerwrap {width:70rem; margin-top:1rem}
/* end espace membres */

/* start annuaire */
section#annuaire {padding:0 0 5rem 0; border-bottom:1px solid gray;}
section#annuaire .row1 .innerwrap {width:68rem; padding-top:3rem}
section#annuaire .rows h3 {font-family:var(--TextFont); font-size:1.4rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#annuaire .row1 .innerwrap .blocsc {display:flex; justify-content:flex-start; margin-top:1.3rem;}
section#annuaire .row1 .innerwrap .blocsc .bloc1 {width:50%; padding:0 2%;}
section#annuaire .row1 .innerwrap .blocsc .bloc1 input[type="text"] {width:100%;}
section#annuaire .row1 .innerwrap .blocsc .bloc2 {width:50%; min-height:16.2rem; padding:2.6% 3%; background-color: var(--SecondaryBGColor); border-radius:.5rem; margin-top:.5rem;}
section#annuaire .bloc1 form {padding-bottom:1.7rem;border-bottom:1px dotted gray}

section#annuaire .bloc2 div.infosmembrec {display:flex; justify-content:flex-start; align-items:center;}
section#annuaire .bloc2 img#blankresult {width:100%}
section#annuaire .bloc2 div.infosmembrec div.photo {width:7.815rem; margin-right:1.5rem; align-self:flex-start;}
section#annuaire .bloc2 div.infosmembrec div.photo img {width:7.815rem;}
section#annuaire .bloc2 div.infosmembrec div.infosadd {align-self:flex-start;}
section#annuaire .bloc2 div.infosmembrec div.infosadd p {font-size:.9rem;}
section#annuaire .bloc2 div.infosmembrec div.infosadd p:nth-child(1) {font-size:inherit; margin:.2rem 0 .6rem 0}
section#annuaire .bloc2 div.infosmembrec div.infosadd p:nth-child(3) {margin-bottom:.4rem;}
section#annuaire .bloc2 div.infosmembrec div.infosadd p:nth-child(4) {margin-bottom:.6rem;}
section#annuaire .bloc2 div.infosmembrec div.infosadd p:nth-child(5) {margin-bottom:.6rem;}
/* end annuaire */

/* start lettre */
section#lettre {padding:2rem 0 5rem 0; border-bottom:1px solid gray;}
section#lettre .row1 .innerwrap {width:68rem;}
section#lettre .rows h3 {font-family:var(--TextFont); font-size:1.4rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#lettre .row1 .innerwrap .lettresc {width:100%; display:flex; justify-content:space-around; align-items:center; flex-wrap: wrap; margin-top:1.5rem;}
section#lettre .lettresc .inner {width:100%; display:flex; flex-direction:column; justify-content: flex-start; align-items:center; text-align:center; margin-bottom:1rem; padding-top:.8rem; padding-bottom:1.2rem; cursor:pointer;}
section#lettre span.material-icons {font-size:2.2rem; color:#fb5353}
section#lettre .lettresc .inner p span:not(.material-icons) {font-size:.8rem}
/* end lettre */

/* start videos */
section#videos {padding:2rem 0 5rem 0; border-bottom:1px solid gray;}
section#videos .row1 .innerwrap {width:68rem;}
section#videos .rows h3 {font-family:var(--TextFont); font-size:1.4rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#videos .row1 .innerwrap .videosc {width:100%; display:flex; justify-content:space-around; align-items:center; flex-wrap: wrap; margin-top:1.5rem;}
section#videos .videosc .inner {width:45%; display:flex; justify-content: flex-start; align-items:center; margin-bottom:1rem; padding:.8rem 1rem 1.2rem 1rem; cursor:pointer;}
section#videos .videosc .inner .videothumb {margin-right:.5rem}
section#videos .videosc .inner .videothumb img {height:5.5rem}
section#videos .videosc .inner .videodescr {display:flex; flex-direction:column; justify-content:flex-start; min-height:5.5rem; margin:.3rem 0 0 .5rem;}
section#videos .videosc .inner .videodescr p:nth-child(1) {font-size:1rem;}
section#videos .videosc .inner .videodescr p:nth-child(2) {font-size:.9rem; margin:.5rem 0}
section#videos .videosc .inner .videodescr p:nth-child(3) {font-size:.8rem; margin:.5rem 0}
section#videos .videosc .inner .videodescr p:nth-child(4) {color:#fb5353}
/* start end */

/* start galerie */
section#galerie {padding:2rem 0 5rem 0; margin-bottom:10rem; border-bottom:1px solid gray;}
section#galerie .row1 .innerwrap {width:68rem;}
section#galerie .rows h3 {font-family:var(--TextFont); font-size:1.4rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#galerie .row1 .innerwrap .galeriec {width:100%; display:flex; justify-content:space-around; align-items:center; flex-wrap: wrap; margin-top:1.5rem;}
section#galerie .galeriec .inner {width:23%; display:flex; min-height:20.6rem; justify-content: flex-start; margin-bottom:1rem; padding:.8rem 1rem 1.2rem 1rem; cursor:pointer;}
section#galerie .galeriec .inner .innerbox {display:flex; flex-direction:column; justify-content:space-between; align-items:center;}

section#galerie .galeriec p {text-align:center; font-size:.9rem}
section#galerie .galeriec p:nth-child(2) {font-weight:400}
section#galerie .galeriec div.diapolink {display:flex; justify-content:space-between; align-items:center; width:100%; border-top:1px dotted gray; border-bottom:1px dotted gray;}
section#galerie .galeriec div.diapolink p {font-size:.8rem}
section#galerie span.material-icons {color:#fb5353}
/* end galerie */

/* start infosmembres */
section#infosmembres {padding:0 0 5rem 0; border-bottom:1px solid gray;}
section#infosmembres .row1 .innerwrap {width:70rem; padding-top:3rem}
section#infosmembres .rows h3 {font-family:var(--TextFont); font-size:1.4rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#infosmembres .rows h4 {font-family:var(--TextFont); font-size:1rem; font-weight:400; margin:0 0 .8rem 0; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
section#infosmembres .row1 .innerwrap .blocsc {display:flex; justify-content:space-evenly; margin-top:1.3rem;}
section#infosmembres .row1 .innerwrap .blocsc .bloc1 {width:51%; padding:2rem; background-color: var(--SecondaryBGColor); border-radius:.5rem; margin-top:.5rem;}
section#infosmembres .row1 .innerwrap .blocsc .bloc1 input[type="text"], section#infosmembres .row1 .innerwrap .blocsc .bloc1 input[type="email"] {width:100%;}
section#infosmembres .row1 .innerwrap .blocsc .bloc2 {width:41%; display:flex; flex-direction:column; justify-content:flex-start; justify-items:flex-start; align-items:center; margin-top:.5rem;}
section#infosmembres .bloc1 form {padding-bottom:1.7rem;}
section#infosmembres .bloc1 form input[type="text"], section#infosmembres .bloc1 form textarea {margin-top:.3rem}
section#infosmembres .bloc1 form input[type="text"]#CP {display:inline; width:8rem}
section#infosmembres .bloc1 form input[type="text"]#CP {text-align:center;}
section#infosmembres .bloc1 form input[type="text"]#VILLE {display:inline; width:23.2rem;}
section#infosmembres .bloc1 form input[type="text"]#TELDOM, section#infosmembres .bloc1 form input[type="text"]#TELBUR  {margin-left:inherit; margin-right:inherit; width:25rem}
section#infosmembres .bloc1 form input[type="text"]#TELDOM, section#infosmembres .bloc1 form input[type="text"]#TELBUR {display:inline;}
section#infosmembres .bloc1 form input[type="text"]#TELPOR {margin-bottom:.8rem}
section#infosmembres .bloc1 form cite {font-size:.8rem; color:gray; margin-left:.5rem;}
section#infosmembres .bloc1 form textarea {background-color: white; height:5rem}
section#infosmembres .bloc1 form textarea:nth-of-type(2) {height:4rem; font-size:.9rem; margin-bottom:.8rem}
section#infosmembres .bloc2 div.rows {width:100%; padding:2rem; background-color: var(--SecondaryBGColor); border-radius:.5rem; margin-bottom:.8rem}
section#infosmembres div#motdepasse div {display:flex; flex-direction:column; width:100%; margin-bottom:.7rem}
section#infosmembres div#motdepasse div p:not(.ErrorC1, .ErrorC2) {font-size:.9rem; margin-bottom:0; text-align:center;}
section#infosmembres div#motdepasse div input[type="password"], section#infosmembres div#motdepasse div input[type="text"] {width:15rem; margin-top:.2rem; text-align:center;}
section#infosmembres div#motdepasse div:nth-child(2){margin-bottom:0}
section#infosmembres div#motdepasse cite {font-size:.8rem; margin-top:.2rem; color:rgb(48, 29, 29); text-align:center; cursor:pointer}
section#infosmembres div#motdepasse cite:hover {color:red}
section#infosmembres .ErrorC1, section#infosmembres .ErrorC2 {display:none; width:18.2rem; align-self:center; margin-top:.4rem; font-size:.8rem; font-weight:400; color:red;}
section#infosmembres .ErrorC1 i, section#infosmembres .ErrorC2 i {font-size:1.3rem; margin-right:.45rem;}
section#infosmembres div.ajaxphotoc {height:9rem}
section#infosmembres div#photo div#ajaxphotoc img {display:block; margin:0 auto}
section#infosmembres div#photo div.remplacelinkc p, section#infosmembres div#photo div.deletelinkc p {display:flex; justify-content:center; align-items:center; font-size:.85rem; margin-bottom:.4rem; text-decoration:none; cursor:pointer;}
section#infosmembres div#photo div.remplacelinkc p:hover, section#infosmembres div#photo div.deletelinkc p:hover {color:red;}
section#infosmembres div#photo div.togglediv {display:none;}
section#infosmembres div#photo div.togglediv cite {display:block; margin-top:1.5rem ;font-size:.8rem}
section#infosmembres div#photo div.togglediv button[type="submit"] {display:flex; align-items:center; width:15rem; margin-top:.5rem; color:white}
section#infosmembres div#photo div.togglediv .material-icons {margin-right:.5rem;}
/* end infosmembres */

/* start nouvelles */
section#news {background-image: url('../images/signature_montesquieu_03.png'); background-repeat: no-repeat;}
section#news .row1 .innerwrap {width:90rem; padding-top:4rem}
section#news .row1 h1 {font-family:var(--TitlesFont); color:var(--TextColor); font-size:4rem; text-align:center; font-weight:300; line-height:9rem}
section#news .row2 .innerwrap {width:70rem; margin-top:1rem}
section#news .row3 .innerwrap {width:70rem; padding:1.5rem 2rem; background-color:var(--SecondaryBGColor); margin-top:2rem; margin-bottom:5rem}
section#news .row3 .innerwrap h3 {display: inline-block; min-width: 23rem; margin-top:0; margin-bottom:0; padding: 1rem 2rem; text-align: center; font-family: var(--TextFont); font-size: 1.3rem; font-weight: 400; font-style:italic; color: var(--WineColor); background-color: var(--MainBGColor); border-radius: 0.3rem;}
section#news .row3 .mainflex {display:flex; justify-content:flex-start; margin-top:1.5rem;}
section#news .row3 .mainflex .imgc {width:23rem}
section#news .row3 .mainflex .textc {padding:0 0 2rem 2rem; font-family:var(--TextFont); color:var(--PresqueNoir)}
section#news .row3 .mainflex .textc p.titre {text-align:left; font-size:1.3rem; font-weight:500; font-style:italic;}
section#news .row3 .mainflex .textc p {line-height:1.5rem; margin-bottom:1rem; text-align:justify;}
section#news .row3 .mainflex .imgc img {max-width:23rem; border:1px solid #cbc6c6; margin-bottom:.5rem}
/* end nouvelles */

/* start agenda */
section#agenda {background-image: url('../images/signature_montesquieu_03.png'); background-repeat: no-repeat;}
section#agenda .row1 .innerwrap, 
section#activites .row1 .innerwrap, 
section#documentation .row1 .innerwrap,
section#article .row1 .innerwrap,
section#liens .row1 .innerwrap,
section#contact .row1 .innerwrap,
section#mentions .row1 .innerwrap {width:90rem; padding-top:4rem}

section#agenda .row1 h1, 
section#activites .row1 h1, 
section#documentation .row1 h1,
section#article .row1 h1,
section#liens .row1 h1,
section#contact .row1 h1,
section#mentions .row1 h1 {font-family:var(--TitlesFont); color:var(--TextColor); font-size:4rem; text-align:center; font-weight:300; line-height:9rem}

section#agenda .row2 .innerwrap, 
section#activites .row2 .innerwrap, 
section#documentation .row2 .innerwrap {display:flex; justify-content:center; align-items:center; width:70rem; margin-top:1rem}

section#agenda .row2 h2, 
section#activites .row2 h2, 
section#documentation .row2 h2,
section#article .row2 h2,
section#liens .row2 h2,
section#contact .row2 h2,
section#mentions .row2 h2 {display:inline; margin:0 1rem 0 0}

section#agenda .row2 select,
section#activites .row2 select,
section#article .row2 select,
section#liens .row2 select {display:inline; width:8rem; font-family:var(--TextFont); font-size:1.5rem; font-weight:300; padding: .5rem; border: 1px solid #a3a0a0; border-radius: .3rem; color: var(--TextColor);}

section#agenda .row2 select option,
section#activites .row2 select option,
section#article .row2 select option,
section#liens .row2 select option {font-family:var(--TextFont); font-size:1.3rem; font-weight:300;}

section#agenda .row3 .innerwrap {display:flex; justify-content:flex-start; flex-wrap:wrap; width:90rem; padding:1.5rem 2rem; margin:2rem auto 5rem auto}
section#agenda .row3 .innerwrap .agendabox {display:flex; flex-direction:column; width:20rem; padding:1rem 1rem 2rem 1rem; border:1px solid gray; border-radius:.2rem; margin:0 1.5rem 1.5rem 0}
section#agenda .agendabox .head {width:100%; background-color:var(--SecondaryBGColor);}
section#agenda .agendabox .head p {line-height:2rem; font-weight:600; font-style:italic; text-align:center; color:var(--WineColor)}
section#agenda .agendabox .textc {margin-top:1rem; line-height:1.3rem;}
/* end agenda */

/* start activites */
section#activites .row3 .innerwrap {display:flex; justify-content:space-between; flex-wrap:wrap; width:90rem; padding:1.5rem 2rem; margin:2rem auto 5rem auto}
section#activites .row3 .innerwrap .activitebox {display:flex; flex-direction:column; width:40rem; padding:1rem 1rem 2rem 1rem; border:1px solid gray; border-radius:.2rem; margin-bottom:2.1rem;}
section#activites .activitebox .head {width:100%; background-color:var(--SecondaryBGColor);}
section#activites .activitebox .head p {line-height:3rem; font-size:1.2rem; font-style:italic; text-align:center; color:var(--WineColor)}
section#activites .activitebox .titresc {margin-top:1rem; text-align:center; font-size:1.2rem}
section#activites .activitebox .titresc p:nth-child(1):first-letter {text-transform: uppercase;}
section#activites .activitebox .titresc p:nth-child(2) {margin-top:.2rem; font-size:1rem}
section#activites .activitebox .textc {margin-top:1rem; line-height:1.3rem;}
section#activites .activitebox .docsc {display:flex; flex-direction: column; margin-top:2rem}
section#activites .activitebox .docsc div {width:25rem; margin:0 auto}
section#activites .activitebox .docsc div:nth-child(1) img {width:100%; padding:.2rem; border:1px solid var(--WineColor)}
section#activites .activitebox .docsc div:nth-child(2) div.downloadc {margin-top:0}
/* end activites */

/* start documentation */
section#documentation {background-image:url('../images/degustfil_03b.png'); background-repeat:no-repeat; margin-bottom:5rem}
section#documentation .row3 .innerwrap {display:flex; justify-content:space-between; flex-wrap:wrap; width:90rem; padding:1.5rem 2rem; background-image:url('../images/home2.png'); background-repeat:no-repeat;}
section#documentation .row3 .mapbox {width:49rem; padding:2.5rem 0; border:1px solid gray; border-radius:.2rem; margin:3rem auto 2.1rem auto;}
section#documentation .row3 .mapbox img {display:block; margin:0 auto}
section#documentation .row3 .innerwrap .docbox {display:flex; flex-direction:column; width:40rem; padding:1rem 1rem 2rem 1rem; border:1px solid gray; border-radius:.2rem; margin-bottom:2.1rem; cursor:pointer}
section#documentation .row3 .innerwrap .docbox:hover {background-color:#f0f0f0; transition-duration:300ms;}
section#documentation .docbox .titresc {margin-top:1rem; text-align:center; font-size:1.2rem}
section#documentation .docbox .titresc p:nth-child(1):first-letter {text-transform: uppercase;}
section#documentation .docbox .textc {margin-top:1rem; line-height:1.3rem;}
section#documentation .docbox .textc cite {font-size:.9rem}
section#documentation .docbox .textc cite:hover {color:red}
section#documentation .row4 .innerwrap {width:90rem; margin-bottom:2rem;}
section#documentation .row4 .innerwrap img {width:100%; border: 1px solid #b1b1b1;}
section#documentation .row5 .innerwrap {width:90rem; margin-bottom:10rem;}
section#documentation .docbox .bottombutton {width:auto; margin-top:1rem; padding:.5rem 4rem}
/* end documentation */

/* start article */
section#article .row2 select {width:30rem; display: block; margin:3rem auto 0 auto;}
section#article .row2 .innerwrap {width:70rem; margin-top:1rem}

section#article .row3 .innerwrap,
section#mentions .row3 .innerwrap {width:75rem; padding:1.5rem 2rem; text-align:justify;}

section#article .row3 .innerwrap p,
section#mentions .row3 .innerwrap p {font-size:.9rem; line-height:1.2rem; margin-bottom:1rem}

section#article .row3 .innerwrap p span,
section#article .row3 .innerwrap h4,
section#mentions .row3 .innerwrap p span {font-style:italic; font-size:1.1rem; text-decoration:underline;}
section#article .row3 .innerwrap h4 {font-weight: inherit;}
section#article .row4 .innerwrap {width:70rem; margin-bottom:3rem}
section#article .row5 .innerwrap {width:90rem; margin-bottom:3rem;}
section#article .row5 .innerwrap img {width:100%; border: 1px solid #b1b1b1;}
section#article .row6 .innerwrap {width:90rem; margin-bottom:10rem;}
/* end article */

/* start liens */
section#liens {background-image:url('../images/signature_montesquieu_03.png'); background-repeat:no-repeat; margin-bottom:5rem}
section#liens .row3 .innerwrap {width:70rem; margin-top:1rem}
section#liens .row2 select {width:40rem; font-size:1.5rem; display: block; margin:3rem auto 0 auto;}
section#liens .scategbox {margin-bottom:1rem}
section#liens .scategbox h3 {font-size:1.2rem; font-weight:400; font-style:italic; color:var(--WineColor); padding-left:1rem; margin-bottom:.2rem}
section#liens .scategbox .linkbox {padding:1rem; margin-top:1rem; background-color: var(--SecondaryBGColor); cursor:pointer;}
section#liens .scategbox .linkbox:hover {background-color:#ebebeb}
section#liens .scategbox .linkbox a:link, section#liens .scategbox .linkbox a:visited {font-size:1rem; color:#c25050}
section#liens .scategbox .linkbox a:hover  {color:#920f0f}
section#liens .scategbox .linkbox p {font-size:.9rem;margin-top:.5rem;}
/* end liens */

/* start contact */
section#contact {background-image:url('../images/signature_montesquieu_03.png'); background-repeat:no-repeat; margin-bottom:5rem}
section#contact .row2b .innerwrap {width:41rem; text-align:center; padding:2rem 0;}
section#contact .row3 .innerwrap {width:70rem;}
.add-bg {background:url('../images/PostIt.png') no-repeat; background-position:center center; min-height:20rem}
section#contact div.formc {width:100%; margin:0 auto}
section#contact div.formc form {display:flex; flex-direction:column; margin-bottom:2rem;}
section#contact .formc input[type="text"],
section#contact .formc input[type="email"],
section#contact .formc textarea {width:36rem}
section#contact div.formc textarea {height:15rem;}
section#contact div.formc input#TEL {margin-bottom:.4rem;}
::placeholder {color:var(--TextColor)}
/* end contact */

/* start mentions */
section#mentions .row3 .innerwrap {margin-bottom:5rem}
/* end mentions */

/* start identification */
section#ident .row1 .innerwrap {width:55rem;}
section#ident .row1 .innerwrap div.contenerbloc {display:flex; justify-content:flex-start; align-items:center; width:100%; margin:2rem auto 0 auto; padding:2rem; border:1px solid #c7c7c7; border-radius:.3rem; background-color:#efefef;}
section#ident .leftbloc, section#ident .rightbloc {width:50%; height:15rem}
section#ident .leftbloc {border-right:1px dotted gray}
section#ident .leftbloc p:first-child{font-family:var(--TextFont); margin-top:.5rem; font-size:1.3rem; font-weight:300; text-align:center; color:var(--PresqueNoir); text-transform:uppercase;}
form#LogForm {margin-top:1.2rem}
form#LogForm input[type="text"], form#LogForm input[type="password"] {width:75%;}
section#ident a:link, #ident a:visited {display:block; text-decoration:none; font-size:.8rem; margin:1rem auto; color:var(--WineColor); text-align: center;}
section#ident a:hover {color:red}
section#ident .rightbloc {background-image:url('../images/cadenas_03.png'); background-repeat:no-repeat; background-position:center center; background-size:16rem;}
section#ident form#LogForm cite {display:block; margin:.4rem auto 0 auto; font-size:.8rem; color:rgb(48, 29, 29); text-align:center; cursor:pointer}
section#ident form#LogForm cite:hover {color:red}
/* end identification */

form#RPass input[type="email"] {width:25rem;}


/* Ordinateur écran > 1921px et au delà */
@media only screen and (orientation:landscape) and (min-width:1921px) {
    .wrapper{width:115rem;}
    section#home, section#histoire, section#liens, section#contact {background-position:left 3rem top 4rem; background-size:9rem;}
    section#identite {background-position:right 4rem top; background-size:14rem;}
    section#temoignages {background-position:right 3rem bottom 12rem; background-size:18rem;}
    section#news {background-position:left 3rem top 4rem; background-size:9rem;}
    section#agenda {background-position:left 3rem top 7rem; background-size:7rem;}
    section#documentation {background-position:left top 11rem;}
}

/* Ordinateur écran > 1440px et <= 1920px */  
@media only screen and (orientation:landscape) and (min-width:1441px) and (max-width:1920px) {
    .wrapper{width:115rem;}
    section#home, section#histoire, section#liens, section#contact {background-position:left 3rem top 4rem; background-size:9rem;}
    section#identite {background-position:right 4rem top; background-size:14rem;}
    section#temoignages {background-position:right 3rem bottom 12rem; background-size:18rem;}
    section#news {background-position:left 3rem top 4rem; background-size:9rem;}
    section#agenda {background-position:left 3rem top 7rem; background-size:7rem;}
    section#documentation {background-position:left top 11rem;}
    section#documentation .row3 .innerwrap {background-position:right bottom; background-size:14rem;}
}

/* Laptop HDPI */
@media only screen and (orientation:landscape) and (min-width:1367px) and (max-width:1440px) {
    .wrapper{width:93rem;}
    body, html {font-size:90%}
    div.memberbar .inner a:nth-child(2):link, div.memberbar .inner a:nth-child(2):visited, div.memberbar .inner a:nth-child(2):active,
    div.memberbar .inner a:nth-child(3):link, div.memberbar .inner a:nth-child(3):visited, div.memberbar .inner a:nth-child(3):active {font-size:1rem;}
    section#home, section#histoire, section#liens, section#contact {background-position-x:0rem; background-position-y:4rem; background-size:9rem;}
    section#identite {background-position:right -3rem top 1rem; background-size:13rem;}
    section#infosmembres div.ajaxphotoc {height:10rem;}
    section#infosmembres div#photo div.remplacelinkc {margin-top:1rem;}
    section#infosmembres div#photo div.remplacelinkc p, section#infosmembres div#photo div.deletelinkc p {margin-bottom:0; font-size:.95rem}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
    section#news {background-position:left 3rem top 4rem; background-size:9rem;}
    section#agenda {background-position:left 3rem top 7rem; background-size:7rem;}
    section#documentation {background-position:left top 11rem;}
    section#documentation .row3 .innerwrap {background-position:right bottom; background-size:14rem;}
}

/* Laptop MDPI */
@media only screen and (orientation:landscape) and (min-width:1113px) and (max-width:1280px) {
    .wrapper{width:89rem;}
    body, html {font-size:85%}
    div.memberbar .inner a:nth-child(2):link, div.memberbar .inner a:nth-child(2):visited, div.memberbar .inner a:nth-child(2):active,
    div.memberbar .inner a:nth-child(3):link, div.memberbar .inner a:nth-child(3):visited, div.memberbar .inner a:nth-child(3):active {font-size:1rem;}
    section#home, section#histoire, section#liens, section#contact {background-position-x:0rem; background-position-y:4rem; background-size:8.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
    section#infosmembres div.ajaxphotoc {height:10rem;}
    section#infosmembres div#photo div.remplacelinkc {margin-top:1rem;}
    section#infosmembres div#photo div.remplacelinkc p, section#infosmembres div#photo div.deletelinkc p {margin-bottom:0; font-size:.95rem}
    section#news {background-position:left 3rem top 4rem; background-size:9rem;}
    section#agenda {background-position:left 3rem top 7rem; background-size:7rem;}
    section#documentation {background-position:left top 11rem;}
    section#documentation .row3 .innerwrap {background-position:right bottom; background-size:14rem;}
}

/* Ipads Pro 12.9 pouces en paysage */
@media only screen and (orientation:landscape) and (min-width:1281px) and (max-width:1366px) {
    .wrapper{width:89rem;}
    body, html {font-size:90%}
    section#home, section#histoire, section#liens, section#contact {background-position-x:0rem; background-position-y:4rem; background-size:8.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
}

/* IPad2 et IpadPro 10.5 pouces orientation paysage jusqu'à 1112px */
@media only screen and (orientation:landscape) and (min-width:1025px) and (max-width:1180px) {
    .wrapper{width:90rem;}
    body, html {font-size:75%}
    section#home, section#histoire, section#liens, section#contact {background-position-x:0rem; background-position-y:4rem; background-size:8.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
}

/* IPad orientation paysage */
@media only screen and (orientation:landscape) and (min-width:901px) and (max-width:1024px) {
    .wrapper{width:79rem;}
    body, html {font-size:75%}
    .MediumText {font-size:1.2rem}
    main nav .menuc .cols a:link, main nav .menuc .cols a:visited {font-size:1.25rem}
    section#objectifs .innerwrap:nth-child(2), section#objectifs .innerwrap:nth-child(3) {width:80rem}
    section#objectifs .innerwrap .boxes {width:26rem; padding:2rem 1.4rem}
    section#temoignages .innerwrap:nth-child(2) {flex-direction:column; justify-content:center; align-items:center;}
    section#temoignages .innerwrap .boxes {width:68rem}
    section#temoignages p:not(:first-child) {font-size:1.25rem}
    section#home, section#histoire {background-position-x:-1rem; background-position-y:4rem; background-size:6.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
}

@media only screen and (orientation:landscape) and (max-height:600px) {
    #modal1, #modal2, #modal3 {width:40vw}
    #modal4 {width:40vw}
    #modal5 {width:20vw}
    #modal6 {width:40vw}
    .modal-content p {font-size:1rem}
    section#ident .row1 .innerwrap {margin-bottom:10rem}
}

/* iPads Orientation Portrait */
@media only screen and (orientation:portrait) and (max-height:1400px) {
    .wrapper {width: 90rem;}
    body, html {font-size:66%}
    .MediumText {font-size:1.2rem}
    section#identite .innerwrap, section#objectifs .innerwrap, section#histoire .innerwrap {width:80rem}
    section#home, section#histoire {background-position-x:-1rem; background-position-y:4rem; background-size:6.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}
}

/* iPads 2 Orientation Portrait */
@media only screen and (orientation:portrait) and (max-height:1180px) {
    .wrapper {width: 90rem;}
    body, html {font-size:57%}
    .MediumText {font-size:1.2rem}
    section#identite .innerwrap, section#objectifs .innerwrap, section#histoire .innerwrap {width:80rem}
    section#home, section#histoire {background-position-x:-1rem; background-position-y:4rem; background-size:6.5rem;}
    section#identite {background-position:right -3.4rem top 2rem; background-size:13rem;}
    section#temoignages {background-position:right -5rem bottom 12rem; background-size:18rem;}

}