/* CSS styles for DG Opticians */
/* coded by DJENAN KOZIC :: 16-10-2007 */


/* THE BASICS */

* { margin:0; padding:0; }

body {
	background: #707070 url('images/bg.gif') repeat-x top;
	font:normal 12px Verdana, Helvetica, Arial, sans-serif;
}

p {}

h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}

ol {}
ul {}
li {}

a, a:hover, a:active, a img, a, a:hover img, a:active img { outline:none; border:none; }
a {
	color:#007566;
	text-decoration:underline;
	}
a:hover {
	text-decoration:none;
}
a:active {}


/* HEADER */

#header {
	position:relative;
	margin:33px auto 0 auto;
	width:969px;
	height:284px;
	background: #DDD url('images/header_bg.jpg') no-repeat top center;
	}

#logo {
	position:absolute;
	top:70px;
	left:72px;
	width:518px;
	height:45px;
	overflow:hidden;
	}
#logo h1 {}


/* NAVIGAITON */

#navigation {
	position:absolute;
	top:135px;
	left:72px;
	width:451px;
	height:14px;
	margin:0 auto;
	}

#navigation li { display:inline; margin:0; padding:0;}
#navigation ul { list-style:none; margin:0; padding:0;}
#navigation li a { background-image:url('images/nav.gif'); float:left; height:0; padding-top:14px; overflow:hidden;}

#navigation li#nav-1 a { background-position:0 0; width:54px; }
#navigation li#nav-1 a:hover { background-position:0 -14px; }

#navigation li#nav-2 a { background-position:-54px 0; width:86px; }
#navigation li#nav-2 a:hover { background-position:-54px -14px; }

#navigation li#nav-3 a { background-position:-140px 0; width:77px; }
#navigation li#nav-3 a:hover { background-position:-140px -14px; }

#navigation li#nav-4 a { background-position:-217px 0; width:136px; }
#navigation li#nav-4 a:hover { background-position:-217px -14px; }

#navigation li#nav-5 a { background-position:-353px 0; width:98px; }
#navigation li#nav-5 a:hover { background-position:-353px -14px; }


/* CONTENT */

#contentwrapper {
	position:relative;
	width:969px;
	margin:0 auto;
	background: #707070 url('images/contentwrapper_bg.gif') repeat-y center center;
	line-height:1.6em;
	}

#content {
	float:right;
	width:510px;
	margin:20px 60px 20px 0;
}

#content p {
	line-height:1.7em;
	margin-bottom:1em;
}
	
#content h2 {
	color:#007566;
	font-size:14px;
	margin-bottom:1em;
}
#content h3 {
	font-size:14px;
	margin-bottom:0.5em;
}
#content h4 {}
#content h5 {}
#content h6 {}

#content ol {}
#content ul {
	margin-bottom:1em;
}
#content li {
	text-indent:10px;
	margin-left:30px;
}

#content a {}
#content a:hover {}
#content a:active {}

#images {
	float:left;
	width:310px;
	margin:25px 0 20px 60px;
}
#indeximages {
	position:absolute;
	bottom:-5px;
	left:34px;
}
#images img {}
tr.specialoffer {
	border-top:1px dashed #ccc;
	padding:10px 0 15px 0;
	margin-bottom:10px;
	margin-top:15px;
	clear:both;
}
td.offerimage {
	width:200px;
	text-align:right;
	border-top:1px dashed #ccc;
	margin-top:10px;
	padding-top:15px;
	padding-bottom:15px;
}
td.offertext {
	margin-top:10px;
	width:250px;
	font-weight:bold;
	border-top:1px dashed #ccc;
	padding-top:15px;
	padding-bottom:15px;
}
td.offertext p {
	color:#C45973;
	font-weight:bold;
	width:250px;
}
#content div.clear {
	clear:both;
}
.topborder {
	border-top:1px dashed #ccc;
	padding-top:15px;
	margin-top:15px;
}

#clear { clear:both; }

/* FOOTER */

#footer {
	position:relative;
	width:969px;
	height:91px;
	margin:0 auto;
	background: #707070 url('images/footer_bg.gif') no-repeat bottom center;
	}

#footer p {}

#footer a {}
#footer a:hover {}
#footer a:active {}

#copyright {
	position:absolute;
	top:10px;
	left:10px;
	width:20px;
	height:0px;
	padding-top:10px;
	overflow:hidden;
	}
#credit {
	position:relative;
	text-align:center;
	width:969px;
	height:10px;
	margin:8px auto 25px;
	}