/* 
Title:		kitetails.com screen styles
Author: 	gordon@slickfishstudios.com
*/

html, body { 
	height: 100%;
	width: 100%; 
	margin: 0; 
	padding: 0;

/* add this to #format as it won't get pulled in up here. */
	font-size: small;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #506775;
}
body {
	background: #5ab5ee url(../images/cmtm_sky.jpg) repeat-x fixed center top;
}


a:link, a:hover, a:visited, a:active {
	outline: none;
}


h1 { /* red */
	font-weight: normal;
	font-size: 20px;
	color: #e41920;
}
h2 { /* yellow */
	font-weight: bold;
	font-size: 20px;
	color: #ffcc66;
	text-transform: uppercase;
	margin-bottom: 5px;
}
h3 { /* green uppercase */
	font-weight: normal;
	text-transform: uppercase;
	font-size: 18px;
	color: #a6c421;
	margin-bottom: 5px;
}
h4 { /* purple */
	font-weight: normal;
	font-size: 16px;
	color: #411c7e;
}
h5 { /* red normal size bold */
	font-weight: bold;
	font-size: 12px;
	color: #e41920;
	margin-bottom: 3px;
}
/* *************** COLORS *************** */

.red {
	color: #e41920;
}
.green {
	color: #a6c421;
}
.darkgreen {
	color: #869f15;
}
.blue {
	color: #579ff4;
}
.grey {
	color: #787878;
}
.orange {
	color: #ff7b00;
}
.yellow {
	color: #ffcc66;
}
.darkyellow {
	color: #e6b85d;
}
.purple {
	color: #411c7e;
}
.darker {
	color: #283c47;
}

.header {  /* bold/14px use with colors */
	font-weight: bold;
	font-size: 14px;
}
.header2 {  /* normal/14px use with colors */
	font-weight: normal;
	font-size: 14px;
}
.small { /* use with colors */
	font-size: .85em;
}
.norm {
	font-weight: normal;
	font-size: 12px;
	text-transform: capitalize;
}
.big { /* use with colors */
	font-size: 26px;
	font-weight: bold;
}
strong { /* lighter house color */
	font-weight: bold;
	color: #404c53;
}
b { /* darker house color */
	font-weight: bold;
}
em {
	color: #579ff4; /* blue */
}
i {
	
}
.indent {
	display: block;
	margin-left: 15px;
}
.news {
	background: url(../images/news_icon28.png) no-repeat left 2px;
	display: block;
	padding-left: 33px;
}
.indentBox {
	margin: 0 15px 10px;
	padding: 10px 0;
	border: 0;
	overflow: auto;
	clear: both;
}
.uppercase {
	text-transform: uppercase;
}
.lowercase {
	text-transform: lowercase;
}
hr {
	height: 1px;
	color: #ccc;
	border: 0;
	background: #ccc;
	clear: both;
	margin: 10px 0;
	padding: 0;
}

a {
	text-decoration: underline;
	color: #ff7b00;
	font-weight: normal;
}
a:hover {
	color: #6000ff;
}
a.backtotop {
	color: #fab926;
	text-decoration: none;
	display: block;
	text-align: right;
	font-size: .85em;
}
a.backtotop:hover {
	color: #ff7b00;
	text-decoration: underline;
}
a.pdf { 
	padding-left: 20px;
	background: url(../images/pdf_bull.jpg) no-repeat left -2px;
}
a.pdf:hover { 
	color: #e41920;
}


.bottom {
	border-bottom: 1px dotted #ccc;
}
.exhibit img {
	border: 1px solid #ccc;
	padding: 0;
	margin: 0 10px 2px 0;
	width: 150px;
	display: block;
}

blockquote {
	padding: 0;
	margin: 15px 15px;
}

/* *************** FLOATS RIGHT AND LEFT *************** */


.right_side, .left_side {
	font-size: 11px;
	color: #888;
}

.right_side {
	display: block;
	float: right;
	padding: 0;
	margin: 0 0 3px 15px;
	text-align: right;
}
.right_side a {
	text-decoration: none;
	font-size: 11px;
}
.right_side img {
	border: 1px solid #ccc;
}
.left_side {
	display: block;
	float: left;
	padding: 0;
	margin: 0 15px 3px 0;
}





