@charset "windows-1252";
/* CSS Document */
/* 
	body.unsword
	body.chronology
	body.layercake
		 + ophone variety
		 + workshop variety
		 + unsword variety
	body.klossrymd
*/


/* CHRONOLOGY STRUCTURE */
ol.boxspace div.chronology {
	float:left;
	width:900px;
	margin:0 0 0 0px;
	padding:0 0 0 0;
	color:white;
	font:12px/16px Georgia, "Times New Roman", Times, serif;
}
ol.boxspace div.chronology ul {
		margin:10px 0 10px 0;
		padding:0 10px 0 10px;
		list-style-type:none;
	}
ol.boxspace div.chronology ul li {
			padding:0 0 10px 0;
		}
ol.boxspace div.chronology ul li span.date {
			font:10px/16px "Courier New", Courier, mono;
			font-weight:bold;
			background:white;
			color:black;
			margin-left:-10px;
			padding:0px 2px 0 2px;
		}
ol.boxspace div.chronology div.future,  ol.boxspace div.chronology div.now,  ol.boxspace div.chronology div.past {
		width:300px;
		float:left;
	}
ol.boxspace div.chronology div.now {
		padding-top:250px;
	}
ol.boxspace div.chronology div.past{
		padding-top:400px;
	}
ol.boxspace div.chronology div.future {
		padding-top:100px;
	}
ol.boxspace div.chronology a {
		text-decoration:none;
		color: #FF9933;
	}
ol.boxspace div.chronology a:hover {
		text-decoration:underline;
	}




/* * * * * * * * * * * * */
/* Layercake Structure  */
/* * * * * * * * * * * */

ol.boxspace div.header {
	width:750px;
	height:250px;
	background:black;
	color:white;
	padding:0;
	margin:0;
	overflow:hidden;
}
ol.boxspace div.header div.logo {
		float:left;
		width:450px;
		height:250px;
	}
ol.boxspace div.header div.pithyblurb {
		float:left;
		width:300px;
		height:125px;
	}
ol.boxspace div.header div.pithyblurb h1 {
		font:15px/20px Arial, Helvetica, sans-serif;
		padding:0 10px 0 10px;
		margin:10px 0 10px 0;
		font-weight:bold;
	}
ol.boxspace div.header div.pithyblurb p {
		padding:0 10px 0 10px;
		margin:10px 0 10px 0;
	}
ol.boxspace div.header div.pithyblurb a {
		color:#00adef;
		font-weight:bold;
		text-decoration:none;
	}
ol.boxspace div.header div.pithyblurb a:hover {
		/** border-bottom:1px dotted #00adef;	**/
	}
ol.boxspace div.header div.sections {
		float:left;
		width:300px;
		height:125px;
	}
ol.boxspace div.header div.sections ul {
				padding:0;
				margin:0;
				list-style:none;
		}
ol.boxspace div.header div.sections ul li {
			float:left;
			width:300px;
			height:25px;
			display:block;
			padding:0;margin:0;
		}
ol.boxspace div.header div.sections ul li a {
			float:left;
			width:300px;
			height:25px;
			font:12px/25px Arial, Helvetica, sans-serif;
			display:block;
			font-weight:bold;
			padding:0;margin:0;
			background:black;
			text-decoration:none;
			color:#8dc63f;
			color:white;
		}
ol.boxspace div.header div.sections ul li a:hover {
			background:url(stripeanim40x20_dotted2.gif) top left repeat;
			color:white;
		}
ol.boxspace div.header div.sections ul li a span {
			padding:0 10px 0 10px;
		}
ol.boxspace div.header div.sections ul li.selected a {
			background:white;
			color:black;
		}
