@charset "utf-8";
/* CSS Document */
/*
BODY,DIV,TH,TD,P,INPUT,SELECT,TEXTAREA,TT {
	font: 11pt normal medium Arial, Helvetica, Sans-serif;
	color: #000000;
}
*/
blockquote {
  background: transparent url(images/OpenQuotes.gif) left top no-repeat;
}
blockquote div {
  padding: 0 28px;
  background: transparent url(images/CloseQuotes.gif) right bottom no-repeat;
}
/* Begin TOGGLE */
label.toggle { cursor: pointer; color: #068 }
input.toggle { display: none; }
input.toggle:checked+div { display: none; }

.testbox {
 /*border: 1px dashed #489;*/
 background: #cef;
 padding: 8px;
}
.demo 
{
   
  margin: 16px;
  padding: 16px;
  /*background: #ffe;*/
  border: 1px solid #cc4;
}
/* End TOGGLE */

.SmallNote:link {
	COLOR: #081589;
	TEXT-DECORATION: none;
	FONT-SIZE: 9px;
	FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:visited {
	COLOR: #081589;
	TEXT-DECORATION: none;
	FONT-SIZE: 9px;
	FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:hover {
	COLOR: #081589;
	TEXT-DECORATION: underline;
	FONT-SIZE: 9px;FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}
.SmallNote:active {
	COLOR: #081589;
	TEXT-DECORATION: none;
	FONT-SIZE: 9px;FONT-FAMILY: Arial, Verdana, Helvetica, Sans-serif;
}

.mlClearRight {
	clear: right;
}


.mlClearLeft {
	clear: left;
}









/* Page system */

/* for all browsers that understand min-width */
.mlPageBodyOuter {
	min-width:800px;
	max-width: 1200px;
}


/* the bodge for IE6 browsers */
* html .mlPageBodyOuter {border-left:800px solid #fff; position:relative; float:left; z-index:1;}
* html .mlPageBody {margin-left:-800px; position:relative; float:left; z-index:2;}


/* New MastHead */

#mlMasHeadUtilities {
	color: #ccc;
	background-color: #4c3230;  /* #6A504F;*/
	padding: 2px 1em;
	border-bottom: 1px solid #ccc; /* #251110; */
}

#mlMasHeadUtilities a {
	font-weight: bold;
	color: white;
}

#mlMasHeadUtilities a:hover {
	color: yellow;
}
/*//Mantralingua LOGO//*/

#mlMastHeadLeft {
	width: 205px;
	height: 192px;
	background: url(images/MastHeadLeft.jpg) no-repeat;
	float: left;
}
/*//Mantralingua logo Mouse over block//*/
#mlMastHeadLeft a {
	display: block;
	font-size: 1px;
	float: left;
	position: relative;
}
/*//Mantralingua logo Click link//*/
#mlMastHeadLeft #mlMastHeadhome {
	width: 205px;
	height: 192px;
	
}

#mlMastHead {
	height: 192px;
	background: url(images/MastHeadBG.jpg) top left repeat-x;
	margin-bottom: 2px;
}

#mlMastHeadRight {
	width: 162px;
	height: 192px;
	background-image: url(images/MastHeadRight.png);
	float: right;
	position: relative;
}


#mlMastHeadRight a {
	display: block;
	font-size: 1px;
	float: left;
	position: relative;
}

#mlMastHeadRight #mlMastHeadAward1 {
	width: 74px;
	height: 76px;
	top: 30px;
}

#mlMastHeadRight #mlMastHeadAward2 {
	width: 74px;
	height: 76px;
	top: 30px;
}

#mlMastHeadRight #mlMastHeadAward3 {
	clear: left;
	width: 74px;
	height: 78px;
	top: 34px;
}

#mlMastHeadRight #mlMastHeadAward4 {
	width: 74px;
	height: 82px;
	top: 34px;
}




/*
#mlMastHeadTagline {

	width: 359px;
	height: 26px;

	height: 192px;
	background: url(images/MastHeadTagline.jpg) bottom center no-repeat;
	margin-left: 240px;
	margin-right: 152px;
}*/


#mlMastHeadCoverflow {
	width: 410px;
	height: 145px;
	margin: 0 auto;
	padding-top: 12px;
}


/* Main Page*/

#mlPageMain {
	clear: both;
	margin: 0;
}



/* Left-hand column */

#mlPageLeft {
	float: left;
	width: 211px;
	overflow: hidden;
	background-image: url(images/static/left-bg.png);
	
}

* html #mlPageLeft { margin: 0 -3px; }

#mlMLLogo {
	display: block;
	/*background: url(images/MastHeadLeft.jpg) no-repeat;*/
	background-image: url(images/MantraLingua/MLLogo.jpg);
	width: 211px;
	height: 279px;
}

.mlSideSpacer {
	background-color: white;
	height: 2px;
	margin: 3px 3px 3px 0;
	font-size: 1px;
}

#mlVideoLink {
	display: block;
	background: url(images/VideoLinkButton.jpg) top left no-repeat;
	width: 204px;
	height: 42px;
	border: solid 2px #777;
}

#mlSaleLink {
	display: block;
	background: url(images/SideSale.gif) top left no-repeat;
	width: 208px;
	height: 168px;
	border: none;
}

