/*===========================================================================*

	written by:
	* julian at visuallizard dot com
	updated by:
	* ross at visuallizard dot com

	(c)2009 - visuallizard.com

*===========================================================================*/
* {
	background: none;
}

html {
	background: none;
}

body.debug:before {
	content: attr(class);
	position: fixed;
	top: 0px;
	right: 10px;
	color: #eee;
	display: none;
}
body {
	font-family: "Georgia", "Times New Roman", "Garamond", serif;
}

h1, h2, h3, h4, p, ul, ol, form {
	margin: 0.5em 0;
	padding: 0;
	font-weight: normal;
}


img {
	display: block;
	border: 0;
}

acronym {
	border-bottom: 1px dotted #333;
	cursor: help;
}

a { 
	overflow: hidden;
} /* chase away the marquee that gets drawn around the text on an a tag even when you have a specific h x w - FF.Camino.Opera draw this extra marquee as a user cue. */


.last {margin-right:0;}

.w5 { width: 5%; }
.w10 { width: 10%; }
.w15 { width: 15%; }
.w20 { width: 20%; }
.w25 { width: 25%; }
.w30 { width: 30%; }
.w35 { width: 35%; }
.w40 { width: 40%; }
.w45 { width: 45%; }
.w50 { width: 50%; }
.w55 { width: 55%; }
.w60 { width: 60%; }
.w65 { width: 65%; }
.w70 { width: 70%; }
.w75 { width: 75%; }
.w80 { width: 80%; }
.w85 { width: 85%; }
.w90 { width: 90%; }
.w95 { width: 95%; }
.w100 { width: 100%; }

.h1 { height: 1em; }
.h2 { height: 2em; }
.h3 { height: 3em; }
.h4 { height: 4em; }
.h5 { height: 5em; }
.h6 { height: 6em; }
.h7 { height: 7em; }
.h8 { height: 8em; }
.h9 { height: 9em; }
.h10 { height: 10em; }
.h11 { height: 11em; }
.h12 { height: 12em; }
.h13 { height: 13em; }
.h14 { height: 14em; }
.h15 { height: 15em; }
.h16 { height: 16em; }
.h17 { height: 17em; }
.h18 { height: 18em; }
.h19 { height: 19em; }
.h20 { height: 20em; }

.block { display: block; }
.inline { display: inline; }
.hidden { display: none; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }

input, select, textarea {
	font: 1em/1.3em Verdana, Arial, Helvetica, sans-serif;
}

	input.inline, 
	select.inline, 
	textarea.inline {
		display: inline;
		margin-right: 0.5em;
	}
	
	div.datetime input, 
	div.datetime select {
		display: inline;
	}


/* !root site styles */
#wrapper {
	display: block;
	position: relative;
	width: 90%;
	margin: 0 5% 15px 5%;
}

	#header {
		margin: 1em 0 0 0;
		padding: 0.25em 0;
		width: 100%;
		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		border-radius: 15px;
	}
	
		#header h1 {
			color: #666;
			text-align: center;
			font-size: 5em;
			line-height: 2em;
			border-bottom: 5px double #999;
			margin: 0;
		}
		
		#content {
			display: block;
			position: relative;
			float: left;
			width: 50%;
			margin: 15px 15%;
			padding: 15px 10%;
			background: #fff;
			border-top: 5px double #999;
			-webkit-border-radius: 15px;
			-moz-border-radius: 15px;
			border-radius: 15px;
		}
		
			#navigation {
				display: block;
				position: relative;
				float: left;
				min-height: 10px;
				margin: 10px 0;
				width: 100%;
				padding: 0;
			}
			
				#navigation ul.nav_1 {
					display: block;
					position: relative;
					float: left;
					width: 90%;
					margin: 0 5%;
					padding: 0;
					list-style: none;
				}
				
					#navigation ul.nav_1 li {
						display: block;
						position: relative;
						float: left;
						width: 16.66667%;
						line-height: 30px;
						padding: 0;
						
					}
					
						#navigation ul.nav_1 li a {
							display: block;
							padding: 0;
							color: #333;
							font-size: 1em;
							text-transform: none;
							text-decoration: none;
							text-align: center;
							border-left: 1px dotted #999;
						}
						#navigation ul.nav_1 li.first a {
							border: none;
						}
						#navigation ul.nav_1 li a:hover {
							
						}
			
			#col2 {
				display: block;
				position: relative;
				float: right;
				width: 100%;
				padding: 15px 0;
				min-height: 10px;
				margin: 0;
			}
			
				#col2 h2 {
					font-size: 2.4em;
				}
				
				#col2 iframe {
					display: block;
					position: relative;
					max-width: 100%;
				}
				
				#col2 div.article {
					display: block;
					position: relative;
					float: left;
					width: 32%;
					min-height: 200px;
					margin: 0 1% 1% 0;
					background: #dfdfdf;
					-webkit-border-top-right-radius: 15px;
					-moz-border-radius-topright: 15px;
					border-top-right-radius: 15px;
					-webkit-box-shadow: 3px 3px 5px #999;
					-moz-box-shadow: 3px 3px 5px #999;
					box-shadow: 3px 3px 5px #999;
				}
				
					#col2 div.article h3 {
						font-size: 1.3em;
						min-height: 35px;
						margin: 0.5em 1em;
					}
					
					#col2 div.article p {
						font-size: 1em;
						line-height: 1.6em;
						margin: 0.5em 1em;;
					}
					
						#col2 div.article p b {
							font-size: 1.2em;
							font-weight: bold;
						}


