body {
background: radial-gradient(#e4e4fb 33%, #0000DCB8 112%);
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
margin:0px;
}

a:hover {
cursor: pointer;
}


.textegris, .intro, .menu, .textbio, .titreexpo {
color:#0000DC;
}

.intro, .textbio, .titreexpo {
font-family: Times, "Times New Roman", "serif";
font-size: 20;
/*text-shadow: 0px 0px 25px white;*/
}

.sstitre_projet {
background-color:#00ff00;
font-size:20;
}

.menu-titre, .menu-date, .sstitre_projet, .toggleSubMenu {
  font-family: SimplonNormMedium, Helvetica, Arial, sans-serif;
}

.lien_surligne {
background-color:#00ff00;
}


/* MENU */

.menu-titre {
font-size:18;
text-decoration: underline;
text-decoration-thickness: 3px;
text-underline-offset: 6px;
}

.gd_titre {
text-decoration: underline;
text-decoration-thickness: 3px;
text-underline-offset: 8px;
}

.menu-projet, .subMenu {
font-family: Times, "Times New Roman", "serif";
font-size: 15;
}

.menu-date {
margin-left:-10;
}

.lien_extern {
background-color:#00ff00;
}

@media all and (min-width: 1200px){
.menu {
display: block;
position: fixed;
left:30;
bottom: 10;
  width: 200;
}
}

@media all and (max-width: 1200px) {
.menu-titre, .menu-projet, .subMenu, .menu-date, .toggleSubMenu {
font-size: 30;
}
  .menu {
    width: 500;
  }
}

/* SON */


.audiojs {
  width: 38px;
  height: 38px;
  background: #0000DC;
  border-radius: 10px;
  }

.player_son {
position: fixed;
bottom:0;
background-color:#0000DC;
bottom:0;
right:0;
color:white;
text-align: right;
}

.texte_player {
font-size:11pt;
}

@media all and (max-width: 1100px) {
.player_son {
bottom:70;
left:30;
width:140;
background:none;
text-align: left;
color:#0000DC;
}
.texte_player {
font-size:10pt;
}
}


/* RESPONSIVE */


@media all and (max-width: 1100px) {
.intro, .sstitre_projet {
font-size: 30;
}
.textegris, .lien_extern {
font-size: 18;
}
}

@media all and (min-width: 100px) {
.responsive {
  width: 800px;
}



@media all and (min-width: 1200px) {
.responsive {
  width: 1000px;
}
}




@media all and (min-width: 1600px) {
.responsive {
  width: 1100px;
}

}

/*
@media all and (min-width: 1300px){
.responsive {
  width: 1050px;
}
}



/*
@media all and (min-width: 1650px){
.menu {
display: block;
position: fixed;
right:30;
top:200;
}
}

MENU

ul {
list-style-type: none;
padding:0;
}

.toggleSubMenu {
margin-bottom:5;
}

.subMenu{
margin-top:5;
margin-bottom:10;
}

.trigger:hover {
cursor: pointer;
}