/* 
	CSS by Michael van Schaik, 2008
	http://michaelvanschaik.nl
*/

/* general stuff */
/*****************/
body {
	margin: 0 0 0 0px;
	height: 100%; /* for stupid IE heights */
	background-color: white;
	color: gray;
	background-image: url('../bg_img.php');
	font-family: Arial, Helvetica, FreeSans, sans-serif;
	background-repeat: no-repeat;
}

img {
	border: 0;
	margin-top:0px;
	margin-bottom:0px;
}

p {
	margin-top:0px;
	font-size: 0.9em;
	margin-top:0px;
	margin-bottom:0px;
}

pre {
	font-family: sans-serif;
	font-size: 16em;
	line-height: 30px;
}

hr {

	height: 1px;
	color: white;
}

h1 { 
	font-size: 1.8em;
	margin-top:0px;
	margin-bottom:0px;
}
h2 {
	font-size: 1.2em;
	margin-top:0px;
	margin-bottom:2px;
}
h2 {
	font-size: 1em;
	margin-top:2px;
	margin-bottom:2px;
}

a:link {
	color: white;
	text-decoration: none;
}
a:visited {
	color: white;
	text-decoration: none;
}
a:hover {
	color: gray;
	text-decoration: none;
}
a:active {
	color: white;
	text-decoration: none;
}


.sectiontitle {
	font-size: 0.8em;
	vertical-align: 50%;
	color: white;
	font-weight: bold;
}
.sectionstats {
	vertical-align: 50%;
	font-size: 0.8em;
	color: white;
}
.articlestats {
	font-size: 0.8em;
	color: white;
}
.closebtn {
	/*margin-top: 0.2em;
	font-size: 0.8em;*/
	float: right;
}

hr.statsRuler {
	background-color: white;
	color: white;
	height: 1px;
	border:0pt none;
}

/* DIVS ETC */
/************/
#container {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 988px;
}

#maps {
	position: absolute;
	left: 0px;
	top: 0px;
	/*width: 100%;
	height: 100%;
	overflow: hidden;*/
}

/* CONTACT */
/***********/
div#contact {
	position: fixed;
	top: 30px;
	left: 10px;
	color: black;
	float: left;
	width: 80px;
	font-size: 0.9em;
	line-height: 1.3em;
	z-index: 1000;
}
* html div#contact { /* <-- IE5 - 6 */
	position: absolute;
}
#logo_img {
	margin-bottom: 10px;
}
#logo_img h1 {
	font-family: Arial, Helvetica, FreeSans, sans-serif;
	font-weight: normal;
	font-size: 50px;
	margin-top: 30px;
	margin-bottom: 20px;
}

div#contact a:link {
	color: black;
}
div#contact a:visited {
	color: black;
}
div#contact a:hover {
	color: black;
	background-color: white;
}
div#contact a:active {
	color: black;
}

/* load .gif instead of .png in IE 
* html #contact #logo_img { /* <-- IE5+ 
	background-image: url("../imgs/td-architects_logo.gif");
	background-repeat: no-repeat;
	height: 77px;
}
* html #contact #logo_img img { /* <-- IE5+ 
  display: none;
}*/


/* DISCLAIMER */
/*************/
div#disclaimer {
	position: fixed;
	bottom: 10px;
	left: 10px;
	color: black;
	font-size: 0.9em;
	line-height: 1.3em;
	z-index: 1000;
}
* html div#disclaimer { /* <-- IE5 - 6 */
	position: absolute;
	left: 10px;
	bottom: 2%;
}
div#disclaimer a:link {
	color: black;
}
div#disclaimer a:visited {
	color: black;
}
div#disclaimer a:hover {
	color: black;
	background-color: white;
}
div#disclaimer a:active {
	color: black;
}

/* Map navigation */
/*****************/

div#mapbuttons {
	padding-left: 4px;
	padding-top: 3px;
	padding-right: 4px;
	position: fixed;
	margin-top: 66px;
/* 	right: 20px; */
	left: 890px;
	z-index: 1001;
	background-image: url('../imgs/move_ani.gif');
}
* html div#mapbuttons { /* <-- IE5 - 6 */
	position: absolute;
}

/* CONTENT */
/**********/

div#column_container div div .cont_div .photo_div img { /* divs with actual content */
	margin: 0px 0px 0px 0px;
}

