/* -------------------------------------------------------------------------------- */
/*																					*/
/*		[Just Checking] 		Generic Styles Screen Stylesheet					*/
/*																					*/
/*		date:      10/05/10															*/
/*		author:    [Cloud Nine - Ash Bryant]										*/	
/*		email:     [info AT c9dd DOT com]											*/	
/*		website:   [http://www.c9dd.com/]											*/	
/*																					*/
/*																					*/
/*		Colours used:	#898667  -  Green / Brown 	- Background 					*/
/*						#F4F3EF  -  Light Brown		- BG for non-content areas		*/
/*						#486469	 -	Blue			- Image Borders					*/
/*						#CCCCCC  -  Light Grey		- Borders						*/
/*						#8F0407	 -	Burgundy		- Heading Text					*/
/*						#333333  -  Very Dark Grey	- Body Text						*/
/*						#1070B6  -  Blue			- Some Links 					*/
/*						#679010  -  Green			- Ledgend Headings				*/
/*																					*/
/* -------------------------------------------------------------------------------- */

/* ----------------------------------------------------------- @font-face typefaces */

/*This may cause issues with select fields in safari */
@font-face {
	font-family: 'ITCAvantGardeGothicProDemi';
	src: url('fonts/itcavantgardepro-demi-webfont.eot');
	src: local('☺'), url('fonts/itcavantgardepro-demi-webfont.woff') format('woff'), url('fonts/itcavantgardepro-demi-webfont.ttf') format('truetype'), url('fonts/itcavantgardepro-demi-webfont.svg#webfontKQDXmO5M') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'ITCAvantGardeGothicProBook';
	src: url('fonts/itcavantgardepro-bk-webfont.eot');
	src: local('☺'), url('fonts/itcavantgardepro-bk-webfont.woff') format('woff'), url('fonts/itcavantgardepro-bk-webfont.ttf') format('truetype'), url('fonts/itcavantgardepro-bk-webfont.svg#webfontKQDXmO5M') format('svg');
	font-weight: normal;
	font-style: normal;
}

		/* display fonts */
		h1, .extra-large { font: 2.5em/1.3 ITCAvantGardeGothicProDemi, Arial, Helvetica, Verdana, sans-serif; }
		h2, .large { font: 2em/1.3 ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif; }
		h3 { font: 1.8em/1.3 ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif; margin-bottom: 0.5em; }
		h4, .medium { font: 1.6em/1.3 ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif; }
		h5 { font: 1.4em/1.3 ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif; }
		h6, .small  { font: 1.2em/1.2 ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif; }



::-webkit-validation-bubble {}
::-webkit-validation-bubble-message {}
::-webkit-validation-bubble-arrow {}
::-webkit-validation-bubble-arrow-clipper {}
::-webkit-validation-bubble-icon {}
::-webkit-validation-bubble-body {}
::-webkit-validation-bubble-text-block {}
::-webkit-validation-bubble-arrow-heading {}
/* -- This the message container, and where most of the styling happens -- */
::-webkit-validation-bubble-message {
	background-color: #e51b00;
	background-image: -webkit-linear-gradient(#e51b00 43%, #ba1600 100%);
    border: 1px solid #9f1300;
	-webkit-border-radius: 6px;
	box-shadow: rgba(0, 0, 0, 0.65) 0 2px 7px,
						inset rgba(255, 60, 60, 1) 0 1px 0px;
	color: #f3f3f3;
	font-family: 'helvetica neue', arial, sans-serif;
	font-size: 12px;
	-webkit-font-smoothing: antialiased;
	line-height: 1em;
    min-width: 50px;
    max-width: 300px;    
    padding: 6px 10px 7px 10px;
	text-shadow: #901100 0 -1px 0;
	top: -7px;
}

/* -- This is...well...the bubble arrow if you want it -- */
::-webkit-validation-bubble-arrow {
	background-color: #e51b00;
	border: 1px solid #9f1300;
	border-right: none;
	border-bottom: none;
    -webkit-box-shadow: none;
    display: inline-block;
	height: 12px;
	left: 20px;
    position: relative;
    -webkit-transform-origin: 0 0;
    -webkit-transform: rotate(45deg);
    width: 12px;
}

/* -- This is an extra element (<div>) that is used to mask the arrow
 	  when it has its default styles. It clips it so it doesn't show
      on the bubble message.
-- */
::-webkit-validation-bubble-arrow-clipper {
    display: block;
	height: 16px;
    overflow: hidden;
}

/* Overwrite moz default */
input:invalid {	
	box-shadow: none;

	/* Moz default */
	/* box-shadow: 0 0 1.5px 1px red; */
}
/* ------------------------------------------------------- DEVELOPMENT STYLES START */

* { /* Removes default padding and margin on all elements */
    margin: 0;
    padding: 0;
    border: 0;
	}

.cloud9-link-love,
.cloud9-link-love a {
	font-size: 1.1em !important;
	color: #D6D6CF !important;
	text-decoration: none;
	}
	
	.cloud9-link-love a {
		font-size: 1em !important;
		}
	
	.cloud9-link-love a:hover {
		color: #E98128 !important;
		text-decoration: underline;
		}

#skip-link {
	display: none;
	}

