/*	Styles.css Version 2012-02-27:				*/

/*			body			*/
html		{ height: 100%; }							/* footer at bottom */
body		{ color: $colorText; font-family:$fontMain; font-size:10pt; 
		background-color: $colorBackground; background-attachment: fixed; 
		background-image: $bodyImage; background-repeat: no-repeat;
		margin:0; padding:0; line-height: 1.5em; overflow:auto;
		border-radius: $borderRadius; -moz-border-radius: $borderRadius; }
body		{ height: 100%; }							/* footer at bottom */
body:before	{ content:""; height:100%; float:left; width:0; margin-top:-32767px; }	/* Opera fix */

/*			headers			*/
h1		{ color:$colorTitle; }
h1		{ font: 1.7em; font-weight: bold; text-align: center; margin-bottom: 1em 0; }
h2		{ font: 1.1em; font-weight: bold; color:$colorTitle; text-align: center; margin-bottom: 0.5em 0; 
		text-decoration: underline; }
h3:before	{ color: red; content: ".:: "; }
h3:after	{ color: red; content: " ::."; }
h3		{ margin: 1em 0 0 0; text-align: left; }
h4		{ margin: 0.5em 0; text-align: left; font-weight: bold; font-variant: small-caps; font-size: 1.1em; }
h5		{ background-color: rgba(255,255,255,0.40); }

/*			linking			*/
a:active	{ color: $colorA; position: relative; top: 1px; }
a:link		{ color: $colorA; }
a:visited	{ color: $colorAVisited; }
a:hover		{ color: $colorAHover; text-decoration: underline overline; font-variant: small-caps; }


a:visited	{ background: url(images/link.gif) repeat-x 100% 100%; text-decoration: none; }
a[href $='.doc'] 		{ padding: 0 0 0 25px; background: transparent url(/images/icon_word.gif)			no-repeat center left; }
a[href $='.pdf'] 		{ padding: 0 0 0 25px; background: transparent url(/images/icon_pdf.gif)			no-repeat bottom left; }
a[href $='.rtf'] 		{ padding: 0 0 0 25px; background: transparent url(/images/icon_word.gif)			no-repeat center left; }
a[href $='.txt'] 		{ padding: 0 0 0 25px; background: transparent url(/images/icon_txt.gif)			no-repeat center left; }
a[href $='.xls'] 		{ padding: 0 0 0 25px; background: transparent url(/images/icon_excel.gif)			no-repeat center left; }
a[href *='gwilt.org']		{ padding: 0 0 0 25px; background: transparent url(/images/icon-SteveFH-transparent.png)	no-repeat 5px 0px; }
a[href *='steve']		{ padding: 0 0 0 25px; background: transparent url(/images/icon-Steve.bmp)			no-repeat 5px 0px; }
a[href *='praisehimwith']	{ padding: 0 0 0 25px; background: transparent url(/images/icon-PCF-Graphic-transparent.png)	no-repeat 5px 0px; }
a[href *='pcf']			{ padding: 0 0 0 25px; background: transparent url(/images/icon-PCF-Graphic-transparent.png)	no-repeat 5px 0px; }
a[href *='p-c-f']		{ padding: 0 0 0 25px; background: transparent url(/images/icon-PCF-Graphic-transparent.png)	no-repeat 5px 0px; }



/*			lists, etc		*/
li		{ margin: 5px 0; }
ul li		{ list-style-type:none; }
ul li:before	{ color: $colorSymbol; content: "\25A0 \0020"; }
ul ul li		{ margin-left: 1em; list-style-type:none; }
ul ul li:last-child { margin-bottom: 15px; }
ul ul li:before	{ color: $colorSymbol; content: "\25D8 \0020";  }
hr		{ border: 0; border-top: solid $colorBorder 1px; }
p		{ text-indent: 2em; }
img		{ border: none; }

/*			tables			*/
table		{ background-color: $colorFieldBackground; color: $colorText; font-family:$fontMain; font-size:10pt; }
thead		{ background-color: $colorFieldHdrBackground; }
th		{ border: 1px solid $colorBorder; padding: 0 5px; background-color: $colorFieldHdrBackground; 
		text-align: center; vertical-align: bottom; }
td		{ border: 1px solid $colorBorder; padding: 0 5px; vertical-align: top; }
td td		{ border: none; }
td table		{ border: none; }
.alt tr:nth-child(2n)	{ filter: alpha(opacity=60); -moz-opacity: 0.60; opacity:0.6; 
			filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60); }

/*			forms, buttons		*/
input[type="text"]	{ border: 1px solid $colorBorder; margin: 2px 5px; padding-left: 5px; }
input[type="text"]:hover	{ border: 1px solid $colorSymbol; }
input[type="password"]		{ border: 1px solid $colorBorder; margin: 2px 5px; padding-left: 5px; }
input[type="password"]:hover	{ border: 1px solid $colorSymbol; }
input[type="file"]	{ border: 1px solid $colorBorder; margin: 2px 5px; padding-left: 5px; }
input[type="file"]:hover	{ border: 1px solid $colorSymbol; }
input[type="radio"]	{ background-color: $colorFieldHdrBackground; color: $colorSymbol; }
input[type="checkbox"]	{ background-color: $colorFieldHdrBackground; color: $colorSymbol; }
textarea		{ border-radius: $borderRadius; -moz-border-radius: $borderRadius; 
		border: solid $colorBorder 1px; font: $fontCode; }
