body {
font-family : Arial, Helvetica, sans-serif;
font-size : 100%;
margin: 0;
min-height: 100vh;
min-width: 100vw;
overflow-x: hidden;
background: url("imgs/fond-web2.jpg") top center no-repeat;
background-size: contain;
}
#hautparleur {display:inline}
#bandeaulien {font-size:90%;padding-top:6px;}
#entier {
width : 960px;
height : 100%;
margin : 0 auto;
}
#titrage {
width : 100%;
text-align : center;
font-size : 120%;
font-weight : bold;
color : #ffffff;
height : auto;
position : relative;
margin : 0 auto;
border-radius : 4px;
background-color :#1f52ed87;
padding: 6px 0px;
}
#speczero {
width : 45%;
font-size : 16px;
float : left;
line-height : 18px;
font-weight : bold;
color : red;
margin : 0 auto;
padding-top : 1px;
padding-left:4px;
padding-right:4px;
background-color : rgb(220, 220, 220, 0.5);
text-align : left;
border:2px rgba(125, 125, 125, 0.1) solid;
border-radius:6px;
cursor:pointer;
}
#speczero {
display : inline;
}
#speczero2 {
width : 45%;
font-size : 16px;
float : right;
line-height : 18px;
font-weight : bold;
color : gray;
margin : 0 auto;
padding-top : 1px;
padding-left:4px;
padding-right:4px;
background-color : rgb(220, 220, 220, 0.5);
text-align : right;
border:2px rgba(125, 125, 125, 0.1) solid;
border-radius:6px;
cursor:pointer;
}
#speczero2 {
display : inline;
}
#annonce {
width : 100%;
color : #999;
text-align : center;
line-height : 12px;
float : center;
font-size : 10px;
margin : 6px auto;
}
@font-face {
font-family : "'Roboto'";
font-style : normal;
font-weight : 500;
src : local('Roboto Medium'), local('Roboto-Medium'), url(//fonts.gstatic.com/s/roboto/v18/RxZJdnzeo3R5zSexge8UUaCWcynf_cDxXwCLxiixG1c.ttf) format('truetype');
}
svg {overflow:visible;}
#global {
margin : -4px auto 0 auto;
/*background: url("imgs/base-fond.png") top center no-repeat;
width: 956px;border: dashed darkorange 2px;*/
height:800px;

}
.masque {
display : none;
}
.affich {
display : inline;
}
div.affich {
display : block;
float : left;
width : 46%;
margin-right : 8px;
margin-bottom: 9px;
padding : 4px;
text-align : center;
font-size : 11px;
border : 1px darkviolet solid;
border-radius : 4px;
word-wrap: break-word;	
font-family: Arial, Helvetica, sans-serif;
color: darkgreen;
background-color:rgba(255, 255, 255, 0.5);
margin-left:2px;
}
div.affich:hover {
cursor:pointer;
color:red;
}
#runmap {
width : 85%;
height : auto;
font-size : 26px;
background-color : transparent;
margin : 0 auto;
overflow : hidden;
z-index : 1;
padding-left:0px;
}
#carte {
z-index: 10;
margin-top:40px;
margin-left:0px;
}
#bulles {
width : auto;
height : auto;
background-color : white;
padding-top : 0;
border : darkgreen solid 1px;
overflow : hidden;
border-radius : 6px;
z-index : 1000;
}
/*.zerl {width:360px;height:126px;}
.unel {width:360px;height:138px;}
.deux {width:360px;height:150px;}
.troi {width:360px;height:162px;}
.quat {width:360px;height:174px;}
.cinq {width:360px;height:186px;}
.sixl {width:360px;height:198px;}
.sept {width:360px;height:210px;}
.huit {width:360px;height:222px;}
.neuf {width:360px;height:234px;}
.dixl {width:360px;height:246px;}
.onze {width:360px;height:258px;}
.douz {width:360px;height:270px;}
.trei {width:360px;height:282px;}
.quze {width:360px;height:294px;}
.quin {width:360px;height:306px;}
.seiz {width:360px;height:318px;}
.dsep {width:360px;height:330px;}
.dhui {width:360px;height:342px;}
.dneu {width:360px;height:354px;}
.ving {width:360px;height:366px;}
.viun {width:360px;height:378px;}
.vide {width:360px;height:390px;}
.vitr {width:360px;height:402px;}
.viqu {width:360px;height:414px;}
.vici {width:360px;height:426px;}
.visi {width:360px;height:438px;}
.vise {width:360px;height:450px;}
.vihu {width:360px;height:462px;}
.vine {width:360px;height:474px;}
.tren {width:360px;height:486px;}
.trun {width:360px;height:498px;}
.trde {width:360px;height:510px;}
.trtr {width:360px;height:522px;}
.trqu {width:360px;height:534px;}
.trci {width:360px;height:546px;}
.trsi {width:360px;height:558px;}
.trse {width:360px;height:570px;}
.trhu {width:360px;height:582px;}
.trne {width:360px;height:594px;}
.quar {width:360px;height:606px;}
.zerl {}
.unel {}
.deux {}
.troi {}
.quat {}
.cinq {}
.sixl {}
.sept {}
.huit {}
.neuf {}
.dixl {}
.onze {}
.douz {}
.trei {}
.quze {}
.quin {}
.seiz {}
.dsep {}
.dhui {}
.dneu {}
.ving {}
.viun {}
.vide {}
.vitr {}
.viqu {}
.vici {}
.visi {}
.vise {}
.vihu {}
.vine {}
.tren {}
.trun {}
.trde {}
.trtr {}
.trqu {}
.trci {}
.trsi {}
.trse {}
.trhu {}
.trne {}
.quar {}*/
.zerl {width:720px;height:126px;}
.unel {width:720px;height:138px;}
.deux {width:720px;height:150px;}
.troi {width:720px;height:162px;}
.quat {width:720px;height:174px;}
.cinq {width:720px;height:186px;}
.sixl {width:720px;height:198px;}
.sept {width:720px;height:210px;}
.huit {width:720px;height:222px;}
.neuf {width:720px;height:234px;}
.dixl {width:720px;height:246px;}
.onze {width:720px;height:258px;}
.douz {width:720px;height:270px;}
.trei {width:720px;height:282px;}
.quze {width:720px;height:294px;}
.quin {width:720px;height:306px;}
.seiz {width:720px;height:318px;}
.dsep {width:720px;height:330px;}
.dhui {width:720px;height:342px;}
.dneu {width:720px;height:354px;}
.ving {width:720px;height:366px;}
.viun {width:720px;height:378px;}
.vide {width:720px;height:390px;}
.vitr {width:720px;height:402px;}
.viqu {width:720px;height:414px;}
.vici {width:720px;height:426px;}
.visi {width:720px;height:438px;}
.vise {width:720px;height:450px;}
.vihu {width:720px;height:462px;}
.vine {width:720px;height:474px;}
.tren {width:720px;height:486px;}
.trun {width:720px;height:498px;}
.trde {width:720px;height:510px;}
.trtr {width:720px;height:522px;}
.trqu {width:720px;height:534px;}
.trci {width:720px;height:546px;}
.trsi {width:720px;height:558px;}
.trse {width:720px;height:570px;}
.trhu {width:720px;height:582px;}
.trne {width:720px;height:594px;}
.quar {width:720px;height:606px;}
.copy {
opacity : 0.5;
font-size : 0.7em;
}
#conteneur {
float : left;
width: 100%;
height:auto;
position : relative;
overflow-y: auto;
overflow-x: hidden;
padding-top:7px;
padding-bottom:20px;
margin:0 auto;
}
#frameecoles {
display: none;
float: right;
margin: 20px auto;
width: 100%;
height: auto;
position: relative;
}
#waitdiv {
width:128px;
height : 12px;
position:relative;
margin: 0 auto;
}
.overdiv {
width: auto;
max-width: 340px;
border: #0066cd solid 1px;
background-color: #FFF;
border-radius: 4px;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
font-weight : bold;
position: absolute;
text-align: justify;
z-index: 10000;
vertical-align: middle;
padding: 4px;
margin-top: -10px;
margin-left: 10px;
color: #0066cd;
}
h1 {
font-family : Arial, Helvetica, sans-serif;
text-align : center;
font-size : 16px;
margin-top : -6px;
padding-bottom:0px;
color: #0986a7;
background-color: white;
width: 100%;
border-radius: 4px;
margin-left: auto;
margin-right: auto;
}
h1.communeecole {
width:98%;
color: white;
background-color: rgba(125, 0, 125, 0.5);
padding:3px 0px 2px 0px;
margin-left:0px;
}
#pageecoles {
width:70%;
height:auto;
margin:10px auto;
text-align:center;
overflow:visible;	
}
#pageecoles a {
text-decoration:none;	
}
.decomptetab {
width:78%;
margin: 0 auto;
}
.nbr {
font-size:12px;
margin-top:-2px;
}