a,
input {
	outline: none;
	text-decoration: none;
	cursor: pointer;
	}
	
	a:hover {
		text-decoration: underline;
		}
		
	/*a.no-link {
		cursor: default;
		}*/

.devBorder { /* Development Border so I can see what the elements are playing at when I need to */
	border: 1px solid #FF0000;
	}

.whiteBG {
	background-color: #FFF;
	}

.table {
	border: 1px solid #E3E5DC;
	}
	
	.table td {
		padding: 5px;
		border: 1px solid #E3E5DC;
		}	
	

/*filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/line.png'); /* PNG FIX FOR IE 6 */

/* &lt;a href=&quot;images/styles/style_002a.jpg&quot; rel=&quot;lightbox[]&quot;&gt;Help&lt;/a&gt; */


/* These styles will soon point out any invalid/bad code that may have slipped in when you weren't looking. Naughty! */ 
/*
img {outline: 5px solid red;}
img[alt][title] {outline-width: 0;}
img[alt] {outline-color: fuchsia;}
img[alt], img[title] {outline-style: double;}
img[alt=""][title], img[alt][title=""] {outline-width: 3px;}
img[alt=""][title=""] {outline-style: dotted;}

a[href="#"] {background: lime;}
a[href=""] {background: fuchsia;}

/*  this will show up the structure.

div { border: solid 2px red; }
div div { border-color: orange; }
div div div { border-color: yellow; }
div div div div { border-color: green; }
div div div div div { border-color: aqua; }
div div div div div div { border-color: navy; }
div div div div div div div { border-color: purple; }
*/



/* --------------------------------------------------- || DEVELOPMENT STYLES END || */



/* ----------------------------------------------------------- COLOURS STYLES START */

.white {
	color: #FFF !important;
}

.orange {
	color: #E98128 !important;
	}

.blue {
	color: #4DA1BD !important;
}

.red {
	color: #CC0000 !important;
	}

.green {
	color: #8BD83F !important;
	}
	
.opaque {
	background: transparent url(../images/transparent_bg.gif) repeat top left;
	/*opacity: .9;
	filter: alpha(opacity=90); /*IE ONLY*/
}

html>body div.opaque {
	background: transparent url(../images/transparent_bg.png) repeat top left; 
}

.notopaque {
	opacity: 1;
	filter: alpha(opacity=100); /*IE ONLY*/
}

/* ------------------------------------------------------- || COLOURS STYLES END || */

.widthFull {
	width: 97.8%;
	}


/* ----------------------------------------------------------- MARGINS STYLES START */

.margin0 {
	margin: 0;
	}
	
.marginTop0{
	margin-top: 0;
}

.marginRight0 {
	margin-right: 0;
}

.marginBottom0 {
	margin-bottom: 0;
}

.marginLeft0 {
	margin-left: 0;
}

.margin1 {
	margin: 1em;
}

.marginTop1{
	margin-top: 1em;
}

.marginRight1 {
	margin-right: 1em;
}

.marginBottom1 {
	margin-bottom: 1em;
}

.marginLeft1 {
	margin-left: 1em;
}

.marginTopBottom2 {
	margin: 2em 0 ;
}

.margin2 {
	margin: 2em;
}

.marginTop2{
	margin-top: 2em;
}

.marginRight2 {
	margin-right: 2em;
}

.marginBottom2 {
	margin-bottom: 2em;
}

.marginLeft2 {
	margin-left: 2em;
}

/* ------------------------------------------------------- || MARGINS STYLES END || */




/* -------------------------------------------------------------- TEXT STYLES START */

html { overflow: -moz-scrollbars-vertical !important; } /* STOP THE PAGE JUMPING AROUND IN FIREFOX (I know I hate using !important, but in this case its for the greater good) */
/*
h1 {
	font-weight: normal;
}
*/

.normal {
	font-weight: normal;
}

.bold {
	font-weight: bold !important;
}

.italic {
	font-style: italic;
}

.small {
	font-size: 1em !important;
}

.medium {
	font-size: 1.25em !important;
	}
	
.large {
	font-size: 2em !important;
	}
	
.x-large {
	font-size: 3em !important;
	}		

.underline {
	text-decoration: underline;
}

/* ---------------------------------------------------------- || TEXT STYLES END || */



