body {
	min-width: 500px;  margin: 0;  padding: 0 10px 10px;
	font: 12px/18px Verdana, Helvetica, sans-serif;
	color: #444;
	background: #588ab8;
}
h1, h2, h3, h4, h5 { margin: 0 }
h2, h3 {
	font: 29px Franklin Gothic Demi Cond, Franklin Gothic Demi, Gill Sans MT, Helvetica, Arial, sans-serif;
}
h3 { font-size: 1.6em }
.home h2, .home h3 { font-size: 25px }
h4 { font-size: 12px }
h2+p { margin-top: 0 }



a:link { color: #f60 }
a:link:hover { color: #d40 }
a:visited { color: #588ab8 }
a:visited:hover { color: #366896 }
a img { border: 0; }

ul { margin-top: 0 }



#header { background: #588ab8 }
#header h1, #header a {
	margin: 0;  padding: 0;  line-height: 84px;  text-decoration: none;
	display: block;  width: 264px;  height: 84px;  text-indent: -9999px;
}
#header h1 { background: transparent url(/images/v4/header_kaulerdotcom.gif) bottom left no-repeat }
#subHeader {
	height: 28px;
	background: #000 url(/images/v4/header_sub_right.gif) top right no-repeat;
}
#subHeader ul {
	margin: 0;  padding: 0 0 0 19px;  width: 340px;  height: 28px;
	background: #000 url(/images/v4/header_sub_left.gif) top left no-repeat;
}
#subHeader li {
	margin: 0;  padding: 0;
	list-style: none;  float: left;  width: 80px;
}
#subHeader a {
	text-decoration: none;  font-weight: bold;  text-align: center;
	color: #8cafce;
	line-height: 28px;
	display: block;  width: 100%;
}
#subHeader li.on a { color: #fa2 }
#subHeader a:hover { color: #aecfef }
#subHeader li.on a:hover { color: #fc4 }
#subHeader a:active { color: #fff }
#subHeader .clr {  }





#wholePage {
	background: transparent url(/images/v4/bg_shadow_c_lr.gif) top left repeat-y;
	margin: 0 auto;  max-width: 750px;
}
#notHeader {
	background: #f5f5f5 url(/images/v4/bg_shadow_c_lr.gif) top right repeat-y;
	margin: 0 0 0 21px;  padding-right: 19px;
	position: relative;
}



#main {
	position: relative;
	background: #f5f5f5 url(/images/v4/bg_shade_grey.gif) top left repeat-x;
}
#main .content {
	padding-bottom: 50px;
}
html>body #main .content { background: transparent url(/images/v4/bg_swirl.png) bottom right no-repeat }
#main hr { display: none }



.features {
	background: #9bb9d5 url(/images/v4/bg_shade_features_2.gif) top left repeat-x;
	height: 98px;  border-bottom: 2px solid #000;
}
.features a { position: absolute;  top: -112px;  right: 29px;  display: block;  width: 303px;  height: 210px }
html>body .features a { right:0 }
.features a#feature-art-kicktopps { width:320px;  right: 10px }
html>body .features a#feature-art-kicktopps { right: -20px }


.newsItems { padding: 15px;  clear: left }
.newsItem { margin-bottom: 2em }
.newsItem p { margin-top: 2px;  text-align: justify }
.newsItem h3 { line-height: 1em;  color: #222 }



#sideBar h2 { font-size: 20px }
#sideBar h3 { font-size: 20px }
#sideBar ul { list-style: square;  padding: 0;  margin: 0 15px 4em 1em }
#sideBar li { padding: 5px 5px 5px 5px }
#sideBar li:hover { background: #d5d5d5;  color: #222 }



#footer {
	background: transparent url(/images/v4/bg_shadow_bottom.gif) bottom left repeat-x;
	margin: -49px -19px 0 -21px;  padding-top: 20px;
	position: relative;
	height: 50px;
}
#footer hr { display: none; }
#footer .hr {
	position: absolute;  bottom: 1px;  left: 0;
	width: 28px;  height: 20px;
	background: transparent url(/images/v4/bg_shadow_bottomleft.gif) bottom left no-repeat;
}
#footer p {
	padding: 0 0 0 36px;  margin: 0;
	display: block;  position: relative;  top: -1px;
	background: transparent url(/images/v4/bg_shadow_bottomright.gif) bottom right no-repeat;
	color: #777;
	height: 50px;
}
#footer small { font-size: 9px;  line-height: 14px }
#footer a { color: #777;  text-decoration: none }



