* {
      box-sizing: border-box;
    }

    video {
      width: 100%;
      height: auto;
    }

    .row:after {
      content: "";
      clear: both;
      display: table;
    }

    [class*="col-"] {
      float: left;
      padding: 15px;
      width: 100%;
    }

    @media only screen and (min-width: 600px) {
      .col-s-1 {
        width: 8.33%;
      }

      .col-s-2 {
        width: 16.66%;
      }

      .col-s-3 {
        width: 25%;
      }

      .col-s-4 {
        width: 33.33%;
      }

      .col-s-5 {
        width: 41.66%;
      }

      .col-s-6 {
        width: 50%;
      }

      .col-s-7 {
        width: 58.33%;
      }

      .col-s-8 {
        width: 66.66%;
      }

      .col-s-9 {
        width: 75%;
      }

      .col-s-10 {
        width: 83.33%;
      }

      .col-s-11 {
        width: 91.66%;
      }

      .col-s-12 {
        width: 100%;
      }
    }

    @media only screen and (min-width: 768px) {
      .col-1 {
        width: 8.33%;
      }

      .col-2 {
        width: 16.66%;
      }

      .col-3 {
        width: 25%;
      }

      .col-4 {
        width: 33.33%;
      }

      .col-5 {
        width: 41.66%;
      }

      .col-6 {
        width: 50%;
      }

      .col-7 {
        width: 58.33%;
      }

      .col-8 {
        width: 66.66%;
      }

      .col-9 {
        width: 75%;
      }

      .col-10 {
        width: 83.33%;
      }

      .col-11 {
        width: 91.66%;
      }

      .col-12 {
        width: 100%;
      }
    }

    html {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      background-image: linear-gradient(-225deg, #80d0c7 0%, #3584A7 51%, #13547a 100%);
      /*background-image: linear-gradient(15deg, #13547a 0%, #80d0c7 100%);
      color: #ffffff;*/
      scroll-behavior: smooth;

    }

    .header {
      /*background-image: linear-gradient(to right, #30D2BE 0%, #13547a 100%);*/
      background-image: linear-gradient(-225deg, #80d0c7 0%, #50A7C2 100%);
      background-image: url(images/tech-hd.png);
      background-repeat: no-repeat;
      background-size: cover;
      color: #ffffff;
      padding: 15px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    .menu ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
    }

    .menu li {
      padding: 8px;
      margin-bottom: 7px;
      background-color: teal;
      color: #ffffff;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    .menu li:hover {
      background-color: #e7e7e7;
      transition: 0.7s;
      color: brown;
    }

    .aside {
      background-color: #ffffff;
      padding: 15px;
      color: black;
      text-align: center;
      font-size: 14px;
      border-radius: 2px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    a {
      color: azure;
      text-decoration: none;
    }

    /*a:hover {
      /*background-color: lightslategray;*
      color: brown;
    }*/

    /*CSS for the Link to top page*/
    #back-to-top {
      cursor: pointer;
      position: fixed;
      /*alignment-adjust: auto;*/
      bottom: 20px;
      right: 20px;
      display: none;
    }

    /*End of CSS for the Link to top page*/

    /* Line separator Solid border */
    hr.solid {
      border-top: 3px solid #bbb;
    }

    /* End */


    /* Search Button CSS */
    * {
      box-sizing: border-box;
    }

    form.example input[type=text] {
      padding: 10px;
      font-size: 17px;
      border: 1px solid grey;
      float: left;
      width: 90%;
      background: #f1f1f1;
    }

    form.example button {
      float: left;
      width: 10%;
      padding: 10px;
      background: #232b2b;
      color: white;
      font-size: 17px;
      border: 1px solid grey;
      border-left: none;
      cursor: pointer;
    }

    form.example button:hover {
      background: #414a4c;
    }

    form.example::after {
      content: "";
      clear: both;
      display: table;
    }

    /*Footer*/

    footer {
      text-align: center;
      padding: 3px;
      background-color: #444;
      color: white;
    }

    * {
      box-sizing: border-box;
    }

    .footer-left {
      padding: 20px;
      float: left;
      width: 20%;
      text-align: center;
      /* The width is 20%, by default */
    }

    /*.footer-left a:link {
      color: antiquewhite;
      text-decoration: none;
    }*/

    /*.footer-left a:visited {
      color: antiquewhite;
      text-decoration: none;
    }*/

    .footer-left a:hover {
      color: #74ebd5;
      text-decoration: none;
    }

    .footer-left a:active {
      color: brown;
      text-decoration: none;
    }


    .footer-main {
      padding: 20px;
      float: left;
      width: 50%;
      text-align: center;
      /* The width is 60%, by default */
    }

    .footer-main a:link {
      text-decoration: none;
    }

    /*.footer-main a:visited {
      color: antiquewhite;
      text-decoration: none;
    }*/

    .footer-main a:hover {
      color: #74ebd5;
      text-decoration: none;
    }

    .footer-main a:active {
      /*color: brown;*/
      text-decoration: none;
    }

    .footer-main2 {
      padding: 20px;
      float: left;
      width: 10%;
      text-align: center;
      /* The width is 60%, by default */
    }

    /*.footer-main2 a:link {
      color: antiquewhite;
      text-decoration: none;
    }*/

    /*.footer-main2 a:visited {
      color: antiquewhite;
      text-decoration: none;
    }*/

    .footer-main2 a:hover {
      color: #74ebd5;
      text-decoration: none;
    }

    .footer-main2 a:active {
      color: brown;
      text-decoration: none;
    }

    .footer-right {
      padding: 20px;
      float: left;
      width: 20%;
      text-align: center;
      /* The width is 20%, by default */
    }

    .footer-right a:link {
      text-decoration: none;
    }

    .footer-right a:visited {
      color: antiquewhite;
      text-decoration: none;
    }

    .footer-right a:hover {
      color: aliceblue;
      text-decoration: none;
    }

    .footer-right-facebook a:hover {
      color: #3B5998;
      text-decoration: none;
    }

    .footer-right-youtube a:hover {
      color: #FF0000;
      text-decoration: none;
    }

    .footer-right-twitter a:hover {
      color: #00acee;
      text-decoration: none;
    }

    .footer-right a:active {
      color: brown;
      text-decoration: underline;
    }

    .footer-menu {
      background-color: #555;
      padding: 20px;
      float: right;
      width: 100%;
      text-align: right;
      padding-left: 100px;
      /* The width is 20%, by default */
    }

    .footer-menu a:link {
      color: #ccc;
      text-decoration: none;
    }

    .footer-menu a:visited {
      /*color: #00acee;*/
      text-decoration: none;
    }

    .footer-menu a:hover {
      color: #00acee;
      text-decoration: none;
    }

    .footer-right a:active {
      color: brown;
      text-decoration: underline;
    }

    /* Use a media query to add a break point at 800px: */
    @media screen and (max-width: 800px) {

      .footer-left,
      .footer-main,
      .footer-main2,
      .footer-right {
        width: 100%;
        /* The width is 100%, when the viewport is 800px or smaller */
      }
    }

    /*End of Footer */


    /* End Search Button CSS */


    /*BACK TO TOP CSS */
    /*html {
      scroll-behavior: smooth;
    }*/

    body {
      position: relative;
    }

    .section {
      height: 100vh;
      background: #dedede;
      margin-bottom: 20px;
      font-size: 100px;
    }

    .scroll-container {
      position: absolute;
      top: 0;
      right: 0;
      height: 100%;
    }

    .scroll-container:before {
      content: '';
      display: block;
      height: 100vh;
      pointer-events: none;
    }

    .scroll-container a {
      position: sticky;
      top: 88vh;
      cursor: pointer;
      font-size: 20px;
    }

    /**END OF BACK TO TOP CSS */

    .world-news-page {
      background-color: #f1f1f1;
      border-radius: 3px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    .local-news-page {
      background-color: #f1f1f1;
      border-radius: 3px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    /**Text inside the image CSS */
    .textimage {
      position: relative;
      max-width: 800px;
      margin: 0 auto;
    }

    .textimage img {
      vertical-align: middle;
    }

    .textimage .content {
      position: absolute;
      bottom: 0;
      background: rgb(0, 0, 0);
      /* Fallback color */
      background: rgba(0, 0, 0, 0.5);
      /* Black background with 0.5 opacity */
      color: #f1f1f1;
      width: 100%;
      padding: 20px;
      text-decoration: none;
    }

    /**Text inside the image CSS */

    /**No underline in a href */
    a:link {
      text-decoration: none;
    }

    a:visited {
      text-decoration: none;
    }

    /* mouse over link */
    a:hover {
      color: #80d0c7;
    }

    /**No underline in a href */