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

/* web fonts */
/* in use for horizontal menu */
@font-face {
    font-family: 'MyriadProBoldCondensed';
    src: url('../fonts/myriadpro-boldcond-webfont.eot');
    src: local('MyriadProBoldCondensed'), url('../fonts/myriadpro-boldcond-webfont.woff') format('woff'), url('../fonts/myriadpro-boldcond-webfont.ttf') format('truetype'), url('../fonts/myriadpro-boldcond-webfont.svg#webfont1Q0ioaim') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SkiaRegular';
    src: url('../fonts/skia-regular.eot');
    src: local('SkiaRegular'), url('../fonts/skia-regular.woff') format('woff'), url('../fonts/skia-regular.ttf') format('truetype'), url('../fonts/skia-regular.svg#webfont1Q0ioaim') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* general tag settings */

body {
    background-color: #333333;
    color: white;
    font-family: Helvetica, Arial, sans-serif;
    padding-top: 0px;
    margin-top: 0px;
}



a:visited {
    color: inherit;
}
ul {
    list-style-type: circle;
    margin-top: 2px;
    padding-top: 0px;
}
/* general page template */
/* we use a table definition in order to get dynamic centering working */
table#page {
    width: 100%;
    padding: 0px;
    border-spacing: 0px;
}
table#page tr td {
    padding: 0px; 
    vertical-align: top;

}

table#page tr td#tbl-le {

    background-color: #171717;
    background-image: url('../images/site-bg_01.jpg');
    background-position: right;
    background-repeat:no-repeat;
    margin-top: -20px;
}
table#page tr td#tbl-mi {
    width: 500px;
    background-color: #171717;
}
table#page tr td#tbl-le #border-left {

}

table#page tr td#tbl-ri {

}
table#page tr td#tbl-ri #border-right {
    height: 1000px;
    background-image: url('../images/site-bg_03.jpg');
    background-repeat:no-repeat;
    background-position: left;
    background-color: #171717;
    margin-top: -20px;
}


table#page tr td#tbl-mi #canvas {
    float: left;
    height: 765px;
}

table#page tr td#tbl-mi #abovecanvas {
    background-image: url('../images/site-bg_02.jpg');
    clip: rect(-20px, 0px, 0px, 0px);
    /* height: 37px;*/
    height: 37px;
    margin-top: -20px;
    width: 904px;
}
table#page tr td#tbl-mi #belowcanvas {
    clear: both;
    background-color: #171717;
    background-image: url('../images/site-bg_06.jpg');
    width: 904px;
    height: 198px;
    display: block;
}
table#page tr td#tbl-mi #belowcanvas #credits {
    float: right;
    margin-right: 3px;
    font-size: small;
}
/* link to delarte, under canvas of site */
table#page tr td#tbl-mi #belowcanvas #credits a#delarte {
    cursor: pointer;
    color: #bfebf8;
    text-decoration: none;
}
table#page tr td#tbl-mi #belowcanvas #credits a#delarte:hover {
    color: #bfebf8;
    text-decoration:underline;
}
table#page tr td#tbl-mi #belowcanvas #credits a#delarte:visited {
    color: #bfebf8;
}


/* this is the setup of the inner square: effectively the real site */ 

#site {
    clear: both;
    float: left;

    position: relative;
    left: 0px;
    top: 0px;
    height: 765px; 

}
/* background of column left in the site */
#site #layer-background-left {
    /* clear: both;
    float: left;*/

    position: absolute;
    left: 0px;
    top: 0px;    

    background-image: url('../images/site-bg_04.jpg');
    position: relative;
    width: 124px;
    height: 765px;


}

/* background of content part in the site */
#site #layer-background-content {
    float: left;
    /*    position: relative;*/
    position: absolute;
    left: 125px;
    top: 0px;

    width: 780px;
    height: 765px;
    background-image: url('../images/site-bg_05.jpg');    
}

#site #layer-front {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 904px;
    height: 765px;    

    /*
    position: relative;
    top: -765px;    */
}

/* left column */
#left {
   
    clear: both;
    float: left;
    width: 124px;


}


#lmn-home {
    margin-bottom: 24px;
}
#index #lmn-home {
    visibility: hidden;
}
#lmn-p3 {
    margin-bottom: 16px;   
}
/* main content area */
#content {
    position: absolute;
    top: 132px;
  /*  left: 125px;*/
  left: 125px;
    width: 780px;
    height: 628px;  

}