ol.boxspace div.contentcake {
	width:450px;
	margin:0 0 0 300px;
	background:white;
	padding:5px 0 0 0;
	clear:both;
}
ol.boxspace div.contentcake h1,  ol.boxspace div.contentcake h2,  ol.boxspace div.contentcake h3,  ol.boxspace div.contentcake h4 {
	margin:10px 0 10px 0;
	padding:0 10px 0 10px;
}
ol.boxspace div.contentcake p {
	margin:10px 0 10px 0;
	padding:0 10px 0 10px;
	font:12px/15px Georgia, "Times New Roman", Times, serif;
}
ol.boxspace div.contentcake h4 {
	font:12px/15px Georgia, "Times New Roman", Times, serif;
	font-weight:bold;
	margin-top:-5px;
	margin-bottom:-10px;
}
ol.boxspace div.contentcake h3 {
	font:12px/15px Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-transform:uppercase;
	letter-spacing:0.05em;
	margin-bottom:-10px;
}
ol.boxspace div.contentcake h2 {
	font:15px/15px Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-weight:bold;
	font-weight:normal;
}
ol.boxspace div.contentcake ul,
ol.boxspace div.contentcake ol {
	margin:10px 10px 10px 25px;
	padding:0 10px 0 10px;
	font:12px/15px Georgia, "Times New Roman", Times, serif;
}
ol.boxspace div.contentcake ul li,
ol.boxspace div.contentcake ol li {
	margin:0.5em 5px 0.5em 5px;
	padding:0 10px 0 10px;
}
ol.boxspace div.contentcake a {
	color:#00adef;
	font-weight:bold;
	text-decoration:none;
	border-bottom:1px dotted white;
}
ol.boxspace div.contentcake a.nohover,  ol.boxspace div.contentcake a.nohover:hover {
	border:0;
}
ol.boxspace div.contentcake a.nohover img {
	border:0;
}
ol.boxspace div.contentcake div.youtube {
	margin-top:6px;
}
ol.boxspace div.contentcake img {
	float:left;
	margin:5px 10px 10px 0;
}
ol.boxspace div.contentcake img.righteous {
	float:right;
	margin:5px 0 10px 10px;
}
ol.boxspace div.contentcake span.date {
	font:10px/16px "Courier New", Courier, mono;
	font-weight:bold;
	background:black;
	color:#FAFAFA;

	padding:0px 2px 0 2px;
}
ol.boxspace div.contentcake img.icon {
	margin-bottom:0;
	margin-top:0; 
	margin-left:0;
	margin-right:6px;
}
ol.boxspace div.contentcake strong.superstrong {
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	text-transform:uppercase;
}
ol.boxspace div.triptyche {
	clear:both;
	width:450px;
	margin:0 0 0 300px;
	padding:0;
}
ol.boxspace div.triptyche div {
		width:150px;
		overflow:hidden;
		float:left;
	}
ol.boxspace div.superflesh {
	clear:both;
	background:red;
	padding:0;
	margin:0;
}
ol.boxspace div.superflesh div {
	width:auto;
	float:left;
}
ol.boxspace div.splashcake {
	width:750px;
	text-align:right;
	padding:0;
	margin:0;
}
/* FLOATUNIT IS A TRANSITIONAL ENITITY! IT SHOULD BE PHASED OUT SOON! AND REPLACED WITH STANDARD KLOSSES!! */

