/* layoutstyles.css */

/* Universal style rule */
*{
  /* Block all browser default margins and padding */
  margin:0;
  padding:0;
 }


/* generic class selector */
/* Applies only where class="floatright" */
.floatright {
  float: right;
  clear: both;
  margin: 0;
}

/* Body text and page background */

body{

     font-family: arial, verdana, helvetica, sans-serif;
}


p {
font-family: arial, verdana, helvetica, sans-serif;
font-size:12px;
color: #000000;
font-weight: normal;
}

p.small {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 7px;
color: #FFF;
font-weight: lighter;
}


a:link {text-decoration: none}
a:visited {text-decoration: none}
a:active {text-decoration: none}
a:hover {text-decoration: underline; color: #CC0000;}

#wrapperhome{
  width: 42em;
  height: 33em;
  background-image: url(lauriepix/gallerybackgroundhome.jpg);
  background-repeat:no-repeat; 
  z-index:-1;
  /* Center the wrapper */
  margin: 10px auto;
}

#wrapperthumbs{
  width: 42em;
  height: 33em;
  background-image: url(lauriepix/gallerybackground1.jpg);
  background-repeat:no-repeat; 
  z-index:-1;
  /* Center the wrapper */
  margin: 10px auto;
}

#branding{ 
     position:relative;
     width: 100%;    
}

#leftcolumnhome{
   width:28em;
   float:left;
   margin: 20px 0 0 20px;
}


#leftcolumnabout{
   width:30em;
   float:left;
   margin: 5px 0 0 20px;
}

#leftcolumnthumbs{
   width:9em;
   float:left;
   display: inline;
   padding: 0;
   margin: 0 0 0 1.5em;

   background: transparent;

}


.gallerycontainer{
position:  relative; height:288px
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}





.thumbnail img{
border: 1px solid white ;

margin: 5px 5px 5px 0;
z-index:2;
}

.thumbnail:hover{
background-color: transparent;
z-index:2;
left: 23px;
top: 262px;
text-decoration:none;
}

.thumbnail:hover img{
border: 1px solid black;
text-decoration:none;
z-index:2;
left: 23px;
top: 262px;}

span.nobreak	{
	white-space: nowrap;
	}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: transparent;
padding: 5px;
left: -1000px;
border: none;
visibility: hidden;
color: black;
text-decoration: none;
z-index:2;
text-decoration: none; z-index: 50;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 12px;
color: #000000;
font-weight: normal;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px; text-decoration: none;
z-index:2;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
text-decoration:none;
top: -5px; 
left: 205px; /*position where enlarged image should offset horizontally */
text-decoration: none; z-index: 50;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 12px;
color: #000000;
font-weight: normal;
}


h1 {
font-family: Arial,Verdana,Helvetica,sans-serif;
color: #000000;
}
h2 {
font-family: arial, verdana, helvetica, sans-serif;
color: #000000;
}
h3 {
font-family: arial, verdana, helvetica, sans-serif;
 float: left;
font-size: 14px;
font-weight: bold;
color: #000000;
margin-top: -5px ;
margin-bottom: 5px;
}
h4 {
font-family: arial, verdana, helvetica, sans-serif;
color: #000000;
}

 #divlist {width:40em; margin: auto}
  
  ul.left {
    font-size: 11px;

font-weight: normal;
float: left;
    width: 40em; 
    margin: 5px 0 0 0;
    padding: 0px 0px;
    border: 0px none; 
    list-style-position: inside;
    list-style-image: url("lauriepix/reddot1.gif");
    position: relative;
    left: 0px;
  }
  

/********** Footer division styles **********/
#wrapperfooter{
  width: 42em;

   /* Center the wrapper */
  margin:  auto;
  padding: 0 0 0 10px;
}

#footer{
  position:relative;
}



#navcontainer ul
{
margin: 0;
padding: 0;
font-family: arial, verdana, helvetica, sans-serif;
font-size: 9pt;
color: #000000;
letter-spacing:0.05em;
font-weight: normal;
}

#navcontainer ul li
{ 
display: inline; 
}

#navcontainer ul li a 
{
 padding: 1em 1em 0 0;
color: #000000;
}

#navcontainer a:link {text-decoration: none; outline: none;}
#navcontainer a:visited {text-decoration: none; outline: none;}
#navcontainer a:active {text-decoration: none; outline: none;}
#navcontainer a:hover {text-decoration: underline; color: #CC0000; outline: none;}


/* Applies to contact info in the footer division */
#navcontainer span {
position:absolute;
right:1em;
}