/* ***************debut css page ************************* */
html { font-size: 62.5%; } /* 1rem vaut 10px */
html, body {
  height: 100%; margin:0px;
}
body { font-size: 1.4rem; } /* 1.4 rem vaut 14px */
h1   { font-size: 2.4rem; } /* 2.4 rem vaudra 24px *//*  rue_bournard_3Dc indexc rue_bournard_3D_css3c*/

body {background: black url(texture-IH.gif);padding-top: 1px;}
header{padding-left: 20px;padding-left: 3vw;margin-right:70px;color:red;/*font-family:  cursive;*/
font-size:4vw;font-size:2em;font-size:3vw;
}

@font-face {
  font-family: 'Oleo Script Swash Caps';
  font-style: normal;
  font-weight: 400;
  src: local('Oleo Script Swash Caps'), local('OleoScriptSwashCaps-Regular'), url(http://fonts.gstatic.com/s/oleoscriptswashcaps/v4/vdWhGqsBUAP-FF3NOYTe4s_iw_2fglbFg63ZwhRhpzc.woff2) format('woff2');
}


a 	{text-decoration:none;}	
a {outline: 0 none !important;border: none;}

#colombestitre  {
	text-align: center;
	text-shadow: 0 1px 1px #777,
				 1px 2px 1px #777,
				 1px 3px 1px #666,
				 2px 4px 1px #666,
				 2px 5px 1px #555,
				 2px 5px 6px #666,
				 2px 5px 12px #666;	
	font-style:  oblique;
}

#colombestitre .font1  {font-family: 'Oleo Script Swash Caps', cursive;}
/* #colombestitre .font2  {font-family:  cursive;} */
#iw_container  {
	text-align:center;
	border: 1px solid black; 
	background: yellow ; 
	padding: 5px;
}
#iw_container  a {
	text-decoration: none;
}


#galleryn {position:relative;z-index:3;}
#galleryn div.comment {width:100%; margin-top:10px;}
#galleryn div.imgtitre{ margin-top: -20px;margin-top: -3vw;color: white;text-align: left;padding-left: 20px;padding-left: 3vw;z-index:1;}
#galleryn div.txt1, #galleryn div.txt2{margin-bottom:10px;padding: 10px 5px;background: #eee;
-moz-border-radius: 10px 10px 10px 10px;border-radius: 10px 10px 10px 10px;border-bottom:0px solid #eee ;
 }
#galleryn div.comment p{ border:0; margin:0px; padding:5px; padding-top:0px; color:grey;
	font-family:verdana, arial, sans-serif; color:#666;text-align:left;
	font-size:10px;line-height:10px;
}
#galleryn div.comment p a.ishow2 { border:0; margin:0px; padding:5px; padding-top:0px; color:grey;
	font-family:verdana, arial, sans-serif; color:#666;text-align:left;
	font-size:1.4rem; /* modif du 17/3/2021 */
}
#galleryn div.comment p span.ishow3 { border:0; margin:0px; padding:5px; color:grey;
	font-family:verdana, arial, sans-serif; color:#666;text-align:left;
	font-size:1.4rem; line-height:14px; /* padding-top:0px;*/  /* modif du 17/3/2021 */
}
#galleryn div.comment p.pcenter{ text-align:center;} /* quartier_saint-hilaire_1c quartier_saint-hilaire_1c  */
#galleryn div.chosen{width:100%; position:relative;}
#galleryn>div{ display:none;}
#galleryn>div.chosen{ display:block;}
#divmap {display:block;position:relative;z-index:4;border:1px solid white ;height:416px;width:26em;overflow: hidden;} /* height:26em;*/
.googlemap { height: 100%;width: 100%;} /* definit la carte de googleapi*/
/******bouton openclose maps**********/
#mapsopenclose {position:absolute; left:-9999px; display:none;}
.mapsopenclose span {position:absolute; left:-9999px;}
.mapsopenclose {display:block; width:26px; height:26px; position:fixed; right:45px; top:20px; cursor:pointer; z-index:5;}
.mapsopenclose:after { content:""; display:block; width:26px; height:26px;  position:absolute;left:0px; top:0px;} 
#mapsopenclose~ #divmap { margin-right:9999px; }/*this permit to hide the map AND the overlay*/
#mapsopenclose:checked ~ #divmap { margin-right:0px; }/*this permit to hide the map AND the overlay*/
#mapsopenclose ~ .mapsopenclose:after { background-image:url(g-maps.gif);}
#mapsopenclose:checked  ~ .mapsopenclose:after { background-image:url(g-maps_no.gif);}
/*  ******fin map button****************/

