@import url("text.css");
@import url("tables.css");


/* CONTENTS 

body

#div boxes


*/


body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 76%;
	margin: 0; padding: 0;
	width: 100%; height: 100%;
    background: url(images/nav/twitterbg4.jpg); background-repeat: no-repeat; background-attachment:fixed;
    background-color: #7da7d9;
	color: #000;
	
	}
	
	/* This div sets page width and central positioning instead of BODY - needed to make lightbox shadow work in IE */
div#background {margin-left: auto; margin-right: auto; margin-top: 1%; margin-bottom: 1%;
	width: 1000px; }	


	/*  #divs in page order */
	
	
#content { width: 100%;}




/* fits inside #content to avoid IE padding/margin bug. Contains all page content*/
#contentboxhack {padding: 7px; background-color: #F5DEB3;  border: 1px solid black; border-top: 0px;  }




/* NAVIGATION *******************************
********************************************* */

/* banner logo image goes here   */
img.logo {margin: -30px 0px -22px 5px; border: 0px;}

/* contains main and secondary navigation tabs */
	
#navbar {
	font-size: small;
	display: block;
    width: 1000px;
	margin: 0px 0px -15px 0px;
	padding-top: 10px; 	}

	
div#nav1 {display: block;  margin: 10px -10px 1px -5px;  position: static; z-index: 10;}



div#nav2 {display: block; margin: 5px 0px 0px 1px;   position: static; z-index: 12;  padding: 5px; border-top: 2px solid black;  background-color: #F5DEB3; width: 988px; }




ul#topNav {display: inline; list-style: none; width: 1010px; overflow: visible;}


ul#topNav li {display: inline;   list-style: none;  font-size: 1.0em; border-top: 2px solid black; border-left: 1px solid black; border-right: 3px solid black; border-bottom: 0px solid black; font-weight: bold; margin: 5px 5px 5px 0px; padding: 5px; background-color: #cccc99; }




ul#level2Nav li  {display: inline;  list-style: none; font-weight: bold; margin-right: 5px; }
ul#level2Nav li:after, div#level3Nav li:after {content:" |";}
ul#level2Nav li.last:after, div#level3Nav li.last:after {content:" ";}

div#level3Nav {margin: 10px 3px 5px 15px; background-color:  #cccc99; padding: 3px;}
div#level3Nav ul  {display: inline; list-style: none;  }
div#level3Nav ul li  {display: inline;  list-style: none; font-weight: bold; margin-right: 5px; }


div#level3Nav p {margin: 3px; display: inline; }
	
	
/* contains green #metadata box at page bottom  */	
#footer {padding: 1px; width: 100px; margin: 0px 0px 5px 5px; font-size: 0.8em;}

/* green #metadata box at page bottom  */
#metadata {font-size: 1.0em; padding: 5px; width: 98%; border: 1px solid #000000; background-color: #cccc99; margin-top: 1%; margin-bottom: 5px; overflow: auto; }
#metadata div {border-top: 1px dashed black; border-bottom: 1px dashed black; margin: 3px; padding: 3px;}
#metadata p {margin: 2px; font-size: 0.7em;}
	
	/* Social Network share icons   */
div#bookmarks {}
ul#bookmark li {display: inline; height: 20px;}
#delicious {background: url(images/bookmarks/delicious.gif) no-repeat top left; padding: 0px 10px 3px 20px;  }
#digg {background: url(images/bookmarks/digg.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#facebook {background: url(images/bookmarks/facebook.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#google {background: url(images/bookmarks/google.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#myStuff {background: url(images/bookmarks/myStuff.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#reddit {background: url(images/bookmarks/reddit.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#stumbleupon {background: url(images/bookmarks/stumbleupon.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#yahoo {background: url(images/bookmarks/yahoo.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
#mypage {background: url(/images/icons/tna.gif) no-repeat top left;  padding: 0px 10px 3px 20px;}
	
	
	



	/* standard image */
img {margin: 10px; border: 0;}

