﻿/* 
    Main colours: #b0b0b0 #e6e6e6 #800000
    CONSTANTS: Total page width = 950px + div_All left and right border with. Usable page width = 930px
*/

body { background-color: White;  font-family: Verdana, Arial, Helvetica, sans-serif;  margin: 0px; padding: 0px; font-size: 13px; height: auto !important; min-height: 100%; }

#div_Outer { margin: 0px auto 0px auto; }

#bodyTop { position: absolute; top: 0px; height: 180px; width: 100%; background-image: url('../Images/BodyTop-bkg.jpg'); background-repeat: repeat-x;  z-index: -1;  }

#div_PageTopSpace { height: 0px; width: inherit; background-color: transparent; overflow: hidden; }

#div_All { width: 950px; background-image: url("../Images/PageTop-bkg.gif"); margin: 0px auto 0px auto; padding-bottom: 10px; background-repeat: no-repeat; }

#div_All_Overlay { position: absolute; top: 0px; width: inherit; margin: 0px auto 0px auto; background-color: black ; opacity: 0.5; filter: alpha(opacity=50); height: 300px;  }
#div_pgeovrMsg_box { position: absolute; top: 0px; width: 598px; height: 398px; border: 1px solid Black; margin: 170px 175px 0px 175px; background: White url("../Images/PageoverMsgFrame.jpg") no-repeat scroll center; }
#div_pgeovrMsg { width: 525px; height: 165px; margin: 180px auto 0px auto; overflow: hidden; }
#div_pgeovrMsg_btns { width: 525px; height: 27px; margin: 18px auto 0px auto; overflow: hidden; text-align: center; }

/* tbl_PageTop - Sits over #div_All  */
#tbl_PageTop { width: 950px; height: 128px; margin: 0px auto 0px auto; overflow: hidden; }
#tbl_PageTop #tdLeft { height: 118px; width: 550px; vertical-align: top; overflow: hidden; }
#tbl_PageTop #tdLeftLogo { height: 98px; width: 400px;  margin: 20px 0px 0px 10px; cursor: pointer; }
#tbl_PageTop #tdRight { height: 118px; width: 400px; overflow: hidden; text-align: right; vertical-align: top; }
#tbl_PageTop #top_right_nav { height: 40px; color: White; width: 387px; text-align: right; padding-right: 13px; font-weight: bold; padding-top: 8px; overflow: hidden; }
#tbl_PageTop #top_right_nav img { vertical-align: middle; }
#tbl_PageTop #contactInf { color: #dddddd; font-size: 10px; margin-top: 6px; }
#tbl_PageTop #loggedInUsrDtls { float: right; width: 394px; height : 30px; padding: 6px 6px 0px 0px; overflow: hidden; background-image: url('../Images/LoggedInUserDtls-Bkg.png'); }
.loggedInBar { height: 36px; width: 400px; float: right; margin-right: 5px; }
.loggedInBar .wrapper { height: 26px; background-color: White; }

/* tbl_PageTopNavBar - Page top navigation bar table */
#tbl_PageTopNavBar { width: 930px; height: 52px; margin: 0px 10px 0px 10px; text-align: center; float: left; }
#tbl_PageTopNavBar #tdLeft { width: 6px; }
#tbl_PageTopNavBar #tdMiddle { background-color: transparent;  }
#tbl_PageTopNavBar #tdRight { width: 6px; }

