diff --git a/doc/source/_static/css/getting_started.css b/doc/source/_static/css/getting_started.css
index bb24761cdb159..58d633245937d 100644
--- a/doc/source/_static/css/getting_started.css
+++ b/doc/source/_static/css/getting_started.css
@@ -66,6 +66,7 @@
 }
 
 /* reference to user guide */
+
 .gs-torefguide {
   align-items: center;
   font-size: 0.9rem;
@@ -129,69 +130,6 @@ ul.task-bullet > li > p:first-child {
   padding-left: 0.75rem;
 }
 
-/* Getting started index page */
-
-.intro-card {
-  background:#FFF;
-  border-radius:0;
-  padding: 30px 10px 10px 10px;
-  margin: 10px 0px;
-}
-
-.intro-card .card-text {
-  margin:20px 0px;
-  /*min-height: 150px; */
-}
-
-.intro-card .card-img-top {
-  margin: 10px;
-}
-
-.install-block {
-  padding-bottom: 30px;
-}
-
-.install-card .card-header {
-  border: none;
-  background-color:white;
-  color: #150458;
-  font-size: 1.1rem;
-  font-weight: bold;
-  padding: 1rem 1rem 0rem 1rem;
-}
-
-.install-card .card-footer {
-  border: none;
-  background-color:white;
-}
-
-.install-card pre {
-  margin: 0 1em 1em 1em;
-}
-
-.custom-button {
-  background-color:#DCDCDC;
-  border: none;
-  color: #484848;
-  text-align: center;
-  text-decoration: none;
-  display: inline-block;
-  font-size: 0.9rem;
-  border-radius: 0.5rem;
-  max-width: 120px;
-  padding: 0.5rem 0rem;
-}
-
-.custom-button a {
-  color: #484848;
-}
-
-.custom-button p {
-  margin-top: 0;
-  margin-bottom: 0rem;
-  color: #484848;
-}
-
 /* intro to tutorial collapsed cards */
 
 .tutorial-accordion {
diff --git a/doc/source/_static/css/pandas.css b/doc/source/_static/css/pandas.css
index 43cd631890330..6ecae296a237e 100644
--- a/doc/source/_static/css/pandas.css
+++ b/doc/source/_static/css/pandas.css
@@ -1,15 +1,30 @@
 /* Getting started index page */
 
 .intro-card {
-  background: #fff;
-  border-radius: 0;
-  padding: 30px 10px 10px 10px;
+  background:#FFF;
+  border-radius:0;
+  padding: 10px 10px 10px 10px;
   margin: 10px 0px;
 }
 
+.intro-card .card-title {
+  color: #150458;
+  font-size: 1.1rem;
+  font-weight: bold;
+}
+
 .intro-card .card-text {
   margin: 20px 0px;
-  /*min-height: 150px; */
+}
+
+.intro-card .card-img-top {
+  margin: 20px 10px 10px 10px;
+}
+
+.intro-card .card-footer {
+  border: none;
+  background-color:white;
+  padding: 0rem 1.25rem;
 }
 
 .custom-button {
@@ -23,6 +38,7 @@
   border-radius: 0.5rem;
   max-width: 220px;
   padding: 0.5rem 0rem;
+  width: 100%
 }
 
 .custom-button a {
@@ -33,4 +49,4 @@
   margin-top: 0;
   margin-bottom: 0rem;
   color: #484848;
-}
+}
\ No newline at end of file
diff --git a/doc/source/conf.py b/doc/source/conf.py
index a95cd4ab696f7..4936238e129c6 100644
--- a/doc/source/conf.py
+++ b/doc/source/conf.py
@@ -255,6 +255,9 @@
 # Additional templates that should be rendered to pages, maps page names to
 # template names.
 
+# Do not make scaled images a link
+html_scaled_image_link = False
+
 # Add redirect for previously existing API pages
 # each item is like `(from_old, to_new)`
 # To redirect a class and all its methods, see below
diff --git a/doc/source/getting_started/index.rst b/doc/source/getting_started/index.rst
index a2f8f79f22ae4..1551b62aa1b8a 100644
--- a/doc/source/getting_started/index.rst
+++ b/doc/source/getting_started/index.rst
@@ -11,82 +11,62 @@ Installation
 
 Before you can use pandas, you’ll need to get it installed.
 
-.. raw:: html
+.. container:: container
 
-    <div class="container">
-        <div class="row">
-            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 d-flex install-block">
-                <div class="card install-card shadow w-100">
-                <div class="card-header">
-                    Working with conda?
-                </div>
-                <div class="card-body">
-                    <p class="card-text">
+    .. container:: row
 
-Pandas is part of the `Anaconda <http://docs.continuum.io/anaconda/>`__ distribution and can be
-installed with Anaconda or Miniconda:
+        .. container:: col-lg-6 col-md-6 col-sm-12 col-xs-12 d-flex install-block
 
-.. raw:: html
+            .. container:: card intro-card shadow w-100
 
-                    </p>
-                </div>
-                <div class="card-footer text-muted">
+                .. container:: card-body
 
-.. code-block:: bash
+                    .. container:: card-title
 
-   conda install pandas
+                        Working with conda?
 
-.. raw:: html
+                    Pandas is part of the `Anaconda <http://docs.continuum.io/anaconda/>`_ distribution and can be
+                    installed with Anaconda or Miniconda:
 
-                </div>
-                </div>
-            </div>
-            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 d-flex install-block">
-                <div class="card install-card shadow w-100">
-                <div class="card-header">
-                    Prefer pip?
-                </div>
-                <div class="card-body">
-                    <p class="card-text">
+                .. container:: card-footer text-muted
 
-Pandas can be installed via pip from `PyPI <https://pypi.org/project/pandas>`__.
+                    .. code-block:: bash
 
-.. raw:: html
+                        conda install pandas
 
-                    </p>
-                </div>
-                <div class="card-footer text-muted">
+        .. container:: col-lg-6 col-md-6 col-sm-12 col-xs-12 d-flex install-block
 
-.. code-block:: bash
+            .. container:: card intro-card shadow w-100
 
-   pip install pandas
+                .. container:: card-body
 
-.. raw:: html
+                    .. container:: card-title
 
-                </div>
-                </div>
-            </div>
-            <div class="col-12 d-flex install-block">
-                <div class="card install-card shadow w-100">
-                <div class="card-header">
-                    In-depth instructions?
-                </div>
-                <div class="card-body">
-                    <p class="card-text">Installing a specific version?
-                      Installing from source?
-                      Check the advanced installation page.</p>
+                        Prefer pip?
 
-.. container:: custom-button
+                    Pandas can be installed via pip from `PyPI <https://pypi.org/project/pandas>`__.
 
-    :ref:`Learn more <install>`
+                .. container:: card-footer text-muted
 
-.. raw:: html
+                    .. code-block:: bash
 
-                </div>
-                </div>
-            </div>
-        </div>
-    </div>
+                        pip install pandas
+
+        .. container:: col-12 d-flex install-block
+
+            .. container:: card intro-card shadow w-100
+
+                .. container:: card-body
+
+                    .. container:: card-title
+
+                        In-depth instructions?
+
+                    Installing a specific version? Installing from source? Check the advanced installation page.
+
+                    .. container:: custom-button
+
+                        :ref:`Learn more <install>`
 
 .. _gentle_intro:
 
@@ -572,81 +552,84 @@ Currently working with other software for data manipulation in a tabular format?
 data operations and know *what* to do with your tabular data, but lacking the syntax to execute these operations. Get to know
 the pandas syntax by looking for equivalents from the software you already know:
 
-.. raw:: html
+.. container:: container
 
-    <div class="container">
-        <div class="row">
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="../_static/logo_r.svg" class="card-img-top" alt="R project logo" height="72">
-                <div class="card-body flex-fill">
-                    <p class="card-text">The <a href="https://www.r-project.org/">R programming language</a> provides the <code>data.frame</code> data structure and multiple packages,
-                        such as <a href="https://www.tidyverse.org/">tidyverse</a> use and extend <code>data.frame</code>s for convenient data handling
-                        functionalities similar to pandas.</p>
+    .. container:: row
 
-.. container:: custom-button
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
 
-    :ref:`Learn more <compare_with_r>`
+            .. container:: card text-center intro-card shadow
 
-.. raw:: html
+                .. image:: ../_static/logo_r.svg
+                    :class: card-img-top
+                    :height: 72px
+                    :alt: R project logo
 
-                </div>
-                </div>
-            </div>
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="../_static/logo_sql.svg" class="card-img-top" alt="SQL logo" height="72">
-                <div class="card-body flex-fill">
-                    <p class="card-text">Already familiar to <code>SELECT</code>, <code>GROUP BY</code>, <code>JOIN</code>,...?
-                    Most of these SQL manipulations do have equivalents in pandas.</p>
+                .. container:: card-body flex-fill
 
-.. container:: custom-button
+                    The `R programming language <https://www.r-project.org/>`_ provides the ``data.frame`` data
+                    structure and multiple packages, such as `tidyverse <https://www.tidyverse.org/>`_ use and
+                    extend ``data.frame`` s for convenient data handling functionalities similar to pandas.
 
-    :ref:`Learn more <compare_with_sql>`
+                    .. container:: custom-button
 
-.. raw:: html
+                        :ref:`Learn more <compare_with_r>`
 
-                    </div>
-                    </div>
-                </div>
-                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                    <div class="card text-center intro-card shadow">
-                    <img src="../_static/logo_stata.svg" class="card-img-top" alt="STATA logo" height="52">
-                    <div class="card-body flex-fill">
-                        <p class="card-text">The <code>data set</code> included in the
-                            <a href="https://en.wikipedia.org/wiki/Stata">STATA</a> statistical software suite corresponds
-                            to the pandas <code>data.frame</code>. Many of the operations known from STATA have an equivalent
-                            in pandas.</p>
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
 
-.. container:: custom-button
+            .. container:: card text-center intro-card shadow
 
-    :ref:`Learn more <compare_with_stata>`
+                .. image:: ../_static/logo_sql.svg
+                    :class: card-img-top
+                    :height: 72px
+                    :alt: SQL logo
 
-.. raw:: html
+                .. container:: card-body flex-fill
 
-                    </div>
-                    </div>
-                </div>
-                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                    <div class="card text-center intro-card shadow">
-                    <img src="../_static/logo_sas.svg" class="card-img-top" alt="SAS logo" height="52">
-                    <div class="card-body flex-fill">
-                        <p class="card-text">The  <a href="https://en.wikipedia.org/wiki/SAS_(software)">SAS</a> statistical software suite
-                            also provides the <code>data set</code> corresponding to the pandas <code>data.frame</code>.
-                            Also vectorized operations, filtering, string processing operations,... from SAS have similar
-                            functions in pandas.</p>
+                    Already familiar to ``SELECT``, ``GROUP BY``, ``JOIN``,...?
+                    Most of these SQL manipulations do have equivalents in pandas.
 
-.. container:: custom-button
+                    .. container:: custom-button
 
-    :ref:`Learn more <compare_with_sas>`
+                        :ref:`Learn more <compare_with_sql>`
 
-.. raw:: html
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
 
-                    </div>
-                    </div>
-                </div>
-        </div>
-    </div>
+            .. container:: card text-center intro-card shadow
+
+                .. image:: ../_static/logo_stata.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: Stata logo
+
+                .. container:: card-body flex-fill
+
+                    The ``data set`` included in the `STATA <https://en.wikipedia.org/wiki/Stata>`_ statistical software
+                    suite corresponds to the pandas ``data.frame``. Many of the operations known from STATA have an equivalent
+                    in pandas.
+
+                    .. container:: custom-button
+
+                        :ref:`Learn more <compare_with_stata>`
+
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
+
+            .. container:: card text-center intro-card shadow
+
+                .. image:: ../_static/logo_sas.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: SAS logo
+
+                .. container:: card-body flex-fill
+
+                    The  `SAS statistical software suite <https://en.wikipedia.org/wiki/SAS_(software)>`_
+                    provides the ``data set`` corresponding to the pandas ``data.frame``. Also vectorized operations,
+                    filtering, string processing operations,... from SAS have similar functions in pandas.
+
+                    .. container:: custom-button
+
+                        :ref:`Learn more <compare_with_sas>`
 
 Community tutorials
 -------------------
diff --git a/doc/source/index.rst.template b/doc/source/index.rst.template
index 7eb25790f6a7a..11968af4f7539 100644
--- a/doc/source/index.rst.template
+++ b/doc/source/index.rst.template
@@ -23,82 +23,100 @@ pandas documentation
 easy-to-use data structures and data analysis tools for the `Python <https://www.python.org/>`__
 programming language.
 
-.. raw:: html
-
-    <div class="container">
-        <div class="row">
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="_static/index_getting_started.svg" class="card-img-top" alt="getting started with pandas action icon" height="52">
-                <div class="card-body flex-fill">
-                    <h5 class="card-title">Getting started</h5>
-                    <p class="card-text">New to <em>pandas</em>? Check out the getting started guides. They
-                    contain an introduction to <em>pandas'</em> main concepts and links to additional tutorials.</p>
-
-.. container:: custom-button
-
-    :ref:`To the getting started guides<getting_started>`
-
-.. raw:: html
-
-                </div>
-                </div>
-            </div>
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="_static/index_user_guide.svg" class="card-img-top" alt="pandas user guide action icon" height="52">
-                <div class="card-body flex-fill">
-                    <h5 class="card-title">User guide</h5>
-                    <p class="card-text">The user guide provides in-depth information on the
-                    key concepts of pandas with useful background information and explanation.</p>
-
-.. container:: custom-button
-
-    :ref:`To the user guide<user_guide>`
-
-.. raw:: html
-
-                </div>
-                </div>
-            </div>
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="_static/index_api.svg" class="card-img-top" alt="api of pandas action icon" height="52">
-                <div class="card-body flex-fill">
-                    <h5 class="card-title">API reference</h5>
-                    <p class="card-text">The reference guide contains a detailed description of
-                    the pandas API. The reference describes how the methods work and which parameters can
-                    be used. It assumes that you have an understanding of the key concepts.</p>
-
-.. container:: custom-button
-
-    :ref:`To the reference guide<api>`
-
-.. raw:: html
-
-                </div>
-                </div>
-            </div>
-            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex">
-                <div class="card text-center intro-card shadow">
-                <img src="_static/index_contribute.svg" class="card-img-top" alt="contribute to pandas action icon" height="52">
-                <div class="card-body flex-fill">
-                    <h5 class="card-title">Developer guide</h5>
-                    <p class="card-text">Saw a typo in the documentation? Want to improve
-                    existing functionalities? The contributing guidelines will guide
-                    you through the process of improving pandas.</p>
+.. container:: container
+
+    .. container:: row
+
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
+
+            .. container:: card text-center intro-card shadow
+
+                .. image:: _static/index_getting_started.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: getting started with pandas action icon
+
+                .. container:: card-body flex-fill
+
+                    .. container:: card-title
+
+                        Getting started
+
+                    New to *pandas*? Check out the getting started guides. They
+                    contain an introduction to *pandas'* main concepts and links to
+                    additional tutorials.
+
+                    .. container:: custom-button
+
+                        :ref:`To the getting started guides<getting_started>`
+
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
+
+            .. container:: card text-center intro-card shadow
+
+                .. image:: _static/index_user_guide.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: pandas user guide action icon
+
+                .. container:: card-body flex-fill
+
+                    .. container:: card-title
+
+                        User guide
+
+                    The user guide provides in-depth information on the key concepts
+                    of pandas with useful background information and explanation.
 
-.. container:: custom-button
+                    .. container:: custom-button
 
-    :ref:`To the development guide<development>`
+                        :ref:`To the user guide<user_guide>`
+
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
+
+            .. container:: card text-center intro-card shadow
+
+                .. image:: _static/index_api.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: api of pandas action icon
+
+                .. container:: card-body flex-fill
+
+                    .. container:: card-title
+
+                        API reference
+
+                    The reference guide contains a detailed description of the pandas API. The reference
+                    describes how the methods work and which parameters can be used. It assumes that
+                    you have an understanding of the key concepts.
+
+                    .. container:: custom-button
+
+                        :ref:`To the reference guide<api>`
+
+        .. container:: col-lg-6 col-md-6 col-sm-6 col-xs-12 d-flex
+
+            .. container:: card text-center intro-card shadow
+
+                .. image:: _static/index_contribute.svg
+                    :class: card-img-top
+                    :height: 52px
+                    :alt: contribute to pandas action icon
+
+                .. container:: card-body flex-fill
+
+                    .. container:: card-title
+
+                        Developer guide
+
+                    Saw a typo in the documentation? Want to improve
+                    existing functionalities? The contributing guidelines will guide
+                    you through the process of improving pandas.
 
-.. raw:: html
+                    .. container:: custom-button
 
-                </div>
-                </div>
-            </div>
-        </div>
-    </div>
+                        :ref:`To the development guide<development>`
 
 
 {% if single_doc and single_doc.endswith('.rst') -%}