/* *************** LISTS *************** */
ul.arrow, ul.nada {
	list-style-type: none;
	padding: 0;
	margin: 0;
}
ul.reg {
	list-style-type: circle;
	margin: 5px 10px;
}
ol {
	margin: 5px 10px;
}
ul.arrow li, ul.nada li {
	list-style-type: none;
	padding: 0 0 14px 19px;
	margin: 0;
	background: url(../images/arrow-blue.jpg) no-repeat left top;
} 
ul.tight li { /* use with arrow or nada to tighten spacing and indent a touch. */
	padding: 0 0 7px 19px;
	margin: 0 0 0 10px;
}
ul.nada li {
	list-style-type: none;
	padding-bottom: 5px;
	margin: 0;
	background-image: none;
}
ul.reg li {
	padding-bottom: 3px;
	margin: 0;
}
ol li {
	padding-bottom: 3px;
	margin: 0;
}
ul.arrow a, ul.arrow a:hover {
	text-decoration: underline;
	color: #ff7b00;
	font-weight: bold;
}
ul.arrow a:hover {
	color: #421095;
}
ol li p, ul.reg li p {
	color: #506775;
	padding: 0;
	margin: 0;
}

/* *************** DEFINITION LIST *************** */

dl {
	margin: 10px 0 20px 0;
	padding: 0 20px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
dt {
	color: #6c1c8d;
	padding: 0;
	margin: 10px 0 5px 0;
	font-size: 1.4em;
	font-weight: bold;
}
dd {
	padding: 0 0 10px 0;
	margin: 0 0 15px 0;
}


/* *************** ALTERNATE FLASH CONTENT *************** */


/* ***************//*************** */
/* ***************WRAPPERS*************** */
/* wrapper etc */
#wrapper { 
	margin: 0 auto;
	padding: 0;
	width: 970px;
}

/* *************** leftCol *************** */
#leftCol {
	float: left;
	width: 230px;
	margin: 0;
	padding: 0;
}
#leftCol #logo, #leftCol #logo-noflash {
	width: 100%;
	height: 185px;
	padding: 0;
	margin: 0;
}
#leftCol #logo #logo-noflash {
	background: url(../images/kitetails-logo.png) no-repeat left top;
}


#leftCol #subNav {
	width: 100%;
	padding: 0;
	margin: 0 0 6px 0;
}
#leftCol .extraBox {
	width: 100%;
	padding: 0;
	margin: 0;
}

/* ***************//*************** */
/* *************** #subNav *************** */

#leftCol #subNav, #subNav-inner {
	min-height: 270px;
	height: auto !important;
 	height: 270px;
}
#subNav-inner {
	 /* 29px wide */
	background-image: url(../images/bracket.png);
	background-repeat: no-repeat;
	background-position: right 4px;
}



#subNav-inner ul, #subNav-inner ul li ul {
	list-style-type: none;
	padding: 0px 0 10px 0;
	margin: 0;
	background-image: url(../images/subNav_bkg.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	font-size: 12px;
	display: block;
}
#subNav-inner ul li ul {
	background-image: none;
}
#subNav-inner ul li ul, #subNav-inner ul li.current ul  {
	list-style-type: none;
	padding: 0;
	margin: 0;
	background-image: none;
	font-size: 12px;
}
#subNav-inner ul li, #subNav-inner ul li ul li {
	padding: 0;
	margin: 0;
}
#subNav-inner ul li ul li {
	padding: 0 0 4px 0;
	margin: 0 25px 0 5px;
}
#subNav-inner ul li.current ul li {
	background: #fff;
	padding: 0 0 4px 0;
	margin: 0 25px 0 5px;
}



