/*stylesheet for xxxxxxxxxx.xxx	
created by: 
date: 
email: factotum@coraxdesign.com
website: http://www.coraxdesign.com
*/

/*
Directory of this file:
> Base CSS
> working borders/backgrounds
> global
> box properties
> colors
> links
> fonts
> images 
> lists
> tables
> forms
> miscellaneous classes
> sitework

END Directory 
*/

/*================Base CSS=====================  	
This file simply removes old-schoolstyling on most HTML elements in order to reduce the need to later override them.  copied from source css www.freakswhocare.org	
*/
h2,h3,h4,h5,h6,pre,code,p {font-size: 1em;}
  ul,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin: 0; padding: 0;}
  a img,:link img,:visited img {border: none;}
  address {font-style: normal;}
 /* a {text-decoration:none;} */
ul {list-style-type:none;}

/*---END	Base CSS--------------------END*/  	
  			 	
/*    	working borders/backgrounds   ========= 	
#wrapper {background:black;}
#logo {background:blue;}
#header {background:transparent url("..images/transBack1.png") top left repeat;}
#nav-menu{background:red;}
#search {background:white;}
#breadcrumbs {background:white;}
#left {background:#3d3e41;}
#contact {background:red;}
#credits {background:blue;}
#supp-1 {background: green;}
#content {background:white;}
#resources {background:orange;}
==END	working borders/backgrounds	END===*/ 	



/*==  	global	------------------------------*/ 	
body {
background:#1d1e21;
font:1em trebuchet, arial, helvetica, sans-serif;
}
h1 {font-size:2.5em;}
h2 {font-size:1.8em;}
h3 {font-size:1.5em;}
h4 {font-size:1.3em;}
h5 {font-size:1.15em;}
h6 {font-size:1em;}

/*----  END	global		  ==========END*/ 	


/*==  	
  	box properties: position, margins, padding
----*/ 	
#wrapper {
position:relative;
width:800px;
height:1000px /*auto*/;
top:0;
left:50%;
margin-left:-400px;
min-width:800px;
}
#logo {
position:fixed;
width:150px;
height:200px;
top:0;
left:50%;
margin-left:-390px;
margin-top:0px;
padding:0;
}
#header {
background:black;
z-index:5;
position:fixed;
width:630px;
height:60px;
top:0;
left:50%;
margin-top:0px;
padding-top:3px;
margin-left:-220px;
}

#header {background:transparent url("..images/transBack1.png") top left repeat;}

#nav-menu {
}
#search {
}
#breadcrumbs {
z-index:0;
}
#left {
position:fixed;
width:150px;
height:auto;
top:0;
left:50%;
margin-left:-390px;
margin-top:210px;
padding:.5em;
}


#credits {
position:fixed;
width:10em;
bottom:0;
left:0;
margin-bottom:.5em;
margin-left:.5em;
line-height:.85em;
font-size:.65em;
}
#supp-1 {
position:static;
margin-top:2em;
margin-left:-.5em;
border-top:8px solid #1d1e21;
height:20px;
width:100%;
padding:0em .5em;
}


#content {
position:absolute;
display:block;
width:50%;
height:auto;
top:0;
left:50%;
margin-left:-220px;
margin-top:58px;
padding:1em;
line-height:1.4em;
background:#f4f4d8;
color:#333333;
}
#resources {
position:fixed;
width:186px;
left:50%;
margin-top:93px;
margin-left:210px;
height:400px;
overflow:auto;
padding:.5em;
}
#breadcrumbs{
position:fixed;
width:175px;
left:50%;
margin-top:58px;
margin-left:210px;
height:28px;
line-height:1.15em;
padding:0em 1em;
background:#cccccc;
}



/*----  	
  END	box properties: position, margins, padding	END
=================          ==============================*/ 	

/*==  	
  	colors
----*/ 	
#content {background:#ffffff;}
.sample {
display:block;
background:#d8d8d8;
width:95%;
height:auto;
margin:.25em .3em;
padding:.25em;
color:#414141;
}
#left {background:#3d3e41;color:#ffbb00;}
#header {background:#3d3e41;}
#resources {background:#3d3e41;}

/*----  	
  END	colors					END
=================          ==============================*/ 	


/*==  	
  	links
----*/ 	
a {text-decoration:none;
}
#content a{font-weight:bold;text-decoration:underline;}
#content a:link {color:#574438;text-decoration:underline;}
#content a:visited {color:#8a7551;}
#content a:hover {color:#ed810e;}
#content a:active {color:#333333;}
#content ul.breakdown a{text-decoration:none;}


