<style>
.card {
width: 100%!important;
} 

header {
    padding-top: 70px;
    padding-bottom: 70px;
    position: relative;
}

.bg-text {
    padding: 5px 40px;
    color: #222 !important;
    display: inline-block;
    background: rgba(241,237,227,1);
}

.giant-title {
    font-size: 110px;
    font-weight: 100;
    text-transform: uppercase;
    margin-bottom: 70px;
}

/*Admission to UG Step path*/
.step-img img {
    width: 100%;
}

.step-path-block li {
    list-style-type: none;
}

.admission-ug {
    padding: 40px;
}

.admission-ug .col-6 ul li{
    list-style-type: none;
}

</style>
<style></style>
<header
  id="intro-items"
  class="intro-block cover-bg"
  style="background-image: linear-gradient(0deg,rgba(31,31,31,0.45),rgba(31,31,31,0.7)),url(/sites/default/files/gallery/main_2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;"
>
  <div class="color-overlay"></div>
  <div class="container">
    <div class="row sep-bottom dark-bg">
      <div class="col-md-8">
        <div class="slogan" data-bs-selector="Footer">
          <h1
            data-bs-selector="Footer"
            class="font-weight-100 letter-space-0 roboto bg-text"
          >
            The University of Guyana
          </h1>
          <h2 class="giant-title" data-bs-selector="Footer">
            <strong>Your Journey Begins Here</strong>
          </h2>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-3 col-xs-12">
        <a href="#major" class="goto">
          <div class="post op-85 bg-theme-colored text-center">
            <div class="post-media">
              <i class="fa-solid fa-graduation-cap" style="color:#fff; font-size:100px; margin-top: 10px"></i>
            </div>
            <div class="post-content p-10 pb-20">
              <h4 class="title text-white" data-bs-selector="Footer">
                <strong>FIND YOUR MAJOR</strong>
              </h4>
            </div>
          </div>
        </a>
      </div>
      <div class="col-sm-3 col-xs-12">
        <a href="#apply" class="goto">
          <div class="post op-85 bg-theme-colored text-center">
            <div class="post-media">
              <i class="fa-solid fa-address-card"  style="color:#fff; font-size:100px; margin-top: 10px"></i>
            </div>
            <div class="post-content p-10 pb-20">
              <h4 class="title text-white" data-bs-selector="Footer">
                <strong>APPLY</strong>
              </h4>
            </div>
          </div>
        </a>
      </div>
      <div class="col-sm-3 col-xs-12">
        <a href="#register" class="goto">
          <div class="post op-85 bg-theme-colored text-center">
            <div class="post-media">
              <i class="fa-regular fa-pen-to-square" style="color:#fff; font-size:100px; margin-top: 10px"></i>
            </div>
            <div class="post-content p-10 pb-20">
              <h4 class="title text-white" data-bs-selector="Footer">
                <strong>REGISTER</strong>
              </h4>
            </div>
          </div>
        </a>
      </div>
      <div class="col-sm-3 col-xs-12">
        <a href="#learn" class="goto">
          <div class="post op-85 bg-theme-colored text-center">
            <div class="post-media">
              <i class="fa-regular fa-comment" style="color:#fff; font-size:100px; margin-top: 10px"></i>
            </div>
            <div class="post-content p-10 pb-20">
              <h4 class="title text-white" data-bs-selector="Footer">
                <strong>LEARN MORE</strong>
              </h4>
            </div>
          </div>
        </a>
      </div>
    </div>
  </div>
