* { padding: 0px; margin: 0px; outline: none; }

@font-face {
  font-family: "Garamond";
  src: url("/fonts/garamond.otf");
}

body {
  font-size: 12px;
  font-family: "Garamond", Times New Roman, serif;
  background-color: white;
  color: #16294F;
}

ul, ol { list-style-type: none; }

ol.ol { list-style-type: decimal; padding-left: 20px; }
ul.ul { list-style-type: disc; padding-left: 20px; }
ol.ol li { padding-bottom: 5px; }

sup { font-size: 0.5em; }

input { line-height: 1em; }
input[type='image'] { vertical-align: sub;}

span.required {
  display: inline-block;
  width: 64px;
  height: 17px;
  background-image: url(/images/forms/required-field.png);
  vertical-align: middle;
}

.winwidth { width: 970px; }

.center { margin-left: auto; margin-right: auto; }

.fl { float: left; }
.fr { float: right; }
.clear { clear: both; height: 1px; overflow: hidden; }
.tar { text-align: right; }
.tal { text-align: left; }
.tac { text-align: center; }

.marker { position: relative; top: -200px; height: 1px; overflow: hidden; }
/*
.iborder { border: 1px solid #777; }
.input { padding: 4px; font-size: 14px; }
*/

.house_button { 
  height: 30px; 
  display: inline-block; 
  vertical-align: middle; 
  text-align: center; 
  text-decoration: none; 
  color: #16294F; 
  /* padding-top: 5px; */
  font-family: "Garamond", Times New Romain, serif;
  font-size: 16px;
}

.house_button:hover { 
  color: #16294f;
  text-decoration: none; 
}

button.house_button { height: 30px; border: none; }

.hb_small   { background-image: url(/images/buttons/house-small.png);   width: 73px; }
.hb_medium  { background-image: url(/images/buttons/house-medium.png);  width: 145px; }
.hb_large   { background-image: url(/images/buttons/house-large.png);   width: 217px; }
.hb_massive { background-image: url(/images/buttons/house-massive.png); width: 288px; }

p.p { margin-top: 10px; }

a { font-family: sans-serif; color: #16294F; text-decoration: none;  }
a:hover { color: black; text-decoration: underline; }

a.gar { font-family: "Garamond", Times New Roman, serif; }

a#add_this img { border: none; }

h1#massive, h1#large, h2#top { font-weight: normal; }

h1#massive { font-size: 100px; center; margin-bottom: 20px; color: #222B42; line-height: 1em; }
h1#large { font-size: 70px; center; margin-bottom: 20px; color: #222B42;}
h2#top { font-size: 30px; center; margin-bottom: 5px; color: #999; }

h1#massive a, h1#large a, h2#top a { font-family: serif; }

h3.bigger { font-size: 35px; }

.videoplayer { width: 480px; height: 270px;  }
.videoplayer .no_video { height: 250px; border: 1px solid #999; padding: 10px; }
.videoplayer .no_video p { margin-bottom: 1em; }

a#upload_your_video_of_this_word {
  display: inline-block;
  width: 266px;
  height: 49px;
  background-image: url(/images/buttons/cta-upload-your-video-of-this-word.png);
}

a#want_to_upload_your_own_word_to_wordia {
  display: inline-block;
  width: 340px;
  height: 49px;
  background-image: url(/images/buttons/cta-want-to-upload-your-own-word-to-wordia.png);
}

a#play_vocability_again {
  display: inline-block;
  width: 205px;
  height: 49px;
  background-image: url(/images/buttons/cta-answer-more-questions.png);
}

a#facebook-push {
  display: inline-block;
  width: 215px;
  height: 49px;
  background-image: url(/images/buttons/cta-publish-to-facebook.png);
}


.hidden { display: none; }

.center_text { text-align: center; }

.mpu { width: 300px; height: 250px; }

.flash_box { 
  border: 1px solid white; 
  background-color: white; 
  font-size: 15px;
  padding: 15px;
  margin-bottom: 10px;
  text-align: center;
}

#flash_error   { border-color: red;   background-color: #fee; color: red; }
#flash_warning { border-color: #770;  background-color: #ffe; color: #770; }
#flash_notice  { border-color: green; background-color: #efe; color: green; }

.discloser {
  padding-left: 20px;
  cursor: pointer;
}

span.nil { color: #777; }
span.value { font-weight: bold; color: #B6171E; }

/* input field elements */

input.text, textarea.text { padding: 2px 5px; }
input.font, textarea.font { font-family: "Garamond", Times New Roman, serif; }
label { font-size: 20px; font-weight: bold; }
label.error { font-weight: normal; color: red; }
input.font {  font-size: 20px; }
textarea.font { font-size: 15px; }

/* -- specific stuff ------------------------------------------------------------------------ */

/* splash */

#grid_nav { margin: 10px 0px; font-family: sans-serif; font-size: 14px; }
#grid_nav a { font-size: inherit; }

a#loginpopupbutton {
  background: transparent url(/images/buttons/login-arrows.png) no-repeat scroll right 2px;
  padding-right: 12px;
}

a#signupbutton {
  background: transparent url(/images/icons/pencil.png) no-repeat scroll right 0px;
  padding-right: 12px;
  padding-top: 3px;
}

span#grid_mode_indicator {
  display: inline-block;
  background-image: url(/images/buttons/grid_slide_arrows.png);
  width: 8px;
  height: 8px;
  margin: 0px 4px;
}

#grid_holder { width: 804px; overflow: hidden; height: 454px; position: relative; } 

#grid_holder #grid_slider { width: 1608px; height: 454px; position: absolute; }

