/* Main FunMats.co.uk CSS Document */
 /* Last Updated 17/09/09 by Ben Hayes */
 /* CSS Valid 17/09/09 */
 
 /* ------------------------------------------------ */
 /* -- Setup Page Layout --------------------------- */
 /* ------------------------------------------------ */
	
 body { 
	background: url(_images/bgstripe3.gif) repeat fixed; 
	color: #000000; 
	font: 12pt/13pt Arial, sans-serif; 
	text-align: center;
	}
 
 #page {
	margin: 0px auto 0px;
	width: 984px;
	border-top: 1px solid #1B1669;
	border-right: 1px solid #1B1669;
	border-bottom: 1px solid #1B1669;
	border-left: 1px solid #1B1669;
	background: #CCCCFF ;
	background: url(_images/pagebg.gif) repeat ; 
	text-align: left;
	position: relative;
	overflow: visible;
	font-size: 11pt;	
	}
 
 #content {
	margin: 0px 0px 0px 188px;
	padding: 0px 3% 0px 3%;
	overflow: hidden;
	position: relative;
	/* min-height: 820px;*/
	text-align: left;
	top: 0px;

	}

 /* ------------------------------------------------
    -- Page Common Formats -------------------------
	------------------------------------------------ */	

 * {
   	margin: 0px; 
	padding: 0px; 
 	}

	a:link { color: #EE8822 }
	a:visited { color: #000000 }
	a:active { color: #0033FF }

 body {
  	font-family: Arial, Helvetica, sans-serif ;
 	}
	
/* NB if H1 height or margin change alter nbbox-content too*/
 h1 {  
	text-align: center;
	margin: 22px auto;
	line-height: 105%;
	font-size: 200%;
	}

 h2 { 
	margin: 1em auto 0.5em;
	line-height: 100%;
	font-size: 150%;	
	}

 h3,
 table caption { 
	margin: 1em auto 0.5em;
	padding: 0;
	font-size: 125%;	
	}

 h1#top { 
	margin: 0.75em auto;
    display:block;
    position:relative;
    width:600px;
	height:50px;
    overflow:hidden;
	color: #FF9933;
	background-color: #336699;
	line-height: 50px;
    }
	
 h1#top span {
    display:block;
    position:absolute;
	left:0;
	top:0;
	z-index:1;
    width:600px;
	height:50px;
    margin:0;
	padding:0;
    }

 p {
	margin: .75em 0em;
	}

img.leften {
	display: block;
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;	
	}
	
img.righten {
	display: block;
	float: right;
	margin-left: 1em;
	margin-bottom: 1em;		
	}
	

td {
	padding-top: 2px;
	padding-bottom: 2px;
	}
	
th {
	font-weight: bold; 
	text-align: center; 
	padding-top: 0px;
	padding-bottom: 0.5em;	
	}

table.head {
	font-weight: bold; 
	text-align: left; 	
	}

 span.brand {
	font-weight: bold;
	}
	
 span.usp {
	font-weight: bold;
	font-style: italic;	
	}
	
 span.nb-vemph {
	font-weight: bold;
	font-style: italic;	
	}	

 span.nb-emph {
	font-style: italic;
	}
	
 span.hlight {
	font-style: italic;
	}
	
 span.little-note {
	font-size: 85%;
	}		

 p.bigger {
 	font-size: 105%;
	line-height: 110%;
 	}

 sup {
 	font-size: 65%;
 	}
 
 hr.divider { border: 0; width: 90%; color: #666699; background-color: #666699; height: 2px }
 
 
 /* ------------------------------------------------ */
 /* -- Common fixes -------------------------------- */
 /* ------------------------------------------------ */
  
 div.hack {
	width: 100%;
	position: relative;
	padding: 0px;
	margin: 0px;
	text-align: center;
	}
	
 div.clearing {
 	display: block;
	overflow: hidden;
	height: 1px;
	width: 100%;
	clear: both;
	}
	
 /* ------------------------------------------------ */
 /* -- Infobox formats ----------------------------- */
 /* ------------------------------------------------ */
	
 div.nbbox-placeholder,
 div.nbbox-content {
 	display: block;
	margin-left: 1em;
	margin-bottom: 1em;
 	}
	
 div.nbbox-placeholder {
	float: right;
	width: 250px;	
	padding: 10px;
 	}	

 div.nbbox-content {
 	position: absolute;
	width: 272px;	
	margin-right: 3%;
	top: 94px; /* linked to H1 height and margin */
	right: 0px;
	background: url(_images/pagebg.gif) repeat ; 
 	font-size: 80%;
 	}
	
 div.nbbox-item {
	border: 1px solid #1B1669;
	background: #7DD;
	padding: 10px;
	margin-bottom : 10px;
	}

 div.nbbox-content .nbbox-head {
	font-size: 120%;
	font-weight: bold;
	text-transform: capitalize;
 	}

 div.nbbox-content p {
	margin-top: 0.5em;
	margin-bottom: 0em;
 	}		
	

 /* ------------------------------------------------
    -- Link Bar Layout & Formating -----------------
	------------------------------------------------ */	
	
 #links  { 
 	position: absolute;
	display: block;
	left: -1px;
	top: -1px;
	width: 185px; 
	border-top: 1px #1B1669 solid ;
	border-left: 1px #1B1669 solid ;
	border-right: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;
	background: url(_images/lion-cutout.gif) no-repeat; 
	background-color: #7DD;  /* old 9999CC */
	overflow: hidden;
	text-align: center;
	}

 ul#linksthemselves {
	list-style-type: none;
	width: 185px;
	display: block;
	overflow: hidden;
	font-size: 17px;
	font-weight: bold;
	line-height: 15px;
	}

 ul#linksthemselves li { 
	width: 185px;
	display: block;
	overflow: hidden;
	}

 ul#linksthemselves li a {
	padding-top: 5px;
	padding-bottom: 5px;	
	display: block;
	width: 185px;
	text-decoration: none;
	overflow: hidden;
	}
	
	
 ul#linksthemselves li a:link { color: #000000 }
 ul#linksthemselves li a:visited { color: #000000 }
 ul#linksthemselves li a:active { color: #FF9922 }	

 ul#linksthemselves li a:hover	{
	background-color: #fff;
	}

 ul#linksthemselves li li { 
	text-align: left;
	width: 185px;
	display: none;
	}

 ul#linksthemselves li li a { 
	padding-left: 10px;
	width: 175px;
	font-size: 90%;	
	}
	
 ul#linksthemselves li li li { 
	font-style: italic;	
	}

 ul#linksthemselves li li li a { 
	padding-left: 20px;
	width: 165px;
	}	

 /* ------------------------------------------------
    -- Highlight Current Page ----------------------
	------------------------------------------------ */
	
 #home #page #links #linksthemselves .home a,
 #proj #page #links #linksthemselves .proj a, 
 #how2 #page #links #linksthemselves .how2 a,
 #prod #page #links #linksthemselves .prod a,
 #prom #page #links #linksthemselves .prom a,
 #faq1 #page #links #linksthemselves .faq1 a,
 #fami #page #links #linksthemselves .fami a,
 #fprod #page #links #linksthemselves .fprod a, 
 #fcon #page #links #linksthemselves .fcon a,  
 #othe #page #links #linksthemselves a#other,
 #mugs #page #links #linksthemselves .mugs a,  
 #bear #page #links #linksthemselves .bear a, 
 #mons #page #links #linksthemselves .mons a,
 #mhow2 #page #links #linksthemselves .mhow2 a,    
 #mprod #page #links #linksthemselves .mprod a,  
 #wall #page #links #linksthemselves .wall a, 
 #leav #page #links #linksthemselves .leav a,
 #cres #page #links #linksthemselves .cres a,    
 #part #page #links #linksthemselves .part a, 
 #insp #page #links #linksthemselves .insp a,
 #reso #page #links #linksthemselves .reso a, 
 #down #page #links #linksthemselves .down a,
 #comm #page #links #linksthemselves .comm a,
 #abou #page #links #linksthemselves .abou a,
 #idea #page #links #linksthemselves .idea a,
 #team #page #links #linksthemselves .team a, 
 #cont #page #links #linksthemselves .cont a,
 #logn #page #links #linksthemselves a#login,
 #disp #page #links #linksthemselves .disp a, 
 #hint #page #links #linksthemselves .hint a,
 #help #page #links #linksthemselves .help a, 
 #odown #page #links #linksthemselves .odown a,
 #deef #page #links #linksthemselves .deef a, 
 #wedd #page #links #linksthemselves .wedd a, 
 #faq2 #page #links #linksthemselves .faq2 a
  {
	background: url(_images/overhere.gif) no-repeat right center; 
 	background-color: #ffffff;	
	cursor: default;		
 	}

 /* ------------------------------------------------
    -- Formats for menu sub 'set' ------------------
	------------------------------------------------ */

 .setabo #page #links #linksthemselves .setabo,
 .setfam #page #links #linksthemselves .setfam,
 .setoth #page #links #linksthemselves .setoth,
 .setorg #page #links #linksthemselves .setorg,
 .setpro #page #links #linksthemselves .setpro {
	background: url(_images/back-set2.gif) no-repeat center top; 
	background-color: #666699;
	border-top: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;
	}
	
 .setabo #page #links #linksthemselves .setabo a.lvtop,
 .setfam #page #links #linksthemselves .setfam a.lvtop,
 .setoth #page #links #linksthemselves .setoth a.lvtop, 
 .setorg #page #links #linksthemselves .setorg a.lvtop, 
 .setpro #page #links #linksthemselves .setpro a.lvtop {
	cursor: default;
	}	

 .setabo #page #links #linksthemselves .setabo a.lvtop:hover,
 .setoth #page #links #linksthemselves .setoth a.lvtop:hover, 
 .setfam #page #links #linksthemselves .setfam a.lvtop:hover,
 .setorg #page #links #linksthemselves .setorg a.lvtop:hover, 
 .setpro #page #links #linksthemselves .setpro a.lvtop:hover {
	background-color: transparent;
	}

 .setabo #page #links #linksthemselves .setabo li.lv2,
 .setoth #page #links #linksthemselves .setoth li.lv2, 
 .setfam #page #links #linksthemselves .setfam li.lv2,
 .setorg #page #links #linksthemselves .setorg li.lv2, 	
 .setpro #page #links #linksthemselves .setpro li.lv2 {
	display: block;
	}

 /* -------------------------------------------------
    -- Special Formats For Monsters Sub 'setset' ----
	------------------------------------------------- */

 .setsetmon #page #links #linksthemselves .setsetmon {
	border-top: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;
 	}
 
 .setsetmon #page #links #linksthemselves .setsetmon a.lv2{
	cursor: default;
	 }
 
 .setsetmon #page #links #linksthemselves .setsetmon a.lv2:hover {
	background-color: transparent;
	}
	
 .setsetmon #page #links #linksthemselves .setsetmon li.lv3{
	display: block;
 	}
 
 /* -------------------------------------------------
    -- Formats to grey out org subitems  ------------
	------------------------------------------------- */ 
 
 .lgnot #page #links #linksthemselves .setorg a.lv2:link,
 .lgnot #page #links #linksthemselves .setorg a.lv2:visited,
 .lgnot #page #links #linksthemselves .setorg a.lv2:active  {
 	color: #666666;
	}

 /* -------------------------------------------------
    -- Format Other Menu Sections -------------------
	------------------------------------------------- */ 	

 #links #cthrou {
	display: block;
 	width: 185px;
	height: 130px;
 	}
	
 #page #links #linksthemselves .wedd a  {
	background: url(_images/jub-mi-bg.jpg) no-repeat right center; 
 	}
	
