/* CSS Document */

/* remember the appropriate background class is to be applied based on class attached to the body */


body {
margin : 0;
padding : 0;
font : 70% Tahoma, Arial, sans-serif;
}



#threeColLayout {
background : #FFF;
}
#twoColLayout {
background : #FFF;
}
#oneColLayout {
background : #FFF;
}
#client {
color : #72746d;
font-size:95%;
text-align : right;
float : right;
margin : 5px 5px 0 0;
width : 298px;
height : 126px;
background-image : url(../images/parents_evening.gif);
background-repeat : no-repeat;
}


#client a {
color : #72746d;
text-decoration : none;
}
#client a:hover {
color : #72746d;
text-decoration : underline;
}


p a:link {
color : #30318B;
text-decoration : none;
border-bottom : 1px solid #30318B;
}
p a:visited {
color : #30318B;
text-decoration : none;
border-bottom : 1px solid #30318B;
}
p a:hover {
color : #30318B;
text-decoration : none;
border-bottom : 1px solid #30318B;
background : #C0C1DC;
}

h1 {
font-family: Arial, Helvetica, sans-serif;
margin : 0 0 0 0px;
z-index : 3;
width : 137px;
height : 133px;
background-image : url(../images/tavistocklogo.gif);
background-repeat : no-repeat;
text-indent : -9000px;
}

h1 a {
font-family: Arial, Helvetica, sans-serif;
display : block;
height : 133px;
background-image : url(../images/tavistocklogo.gif);
background-repeat : no-repeat;
margin : 0;
}
h2 {
font-family: Arial, Helvetica, sans-serif;
margin : 0;
padding : 0;
font-size : 110%;
color: #FF0000;
}


#topheader {
width : 750px;
margin : 0 auto;
padding : 0 10px 0 10px;
}
#wrapper {
width : 750px;
margin : 0 auto;
background-color : #ffffff;
padding : 0px 10px 10px 10px;
}
#header {
width : 750px;
height : 245px;
}
#primaryContent {
float : left;
width : 740px;
display : inline;
margin : 0 0 20px 0;
padding : 0 10px 0 0;
}
#threeColLayout #primaryContent {
float : left;
width : 375px;
margin : 0 0 5px 0;
}
#twoColLayout #primaryContent {
width : 480px;
float : left;
margin : 0 0 5px 0;
}
#twoColLayout #secondaryContent {
display : none;
}
#secondaryContent {
float : left;
width : 175px;
margin : 0 0 20px 5px;
}
#sideContent {
float : right;
width : 245px;
margin : 0 0 20px -140px;
}
#oneColLayout #secondaryContent, #oneColLayout #sideContent {
display : none;
}
#twoColContent {
width : 555px;
float : left;
margin : 0 0 20px 195px;
}
.cbSide {
width : 230px;
margin : 0 0 0 10px;
padding : 0 0 5px 0;
background : #fff;
}

.cbSide p {
margin : 0;
padding : 20px 8px 25px 25px;
color : #333;
line-height : 140%;
}

.cbSide1 {
width : 230px;
height : 24px;
margin : 0 0 0 10px;
padding : 0;
background-image:url(../images/whyusetop.jpg)  ;
}

.cbSide2 {
width : 230px;
margin : 0 0 0 10px;
padding : 0;
background-image:url(../images/whyuse.jpg);

}

.cbSide2 p {
margin : 0;
padding : 5px 8px 0 15px;
color : #000;
line-height : 140%;
font-weight: bold;
text-align: left;
}

.cbSide2 ul{
list-style-image:url(../images/curve.gif);
min-width : 100px;
margin : 0;
padding : 0 8px 0 25px;

}

.cbSide2 li{
margin-left: 25px;
margin-bottom: 5px;
text-align:left;

}

.cbSide3 {
width : 230px;
height : 22px;
margin : 0 0 0 10px;
padding : 0;
background-image:url(../images/whyusebottom.jpg)  ;
}

/* box is the shaded area that holds a rounded corner box or flat box, fitting the given width of the column it is in. Usually combined with another class to control inner elements, eg box default */


.box {
margin : 0 0 0 0;
padding : 0;
}
.box2 {
margin : 10px 0px 5px 0;
padding : 0px 0 5px 0;
}

.box3 {
margin : 1 1 1 1;
padding : 5px 0 5px 0;
background:url(../images/diags.gif);
}

.cbb {
	line-height : 170%;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: 0px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 0;
}

.p {
margin : 0;
padding : 0 5px 0 10px;
color : #333;
line-height : 140%;
}

.p p{
margin-top : 0.3em;
margin-bottom : 1.5em;
}

.cbb p, .cb p {
margin : 0;
padding : 5px 0 10px 50px;
color : #333;
}