#grid_holder ul.letter_grid { width: 804px; float: left; }

ul.letter_grid a.thumbnail .word { font-size: 13px; }

#splash ul#search_box { float: left; width: 500px; /* margin-top: 30px; margin-bottom: 30px; */ margin-top: 10px; }
#splash ul#search_box li { float: left; } 

ol.list { list-style-type: decimal; padding-left: 20px; }
ol.list li { padding-bottom: 5px; }

a#take_the_tour {
  width: 323px;
  height: 56px;
  background-image: url(/images/buttons/take-the-tour.png);
  display: block;
  margin-top: 20px;
  margin-bottom: 20px;
}


/* -- top menu ------------------------------------------------------------------------------ */

#content_top_pad { margin-top: 145px; }

#top_menu_pos { position: fixed; left: 0px; top: 0px; width: 100%; z-index: 2000; }

#top_menu_shading { 
  border-bottom: 1px solid #424343;
  border-top: 3px solid #8b262a;
  background: white url(/images/tabs/backfade.png) repeat-y scroll right;
}

ul#top_menu {  position: relative; }
ul#top_menu a {  text-decoration: none; font-style: normal; } 
ul#top_menu a:hover { color: black; }

ul#top_menu li.link { margin-right: 30px; margin-top: 25px; }
ul#top_menu li.control { margin-top: 28px; }

ul#top_menu li#mascot      { float: left; width: 0px; }
ul#top_menu li#root        { float: left; margin-right: 25px; }
ul#top_menu li#wotd_link   { float: left; }
ul#top_menu li#themes_link { float: left; }
ul#top_menu li#people_link { float: left; }
ul#top_menu li#upload_link { float: left; }

ul#top_menu li#search_box  { float: right; }
ul#top_menu li#user_box  { float: right; margin-left: 10px; }
ul#top_menu li#user_box div { 
  font-family: sans-serif; 
  font-size: 12px; 
  text-align: right; 
  margin-bottom: 20px;
}

ul#top_menu li#root { float: left; }

ul#top_menu li .icon { display: block; width: 69px; height: 56px; background-position: center; background-repeat: no-repeat; }

ul#top_menu li#wotd_link   .icon { background-image: url(/images/icons/top-universities.png); width: 75px; }
ul#top_menu li#themes_link .icon { background-image: url(/images/icons/top-languages.png); }
ul#top_menu li#people_link .icon { background-image: url(/images/icons/top-schools.png);  }
ul#top_menu li#upload_link .icon { background-image: url(/images/icons/top-upload.png);  }

#woody_mascot {
  width: 104px;
  height: 55px;
  background-image: url(/images/icons/woody.png);
  float: right;
  display: block;
  position: relative;
  /* top: -10px; */

}

ul#top_menu li#root a { display: block; width: 130px; height: 100px; background-image: url(/images/logos/wordia-h100.jpg); position: 0;}
ul#top_menu li#root a:hover { background-position: 0 -100px; }

ul#top_menu li#search_box input#top_search_input  { 
  float: left; 
  width: 350px; 
  /* height: 27px;*/ 
  padding: 10px 4px 9px 4px; 
  border: 1px solid #b6171e; 
  font-size: 23px; 
  margin-right: 10px;
  font-family: serif;
  font-style: italic;
  color: #BFC6D6; /* 4D4D4F; */
  background: white url(/images/tabs/search-drop-shadow.png) no-repeat scroll top right;
}

ul#top_menu li#search_box input#top_search_input:focus { color: #062A54; }

ul#top_menu li#search_box input#top_search_button { 
  float: left; 
  margin-right: 15px; 
  margin-top: 4px; 
  height: 30px; 
  width: 30px;
}

/* ul#top_menu li#search_box input { border-color: #999; } */

#top_sub_menu { padding: 0px 0px 7px 0px; position: relative; }
#top_sub_menu a { 
  display: block;
  top: 0px;
  padding-top: 6px; 
  width: 127px; 
  height: 29px; 
  text-align: center; 
  position: absolute;
  background-position: bottom center;
  text-decoration: none; 
  font-family: "Garamond", serif; 
  font-size: 14px;
}

#top_sub_menu a.tab_on { color: white; background-image: url(/images/tabs/tabon.png); }
#top_sub_menu a.tab    { color: #062a54; background-image: url(/images/tabs/tab.png); }
#top_sub_menu a.tab:hover { color: #b6171e; }

#top_sub_menu a.tab:hover, #top_sub_menu a.theme:hover { color: #b6171e; }

#top_sub_menu a.theme { 
  right: 0px;
  background-image: url(/images/tabs/tabwide.png);
  width: 297px;
  text-align: left;
  padding-left: 35px;
}

.prepage { margin-bottom: 10px; font-size: 14px; }
.prepage a { font-size: 14px; }
.prepage .definition { font-size: 18px; }

#page_nav { /* position: relative; */ vertical-align: text-bottom; }
ul#page_nav li { float: left; margin-right: 10px;  }
#page_nav a { font-weight: bold; }
#page_nav span.active { font-weight: bold; font-family: sans-serif; color: black; text-decoration: underline; }

#page_nav #links {  }
#page_nav #links #heightfix { display: inline-block; height: 32px; vertical-align: text-bottom;}
#page_nav #social { /* position: absolute; right: 0px; bottom: 0px; */ }
#page_nav #social { }

#page_nav a.icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  background-color: blue;
  margin-left: 5px;
  vertical-align: text-bottom;
}
/* -- footer ------------------------------------------------------------------------------ */

#footer { 
  margin-top: 70px;
}

