﻿/* theme.css pour site zen  */
/* réalisation www.depaninfo70.com */
/*-------------------------------------------------------*/

/* le body */

body {
background-image:url("images/vaguefoot2.gif");
background-repeat: no-repeat;
background-position:bottom right;
font-family:Georgia, serif;
background-color: #fff;
}

/* le conteneur principal */

#container {
width: 95%;
margin: 10px auto;

color: #333;
line-height: 130%;
background-image:url("images/vagueverticale.gif");
background-repeat: no-repeat;
background-position:bottom left;
}

/*-------------------------------------------------------*/
/* le header */

#top {
padding: .5em;
height:220px;
}

#header {
width:49%;
height:200px;
background-image: url("images/vagueverte.gif");
background-repeat: no-repeat;
float:left;
}

#header2 {
width:49%;
height:200px;
background-image: url("images/vaguebleue.png");
background-repeat: no-repeat;
background-position: top right;
float:right;
}

#logo {
position:absolute;
width:300px;
height:206px;
background-image:url("images/logotranspetit.gif");
background-repeat: no-repeat;
top:30px;
left:50px;
}

/* le caillou dans le header */

#footimage {
position:absolute;
top:20px;
left:70%;
width:300px;
height:151px;
background-image:url("images/footimage.gif");
background-repeat: no-repeat;
}

/*-------------------------------------------------------*/
/* les cases de gauche */

#leftnav {
float: left;
width: 120px;
margin: 0;
padding: 1em;
}

/* la phrase du jour */

#phrasedujour {
width:112px;
text-align:center;
font-size: 0.8em;
border: 1px solid #aedb2b;
margin-bottom: 10px;
margin-top: -15px;
padding :4px;
-moz-border-radius: 15px;
  border-radius: 15px;
}

#phrasedujour h2 {
font-size:125%;
}
.barreverte {
border-bottom:4px #aedb2b solid;
padding-bottom:5px;
}

/* La case infos légales */

#infos {
width:120px;
border: 1px solid #aedb2b;
font-size: 0.8em;
text-align:center;
-moz-border-radius: 15px;
  border-radius: 15px;
}

#infos h2 {
font-size:125%;
}

/*-------------------------------------------------------*/
/* la case de droite */

#rightnav {
float: right;
width: 120px;
margin: 0;
padding: 1em;
}

/* la colonne de droite */

#droite {
width:120px;
text-align:center;
font-size: 0.8em;
border: 1px solid #aedb2b;
margin-top: -15px;
-moz-border-radius: 15px;
  border-radius: 15px;
}

#droite h2 {
font-size:125%;
}

#droite h3 {
font-size:100%;
}

/*-------------------------------------------------------*/
/* le contenu central */

#content {
margin-left: 150px;
margin-right: 150px;
padding: 1em;
text-align:justify;
border: 1px solid #aedb2b;
padding:2%;
-moz-border-radius: 15px;
border-radius: 15px;
font-family:Georgia, serif;
background-image:url("images/fleur.gif");
background-repeat: no-repeat;
background-position:bottom left; 
}

#content ul {
text-align:left;
list-style-image:url("images/feuille.gif");
}

#content h3 {
color:#00abb9;
}

/* le contenu central pour la page massages */

#contentmass {
margin-left: 150px;
margin-right: 150px;
padding: 1em;
text-align:justify;
border: 1px solid #aedb2b;
padding:2%;
-moz-border-radius: 15px;
border-radius: 15px;
font-family:Georgia, serif;
background-image:url("images/mass.jpg");
background-repeat: no-repeat;
background-position:bottom left; 
}

#contentmass2 {
margin-left: 150px;
margin-right: 150px;
padding: 1em;
text-align:justify;
border: 1px solid #aedb2b;
padding:2%;
-moz-border-radius: 15px;
border-radius: 15px;
font-family:Georgia, serif;
background-image:url("images/mass2.jpg");
background-repeat: no-repeat;
background-position:bottom left; 
}


#contentmass h3 {
color:#00abb9;
}


#contentmass2 h3 {
color:#00abb9;
}


.bleu {
color:#00abb9;
}

/*-------------------------------------------------------*/
/* le footer */