#mlThemeOfTheWeek {
	display: block;
	background: url(images/ThemeOfTheWeekBETT.jpg) top left no-repeat;
	width: 204px;
	height: 260px;
	border: solid 2px #777;
}
/*
#mlSpecialOffers {
	display: block;
	background: url(images/SpecialOfferSidebar2.jpg) top left no-repeat;
	width: 205px;
	height: 34px;
	border: solid 1px white;
}*/

#mlNewLanguage {
	display: block;
	background: url(images/Shilluk.png) top left no-repeat;
	width: 205px;
	height: 45px;
	border: solid 1px white;
}
/*
#mlBETTshortlist {
	display: block;
	background: url(images/BETT-finalist.png) top left no-repeat;
	width: 205px;
	height: 212px;
	border: solid 1px white;
}*/
#mlGoodQuote {
	display: block;
	background: url(images/john_bald6.png) top left no-repeat;
	width: 205px;
	height: 130px;
	border: solid 1px transparent;
}

a#mlGoodQuote:hover {
	border: solid 1px blue;
}

#mlprimaryshow {
	display: block;
	background: url(images/primary_languages_show.png) top left no-repeat;
	width: 205px;
	height: 166px;
	border: solid 1px transparent;
}

#mledshow2010-1 {
	display: block;	
	background: url(images/ed-show-1.png) top center no-repeat;
	width: 200px;
	height: 121px;
	border: solid 1px transparent;
	margin-left: 4px;
}

a#mledshow2010-1:hover {
	border: solid 1px #ABA9A9;
	
}


#mlafrica {
	width: 700px;
    height:1378px;
	background-image: url(images/elearning_africa.jpg);
	
	position: relative;
	
}

#mlafrica a {
	display: block;
	font-size: 1px;
	float: left;
	position: relative;
}

#mlafrica #mlAfrica_link1 {
	width: 196px;
	height: 223px;
	top: 405px;
	left: 60px;
}
#mlafrica #mlAfrica_link2 {
	width: 196px;
	height: 223px;
	top: 405px;
	left: 82px;

}
#mlafrica #mlAfrica_link3 {
	width: 196px;
	height: 223px;
	top: 405px;
	left: 102px;

}

#mlafrica #mlAfrica_link4 {
	width: 196px;
	height: 223px;
	top: 425px;
	left: 60px;
}

#mlafrica #mlAfrica_link5 {
	width: 196px;
	height: 223px;
	top: 425px;
	left: 82px;
}

#mlafrica #mlAfrica_link6 {
	width: 196px;
	height: 223px;
	top: 425px;
	left: 102px;
}
#mlafrica #mlAfrica_link7 {
	width: 196px;
	height: 223px;
	top: 445px;
	left: 60px;
}
#mlafrica #mlAfrica_link8 {
	width: 196px;
	height:223px;
	top: 445px;
	left: 82px;
}

#mlafrica #mlAfrica_link9 {
	width: 196px;
	height: 223px;
	top: 445px;
	left: 102px;
}

#mlafrica #mlAfrica_link10 {
	width: 290px;
	height: 120px;
	top: 465px;
	left: 60px;
}
#mlafrica #mlAfrica_link11 {
	width: 290px;
	height: 120px;
	top: 465px;
	left: 82px;
}



/*
#mledshow2010-2 {
	display: block;
	background: url(images/ed-show-2.png) top left no-repeat;
	width: 201px;
	height: 195px;
	border: solid 1px transparent;
	margin-left: 4px;
}

a#mledshow2010-2:hover {
	border: solid 1px #ABA9A9;
}*/
.mledshow2010-4 {
	display: block;	
	background: url(images/Ed-show-4.png) top center no-repeat;
	width: 201px;
	height: 8px;
	margin-left: 4px;
}
/*
#mledshow2010-3 {
	display: block;
	background: url(images/ed-show-3.png) top left no-repeat;
	border: solid 1px transparent;
	width: 201px;
	height: 33px;
	margin-left: 4px;
}

a#mledshow2010-3:hover {
	border: solid 1px #ABA9A9;
}


*/
#BeBilingualLink {
	display: block;	
	background: url(images/BeBilingual.png) top center no-repeat;
	width: 201px;
	height: 79px;
	margin-left: 4px;

}
#Learntoread {
	display: block;	
	background: url(images/Learntoread.png) top center no-repeat;
	width: 197px;
	height: 177px;
	margin-left: 4px;

}

/*
#Gadgetshow {
	display: block;	
	background: url(images/Gadgetshow.png) top center no-repeat;
	width: 205px;
	height: 109px;
	
}*/


#mllondonbookfair2009 {
	display: block;
	background: url(images/londonbookfair.png) top left no-repeat;
	width: 205px;
	height: 93px;
	border: solid 1px transparent;
}

#mlchildrenshow2009 {
	display: block;
	background: url(images/children.jpg) top left no-repeat;
	width: 205px;
	height: 114px;
	border: solid 1px transparent;
}

a#mlchildrenshow2009:hover {
	background: url(images/childrenlink.jpg);
}

#mlECatalog {
	display: block;
	background: url(images/OpenBookForPageTurnerSMALL.png) top left no-repeat;
	width: 205px;
	height: 169px;
	border: solid 1px transparent;
}



a#mlECatalog:hover {
	border: solid 1px #ABA9A9;
}


#mlPENfriend {
	display: block;
	background: url(images/PENfriend.jpg) top left no-repeat;
	width: 204px;
	height: 113px;
	border: solid 1px transparent;
}

a#mlPENfriend:hover {
	border: solid 1px red;
}


