/* @import "http://www.villette.com/static/css/store/cssBilletterie.css"; */

/* Defaults
------- */
html {height: 100%;}
html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, em, img, small, strong, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, iframe {margin: 0; padding: 0; border: 0; vertical-align: baseline; background: transparent;}

body {background: #000; line-height: 1; height: 100%;}

textarea {overflow: auto;}
ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0; empty-cells: show;}
td,
th {padding: 2px 10px;}
acronym, abbr {border-bottom: dotted 1px; text-decoration: none;}
hr {display: none;}
:active {outline: none;}

/* Colors
----- */
body, select, input, textarea, button, a {color: #333;}
a:hover, button:hover {color: #399506;}

/* Font
----- */
* {font-family: arial,FreeSans,verdana,sans-serif; font-size: 1em;}


/* Page
----- */
#page {width: 971px; margin: 0 auto; font-size: 0.735em; background: #fff; min-height: 100%; position: relative;}
* html #page {height: 100%;}

#contenu {line-height: 1.3;}

/* 
----- */
a {text-decoration: underline; color: #333;}
a:hover {color: #399506;}

ul,
ol,
p,
blockquote {margin-bottom: 0.4em;}

ul li {list-style: square; margin-left: 1.8em;}




/*<!-- ******************* les menus ****************************** -->*/


/*#logo1{
height: 90px;
float : left;
}*/

/*#logo1 { display: none;}*/

#logo1 {width: 971px; height: 118px; overflow: hidden; bottom: -76px; left: 0; position: absolute;}


/*li{
font-size : 15px;
display:inline;
padding:5px;
}*/

/*#bandeau{
height: 90px;
}*/

#bandeau {background: #390; padding: 8px 6px 0px 6px; margin: 0 0 118px 0; position: relative;}


/*#tabnav{
padding-top : 30px;
}*/

#tabnav {line-height: 1.2;}
#tabnav li {float: left; display: inline; list-style: none; margin: 0;}
#tabnav a {border: solid 1px #fff; color: #fff; display:block; margin: 4px -1px 0 0; padding: 1px 25px; text-transform: uppercase; white-space: nowrap; text-decoration: none; position: relative; min-width: 0;}
#tabnav a:hover {color: #111; background: #fff; color: rgba(0,0,0,0.85); background: rgba(255,255,255,0.75);}
#tabnav .nav-flag {float: right;}
#tabnav .nav-flag a {border: none; padding: 0; margin: 2px 0 0 0;}

* html #tabnav a:hover {filter:alpha(opacity=80); color: #111;}


/*a {
color:#000000;
font-weight:bold;
}*/

/*a.menu:hover{ 
color : #ff0000;
}*/

/*a.liens, a.liens:hover{ 
color : #000066;
}*/


a.rsi { 
color: #000000;
text-align: center;
vertical-align: middle;
text-decoration: none;
}

/*.labilletterie{  
text-align: center;
vertical-align: top;
font-weight: bold;
}*/

.labilletterie {color: #000; font-size: 1.145em; text-transform: uppercase; margin-bottom: 0.2em; line-height: 1.3; font-weight: bold;}

/*<!-- ********************** la partie du milieu ********************************* -->*/
/*#page {
margin-left: auto;
margin-right: auto;
}*/

/*#contenu {
min-height:400px;
}*/

#contenu {padding: 0 27px 5em 27px;/* min-height: 400px;*/}

.contenu_gauche {
float:left;
width:55%;
padding-left:0px;
}

.contenu_droit {
float:right;
width:40%;
vertical-align: top;
margin-right: 0px;
}

.contenu_droit .par {font-weight: bold; color: #390;}
.contenu_droit .par:first-letter {text-transform: uppercase;}

/*img {
border : none;
}*/
a.image  { 
background-color:transparent;
border-width:0;
} 

/*<!-- ********************** Elements pour toutes les pages ********************************* -->*/			
/*.vide_image{
height: 20px;
 width: 35px;
 float:left;
 }*/
.vide_image{height: 20px; width: 20px; float: left;}

/*.titre_image{
height: 20px;
width: 35px;
float:left;
}*/

.titre_image{height: 20px; width: 20px; float:left;}

/*.titre_texte {
float:left ;
font-size: 1.1em;
font-weight: bold;
text-transform:uppercase;
width:90%;
}*/

.titre_texte {float: left; font-size: 1.072em; text-transform: uppercase; color: #390; font-weight: bold; margin-bottom: 0.75em; width: 90%;}

/*.texte_image{
float:left;
height: 30px;
width: 35px;
float:left;
}*/

.texte_image{float: left; height: 30px; width: 20px; float: left;}

/*.texte_texte {
float:left ;
text-align: left;
width:90%;
}*/

.texte_texte {float: left; text-align: left; width: 90%;}

/*.texte_attention {
float:left;
text-align: left;
width:70%;
color: #FF0000;
}*/

.texte_attention {float: left; text-align: left; width: 70%; color: #FF0000; display: block; margin-bottom: 1em;}

.clear{
clear:both;
}

.clear_espace{
clear:both;
height: 20px;
}

.image{
border:0;
}

/*<!-- ********************** page accueil ********************************* -->*/	
.div_intro {
float:left;
width:100%;
}

.div_selection{
float:left;
width:100%;
}

/*<!-- ********************** page identification ou premiere visite ********************************* -->*/			
/*.div_choix {
float:left;
width:100%;
}*/
.div_choix {margin-bottom: 1em;}


/*.div_choix_detail {
float:left;
}*/

.div_choix_detail {clear: left; margin: 1em 0 2em 20px;}
.div_choix_detail .vide_image {display: none;}

fieldset.coordonnees p {margin: 0.75em 0;}
fieldset.coordonnees p label {display: block; float: left; width: 120px; margin-right: 5px; padding-top: 0.2em; text-align: right;}
fieldset.coordonnees p input {border: solid 1px #ccc;}


#Layer7 { position: relative; z-index: 3; top: 29px; left: 45px; width: 200px; height: 42px; visibility: visible }

#visuel1 { position: relative; z-index: 3; top: 30px; left: 5px; width: 81px; height: 113px; visibility: visible }

#visuel2 { position: relative; z-index: 4; top: -30px; left: 110px; width: 81px; height: 113px; visibility: visible }

#visuel3 { position: relative; z-index: 5; top: -50px; left: 200px; width: 81px; height: 113px; visibility: visible }

/*#t1 {  z-index: 9; top: 100px;margin-left: auto; margin-right: auto; visibility: visible }

#t2 {  z-index: 10; top:40px;margin-left: auto; margin-right: auto; visibility: hidden }

#t3 { z-index: 11; top: -70px; margin-left: auto; margin-right: auto; visibility: hidden ;}*/

#t1 {display: block;}
#t2,
#t3 {display: none;}


/*.validation {
width:50%;
margin-left: auto;
margin-right: auto;
}*/
.validation {float: left; margin: 0 0 0 20px; width: 100px;}

/*.annuler {
float:left;
}

.valider {
float:right;
}*/

.annuler {float: left;}

.valider {float: right;}

.div_identification	{
float:left;
text-align:left;
}

/*.over_types {
overflow: scroll;
width:400px;
height:150px;
}*/

.over_types {/*overflow: auto; width: 384px; height: 150px; padding: 0 16px 0 0;*/ width: 400px; margin: 0 0 0 20px;}

/*.over_spectacles {
overflow: scroll;
width:400px;
height:350px;
}*/

.over_spectacles {/*overflow: auto; width: 384px; height: 350px; padding: 0 16px 0 0;*/ width: 400px; margin: 0 0 0 20px;}

/*<!-- ********************** detail sepctacle et representations disponibles ********************************* -->*/
/*.over_detail {
overflow: scroll;
width:400px;
height:150px;
}*/

.over_detail {/*overflow: auto; width: 384px; height: 150px; padding: 0 16px 0 0;*/ width: 400px; margin: 0 0 0 20px;}

/*.over_representations {
overflow: scroll;
width:400px;
height:150px;
}*/

.over_representations {/*overflow: auto; width: 384px; height: 150px; padding: 0 16px 0 0;*/ width: 400px; margin: 0 0 0 20px;}

/*<!-- ********************** Selection de places ********************************* -->*/
.div_selectionplaces {
float:left;
text-align:left;
width:100%;
}

.div_selectionplaces table {border-collapse: separate; border-spacing: 1px; margin-bottom: 0;}
.div_selectionplaces table caption {text-align: left; text-transform: uppercase; color: #666;}
                          
.div_selectionplaces table td {vertical-align: top; padding: 3px 12px 3px 12px; background: #e5e5e5;}

.div_selectionplaces table .choixplacetitre {font-weight: bold; border: solid 1px #ccc; background: #fff; text-align: left; padding: 3px 12px 3px 12px; vertical-align: middle;}
.div_selectionplaces table * {margin-bottom: 0;}

.div_selectionplacestitres	{
float:left;
width:30%;
text-align:left;
}

/*.div_prixtotal	{
float:left;
width:100%;
text-align:right;
}*/

.div_prixtot {font-weight: bold;}
.div_prixtot input {border: none; background: transparent;}

#calqueinvisible {
position: absolute;
top: 226px;
left: 40px;
width: 308px;
height: 62px;
visibility: hidden;
}


.choixplace .choixplacedetail {vertical-align: middle;}
.choixplacedetail input {border: none; background: transparent;}
.div_selectionplaces .choixplacedetail input {border: solid 1px #ccc; background: #fff;}

table.choixplace {border-collapse: separate; border-spacing: 1px; margin-bottom: 0;}
table.choixplace caption {text-align: left; text-transform: uppercase; color: #666;}

table.choixplace td {vertical-align: top; padding: 3px 12px 3px 12px; background: #e5e5e5;}

table.choixplace .choixplacetitre {font-weight: bold; border: solid 1px #ccc; background: #fff; text-align: left; padding: 3px 12px 3px 12px; vertical-align: middle;}

table.choixplace * {margin-bottom: 0;}





/*<!-- ********************** recapitulatif places ********************************* -->*/
.contenu_gaucherecap {float:left; width:20%; height:500px; padding-left:60px}
.contenu_droitrecap {float:right; width:70%; vertical-align: top; margin-right: 0px; margin-right: auto;}
.recap_liste {width:100%;  border-style:double}
.recap_texte { color: #000006; text-align: left;vertical-align: top;}
/*.recap_montant {  color: #000006; text-align: right;vertical-align: top; }*/
/*.explications {  color: #000006; text-align: left;vertical-align: top;}*/

#page .recap_montant {text-align: right; font-weight: bold; margin: 0 0 1.5em 0;}
#page .explications {margin: 0 0 1em 0;}
.autreachat {margin: 0 0 0.8em 0;}


/*<!-- ********************** inscription ********************************* -->*/
#formRecap
{
	width: 100%;
}

#formRecap p
{
	margin: 2px 0;
}

#formRecap .valider {}

#formRecap .annuler {position: relative; left: -20px;}

/* fieldset , legend */

#formRecap fieldset
{
	margin-bottom: 5px;
	border: #CCC 1px solid;
}

#formRecap fieldset {padding: 10px;}
#formRecap fieldset fieldset {margin: 10px 0; padding: 15px 10px 5px 15px;}


fieldset .code_envoi
{
	display: block;
}

/* Label */
#formRecap label
{
	display: block;
	width: 30%;
	float: left;
	padding-right: 1%;
	text-align: left;
	letter-spacing: 1px;
}

/*#formRecap label:hover
{
	font-weight: bold;
}*/


/* Input */
.inscrip, #formRecap select
{
	margin-left: 1%;
	width: 58%;
	border: #CCC 1px solid;
}

.date
{
	margin-left: 1%;
	width: 10%;
	border: #CCC 1px solid;
}

.input_cp
{
	margin-left: 1%;
	width: 20%;
	border: #CCC 1px solid;
}

#formRecap input:hover, #formRecap select:hover, #formRecap input:focus, #formRecap select:focus
{
	background-color: #DDEEFF;
}

/*<!-- ********************** conditions generales de vente ********************************* -->*/
/*.titre_conditions_ventes{ font-size: 14px; color: #000006; text-decoration: none; font-weight: bold; text-align:center}*/
.titre_conditions_ventes {font-weight: bold; position: relative; left: -27px; width: 944px; color: #000; font-size: 1.145em; text-transform: uppercase; margin-bottom: 0.2em; line-height: 1.3; overflow: hidden; padding: 0 0 0 27px;}
.titre_conditions_ventes img {position: relative; left: -27px;}

.textec { font-size: 09px; color: #000006; text-align: center;vertical-align: top;font-weight: bold }

/*<!-- ********************** les abonnements ********************************* -->*/
table.choixplace {float:left }
/*.contenu_abo {float:left;	width:80%; height:500px; padding-left:60px	}*/
.contenu_abo {float:left; width:80%; padding-left: 60px;}

.contenu_abo .clear_espace {height: 1px;}
.contenu_abo .texte_texte {margin-bottom: 2em;}
.contenu_abo .choixplace {margin-left: 20px;}

/*input.quantite {border:1px solid #666666; 	color:#666666; 	width:50px; size:8; text-align:left ; }*/
input.quantite {width: 50px; border: solid 1px #ccc; background: #fff;}

/*input.formule {border:1px solid #666666; 	color:#666666; 	width:180px; size:8; text-align:left ; }*/
input.formule {width:180px; border: solid 1px #ccc; background: #fff;}

/*input.tarif {border:1px solid #666666; 	color:#666666; 	width:50px; size:8; text-align:left ; }*/
input.tarif {width:50px; border: solid 1px #ccc; background: #fff;}

/*<!-- ********************** les places pour les abonnements ********************************* -->*/
/*select.input_liste {	border:1px solid #666666; 	color:#666666; 	 text-align:left; width:auto }*/
select.input_liste {border: 1px solid #ccc; width: auto;}

/*<!-- ********************** la partie basse ********************************* -->*/

/*#piedpage   {position:relative;	text-align:center; padding-top:10px; width:100%; height:40px;}*/
#piedpage  {text-align: center; color: #666; font-size: 0.75em; width: 971px; position: absolute; bottom: 1em; left: 0;}
#piedpage a {color: #999;}
#piedpage img {display: none;}

/*<!-- les elements RSI -->*/
.tempsrestant  { color: #ff0000; font-size:11px; text-align: justify;text-decoration: none; font-weight:normal} 
.hr {color: #CCC; height: 2px; width: 100%; text-align: center }
.billetterie { font-size: 18px; color: #FFFFFF; vertical-align: middle;  text-decoration: none; font-weight: bold}
/*.texte { font-size: 09px; color: #000006; text-align: left;vertical-align: top;font-weight: bold }*/
.titre { font-size: 14px; color: #000006; text-decoration: none; font-weight: bold}
/*.soustitre { font-size: 12px; color: #FF9C00; font-weight: bold; text-decoration: none; font-style: normal; line-height: 1.2em; }*/
.soustitre {color: #390; margin-bottom: 0.6em; font-size: 1.072em; font-weight: bold; display: block;}


#ulaire{height: 496px;float:left}


/* Floats & hasLayout
----- */
#tabnav:after,
.div_choix:after,
fieldset.coordonnees p:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
#tabnav,
.div_choix,
fieldset.coordonnees p,
#bandeau {min-width: 0;}
* html #tabnav,
* html .div_choix,
* html fieldset.coordonnees p,
* html #bandeau {zoom: 1;}