#footer #graphic { 
  /* padding-top: 100px; */
  background: white url(/images/tabs/footer-letters.jpg) no-repeat scroll center top;
}

#footer #graphic .winwidth { padding-top: 100px; }

#footer a { color: #4D4D4F; }
#footer a:hover { color: black; }

#footer h2 { color: #062A55; }

#footer .recent { width: 320px; float: left; margin-bottom: 5px; }
#footer .recent .dot { display: inline; font-size: 12px; padding: 0px 10px; }
#footer .recent a { text-decoration: none; font-size: 12px; }
#footer .recent h2 { /* color: #444; */ margin-bottom: 5px; }
#footer .recent .pad_l { padding-right: 5px; }
#footer .recent .pad_m { padding-left: 5px; padding-right: 5px; }
#footer .recent .pad_r { padding-left: 5px; }

#footer #seo_links { background-color: #BCC4CA; color: white; padding: 10px 0px; }

#footer #seo_links .winwidth { width: 930px; }

#footer #seo_links a#powered_by_youtube {
  width: 120px;
  height: 60px;
  background-image: url(/images/logos/youtube.gif);
  display: block;
  float: right;
}

#footer #seo_links ul#links { float: left; width: 820px; }
#footer #seo_links ul#links li { font-size: 15px; font-weight: bold; }
#footer #seo_links ul#links li.pad { padding-left: 10px; padding-right: 10px; }
#footer #seo_links ul#links a { color: white; }

#footer #copyright { /* clear: right; */ color: #444; font-size: 12px; text-align: center; padding: 5px 0px; font-family: sans-serif; }
#footer #copyright a { font-size: 12px; }

#footer #root_footer { padding: 20px 0px; font-size: 14px; }
#footer #root_footer a { font-family: "Garamond", serif; font-size: 14px; }

/* just for the root landing page */

#social_icons { float: left; position: relative; width: 60px; height: 60px; }
#social_icons a { display: block; width: 30px; height: 30px; position: absolute; }
#social_icons a#soc_facebook { top:    0px;  left: 0px; background-image: url(/images/icons/footer-facebook.png); }
#social_icons a#soc_twitter  { top:    0px; right: 0px; background-image: url(/images/icons/footer-twitter.png); }
/* #social_icons a#soc_bebo     { bottom: 0px;  left: 0px; background-image: url(/images/icons/footer-bebo.png); } */
#social_icons a#soc_youtube     { bottom: 0px;  left: 0px; background-image: url(/images/icons/footer-youtube.png); }
#social_icons a#soc_itunes   { bottom: 0px; right: 0px; background-image: url(/images/icons/footer-itunes.png); } 

#root_footer { border-top: 1px solid #BFC6D6; text-align: center; }

/* -- page split ------------------------------------------------------------------------------ */

/* quite important two col split */
.twocol {}

.twocol .pane1 { float: left;  width: /*475*/ 482px; }
.twocol .pane2 { float: right; width: /*485*/ 463px; }

.twocol .swap .pane1 { float: right;  }
.twocol .swap .pane2 { float: left;  }

.onecol .pane h2 { background-image: url(/images/tabs/pane-full-h2-lighter.png); }

.twocol .pane1 h2 { background-image: url(/images/tabs/pane1-h2-lighter.png); }
.twocol .pane2 h2 { background-image: url(/images/tabs/pane2-h2-lighter.png); }

.module h2 { 
  background-repeat: no-repeat;
  font-size: 12px;
  padding: 7px 9px 6px 9px;
  font-family: sans-serif;
  font-weight: bold;
  color: #16294F;
}
.module h3 { margin-bottom: 10px; }

.module .content { margin: 10px 0px; line-height: 1.9em; font-size: 16px; }
.module .lpad { margin-left: 9px; }

.module h2 a { float: right; font-size: 12px; font-weight: normal; }  

.module h2#title_with_rank { position: relative; }

.module h2#title_with_rank .rank {
  position: absolute;
  right: 10px;
  top: -4px;
  width: 32px;
  height: 37px;
  background-image: url(/images/ribbons/redribbons.png);
}

.module h2#title_with_rank .rank .digit {
  position: absolute;
  width: 20px;
  height: 16px;
  background-image: url(/images/ribbons/redribbons.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  left: 10px;
  top: 10px;
}


h2#quote { font-size: 20px; font-style: italic; font-weight: normal; color: #b6171e; margin-bottom: 15px; margin-top: -15px; }
h3#quote_by { text-align: right; }

.definition span.posp { font-weight: bold; }

ol#definitions li.more, ol#definitions_overview li.more { list-style-type: none; }
ol#definitions li.more a, ol#definitions_overview li.more a { font-family: "Garamond", serif; }

ol#definitions_overview em { font-size: 1.4em; }
/* input forms on panes */

ol#definitions_overview ol#definitions { list-style-type: decimal; }
ol#definitions_overview  h3 { font-size: 30px; }


/*
.pane1 .iform .line label { width: 100px; }
.pane1 .iform .line .field { width: 365px; }
.pane1 .iform .line .field input[type='text'], .pane1 .iform .line .field input[type='password'] { width: 360px; padding: 5px 0px; }

.pane2 .iform .line .field { width: 240px; }
.pane2 .iform .line .field input[type='text'], .pane2 .iform .line .field input[type='password'] { width: 230px; padding: 5px 0px; }

.pane .iform .line label { width: 150px; /-* font-size: 20px; *-/ }
.pane .iform .line .field { width: 750px; }

.pane .iform .line .field input[type='text'], .pane .iform .line .field input[type='password'] { width: 400px; /-* padding: 5px 0px; *-/ }

.iform fieldset { border: none; padding-bottom: 20px; }
.iform fieldset.first { padding-top: 20px; }
.iform .line label { /-* font-weight: bold; *-/ float: left; }
.iform .line .field { float: right; padding-bottom: 40px; }
*/