#mlBirdMike {
	display: block;
	background: url(images/BirdMIKESidebar.jpg) top left no-repeat;
	width: 204px;
	height: 112px;
	border: solid 1px transparent;
}

a#mlBirdMike:hover {
	border: solid 1px red;
}

A#mlVideoLink:hover,
A#mlThemeOfTheWeek:hover {
	border: solid 2px red;
}

/*
#mlUserLogin {
	background: url(images/SideUserAreaBackground.gif) top left no-repeat;
	margin:0px 3px 3px 3px;
	
}

#mlUserLoginHeader {
	background: url(images/SideUserArea.gif) top left no-repeat;
	width: 208px;
	padding-top: 100px;
}

#mlUserLoginFooter {
	background: url(images/SideUserAreaFooter.gif) top left no-repeat;
	width: 208px;
	height: 86px;
}*/


.mlLoginBox {
	font: bold 10pt Arial, Helvetica, sans-serif;
	padding: 20px;
}

.mlLoginBox INPUT {
	width: 160px;
	margin-bottom: 10px;
}

.mlLoginBox A {
	display: block;
}

.mlLoginBox .Login {
	float: right;
}

.mlLoginBox .Register {
	clear: right;
	margin-top: 2em;
}

.mlLoginBox .PasswordRecovery {
	margin-top: 0.5em;
}


.mlPaymentMethods {
	background-color: #E1E0E0;
	margin: 3px 3px 3px 0;
	padding: 4px;
}

#mlHelpSideBox {
	background: url(images/SideHelpBackground.gif) top left repeat-y;
	margin: 3px 3px 8px 0;
	overflow: hidden;
}

#mlHelpSideBoxHeader {
	background: url(images/SideHelpHeader.gif) top left no-repeat;
	width: 208px;
	padding: 90px 20px 10px 20px;
	font-weight: bold;
}

#mlHelpSideBoxFooter {
	background: url(images/SideHelpFooter.gif) top left no-repeat;
	width: 208px;
	height: 47px;
}







#mlPageCore {
	margin-left: 211px;
}

* html #mlPageCore { 	margin-left: 202px;}

#mlPageMainGrey #mlPageCore {
	margin-left: 211px;
	padding-left: 3px;
}





/* Utility Header */
#mlUtilityHeader {
	font: normal 10pt Verdana, Arial, Helvetica, sans-serif;
	margin: 0 1em;
}

#mlUtilLeft {
	float: left;
	width: 490px;
/*	height: 14px; */
	margin: 3px;
}


#mlUtilityButtons {
	display: block;
	background: url(images/UtilityControls.gif) transparent top left no-repeat;
	height: 145px;
}

.mlUtilLink {
	overflow: none;
	display: block;
	float: left;
	margin-right: 3px;
}

#mlUtilHome {
	background: transparent top left no-repeat;
	height: 21px;
	width: 62px;
}

#mlUtilAboutUs {
	background: transparent top left no-repeat;
	height: 21px;
	width: 86px;
}

#mlUtilContactUs {
	background: transparent top left no-repeat;
	height: 21px;
	width: 102px;
/*	margin-right: 40px; */
}


#mlMainButtons {
	background: url(images/ButtonBar.gif) #E1E0E0 top left no-repeat;
	height: 29px;
	margin-top: 3px;
	margin-right: 3px;
}



.mlButtonLink {
	overflow: none;
	display: block;
	float: left;
	margin-top: 3px;
	margin-right: 4px;
	z-index: 10;
	height: 23px;
}



#mlButtonBooks {
	background: transparent top left no-repeat;
	width: 80px;
	margin-left: 5px;
}

#mlButtonPosters {
	background: transparent top left no-repeat;
	width: 80px;
}

#mlButtonCDRoms {
	background: transparent top left no-repeat;
	width: 80px;
}

#mlButtonToys {
	background: transparent top left no-repeat;
	width: 80px;
}

#mlButtonRecorderPEN {
	background: transparent top left no-repeat;
	width: 100px;
}

#mlButtonCrayonPEN {
	background: transparent top left no-repeat;
	width: 96px;
}









.mlSearch {
	background-color: #a8e1fd;
	margin: 3px 3px 3px 0;
	padding: 0;
/*	padding: 3px; */
	height: 28px;
	padding-top: 2px;
}


.mlSearch FORM {
	padding: 0;
	margin: 0;
	border: 0;
}

.mlSearchTable {
	width: 99%;
	padding: 0;
	margin: 0;
	border: 0;
}

.mlSearchTable .mlRow {
	vertical-align: middle;
}

.mlSearch .mlLabel {
	text-align: right;
	width: 4em;
}

.mlSearchLabel {
	font: bold 12pt Arial, Helvetica, sans-serif;
	color: #333;
	margin-left: 0.25em;
}

.mlSearch .mlButton {
	width: 33px;
}


#mlSearchGoButton {
	display: block;
	float: right;
	width: 27px;
	height: 1em;;
	background: #cacaca url(images/MantraLingua/ButtonGo.gif) center center no-repeat;
	border: solid 1px #bcbbbb;
}



#mlSearchBoxFrame {
	border: solid 1px #cacaca;
	background-color: #fdf9f2;
}

#mlSearchBox {
	border: none;
	background: transparent;
	padding-left: 3px;
	width: 98%;
}


#mlAdvancedSearch {
	width: 114px;
}