#subNav-inner ul li a, #subNav-inner ul li ul li a {
	color: #374263; /* dark house grey blue */
	text-decoration: none;
	display: block;
	background-image: url(../images/bullet-softred.gif);
	background-repeat: no-repeat;
	background-position: 5px 5px;
	padding: 3px 4px 3px 20px;
	margin: 0 25px 0 5px;
}
#subNav-inner ul li ul li a {
	color: #506775; /* soft house blue grey */
	padding: 0px 4px 0px 20px;
	margin: 0 25px 0 12px;
	background-image: url(../images/bullet-softgrey.gif);
	background-repeat: no-repeat;
	background-position: 5px 2px;
}
#subNav-inner ul li a:hover {
	color: #e41920; /* red */
	text-decoration: underline;
	background-image: url(../images/bullet-softred-over.gif);
	background-repeat: no-repeat;
	background-position: 5px 5px;
}
#subNav-inner ul li ul li a:hover {
	background-image: url(../images/bullet-softred-over.gif);
	background-repeat: no-repeat;
	background-position: 5px 2px;
}



#subNav-inner ul li.current ul li a, #subNav-inner ul li.current ul li a:hover  {
	color: #788e9b; /* soft house grey/blue */
	padding: 0px 4px 0px 20px;
	margin: 0 25px 0 12px;
	background: #fff url(../images/bullet-softgrey.gif) no-repeat 5px 2px;
}
#subNav-inner ul li.current ul li a:hover  {
	color: #506775; /* house grey/blue */
	background: #fff url(../images/bullet-softgrey-over.gif) no-repeat 5px 2px;
}

#subNav-inner ul li.current a, #subNav-inner ul li.current ul li.current a {
	color: #658a37; /* green */
	text-decoration: none;
	background: #fff url(../images/bullet-orange.gif) no-repeat 5px 5px;
}
#subNav-inner ul li.current ul li.current a {
	background: #fff url(../images/bullet-orange.gif) no-repeat 5px 2px;
}
#subNav-inner ul li.current a:hover, #subNav-inner ul li.current ul li.current a:hover {
	color: #749e33; /* green */
	text-decoration: underline;
	background: #fff url(../images/bullet-orange.gif) no-repeat 5px 5px;
}
#subNav-inner ul li.current ul li.current a:hover {
	background: #fff url(../images/bullet-orange.gif) no-repeat 5px 2px;
}


#subNav-inner #top-header {
	height: 28px;
	width: 210px;
	background: url(../images/subNav_top-header.png) no-repeat left top;
	display: block;
	margin: 0;
	padding: 0 0 0 15px;
	line-height: 28px;
}
#subNav-inner #top-header a {
	color: #d8f74e; /* light green */
	text-decoration: none;
	display: block;
}
#subNav-inner #top-header a:hover {
	color: #d8f74e; /* light green */
	text-decoration: underline;
}

/* ***************//*************** */
/* *************** extraBoxes and Buttons in Left Column *************** */

#leftCol .extraBox {
	width: 220px;
	min-height: 60px;
	height: auto !important;
 	height: 60px;
	margin-left: 10px;
}


#leftCol .sign-up  {
	background: url(../images/sign-up-header.png) no-repeat left top;
}

#leftCol .extraBox #donate {
	height: 60px;
	width: 120px;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../images/btn-donate.png) no-repeat left top;
	display: block;
	margin: 0 0 0 45px;
	border: 0;
}
#leftCol .extraBox #donate:hover {
	background: url(../images/btn-donate.png) no-repeat left -60px;
}


/* ***************//*************** */
/* *************** mainCol *************** */
#mainCol {
	float: left;
	width: 740px;
	margin: 0;
	padding: 0;
}