/*@media all and (max-width:720px) {
.zerl {width:720px;height:126px;}
.unel {width:720px;height:142px;}
.deux {width:720px;height:148px;}
.troi {width:720px;height:164px;}
.quat {width:720px;height:180px;}
.cinq {width:720px;height:196px;}
.sixl {width:720px;height:2128px;}
.sept {width:720px;height:228px;}
.huit {width:720px;height:244px;}
.neuf {width:720px;height:260px;}
.dixl {width:720px;height:276px;}
.onze {width:720px;height:292px;}
.douz {width:720px;height:308px;}
.trei {width:720px;height:324px;}
.quze {width:720px;height:340px;}
.quin {width:720px;height:356px;}
.seiz {width:720px;height:372px;}
.dsep {width:720px;height:388px;}
.dhui {width:720px;height:404px;}
.dneu {width:720px;height:420px;}
.ving {width:720px;height:436px;}
.viun {width:720px;height:452px;}
.vide {width:720px;height:468px;}
.vitr {width:720px;height:484px;}
.viqu {width:720px;height:500px;}
.vici {width:720px;height:516px;}
.visi {width:720px;height:532px;}
.vise {width:720px;height:548px;}
.vihu {width:720px;height:564px;}
.vine {width:720px;height:570px;}
.tren {width:720px;height:586px;}
.trun {width:720px;height:602px;}
.trde {width:720px;height:618px;}
.trtr {width:720px;height:634px;}
.trqu {width:720px;height:650px;}
.trci {width:720px;height:666px;}
.trsi {width:720px;height:682px;}
.trse {width:720px;height:698px;}
.trhu {width:720px;height:714px;}
.trne {width:720px;height:730px;}
.quar {width:720px;height:746px;}
}*/
@media all and (max-width:1920px) {
#entier {
width : 800px;
}
#runmap {
width : 85%;
}
#bandeaulien {font-size:85%}
#titrage {
font-size : 95%;
}
#speczero, #speczero2 {
font-size : 14px;
}
#annonce {
font-size : 9px;
}
.annonceimg {
padding-bottom : 2px;
width : 11px;
height : 9px;
}
#conteneur {
width: 800px;
}
h1 {
font-size : 14px;
margin-top : -8px;
}
#pageecoles {
width:75%;
}
#global {
background-size:contain;
height:700px;
width:98%;
}
#carte {margin-top:15px;
}
}
@media all and (max-width:1024px) {
body {
font-size : 90%;
}
.zerl {width:360px;height:126px;}
.unel {width:360px;height:138px;}
.deux {width:360px;height:150px;}
.troi {width:360px;height:162px;}
.quat {width:360px;height:174px;}
.cinq {width:360px;height:186px;}
.sixl {width:360px;height:198px;}
.sept {width:360px;height:210px;}
.huit {width:360px;height:222px;}
.neuf {width:360px;height:234px;}
.dixl {width:360px;height:246px;}
.onze {width:360px;height:258px;}
.douz {width:360px;height:270px;}
.trei {width:360px;height:282px;}
.quze {width:360px;height:294px;}
.quin {width:360px;height:306px;}
.seiz {width:360px;height:318px;}
.dsep {width:360px;height:330px;}
.dhui {width:360px;height:342px;}
.dneu {width:360px;height:354px;}
.ving {width:360px;height:366px;}
.viun {width:360px;height:378px;}
.vide {width:360px;height:390px;}
.vitr {width:360px;height:402px;}
.viqu {width:360px;height:414px;}
.vici {width:360px;height:426px;}
.visi {width:360px;height:438px;}
.vise {width:360px;height:450px;}
.vihu {width:360px;height:462px;}
.vine {width:360px;height:474px;}
.tren {width:360px;height:486px;}
.trun {width:360px;height:498px;}
.trde {width:360px;height:510px;}
.trtr {width:360px;height:522px;}
.trqu {width:360px;height:534px;}
.trci {width:360px;height:546px;}
.trsi {width:360px;height:558px;}
.trse {width:360px;height:570px;}
.trhu {width:360px;height:582px;}
.trne {width:360px;height:594px;}
.quar {width:360px;height:606px;}
#entier {
width : 70%;
}
#bandeaulien {font-size:75%}
#titrage {
font-size : 80%;
font-weight:bold;
padding:4px 0px 3px 0px;
}
#annonce {
font-size : 8px;
margin : 4px auto;
}
#speczero, #speczero2 {
font-size : 11px;
line-height:12px;
}
#conteneur {
width: 100%;
}
#global {
width:80%;
}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
#carte {
margin-top : 10px;
}
h1 {
font-size : 12px;
margin-top : -28px;
}
div.affich {
font-size: 9px;
}
}
@media all and (max-width:1367px) {
body {
font-size : 90%;
}
#entier {
width : 60%;
}
#bandeaulien {font-size:65%}
#titrage {
font-size : 80%;
font-weight:bold;
padding:4px 0px 3px 0px;
}
#annonce {
font-size : 8px;
margin : 4px auto;
}
#speczero, #speczero2 {
font-size : 12px;
line-height:13px;
}
#conteneur {
width: 100%;
}
#global {
width:100%;
}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
#carte {
margin-top : 10px;
}
h1 {
font-size : 12px;
margin-top : -28px;
}
div.affich {
font-size: 8px;
padding: 4px 0px 2px 0px;
}
}
@media all and (max-width:835px) {
#entier {
width : 660px;
}
#titrage {
font-size : 80%;font-weight:bold;width:90%;
}
#bandeaulien {font-size:70%}
#speczero, #speczero2 {
font-size : 10px;
line-height: 11px;
width:40%;
}
#annonce {
font-size : 8px;
	width:90%;
}
#runmap {width:75%}
#carte {margin-top: -4px;}
#global{width:70%;}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
h1 {
font-size : 13px;
margin-top : -8px;
}
}/*
@media screen and (max-width:720px) {
#entier {
width : 680px;
}
#bandeaulien {font-size:65%}
#titrage {
font-size : 75%;
width : 95.5%;
margin:6px auto;
}
#speczero, #speczero2 {
font-size : 10px;
line-height:14px
}
#conteneur {width:680px;}
#global {width:95%; height:540px;}
#carte {margin-top: 60px;}	
#annonce {
font-size : 7px;
margin-top : 0px;
line-height : 10px;
}
div.affich {font-size:9px}
h1 {font-size:11px}
}*/
@media all and (max-width:721px) {
#entier {
width : 600px;
}
#hautparleur {display:none}
#titrage {
font-size : 70%;font-weight:bold;width:90%;padding:2px 0px;
}
#bandeaulien {font-size:70%}
#speczero, #speczero2 {
font-size : 9px;
line-height: 10px;
width:40%;
}
#annonce {
font-size : 7px;
	width:90%;
}
#runmap {width:70%}
#carte {margin-top: 0px;}
#global{width:70%;}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
h1 {
font-size : 10px;
margin-top : -38px;
}
h1.communeecole {
width: 98%;
  color: white;
  background-color: rgba(125, 0, 125, 0.5);
  padding: 1px 0px 2px 0px;
  margin-left: 0px;
}
div.affich {font-size:6px;padding:3px}
h1 {font-size:10px}
}