/*  CSS containing common style rules for the screen layout.
 *
 */

body {
  margin: 0;
  padding: 0;
  background-color: #4d049f;
  font-family: "Verdana", "Helvetica", "Arial", sans-serif;
  font-size: 90%;
  color: #ffffff;
}

img {
  margin: 0;
  padding: 0;
  border: 0;
}

form {
  font-size: 90%;
  margin: 0;
}

table {
  font-size: 100%;
}

abbr { cursor: help; }

.temp { color: red; background-color: yellow; }
.temp:before { content: "Alert: "; }

p, ul, dl {
  font-size: 90%;
  line-height: 1.3;
  padding-bottom: 0.4em; 
  margin-left: 4em;
  margin-right: 2em;
}



ul, dl { margin-top: 0.5em; margin-bottom: 0.5em; }

dt { margin-left: 1em; }
dd { margin-bottom: 0.8em; font-style: italic;}

p.box {
  margin: 0 15%;
  padding: 0.4em 1em;
  border: solid 1px #7851bb;
  background: #5a1aa6;  
  font-style: italic;
  color: #ba83f7;
}

p.related {
  background: no-repeat top left url("../images/related.gif"); 
  padding-left: 23px;
}
body[class] p.related { background: no-repeat top left url("../images/related.png"); }

strong, dt { color: #ffd650; font-weight: bold; }
strong em { color: #ffe800; }

/* Heading styles */

h2 {  /* Headings within #main */
  font-size: 160%;
  font-family:  "Trebuchet MS", "Helvetica", "Arial", sans-serif;  
  font-weight: bold;
  color: #ffd650;
  padding: 0 0 0 8px;
  margin-left: -12px;
  background: #4d049f;
  margin-top: 0px;
}

h3 {  /* Subheadings within #main */
  font-size: 120%;
  font-family:  "Trebuchet MS", "Helvetica", "Arial", sans-serif;  
  font-weight: bold;
  color: #ffd650;
}


/* Link properties: will override these for the crumbtrail, banner and footer later */

a:link, a:visited, a:hover, a:active { text-decoration: none; }

/* textual hyperlink properties based on page class */
a:link, a:visited { color: #ffd650; }
a:hover, a:active { color: #f00000;
                    background-color: #ffd650;
                    border-color: #ffd650;}


.components a:link,  .components a:visited,
p a:link,   p a:visited,
ul a:link,  ul a:visited,
dl a:link,  dl a:visited { border-bottom: 2px solid; }

.components a:link,  .components a:visited,
p a:active,  p a:hover,
ul a:active, ul a:hover,
dl a:active, dl a:hover   { border-bottom: none; }



/* Other properties that change colour depending on page class */
.home h2 em { color: #f25500; }



/****** PAGE-SPECIFIC PROPERTIES ******/

.photo {
  float: right;
  text-align: right; 
}

.photo p { color: #4d049f; margin: 0; padding-right: 12px; }

.letter {
  margin-left: 2em;
  padding: 2em;
  width: 80%;
  background-color: #ffffff;
  color: #000000;
}

.letter p { margin-left: 0; }

.letter strong, .letter em {
  color: #4d049f;
  font-weight: bold;
}




#main table.thumbmenu {
  border: 0;
  margin: 1em auto 1em auto;
}



#main .thumbmenu a, #main .thumbmenu p {
  text-decoration: none;
  float: left;
  display: block;
  padding: 6px;
  text-align: center;
  border: 0 !important;
}

#main .thumbmenu p { margin: 0;}


#main .thumbmenu a:hover {
  background: #ffd552;
}
#main .this a {
  font-weight: bold;
  background: #935ea4;
}




#main .learninglinks, #main .components, #main .worksheets { margin: 0 5%; }

#main .learninglinks td,
#main .components td, #main .components th,
#main .worksheets td, #main .worksheets th
{
  vertical-align: top;
  background-color: #935EA4;
  margin: 0; 
}

#main .learninglinks td.first-child {
  padding: 5px;
}

#main .learninglinks img {
  float: left;
  margin: 10px;
  border: 2px solid #935ea4;
}

#main .learninglinks a:hover img {
  border-color: #ffd552;
}

#main .learninglinks p {
  margin-top: 10px;
  margin-left: 95px;
}



#main .components {
  margin-top: 1em;
}

#main .components td {
  text-align: center;
  padding: 2px;
  font-size: 80%;
}

#main .components th {
  font-size: 80%;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}

#main .components td.first-child {
  text-align: left;
}

#main .components th.first-child { background-color: #7a43b7; }

#main .components caption {
  text-align: left; 
  padding-right: 5em;
}

#main .worksheets {
  width: 100%;
}

#main .worksheets td {
  padding: 0.1em 1em;
}