#goleft img, #goright img  { width:30px;height:30px;}
#goleft { position:fixed; top:52px; right: 43px;cursor: pointer;z-index:500;}
#goright{position:fixed; top:52px; right: 10px;cursor: pointer;z-index:500;}
#footer {clear:both;margin-top: 10px;background-color: #eee;-moz-border-radius: 10px;border-radius: 10px;padding-left:10px;padding-right: 10px;} 
#galleryn div.chosen div.divimg{text-align:center;
		height:100%;   /* new */	
}
#galleryn div.chosen div.divimg > img{display:block;}
.hidden{display:none;}
#gallery   {width: calc(100% - 12px );margin-top:10px;padding:4px;clear:both;}

#gallery  img {display:inline-block;height:30px;margin:2px;margin-left:4px;cursor:pointer;}
.rouge{color:red;}
.bleu{color:blue;}
.c_vert{font-weight: bold;color:green !important;}
/* pour lien video   avec fermeture              */
#galleryn div.comment a.avid  u:nth-child(1) {text-decoration:underline;color:red;cursor: pointer;}
#galleryn div.comment a.avid  u:nth-child(2) {text-decoration:underline;color:blue;cursor: pointer;}

/****** specifique aux imagesizoom  diving.zoomo********************/
	.divimg {overflow: hidden;}  /* without the zoomed img is larger than the diving div */
	#imghiden {display:none;}
#iconloupe {
    position: absolute;
    /* background: blue; */
    width: 30px;
    height: 30px;
    top: 3%;
    left: 1%;
}
#loupe1 {
    position: relative;
    left: 10px;
    top: 2px;
    width: 14px;
    height: 14px;
    border-radius: 8px;
    background: white;
    border: 2px solid #8a4e4e;;
    transform: rotate(45deg);
}

#barre1 {
    position: absolute;
    top: 12px;
    left: 3px;
    width: 6px;
    height: 12px;
    background: white;
    border: 1px solid #8a4e4e;;
    border-radius: 2px;
}

#barre1::before {
    content: "";
    display: block;
    position: absolute;
    top: -13px;
    left: 0px;
    width: 2px;
    height: 10px;
    background: #8a4e4e;;
    /* transform-origin: left top; */
    transform: rotate(45deg);
}
#barre1::after {
    content: "";
    display: block;
    position: absolute;
    top: -10px;
    left: -5px;
    width: 11px;
    height: 2px;
    background: #8a4e4e;;
    /* transform-origin: left top; */
    transform: rotate(45deg);
}
.tb{text-decoration:line-through;}
   
	
/****** fin specifique aux imagesizoom  diving.zoomo********************/

/*   **** divers specifique   ***** */
span.toggleb {  /* pour les span cache qui apparaisse */
font-style: italic;
	
}
button, span.showmenu, span.menufermer  {cursor:pointer;}



/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/cssplay-responsive-multi-level-tree-v3.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/*  menunew  i have just adapted to my use    */
#sn_menu_icon {display:block; /*width:41px; height:41px; */ width:80px; height:30px; position:absolute; /*right:20px; top:20px;*/ right:9px; top:20px; z-index:100020;}

#sn_menu_icon span {display:inline-block;color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    vertical-align: middle;
    line-height: 30px;
    text-align: center; 
	position: absolute;
    right: 7px;}

