/* 2009 Theme Site - TD Summer Reading Club */

body {
margin: 0;
padding: 0;
background-color: #545487;
color: #000;
}

body, p, a, div, span, table, td, th, ul, ol, li, dl, dt, dd, textarea, input, form, fieldset, blockquote, select, option, label, button {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 100%;
}

body {font-size: 80%;}

/* Headings */

h1, h2, h3, h4, h5, h6 {
font-family: verdana, arial, helvetica, sans-serif;
background-color: transparent;
font-weight: bold;
}

h1 {font-size: 140%; visibility: hidden} /* This header will show for the text only browsers */
h2 {font-size: 130%; margin-top: 0;}
h3 {font-size: 120%; margin-top: 20px;}
h4 {font-size: 110%; }
h5 {font-size: 105%; }
h5 {font-size: 100%; }

/* links */

a, a:link {
color: #000;
background-color: transparent;
}

a:visited {
color: #663300;
background-color: transparent;
}

a img {border: none;}

/* Main Page */

div.page {
width: 760px;
margin: 0 auto;
padding: 0;
background-color: #fff;
color: #000;
}

/* English Header */
div.header-eng {
margin: 0;
padding: 0;
background: #000 url(../091/009003-09-mmb01-e.jpg) no-repeat 0 20px;
height: 310px;
}

/* French  Header */
div.header-fre {
margin: 0;
padding: 0;
background: #000 url(../091/009003-09-mmb01-f.jpg) no-repeat 0 20px;
height: 310px;
}

/* Top Navigation */

div#top-nav {
text-align: right;
padding: 3px 20px 3px 0;
margin: 0;
background-color: #000;
color: #fff;
}

div#top-nav a, div#top-nav a:link, div#top-nav a:visited, div#top-nav a:hover, div#top-nav a.active{
color: #fff;
background-color: #000;
text-decoration: none;
}

/* Main Navigation */

div.navigation {
background-color: transparent;
color: #fff;
margin: 0;
padding: 0;
position: absolute;
top: 220px;
text-align: center;
}

ul.nav {
background-color: transparent;
color: #fff;
list-style-type: none;
font-weight: bold;
}

ul.nav li {
float: left;
margin: 0 0 0 2px;
padding: 0;
}

ul.nav li a, ul.nav li a:link, ul.nav li a:visited, ul.nav li a:active
{
background-color: #d63e20;
color: #fff;
text-decoration: none;
border: 2px solid #000;
padding: 14px 10px;
display: block;
}

ul.nav li a.wrapped-list, ul.nav li a.wrapped-list:link, ul.nav li a.wrapped-list:visited, ul.nav li a.wrapped-list:active
{
/*background-color: #d6634d;*/
background-color: #d63e20;
color: #fff;
text-decoration: none;
border: 2px solid #000;
padding: 6px 10px;
display: block;
}

ul.nav li a:hover{
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 14px 10px;
display: block;
}

ul.nav li a.wrapped-list:hover{
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 6px 10px;
display: block;
}

ul.nav li span.on-state {
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 14px 10px;
display: block;
}

ul.nav li span.wrapped-list-on-state {
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 6px 10px;
display: block;
}

ul.nav li a.linked-on-state:link, ul.nav li a.linked-on-state:visited{
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 14px 10px;
display: block;
}

ul.nav li a.wrapped-list-linked-on-state:link, ul.nav li a.wrapped-list-linked-on-state:visited{
background-color: #553377;
color: #fff;
border: 2px solid #000;
padding: 6px 10px;
display: block;
}

/* End Navigation */

/* Content */
/*div.content {
padding-left: 50px;
padding-right: 140px;
margin: 0;
color: #000;
background: #fff url(../091/009003-09-misc01.jpg) no-repeat top right;
}*/

div.content {
width: 710px;
padding-left: 50px;
margin: 0;
color: #000;
background-color: #fff;
display: table;
}

div.left-content-text {
float: left;
width: 80%;
padding: 0;
margin: 0;
}

div.right-content-graphic {
float: right;
width: 18%;
padding: 0;
margin: 0;
}

div.empty-box-size50, div.empty-box-size100, div.empty-box-size150, div.empty-box-size200 {
clear: both;
width: 99%;
margin: 0;
padding: 0;
}

