/**********************************/
/**********             ***********/
/**********  © Sodalec  ***********/
/**********             ***********/
/**********************************/
/********                  ********/
/********  Styles communs  ********/
/********                  ********/
/**********************************/


/**********************************/
/********                  ********/
/********  Styles de base  ********/
/********  Left to Right   ********/
/********                  ********/
/**********************************/


/*************  Page  *************/
html { 
	font-size: 62.5%; /* 1rem = 10px pour un navigateur avec une police à 16 px (de base sur tous les navigateurs) */
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAgCAMAAAA2a+hwAAAAsVBMVEUAAADkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkTSbkVzLlTyblYT/la0vmUCbmUifmdVfnUyfndlnniHDnknzoVSfonInoppXosKHpVifpxLrqWCfqn4vqzcbq19LrWSjrWyjr6+vsXCjtx77uXyjvYSjvYinw5uTw8PDxZSnybzb0glH1jF/2n3n3qIf4spT6xa/82cr84tf97OT+9fL////mUIGDAAAADnRSTlMAECAwQGBwgI+fv8/f751sGksAAAERSURBVBgZBcFBbhNBEADAmpmOV8YhEpE4ceH/T+NiJTFe7J3uoaq9AQAAoAMAAEAAAL8AOP4IAOAFgIOeAAAAZCzYAH0ApGkF+AHYzgA3d3rCBACYkB0kAACSWAB7cWyA4rCiYG78e+A7AFQHAACY6AWFEwCwqCiYuFzYXgF7ojoAAMCBLpEAAIUUFuYD6BOjsUxLAFfgesK3BneEgrfBFdBJKGHB2ADAoiwdgAF04ImQkHh/HnsbY6AgBbAwzuefF4CEbgEAYCmWkPD13E4ByMyEFIDHQzu/nCozF0wIqgPr7uM3wFIE1QEAcu6figAAcOy3JyC4R4wB2P/eQOacNKBFRANUzrlAA2CMCHNmAvgPl+58ykGMbDQAAAAASUVORK5CYII=);
	background-position: right bottom;
	background-size: 16px 18px;
	background-repeat: no-repeat;
	background-color: #E4E4E4;
	margin:0;
	padding:0;
	direction: ltr;
} 
body {
	position: relative;
	font-family: Arial, Helvetica, FreeSans, sans-serif;
	font-size: 11px; /* pour les navigateurs qui ne prennent pas en compte le rem (root em)*/
	font-size: 1.1em;
	text-align: left;
	background-image: url(../images/bgd_leftmenu.png);
	background-position: 18px 100px;
	background-repeat: no-repeat;
	background-color: #FFF;
	color: #595A5B;
	width: 1000px;
	margin: 0 auto;
	-webkit-box-shadow: 0 0 50px #BBB;  
	box-shadow: 0 0 50px #BBB;
}
#calcoBody {
	position: relative;
	background-color: rgba(255, 255, 255, 0.3);
}

/************  Listes  ************/
li {
	list-style: none;
}

/*********** Paragraphes **********/

/*************  Liens  ************/
a { 
	color: #c82b2a;
	text-decoration: none;
}
a:link, a:visited {
	color: #c82b2a;
}
a:hover, a:focus {
	text-decoration: underline;
}
a[href^="http://www"]::after {
	content: url(../images/arrow_left.png);
	margin: 0 0 4px 3px;
}

/************  Titres  ************/
h1{
	margin: 0;
	padding: 10px 0 0 0;
	color: #fff;
	font-size: 30px;
	font-size: 3.0rem;
	font-style: italic;
	-webkit-text-shadow: 0 0 5px #000;  
	text-shadow: 0 0 5px #000;
	text-align: center;
}
h2 {
	color: #c82b2a;
	font-size: 15px;
	font-size: 1.5rem;
	padding: 0;
	margin: 0 0 2px 0;
}
h2::before {
	content: "\25A0";
	margin: 0 4px 0 0;
}
h2 a {
	color: #c82b2a;
	text-decoration: none;
}
h3 {
	color: #c82b2a;
	padding: 0;
	margin: 3px 0 3px 2px;
	font-size: 13px;
	font-size: 1.3rem;
}
h3::before {
	content: "\25AA";
	margin: 0 4px 0 0;
}
h4 {
	color: black;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	padding: 0;
	margin: 2px 0;
}

