html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}body {line-height: 1;}ol, ul {list-style: none;}blockquote, q {quotes: none;}:focus {outline: 0;}ins {text-decoration: none;}del {text-decoration: line-through;}table {border-collapse: collapse;border-spacing: 0;}



body {font-family: "Arial";font-size: 13px;}


.spacer{ clear: both}

.nowrap{ white-space: nowrap; }
.icon{ position: absolute; left: 20px; top: 10px; height: 28px; width: 28px; opacity: 0.8; }
	
/* --- POSITIONNEMENT GLOBAL DU SITE --- */

#global {
	width: 100vw;
	/*min-width: 1150px;*/
	margin: 0;
	padding: 0;
}

/* Bloc central */
#centre {
	position: relative; 
	width: 100%;
}

/* Menu de navigation */
#left_sidebar {
	position: absolute; 
	top: 0;
	left: 0;
	width: 240px;
}


/* Contenu principal */
#main_sidebar {
	margin-left: 240px; 
	margin-right: 240px;
	
	background-repeat: no-repeat;
	background-position: center top;
	height: auto;

}


/* Contenu secondaire */
#right_sidebar {
	position: absolute; 
	top: 0;
	right: 0;
	width: 240px;
	margin-top: 6px
}


#footer {
	

	text-align: center;
	line-height: 45px;
	color: #FFFFFF;
	font-size: 14px;
	clear: both;
	
}


