/* Casa Rosden stylesheet */

/* much of the white space is based on multiples of 8px */

body {
    background: #d1a375;
    margin: 0;
    padding: 0;
    font-size: 95%; /* makes ems grow and shrink at a similar rate in different browsers, size is about 14pt */
    color: #993333;
}

h1 {
    background: url(images/casa-rosden-with-description.png) no-repeat;
    margin: 0 0 0 0;
    width: 479px;
    height: 118px;
    position: relative;
    left: 88px;
    top: 40px;
}

    h1 a {
        display: block;
        width: 479px;
        height: 118px;
        text-indent: -2000px;
    }

p {
    margin: 0 0 1em 0;
    font-family: arial;
    font-size: 1em;
    line-height: 1.2em;
    text-align: justify;
}

ul {
    margin: 0 0 1em 0;
    font-family: arial;
    font-size: 1em;
    line-height: 1.2em;
    text-align: justify;
}

img {
    border: 0;
}

    img.alignleft {
        margin: 0 16px 16px 0;
        float: left;
    }

    img.alignright {
        margin: 0 0 16px 16px;
        float: right;
    }

.gallery-item {
    margin: 0 16px 16px 0;
    width: 150px;
    height: 150px;
    }

#whole_page_container {
    position: absolute;
    width: 920px;
    height: 100%; /* allows you to position things at the bottom of the page */
    margin: 0 40px 0 40px;
}

.meta {
    font-family: arial;
    font-size: 1em;
    text-transform: lowercase;
}

    .meta a,
    .meta a:visited {
        padding: 8px;
        text-decoration: none;
        color: #666666;
    }

    .meta a:hover {
        color: #993333;
    }

#skip_to_content {
    position: absolute;
    left: -2000px;
    top: 8px;
}

    #skip_to_content:focus,
    #skip_to_content:active {
        background: #d1a375;
        border: solid 4px #666666;
        position: absolute;
        left: 0;
        top: 4px;
        font-weight: bold;
    }

#skip_to_navigation {
    position: absolute;
    left: -2000px;
    top: 8px;
}

    #skip_to_navigation:focus,
    #skip_to_navigation:active {
        background: #d1a375;
        border: solid 4px #666666;
        position: absolute;
        left: 0;
        top: 4px;
        font-weight: bold;
    }

#sitemap_link {
    position: absolute;
    right: 95px;
    top: 14px;
}

#change_font_size {
    position: absolute;
    right: 8px;
    top: 8px;
}

#content {
    margin: 0 0 0 0;
    width: 682px; /* (whole page container width) - (space between content and sidebar) - (sidebar ul left margin) - (sidebar image width) */
    position: absolute;
    top: 198px;
}

    .post {
        margin: 0;
        padding: 0;
        font-size: 1em;
    }

        .post a,
        .post a:visited {
            text-decoration: underline;
            color: #993333;
        }

        .post a:hover {
            color: #666666;
        }

        .post h2 {
            margin: 0 0 1em 0;
            padding: 0;
            font-family: arial;
            font-weight: bold;
            font-size: 1em;
            line-height: 1.2em;
        }

        .post h2.top_level_page {
            margin: 0;
            padding: 0;
            font-size: 1px; /* you can't use height:0 to get rid of it completely, as some screenreaders won't read it */
            text-indent: -2000px;
        }

        .post .byline {
            margin: 0 0 1em 0;
            color: #666666;
        }

        .post .subpages {
        padding: 0;
        list-style: none;
        }

        #commentform {
            margin: 0 0 0 50px;
        }

        #commentform textarea {
            width: 400px;
        }

        h3 {
            margin: 60px 0 0 50px;
            font-family: arial;
            font-size: 1em;
        }

        cite {
            display: block;
            font-family: arial;
            font-size: 1em;
            font-weight: bold;
            font-style: normal;
        }

    /* Photo tour - spaces between photos*/
    #post-5 a {
        margin: 0 20px 0 0;
    }

        #post-5 a img {
            margin: 0 0 20px 0;
        }

#sidebar {
    background: url(images/vertical-line.png) repeat-y left;
    height: 2000px;
    position: absolute;
    right: 0;
    top: 174px; /* 40px (body padding-top) + 118px (height of <h1>) + 16px (space between <h1> and sidebar) */
}

    #sidebar ul {
        margin: 24px 0 24px 18px; /* 24px is a multiple of 8px, 18px is the size of the font in the navigation text images */
        padding: 0;
        list-style: none;
    }

        #sidebar ul li {
            margin: 0 0 8px 0;
        }

            #sidebar ul li a {
                color: #993333;
				font-size: 1.2em;
				text-decoration: none;
            }

    #sidebar img {
        margin: 24px 0 24px 18px; /* 24px is a multiple of 8px, 18px is the size of the font in the navigation text images */
    }

#return_to_top_of_page {
    position: absolute;
    left: -2000px;
    bottom: 8px;
}

    #return_to_top_of_page:focus,
    #return_to_top_of_page:active {
        background: #d1a375;
        border: solid 4px #666666;
        position: absolute;
        left: 0;
        bottom: 4px;
        font-weight: bold;
    }

#adverts,
#wordpress {
    padding: 40px 0 40px 0;
    font-size: 0.6em;
}

    #adverts ul,
    #wordpress ul {
        padding: 0;
        width: 920px;
        list-style: none;
    }

        #adverts ul li,
        #wordpress ul li {
            padding: 0 8px 0 0; /* from .meta the padding was on <a>, move it onto <li> so you can have two links in a sentence */
            float: left;
        }

        #adverts ul li a,
            #wordpress ul li a {
                padding: 0; /* from .meta the padding was on <a>, move it onto <li> so you can have two links in a sentence */
            }

#adverts {
    padding-bottom: 0;
    height: 108px;
    font-size: 0.8em;
    text-transform: none;
}

    #adverts #chavetejo_ad_text {
        margin: 0 40px 0 0;
        width: 300px;
    }

    #adverts #gekkoportugal_ad_text {
        width: 220px;
    }