/* Feuille de style du site Autres Mondes - part 01 -> layout general */
/* author : cezarion.net */

/* General style */

* {
    margin:0pt;
    padding:0pt;
}

body {
    background:#335c73 url(../images/bg_rayure_bande.png) repeat scroll center top;
    color:#333333;
    font: 12px "Trebuchet MS",Verdana,"Lucida Grande",Tahoma,Helvetica,Sans-Serif;
    margin:0;
    padding:0;
}

/* Navigation ***********************************************************************/

#navigation-container {
    width:100%;
    position : absolute;
    top : 359px;
    z-index:210;
}
/*correction por safari 3 */
html[xmlns*=""] body:last-child #navigation-container {
    top : 360px;
}

#navigation-container #navigation {
    width: 900px;
    height: 33px;
    margin:0px auto;
    color:#FFFFFF;
    padding : 0 0 0 8px;
}

/* Menu d�roulant *****************************************/

#navigation .dropdown-left, #navigation .dropdown-right {
    float:left;
    width:110px;
    height:33px;
    margin:0;
    padding:0;
}

#navigation .dropdown-left a, #navigation .dropdown-right a, #navigation .dropdown dt a {
    text-decoration : none;
    width:110px;
    height:33px;
    color:#FFFFFF;
    display:block;
}
#navigation .dropdown-left a {
    background:transparent url(../images/menu_left.gif) no-repeat scroll 0px 0px;
}

#navigation .dropdown-left a:hover  {
    color : #0099cc;
    background:transparent url(../images/menu_left.gif) no-repeat scroll 0px -33px;
}

#navigation .dropdown-right a {
    background:transparent url(../images/menu_right.gif) no-repeat scroll 0px 0px;
}

#navigation .dropdown-right a:hover {
    color : #0099cc;
    background:transparent url(../images/menu_right.gif) no-repeat scroll 0px -33px;
}


#navigation dl {
    cursor:default;
}

#navigation .dropdown {
    float:left;
    width:135px;
    height:33px;
    background:transparent url(../images/menu_onglet.png) no-repeat scroll 0px 0px;
}

#navigation .dropdown dt, #navigation .dropdown-left dt, #navigation .dropdown-right dt {
    height:33px;
    text-align:center;
    font-weight:bold;
    line-height:28px;
}


#navigation .dropdown-left:hover {
    background:transparent url(../images/menu_left.gif) no-repeat scroll 0px -33px;
}

#navigation .dropdown-right:hover	{
    background:transparent url(../images/menu_right.gif) no-repeat scroll 0px 0px;
}

#navigation .dropdown dd {
    position:absolute;
    overflow:hidden;
    width:137px;
    display:none;
    background-color:#b9d6dc;
    z-index:200;
    opacity:0;
}

#navigation .dropdown ul {
    width:135px;
    border:1px solid #9ac1c9;
    list-style:none;
    border-top:none;
    line-height:12px;
}

#navigation .dropdown a {
    display:inline;
}

#navigation .dropdown  a, #navigation .dropdown a:active, #navigation .dropdown a:visited {
    display:block;
    padding:5px;
    color:#266A82;
    text-decoration:none;
    background-color:#eaf0f2;
    width:125px;
}


#navigation .dropdown a:hover {
    background-color:#d9e1e4;
    color:#18435C;
}
#navigation .dropdown .underline {
    border-bottom:1px solid #b9d6dc;
}

#navigation .dropdown dt a,
#navigation .dropdown dt a:active,
#navigation .dropdown dt a:visited ,
#navigation .dropdown dt a:hover,
#navigation .dropdown dt a:link
{
    background:transparent none repeat scroll 0 0;
    color:#FFFFFF;
    display:block;
    height:22px;
    line-height:1.6em;
    width:125px;
}

#navigation .dropdown dt a:active,
#navigation .dropdown dt a:hover
{
    color: #0099cc;
}

/* Page holder ***********************************************************************/
#main-container {
    width: 100%;
    min-height: 800px;
    margin: 0;
    background:transparent url(../images/bg.png) no-repeat scroll center top;
}

/*pour bloquer le menu*/
#spacer {
    height:338px;
    width: 940px;
    margin: 0px auto;
    padding:0;
}
/*inter bloc*/
.spacer {
    height:8px;
    width: auto;
    margin: 0px auto;
    padding:0;
}
/* Header ***********************************************************************/
#header {
    height:63px;
    width: 940px;
    margin: 0px auto;
    padding:0;
}
/* Correctif ie 6*/
div#header  {
    height:63px;
    width: 940px;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/assets/autresmondes/images/nav_bg.png', sizingMethod='crop');
}

html>body #header  {
    filter: none;
    background:transparent url(../images/nav_bg.png) no-repeat scroll 0% 0%;
}

/* Content holder ***********************************************************************/

#body-container {
    width: 940px;
    min-height: 500px;
    margin: 0px auto;
    z-index:0;
}
/* Correctif ie 6*/
div#body-container {
    width: 940px;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/assets/autresmondes/images/content_bg.png', sizingMethod='scale')
}

html>body #body-container  {
    filter: none;
    background:transparent url(../images/content_bg.png) repeat-y scroll 0% 0%;
}

/* Content (contenu de la page) ***********************************************************************/

#content {
    width:890px;
    margin : 0px 23px 0px 27px;
    padding:0 0 5px;
    overflow:hidden;
    z-index:10;
    position:relative;
}


/* Footer ***********************************************************************/
#footer {
    width: 940px;
    height: 70px;
    overflow: hidden;
    margin: 0 auto 10px;
}

/* Correctif ie 6*/
div#footer {
    width: 940px;
    height: 70px;
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/assets/autresmondes/images/footer_bg.png')
}