/* !Maximum width of 780px */
@media screen and (min-width: 320px) and (max-width: 780px) {
	h1 { font-size: 1.4em; margin: 0.5em; }
	h2 { font-size: 1.2em; margin: 0 0.5em 1.5em 0.5em; }
	h3 { font-size: 1em; margin: 0 0.5em 1.5em 0.5em; }
	h4 { font-size: 0.9em; margin: 0 0.5em 1.5em 0.5em; }
	h5 { font-size: 0.8em; margin: 0 0.5em 1.5em 0.5em; }
	h6 { font-size: 0.7em; margin: 0 0.5em 1.5em 0.5em; }
	p, ul, ol {
		font-size: 0.9em;
		line-height: 1.3em;
		margin: 0 0.5em 1.5em 0.5em;
	}
	
	ul, ol {
		margin-left: 0;
		list-style-type: square;
	}
	ol {
		list-style-type: decimal;
	}
	
		ul ul {
			margin-left: 1em;
			margin-bottom: 0;
		}
		
	li {
		margin: 0 0 0.25em 0;
	}
	
	#content {
		background: #fff;
		margin-bottom: 160px;
	}
	
	#navigation {
		position: absolute;
		bottom: 0;
	}
	
		#navigation ul.nav_1 {
			width: 96%;
			margin: 0.5% 2% 0.5% 0;
		}
		
			#navigation ul.nav_1 li {
				line-height: 1.5em;
			}
			
				#navigation ul.nav_1 li a {
					
				}
				#navigation ul.nav_1 li a:hover {
					
				}
		
		#col2 {
			clear: left;
			float: left;
			width: 90%;
			margin: 0 5%;
			border: none;
		}
		
			#col2 div.article {
				display: block;
				position: relative;
				float: left;
				width: 96%;
				min-height: 150px;
				margin: 0.5% 2%;
				background: #ededed;
			}

}


/* !Minimum width of 780px to 980px */
@media screen and (min-width: 780px) and (max-width: 980px) {
	h1 { font-size: 1.6em; margin: 0.5em; }
	h2 { font-size: 1.4em; margin-top: 0; }
	h3 { font-size: 1.2em; }
	h4 { font-size: 1em; }
	h5 { font-size: 0.8em; }
	h6 { font-size: 0.7em; }
	p, ul, ol {
		font-size: 1em;
		line-height: 1.4em;
		margin: 0 0 1.5em 0;
	}
	
	ul, ol {
		margin-left: 2em;
		list-style-type: square;
	}
	ol {
		list-style-type: decimal;
	}
	
		ul ul {
			margin-left: 1em;
			margin-bottom: 0;
		}
		
	li {
		margin: 0 0 0.25em 0;
	}
	
	
	#col2 div.article {
		display: block;
		position: relative;
		float: left;
		width: 49%;
		min-height: 150px;
		margin: 0 1% 1% 0;
		background: #ededed;
	}

}