.hint { display: block; font-size: 14px; /* color: #666; */ padding-top: 3px; line-height: 1.1em; }
.form_error { font-size: 14px; font-weight: bold; color: #b6171e; padding-top: 3px; line-height: 1.1em; }

#available { color: green; }
#unavailable { color: red; }

/* some icons */

a.mini_icon {
  width: 30px;
  height: 28px;
  display: inline-block;
  vertical-align: text-bottom;
  background-repeat: no-repeat;
  vertical-align: text-bottom;
}

a.mini_icon:hover { text-decoration: none; }

a.mini_feed_icon { background-image: url(/images/buttons/mini-rss.png); }
a.mini_email_icon { background-image: url(/images/buttons/mini-mail.png); } 

/* form patches */

.pane table.list .text { width: 300px; }
.pane table.list textarea { height: 150px; }

#sign_up table.list th { width: 200px; }

#edit_profile textarea { width: 750px; }

/* thumbnails */

.thumbnails {}
.thumbnails .pad_x { overflow: hidden; width: 1px; }
.thumbnails .pad_y { overflow: hidden; height: 1px; }
.thumbnails .disabled { /* background-color: #eee; */ }

/* thumbnail */

/* do we use these ? */

.s115 { width: 115px; height: 90px; } /* 4:3 */
.s137 { width: 137px; height: 77px; }  /* 16:9 */
.s160 { width: 160px; height: 90px; }
.s90  { width:  90px; height: 90px; }
.s120 { width: 120px; height: 90px; }

/* reinstated thumbnail code from sass output */

.thumbnail { 
  position: relative; 
  display: block; 
  background: black none no-repeat scroll center;
  overflow: hidden; 
  width: 160px;
  height: 90px;
  font-size: 10px;
  line-height: 1em;
  text-decoration: none;
}

.thumbnail:hover { text-decoration: none; }

.thumbnail .mask { 
  background-image: url(/images/masks/m160x90.png);
  width: 160px;
  height: 90px;
  z-index: 500;
  position: relative;
}

a.thumbnail .caption { 
  position: absolute; 
  background-color: black;
  background-color: rgba( 0, 0, 0, 0.7);
  bottom: 0px;
  left: 0px; 
  width: 100%;
  color: white;
  font-size: 11px;
  z-index: 400;
  font-family: sans-serif;
}

a.thumbnail .caption .heightbox { 
  padding: 5px;
  padding-bottom: 0px;
}

.thumbnails a.rollup .caption { top: 90px; }

a.thumbnail .caption .word {
  font-weight: bold;
  padding-bottom: 5px;
}

a.thumbnail:hover .caption { color: #062A54; }

a.thumbnail:hover .number { background-color: #b4bcbe; }

a.thumbnail .caption .author { padding-bottom: 5px; }

.thumbnail .number {
  position: absolute;
  top: 0px;
  left: 0px;
  padding: 3px;
  background-color: #b6171e;
  color: white;
  font-size: 12px;
  font-weight: bold;
  line-height: 1em;
}

.thumbnails .disabled .number { background-color: #999; }

a.thumbnail:hover .caption { 
  background-color: white;
  background-color: rgba( 255, 255, 255, 0.7); /* white; */ 
}


a.thumbnail .badge {
  position: absolute;
  right: 3px;
  top: 0px;
}

a.thumbnail .badge {
  position: absolute;
  right: 2px;
}

a.thumbnail .rank {
  width: 24px;
  height: 31px;
  top: 0px;
  background-position: -8px -6px;
  background-image: url(/images/ribbons/redribbons.png);
}

a.thumbnail .rank .digit {
  position: absolute;
  width: 20px;
  height: 16px;
  background-image: url(/images/ribbons/redribbons.png);
  background-position: 0 0;
  background-repeat: no-repeat;
  left: 2px;
  top: 8px;
}

a.thumbnail .date {
  top: 2px;
  width: 26px;
  height: 35px;
  font-size: 14px;
  background-image: url('/images/ribbons/calendar.png'); 
}

a.thumbnail .date .tac { position: absolute; line-height: 1em; width: 26px; }

a.thumbnail .date .month {
  color: #c20011;
  font-size: 10px;
  top: 4px;
}

a.thumbnail .date .day {
  position: absolute;
  left: 0px;
  top: 18px;
  color: white;
}

a.thumbnail .badge .ranking {
  margin-top: 3px;
  width: 23px;
  height: 21px;
}

.thumbnail a .plate {
  display: block;
  position: absolute;
  background-color: black;
  background-color: rgba( 0, 0, 0, 0.7);
  color: white;
  padding: 2px;
  bottom: 0px;
  width: 115px; 
}

ul#letter_grid { width: 805px; }

/* -------- specific titles --------- */

span.link_title {
  background-repeat: no-repeat;
  display: inline-block;
  margin: 10px auto 0px auto;
  height: 56px;
  background-repeat: no-repeat;
}

span#bring_words_to_life {
  width: 408px;
  background-image: url(/images/copy/title-bring-words-to-life.png);
}

span#bring_words_to_life_in_class {
  width: 574px;
  background-image: url(/images/copy/title-bring-words-to-life-in-class.png);
}

span#bring_your_language_to_life {
  width: 555px;
  background-image: url(/images/copy/title-bring-your-language-to-life.png);
}

/* calendar */

#wotd_calendar { width: 636px; margin: 0px auto; }
#wotd_calendar .thumbnail { width: 90px; height: 90px; }
#wotd_calendar .thumbnail .mask { width: 90px; height: 90px; background-image: url(/images/masks/m90x90.png); }
#wotd_calendar .disabled { background-image: url(/images/boxes/calendar-bg.jpg); }

ul#wotd_theme_calendar {}

#wotd_theme_calendar .description { width: 323px; }
#wotd_theme_calendar .description a { font-family: "Garamond", serif; }
#wotd_theme_calendar .description p { /* text-align: right; */ }
#wotd_theme_calendar .daylist { width: 636px; }
#wotd_theme_calendar .pad_y { margin-bottom: 20px; }
#wotd_theme_calendar .event_box { width: 90px; height: 90px; }

#wotd_theme_calendar .thumbnail { width: 90px; height: 90px; }
#wotd_theme_calendar .thumbnail .mask { width: 90px; height: 90px; background-image: url(/images/masks/m90x90.png); }

#wotd_title h1 { text-align: center; }

#wotd_title a { background-repeat: no-repeat; padding: 30px 0px; font-size: 14px; vertical-align: top; display: inline-block; }

#wotd_title a#prev { background-image: url(/images/tour/button-prev.png); padding-right: 50px; background-position: right center; }

#wotd_title a#next { background-image: url(/images/tour/button-next.png); padding-left: 50px; background-position: left center; }

/* navigator */

#wotd_sell {}
#wotd_sell p.text { width: 344px; float: left; }
#wotd_sell p.text em a { color: #B6171E; font-weight: bold; }
#wotd_sell .avatar { width: 90px; float: right; }

#wotd_email input { line-height: 21px; }
#wotd_email input[type='text'] { 
  width: 300px; 
  /* font-size: 15px; */
  color: #777;
  /* padding: 5px 0px; */
}
#wotd_email input[type='image'] { margin-left: 10px; }