/* header*/
.header{ height:100px; margin-bottom: 20px}
.header div{padding: 30px 25px 0 0; text-align: right}
.header h1{font-size:20px;color:#80BDEA;margin-top:10px;}

/* content */
.content{ position: relative; height: auto }


/*-- menu GAUCHE ET DROITE */
.menu{ margin: 0 0 10px 0; z-index: 30; position: relative}
.menu a{text-decoration: none;} .menu a:link {color: #504e4e;text-decoration: none} .menu a:visited {color: #504e4e;}.menu a:hover,.menu a:focus {color: #010000;text-decoration: none;}.menu a:active {}
.menu .bottom{ background-image: url("../images/tab_bottom.png"); height:12px; width: 224px; background-repeat: no-repeat;}
.menu .middle{ background-image: url("../images/tab_middle.png"); width: 224px; background-repeat: repeat-y; }
.menu ul{ margin-left: 60px; padding-top: 5px}
	

.menu #pdv .top{  background-image: url("../images/tab_pdv.png"); background-repeat: no-repeat; background-position: top;width: 224px; height: 41px}
.menu #pdv ul li { list-style-image : url("../images/puce_pdv.jpg") ; line-height: 20px }

.menu #chercher{
	font-size: 11px;
}	
.menu #chercher .top{  background-image: url("../images/tab_chercher.png"); background-repeat: no-repeat; background-position: top;width: 224px; height: 34px;border:0px solid red;font-size:12px;}
.menu #chercher ul li { list-style-image : url("../images/puce_pdv.jpg") ; line-height: 20px }	
	
	
.menu #menu .top{  background-image: url("../images/tab_menu.png"); background-repeat: no-repeat; background-position: top;width: 224px; height: 39px}
.menu #menu ul li { list-style-image : url("../images/puce_menu.jpg") ; line-height: 20px;border: 0px solid red;text-align: left; }

.menu ul ul{ margin-left: 6px; padding-top: 5px;}
.menu #menu ul li ul li{ list-style-image : url("../images/puce_menu.jpg") ; line-height: 20px }


.menu #annees .top{  background-image: url("../images/tab_annees.png"); background-repeat: no-repeat; background-position: top; width: 224px; height: 46px}
.menu #annees ul li { list-style-image : url("../images/puce_annees.jpg") ; line-height: 20px; }

.menu #photos .top{  background-image: url("../images/tab_photos.png"); background-repeat: no-repeat; background-position: top; width: 224px; height: 42px}
.menu #photos .middle{ height: 490px;}
.menu #photos #content_photos{height:490px; width: 210px; overflow-y: auto;overflow-x:none;position:relative;}
.menu #photos ul{margin-left: 30px; height: auto;}
.menu #photos ul li {border: 0px solid red;list-style: none; width: 150px; height: 45px; margin:5px 0 5px 0; position:relative;}
.menu #photos ul li img{ margin: 7px 3px 7px 3px; }
.menu #photos ul li span{border: 0px solid red;font-size:11px;position:absolute;top:19px;left:55px;width: 100px;height:15px;}
.menu #photos a{ display: block; width: 100%;text-decoration: none;} 
.menu #photos a:link {background-color: #FFFFFF;text-decoration: none} 
.menu #photos a:visited {background-color: #FFFFFF;}
.menu #photos a:hover,.menu #photos a:focus {background-color: #d1d1d1;text-decoration: none;border:0px solid red;}
.menu #photos a:active {background-color:#b2b2b2;}	

.menu #videos .top{  background-image: url("../images/tab_videos.png"); background-repeat: no-repeat; background-position: top; width: 224px; height: 45px}
.menu #videos .middle{ height: 490px;}
.menu #videos #content_photos{height:490px; width: 210px; overflow-y: auto;overflow-x:none;position:relative;}
.menu #videos ul{margin-left: 30px; height: auto;}
.menu #videos ul li {border: 0px solid red;list-style: none; width: 150px; height: 45px; margin:5px 0 5px 0; position:relative;}
.menu #videos ul li img{ margin: 7px 3px 7px 3px; }
.menu #videos ul li span{border: 0px solid red;font-size:11px;position:absolute;top:19px;left:55px;width: 100px;height:15px;}
.menu #videos a{ display: block; width: 100%;text-decoration: none;} 
.menu #videos a:link {background-color: #FFFFFF;text-decoration: none} 
.menu #videos a:visited {background-color: #FFFFFF;}
.menu #videos a:hover,.menu #photos a:focus {background-color: #d1d1d1;text-decoration: none;border:0px solid red;}
.menu #videos a:active {background-color:#b2b2b2;}	

.menu #zoom .top{  background-image: url("../images/tab_zoom.png"); background-repeat: no-repeat; background-position: top; width: 224px; height: 34px}

.menu #calendar .top{  background-image: url("../images/tab_calendar.png"); background-repeat: no-repeat; background-position: top; width: 224px; height: 42px}


/*-- PAGE CENTRALE formulaire login */
#form_login{position: absolute; left:0px;width: 360px; height: 188px; margin-left: calc(50% - 180px); margin-top: calc(30vh - 100px); color: #353535;  }
#form_login .top{background-image: url("../images/form_bienvenu.png"); background-repeat: no-repeat; background-position: top; width: 321px; height: 62px}
#form_login .bottom{background-image: url("../images/form_bottom.png"); height:24px; width: 321px; background-repeat: no-repeat;}
#form_login label { text-align: right; margin-right: 5px;width: 130px; display: block;float:left; line-height: -14px }
#form_login input{ margin-bottom: 5px }
#form_login p{ width: 81px; padding:13px 0 13px 40%;}
#form_login	.middle{ background-image: url("../images/form_middle.png"); width: 321px; background-repeat: repeat-y; }

#form_login input{
	width: 140px;
}
#form_login table{
	font-size: 11px;
	color: #666666;
	
}
#form_login a{
	color: #666666;
}
#form_login p{
	border: 0px solid red;
	padding: 0;
	margin: 0;
	margin-left: 55px;
	margin-bottom: 10px;
	width: 100%;
}
/* Ajouts Gui Login */
#form_login #login-ctnr label.col-form-label-sm { font-size: 0.95rem; }
#form_login #login-ctnr a { font-size: 0.85rem; }
#form_login #login-ctnr .icon {
    left: 20px;
    top: 10px;
    height: 29px;
    width: 29px;
}


/*--PAGE CENTRALE Mulitmedia : */
#block {
	width: 100%;
	margin-top: 31px;
}

.joker{

	background:black;
	height:16px;
	margin:auto;

}

html:not([lang*=""]) .joker{
	width:99%;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {

	.joker{
	width:99%;
	}

}


#top-border {
	width: 100%;
	float: left;
	height: 16px;

}

#top-left-corner {
	float: left;
	width: 16px;
	height: 16px;
	background: url(../images/corners/top-left-corner.png) top left no-repeat;
}

#top-right-corner {
	float: right;
	width: 16px;
	height: 16px;
	background: url(../images/corners/top-right-corner.png) top right no-repeat;
}

#contentMedia {
	float: left;
	clear: left;
	width: 94.9%;
	padding: 2.5%;
	background-color: black;
	color: white;
	/**height: 600px;**/
}
html[xmlns*=""] body:last-child #contentMedia{
	width: 95%;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
#contentMedia {
	width: 95.2%;
}

}

#contentMedia , x:-moz-any-link, x:default{
	width: 95%;

}

/**ie7**/
*+html #contentMedia {
	width: 94.9%;
}



#bottom-border {
	float: left;
	clear: left;
	width: 100%;
}

#bottom-left-corner {
	float: left;
	width: 16px;
	height: 16px;
	background: url(../images/corners/bottom-left-corner.png) top left no-repeat;
}

