/*=======================================================
softplayzone.co.uk CSS
Created by Rich Hinchcliffe
http://www.monkeyfight.co.uk
=======================================================*/

/*START override default styles*/
body {
	font:0.75em Arial, Helvetica, Sans-Serif;
	color:#573643;
	background:#FFFCC9 url(../images/shared/bgtile.png) repeat-x;
	padding:5px 0px 20px 0px;
	margin:0px;
	text-align:center;
}
	
h1, h2, h3, h4, h5, h6 {
	/*font:bold 1.0em Arial, Helvetica, Sans-Serif;*/
	margin-bottom:0px;
	margin-top:0px;
	color:#00b9f2;
}
/*h1 {font-size:1.3em}
h2 {font-size:0.9em}
h3 {font-size:0.9em}
h4 {font-size:1.1em}
h5 {font-size:1.0em}
h6 {font-size:1.0em}*/

a {color:#80a519; text-decoration:underline}
a:hover,a:active,a:focus {text-decoration:none; background:#8AC63C;color:#FFF!important;}

a img {
	display:block;
	border:0px;
}

p {margin-top:0px;margin-bottom:10px}

form {margin:0px}
fieldset {border:0px}
label {cursor:pointer}
/*END override default styles*/



/*miscellaneous styles used throughout*/
.hide, .print {display:none;}
.floatLeft{float:left}
.floatRight {float:right}
.larger {
	font-weight:bold;
	font-size:1.4em;
}
.intro {
	font:bold 1.0em Arial, Helvetica, sans-serif;
	color:#95838a;
	padding-bottom:10px;
}
#strapline {
	position:absolute;
	top:35px;
	left:50px;
	width:436px;
	height:50px;
	background:url(../images/shared/strapline.png) no-repeat;
}
.phonecolour {
	color:#4F3D44;
}


/*bit of css to fix the clearing problem with divs containing floats - explained here http://www.positioniseverything.net/easyclearing.html 
might cause some problems? Keep an eye on it, seems to work well though */
.floatfix:after,.item:after {
	content:"."; 
	display:block; 
	height:0px; 
	clear:both; 
	visibility:hidden;}
.floatfix,.item {display:inline-table;}
/* Hides from IE-mac \*/
* html .floatfix,* html .item {height:1%;}
.floatfix,.item {display:block;}
/* End hide from IE-mac */




a#homelink {
	position:absolute;
	border:none;
	top:20px;
	right:18px;
	display:block;
}





/*common styles for main containing elements*/
#header,#container,#footer {
	width:740px;
	margin:auto;
	text-align:left;
	position:relative;
}


/*extra bit of background for the puzzle shapes sticking out.
Done like this so page resizes to 800x600 properly without scrollbars*/
#shapes {
	background:transparent url(../images/shared/bgtop.png) no-repeat center;
	height:204px;
}
#shapes h1 {
	display:none;
}

/*styles for the main banner/header*/
#header {
	background:#FFF9AB url("../images/shared/ban_top.jpg") no-repeat;
	height:155px;
	margin-top:-168px;
}


/*navigation menu styles*/
#nav {
	position:absolute;
	top:100px;
	left:40px;
	margin:0px;
	padding:0px;
	list-style-type:none;
}
#nav li {
	float:left;
	margin:0px 5px 0px 0px;
}
#nav span {
	display:none;
}
#nav li a {
	float:left;
	display:block;
	height:47px;
}
a#navhome {background:#F27FA2 url(../images/shared/nav_home.png) no-repeat;width:78px}
a#navaboutus {background:#4DC2C3 url(../images/shared/nav_aboutus.png) no-repeat;width:91px}
a#navproducts {background:#B3D949 url(../images/shared/nav_products.png) no-repeat;width:94px}
a#navcontact {background:#FFEA1D url(../images/shared/nav_contactus.png) no-repeat;width:98px}
a#navdelivery {background:#f9af51 url(../images/shared/nav_deliveryinfo.png) no-repeat;width:115px}

#active a#navhome {background: url(../images/shared/nav_home_active.png) no-repeat}
#active a#navaboutus {background: url(../images/shared/nav_aboutus_active.png) no-repeat}
#active a#navproducts {background: url(../images/shared/nav_products_active.png) no-repeat}
#active a#navcontact {background: url(../images/shared/nav_contactus_active.png) no-repeat}
#active a#navdelivery {background: url(../images/shared/nav_deliveryinfo_active.png) no-repeat}

#nav li a:hover,#nav li a:focus,#nav li a:active {
	background-color:#FFF;
}

/*#active a {cursor:default}*/





/*main container styles, including column layouts*/
#container {
	background:#FFF url(../images/shared/edges.png) repeat-y;
	padding-bottom:20px;
}
#onecol {
	float:left;
	width:665px;
	margin:10px 0px 0px 45px;
}
* html #onecol {
	margin-left:22px;
}
#leftcol {
	float:left;
	width:430px;
	margin:10px 0px 0px 45px;
}
* html #leftcol {
	margin-left:22px;
}
#rightcol {
	float:right;
	width:200px;
	margin:10px 30px 0px 0px;
}
* html #rightcol {
	margin-right:15px;
}
#leftcol h2 {
	margin:30px 0px 5px 0px;
	color:#8dc43e;
}