/***********  Onglets  ************/ 
#fakOnglet
{
    list-style-type: none;
	padding: 8px 0 0 0;
	margin: 0 14px 0 4px;
}
#fakOnglet li 
{
    display: inline;
	padding: 3px 10px 4px 0;
	margin: 0 -3px 0 0;
	border-bottom: 1px solid #848486;
}
#fakOnglet li.displhide {
	display: none;
}
#fakOnglet li a, #fakOnglet li a.unsel
{
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: bold;
    color: #6e6f72;
    text-decoration: none;
    text-align:center;
	background-color:#e8e8e8;
	border-top: 1px solid #848486;
	border-left: 1px solid #848486;
	border-right: 1px solid #848486;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	padding: 4px 6px;
}
#fakOnglet li a.unsel
{
	border-bottom: 1px solid #848486;
}
#fakOnglet li a.selected, #fakOnglet li a.selec, #fakOnglet li a:hover, #fakOnglet li a.selected:active
{
    color: #c82b2a;
    background-color: #fff;
}
#fakOnglet li a.selec
{
	border-bottom: 1px solid #fff;
}
div[id^="fakOnglet"], div[class="part"], .partNoMargeBott {
	border-left: 1px solid #848486;
	border-right: none;
	padding: 10px 10px 0 10px;
}
div[id^="fakOnglet"], div[class="part"] {
	margin : 0 0 10px 4px;
}
.partNoMargeBott {
	margin : 0 0 0 4px;
}

/************  Divers  ************/ 
p {
	margin: 4px 0;
}
.show {
	display: inline-block;
}
.hide {
	display: none;
}
.hidden {
	visibility: hidden;
}
.block {
	display: block;
}
.inline {
	display: inline;
}
.size14 {
	font-size: 14px;
	font-size: 1.4rem;
}
.strong {
	color: black;
	font-style: italic;
}
.right {
	text-align: right;
}
.left {
	text-align: left;
}
.milieu {
	text-align:center;
}
.justify {
	text-align:justify;
}
.alarme {
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	color: #F00;
}
.fright {
	float: right;
	margin: 0 0 0 10px;
}
.fleft {
	float: left;
	margin: 0 10px 0 0;
}
.tabul1, .tabul4 {
	padding: 0 10px 0 0;
}
.tabul2 {
	padding: 0 30px 0 0;
}
.tabul3 {
	padding: 0 100px 0 0;
}
.cacheBr {
	display: none;
}
.cacheBr860 {
	display: none;
}

/**********  Infobulles  **********/
.infobulle, .infotexte {
	position: absolute;
	border: 1px solid #6e6f72;
	padding: 3px;
	font-size: 10px;
	font-size: 1.0rem;
	text-align: left;
	color: #6e6f72;
	background-color: #e5eb59;
	z-index: 500;
	visibility : hidden;
}
.infobulle {
	margin: -25px 0 0 -50px;
}
.infotexte {
	margin: -50px 0 0 -50px;
}

