cm-bootstrap/theatrical-works.html at master · dmueller/cm-bootstrap · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
<html lang="en">

  <head>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <!-- Optional theme -->
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
    <!-- Latest compiled and minified JavaScript -->
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

    <style type="text/css">
      .list-slight-indent {
        padding-left: 10px;
        list-style-type: none;
      }

      body { padding-top: 50px; }

      .navbar { min-height: 0px; }

      figure {
        margin-bottom: 30px;
      }
    </style>

    <title>Caitlin Menotti: theatrical works</title>
  </head>
  <body>

    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container">
        <ul class="list-inline">
          <li><a href="theatrical-works.html">Theatrical Works</a></li>
          <li><a href="personal-projects.html">Personal Projects</a></li>
          <li><a href="cv.html">CV</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </div>
    </nav>

    <div class="container-fluid">
      <div class="row">
        <div class="col-md-2 bg-info" data-role="category-nav">
          <strong>Theatrical Works</strong>
          <ul class="list-unstyled">
            <li>Smaller Show</li>
            <li>Smaller Show</li>
            <li>Larger Show</li>
            <li>
              <ul class="list-slight-indent">
                <li>Garment One</li>
                <li>Garment Two</li>
                <li>Garment Three</li>
              </ul>
            </li>
          </ul>
        </div>

        <div class="col-md-10" data-role="main-content">
          <figure>
            <img src="images/marie-antoinette/sheep.jpg" class="img-responsive" alt="pic1" width="800" height="557">
            <figcaption>Description & commentary of image</figcaption>
          </figure>

          <figure>
            <img src="images/marie-antoinette/sheep.jpg" class="img-responsive" alt="pic1" width="800" height="557">
            <figcaption>Description & commentary of image</figcaption>
          </figure>
        </div>
      </div>
    </div>
  </body>
</html>