/*------------------------------------*\
	RESET
\*------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,tr,img{
	margin:0;
	padding:0;
}
/*table{
	border-collapse:collapse;
	border-spacing:0;
}
*/
fieldset,img{
	border:0;
}
address,caption,cite,code,dfn,th,var{
	font-style:normal;
	font-weight:normal;
}
caption,th{
	text-align:left;
}
h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight:normal;
}
q:before,q:after{
	content:'';
}
abbr,acronym{
	border:0;
}
/*------------------------------------*\
	END OF RESET
\*------------------------------------*/

/*
#D1A700 Brown - outer_back_colour
#F0EBB1 Beige - inner_back_colour
#F02313 Red - table_container_colour
#FFCC00 Yellow - field_content_colour
#FF8800 Orange - field_heading_colour
#4F4D3A Grey - text_colour
#000000 Black - outline_colour
*/
body {
  margin:5px;
  padding:0px;
  font-family:"Arial", sans-serif;
  font-size:12pt;
  line-height:110%;
  background-color:#000000;/*outer_back_colour*/
  background-image:url('i/bg.jpg');
  background-image:url('i/fibre2.jpg');
  
  color:#363636;/*text_colour*/
 /*margin:       12px;
  border-style:solid;
  border-color:#f05060;
  border-width:2px;*/
}

header {
background-image:url('i/PANICbanner.jpg');/*header_image*/
width:990px;
padding:5px;
height:110px;
display:block;
margin-left:auto;
margin-right:auto;
background-color:#EEEEFF;/*inner_back_colour*/
border-style:solid;
border-color:#363636;/*text_colour*/
border-width:1px 1px 0px 1px;
}

a{
color:#363636;/*text_colour*/
text-decoration:none;
font-weight:bold;
}

a:hover{
cursor:pointer;
color:#FFFFFF;
background-color:#2483FF;/*table_container_colour*/
text-decoration:underline;
font-weight:bold;
}

a:active{
color:#FFFF00;
background-color:#363636;/*text_colour*/
text-decoration:none;
font-weight:bold;
}

header a:hover{
	opacity:0;
}

.h{
display:none;
}

/*
#F0EBB1;/*Beige
#FFCC00;/*Yellow
#FF8800;/*Orange
#D1A700;/*Brown
#F02313;/*Red
#4F4D3A;/*Grey
*/

nav {
background-color:#EEEEFF;/*inner_back_colour*/padding:0px 5px;
width:990px;
height:32px;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-color:#363636;/*text_colour*/
border-width:1px 1px 0px 1px;
}


/*------------------------------------*\
	NAV
\*------------------------------------*/


.nav{
	list-style:none;
	/*Clear floats*/
   	float:left;
/*	width:100%; */
	/*Bring the nav above everything else--uncomment if needed.
	*/
    position:relative;
	z-index:5;
}
.nav li{
	float:left;
	margin-right:0px;
	position:relative;
}
.nav a{
/*	min-width:80px;*/
	height:20px;
	display:block;
	padding:5px 10px;
	color:#363636;/*text_colour*/
	background-color:#EEEEFF;/*inner_back_colour*/	text-decoration:none;
	border-style:solid;
	border-color:#EEEEFF;/*inner_back_colour*/	border-width:1px;
	font-weight:normal;
}



