@charset "utf-8";
/* CSS Document */

body{font:11px arial; color:#999; background-image:url(../img/fons.jpg); margin:0; padding:0;}


#menu, #menu-home, #main, #main-index{margin:0 auto; position:relative; width:920px;}
#main, #main-index{  padding:30px 0;}
#main{background-image:url(../img/bkg-main.png); background-repeat:repeat-y; min-height:685px;}
#main-index{padding:20px 50px; width:820px;background-image:url(../img/bkg.png);}


/*Menu*/
#menu-home, #menu{background-image:url(../img/fons_menu.gif); background-repeat:no-repeat; height:158px;}
#menu-home{height:17px;}
#menu-home *{display:none;}

a#home{position:absolute; top:12px; left:20px; width:120px; height:70px; display:block;}

#menu-esq{background-image:url(../img/jaume.gif); width:155px; background-repeat:no-repeat; background-position:top center; float:left; margin-right:12px;}
#menu-esq  a#tornar{position:absolute; top:25px; left:8px; width:135px; height:80px;}
#menu-esq ul{padding:0px 12px; margin-left:10px; margin-top:120px; list-style:none; }
#menu-esq ul li{margin-bottom:8px; }
#menu-esq ul li,#menu-esq ul li a.menu{font-size:17px; margin:0; padding:0; color:#ccc; font-weight:bold;}
#menu-esq ul li a.actiu, #menu-esq ul li.actiu a{color:#999;}
#menu-esq ul li ul{padding:0; margin:0; display:none;}
#menu-esq ul li.actiu ul{display:block;}
#menu-esq ul li ul li{padding:4px 0;border-top:1px solid #ccc;font-size:10px; }
#menu-esq ul li ul li a{font-size:10px; text-transform:uppercase; color:#ccc;}
#menu-esq ul li ul li a:hover{color:#999;}
#menu-esq ul li ul li a.actiu, #menu-esq ul li ul li.actiu a{text-decoration:line-through; color:#ccc;}

/*Top dades*/
#top-dades{position:absolute; bottom:12px; width:150px; text-align:center; padding:0 12px; }
#top-dades span{background-color:#000; font-size:11px; padding:4px; color:#ccc; font-weight:bold; line-height:26px;}

/*Banner*/
#main-index #banner{padding-bottom:10px; border-bottom:1px solid #999; border-bottom:1px solid #999;}

#flash{position:absolute; top:0; left:9px;}

/*Botons esquerra*/
#btn-ilustracio, #btn-varis{position:absolute; left:0;  width:38px;}
#btn-ilustracio{height:120px; top:82px; background-image:url(../img/btn_ilustracions.png); background-repeat:no-repeat;}
#btn-varis{height:120px; top:200px; background-image:url(../img/btn_varis.png); background-repeat:no-repeat;}
#btn-varis:hover, #btn-ilustracio:hover{background-position:0 bottom;}
#btn-varis.actiu, #btn-ilustracio.actiu{background-position:0 center;}

/*Continguts*/
#main-index #cont{margin-top:10px; width:900px;}
#cont{margin-top:10px;  float:left; width:710px;}


/*Llista de projectes home*/

#main #cont ul,#main-index ul{margin:0; padding:0; list-style:none;}
#main #cont ul{padding-left:60px;}
#main #cont ul li,#main-index ul li{width:194px; height:135px; float:left; margin-left:8px; margin-bottom:8px; position:relative;}
#main #cont ul li:first-child,#main #cont  ul li.nml,#main-index ul li:first-child,#main-index  ul li.nml{margin-left:0;}
#main #cont ul li .proj-info,#main #cont ul li .proj-info-new,#main-index ul li .proj-info-new,#main-index  ul li .proj-info{background-image:url(../img/quadre_gris.png); background-repeat:no-repeat; width:184px; height:125px; background-color:#999; position:absolute; top:0; display:none; padding:5px;}
#main #cont ul li .proj-info-new,#main-index ul li .proj-info-new{background-image:url(../img/quadre_gris_new.gif);}


#main #cont ul li div.proj-info,#main-index ul li div.proj-info{}
#main #cont ul li div.proj-info-new,#main-index ul li div.proj-info-new,#main-index  ul li div.proj-info a span{background-color:#000; color:#999; position:absolute; bottom:-6px; text-align:center;}

/*Llista fotos - projecte fitxa*/

#cont .unit-projecte{margin-left: 18px;}

#cont ul#fotos{padding:0;}
#cont ul#fotos li{width:100%; margin-left:8px; margin-bottom:8px; position:relative; float:none; text-align:center; list-style:none; height:auto;}

#cont #controls{position:absolute; width:35px; min-height:200px; top:50px; right:-26px;}

#cont #controls #zoom,
#cont #controls #info,
#cont #controls #seguent,
#cont #controls #anterior {display:block; width:35px; height:38px; background-position:top; margin-bottom:2px;}

#cont #controls #seguent{background-image:url(../img/menu_adelante.png); background-repeat:no-repeat;}
#cont #controls #anterior{background-image:url(../img/menu_atras.png); background-repeat:no-repeat;}
#cont #controls #info{background-image:url(../img/info_btn.png); background-repeat:no-repeat;}
#cont #controls #zoom{background-image:url(../img/lupa.png); background-repeat:no-repeat;}

#cont #controls #info:hover,
#cont #controls #zoom:hover,
#cont #controls #seguent:hover,
#cont #controls #anterior:hover{background-position:bottom;}
#cont #controls a.actiu{background-position:center;}

/*Informacio de les fotos*/
#info-cont{position:absolute; top:51px; right:9px; width:220px; min-height:220px; background-color:#fff; font-size:11px;}
#info-cont div{width:200px; padding:0 10px;}
#info-cont strong, #info-cont h2{color:#000;}
#info-cont h2{font-size:22px;}

/*Peu*/
#peu{font-weight:bold; color:#fff;  margin:0 auto; width:920px; height:37px; background-image:url(../img/peu.png); background-repeat:no-repeat; }
#peu p{margin:0; padding:7.5px 50px;}

/*Altres*/
.cb{clear:both}
.fl{float:left;}
a{color:#fff; text-decoration:none;}
a img{border:0;}
.inv{display:none;}

.nml{margin-left:0;}



.centrat{margin-left:40px;}


#cont ul#projectes-llista li{
    float:left;
    padding: 0px 0px 0px 0px;
    width: 194px;
    background: url(../img/quadre_gris.png);
    background-repeat: no-repeat;
}
#cont ul#projectes-llista li.new{
    background: url(../img/quadre_gris_new.gif);
}


