/********************************************
   AUTHOR:  			Erwin Aligam 
   WEBSITE:   			http://www.styleshout.com/
	TEMPLATE NAME: 	Citrus Island
   TEMPLATE CODE: 	S-0004
   VERSION:          1.1          	
 *******************************************/
 
/********************************************
   HTML ELEMENTS
********************************************/ 

/* top elements */

* { margin:0; 	padding: 0; }

/* links */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin: 0; padding: 0; }

a img,:link img,:visited img { border: none; }

a {
	color: #F9864D; 
	background-color: inherit;
	text-decoration: none;
}
a:hover {
	color: #575757;
	background-color: inherit;
	text-decoration: underline;
}
body {
	margin: 0; 
	padding: 20px;
	font: 70%/1.5em  Verdana, Tahoma, Arial,sans-serif;
	color: #333; 
	background: #f9e6d8 url(bg.gif) repeat-x;	
	text-align: center; 
}

.titre 
{
	color: #CC99FF; font-weight: bold; font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align:center; 
	padding-left:3px; padding-right:3px;
}
.titre a:active{color:#99FFFF;	text-decoration:underline;}
.titre a:Link {color:#99FFFF;text-decoration:underline;}
.titre a:Visited {color:#99FFFF;text-decoration:underline;}
.titre a:Hover {color:#99FFFF;text-decoration:none;}

/* headers */
h1, h2, h3 {
	font-family: 'Trebuchet MS', Tahoma, Verdana, Sans-serif;
	font-weight: Bold; 		
}
h1 {
	font-size: 145%;	
	padding: 10px 10px 5px 10px;
	color: #CC99FF;
	background-color: inherit;
	border-bottom: 1px solid #EFF0F1;		
	text-transform: uppercase;
}
h2 {
	font-size: 130%;
	color: #CC99FF;
	text-align:center;
}
h3 {
	font-size: 125%;	
	color: #404040;
}

h2, h3, p {
	padding: 5px;		
	margin: 0;
}

/* images */
img {
	border: 0px solid #D5D5D5;
	vertical-align:middle;
	margin: 2px 2px 2px 2px;
}
img.float-right {
  margin: 5px 0px 5px 10px;  
}
img.float-left {
  margin: 5px 10px 5px 0px;
}

#sidebar h1, 
#sidebar p {
	padding-left: 0;
}

ul, ol {
	margin: 10px 20px;
	padding: 0 20px;
}

code {
  margin: 5px 0;
  padding: 10px;
  text-align: left;
  display: block;
  overflow: auto;  
  font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace;
  /* white-space: pre; */
  background: #FAFAFA;
  border: 1px solid #f2f2f2;  
  border-left: 4px solid #FF9966;
}
acronym {
  cursor: help;
  border-bottom: 1px solid #777;
}
blockquote {
	margin: 10px;
 	padding: 0 0 0 32px;  	
  	background: #FAFAFA url(../images/quote.gif) no-repeat 5px 10px !important; 
	background-position: 8px 10px;
	border: 1px solid #f2f2f2; 
	border-left: 4px solid #FF9966;   
}

/* form elements */
form {
	margin:10px; padding: 5px;
	border: 1px solid #CC99FF; 
	background-color: #f9e6d8; 
}


.label 
{
	color: #CC99FF; font-weight: bold; font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align:left; 
	padding-left:3px; padding-right:3px;
}

label {
	display:block;
	font-weight:bold;
	margin:5px 0;
}
input {
	padding: 3px;
	border:1px solid #eee;
	font: normal 1em Verdana, sans-serif;
	color:#777;
}
textarea {
	width:350px;
	padding:3px;
	font: normal 1em Verdana, sans-serif;
	border:1px solid #eee;
	height:100px;
	display:block;
	color:#777;
}
input.button { 
	margin: 0; 
	font: bold 12px Tahoma; 
	border: 1px solid #F9864D; 
	padding: 2px 3px; 
	color: #FFFFFF;
	background-color: #F9864D;
}
/* search form */
form.search {
	position: absolute;
	top: 15px; right: 5px;
	padding: 0; margin: 0;
	border: none;
	background-color: transparent; 
}
form.search input.textbox { 
	margin: 0; 
	width: 120px;
	border: 1px solid #CCC; 
	background: #FFF;
	color: #333; 	
	vertical-align: top;
}
form.search input.button {
	width: 60px;
	vertical-align: top;
}
table
{
  font-family: Verdana, Tahoma, Arial, Sans-Serif;
  font-size: 12px;
}

div.table 
{
        display:table;
        /* Joindre les bords des cellules */
        border-collapse:collapse;
        /* Forcer le tableau à prendre la largeur écran */
        width:100%;
        border:2px solid red;
}
div.caption 
{
        /* Ffox n'affiche pas le caption dans la table il faut le déclarer bloc */
        display:block;
        /* Si déclaré bloc, lui donner la largeur des td cumulés */
        width:700%; /* 100 % x 7 colonnes */
        /* Aligner le titre au centre */
        text-align:center;
}
/* tbody optionnel */
div.tbody 
{
        display:table-row-group;
}
div.tr 
{
        display:table-row;
}
div.td 
{
        display:table-cell;
        border:1px solid red;
        padding:5px;
        width:14%;
}
div.end {
        width:auto;
}

/**************************************
   LAYOUT 
***************************************/	
#wrap {
	margin: 0 auto; 
	padding: 0; 
	width: 1024px;
	text-align: left;
}

/* header */
#header { 
	position: relative;
	height: 70px; 
	margin: 0; padding: 0;
	color: #808080; 		
}
#header h1#logo {
	position: absolute;	
	font: bold 3.9em "trebuchet MS", Arial, Tahoma, Sans-Serif;
	margin: 0; padding:0;
	color: #CC99FF;
	letter-spacing: -2px;	
	border: none;	
	
	/* change the values of top and Left to adjust the position of the logo*/
	top: 0; left: 2px;		
}
#header h1#logo span { color: #F18359; }

