text isn't minimizing with screen html/css : hope someone can help! When I minimize the browser screen on this code, everything is minimizing appropriately except for my body text. Not sure why this is happening! Can anybody find the issue in the html or css?

    <!DOCTYPE html>
    <!--
        Ex Machina by TEMPLATED
        templated.co @templatedco
        Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
    -->
    <html>
    <head>
        <title>History: Skating Today</title>
        <meta content="text/html; charset=utf-8" http-equiv="content-type">
        <meta content="" name="description">
        <meta content="" name="keywords">
        <!--[if lte IE 8]><script src="js/html5shiv.js"></script><![endif]-->
    
        <script src=
        "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
        </script>
        <script src="js/skel.min.js">
        </script>
        <script src="js/skel-panels.min.js">
        </script>
        <script src="js/init.js">
        </script> <noscript>
        <link href="css/style.css" rel="stylesheet">
        <style type="text/css">
                .header {
        }
        </style></noscript>
        <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
        <!--[if lte IE 9]><link rel="stylesheet" href="css/ie/v9.css" /><![endif]-->
    </head>
    <body class="page">
        <!-- Header -->
        <div id="page">
            <img alt="Black and white photo of boy skateboarding" height="" src=
            "images/OldTimey.jpg" width="100%">
            <div class="unit header">
                <section>
                    <header>
                        <h3>Unit 1: Skateboarding, Then and Now<br>
                        Lesson 1/3</h3>
                    </header>
                </section>
            </div><!-- Main -->
            <div class="container" id="main">
                <div class="row">
                    <div class="3u">
                        <section class="sidebar">
                            <h4><a href="Index.html">Home</a></h4>
                        </section>
                        <section class="sidebar">
                            <h4><a href="Programme%20Overview.html">Programme
                            Overview</a></h4>
                        </section>
                        <section class="sidebar">
                            <h4><a href="Unit1.html">Unit 1: Skateboarding, Then
                            and Now</a></h4>
                            <ul class="style3">
                                <li><a href="History.html">Lesson 1: History of
                                Skateboarding</a></li>
                                <li><a href="Types.html">Lesson 2: Types of
                                Skating</a></li>
                                <li><a href="Quiz1.html">Unit 1 Quiz</a></li>
                            </ul>
                        </section>
                        <section class="sidebar">
                            <h4><a href="Unit2.html">Unit 2: Why You Should
                            Skate</a></h4>
                            <ul class="style3">
                                <li><a href="EmotionalBenefits.html">Lesson 1:
                                Emotional and Physical Benefits</a></li>
                                <li><a href="SocialBenefits.html">Lesson 2: Social
                                and Enviromental Benefits (Plus a Few
                                More!)</a></li>
                                <li><a href="Quiz2.html">Unit 2 Quiz</a></li>
                            </ul>
                        </section>
                        <section class="sidebar">
                            <h4><a href = "Unit3.html">Unit 3: Safety & Upkeep</a></h4>
                            <ul class="style3">
                                <li><a href="SafePlace.html">Lesson 1: Determining Safe Places
                                to Skate</a></li>
                                <li><a href="Stopping.html">Lesson 2: How to Stop a
                                Board</a></li>
                                <li><a href="Rules.html">Lesson 3: Rules of the
                                Road</a></li>
                                <li><a href="Bearings.html">Lesson 4: Changing Your Bearings</a></li>
                                <li><a href="Trucks.html">Lesson 5: Adjusting Your Trucks</a></li>
                            </ul>
                        </section>
                        <section class="sidebar">
                            <h4>Extras: Skating Routes & Meet a Skater</h4>
                            <ul class="style3">
                                <li><a href="#">From the Flag Poles</a></li>
                                <li><a href="#">From the White Gates</a></li>
                                <li><a href="#">From the Pavilion</a></li>
    							<li><a href="MeetandGreet.html">Meet a Skater</a></li>
                            </ul>
                        </section>
                    </div>
                   <div class= "9u skel-cell-important"">
                
                        <header>
                                    <h3>Skating Today</h3>
                                </header>
                        <p> While some people may still see skaters as
                          rebellious or alternative, skateboarding has once
                          again evolved. In places like Afghanistan, where
                          girls are not allowed to ride bikes but can
                          skateboard, the sport is used to engage and empower
                          youth (skateistan.org). Furthermore, although many
                          skaters still take part in skateboarding to perfect
                          tricks and take risks, skateboarding has become the
                          way that many people get from point A to point B.</p>
    <p></p>
                                <p>While any type of skateboard may be used for
                                transportation, the longboard is having its heyday.
                                A longboard can range anywhere from 33 to 80 inches
                                and typically has softer wheels, making for a
                                smoother and more stable ride, perfect for
                                cruising, less experienced, and older skaters
                                (Ruibal 2006).</p>
                                <img src="images/header.jpg" width="736" height="189" alt=""/><br>
                                <div id="course description">
                                    <br>
                                    <p>This lesson is now complete. To continue to lesson 2, "Types of Skating", click <a href=
                                    "Types.html">next</a>.</p>
                                </div>
                            </div>
                        </section>
                    </div><!-- Main -->
                </div>
            </div>
        </div>
    </body>
    </html>

