html { background-color: black; }
a { color: #ff0066; } a:hover {text-decoration: underline;}
footer { position: absolute; bottom: 50px; right: 50px; }
strong {color: #ff0066}
body {
    font-family: 'oswald', arial, serif;
    background-color: white;
    color: white;
    font-size: 2em;
    background: #1c1c1c;
    background-image: -moz-radial-gradient(center 45deg, #333 0%, #1c1c1c 50%);
    background-image: -moz-radial-gradient(center 45deg, #333 0%, #1c1c1c 50%);
}


/* transition effect */
section {
    -moz-transition: left 400ms linear 0s;
    -webkit-transition: left 400ms linear 0s;
    -o-transition: left 400ms linear 0s;
    -ms-transition: left 400ms linear 0s;
    transition: left 400ms linear 0s;
}
section { left: -150%; }
section[aria-selected] { left: 0; }
section[aria-selected] ~ section { left: +150% }

.chapter { background-color: black;}
.chapter h1 {line-height: 600px; vertical-align: middle; margin: 0; text-align: center; display: block}

h1 {
    margin: 50px 100px 0 100px;
    font-size: 50px;
    text-shadow: 0px -1px 0px #000;
    text-align: left;
}
h2 {
    color: #fae50b;
    margin: 70px 0 0 0;
    font-size: 40px;
    text-align: center;
}
ul {
    margin-top: 70px;
    font-size: 35px;
    text-align: right;
    border-right: 4px solid white;
    padding-right: 40px;
    min-width: 310px;
    margin-left: 50px;
    display: inline-block;
}
q, p {
    margin: 50px auto 0 auto;
    width: 500px;
}
q:after {content: ""}
q:before {content: ""}
q {
    display: block;
    margin-top: 140px;
}
video {
    position: absolute;
    top: 210px;
    width: 260px;
    left: 445px;
    box-shadow: 0 0 10px black;
}
#arrow {
    position: absolute;
    top: 165px;
    left: 460px;
    font-size: 100px;
    color: white;

}
li {list-style-type: none}






* { margin: 0; padding: 0; }
details {display: none;}
body {
  width: 800px; height: 600px;
  margin-left: -400px; margin-top: -300px;
  position: absolute; top: 50%; left: 50%;
  overflow: hidden;
}
section {
  position: absolute;
  pointer-events: none;
  width: 100%; height: 100%;
}
section[aria-selected] { pointer-events: auto;}
body {display: none}
body.loaded {display: block}


section.code pre { margin: 20px 0 0 40px;font-size: 15px; font-weight: bold;}
section.code .Constant { color: #af5fff}
section.code .StorageClass { color: #ff8700}
section.code .Exception { color: #87ff00}
section.code .Identifier { color: #ff8700}
section.code .Title { color: #d75f00}
section.code .String { color: #afaf87}
section.code .Type { color: #5fd7ff}
section.code .Statement { color: #d7005f}
section.code .Function { color: #87ff00}
section.code .Comment { color: #CCC}

/* Cedric extensions */
section img {max-width: 100%; max-height: 80%; display: block; margin-left: auto; margin-right: auto;}