/* CSS Document */

/* Normalize margin and padding */
body, ul, li, h1, h2, h3, p {
	margin: 0;
	padding: 0;
	}
/* Normalize font-size for headers */
h1, h2, h3	{
	font-size: 100%;
	}

/* Remove list-style from lists */
ul	{
	list-style: none;
	}

/* Remove border from img */
img	{
	border: none;
	}
	
/* this is a hack to force scrollbars on at 
     all times so that the page does not jump
     when going from short to long pages */
html {
  height: 100%;
  margin-bottom: 1px;
}

/* Global Styles
-------------------------------------------------------------------------------------*/
	
body {
	background: #ffc url(images/newsite/wallpaper2.jpg) repeat;
	color:#333;
	font-size: 80%;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	text-align: center;
	margin-top: 10px;
	}
	
a:link {
	color: #693;
	text-decoration: none;
	font-weight: bold;
	}
	
a:visited {
	color: #960;
	text-decoration: none;
	font-weight: bold;
	}
	
a:hover {
	color: #8c2404;
	text-decoration: none;
	font-weight: bold;
	}
	
h2 {
	font-size: 1.6em;
	font-weight: bold;
	margin: 5px;
	padding: 5px;
	color: #8c2402;
	}
	
h3 {
	font-size: 1.2em;
	font-weight: bold;
	margin: 5px;
	padding: 5px;
	color: #333;
	}
	
h4 {
	font-size: 1em;
	font-weight: bold;
	margin: 5px;
	padding: 5px;
	color: #8c2402;
	}
	
p {
	font-size: 1.1em;
	margin: 5px;
	padding: 5px;
	}
	
/* Outside Wrapper Styling
-------------------------------------------------------------------------------------*/	
#candywrapper {
	width: 940px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	}

* html #candywrapper {
	width: 960px;
	}
	
#sidebar {
	float: right;
	width: 240px;
	margin: 30px 0 0 0;
	}

html > body #topFrame {
	background: url(images/newsite/oval7.png) no-repeat center top;
	height: 350px;
	margin: 0;
	padding: 0;
	}
	
#topFrame h4, #topFrame li {
	font-size: 0.9em;
	}
	
#topFrame .Padding {
	padding: 115px 68px 5px 64px;
	}
	
#topFrame ul {
	margin: 5px;
	padding: 5px;
	}
	
#topFrame li {
	position: relative;
	line-height: 16px;
	}
	
#topFrame li a {
	display: block;
	text-decoration: none;
	}
	
#topFrame li.frames a, #topFrame li.frames a:hover {
	background: url(images/newsite/frame-hover.gif) no-repeat 1% 50%;
	}
	
#sidebar2 {
	float: right;
	width: 240px;
	margin: 0;
	}
	
html > body #bottomFrame {
	background: url(images/newsite/oval6.png) no-repeat center top;
	height: 273px;
	margin: 0;
	padding: 0;
	}
	
#bottomFrame h4, #bottomFrame p {
	font-size: 0.9em;
	font-weight: bold;
	}
		
* html #bottomFrame p {
	position: relative;
	}
	
#bottomFrame a {
	text-decoration: none;
	}
	
#bottomFrame .Padding {
	padding: 54px 52px 5px 44px;
	}

/* Frame Styling
-------------------------------------------------------------------------------------*/	
#wrapper {
	width: 659px;
	float: left;
	clear: none;
	margin: 0 0 0 30px;
	padding: 0;
	text-align: left;
	}
	
#wrapper .top {
	background: url(images/newsite/wrapper-top5.png) no-repeat left top;
	height: 38px;
	}
	
* html #wrapper .top {
	background: url(images/newsite/wrapper-top5.jpg) no-repeat left top;
	height: 38px;
	}
	
#wrapper .middle {
	background: url(images/newsite/wrapper-middle6.png) repeat-y left top;
	}	
	
* html #wrapper .middle {
	background: url(images/newsite/wrapper-middle5.jpg) repeat-y left top;
	}

#wrapper .bottom {
	background: url(images/newsite/wrapper-bottom5.png) no-repeat left top;
	height: 46px;
	}
	
* html #wrapper .bottom {
	background: url(images/newsite/wrapper-bottom5.jpg) no-repeat left top;
	}
	
/* Container for Content and Poppy Background
-------------------------------------------------------------------------------------*/

#container {
	margin-left: -5px;
	}
	
* html #container {
	margin-left: 40px;
	marg\in-left: -5px;
	}

/* Content Background Styling - Poppy Background
-------------------------------------------------------------------------------------*/
		
#header h1 {
	position: relative;
	width: 573px;
	height: 146px;
	margin: 0 auto;
	padding: 0;
	font-size: 1.6em;
	font-weight: bold;
	z-index:3;
	}
	
#header h1 span {
	background: url(images/newsite/logo2.jpg) no-repeat left top;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index:3;
	}
	
#content-top {
	background: url(images/newsite/content-bg-top.jpg) no-repeat left top;
	position: absolute;
	width: 573px;
	height: 207px;
	top: 0;
	left: 0;
	z-index: 2;
	margin: 0 auto;
	padding: 0;
	}

#content-middle {
	background: url(images/newsite/content-bg-middle.jpg) repeat-y left top;
	position: relative;
	width: 573px;
	margin: 0 auto;
	padding: 0;
	}
	
#content-bottom {
	background: url(images/newsite/content-bg-bottom4.gif) no-repeat left bottom;
	width: 573px;
	z-index: 6;
	margin: 0 auto;
	padding: 0;
	}

/* Content Styling
-------------------------------------------------------------------------------------*/
	
#content {
	position: relative;
	padding: 5px 32px 353px 213px;
	z-index: 5;
	}
	