/* !Minimum width of 980px */
@media screen and (min-width: 980px) {
	h1 { font-size: 2em; margin: 0.5em; }
	h2 { font-size: 1.8em; margin-top: 0; }
	h3 { font-size: 1.6em; }
	h4 { font-size: 1.4em; }
	h5 { font-size: 1.2em; }
	h6 { font-size: 1em; }
	p, ul, ol {
		font-size: 1.2em;
		line-height: 1.6em;
		margin: 0 0 1.5em 0;
		padding: 0;
	}
	
	ul, ol {
		margin-left: 2em;
		list-style-type: square;
	}
	ol {
		list-style-type: decimal;
	}
	
		ul ul {
			margin-left: 1em;
			margin-bottom: 0;
		}
		
	li {
		margin: 0 0 0.25em 0;
	}
	
	#col2 {
		display: block;
		position: relative;
		float: right;
		min-height: 10px;
		margin: 0 0 10px 0;
	}

}
	
	
	#footer {
		display: block;
		position: relative;
		clear: both;
		margin-top: 0.5em;
		min-height: 15px;	}

/* !Forms */
	form { 
		margin-bottom: 20px;
	}
	fieldset { 
		margin-bottom: 20px;
	}
	input[type="text"], 
	input[type="password"],
	input[type="email"],
	textarea, 
	select {
		border: 1px solid #ccc;
		padding: 6px 4px;
		outline: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #777;
		margin: 0;
		width: 210px;
		max-width: 100%;
		display: block;
		margin-bottom: 20px;
		background: #fff;
	}
	select { 
		padding: 0;
		width: 220px;
	}
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus, 
	textarea:focus {
		border: 1px solid #aaa;
 		color: #444;
 		-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
		box-shadow:  0 0 3px rgba(0,0,0,.2);
	}
	textarea {
		min-height: 60px;
	}
	label,
	legend { 
		display: block;
		font-weight: bold;
		font-size: 13px;
	}
	input[type="checkbox"] {
		display: inline;
	}
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444;
	}

/* !form basic styles */
	form.standard {
		display: block;
		position: relative;
		float: left;
		margin: 15px;
	}
	
		form.standard .input.text,
		form.standard .input.password,
		form.standard .input.not-inline,
		form.standard .input p {
			display: block;
			position: relative;
			float: left;
			width: 100%;
		}
		
			form.standard .input.text label,
			form.standard .input.password label,
			form.standard .input.not-inline label,
			form.standard .input.select label,
			form.standard .input.textarea label {
				display: block;
				position: relative;
				float: left;
				width: 150px;
				line-height: 20px;
				padding: 10px 0;
			}
			form.standard .input.text input,
			form.standard .input.password input,
			form.standard .input.not-inline input {
				display: block;
				position: relative;
				float: left;
				line-height: 20px;
				width: 200px;
			}
		
		form.standard .input.select {
			display: block;
			position: relative;
			float: left;
		}
		
			form.standard .input.select select {
				display: block;
				position: relative;
				float: left;
			}
		
		form.standard .input.radio,
		form.standard .input.checkbox {
			display: block;
			position: relative;
			width: 100%;
			line-height: 20px;
			float: left;
		}
		
		form.standard .input.radio input,
		form.standard .input.checkbox input {
			display: block;
			float: left;
			width: 20px;
		}
		
		form.standard .input.radio label,
		form.standard .input.checkbox label {
			display: block;
			float: left;
			line-height: 20px;
			width: 200px;
		}
		
		form.standard .input.textarea {
			display: block;
			position: relative;
			float: left;
		}
		
			form.standard .input.textarea textarea {
				display: block;
				position: relative;
				float: left;
			}
		
		form.standard #recaptcha_widget_div {
			display: block;
			position: relative;
			margin: 15px 0;
			clear: left;
			background: #fff;
		}
		
		form.standard input.submit,
		form.standard .submit {
			display: block;
			position: relative;
			clear: left;
		}

/* !member profile display */
table.profile {

}

	table.profile th {
		vertical-align: top;
	}
	
	table.profile td {
		vertical-align: top;
	}


/*=============================================================================*
	CakePHP Debug SQL table
*=============================================================================*/

table.cake-sql-log {
	width: 980px;
	margin: 2em auto;
	
	color: #000;
	text-align: left;
	
	border-top: 1px solid #000;
	border-left: 1px solid #000;
}

table.cake-sql-log td,
table.cake-sql-log th {
	border-bottom: 1px solid #000;
	border-right: 1px solid #000;
	padding: 0.5em;
}

table.cake-sql-log caption {
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	background-color: #000;
	padding: 0.5em;
}