article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
  display: block; }

audio,
canvas,
video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden] {
  display: none; }

html {
  font-family: sans-serif;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 2 */ }

body {
  margin: 0; }

a:focus {
  outline: thin dotted; }

a:active,
a:hover {
  outline: 0; }

h1 {
  margin: 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: bold; }

q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

small {
  font-size: 80%; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */ }

button,
input {
  line-height: normal; }

button[disabled],
input[disabled] {
  cursor: defat; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

/** FILM EDUCATION DIARY OF A WIMPY KID 3 **/
#wrapper {
  width: 960px;
  height: 1171px;
  margin: 0 auto;
  background: url(../images/website_bg.jpg) no-repeat;
  top: 0;
  position: relative; }

#left-col {
  width: 410px;
  height: auto;
  float: left;
  margin: 280px 0 0 40px; }

#right-col {
  width: 380px;
  padding: 20px;
  min-height: 400px;
  height: auto;
  float: right;
  margin: 260px 40px 0 0;
  background: url(../images/white-transparent.png);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px; }
  #right-col ul {
    margin: 0 10% 1em 10%;
    color: #4db557; }
    #right-col ul li {
      margin-bottom: 1em;
      line-height: 1.3em; }
    #right-col ul span {
      color: black; }

#footer {
  width: 500px;
  height: 40px;
  position: absolute;
  top: 930px;
  left: 40px; }
  #footer p {
    font-size: .7em;
    font-weight: 700; }

/** NAVIGATION **/
nav {
  position: relative;
  top: 230px;
  left: 130px;
  width: 720px;
  height: 50px; }
  nav ul {
    list-style: none; }
    nav ul li {
      float: left; }
      nav ul li ul {
        display: none; }
      nav ul li:hover ul {
        display: block;
        position: absolute;
        padding: 0;
        z-index: 999; }
        nav ul li:hover ul li {
          float: none; }

.menu, .home, .activities, .adventures, .relationships, .competition {
  background: url(../images/menu.png) no-repeat;
  display: block;
  cursor: pointer;
  height: 30px;
  margin-right: 100px;
  border-bottom: 2px solid transparent; }
  .menu:hover, .home:hover, .activities:hover, .adventures:hover, .relationships:hover, .competition:hover {
    border-bottom: 2px solid #4db557; }

.home {
  width: 97px; }

.activities {
  background-position: 0 -38px;
  width: 195px; }

.adventures {
  background-position: 0 -105px;
  width: 170px; }

.relationships {
  background-position: 0 -135px;
  width: 200px; }

.competition {
  width: 228px;
  background-position: 0 -77px; }

.selected {
  border-bottom: 2px solid #4db557; }

/** HEADINGS **/
.heading, .h_home, .h_teachersnotes, .h_feedback, .h_stills, .h_gettingstarted, .h_competition, .h_prizes {
  background: url(../images/menu.png) no-repeat;
  display: block;
  height: 24px;
  margin-bottom: 10px; }

.h_home {
  background-position: 0 -170px; }

.h_teachersnotes {
  background-position: 0 -228px; }

.h_feedback {
  background-position: 0 -200px; }

.h_stills {
  background-position: 0 -345px; }

.h_gettingstarted {
  background-position: 0 -255px; }

.h_competition {
  background-position: 0 -285px; }

.h_prizes {
  background-position: 0 -315px; }

.survey {
  background: url(../images/button.png) #4db557 no-repeat 10px 10px;
  padding: 5px 10px;
  display: block;
  width: 180px;
  height: 25px; }
  .survey:hover {
    background-position: 10px -20px; }

.launch {
  background: url(../images/button.png) #4db557 no-repeat 25px -60px;
  padding: 5px 10px;
  display: block;
  width: 390px;
  height: 70px;
  position: relative;
  margin: 20px auto;
 }
  .launch:hover {
    background-position: 25px -133px; }

/** GALLERY **/
#stills_container {
  width: 100%;
  height: auto; }

.thumb {
  margin: 0 5px 5px 0; }

/** VIDEOPLAYER **/
.transcript {
  font-size: .8em;
  color: #4db557;
  text-align: right;
  font-weight: 700; }

/** FORMATTING **/
ul {
  margin: 0;
  padding: 0; }

p {
  font-family: Arial, sans-serif;
  font-size: 1em;
  line-height: 1.3em;
  margin: 0 0 1.4em 0; }
  p a {
    color: #4db557;
    text-decoration: none; }
    p a:hover {
      text-decoration: underline; }

/** MISCELLANEOUS **/
#hotspot {
  position: absolute;
  width: 550px;
  height: 140px;
  bottom: 20px;
  left: 45px; }

#fblikewidget {
  position: absolute;
  top: 210px;
  left: 40px; }

.hide {
  display: none; }

.clear {
  clear: both; }