/*--- DROPDOWN ---*/
.nav ul{
    min-width:100px;
	background:#EEEEFF;/*inner_back_colour*/	background:rgba(255,255,255,0);
	background-color:#4488FF;/*field_content_colour*/
	border-style:solid;
	border-color:#000000;/*outline_colour*/
	border-width:1px;
	padding:2px;
	list-style:none;
	position:absolute;
	left:-9999px; /*Hide off-screen when not needed (this is more accessible than display:none;)*/
	box-shadow: 2px 2px 3px #000000;/*outline_colour*/
}
.nav ul li{
    width:100%;
	padding-top:0px; /*Introducing a padding between the li and the a give the illusion spaced items*/
	float:none;
}
.nav ul a{
    font-weight:normal;
	margin:0px 0px 0px 0px;
	padding:2px 4px;
	white-space:nowrap; /*Stop text wrapping and creating multi-line dropdown items*/
}
.nav li:hover ul{ /*Display the dropdown on hover*/
	left:0; /*Bring back on-screen when needed*/
	background-color:#EEEEFF;/*inner_back_colour*/}
.nav li:hover a{ /*These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list.*/
	background-color:#4488FF;/*field_content_colour*/
	border-style:solid;
	border-color:#000000;/*outline_colour*/
	border-width:1px;
	color:#363636;/*text_colour*/
	text-decoration:underline;
}
.nav li:hover ul a{ /*The persistent hover state creates a global style for links even before they're hovered. Here we undo these effects.*/
    background-color:#EEEEFF;/*inner_back_colour*/  	text-decoration:none;
    border-color:#EEEEFF;/*inner_back_colour*/}

.nav li:hover ul li a:hover{ /*Here we define the most explicit hover states--what happens when you hover each individual link.*/
	background:#131436;/*field_heading_colour*/
	color:#EEEEFF;/*inner_back_colour*/	border-style:solid;
	border-color:#363636;/*text_colour*/
	border-width:1px;
}

/*------------------------------------*\
	END OF NAV
\*------------------------------------*/


/*------------------------------------*\
	DROPDOWN
\*------------------------------------*/


.dropdown{
	list-style:none;
	/*Clear floats*/
   	float:left;
	width:100%;
	/*Bring the nav above everything else--uncomment if needed.
	*/
/*    position:relative;
	z-index:5;*/
}
.dropdown li{
	float:left;
	margin-right:0px;
	position:relative;
}
.dropdown a{
/*	min-width:80px;*/
	height:17px;
	display:block;
	padding:0;
	color:#363636;/*text_colour*/
	background-color:#EEEEFF;/*inner_back_colour*/	text-decoration:none;
	border-style:solid;
	border-color:#EEEEFF;/*inner_back_colour*/	border-width:1px;
	font-weight:normal;
}


/*--- DROPDOWN ---*/
.dropdown ul{
    min-width:100px;
	background:#EEEEFF;/*inner_back_colour*/	background:rgba(255,255,255,0);
	background-color:#4488FF;/*field_content_colour*/
	border-style:solid;
	border-color:#000000;/*outline_colour*/
	border-width:1px;
	padding:2px;
	list-style:none;
	position:absolute;
	left:-9999px; /*Hide off-screen when not needed (this is more accessible than display:none;)*/
	box-shadow: 2px 2px 3px #000000;/*outline_colour*/
}
.dropdown ul li{
	padding-top:0px; /*Introducing a padding between the li and the a give the illusion spaced items*/
	float:none;
}
.dropdown ul a{
    font-weight:normal;
	margin:0px 0px 0px 0px;
	padding:2px 4px;
	white-space:nowrap; /*Stop text wrapping and creating multi-line dropdown items*/
}
.dropdown li:hover ul{ /*Display the dropdown on hover*/
	left:0; /*Bring back on-screen when needed*/
	background-color:#EEEEFF;/*inner_back_colour*/	z-index:6;
}
.dropdown li:hover a{ /*These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list.*/
    background-color:#EEEEFF;/*inner_back_colour*/	border-style:solid;
    border-color:#EEEEFF;/*inner_back_colour*/	border-width:1px;
	color:#363636;/*text_colour*/
	text-decoration:underline;
}
.dropdown li:hover ul a{ /*The persistent hover state creates a global style for links even before they're hovered. Here we undo these effects.*/
    background-color:#EEEEFF;/*inner_back_colour*/  	text-decoration:none;
    border-color:#EEEEFF;/*inner_back_colour*/}

.dropdown li:hover ul li a:hover{ /*Here we define the most explicit hover states--what happens when you hover each individual link.*/
	background:#131436;/*field_heading_colour*/
	color:#EEEEFF;/*inner_back_colour*/	border-style:solid;
	border-color:#363636;/*text_colour*/
	border-width:1px;
}

/*----------------------------------------*\
    DROPDOWN EXTENSIONS FOR MULTI-COLUMN
\*----------------------------------------*/
.dropdown li ul div{
    display:inline-block;
}
/*------------------------------------*\
    END OF DROPDOWN
\*------------------------------------*/





/*------------------------------------*\
    CONTEXT MENU
\*------------------------------------*/
.contextMenu{
position:absolute;
z-index:6;
padding:2px;
display:block;
border:solid 1px;
background-color:#EEEEFF;/*inner_back_colour*/}
.contextMenu div{
display:inline-block;
}
.contextMenu ul li{
display:block;
clear:both;
width:100%;
}

/*------------------------------------*\
    END OF CONTEXT MENU
\*------------------------------------*/

div#overlay{
    position:fixed;
    left:-9999px;
    top:0px;
    width:100%;
    height:100%;
    background-image:url('/i/black.gif');
    opacity:0.4;
    z-index:1;
}

/*------------------------------------*\
	TIME SELECTOR
\*------------------------------------*/
/*the "!important"s are necessary to make nested divs work*/
/*becuase it clashes with the inheritance from '.timeContent div' class*/
.time{
    left:-9999px;
    position:absolute !important;
    display:block !important;
	padding:2px !important;
	color:#4F4D3A !important;
	background-color:#F0EBB1 !important;
	border-style:solid !important;
	border-color:#000000 !important;/*outline_colour*/
	border-width:1px !important;
	border-radius:5px !important;
	box-shadow: 2px 2px 3px #000000 !important;/*outline_colour*/
	z-index:2;
}
.timeSection{
    position:relative !important;
    float:left !important;
    display:block !important;
/*min-width:40px !important;*/
    background-color:#F4F5D3 !important;/*inner_back_colour*/
    margin:0px !important;
    padding:3px !important;
	border-style:none !important;
	border-color:#000000 !important;/*outline_colour*/
	border-width:1px !important;
}
.timeHead{
    display:block !important;
    min-width:40px !important;
    width:100% !important;
    text-align:center !important;
    color:#F4F5D3 !important;/*inner_back_colour*/
	font-weight:bold !important;
    background-color:#2483FF !important;/*table_container_colour*/
	border-style:none !important;
	border-color:#000000 !important;/*outline_colour*/
	border-width:1px !important;
	margin:0 0 2px 0 !important;
	border-radius:5px !important;
}
.timeContent{
	white-space:nowrap !important;
	clear:both !important;
    display:inline-block !important;
    background-color:#131436 !important;/*field_heading_colour*/
    border-style:none !important;
	border-color:#000000 !important;/*outline_colour*/
	border-width:1px !important;
	padding:3px !important;
	margin:2px 0 0 0 !important;
	border-radius:5px !important;
}
.timeContent br{clear:both !important;}
.timeContent a{
    display:inline !important;
    float:left !important;
    text-align:center !important;
    padding:0px 1px 0px 1px !important;
    background-color:#4488FF;/*field_content_colour*/
    border-style:solid !important;
	border-color:#000000 !important;/*outline_colour*/
	border-width:1px !important;
	margin:1px !important;
	border-radius:5px !important;
}
.timeContent div{
    display:inline;
    float:left;
    text-align:center;
    font-size:8pt;
    padding:0px 1px 0px 1px;
    background-color:#4488FF;/*field_content_colour*/
    border-style:solid;
	border-color:#4488FF;/*field_content_colour*/
	border-width:1px;
	margin:1px;
	border-radius:5px;
}
.timeContent a:hover{
    color:#F02313;
}
.timeInputContainer {
   height:100%;
   border-style:solid;
   border-width:1px;
   border-color:#000000;/*outline_colour*/
}
.time input{
    width:80px;
    text-align:center;
    float:right;
    margin:10px 5px 0 0;
    position:relative;
    bottom:0;
}

/*------------------------------------*\
	END OF TIME
\*------------------------------------*/

.content {
background-color:#EEEEFF;/*inner_back_colour*/padding:5px;
width:990px;
min-height:500px;
display:block;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-color:#404040;
border-width:1px 1px 0 1px;
}

.top_plain_text_outer {
text-align:center;
}

.left_plain_text_outer {
float:left;
text-align:center;
width:484px;
margin:20px 0px;
}
.right_plain_text_outer {
float:right;
text-align:center;
width:484px;
margin:20px 0px;
}

.plain_text{
display:inline-block;
text-align:left;
}

footer {
background-color:#131436;/*field_heading_colour*/
width:990px;
min-height:110px;
padding:5px;
display:block;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-color:#363636;/*text_colour*/
border-width:1px;
}

dl {
	margin:10px 5px 10px 5px;
	background-color:#2483FF;/*table_container_colour*/
	display:block;
	width:482px;
	float:left;
	padding:3px 0px 0px 3px;
	border-radius:5px;
	box-shadow: 2px 2px 3px #000000;/*outline_colour*/
	}
	
.centered {
left:25%;
}

.dl_head{
 background-color:#2483FF;/*table_container_colour*/
 color:#EEEEFF;/*inner_back_colour*/ width:468px;

 margin:0px 0px 3px 0px;
text-align:left;
 }
 .dl_foot{
 background-color:#2483FF;/*table_container_colour*/
 color:#EEEEFF;/*inner_back_colour*/ width:468px;
 margin:0px 0px 3px 0px;
 }
 .dl_error{
 background-color:#F02313;
 color:#EEEEFF;/*inner_back_colour*/ width:468px;
 margin:0px 0px 3px 0px;
font-weight:normal;
text-align:center;
 }
dl dt {
    background-color:#131436;/*field_heading_colour*/
    color:#EEEEFF;/*inner_back_colour*/    float:left; 
    font-weight:bold; 
    margin: 0px 0px 3px 0px; 
    padding:5px;
    width:200px;
	clear:both;
	text-align:right;
}
dl dd input{
    width:255px;
}

dl input[type="submit"] {
    padding:5px 10px;
	border-radius:5px;
	box-shadow: 2px 2px 5px #000000;/*outline_colour*/
}

input{
    text-align:left;
}

dl dd {
	background-color:#4488FF;/*field_content_colour*/
    width:259px;
    margin:0 0 3px 0;; 
    padding:5px 5px 4px 5px;
	float:left;
	text-align:left;
}
.textarea{
    clear:both;
    width:469px;
    margin:0 0 3px 0;
    padding:5px 5px 0 5px;
}
dl dd textarea{
    width:467px;
    max-width:467px;    
    max-height:20em;
}

#passwordStrengthIndicator {
	display:block;
	margin:0;
	padding:0;
	float:left;
}
#passwordStrengthIndicatorContainer {
	display:block;
	margin:0;
	padding:0;
	height:3px;
	width:150px;
	border-style:solid;
	border-color:#363636;/*text_colour*/
	background-color:#ffffff;
	border-width:1px;
}
#passwordStrengthIndicatorBar {
	display:block;
	margin:0;
	padding:0;
	height:3px;
	width:0px;
}

