@media screen and (max-width: 700px) {
.section, .separator
{
background: none !important;
width: 85% !important;
padding: 0 !important;
margin: 0 auto !important;
}

body
{
overflow-x: hidden;
}

h1
{
font-size: 7em !important;
}
}

*
{
-webkit-transition: all 0.2s ease-in; 
-moz-transition: all 0.2s ease-in; 
-o-transition: all 0.2s ease-in; 
transition: all 0.2s ease-in;
}

body
{
font: 17px/1.6 'Alegreya', serif;
color: #fff;
background-color: #000;
margin: 0;
}

a
{
color: #38ecd9;
text-decoration: none;
}

a:hover
{
text-shadow: 0 0 9px #3c8981;
}

.section
{
min-height: 900px;
padding: 0 40% 0 10%;
}

img
{
max-width: 100%;
}

.separator
{
min-height: 200px;
padding: 0 40% 0 10%;
background: url(ai-bg.png) no-repeat fixed bottom right;
}

#intro
{
background: url(ai-bg.png) no-repeat fixed bottom right;
}

#fuji
{
background:
url(ai-bg.png) no-repeat fixed bottom right,
url(fade-in.png) top right repeat-x scroll,
url(fade-out.png) bottom right repeat-x scroll,
url(fuji-bg.png) bottom right no-repeat fixed transparent;
}

#tube
{
background:
url(ai-bg.png) no-repeat fixed bottom right,
url(fade-in.png) top right repeat-x scroll,
url(fade-out.png) bottom right repeat-x scroll,
url(tube-bg.png) bottom right no-repeat fixed transparent;
}

#aitwo
{
background:
url(ai-bg.png) no-repeat fixed bottom right,
url(fade-in.png) top right repeat-x scroll,
url(fade-out.png) bottom right repeat-x scroll,
url(aitwo-bg.png) bottom right no-repeat fixed transparent;
}

#mewtwo
{
background:
url(ai-bg.png) no-repeat fixed bottom right,
url(fade-in.png) top right repeat-x scroll,
url(mewtwo-bg.png) bottom right no-repeat fixed transparent;
}

#ending
{
background:
url(mewtwo-bg.png) bottom right no-repeat fixed,
url(ending-bg.png) bottom right repeat-x scroll,
url(ai-bg.png) no-repeat fixed bottom right transparent;
}

#footnotes
{
background:
url(ending-bg.png) bottom right repeat-x scroll,
url(mewtwo-bg.png) no-repeat fixed bottom right transparent;
}

h1, h2, h3, h4
{
margin: 0;
text-align: center;
}

.infotip span
{
opacity: 0;
display: inline-block;
position: absolute;
min-width: 200px;
background-color: #fff;
color: #000;
padding: .15em .5em;
margin-top: 1em;
font-size: .95em;
text-shadow: none;
}

.infotip
{
position: relative;
color: #fff;
text-shadow: 0 0 6px #fff;
cursor: help;
}

.infotip:hover span
{
opacity: 1;
}

h1
{
font: lighter 10em/1 "Times New Roman", serif;
margin-top: .25em;
}

h2
{
font: 2em/1 'Alegreya', serif;
padding-top: 5em;
margin-bottom: 1em;
}

p
{
margin: 0 0 1.5em;
}

blockquote
{
text-align: center;
font-size: 1.5em;
margin: 1.5em 0;
font-style: italic;
}

blockquote span
{
position: relative;
top: .45em;
font: 3em/0 "Times New Roman", serif;
}

blockquote .openquote
{
margin-right: .3em;
}

blockquote .closequote
{
margin-left: .3em;
}

h2 + blockquote
{
padding-top: 1em;
}

.separator img
{
padding-top: 1em;
}

.images
{
text-align: center;
padding: .5em 0;
}

.images a img:hover
{
box-shadow: 0 0 15px #3c8981;
}

img
{
margin: 1em .5em;
}