
/*
  Feuille de style commune aux sites CITIA 2010
  Elements de base sans mise en forme particulière
  Les spécification de chaque se situe dans style_site.css
  27/11/09 - CITIA
*/

/*------------------------------------------------------------------- Structure générale--*/
body {
  background-color : #fff;
  color : #000;
  position: relative;
  font-family: Arial;
  font-size: 12px;
  letter-spacing: 0em;
  line-height:1.5;
}

div#corps  {

  background-color: #fff;
  color: #747474;
}

div.container {
  position:relative;
  z-index:4;
  /*width: 1120px;*/
}

div.cleaner {
  clear: both;
  width: 100%;
  height : 1px;
  border : 0px;
}



/*------------------------------------------------------------------- Redefinition de la feuille de style de base --*/
/* titres */

h2, h3, h4, h5, h6  {
  line-height:1.1em;
  margin : 0px 20px;
  font-weight:bold;
  font-family: Arial;
}

h2  {
  background-color: #a0a0a0;
  color : #fff;
  height : 22px;
  line-height: 1.1em;
  font-weight:normal;
  font-size: 1.6em;
  letter-spacing: 0px;
  color: #fff;
  margin : 0;
  padding : 0;
  margin-bottom : 15px;
  padding-left : 20px;
  font-family: Arial; /*Aldo, */
}

h3  {
  color: #0098d3;
  font-size: 1.6em;
  margin-bottom : 10px;
  font-weight:normal;
}

h3 span {
  color: #747474;
  font-size: 0.8em;
}

h4  {
  color: #4dbfeb;
  font-size: 1.45em;
  margin-bottom : 10px;
}

h4 span {
  color: #9acde1;
  font-size: 0.8em;
}

h5  {
  color: #9acde1;
  font-size: 1.3em;
  margin-bottom : 10px;
}

h5 span {
  color: #96bd0d;
}

h5.contact {
  background: #101024 url(../interface/pictos/fl_contact.png) no-repeat 15px 7px;
  color: #cacce6;
  margin : 15px;
  margin-right : 20px;
  font-size: 1.25em;
  padding : 5px;
  padding-left : 28px;
  -moz-border-radius : 5px;
  -webkit-border-radius : 5px;
  border-radius: 5px;
}

h6  {
  color: #96bd0d;
  font-size: 1.2em;
  font-weight: bold;
}

h6 span {
  color: #fff;
}

h2.no_marge, h3.no_marge, h4.no_marge, h5.no_marge, h6.no_marge {
  margin : 0px;
}

/* paragraphes & listes */
p {
  margin : 5px 20px;
  /*text-align: justify;*/
}

p.jtf_g {
  text-align: left;
}

p.element_special {
  color : #0098d3;
}

p.element_special strong  {
  color: #00acef;
}

ul , ul.liste  {
  margin-top : 5px;
  margin-left : 30px;
  list-style-type: disc;
  list-style-position: inside;
}

ul li, ul.liste li  {
  text-align: left;
}

ul.liste_num  {
  margin-left : 20px;
  list-style-type: none;
}

ul.liste_num li span {
  padding-right : 3px;
  font-weight: bold;
  color: #0e99d3;
}

ul.no_puce  {
  list-style-type: none;
}

ul.liste_enligne  {
  list-style-type: none;
}

ul.liste_enligne li {
  float: left;
}

hr  {
  margin : 10px 0px;
}
/* Spec de base pour les multi_collones */
.col_no_marge p, .col_no_marge h3, .col_no_marge h4, .col_no_marge h5, .col_no_marge h6  {
  margin-left : 0px;
}