html>body #footer {
    filter: none;
    background:transparent url(../images/footer_bg.png) no-repeat scroll center top;
}

/*Pager**********************************/
#pager-box {
    height:20px;
    margin:0 auto;
    width:500px;
}
table#pager {
    height:25px;
    margin:4px auto 0;
    position:absolute;
    width:500px;
}

#pager .pager_link{
    background:transparent url(../images/pager_bg.jpg) repeat-x scroll left top;
}

#pager a.bt_left, #pager a.bt_right {
    width:55px;
    height:30px;
    display:block;
}

#pager a.bt_left {
    background:transparent url(../images/pager_but_g.jpg) no-repeat scroll left top;
}

#pager a:hover.bt_left {
    background:transparent url(../images/pager_but_g.jpg) no-repeat scroll left -30px;
}

#pager a.bt_right {
    background:transparent url(../images/pager_but_d.jpg) no-repeat scroll right top;
}

#pager a:hover.bt_right {
    background:transparent url(../images/pager_but_d.jpg) no-repeat scroll right -30px;
}

#pager .pager_link span {
    color:#333333;
    text-align:center;
    padding:0 5px;
}

#pager .pager_link a {
    color:#34819b;
    padding:0 5px;
}

#pager .pager_link a:hover {
    color:#0d485c;
}


/*JQUERY CSS**********************************/

/* affiche les blocs masqu�s pour jquery ************/
#showBox .tabContent {
    display:block;
}

/*->fond ecran */
#ImageBoxOverlay
{
    background-color: #000;
    z-index:900;
}

#ImageBoxOuterContainer {
    z-index:901;
}

#ImageBoxCaption
{
    background-color: #F4F4EC;
}
#ImageBoxContainer
{
    width: 250px;
    height: 250px;
    background-color: #F4F4EC;
}
#ImageBoxCaptionText
{
    font-weight: bold;
    padding-bottom: 5px;
    font-size: 13px;
    color: #000;
}
#ImageBoxCaptionImages
{
    margin: 0;
}

#ImageBoxNextImage
{
    background:transparent url(../images/spacer.gif) no-repeat right 50%;
    z-index:991;
}

#ImageBoxPrevImage
{
    background:transparent url(../images/spacer.gif) no-repeat left 50%;
    z-index:990;
}

#ImageBoxNextImage:hover
{
    background:transparent url(../images/imagebox_next_image.jpg) no-repeat right 50%;
}

#ImageBoxPrevImage:hover
{
    background:transparent url(../images/imagebox_prev_image.jpg) no-repeat left 50%;
}

/* -> rough */

.slider1
{
    width: 5px;
    height: 500px;
    background-color: #e7e7e7;
    position: absolute;
    cursor:pointer;
}

.indicator
{
    width: 5px;
    height: 10px;
    background-color: #266A82;
    position: absolute;
    font-size: 1px;
    overflow: hidden;
}

.gallery_liste_container
{
    height:515px;
    overflow:hidden;
    padding:1px;
    position:relative;
    width:240px;
}	

.gallery_liste_content
{
    position:absolute;
}

#main_image {
    height:514px;
    width:600px;
}

.caption{
    color:#888;
    position:absolute;
    top:250px;
    left:3px;
    width:200px;
    position:relative;
    margin-top:2em;
}

.demo {
    margin:30px 0 0 0;
}	

.nav{
    padding: 0 0 15px;
    clear:both;
    float:right;
    display:block;
    width:150px;
    text-align:right;
    margin:0 234px;
    display:none;
}

.info{
    text-align:left;
    margin:30px 0;
    border-top:1px dotted #221;
    padding-top:30px;
    clear:both;
}

.info p{
    margin-top:1.6em;
}


.gallery_demo{
    width:250px;
    float:left;
    border:1px solid #e7e7e7;
}

.galleria_wrapper {

    width:600px;
    height:514px;
}

.galleria_wrapper img {
    margin : auto;
}

.gallery_demo li{
    width:55px;
    height:70px;
    border:1px solid #ffffff;
    margin: 5px;
    background-color:transparent;
}

.gallery_demo li.hover{
    border-color:#e7e7e7;
}

.gallery_demo li.active{
    border-style:solid;
    border-color:#e7e7e7;
}

.gallery_demo li div{
    left:240px
}

.gallery_demo li div .caption{
    font:italic 0.7em/1.4 georgia,serif;
}

.galleria_container{
    float:right;
    height:514px;
    margin:0 auto 10px;
    width:600px;
}

ul.galleria{
    list-style:none;
    width:240px;
}

.galleria #deb{
    background:transparent url(../images/bg_white_top.gif) repeat-x scroll left top;
    border-color:#e7e7e7;
    border-style:none none solid;
    border-width:medium medium 1px;
    clear:both;
    color:#266A82;
    font-size:11px;
    font-weight:bold;
    height:25px;
    line-height:25px;
    margin:0 0 2px;
    text-transform:uppercase;
    width:240px;
}

.galleria li{
    display:block;
    width:58px;
    height:50px;
    overflow:hidden;
    float:left;
    margin:3px;
}
.galleria li a{
    display:none;
}

.galleria li div{
    position:absolute;
    display:none;
    top:0;
    left:180px;
}

.galleria li div img{
    cursor:pointer;
}

.galleria li.active div img,.galleria li.active div{
    display:block;
}

.galleria li img.thumb{
    cursor:pointer;
    top:auto;
    left:auto;
    display:block;
    width:auto;
    height:auto;
}
.galleria li .caption{
    display:block;
    padding-top:.5em;
}
* html .galleria li div span{
    width:400px;
} /* MSIE bug */