#wotd_email input[type='text']:focus { color: black; }

/* search results */

#search_results p.result { margin: 10px 0px; }

/* TOUR */

.tour #intro { /* width: 900px; */ /* margin: 5px auto; */ position: relative; /* height: 30px; */ }
.tour h1 { padding: 10px 0px; font-size: 32px; }

.tour a#how_can_i_use_wordia_schools {
  display: inline-block;
  width: 400px;
  height: 93px;
  background-image: url(/images/buttons/cta-how-can-i-use-wordia-schools.png);
}

.tour #intro p { margin: 5px 0px; font-size: 16px; }
.tour #intro #join_now_button { position: absolute; top: 4px; right: 0px; }

.tour ul#navigator { width: 800px; margin: 0px auto; /* margin-top: 28px; */ }

.tour ul#navigator li { background-image: url(/images/tour/nav-tabs-3.png); height: 62px; }
.tour ul#navigator li.end { width: 15px; }
.tour ul#navigator li.seg { width: 111px; cursor: pointer; }
.tour ul#navigator li.mid { width: 20px; }

.tour ul#navigator li#lhs     { background-position:   -4px 0px; }
.tour ul#navigator li#rhs     { background-position: -174px 0px; }
.tour ul#navigator li#m1      { background-position: -99px 0px; }
.tour ul#navigator li#m2      { background-position: -99px 0px; }
.tour ul#navigator li#m3      { background-position: -99px 0px; }
.tour ul#navigator li#m4      { background-position: -99px 0px; }

.tour ul#navigator li#tour_b1 { background-position: -222px -66px; }
.tour ul#navigator li#tour_b2 { background-position: -323px -66px; }
.tour ul#navigator li#tour_b3 { background-position: -424px -66px; }
.tour ul#navigator li#tour_b4 { background-position: -525px -66px; }
.tour ul#navigator li#tour_b5 { background-position: -626px -66px; }

.tour_copy h3 { 
  font-size: 30px;
  margin: 20px 0px;
}

#slide_container {
  margin-top: 20px;
  position: relative;
}

.tour #slider {
  width: 824px;
  height: 370px;
  overflow: hidden;
  position: relative;
  margin: 0px auto;
}

.tour .button {
  position: absolute;
  top: 150px;
}

.tour .button .bg {
  background-image: url(/images/tour/tour-nav.png);
  width: 54px;
  height: 55px;
  cursor: pointer;
  background-repeat: no-repeat;
}

.tour #prev_button { left: 0px; }
.tour #next_button { right: 0px;}

.tour #prev_button .bg { background-position: 0px 0px; }
.tour #next_button .bg { background-position: -63px 0px; }

.tour #slide_container .disabled .bg { background-image: none; cursor: default; }

.tour a#watch_the_video .graphic { display: inline-block; width: 33px; height: 18px; background-image: url(/images/tour/camera.png); }
.tour a#start_the_tour .graphic { display: inline-block; width: 15px; height: 19px; background-image: url(/images/tour/start-tour-chevron.png); }

.tour ul#slides { position: relative; width: 4944px; }
.tour ul#slides li.pane { float: left; width: 824px; height: 370px; }
.tour ul#slides li.pane h2.panetitle { margin-bottom: 20px; color: #B6171E; text-align: center; }

.tour ul#slides li.pane .fixwidth { width: 800px; margin: 0px auto;}

.tour #other_nav { width: 594px; margin: 0px auto; }

.tour #other_nav a:hover { text-decoration: none; color: #B6171E; }