#supp-1 a {font-weight:bold;font:1.5em arial, helvetica, sans-serif;line-height:27px;padding-right:2em;}
#supp-1 a:link {color:#574438;background:transparent url("../images/arrow-right-ffa500.png") center right no-repeat;}
#supp-1 a:visited {color:#8a7551;background:transparent url("../images/arrow-right-ffa500.png") center right no-repeat;}
#supp-1 a:hover {color:#ed810e;background:transparent url("../images/arrow-right-ffa500-hover.png") center right no-repeat;}
#supp-1 a:active {color:#333333;}

#contact a:link{color:orange;}
#contact a:visited {color:#666666;;}
#contact a:hover{color:white;}
#contact a:active{color:red;}

#credits a:visited {color:#333333;}
#credits a:hover {color:#ed8a09;}
#credits a:active {color:white;}

#credits {color:#333333; /*this is in here, rather than fonts, as it's  */
			 /*  obscure until hovered-over...		*/
}
#credits a:link {color:#333333; 
}
#credits:hover a:link {
color:#ffbb00;
}
#credits:hover a:visited {
color:#ffbb00;
}
#credits:hover a:hover{
color:#ed8a09;
}
#credits:hover a:active{
color:red;
}

#credits:hover {
color:#ffffff;
}

#resources a {font-weight:bold;}
#resources a:link {color:#f5d316;}
#resources a:visited {color:#f5d316;}
#resources a:hover {color:#bbb;}
#resources a:active {color:yellow;}




.old-school a {text-decoration:underline;}
.old-school a:link {color:blue;}
.old-school a:hover {color:blue;}
.old-school a:visited {color:purple;}
.old-school a:active {color:blue;}
.old-school a img {border:1px solid blue;}
 code a {text-decoration:none;}
 code a:link {color:blue;}
 code a:hover {color:#ffbb00;}
 code a:visited {color:blue;}
#content td a:link code {color:blue;}
#content td a:visited code {color:blue;}
#content td a:hover code {color:#ffbb00;}
#content td a:active code {color:#333333;}


#resources a {font-size:.8em;}
a.wiki {line-height:16px;margin-left:8px;padding:2px;padding-left:22px;background:white url("../images/wikipediaGlobe16px.png") 2px 50% no-repeat;border:1px solid #a69393;display:inline-block;width:auto;}

#resources a code {display:block;font-size:2.5em;background:transparent;color:#ffbb00;margin-top:.5em;padding-top:.5em;}
#resources code.sample {font-size:1.1em;background:white;color:black;padding:.25em;}
#resources code.sample .highlight {color:blue;}
#resources .rendered {display:block;border:1px dotted #ffbb00;padding:.25em;}
#resources code.sample .note {display:inline;margin-bottom:0em;padding-bottom:0em;padding-left:0em;}


ul.quick-links a.ex-link1 {
background:transparent url("../images/exlink1.png") no-repeat left 50%;
padding-left:1.5em;
}
ul.quick-links a:hover.ex-link1 {
background:transparent url("../images/exlink-blink.gif") no-repeat left 50%;}

 a.ex-link1 {
background:transparent url("../images/exlink1.png") no-repeat right 50%;
padding-right:1.1em;
}
a:hover.ex-link1 {
background:transparent url("../images/exlink-blink.gif") no-repeat right 50%;}


a.mail-link {padding-left:18px;background:transparent url("../images/mail.png") top left no-repeat;font-size:.85em;font-weight:normal;}
a:hover.mail-link {padding-left:18px;background:transparent url("../images/mailB.png") top left no-repeat;font-size:.85em;font-weight:normal;}

.old-school code a {text-decoration:none;}

/*----  	
  END	links				END
=================          ==============================*/ 	



/*==  	
  	fonts
----*/ 	
#content {font:.8em arial, helvetica, sans-serif;
color:#333333/*#e5e5e5 #414141*/;
letter-spacing:.05em;
line-height:1.4em;}

}
p {margin:.5em 0em;
line-height:1.4em;
}
#resources .rendered p {margin:.5em 0em;}

