title: Add 3 columns in a html site
body: <p>I made this site here. But it looks really weird as their is a big blank space. How can I bring up a article to make it next to them all. Site link: <a href="https://acanhs.org/nhs-articles.html" rel="nofollow noreferrer">https://acanhs.org/nhs-articles.html</a>
  My html:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  
    &lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1, shrink-to-fit=no&quot;&gt;
      &lt;meta name=&quot;description&quot; content=&quot;&quot;&gt;
      &lt;meta name=&quot;author&quot; content=&quot;&quot;&gt;
      &lt;link href=&quot;https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&amp;display=swap&quot; rel=&quot;stylesheet&quot;&gt;
      &lt;meta charset=&quot;utf-8&quot;&gt;
      &lt;title&gt;ACA NHS&lt;/title&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;stylesheet.css&quot;&gt;
      &lt;link rel=&quot;shortcut icon&quot; href=&quot;favico/favicon.ico&quot;&gt;
      &lt;link rel=&quot;icon&quot; sizes=&quot;16x16 32x32 64x64&quot; href=&quot;favico/favicon.ico&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;196x196&quot; href=&quot;favico/favicon-192.png&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;160x160&quot; href=&quot;favico/favicon-160.png&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;96x96&quot; href=&quot;favico/favicon-96.png&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;64x64&quot; href=&quot;favico/favicon-64.png&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;32x32&quot; href=&quot;favico/favicon-32.png&quot;&gt;
      &lt;link rel=&quot;icon&quot; type=&quot;image/png&quot; sizes=&quot;16x16&quot; href=&quot;favico/favicon-16.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; href=&quot;favico/favicon-57.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;114x114&quot; href=&quot;favico/favicon-114.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;72x72&quot; href=&quot;favico/favicon-72.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;144x144&quot; href=&quot;favico/favicon-144.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;60x60&quot; href=&quot;favico/favicon-60.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;120x120&quot; href=&quot;favico/favicon-120.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;76x76&quot; href=&quot;favico/favicon-76.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;152x152&quot; href=&quot;favico/favicon-152.png&quot;&gt;
      &lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;180x180&quot; href=&quot;favico/favicon-180.png&quot;&gt;
      &lt;meta name=&quot;msapplication-TileColor&quot; content=&quot;#FFFFFF&quot;&gt;
      &lt;meta name=&quot;msapplication-TileImage&quot; content=&quot;favico/favicon-144.png&quot;&gt;
      &lt;meta name=&quot;msapplication-config&quot; content=&quot;favico/browserconfig.xml&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css&quot;&gt;
  
      &lt;title&gt;Stand Blog Posts&lt;/title&gt;
      
      &lt;link href=&quot;bootstrap.min.css&quot; rel=&quot;stylesheet&quot;&gt;
      
      &lt;style&gt;
  a:link {
    color: Black;
    background-color: transparent;
    text-decoration: none;
  }
  a:visited {
    color: Black;
    background-color: transparent;
    text-decoration: none;
  }
  a:hover {
    color: Black;
    background-color: transparent;
      text-decoration: none;
  }
  a:active {
    color: Black;
    background-color: transparent;
      text-decoration: none;
  }
  &lt;/style&gt;
      &lt;style&gt;
  
  
  .btn {
    width: 150px;
    height: 150px;
    background: #ddd;
    position: relative;
    text-align: center;
    margin: 15px;
    overflow: hidden;
    border-radius: 100%;
    display: inline-block;
  }
  .btn.download {
    background: #00CCFF;
  }
  .btn.download .cloud {
    box-shadow: 0px 0px #00a3cc, 1px 1px #00a3cc, 2px 2px #00a3cc, 3px 3px #00a3cc, 4px 4px #00a3cc, 5px 5px #00a3cc, 6px 6px #00a3cc, 7px 7px #00a3cc, 8px 8px #00a3cc, 9px 9px #00a3cc, 10px 10px #00a3cc, 11px 11px #00a3cc, 12px 12px #00a3cc, 13px 13px #00a3cc, 14px 14px #00a3cc, 15px 15px #00a3cc, 16px 16px #00a3cc, 17px 17px #00a3cc, 18px 18px #00a3cc, 19px 19px #00a3cc, 20px 20px #00a3cc, 21px 21px #00a3cc, 22px 22px #00a3cc, 23px 23px #00a3cc, 24px 24px #00a3cc, 25px 25px #00a3cc, 26px 26px #00a3cc, 27px 27px #00a3cc, 28px 28px #00a3cc, 29px 29px #00a3cc, 30px 30px #00a3cc, 31px 31px #00a3cc, 32px 32px #00a3cc, 33px 33px #00a3cc, 34px 34px #00a3cc, 35px 35px #00a3cc, 36px 36px #00a3cc, 37px 37px #00a3cc, 38px 38px #00a3cc, 39px 39px #00a3cc, 40px 40px #00a3cc, 41px 41px #00a3cc, 42px 42px #00a3cc, 43px 43px #00a3cc, 44px 44px #00a3cc, 45px 45px #00a3cc, 46px 46px #00a3cc, 47px 47px #00a3cc, 48px 48px #00a3cc, 49px 49px #00a3cc, 50px 50px #00a3cc;
  }
  .btn.download .arrow {
    -webkit-animation: download 1s linear infinite;
    animation: download 1s linear infinite;
  }
  .btn.upload {
    background: #F49845;
  }
  .btn.upload .cloud {
    box-shadow: 0px 0px #f17d15, 1px 1px #f17d15, 2px 2px #f17d15, 3px 3px #f17d15, 4px 4px #f17d15, 5px 5px #f17d15, 6px 6px #f17d15, 7px 7px #f17d15, 8px 8px #f17d15, 9px 9px #f17d15, 10px 10px #f17d15, 11px 11px #f17d15, 12px 12px #f17d15, 13px 13px #f17d15, 14px 14px #f17d15, 15px 15px #f17d15, 16px 16px #f17d15, 17px 17px #f17d15, 18px 18px #f17d15, 19px 19px #f17d15, 20px 20px #f17d15, 21px 21px #f17d15, 22px 22px #f17d15, 23px 23px #f17d15, 24px 24px #f17d15, 25px 25px #f17d15, 26px 26px #f17d15, 27px 27px #f17d15, 28px 28px #f17d15, 29px 29px #f17d15, 30px 30px #f17d15, 31px 31px #f17d15, 32px 32px #f17d15, 33px 33px #f17d15, 34px 34px #f17d15, 35px 35px #f17d15, 36px 36px #f17d15, 37px 37px #f17d15, 38px 38px #f17d15, 39px 39px #f17d15, 40px 40px #f17d15, 41px 41px #f17d15, 42px 42px #f17d15, 43px 43px #f17d15, 44px 44px #f17d15, 45px 45px #f17d15, 46px 46px #f17d15, 47px 47px #f17d15, 48px 48px #f17d15, 49px 49px #f17d15, 50px 50px #f17d15;
  }
  .btn.upload .arrow {
    -webkit-animation: uplaod 1s linear infinite;
    animation: uplaod 1s linear infinite;
  }
  .btn.upload .arrow:after {
    top: auto;
    bottom: 100%;
    border-color: transparent transparent #97CA03 transparent;
  }
  
  .cloud {
    width: 100px;
    height: 40px;
    position: relative;
    background: #fff;
    display: inline-block;
    border-radius: 50px;
    margin: 60px auto 0;
    box-shadow: 0px 0px #00a3cc, 1px 1px #00a3cc, 2px 2px #00a3cc, 3px 3px #00a3cc, 4px 4px #00a3cc, 5px 5px #00a3cc, 6px 6px #00a3cc, 7px 7px #00a3cc, 8px 8px #00a3cc, 9px 9px #00a3cc, 10px 10px #00a3cc, 11px 11px #00a3cc, 12px 12px #00a3cc, 13px 13px #00a3cc, 14px 14px #00a3cc, 15px 15px #00a3cc, 16px 16px #00a3cc, 17px 17px #00a3cc, 18px 18px #00a3cc, 19px 19px #00a3cc, 20px 20px #00a3cc, 21px 21px #00a3cc, 22px 22px #00a3cc, 23px 23px #00a3cc, 24px 24px #00a3cc, 25px 25px #00a3cc, 26px 26px #00a3cc, 27px 27px #00a3cc, 28px 28px #00a3cc, 29px 29px #00a3cc, 30px 30px #00a3cc, 31px 31px #00a3cc, 32px 32px #00a3cc, 33px 33px #00a3cc, 34px 34px #00a3cc, 35px 35px #00a3cc, 36px 36px #00a3cc, 37px 37px #00a3cc, 38px 38px #00a3cc, 39px 39px #00a3cc, 40px 40px #00a3cc, 41px 41px #00a3cc, 42px 42px #00a3cc, 43px 43px #00a3cc, 44px 44px #00a3cc, 45px 45px #00a3cc, 46px 46px #00a3cc, 47px 47px #00a3cc, 48px 48px #00a3cc, 49px 49px #00a3cc, 50px 50px #00a3cc;
  }
  .cloud:after, .cloud:before {
    content: '';
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    top: -20px;
    background: #fff;
    left: 5px;
  }
  .cloud:before {
    width: 40px;
    height: 40px;
    left: 50px;
  }
  
  .arrow {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 5;
    top: 10px;
    width: 15px;
    height: 10px;
    background: #97CA03;
    display: inline-block;
  }
  .arrow:after {
    content: '';
    position: absolute;
    left: -8px;
    top: 100%;
    border: 15px solid transparent;
    border-top-color: #97CA03;
  }
  @-webkit-keyframes download {
    0% {
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px);
    }
    100% {
      -webkit-transform: translateY(20px);
      transform: translateY(20px);
      opacity: 0;
    }
  }
  @keyframes download {
    0% {
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px);
    }
    100% {
      -webkit-transform: translateY(20px);
      transform: translateY(20px);
      opacity: 0;
    }
  }
  @-webkit-keyframes uplaod {
    0% {
      -webkit-transform: translateY(20px);
      transform: translateY(20px);
    }
    100% {
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px);
      opacity: 0;
    }
  }
  @keyframes uplaod {
    0% {
      -webkit-transform: translateY(20px);
      transform: translateY(20px);
    }
    100% {
      -webkit-transform: translateY(-20px);
      transform: translateY(-20px);
      opacity: 0;
    }
  }
  
  
      &lt;/style&gt;
  
  
      &lt;link rel=&quot;stylesheet&quot; href=&quot;assets/css/templatemo-stand-blog.css&quot;&gt;
    &lt;/head&gt;
      
    &lt;body&gt;
      
      &lt;img src=&quot;logo.png&quot; width=&quot;100&quot; height=&quot;100&quot; alt=&quot;HTML tag&quot;&gt;
      &lt;p class=&quot;bluebackground&quot;&gt;&amp;emsp;&lt;/p&gt;
      &lt;nav&gt;
          &lt;ul class=&quot;nav&quot;&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;index.html&quot;&gt;Home&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;boyshome.html&quot;&gt;Boys Campus&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;girlshome.html&quot;&gt;Girls Campus&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;calculator.html&quot;&gt;GPA Calculator&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/nav&gt;
      &lt;p class=&quot;bluebackground&quot;&gt;&amp;emsp;&lt;/p&gt;
      &lt;br&gt;
      &lt;h1 class=&quot;girls-message centermess&quot;&gt;&lt;center&gt;NHS BOYS&lt;/center&gt;&lt;/h1&gt;
      &lt;nav&gt;
      &lt;p class=&quot;bluebackground&quot;&gt;&amp;emsp;&lt;/p&gt;
          &lt;ul class=&quot;nav&quot;&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;boyshome.html&quot;&gt;Home&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;nhs-articles.html&quot;&gt;NHS Articles&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;meet-our-officers-boys.html&quot;&gt;Meet Our Officers&lt;/a&gt;&lt;/li&gt;
            &lt;li&gt;&lt;a class=&quot;active&quot; href=&quot;boyscontact.html&quot;&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/nav&gt;
      &lt;p class=&quot;bluebackground&quot;&gt;&amp;emsp;&lt;/p&gt;
      &lt;br&gt;
  
  
      
      &lt;center&gt;
      &lt;section class=&quot;blog-posts grid-system&quot;&gt;
        &lt;div class=&quot;container&quot;&gt;
          &lt;div class=&quot;row&quot;&gt;
            &lt;div class=&quot;col-lg-8&quot;&gt;
              &lt;div class=&quot;all-blog-posts&quot;&gt;
              &lt;center&gt;
                &lt;div class=&quot;row&quot;&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-01.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;التعلم عبادة&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Omar Sheir&lt;/li&gt;
                          &lt;li&gt;23/9/2020&lt;/li&gt;
                        &lt;/ul&gt;
                      &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-02.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;Uyghur Muslims&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Khalid Kooheji&lt;/li&gt;
                          &lt;li&gt;27/9/2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-02.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                      &lt;h4&gt;الأمير الراحل … أمير الإنسانية&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Mohammad Al-Obaidi&lt;/li&gt;
                          &lt;li&gt;3/10/2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-03.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;الصدقة&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Ahmad Al-Mazrouei&lt;/li&gt;
                          &lt;li&gt;20/9/2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-04.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;Corona Virus: A New World&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Majed Al-Shaheen&lt;/li&gt;
                          &lt;li&gt;27/9/2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-05.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;Donec tincidunt leo&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Admin&lt;/li&gt;
                          &lt;li&gt;May 12, 2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-lg-6&quot;&gt;
                    &lt;div class=&quot;blog-post&quot;&gt;
                      &lt;div class=&quot;blog-thumb&quot;&gt;
                        &lt;img src=&quot;assets/images/blog-thumb-06.jpg&quot; alt=&quot;&quot;&gt;
                      &lt;/div&gt;
                      &lt;div class=&quot;down-content&quot;&gt;
                        &lt;h4&gt;Mauris ac dolor ornare&lt;/h4&gt;
                        &lt;ul class=&quot;post-info&quot;&gt;
                          &lt;li&gt;Admin&lt;/li&gt;
                          &lt;li&gt;May 10, 2020&lt;/li&gt;
                        &lt;/ul&gt;
                        &lt;div class=&quot;btn download&quot;&gt;
                          &lt;div class=&quot;cloud&quot;&gt;
                          &lt;div class=&quot;arrow&quot;&gt;&lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                        &lt;div class=&quot;post-options&quot;&gt;
                          &lt;div class=&quot;row&quot;&gt;
                          &lt;/div&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
                &lt;/center&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/section&gt;
      &lt;/center&gt;
  
      &lt;footer class=&quot;footer-distributed&quot;&gt;
          &lt;div class=&quot;footer-left&quot;&gt;
              &lt;h3&gt;NHS&lt;span&gt;ACA&lt;/span&gt;&lt;/h3&gt;
              &lt;p class=&quot;footer-links&quot;&gt;Boys Campus:&lt;/p&gt;
              &lt;p class=&quot;footer-links&quot;&gt;
              &lt;a href=&quot;https://www.instagram.com/nhsb.aca/&quot;&gt;&lt;i class=&quot;fa fa-instagram&quot;&gt;&lt;/i&gt;
                   nhsb.aca&lt;/a&gt;&amp;emsp;
                   |&amp;emsp;
                   &lt;a href=&quot;mailto:nhsb.aca@gmail.com&quot;&gt;&lt;i class=&quot;fa fa-envelope&quot;&gt;&lt;/i&gt;
                  nhsb.aca@gmail.com&lt;/a&gt;
              &lt;/p&gt;
              &lt;p class=&quot;footer-links&quot;&gt;Girls Campus:&lt;/p&gt;
              &lt;p class=&quot;footer-links&quot;&gt;
                  &lt;a href=&quot;https://www.instagram.com/aca.nhs/&quot;&gt;&lt;i class=&quot;fa fa-instagram&quot;&gt;&lt;/i&gt;
                   aca.nhs&lt;/a&gt;&amp;emsp;
                    |&amp;emsp;
                   &lt;a href=&quot;mailto:acanational.hs@gmail.com&quot;&gt;&lt;i class=&quot;fa fa-envelope&quot;&gt;&lt;/i&gt;
                  acanational.hs@gmail.com&lt;/a&gt;
              &lt;/p&gt;
              &lt;br&gt;
              &lt;p class=&quot;footer-company-name&quot;&gt;© Mohammad al Nusif&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class=&quot;footer-center&quot;&gt;
          &lt;br&gt;
          &lt;br&gt;
          &lt;br&gt;
              &lt;div&gt;
                  &lt;a href=&quot;https://goo.gl/maps/B3vW2nPkNewZUyxW9&quot;&gt;&lt;i class=&quot;fa fa-map-marker&quot;&gt;&lt;/i&gt;
                  &lt;p&gt;Boys Campus Map&lt;/p&gt;&lt;/a&gt;
              &lt;/div&gt;
              &lt;div&gt;
                  &lt;a href=&quot;https://goo.gl/maps/uKS7qgy5P6F8csRK7&quot;&gt;&lt;i class=&quot;fa fa-map-marker&quot;&gt;&lt;/i&gt;
                  &lt;p&gt;Girls Campus Map&lt;/p&gt;&lt;/a&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class=&quot;footer-right&quot;&gt;
              &lt;p class=&quot;footer-company-about&quot;&gt;
                  &lt;br&gt;
                  &lt;br&gt;
                  &lt;br&gt;
                  &lt;span&gt;Boys Campus:&lt;/span&gt;
                  Advisor's Email - sali.alkhuraishi@aca.edu.kw&lt;br&gt;
                  President's Email - bahaabed2003@gmail.com&lt;br&gt;
                  Vice President's Email - azoibi17@gmail.com&lt;br&gt;
                  &lt;br&gt;
                  &lt;span&gt;Girls Campus:&lt;/span&gt;
                  Advisor's Email - nicole.depew@aca.edu.kw&lt;br&gt;
                  President's Email - kayanalghanim@gmail.com&lt;br&gt;
                  Vice President's Email - skkh03@gmail.com &lt;br&gt;
                  &lt;br&gt;
              &lt;div class=&quot;footer-icons&quot;&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/footer&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>I just need to sort this out to make it visually appealing....................................................................................</p>