div#facebook {
	border-top: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;	
	margin-top: 10px;
	height: 90px;
	background-color: #FFCC66;
	}

 span.ncpta {
 	font-size: 12pt;
	line-height: 105%;
	margin-top: 10px;
  	margin-left: 0px;
  	margin-right: 0px;
  	margin-bottom: 0px;
	display: block;
	border-top: 1px #1B1669 solid ;
	padding-top: 7px;
	padding-bottom: 7px;	
	background-color: #FFF;
  	}

 span.lc {
	margin-top: 10px;
  	margin-left: 0px;
  	margin-right: 0px;
  	margin-bottom: 0px;
	display: block;
	border-top: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;	
	padding-top: 7px;
	padding-bottom: 7px;	
	background-color: #FFFFFF;
  	}
	
 img.leukimg {
	border: 0;
 	}

 li#contact {
 	position: relative;
	margin-top: 10px;
  	margin-left: 0px;
  	margin-right: 0px;
  	margin-bottom: 0px;
	height: 111px;
	}
	
 li#contact span{
 	position: absolute;
	top: 0px;
	left: 0px;
	background: #7DD url(_images/FIP.gif) no-repeat center top;
	height: 111px;
	width: 185px;
	cursor: pointer;
	}
	
 #cont li#contact{
 	display: none;
 	}	

 ul#linksthemselves li#contact a {
	font-size: 110%;
	padding-top: 15px;
	padding-bottom: 15px;
	line-height: 23px;
	}
	
 /*li#logn {
	border-top: 1px #1B1669 solid ;
	border-bottom: 1px #1B1669 solid ;	
	margin-top: 10px;
  	margin-left: 0px;
  	margin-right: 0px;
  	margin-bottom: 0px;
	background-color: #009999;
	}

 ul#linksthemselves li#logn a {
	padding-top: 15px;
	padding-bottom: 15px;
	}*/	

 /* -------------------------------------------------
    -- Page Footer Formating ------------------------
	------------------------------------------------- */ 

 div#footer {
    display: block;
	width: 575px;
	height: 22px;
	position: relative; 
 	margin: 1em auto 2em;
	font-size: 13px;
	vertical-align: middle;
 	}

 #proj div#footer,
 #how2 div#footer {
	padding-top: 1em;
	clear: both;
 	}
	
 div#footer img{
    display: block;
 	float: left;
	border: 1px outset;	
 	}
 
  div#validation {
    display: block;
	width: 565px;
	height: 20px;
	position: relative; 
 	margin: 0em auto 2em;
	font-size: 9px;
	text-align: left;
	border-top: 2px solid #FFF;
	padding: 10px 0px 0px 0px;	
 	}

 div#validation a {
    display: block;
 	float: left;
	border: 0px; 
 	margin: 0em 1.5em 0em 0em;
	padding: 0em;
    }

 div#validation img {
    display: block;
	border: 0px; 
	}	

 div#validation span {
	line-height: 20px;
	margin: 0px;		
 	} 

 /* -------------------------------------------------
    -- Project 'flow' bottom links ------------------
	------------------------------------------------- */ 
 
 div.wethree {
	display: block;
	clear: both;
	width: 700px;
	margin: 0em auto 1em;
	padding-top: 2em;
	height: 42px;
    }

 div.wethree-three {
	width: 540px;
   }
	
 div.wethree-mid {
	margin: 1em auto 1em;
    }
	
 div.wethree a:link {
	color: #000000;
 	}

 div.wethree a {
	display: inline;
	float: left;
	text-align: center;
	margin: 0px 10px;
	width: 135px;
	padding-right: 15px;
	height: 40px;
	border: 1px outset;
	background: url(_images/botnext.gif) no-repeat; 
	background-color: #E6A361;
	line-height:40px;	
	}	

 div.wethree a.bottop {
	width: 150px;
	padding-left: 0px;
	padding-right: 0px;
	background: url(_images/bottop.gif) no-repeat; 
	}

 div.wethree a.botback {
 	padding-left: 15px;
	padding-right: 0px;
	background: url(_images/botback.gif) no-repeat; 
	}
	
 div.wethree a span{

	}
 
 div#spacer {
	display: block;
	height: 1px;
	overflow: hidden;
	}		
 
 /* -------------------------------------------------
    -- About - Idea - Team -- Common Formats --------
	------------------------------------------------- */ 

 div.spbub-tr,
 div.spbub-tl,
 div.spbub-bl,
 div.spbub-br,
 div.spbub-3b {
	display: block;
	position: relative;
	margin: 1em auto;
	width: 248px;
	height: 248px;
	}
	
 div.spbub-tr div,
 div.spbub-tl div {
 	position: relative;
	margin: 92px 24px 39px 24px;
	top: 0px;
	left: 0px;
	width: 200px;
	height: 117px;	
	}
 
 div.spbub-bl div,
 div.spbub-3b div, 
 div.spbub-br div {
	position: absolute;
	margin: 39px 24px 92px 24px;	
	top: 0px;
	left: 0px;
	width: 200px;
	height: 117px;
	}	