.tour #other_nav a {
  display: block;
  position: relative;
  width: 174px;
  height: 174px;
  padding: 5px 12px 12px 12px;
  position: relative;
  text-align: center;
  font-family: "Garamond", Times New Roman, serif;
}

.tour #other_nav a#button_1, .tour #other_nav a#button_1_t { background-image: url(/images/tour/button-1.png); }
.tour #other_nav a#button_2 { background-image: url(/images/tour/button-2.png); }
.tour #other_nav a#button_3 { background-image: url(/images/tour/button-3.png); }

.tour #other_nav a h2 { margin: 10px 0px; font-size: 14px;  }
.tour #other_nav a .graphic { position: absolute; bottom: 30px; left: 28px; width: 142px; height: 80px; background: transparent none no-repeat scroll center; }
.tour #other_nav a h3 { font-weight: normal; }

.tour #other_nav a#button_1 .graphic { background-image: url(/images/tour/image-05-teacher-talk.png); }
.tour #other_nav a#button_2 .graphic { background-image: url(/images/tour/image-06-vid-thumbs-thumb.png); }
.tour #other_nav a#button_3 .graphic { background-image: url(/images/tour/image-07-camera.png); }
.tour #other_nav a#button_1_t .graphic { background-image: url(/images/tour/image-16-jumping-kids.png); }

/* tour pane 1 */

.tour #summary_cards li { width: 180px; padding: 5px 12px 13px 12px;  }

.tour #summary_cards li a { width: 180px; height: 220px; position: relative; display: block; font-family: "Garamond", Times New Roman, serif; }

.tour #summary_cards li a:hover { text-decoration: none; color: #16294F; }

.tour #summary_cards li#c1 { background-image: url(/images/tour/p1-pane1.png); }
.tour #summary_cards li#c2 { background-image: url(/images/tour/p1-pane2.png); }
.tour #summary_cards li#c3 { background-image: url(/images/tour/p1-pane3.png); }
.tour #summary_cards li#c4 { background-image: url(/images/tour/p1-pane4.png); }

.tour #summary_cards h2.cardtitle, .tour #other_nav h2 { text-align: center; font-size: 16px; margin: 5px; }
.tour #summary_cards h2.cardtitle { padding-top: 10px; }
.tour #summary_cards a:hover h2.cardtitle { color: #B6171E; }
.tour #summary_cards p, .tour #other_nav p { text-align: center; font-size: 16px; line-height: 1.2em; margin: 5px; }
.tour #summary_cards p { padding-top: 10px; }
.tour #other_nav a:hover p { color: #062A55; }

.tour #summary_cards .image { 
  width: 150px; 
  height: 90px; 
  /* margin: 0px auto; */
  background: transparent none no-repeat scroll center bottom; 
  position: absolute;
  bottom: 10px;
  left: 15px;
}

.tour #summary_cards #c1 .image { background-image: url(/images/tour/image-01-girl-bubble.png); height: 92px; }
.tour #summary_cards #c2 .image { background-image: url(/images/tour/image-02-subjects.png); }
.tour #summary_cards #c3 .image { background-image: url(/images/tour/image-03-kid-subjects.png); }
.tour #summary_cards #c4 .image { background-image: url(/images/tour/image-04-your-school.png); }

.tour #pane1 .other_buttons { 
  width: 404px;
  margin: 10px auto 0px auto;
} 

.tour #pane1 .other_buttons a {
  display: inline-block;
  width: 194px;
  height: 63px;
}

.tour a#watch_the_video {
  background-image: url(/images/buttons/cta-watch-the-video.png);
  margin-right: 9px;
}

.tour a#start_the_tour {
  background-image: url(/images/buttons/cta-start-the-tour.png);
}

/* tour pane 6 */

.pane #tour_schools_signup_minibox {
  background: transparent url("/images/tabs/backfade.png") repeat-y scroll right center;
  padding: 20px;
  /* margin-top: 100px; */
}

.tour #tour_schools_signup_minibox { margin-top: 100px; } 

.pane #tour_schools_signup_minibox span#teachers_start_here { float: left; width: 150px; height: 72px; background-image: url(/images/tour/educators-start-here.png); }

.pane #tour_schools_signup_minibox #fields { float: left;  margin-left: 15px; margin-top: 5px;}
.pane #tour_schools_signup_minibox .field { margin-bottom: 15px; }
.pane #tour_schools_signup_minibox #signup_form input { width: 250px;  }
.pane #tour_schools_signup_minibox #signup_form label { width: 120px; display: inline-block; font-size: 14px; }
.pane #tour_schools_signup_minibox #submit { float: left; margin-left: 20px; }

.pane #tour_schools_signup_minibox #submit button { 
  width: 195px;
  height: 64px;
  background: transparent url(/images/buttons/cta-create-account.png);
  border: none;
  display: block;
}


/* other tour panes */

.tour ul.info_bricks li { width: 800px; height: 130px;  }

.tour ul.info_bricks li .graphic { width: 150px; height: 150px; background: transparent none no-repeat center; margin-top: 12px; }
.tour ul.info_bricks li .description { width: 600px; height: 150px; /* background-color: green; */ margin-top: 12px; }

.tour ul.info_bricks li.b1 .graphic { margin-left: 12px; float: left; }
.tour ul.info_bricks li.b1 .description { margin-right: 24px; float: right; }

.tour ul.info_bricks li.b2 .graphic { margin-right: 24px; float: right; }
.tour ul.info_bricks li.b2 .description { margin-left: 12px; float: left; }