.clr, .removeFloat { clear: both; }



/* --------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------- */



.cols-MS #main { float: left;  margin-right: -300px }
.cols-MS #main .content { margin: 0 330px 0 0 }
.cols-MS #sideBar {
	position: absolute;  top: 0;  right: 19px;
	width: 285px;  float: right;
	padding: 15px 15px 0 0;
	font-size: 10px;  line-height: 13px;
	color: #555
}

.home #main {
	float: none;  margin: 0;
	background: #f5f5f5 url(/images/v4/bg_shade_grey_lower.gif) top left repeat-x;
}
.home #main .content { margin: 0 }
.home .newsItems { margin-right: 330px }
.home #mainFooter { clear: both }
.home #sideBar { top: 100px }



.general .content { padding: 15px 25px }
.general label { font-weight: bold }



/* --------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------- */



.gallery { background: #444;  color: #eee;  padding: 0 0 10px }
.gallery #main { background: #555 url(/images/v4/bg_shade_greydark.gif) top left repeat-x }
.gallery #notHeader { background: #555 url(/images/v4/grey_bg_shadow_c_lr.gif) top right repeat-y }
.gallery #wholePage {
	max-width: 772px;
	background: transparent url(/images/v4/grey_bg_shadow_c_lr.gif) top left repeat-y
}
.gallery #main .content { padding: 10px 15px 50px }

.gallery #footer { background: transparent url(/images/v4/grey_bg_shadow_bottom.gif) bottom left repeat-x }
.gallery #footer .hr { background: transparent url(/images/v4/grey_bg_shadow_bottomleft.gif) bottom left no-repeat }
.gallery #footer p { color: #aaa;  background: transparent url(/images/v4/grey_bg_shadow_bottomright.gif) bottom right no-repeat }

.gallery a, #thumbnails em { font-weight: normal;  color: #aaa }
.gallery a:hover { color: #fff }

.gallery #fullImage img { margin: 0 auto }

.gallery h2 { margin: 0.2em 0;  color: #aaa }

.gallery #header { background: #444 }
.gallery #header h1, .gallery #header a { width: 277px;  line-height: 84px;  height: 84px }
.gallery #header h1 { background-image: url(/images/v4/grey_header_kaulerdotcom.gif) }
.gallery #subHeader { background: #000 url(/images/v4/grey_header_sub_right.gif) top right no-repeat }
.gallery #subHeader ul { background: #000 url(/images/v4/grey_header_sub_left.gif) top left no-repeat }
.gallery #subHeader a { color: #888 }
.gallery #subHeader li.on a { color: #ccc }
.gallery #subHeader a:hover { color: #aaa }
.gallery #subHeader li.on a:hover { color: #fff }

.caption { clear: both;  padding: 0 0 15px 0;  color: #eee;  line-height: 1.3em }

.gallery .navigation a, .gallery .navigation strong, .gallery .navigation span {
	display: block;  float: left;  width: 7em;  border: 1px solid #222;  padding: 0.25em;
	text-align: center;  margin-right: 2px;
	background: transparent url(/images/v3/grey_header_nav_bg.gif) top left repeat-x;
	position: relative;
}
.gallery .navigation { padding-bottom: 15px }
.gallery .navigation a:link    { color: #999;  text-decoration: none }
.gallery .navigation a:visited { color: #999;  text-decoration: none }
.gallery .navigation a:hover   { color: #fff;  text-decoration: none;  background-color: #666;  background-position: 0% 25% }
.gallery .navigation strong { float: right;  margin: 0;  color: #999 }
.gallery .navigation span { color: #222;  background: none;  border-color: #222 }

#thumbnails { width: 100% }
.gallery #thumbnails { color: #eee }
#thumbnails img, .gallery #fullImage img { display: block;  border: 1px solid #000 }
#thumbnails img { width: 80px;  height: 80px }
#thumbnails a { text-decoration: none }
#thumbnails a.t { display: block;  float: left;  width: 82px;  border: 2px solid #555;  margin: 0 5px 5px 0 }
html>body #thumbnails a.t { border: 2px solid transparent }
#thumbnails a.t:hover { border: 2px solid #fa2 }
.gallery #thumbnails a.t:hover { border: 2px solid #fff }

/* Normal down-the-page gallery index */
#thumbnails .option { clear: left;  margin: 0 25% 10px 0 }
#thumbnails .optionDesc { margin-left: 105px }


