@import 'materialize_short_min.css';

body, html {width:100%; height:100vh; line-height: inherit; font:112% "Open Sans","lucida sans unicode","lucida grande","Trebuchet MS",verdana,arial,helvetica,helve,sans-serif; font-weight:300; padding:0; height:100vh; color:#4e4e4e;}

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

:root {
    --MainBlue: #1b2973;
    --StudioBlue: #3f4d98;
    --ExterGreen: #3f9869;
    --TopMenuColor: #f3f3f3;
    --TextFont: 'Open Sans', sans-serif;
}

h1, h2, h3 {font-size:inherit; margin:inherit}

blockquote {border:inherit; padding:inherit; margin:inherit}
.material-icons {font-size:inherit};
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance:button; cursor: pointer;}

.modal {background-color: var(--StudioBlue); border-radius:.5rem;}
#modal1, #modal2, #modal3 {width:90vw}
#modal4 {width:90vw}
#modal5 {width:50vw}
#modal6 {width:94vw}

.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:white;}
.modalsv2 .modal-content p {text-align:center; color:white; 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 3rem; 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 {font-size:.9rem; 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 {padding:1rem .5rem 0 .5rem; margin-bottom:.7rem;}
#modal6 .modal-content p {font-size:.9rem}
#modal6 .modal-footer {padding-bottom:1.8rem}

#mod-loader.modal:not(.modalsv2) .modal-body {padding-top:15px}
#mod-loader.modal:not(.modalsv2) .text-info {font-size:65px; height:80px}

.anchors {width:100%;}
.BoxShadowed2 {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);}

.wrapper {position:relative; margin: 0 auto;}
.wrapper, nav.navcontener {width:98vw;}
nav {border:none; line-height:inherit; box-shadow:inherit;}
nav.navcontener {position:fixed; display:flex; justify-content:space-between; align-items:center; height:3.5rem; background-color:var(--TopMenuColor); border-radius:.2rem; z-index:11000}
nav.navcontener img.pictoside {height:2.4rem;}
nav.navcontener img.ps1 {margin-left:.5rem}
nav.navcontener img.ps2 {margin-right:.5rem}
nav.navcontener div.menucontener {position:relative; display:flex; justify-content:flex-start; align-items:center; height:2.4rem; padding:0 .4rem 0 .2rem; margin:0 auto; border:.15rem solid gray; border-radius:.35rem; background-color:#eaeceb2e;}
nav.navcontener div.menucontener i.material-icons {color:var(--ParisColor);}
nav.navcontener div.menucontener span {margin-left:.2rem; color:var(--ParisColor); font-size:90%; font-weight:500}

div.bmcontener {display:none; position:fixed; top:3.5rem; padding-bottom:3rem; background-color:var(--TopMenuColor); border-bottom-left-radius:1.5rem; border-bottom-right-radius:1.5rem; z-index:999}
div.bmcontener ul li {font:var(--Coconut); color:var(--ParisColor); text-align:center; cursor:pointer;}
div.bmcontener ul li a:hover {color:var(--CoconutColor)}
div.bmcontener p.lv {font-size:.85rem; text-align:center; margin-top:.5rem}
div.bmcontener .switchlangcontener {position:relative; display:flex; justify-content:center; align-items:center; width:100%;}
div.bmcontener .switchlangcontener a {font-size:90%; font-weight:500; color:var(--ParisColor); margin-right:.3rem; padding:.4rem .5rem; border:.17rem solid var(--ParisColor); border-radius:.35rem;}
span.closemnu {position:absolute; top:.3rem; right:.8rem; cursor:pointer; color:var(--ParisColor)}

main nav {position:absolute; display:none; line-height:inherit; color:inherit; padding:.4rem .4rem 1rem .4rem; background-color:white; z-index:1000}
main nav .triggerclosecontener {display:flex; justify-content:flex-end;}
main nav span#triggerclose {height:auto; font-size:1rem; color:gray; cursor:pointer}
.titlenav {margin:1.3rem 0 .7rem 0}
.titlenav h3 {width:100%; padding:inherit; font-size:1.8rem; font-weight:300; text-transform:uppercase;text-align:center;}

ul#mainmenu {display:flex; flex-direction:column; align-items:stretch; margin-top:.2rem;}
ul#mainmenu li {float:inherit;}
ul#mainmenu a, main nav a {display:block; color:inherit; text-decoration:none;}
ul#mainmenu a:hover {background-color:rgba(0,0,0,0.1); animation: fadeIn .8s;}
ul#mainmenu a {font-size:1.2rem; padding:.2rem .5rem; border-radius:3px; text-transform:uppercase;}
ul#secondmenu {display:flex; flex-direction: column; align-items: stretch; margin-top:1.5rem;}
ul#secondmenu li {float:inherit; }
#secondmenu a, main nav a {color:inherit; text-decoration:none;}
ul#secondmenu a {font-size:1rem; padding:.15rem .8rem; border-radius:2px}
.voile {background-color:#00000012}

div.mainc {position:relative; top:5.5rem;}
div.mainc div.titlebar h1 {margin:inherit; font-size:1.6rem; line-height:1rem; font-weight:100; text-transform:uppercase; letter-spacing:.25rem}
hr {width:100%; margin:1rem auto;}
div.mainc div.titlebar h2 {font-size:1.1rem; font-weight:400; line-height:.5rem; margin:0; text-transform: uppercase;}

section#home div.presentationc {width:100%;}
section#home div.presentationc h1, section#tarif1 h1, section#tarifs h1, section#devis h1, section#contact h1, section#contact h4 {text-align:center; font-size:1.45rem; font-weight:200; margin-top:1rem; text-transform:uppercase; letter-spacing:0.004em; line-height: inherit;}
section#home div.presentationc blockquote {display:block; margin:2.4rem auto; font-size:1.1rem; line-height:1.3rem; padding:0 1.2rem}
section#home div.presentationc blockquote p {display:flex; align-items:center; margin-bottom:.8rem; border:1px solid #cfcfcf; border-radius:.2rem; padding:.5rem .7rem}
section#home div.presentationc button {display:flex; font-size:1.2rem; font-weight:400; padding:.4rem 2rem; border-radius:.2rem;  margin:0 auto 2rem auto}
section#home div.presentationc button i {font-size:1.85rem; margin-right:.5rem}
section#home div.thumbs img {display:inherit; margin:0 auto}

section#tarifs h1 {margin:2rem auto 1rem auto; line-height:1.55rem}
section#tarifs div.tarifsc {width:100%; height:auto;}

section#tarifs div#tarifsc #options:hover {box-shadow: 3px 5px 7px #d3c3c3; background-color:#fbfbfb}
section#tarifs div#tarifsc #options .bloc_info {display:flex; flex-direction:column; justify-content:flex-start; align-items:center; text-align:center; padding:0 0 .7rem 0;}
section#tarifs div#tarifsc #options #bloc_info_3 {height:inherit}
section#tarifs div#tarifsc #options #bloc_info_3 table {width:100%; margin:0 auto}
section#tarifs div#tarifsc #options #bloc_info_3 tr:nth-child(even) {background:#f3f3f3}
section#tarifs div#tarifsc #options #bloc_info_3 tr:nth-child(2) {background:inherit}
section#tarifs div#tarifsc #options #bloc_info_3 tr td:nth-child(1) {text-align:left; padding-left:.5rem}
section#tarifs div#tarifsc #options #bloc_info_3 td {font-size:.55rem; padding:.05rem 0 .05rem 0; font-weight:400;text-align:left;}
section#tarifs div#tarifsc #options #bloc_info_3 tr td:nth-child(2) {text-align:right; padding-right:.1rem}
section#tarifs div#tarifsc #options #bloc_info_4 {border-bottom:none}
section#tarifs div#tarifsc #options #bloc_info_4 cite, section#devis .main_container .validContainer cite {font-size:.4rem; font-weight:400; line-height:.4rem; margin-bottom:.4rem; color:red}
section#tarifs div#tarifsc #options #bloc_info_4 button, div#validContainer button {display:flex; font-size:.85rem; font-weight:400; padding:.4rem 2rem; border-radius:.2rem;  margin:0 auto 2rem auto}

section#devis h1 {margin:2rem auto .6rem auto}
section#devis p.sous_titre {font-size:.8rem; margin-bottom:.6rem; text-align:center}
section#devis .main_container {width:100%; margin:0 auto 4rem auto; border-radius:.2rem; border:1px solid #d9d9d9}
section#devis .main_container .left_bloc {width:100%; height:100%;}
section#devis .main_container .right_bloc {width:100%; height:100%; background-color: #f5f5f5;}
section#devis .main_container .left_bloc, section#devis .main_container .right_bloc {padding:.6rem; min-height:9.8rem}
section#devis .left_bloc p:nth-child(2), section#devis .right_bloc p:nth-child(3), section#devis .right_bloc p:nth-child(5) {margin:.2rem 0 0 .1rem; font-size:.9rem; color:var(--MainBlue)}
section#devis .right_bloc p:nth-child(3) {margin-left:0}
section#devis .left_bloc input, 
section#devis .left_bloc input:focus,
section#devis .left_bloc select, 
section#devis .left_bloc textarea {border-width:inherit; margin-bottom:.2rem;}
::placeholder {color:var(--MainBlue)}
section#devis .left_bloc input[type="text"],
section#devis .left_bloc input[type="email"],
section#devis .left_bloc input[type="password"],
section#devis .left_bloc select,
section#devis .left_bloc textarea {font-size:.9rem; padding:.2rem .3rem; border:1px solid #95969b; border-radius:.1rem; color:var(--MainBlue);}
section#devis .left_bloc input[type="submit"] {font-size:.5rem; margin-top:1.2rem; padding:1.5rem 5.5rem; border:1px solid #cdcdcd}

section#devis .profContainer {display:flex; align-items:center; margin:.05rem 0 .4rem 0;}
section#devis .profContainer label {font-size:.57rem; line-height:1.28rem; font-weight:400; color:var(--MainBlue); margin-right:.20rem; padding-left:1.3rem}
section#devis .left_bloc input[type="text"]#NOM,
section#devis .left_bloc input[type="text"]#PRENOM,
section#devis .left_bloc input[type="text"]#CP,
section#devis .left_bloc input[type="text"]#VILLE,
section#devis .left_bloc input[type="email"]#EMAIL,
section#devis .left_bloc input[type="text"]#TEL,
section#devis .left_bloc select {display:inline; width:100%;}
section#devis .left_bloc textarea {width:100%; height:4rem;}
section#devis .left_bloc input[type="text"]#CP {width:4rem}
section#devis .left_bloc input[type="text"]#VILLE {width:8rem}
section#devis .left_bloc select {width:6.55rem; height:1.7rem}
section#devis .left_bloc input[type="email"]#EMAIL {width:12.3rem;}
section#devis .left_bloc input[type="text"]#TEL {width:6.50rem;}
section#devis .main_container .right_bloc .validContainer {display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem 0;}

section#devis .main_container .validContainer cite {color:inherit; text-align:center;}


section#devis .right_bloc .studioCheckContainer {margin-left:.1rem;}
section#devis .right_bloc .studioCheckContainer label {font-size:.82rem; line-height:1.28rem; font-weight:400; color:var(--MainBlue); margin-right:.20rem; padding-left:1.3rem}
section#devis .right_bloc .datesContainer {display:flex; margin-bottom:.4rem; align-items:center;}
section#devis .right_bloc .datesContainer * {font-size:.4rem; font-weight:400; color:var(--MainBlue)}
section#devis .right_bloc .datesLoc {display:inline; width:90%; font-size:.9rem; padding:.2rem .3rem; border:1px solid #95969b; border-radius:.1rem; color:var(--MainBlue);}
section#devis .right_bloc .EqListContainer {display:flex; flex-direction:column; align-items:flex-start; margin:.25rem 0 .3rem .1rem;}
section#devis .right_bloc .EqListContainer label {font-size:.70rem; line-height:.58rem; font-weight:400; color:var(--MainBlue); margin-right:.20rem; padding-left:1.3rem}
section#devis p.ErrorC {display:none; align-items:center; font-size:.35rem; font-weight:400; color:red;}
section#devis p.ErrorC .material-icons {font-size:.6rem; margin-right:.1rem}
section#devis .right_bloc div.descloc {margin:-.1rem 0rem .3rem .8rem;}
section#devis .right_bloc div.descloc p {font-size:.60rem; color:black}

form p {margin-bottom:inherit; text-align: left;}

section#devis .main_container * {
  font-size: .8rem;
}

section#localisation h1 {font-size:2.19rem;}
section#localisation h2 {font-size:1.79rem;}
section#localisation h3 {font-size:.9rem; font-weight:300; text-align: center;}
section#localisation h4 {font-size:1.10rem;}
section#localisation p {font-size:1rem}
section#localisation .s5 {font-size:.9rem; margin-bottom:20vh}
section#localisation .s4 {font-size:.90rem}
section#localisation .s3 {font-size:.85rem}
section#localisation .s2 {font-size:.75rem}
section#localisation .s1 {font-size:.60rem}

section#localisation h1 {margin:10vh 0 5vh 0}
section#localisation div.mediac {display:flex; flex-direction:column; align-items:center; width:100%;}
section#localisation div.mediac .localisation {width:95%; height:47vh; margin-top:7vh;}
section#localisation div.mediac .virtualtour {width:95%; height:47vh; margin-top:7vh;}
section#localisation div.mediac iframe {border:1px solid black}
section#localisation div.mediac iframe {width:100%; height:100%}
section#localisation div.mediac .localisation p, section#localisation div.mediac .virtualtour p {font-weight:400; text-align:center; margin-bottom:5px}
section#localisation a:link, section#home a:visited {text-decoration:underline; color:#d34836}
section#localisation a:hover {color:#3b5998}

.add-bg {background:url('../images/PostIt.png') no-repeat; background-position:center center; height:250px}
section#contact h1 {margin:2rem auto 1rem auto}
section#contact .contactc {position:relative;}
section#contact div.devbtn {display:flex; flex-direction:column; margin:0 auto; border:1px solid #3f4d98; border-radius:.1rem; padding:1rem 0; margin-bottom:2rem}
section#contact div.devbtn button, section#contact .formc button {font-size: .8rem; padding: .2rem 1rem; margin:0 auto .4rem auto; border-radius: .1rem; text-transform: uppercase;}
section#contact div.formc {width:90%; margin:0 auto}
section#contact div.formc h4 {font-size:.6rem; margin:0 auto .2rem 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 {font-size:.77rem; font-weight:400; padding:.2rem .3rem;  margin-bottom:.2rem; border:1px solid #95969b; border-radius:.1rem; color:var(--MainBlue);}
section#contact .formc button[type="submit"] {width:7rem; margin:.5rem auto;}
section#contact div.formc textarea {height:10rem;}
section#contact div.formc input#TEL {margin-bottom:.4rem;}
input:invalid, textarea:invalid {border-color: red;}
input:valid, textarea:valid {border-color:green}

.langlinkc {opacity:1}
.langlinkc img.Dr {width:.65rem; margin:0 .2rem 0 .2rem;}
.langlinkc form {display: inline}


@media only screen and (orientation:portrait) and (max-width:430px) {
    div.bmcontener {width:85vw; margin:0 0 0 6%;}
    div.bmcontener ul li {font-size:1.2rem;}
  }

  @media only screen and (orientation:landscape) and (max-height:930px) {
    div.bmcontener {width:44vw; margin:0 0 0 27%;}
    div.bmcontener ul li {font-size:2.3rem; line-height:2.5rem;}
  }