#passwordStrengthIndicatorScore{
display:block;
	margin:0;
	padding:0;
	float:left;
	font-weight:bold;
}

.box{
	margin:5px;
	padding:10px;
	border:1px solid black;
	border-radius:5px;
	box-shadow: 2px 2px 3px #000000;
	background-color:#FFFFFF;
}

.box2x1{
	width:628px;
	height:185px;
}

.box1x1{
	width:298px;
	height:185px;
}

.box1x2{
	width:298px;
	height:401px;
}

.box3x{
	width:957px;
	min-height:20px;
}

.box2x2{
	width:628px;
	min-height:619px;
}

.right {
	float:right;
}

.left {
	float:left;
}

.intro{
	border:1px solid black;
	max-height:200px;
	max-width:200px;
	float:right;
	margin:5px;
}
.intromed{
	border:none;
	max-height:150px;
	max-width:150px;
	float:right;
	margin:5px;
}
.intromini{
	border:1px solid black;
	max-height:80px;
	max-width:80px;
	float:right;
	margin:1px;
}
.mainpic{
	border:none;
	max-height:300px;
	max-width:300px;
	margin:8px;
}
p{
	text-indent:1em;
	margin:5px 0;
}

h1,h2,h3,h4,h5
{
  color:           #6666DD;
  font-weight:      bold;
}