#sn_menu_icon .sn_menu_open {display:block; /*width:41px; height:41px;*/ width:30px; height:30px; background:#333; cursor:pointer;}
#sn_menu_icon .sn_menu_open{display:inline-block; }
#sn_menu_icon .sn_menu_close {display:none; /*width:41px; height:41px;*/width:80px; height:30px; background:rgba(0,0,0,0); cursor:pointer; position:absolute; left:0; top:0; z-index:10;}
#sn_menu_icon .sn_menu_open .bar {display:block; width:17px; height:3px; background:#fff; position:absolute; /*left:12px; top:19px;*/ left:6px; top:15px; transition: background 0s 0.3s}
#sn_menu_icon .sn_menu_open .bar::before {content:""; display:block; width:17px; height:3px; background:#fff; position:absolute; left:0; top:-6px; transform-origin:left top; transition: 0.3s;}
#sn_menu_icon .sn_menu_open .bar::after {content:""; display:block; width:17px; height:3px; background:#fff; position:absolute; left:0; top:6px; transform-origin:left bottom; transition: 0.3s;}
#sn_menu_panel {width:320px; height:100%; position:fixed; /*left:-100%;*/ top:60px; right:0px; z-index:100010;/* transition:0.5s 1s;*/ transition:0s 0s; 
  display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between;overflow-y:auto;overflow-x:hidden;display:none;
}
#sn_menu_panel #sn_menu_left {width:50%; height:100%; background:url(bat.jpg) no-repeat left center; background-size:cover;
  display:flex; flex-direction:column; flex-wrap:nowrap; justify-content:center;
}
#sn_menu_panel #sn_menu_left h1 {text-align:center; font:800 100px/130px 'Open Sans', sans-serif; color:#3bc;}
#sn_menu_panel #sn_menu_left #social {text-align:center; width:100%;}
#sn_menu_panel #sn_menu_left .social {color:#aaa; display:inline-block; font-size:20px; margin:5px; transition:0.2s;}
#sn_menu_panel #sn_menu_left .social:hover {color:#666;}
#sn_menu_panel #sn_menu_left p {font:300 14px/25px 'Open Sans', sans-serif; color:#999; text-align:center;}

#sn_menu_panel #sn_menu_right {order:2; /*width:50%;*/ width:290px; height:calc(100% - 60px); background:#000; 
	/*font:400 18px/40px 'Open Sans', sans-serif;*/ padding-left:5px;
	font:bold 12px/25px arial, sans-serif;
	color:#aaa; overflow-y:auto; -webkit-overflow-scrolling: touch;
	 /* display:flex; flex-direction:column; flex-wrap:nowrap; justify-content:center;*/
	  position:fixed;right:0px;top:60px; overflow-x:hidden;
}

#sn_menu_right #sn_menu p {position:relative; padding:0; margin:0;
	height: 25px;}
#sn_menu_right #sn_menu p label {display:block; line-height:40px; text-transform:uppercase;}
#sn_menu_right #sn_menu p label::after {content:""; display:block; width:6px; height:6px; border:2px solid #aaa; border-width:0 2px 2px 0; position:absolute; right:20px; top:15px; transform:rotate(-45deg); transition:0.3s;}
#sn_menu_right #sn_menu p label:hover {/*color:#2ab;*/color:#2ab;}
#sn_menu_right #sn_menu p label:hover::after {border-color:#2ab;}
#sn_menu_right #sn_menu p label:last-child {display:none; position:absolute; left:0; top:0; width:100%; height:40px; background:rgba(0,0,0,0);}

#sn_menu_right #sn_menu p a {line-height:40px; /*color:#666;*/color:#ddd; text-decoration:none;}
#sn_menu_right #sn_menu p a:hover {/*color:#000;*/color:red;}

#sn_menu_right #sn_menu div p {height:0; overflow:hidden; opacity:0; transition:0.75s; position:relative;}

#sn_menu_right div {padding:0; margin:0; list-style:none;}

