

/*

    M: margin
    B: border
    P: padding


                                  corps 960px                                                                  
    <------------------------------------------------------------------------->
    | 10px                header front_content 940px                     10px |
    |MMM<----------------------------------------------------------------->MMM|                                                                                          
    |   |                                                                 |   |
    |   <----------------------------------------------------------------->   |
    |                                                                         |
    | 10 1 10px         display_block               10px 1px            220px |
    |MMM|B|PPP<------------------------------------->PPP|B|MMMMMMMMMMMMMMMMMMM| 
    |   |B|PPP            <-> 708px                  PPP|B|MMMMMMMMMMMMMMMMMMM|
    |   |B|PPP                                       PPP|B|MMMMMMMMMMMMMMMMMMM|
    |   |B|PPP                                       PPP|B|MMMMMMMMMMMMMMMMMMM|
*/





/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* by Tag */

body { 
    background: rgb(0,0,0) url("themes/u2/images/bg_texture.jpg") repeat-x top center;
    background-attachment: fixed;
    color: rgb(215,215,215); /* texte */
    text-align: center; /*pour IE 5 centrer design */

}


/* Pour IE 5 definition d'une balise corps */
#corps {
    margin: auto; /* Pour centrer notre page */
    font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Bitstream Vera Sans", sans-serif;
    font-size: 13px;
    letter-spacing: 1px;
    font-weight: 300;
    font-style: normal;
    width: 960px;
    margin: 0 auto;
    padding: 0 0 40px 0;
    text-align: left; /*pour IE 5 centrer design */  
}
    
    
a {
    color: #65d8d8;
    text-decoration: none;
    outline: none; 
}

a:hover, a:focus {
    color: yellow;
    text-shadow: 0 3px 5px rgb(0,0,0);    
}

h1, h2, h3, h4 {
    color: rgb(240,240,240);
    margin: 10px 0;
    text-shadow: 0 2px 3px rgb(0,0,0);
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Miso Bold", "Arial Narrow", Impact, "Bitstream Vera Sans", sans-serif;
    font-weight: bold;
}

h1 a, h2 a, h3 a, h1 a:hover, h2 a:hover, h3 a:hover, h1 a:focus, h2 a:focus, h3 a:focus { 
    color: #fff;
    text-decoration: none;
}

h1 {
    font-size: 200%;
}

h2 {
    font-size: 180%;
}

h3 {
    font-size: 160%;
}

h4 {
    font-size: 140%;
}

h5 {
    font-size: 130%;
}

h6 {
    font-size: 110%;
}

li {
    margin: 10px 0;
}

hr {
    background: transparent;
    color: #000;
    border: 1px solid rgb(0,0,0);
    border-color: rgb(0,0,0);
    border-style: none none solid none;
    height: 0;
    clear: both;
    display: block;
    margin: 0 10px 20px 10px;
}

em, i {
    font-style: italic;
}

strong, b {
    font-weight: bold;
}

img {
    border: none;
    outline: none;
    vertical-align: middle;
}

p {
    text-align: justify;    
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#shell {
    padding-top: 1px;
    text-align: center;
}


#header {
    background: transparent url(themes/u2/images/topnav.png) no-repeat 0 0;
    overflow: hidden;
    margin: 40px 10px 0 10px;
    padding: 0;
    width: 940px;
}
#header a {
    border: none;
    outline: none;
}
#header h1 {
    background: transparent;
    color: rgb(230,230,230);
    float: left;
    display: inline;
    width: 320px;
    height: 60px;
    margin: 0;
    padding: 0;
}
#header h1 a {
    background: transparent url(themes/u2/images/topnav.png) no-repeat 0 -120px;
    display: block;
    width: 320px;
    height: 60px;
    margin: 0;
    padding: 0;
}
#header h1 a:hover, #header h1 a:focus {
    background: transparent url(themes/u2/images/topnav.png) no-repeat 0 -120px;
    text-decoration: none;
}
#header h2 {
    float: left;
    display: inline;
    width: 390px;
    height: 60px;
    margin: 0;
    padding: 0;
}
#topnav {
    background: transparent;
    float: right;
    display: inline;
    width: 280px;
    height: 60px;
    margin: 0;
    padding: 0;
}
#topnav li {
    float: left;
    display: inline;
    height: 60px;
    margin: 0;
    padding: 0;
}
#topnav a {
    background: transparent url(themes/u2/images/topnav.png) no-repeat 0 -60px;
    display: block;
    width: 280px;
    height: 60px;
    margin: 0;
    padding: 0;
}

/* topnav static/hover/focus settings */

#topnav #tn_accueil a {
    background-position: -660px -60px;
    width: 93px;
}
#topnav #tn_membre a {
    background-position: -753px -60px;
    width: 89px;
}
#topnav #tn_contact a {
    background-position: -842px -60px;
    width: 98px;
}

#topnav #tn_accueil a:hover, #topnav #tn_accueil a:focus {
    background-position: -660px -120px;
}
#topnav #tn_membre a:hover, #topnav #tn_membre a:focus {
    background-position: -753px -120px;
}
#topnav #tn_contact a:hover, #topnav #tn_contact a:focus {
    background-position: -842px -120px;
}