div#column_container #axis {
	position: relative;
	width: 20px;
	float: left;
	margin: 1px -6px 0px -2px;
}

div#column_container div div .cont_div .canvas .photo_div { /* photo div */
	width: 160px;
	float: left;
	margin: 0px 0px 0px 0px;
}
div#column_container div div .cont_div .canvas .content { /* texts */
	width: 382px;
}

/* maximized content */
/********************/
div#wholestory_cont {
	position: absolute;
	width: 100%;
	height: 100%;
	padding-bottom: 200px;
	visibility: hidden;
}
div#wholestory_cont div#wholestory_lightb {
	position: fixed;
	width: 100%;
	height: 100%;
	background-color: white;
	opacity: 0.6;
	filter: alpha(opacity = 60); /* IE-garbage */
}

* html div#wholestory_cont div#wholestory_lightb {
	position: absolute;
}

div#wholestory_cont #wholestory_bg {
	position: absolute;
	margin-top: 101px;
	margin-left: 100px;
	width: 565px;
	min-height: 300px;
	background-color: black;
	padding: 5px;
}

div#wholestory_cont #wholestory_bg .photo_div {
	width: 160px;
	float: right;
	margin: 0px 0px 0px 0px;
}
* html div#wholestory_cont #wholestory_bg .photo_div { /* IE crap */
	/*position: absolute;
	top: 3.25em;
	left: 5px;*/
}
div#wholestory_cont #wholestory_bg .photo_div img {
	margin: 0px 0px 0px 0px;
}
div#wholestory_cont #wholestory_bg .content {
	width: 400px;
	/*margin-left: 165px;*/
}

div#wholestory_cont #wholestory_bg #bigPhoto_div { 
	width: 400px;
	/*height: 300px;*/
	margin: 0px 0px 10px 0px;
	background-color: gray;
}


/* COLUMNS */
/**********/
div#column_container { /* container of all columns */
	position: absolute;
	margin-left: 96px;
	margin-top: 100px;
	width: 898px;
	overflow: hidden;
}
* html #container div#column_container { /* <-- IE5 - 6 */
	left: 0px;
	margin-top: 100px;
}
div#column_container div {
	width: 1000px;
}
div#column_container div div { /* columns */
	float: left;
	width: 140px;
	margin: 0px 4px 0px 4px;
	overflow: hidden;
}
div#column_container div div .cont_div { /* divs around divs with actual content */
	background-color: black;
	width: 130px;
	border-color: black;
	border-style: solid;
	border-width: 5px;
	margin: 1px 0px 2px 0px;
	overflow: hidden;
	/*background-color: transparent;*/
	/*visibility: hidden;*/
	/*height: 30%;*/
}
div#column_container div div .cont_div .canvas { /* divs with actual content */
	background-color: black;
	margin: 0px 0px 0px 0px;
	width: 550px;
	height: 800px;
}

/* Menus when viewing maps */
/**********/
div#mapsettings .whitebg {
	background-color: white;
	font-family: Courier, monospace;
	font-size: 10px;
}

div#mapsettings a:link {
	background-color: white;
	color: black;
}
div#mapsettings a:visited {
	background-color: white;
	color: black;
}
div#mapsettings a:hover {
	color: black;
	background-color: gray;
}
div#mapsettings a:active {
	background-color: white;
	color: black;
}

/* containerdivs height: */
/* min: 360 max: 530px */
/*div#col1 {
	height: 530px;
}
div#col2 {
	height: 360px;
}
div#col3 {
	height: 460px;
}
div#col4 {
	height: 380px;
}
div#col5 {
	height: 400px;
}
div#col6 {
	height: 380px;
}
div#col7 {
	height: 320px;
}*/


/* Graph with info about icons (hits/cat/site) */
/**********/
#graph {
	position: absolute;
	width: 200px;
	height: 80px;
	background-color: black;
	padding: 10px;
	outline: 1px solid white;
}

#graph #graphcont {
	padding: 0;
}

#graph #graphdiv {
	float: left;
	background-color: white;
	width: 10px;
	height: 80px;
	margin-right: 10px;
}

#graph #graphdivcolor {
	background-color: red;
	height: 40px;
	width: 10px;
	margin: 0;
}

#graph #infotxt {
	color: white;
	font-size: 0.8em;
}