.col_no_marge ul, .col_no_marge ul.liste  {
  margin-left : 10px; 
}
/* liens */
a, a:visited {
  color: #0098d3;
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

a img {
  border: 0px;
}

/* tableau */ 
table.tableau_base  {
  margin : 10px 20px;
}

table.tableau_base td {
  padding : 10px;
  border : 3px solid #0d0d1a;
  background-color: #191933;
  vertical-align: middle;

}

table.tableau_base p, table.tableau_base h4, table.tableau_base h5, table.tableau_base h6   {
  margin-left: 0px;
  text-align: left;
}

/* marges standard */
html body div .mg0 {
  margin: 0 !important;
}
html body div .m_0    { margin : 0px;  }
html body div .m_5    { margin : 5px;  }
html body div .m_10   { margin : 10px; }
html body div .m_20   { margin : 20px; }

html body div .ml_0   {  margin-left : 0px;   }
html body div .ml_5   {  margin-left : 5px;   }
html body div .ml_10  {  margin-left : 10px;  }
html body div .ml_15  {  margin-left : 15px;  }
html body div .ml_20  {  margin-left : 20px;  }
html body div .ml_30  {  margin-left : 30px;  }
html body div .ml_40  {  margin-left : 40px;  }

html body div .mb_0   {  margin-bottom : 0px;   }
html body div .mb_10  {  margin-bottom : 10px;  }
html body div .mb_20  {  margin-bottom : 20px;  }

html body div .mt_2   {  margin-top : 2px;   }
html body div .mt_5   {  margin-top : 5px;   }
html body div .mt_10  {  margin-top : 10px;  }
html body div .mt_20  {  margin-top : 20px;  }
html body div .mt_30  {  margin-top : 30px;  }
html body div .mt_m20 {  margin-top : -20px; }

html body div .mta_3 {
  position: relative;
  top : 3px;
}

html body div .mr_0  {  margin-right : 0px !important; }
html body div .mr_5  {  margin-right : 5px;  }
html body div .mr_10 {  margin-right : 10px; }
html body .mr_20 {  margin-right : 20px; }
html body div .mr_40 {  margin-right : 40px; }

html body div .p_0  {   padding : 0px;       }
html body div .p_15 {   padding : 15px;      }

html body div .pt_0 {   padding-top : 0px;   }

.fl_droite, .float_right {
  float: right;
}

.fl_gauche, .float_left  {
  float: left;
}

.fl_milieu, .fl_center {
  margin-left: auto !important;
  margin-right: auto !important;
}

.cl_droite  {
  clear : right;
}
.cl_gauche  {
  clear : left;
}

.cl_both  {
  clear : both;
}

.centre, .center {
  text-align:center;
  vertical-align: middle;
}

.masque, .news_style, .alt { /*.news_style est utilisé quelques part ?? si non le virer */
  display: none;
}
/*------------------------------------------------------------------- espace publicitaires --*/

div#pub_sky {
  position:absolute;
  right : -180px;
  width: 160px;
  padding-left :  20px;
  top : 323px;
  z-index:3;
}

.pub_cdroite {
  float: right;
  margin : 5px 20px 5px 10px;
}

.pub_cgauche {
  float: left;
  margin : 5px 10px 5px 20px;
}

/*------------------------------------------------------------------- barre citia --*/
div#barre_citia {
  background-color: #d0d0d0;
  color:#747474;
  height:29px;
  padding : 2px;
  position:relative;
  z-index:4;
}

div#barre_citia div#bc_contenu  {
  margin : 0 auto;
  position:relative;
  /*left : -85px;*/
  width: 950px;
  text-align: left;
}

.kwicks {
	list-style: none;
	position: relative;
	margin: 0;
	margin-top : 6px;
	padding: 0; 
}
.kwicks li{
	display: block;
	overflow: hidden;
	position: relative;
	float: left;
	width: 32px;
	height: 20px;
	padding: 0;
	cursor: pointer;
}
#bc_contenu .kwicks_inner {
	width: 70px;
}

#bc_contenu .bc_picto {
	width: 12px;
	height: 12px;
	float: left;
	position: relative;
	top : 2px;
	text-decoration: none;
}

#bc_contenu .bc_lien {
	display: none;
	color: #4d4d4d; 
	font-size: 11px;
	padding-left : 2px;
	float: left;
}

#bc_contenu li.active .bc_lien {
	display: block;
}

