/*
 *      This file is a part of GCweb (unoffical web render for GCstar)
 *      Copyright (c) 2007 Jonas Fourquier <http://jonas.tuxfamily.org> and contributors
 *
 *      GCweb is free software; you can redistribute it and/or modify
 *      it under the terms of the GNU General Public License as published by
 *      the Free Software Foundation; either version 2 of the License, or
 *      (at your option) any later version.
 *
 *      This program is distributed in the hope that it will be useful,
 *      but WITHOUT ANY WARRANTY; without even the implied warranty of
 *      MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *      GNU General Public License for more details.
 *
 *      You should have received a copy of the GNU General Public License
 *      along with this program; if not, write to the Free Software
 *      Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
 */


/*** balise ***/
body {
    font-size: 9pt;
    font-family: sans-serif;
}

h1, h2, h3, h4 {
    width : 100%;
    color : #FFA500;
    margin: 0;
}

h3.aka {
    width:auto
}

a {
    text-decoration: none;
    color : #7A7AFA
}

a:hover {
    color : #5757FA
}

ul {
    margin : 0;
    padding: 0 0 0 .3em;
}

li {
    list-style-type:none;
    padding-left: .9em;
    background-image : url(img/puce.png);
    background-repeat: no-repeat;
    background-position :left .5em;
}

img {
    border:none;
}

img:hover {
    opacity:.8;
}

fieldset {
    border: #E6E6FA 1px solid;
}

legend {
    color : #7A7AFA;
}

table {
    border-collapse: collapse;
}

th, td {
    vertical-align: middle;
}

th {
    color : #FFA500;
    text-align: left;
}

td {
    text-align: left;
    padding-left : 1em;
}

/*** commeun ***/
span.starNote {
    height : 8px;
    width: 80px;
    border: #E6E6FA 1px solid;
}
.star_full, .star_half, .star_empty {
    display:block; float:left;
    height: 8px; width: 0;
}
.star_full  { border-left: 8px #FFCF75 solid; border-right: 8px #FFCF75 solid; }
.star_half  { border-left: 8px #FFCF75 solid; border-right: 8px #FFFFFF solid; }
.star_empty { border-left: 8px #FFFFFF solid; border-right: 8px #FFFFFF solid; }

.strong {
    color:#FFA500;
    font-weight:bold;
}

/*** Apparence des boites type ***/
div.box {
    margin : 10px;
    padding: 10px;
    border: #E6E6FA 1px solid;
    background-color:#FBFBFD;
}

/*** bandeau titre ***/
div#title {
    position:relative
}
#title p {
    padding : 0 30em 0 0;
    margin: 0;
}
#title fieldset#collec-selector {
    position:absolute;
    top:2px; right:10px;
    height: 3em;
}
#collec-selector div {
    display:inline;
}

/*** recherche rapide ***/
#menusearch input, #menusearch select {
    width: 100%;
}



/*** Contenu des page (partie centrale) ***/
div#content {
    position: relative;
}

div.nav{ /*div barre de navigation des item ou des pages */
    width: 100%;
    float: left;
    text-align: center;
}
/*paragraphe dans ces barres*/
.nav p {
    margin : 0 auto;
}

ul#menuAffExport {
    margin: -.5em -.5em 0 0;
    padding: 0;
    float:left;
}

#mosaique ul#menuAffExport {
    float:none;
    text-align:left;
    margin-bottom: 1em;
}

#menuAffExport li.niv1 {
    display:inline;
    background: none;
    padding: 0 .5em;
    position:relative;
}

#menuAffExport .niv1 ul {
    position:absolute;
    display : block;
    visibility: hidden;
    top: 0 ;left: -.8em;
    margin : 1.2em;
    padding: 5px;
    border: #E6E6FA 1px solid;
    background-color:#FBFBFD;
    text-align: left;
    z-index: 5;
    opacity: .9;
}

#menuAffExport .niv1 ul#affichage {
    width: 12em;
}
#menuAffExport .niv1 ul#exportation {
    width: 9em;
}
div.element { /*div contenant l'élément principale de la page (liste item, item ...)*/
    float: left;
    width: 100%;
}
/*** menu ***/