#tbl_PageTopNavBar ul {list-style: none; font-weight: bold; z-index: 0; margin: 0px auto 0px auto; padding-left: 0px; }
#tbl_PageTopNavBar .topMenu { position: relative; display: inline-block; text-align: left; border-right: 2px solid White; text-decoration: none; white-space: nowrap; }
#tbl_PageTopNavBar .first { border-left: 2px solid White; }
#tbl_PageTopNavBar .last { border-right: 0px solid White; }
#tbl_PageTopNavBar .topMenu a { height: 30px; color: Black; background-color: transparent; padding: 17px 10px 3px 10px; display: block; }
#tbl_PageTopNavBar .topMenu a:hover { color: White; background-color: #b0b0b0; }
#tbl_PageTopNavBar .ddMenu { background: rgba(255,255,255,0); position: absolute; z-index: 99; padding-left: 0px; margin-left: 0px; left: -9999px;  /* border-bottom: 1px solid Red;   Hide dropdown */  }
#tbl_PageTopNavBar .ddMenu li { border-top: 1px solid White; float: none; text-align: left; }
#tbl_PageTopNavBar li:hover ul{ left: 0px;  /* Display dropdown */ }
/* Create persistent hover state. topMenu link stays 'hovered' when your cursor has moved down to ddMenu. */
#tbl_PageTopNavBar li:hover a { color: White; background-color: #b0b0b0; background-image: none; }
/* Persistent hover state creates a global style for links even before they're hovered. Here we undo these effects. */
#tbl_PageTopNavBar li:hover ul a { color: White; background-color: #38383c; min-width: 100px; }
/* Hover state for ddMenu items */
#tbl_PageTopNavBar li:hover ul li a { height: 20px; font-size: 12px; padding: 5px 10px 2px 10px; }
#tbl_PageTopNavBar li:hover ul li a:hover { color: White; background-color: #b0b0b0; }

/* Page bottom */
#div_PageBody {width: 930px; margin: 0px auto 0px auto; }
#tbl_PageBottom { width: 930px; margin: 0px auto 0px auto; font-size: 10px; vertical-align: top; }
#tbl_PageBottom #tdBorder { padding-top: 10px; border-bottom: 2px solid #38383c; }


/* The following is used as a resorce container pane in VsCmEditor */
.PageOverWorkPane { position: fixed; top: 0px; right: 0px; margin-top: 10px; /* see div_PageTopSpace */ margin-right: 5px;
                          background-color: White; border: 3px solid Black; border-radius: 10px; padding: 5px; display: none; }



