/*
CSS INFO & RULES
=================
1) List properties in alphabetical order (eg font-size would go before text-align which would go before z-index)
2) List each property on its own line rather than on one line
3) List things in the order in which they appear on the page
4) Comment out your code and indent it propery as per our coding standard
5) Make sure you put everything in the RIGHT PLACE below!


CONTENTS
=========
- ERRORS
- GENERAL CLASSES
- CODING STANDARD / FRAMEWORK CLASSES
- HEADER (eg whats in inc-htmltop)
- MAIN BODY
- FOOTER (eg whats in inc-htmlbottom)


/* ERRORS [START] */

	#errorMessage {

		background-color: #C00;
		color: #fff;
		font-size: 1.1em;
		line-height: 1.6em;
		padding: 10px;
		width: 100%;
	}

/* ERRORS [END]
==========================
GENERAL CLASSES [ START ]

Classes for standard elements like body, h1, a, input, td, etc...
==========================
*/
	/* main */
		html {
			overflow: -moz-scrollbars-vertical;
		}

		body {
			background-color: #ffffff;
			color: #666666;
			font-family: 'EB Garamond', serif;
			font-size: 16px;
			margin: 0px;
		}

        .text2 {
			color: #666666;
        }

		td {
			color: #333333;
			font-family: 'EB Garamond', serif;
			font-size: 12px;
		}

		input,select,textarea,file {
			background-color:#F7F7F7;
			border-style: solid;
			border-color: #B0B0B0;
			border-width: 1px;
			color: #333333;
			font-family: 'EB Garamond', serif;
			font-size:1em;
			font-weight:normal;
		}

	/* headings and text */
		h1 {
			color: #333333;
			font-family: 'EB Garamond', serif;
			font-size: 1.8em;
			font-weight:bold;
		}
		h2 {
			color: #333333;
			font-family: 'EB Garamond', serif;
			font-size: 1.4em;
			font-weight:bold;
		}
		p {

		}

	/* links */
		A:link { color: #C3C3C3; text-decoration: none; }
		A:visited { color: #C3C3C3; text-decoration: none; }
		A:active { color: #C3C3C3; }
		A:hover { color: #333333; text-decoration: underline; }


	/* borders and lines */

    	.generalBorder {
        	border-color: #EEEEEE;
        }
        .generalLine {
        	border-color: #EEEEEE;
        	border-top-color: #EEEEEE;
        	border-bottom-color: #EEEEEE;
        	border-left-color: #EEEEEE;
        	border-right-color: #EEEEEE;
        }
    	.generalBox {
        	border: 1px solid #ECECEC;
        	background-color: #F8F8F8;
        }


	/* general text box */
    	.generalTextBox {
            line-height: 20px;
        }
        .generalTextBox li {
            display: list-item;
            list-style:inside;
        }
        .generalTextBox p {
            margin: 1.12em 0;
        }
        .generalTextBox h1 {
            margin: 1.12em 0;
        }
        .generalTextBox h2 {
            margin: 1.12em 0;
        }
        ..generalTextBox ul {
            margin: 1.12em 0;
            margin-left: 30px;
            margin-top: 0; margin-bottom: 0;
        }

        .generalTextBox li {
            display: list-item;
            list-style:inside;
        }
        .generalTextBox strong {
            font-weight: bolder
        }


	/* general text box */
    	.generalTextBoxNoVPadding {
			border: 1px solid #CCCCCC;
        	background-color: #FFFFFF;
            padding: 10px;
            padding-top: 0px;
            padding-bottom: 0px;
            line-height: 20px;
        }
        .generalTextBoxNoVPadding li {
            display: list-item;
            list-style:inside;
        }
        .generalTextBoxNoVPadding p {
            margin: 1.12em 0;
        }
        .generalTextBoxNoVPadding h1 {
            margin: 1.12em 0;
        }
        .generalTextBoxNoVPadding h2 {
            margin: 1.12em 0;
        }
        ..generalTextBoxNoVPadding ul {
            margin: 1.12em 0;
            margin-left: 30px;
            margin-top: 0; margin-bottom: 0;
        }

        .generalTextBoxNoVPadding li {
            display: list-item;
            list-style:inside;
        }
        .generalTextBoxNoVPadding strong {
            font-weight: bolder
        }

        div#websiteContent,
        .websiteContent {
        	margin: 0 auto;
        	width: 1160px;
        	display: block;
        }

/*
==========================
GENERAL CLASSES [ FINISH ]
==========================
*/


/*
==============================================
CODING STANDARD / FRAMEWORK CLASSES [ START ]

1) Classes that are part of our coding standard / framework like t1, hc, tc, c1 etc...
2) Also includes classes to make life easier, like float alignment classes
	- These can be used in the html with multiple class declarations, eg class="nameofmyclass textleft"
	- Do **NOT** use these in the layout of the web site (eg header, footer, etc). theyre more intended for content areas etc. The divClear class would be the only exception to this rule
==============================================
*/
	/* button classes
	================ */
		.b {
			/* Safari 4-5, Chrome 1-9 */
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#999999));

			/* Safari 5.1, Chrome 10+ */
			background: -webkit-linear-gradient(top, #999999, #cccccc);

			/* Firefox 3.6+ */
			background: -moz-linear-gradient(top, #999999, #cccccc);

			/* IE 10 */
			background: -ms-linear-gradient(top, #999999, #cccccc);

			/* Opera 11.10+ */
			background: -o-linear-gradient(top, #999999, #cccccc);

			BORDER: 1px solid #999999;
			COLOR: #ffffff;
			font-family: 'EB Garamond', serif;
			FONT-SIZE: 14px;
			FONT-WEIGHT: bold;
			padding-left: 7px;
			padding-right: 7px;
			padding-top: 3px;
			padding-bottom: 3px;
		}


	/* table classes (usually used for reports or displaying tables of information etc)
	================================================================================== */

		/* table */
			.t1
			{
				background-color: #E0E0E0;
			}

		/* header cell */
			.hc
			{
				background-color: #A07E3F;
				color: #ffffff;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}

		/* title cell */
			.tc
			{
				background-color: #E9E9E9;
				color: #4D4D4D;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}

		/* normal cells */
			.c1
			{
				background-color: #F2F2F2;
				color: #707070;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}
			.c2
			{
				background-color: #F2F2F2;
				color: #707070;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}
			.c3
			{
				background-color: #ffffff;
				color: #707070;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}

		/* highlighted cells (often used for total columns) */
			.hic1
			{
				background-color: #E3DAD5;
				color: #000000;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}
			.hic2
			{
				background-color: #FFE1A4;
				color: #000000;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}
			.hic3
			{
				background-color: #FFFFCC;
				color: #000000;
				font-family: 'EB Garamond', serif;
				font-size: 1em;
			}


	/* float alignment classes
	DO NOT CHANGE
	======================== */
		.floatleft {
			float: left;
		}
		.floatright {
			float: right;
		}
		.divClear {
			clear: both;
	}

	/* text alignment classes
	DO NOT CHANGE
	======================== */
		.textleft {
			text-align: left;
		}
		.textright {
			text-align: right;
		}
		.textcenter {
			text-align: center;
		}
		.textjustify {
			text-align: justify;
		}

	/* text styling
	DO NOT CHANGE
	=============== */
		.bold {
			font-weight: bold;
		}
		.underline {
			text-decoration: underline;
		}

/*
==============================================
CODING STANDARD / FRAMEWORK CLASSES [ FINISH ]
==============================================
*/



/*
=================
HEADER [ START ]

Classes that are for the header which is on every page (eg the stuff in inc-htmltop
=================
*/

header {
	margin:25px 0 30px;
}


div#logo {
	color:#999999;
	cursor:pointer;
	display:inline-block;
	font-size:30px;
	font-smooth:always;
	letter-spacing:10.2px;
	text-transform:uppercase;
	vertical-align:bottom;
	margin-top: 5px;
}

div#logo a:link { color: #999999; text-decoration: none; }
div#logo a:visited { color: #999999; text-decoration: none; }
div#logo a:active { color: #999999; }
div#logo a:hover { color: #999999; text-decoration: none; }

div#logoSub {
	color:#5E7EBB;
	display:inline-block;
	font-size:20px;
	font-weight:400;
	vertical-align:bottom;
}

header nav {
	margin-top:15px;
	border-top:solid 2px #FAFAFA;
	border-bottom:solid 1px #FAFAFA;
}

header nav ul {
	padding:10px 0;
}


header nav ul li {
	color:#C3C3C3;
	display:inline-block;
	font-size:15px;
	letter-spacing:4px;
	margin: 0 0 0 5.1%;
	text-transform:uppercase;
	vertical-align:middle;
}

header nav ul li img {
	cursor:pointer;
	margin-top:2px;
}


header nav ul li:first-child {
	margin: 0 0 0 0.7%;
}

header nav ul li:last-child {
	margin:0 0 0 5.5%;
}



/*
=================
HEADER [ FINISH ]
=================
*/



/*
=================
MAIN BODY [ START ]

- Classes that are for the general layout of the site (if applicable)
- Do NOT include stuff that is specific to a particular page (this should go in pagename.css)
=================
*/



/*
=================
MAIN BODY [ FINISH ]
=================
*/



/*
=================
FOOTER [ START ]

Classes that are for the footer which is on every page (eg the stuff in inc-htmlbottom)
=================
*/

footer {
	color:#CCCCCC;
	display:block;
	font-size:12px;
	margin:55px 0 20px;
	text-align:right;
	width:100%;
}

footer#footerAlt {
	font-size:32px;
	font-weight:bold;
	letter-spacing:10px;
	margin:135px 0 0;
	text-align:center;
	text-transform:uppercase;
}

div#footerTitle {
	color:#666666;
	font-weight:400;
}

footer#footerAlt img {
	margin-top:60px;
}

/*
=================
FOOTER [ FINISH ]
=================
*/



/*
=================
CAT LIST BOX [ START ]
=================
*/

.CatListBox {
border: 1px solid #ECECEC;
background-color: #FBFBFB;
}

/*
=================
CAT LIST BOX [ FINISH ]
=================
*/

div#logoWrapper #logo {

	margin-left: 1%;

}

div#logoWrapper #logoSub {

	margin-left: 1%;

}

@media screen and (max-width:1160px){
	div.websiteContent {
		width:100%;
	}

	div#logoWrapper {
		margin-left:10px;
	}



	header nav ul li {
		line-height:30px;
	}

	header nav ul {
		text-align:center;
	}

	header nav ul li img {
		cursor:pointer;
	}

	header nav ul li:last-child {
		display:block;
		margin-top:15px;
	}
}

@media screen and (max-width:1000px){

	div#logoWrapper {
		width:100%;
		margin:0;
		text-align:center;
	}

	footer#footerAlt {
		margin:11% 0 0;
	}
}

@media screen and (max-width:630px){
	footer {
		line-height:20px;
		text-align:center;
	}
}