/* ----------------------------------------------------- OTHER GENERIC STYLES START */


.border {
	border: 1px solid #91A9B0;
} 

.imageBorder {
	border: 1px solid #E3E5DC;
	}

.borderNone {
	border: none !important;
	}

.clearLeft {
	clear: left;
}

.clearRight {
	clear: right;
}


.clearBoth {
    clear: both;
}

.clearNone {
	clear: none;
}

.floatRight {
    float: right;
	display: inline; /* IE fix */
}

.floatLeft {
    float: left;
	display: inline; /* IE fix */
}

.hidden {
	visibility: hidden;
}

.displayNone {
	display: none;
}

.fullWidth {
	width: 100%;
	}

.clear-both {
	padding: 10px 0 ;
	}

	
.rounded1 {
	/* optional rounded corners for browsers that support it */ 
    -moz-border-radius: 1em;
    -khtml-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;
    }	

/* ------------------------------------------------- || OTHER GENERIC STYLES END || */

.wp-caption {
	margin-bottom: 15px;
	}

.wp-caption.alignleft,
img.alignleft {
	float: left;
	margin-right: 15px;
	}

.wp-caption.alignright,
img.alignright {
	float: right;
	margin-left: 15px;
	}
	
.wp-caption.aligncenter,
img.aligncenter {
	margin: 0 auto;
	}	

	.wp-caption a {
		float: left;
		margin: 0 5px 5px;
		}
		
		.wp-caption img {
			}

	.wp-caption p {
		float: left;
		padding-left: 10px;
		border-left: 5px solid #EEE;
		font-size: 11px;
		}

/* ----------------------------------------------------- FORMS STYLES START */
fieldset {
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	padding: 1em;
	border: 1px solid #EBEBE5;
	}

	legend {
		margin: 0 0.3em;
		padding: 0 0.5em;
		font-size: 1.4em;
		color: #B7B7A1;
		}
		
	label {
		font-size: 1.2em;
		}
	
	label, input, select, textarea,	
	input[type="text"],
	input[type="password"],
	input[type="tel"],
	input[type="date"],
	input[type="email"] {
		font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
		line-height: 1.2em;
		padding: 0.3em 0.5em 0.3em;
		color: #666;
		background: #F6F5F1;
		border: 1px solid #E3E0D8;
		cursor: text;
		}

	select{
		cursor:pointer;
		}
		
		textarea {
			font-size: 1.2em;
			}
		
		
    input[type="text"]:disabled { 
    	cursor: not-allowed!important;
    	background:#ddd;
    	}
    	
    
.button {
	padding: 0 1em 0.2em !important;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif;
	font-size: 1em;
	font-weight: normal;
	color: #666;
	border: 4px solid #EBEBE5;
	background-color: #F4F4F3;
	cursor: pointer;
	/* optional rounded corners for browsers that support it */ 
	-moz-border-radius: 1em;
	-khtml-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius:1em;
	padding: 0.3em 0.5em 0.3em;
	}
	
	.button:hover,
	.button:active {
		text-decoration: none;
		color: #fff !important;
		background-color: #E98128;
		}
		
	.button.orange:hover,
	.button.orange:active {
		color: #666;
		border: 4px solid #EBEBE5;
		background-color: #F4F4F3;
		}

	/*input.button {
		padding: 0 0.2em;
		}*/
		
	.button.orange {
		color: #fff;
		background-color: #E98128;
		}	


/* ------------------------------------------------- || FORMS STYLES END || */

#size-control {
	float: right;
	position: fixed;
	top: 5px;
	right: 5px;
	}


#fancybox-content div p,
#fancybox-content div ul,
#fancybox-content div ol,
#fancybox-content div blockquote,
#content p, 
#content ul, 
#content li,
#content ol,
#content blockquote,
#content address {
/*  font-family: ITCAvantGardeGothicProBook, Arial, Helvetica, Verdana, sans-serif;
	font-size: 1.25em;
	font-weight: normal;
	line-height: 1.5em; */
	color: #333;
	font-size: 13px;
	/*margin-bottom: 1em;*/
	}
	
	#content blockquote {
		margin: 1em;
		font-style: italic;
		}
	
	#fancybox-content div p a,		
	#content p a,
	#content blockquote a,
	#content li a,
	#content h2 a   {
		color: #4DA1BD;
		}
			
			#fancybox-content div p a:hover,
			#content p a:hover,
			#content blockquote a:hover,
			#content li a:hover,
			#content h2 a:hover {
				color: #4DA1BD;
				}
			
			#fancybox-content div p:visited,	
			#content p a:visited,
			#content blockquote a:visited,
			#content li a:visited,
			#content h2 a:visited {
				color: #E98128;
				}		
				
	#content ul, 
	#content ol {
		margin-left: 2em;
		}

