/* live css */

/* ## LAYOUT ######## */

@font-face {
    font-family: 'LatoRegular';
    src: url('fonts/lato-regular-webfont.eot?#iefix') format('embedded-opentype');
	src: local('☺'), 
         url('fonts/lato-regular-webfont.woff') format('woff'),
         url('fonts/lato-regular-webfont.ttf') format('truetype'),
         url('fonts/lato-regular-webfont.svg#LatoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body { padding: 0; margin: 0; font-family: LatoRegular, Arial, Helvetica, sans-serif; font-size: 0.9em; }
div, form { padding: 0; margin: 0; border: 0; }
a { text-decoration: none; margin: 0; padding: 0; background: none; outline: none; }
a:hover { text-decoration: underline; outline: none; }

html, body, div { border:none; }

#page { width: 840px; margin: 33px auto; }

#header, #menu, #content, #footer, #admin { clear: both; float: left; width: 840px; }
#header { height: 94px; }
#header #logo, #header #banner { float: left; }
#header #logo a { display: block; height: 94px; width: 280px; }
#header #logo a h1 { display: none; }

#menu ul, #menu li { list-style-type: none; padding: 0; margin: 0; }
#menu li { float: left; }
#menu a { width: 140px; display: block; line-height: 2.8em; text-decoration: none; text-align: center; margin: 0 0 10px 0; font-weight: normal; font-size: 75%; }

#content { height: 477px; overflow: hidden; clear: both; float: left; }
#content .htmlcontent {}

#pagepass { width: 840px; height: 477px; overflow: auto; padding: 150px 200px; }
#pagepass label { display: block; }
#pagepass label input { display: block; margin-left: 30px; margin-top: 5px; }
#footer {}
#footer ul, #footer li { list-style-type: none; padding: 0; margin: 0; }
#footer li { float: left; }
#footer a { display: block; line-height: 1.2em; font-size: 0.6em; text-decoration: none; text-align: left; margin: 8px 0 0 0; padding: 0 30px 0 1px; }

#admin { margin-top: 10px; width: 840px; }
#admin ul, #admin li { list-style-type: none; padding: 0; margin: 0; }
#admin li { float: left; }
#admin a { display: block; width: 140px; line-height: 2em; text-decoration: none; text-align: center; margin: 0 0 10px 0; font-weight: bold; }
.autowidth { width: auto; }


/* ## COLOURING ######## */

body { color: #FFF; background-color: #000; }
a { background: none; }
#header #logo a { background: url(../_images/ThorpCreative_Logo_2010.jpg) no-repeat left center; }
#menu a {
	color: #CCC;
	background: #333 url(../_images/at_c_menu_bg.gif) repeat-x center top;
}
#menu a:hover { background: #000; color: #666; }
#pagepass { background-color: #7E9B3C; }
#footer a { color: #666; }
#footer a:hover { background-color: #000; color: #CCC; }

html, body, div {
	scrollbar-arrow-color: #999;
	scrollbar-track-color: #666;
	scrollbar-shadow-color: #333;
	scrollbar-face-color: #333;
	scrollbar-highlight-color: #333;
	scrollbar-darkshadow-color: #333;
	scrollbar-3dlight-color: #333;
}

#content .text {
	background-color: #7E9B3C;
	scrollbar-arrow-color: #B7CE82;
	scrollbar-track-color: #7E9B3C;
	scrollbar-shadow-color: #586C2B;
	scrollbar-face-color: #586C2B;
	scrollbar-highlight-color: #586C2B;
	scrollbar-darkshadow-color: #586C2B;
	scrollbar-3dlight-color: #586C2B;
} 

#admin a { color: #333; background-color: #CCC; }
#admin a:hover { background-color: #999; color: #000; }