div#menu {
    float: left;
    width: 18em;
}

#menu #search input, #menu #search select{
    width: 100%;
}

#menu .rss a {
    background-image: url(img/rss.png);
    background-position: top left;
    background-repeat:no-repeat;
    padding-left: 16px;
}

.activeSort {
    color:#FFA500;
}

/*** Decalage du contenu pour laisser la place au menu ***/
div#list, div#mosaique, div#onlydesc, div#item, div#cloud, div#search, div#export, div#exportcode {
    margin-left: 18em;
}

/*** message chargement ***/
#chargement {
    text-align: center;
    position: fixed;
    left: 50%; top: 50%;
    margin: -10em;
    width: 20em;
    z-index: 999;
    border: #E6E6FA 1px solid;
    background-color:#FBFBFD;
    opacity: .9;
}


/*** Page d'acceuil ***/

#main div.collecdesc {
    float:left;
    width : 30em;
    margin-right: 1em;
}

#main div.box: {
    overflow:hidden;
    width: 100%;
}

#main .colleclastadd div.img {
    overflow:hidden;
    margin-top: .3em;
    height : 170px;
}

#main .colleclastadd .img div.element {
    float:left;
    width:auto;
    margin-bottom : 200px;
}

#main div#collecfoot {
    clear: both;
}

#main .colleclastadd a.rss {
    background-image: url(img/rss.png);
    background-position: bottom left;
    background-repeat:no-repeat;
    padding: 0 0 0px 16px;
}

#main .colleclastadd .rss span {
    display:none;
}


/*** page de listage ***/

div#list {
    position: static;
}

#list div.element { /* Position des petites boite items */
    width:50%;          /*  permet de modifier le nombre de collonne.
                            100%=1, 50%=2, 33.33%=3, 25%=4*/
}

#list .element div.box {    /* Position dans ces boites */
    height:120px;
    position:relative;
}
#list img.image {
    margin-right:10px;
}

#list div.scroll { /*div contenant le texte a coté de l'image */
    position :relative;
    overflow:hidden; /*auto si on veut un acensseur*/
    height: 120px;
}

#list .lent div.scroll { /*élément emprunté*/
    background-image: url(img/lent_eng.png);
    background-position:100% 0 ;
    background-repeat: no-repeat;
    padding-right: 48px;
}


#list .lent_fr div.scroll { /*élément emprunté*/
    background-image: url(img/lent_fr.png);
}

#list span.starNote {
    height : 8px;
    position: absolute;
    right: 0;
    bottom : 0;
}

span.label {
    min-width : 6.8em;
    margin-right:.2em;
    float: left;
}

span.info {
    padding-left: 7em;
    display:block;
 }

span.info-item {
    margin-left: 8em;
    display:block;
 }

h3.aka {
    margin-left: 10em;
    font-style: italic;
 }


/*** PAGE ITEM ***/

#item div.navitem {
    text-align: center;
}

#item .element .box span.image {
    margin:15px;
    float:right;
    position: relative;
}

#item .element .box .image .backpic {
    position: absolute;
    bottom : 0; right: 0;
    font-size: 200%;
    background-color:#FBFBFD; opacity: .8;
}

#item .element h2 {
    text-align: justify;
    margin : 0 0 .6em 0;
}

#item .element p.description {
    text-align: justify;
    margin : 0 0 1em 0;
}

#item .element span.starNote {
    float: right;
}

#item .lent .box span#lent {
    float:right;
    margin: 0 0 10px 10px;
    height:29px; width: 29px;
    background-image: url(img/lent_eng.png);
    background-repeat: no-repeat;
}

#item .lent_fr .box span#lent {
    background-image: url(img/lent_fr.png);
    height:34px; width: 33px;
}

#item h3 {
    margin-top: 2em;
}

.foot {
    clear: both;
}

/*lien imdb, 3 varianteq*/

/* 1) texte entourner de jaune*/
/*
a#imdb_link {
    font-size: 90%;
    font-weight: bold;
    letter-spacing:-.1em;
    color:black;
    background-color: #EFDC3D;
    padding: 2px 4px;
    border-radius : 5px;
}
*/