h1
{
  font-size: 12pt;
  border-bottom:   2px solid #2483FF;/*table_container_colour*/
  padding-bottom:  3px;
  margin-bottom: 5px;
}

h2 {
	font-size:14pt;
}

h3{	
	margin:5px;
	font-size:12pt;
}

h4{	margin:4px;
	font-size:10pt;
}

ul {
   list-style-position: inside;
}

table .matrix{padding:2px;border-spacing:2px;min-width:960px;}
.head{font-size:25px; font-weight:bold; color:#606060;text-align:center;background-color:#eeeeee;}
.side{font-size:16px; font-weight:bold; color:#000000;background-color:#eeeeee;text-align:left;width:100px;}
.aside{font-size:16px; font-weight:normal; color:#000000;text-align:center;background-color:#eeeeee;width:500px;}
.top{font-size:16px; font-weight:bold; color:#000000;text-align:center;background-color:#eeeeee;width:120px;}
.atop{font-size:16px; font-weight:normal; color:#000000;text-align:center;background-color:#eeeeee;}
.tick{font-family: WingDings; font-size:30px; font-weight:bold; color:#00D000;text-align:center;background-color:#eeeeee;}
.cross{font-family: WingDings; font-size:30px; font-weight:bold; color:#FF3030;text-align:center;background-color:#eeeeee;}

.quoter{font-weight:bold; color:#4088FF;text-align:right;}