#mlAdvancedSearchLink {
	background: url(images/AdvancedSearch.gif) top left no-repeat;
	display: block;
	width: 114px;
	height: 23px;
}








/* Main Navigation */


#mlMainNav {
	background-color: #e1e0e0;
	margin-right: 3px;
}



#mlMainNavMenu {
	margin-top: 3px;
	height:20px; 
	width: 528px; 
	background: url(images/MainNav.gif) transparent top left no-repeat;
}

#mlMainNavMenu ul ul {
	top: 20px
}


/*
#MenuNavProducts ul {
	left: 3px;
}

#MenuNavSupport ul {
	left: 5px;
}

#MenuNavResources ul {
	left: 8px;
}
*/

/* style the second level hover */
#MenuNavLanguages ul a:hover{background: #a2a2ff; color: #00f;}

#MenuNavProducts ul a:hover{background: #85e962; color: #00f;}
#MenuNavProducts ul :hover > a {background: #85e962; color: #00f;}

#MenuNavSupport ul a:hover{background: #f6d244; color: #00f;}
#MenuNavSupport ul :hover > a {background: #f6d244; color: #00f;}

#MenuNavResources ul a:hover{background: #f27878; color: #00f;}
#MenuNavResources ul :hover > a {background: #f27878; color: #00f;}

#MenuNavVideos ul a:hover{background: #7cbef8; color: #00f;}
#MenuNavVideos ul :hover > a {background: #7cbef8; color: #00f;}



#MenuNavLanguages ul a, #MenuNavLanguages ul  a:visited { background-color: #ddddff; }

#MenuNavProducts ul a, #MenuNavProducts ul a:visited {background:#d2f7c5;}

#MenuNavSupport ul a, #MenuNavSupport ul a:visited {background:#fceeb8;}

#MenuNavResources ul a, #MenuNavResources ul a:visited {background:#fcc9c9;}

#MenuNavVideos ul a, #MenuNavTeachersNotes ul a:visited {background:#cfe7fc;}


#MenuNavLanguages,
#MenuNavProducts,
#MenuNavSupport,
#MenuNavResources,
#MenuNavVideos {
	height: 20px;
	border-right: solid 3px white; 
	position: relative;
	z-index: 200;
}
#MenuNavaddthis {
	height: 0px;
	width: auto ;
	border-right: solid 3px white; 
	position:relative;
	z-index: 201;
	float: right;
	padding-right: 10px;
	padding-top:2px;
}

#MenuNavLanguages .mlTopLevelMenuLink {
	display: block;
	width: 118px;
	height: 20px;
}

#MenuNavProducts .mlTopLevelMenuLink {
	display: block;
	width: 99px;
	height: 20px;
}

#MenuNavSupport .mlTopLevelMenuLink {
	display: block;
	width: 96px;
	height: 20px;
}

#MenuNavResources .mlTopLevelMenuLink {
	display: block;
	width: 113px;
	height: 20px;
}

#MenuNavVideos .mlTopLevelMenuLink {
	display: block;
	width: 87px;
	height: 20px;
}



#MenuNavLanguages li {
	width:300px;
}

#MenuNavLanguages a.mlLeft,
#MenuNavLanguages a.mlLeft:visited {
	float: left;
	border-right: 1px solid white;
}

#MenuNavLanguages a.mlRight,
#MenuNavLanguages a.mlRight:visited {
	float: left;
}



* html #MenuNavLanguages .mlTopLevelMenuLink {
	padding-bottom: 0px;
}

* html #MenuNavProducts .mlTopLevelMenuLink {
	padding-bottom: 0px;
}

* html #MenuNavAges .mlTopLevelMenuLink {
	padding-bottom: 0px;
}

* html #MenuNavSupport .mlTopLevelMenuLink {
	padding-bottom: 0px;
}

* html #MenuNavTeachersNotes .mlTopLevelMenuLink {
	padding-bottom: 0px;
}


/*
If you're reading this Stu, many thanks!
===================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
===================================================================
*/

