body {
font-family : Arial, Helvetica, sans-serif;
/*background :linear-gradient(to top, #c2a2db, white);*/
font-size : 100%;
margin: 0;
/*padding-top:8px;*/
min-height: 100vh;
min-width: 100vw;
overflow-x: hidden;
background: url("imgs/fondpage-1920px-sdl-2026.png") top center no-repeat;
/*background-size:contain;*/
}
#bandeaulien {
background-color:transparent;
margin:0 auto;
text-align:center;
margin-bottom:4px;
}
#entier {
width : 960px;
margin : 0 auto;
/*width: 956px;*/
height:800px;
}
#titrage {
width : 100%;
text-align : center;
font-size : 120%;
font-weight : bold;
/*color : #041685;*/
color : #ffffff;
height : auto;
position : relative;
margin : 0 auto;
/*border : green solid 1px;*/
border-radius : 4px;
background-color :#2551b9c4;/*#b92578;#f7b08b; #ffc6a8;*/
/*background-color: rgba(238, 154, 45, 0.6);*/
padding: 6px 0px;
}
#speczero {
display : inline;
width : 79%;
font-size : 15px;
float : right;
line-height : 30px;
font-weight : bold;
color : green;
margin : 0 auto;
padding-top : 1px;
padding-left:4px;
padding-right:6px;
background-color : rgba(220, 220, 220, 0.3);
text-align : center;
/*border:8px rgba(125, 125, 125, 0.1) solid;*/
border-radius:6px;
}
#annonce {
width : 79%;
color : #999;
text-align : center;
line-height : 12px;
float : right;
font-size : 10px;
margin : 6px auto;
}
.annonceimg {
vertical-align : bottom;
padding-bottom : 0px;
padding-top:1px;
}
.annoncepoint {
vertical-align : bottom;
padding-bottom : 1px;
padding-top:1px;
}
#masquelycees, #masquecolleges, #masqueecoles, #spanlycees, #spancolleges, #spanecoles {
cursor : pointer;
}
#resinspe {
display : block;
width : 25%;
float : right;
text-align : right;
}
#resinspe a {text-decoration:none}
#resinspe a:hover{color:green}
#spaninspe {cursor:pointer;color:#ccc;text-decoration:none;}
#spaninspe:hover {color:green}
#menu {
width : 20%;
height : 740px;
float : left;
margin-top : -64px;
text-align : left;
}
.demar {color:green; font-weight:bold}
li{
list-style-type: none;
}
li:before{
content:"• ";
font-size:18px;
color: green;
margin-right:2px;
}
.firstli {list-style-type:none;}
.firstli:before{
content:"";
}
#etabsli {font-size:14px;margin-left:-10px;}
#etabslideux {font-size:12px;padding-left:4px;color:blue;font-weight:bold;}
#tab {border-right:1px darkgreen dashed;margin-left:-8px;margin-top:80px;line-height:30px;}
#tab span{text-decoration:none;cursor:pointer;}
#tab span:hover {font-weight:bold;color:green;}
.gray {color:gray;}
.green, .touslesprojets {font-weight:bold;color:green;}
.interlangue {font-weight:bold;color:#e34469;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
.creole {font-weight:bold;color:#6b86d8;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
.anglais {font-weight:bold;color:#ac2853;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
.allemand {font-weight:bold;color:#2daf47;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
.espagnol {font-weight:bold;color:#b37941;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
.chinois {font-weight:bold;color:#e303e6;background-color:white;border-radius:4px;padding: 4px 3px 4px 3px;}
@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');
}
.imgs {
width : 20px;
height : 17px;
}
#mask1, #mask2, #mask3 {opacity: 0.3;}
svg {overflow:visible;}
.text1 {
font-size : 1em;
font-weight : bold;
vertical-align: baseline;
}
#reseaux {
width: 70%;
height: 25px;
margin: 16px 50px 0px auto;
float: right;
}
#logo {
width : 20%;
float : left;
/*margin-top : -6px;*/
margin-left : 26px;
}
#logosdl {
width: 120px;
height: 70px;	
}
#logosdl2022 {
width: 120px;
height: 120px;
margin-left:26px;
margin-top:178px;	
}
#global {
margin : -4px auto 0 auto;
}
.masque {
display : none;
}
.affich {
display : inline;
}
div.affich {
display : inline;
float : left;
width : 28%;
margin : 4px 4px 4px 12px;
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);
}
div.affich:hover {
cursor:pointer;
color:red;
}
#runmap {
width : 90%;
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:0px;
}
#legende {
font-size : 10px;
width : 100px;
text-align : center;
position : absolute;
margin-top : -86px;
margin-left : 4px;
color : green;
line-height : 10px;
cursor : pointer;
}
#legende span:hover {
color:red;	
}
#legende p {
max-width : 100px;
margin : 6px 6px 6px 0;
line-height : 8px;
}
#legende2 {
font-size : 10px;
width : 135px;
text-align : left;
position : absolute;
margin-top : -27px;
margin-left : 6px;
color : green;
line-height : 10px;
cursor : pointer;
}
#legende2:hover {
color:red;	
}
#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;}
#copy {
opacity : 0.5;
font-size : 0.7em;
}
#conteneur {
float : left;
width: 79%;
max-height: 640px; /*560px*/
height:auto;
position : relative;
overflow-y: auto;
overflow-x: hidden;/*masquer la ligne*/
padding-top:7px;
margin-top:-7px;
}
#frameecoles, #frameprojets {
display: none;
float: right;
margin: 10px auto;
width: 100%;
height: auto;
position: relative;
}
#fermerlistedeux {
display : none;
font-size : 14px;
color : navy;
line-height : 30px;
cursor : pointer;
margin-bottom: -8px;
width : 100%;
float : left;
text-align : center;
}
#fermerlistedeux:hover {
color : red;
}
#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 {
color: white;
background-color: rgba(125, 0, 125, 0.5);
padding:0px 0px 2px 0px;
margin-top:8px;	
}
#pageecoles {
width:100%;
height:auto;
margin:-4px auto;
text-align:center;
overflow:visible;	
}
#pageecoles a {
text-decoration:none;	
}
.decomptetab {
width:58%;
margin: 0 90px;
}
.nbr {
font-size:12px;
margin-top:-2px;
}
.nbrecoles {
width:23%;
float:left;
position:relative;
text-align:left;
color:gray;
}
.nbrcolleges {
width:27%;
float:left;
position:relative;
text-align:right;
color:gray;
margin-left:-18px;
}
.nbrlycees {
width:39%;
float:left;
position:relative;
text-align:right;
color:gray;
}
@media all and (max-width:1024px) {
body{background-size:cover}
#bandeaulien {
font-size:90%;
}
#bandeaulien img {width:36px;}
#entier {
width : 800px;
}
#titrage {
font-size : 95%;
}
#reseaux {
margin: 16px 40px 0px auto;
}
ul li {
padding-bottom : 10px;
font-size : 75%;
line-height : 16px;
}
#etabsli {font-size:12px;font-weight:bold;}
#etabslideux {font-size:12px;margin-left:-6px;}
#speczero {
font-size : 14px;
}
#annonce {
font-size : 9px;
}
.annonceimg {
padding-bottom : 2px;
width : 11px;
height : 9px;
}
.annoncepoint {
padding-bottom : 2px;
width : 9px;
height : 9px;
}
#logosdl {
width : 120px;
height : 70px;
margin-top : 4px;
}
#logosdl2026 {
margin-top:-50px;
	width:120px;
}
.text1 {
font-size : 0.9em;
}
.imgs {
width: 17px;
height: 14px;
}
h1 {
font-size : 14px;
margin-top : -8px;
}
/*div.affich {
font-size: 90%;
line-height: 20px;
}*/
.decomptetab {
margin-top:2px;
}
}
@media all and (max-width:800px) {
body{background-size:cover}
#bandeaulien {
font-size:80%;
}
#bandeaulien img {width:30px;}
#entier {
width : 780px;
}
#titrage {
font-size : 75%;
font-weight:bold;
}
#reseaux {
margin: 10px 30px -8px auto;
}
ul li {
padding-bottom : 6px;
font-size : 70%;
line-height : 12px;
}
#etabsli {font-size:9px;}
#etabslideux {
font-size:9px;
margin-left:0px
}
#speczero {
font-size : 12px;
line-height: 24px;
}
#annonce {
font-size : 9px;
}
.annonceimg {
width : 9px;
height : 8px;
padding-bottom:2px;
}
.annoncepoint {
width : 8px;
height : 8px;
padding-bottom:2px;
}
#carte {margin-top: -2px;}
#logo {
margin-top : 18px;
margin-left : 28px;
}
#logosdl {
width : 96px;
height : 56px;
margin-top : 2px;
}
#logosdl2026 {
width : 96px;
height : 96px;
margin-left:0px;
margin-top: 4px;
}
.text1 {
font-size : 0.70em;vertical-align:middle;
}
.imgs {
width: 16px;
height: 13px;
}
#legende {
font-size : 8px;
width : 80px;
margin-top : -78px;
margin-left : 2px;
line-height : 9px;
}
#legende p {
width : 100%;
margin : 4px 4px 4px 0;
line-height : 9px;
}
#legende2 {
font-size : 8px;
width : 120px;
margin-top : -24px;
margin-left : 2px;
line-height : 9px;
}
#fermerliste {
font-size : 13px;
line-height : 26px;
padding-bottom : 2px;
}
#fermerliste img {
width: 10px;
height:10px;
}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
h1 {
font-size : 13px;
margin-top : -8px;
}
div.affich {
font-size: 10px;
}
.decomptetab {
margin-top:6px;
}
.nbr {
font-size:11px;
margin-top:-4px;
}
}
@media all and (max-width:720px) {
body{
background-size:cover;
}
#bandeaulien {
font-size:70%;
}
#bandeaulien img {width:30px;}
#entier {
width : 660px;
}
#titrage {
font-size : 75%;font-weight:bold;
}
#reseaux {
margin: 10px 30px -8px auto;
}
ul li {
padding-bottom : 6px;
font-size : 70%;
line-height : 12px;
}
#etabsli {font-size:9px;}
#etabslideux {font-size:9px;margin-left:0px}
#speczero {
font-size : 11px;
line-height: 20px;
}
#annonce {
font-size : 8px;
}
.annonceimg {
width : 9px;
height : 8px;
padding-bottom:2px;
}
.annoncepoint {
width : 8px;
height : 8px;
padding-bottom:2px;
}
#carte {margin-top: -2px;}
#logo {
margin-top : 18px;
margin-left : 28px;
}
#logosdl {
width : 96px;
height : 56px;
margin-top : 2px;
}
#logosdl2026 {
width : 96px;
height : 96px;
margin-left:0px;
margin-top: -66px;
}
#menu {
margin-top : -68px;
}
.text1 {
font-size : 0.70em;vertical-align:middle;
}
.imgs {
width: 16px;
height: 13px;
}
#legende {
font-size : 8px;
width : 80px;
margin-top : -78px;
margin-left : 2px;
line-height : 9px;
}
#legende p {
width : 100%;
margin : 4px 4px 4px 0;
line-height : 9px;
}
#legende2 {
font-size : 7px;
width : 120px;
margin-top : -24px;
margin-left : 2px;
line-height : 9px;
}
#fermerliste {
font-size : 13px;
line-height : 26px;
padding-bottom : 2px;
}
#fermerliste img {
width: 10px;
height:10px;
}
#bulles {margin-left:-40px;}
.overdiv {
border-radius : 4px;
font-size : 11px;
padding : 3px 6px 3px 6px;
}
h1 {
font-size : 13px;
margin-top : -8px;
}
.decomptetab {
width:58%;
margin-top:6px;
}
.nbr {
font-size:11px;
margin-top:-2px;
}
.nbrecoles {
width:23%;
float:left;
position:relative;
text-align:left;
color:gray;
}
.nbrcolleges {
width:27%;
float:left;
position:relative;
text-align:right;
color:gray;
margin-left:-18px;
}
.nbrlycees {
width:39%;
float:left;
position:relative;
text-align:right;
color:gray;
}
}
@media all and (max-width:640px) {
#entier {
width : 560px;
}
#titrage {
font-size : 11px;
width : 100%;
margin:6px auto;
}
.decomptetab {
width:58%;
margin-top:6px;
}
#speczero {
font-size : 10px;
}
#annonce {
font-size : 6px;
width : 82%;
margin-top : 0px;
line-height : 10px;
}
#menu {
margin-top : -69px;
}
ul li {
padding-bottom : 6px;
font-size : 60%;
line-height : 12px;
margin-left : -18px;
}
#etabsli {font-size:9px;}
#etabslideux {margin-left:-18px}
#logo {
margin-top : 18px;
margin-left : 22px;
}
#logosdl {
width : 84px;
height : 49px;
margin-top : 2px;
margin-left: -10px;
}
#logosdl2022 {
width : 80px;
height : 80px;
margin-top:116px;
margin-left:12px;
}
.text1 {
font-size : 0.70em;
margin-top:-3px;
}
.imgs {
width: 15px;
height: 12px;
}
#legende {
font-size : 7px;
width : 70px;
margin-top : -70px;
margin-left : 4px;
line-height : 8px;
}
#legende p {
max-width : 70px;
margin : 4px 4px 4px 0;
line-height : 8px;
}
#legende2 {
font-size : 7px;
width : 100px;
margin-top : -23px;
margin-left : 6px;
line-height : 8px;
}
#fermerliste {
font-size : 12px;
line-height : 24px;
padding-bottom : 0px;
}
.nbr {
font-size:10px;
margin-top:-4px;
}
div.affich {font-size:9px}
h1 {font-size:11px}
}