code {display:inline;
position:relative;
white-space:normal;
font-size:1.1em;
color:black;
width:auto;
font-weight:bold;
padding:0px 3px;
}
#content table code {background:transparent;}
code.sample {background:#d8d8d8;}
code.total.tiny {background:white;font-size:.6em;line-height:.6em;z-index:0;}

code.css {white-space:pre;}

code strong {color:#b30000;}

code .num {color:green}

h3.purple {
font:40px impact;
color:purple;
}
#resources {
font-size:.8em;
line-height:1.1em;
letter-spacing:.05em;
color:#eeeeee;}

#left {font-size:.8em;}
#contact {
font-size:1em;
font-weight:bold;
}
.factotum {
font-size:1.5em;
}
#breadcrumbs {
font-size:.7em;
}
.tiny {
font-size:.5em;

}
.note {
display:block;
padding:.15em;
font-size:.85em;
letter-spacing:.0em;
line-height:.9em;}

ul.services.flow .note {
display:block;
padding:.15em;
font-size:.85em;
letter-spacing:.05em;
line-height:.9em;
}



#content h1 {
font:2.5em garamond, "times new roman", serif;
font-weight:bold;
padding:.5em .5em;
text-align:center;
}
#content h1, h2, h3, h4, h5, h6 {
padding:.25em;
margin:.25em;
line-height:1em;
}
#content h1.sans-serif, #content h2.sans-serif, #content h3.sans-serif, #content h4.sans-serif,#content h5.sans-serif, #content h6.sans-serif {font-family:helvetica, arial, sans-serif;}
#content h1.franklin {margin:.0;padding:.0;font-size:2.38em;}
#resources h1, h2, h3, h4, h5, h6 {
font-family:garamond, "times new roman", serif;
font-weight:bold;
line-height:.9em;
margin:.25em;
padding:.25em;
}
#resources h1 {
font-size:2.5em;
}
#resources h2 {
font-size:2.2em;
}
#resources h3 {
font-size:1.8em;
}
#resources h4 {
font-size:1.5em;
}
#resources h5 {
font-size:1.3em;
}

#resources h6 {
font-size:1.1em;
line-height:1em;
}
blockquote {font-size:.9em;margin:.5em 1.5em;padding:0em 1em;min-height:60px;}
h2.huge {font-size:3.5em;font-family:trebuchet, arial, helvetica, sans-serif;top:0;margin-top:0;text-transform:none;color:#777777;padding-left:10px;padding-top:10px;}

.note {font-size.8em;width:80%;}


/*----  	=================          
IMAGE REPLACEMENT DEMO
=================          ==============================*/ 	

#content h1.ben-franklin {
position:relative;
height:38px;
width:350px;
padding:0;
text-align:left;
font-size:2em;
letter-spacing:0;
overflow:hidden;
margin-left:auto;
margin-right:auto;
text-align:center;
line-height:38px;
}
#content h1.ben-franklin span {
position:absolute;
height:38px;
width:350px;
left:0;
top:0;
margin:0;
background:url("../images/miscImages/fonts/IRtipOfHatCasAnt350x38-022310.gif") no-repeat;
} 

#content h1.ben-franklin.demo span {
background:url("../images/miscImages/fonts/IRtipOfHatCasAnt350x38-TRANS-022310.png") no-repeat;
}
#content h1.ben-franklin.future span {
background:url("../images/miscImages/fonts/IRtipOfHatDCSupStruct350x38-022310.jpg") no-repeat;
}


/*----  	
  END	fonts				END
=================          ==============================*/ 	


/*==  	
  	images
----*/ 	

#credits {
background:transparent url("../images/Q-mark-ghostA.png") bottom left no-repeat;
}
#credits:hover {
background-image:none;
}
.question {background:transparent url("../images/question.png") right center no-repeat;}
.answer {background:transparent url("../images/answer.png") right top no-repeat;}

img.sample1 {border:3px solid black;margin:10px;}
img.sample2 {
margin:10px;
padding:15px;
border-top:1px solid #ccc;
border-right:1px solid #333;
border-bottom: 1px solid #333;
border-left: 1px solid #ccc;
}
img.sample3 {
margin:10px;
padding:15px;
border-top:1px solid #ccc;
border-right:1px solid #333;
border-bottom: 1px solid #333;
border-left: 1px solid #ccc;
background:#f9f4f4;}

#breadcrumbs {
background:black url("../images/30pxRndCrnr-f4f4d8-1d1e21-right.gif") right center no-repeat;
padding-top:2px;
}
#breadcrumbs .round {
position:relative;
height:auto;
width:auto;
margin-left:-12px;
padding-left:12px;
background:white url("../images/20pxRndRectWtBlk-left.gif") left top no-repeat;
}
#content img {margin:1em;margin-left:0em;}
#content img.franklin {
clear:left;
float:left;
margin:1em 0em;
position:relative;
left:50%;
margin-left:-75px;
}