</header>
<section id="steps-path" data-bs-selector="section" class="bg-white">
  <div class="container">
    <div class="row">
      <div class="col-12">
        <div class="sep-bottom text-center">
          <h2 data-selector="h2">Step by Step</h2>
          <p class="desc-text editContent" data-selector="p">
            We’re proud to offer students and families the value of one of the
            top university experiences in the Guyana. We’re ready to help you
            make the most of the incredible opportunities available in pursuit
            of your UOG degree.
          </p>
        </div>

        <div class="row admission-ug">
          <div class="col-md-6">
            <div class="card" style="width: 18rem">
              <div class="card-body">
                <ul class="step-path-block">
                  <li
                    id="major"
                    data-selector=".step-left-block li, .step-center-block li, .step-path-block li"
                  >
                    <div class="step-text">
                      <h3 class="title" data-selector="h3">Find Your Major</h3>
                      <p data-selector="p">
                        Select from our diverse list of academic programmes to
                        plan your educational journey.
                      </p>
                      <a
                        class="btn btn-primary btn-lg"
                        href="/srms/departments"
                        data-selector="a.btn, a.download-btn, button.btn, a.goto"
                        >Explore Majors</a
                      >
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>

          <div class="col-md-6">
            <div class="step-img">
              <img
                src="/sites/default/files/images/major.png"
                class="screen"
                alt=""
                data-selector="img"
              />
            </div>
          </div>
        </div>

        <div class="row admission-ug">
          <div class="col-md-6">
            <div class="step-img">
              <img
                src="/sites/default/files/images/apply.png"
                class="screen"
                alt=""
                data-selector="img"
              />
            </div>
          </div>

          <div class="col-md-6">
            <div class="card" style="width: 18rem">
              <div class="card-body">
                <ul class="step-path-block">
                  <li
                    id="apply"
                    class="reverse"
                    data-selector=".step-left-block li, .step-center-block li, .step-path-block li"
                  >
                    <div class="step-text">
                      <h3 class="title" data-selector="h3">Apply</h3>
                      <p data-selector="p">
                        We welcome applications from suitably-qualified persons
                        who may wish to pursue Degree, Diploma, or Certificate
                        Programmes from October 2021.
                      </p>
                      <a
                        class="btn btn-primary btn-lg"
                        href="apply-uog"
                        data-selector="a.btn, a.download-btn, button.btn, a.goto"
                        >Apply Now!</a
                      >
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>

        <div class="row admission-ug">
          <div class="col-md-6">
            <div class="card" style="width: 18rem">
              <div class="card-body">
                <ul class="step-path-block">
                  <li
                    id="register"
                    data-selector=".step-left-block li, .step-center-block li, .step-path-block li"
                  >
                    <div class="step-text">
                      <h3 class="title" data-selector="h3">Register</h3>
                      <p data-selector="p">
                        Register for your courses if you have been recently
                        admitted or are a continuing student.
                      </p>
                      <a
                        class="btn btn-primary btn-lg"
                        href="register-courses"
                        data-selector="a.btn, a.download-btn, button.btn, a.goto"
                        >Register Now!</a
                      >
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>

          <div class="col-md-6">
            <div class="step-img">
              <img
                src="/sites/default/files/images/register.png"
                class="screen"
                alt=""
                data-selector="img"
              />
            </div>
          </div>
        </div>

        <div class="row admission-ug">
          <div class="col-md-6">
            <div class="step-img">
              <img
                src="/sites/default/files/images/learn-more.png"
                class="screen"
                alt=""
                data-selector="img"
              />
            </div>
          </div>

          <div class="col-md-6">
            <div class="card" style="width: 18rem">
              <div class="card-body">
                <ul class="step-path-block">
                  <li
                    id="learn"
                    class="reverse"
                    data-selector=".step-left-block li, .step-center-block li, .step-path-block li"
                  >
                    <div class="step-text">
                      <h3 class="title" data-selector="h3">Learn More</h3>
                      <p data-selector="p">
                        Learn about deadlines, tuition and fees, student loans,
                        scholarships and much more.
                      </p>
                      <a
                        class="btn btn-primary btn-lg"
                        href="learn-more"
                        data-selector="a.btn, a.download-btn, button.btn, a.goto"
                        >Learn More</a
                      >
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
