.infobulle {
  padding: 6px;
  border: 1px solid black;
  font-family: Verdana, Arial;
  font-size: 14px;
  visibility: hidden;
  position: absolute;
  background-color: rgb(105, 255, 204);	
  z-index: 2000;
 }
  
#ima {	
  position:absolute;
  top: 0px;
  left: 0px;
  background: url("plani_200.jpg") no-repeat ;
  width:2200 ;
  hight:1200; 
  scroll:no	;
 }	   
 
#menu_gene {
	position: absolute;
	width : 300px;
	height: 32px;
	left: 204px;
	top: 100px;
	border: 0px dotted white; 
	}		  
			
#all_photonum {
		position: absolute;
        left: 680px;
        top: 60px;
        width: 520px;
		height: 520px;
        z-index: 11;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}	
#all_numphoto {
		position: absolute;
        left: 680px;
        top: 60px;
        width: 520px;
		height: 520px;
        z-index: 12;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}	
			
 #mess_index2  {
		position: absolute;
        left: 680px;
        top: 60px;
        width: 400px;
		height: 200x;
        z-index: 13;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}	
			
  #mess_help  {
		position: absolute;
        left: 680px;
        top: 110px;
        width: 700px;
		height: 400x;
        z-index: 14;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}	
			
 #mess_help2  {
		position: absolute;
        left: 680px;
        top: 110px;
        width: 700px;
		height: 300x;
        z-index: 15;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}	
    
    
    #mess_help0  {
		position: absolute;
        left: 680px;
        top: 110px;
        width: 575px;
		height: 400x;
        z-index: 16;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}
    
     #mess_help_zik {
		position: absolute;
        left: 460px;
        top: 110px;
        width: 575px;
		height: 400x;
        z-index: 18;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}
    
     #mess_appel_list {
		position: absolute;
        left: 540px;
        top: 1px;
        width: 318px;
		height: 110x;
        z-index: 18;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}    

     #mess_aleat {
		position: absolute;
        left: 680px;
        top: 100px;
        width: 600px;
		height: 472x;
        z-index: 18;	 
        color: #c8ddda;
        background-color: #242424; 
        visibility: hidden;
        border: solid 2px #222;
        filter:alpha(opacity=100);
        -moz-opacity:1.00;
        opacity: 1.00;
        font-weight: bold;
        text-align: center;
        font-family: Courier, "Courier New", monospace;	
		border: 0px dotted white;
	}    
 
  
 
 //************ SCREEN ***************//
 
 BODY {
	MARGIN-TOP: 25px; FONT-WEIGHT: bold; FONT-SIZE: 10pt; MARGIN-LEFT: 0px; COLOR: #ffffff; MARGIN-RIGHT: 0px; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; BACKGROUND-COLOR: #000000
}
TD {
	FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
P {
	FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif
}
A {
	COLOR: #ffffff; TEXT-DECORATION: none
}
A:link {
	COLOR: #ffffff; TEXT-DECORATION: none
}
A:visited {
	COLOR: #ffffff; TEXT-DECORATION: none
}
A:active {
	COLOR: #ffffff
}
A:hover {
	COLOR: #e91414
}
.title {
	PADDING-RIGHT: 2px; MARGIN-TOP: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; WIDTH: 100%; LINE-HEIGHT: 140%; PADDING-TOP: 2px
}
.title A {
	FONT-WEIGHT: bold; FONT-SIZE: x-small; COLOR: #ffffff; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; TEXT-DECORATION: none
}
.title A:link {
	FONT-WEIGHT: bold; FONT-SIZE: x-small; COLOR: #ffffff; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; TEXT-DECORATION: none
}
.title A:visited {
	FONT-WEIGHT: bold; FONT-SIZE: x-small; COLOR: #ffffff; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; TEXT-DECORATION: none
}
.title A:active {
	FONT-WEIGHT: bold; FONT-SIZE: x-small; COLOR: #ffffff; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; TEXT-DECORATION: none
}
.title A:hover {
	COLOR: #e91414
}
.mod_title {
	BACKGROUND-IMAGE: url(../images/mod_titlebar.jpg); WIDTH: 100%; HEIGHT: 28px
}
.mod_title_bg {
	
}
.mod_title_right {
	
}
.mod_title_left {
	
}
.albumdesc {
	BORDER-RIGHT: #000000 0px dashed; PADDING-RIGHT: 2px; BORDER-TOP: #000000 0px dashed; MARGIN-TOP: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; FONT-SIZE: x-small; PADDING-BOTTOM: 2px; BORDER-LEFT: #000000 0px dashed; COLOR: #ffffff; LINE-HEIGHT: 140%; PADDING-TOP: 2px; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; BACKGROUND-COLOR: #363636
}
.desc {
	PADDING-RIGHT: 2px; MARGIN-TOP: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; FONT-SIZE: x-small; PADDING-BOTTOM: 2px; COLOR: #ffffff; LINE-HEIGHT: 140%; PADDING-TOP: 2px; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em
}
.caption {
	FONT-SIZE: 10px
}
.modcaption {
	BORDER-RIGHT: #000000 0px dashed; PADDING-RIGHT: 2px; BORDER-TOP: #000000 0px dashed; MARGIN-TOP: 2px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; FONT-SIZE: 10px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000000 0px dashed; COLOR: #ffffff; LINE-HEIGHT: 140%; PADDING-TOP: 2px; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; BACKGROUND-COLOR: #363636
}
.error {
	FONT-SIZE: 12px; COLOR: red
}
.attention {
	
}
.headbox {
	
}
.head {
	BORDER-RIGHT: #000000 0px dashed; BORDER-TOP: #000000 0px dashed; FONT-WEIGHT: bold; FONT-SIZE: 16px; BACKGROUND-IMAGE: url(../images/mod_titlebar.jpg); BORDER-LEFT: #000000 0px dashed; COLOR: #ffffff; LINE-HEIGHT: 140%; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; HEIGHT: 28px
}
.head A {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.head A:link {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.head A:visited {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.head A:active {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.head A:hover {
	FONT-WEIGHT: normal; COLOR: #e91414; TEXT-DECORATION: underline
}
.mod_headliner {
	BACKGROUND-IMAGE: url(../images/mod_titlebar.jpg); WIDTH: 100%; HEIGHT: 28px
}
.mod_toplight_bg {
	
}
.mod_toplight_right {
	
}
.mod_toplight_left {
	
}
.bread {
	FONT-SIZE: 10px
}
.bordertop {
	
}
.borderright {
	
}
.borderleft {
	
}
.fineprint {
	FONT-SIZE: 10px
}
.popupbody {
	PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; COLOR: #ffffff; PADDING-TOP: 10px
}
.popuphead {
	FONT-WEIGHT: bold; FONT-SIZE: 16px; BACKGROUND-IMAGE: url(../images/mod_titlebar.jpg); COLOR: #ffffff
}
.popup {
	FONT-WEIGHT: bold; FONT-SIZE: 12px; COLOR: #ffffff; BACKGROUND-COLOR: #363636
}
.editlink {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.editlink A {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.editlink A:link {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.editlink A:visited {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.editlink A:active {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.editlink A:hover {
	COLOR: #e91414
}
.modnavbox {
	BORDER-RIGHT: #000000 0px dashed; BORDER-TOP: #000000 0px dashed; FONT-WEIGHT: bold; FONT-SIZE: 12px; BACKGROUND-IMAGE: url(../images/mod_navbar.jpg); BORDER-LEFT: #000000 0px dashed; WIDTH: 100%; COLOR: #ffffff; LINE-HEIGHT: 140%; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.2em; HEIGHT: 14px
}
.modnavbox A {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavbox A:link {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavbox A:visited {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavbox A:active {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavbox A:hover {
	FONT-WEIGHT: normal; COLOR: #e91414; TEXT-DECORATION: underline
}
.admin {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff ; 
}
.adminform {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #000000 ; background: #00FFFF ; //#FAEA73 ; 
}
.adminform_2 {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #000000 ; background: #FDF2E9 ; height: 18px ;
}
.adminform_3 {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #000000 ; background: #54F98D ; //E8F8F5
}
.adminform_4 {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #000000 ; background: #E8F8F5 ;
}
.adminform_6 {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #000000 ; background: #80B7B5 ;
}
.adminform_10 {
	FONT-WEIGHT: bold; FONT-SIZE: 17px; COLOR: #F0000 ; background: #FDF2E9 ;
}
.search {
	FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #ffffff
}
.leftspacer {
	WIDTH: 50px
}
.modnavboxtop {
	BORDER-RIGHT: #000000 0px dashed; BORDER-TOP: #000000 0px dashed; FONT-WEIGHT: bold; FONT-SIZE: 10px; BORDER-LEFT: #000000 0px dashed; WIDTH: 100%; COLOR: #ffffff; LINE-HEIGHT: 140%; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; LETTER-SPACING: 0.1em; BACKGROUND-COLOR: #000000
}
.modnavboxtop A {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxtop A:link {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxtop A:visited {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxtop A:active {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxtop A:hover {
	FONT-WEIGHT: normal; COLOR: #e91414; TEXT-DECORATION: none
}
.modnavboxmid {
	BORDER-RIGHT: #000000 0px dashed; BORDER-TOP: #000000 0px dashed; FONT-WEIGHT: bold; FONT-SIZE: 10px; BORDER-LEFT: #000000 0px dashed; WIDTH: 100%; COLOR: #ffffff; LINE-HEIGHT: 140%; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; BACKGROUND-COLOR: #363636
}
.modnavboxmid A {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxmid A:link {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxmid A:visited {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxmid A:active {
	FONT-WEIGHT: normal; COLOR: #ffffff; TEXT-DECORATION: none
}
.modnavboxmid A:hover {
	FONT-WEIGHT: normal; COLOR: #e91414; TEXT-DECORATION: underline
}
.modfooter {
	BORDER-RIGHT: #000000 0px dashed; PADDING-RIGHT: 2px; BORDER-TOP: #000000 0px dashed; PADDING-LEFT: 2px; FONT-WEIGHT: normal; FONT-SIZE: 8px; PADDING-BOTTOM: 2px; BORDER-LEFT: #000000 0px dashed; WIDTH: 100%; COLOR: #ffffff; LINE-HEIGHT: 140%; PADDING-TOP: 2px; BORDER-BOTTOM: #000000 0px dashed; FONT-FAMILY: verdana, arial, sans-serif; BACKGROUND-COLOR: #000000
}
.modfooter A {
	COLOR: #ffffff; TEXT-DECORATION: none
}
.modfooter A:link {
	COLOR: #ffffff; TEXT-DECORATION: none
}
.modfooter A:visited {
	COLOR: #ffffff; TEXT-DECORATION: none
}
.modfooter A:active {
	COLOR: #ffffff; TEXT-DECORATION: none
}
.modfooter A:hover {
	COLOR: #e91414; TEXT-DECORATION: none
}
.pview {
	PADDING-RIGHT: 7px; PADDING-LEFT: 7px; PADDING-BOTTOM: 7px; MARGIN: 7px; PADDING-TOP: 7px
}
.pcaption {
	PADDING-RIGHT: 2px; MARGIN-TOP: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px
}
.vatable {
	WIDTH: 100%
}
.vathumbs {
	MARGIN: 17px
}
.vafloat {
	FLOAT: none
}
.vafloat2 {
	FLOAT: none
}
.vasummary {
	PADDING-RIGHT: 2px; MARGIN-TOP: 10px; PADDING-LEFT: 2px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; WIDTH: 80%; PADDING-TOP: 2px
}

.ma_couleur_1 {
  background-color: teal;
  color: white;
}

.ma_couleur_2 {
  background-color: #FFE4E1;
  color: black;
}

.player {
          height: 0vh;   // 95 en vo
          display: flex;
          align-items: left;     // center en vo
          flex-direction: lign;    // column   en vo
          justify-content: left; // enter en vo
        }
      
        .now-playing {
          font-size: 0.9rem;  // av 1
        }
        
        .track-artist {
          font-size: 0.9rem ;  //  av   1.5 rem
        }  
                   
        .buttons {
          display: flex;
          flex-direction: row;
          align-items: center;
        }

        .ppindexe-track,        
        .playpause-track,
        .playstop-track,       
        .prev-track,
        .next-track, 
        .mess-track,
        .now-playing 
        {
          padding: 0px;  // ald 25
          opacity: 0.8;
        
          /* Smoothly transition the opacity */
          transition: opacity .2s;
        }

        .ppindexe-track:hover,        
        .playpause-track:hover,
        .playstop-track:hover,
        .prev-track:hover,
        .next-track:hover {
          opacity: 1.0;
        }
        
         .liste_piste_container {
          width: 45%;        // 75
          max-width: 50%;  //  400px en vo   AAAAAAAA
          display: flex;
          justify-content: left;   // center en vo
          align-items: left;   // center en vo         
        }   
                  
        .slider_container {
          width: 98%;        // 75
          max-width: 100%;  //  400px en vo   AAAAAAAA
          display: flex;
          justify-content: left;   // center en vo
          align-items: left;   // center en vo         
        }
       
        /* Modify the appearance of the slider */
        .liste_piste_slider,
        .seek_slider,
        .volume_slider {
          -webkit-appearance: none;
          -moz-appearance: none;
          appearance: none;
          height: 3px;       //   5 en vo
          background: blue;  // black en vo
          opacity: 0.7;
          -webkit-transition: .2s;
          transition: opacity .2s;
        }
        
        /* Modify the appearance of the slider thumb */
        .liste_piste_slider::-webkit-slider-thumb,
        .seek_slider::-webkit-slider-thumb,
        .volume_slider::-webkit-slider-thumb {
          -webkit-appearance: none;
          -moz-appearance: none;
          appearance: none;
          width: 10px; 
          height: 10px;    
          background: blue;  // white en vo
          cursor: pointer;
          border-radius: 2%;
        }
        
        .liste_piste_slider:hover,
        .seek_slider:hover,
        .volume_slider:hover {
          opacity: 1.0;
        }
        .current-piste,
        .total-piste {
          padding: 0px;  // 10 en vo
        }
        
        .liste_piste_slider {
          width: 42%;  // 60
        }
        .seek_slider {
          width: 12%;  // 60
        }        
        .volume_slider {
          width: 10%;   // 30
        }
        
        .current-time,
        .total-duration {
          padding: 0px;  // 10 en vo
        }
        
        i.fa-volume-down,
        i.fa-volume-up {
          padding: 1px;   
        }
        
        i.fa-play-circle,
        i.fa-pause-circle,
        i.fa-step-forward,
        i.fa-step-backward {
          cursor: pointer;
        }
        






#adminbox {
	
}
#adminbox TD {
	BACKGROUND-COLOR: #363636
}