#bubox		{ width:350px; margin-left: auto; margin-right: auto; padding:10px; }
a#bu		{ background-image: $buttonUp;
		display: block; width: 104px; height: 34px; margin: 0 auto;
		font: bold 22px $fontAlt; color: white;
		text-decoration: none; text-shadow: 1px 1px 2px rgba(0,0,0,0.20);
		line-height:28px; text-align:center; 
		}
a#bu:hover	{ background-image: $buttonDown; color: $colorButtonDownText; }

/*			boxed areas		*/
fieldset		{ font-family:$fontMain;
		color: $colorText; background-color:$colorFieldBackground;
		border-radius: $borderRadius; -moz-border-radius: $borderRadius; border: solid $colorBorder 1px; 
		padding:0px; }
legend		{ font-family:$fontMain; font-size:1.2em; font-variant:small-caps; font-weight: bold; 
		color: $colorText; background-color:$colorFieldBackground; 
		border-radius: $borderRadius; -moz-border-radius: $borderRadius;
		border: solid $colorBorder 1px; 
		border-bottom:none; padding: 0 10px 0 10px; }
.bubble fieldset	{ position:relative; padding-top: 0.5em; padding-bottom: 0.5em; }
.bubble legend	{ position: absolute; top: -0.75em; left: -0.43em; }