/* here's the CSS for drop shadows; the images are in /image/shadow */

.shadowed {background:white url("../images/shadow/dropShad-ffffff.jpg") right bottom no-repeat;}
.shadowed-rt {background:white url("../images/shadow/dropShad-topright-ffffff.jpg") right -60px no-repeat;}
.shadowed-lb {padding-right:40px;padding-bottom:40px;background:white url("../images/shadow/dropShad-btmleft-ffffff.jpg") -60px bottom no-repeat;}

#content.splash {
background:white url("../images/philoBack.jpg") top left repeat;
}
#content blockquote {
padding-left:60px;background:transparent url("../images/quote-open-A.png") top left no-repeat;
}
#content blockquote div{
padding-right:60px;background:transparent url("../images/quote-close-A.png") bottom right no-repeat;
}

#resources blockquote {
padding-left:60px;background:transparent url("../images/quote-open-B.png") top left no-repeat;
}
#resources blockquote div{
padding-right:60px;background:transparent url("../images/quote-close-B.png") bottom right no-repeat;
}

.tlc {background:transparent url("../images/corner/tlc-1d1e21.png") top left no-repeat;}
.trc {background:transparent url("../images/corner/trc-1d1e21.png") top right no-repeat;}
.brc {background:transparent url("../images/corner/brc-1d1e21.png") bottom right no-repeat;}
.blc {background:transparent url("../images/corner/blc-1d1e21.png") bottom left no-repeat;}

#content img.thumb {
margin:.15em;
float:left;
}

.figure { /*accompanies two classes below to make for captioned images */
float:left;
position:relative;
background:transparent url("../images/50trans.png") top right repeat;
margin-bottom:1.5em;
}
 #content img.thumb.caption-added {display:block;margin:1em .75em;}

.caption {
position:absolute;
bottom:-1em;
left:0;
}


/*----  	
  END	images				END
=================          ==============================*/ 	


/*==  	
  	lists
----*/ 	

ul .quick-links li {
font-size:.9em;
display:block;
line-height:8px;
}

ul.sitemap {
line-height:.8em;
font:.9em serif;
}
ul.sitemap h4{
margin:.05em 0em;
}
ul.sitemap li {
line-height:.8em;
padding-left:.3em;
}
ul.sitemap li ul li {
padding-left:.65em;
}

ul.sitemap li ul li ul li {
padding-left:.95em;
}
ul.sitemap li ul li ul li ul li{
padding-left:1.25em;
}

ul.sitemap a:hover {text-decoration:underline;}

#content dl dt {
font-weight:bold;
}
#content dl dd {
font-weight:normal;
text-transform:italic;
margin-left:2em;
}


#content dl ul {
margin-left:1em;}

#content dl ul li {
margin-top:.25em;
padding-left:15px;
background:transparent url("../images/check-bullet-tiny.png") 0px 2px no-repeat;
}
#resources ul.tools li {
margin:.25em;

padding-left:15px;
background:transparent url("../images/check-bullet-yellow-tiny.png") 0px 2px no-repeat;

}

#resources ul.flow {
margin-top:1em;
margin-left:1.5em;
list-style-image:url("../images/yel-rect-bullet.png");
}
#resources ul.breakdown {
margin-left:1.5em;
list-style-image:url("../images/yel-rect-broken-bullet.png");
}
#resources ul.flow li, #resources ul.breakdown li {
padding-top:.15em;
}

#content ul.flow {
margin-top:1em;
margin-left:1.5em;
list-style-image:url("../images/yel-rect-bullet.png");
}
#content ul.breakdown {
margin-left:1.5em;
list-style-image:url("../images/yel-rect-broken-bullet.png");
}
#content ul.flow li, #resources ul.breakdown li {
padding-top:.15em;
}

dl.glossary dt {
font-weight:bold;
font-size:1.3em;
margin:.35em 0em;
font-family:garamond, "times new roman", serif;
padding-left:1em;
background:transparent url("../images/yel-rect-bullet.png") center left no-repeat;

}
dl.glossary dd {
margin-left:1.5em;
}

#resources dl dd code {line-height:.8em;color:#ffbb00;padding:0;background:transparent;}

#resources .rendered dl {
font-size:.9em;
}
#resources .rendered dt {font-weight:bold;}
#resources .rendered dd {margin-left:1em;}
#resources .rendered ul.standard {list-style:square;padding-left:2em;}
#resources .rendered ol.standard {list-style:decimal;padding-left:2em;}