/* front_content static/hover/focus settings */
#front_content {
    background: url(themes/u2/images/front_cadre.png) no-repeat 0 0px;
    overflow: hidden;
    width: 940px;
    height: 300px;
    margin: 40px 10px 0 10px;
    padding: 2px 2px 2px 2px;
}

#front_content img.front_image {
    /*position: relative;*/
    overflow: hidden;
    width: 936px;
    height: 296px;
    top: 0;
    left: 0;
}




#menu, .display_block, #loopedSlider, #evenement_block  div, #gallery, .album, #footer
{
    background: transparent url(themes/u2/images/8x8_30p.png) repeat 0 0;
    /*width: 708px;*/
    margin: 20px 10px 0 10px;
    padding: 10px;    
    border: 1px solid rgb(21,20,20);    

    margin-right:220px; /* propriete a modifier à left pour changer de cote le menu*/
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}



/* menu static/hover/focus settings */
#menu {
    width: 170px;
    float: right;    /* propriete a modifier à left pour changer de cote*/
    margin-right:10px; /* propriete a modifier à left pour changer de cote le menu*/
}


/*http://www.veryicon.com*/
#menu .icone
{
    -moz-border-radius:5px 5px 5px 5px;
    background:url(themes/u2/icones/icon_menu_sprites.png) no-repeat scroll left top transparent;

    float:left;
    display:block;
    margin-right:10px;
    height:24px;
    width:24px;
}



#menu .icone-home { background-position: left top; }
#menu .icone-calendar { background-position: 10% top; }
#menu .icone-presse { background-position: 20% top; }
#menu .icone-mp3 { background-position: 30% top; }
#menu .icone-photo { background-position: 40% top; }
#menu .icone-web { background-position: 50% top; }
#menu .icone-email { background-position: 60% top; }
#menu .icone-admin { background-position: 70% top; }
#menu .icone-user { background-position: 80% top; }
#menu .icone-logout { background-position: 90% top; }
#menu .icone-podcast { background-position: right top; }





#menu_selected .icone-home, #menu li:hover .icone.icone-home { background-position: left bottom; }
#menu_selected .icone-calendar, #menu li:hover .icone.icone-calendar { background-position: 10% bottom; }
#menu_selected .icone-presse, #menu li:hover .icone.icone-presse { background-position: 20% bottom; }
#menu_selected .icone-mp3, #menu li:hover .icone.icone-mp3 { background-position: 30% bottom; }
#menu_selected .icone-photo, #menu li:hover .icone.icone-photo { background-position: 40% bottom; }
#menu_selected .icone-web, #menu li:hover .icone.icone-web { background-position: 50% bottom; }
#menu_selected .icone-email, #menu li:hover .icone.icone-email { background-position: 60% bottom; }
#menu_selected .icone-admin, #menu li:hover .icone.icone-admin { background-position: 70% bottom; }
#menu_selected .icone-user, #menu li:hover .icone.icone-user { background-position: 80% bottom; }
#menu_selected .icone-logout, #menu li:hover .icone.icone-logout { background-position: 90% bottom; }
#menu_selected .icone-podcast, #menu li:hover .icone.icone-podcast { background-position: right bottom; }





#menu h4 {
    margin: 2px 0px 0px 5px;
}
#menu ul
{
    margin: 5px 0;
    padding: 5px 0;
    list-style-type: none;
    
 
}

#menu ul li 
{
    margin: 2px;
    padding: 2px 0 2px 10px; 
    /*background-color:rgb(250, 250, 250); */ 
    /*border-bottom:1px solid #DDDDDD;*/
    -moz-border-radius:5px 5px 5px 5px;
}


#menu a 
{
    display:block;
    font-weight:normal;
    overflow:hidden;
    padding:5px 0 5px 5px;
    color: #84afff;
    color: #96BD0D;
    /*color: #4e9a06;*/
    text-decoration: none;
    outline: none; 
}


#menu li:hover, #menu li:focus
{
    background: transparent url(themes/u2/images/8x8_30p.png) repeat 0 0;
}


#menu li:hover a, #menu li:focus a, #menu_selected a
{
    color: white;
    text-shadow: 0 3px 5px #AAAAAA; 
    font-style:normal;
     
}


/* IE ne reconnaissant pas le sélecteur ">"  
html>body #menu li#menu_selected 
{
    list-style-image: url(themes/u2/icones/arrowr.png);
    margin-left: 25px;
    padding-left: 0px;
}
*/

#menu li#menu_selected 
{
    background: url(themes/u2/icones/arrowr.png) no-repeat;
    background-position:left center; 
    margin-left: 5px;
    padding-left: 20px;

}



/* slide settings */
#loopedSlider{
overflow:hidden;
position:relative; 
cursor:pointer;
}    


.visioContainer { 
    width:705px;
    height:180px;
    overflow:hidden;
    position:relative;
    cursor:pointer;
    outline: none;
}