#portfolio #content {
	padding: 5px 28px 353px 213px;
	z-index: 5;
	}
	
html > body #content p, 
html > body #content li,
html > body #footer li,
html > body #topFrame h4, 
html > body #topFrame li,
html > body #bottomFrame h4,
html > body #bottomFrame p {
	background: url(images/newsite/text-bg.png) repeat center center;
	}
	
/* Navigation Styles
-------------------------------------------------------------------------------------*/
	
div#nav {
	margin: 0;
	padding: 0;
	position: absolute;
	background: url(images/newsite/frame-gold2.gif) no-repeat left top;
	width: 159px;
	height: 258px;
	top: 90px;
	left: 23px;
	z-index: 7;
	}
	
div#nav ul {
	margin: 52px 30px 20px 32px;
	}
	
div#nav li {
	font-size: 1.1em;
	margin: 4px 0 4px 0;
	padding: 0;
	overflow: hidden;
	}
	
div#nav li a {
	display: block;
	text-decoration: none;
	cursor: pointer;
	}
	
div#nav li a:hover {
	text-decoration: none;
	}
	
div#nav li.home, div#nav li.services, div#nav li.portfolio,
div#nav li.contact {
	position: relative;
	width: 92px;
	height: 35px;
	}
	
div#nav li.home span , div#nav li.services span, div#nav li.portfolio span,
div#nav li.contact span {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	}
	
div#nav li.home:hover span, div#nav li.services:hover span, div#nav li.portfolio:hover span,
div#nav li.contact:hover span,
#home div#nav li.home span , #services div#nav li.services span, #portfolio div#nav li.portfolio span,
#contact div#nav li.contact span {
	background-position: left -42px;
	}
	
div#nav li.home span {
	background: url(images/newsite/button-home.gif) no-repeat left top;
	}
	
div#nav li.services span {
	background: url(images/newsite/button-services.gif) no-repeat left top;
	}
	
div#nav li.portfolio span {
	background: url(images/newsite/button-portfolio.gif) no-repeat left top;
	}
	
div#nav li.musings span {
	background: url(images/newsite/button-musings.gif) no-repeat left top;
	}
	
div#nav li.contact span {
	background: url(images/newsite/button-contact.gif) no-repeat left top;
	}

/* Footer Styles
-------------------------------------------------------------------------------------*/
	
html > body #footer {
	width: 759px;
	float: left;
	margin: 20px 0 100px 0;
	padding: 0 0 80px 0;
	background: url(images/newsite/ribbon2-flat.png) no-repeat 0 0;
	}

#footer ul {
	margin: 0 0 0 232px;
	padding: 49px 0 25px 0;
	}
	
#footer li {
	position: relative;
	float: left;
	padding: 0 4px 0 10px;
	font-size: 0.83em;
	}
	
#footer li span {
	padding: 0 0 0 12px;
	}
	
#footer li a:link, #footer li a:visited,  #footer li a:hover {
	text-decoration: none;
	}

#footer p {
	margin: 0;
	padding: 0;
	text-align: center;
	}
	
#subFooter {
	width: 759px;
	float: left;
	margin: 0;
	text-align: center;
	padding: 5px 0 30px 0;
	}
	
* html #subFooter {
	margin: 0 0 0 15px;
	}
	
/* Classes
-------------------------------------------------------------------------------------*/

.center {
	text-align: center;
	}
	
.clear {
	clear: both;
	}
	
.floatLeft {
	float: left;
	}
	
.floatRight {
	float: right;
	}
	
ul.services {
	list-style: disc;
	margin: 5px;
	padding: 5px;
	font-size: 1.1em;
	}
	
 ul.services li {
 	margin: 0 0 0 24px;
	padding: 2px 0 2px 5px;
	}

/* Image Zoom for Portfolio Page
-------------------------------------------------------------------------------------*/

div.photo	{ /* Thanks for this image zoom method from Stu Nicholls, http://www.cssplay.co.uk/ */
	float: left;
	position: relative;
	top: 0;
	left: 0;
	width: 110px;
	height: 110px;
	}
	
div.photo a img	{
	width/**/: 100px;
	height/**/: 100px;
	padding: 1px;
	border: 1px solid #000;
	}
	
div.photo a.thumb	{
	display: block;
	width/**/: 100px;
	height/**/: 100px;
	text-decoration: none;
	}

div.photo a.thumb:hover	{
	text-decoration: none;
	background: #000;
	}	
	
div.photo a .large	{
	display: block;
	position: absolute;
	top: -3px;
	left: 2px;
	border: 0;
	width: 0;
	height: 0;
	}
	
div.photo a.thumb:hover .large	{
	display: block;
	position: absolute;
	top: -6px;
	left: -8px;
	width/**/: 115px;
	height/**/: 115px;
	padding: 0;
	border: 1px solid #000;
	z-index: 1000;    /* End of image zoom method */
	}

/* IE6 Fixes
--------------------------------------------------------------------------------------------------------------*/
* html body {   /* Behavior Fix for IE6 & earlier for li:hover */
	behavior: url(csshover.htc);
	}	

* html #topFrame {
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.winkwebdesign.com/images/newsite/oval7.png');
	height: 350px;
	margin: 0;
	padding: 0;
	}
	
* html #bottomFrame {
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.winkwebdesign.com/images/newsite/oval6.png');
	height: 273px;
	margin: 0;
	padding: 0;
	}
	
* html #footer {   /* PNG fix for IE6 and earlier */
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.winkwebdesign.com/images/newsite/ribbon2-flat.png');
	width: 759px;
	float: left;
	margin: 20px 0 0 13px;
	padding-bottom: 80px;
	}