.tour #pane2 .b1 .graphic { background-image: url(/images/tour/image-12-girl-bubble-big.png); }
.tour #pane2 .b2 .graphic { background-image: url(/images/tour/image-08-people-boards.png); }
.tour #pane3 .b1 .graphic { background-image: url(/images/tour/image-13-subjects-big.png); }
.tour #pane3 .b2 .graphic { background-image: url(/images/tour/image-09-mapped-subjects.png); }
.tour #pane4 .b1 .graphic { background-image: url(/images/tour/image-14-kid-bubbles-big.png); }
.tour #pane4 .b2 .graphic { background-image: url(/images/tour/image-10-what-i-know.png); }
.tour #pane5 .b1 .graphic { background-image: url(/images/tour/image-15-your-school-big.png); }
.tour #pane5 .b2 .graphic { background-image: url(/images/tour/image-11-wordia-bubbles.png); }

.tour ul.info_bricks li .description p { font-size: 16px; margin-bottom: 10px; line-height: 1.5em; }

#tour_index { width: 800px; margin: 0px auto; }

#tour_index #tour_other_buttons { margin-top: 50px; }
#tour_index #tour_other_buttons a { display: inline-block; height: 131px; width: 361px; }

#tour_index a#cta_tour_big { background-image: url(/images/buttons/cta-tour-big.png); /* float: left; */ }
#tour_index a#cta_sign_in_schools_big { background-image: url(/images/buttons/cta-sign-in-big.png); float: right; }

/* examples page - video tiles */

#thumbnail_scroller { height: 182px; overflow: auto; }

#thumbnail_scroller .thumbnail, #mini_thumbs .thumbnail { width: 90px; height: 90px; }
#thumbnail_scroller .thumbnail .mask, #mini_thumbs .thumbnail .mask { width: 90px; height: 90px; background-image: url(/images/masks/m90x90.png); }

/* login popup box */

#loginboxpopup {
  position: absolute;
  width: 350px;
  border: 1px solid #999;
  border-top-color: #ddd;
  background: white url(/images/tabs/backfade.png) repeat-y scroll right;
  top: -1000px;
  right: 0px;
  z-index: 2000;
  overflow: hidden;
  font-size: 18px;
}

#loginboxpopup .pad { margin: 10px; }

#loginboxpopup input[type='text'], #loginboxpopup input[type='password'], #loginboxpopup input[type='image'] { display: block; /* padding: 5px 0px; */ }
#loginboxpopup input[type='text'], #loginboxpopup input[type='password'] { /* padding: 5px 0px; */ width: 320px; }
#loginboxpopup input[type='password'] { margin-bottom: 10px; }
#loginboxpopup input[type='image'] { margin-top: 10px; }

#loginboxpopup label { display: block; margin: 10px 0px 4px 0px; }
#loginboxpopup a { font-family: "Garamond", serif; }
#loginboxpopup a em { color: #b6171e; }
#loginboxpopup a:hover { text-decoration: underline; }

#loginboxpopup span#schools_logo {
  display: inline-block;
  background-image: url(/images/icons/kiddies.png);
  width: 25px;
  height: 20px;
}

#loginboxpopup a#hideloginpopupbox {
  position: absolute;
  display: block;
  width: 11px;
  height: 11px;
  background-image: url(/images/buttons/close.png);
  top: 10px;
  right: 10px;
}

#loginboxpopup a#hideloginpopupbox:hover {
  background-position: 0px -11px;
}

#loginboxpopup p#reminder { margin-top: 10px; line-height: 1.9em; }

#loginboxpopup p#reminder a { font-family: "Garamond", serif; }
/* flickr */

ul#flickr li a { position: relative; display: block; overflow: hidden; }
ul#flickr li a img { position: relative; border: none; }

/* generic list of name:value pairs */

table.list {}
table.list th { text-align: right; vertical-align: top; padding-top: 10px; }
table.list td { padding: 10px; padding-right: 0px; }

/* avatars */

.avatar {}
.avatar .img {}
.avatar .medium { background-image: url(/images/thumbnails/user/bobble_medium.png); width: 130px; height: 130px; }
.avatar .small {  background-image: url(/images/thumbnails/user/bobble_small.png);  width:  90px; height:  90px; }
.avatar .tiny {   background-image: url(/images/thumbnails/user/bobble_tiny.png);   width:  38px; height:  38px; }

#avatar_box {
  border: 1px solid #999;
  padding: 9px 4px;
  width: 140px;
  /* height: 140px; */
  margin: 0px auto;
}

/* twitter */

#tweets ul li .tweet_avatar { float: left; padding-right: 10px; }
#tweets ul li .tweet_date, #tweets ul li .tweet_text { float: right; width: 400px; display: block; }
#tweets ul li { /* clear: both; */ margin-bottom: 10px; }

/* wotd history */

ul#upload_progress { width: 651px; margin: 20px auto; }

ul#upload_progress li { float: left; }
ul#upload_progress .graphic { width: 120px; height: 100px; background: transparent none no-repeat scroll center; }

ul#upload_progress li.arrow  { background-image: url(/images/icons/upload-next-arrow.png); /* margin: 0px 20px; */ width: 50px; }
ul#upload_progress .icon #upload_search  { background-image: url(/images/icons/upload-search-shade.png); }
ul#upload_progress .icon #upload_select  { background-image: url(/images/icons/upload-select-shade.png); }
ul#upload_progress .icon #upload_file    { background-image: url(/images/icons/upload-file-shade.png); }
ul#upload_progress .icon #upload_process { background-image: url(/images/icons/upload-process-shade.png); width: 141px; }

