
/* S = moins de 480  --- M = entre 480 et 740  ---  L = entre 740 et 960  --- X = plus de 960 */
/* SM = moins de 740  ---  SML = moins de 960  ---  MLX = plus de 480  ---  LX = plus de 740 */

@media screen and (min-width: 960px)
{
.L {
	display: none;
	}
.Nbre_images {
	font-family: Palatino, Bookman, Times, Times New Roman, serif;
	position: fixed !important;
	top: 10px !important;
	right: 20px !important;
	line-height: 16px;
	font-size: 16px;
	font-weight: bold;
	font-style: italic;
	letter-spacing: 0px;
	margin: 0px;
	color: #990000;
	border: none;
	z-index: 500;
	}
}

@media screen and (max-width: 959px)
{
.X {
	display: none;
	}
.conteneur_img_oeuvre {
	max-width: 20% !important;
	}
.titre_image {
	line-height: 18px !important;
	font-size: 14px !important;
	}
	.conteneur_media {
	padding: 1px 5px 1px 0 !important;
	}
.conteneur_alpha {
	line-height: 40px;
	}
.Nbre_images {
	font-family: Palatino, Bookman, Times, Times New Roman, serif;
	position: fixed !important;
	top: 40px !important;
	right: 200px;
	text-align: center !important
	line-height: 16px;
	font-size: 14px;
	font-weight: bold;
	font-style: italic;
	letter-spacing: 0px;
	margin: 0px;
	color: #990000;
	border: none;
	z-index: 500;
	}
}

/* ------------------------------------------------------------------Ecrans jusqu'à 740 */
@media screen and (min-width: 740px) 
{
.SM {
	display: none;
	}
.menu_haut {
	position: fixed;
	top: 0;
	left: 0;
	width: 68%;
	max-height: 68px;
	padding: 0;
	margin: 0 16%;
	background: #ffffcc;
	z-index: 40;
	}
}

@media screen and (max-width: 739px) {
.LX {
	display: none;
	}
.L {
	display: none;
	}
.deg_haut {
	height: 50px !important;
	width: 100%;
	}
.corps {
	width: 90%;
	margin: 0;
	padding: 0 5%;
	}
.menu_haut {
	position: fixed;
	height: 50px;
	width: 100%;
	background-color: #993300;
	z-index: 10;
	}
.casacocher {
	width: 90%;
	padding: 0 0 0 5%;
	}
.titre {
	max-width: 80%;
	margin: 15px 0 15px 0;
	}
.titre_ital {
	font-size: 14px;
	line-height: 20px;
	}
.texte_ital {
	font-size:	12px;
	line-height: 18px;
	}
.texte_14 {
	font-size:	12px;
	line-height: 18px;
	}
.box {
    width: 70%;
	}
.Nbre_images {
	font-family: Palatino, Bookman, Times, Times New Roman, serif;
	position: fixed !important;
	top: 1px !important;
	right: 60px !important;
	line-height: 16px;
	font-size: 12px;
	font-weight: bold;
	font-style: italic;
	letter-spacing: 0px;
	margin: 0px;
	color: #ffffcc !important;
	border: none;
	z-index: 50;
	}
.popup {
	width: 70%;
	}
/* ----------------------------------------------------------------Peintre et Vielleur */
.bt_V {
	max-width: 100px !important;
	}
.bt_Vseul {
	max-width: 100px !important;
	}
.bt_P {
	max-width: 100px !important;
	}
/* -------------------------------------------------------------------------cases alpha */
.conteneur_alpha {
	width: 90% !important;
	line-height: 40px;
	}
/* -------------------------------------------------------------------------Menu popup */
h1 {
	font-family: Palatino, Bookman, Times, Times New Roman, serif;
	line-height: 24px;
	font-size: 20px;
	font-weight:bold;
	font-style: italic;
	letter-spacing:1px;
	margin: 0px;
	line-height:35px;
	color:#990000;
	text-align: center;
	}
.box {
	position: fixed;
	top: 4px;
	right: 10px;
	max-width: 15%;
	margin: auto 0;
	background: none;
	padding: 0;
	border: none;
	text-align: right;
	}
.button {
	padding: auto;
	color: #ffffcc;
	border: none;
	border-radius: 5px/5px;
	cursor: pointer;
	transition: all 0.1s ease-out;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 1;
	}
.bouton_menu {
	display: inline-block;
	float: left;
	width: 27%;
	padding: 3%;
	margin: auto;
	text-align: center;
	border: none;
	}
.overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(61, 43, 31, 0.8);
	transition: opacity 500ms;
	visibility: hidden;
	opacity: 0;
	z-index: 20;
	}
.overlay:target {
	visibility: visible;
	opacity: 1;
	}
.popup {
	margin: 55px auto;
	padding: 30px 3px 5px 3px;
	background: rgba(255, 255, 204, 0.7);
	border-radius: 5px;
	width: 90%;
	position: relative;
	transition: all 5s ease-in-out;
	}
.popup .close {
	position: absolute;
	top: 5px;
	right: 30px;
	transition: all 200ms;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #993300;
	}
.popup .close:hover {
	color: rgb(61, 43, 31);
	}
.popup .content {
	max-height: 50%;
	overflow: auto;
	}
}

@media screen and (min-width: 479px) {
.S {
	display: none;
	}
}

@media screen and (max-width: 479px) {
.MLX {
	display: none;
	}
.entier {
	display: flex;
	position: relative;
	left: 0;
	top: 0;
	width: 100%;
	text-align: center;
	border: none;
	}
.conteneur_resultats {
	height: 280px;
	width: 100%;
	}
.conteneur_media {
	width: 98%;
	height: 270px;
	margin: 0;
	padding: 1px 10px 1px 0;
	background-color: #f5f5d3;
	border: 1px solid #a0522d;
	border-radius:15px;
	}
.conteneur_texte_oeuvre {
	width: 100%;
	height: 128px;
	padding: 1px 10px 0 0;
	overflow: auto;
	text-align: center;
	clear: none;
	}
.conteneur_img_oeuvre {
	display: flex;
	max-width: 100% !important;
	max-height: 100% !important;
	margin: auto;
	text-align: center;
	padding: 0px;
	border: none;
	}
.titre_image {
	margin: 3px 0 0 0;
	padding: 0 5px 0 5px;
	text-align: center;
	}
.texte_image {
	padding: 0 10px;
	line-height: 14px;
	text-align: center;
	}
.texte_ref_img {
	padding: 0 10px;
	line-height: 14px;
	text-align: center;
	}
.casacocher {
	width: 90%;
	padding: 0 0 0 2%;
	}
}

/* pour l'affichage des images dans les popup */
@media (max-width: 799px) or (max-height: 799px) {
	.popup_img{
	top: 0; right: 0; bottom: 0; left:0;
	max-width: 100% !important;
	max-height: 100% !important;
	}
	.popup_livre{
	top: 0; right: 0; bottom: 0; left:0;
	max-width: 100% !important;
	max-height: 100% !important;
	}
	.fermer_img{
	backround-color: blue !important;
	}
}