#picto_citia, #picto_annecy, #picto_fb, #picto_naaow  {
	background: url(../interface/sprite_common.png) no-repeat;
}
 
#picto_citia  {
  background-position: 0px 0px;
}  
 
#picto_annecy  {
  background-position: -15px 0px;
} 
#picto_fb  {
  background-position: -30px 0px;
}  
 
#picto_naaow  {
  background-position: -45px 0px;
}

/* bloc de droite barre citia */
div#bc_droit  {
  position: absolute;
  right : 10px;
  top : -2px;
}

div#bc_droit ul {
  list-style-type: none;
  margin : 0;
}

div#bc_droit ul li  {
  float: left;
}

div#bc_droit a  {
  color: #4d4d4d;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
}

div#bc_droit a:hover  {
  text-decoration: underline;
}

/* Moteur de recherche */
form#cse-search-box {
  width: 144px;
  margin : 0px !important;
  padding : 0px !important;
}

form#cse-search-box  input#inp_rech {
  width: 115px;
  height: 13px;
  margin : 0px !important;
  padding : 0px !important;
  padding: 1px !important;
  background-color: #fff !important;
  border : 1px solid #aeaeae !important;
  background-position: 100px 50px !important;
  font-size: 11px;
}

form#cse-search-box  input#btn_rech {
  width: 20px;
  height: 17px;
  margin : 0px !important;
  padding : 0px !important;
  background:#797979 url(../interface/sprite_common.png) no-repeat -40px -15px;
  border : 0px !important;
  cursor: pointer;
  position: relative;
  top : 2px !important;
  outline:none !important;
}

form#cse-search-box  input#btn_rech:hover {
  background-position: -40px -35px;
  background-color: #5c5c5c;
}

#btn_rss, #btn_fr, #btn_en  {
  background: url(../interface/sprite_common.png) no-repeat;
  text-indent:-9999px;
  display: block;
} 

#btn_rss  {
  width: 12px;
  height : 12px;
  background-position: -60px 0px;
}

#btn_rss:hover  {
  background-position: -60px -13px;
}

#btn_print  {
  background: url(../interface/sprite_forum_blanc.png) no-repeat;
  text-indent:-9999px;
  display: block;
  width: 18px;
  height : 14px;
  margin : 4px 2px 0px 2px;
  background-position: -40px 0px;
} 

#btn_print:hover {
  background-position: -40px -20px;
}

#btn_fr, #btn_en {
  width: 20px;
  height : 15px;
  margin : 4px 2px 0px 2px;
} 

#btn_fr {
  background-position: 0px -15px;
} 

#btn_fr:hover {
  background-position: 0px -30px;
} 

#btn_en {
  background-position: -20px -15px;
}

#btn_en:hover {
  background-position: -20px -30px;
}

/*------------------------------------------------------------------- header --*/
div#header  {
  position: relative;
  height: 200px;
  width: 950px;
}

div#header ul {
  position: absolute;
  right : 0px;
  top: 20px;
  list-style-type: none;
}

div#header ul li a  {
  color: #747474;
  display: block;
  text-decoration: none;
  width: 100px;
  text-align: right;
  padding : 0px;
  padding-right : 15px;
  background: url(../interface/pictos/flgb_citia.png) no-repeat 107px center;
}

div#header ul li a:hover  {
  background-color: #0098d3;
}

/*------------------------------------------------------------------- menu --*/

div#menu  {
  font-size: 1.2em;
  padding-left :22px;
  padding-right : 10px;
  padding-top : 15px;
  font-family: Arial; /*aldo, */
}
div#menu div {
  overflow: hidden;
}
div#menu ul  {
  list-style-type: none;
  overflow: none;
  margin : 0;
  margin-left : 0px;
  padding : 0;
}

div#menu a {
  display: block;
  border: 0;
}

div#menu h3  {
  margin: 0px;
  margin-bottom: 2px;
  border: 0;
}

div#menu h4 {
  margin: 0px;
  border: 0;
  position: relative;
}