ol.boxspace div.floatunit { 
	float:right;
	width:150px;
	height:125px;
	overflow:hidden;
}
ol.boxspace div.floatunit a { 
	display:block;
	text-align:left;
	color:#00adef;
	text-decoration:none;
}
ol.boxspace div.floatunit a img {
	border:none;
}	

		/* OPHONE VARIETY */
		body.ophone_style div.header {
			background:url(ophone_style_header.gif) top left no-repeat;
			background:none; /*MAGNUS EXPERIMENTING after a RECTANGULAR OVERDOSIS */
			color:black;
		}

		body.ophone_style div.header div.sections ul li a {
			background:none;
			color:black;
		}	

		body.ophone_style div.header div.sections ul li a:hover {
			background:url(stripeanim40x20_dotted2.gif) top left repeat;
			color:black;
		}

		body.ophone_style div.header div.sections ul li a span {
			padding:0 10px 0 10px;
		}

		body.ophone_style div.header div.sections ul li.selected a {
			background:black;
			color:white;
		}
		
		/* WORKSHOP VARIETY */
		body.workshop_style div.header {
			background-position:0 -250px;
			background-image:url(../flippers/ws_header_750x250.jpg);
			color:white;
		}
		
		body.workshop_style div.header div.pithyblurb, body.workshop_style div.header div.sections {
			background:url(black75.png) top left repeat;
			/**margin-left:450px;*/
		}

		body.workshop_style div.header div.sections ul li a {
			background:none;
			color:white;
		}	
				
		body.workshop_style div.header div.sections ul li a:hover {
			background:url(stripeanim40x20_dotted2.gif) top left repeat;
			color:white;
		}

		body.workshop_style div.header div.sections ul li a span {
			padding:0 10px 0 10px;
		}

		body.workshop_style div.header div.sections ul li.selected a {
			background:url(black75.png) top left repeat;
			color:white;
		}
		body.workshop_style div.contentcake {
			background:none;
		}
		
		/* UNSWORD VARIETY */
		body.unsword_style div.header {
			background:url(../word/images/unsword_title.gif) top left no-repeat;
			float:left;
		}
		body.unsword_style div.contentcake {
			background:none;
		}
		body.unsword_style div.contentcake p{
			font:13px/20px Georgia, "Times New Roman", Times, serif;
		}
		
		


/* * * * * * * * * * * * */
/* Footer               */
/* * * * * * * * * * * */

div.footer {
	clear:both;
	float:left;
	width:100%;
	background:black;
	padding-bottom:20px;
	text-align:left;
}
div.footer div {
		float:left;
		width:300px;
		color:#555555;
	}
div.footer div h1 {
		margin:10px 0 10px 0;
		padding:0 10px 0 10px;
		font-size:12px;
		line-height:15px;
		border:none;	
	}
div.footer div p {
		margin:10px 0 10px 0;
		padding:0 10px 0 10px;
		font-size:11px;
		line-height:14px;
	}
div.footer div a {
		color:white;
		border-bottom:1px dotted #555555;
		text-decoration:none;
	}
div.footer div ul {
		margin:10px 0 10px 0;
		padding:0 10px 0 10px;
		font-size:11px;
		line-height:14px;
	}
div.footer div ul li {
		padding:0;
		margin:0 0 0 15px;
	}

/* inverted footer used for dark (p)ages */
div.invertedfooter {
	background:white;
}
div.invertedfooter div a {
		color:black;
	}
	
/* * * * * * * * * * * * */
/* Structure			*/
/* * * * * * * * * * * */


/* * * * * * * * * * * *  */
/* Boxspace				 */
/* The basic KLOSS	    */
/* * * * * * * * * * * */

	ol.boxspace {
		padding:0;
		margin:0;
		display:block;
		list-style:none;
	}
	
	ol.boxspace li {
		padding:0;
		margin:0;
		display:block;
		width:150px;
		height:250px;
		overflow:hidden;
		float:left;
		position:relative;
		top:0;
		left:0;
	}

	ol.boxspace li a {
		overflow:hidden;
		display:block;
		height:250px;
		position:relative;
		top:0;
		left:0;
		background:url(empty.png) 0 0 no-repeat;
		text-decoration:none;
	}
	
	ol.boxspace li a:hover {
		background-position: 0 -250px;
	}
	
	ol.boxspace li a span {
		position:absolute;
		bottom:0;
		left:0;
		margin:0;
		color:white;
		background-color:black;
		z-index:20;
		padding:5px;
	}

	ol.boxspace li a:hover span {
		background-color:black;
		background-color:#00adef;
	}

	
/* * * * * * * * * * * *  */
/* Boxspace				 */
/* Boombox			    */
/* * * * * * * * * * * */

	ol.boxspace li.boombox a {
		display:block;
		height:250px;
		width:150px;
		overflow:hidden;
		text-indent:-2000px;
		background-image:url(boomer2.png);
		background-position:0 0;
		background-repeat:no-repeat;
		cursor:default;
	}
	
	ol.boxspace li.boombox a:hover {
		background-position:0 -250px;
		cursor:default;
	}