div.empty-box-size50 {height: 50px;}
div.empty-box-size100 {height: 100px;}
div.empty-box-size150 {height: 150px;}
div.empty-box-size200 {height: 200px;}

div.copyright-link {
clear: both;
margin: 1.5em 0;
padding: 0;
font-size: 0.85em;
text-align: right;
}


/* Footer elements */
div.footer {
width: 100%;
padding: 0;
margin: 1em 0 0 0;
}

div.footer-logos {
padding: 0;
margin: 0;
background: #fff url(../091/009003-09-mmf01.jpg) no-repeat top center;
height: 450px;
}

div.logos {
width: 90%;
background-color: #753b32;
color: #fff;
margin: 0 auto;
position: relative;
top: 336px;
}

div.logos #logo-left {
float: left;
width: 35%;
}

div.logos #logo-center {
float: left;
width: 40%;
}

div.logos #logo-right {
width: auto;
float: right;
}


div.footer-dates {
width: 100%;
padding: 1em 0;
margin: 0;
background-color: #545487;
color: #fff;
font-size: 0.85em;
border-top: 2px solid #753b32;
}

div.footer-dates a, div.footer-dates a:link, div.footer-dates a:visited, div.footer-dates a:hover, div.footer-dates a:active {
background-color: #545487;
color: #fff;
}

#date-indicator {
float: left;
width: 50%;
text-align: left;
margin-bottom: 1em;
}

#foot-top-page {
float: right;
width: 30%;
text-align: right;
margin-bottom: 1em;
}

/*Gallery and Image layout classes */

div.img-left-v1, div.img-left-v2 {
float: left;
margin: 0 1em 1em 0;
}

div.img-right-v1, div.img-right-v2 {
float: right;
margin: 0 0 1em 1em;
}

div.img-left-v1 {width: 100px;}
div.img-left-v2 {width: 150px;}

div.img-text-valign-middle{
width: auto;
margin: 1em 0;
padding: 0;
}

div.img-text-valign-middle p{
padding: 50px 0 0 20px;
}

div.gallery-wrapper-2img {
width: 335px;
margin: 1em auto;
padding: 0;
display: table;
}

div.gallery-wrapper-3img {
width: 520px;
margin: 1em auto;
padding: 0;
display: table;
}

div.gallery-wrapper-2img img, div.gallery-wrapper-3img img{
vertical-align: middle;
margin-right: 25px;
margin-bottom: 25px;
border: 1px solid #ccc;
}

div.gallery-wrapper-2img img.last, div.gallery-wrapper-3img img.last{
margin-right: 0;
}

div.frame-left {
width: 335px;
float: left;
margin: 0;
padding: 0;
display: table;
}

div.frame-rows {
margin: 0 0 1em 0;
padding: 0;
}

div.frame-right {
width: 150px;
float: left;
margin: 0 0 0 25px;
padding: 0 0 15px 0;
display: table;
}

div.gallery-wrapper-3img div.frame-right img{
margin-right: 0;
margin-bottom: 0;
}

div.promo-kit-gallery{
width: auto;
margin: 1em 0;
padding: 0;
display: table;
}

div.img-left-v2-promo{
float: left;
margin: 0 2em 0 0;
padding: 0;
width: 150px;
}

div.img-left-v2-promo p{
margin-top: 0.25em;
text-align: center;
}

/* Table classes */

table.collapsed-alt-rowbg
{
margin: 0.5em 0 1em 0;
padding: 0;
}

table.collapsed-alt-rowbg td, table.collapsed-alt-rowbg th
{
text-align: left;
}

table.collapsed-alt-rowbg tr.row1
{
background-color: #ccc;
color: #000;
}

table.collapsed-alt-rowbg tr.row2
{
background-color: #fff;
color: #000;
}

table.collapsed-alt-rowbg a, table.collapsed-alt-rowbg a:link, table.collapsed-alt-rowbg a:visited, table.collapsed-alt-rowbg a:hover, table.collapsed-alt-rowbg a:active
{
background-color: transparent;
color: #000;
}

.text-indent {text-indent: 1em;}