div#menu .menu1 {
 margin-top: 1px;
 margin-left : 0px;
 padding-left : 0px;
}

div#menu .menu1 ul li {
  position: relative;
  margin-bottom: 2px;
}

/******** menu 2eme niveau */
div#menu .menu2 ul {
  margin : 0px;
}
div#menu .menu2 ul li {
  position: relative;
  margin : 0px;
  margin-top : 2px;
}

/*****************************************************************************************************************************/
/*                  Menu en class         */

/*------------------------------------------------------------------- menu --*/
div.menu  {
  font-size: 1.2em;
  padding-left :22px;
  padding-right : 10px;
  padding-top : 15px;
  font-family: Arial; /*aldo, */
}
div.menu div {
  overflow: hidden;
}
div.menu ul  {
  list-style-type: none;
  overflow: none;
  margin : 0;
  padding : 0;
}

div.menu a {
  display: block;
  border: 0;
}

div.menu h3  {
  margin: 0px;
  margin-bottom: 2px;
  border: 0;
}

div.menu h4 {
  margin: 0px;
  border: 0;
  position: relative;
}

div.menu .menu1 {
 margin-top: 1px;
 overflow: hidden;
}

div.menu .menu1 ul li {
  position: relative;
  margin-bottom: 0px;
}

/******** menu 2eme niveau */
div.menu .menu2 ul {
  margin : 0px;
}
div.menu .menu2 ul li {
  position: relative;
  margin : 0px;
  margin-top : 2px;
}

/*****************************************************************************************************************************/


/*------------------------------------------------------------------- Blocs principaux ( élements génriques) --*/
div#blc_centre, div#blc_centre_large  {
  position: relative;
  z-index: 10;
}

div#blc_centre  {
  color: #747474;
}

div#blc_centre_large  {
  color: #747474;
}

/*------------------------------------------------------------------ Fil d'ariane --*/
p#fil_ariane   {
  color: #707173;
  margin-bottom : 5px;
}

p#fil_ariane a  {
    color: #707173;
    text-decoration: none;
}

p#fil_ariane a:hover  {
    color: #0098d9;
    text-decoration: underline;
}

p#fil_ariane a.a_actif  {
    text-decoration: underline;
}

/*------------------------------------------------------------------- Pied de page --*/
div#pied_page {
  margin-top : 20px;
}

div#pied_page p {
  text-align: center;
  font-size: 0.9em;
  color : #747474;
  letter-spacing: 0.09em;
}

div#pied_page p a {
  text-decoration: none;
}

div#pied_page a:hover {
    text-decoration: underline;
}

/*------------------------------------------------------------------- Boutons standards --*/
a#close {
  display:block;
  position:absolute;
  right: 5px;
  text-indent:-9999em;
  top: 5px;
}
/*------------------------------------------------------------------- Formuaile de connexion --*/
#form_login {
  margin : 0px 20px;
}

.btn_action, .btn_action2, .btn_action3, .btn_action4  {
  height: 23px;
  display: inline-block;
  line-height: 21px;
  padding:0px;
  margin : 0px;
  border-width :0px !important;
  text-decoration: none;
  text-align: center;
  border-width : 0px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer;
}

.btn_action3, .btn_action4  {
    height: 20px;
    line-height: 19px;
}

.btn_action:hover, .btn_action:visited, .btn_action2:hover, .btn_action2:visited, .btn_action3:hover, .btn_action3:visited, , .btn_action4:hover, .btn_action4:visited  {
  text-decoration: none;
}


/*------------------------------------------------------------------- Elements de formualire --*/

div .bordure_erreur {
  border : 2px solid #C91010 !important;
  color: #C91010 !important;
}

div .elmt_focus {
  border : 1px solid #0098d3 !important;
}

div .coul_important  {
  color: #000 !important;
}

div .coul_erreur {
  color: #9d0000 !important;
}

div .coul_ok {
  color: #5c9333 !important;
}

div .msg_erreur {
  color: #9d0000;
  background : url( "../interface/pictos/chp_obligatoire.gif" ) no-repeat 0 5px;
  padding-left : 10px;
  font-size: 0.9em;
}