img {
float : left;
margin : 0 0 2px 0px;
}
.default img {
border : 0;
}
#header img {
float : left;
margin : 0 0 2px 0;
border : 0;
}
.mainImage {
display : block;
float : none;
border : 3px solid #ffffff;
}
.img-wrapper {
margin : 20px 40px 0 0;
float : left;
}
.img-wrapper img {
float : none;
margin : 0;
background : #fff;
padding : 4px;
border : 1px solid #c5bdbd;
position : relative;
left : -5px;
top : -5px;
}

.spacer {
clear : both;
}


#navcontainer ul {
font-family: Arial, Verdana, sans-serif;
z-index : 6;
margin : 0;
padding : 0;
list-style-type : none;
text-align : center;
min-width : 750px;
height:1.9em;
line-height: 2em;
color : #000000;
margin : 0px 0 0 0;
background:url(../images/bg_nav1lrg.jpg) repeat-x bottom;
}

#navcontainer ul li {
display : inline;

}
#navcontainer ul li a {
text-decoration : none;
padding : 0.1em 0.8em;
color : #30318B;
font-weight : 100;
text-decoration : none;
margin : 0;
letter-spacing : 1px;
line-height : inherit;
}
#navcontainer a:hover, #navcontainer a:active {
 background:url(../images/bg_tab_left.gif) left top no-repeat;
color : #fff;
}
#navcontainer a.active:link, #navcontainer a.active:visited {
background : #cccccc;
color : #0066FF;
}
body.home #navcontainer a#home, body.news #navcontainer a#news, body.diary #navcontainer a#diary, body.forget #navcontainer a#forget, body.staff #navcontainer a#staff, body.ofsted #navcontainer a#ofsted,  body.eyfs #navcontainer a#eyfs, body.committee #navcontainer a#committee, body.fundraising #navcontainer a#fundraising, body.vacancies #navcontainer a#vacancies, body.fees #navcontainer a#fees, body.contact #navcontainer a#contact, body.links #navcontainer a#links  {
color : #F7F7F7;
 background:url(../images/bg_tab_left.gif) left top no-repeat;
text-decoration : none;
}
body.home #navcontainer a:hover#home, body.news #navcontainer a:hover#news, body.diary #navcontainer a:hover#diary, body.forget #navcontainer a:hover#forget, body.staff #navcontainer a:hover#staff, body.ofsted #navcontainer a:hover#ofsted, body.eyfs #navcontainer a:hover#eyfs, body.committee #navcontainer a:hover#committee, body.fundraising #navcontainer a:hover#fundraising, body.vacancies #navcontainer a:hover#vacancies, body.fees #navcontainer a:hover#fees, body.contact #navcontainer a:hover#contact, body.links #navcontainer a:hover#links {
color : #CCCCFF;
}

#footer {
clear : both;
width : 750px;
background : transparent;
padding : 0;
border-top : 2px solid #CCCCCC;
}
#footer #f-links {
margin : 0 0 0 0;
padding : 5px 10px 5px 5px;
float : right;
}
#footer #f-links li {
display : inline;
color : #8c8c8c;
margin-left : 10px;
font-size : 93%;
}
#footer #f-links a {
color : #8c8c8c;
text-decoration : none;
}
#footer #f-links a:hover {
color : #30318B;
text-decoration : underline;
}


form {
margin : 0 5px 0 0;
font-size : 95%;
padding: 0px;
font-family:Tahoma, Arial, sans-serif;
}
fieldset {
width : 140px;
border : 0;
padding : 0px;
}

fieldset a:link {
color : #666666;
text-decoration : none;
border-bottom : 1px solid #6699FF;
}
fieldset a:visited {
color : #666666;
text-decoration : none;
border-bottom : 1px solid #666666;
}
fieldset a:hover {
color : #0033CC;
text-decoration : none;
border-bottom : 1px solid #0033CC;
}
legend {
text-transform : uppercase;
font-size : 100%;
font-weight : bold;
padding : 0px;
}
label {
display : none;
padding : 0px;
}
input {
margin-top : 0;
padding : 0px;
}
textarea {
margin-top : 0;
padding : 0px;
}

.default fieldset {
width : auto;
border : 0;
padding : 0px;
}

.default form {
margin : 0;
font-size : 100%;
padding: 0px;
font-family:Tahoma, Arial, sans-serif;
}

.default legend {
display : none;
}

.default label {
display : block;
font-size: 100%;
}

.default input {
display : block;
font-size : 100%;
}

.default textarea {
display : block;
font-family:Tahoma, Arial, sans-serif;
font-size : 100%;
}

.default checkbox{
display:inline;
}

input.submit {
margin-top : 1px;
padding : 2px;
background : #ffffff;
font-size : 12px;
}