/* ALIGNMENT UTILITY CSS BEGINS | DEBUT DU CSS D'UTILITE D'ALIGNEMENT */
.alignRight {
	text-align: right;
}
.alignCenter {
	text-align: center;
}
.alignLeft {
	text-align: left;
}
.alignTop {
	vertical-align: top;
}
.alignBottom {
	vertical-align: bottom;
}
.alignTopRight {
	text-align: right;
	vertical-align: top;
}
.alignTopCenter {
	text-align: center;
	vertical-align: top;
}
.alignTopLeft {
	text-align: left;
	vertical-align: top;
}
.alignBottomRight {
	text-align: right;
	vertical-align: bottom;
}
.alignBottomCenter {
	text-align: center;
	vertical-align: bottom;
}
.alignBottomLeft {
	text-align: left;
	vertical-align: bottom;
}
.floatRight {
	float: right;
}
.floatLeft {
	float: left;
}
.image-left { 
	float: left;
	vertical-align: text-top;
}
.image-right {
	float: right;
	vertical-align: text-top;
	margin-left: 10px;
}
.indent1 {
	padding-left: 18px;
}
.indent2 {
	padding-left: 36px;
}
.indent3 {
	padding-left: 54px;
}
.indent4 {
	padding-left: 72px;
}
.indent5 {
	padding-left: 90px;
}
/* ALIGNMENT UTILITY CSS ENDS | FIN DU CSS D'UTILITE D'ALIGNEMENT */

/* LIST UTILITY CSS BEGINS | DEBUT DU CSS D'UTILITE DE LISTE */
ul.noBullet {
	list-style-type: none;
}
ul.disc {
	list-style-type: disc;
}
ul.square {
	list-style-type: square;
}
ul.circle {
	list-style-type: circle;
}
ol.lower-alpha {
	list-style-type: lower-alpha;
}
ol.upper-alpha {
	list-style-type: upper-alpha;
}
ol.lower-roman {
	list-style-type: lower-roman;
}
ol.upper-roman {
	list-style-type: upper-roman;
}
/* modified list for booklist */

ul.booklist li span.list-selected {color:#006699; font-weight: 500;}
ul.booklist li span.lang-selected {color:#006699; font-weight: 600;}
/* LIST UTILITY CSS ENDS | FIN DU CSS D'UTILITE DE LISTE */

/* TEXT UTILITY CSS BEGINS | DEBUT DU CSS D'UTILITE DE TEXTE */
.noWrap {
	white-space: nowrap;
}
.doubleLineSpace {
	line-height: 24.0pt;
}
.uppercase {
	text-transform: uppercase;
}
.lowercase {
	text-transform: lowercase;
}
.black {
	color: #000000;
	background-color: transparent;
}
.white {
	color: #FFFFFF;
	background-color: transparent;
}
.red {
	color: #FF0000;
	background-color: transparent;
}
.blue {
	color: #0000FF;
	background-color: transparent;
}
.green {
	color: #009933;
	background-color: transparent;
}
.grey {
	color: #999999;
	background-color: transparent;
}
.deepyellow {
	color: #FFCC33;
	background-color: transparent;
}
.blackBG {
	background-color: #000000;
}
.whiteBG {
	background-color: #FFFFFF;
}
.redBG {
	background-color: #FF0000;
}
.blueBG {
	background-color: #0000FF;
}
.greenBG {
	background-color: #009933;
}
.lightgreyBG {
	background-color: #CCCCCC;
}
.deepyellowBG {
	background-color: #FFCC33;
}

/* TEXT UTILITY CSS ENDS | DEBUT DU CSS D'UTILITE DE TEXTE */

.clear {clear: both;}
/* Cell Widths */

.width100 {width: 100%;}
.width95 {width: 95%;}
.width90 {width: 90%;}
.width85 {width: 85%;}
.width80 {width: 80%;}
.width75 {width: 75%;}
.width70 {width: 70%;}
.width65 {width: 65%;}
.width60 {width: 60%;}
.width55 {width: 55%;}
.width50 {width: 50%;}
.width45 {width: 45%;}
.width40 {width: 40%;}
.width35 {width: 35%;}
.width30 {width: 30%;}
.width25 {width: 25%;}
.width20 {width: 20%;}
.width15 {width: 15%;}
.width10 {width: 10%;}
.width5 {width: 5%;}

/* Font Size Classes */

.fontSize100 {font-size: 100%;}
.fontSize95 {font-size: 95%;}
.fontSize90 {font-size: 90%;}
.fontSize85 {font-size: 85%;}
.fontSize80 {font-size: 80%;}
.fontSize75 {font-size: 75%;}