code		{ background-color: $colorFieldBackground; padding: 0 5px; font: 1.1em $fontCode; }
.blockquote	{ background-color: #b9c2a8; padding: 20px; margin-top: 30px; border: none; }
.literally	{ font-size: 11px; font-family: $fontCode;
		padding: 0; margin: 20px; border-left: 1px solid #ccc;
		background: $colorFieldBackground; background-image: url(images/pre_code_bg.gif) repeat-y left top;
		line-height: 20px; width: 1200px; overflow: auto; overflow-Y:hidden;
		}

/*			page layout		*/
/*
<page>
	<main>
		<header>
		</header>
	</main>
</page>
<footer>
</footer>
*/

.page		{ margin: 0px; padding: 0px; 
		min-height: 100%; }							/* footer at bottom */
.main		{ overflow:auto; padding-bottom: $footerHeight; }			/* footer at bottom */
.main table	{ background-color: $colorFooterHdrBackground; 
		box-shadow: 5px 5px 5px $colorShadow; }	/* hor vert [ blur [ spread ] (0=blur size) ] col */ 
.main td		{ border-radius: $borderRadius; -moz-border-radius: $borderRadius; }

/*			header/footers		*/
.header		{ margin: 0px; padding: 0px; width:100%; 
		color:$colorFooterForeground; 
		background: $colorBackground; /* old browsers */
		background-image: -webkit-linear-gradient(0deg, $colorBackground, $colorOutsideBackground );
		background-image: -moz-linear-gradient(0deg, $colorBackground, $colorOutsideBackground );
		background-image: -ms-linear-gradient(0deg, $colorBackground, $colorOutsideBackground );
		background-image: -o-linear-gradient(0deg, $colorBackground, $colorOutsideBackground );
		background-image: linear-gradient(0deg, $colorBackground, $colorOutsideBackground );
		}
.header h1	{ font-size:2em; }
.header td	{ border:none; text-align:center; }

#breadcrumb ul	{ margin:0;padding:0; list-style-type: none; padding-left: 1em; }
#breadcrumb ul li	{ background: none; list-style-image: none; display:inline; padding: 0 3px 0 0; margin: 3px 0 0 0; }
#breadcrumb ul li:before{ content: ''; }
#breadcrumb a	{ background: none; text-decoration: none; color: $colorTitle; }
td #breadcrumb	{ vertical-align: bottom; text-align: left; font-style:italic; font: 0.5em; }

.footer		{ margin: 0px; padding: 0px; width:100%; 
		color:$colorFooterForeground; 
		background-color: $colorBackground; /* old browsers */
		background-image: -o-linear-gradient( top, $colorBackground, $colorOutsideBackground );
		background: -moz-linear-gradient(top, $colorBackground 0%, $colorOutsideBackground 100% ); /* firefox */
		background: -webkit-gradient (linear, left top, left bottom, color-stop(0%,$colorBackground), color-stop(100%,$colorOutsideBackground)); /* webkit */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$colorBackground', endColorstr='$colorOutsideBackground',GradientType=0 ); /* ie */
		}
.footer		{ position: relative; margin-top: -$footerHeight; height: $footerHeight; clear: both; }	/* footer at bottom */
.footer td	{ text-align:center; border: none; color: $colorSymbol; }
.footer table	{ padding-bottom: 5px; width:100%; }

/*			other formatting	*/
sup		{ vertical-align: super }
.i		{ font-style:italic; }
.s		{ text-decoration: line-through; }
.nobdr		{ border: none; }
.upper		{ text-transform: uppercase; }
.lower		{ text-transform: lowercase; }

.white		{ color: white;	font-family:$fontMain; font-size:10pt; }
.red		{ color: red;	font-family:$fontMain; font-size:10pt; }
.blue		{ color: blue;	font-family:$fontMain; font-size:10pt; }
.green		{ color: green;	font-family:$fontMain; font-size:10pt; }

/*			other formatting	*/
.symbol		{ font-size:1.5em; color:$colorSymbol; text-shadow: $colorBorder 1px 1px 1px; }
.footnote	{ font-size:75%; font-style:italic; }
.new		{ color: red;	font-family:$fontMain; font-size:10pt; }
.linky		{ color: #600;	font-family:$fontMain; font-size:10pt; font-variant:small-caps; }

.lt		{ text-align: left; }
.ct		{ text-align: center; margin-left: auto; margin-right: auto; }
.rt		{ text-align: right; }

.pTP		{ vertical-align: top; }
.pMI		{ vertical-align: middle; }
.pBT		{ vertical-align: bottom; }
.pTL		{ vertical-align: top; text-align: left; }
.pTC		{ vertical-align: top;text-align: center; margin-left: auto; margin-right: auto; }
.pTR		{ vertical-align: top;text-align: right; }
.pML		{ vertical-align: middle;text-align: left; }
.pMC		{ vertical-align: middle;text-align: center; margin-left: auto; margin-right: auto; }
.pMR		{ vertical-align: middle;text-align: right; }
.pBL		{ vertical-align: bottom;text-align: left; }
.pBC		{ vertical-align: bottom;text-align: center; margin-left: auto; margin-right: auto; }
.pBR		{ vertical-align: bottom;text-align: right; }

.bt		{ border-top:    1px solid $colorBorder }
.br		{ border-right:  1px solid $colorBorder }
.bb		{ border-bottom: 1px solid $colorBorder }
.bl		{ border-left:   1px solid $colorBorder }

.hidden		{ display: none; }
.ft		{ font-weight:bold; font-size: 8pt; }
.half-height	{ line-height: 50%; display: block; }
.reddy		{ background-color: #FFB9B9; }

/*			clever transforms	*/
.opacity10	{ filter: alpha(opacity=10); -moz-opacity: 0.10; opacity:0.1; 
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=10);
		}
.opacity40	{ filter: alpha(opacity=40); -moz-opacity: 0.40; opacity:0.4; 
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
		}
.opacity60	{ filter: alpha(opacity=60); -moz-opacity: 0.60; opacity:0.6; 
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
		}
.opacity90	{ filter: alpha(opacity=90); -moz-opacity: 0.90; opacity:0.9; 
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
		}
/*	flip horizontally or vertically */
.fh		{  -moz-transform: scaleX(-1);
		     -o-transform: scaleX(-1);
		-webkit-transform: scaleX(-1);
		        transform: scaleX(-1);
		filter: FlipH; -ms-filter: "FlipH";
		}
.fv		{  -moz-transform: scaleY(-1);
		     -o-transform: scaley(-1);
		-webkit-transform: scaleY(-1);
		        transform: scaleY(-1);
		filter: FlipV; -ms-filter: "FlipV";
		}

/*	rotate 90 clockwise	*/
.rotate90	{  -moz-transform-origin: left top;	   -moz-transform: rotate(90deg) translate(0.5em,-1.5em);
		     -o-transform-origin: left top;	     -o-transform: rotate(90deg) translate(0.5em,-1.5em);
		-webkit-transform-origin: left top;     -webkit-transform: rotate(90deg) translate(0.5em,-1.5em);
			transform-origin: left top;		transform: rotate(90deg) translate(0.5em,-1.5em); 
		}

/*	1-second CSS3 time transforms	*/
.timed1		{ 
		     -o-transition: all 1s;
		   -moz-transition: all 1s;
		-webkit-transition: all 1s;
		        transition: all 1s;
		}

@-webkit-keyframes blink{  0%   { opacity: 0; }  100% { opacity: 1; }}
@-moz-keyframes blink	{  0%   { opacity: 0; }  100% { opacity: 1; }}
@-o-keyframes blink	{  0%   { opacity: 0; }  100% { opacity: 1; }}
@keyframes blink	{  0%   { opacity: 0; }  100% { opacity: 1; }}
.blink		{ text-decoration: blink; 
		-webkit-animation: blink 1s infinite; /* Safari 4+ */
		-moz-animation:    blink 1s infinite; /* Fx 5+ */
		-o-animation:      blink 1s infinite; /* Opera 12+ */
		animation:         blink 1s infinite; /* IE 10+, Fx 29+ */
		}