/*******
 ******* Incity CSS
 *******/
 
 
/*******
 ******* reset
 *******/
 * {
  margin:0; padding:0;
  border: none; color: #303030;
  font-size: 1em; line-height: 1em; font-weight: normal; text-decoration: none; font-family: Arial, Helvetica, sans-serif;
}
strong {font-weight: bold;}
a img.fancybox {border:5px solid  #DDDDDD;}
a:hover img.fancybox {border:5px solid #FFFFFF;}
/*******
 ******* Body / Html
 *******/
html {width: 100%; height: 100%; line-height: 0em; font-size: 0em;}
body {width: 100%; height: 100%; font-size: 10px; position: relative;}
body.flash {overflow:hidden;}

/*******
 ******* Containers
 *******/
#container {width: 100%; height: 100%; position: absolute; background-color: transparent;}
#background {width: 100%; height: 100%; position: absolute; overflow:none; background-color: transparent; overflow:hidden;}
#background img {display:block; position: absolute;}

/*******
 ******* Navigation
 *******/
#navigation {
  height: 170px; width: 100%; position: absolute; bottom: 0px; left: 0px;
  background: transparent url(../img/bg/navigation-bg.png) repeat-x bottom center;
}
#navigation .wrapper {width: 900px; height: 170px; margin:auto; position: relative; }

/*******
 ******* Logo
 *******/
h1 {
   width: 110px; height: 170px; float: right;
}
h1 a {
   width: 110px; height: 170px; display:block; outline: none;
   text-indent: -99999px;
   background: transparent url(../img/interface/logo.png) no-repeat 0px 15px;
}
h1 a:hover {
   width: 110px; height: 170px; display:block; outline: none;
   text-indent: -99999px;
   background: transparent url(../img/interface/logo.png) no-repeat 0px bottom;
}

/*******
 ******* Carrousel vidéos
 *******/
#videos {height: 140px; padding-top: 20px; float: right; padding-right: 50px;}
#videos h2 {height: 25px; color:#e7c268; font-size: 1.2em; text-transform: uppercase; padding-left: 50px; width: 150px; }
#videos p {margin-top: 20px;}
#videos p a {display: block; width: 40px; height: 40px; text-indent: -99999px; background: transparent url(../img/interface/pictos_videos.png) no-repeat top left; overflow:hidden;}
#videos p.prev a {background-position: top left;}
#videos p.prev a:hover {background-position: bottom left;}
#videos p.next a {background-position: top right;}
#videos p.next a:hover {background-position: bottom right;}
#videos ul {
  height: 125px;  padding: 0px;
}
#videos ul li {
	height: 120px; position: relative;
	float:left; list-style-type: none;
	margin-right: 4px; margin-left: 3px;
	text-align: center;
	color: #FFFFFF; text-transform: uppercase; font-size: 1.2em; line-height: 1.7em;
}
#videos ul li a {color: #FFFFFF;}
#videos ul li a img {display: block; padding: 3px;}
#videos ul li a:hover, #videos ul li a.over{color:#faa61a;}
#videos ul li a:hover img {border: 3px solid #faa61a; padding: 0px;}
#videos p, #videos ul, #videos .carrousel{float: left;}
#videos .carrousel {
  border-left: 1px solid #878887; border-right: 1px solid #878887;  padding: 0px 5px;
}



/*******
 ******* Menu de navigation
 *******/
#menu {
	height: 170px; width: 160px; float:right;
	position: relative;
}
#menu ul {height: auto; width: 160px; position:absolute; bottom:30px;}
#menu ul li {height: 27px; width: 160px; list-style: none; border-top: 1px solid #4e4949; position: relative; }
#menu ul li a {
	width: 140px; height: 19px; display: block;
	padding: 8px 20px 0 0;
	background: transparent url(../img/bg/black-60.png) repeat top left;
	font-size: 1.2em; text-align: right;color: #FFFFFF; text-transform: uppercase;
}
#menu ul li a:hover {background-image: url(../img/bg/beige-75.png);}
#menu li img {display:none; position: absolute; right: 4px; top:9px; }
#menu li.actif img {display:block;}
#menu li.actif a {background-image: url(../img/bg/beige-75.png);}





/*******
 ******* Sous Menu de navigation
 *******/
