/*
	CSS FOR		Early Years Pre-School
	AUTHOR:		Ali Springall (ali@springall.me) for BinaryFold4 (www.binaryfold4.com)
	CREATED:	02/05/2010
*/




/* GLOBAL STYLES
----------------------------------------------------------------------------------------------------------------------------- */

body				{ background: #fff url(../images/body_bg.jpg) repeat-x 0 0; font: normal 80% 'Lucida Grande', 'Lucida Sans Unicode', arial, verdana, sans-serif; text-align: center; color: #333; padding: 0; margin: 0; }


hr					{ height: 1px; background: #e8e8e8; color: #e8e8e8; border: 0; margin: 5px 0; }
form, table			{ background: transparent; font-size: 1.0em; color: #333; }

.tablestyle			{ border-collapse: collapse; }
.tablestyle td, 
.tablestyle th		{ vertical-align: top; padding: 5px 5px 5px 0; }
.tableborder td, 
.tableborder th		{ vertical-align: top; padding: 5px; border: 1px solid #e8e8e8; }

.clear				{ height: 0; clear: both; font-size: 0.1em; line-height: 0.1em; padding: 0; margin: 0; }
.right				{ float: right; }
.left				{ float: left; }

.widthwrapper		{ width: 100%; }
.padding			{ padding: 20px; }

.no-show			{ display: none; }




/* HEADINGS
----------------------------------------------------------------------------------------------------------------------------- */

h1					{ font-weight: bold; font-size: 1.6em; color: #0094C7; padding: 0 5px 10px; border-bottom: 4px solid #e0e0e0; margin: 20px 0 10px; } 
h2					{ font-weight: normal; font-size: 1.3em; color: #0094C7;  padding: 0; margin: 10px 0; }
h3					{  }



/* TEXT
----------------------------------------------------------------------------------------------------------------------------- */

p 					{ font-size: 1.0em; line-height: 1.5em; color: #333; padding: 0 5px; margin: 0 0 15px; }
li					{ font-size: 1.0em; line-height: 1.5em; color: #333; margin: 0 0 5px; }

.smalltext			{ font-size: 0.9em; }
.largetext			{ font-size: 1.4em; }



/* LINKS
----------------------------------------------------------------------------------------------------------------------------- */


a:link,				
a:visited			{ color: #0094C7; text-decoration: none; }
a:hover,			
a:active,			
a:focus				{ color: #ED6E01; text-decoration: underline; }



/* IMAGES
----------------------------------------------------------------------------------------------------------------------------- */

img					{ border: 0; }


/* FORMS
----------------------------------------------------------------------------------------------------------------------------- */

form ul.form						{ padding: 0; margin: 0 0 0 50px; }
form ul.form li.formrow				{ list-style-type: none; vertical-align: middle; padding: 0; margin: 0 0 3px; }
form ul.form li.formrow	label		{ width: 80px; float: left; font-size: 0.85em; vertical-align: middle; margin-right: 10px; }
form ul.form li.formrow	.noleft		{ float: none; vertical-align: middle; }
form ul.form li.formrow .textbox	{ width: 300px; }
form ul.form li.formrow .textarea	{ width: 275px; }
form ul.form li.formrow .button		{ width: 57px; height: 20px; font-size: 0.9em; border: 0; margin-top: 25px; }


/* LAYOUT
----------------------------------------------------------------------------------------------------------------------------- */

#container			{ width: 100%; min-height: 600px; background: transparent url(../images/container_bg.jpg) no-repeat center 165px; text-align: center; margin: 0 auto; }
#home #container	{ background: none; }


#contentwrapper		{ width: 890px; text-align: left; padding: 0; margin: 30px auto; }

#content			{ width: 550px; float: left; padding-bottom: 40px; }



/* HEADER
----------------------------------------------------------------------------------------------------------------------------- */

#header				{ width: 890px; height: 165px; text-align: left; margin: 0 auto; }

#header #sitelogo	{ float: left; margin: 30px 0 0 0; }



/* NAVIGATION
----------------------------------------------------------------------------------------------------------------------------- */

ul#mainnav					{ float: right; padding: 70px 0 0 0; margin: 0; }

ul#mainnav li				{ float: left; font-weight: bold; font-size: 1.3em; line-height: 1.0em; color: #ED6E01; list-style-type: none; padding: 0 20px; border-right: 1px solid #ccc; margin: 0; }
ul#mainnav li.last			{ border-right: 0; }

ul#mainnav li a,
ul#mainnav li a:visited		{ float: left; text-decoration: none; color: #ED6E01; }
ul#mainnav li a:hover,
ul#mainnav li a:active		{ color: #000; }

ul#mainnav li.selected a,
ul#mainnav li.selected a:visited	{ text-decoration: none; color: #000; }
ul#mainnav li.selected a:hover,
ul#mainnav li.selected a:active		{ color: #ED6E01; }


/* COLUMNS
----------------------------------------------------------------------------------------------------------------------------- */

.halfcolwrapper				{  }
.halfcol					{ width: 400px; height: 230px; position: relative; float: left; margin: 0 89px 35px 0; }

.halfcol h1					{ font-weight: bold; font-size: 2.2em; color: #333; padding: 0; border: 0; margin: 0 0 15px; }
.halfcol p					{ line-height: 1.8em; color: #0094C7; }

.halfcol #homeimg			{ position: relative; right: 0; top: -90px; }

/* --- */

.threecolwrapper			{ background: transparent url(../images/col_bg.gif) repeat-y top center; }
.threecol					{ width: 270px; min-height: 100px; float: left; padding-bottom: 60px; margin: 0 40px 0 0; }

.threecol .imgborder		{ width: 264px; height: 100px; overflow: hidden; background-color: #fff; padding: 2px; border: 1px solid #e5e5e5; border-bottom: 2px solid #ccc; }

.threecol .imgborder	a,
.threecol .imgborder	a:visited	{ display: block; background-color: #f7b611; padding-bottom: 7px; }
.threecol .imgborder	a:hover,
.threecol .imgborder	a:active	{ background-color: #fe7c09;}

#col2 .imgborder a,
#col2 .imgborder a:visited	{ background-color: #fe7c09;}
#col2 .imgborder a:hover,
#col2 .imgborder a:active	{ background-color: #abcb17;}

#col3 .imgborder a,
#col3 .imgborder a:visited	{ background-color: #abcb17;}
#col3 .imgborder a:hover,
#col3 .imgborder a:active	{ background-color: #f7b611;}

.threecol .imgborder img	{ display: block; border-bottom: 1px solid #fff; }

.threecol h2				{ background: transparent url(../images/arrow.jpg) no-repeat 2px 6px; font-weight: bold; padding-left: 30px; }
.threecol p					{ font-size: 0.9em; }

/* --- */

.last						{ margin-right: 0!important; }


/* SIDECOL
----------------------------------------------------------------------------------------------------------------------------- */

#sidecol				{ width: 317px; float: right; padding-bottom: 80px; margin: 0; }

#sidecol .sidecolimg	{ margin-bottom: 10px; }

#sidecol #contact		{ border-top: 4px solid #3e97aa; border-bottom: 1px solid #3e97aa;  }
#sidecol #contact p		{ font-size: 0.85em; }



/* FOOTER
----------------------------------------------------------------------------------------------------------------------------- */

#footer					{ width: 850px; background-color: #0094C7; text-align: left; padding: 12px 20px; margin: 15px auto 20px; }

#footer	ul#footnav 		{ padding: 0; margin: 0; }
#footer	ul#footnav li	{ display: inline; font-size: 0.85em; line-height: 1.0em; color: #fff; list-style-type: none; padding: 0 15px 0 0; margin: 0; }

#footer	p				{ font-size: 0.85em; line-height: 1.0em; color: #fff; padding: 0; margin: -13px 0 0; }

#footer	a,
#footer	a:visited		{ text-decoration: none; color: #fff; }
#footer	a:hover,
#footer	a:active		{ text-decoration: underline; color: #fff; }