.slides {
    position:absolute;
    top:0;
    left:0;
}

.slides div {
    width:705px;
    display:none;
}


.visionneuseEvt .previous, .visionneuseEvt .next {
    background-image: url(themes/u2/icones/icon_navigation.png);
    width: 23px;
    height: 23px;
    display: inline;
    text-decoration: none !important;
    background-repeat: no-repeat;
    position: absolute;
    top : 5px;
    border: none; 
    outline: none;
}







.visionneuseEvt .previous {
  background-position: 0px 0px;
  right: 40px;
}


.visionneuseEvt .next {
  background-position: -23px 0px;
  right: 15px;
}


.visionneuseEvt h3 {
  color : #96bd0d; 
}

.visionneuseEvt a{
  outline: none; 
}


.visionneuseEvt p {
  color : #cfcffc;
}


.visionneuseEvt .imgGauche {padding-left:150px; text-align:left; width: 555px;} 
.visionneuseEvt .imgGauche img {position:absolute; left:0; height: 180px; width:128px;}


.visionneuseEvt .imgDroite{padding-right:150px; text-align:left; width: 555px;} 
.visionneuseEvt .imgDroite img {position:absolute; right:0; height: 180px; width:128px;}


/*
 * Optional

#loopedSlider{ margin:0 auto; width:500px; position:relative; clear:both; }
ul.pagination { list-style:none; padding:0; margin:0; }
ul.pagination li  { float:left; }
ul.pagination li a { padding:2px 4px; }
ul.pagination li.active a { background:blue; color:white; }
*/



#evenement_block h3 {
  color : #96bd0d; 
}

#evenement_block a{
  outline: none; 
}


#evenement_block p {
  color : #cfcffc;
}

#evenement_block .agenda_yes {
    background-image: url(themes/u2/icones/agenda.gif);
    background-repeat: no-repeat;
    float: left; height: 35px; width:35px;
    margin-right: 10px;
    margin-top: 5px;
}

#evenement_block .agenda_no {
    background-image: url(themes/u2/icones/agenda_no.gif);
    background-repeat: no-repeat;
    float: left; height: 35px; width:35px;
    margin-right: 10px;
    margin-top: 5px;
}



#evenement_block .icone_journal {
    background-image: url(themes/u2/icones/journal.gif);
    float: right; height: 50px; width: 50px;
    -webkit-background-size: 100% 100%; 
    -o-background-size: 100% 100%; 
    -moz-background-size: 100% 100%; 
}


#evenement_block im {
    max-width:700px;}
}




/*.album {clear: both;}*/
.album em{font-size: 75%;}
.album p  {margin-left: 180px; text-align:left;} 
.album .vignette {position: absolute; height: 150px; width:150px;}
.album .player {margin-left: 460px; width: 240px; height: 200px;}

.album .icone_media{
    background-image: url(themes/u2/icones/play.png);    
    float: right; height: 50px; width:50px;
    -webkit-background-size: 100% 100%; 
    -o-background-size: 100% 100%; 
    -moz-background-size: 100% 100%; 
}




/* styles for current page */
#footer {
    padding: 0;
    margin: 20px 10px;
}

#footer a {
    font-weight: normal;
}
#footer p {
    color: rgb(150,150,150);
    letter-spacing: 1px;
    font-size: 10px;
    font-family: Verdana;
    margin: 10px 0;
    text-align: center; 
}


/* styles for current page */
.pagination {
    text-align: center; 
}

.pagination a {
    font-weight: normal;
}

.login_page .message{
    font-size: 90%;
}

.login_page .icone_erreur{
    background-image: url(themes/u2/icones/erreur.gif);
    background-repeat: no-repeat;
    float: left; height: 30px; width:30px;
    margin-right: 10px;
    margin-top: 0px;
}

.login_page .icone_cadena{
    background-image: url(themes/u2/icones/cadena.gif);
    background-repeat: no-repeat;
    float: left; height: 60px; width:60px;
    margin-right: 10px;
    margin-top: 0px;
}

.login_page .col1, .login_page  .col4{
    width: 20%;
}

.login_page .col2, .login_page .col3{
    width: 30%;
}







#liens .display_block hr
{
    width: 80%;
    align: left;    
    color: rgb(215,215,215);
}

.lien h4 {
  color : #96bd0d; 
}


#liens .ligne
{
    background-image: url(themes/u2/images/ligne.gif);
    background-repeat: no-repeat;
    width: 90%;
}


#presse h3 {
  color : #96bd0d; 
}

#presse .journal
{
    TEXT-DECORATION: underline;
}

#presse  .date
{
    font-style: italic;
}

#presse .icone_evenement {
    background-image: url(themes/u2/icones/calendrier.png);
    float: right; height: 50px; width: 50px;
    -webkit-background-size: 100% 100%; 
    -o-background-size: 100% 100%; 
    -moz-background-size: 100% 100%; 
}


#presse img {
    max-width:700px;
    margin: auto;
}

.google_map
{
    margin:20px 0px;
    text-align: center;
}