.ssmenu {
	height: auto; width: 200px; position: absolute; bottom: 170px; left:174px;
}
.ssmenu li {height: 27px; width: 200px; list-style: none; border-top: 1px solid #c6bab7; position: relative;}
.ssmenu li a {
	width: 170px; height: 19px; display: block;
	padding: 8px 20px 0 10px;
	background: transparent url(../img/bg/white-80.png) repeat top left;
	font-size: 1.2em; text-transform: uppercase;
}
.ssmenu li a:hover {color: #FFFFFF; background: transparent url(../img/bg/beige-75.png) repeat top left;}
.ssmenu li img {display:none;position: absolute; right: 4px; top:9px;}
.ssmenu li.actif img {display:block;}





/*******
 ******* Actualités
 *******/
#news {
	width: 500px; height: auto;
	position: absolute; bottom: 200px; left: 50%;
}
#news h2 {
	width: 150px;
	padding: 10px;
	padding-bottom: 9px;
	margin-bottom: 1px;
  background: transparent url(../img/bg/black-60.png) repeat top left;
  color: #e7c268; font-size: 1.2em; text-transform: uppercase;
}
#news h3 {
	color: #937957; font-size: 1.7em; font-weight: bold;
  padding: 5px 10px;
}
#news h4 {
  font-size: 1em; padding:0px 10px 0px 10px; font-weight: normal;
}
#news div.wrapper {
  background: transparent url(../img/bg/white-80.png) repeat top left;
  padding:0px;
}
#news div {
	width: auto; height: auto; min-height: 135px;
	float:left; position: relative;
}
#news div p {padding:10px; width: 230px; font-size: 1.1em; font-weight: bold; margin-bottom: 60px;}
#news div p.liens {position: absolute; bottom: 0px;padding:0px;  font-size: 1.2em; margin-bottom: 0px;}
#news div p.liens a {
	width: 230px;
	display:block;
	font-weight: normal; text-transform: uppercase;
	border-bottom: 1px solid #bdbbb9;
	padding: 0px 0px 5px 10px; margin-bottom: 10px;
}
#news div p.liens a:hover {border-bottom-color: #faa61a; color: #faa61a;}
#news .visuel  {float:left;margin:10px; width: 155px; height: 85px; overflow: hidden; min-height: 85px; position: relative;}
#news .visuel img  {width:155px; position:absolute;}




/*******
 ******* Liste des actualités
 *******/
#news-liste {
	width: 500px; height: auto;
	position: absolute; bottom: 200px; left: 50%;
}
#news-liste h2 {
	width: 150px;
	padding: 10px;
	padding-bottom: 9px;
	margin-bottom: 1px;
  background: transparent url(../img/bg/black-60.png) repeat top left;
  color: #e7c268; font-size: 1.2em; text-transform: uppercase;
}
#news-liste div.wrapper {
  display: block;
  background: transparent url(../img/bg/white-80.png) repeat top left;
  padding:0px;
  position: relative;
  width: 500px;
}
#news-liste div {
	width: auto; height: auto; min-height: 100px;
	float:left; position: relative;
}
#news-liste div h3 {
  font-size: 1.3em;   padding:10px 10px 0px 10px;            font-weight: bold;
}
#news-liste div h3 a:hover {
  text-decoration: underline;
}
#news-liste div h4 {
  font-size: 1em;   padding:0px 10px 0px 10px;            font-weight: normal;
}
#news-liste div p {padding:10px; width: 305px; font-size: 1.1em; font-weight: bold; margin-bottom: 50px;}
#news-liste div p.liens {position: absolute; bottom: 0px;padding:0px;  font-size: 1.2em; margin-bottom: 0px;}
#news-liste div p.liens a {
	width: 300px;
	display:block;
	font-weight: normal; text-transform: uppercase;
  border-bottom: 1px solid #bdbbb9; border-top: 1px solid #bdbbb9;
	padding: 10px 0px 10px 10px; margin-bottom: 10px;
}
#news-liste div p.liens a:hover {border-color: #faa61a; color: #faa61a;}
#news-liste .visuel  {float:left;margin:10px; width: 155px; height: 85px; overflow: hidden; min-height: 85px; position: relative;}
#news-liste .visuel img  {width:155px; position:absolute;}
#news-liste .navigation {position: absolute; top: 33px; left: 501px; width: 35px; height: 72px;}
#news-liste .navigation p {width: 35px; height: 35px; margin: 0; padding: 0; margin-bottom: 1px;}
#news-liste .navigation p a {overflow: hidden; display:block; width: 35px; height: 35px; text-indent: -99999px; background: transparent url(../img/interface/pictos_actualites.png) no-repeat top left;}
#news-liste .navigation p.next a {background-position: bottom left;}
#news-liste .navigation p.prev a:hover {background-position: top right;}
#news-liste .navigation p.next a:hover {background-position: bottom right;}



/*******
 ******* Introduction à un article
 *******/