#footer {
clear: both;
margin-top: 10px;
margin-left: 150px;
margin-right: 150px;
padding: .5em;
color: #333;
border: 1px solid #aedb2b;
-moz-border-radius: 15px;
border-radius: 15px;
text-align:center;
background-image:url("images/spirale.gif");
background-repeat: no-repeat;
background-position:left;
}

/*-------------------------------------------------------*/
/*  Divers */


table{color:black;}

#leftnav p, #rightnav p { margin: 0 0 1em 0; }
#content h2 { margin: 0 0 .5em 0; }

h2 {
color:#00abb9;
}

/* pour le flash de la page d'intro */

#intro {
width:500px;
height:500px;
margin:auto;
}

/* Le lien en savoir plus a la fin de chaque contenu */

.savoirplus {
display:block;
margin:auto;
width:150px;
height:30px;
background-image:url("images/savoirplus.gif");
background-repeat: no-repeat;
cursor: pointer;
}

/* pour le survol des termes inconnus */

.gloss {
cursor: help;
border-bottom: 1px black dashed;
color:black;
}

.gloss2 {
cursor: help;
border-bottom: 1px #00abb9 dashed;
color:#00abb9;
font-weight:bold;
}

#content a {
color: black;
}

#contentmass a {
color: black;
}



#droite a {
color: black;
}
.rouge {
color:red;
text-align:center;
padding-left:5%;
padding-right:5%;
}

.souligne p{
text-decoration:underline;
}

.centre {
text-align:center;
}

#pouce {
background-image:url("images/pouce.jpg");
height:200px;
width:200px;
float:left;
margin:15px;
background-repeat:no-repeat;
}

#puzzle {
background-image:url("images/puzzle.jpg");
height:246px;
width:400px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#flacons {
background-image:url("images/flacons.jpg");
height:164px;
width:300px;
margin:15px;
float:left;
background-position: right;
background-repeat:no-repeat;
}

#massdos {
background-image:url("images/massdos.jpg");
height:200px;
width:300px;
margin:15px;
float:left;
background-position: right;
background-repeat:no-repeat;
}

#yoga {
background-image:url("images/yoga.jpg");
height:292px;
width:300px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#yoga2 {
background-image:url("images/yoga2.jpg");
height:200px;
width:300px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#mains {
background-image:url("images/mains.jpg");
height:200px;
width:300px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#vase {
background-image:url("images/vase.jpg");
height:267px;
width:200px;
margin:15px;
float:left;
background-position: right;
background-repeat:no-repeat;
}

#fleurcaillou {
background-image:url("images/fleurcaillou.jpg");
height:189px;
width:300px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#mains2 {
background-image:url("images/mains2.jpg");
height:200px;
width:300px;
margin:15px;
float:right;
background-position: right;
background-repeat:no-repeat;
}

#pied {
background-image:url("images/pied.jpg");
height:200px;
width:300px;
margin:15px;
float:left;
background-position: right;
background-repeat:no-repeat;
}

.bleugras {
color:#00abb9;
font-weight:bold;
text-align:center;
font-size:120%;
}

.mp3 a img{
border:none;
position:absolute;

}

/*-------------------------------------------------------*/
/* administration */

.admin {
color:white;
text-decoration:none;
}

.admin:hover{
color:red;
text-decoration:underline;
}

.pageadmin {
padding:50px;
margin:50px;
border: 2px solid #a9ffbb;
}

form {
color:#00abb9;
}

input {
background-color:#edf6b0;
}

textarea {
background-color:#edf6b0;
}


/* menu final ----------------------------------------------*/

#menu2 {
border: 1px solid #aedb2b;
margin-bottom: 10px;
text-align:center;
margin-left:150px;
margin-right:150px;
padding:12px;
-moz-border-radius: 15px;
  border-radius: 15px;
}

#menu2 a {
background-color: #edf6b0;
padding:4px;
color:#00abb9;
font-weight:bold;
font-size:80%;
}

#menu2 a:hover {
background-color:#00abb9;
color:white;
}

#menu2 .current {
text-decoration:underline overline;
background-color:#00abb9;
color:white;
}

#menu3 {
border: 1px solid #aedb2b;
margin-bottom: 10px;
text-align:center;
margin-left:150px;
margin-right:150px;
padding:12px;
-moz-border-radius: 15px;
  border-radius: 15px;
}

#menu3 a {
background-color: #edf6b0;
padding:4px;
color:#00abb9;
font-weight:bold;
font-size:80%;
}