nomargin: {margin: 0px;}
img.thumb {border: 1px solid #000; margin: 0;}

/* used for flash/YouTube videos */
div#media, div.youTube {float: right; margin: 10px 10px 0px 10px; border: 1px solid black; background-color:#333; padding: 0px;}
object, embed {margin: 0px; border: 0px; padding: 0px;}


.right {float: right;}
.left {float: left;}
.top {vertical-align: top;}



/* CONCRETE EVIDENCE ******************************
*************************************************** */


div#derefBox {border: 1px solid black; background-color: #cccc99; width: 330px; margin: 3px;}

div#derefBox h2 {margin-bottom: 5px;}

div#parent ul, div#parent ul li  {margin-left: -10px;}

div#defqty {}

/*  help icon */
img.icon {margin: 1px 2px 0px 0px; border: 0px; }


/* used on new Concrete Evidence detail page */

div#mainPhotoBox {margin: 5px -3px 5px 10px; border: 0px solid black; width: 300px; float: left;}


div.photoData2 {border: 2px solid black; border-right: 0px; background-color: #cccc99; width: 450px; min-height: 150px; z-index: 5; margin: 15px -2px 15px 0px; padding: 2px; float: right;}

div.photoData1 {border: 2px solid black; border-left: 0px; background-color: #cccc99; width: 450px; min-height: 150px; z-index: 5; margin: 15px 0px 15px -2px; padding: 2px; float: left;}


div#statusBoxHack {width: 970px;}
div#statusBoxHack h1 { margin: 3px;}

div#statusBox {float: left; width: 650px; min-height: 200px;  margin: 5px 5px 5px 5px; border: 1px solid black; background-color: #cccc99; }

div#statusBox div {margin: 3px 3px 10px 3px;}

div.smallStatusBox {width: 315px; float: left; border: 1px solid black; background-color: #f5deb3; margin-top: 10px;}

div.smallStatusBox p {margin: 5px;}

div.smallStatusBox h2 {margin: 0px; background-color: #990000; color: #ffffcc; padding: 3px; text-align: center; font-size: 0.9em;}

div.hierarchy {border: 1px solid black; margin-top: -10px;  }
div.hierarchy2 {border: 1px solid black; margin-top: -10px; max-height: 150px; overflow-y: scroll; }
div.hierarchy p {font-size: 0.9em; font-weight: bold; margin: 3px;}
div.hierarchy ul li, div.hierarchy2 ul li {font-size: 0.9em;  margin: 5px 2px 2px -7px;}
img.hierarchy {margin: -10px 0px 0px 0px; border: 0px; padding: 0px;} /* arrow img */

div.hierarchy2 table.datatab {width: 290px; margin: 0px; border: 0px; }
div.hierarchy2 table.datatab td, div.hierarchy2 table.datatab th {border-left: 0px;}
div.hierarchy2 table.datatab th {font-size: 0.8em;}


div.dbImg, div.dbImg2 {border: 2px solid black; z-index: 1; background-color: #cccc99; padding: 5px; float: right; min-height: 300px;}
div.dbImg1 {border: 2px solid black; z-index: 1; background-color: #cccc99; padding: 5px; float: left; min-height: 300px;}
div.dbImg1 img, div.dbImg2 img {border: 1px solid black; }


td.1939 {background-color: #FFFFFF;}
td.1940 {background-color: #838B83;}
td.1941 {background-color: #C1CDC1;} 
td.1942 {background-color: #E0EEE0;}
td.1943 {background-color: #F0FFF0;}
.1944 {background-color: #6CF}
td.1945 {background-color: #838B83;}


table.datatab tr.greyOut, table.datatab tr.greyOut td {background-color: #99C; padding: 15px;}
table.datatab tr.greyOut td p {font-weight: bold;}
table.datatab tr.greyOut td h2 {font-size: 1.5em; margin: 0px 5px 10px 5px;}


div#gridSquareBox {float: left; width: 650px; height: 450px; overflow: auto; margin: 5px 5px 5px 5px; border: 2px solid black; background-color: #666; background-image:url(images/DERef/mapground.jpg); background-repeat: no-repeat; }

div#incidentBox {float: left; width: 650px; height: 210px; overflow: auto; margin: 5px 5px 5px 5px; border: 2px solid black; background-color: #666;}

div.plagiarismBox {float: left;  margin: 5px; width: 650px; border: 1px solid black; background-color: #FF8080; }

div.plagiarismBox p {margin: 10px; font-weight: bold;}


/* used for replaced text in Incident log and TNA pages */
td.noRed span { text-decoration: none;}
span.placeName, table.datatab tr td span.placeName {font-weight: bold; color: #000066; text-transform: uppercase;  text-decoration: none;}
span.surname, table.datatab tr td span.surname  {font-weight: bold; color: #990000; text-decoration: none; text-transform: uppercase; }
span.red {font-weight: bold; color: red; background-color: #f5deb3;}
span.white {font-weight: bold; color: #666666;}
td p { margin: 3px; border-bottom: 1px dotted black;}
a.red {color: red; font-weight: bold; }



/*  HOMEPAGE (not blog)  */



	/* column only used on homepage and CE detail page*/
.column {margin-bottom: 0em;  width: 240px;  padding: 0px;  margin-right: 7px; float: left;  }
 
#colbox h2 {margin: 0px;  font-size: 1.0em; color: #ffffcc; font-weight: bold;  padding: 2px;  background-color: #990000; }
#colbox h2 a { color: #ffffcc; }

#colbox{
	padding: 0px;
	margin-bottom: 0.65em;
	margin-top: 0px;
	border: 1px solid #990000;
	background-color: #f5deb3;
	overflow: hidden;
}

#colbox img  {border: 1px solid #000; margin: 5px; float: right;}
#colbox p img{margin: 10px;}
#colbox h3  {margin: 3px auto 3px auto;  font-size: 1.0em; text-align: center;}
#colbox p {margin-bottom: 1px; margin-left: 5px; margin-right: 5px;  font-size: 1em;}





/* BLOG STUFF */


 /* homepage blog ******************************
 ********************************************** */
 
 
 /*   Used for homepage column   */
 div.rss {margin: 5px;  float: left; width: 228px;  height: 17.2em;}
 div.rss p {font-size: 0.9em;  padding: 3px;}
div.rss img { padding:0; margin:2px;  float: right; border: 1px solid black;}
 div.rss h2 {margin: 0px;  font-size: 1.0em;  font-weight: bold;  padding: 2px; }
 
 
/* column on homepage for blog */
#blogCol {float: right; width: 730px; margin: 15px 0px 5px 0px;}

.colboxBlog {padding: 0px;
	margin-bottom: 0.65em;
	margin-top: 0px;
	background: #f5deb3;
	overflow: hidden; 
	width: 255px; 
	float: right; 
	border-left: 1px solid black; 
	border-bottom: 1px solid black; 
	background-color: #cccc99; }

div.blog {height: 710px; overflow: auto;}

/*  homepage column */
.colboxBlog h2 {margin: 0px;  font-size: 1.0em; color: #ffffcc; font-weight: bold;  padding: 2px;  background-color: #990000; }
.colboxBlog h2 a { color: #ffffcc; }
.colboxBlog img  {border: 3px solid #f5deb3; margin: 5px;}
.colboxBlog p img {margin: 10px;}




/* Pillblogs blog *************************************
******************************************************** */


/*  Pilboxopedia column */
div#pillboxopedia {border: 3px solid black; margin: 0px 5px 10px 10px; width: 230px; height: auto; background-color: #cccc99; float: right; }
div#pillboxopedia p, div#pillboxopedia dd, div#pillboxopedia dt, div#pillboxopedia h3 { margin: 5px; }

/* Pillboxopedia definition */
dd {margin-bottom: 10px;}



 /* used in blog to move image right */ 
img.blog {margin-right: -30px;}

/* Used to place blog ident image on detail page */
div#identBox {float: left; margin: -25px 10px 10px 10px; padding: 0;}
div#identBox img {border: 1px solid black;  margin: 0;}



/*     TWITTER    */

.twtr-widget, 
.twtr-widget-profile,
#twtr-widget-1,
.twtr-doc ,
.twtr-hd,
.twtr-profile-img-anchor,
.twtr-profile-img,
.twtr-spinner twtr-inactive,       
.twtr-bd,
.twtr-timeline,            
.wtr-tweets,            
.twtr-reference-tweet,
.twtr-tweet,
#tweet-id-1,
.twtr-tweet-wrap,
.twtr-avatar,     
.twtr-img,
.twtr-tweet-text,
.twtr-user,
.twtr-timestamp,
.twtr-reply,
.twtr-ft,
.twtr-join-conv,
i, 
.twtr-tweet-text p a {background-image: none; background-color: #ffffff; }

div.twtr-tweet-text p {font-family: monospace; font-weight: bold; padding: 5px; font-size: 1.2em; border: 0;}
div.twtr-tweet-text p a.twtr-timestamp {font-family: monospace; font-weight: bold; padding: 5px; font-size: 1.2em;}


div.twtr-ft, div.twtr-img, div.twtr-avatar, div.twtr-hd, div.twtr-profile-img-anchor, div.twtr-profile-img, a.twtr-reply {display: none;}
a.twtr-timestamp, div.twtr-tweet-text p i twtr-timestamp {border: 0px;  border-bottom: 0px dashed black; width: 450px; font-size: 1.2em; text-decoration: underline; }


/*  Lightbox css   */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto; padding: 0; margin:0; border: 1px solid black;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #f5deb3; width: 250px; height: 250px; margin: 0 auto; border: 1px solid black;}
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/nav/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nav/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #cccc99; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }
#imageDataContainer img {margin-top: 8px;  border: 1px solid black; float: left;}

#imageData{	padding:0 10px; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 26px; float: right;  padding-bottom: 0.7em; outline: none; }	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 100%; background-color: #990000; }

div#gallery {color: #ffffcc; padding: 5px; min-height: 110px; background-color:#cccc99; width: 975px; background-repeat: repeat; background-image:url(images/nav/lightbox/gallerybg.jpg); }

div#gallery h2 span {font-size: 0.7em; display: none;}
div#gallery div#imgbox {width: 150px; height: 100px; overflow: hidden; float: left; margin: 5px; border: 1px solid black; }
div#gallery div#imgbox img {margin: 0px;  width: 150px;}
#gallery #imgbox a img  {text-decoration: none; border: 0; }
div#gallery p {margin: 0px;}

/* end lightbox */



/* homepage ajax box*/
div#ajaxBox {width: 1000px; height: 200px; margin: -5px 0px 0px -7px; background-color: #000; background-repeat: repeat; background-image:url(images/nav/lightbox/gallerybg.jpg);}
div#ajaxBox div {float: left; height: 200px; color: #ffffcc;}
div#onFlyBox {width: 724px; color: #ffffcc; }
div#onFlyBox img.bigImg {margin: 1px auto 1px auto; width: 715px; }
div#onFlyBox p {margin: -30px 10px 2px 10px; font-weight: bold;}
div#onFlyBox  a {color: #ffffcc; text-decoration: underline;}
div#onFlyBox div p {margin: 10px; font-weight: bold; line-height: 1.8;}
div#onFlyBox div span {color: #ffffcc; background-color: #000;}
div#onFlyBox div h2 {margin: 0px 0px 3px 110px; border: 3px solid #990000; background-color: #990000;  padding: 2px;}

div#swapBox {width: 275px;  margin-left: 1px;}
div#swapBox a img {border: 0;}
div#swapBox img {margin: 3px 0px 3px 0px; float: left;}

 span#gallery2 { padding: 0px; height: 55px; width: 40px; overflow: hidden; }
  span#gallery2 img { padding: 0px; height: 45px; overflow: hidden; border: 1px solid #fff; margin:  -30px 3px 3px 10px; vertical-align: middle; }
 a.hide {display: none;}



.none {display: none;} /* used to hide h1 on homepage */

label {display: none;}

table.bgdarkred, tr.bgdarkred, td.bgdarkred, th.bgdarkred { background-color: #990000; color: #ffffcc;}
table.bgbeige, tr.bgbeige, td.bgbeige, th.bgbeige { background-color: #f5deb3; color: #000;}
table.bggreen, tr.bggreen, td.bggreen, th.bggreen { background-color: #cccc99; color: #000;}
table.bgpink, tr.bgpink, td.bgpink, th.bgpink { background-color: #ff8080; color: #000;}


hr {clear: both;}


.drag{
position:relative;
cursor: move;
z-index: 100;
}




/* #####DEPRECATED JULY 2010##### */
	/* 
	
	barbed wire horizontal rule 
div.hr {height: 15px; margin:  -2px 0px 10px 0px; background: url(images/nav/strand.gif) no-repeat scroll center; clear: both; }
div.hr hr {display: none; }




*/