#intro {
	width: 500px; height: auto;
	position: absolute; bottom: 200px; left: 50%;
}
#intro h2 {
	width: 150px;
	padding: 10px;
	padding-bottom: 9px;
	margin-bottom: 1px;
  background: transparent url(../img/bg/black-60.png) repeat top left;
  color: #e7c268; font-size: 1.2em; text-transform: uppercase;
}
#intro div.wrapper {
  background: transparent url(../img/bg/black-60.png) repeat top left;
  padding:0px;
}
#intro div {
	width: auto; height: auto; min-height: 135px;
	float:left; position: relative;
}
#intro div p {color: #FFFFFF;  padding:10px; width: 230px; font-size: 1.1em; font-weight: bold; margin-bottom: 45px;}
#intro div p.liens {position: absolute; bottom: 0px;padding:0px;  font-size: 1.2em; margin-bottom: 0px;}
#intro div p.liens a {
width: 230px;
color: #FFFFFF; display:block;  font-weight: normal; text-transform: uppercase;
padding: 10px 0px 10px 10px; margin-bottom: 10px;
border-bottom: 1px solid #bdbbb9; border-top: 1px solid #bdbbb9;
}
#intro div p.liens a:hover {
border-color: #faa61a;
color: #faa61a;
}
#intro img.visuel  {display: block; float:left;margin:10px; width: 155px; height:auto;}




/*******
 ******* Article
 *******/
#article {
	width: 565px; height: 345px;
	position: absolute; bottom: 200px; left: 45%;
	background: transparent url(../img/bg/white-80.png) repeat 0px 0px;
	padding: 15px;
}
#article .arianne a:hover {
  text-decoration: underline;
}
#article h2{
  font-size: 4em;
  padding: 5px;
}
#article h3 {
	color: #937957; font-size: 1.7em; font-weight: bold;
  padding: 5px;
}
#article h4 {
  font-size: 1em; padding:5px; font-weight: normal;
}
#article .wrapper {
	height: auto;width: 545px;
	font-size: 1.2em;
	margin: 10px;
	position: relative;
}
#article .wrapper .scroll {
	height: 225px;width: 545px;
	position: absolute;
	outline: none;
}
#article .wrapper .jScrollPaneContainer {
	outline: none;
	float: left;
}
#article .wrapper p {
  margin-bottom: 10px;
}
#article .wrapper ul {
  margin-bottom: 10px;
  padding-left: 20px;
  list-style: square outside;
}
#article .wrapper ol {
  margin-bottom: 10px;
  padding-left: 20px;
  list-style: decimal outside;
}
#article .wrapper ul li, #article .wrapper ol li {
 padding: 5px 0 5px 0;
}
#article .back {
  position: absolute;
  font-size: 1.5em;
  text-align: right;
  top: 10px; right: 10px;
}
#article .back a:hover {
  text-decoration: underline;
}
#article p.legende {
  text-align: center;
  padding: 5px;
  width: 480px;
  position: relative;
  margin: 0 auto;
  font-style: italic;
  top: -10px;
  background-color: #DDDDDD;

}
#article p.float img {
  margin: 10px;
}

#article .navigation {position: absolute; top: 0px; left: 596px; width: 35px; height: 72px;}
#article .navigation p {width: 35px; height: 35px; margin: 0; padding: 0; margin-bottom: 1px;}
#article .navigation p a {overflow: hidden; display:block; width: 35px; height: 35px; text-indent: -99999px; background: transparent url(../img/interface/pictos_actualites.png) no-repeat top left;}
#article .navigation p.next a {background-position: bottom left;}
#article .navigation p.prev a:hover {background-position: top right;}
#article .navigation p.next a:hover {background-position: bottom right;}



#article table tr td{
  background-color: #DDDDDD;
}


/*******
 ******* Video d'intro
 *******/
#videoIntro {
	width: 100%; height: 100%;
	overflow: hidden;

}



/*******
 ******* Footer (mentions légales et crédits)
 *******/
#footer {
  position: absolute; bottom: 9px; left: 10px;
}
#footer p a {
  color: #DDDDDD;
}
#footer p a:hover {
  text-decoration: underline;
}


#navigation .player {display: none;}
.player_video {}
.player {outline:none;}



/*******
 ******* Overlay
 *******/ /*
.player {
    display:none;
    z-index:10000;
    background-color:#FFF;
    width:675px;
    min-height:200px;
    border:1px solid #666;
    -moz-box-shadow:0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
}
.player .close {
    background-image: url(../img/interface/fancybox/fancy_close.png);
    position:absolute;
    right:-15px;
    top:-15px;
    cursor:pointer;
    height:30px;
    width:30px;
}*/



/*******
 ******* Easy clearing
 *******/
 #news:after,
 li.wrapper:after,
 #navigation .wrapper:after,
 #videos:after,
 #videos ul:after {
    content: ".";
    display: block;
    height: 0;
    overflow: hidden;
    clear: both;
    visibility: hidden;
}