#header h2#slogan { 
	position: absolute;
	margin: 0; padding: 0;	
	font: bold 12px Arial, Tahoma, Sans-Serif;	
	text-transform: none;
	
	/* change the values of top and Left to adjust the position of the slogan*/
	top: 43px; left: 45px;
}

/* menu */
.menu {
	clear: both;
	background: #FF9966 url(../images/menubg.gif) repeat-x;
	height: 30px;
	margin: 0;
	font: bolder 1.2em/30px Tahoma, Verdana, Arial, Sans-Serif;		
}
.menu ul{
	margin: 0; padding: 0 0 0 8px;
}
.menu ul li {
	float: left;
	list-style: none;		
	border-right: 1px solid #FFA500;
}
.menu ul li a {
	display: block;
	text-decoration: none;	
	padding: 0 15px;
	color: #FFF;	
}
.menu ul li a:hover {
  	color: #333;	
	background: url(../images/menu-hover-bg.gif) repeat-x;
}
.menu ul li#current a {
	color: #333;
	background: url(../images/menu-current-bg.gif) repeat-x;	
}

/* sidebar */
#sidebar {
	float: left;
	width: 15%; 
	margin: 0;	padding: 0; 
	display: inline;
}
#sidebar ul.sidemenu {
	list-style: none;
	text-align: left;
	margin: 0 0 7px 0; padding: 0;
	text-decoration: none;	
}
#sidebar ul.sidemenu li {
	border-bottom: 1px solid #EFF0F1;	
	background: url(../images/arrow.gif) no-repeat 3px 6px;	
	padding: 2px 5px 2px 15px;
}

* html body #sidebar ul.sidemenu li { height: 1%; }

#sidebar ul.sidemenu li a {
	font-weight: bolder;
	background-image: none;
	text-decoration: none;	
}

#rightbar {
	float: right;
	width: 21%;
	padding: 0;
	margin: 0; 			
}