And the CSS here:


    @charset  "UTF-8";
    
    /*
    	Ex Machina by TEMPLATED
        templated.co @templatedco
        Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
    */
    /*********************************************************************************/
    /* Basic                                                                         */
    /*********************************************************************************/
    body {
        background-image: url(../images/BackgroundImage.jpg);
    }
    
    body,input,textarea,select {
        font-family: Verdana,Geneva,sans-serif;
        font-weight: 300;
        font-size: 16px;
        line-height: 1.5em;
    }
    
    
    h1,h2,h3,h4,h5,h6 {
        letter-spacing: 1px;
        font-weight: 300;
        color: #1b1b5e;
    }
    
    h4 
    {
    	letter-spacing: 1px;
        font-weight: 700;
        color: #1b1b5e;
    	
    }
    
    /* Change this to whatever font weight/color pairing is most suitable */
    strong,b {
        font-weight: 700;
        color: #000;
    }
    
    em,i {
        font-style: italic;
    }
    
    /* Don't forget to set this to something that matches the design */
    a {
        color: blue;
        text-decoration: none;
    }
    
    a:hover {
        text-decoration: underline;
    }
    
    sub {
        position: relative;
        top: .5em;
        font-size: .8em;
    }
    
    sup {
        position: relative;
        top: -.5em;
        font-size: .8em;
    }
    
    hr {
        border: 0;
        border-top: solid 1px #ddd;
    }
    
    blockquote {
        border-left: solid .5em #ddd;
        padding: 1em 0 1em 2em;
        font-style: italic;
    }
    
    p,ul,ol,dl,table {
        margin-right: ;
        margin-bottom: 1em;
        color: #1b1b5e;
    }
    tr. highlight td {
    	padding: 2em;
    }
    
    header {
        margin-bottom: .5em;
        line-height: 2.5em;
        color: #1b1b5e;
    }
    
    header h2 {
        font-size: 24px;
        text-align: left;
    }
    
    header h3 {
        font-size: 22px;
    }
    
    
    footer {
        margin-top: 1em;
    }
    
    
    /* Sections/Articles */
    
    
    section,article {
        margin-bottom: 1em;
    }
    
    .row
    {
    	padding: 0;
    	position; center;
    }
    
    
    .intro {
        text-align: left;
        padding-bottom: 2em;
        font-weight: 700;
    }
    
    .aims {
        padding-top: 2px;
    }
    
    .unit header {
        text-align: right;
        margin-right: 1em;
        color: purple;
    }
    
    table,th,td {
        border: ;
        border-collapse: collapse;
        align-content: center;
    }
    
    th,td {
        padding: 5px;
    }
    
    .boxed {
        border: 1px solid #000;
        padding: 2%;
        margin-right: 10%;
    	margin-bottom: 2em;
    }
    
    * {
        margin: 0;
        padding: 0;
        outline: none;
    }
    
    .formativequiz {
        margin-top: 10px;
        margin-bottom: 10px;
        padding: 10px;
        background: ;
        text-align: left;
    }
    
    .formativequiz h1 {
        font: bold;
    }
    
    .formativequiz p {
        font: bold;
    }
    
    .question {
        overflow: auto;
        margin: ;
        width: 80%;
        background: #fff;
    }
    
    .question h2 {
        float: left;
        margin: 0 40px;
        color: blue;
        font: bold;
    }
    
    .question h2:hover {
        color: #333;
        cursor: pointer;
    }
    
    .question p {
        float: left;
        margin-right: 0;
        color: #fff;
        font: bold 0;
        -webkit-transition: color .3s ease;
        -moz-transition: color .3s ease;
        -ms-transition: color .3s ease;
        -o-transition: color .3s ease;
        transition: color .3s ease;
    }
    
    h2:active ~ .yes {
        color: #1b1b5e;
        font-size: ;
    }
    
    .course description {
        margin-bottom: 3em;
        padding-right: 10%;
    }
    
    #icons {
        height: 128;
        text-align: justify;
        border: none;
        font-size: .1px;
    /* IE 9 & 10 don't like font-size: 0; */
        max-width: 888px;
    }
    
    #icons div {
       
        display: inline-block;
        margin-top: 3em;
        margin-bottom: 3em;
    	padding-right: 10%;
    
    }
    
    #icons:after {
        content: '';
        width: 100%;
    /* Ensures there are at least 2 lines of text, so justification works */
        display: inline-block;
    }
    
    /* Images */
    .image {
        display: block;
    	margin: 2em;
    }
    
    .image img {
        display: block ;
        width: ;
    	margin: 2em;
    	padding: 2em;
    }
    
    .image.featured {
        display: block;
        width: 100%;
        margin: 0;
    }
    
    .image.full {
        display: block;
        width: 100%;
        margin-bottom: 2em;
    }
    
    .image.left {
        float: left;
        margin: 0 2em .8em 0;
    }
    
    .image.centered {
        display: block;
        margin: 0 0 .8em;
    }
    
    .image.centered img {
        margin: 0 auto;
        width: auto;
    }
    
    
    
    /* Lists */
    
    ul.default {
        margin-bottom: 0;
        padding-bottom: 0;
        list-style: none;
    }
    
    ul.default li {
        display: block;
        padding: 2em 0 1.25em;
        border-top: 1px solid #303030;
    }
    
    ul.default li:first-child {
        padding-top: 0;
        border-top: none;
    }
    
    ul.default a {
        text-decoration: none;
        color: rgba(255,255,255,.5);
    }
    
    ul.default a:hover {
    }
    
    ul.style1 {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    
    ul.style1 li {
        padding: .6em 0;
    }
    
    ul.style1 li:first-child {
        padding-top: 0;
        border-top: 0;
    }
    
    ul.style1 img {
    }
    
    ul.style2 {
        text-align: left;
        margin-right: 10%;
        padding: 2%;
        list-style: disc;
        padding-bottom: 1em;
    }
    
    ul.style2 li {
        padding: .5em 0 0;
        list-style-position: inside;
    }
    
    ul.style2 li:first-child {
        padding-top: 0;
        border-top: 0;
    }
    
    ul.style3 {
        margin: 0;
        padding: 5px;
        list-style: none;
        font: 14px;
    }
    
    ul.style3 li {
        padding-left: .6em;
    	line-height: 150%;
    }
    
    ul.style3 li:first-child {
        padding-top: 0;
        border-top: 0;
    }
    
    ul.style5 {
        overflow: hidden;
        margin: 0 0 1em;
        padding: 0;
        list-style: none;
    }
    
    ul.style5 li {
        float: left;
        padding: .25em;
        line-height: 0;
    }
    
    ul.style5 a {
    }
    
    /*********************************************************************************/
    /* Header                                                                        */
    /*********************************************************************************/
    
    
    
    /*********************************************************************************/
    /* Main                                                                          */
    /*********************************************************************************/
    #page {
        margin: 7em;
        position: center;
        background: #fff;
    }
    
    #main {
        padding: 1em;
    }
    
    #container {
    	position: center;
        margin: 1em;
        padding: 1em;
    }
    
    
    
    /*********************************************************************************/
    /* Icons                                                                         */
    /*********************************************************************************/
    
    
    .greenleaf {
        align-content: relative;
    }
    
    .trafficlight {
        align-content: relative;
    }
    
    .pinkskater {
    }
    
    .map {
    }