/************  Tableaux  **********/ 
table {
	border-spacing: 1px;
	border-collapse: collapse; /* Colle les bordures entre elles */
	display: block;
	margin: 0 -4px 0 0;
	padding: 0;
	width: auto;
}
table[id^="table"], .dispIB {
	display: inline-block;
}
.vertAlignTop {
	vertical-align: top;
}
th {
	font-weight: normal;
}
td, th {
	border: 1px solid #000;
	text-align: right;
	padding: 0 2px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
	height: 20px;
}
th ~ td {
	border-right: 1px solid #000;
	border-left: 1px solid transparent;
}
.invisbord {
	border: 1px solid transparent;
	padding: 2px 0;
}
.bordblanc {
	border: 1px solid #FFF;
	z-index: -1;
}
.invisbordHG {
	border: 1px solid transparent;
	border-bottom: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordBG {
	border: 1px solid transparent;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordBD {
	border: 1px solid transparent;
	border-top: 1px solid #000;
	border-left: 1px solid #000;
}
.invisbordL {
	border: 1px solid transparent;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordB {
	border: 1px solid transparent;
	border-left: 1px solid #000;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordH {
	border: 1px solid transparent;
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordHB {
	border: 1px solid transparent;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordGHD {
	border: 1px solid transparent;
	border-bottom: 1px solid #000;
}
.invisbordBL {
	border: 1px solid transparent;
	border-top: 1px solid #000;
	border-right: 1px solid #000;
}
.invisbordHBD {
	border: 1px solid transparent;
	border-left: 1px solid #000;
}
/************  Courbes  ************/
line {
	stroke: black;
	stroke-width: 1px;
}
path.curve {
	stroke: #347C9C;
	stroke-width: 2px;
	fill: none;
}
.red {
	stroke-width: 2px;
	stroke: #9C2420;
	fill: none;
	background-color: #9C2420;
	color: #FFF;
	font-weight : bold;
}
.green {
	stroke-width: 2px;
	stroke: #6CB440;
	fill: none;
	background-color: #6CB440;
	color: #FFF;
	font-weight : bold;
}
.blue {
	stroke-width: 2px;
	stroke: #347C9C;
	fill: none;
	background-color: #347C9C;
	color: #FFF;
	font-weight : bold;
}
path.arrow {
	stroke: black;
	fill: black;
}
.textSVG {
	font-size: 10px;
	font-size: 1rem;
	stroke: none;
	stroke-width: 1px;
	fill: #595A5B;
}

/*********  "Formulaires"  ********/ 
input {
	font-family: Arial, Helvetica, FreeSans, sans-serif;
	font-size: 11px;
	font-size: 1.1rem;
	text-align: right;
	color: black;
	padding: 0;
	margin: 0;
}
select {
	font-family: Arial, Helvetica, FreeSans, sans-serif;
	border: 1px solid #CCC;
	padding: 0;
	margin: 0;
	font-size: 11px;
	font-size: 1.1rem;
	color: black;
}
td > select {
	margin: 0 -2px;
}
td[class^="invisbord"] > select {
	margin: 0;
}
.valid {
	border: 1px solid #CCC;
	color: #000;
}
select.valid:hover, select.valid:focus {
	border: 1px solid #6e6f72;
	background-color: #c82b2a;
	color: white;
}
.unvalid {
	border: 1px solid #CCC;
	background-color: #e0e0e0;
	color: #6e6f72;
}
.unvalidnobord {
	border: none;
	background-color: #e0e0e0;
	color: #6e6f72;
}
input.nobord:hover, .param:hover, input.nobord:focus, .param:focus {
	background-color: #c82b2a;
	color: white;
}
.nobord {
	border: none;
}
.bord {
	border: 1px solid #ccc;
}
input.bord:hover, input.bord:focus {
	border: 1px solid #6e6f72;
	background-color: #c82b2a;
	color: white;
}
option {
	padding: 0 6px 0 0;
}
input[type="checkbox"] {
	vertical-align: middle;
}

/************  Entete  ************/
header {
	height: 87px;
	width: 1000px;
	padding: 1px 0 0 0;
	border-bottom: 1px solid #FEDB16;
	background-color: #FEDB16;
}
.aCacher {
    position: relative;
	font-size: 1px;
    z-index: -1;
}
#Bandeau{
	height: 56px;
	border-bottom: 3px solid white;
	background-image: url(../images/headband_1.jpg), url(../images/headband_2.jpg), url(../images/headband_3.jpg), url(../images/headband_4.jpg), url(../images/headband_6.jpg), url(../images/headband_5.jpg);
	background-repeat: no-repeat;
	background-position: 280px 0px, 400px 0px, 520px 0px, 640px 0px, 760px 0px, 880px 0px;  
}
#Bandeau a {
	display: inline-block;
	background-image: url(../images/logo.png);
	background-color: #FFF;
	width : 249px;
	height: 49px;
	margin: 2px 0 0 10px;
	border: 4px solid white;
	border-radius: 12px;
	-webkit-box-shadow: 0 0 20px #fff;  
	box-shadow: 0 0 20px #fff;
	float: left;
}

#NavHead {
	margin: 4px 0 0 1px;
	width: 998px;
	height: 21px;
	background-color: #FFF;
}
#NavHead ul{
	padding: 0;
	margin: 0;
	text-align: center;
}
#NavHead ul li {
	display: inline-block;
}
#NavHead ul li a {
	color: #595A5B;
	text-decoration: none;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	display: block;
	padding: 3px 16px;
}
#NavHead ul li.selected a, #NavHead ul li:hover a {
	color: #c82b2a;
}
#NavHead ul li ul {
	display: none;
	position: absolute;
	background-color: #FFF;
	margin: 0;
	padding: 3px 0 9px 0;
	z-index: 10;
	border-left: 3px solid #FEDB16;
	border-right: 3px solid #FEDB16;
	border-bottom: 3px solid #FEDB16;
}
#NavHead ul li:hover ul {
	display: block;
}
#NavHead ul li ul li {
	display: inline;
	height: auto;
	float: none;
}
#NavHead ul li ul li a {
	display: block;
	float: none;
	font-size: 12px;
	font-size: 1.2rem;
	color: #595A5B !important;
	height: auto;
	padding: 0;
	margin: 0;
	white-space: nowrap;
	padding: 1px 30px 1px 16px;
}
#NavHead ul li ul li:hover a {
	color: #c82b2a !important;
}

