@import url('https://fonts.googleapis.com/css2?family=Wendy+One&display=swap');

:root{--rose: #f3426e; }

html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}

html,body,tr,td,th{font: normal 12pt arial,sans-serif;}
body{margin:0;}
h1,h2,h3,h4,h5 {font-family: "Wendy One", sans-serif}


p{margin:0;padding:0;}
.txc{text-align:center;}
.txl{text-align:left;}
.txr{text-align:right;}
.txj{text-align:justify;}

.w05{width: 5%;}.w10{width:10%;}.w15{width:15%;}.w20{width:20%;}.w25{width:25%;}
.w30{width:30%;}.w35{width:35%;}.w40{width:40%;}.w45{width:45%;}.w50{width:50%;}
.w55{width:55%;}.w60{width:60%;}.w65{width:65%;}.w70{width:70%;}.w75{width:75%;}
.w80{width:80%;}.w85{width:85%;}.w90{width:90%;}.w95{width:95%;}.w99{width:99%;}

td,th{vertical-align:top;}

.bbottom{border-bottom:solid 2px var(--rose);}

section{margin-left:300px;position:relative;min-height:100vh;} /* margin-left = width de nav */
section img{width:100%;}

.flex{display:flex; justify-content:space-between;}
.flexitem{margin:10px;}
.flex h2{margin:0;}
.flexh3{font-style:italic;}
.flextx{margin-top:10px;}

#divmain_index{padding:80px 40px 280px 40px;}
#divmain{padding:80px 40px 160px 40px;}
.divheader{border-bottom:dotted 5px var(--rose);}
h1{font-size:32pt; color:var(--rose);}
h2{font-size:24pt; color:#444;}
h3{font-size:18pt;}
hr.hr1{width:100px; border:5px solid #444; border-radius:4px; margin:0 0 32px 0;}

blockquote.encadre{border-left:solid 5px var(--rose); padding:16px;}
a,a:visited{color:var(--rose);}

/* form */
input,select,textarea{font-size:12pt; padding:8px;}
textarea{resize:none;}
div.champ{margin:16px 0;}
input[type=submit]{background-color:var(--rose); color:white; padding:16px; border:none; cursor:pointer;}

/* nav (menu) */
nav{height:100%; width:300px; background-color:var(--rose); color:white; position:fixed; overflow:auto; padding:8px 16px; z-index:2; font-weight:bold;}
nav p.logo{font-size:11pt; font-weight:normal; padding:48px 0 24px 0;}
nav p.logo img{width:200px;}
nav a, nav a:visited{display:block; padding:12px 16px; text-decoration:none; color:white;}
nav a:hover{background:#ccc; color:black;}
nav p.fermer{width:100%; background:#444; position:absolute; left:0; top:0; text-align:center; padding:8px; cursor:pointer;}
nav p.fermer:hover{background:#ccc; color:black;}
nav hr{border:solid 1px white; margin:16px;}

/* header (barre supérieure pour smartphone) */
header{bbackground-color:var(--rose);position:absolute;left:5%;top:5%; z-index:1; cursor:pointer;}
header p.burger{width:100%; cursor:pointer; color:white;padding:8px;}
header p.burger:hover{background:#ccc; color:black;}

/* footer (fixe en bas) */
footer{background:#d8d8d8; text-align:center; padding:32px; position:absolute; bottom:0; width:100%;}

/* photo zoom */
#divzoom{z-index:2;display:none;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background:#111;}
#divzoom_caption{color:white; padding-top:32px;}
#divzoom_img{margin:auto;padding:64px;text-align:center;}

/* medias */
@media (min-width:993px){ /* pc */
	nav{display:block}
	.hidelarge{display:none!important}
}
@media (max-width:992px){ /* smartphone */
	nav{display:none; width:100%;}
	section{margin:0;}
	.hidesmart{display:none!important}
	.flex,.flexitem{display:block; width:100%; margin:0;}
	.w05{width:100%;}.w10{width:100%;}.w15{width:100%;}.w20{width:100%;}.w25{width:100%;}
	.w30{width:100%;}.w35{width:100%;}.w40{width:100%;}.w45{width:100%;}.w50{width:100%;}
	.w55{width:100%;}.w60{width:100%;}.w65{width:100%;}.w70{width:100%;}.w75{width:100%;}
	.w80{width:100%;}.w85{width:100%;}.w90{width:100%;}.w95{width:100%;}.w99{width:100%;}
}