Untitled

<!DOCTYPE html>
<html>
<head>
  <title>Resume</title>
  <style>
    *, *:before, *:after {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
    }
    a {
      color: #c62828;
    }
    pre {
      margin: 0;
    }
    body {
      font-family: "Times New Roman", sans-serif;
      font-size: 16px;
      padding: 0;
      margin: 10px;
      color: #424242;
      text-align: -webkit-center;
      letter-spacing: 0.02em;
    }
    .resume-page {
      display: block;
      height: 28.7cm;
      width: 20cm;
      text-align: left;
      padding: 5px 20px;
      overflow: hidden;
      border: 1px solid #ccc;
    }
    .top-nav {
      padding: 0;
      overflow: hidden;
      height: 2.35cm;
    }
    .top-nav .left-section, .top-nav .right-section {
      display: inline-block;
    }
    .top-nav .left-section {
      width: 285px;
    }
    .top-nav .right-section {
      width: 250px;
      font-size: 0.95rem;
      float: right;
    }
    .top-nav .left-section .resume-name {
      font-size: 2.25rem;
      text-transform: uppercase;
    }
    .top-nav .left-section .student-details {
      margin-top: 5px;
      font-style: italic;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .main-content {
      border-collapse: collapse;
    }
    .main-content tr {
      padding: 15px 0;
      border-top: 1px solid #ccc;
      border-bottom: 1px solid #ccc;
    }
    .main-content th {
      width: 125px;
      font-size: 1.1rem;
      font-style: italic;
      text-align: left;
      display: block;
      padding-top: 15px;
    }
    .main-content td {
      padding-top: 15px;
      padding-bottom: 15px;
    }
    .main-content td.special-td {
      font-size: 1.05rem;
      font-weight: bold;
    }
    .main-content td.special-td .small {
      font-size: 0.8rem;
      font-weight: normal;
    }
    .table-ol {
      margin: 0;
      -webkit-padding-start: 18px;
      font-size: 0.8em;
    }
    .footer {
      text-align: center;
      margin-top: 5px;
      font-size: 0.85em;
    }
  </style>
</head>
<body>
  <div class="resume-page">

    <!-- TOP NAVBAR SECTION -->
    <div class="top-nav">
      <div class="left-section">
        <span class="resume-name">Paras Singla</span>
        <br>
        <span class="student-details">Student, Baba Farid Group of Institutions
      </div>
      <div class="right-section">
        <a href="mailto:sinparas.98@gmail.com">sinparas.98@gmail.com</a>
	<br/>
        +917508836488
      </div>
    </div>

    <!-- MAIN TABLE OF INFORMATION -->
    <table class="main-content">
      <tbody>
        <tr>
          <th>Objective</th>
          <td colspan="3" style="padding-right: 150px;">Looking for

opportunities where my educational qualification and skill set can be put to

optimal use helping me in my professional growth as well as contribute towards

the positive growth of the organisation I am a part of.</td>
        </tr>
        <tr>
          <th rowspan="2">Skills</th>
          <td class="special-td">HTML & CSS<br><span class="small">HTML & CSS

are used to build web pages.</span></td>
          <td class="special-td">JavaScript<br><span class="small">JavaScript

is used to add dynamic functions to a web page.</span></td>
          <td class="special-td">Angular<br><span class="small">Angular - most

powerful framework build by Google.</span></td>
        </tr>
        <tr>
          <th>Technical Knowledge</th>
          <td><pre>C
C++
Java
</pre></td>
          <td><pre>ASP.NET
SQL
HTML
</pre></td>
          <td style="display: block;"><pre>CSS</pre></td>
        </tr>
        <tr>
          <th rowspan="2">Education</th>
          <td colspan="2" class="special-td">10th<br><span class="small">St.

Xavier's Sen. Sec. School</span></td>
          <td style="display: block; text-align: right;">Marks Obtained

90%</td>
        </tr>
	<tr>
          <th class="no-border-top"></th>
	  <td colspan="2" class="special-td">12th<br><span class="small">Rose

Mary Convent School</span></td>
          <td style="display: block; text-align: right;">Marks Obtained

73%</td>
        </tr>
        <tr>
          <th>Hobbies</th>
          <td colspan="3">
            <ol class="table-ol">
              <li>Hobby 1 - Write brief description</li>
              <li>Hobby 2 - Write brief description</li>
              <li>Hobby 3 - Write brief description</li>
              <li>Hobby 4 - Write brief description</li>
            </ol>
          </td>
        </tr>
      </tbody>
    </table>

    <!-- FOOTER SECTION -->
    <div class="footer">
      Paras Singla - <a

href="mailto:sinparas.98@gmail.com">sinparas.98@gmail.com</a> - +917508836488
    </div>
  </div>
</body>
</html>