/* -- Purple --------------------------- */

 div.spbub-purp div {
	background-color: #A07ADF;	
	}

 div.spbub-purp-br {
	background: url(_images/sbub-br-purp.gif) no-repeat; 
	}
	
 div.spbub-purp-bl {
	background: url(_images/sbub-bl-purp.gif) no-repeat; 
	}
	
 div.spbub-purp-tr {
	background: url(_images/sbub-tr-purp.gif) no-repeat; 
	}
	
 div.spbub-purp-tl {
	background: url(_images/sbub-tl-purp.gif) no-repeat; 
	}					

/* -- Blue --------------------------- */

 div.spbub-blue div {
	background-color: #0066FF;	
	}

 div.spbub-blue-br {
	background: url(_images/sbub-br-blue.gif) no-repeat; 
	}
	
 div.spbub-blue-bl {
	background: url(_images/sbub-bl-blue.gif) no-repeat; 
	}
	
 div.spbub-blue-tr {
	background: url(_images/sbub-tr-blue.gif) no-repeat; 
	}
	
 div.spbub-blue-tl {
	background: url(_images/sbub-tl-blue.gif) no-repeat; 
	}

/* -- Green --------------------------- */

 div.spbub-green div {
	background-color: #339900;	
	}
	
 div.spbub-green-br {
	background: url(_images/sbub-br-green.gif) no-repeat; 
	}	
	
 div.spbub-green-bl {
	background: url(_images/sbub-bl-green.gif) no-repeat; 
	}
	
 div.spbub-green-tr {
	background: url(_images/sbub-tr-green.gif) no-repeat; 
	}
	
 div.spbub-green-tl {
	background: url(_images/sbub-tl-green.gif) no-repeat; 
	}

