/* The Main Foundation Stage Forum CSS Document */

/* ------------------------------- Text formatting ----------------------------- */
div, body {
/*	font-family: Verdana, Tahoma, Arial, sans-serif;*/
	font-family: "Trebuchet MS", Arial, sans-serif; 
	font-size:14px;
	line-height: normal;
	color:#005b99;
	margin:0;
	padding:0;
}
p{margin-left:0px;
   text-align:justify;
  }
  p.centre {
   text-align:center;
   font-style:italic;
  }
p.healthyc {color: #00A5DA; font-weight:bold;} 
p.compc {color: #009D59;font-weight:bold;} 
p.skillc {color: #EE007D;font-weight:bold;} 
p.strongc {color: #442885;font-weight:bold;} 

p.uniquec {color: #81c6c6; font-weight:bold;} 
p.positiver {color: #a277b3;font-weight:bold;} 
p.enablinge {color: #83d17c;font-weight:bold;} 
p.learningd {color: #eab565;font-weight:bold;} 

li {color:#005b99;}

p.featurebox2 {
	color: black;
	line-height: normal;
	}
.healthyc {color: #00A5DA;font-weight:bold;} 
.compc {color: #009D59;font-weight:bold;} 
.skillc {color: #EE007D;font-weight:bold;} 
.strongc {color: #442885;font-weight:bold;} 

.uniquec {color: #81c6c6; font-weight:bold;} 
.positiver {color: #a277b3;font-weight:bold;} 
.enablinge {color: #83d17c;font-weight:bold;} 
.learningd {color: #eab565;font-weight:bold;} 

.title {
    font-size: 17px;
	font-weight: 900;
	color:#005b99;
	text-align:left;
	margin-left:0px;
	}
.titlerev {
	background-color:#005b99;
	padding-top: 3px;
	padding-bottom: 3px;
	font-size: 17px;
	font-weight: bold;
	color:#FFFFFF;
	text-align:center;
	margin-top: 20px;
	margin-bottom: 40px;
	}
.titlerev2 {
background-color:#ccdeeb;
    font-size: 14px;
	color:#005b99;
	text-align:left;
	}
.boxtitle {
    font-size: 15px;
	font-weight:bold;
	color:#005b99;
	text-align:center;
	}
.indexheading1 {
	font-size: 14px;
	margin-top:10px;
	font-weight: bold;
	color: #005b99;
	}
.specialtext {
	font-size: 11px;
	color:#003399;
	}
.superscript{
font-size:xx-small; 
vertical-align:top;
    } 

.emphasis {
	color:#003399;
	font-weight:bold;
	font-style:italic;
	}
.catheadline {
	font-size: 14px;
	color: #005b99;
	}
.quotestext {
	font-size: .95em;
	font-style: italic;
	color:#602d59;
	font-style: italic;
	}
.red {color:#FF0000;}
.biblio {
	font-size: .9em;
	color:#602d59;
	font-style:oblique;
	color:#003399;	
	}  
.ref {
	font-size: .8em;
	color:#602d59;
	} 
.right {
    text-align:right;
	} 
 .copy {
	font-size: .8em;
	color:#003399;
	font-weight:bold;
	color:#003399;	
	}   
.dropcap {
    color:#602d59;
	font-size:55px;
	font-family:"Times New Roman", Times, serif;
	font-style:italic;
	float:left;
	padding:2px;
	}
h1  {
	margin-left: 0px;
	font-size: 16px;
	color: #005b99;
	}
h2 {
    margin-left: 0px;
	font-size: 14px;
	color: #a9a9a9;
	font-weight:bold;
	}
h3 {
    margin-left: 0px;
	font-size: 13px;
	color: #a9a9a9;
	}
h4 {
	font-size: 12px;
	color: #936b7f;
    text-align:center;
   }


/* ---- Normal link text rules ------ */
a:link {
   text-decoration: underline;
   color:#005b99;
/*   font-weight:bold;*/
   }
a:visited {
  color: #936b7f; 
  text-decoration : underline; 
/*  font-weight:bold;*/
  }
a:hover { 
  color: #936b7f; 
  text-decoration : underline;
  }
/* ---- end of link text rules ------ */

/* Everything between here and /CMX tooltips is for the css tooltips (topic articles) feature */
#mindmap {
	margin-left: auto;
	margin-right: auto;
	width: 300px;
	position: relative; 
}
#mindmap li {list-style: none;} /* kills the list item "bullet" markers */
/*** This relative positioning causes the AP popup-parent 
elements to "base" their positioning from this element. ***/
			
.popup-parent {
	position: absolute;
	height: 103px;
	width: 70px;
	background-image: url(stupid.msie);
	left: 257px;
	top: 20px;
} 

.you-are-here-ring { /* this is ring-green.gif */
	position: absolute; 
	left: -3000px; 
	top: -100px;
}

/*** This AP image is always outside the viewport, but its placement causes the browser to preload 
that image, so that when a popup-parent is hovered for the first time there is no load delay. ***/

.popup-parent:hover {background: url(border.gif);} /* makes the box get a highlight border appear */

.popup-parent div {
	position: absolute; 
	left: -3000px; /* places popup elements out of the viewport but allows BG image to be preloaded */
	top: -200px; /* predefines the popup top to be 200px higher than its parent */  
}

.psed {left: 13px; top: 19px;}

.kuw {left: 12px; top: 161px;}

.pd {left: 15px; top: 327px;}

.cll {left: 214px; top: 18px;}

.md {left: 213px; top: 160px;}

.cd {left: 215px; top: 326px;}

.psed div, .psed div a {width: 280px; height: 290px; background: url(/newfsf/Topics/pse.gif);}

.kuw div, .kuw div a {width: 280px; height: 290px; background: url(/newfsf/Topics/kuw.gif);}

.pd div, .pd div a {width: 280px; height: 300px; background: url(/newfsf/Topics/pd.gif);}

.cll div, .cll div a {width: 280px; height: 290px; background: url(/newfsf/Topics/cll.gif);}

.md div, .md div a {width: 280px; height: 290px; background: url(/newfsf/Topics/md.gif);}

.cd div, .cd div a {width: 280px; height: 290px; background: url(/newfsf/Topics/cd.gif);}



  /*** The above sets of rules work with the numerical class names to define
  dimensions and background image paths for each popup, along with their nested links.
  The popups and their links do not actually both need the identical images applied,
  but the dimensions do need to be the same for each pair, and there is no harm in
  combining these selector groups into multiple rule sets, reducing code bloat. ***/


.left:hover div {left: -280px; bottom: -150px; top: auto;}
.right:hover div {left: 70px; bottom: -200px; top: auto;}
 

  /*** The above four rules create classes that may be singly applied to the popup-parent 
  elements to control where the popups appear in relation to the parent. If popup positions
  other than the current diagonal ones are desired, different rules and/or values
  will need to be written. ***/
  
  .popup-parent a {
  position: absolute; /* the AP caption works better in an AP container, compared to a relative one */
  left: 0; /* needed for IE5/win */
  top: 0; /* needed for IE5/win */
  font-family: arial, sans-serif; 
  font-weight: bold;
  font-size: .8em;
  text-decoration: underline;
  color: #fff;
  }

.popup-parent a span {
  position: absolute;
  width: 100%; 
  left: 0; /* needed for IE5/win */   
  bottom: 0; /* the default position, optionally changed via a class */
  background: #227;
  text-align: center; 
  text-decoration: underline;
  padding: 2px 0 3px; /* no side padding, or 100% width will increase and harm the design */
  }
/*** This AP span can be easily placed at the top or bottom of the AP link container. ***/ 

.popup-parent .topper {bottom: auto;} 
/*** This class can go on any of the caption spans to make it be at the top of the link. ***/

 
/* /CMX Tooltips */

/* ------------------------------- Layout/positioning ----------------------------- 

Notes:

Do not mix px widths with % widths for margins, borders or padding because 
the total box width = set width + padding + border.  (It helps if you can add them together)

The box model hack is used to fix an bug in IE5-Win ...for an explanation from the guy that
wrote it go to http://www.tantek.com/CSS/Examples/boxmodelhack.html

IE6-Win will behave like IE5-Win  if you include <?xml version="1.0"?>  It is apparently
unneccessary so leave it out!

Left Col Widths:
 |  pad   |         width         |  pad   | 				
 ------------------------------------------					
 |   5    |          200px        |   0    |	
 
Center Margins:
 |  marg    |         width        |  marg    | 
 ------------------------------------------
 |   220px  |        (auto)        |   220px  |

Right Col Widths:
 |  pad   |         width          |  pad   | 				
 ------------------------------------------					
 |  0     |         200px             0
 */

 #top {
 position:relative;
    width:auto;
    height: 170px;
	}
	

/*Use top2 if you want to add anything to the right of the logo at the top of the screen */
 #top2 {
 position:absolute;
	top: 0px;	
	left: 250px;
    width:90%;
    height: 128px;
	}
	
 #left {
    position: absolute;
	top: 180px;	
	left: 0px;
    background: #fff;
	padding: 5px;
	width: 200px;
	}
	 #leftforum {
    position: absolute;
	top: 207px;	
	left: 0px;
    background: #fff;
	padding: 5px;
	width: 200px;
	}
 #center{
	background: #fff;
	padding-right: 10px;
	margin-left: 220px;
	margin-right: 220px;
	}
 #centerforum{
   background: #fff; 
/*   	border: 2px solid #000; */
	padding-left: 10px;
	padding-right:0px;
	margin-top: 0px;
	margin-left: 207px;
	margin-right: 0px;

	}
/* alternative centre id element that allows the content to span the rest of the page */
 #center2{
   background: #fff; 
   
	padding-left: 10px;
	padding-right:10px;
	margin-top: 0px;
	margin-left: 220px;
	margin-right: 5px;

	}
 #right {
	position: absolute;
	top: 171px;
	background: #fff;
	width: 200px;
	margin-top:0px;
	right:20px;
	}
* html #right {right:10px;}
 #footer {
	visibility: hidden;
	background: #ccdeeb;
    margin-right:5px;
	margin-left:5px;
	margin-bottom:10px;
	margin-top:25px;
	text-align: center;
	}
 .articleright {
	width:200px;
	float:right;
	padding-left:10px;
	margin-right:0px;
	margin-top:10px;
 	}	
  .forumcontrols {
  	background: #FFFFFF;
	text-align: center;
	width:100%;
	margin-right:10px;
	margin-top:10px;
 	}	
* html .articleright {margin-right:0px;} 

/*input { background-color: #ccdeeb; color: #005b99; border-style:outset; border-width:medium; border-color:#e8f0f7; } */

/*Boxes! Rounded blobs, plain borders, etc*/

/* This is the css that gives a 3d grey box, stretchable to contain its contents. Adapted from Alex at sitepoint.com forum */
 .box {
  	width:100%;
	clear:both;
	margin-top: 0px;
	margin-left: 10px;
   	color: #fff;
   	background: #fff url("images2/4trblue.gif") no-repeat top right;
      }
.rbgeneralboxvlb {
    font-size:11px;
    clear:both;
	background:  url("images2/c100vlbs.gif") repeat;
	width: 100%;
	margin: 1em auto;
	margin-left: 10px;
				   } 
 .box h4{
    color:#FFFFFF;
   	padding:15px 0px 15px 20px;
   	margin:0px 20px 0px 0px ;
   	background:  url("images2/4tlblue.gif") no-repeat left top;
	z-index:400;
        }
 .box p{ background:  url("images2/4tileblue.gif") repeat-y left; 
	 text-align:center;
	 font-size: 12px;
	 color:#FFFFFF;
	 padding:5px 0px 15px 20px;
	 margin:0px 20px 0px 0px ;}
 .box h5{
	color:#FFF;
   	background:  url("images2/4brblue.gif") no-repeat bottom right;
   	padding:0px;
/*   	vertical-align:bottom;*/
   	height:30px;
   	margin: 0;
   	width:100%;
        }
 .box h5 a{
	display:block;
	color: #fff;
	background:  url("images2/4blblue.gif") no-repeat bottom left;
	padding:0px 25px;
	height:30px;
	text-align:center;
		}

/*  ------------------------------------------------------------------------------ */

/*------------------LARGE ROUNDED BOX STYLES---------------------------------------------------------*/

/*  ------------ General rounded corners styles light blue colour ---------------------------------- */
 .rbtoplb div  { background:  url("newfsf/images/c111lbs.gif") no-repeat top left; }
 .rbtoplb      { background:  url("newfsf/images/c112lbs.gif") no-repeat top right; }
 .rbbotlb div  { background:  url("newfsf/images/c121lbs.gif") no-repeat bottom left; }
 .rbbotlb      { background:  url("newfsf/images/c122lbs.gif") no-repeat bottom right; }
 .rbtoplb div, .rbtoplb, .rbbotlb div, .rbbotlb {
	height: 20px;
	font-size: 14px;
	color:#005b99;
	text-align:left;
	font-weight:normal;

    }
 .rbtoplb h1 {	
    font-size: 14px;
	text-align:center;
	font-weight:bold;

    }
/* ------ All content for the "rb" rounded boxes has these characteristics -------*/

.rbcontent  { margin: 0 7px;
              font-size:12px; 
              text-align:left;
			  padding-left:5px;
	}
	.rbcontent p{  
	 font-size: 11px;
     text-align:left;
	 color:#005b99;}
	
.rbcontent h1{  
	 font-size: 12px;
	 font-weight:bold;
	 color:#005b99;}

/*  ------------ General rounded corners styles very light blue colour ---------------------------------- */
 .rbtopvlb div  { background:  url("images2/c111vlbs.gif") no-repeat top left; }
 .rbtopvlb      { background:  url("images2/c112vlbs.gif") no-repeat top right; }
 .rbbotvlb div  { background:  url("images2/c121vlbs.gif") no-repeat bottom left; }
 .rbbotvlb      { background:  url("images2/c122vlbs.gif") no-repeat bottom right; }
 .rbtopvlb div, .rbtopvlb, .rbbotvlb div, .rbbotvlb {
	height: 20px;
	font-size: 14px;
	color:#005b99;
	text-align:left;
	font-weight:normal;
    }
 .rbtopvlb h1 {	
    font-size: 14px;
	text-align:center;
	font-weight:bold;
	}
/*  ------------ General rounded corners styles mushroom colour---------------------------------- */
 .rbtopm div  { background:  url("newfsf/images/c111ms.gif") no-repeat top left; }
 .rbtopm      { background:  url("newfsf/images/c112ms.gif") no-repeat top right; }
 .rbbotm div  { background:  url("newfsf/images/c121ms.gif") no-repeat bottom left; }
 .rbbotm      { background:  url("newfsf/images/c122ms.gif") no-repeat bottom right; }
 .rbtopm div, .rbtopm, .rbbotm div, .rbbotm {
	height: 7px;
	font-size: 1px; 
    }
/*  ------------ General rounded corners styles green colour---------------------------------- */

 .rbtopg div  { background:  url("newfsf/images/c111gs.gif") no-repeat top left; }
 .rbtopg      { background:  url("newfsf/images/c112gs.gif") no-repeat top right; }
 .rbbotg div  { background:  url("newfsf/images/c121gs.gif") no-repeat bottom left; }
 .rbbotg      { background:  url("newfsf/images/c122gs.gif") no-repeat bottom right; }
 .rbtopg div, .rbtopg, .rbbotg div, .rbbotg {
	height: 7px;
	font-size: 1px; 
    }
/*  ------------ General rounded corners styles blue colour---------------------------------- */

 .rbtopb div  { background:  url("newfsf/images/c111bs.gif") no-repeat top left; }
 .rbtopb      { background:  url("newfsf/images/c112bs.gif") no-repeat top right; }
 .rbbotb div  { background:  url("newfsf/images/c121bs.gif") no-repeat bottom left; }
 .rbbotb      { background:  url("newfsf/images/c122bs.gif") no-repeat bottom right; }
 .rbtopb div, .rbtopb, .rbbotb div, .rbbotb {
	height: 7px;
	font-size: 1px; 
    }
/*  ------------ General rounded corners styles aqua green colour---------------------------------- */	
 .rbtopag div  { background:  url("newfsf/images/c111ags.gif") no-repeat top left; }
 .rbtopag      { background:  url("newfsf/images/c112ags.gif") no-repeat top right; }
 .rbbotag div  { background:  url("newfsf/images/c211ags.gif") no-repeat bottom left; }
 .rbbotag      { background:  url("newfsf/images/c212ags.gif") no-repeat bottom right; }
 .rbtopag div, .rbtopag, .rbbotag div, .rbbotag {
	height: 7px;
	font-size: 1px; 
    }

/*  ---These boxes are different colours for general purpose stuff like the coloured article headlines-------- */ 

.rbgeneralboxlb {
    font-size:11px;
    clear:both;
	background:  url("newfsf/images/c100lb.gif") repeat;
	width: 100%;
	margin: 1em auto;
	margin-left: 10px;
				   } 
.rbgeneralboxlb 
   a:link {
   font-size:11px;
   color: #005b99; 
   text-decoration:underline;
   }
.rbgeneralboxlb a:visited {
  font-size:11px;
  color: #005b99; 
  text-decoration : none; 
  }
.rbgeneralboxlb a:hover { 
  font-size:11px;
  color: #936b7f; 
  text-decoration : none;
  }
.rbgeneralboxvlb {
    font-size:11px;
    clear:both;
	background:  url("images2/c100vlbs.gif") repeat;
	width: 100%;
	margin: 1em auto;
	margin-left: 10px;
				   } 
.rbgeneralboxvlb a:link {
   font-size:11px;
   color: #005b99; 
   text-decoration:underline;
   }
.rbgeneralboxvlb a:visited {
  font-size:11px;
  color: #005b99; 
  text-decoration : none; 
  }
.rbgeneralboxvlb a:hover { 
  font-size:11px;
  color: #936b7f; 
  text-decoration : underline;
  }
.rbgeneralboxg {
	background:  url("newfsf/images/c100g.gif") repeat;
	width: 200px;
	margin: 1em auto;
	margin-left: 0px;
	float:right;
				   } 
.rbgeneralboxm {
	background:  url("newfsf/images/c100m.gif") repeat;
	width: 200px;
	margin: 1em auto;
	margin-left: 0px;
	float:right;
				   }
.rbgeneralboxb {
	background:  url("newfsf/images/c100b.gif") repeat;
	width: 200px;
	margin: 1em auto;
	margin-left: 0px;
	float:right;
				   } 
				 
.rbgeneralboxag {
    font-size:11px;
 	color:#602d59;
	background:  url("newfsf/images/c100ag.gif") repeat;
	width: 100%;
	margin: 1em auto;
	margin-left: 10px;
				   } 
.rpgeneralboxag p {font-size:8px;
 				   color:black;
				   }  
/*Headlines boxes*/
.hboxvlb {
    font-size:14px;
    float:right;
	background:  url("images2/c100vlbs.gif") repeat;
	width: 210px;
	margin-left: 10px;
				   } 
/* ---The following three round boxes are distinct (classes because they have to be AP----------*/

 /* ----This div gives the coloured box the date goes into --------*/
 .rbdatebox { background:  url("newfsf/images/c100m.gif") repeat; 
 			   position: absolute;
			   top: 130px;
			   width: 200px;
			   margin-left: 5px;
/*			   margin: 1em auto;	*/	 


			   }
/*  ------------------------------------------------------------------------------ */

 /* ----This is the css that gives the coloured box the search box goes into --------*/
 
 .rbsearchbox { background:  url("newfsf/images/c100ags.gif") repeat; 
			   position: absolute;
			   right: 10px;
			   top: 130px;
			   width: 200px; 
	/*		   margin: 1em auto;*/
			   }
			   
 /* ----This is the css that gives the coloured box the login/registration box goes into --------*/
 
 .rbloginbox { background:  url("newfsf/images/c100g.gif") repeat; 
 			   position: absolute;
			   left: 220px;
			   top: 130px;
			   width: 300px; 
		/*	   margin: 1em auto;*/
			   }



/* ---------------------------------------------------------------------- --------*/
 
 .leftbox { 
   	 width:200px;
 	 background-color: #fff;
	 margin-left:10px;
	 margin-top:30px;
	 font-size: 11px;
	 
			   }
 .leftbox h4{
   	padding:10px 0px 10px 10px;
   	margin:0px 0px 0px 0px ;
   	background:  url("newfsf/images/tb.gif") no-repeat left top;
        }		
		
.leftcontent {border-left-color: #8cd600;
              border-right-color: #8cd600;
			  padding: 10px 10px 10px 25px;
             }   

/* ---------------------------------------------------------------------- --------*/
 
.leftfloat { 
   	 float:left;
	 margin-right:10px;
 	 background-color:#ffffff ;
	 font-size: 10px;
	 padding-bottom:5px;
	 padding-top:10px;
	 padding-left:10px;
	 }
 /*  ------------------------------------------------------------------------------ */
 .dropbox { 
   	 float:left;
	 margin-right:5px;
 	 background-color:#ffffff ;
	 font-size: 10px;
	 padding-bottom:0px;
	 padding-top:0px;
	 }
 /*  ------------------------------------------------------------------------------ */
.rightfloat { 
   	 float:right;
	 margin-left: 10px;
	 margin-bottom: 10px;
 	 background-color: #ffffff;
	 font-size: 10px;
	 }
.bulletfloat { 
   	 float:left;
 	 background-color:#ffffff ;
	 padding-right:3px;
	 }
 /*  ------------------------------------------------------------------------------ */

/*background coloured boxes of different colours */
/*Full width bordered box - mushroom colour.*/
 .featurebox {
	 background-color: #e8f0f7;
	 border-width:medium;
	 border-style:ridge;
	 border-color:#93b7d1;
	 font-size: 14px;
	 font-weight:bold;
	 text-align:center;
	 color:#005b99;
	 width: 95%;
	 padding: 10px;
     margin-top:15px;
	 margin-bottom:15px;
	 	}  

/*Full width bordered box - light blue.*/
 .featurebox2 {
 float: right;
	 color:#005b99;
	 border-top-style:outset;
	 border-top-color:#93b7d1;
	 border-bottom-style:inset;
	 border-bottom-color:#93b7d1;
	 width: 150px;
	 padding: 5px;
	 margin-left: 20px;
 	 	}  

/*Full width bordered box - green.*/
 .featurebox3 {
 float: left;
	 color:#005b99;
	 border-top-style:outset;
	 border-top-color:#93b7d1;
	 border-bottom-style:inset;
	 border-bottom-color:#93b7d1;
	 width: 150px;
	 padding: 5px;
	 margin-right: 20px;
 	 	}  
.featurebox4 {
	 background-color: #e8f0f7;
	 border-width:medium;
	 border-style:ridge;
	 border-color:#93b7d1;
	 font-size: 14px;
	 font-weight:bold;
	 text-align:center;
	 color:#005b99;
	 width: 85%;
	 padding: 10px;
     margin-top:15px;
	 margin-bottom:15px;
	 	}  
		 .featurebox5 {
	 color:#005b99;
	 width: auto;
	 padding: 5px;
 	 	}  
 /*  -------------------------------- Navigation ------------------------------ */
 /*Provider page CSS*/
 .lalogo {
 float: right;
	 color:#005b99;
	 width: auto;
	 text-align:center;
	 margin-left: 20px;
	 margin-bottom:20px;
	 margin-top:10px;
 	 	}  
.latitle {
	 width: auto;
	 margin-top:30px;
 	 	}  
.centrebox {
    border-top-style: ridge;
	border-bottom-style:ridge;
	clear:both;
	margin-bottom:40px;
	padding:10px;
	background-color:#D9EEEE;
    margin:auto;
	width: 400px;
	height:auto;
}
p centrebox {
    font-size:.7em;
}		
 /* /Provider page CSS*/