#content hr {	
	clear: both;
	width: 100%;
	margin: 1.5em 0;
	border-top:1px solid gray;
	}

	#content hr.solid-line {
		border-bottom: 1px solid #333;
		}
		
	#content hr.solid-line.grey {
		border-bottom: 1px solid #E3E5DC;
		}	
/* ----------------------------------------------------- LIST STYLES START */
/* ------------------------------------------------- || LIST STYLES END || */


	ul.stripes {
		margin: 0 !important;
		}
	
		ul.stripes li {
			padding-left: 5px;
			line-height: 1.8em;
			}
	
		ul.stripes li:nth-child(2n),
		ul.stripes .odd {
			border-top: 1px solid #B7B7A1;
			border-bottom: 1px solid #B7B7A1;
			background-color: #F9F9F6;
			}
	
	ul.stripes.floatLeft {
		width: 100%;
		}
				
	ul.ticks-orange {
		list-style-position: inside;
		list-style-image: url(../images/tick-orange-small.png);
		}			
	ul.noBullets {
		list-style: none;
		}
		
/* ----------------------------------------------------- VIDEO STYLES START */

	video {
		border: 1px solid #E3E5DC;
		}

/* ------------------------------------------------- || VIDEO STYLES END || */


/*----------------------------Messages--------------------------------------*/

.msg {
	padding: 1em;
	border: 1px solid #B7B7A1;
	background-color: #F9F9F6;
	}

.goodMsg{
	padding:10px;
	border:1px solid #0c6b12;
	background-color:#c6fcc9;
}

.badMsg{
	padding:10px;
	border:1px solid #a40316;
	background-color:#fcc6cc;
}

/* Following code adds icons to links that link to media downloads */

a[href$=".doc"],
a[href$=".odt"], 
a[href$=".rtf"], 
a[href$=".txt"], 
a[href$=".wps"],
a[href$=".csv"],
a[href$=".ods"],
a[href$=".xls"],
a[href$=".xlt"],
a[href$=".ppt"],
a[href$=".odp"],
a[href$=".otp"],
a[href$=".pot"],
a[href$=".pdf"],
a[href$=".zip"],
a[href$=".rar"],
a[href$=".tar"],
a[href$=".tar.gz"],
a[href$=".doc"],
a[href$=".odt"], 
a[href$=".rtf"], 
a[href$=".txt"], 
a[href$=".wps"],
a[href$=".csv"],
a[href$=".ods"],
a[href$=".xls"],
a[href$=".xlt"],
a[href$=".ppt"],
a[href$=".odp"],
a[href$=".otp"],
a[href$=".pot"],
a[href$=".pdf"],
a[href$=".zip"],
a[href$=".rar"],
a[href$=".tar"],
a[href$=".tar.gz"],
a[href$=".avi"],
a[href$=".mov"],
a[href$=".mp4"] {
	display:inline-block;
	line-height:18px;
	min-height:18px;
	overflow:visible;
	padding: 2px 0 2px 20px;
	}	
		
a[href$=".doc"],
a[href$=".odt"], 
a[href$=".rtf"], 
a[href$=".txt"], 
a[href$=".wps"],
a[href$=".doc"],
a[href$=".odt"], 
a[href$=".rtf"], 
a[href$=".txt"], 
a[href$=".wps"] {
	background:transparent url(../images/icons/page_white_word.png) no-repeat scroll left center;
	}

a[href$=".csv"],
a[href$=".ods"],
a[href$=".xls"],
a[href$=".xlt"],
a[href$=".csv"],
a[href$=".ods"],
a[href$=".xls"],
a[href$=".xlt"]  {
	background:transparent url(../images/icons/page_white_excel.png) no-repeat scroll left center;
	}	

a[href$=".ppt"],
a[href$=".odp"],
a[href$=".otp"],
a[href$=".pot"],
a[href$=".ppt"],
a[href$=".odp"],
a[href$=".otp"],
a[href$=".pot"] {
	background:transparent url(../images/icons/page_white_powerpoint.png) no-repeat scroll left center;
	}	

	
a[href$=".pdf"],
a[href$=".pdf"] {
	background:transparent url(../images/icons/page_white_acrobat.png) no-repeat scroll left center;
	}	

a[href$=".zip"],
a[href$=".rar"],
a[href$=".tar"],
a[href$=".tar.gz"],
a[href$=".zip"],
a[href$=".rar"],
a[href$=".tar"],
a[href$=".tar.gz"] {
	background:transparent url(../images/icons/page_white_zip.png) no-repeat scroll left center;
	}
	
a[href$=".avi"],
a[href$=".mov"],
a[href$=".mp4"] {
	background:transparent url(../images/icons/film.png) no-repeat scroll left center;
	}				
