/*css*/

@media all {
	html  {
		background-color:#b2aaa3;
	}

	* {
		font-family:tahoma;
		margin:0;
		padding:0;
	}

	body {
		margin:0px;
		padding:1px;
		background:url('./header_gradient.jpg') repeat-x top left;
	}

img {
	background:url('http://pragmaticsystem.ca/includes/loading.gif') no-repeat center center;
}

#logocontrol img {
	background:none;
}
	h1 {
		display:block;
		background:url('./logo.jpg') no-repeat top left;
		width:184px;
		height:46px;
		margin:10px;
	}

	h1 span {
		display:none;
	}

	h2 {
		font-size:1.1em;
		border-bottom:1px solid #000;
	}

	h3 {
		border-bottom:1px solid #000;
		margin-bottom:5px;
		font-size:1em;
		padding:3px;
	}

	label {
		display:block;
	}

	a:link {
		color:#555;
	}

	a:visited {
		color:#555;
	}

	a:hover {
		text-decoration:none;
	}

	table {
		width:98%;
	}

	td {
		width:50%;
	}

	table .td1 input, table .td2 input {
		width:150px;
		float:right;
		margin:5px;
	}

	table .td2 .checkbox {
		width:auto;
		clear:right;
	}

	table .td2 label {
		clear:right;
		display:block;
		width:100%;
		font-weight:bold;
		font-size:0.9em;
	}

	table td textarea {
		width:150px;
		float:right;
	}

	#header {
		height:98px;
		width:73%;
		padding:0 10px;
		margin:0 auto;
		margin-top:41px;
		background:#e3f4df;
		border:1px solid #000;
		min-width:800px;
	}

	#logo {
		margin-top:-55px;
		height:45px;
		width:270px;
		float:right;
		background: url('niagararesearch-logo-lowres.png') top right no-repeat;
	}

	#nav {
		margin:0 -10px;
		margin-top:23px;
		height:20px;
		background:#bcc0ad;
		border-top:1px solid #000;
		min-width:800px;
	}

	#container {
		width:73%;
		min-height:200px;
		background:#FFF;
		border:1px solid #000;
		margin:1px auto;
		padding:10px;
		min-width:800px;
	}

	#container .message {
		margin:5px;
		width:400px;
	}

	#main {
		width:60%;
		float:left;
		margin-top:10px;
	}

	#main h3 {
		height:25px;
	}

	#main h3 small {
		font-size:0.8em;
		font-weight:normal;
	}
	
	#main .news {
		padding:5px;
		margin-bottom:10px;
		border:1px solid #000;
	}

	.date {
		display:none;
		float:right;
		padding:0 3px;
	}

	#sidebar {
		margin-top:10px;
		margin-left:64%;
		width:35%;
	}

	#sidebar label {
		display:block;
		clear:right;
		height:25px;
		font-size:0.8em;
	}

	#sidebar form input {
		float:right;
		margin:2px;
	}

	#sidebar .section {
		clear:right;
		border: 1px solid #000;
		padding:5px;
		padding-bottom:30px;
		margin-bottom:10px;
	}

	#status {
		clear:both;
		text-align:center;
		padding-top:10px;
	}

	#footer {
		text-align:center;
	}

	.message {
		margin:0 auto;
		width:60%;
		background:#DDD;
		border:1px solid #000;
		text-align:center;
		padding:2px;
	}

	.column {
		border:1px solid #555;
		margin:5px;
		padding:5px;
	}

	.column .sortable {
		padding:0px;
	}

	.col1 {
		width:200px;
		float:left;
		clear:left;
	}

	.col2 {
		width:475px;
	}

	.col3 {
		width:200px;
		float:right;
		clear:right;
	}

	.groupsec {
		font-size:0.9em;
	}

	.groupsec a {
		display:block;
		padding:2px;
	}

	.groupsec select {
		width:98%;
	}

	.draggable{
		border:1px solid #555;
		padding:5px;
		margin: -5px -5px;
		margin-bottom:10px;
	}

	.gapicontainer {
		border: 1px solid silver; 
		height: 300px;
	}

	.draggable h2{
		cursor: move;
	}
}

@media handheld 
{
	body {
		background:url('');
	}
	
	h1 {
		width:100%;
		height:auto;
		margin:1px;
		background:url('');
	}
	
	h1 span {
		display:block;
	}
	
	table .td1 input, table .td2 input {
		width:auto;
		float:right;
		margin:0px;
	}
	
	table td textarea {
		width:auto;
	}
	
	table select {
		width:auto;
	}
	
	#header {
		width:100%;
		height:auto;
		min-width:none;
		padding:0;
		margin:0;
	}
	
	#logo {
		display:none;
	}
	
	#nav {
		margin:0;
		height:auto;
	}
	
	#container {
		width:auto;
		min-width:none;
		min-height:none;
		padding:0;
	}
	
	#container .message {
		width:100%;
		margin:0;
	}
	
	#main {
		width:100%;
		margin:0;
	}
	#container #main {
		background:#000;
		border:1px solid #000;
		padding-bottom:20px;
	}
	
	#sidebar {
		margin:0px;
		width:100%;
	}
	
	#sidebar label {
		height:auto;
		display:block;
	}
	
	#sidebar .section {
		padding:0;
		margin:0;
	}
	
	.column {
		margin:0;
		padding:0;
	}
	
	.col1 {
		width:100%;
		float:none;
	}
	
	.col2 {
		width:100%;
		margin:0;
	}
	
	.col3 {
		width:100%;
		float:none;
	}
	
	.draggable {
		margin:0;
		padding:0;
	}	
	
	.gapicontainer {
		height:100px;
	}
	
	.draggable h2 {
		cursor:move;
	}
	
	.message {
		width:auto;
	}
	
}