/*styles for an item - a small container tile */
.item {
	border-top:1px solid #FFEA1D;
	padding:40px 0px 15px 0px;
	margin:0px;
}
.item img {
	float:left;
}
.item h2,.item p {
	width:230px;
	float:right;
	clear:right;
}
.item h2 {
	font:bold 1.5em Arial, Helvetica, sans-serif;
	color:#ef59a1;
	margin:0px 0px 5px 0px!important;
}
.item h2 a {
	color:#ef59a1;
}
.item h2 a:hover,.item h2 a:active,.item h2 a:focus {
	background:#ef59a1;
}
.actions {
	font-weight:bold;
}
.pricesmall {
	color:#95838a;
	font:bold 1.2em Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
}
a.moreinfo {

}
a.add {
	padding-left:23px;
	background:url(../images/shared/icon_basket.gif) no-repeat;
}
a.add:hover,a.add:active,a.add:focus {
	background:#8DC43E url(../images/shared/icon_basket_over.gif) no-repeat;
}





/*styles for the tinted box floating on the right, containg order info etc*/
.rightbox {
	font-size:0.9em;
	background:#FFFEE8;
	border:1px solid #FFEA1D;
	padding:12px;
	margin-bottom:20px;
}
.rightbox h3 {
	font-size:1.0em;
	color:#00b9f2;
}








/*styles for applying graphic titles to headers etc*/
.pagetitle {
	margin:0px 0px 13px 0px;
	background-repeat:no-repeat!important;
}
.pagetitle span,.title span {
	display:none;
}
.welcome {background: url(../images/headers/pagetitle_welcome.png);height:29px}
.aboutus {background: url(../images/headers/pagetitle_aboutUs.png);height:29px}
.products {background: url(../images/headers/pagetitle_products.png);height:29px}
.contactus {background: url(../images/headers/pagetitle_contactus.png);height:29px}
.privacypolicy {background: url(../images/headers/pagetitle_privacy.png);height:29px}
.deliveryinfo {background: url(../images/headers/pagetitle_delivery.png);height:29px}


.producttitle {
	font:bold 2.2em tahoma, Helvetica, sans-serif;
	color:#8dc43e;
}


.giantplaymat {background: url(../images/headers/pagetitle_giantplaymat.png);height:29px}
.devmat {background: url(../images/headers/pagetitle_devPlayMat.png);height:29px}
.mousemats {background: url(../images/headers/pagetitle_mouseMats.png);height:29px}


.title {
	margin:0px 0px 15px 0px;
	background-repeat:no-repeat!important;
	padding-bottom:8px;
	border-bottom:1px solid #FFEA1D;
}
.ordering {
	background: url(../images/headers/title_placingyourorder.png);
	height:21px;
}
.ordering2 {
	background: url(../images/headers/title_otherwaystoorder.png);
	height:21px;
}



/*styles for the product pages*/
.mainimage {
	border:0px;
	margin:20px 0px 25px 0px;
}
/*.price {
	color:#f8907c;
	font:bold 4.0em Arial, Helvetica, sans-serif;
	padding:0px;
	margin:0px;
	text-align:center;
}*/
.price {
	text-align:center;
	color:#95838a;
	font:bold 1.5em Arial, Helvetica, sans-serif;
}
.price span {
	color:#f8907c;
	font:bold 3.0em Arial, Helvetica, sans-serif;
}






/*shop buttons*/
#shopbuttons {
	margin:0px 0px 20px 0px;
	padding:0px;
	list-style:none;
}
#shopbuttons a {
	display:block;
	height:56px;
	margin:0px;
}

#shopbuttons a span {
	display:none
}

a#addtobasket {background:#B7E15D url(../images/shared/btn_addtobasket.png) no-repeat}
a#checkout {background:#FFEF00 url(../images/shared/btn_checkout.png) no-repeat}
a#viewbasket {background:#ff558d url(../images/shared/btn_viewbasket.png) no-repeat}


a#addtobasket:hover,a#addtobasket:active,a#addtobasket:focus {background-color:#cdff62}
a#checkout:hover,a#checkout:active,a#checkout:focus {background-color:#fffe88}
a#viewbasket:hover,a#viewbasket:active,a#viewbasket:focus {background-color:#ff81ab}


#shopbuttons li {
	margin-bottom:10px;
}




/*baby show button*/
a#babyshow {
	display:block;
	width:200px;
	height:88px;
	background:#fbd5de url(../images/shared/btn_babyshow.png) no-repeat
}
a#babyshow:hover,a#babyshow:active,a#babyshow:focus {
	background-color:#ffeff3;
}
a#babyshow span {
	display:none;
}




/*styles for the footer*/
#footer {
	background:  url(../images/shared/footer.png) no-repeat;
	height:78px;
	color:#71515E;
	text-align:center;
	font-size:0.9em;
	padding-top:30px;
}
#footer a {
	color:#71515E;
}
#footer a:hover,#footer a:active,#footer a:focus {
	background:#71515E;
}
#footer p {
	margin:0px;
}