#footer {
    position:relative;
    top: 200px;
    float: left;
    clear: both;
}




p.quote {
    font-style: italic;

}


/* panes in a page */
#panes .pane {
    font-size: 13px;
    display: none;
}
#panes .pane h4 {
    font-weight: bold;
    background-color: black;
    opacity: 0.4;
    /* for IE */
    filter:alpha(opacity=40);
    padding-left: 2px;
    margin-bottom: 0px;
    padding-bottom: 0px;    
}

#panes {
    position: absolute;
    left: 0px;
    top: 60px;    
    margin-left: 13px;
}
#panes .lcol {

    float: left;
    clear: both;
    width: 350px;
}
#panes .rcol {
    float: left;
    margin-left: 32px;
/*    margin-top: 16px; */
    width: 350px;   
}
#panes .rcol img {
    margin-top: 16px;
    width:350px;
}
#panes h2 {
    color: #454f5e;   
}
/* title bar in use on all pages except index */
.vip {
    position: absolute;
    top: 6px;
    left: 0px;
    width: 749px;
    height: 30px;
    margin-top: 13px;
    text-align: right;
    padding-right: 24px;
    font-family: 'SkiaRegular';
    font-size: 20px;
    font-weight: normal;
    opacity: 0.35;
    /* for IE */
    filter:alpha(opacity=35);
}


#titlebg {
    position: absolute;
    top: 6px;
    left: 0px;
    /*    margin-top: 5px;*/
    margin-left: 1px;

    opacity: 0.12;
    /* for IE */
    filter:alpha(opacity=12);
    background-color: #ffffff;
    width: 775px;
    height: 40px;
}
h1 {
    position: absolute;
    left: 0px;
    top: -13px;
    padding-left: 12px;
    /*
    margin-left: 20px;
    margin-top: -40px;
    padding-top: 2px;
    */

    font-weight: normal;
    font-family: 'MyriadProBoldCondensed';
}
/* specific page: home page index.html */
#index h1 {
    display: inline;
    font-size: inherit;
    font-weight: inherit;
    margin: 0px;
    padding: inherit;
    text-align: inherit;
}
#index #home-introduction {
    position: absolute;
    top: 60px;
    left: 383px;
    clear: both;
    height: 300px;
    width: 330px;
    text-align: right;
    margin-right: 66px;
    line-height: 160%;
    font-size: 11pt;

}
#index #home-introduction .subtl {
    font-weight: 600;
    float: right;  
    clear: both;
    margin-bottom: 6px;
}
#index #home-introduction .hello {
    font-weight: 600; 
    clear: both;
    margin-bottom: 6px;
}
#index #home-introduction .quote {
    font-style: italic;
    clear: both;
    margin-bottom: 6px;
}

#ns_cd {
    font-size: 13px;
    color: black;
    margin-top: -100px;
}

.fl-block {
    clear: both;

    display: block;
}
.fl-list {
    display: block;
    float: left;

}


.hylink {
    cursor: pointer;  
}
.hylink:hover {
    text-decoration: underline;
}
/* specific for those pages that present a group: GDS, CC, AC */
.group-story {
    position: absolute;
    left: 0px;
    top: 60px;
    height: 235px;
    clear: both;
    float: left;
}
.group-story .lcol {
    width: 300px;
    line-height: 150%;
    color: #140013;
    clear: both;
    float: left;
    padding-left: 13px;
}
.group-story .rcol {
    float: left;
    line-height: 120%;
    padding-left: 30px;
    width: 410px; 
    font-size: 90%;
    
}

.group-web-link {
    position: absolute;
    left: 2px;
    top: 316px; 
    width: 749px;
    height: 18px;
    clear: both;
    float: right;
    text-align: right;
    padding-right: 24px;
}
.group-web-link a {
    text-decoration: none;
}
.group-web-link a:hover {
    text-decoration: underline;
}
img#group-bottom-image {
    position: absolute;
    left: 2px;
    top: 338px;
    width: 773px;
}
.photographer {
    float: left;
    margin-left: 8px;
    color: white;
    font-size: small;
}

#flashContent { width:360px; height:288px; position: absolute;padding: 0px;}