.blc_form p span.msg_erreur {
  margin-left : 5px;
}

html body div .no_img {
  background-image: url(none);
}

/**//**/
div.blc_form  {
  text-align: left;
}

div.blc_form p {
  margin: 0px;
  margin-top : 10px;
  font-weight: bold;
}


div.blc_form p.fw_normal {
  font-weight: normal;
  font-size: 0.8em;
}

div.blc_form p span.mini  {
  font-size: 0.9em;
}

div.blc_form input.txt, div.blc_form select.txt,  div.blc_form textarea, div.blc_form ul.select_scroll {
  width : 236px;
  margin : 0px;
  margin-top : 4px;
  padding : 2px;
  color : #757575;
  background-color : #f5f5f5;
  border: 1px solid #d2d2d2;
}

div.blc_form input.txt.l1, div.blc_form select.txt.l1,  div.blc_form textarea.l1, div.blc_form ul.select_scroll.l1 {
  width : 436px;
}

div.blc_form input.btn_action {
  width : 242px;
}

div.blc_form input.txt  {
  height : 16px;
}

div.blc_form select.txt  {
  height : 22px;
  width : 242px;
}

div.blc_form select.txt option {
  padding : 2px;
}

div.blc_form textarea  {
  height : 75px;
}

div.blc_form textarea.haut  {
  height : 150px;
}

div.blc_form ul.select_scroll  {
  height : 71px;
  overflow: auto;
  list-style-type: none;
}

div.blc_form ul.liste_puce  {
  margin-top: 4px;
  height: 22px;
  display: block;
}

div.blc_form  ul.liste_puce li  {
  display: inline;
  position: relative;
  margin-right : 6px;
}

div.blc_form input.txt.indic_tel  {
  width: 30px;
}

div.blc_form input.txt.tel  {
  width: 197px;
}

ul.select_scroll li {
  padding : 2px;
  margin : 0px !important;
}

ul.select_scroll li input {
  border-width:0;
  vertical-align:middle;
  width:15px;
  margin-right : 2px;
}

ul.liste_civ  {
  height : 20px;
  margin-left : 0px;
  margin-top : 6px;
  display: block;
}

ul.liste_civ li  {
  display: inline;
  margin-right : 6px;
}

ul.liste_civ li input {
  margin-right : 4px;
  position: relative;
  top : 3px;
}


/*------------------------------------------------------------------- Visionneuse --*/
.visionneuse  {
  margin : 0px 15px;
  position: relative;
  width:520px; 
  height:180px; 
  overflow:hidden; 
  cursor:pointer;
}

.visionneuse .slides { 
  position:absolute; 
  margin-top:0;
  margin-left:0;
}

.visionneuse .slides div { 
  position:absolute; 
  top:0; 
  width:520px; 
}

.visionneuse h4 {
  position: absolute;
  top : 5px;
  color : #bababa;
  font-size: 16px;
}

.visionneuse h5 {
  position: absolute;
  top : 25px;
  color : #e0e0e0;
  font-size: 11px;
}

.visionneuse a.btn_prec, .visionneuse a.btn_suiv {
    width: 20px;
    height: 20px;
    display: block;
    text-decoration: none !important;
    background-repeat: no-repeat;
    position: absolute;
    top : 5px;
}

span.btn_actu_prec, span.btn_actu_suiv
{
  width: 20px;
  height: 20px;
  display: inline-block;
}

.btn_prec {
  background-position: -60px 0px;
  right : 37px;
}

.btn_prec:hover {
  background-position: -60px -20px;
}

.btn_suiv {
  background-position: -80px 0px;
  right : 15px;
}

.btn_suiv:hover {
  background-position: -80px -20px;
}

ul.pagination { 
  position: absolute;
  top : 15px;
  right : 62px;
  list-style-type:none; 
  margin:0; 
  padding:0;
}

ul.pagination li { 
  float:left; 
  margin:0 1px; 
}	