#sn_menu_right #sn_menu {width:calc(100% - 100px); max-width:290px; min-width:270px; margin:0 auto; max-height:100%;}
#sn_menu_right #sn_menu > p {text-indent:0;}
#sn_menu_right #sn_menu div {position:relative;}
#sn_menu_right #sn_menu div::before {content:""; display:block; width:1px; height:calc(100% - 20px); background:#2ab; position:absolute; left:5px; top:0;}
#sn_menu_right #sn_menu div p {text-indent:15px; position:relative;}
#sn_menu_right #sn_menu div p::before {content:""; display:block; width:5px; height:5px; border:1px solid #2ab; background:#fff; position:absolute; left:2px; top:17px; transform:rotate(45deg);}
#sn_menu_right #sn_menu div div::before {left:20px;}
#sn_menu_right #sn_menu div div p {text-indent:30px;}
#sn_menu_right #sn_menu div div p::before {left:17px;}
#sn_menu_right #sn_menu div div div::before {left:35px;}
#sn_menu_right #sn_menu div div div p {text-indent:45px;}
#sn_menu_right #sn_menu div div div p::before {left:32px;}

input[id*="sn_menu"] {display:none;}

input[class*="ip00"]:checked ~ #wrapper {height:100%; 
overflow:hidden; 
transition:0s;}
input[class*="ip00"]:checked ~ #sn_menu_icon {position:fixed;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar {background:transparent; transition:0s;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar::before {transform: rotate(45deg); width:18px; left:3px;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open .bar::after {transform: rotate(-45deg); width:18px; left:3px;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_close {display:block;}
input[class*="ip00"]:checked ~ #sn_menu_icon .sn_menu_open span {display:none;} /* add  of bobthefrog */