ul#upload_progress .active #upload_search  { background-image: url(/images/icons/upload-search-active.png); }
ul#upload_progress .active #upload_select  { background-image: url(/images/icons/upload-select-active.png); }
ul#upload_progress .active #upload_file    { background-image: url(/images/icons/upload-file-active.png); }
ul#upload_progress .active #upload_process { background-image: url(/images/icons/upload-process-active.png); width: 141px; }

.swfupload { float: right; }

#progress { }
#progress #status { position: absolute; width: 360px; text-align: center; left: 0px; top: 0px; color: #16294F; font-weight: bold; }
#progress #well { position: relative; width: 360px; border: 1px inset #ccc;}

#progress #well #bar { overflow: hidden; background-color: #b4bdbf; width: 0px; /* 100%; */ }

input#video_uploaded_data { width: 350px; border: 1px inset #ccc;  }
input#thumbnail_uploaded_data { width: 350px; border: 1px inset #ccc;  }

/* theme week word calendar */

#upload_page3 h3 { line-height: 1em; margin-top: 20px; } 




/* user profile pages */

#user_bio_content { overflow: hidden; }

#profile_title { margin-bottom: 20px; }
#profile_title .avatar { width: 130px; float: left; padding-top: 20px; }
#profile_title .fr { width: 820px; }
#profile_title .fr h1 { margin-bottom: 0px; }

ol#user_video_list .video { width: 160px; float: left; }
ol#user_video_list .definition { width: 780px; float: right; line-height: 1em; }
ol#user_video_list .content { line-height: 1em; }
ol#user_video_list .definition h3 { margin-bottom: 0px; }
ol#user_video_list .definition h4 { font-size: 12px; color: #999; font-weight: normal; }

/* game icons */

ul#game_icon_list { width: 962px; }
ul#game_icon_list a { text-decoration: none; background: transparent none no-repeat center; }
ul#game_icon_list li { float: left; position: relative; }
ul#game_icon_list li .icon { display: block; width: 320px; height: 240px; background-color: #ddd; }
ul#game_icon_list li .mask { width: 320px; height: 240px; background-image: url(/images/games/button-masks-01.png); position: absolute; top: 0px; left: 0px;}
ul#game_icon_list li:hover a .mask { background-image: url(/images/games/button-masks-02.png); }

table#account_details { font-size: 20px; }
table#account_details th { text-align: left; }

ul#game_icon_list li#vocability a     { background-image: url(/images/games/vocability.jpg); }
ul#game_icon_list li#tweetundrum a     { background-image: url(/images/games/tweetundrum.jpg); }

ul#game_icon_list li#tweetundrum span.icon { background-image: url(/images/games/tweetundrum-pending.jpg);  }
ul#game_icon_list li.morecoming span.icon { background-image: url(/images/games/more-coming.jpg);  }

#flyer { text-align: center; }

a.defined_by_harper_collins {
  display: inline-block;
  width: 66px;
  height: 13px;
  background-image: url(/images/logos/collins.png);
  font-style: normal;
  text-decoration: none;
  line-height: 13px;
}

a.defined_by_harper_collins:hover { font-style: normal; text-decoration: none; }

a.the_guardian {
  display: inline-block;
  width: 198px;
  height: 30px;
  text-decoration: none;
  font-style: normal;
  line-height: 15px;
  background-image: url(/images/logos/guardian_logo.png);
  vertical-align: text-bottom; 
}


span.collins_copyright { font-size: 12px; color: #999; font-weight: normal; }

/* games */

h1#gametitle { color: #222B42; font-size: 70px; }
h3#previous_question span { font-size: 200%; }
h3#previous_question .correct { color: green; }
h3#previous_question .incorrect { color: red; }
p#previous_spelling em { font-size: 32px; /* font-weight: bold; */ color: #777; }
table#questions td { padding-left: 20px; padding-bottom: 10px;}
table#questions th { padding-bottom: 10px;}
table.leaderboard { width: 100%; }


ul.horizontal_leaderboard li.pad_x { width: 40px; }

table#challenge_email_list { width: 100%; }

table#spelling_results { width: 100%; }
table#spelling_results td { text-align: center; font-size: 20px; }
table#spelling_results .correct { color: green; }
table#spelling_results .incorrect { color: red; }

span#facebook_logo {
  display: inline-block;
  width: 71px;
  height: 15px;
  background-image: url(/images/logos/facebook.png);
}

/* end games */

/* school icons */

ul#school_thumbs {}
ul#school_thumbs li { float: left; }
ul#school_thumbs li a { margin-right: 1px; margin-bottom: 1px; display: block; width: 90px; height: 90px; }

/* end school icons */

#news_article em { background-color: #B6171E; font-style: normal; color: white; padding: 1px;}
/* mini_thumbs */

#languages_title { 
  width: 546px;
  height: 56px;
  background-image: url(/images/tour/text-your-language-your-dialect.png);
}

a#guardian_mpu {
  display: block;
  width: 300px;
  height: 250px;
  background-image: url(/images/logos/guardian-mpu-300.png);
  margin: 0px auto;
}

#top_videos p { margin-top: 20px; }

/* word stuff */

#link_to_this_word {
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  padding: 5px;
}

#link_to_this_word input { }
#link_to_this_word span { cursor: pointer; }

/* markdown meta pages */

.markdown p { font-size: 16px; line-height: 1.9em; margin: 1em 0px; padding-left: 10px; }
.markdown ul { margin: 1em 0em; list-style-type: disc; padding-left: 25px; }
.markdown ul li {  }
.markdown h2 { margin-bottom: 2em; }
.markdown h3 { margin-left: 10px; }

#contact_us_address em { font-style: normal; font-weight: bold; font-size: 18px; }
/* end markdown meta pages */