/*********  Corps de page  ********/
section {
	display: inline-block;
	width: 707px;
	padding: 0 0 0 25px;
}
#NavIco {
	display: block;
	text-align: center;
	margin: 0;
	padding: 0;
}
#NavIco  ul{
	padding: 0 10px 0 0;
	margin: 6px auto;
}
#NavIco img {
	border: 2px solid #848486;
	background-color: #D8D8DC;
	border-radius:4px;
}
#NavIco img:hover {
	border: 2px solid #FEDB16;
	background-color: #FEDB16;
	-webkit-box-shadow: 0 0 10px #FEDB16;  
	box-shadow: 0 0 10px #FEDB16;
}
#NavIco img.selected {
	border: 2px solid #c82b2a;
	background-color: #c82b2a;
	-webkit-box-shadow: 0 0 10px #c82b2a;  
	box-shadow: 0 0 10px #c82b2a;
}
#NavIco img.selected:hover {
	background-color: #c82b2a;
	border: 2px solid #c82b2a;
	-webkit-box-shadow: 0 0 10px #FEDB16;  
	box-shadow: 0 0 10px #FEDB16;
}
#NavIco a {
	color: #0034d8;
}

#NaviLeft {
	display: inline-block;
	vertical-align: top;
	width: 244px;
	padding: 11px 0 0 18px;
}
#NaviLeft ul {
	padding: 0;
}
#NaviLeft ul li {
	font-weight: bold;
	display:inline;
}
#NaviLeft ul li a {
	display: block;
	background-color: rgba(202, 202, 202, 0.5);
	height: 20px;
	padding:  5px 0 3px 5px;
	color: #595A5B;
	text-decoration: none;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: bold;
}
#NaviLeft ul li.selected a, #NaviLeft ul li a:hover {
	background-color: #848486 ;
	color: #fff;
}
#NaviLeft ul li ul {
	padding: 0;
}
#NaviLeft ul li.selected ul li a {
	display: block;
	padding: 1px 0 0 10px;
	color: #595A5B;
	text-decoration: none;
	background-color: rgba(255, 255, 255, 0.2);
	height: 17px;
	font-size: 12px;
	font-size: 1.2rem;
}
#NaviLeft ul li.selected ul li a::before {
	content: "\25AA";
	margin: 0 4px 0 0;
}
#NaviLeft ul li.selected ul li.selected a, #NaviLeft ul li.selected ul li a:hover {
	color:#c82b2a;
}

#path {
	font-size: 10px;
	font-size: 1.0rem;
	margin: 6px 0;
	display: inline-block;
}
#path span::before {
	content: ">";
	margin: 0 4px 0 0;
}
#path span::after {
	content: " ";
}
#path span[class="show"]::before, #path span[class="hide"]::before, #path span[class="show"]::after, #path span[class="hide"]::after {
	content: none;
}

#langpath {
	font-size: 10px;
	font-size: 1.0rem;
	margin: 6px 0;
	padding: 0 15px 0 0;
	display: inline-block;
	float: right;
}
#langpath select {
	font-size: 10px;
	font-size: 1.0rem;
}
hr {
	color : transparent;
	background-color : transparent;
	clear: both;
	margin: 0;
	padding: 0;
	width : 50%;
	border: none;
}
#Corpus {
	border-left: 1px solid #FEDB16;
	border-right: 1px solid #FEDB16;
}
#Notif {
	background-color: rgba(202, 202, 202, 0.3);
	text-align: center;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	padding: 2px 0;
	margin: 0;
	border-bottom: 2px solid #FEDB16;
}
#Notif div{
	display: inline;
	margin: auto 15px;
}
#download{
	position: fixed;
	top: 50%;
	left: 50%;
	margin: -50px 0 0 -50px;
	width: 100px;
	height: 100px;
	z-index: 999;
	font-size: 20px;
	font-size: 2rem;
	color: #c82b2a;
}