.UltimateMenu {font-size:0.85em; position:relative; z-index:200;}
/* hack to correct IE5.5 faulty box model */
* html .UltimateMenu {width:746px; w\idth:745px;}
/* remove all the bullets, borders and padding from the default list styling */
.UltimateMenu ul {padding:0;margin:0;list-style-type:none;}
.UltimateMenu ul ul {width:149px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.UltimateMenu li {float:left;position:relative;}
/* style the links for the top level */
.UltimateMenu a, .UltimateMenu a:visited {display:block;font-size:11px;text-decoration:none; color:#fff; width:138px; background: transparent; line-height:29px;}
/* a hack so that IE5.5 faulty box model is corrected */
* html .UltimateMenu a, * html .UltimateMenu a:visited {width:149px; w\idth:138px;}

/* style the second level background */
.UltimateMenu ul ul a.drop, .UltimateMenu ul ul a.drop:visited {background: #e1e1e0 url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}
/* style the second level hover */
.UltimateMenu ul ul a.drop:hover{background:#c9ba65 url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}
.UltimateMenu ul ul :hover > a.drop {background:#c9ba65 url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}
/* style the third level background */
.UltimateMenu ul ul ul a, .UltimateMenu ul ul ul a:visited {background:#e2dfa8;}
/* style the third level hover */
.UltimateMenu ul ul ul a:hover {background:#b2ab9b;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.UltimateMenu ul ul {visibility:hidden;position:absolute;height:0;left:0; width:149px;border-top:1px solid #fff;}
/* another hack for IE5.5 */
* html .UltimateMenu ul ul {top:30px;t\op:31px;}

/* position the third level flyout menu */
.UltimateMenu ul ul ul{left:149px; top:-1px; width:149px;}

/* position the third level flyout menu for a left flyout */
.UltimateMenu ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.UltimateMenu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level menu */
.UltimateMenu ul ul li {border:1px solid #fff; border-width:0 0 1px 0;}

/* style the second level links */
.UltimateMenu ul ul a, .UltimateMenu ul ul a:visited {background:#e1e0e0; color:#000; height:auto; line-height:1em; padding:5px 10px; width:128px;border-width:0 1px 1px 1px;}
/* yet another hack for IE5.5 */
* html .UltimateMenu ul ul a, * html .UltimateMenu ul ul a:visited {width:150px;w\idth:128px;}

/* style the top level hover */
.UltimateMenu a:hover, .UltimateMenu ul ul a:hover{text-decoration: none;}
.UltimateMenu :hover > a, .UltimateMenu ul ul :hover > a {text-decoration: none;}

/* make the second level visible when hover on first level list OR link */
.UltimateMenu ul li:hover ul,
.UltimateMenu ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.UltimateMenu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.UltimateMenu ul :hover ul :hover ul{ visibility:visible;}




/* Shopping Cart */
#mlShoppingCart A {
	margin: 0 0.25em;
}

#mlShoppingCartTotals {
	color: red;
}

#mlShoppingCartNav {
	font-weight: bold;
}


/* Page Content */

#mlMainArea TABLE {
	clear: none;
}


/* Page border */

#mlPageBottomBorder {
	clear: both;
	height: 1.5em;
	margin: 1em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: smaller;
	color: #666666;
	border-top: solid 1px #cccccc;
}

#mlPageBottomBanner {
	background: url(images/FooterBannerSmall.gif) top left repeat-x;
	height: 50px;
}

#mlPageBottomBorder A {
	color: #555555;
}

#mlPageBottomLeft {
	float: left;
	padding: 0.25em 1em;
}

#mlPageBottomRight {
	float: right;
	text-align: right;
	padding: 0.25em 1em;
}


/* Shopping Cart */

#mlShoppingCart {
	float: right;
	background-color: #e1e0e0;
	margin-right: 3px;
	padding: 0.5em;
	border: solid 2px #ff6363;
}

#mlShoppingCart A {
	margin: 0 0.25em;
}

#mlShoppingCartTotals {
	color: red;
}

#mlShoppingCartNav {
	font-weight: bold;
}





/* Search Results & Filter Panel */

div.mlSearchResults {
	padding: 1em;
}

h2.mlSearchResults {
	width: 157px;
	height: 14px;
	background: url(images/SecSearchResults.gif) top left no-repeat;
	margin-top: 0;
}


.mlFilterPanel {
	background-color: #dbe5fc;
	margin: 1em;
}

.mlFilterPanel .mlTopRowLeft {
	background: url(images/FilterTL.gif) top left no-repeat;
	height: 7px;
}

* html .mlFilterPanel .mlTopRowLeft {
	margin-left: -3px;
	margin-bottom: -3px;
}

.mlFilterPanel .mlTopRowRight {
	background: url(images/FilterTR.gif) top right no-repeat;
	height: 7px;
}


.mlFilterPanel .mlTopBorder {
	border-top: 2px solid #b3b2b2;
	margin: 0 7px;
	font-size: 1px;
}


.mlFilterPanel .mlFilterSides {
	border-left: 2px solid #b3b2b2; 
	border-right: 2px solid #b3b2b2;
}

.mlFilterPanel .mlFilterControlsContainer {
	padding-bottom: 0.5em;
	border-bottom: 1px solid #d7dbe6;
}


.mlFilterPanel .mlFilterLabel {
	vertical-align: top;
	font: bold small Arial, Helvetica, sans-serif;
	padding: 0.25em;
}


.mlFilterPanel .mlSearchControls {
	padding-top: 7px;
	border-top: 1px solid #baccf7;
	background-color: #b0c7fd;
	clear: right;
	font: bold small Arial, Helvetica, sans-serif;	
}


.mlFilterPanel a:hover,
.mlFilterPanel ul ul a:hover{color:#fff; background: #c2c1c1;}

.mlFilterPanel P {
	margin: 0;
	padding: 0;
	font: normal 10pt Arial, Helvetica, sans-serif;
}


.mlFilterPanel .mlDownArrow {
	margin: 0.75em 0.5em 0 0;
	height: 9px;
	width: 12px;
	float: right;
}

.mlSearchPageNav {
	float: right;
	padding-right: 1em;
}


.mlSearchResultCount {
	padding-left: 0.5em;
}


span.mlCurentPage {
	background-color: #FFFF33;
	color: #FF6666;
}

.mlSearchPageNav A,
.mlSearchPageNav A:visited {
	color: #0000FF;
	text-decoration: none;
}

span.mlDisabledLink {
	color: #555;
}


.mlFilterPanel .mlBottomRowLeft {
	background: #b0c7fd url(images/FilterBL.gif) top left no-repeat;
	height: 7px;
}

* html .mlFilterPanel .mlBottomRowLeft {
	margin-left: -3px;
}

.mlFilterPanel .mlBottomRowRight {
	background: url(images/FilterBR.gif) top right no-repeat;
	height: 7px;
}

.mlFilterPanel .mlBottomBorder {
	border-bottom: 2px solid #b3b2b2;
	margin: 0 7px;
	height: 5px;
	font-size: 1px;
}

#mlFilterProductOptionsMenu,
#mlFilterLanguageOptionsMenu,
#mlFilterGenreOptionsMenu, 
#mlFilterAgesOptionsMenu {
	height: 2em;
}