/* * * * * * * * * * * *  */
/* Boxspace				 */
/* Textbox			    */
/* * * * * * * * * * * */

	ol.boxspace li.textbox {
	
	}

	ol.boxspace li.textbox h2 {
		padding:5px;
		margin-bottom:0;
	}

	ol.boxspace li.textbox p {
		padding:0 5px 10px 5px;
		margin:0;
		font-size:10px;
		line-height:12px;
	}
	
	ol.boxspace li.textbox a {
		display:inline;
		position:static;
		top:auto;
		left:auto;
		bottom:auto;
		right:auto;
		padding:0;
		margin:0;
		background:none;
		color:#00adef;
		background:black;
	}
	ol.boxspace li.textbox a span {
		display:inline;
		position:static;
	}
		/*  WHITE ON BLACK subclass for li.textbox */
	
		ol.boxspace li.sub_whiteonblack {
			background:black;
			color:white;
		}
	
		ol.boxspace li.sub_whiteonblack a {
			color:white;
			background:#006891;
		}
		ol.boxspace li.sub_whiteonblack a:hover {
			color:white;
			background:#00adef;
		}

		/*  BLACK ON WHITE subclass for li.textbox */
		
		ol.boxspace li.sub_blackonwhite {
			background:white;
			color:black;
		}
	
		ol.boxspace li.sub_blackonwhite a {
			color:#00adef;
			color:black;
			border-bottom:1px dotted #00adef;
			/* color:#007ab7; */
			background:white;
			font-weight:bold;
		}
		ol.boxspace li.sub_blackonwhite a:hover {
			color:#00adef;
			background:#9fe0fc;
			background:white;
			border-bottom:1px dotted #00adef;
		}

		/*  DOUBLE WIDTH subclass for li.textbox */

		ol.boxspace li.sub_doublewidth {
			width:300px;
		}

/* * * * * * * * * * * *  */
/* Boxspace				 */
/* Chronologybox        */
/* * * * * * * * * * * */

	ol.boxspace li.chronologybox {
		background:url(chronology_kloss_bg.gif) top left no-repeat;
		color:white;
	
	}
	ol.boxspace li.chronologybox h2 {
		padding:5px;
	}

	ol.boxspace li.chronologybox p {
		padding:0 5px 10px 5px;
		margin:0;
		font-size:10px;
		line-height:12px;
	}
	ol.boxspace li.chronologybox span.date {
		color:black;
		background:white ;
		padding:0 2px 0 2px;
		font-weight:normal;
		text-transform:uppercase;	
	}
	ol.boxspace li.chronologybox a {
		display:inline;
		position:static;
		top:auto;
		left:auto;
		bottom:auto;
		right:auto;
		padding:0;
		margin:0;
		background:none;
		text-decoration:none;
		color: #FF9933;
		background:none;
	}
	ol.boxspace li.chronologybox a:hover {
		text-decoration:underline;
	}

	ol.boxspace li.chronologybox a.miniflipper {
		display:block;
		height:88px;
		width:150px;
		overflow:hidden;
		text-indent:-2000px;
		background-image:url(boomer2.png);
		background-position:0 -88px;
		background-repeat:no-repeat;
		border-bottom:none;
	}
	
	ol.boxspace li.chronologybox a.miniflipper:hover {
		background-position:0 0;
		border-bottom:none;
	}

/* * * * * * * * * * * *  */
/* Boxspace				 */
/* Blogbox			    */
/* * * * * * * * * * * */

	ol.boxspace li.blogbox {
		background:url(unsword.png) top left no-repeat;
		color:black;
		width:300px;
		font:11px/15px Georgia, "Times New Roman", Times, serif;
	}
	ol.boxspace li.blogbox div.fringe {
		background: url(unsword_fringe.gif) top left no-repeat;
		position:absolute;
		bottom:0;
		left:0;
		width:300px;
		height:25px;
	}

	ol.boxspace li.blogbox div.blogmessagebody {
		padding-left:50px;
		padding-right:10px;
		height:234px;
		overflow:hidden;
	}

	ol.boxspace li.blogbox h2.blogtitle {
		color:#00adef;
		font-size:15px;
		line-height:15px;
		margin:0;
		padding:0;
	}

	ol.boxspace li.blogbox p.blogdate {
		color:silver;
		text-align:right;
		font:10px/11px Arial, Helvetica, sans-serif;
		text-transform:uppercase;
		padding-top:5px;
	}

	ol.boxspace li.blogbox h2 {
		padding:0;
		margin:5px 0 5px 0;
	}

	ol.boxspace li.blogbox p {
		padding:0;
		margin:5px 0 5px 0;
	}
	
	ol.boxspace li.blogbox a {
		display:inline;
		position:static;
		top:auto;
		left:auto;
		bottom:auto;
		right:auto;
		padding:0;
		margin:0;
		background:none;
		color:#00adef;
	}

	ol.boxspace li.blogbox a:hover {
		background:#00adef;
		color:white;
	}