#bottom-right-corner {
	float: right;
	width: 16px;
	height: 16px;
	background: url(../images/corners/bottom-right-corner.png) top right no-repeat;
}

#image_centrale{
	margin-top: 5px;
	text-align: center;
	
}

#image_centrale>img{
	width:100%;
}


/**la pagination**/
div.pagination 
{
    padding: 3px;
    margin: 3px;
}

div.pagination a 
{
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #AAAADD;
    text-decoration: none; /* no underline */
    color: #FFFFFF;
}

div.pagination a:hover, div.pagination a:active 
{
    border: 1px solid #000099;
    background-color: #FFFFFF;
    color: #000000;
}

div.pagination span.current 
{
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #000099;
    font-weight: bold;
    background-color: #993300;
    color: #FFF;
}
div.pagination span.disabled 
{
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #EEE;
    color: #DDD;
} 


#liste_mots{
	font-size: 14px;
	width: 160px;
	border: 0px solid red;
	margin-left: 0;
	text-align: right;

	
}

#date_debut{
	font-size: 8px;
}
#date_fin{
	font-size: 8px;
}

a.telecharger,a.telecharger:hover,a.telecharger:visited{
	color:white;
}


.containerspace{
	padding: 60px 15px 0;
}

.centered-title {
	margin-top: 20px;
  text-align: center;
}
/* Create four equal columns that sits next to each other */
.column {
  flex: 25%;

  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

.sep{
	margin-top: 6px;
}
/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }
}



/* GA 12/2021 */

.fancybox-content {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}



/******* MATERIAL ICONS *******/


body .material-icons, body .material-icons-outlined {
	font-size: 24px;
	line-height: 0.5;
	position: relative;
    bottom: -6px;
    left: -2px;
    margin-right: 1px;
}
body .btn-sm .material-icons, body .btn-sm .material-icons-outlined {
    font-size: 22px;
    bottom: -5px;
}

body .material-icons.mi-title, body .material-icons-outlined.mi-title {
    font-size: inherit;
    bottom: -4px;
    left: 0px;
    margin: 0;
}
body h5 .material-icons.mi-title, body h5 .material-icons-outlined.mi-title { bottom: -3px; }

body .material-icons.mi-15, body .material-icons-outlined.mi-15 {
    font-size: 15px;
    bottom: -2px;
    left: 0px;
    margin: 0;
}

body .material-icons.mi-20, body .material-icons-outlined.mi-20 {
    font-size: 20px;
    bottom: -4px;
    left: 0px;
    margin: 0;
}

body .mi-button {
    padding-left: 6px;
    padding-right: 6px;
}
body .mi-button .material-icons, body .mi-button .material-icons-outlined {
    margin: 0;
    left: -1px;
}
body .btn.btn-sm.mi-button { padding: 6px 3px 5px 6px; }
body .btn.btn-mini.mi-button { padding: 4px 4px 4px 6px; }

body .material-icons.mi-small, body .material-icons-outlined.mi-small {
    font-size: 19px;
    bottom: -4px;
    left: -1px;
}

body input.checkbox-btn {
    height: 15px;
    width: 15px;
    cursor: pointer;
    position: relative;
    top: 1px;
}

body input.checkbox-btn:hover, body input.checkbox-btn:focus {
    box-shadow: 2px 2px 0 0 rgb(38 143 255 / 40%), -1px -1px 0 0 rgb(38 143 255 / 40%) inset;
}

/******* END MATERIAL ICONS ********/



.input-group.nav-item { margin-left:12px; }

/******** RESPONSIVE DESIGN *********/

/* GA 12/2021 */
@media (max-width: 767px) { /* bootstrap nav collapse width */
	/*.ctnr-responsive {
		margin: 0 1.5%;
	} */
	.row.list-responsive {
		margin: 0;
	}
	.list-responsive .col-sm-4 {
		width: 49%;
		padding: 0 0 0 2%;

	}
	.list-responsive .img-responsive {
		max-width: 100%;
	}


	/* nav */
	.input-group.nav-item { margin-left:0; }


	/*** TO DO : afficher les premiers boutons de la nav au niveau de la nav même quand le menu burger n'et pas ouvert ***/
	/*li.nav-item.not-collapsable {
	    position: fixed;
	    top: 8px;
	}
	.navbar-collapse.show li.nav-item.not-collapsable.input-group {
		width: auto;
	}*/


}


.thumbnail-caption { }
.thumbnail-link {margin-left: 5px;}

#contact_form form {
	width: 100% !important;
}