#mlFilterProductOptionsMenu LI,
#mlFilterLanguageOptionsMenu LI,
#mlFilterGenreOptionsMenu LI,
#mlFilterAgesOptionsMenu LI {
	width: 148px;
}



#mlFilterProductOptionsMenu {
	position: relative;
	z-index: 104;
}

#mlFilterLanguageOptionsMenu {
	position: relative;
	z-index: 103;
}

#mlFilterGenreOptionsMenu {
	position: relative;
	z-index: 102;
}

#mlFilterAgesOptionsMenu {
	position: relative;
	z-index: 101;
}

#mlFilterProductOptionSetting,
#mlFilterLanguageOptionSetting,
#mlFilterGenreOptionSetting,
#mlFilterAgesOptionSetting {
	width: auto;
	height: auto;
	border: 1px solid #b3b2b2;
	padding: 0.3em;
	font: normal 10pt Arial, Helvetica, sans-serif;
	color: black;
}

#mlFilterProductOptionsMenu ul ul,
#mlFilterLanguageOptionsMenu ul ul,
#mlFilterGenreOptionsMenu ul ul,
#mlFilterAgesOptionsMenu ul ul {
	top: 1.75em;
	left: 0px;
}

#mlFilterLanguageOptionsMenu li li {
	width: 300px;
}


#mlFilterLanguageOptionsMenu a.mlLeft,
#mlFilterLanguageOptionsMenu a.mlLeft:visited {
	float: left;
}

#mlFilterLanguageOptionsMenu a.mlRight,
#mlFilterLanguageOptionsMenu a.mlRight:visited {
	margin-left: 149px;
}

.mlSearchResultItems {
	margin: 1em 1.5em;
}

.mlSortOrderControls {
	background-color: #dbe5fc;
	border: solid 1px #b3b2b2;
	padding:0.5em;
	float: right;
	font: bold small Arial, Helvetica, sans-serif;	
}

.SearchSortLinkSelected {
	margin: 0 0.5em;
	font: bold medium Arial, Helvetica, sans-serif;
	text-decoration: none;
}

.SearchSortLink {
	margin: 0 0.5em;
	text-decoration: none;
}

.mlSearchResultItems .mlProductsList {
	padding: 2em 0 0 0;
}

.mlPageNavPanel {
	background-color: #b0c7fd;
	margin: 1em;
}

.mlPageNavPanel .mlTopRowLeft {
	background: url(images/FilterTL2.gif) top left no-repeat;
	height: 7px;
}

.mlPageNavPanel .mlTopRowRight {
	background: url(images/FilterTR2.gif) top right no-repeat;
	height: 7px;
}


.mlPageNavPanel .mlTopBorder {
	border-top: 2px solid #b3b2b2;
	margin: 0 7px;
}


.mlPageNavPanel .mlFilterSides {
	border-left: 2px solid #b3b2b2; 
	border-right: 2px solid #b3b2b2;
	
}

.mlPageNavPanel .mlSearchControls {
	font: bold small Arial, Helvetica, sans-serif;	
}

.mlPageNavPanel  .mlBottomRowLeft {
	background: url(images/FilterBL.gif) top left no-repeat;
	height: 7px;
}

.mlPageNavPanel .mlBottomRowRight {
	background: url(images/FilterBR.gif) top right no-repeat;
	height: 7px;
}

.mlPageNavPanel .mlBottomBorder {
	border-bottom: 2px solid #b3b2b2;
	margin: 0 7px;
	height: 5px;
	font-size: 1px;
}



/* Product page */

#ProductContent {
	margin: 1em;
}


#ProductContent H2,
.mlStaticContent H2 {
	font: bold 14pt Arial, Helvetica, sans-serif;
	border-bottom: solid 2px #35BCFE;
}

#ProductContent  .mlBottomSection {
	margin: 1em 0;
	padding-bottom: 1em;
	border-bottom: solid 2px #35BCFE;
}

#ProductContent H3,
.mlStaticContent H3  {
	font: bold 12pt Arial, Helvetica, sans-serif;
	border-bottom: solid 2px #35BCFE;
}

#ProductContent P {
	margin-top: 0;
}

div.SaveMoneyLabel {
	background-image: url(images/save_money.gif);
	width: 57px;
	height: 57px;
	color: white;
	font: bold 60% Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0 auto;
}

#save_percent {
	display: block;
	padding-top: 28px;
	width: 57px;
}

.mlProductDescription {
	
	padding-left: 1em;
	
	border-left: solid 10px white; 
	
	background: url(images/SideUserAreaBackground.gif)repeat-x;
	
}

.mlLanguageVariants {
	margin: 0 0.5em 1em 0.5em;
	width:

}
.mlVariantsTable {
	width: 99%
}

.mlVariantsTable th {
	border-bottom: solid 2px #555;
	text-align: left;
	font: bold 12pt Arial, Helvetica, sans-serif;
}

.mlVariantsTable td.mlDescription {
	width: 30%;
}

mlVariantColHeading {

}

.mlVariantsTable tr {
}

.mlVariantsTable td {
	padding: 2px
}