/* main column */
#main {
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 84%;	
}

.post-footer {
	background-color: #FAFAFA;
	padding: 5px; margin: 15px 10px 10px 10px;
	border: 1px solid #f2f2f2; 
	font-size: 95%;
}
.post-footer .date {
	background: url(../images/clock.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
	background: url(../images/comment.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
	background: url(../images/page.gif) no-repeat left center;
	padding-left: 20px; margin: 0 10px 0 5px;
}

/* footer */
#footer { 
	clear: both; 	
	color: #666666; 	
	padding: 0;	 
	background: #f9e6d8 url(../images/footerbg.gif) repeat-x;
	height: 60px
}
#footer a { 
	text-decoration: none; 
	font-weight: bold;
}
#footer-content {
	margin: 0 auto;
	width: 1024px
}
#footer-content #footer-left {
	padding: 10px;
	width: 60%;
	float: left;
	text-align: left;
}
#footer-content #footer-right {
	padding: 10px;
	width: 33%;
	float: right;
	text-align: right;
}

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* additional classes */
.clear  { clear: both; }
.green  { color: #75A54B; }

/**************************************
   PROFIL
***************************************/	
.labelProfil
{
	color: #CC99FF; font-weight: bold; font-size: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align:left; 
	padding-left:3px; padding-right:3px;
	width: 150px;
}


/* liste des saisons */
.liste_saison
{
width: 150px;
}

/**************************************
   FICHE SERIE
***************************************/	
/* formulaire de saisie à gauche */
#formulaire {
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 75%;	
}

/* image à droite */
#image {
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 20%;	
}

/**************************************
   combo-box
***************************************/	
.comboHeure {
  width: 50px;
}

/**************************************/
/* Affichage épisode */
/**************************************/

.episode
{
	font-family: 'Trebuchet MS', Tahoma, Verdana, Sans-serif;
	font-size: 100%;	
	width:16px;
  text-align:center;
}
.episode a:link
{
  color:#6F14A8;text-decoration:none;
  text-align:center;
}
.episode a:hover
{
  color:#6F14A8;text-decoration:underline;text-align:center;
}
.episode a:active
{
  color:#6F14A8;text-decoration:underline;text-align:center;
}
.episode a:visited
{
  color:#6F14A8;text-decoration:none;text-align:center;
}

/**************************************/
/* Affichage texte  déroulant */
/**************************************/
#cadrpg {
width:84%; /*largeur de la zone d'affichage*/
margin:0 auto;
border:0;
}
#newshr {
position:relative;
width:84%; /*largeur de la zone d'affichage*/
height:23px; /*hauteur de la zone d'affichage*/
overflow:hidden;
color:inherit;
background-color:inherit;
border:1px solid  #CC99FF;
vertical-align: middle;
}
#defile {
position:absolute;
background:inherit;
color:#F18359;
vertical-align: middle;
} 

/**************************************/
/* colonnes pour liste par semaine */
/**************************************/

.fo_semaine {
width: 100%;
height: 20px;
}

/* ingredients sur 3 colonnes */
.semgauche
{
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 200px;
	left: 10px;
}
.semmilieu
{
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 200px;
	left: 200px;
}
.semdroite
{
	float: left;
	margin: 0 0 0 3px;
	padding: 0;
	width: 200px;
	left: 400px;
}



/**************************************/
/* Backoffice : images
/**************************************/
#img_grande {
	margin:10px; 
	padding: 5px;
	border: 1px solid #CC99FF; 
	background-color: #f9e6d8; 
	height: 300px;
}
#img_petite {
	margin:10px; 
	padding: 5px;
	border: 1px solid #CC99FF; 
	background-color: #f9e6d8; 
	height: 150px;
}
.img_fic {
	float: left;
	margin: 5 5 5 5px;
	padding: 5;
}

.img_bo {
	float: left;
	margin: 5 5 5 5px;
	padding: 5;
}