/* -- Red --------------------------- */

 div.spbub-red div {
	background-color: #EF3C23;	
	}

 div.spbub-red-br {
	background: url(_images/sbub-br-red.gif) no-repeat; 
	}
	
 div.spbub-red-bl {
	background: url(_images/sbub-bl-red.gif) no-repeat; 
	}
	
 div.spbub-red-tr {
	background: url(_images/sbub-tr-red.gif) no-repeat;
	}
	
 div.spbub-red-tl {
	background: url(_images/sbub-tl-red.gif) no-repeat; 
	}

/* -- Triple Purple --------------------------- */

 /* -------------------------------------------------
    -- Leavers Crest -- Common Formats --------------
	------------------------------------------------- */ 

table.compprice th {
	width: 65px;
	vertical-align: top;
	}
	
table.compprice {
	text-align: center;
	}

table.compprice caption {
	margin-bottom: 0px;
	padding-bottom: 0.75em;	
	}

table.compprice th.head {
	width: 100px;
	}
	
 /* -------------------------------------------------
    -- Link/List Type Page -- Common Formats --------
	------------------------------------------------- */ 
	
div.idea {
	display: block;
	position: relative;
	margin-bottom: 1.5em;
	min-height: 75px;
}

div.idea div.ideatext {
	margin-left: 100px;
	}

div.idea a.headinglink {
	display: block;
	font-size: 110%;
	margin-bottom: 0.5em;
	text-transform: capitalize;	
	}
	
div.idea img {
	display: block;
	position: absolute;
	border: 0;
	height: 75px;
	width: 75px;
	margin-bottom: 1em;
	left: 0px;
	}

div.idea a.moreinfo {
	display: block;
	font-size: 85%;
	}
	
 div.disclaim {
	margin-top: 1em;
	margin-bottom: 1em;
	font-size: 75%;
	}
	
 div.disclaim span {
 	font-weight: 900;
 }