<html class="no-js" lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Test Bed Page</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        
        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
        <link rel="apple-touch-icon" href="apple-touch-icon.png">

        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.min.css">

        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

        <link rel="stylesheet" href="css/style.css" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
        <!--<link rel="stylesheet" href="css/main.css"> -->
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- Add your site or application content here -->
        
        <div class="container">
        	<table>
        		<tr>
        			<td class="info-middle">
        				<h1>Steven Andrews</h1>
        			</td>
        			<td class="info-small text-right info-middle">
        				<p>1234 Somewhere St Birmingham, AL 35333</p>
        				<p>Ph: (205) 555-5555 | Email: sandrewsjscc@gmail.com</p>
        			</td>
        		</tr>
        	</table>
        </div>

		<hr />

		<div class="container">
			<table>
				<tr>
					<td>
						<h2 class="sec-label">Technical Skills</h2>
					</td>
					<td>
						<h3>Adobe Creative Cloud</h3>
						<ul>
							<li>Photoshop</li>
							<li>Illustrator</li>
							<li>Premiere Pro</li>
							<li>After Effects</li>
							<li>Encore</li>
							<li>Media Encoder</li>
						</ul>
					</td>
					<td>
						<h3>Web Technology</h3>
						<ul>
							<li>HTML 5</li>
							<li>CSS 3</li>
							<li>JavaScript</li>
							<li>JQuery</li>
							<li>MySQL</li>
							<li>PHP</li>
						</ul>
					</td>
					<td>
						<h3>Responsive Framework</h3>
						<ul>
							<li>Twitter Bootstrap</li>
						</ul>
						<h3>MS Office 2016</h3>
						<ul>
							<li>Word</li>
							<li>Excel</li>
							<li>Power Point</li>
							<li>Outlook</li>
						</ul>
					</td>
				</tr>

			</table>

			<table>
				<tr>
					<td>
						<h2 class="sec-label">Objective</h2>
					</td>
					<td class="content">
						<p>
							Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quia voluptatibus quaerat veniam placeat, assumenda eum tempore quos cum possimus saepe consectetur dolorum sequi, repellat, officia natus, veritatis magnam asperiores molestiae. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem debitis, explicabo veritatis adipisci voluptatum optio neque minus et corrupti, ducimus.
						</p>
					</td>
				</tr>
			</table>

			<table>
				<tr>
					<td>
						<h2 class="sec-label">Education</h2>
					</td>
					<td class="content">
						<h3>2011 - 2012 Kaplan University</h3>
						<p>Course: BS Degree in Information System &amp; Technology</p>
						<p>Achievement: National Honor Society</p>
					</td>
					<td class="location">
						<h3>Davenport, IA</h3>
					</td>
				</tr>
				<tr>
					<td>
						<!--null space-->
					</td>
					<td class="content">
						<h3>2008 - 2010 ITT Technical Institute</h3>
						<p>Course: AS Degree in Visual Communication</p>
						<p>Achievement: Dean List</p>
					</td>
					<td class="location">
						<h3>Bessemer, AL</h3>
					</td>
				</tr>
				<tr>
					<td>
						<!--null space-->
					</td>
					<td class="content">
						<h3>1999 - 2002 Lane College/ Univ. North Alabama</h3>
						<p>Course: Computer Science</p>
					</td>
					<td class="location">
						<h3>Jackson,TN / Florence, AL</h3>
					</td>
				</tr>

				<tr>
					<td>
						<h2 class="sec-label">Work Experience</h2>
					</td>
					<td class="content">
						<h3>2013 - 2016 &nbsp; &nbsp;<span><strong>Infinity Insurance</strong></span></h3>
            
            <!-- ADD POSITION TITLE -->
						<ul>
							<li>Job Duty 1</li>
							<li>Job Duty 2</li>
							<li>Job Duty 3</li>
						</ul>
					</td>
					<td class="location">
						<h3>Birmingham, AL</h3>
					</td>
				</tr>
				<tr>
					<td>
						<!--null space-->
					</td>
					<td class="content">
						<h3>2013 - 2014  &nbsp; &nbsp;<span><strong>ITT Technical Institute</strong></span></h3>
            <!-- ADD POSITION TITLE -->
						<ul>
							<li>Job Duty 1</li>
							<li>Job Duty 2</li>
							<li>Job Duty 3</li>
						</ul>
					</td>
					<td class="location">
						<h3>Bessemer, AL</h3>
					</td>
				</tr>
				<tr>
					<td>
						<!--null space-->
					</td>
					<td class="content">
						<h3>2007 - Present &nbsp; &nbsp;<span><strong>OSI DESIGNS</strong></span></h3>
            <!-- ADD POSITION TITLE -->
						<ul>
							<li>Job Duty 1</li>
							<li>Job Duty 2</li>
							<li>Job Duty 3</li>
						</ul>
					</td>
					<td class="location">
						<h3>Birmingham, AL</h3>
					</td>
				</tr>

			</table>

		</div>


        <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.12.4.min.js"><\/script>')</script>

        <!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
        <script>
            window.ga=function(){ga.q.push(arguments)};ga.q=[];ga.l=+new Date;
            ga('create','UA-XXXXX-Y','auto');ga('send','pageview')
        </script>
        <script src="https://www.google-analytics.com/analytics.js" async defer></script>
    </body>
</html>


table{
	width: 100%;
}

td{
	vertical-align: top;
}

td.content p{
	padding: 15px 20px 5px 150px;
}

td.content h3{
	padding-left: 20px
}

td.location{
	text-align: right;
}

h1{
	font-size: 3.2em;
	font-weight: 700;
}

h2{
	font-size: 2.0;
	font-weight: 700;
}


.info-small p{
  font-size: 1em;
  margin: 3px 0;
}

.info-middle{
	vertical-align: middle;
}

hr{
	margin: 0 auto 10px auto;
	border: 1px solid #2d2d2d;
}

h2.sec-label{
	margin-top: 15px;
}

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.