/*----  	
  END	lists				END
=================          ==============================*/ 	


/*==  	
  	tables
----*/ 	
/* insert styles here */

#tag-table {display:block;clear:both;}


/*----  	
  END	tables				END
=================          ==============================*/ 	



/*==  	
  	forms
----*/ 	
/* insert styles here */

/*----  	
  END	forms				END
=================          ==============================*/ 	

/*==  	
  	miscellaneous classes
----*/ 	
.left {float:left;}
.right {float:right;}
.clear-both {clear:both;}
.clear-left {clear:left;}
.clear-right {clear:right;}


.vertical-spacer {
display:block;
height:11em;
background:t5ansparent;
width:auto;
}

.shrinkwrapped {float:left;}

#content p {clear:both;
margin-top:.85em;}

h2.question {padding:.25em;}
h4.answer {padding:.25em;}

/*========================KWICKS styles===============*/
/* This css file serves as a template for styling your kwicks.  Feel free to modify, but please make note of the comments - some of them are important. */
body {
	background-color: #1d1e21;
	padding: 50px;
}
.kwicks {
	/* recommended styles for kwicks ul container */
	list-style: none;
	position: relative;
	margin: 0;
	padding: 0;
}
.kwicks li{
	/* these are required, but the values are up to you (must be pixel) */
	width: 125px;
	height: 100px;

	/*do not change these */
	display: block;
	overflow: hidden;
	padding: 0;  /* if you need padding, do so with an inner div (or implement your own box-model hack) */
}
.kwicks.horizontal li {
	/* This is optional and will be disregarded by the script.  However, it should be provided for non-JS enabled browsers. */
	margin-right: 5px; /*Set to same as spacing option. */	
	float: left;
}
.kwicks.vertical  li{
	/* This is optional and will be disregarded by the script.  However, it should be provided for non-JS enabled browsers. */
	margin-bottom: 5px; /*Set to same as spacing option. */	
}

#kwick_1 { 
	background-color: #53b388;
}
#kwick_2 {
	background-color: #5a69a9;
}
#kwick_3 {
	background-color: #c26468;
}
#kwick_4 { 
	background-color: #bf7cc7;
}
.kwicks.horizontal #kwick_4 {
	margin-right: none; /* cancel margin on last kiwck (if you set a margin above) */
}
.kwicks.vertical #kwick_4 {
	margin-bottom: none; /* cancel margin on last kiwck (if you set a margin above) */
}

.menu_list {	
	width: 150px;
}
.menu_head {
	padding: 5px 10px;
	cursor: pointer;
	position: relative;
	margin:1px;
    font-weight:bold;
    background: #eef4d3 url(left.png) center right no-repeat;
}
.menu_body {
	display:none;
}
.menu_body a{
  display:block;
  color:#006699;
  background-color:#EFEFEF;
  padding-left:10px;
  font-weight:bold;
  text-decoration:none;
}
.menu_body a:hover{
  color: #000000;
  text-decoration:underline;
  }

/*========================KWICKS styles=======END=====*/
/*----  	
  END	miscellaneous classes		END
=================          ==============================*/ 	

/*======================================= SITEWORK======*/
/* 		install this html outside the wrapper div; 
		just before the </body> tag:
		<div id="sitework">
		sitework&nbsp;&raquo;<br /><a												href="http://www.coraxdesign.com"target="blank" title="Corax Design :: we'll build, host, and manage your site, and we're all genius-weirdos!">coraxdesign.com</a>
</div><!--close"sitework"-->
*/


#sitework {
position:fixed;
height:auto;
width:auto;
bottom:10px;
right:20px;
font:.7em verdana, trebuchet, arial, helvetica, sans-serif;
color:#666666;
background:transparent url(images/50trans.png)top left repeat;
padding:0px 2px 0px 2px;
}
#sitework a {
margin-top:-10px;
display:block;
line-height:22px;
height:16px;
padding-right:20px;
background:transparent url(http://www.coraxdesign.com/images/16TargetSpriteGryYel.jpg) bottom right no-repeat;
text-decoration:none;
color:#666666;
font-weight:bold;
font-variant:small-caps;
}
#sitework a:link {color:#666666;}
#sitework a:visited {color:#666666;}
#sitework a:hover {color:#ff8800;background:transparent url(http://www.coraxdesign.com/images/16TargetSpriteGryYel.jpg) top right no-repeat;}
#sitework a:active {color:#cccccc;}
#sitework a img {border:1px solid transparent;}
/*===========================================end SITEWORK==*/