/*********  Pied de page  *********/
footer {
	display: table-cell;
	vertical-align: middle;
	font-size: 9px;
	font-size: .9rem;
	position: relative;
	bottom: 0;
	height: 20px;
	width: 1000px;
	background-color: #FEDB16;
}
footer p {
	margin: 0 auto;
	text-align: center;
	font-style: italic; 
	font-weight: bold; 
}

/************  Index  *************/
#HomeLeft {
	display: inline-block;
	vertical-align: top;
	width: 244px;
	padding: 11px 0 0 18px;
}
#HomeLeft h1 {
	margin: 0;
	padding: 0;
	font-size: 22px;
	font-size: 2.2rem;
	font-style: normal;
	border-bottom: none;
	width: 183px;
	position: relative;
	left: 30px;
	top: 45px;
	text-align: center;
	-webkit-text-shadow: 0 0 10px #444;  
	text-shadow: 0px 0px 15px #444;
	font-style: italic;
	color: #FEDB16;
}
#HomeLeft ul.stickers {
	margin: 0;
	padding: 0;
	width: 110px;
	position: relative;
	left: 75px;
	top: 80px;
}
#HomeLeft ul.stickers li {
	float: left;
	margin: 0 10px 10px 0;
}
#HomeLeft ul.stickers li img{
	-webkit-box-shadow: 0 0 10px #fff;  
	box-shadow: 0px 0px 15px #888;
}
.connexion {
	color: black;
	position: relative;
	top: 10px;
	left: 20%;
	width: 300px;
	height: 100px;
	border: 2px solid #c82b2a;
	padding: 20px 20px 10px 20px;
	background-color: #FEDB16;
}
.connexion div.intitule {
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	margin: 10px 0 20px 0;
}
.connexion input#bouton {
	position: relative;
	top: -20px;
	left: 60px;
}
#HomeFoot {
	height: 33px;
}

/**********  Synoptique  **********/
.case {
	font-size: 9px;
	font-size: 0.9rem;
	height: 50px;
	width: 50px;
	position: relative;
}
.case > img {
	position: absolute;
	left: 11px;
	bottom: 16px;
}
.case[id^="mag"] > img {
	position: absolute;
	left: 8px;
	bottom: 8px;
}
.case > p {
	position: absolute;
	margin: 0;
}
.case p.dataHaut {
	left: 0;
	top: 1px;
	width: 50px;
	text-align: center;
}
.case p.dataBas {
	left: 0;
	bottom: 2px;
	width: 50px;
	text-align: center;
}
.case > span.numero {
	position: absolute;
	font-weight: bold;
	right: 7px;
	bottom: 17px;
	z-index: 50;
}
#Bdd {
	display: none;
}
#P-S_mag {
	display: none;
}
[id^="fondGrille"] {
	top: 0;
	left: 0;
	margin: 0;
	padding:0;
}
.popUpFond {
	position: fixed;
	height: 100%;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.8);
}
.unPopFond {
	position: relative;
	height: auto;
	width: auto;
	background-color: transparent;
}
.unPopFermer {
	display: none;
}
.popUpFermer {
	display: inline;
	position: fixed;
	color: #F00;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: bold;
	top: 5px;
	right: 5px;
}

[id^="grille"] {
	position: relative;
	background-image: url(../icones/batiment1.png);
	background-position: 0 0;
	background-repeat: no-repeat;
}
[id^="grille"] div[id^="c"]{
	position: absolute;
	display: inline-block;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	z-index: 1;
}
.popUpGrille {
	position: fixed;
	top: 50%;
	left: 50%;
	margin: -123px 0 0 -222px;
}
.popUpGrille div[id^="c"] {
	background-image: url(../icones/cross.png);
	background-position: 0 0;
	background-repeat: no-repeat;
}
.popUpGrille div[id^="c"]:hover {
	background-color: rgba(200, 43, 42, 0.5);
}


/**********************************/
/**********              **********/
/**********  Mobile CSS  **********/
/**********              **********/
/**********************************/

@media (max-width: 1024px) {
	body {
		width:auto !important;
		margin: 0 40px;
	}
	#calcoBody {
		background-color: rgba(255, 255, 255, 0.7);
	}
	header, #NavHead {
		width: auto !important;
	}
	#Bandeau {
		background-image: none;
	}
	#Bandeau a img {
		margin: 0 0 0 13px;
		height: 89%;
	}
	#NavHead {
		margin: 4px 0 0 0;
		padding: 0 0 0 20px;
		text-align: center;
	}
	#NavHead ul{
		padding: 0;
		margin: 0 0 0 10px;
	}
	#NavHead ul li:hover ul {
		display: none;
	}
	section {
		width: 100%;
		padding: 0 0 0 5px;
	}
	#NaviLeft, #HomeLeft {
		display: none!important;
	}
	#Corpus {
		border: none;
	}
	footer{
		min-width: 100%;
	}
}

