Menu

The Cloisters

Greyhounds, followed by raches
At the fountain, the horn is dipped
Spears are thrust, the hounds let loose
One is impaled by the mighty horn as
The Unicorn fights back against the lymerers
And escapes.

He comes across a virgin maiden,
Whose touch he has obeyed,
And soothed has he become by it,
Until he is set upon by the hunting party,
He is then thrust upon by spears and
Is felled.

Covered in pomegranate juice,
Sitting ever so tamed and serene,
The Unicorn lives once more
In captivity, but nevertheless
Without a scar to be seen
Is reborn.

Paranoia

How do I know it’s really you?
You don’t.
What if there’s someone or something between us?
There is.
How can you trust them?
You can’t.
I’ll ask you a question only you could answer.
Why?
So that I know it’s you.
Or you could just trust Kerberos.
Who?
I give up.
Why didn’t I call instead.
Live with the regret.

From a Dream

     “Your blood— it’s warm.”
He inspects the blood in the vial. It has the consistency of slime, and is a verdant green. He fiddles with the vial. It opens— some blood spills on his hands.
     “Shit.”
He closes the vial and shakes his bloodied hand. She begins to cry. She walks over to take his hand and then takes the vial back. She turns and begins rolling up her sleeve. They begin to walk towards the door on the left at the end of the mezzanine.
     “Sorry–”
     “How much do you need?”
     “We’ll be needing it from now on for this type of research.”
She turns and looks at him.
     “We know how most things work, just not phasing.”
     “Phasing…is that moving through objects?”
     “Yeah.”
They continue to the door and open it and move into the adjoining room. It is small, maybe ten by ten feet. A table or piece of equipment is on the right side of the room with room to maneuver around it. There are mechanical parts stored here, messily.
He moves towards the door on the opposite side of the room and opens it as she begins to fill the vial. The view through the doorway reveals the tops of two heads, moving towards the door. He closes the door and makes a gesture to her. He grabs an empty beer bottle from a rack beside the door.
     “Hide.”

The Sycophant

I still love her
Even after all these

     Years.

I know she
Does not think of me

     Kindly.

But I cannot forget
The past– our

     Past.

Some would call me
A lover, others

     A Sycophant.

     For,

All I know is
I want Everything from

     Her.

And I’ll love her until I no longer exist.

Eyes

Inspired by Rae Armantrout’s “Eyes”

 

The infinite black
There is light

Traveling faster than anything.

Within the camera obscuras
Photons die

Electrons greedily consume
Their corpses

The signal
Traveling great distances

Along Sodium pumps
Through axons and dendrites

A lacrimal response

From Tantalus Penal Colony

A pandoras box
Does it matter what’s inside?

That person no longer exists…

A part of our cure,
Is to bury the past–
The art of Forgetting.

Neural Synapse Damage!
Spock has never tried this on a Human,
You understand it could be dangerous…

     You will begin to feel a strange euphoria.
          Your body floats.
               Open your mind.
                    We move together.
     Our minds sharing the same thoughts.
     What is our name?
     Who are we?

I can’t forget,

Felt so empty,
So tormented by emptiness
The longing for her,
The pining,
Felt like a fire within the soul.

It’s hard to believe that a man could die of loneliness.

Reflection

In the rain
The ground becomes
Like a mirror
Reflecting light from
Cars and buildings
Traffic and street
Lights as well
A world painted
On a canvas
Of asphalt, concrete
and precise stone
A world so
Etherial and disturbed
By the frolicking
Raindrops falling in
Ever present chaos
Dancing around each
Other like lovers
That long for
One another at
Immense distances rarely
Touching to sweetly
Chance to become
one.

Reminder

My mind betrays me
As I look upon
This photograph of yours
I was absent– without
You as you boarded
That plane and set
Off on an adventure
With who?
The unknown is a
Weighty ghost within my
Mind, ever changing– churning
My insides with a
Deluge of emotions that
Evince qualities of the
Self, qualities I feel
Are better left in
Dark recesses, and forever
Forgotten, but there is
Also a light, faintly,
Relentlessly glimmering within the
Abyss of formless shadow
That draws me closer
To that feeling of
Love unconditional felt by
Many for you, the
Reminder.

Bootstrap

After installing Bootstrap you can quickly get started! Bootstrap uses a 12-column responsive layout placed inside a container.


Here is an example that shows the 12-column responsive grid clearly:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    
    <style type="text/css">
      div { border:1px solid grey; }
    </style>
  </head>
  <body>
    <!-- bootstrap -->
    <div class="container">
      <div class="row">
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
        <div class="col-md-1">.col-md-1</div>
      </div><!-- /row -->
    
      <div class="row">
        <div class="col-md-8">.col-md-8</div>
        <div class="col-md-4">.col-md-4</div>
      </div><!-- /row -->
    
      <div class="row">
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
        <div class="col-md-4">.col-md-4</div>
      </div><!-- /row -->
    
      <div class="row">
        <div class="col-md-6">.col-md-6</div>
        <div class="col-md-6">.col-md-6</div>
      </div><!-- /row -->
      
      <div class="row">
        <div class="col-md-8 col-md-offset-2">.col-md-8 .col-md-offset-2
          <h1>h1. Bootstrap heading <small>Secondary text</small></h1>
          <h2>h2. Bootstrap heading <small>Secondary text</small> <span class="label label-info">New</span></h2>
          <h3>h3. Bootstrap heading <small>Secondary text</small></h3>
          <h4>h4. Bootstrap heading <small>Secondary text</small></h4>
          <h5>h5. Bootstrap heading <small>Secondary text</small></h5>
          <h6>h6. Bootstrap heading <small>Secondary text</small></h6>
          <p class="lead">This is some lead text.</p>
          <p class="text-center bg-primary">This is a <em><mark>standard</mark> centered <strong>bg-primary</strong></em> paragraph.</p>
        </div><!-- /col-md-8 .col-md-offset-2 -->
      </div><!-- /row -->
      
    </div><!-- /container -->
  
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

Responsive Web Design

Responsive Web Design is a technique/technology that involves using fluid, proportional grids and CSS3 media queries. It is relatively easy to implement if you are starting from scratch. It’s a little more difficult to add to existing sites because of it’s use of containers. If you want to get started with a Responsive Web Design here are a few simple steps you can follow:

1) Add a viewport meta tag in the head:

<meta name="viewport" content="width=device-width, initial-scale=1">

2) Add a “breakpoint” in your CSS:

@media screen and (max-width: 767px) {
  /* smaller than 1024x768 for example */
  CSS { ... }
}

3) Define your custom CSS.

4) Repeat steps 2 & 3.


Here is an example that uses two elements with widths of 50% (a maximum of 390px each due to the containing element and padding) which stack on top of each other when the screen width is smaller than 768px:

<!DOCTYPE html><html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style type="text/css">
    body { 
      margin:0;
      padding:0;
    }
    .container {
      margin:auto;
      max-width:800px;
    }
    .grey { 
      background-color:#ccc;
      color:#fff;
      padding:20px;
    }
    .section { 
      box-sizing:border-box; 
      float:left;
      padding:5px;
      width:50%;
    }
    @media screen and (max-width: 767px) {
      .section { width:100%; }
    }
  </style>
</head>
<body>
  <div class="container">
    <div class="section">
      <div class="grey">
        Section 1: Some content.
      </div>
    </div>
  </div>
  <div class="container">
    <div class="section">
      <div class="grey">
        Section 2: Some more content.
      </div>
    </div>
  </div>
</body>
</html>