#main .filesize {
  font-size: 80%;
  font-style: italic;
  -moz-opacity: 0.7;
}


#infoquest-hotarea { 
float: left; 
padding: 10px 2em 10px 3em;
}

#infoquest-hotarea a {
  display: block;
  width: 250px; height: 93px;
  background: top left no-repeat url("../images/infoquest-hotarea.gif"); }

#infoquest-hotarea a:hover {
  background-position: -250px 0;
}

#infoquest-hotarea span { display: none; }

/****** LAYOUT ******/


#container { background: url("../images/messages-reduced.gif") 12px 0px no-repeat; }

#header { position: relative; height: 52px;  margin: 20px 0 0 340px; border-bottom: 2px solid #cae2e9;}
#header h1 { padding: 0; margin: 0; position: absolute; bottom: 0;  color: #ffd650; font-size: 180%; font-weight: normal; font-family: "Verdana", sans-serif;}

#sidebar {
 float: left;
 height: 450px;
 width: 200px;
 background: url("../images/sidebar-bg.jpg") top left no-repeat; 
}

#main {
  margin-left: 220px;
  margin-top: 20px; 
  background: #7a43b7 left repeat-y url("../images/main-bg-transition.gif");
  padding-left: 12px; 
  padding-bottom: 10px;
   _height: 1%;
}


.infoquest #main {
padding: 0 0 200px 0;
}



.home #main { margin-left: 0; }

#nav {
 background: url("../images/nav-bg.jpg") top left no-repeat; 
 padding-top: 60px; 
}

/***** NAVIGATION *****/

#nav li, #menuhead { background: top left no-repeat url("../images/related.gif"); }
body[class] #nav li, body[class] #menuhead { background: top left no-repeat url("../images/related.png"); }

#nav a { border: none; padding: 0 4px; margin: 0 0 0 12px; line-height: 20px;  }
#nav ul, #nav li, #menuhead { margin-left: 0; padding-left: 10px; list-style-type: none; display: block; min-height: 20px;  width: 180px; }

/* \*/
* html #sidebar  {width: 220px; overflow: hidden; }
* html #nav ul, * html #nav li, * html #menuhead {width: 160px; overflow: visible; }
/* */


#nav li li {  min-height: 20px; line-height: 1em;}
#nav-this a { font-weight: bold; color: #ffffff; background: none;}
#nav-this li a { font-weight: normal;  color: #ffd650;}
#nav-this li a:hover { color: #f00000; background: #ffd650; }
#menuhead { padding-bottom: 4px; margin-left: 10px; border-bottom: 1px solid #c9a17a; }

/*
 *  Hide content that is intended for screen readers, etc.
 */

.hidden { display: none; }


/*
 *  #bar contains Cambridge banner, shopping, country selection, and the crumbtrail. 
 */

#bar {
  background: #000066;
  width: 100%;
}

/* Override link properties defined earlier */
#bar a:link, #bar a:visited { /* Emulate style on www.cambridge.org */
  color: #003399;
  background: none;
}
#bar a:hover, #bar a:active {
  color: #003399 !important;
  text-decoration: underline;
}


#banner {
  height: 37px;
  background: #000066; 
  white-space: nowrap;
}


/*
 *   BREADCRUMBS
 */

#breadcrumbs {
  font-family: "Verdana", "Helvetica", "Arial", sans-serif;
  font-size: 72%;
  background-color: #ffffff;
  padding: 0px 10px;
  color: #666666;
  border-bottom: #d0d0d0 1px solid;
}
* html #breadcrumbs { width /* */: 100%; }

#breadcrumbs table { height: 27px; }

#breadcrumbs a,
#breadcrumbs a:link,
#breadcrumbs a:visited {
  color: #003399;
  text-decoration: none;
}

#breadcrumbs a:hover {
  color: #003399;
  text-decoration: underline;
 
}


/**** end BREADCRUMBS ***/





/*
 *   FOOTER
 */

#footer {
  clear: both; 
  font-size: 80%;
  color: #ffd650;
  padding: 12px 0 12px 4px;
}

/* Override link properties defined earlier  */

#footer a:link, #footer a:visited { 
  color: #ffd650;
  background: none;
  text-decoration: underline;
}

#footer a:hover, #footer a:active {
  color: #ffd650 !important;
  text-decoration: none;
}



/* Country site list formatting */
.countries a  { display: block; font-size: 80%; }
.countries td { vertical-align: top; }



/* Infoquest Australia grab, ARM, July 2006 */

p.australia-grab {
margin: 0 20px 10px 10px;
padding: 0;
border: 2px solid #fff;
width: 249px;
float: right;
}

p.australia-grab img {
vertical-align: bottom;
}