.VDvdr { width: 14px; height: 400px; float: left; border-left: solid 1px #b0b0b0; }


/* IMPORTANT: For the following see also MAPArticleIndexWidth=230 and MAPArticleBodyWidth=680 in client setup */
.MAPContainer { width: 100%; table-layout:fixed; } /* table */
.MAPIx { width: 210px; padding: 10px; background-color: #eeeeee; vertical-align: top; border: 1px dotted Silver; border-radius: 10px; overflow:hidden; } /* td */
.MAPBody { width: 680px; padding-left: 20px; vertical-align: top;  overflow:hidden; } /* td */
.MapArticleTtl { margin-top: 0px; }
.MapIxLink { display: block; border-bottom: 1px dotted Silver; padding-bottom: 6px; margin-bottom: 6px; } /* <a ..> tag */
.MapIxLink small { color: Silver; }
.MapIxLink small span { color: Red; font-size: x-small; }
.selectedMapIxLink { background: url('../Images/ssImg_Next.gif') no-repeat center right; padding-right: 18px; } /* <a ..> tag */


/* Resource pages styles */
#div_RPLeft { width: 670px; float: left; padding-right: 15px; }
#div_RPRight { width: 230px; float: left; }
#div_RPLeft p { margin: 6px 0px 0px 0px; }
.RsEditDelete { display: none; }

.RPContainer { width: 100%; table-layout:fixed; } /* table */
.RPIx { width: 210px; padding: 10px; background-color: #eeeeee; vertical-align: top; border: 1px dotted Silver; border-radius: 10px; overflow:hidden; } /* td */
.RPBody { width: 680px; padding-right: 20px; vertical-align: top;  overflow: hidden; } /* td */



/* Home Page Slide Show - hpss - styles */
.div_hpssContainer { position: relative; float: left; }
.hpssImgFront { width: 400px; height: 300px; position: relative; top: 0px; left: 0px; }
.hpssImgBack { width: 400px; height: 300px; position: absolute; top: 0px; left: 0px; }
.hpssImgFrame { width: 400px; height: 300px; position: absolute; top: 0px; left: 0px;  }
.hpssImgPrevBtn { cursor: pointer; margin-left: 5px; }
.hpssImgNextBtn { cursor: pointer;  margin-right: 5px;}
.div_hpssContainer table { display: none; position: absolute; top: 0px; width: 400px; height: 300px; }
.div_hpssContainer td { vertical-align:  middle;}
.div_hpssContainer .left { text-align: left; width: 50%; }
.div_hpssContainer .right { text-align: right; width: 50%; }


.HomePageBtn { height: 45px; width: 200px; background-image: url('../Images/HomePageBtn-Bkg.gif'); cursor: pointer; overflow: hidden; }
.HomePageBtn:hover { background-image: url('../Images/HomePageBtn-Bkg-On.gif'); color: Red; }
.HomePageBtn table { margin: 3px 8px 5px 45px; font-weight: bold; width: 147px; height: 35px; overflow: hidden; }

.AllLNEBox { }
.AllLNEBox a { color: #555555; display: block; border: 1px dotted #888888; background-color: #f4f4f4; border-radius: 10px; padding: 5px; margin-bottom: 8px; } 
.AllLNEBox a:hover { color: Red; }
.AllLNEBox img { float: left; margin: 5px 15px 5px 0px; width: 100px; border-radius: 6px; display: block; } /* thumbnail image */
.AllLNEBox b { font-size: 15px;  } /* article title */
.AllLNEBox em { font-style: normal; } /* article intro text */
.AllLNEBox i { font-size: 10px; margin-top: 10px; display: inline-block; } /* authors <br />date and page title  */
.AllLNEBox span { color: Red; font-size: 8px; margin-top: 4px; display: inline-block; } /* stickiness expiry date */

.Diary { background-image: url('../Images/Diary-Bkg.gif');  }
.Diary div { border-top-color: Silver; }
.News { float: left; width: 425px; height: 315px; margin-top: 15px; overflow: hidden; }
.News a { color: Gray; /* font-size: 11px; */ }
.News div { border-top-color: #e7e7e7; }

.LNEBox { height: 550px; }
.LNEBox .Inner { } /* 275 */
.LNEBox .Heading { height: 30px; color: Gray; font-size: 18px; font-weight: bold; border-bottom: 1px solid #aaaaaa; text-align: left; }
.LNEBox .Content { height: 500px; overflow: hidden; margin-top: 10px; font-size: 14px; padding: 0px;  }
.LNEBox .Content a { display: block; color: Gray; /* font-size: 11px; */ padding-bottom: 6px; margin-bottom: 6px; border-bottom: 1px dotted Gray; } 
.LNEBox .Content a:hover { color: #ff7777; }
.LNEBox .Content img { float: left; margin: 5px 10px 5px 0px; width: 75px; border-radius: 6px; }
.LNEBox .Content b { font-size: 13px; display: table-cell; padding-bottom: 4px; } /* article title */
.LNEBox .Content em { font-style: normal; display: table-row; } /* article intro text */
.LNEBox .Content i { font-size: 8px; display: table-cell; padding: 4px 0px; } /* authors <br />date and page title  */
.LNEBox .Content span { color: Red; font-size: 8px; display: table-row; } /* stickiness expiry date */
.LNEBox .Footer { margin-top: 4px; height: 20px; text-align: left; border-top: 1px solid #aaaaaa; padding-top: 7px; }
.LNEBox .Footer a { font-size: 13px; font-weight: bold; color: Gray; font-size: 12px; } .LNEBox .Footer a:hover { color:  #ff7777; } 
.LNEBox a { color: White; font-size: 11px; } .LNEBox a:hover { color: Yellow; }
.LNEBox div { border-top-color: White; }

.DiaryBox { height: 280px; background-color: #c20112; /* ad1c28 */ color: White; background-image: url('../Images/DiaryBox-Bkg.gif'); border-radius: 10px; }
.DiaryBox .Inner { width: 261px; padding: 7px; } /* 275 */
.DiaryBox .Heading { height: 30px; font-size: 16px; font-weight: bold; border-bottom: 1px solid White; text-align: center; }
.DiaryBox .Content { height: 195px; overflow: hidden; margin-top: 10px; font-size: 11px; color: White; padding: 0px 5px 0px 5px; }
.DiaryBox .Footer { margin-top: 3px; height: 18px; text-align: center; border-top: 1px solid White; padding-top: 7px; }
.DiaryBox .Footer a { font-size: 13px; font-weight: bold; color: White; font-size: 12px; } .DiaryBox .Footer a:hover { color: #fbb041; } 
.DiaryBox a { color: White; font-size: 11px; }
.DiaryBox div { border-top-color: White; }



/* AP Page styles */

.UsrGrpAreas { margin-top: 40px; border-top: 2px solid Gray; padding: 0px 0px; }
.UsrGrpHdg { position: relative; height: 18px; padding: 2px 0px 0px 10px; width: 260px; top: -12px; left: 0px; font-size: 12px; font-weight: bold; background-color: #eeeeee; border: 2px solid Gray; border-radius: 10px; }

.myact_tabs {}
.myact_tabs ul { list-style: none; width: 100%; overflow: auto; margin: 0px; padding: 0px; }

.myact_tabs .liOff { margin: 0px 1px 0px 0px; padding: 0; float: left; background-color: #eeeeee; border-radius: 10px 10px 0px 0px; border: 1px solid #777777; }
.myact_tabs .liOff a { height: 17px; padding: 5px 10px; color: Black; font-weight: bold; display: inline-block; overflow: hidden;  }
.myact_tabs .liOff a:hover { color: Red;  }
.myact_tabs .liOn { margin: 0px 1px 0px 0px; padding: 0; float: left; background-color: transparent; border-radius: 10px 10px 0px 0px; border: 1px solid #777777; border-bottom: none; }
.myact_tabs .liOn a { height: 17px; padding: 5px 10px; color: Black; font-weight: bold; display: inline-block; overflow: hidden;  }
.myact_tabs .liOn a:hover { color: Red;  }
.myact_tabs .tdFillerLine { border-bottom: 1px solid #777777; }
.myact_contents { border: 1px solid #777777; border-top: none; padding: 15px 10px 10px 10px; }
.myact_content { display: none; }


/* Custom ddl styles */
.ul_ddl { list-style: none; font-weight: bold; z-index: 0; margin: 0px auto 0px auto; padding: 0px; display: inline; }
.ul_ddl .topMenu { position: relative; display: inline-block; text-align: left; }
.ul_ddl .topMenu a { display: block; padding: 0px; text-decoration: none; white-space: nowrap; }
.ul_ddl .topMenu a:hover {  }
.ul_ddl .ddMenu { background: inherit; position: absolute; z-index: 99; padding-left: 0px; margin-left: 0px; left: -9999px; /* Hide dropdown */ }
.ul_ddl .ddMenu li { float: none; }
.ul_ddl li:hover ul{ left: 0px;  /* Display dropdown */ }
/* Create persistent hover state. topMenu link stays 'hovered' when your cursor has moved down to ddMenu. */
.ul_ddl li:hover a { background-image: none; }
/* Persistent hover state creates a global style for links even before they're hovered. Here we undo these effects. */
.ul_ddl li:hover ul a { min-width: 200px; }
/* Hover state for ddMenu items */
.ul_ddl li:hover ul li a { padding: 3px 0px 3px 0px; }
.ul_ddl li:hover ul li a:hover {  }


/* Links */
a { color: #00aced; text-decoration: none; } a:hover { color: Red;} a:focus { outline: none; }
.adminLink {color: Fuchsia; font-weight: bold;} .adminLink:hover { color: Red;}
a.pageTopLink {color: White; font-size: 12px; } a.pageTopLink:hover { color: Orange; } 
a.pageTopLinkMailto { color: #dddddd; } a.pageTopLinkMailto:hover {color: Orange; }
a.mailto { color: #00aced; } a.mailto:hover {color: Red; }
a.thLink {  color: #277827; font-weight: bold; } a.thLink:hover  { color: Maroon; }
a.lLink {  color: #b0b0b0; } a.lLink:hover  { color: White; }
a.dLink {  color: #00aced; font-weight: bold; } a.dLink:hover  { color: Red; } a.dLink small {color: Gray; font-weight: normal;}
a.bdLink {  color: #00aced; font-weight: bold; font-size: 16px; } a.bdLink:hover  { color: Red; } a.bdLink small {font-weight: normal; font-size: 12px;} 
div.link { color: #00aced; font-weight: bold; padding-bottom: 8px; cursor: pointer; } div.link:hover { color: Red; }
.hdnLink {  color: #00aced; cursor: pointer; } .hdnLink:hover { color: Red; }


/* Page heading styles */
.pageHdgDiv { width: 100%; float:left; margin: 8px 0px 15px 0px; padding-bottom: 4px; border-bottom: solid 2px #b0b0b0;}
.pageHdgDiv h1 { float:left; margin: 0px; font-size: 20px;} 
.pageHdgDiv div { float: right; padding-top: 5px; }

/* Class page heading styles */
.classHdgDiv { width: 100%; float:left; margin: 12px 0px 15px 0px; padding-bottom: 4px; border-bottom: solid 2px #b0b0b0; text-align: center;}
.classHdgDiv h1 { margin: 0px; font-size: 18px;} 
.classHdgDiv div { padding: 3px 0px 3px 0px; }
.classHdgDiv a { display: inline-block; }
.classHdgDiv .sClsPgLink { border-bottom: 2px solid #1abecb; font-weight: bold; }
.classHdgDiv .sClsPgLink:hover { color: Red; }
.classHdgDiv .sClsPgLinkDvdr { display: inline-block; width: 2px; height: 8px; background-color: Gray; margin: 0px 10px 0px 10px;  }


/* Form table */
.tblForm { border: 1px solid #b0b0b0; } 
.tblForm th { padding: 5px; background-color: #e6e6e6; text-align: left; }
.tblForm .thTop { border: 1px solid #b0b0b0; text-align: left; }
.tblForm td {padding: 3px 3px 3px 10px; vertical-align: top; }
.tblForm .tdBBrd {border-bottom: 1px solid #b0b0b0; }
.tblForm table { padding: 5px; } 
.tblForm table th { font-weight: bold; text-align: left; text-decoration: underline; }

.tblBordered th { border: 1px solid #b0b0b0; }
.tblBordered td { border: 1px solid #b0b0b0; }
.tblBorderedAdmin td { border: 1px solid Blue; }

.tblInner {border: none; margin: 0px; padding: 0px;  }
.tblInner td { border: none; padding: 3px 10px 3px 0px;}

.tblRounded { border-radius: 10px 10px 10px 10px;  }
.tblRounded th { border-radius: 10px 10px 0px 0px; }
.tblRounded .tdBottomLeft { border-bottom-left-radius: 10px; }
.tblRounded .tdBottomRight { border-bottom-right-radius: 10px; }


/* Various */
.ixDvdr10 { height: 0px; border-top: dotted 1px #BF8F00; margin: 10px 0px 10px 0px; }
.ixDvdr6 { height: 0px; border-top: dotted 1px #BF8F00; margin: 6px 0px 6px 0px; }
.ixDvdr3 { height: 0px; border-top: dotted 1px #BF8F00; margin: 3px 0px 3px 0px; }
.comment { background-color: #FFFAE8; margin-top: 10px; padding: 8px; }
.hDvdr3 { margin: 3px 0px 3px 0px; height: 0px; }
.hDvdr5 { margin: 5px 0px 5px 0px; height: 0px; }
.hDvdr8 { margin: 8px 0px 8px 0px; height: 0px; }
.hDvdr10 { margin: 10px 0px 8px 0px; height: 0px; }
.HSpc5 { height: 5px; }
.HSpc10 { height: 10px; }

audio:focus { outline: none; }
.audioDiv { padding: 3px; border: 1px solid Gray; display: inline-block; border-radius: 10px; }

.tooltip { color: Maroon; cursor: pointer; }
.divTooltip { position: fixed; width: 300px; border: 3px solid Black; margin-top: 10px; margin-left: 5px; background-color: White; padding: 8px; left: 0px; top: 0px; z-index: 99; display: none; border-radius: 10px; }

.centereText { text-align: center; }
.leftText { text-align: left; }
.rightText { text-align: right; }

.hrzBusCrdFrm { padding: 13px 12px 10px 13px; width: 259px; height: 149px; text-align: center; text-align: center; background-image: url('../Images/Frame_284x172.png'); }
.hrzBusCrdFrm img {height:145px; width:108px;} .govFrame .noImg {height:143px; width:106px; background-color: White; border: dotted 1px Gray;}

.btnImg {border: none;}
.btn { font-weight: normal; cursor: pointer;}
.btnBig { font-weight: bold; cursor: pointer;}

.spacedList1 li { margin: 6px 0px 0px -10px; }

/* Parents' Marketplace styles - begin */
#pmLeft { width: 684px; float: left; }
#pmVDvdr { width: 0px; height: 780px; border-left: solid 1px Silver; float: left; margin: 0px 5px 0px 0px; }
#pmRight { width: 240px; float: right; }
.pmAdBox { width: 325px; height: 200px; border: 1px dotted Silver; margin: 0px 15px 15px 0px; overflow: hidden; float: left; }
.pmAdImg { width: 325px; height: 200px; border: none; }
.pmTxtAdBox { margin: 5px; width: 315px; height: 190px; overflow: hidden; }
.pmTxtAdTop { height: 136px; overflow: hidden; text-align: center; }
.pmTxtAdHdg { font-weight: bold; font-size: 14px; }
.pmTxtAdBody { margin-top: 5px; font-size: 13px; }
.pmTxtAdContact { font-weight: bold; text-align: center; margin-top: 5px; }
.pmAdBoxRight {width: 228px; border: 1px dotted Silver; float: right; overflow: hidden;}


/* SchoolShop styles - begin */
.IfsContainer { border: 1px solid Gray; border-radius: 10px; margin-bottom: 5px; width: 100%; float: left; }
.ifsExtraInfo { margin: 15px; }
.ifsFrameDvdr { clear: both; font-size: 5px; height: 5px; }

.ItemForSale { border: 1px solid Gray; border-radius: 10px; padding: 10px; width: 325px; text-align: center; float: left; margin: 15px;  }
.ItemForSale .ifsName { display: none; }
.ItemForSale h2 { margin: 0px 0px 5px 0px; }
.ItemForSale img { width: 325px; height: 200px; }
.ItemForSale h4 { margin: 5px 0px 5px 0px; }
.ItemForSale table { margin: 0px auto 0px auto; }
.ItemForSale table td { text-align: right; padding: 0px 5px 0px 5px; }

.ItemForSale .tblPriceOpts { width: 100%; border-top: 1px solid Gray; border-left: 1px solid Gray; margin: 20px 0px 10px 0px; }
.ItemForSale .tblPriceOpts th { border-right: 1px solid Gray; border-bottom: 1px solid Gray; padding: 3px; }
.ItemForSale .tblPriceOpts td { border-right: 1px solid Gray; border-bottom: 1px solid Gray; padding: 3px; }

.ItemForSale .tblBuyNowForm { width: 100%; margin-top: 15px; display: none; }
.ItemForSale .tblBuyNowForm td { text-align: left; padding: 3px 3px 3px 0px; vertical-align: top; } 
.ItemForSale .tblBuyNowForm .Col1st{ width: 110px; } 
.ItemForSale .tblBuyNowForm .txb { width: 200px; }
.ItemForSale .tblBuyNowForm .txa { width: 100%; margin-top: 3px; }
.ItemForSale .tblBuyNowForm .div { width: 204px; }
.ItemForSale .tblBuyNowForm .chb {  }


.ShoppingBasketMonitorPane { position: fixed; top: 0px; left: 0px; margin-top: 10px; /* see div_PageTopSpace */ margin-left: 5px;
                          background-color: White; border: 3px solid Black; border-radius: 10px; padding: 5px; display: none; }
.shoppingBasketCounter { font-size: 20px; font-weight: bold; margin-right: 5px; }
.shoppingBasketAmount { font-size: 20px; font-weight: bold;  }

/* SchoolShop styles - end */


.ttest { color: Orange; }