@media (max-width: 860px) {
	#Bandeau a {
		background-image: url(../images/logosmall.png);
		width: 49px;
	}
	h1 {
		padding: 14px 0 0 0;
		font-size: 23px;
		font-size: 2.3rem;
	}
	header {
		height: auto;
	}
	#NavHead {
		height: auto;
		margin-bottom: 3px;
	}
	#NavHead ul li{
		height: 21px;
	}
	.cacheBr860 {
		display: block;
	}
}

@media (max-width:640px)  {
	body {
		margin: 0 20px;
	}
	h1 {
		padding: 16px 0 0 0;
		font-size: 20px;
		font-size: 2.0rem;
	}
	#NavHead {
		text-align: left;
		padding: 0;
	}
	#NavHead ul {
		display: table;
		width: 100%;
		margin: 0;
	}
	#NavHead ul li {
		display: table-row;
	}
	#NavHead ul li a {
		display: table-cell;
		vertical-align: middle;
		text-decoration: none;
		padding: 3px 16px 3px 24px;
	}
	#NavHead ul li.selected a, #NavHead ul li a:hover {
		background-color: #FEDB16 ;
		color: #c82b2a;
	}
	#fakOnglet li , #fakOnglet li.unsel {
		display: block;
		padding: 3px 0 4px 0;
		color: #fff;
		border: none;
	}
	#fakOnglet li a , #fakOnglet li a.unsel, #fakOnglet li a.selec {
		border: 1px solid #848486;
		border-bottom-right-radius: 4px;
		border-bottom-left-radius: 0;
	}
	#fakOnglet li.selected, #fakOnglet li.selec, #fakOnglet li:hover, #fakOnglet li.selected:active
	{
		color: #c82b2a;
		background-color: #fff;
	}
	.connexion {
		position: relative;
		left: 5%;
		width: 300px;
		height: 100px;
		border: 2px solid #c82b2a;
		padding: 20px 20px 10px 20px;
	}
	#Notif #Notif1, #Notif #Notif2 {
		display: block;
	}
	/************  Courbes  ************/
	line {
		stroke-width: 1px;
	}
	path.curve {
		stroke-width: 1px;
	}
}
@media (max-width:480px)  {
	body {
		background-image: none;
	}
	h1 {
		padding: 17px 0 0 0;
		font-size: 18px;
		font-size: 1.8rem;
		margin: 0;
		text-align: center;
	}	
	#path {
		display: none;
	}
	#langpath {
		margin: 6px 0 -18px 0;
	}
	.connexion {
		position: relative;
		top: 10px;
		left: 0%;
		width: auto;
		height: auto;
		padding: 10px;
	}
	.connexion div.intitule {
		font-size: 15px;
		font-size: 1.5rem;
		font-weight: bold;
		margin-top: 5px;
		margin-bottom: 5px;
	}
	.connexion input#bouton {
		display: block;
		margin-top: 5px;
		margin-bottom: 5px;
		top: 0px;
		left: 0px;
	}
	.tabul1 {
		padding: 0 5px 0 0;
	}
	.tabul2 {
		padding: 0 10px 0 0;
	}
	.tabul3 {
		padding: 0 20px 0 0;
	}
	.cacheBr {
		display: block;
	}
	/**********  Synoptique  **********/
	div[id^="fakOnglet"] {
		padding: 0;
	}
}
@media (max-width:599px)  {
	/**********  Synoptique  **********/
	[id^="grille"] {
		background-image: url(../icones/batiment2.png);
	}
	.popUpGrille {
		position: fixed;
		top: 50%;
		left: 50%;
		margin: -222px 0 0 -123px;
	}
}
@media (max-width:320px)  {
	h1{
		font-size: 16px;
		font-size: 1.6rem;
		padding: 18px 0 0 0;
	}
	.tabul2 {
		padding: 0 5px 0 0;
	}
	.tabul3 {
		padding: 0 10px 0 0;
	}
	.dispIB {
		display: block;
	}
	.hid {
		display: none;
	}
}

@media (max-device-width:640px) and (orientation:landscape)  {
	body {
		-webkit-text-size-adjust: 70% !important;
	}
}