/* CSS Document */

body {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	background: #FFFFFF url(images/bg_tile.gif) repeat top center;
}

.clear {clear: both;}
img {border: 0;}

#wrapper {margin: 0px auto; padding: 0px 0px 20px 0px; width: 960px;}

/*** HEADER ***/
#header {margin: 0px auto; padding: 20px 0px;}
#header .logo {float: left;}
#header .nav {float: right;}

/*** NAVIGATION ***/
#navigation ul {padding: 0px; margin: 5px 0px 0px 0px; list-style: none; float: left;}
#navigation ul li {float: left; display: inline; /*For ignore double margin in IE6*/ margin: 0px 5px; font-size: 14px; color: #FFFFFF; font-weight: bold;}
#navigation ul li a {text-decoration: none; float: left; color: #9c9c9c; cursor: pointer;}
#navigation ul li a span {margin: 0px 5px 0px -5px; padding: 5px 4px 5px 9px; position: relative; /* Fixes issue in IE6 with it not displaying */ float: left;}
#navigation ul li a.current, #navigation ul li a:hover {
	background: url(images/navbg.png) no-repeat top right;
	height: 30px;
	color: #FFFFFF;
}
#navigation ul a.current span, #navigation ul li a:hover span {
    background: url(images/navbg.png) no-repeat top left;
	height: 30px;
}
#navigation ul.left {float: left;}
#navigation ul.right {float: right;}

/*** TOP CONTENT ***/
#mainbanner {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 600px;
	height: 100px;
	color: #FFFFFF;
	float: right;
}
#mainbanner .header {margin: 0px; padding: 0px;}
#contactme {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 306px;
	height: 100px;
	color: #FFFFFF;
	float: left;
	font-size: 14px;
	font-weight: bold;
}
#contactme .header {margin: 0px 0px 5px 0px; padding: 0;}
#contactme .contactbtn {margin: 10px 0px 0px 0px; padding: 0; text-align: center;}

/*** MAIN CONTENT ***/
.sep1 {
	margin: 0px 30px 0px 0px;
	padding: 0;
	width: 100px;
	height: 10px;
	float: right;
	background: url(images/sep1.gif) repeat-y top center;
}
.sep2 {
	margin: 0px 0px 0px 30px;
	padding: 0;
	width: 100px;
	height: 10px;
	float: left;
	background: url(images/sep1.gif) repeat-y top center;
}
.sep3 {
	margin: 0px 30px 0px 0px;
	padding: 0;
	width: 100px;
	height: 15px;
	float: right;
	background: url(images/sep1.gif) repeat-y top center;
}
.sep4 {
	margin: 0px 0px 0px 30px;
	padding: 0;
	width: 100px;
	height: 15px;
	float: left;
	background: url(images/sep1.gif) repeat-y top center;
}
.vertsep {
	margin: 0;
	padding: 0;
	width: 9px;
	height: 100px;
	float: left;
	background: url(images/sep-vert.gif) no-repeat top center;
}
.vertsep-small {
	margin: 20px 0 0 0;
	padding: 0;
	width: 9px;
	height: 50px;
	float: left;
	background: url(images/sep-vert.gif) no-repeat top center;
}
.middlesep {
	margin: 0px auto;
	padding: 0;
	background: url('images/middlesep.gif') top center no-repeat;
	width: 260px;
	height: 10px;
}

.drip1 {
	float: left;
	margin: 0px 0px 0px 10px;
}

#maincontent1 {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 940px;
	color: #FFFFFF;
}
#maincontentInside1 {
	background: #FFFFFF url(images/bg_tile.gif) repeat top center;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 920px;
	color: #FFFFFF;
	position: relative;
}
#maincontentInside1Content {margin: 0px 0px 0px -15px;}

#aboutSite {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 940px;
	color: #FFFFFF;
}
#aboutSiteInside {
	background-color: #FFFFFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 920px;
	color: #FFFFFF;
	position: relative;
}

#aboutme {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 600px;
	color: #FFFFFF;
	float: right;
}
#aboutme .content {
	background-color: #FFFFFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 580px;
	color: #9c9c9c;
	position: relative;
}
#aboutme a {color: #ffb500; text-decoration: none; font-weight: bold;}
#aboutme a:hover {text-decoration: underline;}
#aboutme p {margin: 0; padding: 5px 0px;}
#aboutme ul {margin: 5px 0px 0px 25px; padding: 0;}
#aboutme li {margin: 0; padding: 0;}
#aboutme li.listHead {list-style: none; font-weight: bold; font-size: 14px; margin: 0px 0px 0px -20px;}

#gallery-topleft {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 600px;
	color: #FFFFFF;
	float: left;
}
#gallery-topleft .content {
	background-color: #FFFFFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 580px;
	color: #9c9c9c;
	position: relative;
}

#gallery-topright {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 306px;
	height: 100px;
	color: #FFFFFF;
	float: left;
	font-size: 14px;
	font-weight: bold;
}
#gallery-topright .header {margin: 0px 0px 5px 0px; padding: 0;}
#gallery-topright .contactbtn {margin: 10px 0px 0px 0px; padding: 0; text-align: center;}

#otherstuff {
	background-color: #9c9c9c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 940px;
	color: #FFFFFF;
}
#otherstuffInside {
	background-color: #FFFFFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 10px;
	width: 920px;
	color: #9c9c9c;
	position: relative;
}

#otherstuffInside .post {margin: 0 0 10px 0;}
#otherstuffInside .post h1 {color: #9c9c9c; margin: 0 0 5px 0;}
#otherstuffInside .postleft {float: left; margin: 0 5px 0px 0px; width: 640px;}
#otherstuffInside .postright {float: left; width: 230px; color: #9c9c9c;}
#otherstuffInside .postright h3 {font-size: 16px; margin: 0 0 5px 0; padding: 0;}

/*** TABS ***/
#tabSelect {margin: 0px 0px 10px 25px; padding: 0px;}
.tabswitch ul {padding: 0px; margin: 5px 0px 0px 0px; list-style: none; float: left;}
.tabswitch ul li {float: left; display: inline; /*For ignore double margin in IE6*/ margin: 0px 5px; font-size: 14px; color: #FFFFFF; font-weight: bold;}
.tabswitch ul li a {text-decoration: none; float: left; color: #9c9c9c; cursor: pointer;}
.tabswitch ul li a span {margin: 0px 5px 0px -5px; padding: 5px 4px 5px 9px; position: relative; /* Fixes issue in IE6 with it not displaying */ float: left;}
.tabswitch ul li a.current, .tabswitch ul li a:hover {
	background: url(images/navbg.png) no-repeat top right;
	height: 30px;
	color: #FFFFFF;
}
.tabswitch ul a.current span, .tabswitch ul li a:hover span {
    background: url(images/navbg.png) no-repeat top left;
	height: 30px;
}
.tabswitch ul.left {float: left;}
.tabswitch ul.right {float: right;}

.slide {
	margin: 0px 0px 0px 25px;
	padding: 5px;
	color: #9c9c9c;
	width: 271px;
	height: 240px;
	float: left;
	background: url(images/img_bg.png) no-repeat 0px 0px;
}
.slide img.mainimage {float: right;}

/*** FOOTER ***/
#footer {
	margin: 0px auto;
	text-align: center;
	padding: 10px;
	color: #494949;
}

/*** MISC STUFF & HEADERS ***/
.latestwork {margin: 0 0 5px 27px;}