.mlProductOptionNotes {
	margin-bottom: 0;
}

.mlGlobalButton {
	border: none;
	width: auto;
	margin: 1em;
}


.mlGlobalButton td{
	border: none;
	padding: 0;
}



td.mlFlag {
	border-bottom: dashed 1px black;
	width: 50px;
	text-align: right;
}

td.mlDescription {
	border-bottom: dashed 1px black;
	vertical-align: middle;
	font: bold medium Arial, Helvetica, sans-serif;	
}

td.mlBookIcon {
	border-bottom: dashed 1px black;
	width: 35px;
}


td.mlBook {
	border-bottom: dashed 1px black;
	vertical-align: middle;
}


table.mlBookPart {
	float:left;
	vertical-align: middle;
	height: 98%;
}


table.mlBookPart td {
	vertical-align: middle;
}



td.mlAudioFileIcon {
	border-bottom: dashed 1px black;
	width: 35px;
}


td.mlAudioFile {
	border-bottom: dashed 1px black;
	vertical-align: middle;
}

.mlEndPurchaseOptions {
	height: 6px;
	font-size: 1px;
	border-top: solid 2px #35BCFE;
/*	border-bottom: solid 2px #35BCFE; */
	margin: 30px 0;
}




/* General */

.mlWelcomeBox {
/*	width: 350px; */
	width: 44%;
	min-width: 350px;
	float: left;
	margin: 2%;
	text-align: center;
}


.mlHelpZone {
	margin: 1em;
}

.mlAddress {
	font-size: larger;
}

.mlAddress DIV {
	margin: 0;
}


.mlMantraLingua {
	font-size: x-large;
}

.mlAddressLine {
	font-weight: bold;
}


.mlTelephone {
	font-size: medium;
	margin: 1em 0;
}

.mlEmailContact {
}

.mlSmallNote {
	font-size: smaller;
}

.mlCompanyHilite {
	font-weight: bold;
}

li.mlInfoText {
	margin-bottom: 1em;
}



.mlInvoiceGroup {
	margin: 2em;
}

.mlInvoice {
	border: solid 2px #333;
	padding: 1em;
}

.mlStaticContent {
	margin: 15px;
}

.mlSection {
	font: Arial, Helvetica, sans-serif;
	padding: 1em;
}


.mlDialogBox {
	margin: 1em;
	padding: 0 1em;
}

div.mlDialogBoxHeading {
	font: bold 12pt Arial, Helvetica, sans-serif;
	border-bottom: solid 2px #35BCFE;
}


.mlDialogBoxMainContent {
	background-color: #E1E0E0;
	padding: 1em;
}



/* Fast Lane Checkout */

#mlPageMainGrey {
	clear: both;
	margin: 0 1em;
	background-color: #e1e0e0;
}


#mlPageMainGrey #mlPageCore {
	margin-left: 208px;
	padding-left: 3px;
	background-color: #fff;
}

#mlMLLogoFastLane {
	display: block;
	/*background: url(images/MastHeadLeft.jpg) no-repeat;*/
	background-image: url(images/MantraLingua/MLLogo.jpg);
	border-bottom: solid 3px white;
	width: 211px;
	height: 279px;
}

.mlSearchFiller {
	height: 45px;
	background-color: #e1e0e0;
	margin: 3px 3px 3px 0;
	padding: 3px;
}

H3.mlCart {
	font: bold 14pt Arial, Helvetica, sans-serif;
}

.mlCartBox {
	padding: 1em;
}

.mlCartBrief {
	padding: 1em;
}





.mlWelcomeTopPadding {
	margin-top: 1em;
	
}

.mlwelcometopimg 
{
    display: block;  
    background-position:center;
	height: 262px;
	width:auto;
	background-image: url({$ImagesDir}/phonics-pack-new.png);
	position: relative;
	float:none;
	margin:0.5em auto;
	text-align:center;
	clear: right;

}

.mlwelcometopimg img 
{
 
}


/* mlGallery-specific styles */

/* mlGallery container */
.mlGallery {
	text-align: center;    /* centers inline paragraphs */
	padding: 0.5em;
}
.mlGallery a {
	text-decoration: none;
	border: none;
}
.mlGallery a img {
	border: none;
	vertical-align: middle;
}

/* outer container for each image/caption pair */
.mlGallery p {
	display: inline;
	font-weight: bold;
	font-size: 75%;
}

/* For the <a> container, the best default display value is inline-table, but browser support isn't very good. Opera versions 6 and earlier totally mangle anything except display:table-cell, so that is set by default and the preferred display values are at the end of this stylesheet, within hacks that hide them from those Opera versions. No other browsers tested seemed to have any trouble with setting the different display values within a single rule. */

/* inner container for each image/caption pair */
.mlGallery a {
	display: table-cell;   /* default, for gecko & Opera6- */
	vertical-align: top;   /* aligns the img/caption container */
	min-width: 110px;      /* not always honored, but that's OK */
}




/* image container, sets height so image can be vertically centered and the caption starts in the same vertical position regardless of image height, except WinIE does not apply line-height to images. oh well, most other browsers do... */
.mlGallery span {
	display: block;        /* fill container width, force a line break */
	height: 110px;         /* a bit larger than highest img */
	line-height: 110px;    /* same value as height */
	text-align: center;
}

/* caption container, sets height (for 2 lines) so each outlined image/caption pair is the same height (except in WinIE) */
.mlGallery i {
	display: block;
	height: 1em;         /* makes each box a consistent height */
	text-align: left;
	font-style: normal;
}

