@charset "utf-8";

body { font: 100% Arial, Helvetica, Verdana, sans-serif; margin: 0;  padding: 0; text-align: center; color: #000000; background-color: #FFFFFF; background-image: url(img/png/fond.png); background-repeat: repeat-y; background-position: center top }

.bsbisca #container { width: 800px;   background: #FFFFFF; margin: 0 auto; border: 0px solid #000000; text-align: left; } 
.bsbisca #header { background-image: url(img/jpg/plage-biscarosse.jpg); background-repeat: no-repeat; background-position: center top; height: 207px; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 20px; font-size: 11px; color: #FFFFFF; font-weight: bold } 
h1 { margin: 0px; etter-spacing: -2px; font-family: Geneva, Arial, Helvetica, sans-serif; line-height: 100%; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; color: #1A3150; font-weight: normal; text-transform: none; font-size: 220%; letter-spacing: -1px; }
h2 { margin: 0; letter-spacing: -1px; font-family: Arial, Helvetica, sans-serif; line-height: 85%; padding-top: 20px; padding-right: 0; padding-bottom: 0px; padding-left: 0; text-transform: uppercase; font-size: 140%; font-weight: normal; }

/* MENU */
.bsbisca #menu {
	background-image: url(img/jpg/plage-biscarosse-2.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	height: 32px;
	padding-left: 0px;
	padding-top: 14px;
	white-space: nowrap;
} 
.bsbisca #menu a {
	font-weight: normal;
	color: #FFFFFF;
	text-decoration: none;
	background-color: #4B7186;
	padding-top: 5px;
	padding-right: 7px;
	padding-bottom: 5px;
	padding-left: 7px;
	margin-right: 1px;
	font-size: 100%;
} 

.bsbisca #menu a:hover { padding-top: 11px; padding-bottom: 11px; color: #FFFFFF; background-color: #01578B } 
.bsbisca #menu a.b:hover { background-color: #831969; } 
.bsbisca #menu a.c:hover { background-color: #831919; } 
.bsbisca #menu a.d:hover { background-color: #836419; } 
.bsbisca #menu a.e:hover { background-color: #678319; } 
.bsbisca #menu a.f:hover { background-color: #16766F; } 
.bsbisca #menu a.g:hover { background-color: #196983; } 

.bsbisca #menu .a { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #01578b; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .b-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #831969; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .c-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #831919; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .d-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #836419; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .e-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #678319; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .f-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #16766F; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 
.bsbisca #menu .g-link { font-weight: normal; color: #FFFFFF; text-decoration: none; background-color: #196983; padding-top: 11px; padding-right: 10px; padding-bottom: 11px; padding-left: 10px; margin-right: 1px } 

/* SIDEBAR 1 */
.bsbisca #sidebar1-a { background-color: #cce0ea; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-b { background-color: #FBE6F5; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-c { background-color: #FBEAEA; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-d { background-color: #F9F1DF; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-e { background-color: #F3FAE2; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-f { background-color: #C5F5F2; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }
.bsbisca #sidebar1-g { background-color: #196983; float: left; width: 200px; padding-top: 10px; padding-right: 0px; padding-bottom: 15px; padding-left: 0px; }

ul { padding-right: 12px; padding-left: 12px; padding-top: 10px; padding-bottom: 10px; margin-top: 0px; text-align: left; }

ul a.a-lien:link, a.a-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.a-lien:hover { color: #00568E; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.b-lien:link, a.b-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.b-lien:hover { color: #831969; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.c-lien:link, a.c-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.c-lien:hover { color: #831919; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.d-lien:link, a.d-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.d-lien:hover { color: #836419; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.e-lien:link, a.e-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.e-lien:hover { color: #678319; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.f-lien:link, a.f-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.f-lien:hover { color: #16766F; text-decoration: none; background-color: #FFFFFF; padding: 2px }
ul a.g-lien:link, a.g-lien:visited { text-decoration: none; color: #FFFFFF; font-weight: bold; font-size: 80%; }
ul a.g-lien:hover { color: #196983; text-decoration: none; background-color: #FFFFFF; padding: 2px }

.ul-a { background-color: #00568E; }
.ul-b { background-color: #831969; }
.ul-c { background-color: #831919; }
.ul-d { background-color: #836419; }
.ul-e { background-color: #678319; }
.ul-f { background-color: #16766F; }
.ul-g { background-color: #196983; }

li {
	list-style-type: none;
	margin-bottom: 5px;
	list-style-position: inside
}

/* MAIN CONTENY */
.bsbisca #mainContent { margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 210px; padding-top: 10px; padding-right: 15px; padding-bottom: 0; padding-left: 15px; text-align: left; } 

/* FOOTER */
.bsbisca #footer { padding: 0 10px 0 20px; color: #FFFFFF; font-size: 90%; text-align: left;
} 
.bsbisca #footer a:link, a:visited { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #FFFFFF; text-decoration: none; }

.a-footer { background-color: #01578B; }
.b-footer { background-color: #831969; }
.c-footer { background-color: #831919; }
.d-footer { background-color: #836419; }
.e-footer { background-color: #678319; }
.f-footer { background-color: #16766F; }
.g-footer { background-color: #196983; }

.bsbisca #footer p { margin: 0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge (espace entre les éléments div) */ padding: 10px 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
}
.fltrt { /* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */ float: right; margin-left: 8px }
.fltlft { /* cette classe permet de rendre flottant le côté gauche d'un élément dans la page */ float: left; margin-right: 8px }
.clearfloat { 
/* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement un élément flottant */ clear:both; height:0; font-size: 1px; line-height: 0px }

/* ENTETE FILET */
.a-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#01578B; }
.b-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#831969; }
.c-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#831919; }
.d-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#836419; }
.e-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#678319; }
.f-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#16766F; }
.g-filet { position:absolute; font-size:8px; width:800px; margin-top:5px; background-color:#01578B; }

/* Mot Rubrique */
.entete-a { background-color:#5497B8; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-b { background-color:#C5259D; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-c { background-color:#B62323; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-d { background-color:#B18621; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-e { background-color:#91BA23; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-f { background-color:#1D9C93; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }
.entete-g { background-color:#01578B; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #FFFFFF; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; margin-top: 10px; text-align: left; }

.video { width: 350px; margin-top: 15px; }

/* Catalogue Liens */
a.lien-cata:link { font-weight: normal; color: #0000CC; text-decoration: underline; }
a.lien-cata:hover { font-weight: normal; color: #006600; text-decoration: none; }

