/*Bleu Clair 539da8
Bleu foncé 00364e
Rouge e21212*/
/*Superstructure*/
:root {
  --opacity: 95%;
  --height-banner: 200px;
  --section-bg-color: #3b516e;
  --section-text-color: honeydew;
  --section-around-color: red;
  --nav-bg-color: SteelBlue;
  --nav-text-color: honeydew;
  --nav-around-color: red;
  --nav-sel-bg-color: #3b516e;
  --nav-sel-text-color: red;
  --nav-sel-around-color: red;
  --news-bg-color: honeydew;
  --news-text-color: steelblue;
  --footer-bg-color: honeydew;
  --footer-text-color: steelBlue;
  --footer-around-color: #1e90ff;
  --table-bg-color: var(--section-bg-color);
  --table-text-color: var(--section-text-color);
  --table-border-color: var(--section-text-color);
  --link-visited-text-color: electricBlue;
  --link-text-color: electricBlue;
}
html{font-size: 16px; font-family: Arial, sans-serif;}
/*body{margin:0; padding:0;}*/
/*div#body-container */

body{margin: 0; padding: 0; font-size: 1.2rem; width: 100%;
	/*position: fixed;*/
	background-color: var(--nav-bg-color);
	background-image: url(/static/images/backgrounds/fond_00.jpeg);
	background-size: cover;
	background-repeat: no-repeat;
	transition-property: background-image;
	transition-duration: 6s;
	transition-delay: 0s;
	transition-behavior: allow-discrete;
	transition-timing-function: linear;
}

pre{background-color: white; color: black; font-family: monospace;}

header#banner-header{width: 100%; margin: 0; padding: 0; max-height: var(--height-banner); display: flex; justify-content: space-between; }

div#banner-header-left{width: 15%; display: inline-block; text-align: center;}
img#logo-octopus{display: inline-block;max-height: var(--height-banner); width: 75px; padding: 10px;}

div#bannerLongitude{display: inline-block; text-align: center; margin: 20px;}
img#imgLongitude{display: inline-block; max-width: 100px;}
div#intra-links{position: relative; padding: 10px; margin: 10px;
					float: right; top: 10px; right: 10px;
					opacity: var(--opacity); 
					background-color: var(--nav-bg-color); color: var(--nav-text-color); font-size: 0.8rem;
					border-radius: 5px; border: 1px solid var(--nav-around-color); box-shadow: 2px 2px 1px #ffb3b3;
}

#icon-www{display: block; margin-left: auto; margin-right: auto;}
#txt-www{display: block;}


/*Navigation*/

/*
div#frame{width: 100%; margin: 0; padding: 0;  
	display: flex; 
	justify-content: space-between;
	align-items: stretch;
}
*/

/*Navigation mobile*/
nav#nav-mobile {
	position:static;
	display:inline;
	margin: 10px;
	padding: 10px;
	background-color: var(--nav-bg-color);
	border: 1px solid var(--nav-sel-around-color);
	box-shadow: 2px 2px 1px #ffb3b3;
	border-radius: 10px; 
  	margin-bottom: auto;
}

/*
div#nav-mobile-container{
	transition-property: display;
	transition-duration: 2s;
	transition-delay: 0s;
	transition-timing-function: linear;
}
*/
/* Sidebar links */
nav#nav-mobile a {
	display: block;
	width: 210px; 
	margin-left: 10px;
	margin-top: 10px;
	color: var(--nav-bg-color);
	font-size: 0.9rem;
	padding: 5px;
	text-decoration: none;
	background-color: var(--nav-bg-color);
	color: var(--nav-text-color);
	z-index: 1;
}

div.nav-mobile-cat{
	font-size: 1rem;
	font-weight: bold;
	padding: 5px;
	margin-top: 5px;
	color: var(--nav-text-color);
}

/* Active/current link */
nav#nav-mobile a.nav-mobile-item-enable {
  background-color: var(--nav-sel-bg-color);
  color: var(--nav-sel-text-color);
}

/* Links on mouse-over */
nav#nav-mobile a:hover:not(.nav-mobile-item-enable) {
  background-color: var(--nav-sel-bg-color);
  color: var(--nav-sel-text-color);
}

#nav-mobile-close{display: inline-block;
						float: right;
						margin: 10px;
}

/*Section principale
div.main {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
}*/
main#main {max-width: 100%; min-width: 40%; z-index: 1;
			display: block;
			background-color: var(--section-bg-color); opacity: var(--opacity); color: var(--section-text-color); 
			border: 1px solid var(--section-around-color); box-shadow: 2px 2px 1px #ffb3b3; border-radius: 15px;
			padding: 15px; margin: auto;}

/*News*/
aside#news {float: right;
			background-color: var(--news-bg-color); color: var(--news-text-color); 
			display: inline-block; top: 0px; right: 0px;
			padding: 10px; 
			border-radius: 10px; border: 1px solid; border-color: var(--news-text-color);
			margin-bottom: auto; margin-top: 10px; margin-right: 10px;
}