input[class*="ip00"]:checked ~ #sn_menu_panel {/*left:0; transition:0.5s;*/transition:0s;right:0px;display:block;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 + div > p,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 + div > p,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 + div > p,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 + div > p,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 + div > p,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 + div > p,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 + div > p,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 + div > p,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 + div > p,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 + div > p,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 + div > p, 
input[class*="ip12"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu12 + div > p {
/*height:40px;*/height:25px; 
opacity:1;}

#sn_menu01:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label:last-child,
#sn_menu02:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label:last-child,
#sn_menu03:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label:last-child,
#sn_menu04:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label:last-child,
#sn_menu05:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label:last-child,
#sn_menu06:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label:last-child,
#sn_menu07:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label:last-child,
#sn_menu08:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label:last-child,
#sn_menu09:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label:last-child,
#sn_menu10:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label:last-child,
#sn_menu11:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label:last-child, 
#sn_menu12:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu12 > label:last-child {display:block;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label, 
input[class*="ip12"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu12 > label {color:#2ab;}

input[class*="ip01"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu01 > label::after,
input[class*="ip02"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu02 > label::after,
input[class*="ip03"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu03 > label::after,
input[class*="ip04"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu04 > label::after,
input[class*="ip05"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu05 > label::after,
input[class*="ip06"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu06 > label::after,
input[class*="ip07"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu07 > label::after,
input[class*="ip08"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu08 > label::after,
input[class*="ip09"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu09 > label::after,
input[class*="ip10"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu10 > label::after,
input[class*="ip11"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu11 > label::after, 
input[class*="ip12"]:checked ~ #sn_menu_panel #sn_menu_right #sn_menu .sn_menu12 > label::after {transform:rotate(45deg); border-color:#2ab;}
@media only screen and (max-width: 650px) {
	#header #sn_menu_icon {right:15px;}
	#sn_menu_right #sn_menu {min-width:260px; margin:0 auto;}
	#sn_menu_panel #sn_menu_left {width:0; display:none;}
	#sn_menu_panel #sn_menu_right {/*width:100%; min-width:320px;*/}
}
@media only screen and (max-width: 650px) {
	#sn_menu_right #sn_menu {margin:0 0 0 10px;}
	#sn_menu_icon {
		width:30px;
		right: 9px;
		top: 20px;

	}
	#sn_menu_icon span { display:none;}

}

@media only screen and (max-width: 479px) {
	#sn_menu_icon { top: 5px;}


}

/* fin menunew   */

#musictitre {font-size:small;color:red;margin-left:10px;}
#img_over {position:absolute; display:none;color:white;background:black;z-index:200;}

/************media*******************************************************************************/
@media screen and (min-width: 650px) {  /* >650   */
	header div.pagetitre{font-size:20px;}
	#mapsopenclose~ #divmap {margin-right: 0px;}
	#galleryn  {margin-top:20px;margin-top:4vw;margin-right:320px; margin-left:0px; padding:0px;}
	#divmap {display:inline-block;margin-top:6vw;margin-right: 0px;float:right; width:300px; }
	.menutxt {display:block}
	}
@media screen and (max-width: 650px) and (min-width: 970px) {  /* >970   */	
	#galleryn div  div.divimg> img {
	}
}

@media screen and (min-width: 970px) {  /* >970   */
	/*header{font-size:30px;}*/ /* new */		
	#galleryn  {position:relative;margin-top:3vw;margin-right:320px; margin-left:0px; padding:0px;width:66%;}	
	#divmap {display:inline-block;position:relative;margin-top:3vw;margin-right: 0px;float:right; width:32%; }
	div[id^="th"]{position:relative;padding-top:0px;
		height: 100%;   /*new*/
	}
	#galleryn div.chosen div.divimg >img {
		margin-left: auto;margin-right: auto;max-width: 100%;     /* new */	
	}		
	.mapimg{top:-10px;left:620px;position:absolute;width:300px;height:416px;display:none;}
	#mapsopenclose:checked ~ #divmap { margin-right:10px; }/*this permit to hide the map AND the overlay*/
	.mapsopenclose{display:none;}
}
@media screen and (min-width: 1200px) {  /* >1200   */		
	#galleryn {
	/*height:60%;*/   /* new */
		width: 72%;left: 0px;display: block;margin-top:4vw;top:0;}/* height:60%}	*/
	#galleryn div.comment p {margin-right: 10px;margin-left: 10px;font-size: 0.95vw;line-height: 1vw;}
	#galleryn div.chosen div.comment {display: inline-block;width: 32%;margin-top:0px;}
	#galleryn div.chosen div.divimg> img {
		margin-left: auto;margin-right: auto;max-width: 100%; /* new */
	}	
	#galleryn div.chosen div.divimg {display: inline-block;width: 67%;vertical-align: top;}		
	/*#galleryn div.chosen div.divimg >img {width: 98%;margin-left: auto;margin-right: auto;}	*/
	#galleryn /*div.chosen div.divimg >img {margin-left: auto;margin-right: auto;width: auto;max-height:416px;}	
	#galleryn */div.chosen div.divimg.vert >img {width: auto;max-height:416px;} 
	#galleryn div.chosen div.divimg >img .vert{width: auto;max-height:416px;} 
	#galleryn div.imgtitre{ font-size:1.5vw;position:absolute;}	
	#divmap {width:28%;margin-top:4vw;
		height:60%;   /* new */	
	}
	#gallery img {height: 50px;}/* new */
}
@media screen and (max-width: 1200px) {/* <1200   */
	#galleryn div.comment {width: 90%;margin-left: auto;margin-right: auto;}		
}

@media screen and (max-width: 969px) {  /* <970   */
	#galleryn div[id*="th"] {width:100%;}
	 /*div.chosen div.pagetitre dt{text-align:left;padding-left:50px;font-size: 2vw;line-height: 1vw;}*/
	 div.chosen div.pagetitre span{text-align:left;padding-left:50px;font-size: 2vw;line-height: 1vw;}
	#galleryn div.chosen div.comment {width:100%;}
	#galleryn div.chosen div.comment {width:98%;margin-left:auto;margin-right:auto;position:relative;}
	#galleryn div.chosen div.comment .txt2 {margin-top:20px;}
	#galleryn div.chosen div.divimg{margin-top:20px}	
	#galleryn div.chosen div.divimg> img {margin-left: auto;margin-right: auto;max-width: 100%;}	
	.mapsopenclose{display:none;}
	#divmap {display:inline-block;position:relative;margin-top:4vw;width:300px;}
}
@media screen and (max-width: 650px) {  /* <650   */
	#galleryn  {margin-right:0px;	width:100%;float:initial;margin-top:30px;margin-top:4vw;}
	#divmap {position:absolute;top:10vw;right:0px;}
	#galleryn div[id*="th"] {width:100%;max-width:650px;}
	#galleryn div.imgtitre{ margin-right:70px;}		
	#galleryn div.chosen div.divimg {position:relative;	width:100%; display:inline-block;margin-top:0px;	margin-right:0px;}
	#galleryn div.chosen div.divimg> img {margin-left:auto;margin-right:auto;width:100%;display:block;}
	#galleryn div.chosen div.divimg.vert >img {width: 60%;margin:auto;}	
	#galleryn div.chosen div.divimg>img.vert  {width: 60%;margin:auto;}	
	.mapsopenclose {display:block;}
}
@media screen and (max-width: 479px) {  /* <650   */
	#galleryn {margin-top: 4vw;}
	#galleryn div[id*="th"] {width:100%;}
	#galleryn div.imgtitre{ padding-left: 0px; padding-left: 3vw;margin-top:-5vw;font-size:14px;}		
	#divmap {display:block;position:fixed;margin-top: 1vw;z-index:4;right:10px;}
	#galleryn div.chosen div.txt2 {position:relative;}
	#galleryn div.chosen div.comment {margin-top: 10px;width:100%;margin-left:auto;margin-right:auto;position:relative;}
	#galleryn div.chosen div.txt2 {width:100%;margin-top:20px;}
/*	.menuopenclose { top:5px; }*/
	.mapsopenclose {top:7px;}
	#goleft,#goright { top:40px; }
	#musictitre {font-size:10px;margin-left:0px;}
}
@media screen and (max-width: 420px) {
	header {padding-left:0px;}
	#colombestitre  {font-size: 15px;text-align:left;text-shadow: 0 0 0 ;}
	#divmap{top:110px;}
	div.pagetitre { padding-left:0px;font-size:13px;}
	#galleryn div.imgtitre{ padding-left: 0px; position:relative;margin-top:0vw;}	
}
@media screen and (max-height: 555px) {
	#divmap {display:block;position:fixed;right:10px;}
}
@media screen and (max-height: 550px) and (min-width: 650px){
	#divmap {margin-top:0px;}
}
@media screen and (max-height: 480px) and (min-width: 650px){
	#gallery {margin-right:320px;}
} 
@media screen and (max-height: 425px) {
	#divmap {top: auto;height: 290px;bottom:0px;}
	#galleryn div.chosen div.divimg >img {margin-left:auto;margin-right:auto;width:90%;max-height:416px;display:block;}
	#galleryn div.chosen div.divimg.vert> img {width: auto;margin:auto;}	
	#galleryn div.chosen div.divimg> img.vert {width: auto;margin:auto;}	
}
/****************fin css commun toutes pages*******************************/


.spanblockx { display:block ;}
/****************new *******************************/

* {
    box-sizing: border-box;
}
@media screen and (min-width: 1200px) {  /* >1200   */	
	/*#galleryn div  div.divimg> img {
		object-fit:contain;height:100%;
	}	
	*/
}
/*   fonction blink en css */
.blink_me {
    -webkit-animation: 0.5s linear infinite blink; /* for android*/
    animation: 0.5s linear infinite blink;
}
@keyframes blink {
            0% {opacity: 0;}
			30% {opacity: 1;}
			70% {opacity: 1;}
            100% {opacity: 0;}
}
/* fin de blink   */
/* pour ne pas toucher aux pages  il faut faire display:none sur le vieux menu */
#menuopenclose , .menuopenclose , div#menu { display:none}