/* 
    Document   : laroca
    Created on : 18-feb-2009, 23:03:24
    Author     : Muser
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

/*

Paleta de colors

#000099 - blau

#222222 - negre

#6a2a48 - lila

#bbbcb7 - gris

#dddddd - gris clar

#fdfaf3 - rosa clar

#ffffff - blanc

*/

body
{
    background: url(../img/background.jpg) #EBEDE4 repeat-x left top;
}

div#wrapper-all
{
    background: url(../img/laroca_fons.jpg) no-repeat 0 0;
}

div#header
{

}

a#logo-laroca
{
    background: url(../img/laroca_logo.png) no-repeat 70px 10px;
    display: block;
    height: 100px;
    width: 350px;
}

ul#idiomes-nav
{
    margin: 0;
    list-style-type: none;
    margin-left: 430px;
    margin-top: 80px;
}

ul#primary-links
{
    border-top: 2px solid #6A2A48;
    border-bottom: 1px solid #6A2A48;
    margin: 0;
    overflow: hidden;
}

ul#primary-links li, ul#secondary-links li
{
    display: inline;
}

ul#secondary-links
{
    margin: 0;
    padding-top: 5px;
    padding-bottom: 8px;
    padding-left: 25px;
    background-color: #FDFAF3;
    border-bottom: 1px solid #6A2A48;
}

ul#primary-links li
{
    padding: 0;
}

ul#primary-links li a
{
    letter-spacing: 0.1em;
    font-family: Georgia,Helvetica,Sans-serif;
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: bold;
    color: #6A2A48;
    text-decoration: none;
    padding: 4px;
    padding-top: 6px;
}

ul#primary-links li a.active
{
    background-color: #6A2A48;
    color: white;
}

ul#primary-links li.idiomes
{
    padding-left: 15px;
    padding-top: 4px;
}
ul#primary-links li.idiomes a
{
    padding: 0;
}

ul#secondary-links li a
{
    font-size: 1.3em;
    letter-spacing: 0.1em;
    font-family: Georgia,Helvetica,Sans-serif;

    color: #6A2A48;
    padding: 4px;
    text-decoration: none;
}

ul#secondary-links li a.active
{
    font-weight: bold;
    text-decoration: underline;
}

div#content
{
   min-height: 450px;
   padding-top: 2.5em;
   background: url(../img/background-content.jpg) #FDFAF3 repeat-x bottom left;
   padding-bottom: 2.5em;
}

#content h1
{
    display: none;
}

#content h2
{
    color: #666;
    font-size: 1.3em;
    letter-spacing: 0.2em;
    font-family: Georgia, Geneva, Helvetica;
    margin: 0 0 0.5em 0;
    font-weight: bold;
}

#content h3
{
    color: #666;
    font-size: 1.2em;
    letter-spacing: 0.1em;
    font-family: Georgia, Geneva, Helvetica;
    margin: 0 0 0.5em 0;
    font-weight: bold;
}

#content .box
{
    background-color: #FFF7DF;
}

/* HOME */

#home-banner
{
    
}

#home-presentacio
{
    background: url('../img/home-background.gif') repeat-x top center;
}

img.logo-perafita
{
    margin: 40px 5px 0px 10px;
}

#s3slider {
   width: 860px; /* important to be same as image width */
   height: 300px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 860px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 13px/18px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 834px;
   background-color: #6a2a48;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

/* Slider petit per a slideshows */

#s3sliderpeke {
   width: 270px; /* important to be same as image width */
   height: 270px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContentpeke {
   width: 270px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImagepeke {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.clear {
   clear: both;
}


/* FOTOS */

#masia-distribucio-header
{
    margin-bottom: 20px;
}

#masia-distribucio-header a.active
{
    font-weight:bold;
    text-decoration:underline;
}
#masia-distribucio-header a {
    color:#6A2A48;
    font-family:Georgia,Helvetica,Sans-serif;
    font-size:1.3em;
    letter-spacing:0.1em;
    padding:4px;
    text-decoration:none;
}

#masia_distribucio
{}

#masia_distribucio .amb-marc
{
    border: 1px solid #6a2a48;
    padding: 2px;
}

div.photo-group
{
    clear: left;
}

ul.photo-list
{
    margin: 0;
    padding: 0;
}
ul.photo-list li
{
    list-style-type: none;
    padding: 5px;
    float: left;
}

ul.photo-list li img
{
   border: 2px solid #EDEDED;
   padding: 5px;
   background-color: white;
}

ul.photo-list li img:hover
{
   border: 2px solid #CCC;
   padding: 5px;
   background-color: white;
}

/* LLOCS INTERES */
ul.llista-botons
{
    margin-top: 20px;
    margin-left: 60px;
}
ul.llista-botons li
{
    list-style-image: url(../img/list-icon.gif);
}
ul.llista-botons li a
{
    color: #6a2a48;
    text-decoration: none;
    font-size: 1.3em;
}

ul.llista-botons li a:hover
{
    text-decoration: underline;
}

hr.footer
{
    color: #BBBCB7;
}