/* The Oculist Stylesheet === developed by: Why Design 29.04.08 ================================== */


/*main structure =====================================================================*/

body {
	/*the next bit is a hack for i.e. 5 and 5.5*/
	text-align:center;
	margin:0;
	padding:0;
	background:#A7A9AC;
}

.container {
	position:relative;
	/*the next bit is a positioning hack for ie*/
	margin:0 auto;
	/*the next bit is a hack for i.e. in windows xp*/
	width:960px;
	/*the next bit is a hack for i.e. 5 and 5.5*/
	text-align:left;
}

#bodytop {
	background:url(images/bgtop.gif) repeat-x 0 bottom;
	height:75px;
}

#bodymiddle {
	background:url(images/thumbnailbg.gif) repeat-x 0 bottom #A7A9AC;
}

#header {
	width:960px;
	height:75px;
	background:url(images/header.jpg) no-repeat 0 bottom;
}

#columnleft {
	float:left;
	width:410px;
	height:157px;
	background:url(images/thumbnailbg.gif) repeat-x;
}

#map a {
	display:block;
	float:left;
	background:url(images/map.gif) no-repeat;
	width:65px;
	height:25px;
	margin:30px 0 0 16px;
}

#book a {
	display:block;
	float:left;
	background:url(images/book.gif) no-repeat;
	width:250px;
	height:25px;
	margin:30px 0 0 12px;
}

#map a:hover, #book a:hover {
	background-position:0 -25px;
}

#address {
	float:left;
	width:380px;
	margin:10px 0 0 16px;
}

#address a {
	color:#A7A9AC;
}

#address a:hover {
	text-decoration:none;
	color:#FFF;
}

#footer {
	width:960px;
	font-family:Arial, Helvetica, sans-serif;
}

#left {
	float:left;
	margin:5px 0 0 16px;
	font-size:9px;
	text-transform:uppercase;
	color:#333;
}

#right {
	float:right;
	text-transform:uppercase;
	margin:5px 0 0 0;
	font-size:9px;
	color:#333;
	text-align:right;
}


#footer a {
	font-weight:normal;
	text-decoration:none;
	color:#333;
}

#footer a:hover {
	color:#FFF;
}

.clear {
	clear:both;
}


/*Text Styles =====================================================================*/


h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	text-transform:uppercase;
	font-weight:bold;
	line-height:14px;
	color:#FFF;
	margin:15px 0 0 16px;
	padding:0;
}

p {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	line-height:13px;
	color:#FFF;
	margin:0;
	padding:0;
}

a {
	font-family:Arial, Helvetica, sans-serif;
	text-decoration:none;
	color:#FFF;
}

a:hover {
	text-decoration:underline;
}


/*thumbnail viewer =====================================================================*/


#picture {
	width:960px;
	margin:0;
	padding:0;
}

.thumbnail_wrap {
	float:left;
	margin:0;
	width:550px;
}

.thumbnail1 a, .thumbnail2 a, .thumbnail3 a, .thumbnail4 a, .thumbnail5 a {
	float:left;
	height:157px;
	width:110px;
}

.thumbnail1 a {
		background:url(images/thumbnail1.jpg) no-repeat;
}

.thumbnail2 a {
		background:url(images/thumbnail2.jpg) no-repeat;
}

.thumbnail3 a {
		background:url(images/thumbnail3.jpg) no-repeat;
}

.thumbnail4 a {
		background:url(images/thumbnail4.jpg) no-repeat;
}

.thumbnail5 a {
		background:url(images/thumbnail5.jpg) no-repeat;
}

.thumbnail1 a:hover, .thumbnail2 a:hover, .thumbnail3 a:hover, .thumbnail4 a:hover, .thumbnail5 a:hover {
	background-position:0 -157px;
}

#imageload {
	width:960px;
	height:375px;
	float:left;
}