/* *************** mainCol SHORT NAVIGATION (mini nav at top of page) *************** */
#mainCol #shortNav {
	width: 100%;
	height: 28px;
	margin: 28px 0 0 0;
	padding: 0;
}
#mainCol #shortNavSlide {
	float: right;
	padding-right: 25px;
	overflow: hidden;
}
#mainCol #shortNavBlock, #mainCol #shortNavBlock-right {
	float: left;
	height: 28px;
	margin: 0;
	padding: 0 0 0 15px;
	background: url(../images/shortNav-bkg.png) no-repeat left top;
}
#mainCol #shortNavBlock-right {
	padding: 0 15px 0 0;
	background: url(../images/shortNav-bkg.png) no-repeat right top;
}
#mainCol #shortNavBlock ul {
	list-style-type: none;
	font-size: 12px;
	float: left;
	padding: 0;
	margin: 0;
}
#mainCol #shortNavBlock ul li, #mainCol #shortNavBlock ul li.dot {
	padding: 0 4px;
	margin: 0;
	height: 28px;
	line-height: 28px;
	float: left;
}
#mainCol #shortNavBlock ul li.dot {
	color: #7290b9;
}
#mainCol #shortNavBlock ul li a {
	color: #14247f;
	text-decoration: none;
}
#mainCol #shortNavBlock ul li a:hover, #mainCol #shortNavBlock ul li a.current {
	color: #095de6;
	text-decoration: none;
}
#mainCol #shortNavBlock ul li a.current {
	color: #e41920;
	text-decoration: none;
}
#mainCol #shortNavBlock ul li a.current:hover {
	color: #ff3b42;
	text-decoration: underline;
}


/* *************** mainCol NAV (main horizontal navigation) *************** */
#mainCol #nav {
	width: 100%;
	min-height: 28px;
	height: auto !important;
 	height: 28px;
	margin: 0;
	padding: 0;
	background: url(../images/nav-bkg.png) repeat-y left top;
}


/* *************** mainCol CONTENT *************** */
#mainCol #content {
	width: 100%;
	min-height: 330px;
	height: auto !important;
 	height: 330px;
	margin: 0;
	padding: 0;
	background: transparent url(../images/shadow.png) repeat-y left top;
}
#mainCol #content #format {
	width: 730px;
	min-height: 330px;
	height: auto !important;
 	height: 330px;
	margin: 0 5px;
	padding: 0;
	background: #fff;

	font-size: small;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #506775;
}
#mainCol #content #format #format-inner {
	padding: 5px 15px 15px 15px;
}




/* *************** mainCol Flash Footer & Flash Footer Home & home slides *************** */

#mainCol #flash-footer, #mainCol #flash-footer-home {
	width: 100%;
 	height: 100px;
	margin: 0;
	padding: 0;
	background: transparent url(../images/shadow.png) repeat-y left top;
}
#mainCol #flash-footer-home {
 	height: 135px;
}

#mainCol #home-slides {
	width: 245px; 
	height: 248px;
	margin: 0 0 0 0;
	padding: 0;
}
#mainCol #home-slides img {
	border: 0;
	width: 245px; 
	height: 248px;
}
#mainCol #visitus-btn {
	width: 199px;
	height: 59px;
	text-indent: -10000px;
	overflow: hidden;
	background: url(../images/visitus-btn2.jpg) no-repeat left top;
	display: block;
	margin: 0 0 0 25px;
	border: 0;
}
#mainCol #visitus-btn:hover {
	background: url(../images/visitus-btn2.jpg) no-repeat left -59px;
}


/* *************** mainCol FOOTER *************** */
/* ***************//*************** */
#mainCol #footer { 
	width: 100%;
	min-height: 48px;
	height: auto !important;
 	height: 48px;
	clear: both;
	font-size: .85em;
	color: #165987;  
	border: 0;
	margin: 0 0 30px 0;
	padding: 0;
	background: url(../images/footer-bkg.png) no-repeat left bottom;
	line-height: 125%;
}
#mainCol #footer .lighter {
	color: #d3edff;
}
#footleft { 
	margin: 0px;
	padding: 0;
	width: 30%;
	float: left;
}
#footleft p {
	margin: 0;
	padding: 6px 0 0px 12px;
}
#footmiddle { 
	float: left;
	margin: 0;
	padding: 0;
	width: 40%;
	display: inline;
	text-align: center;
}
#footmiddle p {
	margin: 0;
	padding-top: 6px;
}
#footright { 
	margin: 0;
	padding: 0;
	width: 30%;
	float: left;
	position: relative;
	text-align: right;
}
#footright p {
	margin: 0;
	padding: 6px 12px 0px 0;
}
#footer a {
	border-bottom: none;
	color: #165987;
	text-decoration: none;
	outline: none;
}
#footer a:hover {
	background: #d5f44b; /* bright green */
	color: #3478a6; /* blue */
	text-decoration: none;
}