/* CSS Document */


html {
  height: 100%;
  width: 100%;
}

body {
  margin: 0;
  padding: 0;
  background:#fff;
  font-family: Times, 'Times New Roman', Serif;
}

#contentOutside {
  margin: -.15em auto 0 auto;
  width: 69em;
}


#contentCentering
{
  margin: 0 auto 0 auto;
  padding: 1px;
}


a {
  font-weight: bold;
  text-decoration: none;
  outline: none;
}

    a:link, a:visited {
      color: #98d4ff;
    }

        a:hover {
          color: #34c6fd;
        }

            a:active {
              color: #00baff;
            }


p {
  font-size: .75em;
  line-height: 1.375em;
  text-align: left;
  padding: 0 0 .5em 0;
}



#topName {
  clear:both;
}

    #topName h1 {
      font-weight:bold;
      font-size:7.75em;
      line-height:.68em;
      letter-spacing:-.15em;
      text-transform: uppercase;
      margin:0 0 -.09em 0;
      color:#f2f2f2;
      position:relative;
      z-index:-6;
        
    }

#bodyBG {
  position:absolute;
  top:9.75em;
  z-index:-5;
  width:100%;
  height:38.5em;  
  background:#f7f7f7;
  opacity: .90;
  filter: alpha(opacity=90);        
}

div #body {
  position:relative;
  z-index:2;
  height:38.5em;
  float:left;
  overflow:hidden;
}


#bodyLeft {
  width:12em;
  height:100%;
  float:left;
}

    #bodyLeft h2 {
      margin:1.25em 0 .65em 0;
      color:#dde6eb;
      font-size:1.875em;
      line-height:.09em;
      letter-spacing:-.07em;
      text-transform:uppercase;
    }

    #bodyLeft p {
      color:#a3acb0;
      margin-bottom:-.5em;
    }
    
    #bodyLeft a {
      position:relative;
      z-index:6;
    }

    #monogram {
       margin:9.5em 0 3em 1em;
    }


#paintingsDiv {
  width:44em;
  height:100%;
  float:left;
  overflow:hidden;
}

    #paintingsDiv ul {
      width:625em;    
    }

        #paintingsDiv ul li {
          float:left;
          padding: 0 10em 15.5em 0;
          display:inline;
        }

            p.title {
              line-height:1.5em;
              padding:1em 0 0 0;
              color:#727b7e;
            }

            p.medium {
              font-style:italic;
              color:#a3acb0;
            }



#rightBar {
  background: url('../images/barRight.png') repeat-y;     
}

#leftBar {
  background: url('../images/barLeft.png') repeat-y;
}

#rightBar, #leftBar {
  margin-left: -3em;
  padding-top: 20em;
  position:relative;
  z-index:3;
  height:22em;
  float:left;
  width:9.5em;  
}

    #rightBar img {
      margin-left:3.75em;
    }
    
    #leftBar img {
      margin-left:4.65em;
    }  

        #rightBar img, #leftBar img {
          opacity: .35;
          filter: alpha(opacity=35);      
        }

        #rightBar img:hover, #leftBar img:hover {
          opacity: 1;
          filter: alpha(opacity=100);
        }



#thumbnailsDiv {
  clear:both;
  max-width:48em;
  padding: 1.5em 0 0 15em;
}

    #thumbnailsDiv img {
      float:left;
      margin:0 0 .688em .688em;
      border: 1px solid #000;  
      opacity: .60;
      filter: alpha(opacity=60);
    }
    
    #thumbnailsDiv ul li {
    cursor:pointer;
    display:inline;
    }

        #thumbnailsDiv img:hover {
          border: 1px solid #666; 
          opacity: 1;
          filter: alpha(opacity=100);
        }

    #thumbnailsDiv p  {
      padding:2em 0 0 3.35em;
      clear:left;
      color:#d6d6d6;
    }
    
    #thumbnailsDiv a {
      font-weight:normal;
    }
    
        #thumbnailsDiv p.date {
          padding: 2em 1.5em 0 0;
          margin:0;
          float:left;
          width:1.25em;
          display:inline;
          font-size:.75em;
          color:#a3acb0;
          font-style:italic;
          
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
 
        }