#cont ul#projectes-llista li a {
    display: block;
    position: relative;
    overflow: hidden;
    width: 194px;
    height: 135px;
    color: #FFF;
    text-decoration: none;
    padding: 0px 0px 0px 0px;

}

#cont ul#projectes-llista li a:focus, #cont ul#projectes-llista li a:hover { text-decoration: none; color: #FFF; }

#cont ul#projectes-llista li img {
    position: absolute;
    top: 0;
    left: 0;
    width: 194px;
    height: 135px;

}

#cont ul#projectes-llista p {
    color: #535353;
    font-size: 12px;

}



.project {

    display: block;
    margin: 7px 0px 0px 7px;

}

.client {

    display: block;
    margin: 7px 0px 0px 7px;

}

.titlethumb {

    font-size: 24px;
    text-transform:uppercase;
    color:#999;
    width:190px;
    padding:4px;
    display: block;
    margin-top:0px;
    line-height: 25px;

}


.title {

    font-size: 30px;
    line-height: 28px;
}


/*Zoom*/
div.zoomdiv {
z-index                 : 100;
position                : absolute;
top						:0px;
left					:0px;
width                   : 200px;
height                  : 200px;
background: #ffffff;
border:1px solid #CCCCCC;
display:none;
text-align: center; 
overflow: hidden;

}


img.jqzoom{
cursor:crosshair;


}