/* Owen hack, hides from WinIE, Opera versions 6- & some KHTML */
head:first-child+body .mlGallery a {
	display: table-cell;   /* gecko & Opera6- */
	display: inline-table; /* Safari & some other browsers */
	display: inline-block; /* WinIE & some other browsers */
}

/* star-html hack to show <a> rule(s) just to IE (Win and Mac) */
* html .mlGallery a {
	display: table-cell;   /* gecko & Opera6- */
	display: inline-table; /* Safari & some other browsers */
	display: inline-block; /* WinIE & some other browsers */
}
/* image is not clickable in WinIE with display:block :( \*/
* html .mlGallery span {
	display: inline;
}
* html .mlGallery a:hover i {
	cursor: hand; /* otherwise cursor doesn't change over block <i> */
} /* end WinIE hacks */

/* end hacks */






.mlLanguageFeature .mlGallery a:hover {
	background-color: blue;
	color: yellow;
}

.mlLanguageFeature .mlGallery a {
	padding: 0 0.25em 0.25em 0.25em;
	background-color: #DDE8FF;
	*border-left:0.25em solid white; /* targets IE6 and 7 */
	*border-bottom:0.25em solid white; /* targets IE6 only */
	width: 13.2em;            /* adjusts with text size */
}

.mlLanguageFeature .mlGallery a.mlLangHilite {
	background-color: yellow;
}

.mlLanguageFeature p.mlSecondTagline {
	text-align: center;
	/*font: 100% bold;*/
	font-family: Arial;
	font-size:small;
}

.mlLanguageFeature p.mlSecondTagline {
	text-align: center;
	font-weight: bold;
}

.mlLanguageFeature p.mlSecondTagline a.mlTalkingPEN {
	color: #36BBFE;
}


h2#mlHomePageTagline {
	color: black;
/*	border-bottom: none;*/
	margin: 0.5em auto;
/*	margin-top: 2em;
	margin-bottom:0.5em; */
	text-align: center;
	width: 90%;
}


.mlWelcomeFeature .mlGallery p {
	padding: 0.25em;
}


/*////////////////////////////////////////////////////////
//////////////zoom in css////////////////////////////
//////////////////////////////////////////*/
/* Copyright 2008 MagicToolBox.com. To use this code on your own site, visit http://magictoolbox.com */

/* CSS class for zoomed area */
.MagicZoomBigImageCont {
	border:			1px solid #91b817;
}

/* Header look and feel CSS class */
/* header is shown if "title" attribute is present in the <A> tag */
.MagicZoomHeader {
	font:			10px Tahoma, Verdana, Arial, sans-serif;
	color:			#fff;
	background:		#91b817;
	text-align:     center !important; 
}


/* CSS class for small looking glass square under mouse */
.MagicZoomPup {
	border: 		1px solid #aaa;
	background: 	#ffffff;
	cursor:			hand;
}

/* CSS style for loading animation box */
.MagicZoomLoading {
	text-align:		center;
	background: 	#ffffff;
	color:			#444;
	border: 		1px solid #ccc;
	opacity:		0.8;
	padding:		3px 3px 3px 3px !important;
	display: 		none; /* do not edit this line please */
}

/* CSS style for gif image in the loading animation box */
.MagicZoomLoading img {
	padding-top:	3px !important;
}
/* 2008 MagicToolbox.com. To use this code on your own site, visit http://www.magictoolbox.com */

/* CSS class for thumbnail link <A> */
.MagicThumb {
    cursor: url(cursor/zoomin.cur), pointer;
    outline: none;
}

/* CSS class for the thumbnail link <A> when the big image is zoomed */
.MagicThumb-zoomed { cursor: default; }

/* CSS class for span inside the thumbnail <A> */
.MagicThumb span { display: none; }

/* CSS class for the thumbnail image */
.MagicThumb img { border: 1px solid #808080; outline: none; }

/* CSS class for the big image while zooming */
.MagicThumb-image { border: 1px solid #cccccc; outline: none; }

/* CSS class for the zoomed big image */
.MagicThumb-image-zoomed { cursor: url(cursor/zoomout.cur), pointer; }

/* CSS class for the caption under the big zoomed image */
.MagicThumb-caption {
    color: #333333;
    background-color: #F0F0F0;
    border: 1px solid #CCCCCC;
    border-top: none;
    font-family: Verdana, Helvetica;
    font-size: 11px;
    padding: 8px 16px;
}

/* CSS class for the control bar */
.MagicThumb-controlbar {
	display: block;
	height: 18px;
}

.MagicThumb-controlbar a {
	display: block;
	width: 18px;
	height: 18px;
	margin: 0px 1px;
	outline: none;
	float: left;
	overflow: hidden;
}

.MagicThumb-controlbar a span {
	display: block;
	width: 1000px;
	height: 1000px;
	background: transparent url(graphics/controlbar.png) no-repeat 0 0;
	outline: none;
	position: absolute;
	left: 0px;
	top: 0px;
}

/* CSS class for the loading message box */
.MagicThumb-loading {
	border: 1px solid #000000;
	background: #ffffff url(graphics/loader.gif) no-repeat 2px 50%;
	padding: 2px 2px 2px 22px;
	margin: 0;
	text-decoration: none;
	text-align: left;
	font-size: 8pt;
	font-family: sans-serif;
}