div.news {border: 1px solid;
			padding: 2px; 
			margin: 2px; 
			width: 250px; 
			border-radius: 10px; border: 1px solid; border-color: var(--news-text-color);
}

div.news-titre{text-decoration: underline; 
				font-size: 0.9rem;
				font-weight: bold;
				padding: 10px;
}

p.news-content{font-size: 0.9rem;}

#news-scroll{position: relative; ; top: 0px; right: 0px;
				float: right;
				margin: 0px;
}

footer#bannerFooter {display: flex; justify-content: space-between;
					background-color: var(--footer-bg-color);
					padding: 10px; margin: auto; margin-top: 15px; margin-bottom: 15px;
					border-radius: 10px; border: 1px solid var(--footer-around-color); text-align: center;
}

div#footer-container{padding: 10px; font-size: 0.8rem; font-style: italic; font-weight: bold; width: 60%;
					color: var(--footer-text-color); }

a#icon-facebook{ margin: 5px;}
#copyright{justify-content: right; display: block; margin:20px;}
#coord-octopus{float: right; display: block;}


/*Titre principale de la page*/
h2{font-size: 1.8rem; 
/*	text-decoration: underline;*/
	border: 1px solid white;
	text-align: center;
	}
/*Sous-titre de la page */
h3{font-size: 1.4rem; 
	text-decoration: underline;
}

/*Sous-sous-titre de la page */
h4{font-size: 1.2rem; 
	text-decoration: underline;
	font-weight: bold;
	padding-left: 2rem;
}

span.souligne{text-decoration: underline;}
div.table-empty{font-size: 1.2rem; font-style: italic;  font-weight: bold; border: 1px solid white; text-align: center;}

/* Pour toutes les tables*/
main#main table {
			table-layout: auto;
			width: 100%;
			border-collapse: collapse;
			border: 3px solid white;
			margin-top: 20px;
}
main#main td {
			border: 1px solid white;
			width: fit-content;
			padding: 2px;
}
main#main th {
			border: 1px solid white;
			width: fit-content;
			padding: 2px;
}


form {color: var(--section-text-color);}
/*Présentations*/
/*img#plongeur_equipe{width: 230px; height:  307px;
							float: right;}
img#plongeur_piscine{width: 192px; height:  255px;
								float: right;}
img#tortue{width: 200px; height:  200px
				float: right;}
img#octopus2{width: 240px; height:  180px;
						float: right;}
img#octopus{width: 240px; height:  180px; float: right;}
img#piscine{width: 300px; height:  230px; float: right;}
img#encadrants{width: 200px; height:  153px; float: right; margin-right: 100px;}
img#cours_piscine{width: 200px; height:  153px; float: right;}
img#salle{width: 200px; height:  153px; float: right;margin-right: 75px;}
img#compresseur{width: 200px; height:  153px; float: right;}
img#cafetaria{width: 200px; height:  153px; float: right;margin-right: 50px;}
div#atouts li {height: 160px}
img#cafetaria{width: 200px; height:  153px; float: right;margin-right: 50px;}
div#atouts li {height: 160px}
div#atouts a{color: honeydew; text-decoration: underline;font-weight: bold;}
table {border: 1px solid var(--table-border-color); border-collapse: collapse;}
td {border: 1px solid var(--table-border-color); padding: 3px;}*/

table#calendar li.calevent-sortie {background-color: green; color: white; }
table#calendar li.calevent-cours {background-color: red; color: white; }
table#calendar li.calevent-entrainement {background-color: blue; color: white; }
table#calendar li.calevent-gonflage {background-color: black; color: white; }
table#calendar li.calevent-event {background-color: yellow; color: black; }

/*Liens*/
/*
div#liens a{color: var(--link-text-color); text-decoration: underline;font-weight: bold;} -->*/
div#formulaires a{color: var(--link-text-color); text-decoration: underline;font-weight: bold; margin-bottom: 10px; margin-top: 10px}

a:link {
  color: var(--link-text-color);
}
a:visited {
  color: var(--link-visited-text-color);
}
a:hover {
/*font-size: 130%;*/
	background-color: white;
	color: black;
}

/* Liste des fichiers supports+documents*/
ul.no-bullets {
  list-style-type: none;
}
ul.no-bullets > li{margin-bottom: 0.5rem;}

ul.square-list {
  list-style-type: square;
}

#gal_iframe{ opacity: 100%;
			display: block;
			margin-left: auto;
			margin-right: auto;
			height: var(--gal-height);}

/*Footer*/
/*
footer#footer li{display: inline; }
*/
/*
ul#footer li a{ text-decoration: none; background-color: #539da8; color: #00364e; margin: 3px; padding: 3px; border: 1px solid;}
*/
/*div#bannerFooter a{float: right;}*/


/*a.note {color: var(--link-text-color); }*/