/*
/// Typography
*/
ol.boxpace {
	font:10px/11px Georgia, "Times New Roman", Times, serif;
	font:10px/12px Arial, Helvetica, sans-serif;
}

ol.boxpace h1 {
	font:20px/30px Arial, Helvetica, sans-serif;
	font-weight:bolder;
}

ol.boxpace h2 {
	font:10px/15px Arial, Helvetica, sans-serif;
	font-weight:bolder;
}

ol.boxpace h3 {
	font:10px/15px Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-variant:small-caps;
}
/*
/// Colours
*/
ol.boxpace {
	color:black;
}

/*
/// Backgrounds and Ornamentation
*/



/* * * * * * * * * * * *  */
/* LABEL				 */
/* The little fellow    */
/* * * * * * * * * * * */

body ol.boxspace div.label {
	position:absolute;
	bottom:0;
	left:0;
	z-index:1200;
	font:10px/12px Arial, Helvetica, sans-serif;
}
	
body ol.boxspace div.label a {
		position:static;
		display:block;
		height:auto;
		width:auto;
		bottom:0;
		left:0;
		color:white;
		background:black;
		padding:5px;
		border:none;
}

body ol.boxspace div.label a span {
		color:white;
		position:static;
		top:auto;
		right:auto;
		bottom:auto;
		left:auto;
		height:auto;
		width:auto;
		padding:0;
		background:none;
		border:none;	}
	
body ol.boxspace div.label a:hover {
		color:white;
		background:#00adef;
		border:none;	
}
	
body ol.boxspace div.label a:hover span {
		color:white;
		background:none;
		border:none;
}



/* * * * */
/* tweets */
/* * * * */

	ol.boxspace li a b.twitterticker {
	display:block;
	position:absolute;
	top:5px;
	left:10px;
	width:130px;
	padding:5px 0 5px 0;
	border-top:1px solid black;
	font-size:12px;
	background:url(twittertickerbubble_new.gif) bottom center no-repeat;
	text-decoration:none;
	color:black
	}
	
	ol.boxspace li a b.twitterticker i {
		display:block;
		font-style:normal;
		font-weight:normal;
		padding:0 5px 15px 5px;
	}
/* ---------------------------------------------- 

	kontaklosss li.mothership

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

ol.boxspace li.mothership {
	float:left;
	width:600px;
	height:250px;
	background:url(../flippers/kontaktkloss/kontaktkloss2.jpg);
	position:relative;
	font:12px/16px Arial, Helvetica, sans-serif;
	color:white;
}

ol.boxspace li.mothership a {
display:inline;
height:auto;
width:auto;
background:none;
	color:white;
	text-decoration:none;
}
ol.boxspace li.mothership h2 {
margin-bottom:0;
}
ol.boxspace li.mothership div.blurb {
	position:absolute;
	bottom:5px;
	padding-top:0;
	left:160px;
	width:200px;
}

ol.boxspace li.mothership div.blurb p {
	margin:0 0 1em 0;
	padding:0;
}

ol.boxspace li.mothership div.contact {
	position:absolute;
	bottom:5px;
	padding-top:0;
	left:390px;
	width:160px;
}

ol.boxspace li.mothership div.contact p {
	margin:0 0 1em 0;
	padding:0;
}