/* 2) image */
a#imdb_link {
    position:absolute;
    height:16px;
    width:33px;
    background-image: url(img/imdb.gif);
    background-repeat:  no-repeat;
    background-position: center center;
    text-indent:-999em;
    margin-left: .2em;
    border-width: 0;
}

/* 3) texte simple, commentez le tout*/

/* Eclaircire le lien au passage de la souris (utile pour variante 1 et 2)*/
a#imdb_link:hover {
    opacity: .8;
}


/*** PAGE CODE EXPORT ***/
#exportcode textarea {
    font-size: 60%;
    height: 100em;
}


/*** Page de recherche ***/
#search input, #search select{
    width: 10em;
}

#search textarea {
    width : 95%;
    height: 10em;
}


div.infocache {
    border: solid 1px #FFA500;
}

#list img.image {
    float:left;
}

/*** mosaique ***/
#mosaique .box div.element {
    border:black solid 1px;
    width: auto;
    padding:0;
    margin-right: -1px;
    margin-bottom: -1px;
    float:left;
    overflow: hidden;
    text-align: center;
}


#mosaique span.image {
    display:block;
    background-color:#FFF;
    width:auto;
}

#mosaique .lent span.image {
    opacity: .3;
}

/*fond derrière l'image si pas asser large */
#mosaique .image a {
    display:block;
    background-color:#000;
}

#mosaique .image a:hover {
    opacity: .8;
}

div.legend {
    text-align: left;
    position:absolute;
    visibility: hidden;
    margin : 10px;
    padding: 10px;
    border: #E6E6FA 1px solid;
    background-color: #FFF;
    opacity: .9;
    z-index:5;
}

/*** Liste description ***/
#onlydesc table {
    clear: both;
    width: 100%;
    margin:1em 0 0 0;
    border: 1px solid #E6E6FA;
    position:relative;
}

#onlydesc th, #onlydesc td {
    border: #B9B9FA 1px solid;
    padding: .5em;
}

#onlydesc .title th, #onlydesc .title td {
    border : #B9B9FA 1px solid;
    background-color: #F0F0FA;
    color : #FFA500;
}

#onlydesc .line_paire th, #onlydesc .line_impaire th  {
    text-align: left;
}

#onlydesc .line_paire {
    background-color: #F5F5FA;
}

#onlydesc .lent .title:after, #mosaique .lent .legend h3:after {
    content:"(lent)";
    color: #FFA500;
    font-weight:normal;
    margin-left: 1em;
}

#onlydesc .lent_fr .title:after, #mosaique .lent_fr .legend h3:after {
    content:"(prêté)";
}

#onlydesc span.image {
    float:left;
    position:relative;
    margin-top: -2em;
    right: 1em;
    visibility:hidden;
}
#onlydesc img {
    position: absolute;
    top:-1.5em; right:0;
    /*visibility:hidden;*/
    z-index: 5;
}

#onlydesc span.aka {
    display:block;
    font-weight:normal;
    margin-left: 2em;
    font-style: italic;
}


/*** Apparence nuage ***/
.cloud1 {color: #9999FA; font-size:80% }
.cloud2 {color: #9999FA; font-size:90% }
.cloud3 {color: #9999FA; font-size:100%}
.cloud4 {color: #9999FA; font-size:110%}
.cloud5 {color: #9494FA; font-size:120%}
.cloud6 {color: #8F8FFA; font-size:130%}
.cloud7 {color: #8A8AFA; font-size:140%}
.cloud8 {color: #8585FA; font-size:150%}
.cloud9 {color: #8080FA; font-size:160%}
.cloud10{color: #7A7AFA; font-size:170%}

.cloudTitle {font-size:120%; text-align:center;}

/*** bandeau de pied de page ***/
div#foot {
    float:left;
    width:100%;
    clear: both;
    position:relative;
}
#foot p {
    margin: .5em 0;
}
#foot div.left {
    margin-right: 200px;
}
#foot div.right {
    position : absolute;
    right: 25px;
    bottom: 20px;
}

/*** message d'erreur ***/
div#error {
    border-color : red;
    background-color: #FFA6A6;
    position:absolute;
    width: 40%;
    left: 30%;
    top: 10em;
    z-index: 10;
    opacity: .9;
}