/* ottwell design gallery */

body {
	background-image: url(images/odesign_backimage.gif);
	background-repeat: no-repeat;
	background-attachment: scroll;
}

p {
	font-family: verdana, arial, sans-serif;
    color: #554b30;
    font-size: 11pt;
    font-weight: regular;
}

.copy {
	font-size: 11pt;
}

.italic {
	font-size: 11pt;
	font-style: italic;
}

h1 { 
    font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
    font-size: 125%; 
    font-weight: normal;
    color : #44b3d4;
	padding: 30px 0px 0px 0px;
}	

h2 { 
    font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
    font-size: 100%; 
    font-weight: normal;
    color: #554b30;
	padding: 0px 0px 0px 0px;
}
	
a {
    color : #554b30;
    font-size: 11pt;
	font-family: verdana, arial, sans-serif;
    font-weight: regular;
    text-decoration: none;
}

a:hover {
    color: #ffffff;
    background-color: #44b3d4;
    font-size: 11pt;
    font-weight: regular;
	font-family: verdana, arial, sans-serif;
}

a:visited {
    color : #554b30;
    font-size: 11pt;0	font-family: verdana, arial, sans-serif;
    font-weight: regular;
    text-decoration: none;
}



/* header */
div#head {
	margin: 0px 0px 0px 65px;
}


/* navigation */
div#nav {
	margin: 0px 0px 0px 170px;
}


/* main */
div#main {
	margin: 0px 0px 0px 170px;
	width: 425px;
}


/* footer */
div#foot {
	padding: 10px 0px 0px 0px;
	margin: 0px 0px 0px 170px;
	width: 425px;
	font-size: 10px;
	border-top: solid 1px #554b30;
}

#foot p {
	font-size: 10px;
}


/* The containing box for the gallery. */
#container {
    position: relative; 
    width: 800px; 
    height: 700px; 
    margin: 0px 0px 0px 30px; 
    border: 0px solid #ffffff; 
    }
	
#container ul {
    padding: 0px; 
    margin: 0px; 
    list-style-type: none; 
    }
	
#container a.gallery span {
    position: absolute; 
    width: 1px; 
    height: 1px; 
    top: 5px; 
    left: 5px; 
    overflow: hidden; 
    background: #ffffff;
    }
	
/* Adding the thumbnail images */
#container a.gallery, #container a.gallery:visited {
    display: block; 
    color: #000000; 
    text-decoration: none; 
    border: 1px solid #000000; 
    margin: 1px 2px 1px 2px; 
    text-align: left; 
    cursor: default;
    }
#container a.slidea {
    background: url(images/bb_logo_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slideb {
    background: url(images/bf_color_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slidec {
    background: url(images/tng_cover_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slided {
    background: url(images/tng_inside_th.jpg); 
    height: 100px; 
    width: 100px;
    }
* html #container a.slided {
    width: 100px; 
    width: 100px;
    }
#container a.slidee {
    background: url(images/kinkos_baseball_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slidef {
    background: url(images/kinkos_front_th.jpg); 
    height: 100px; 
    width: 100px;
    }
* html #container a.slidef {
    width: 100px; 
    width: 100px;
    }
#container a.slideg {
    background: url(images/rcl1_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slideh {
    background: url(images/rcl3_th.jpg); 
    height: 100px; 
    width: 100px;
    }
#container a.slidei {
    background:url(images/od_florish_th.jpg); 
    height:100px; 
    width:100px;
    }
#container a.slidej {
    background:url(images/od_florish_th.jpg); 
    height:100px; 
    width:100px;
    }
#container a.slidek {
    background: url(images/od_florish_th.jpg); 
    height: 100px; 
    width: 100px;
    }
* html #container a.slidek {
    width: 100px; 
    width: 100px;
    }
#container a.slidel {
    background: url(images/od_florish_th.jpg); 
    height: 100px; 
    width: 100px;
    }
	
/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
    width: 220px; 
    height: 650px;
    }
#container li {
    float: left;
    }
	
/* move the thumbnails into the correct position */
#container ul {
    margin: 5px; 
    float: right;
    }
	
/* change the thumbnail border color */
#container a.gallery:hover {
    border: 1px solid #ffffff; 
    }
	
/* styling the :hover span */
#container a.gallery:hover span {
    position: absolute; 
    width: 500px; 
    height: 650px; 
    top: 10px; 
    left: 75px; 
    color: #000000; 
    background: #ffffff;
    }
	
#container a.gallery:hover img {
    border: 1px solid #ffffff; 
    }
	

#container {
    background: #ffffff url(images/back.jpg) 75px 10px no-repeat;
    }