ul.pagination a { 
  display:block; 
  width:10px; 
  height:10px; 
  text-indent: -9999px;
}

ul.pagination li a:hover, ul.pagination li.active a {
  background-position: -40px -51px;
}

/* Liste d'action */
ul.liste_act_std li, ul.liste_select li {
  margin : 0px 1px;
  list-style-type: none;
  display: inline;
  vertical-align: middle;
}

/******************************************************************************************************************************************************/
/************************************************************* Elements Annecy ? **********************************************************************/
/******************************************************************************************************************************************************/

/* styles communs à tous les sites pour la navigation dans les résultats */
.navigation_resultats {
  text-align: center;
  vertical-align: middle;
}

.navigation_resultats li {
  float: left;
  width: 24px;
  height: 20px;
  list-style: none;
  text-align: center;
}

.navigation_resultats li a {
  display: block;
  width: 100%;
  height: 100%;
}

.it_xxshort {
  width: 80px;
}
.it_xshort {
  width: 125px;
}
.it_short {
  width: 200px;
}
.it_avg {
  width: 275px;
}
.it_long {
  width: 350px;
}
.it_xlong {
  width: 425px;
}
.it_xxlong {
  width: 500px;
}

.error  {
  color: #f00;
}

.success  {
  color: #fff;
}

.div_contact  {
  width: auto;
  padding-right: 5px;
}

.pad_r_5  {
  padding-right: 5px;
}

/******************************/
/******** Liens images *********/
.fl_prev, .fl_next, .fl_deb, .fl_fin  {
  display: inline-block;
  padding : 2px;
  width : 16px;
  height : 16px;
  text-decoration: none;
}

.btn_mini_prec, .btn_mini_suiv, .btn_mini_deb, .btn_mini_fin  {
  display: block;
  width : 13px;
  height : 13px;
  text-decoration: none;
}

/***********************Communs */
.al_droite  {
  text-align: right;
}

.al_centre  {
  text-align: center;
}

div#boite_message {
  position: relative;
  float: right;
  width : 50%;
  padding : 5px;
  margin-right : 40px;
}

/* Formulaire login */
#form_connexion {
  position: absolute;
  z-index : 30;
  top: 0px;
  right : 90px;
  -moz-border-radius-bottomright : 10px;
  -webkit-border-bottom-right-radius : 10px;
  -moz-border-radius-bottomleft : 10px;
  -webkit-border-bottom-left-radius : 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.trace  {
  height:2px;
  width: 10px;
  display: inline-block;
  vertical-align: middle;
}

/* playlist et videos youtube */
.img_youtube  {
  margin-right: 5px;
}

.video  {
/*  
  width: 350px;
  height: 100px;
*/
  padding-top:10px;
  margin:0px;
}

.blc_photos {
  margin-left: 55px;
}

.photo  {
/*
  min-width: 10px;
  height: 80px;
*/
  padding:4px;

  margin:2px;
}

.div_duree  {
  position: absolute;
  margin-top: 4px;
  margin-left: 20px;
  font-size:10px;
  background: #000;
  z-index:25;
  padding:0;
}

.img_play {
  position: absolute;
  margin-top: -60px;
  margin-left: 50px;
  z-index:25;
}

.img_preview
{
  position: relative;
  width: 120px;
  height: 90px;
  margin-left: 10px;
}

.nyroYoutube
{
  padding-right:5px;
}

.playlist
{
  display: inline-block;
}

td.mid
{
  padding-left: 5px;
  padding-right: 5px;
}

td.first
{
  padding-left: 5px;
}

td.last
{
  padding-right: 5px;
}

.pub
{
  z-index: 10;
  width: auto !important;
}

.pub a.calque_flash
{
  background-color: #f00;
  opacity:0;
  filter : alpha(opacity=0);
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

.va_top
{
  vertical-align: top;
}

.middle
{
  vertical-align: middle;
}

.td200 {
  width: 200px;
}
.bulle_gmap {
  font-size: 11px;
}
.bulle_gmap a {
  color: #96bd0d;
}