#menu3 a:hover {
background-color:#00abb9;
color:white;
}

#menu3 .current {
text-decoration:underline overline;
background-color:#00abb9;
color:white;
}



/* menu feuille -----------------------------------------------


#menu2 {
border: 1px solid #aedb2b;
margin-bottom: 10px;
overflow:auto;
text-align:center;
}

#menu2 ul li {
background-image: url("images/feuille.gif");
background-repeat: no-repeat;
display:inline;
padding-left:30px;

}

#menu2 a {
color:#00abb9;
font-weight:bold;
}

#menu2 .current a{
text-decoration:underline overline;
}

#menu3 {
border: 1px solid #aedb2b;
margin-bottom: 10px;

overflow:auto;
text-align:center;
}

#menu3 ul li {
background-image: url("images/feuille.gif");
background-repeat: no-repeat;
display:inline;
padding-left:30px;
}

#menu3 a {
color:#00abb9;
font-weight:bold;
}

#menu3 .current a{
text-decoration:underline overline;

}
*/
/*
-------------------------------------------------------
 menu 
-------------------------------------------------------
 le menu principal 


#menu2 { 
margin-bottom:10px;
height:34px;
margin-left: 150px;
margin-right: 150px;
background:#DAE0D2 url("images/bg.gif") repeat-x bottom;
border-top: 1px solid #aedb2b;
border-left: 1px solid #aedb2b;
border-right: 1px solid #aedb2b;
}

#menu2 ul {
margin:0;
padding:0;
list-style:none;
}

#menu2 li {
float:left;
background:url("images/norm_right.gif") no-repeat right top;
margin:0;
padding:0; 
}

#menu2 a {
display:block;
background:url("images/norm_left.gif") no-repeat left top;
padding:5px 15px 4px; 
text-decoration:none;
color:#9a7357;
font-weight:bold;
font-size:80%;
}

#menu2 a:hover {
padding-bottom:5px;
color:#007c86;
}

#menu2 .current {
background-image:url("images/norm_right_on.gif");
}

#menu2 .current a {
background-image:url("images/norm_left_on.gif");
padding-bottom:5px;
color:#007c86;
}

/* le menu sophrologie 

#menu3 { 
margin-bottom:10px;
height:34px;
margin-left: 150px;
margin-right: 150px;
background:#DAE0D2 url("images/bg.gif") repeat-x bottom;
border-top: 1px solid #aedb2b;
border-left: 1px solid #aedb2b;
border-right: 1px solid #aedb2b;
}

#menu3 ul {
margin:0;
padding:0;
list-style:none;
}

#menu3 li {
float:left;
background:url("images/norm_right.gif") no-repeat right top;
margin:0;
padding:0; 
}

#menu3 a {
display:block;
background:url("images/norm_left.gif") no-repeat left top;
padding:5px 15px 4px; 
text-decoration:none;
color:#9a7357;
font-weight:bold;
font-size:70%;
}

#menu3 a:hover {
padding-bottom:5px;
color:#007c86;
}

#menu3 .current {
background-image:url("images/norm_right_on.gif");
}

#menu3 .current a {
background-image:url("images/norm_left_on.gif");
padding-bottom:5px;
color:#007c86;
}

/* le menu massages 

#menu4 { 
margin-bottom:10px;
height:34px;
margin-left: 150px;
margin-right: 150px;
background:#DAE0D2 url("images/bg.gif") repeat-x bottom;
border-top: 1px solid #aedb2b;
border-left: 1px solid #aedb2b;
border-right: 1px solid #aedb2b;
}

#menu4 ul {
margin:0;
padding:0;
list-style:none;
}

#menu4 li {
float:left;
background:url("images/norm_right.gif") no-repeat right top;
margin:0;
padding:0; 
}

#menu4 a {
display:block;
background:url("images/norm_left.gif") no-repeat left top;
padding:5px 15px 4px; 
text-decoration:none;
color:#9a7357;
font-weight:bold;
font-size:70%;
}

#menu4 a:hover {
padding-bottom:5px;
color:#007c86;
}

#menu4 .current {
background-image:url("images/norm_right_on.gif");
}

#menu4 .current a {
background-image:url("images/norm_left_on.gif");
padding-bottom:5px;
color:#007c86;
}

*/

