@font-face {
  font-family: 'icomoon';
  src: url("../fonts/icomoon/icomoon.eot?srf3rx");
  src: url("../fonts/icomoon/icomoon.eot?srf3rx#iefix") format("embedded-opentype"), url("../fonts/icomoon/icomoon.ttf?srf3rx") format("truetype"), url("../fonts/icomoon/icomoon.woff?srf3rx") format("woff"), url("../fonts/icomoon/icomoon.svg?srf3rx#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* =======================================================
*
* 	Template Style 
*
* ======================================================= */
body {
  font-family: "Source Sans Pro", Arial, sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.7;
  color: #828282;
  background: #fff;
}

#page {
  position: relative;
  overflow-x: hidden;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.offcanvas #page {
  overflow: hidden;
  position: absolute;
}
.offcanvas #page:after {
  -webkit-transition: 2s;
  -o-transition: 2s;
  transition: 2s;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 101;
  background: rgba(0, 0, 0, 0.7);
  content: "";
}

a {
  color: #2D6CDF;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
a:hover, a:active, a:focus {
  color: #2D6CDF;
  outline: none;
  text-decoration: none;
}

p {
  margin-bottom: 20px;
}

h1, h2, h3, h4, h5, h6, figure {
  color: #000;
  font-family: "Roboto Slab", serif;
  font-weight: 400;
  margin: 0 0 20px 0;
}


    :root {
      --verde-oliva: #007f21;
      --verde-oliva-claro: #00c133 ;
    }



    .navbar {
      background-color: var(--verde-oliva);
    }

    .navbar-brand, .nav-link, .navbar-toggler {
      color: #fff !important;
    }

    .nav-link:hover {
      color: var(--verde-oliva-claro) !important;
    }

      .nav-link:hover, .dropdown-item:hover {
      color: var(--verde-oliva-claro) !important;
    }

    .dropdown-menu {
      background-color: #fff;
      border-color: var(--verde-oliva);
    }

    .dropdown-item {
      color: #333;
    }

    .btn-olive {
      background-color: var(--verde-oliva);
      color: #fff;
      border: none;
    }

    .btn-olive:hover {
      background-color: var(--verde-oliva-claro);
      color: #fff;
    }


/* Footer */

  #footer {
    position: relative;
    color: #fff;
    padding: 4em 0;
    display: block;
  }

  #footer:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-size: 100% 100%;
    z-index: 0;
    opacity: 0.5;
  }

  #footer a {
    color: #fff;
  }

  #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer strong, #footer b {
    color: #fff;
  }

  #footer h2 a, #footer h3 a, #footer h4 a, #footer h5 a, #footer h6 a, #footer strong a, #footer b a {
    color: inherit;
  }

  #footer ul.contact li,
  #footer ul.dates li,
  #footer ul.divided li {
  border-top-color: #353434;
  border-top-color: rgba(255, 255, 255, 0.05);
  list-style: none;
  }

  #footer header {
  margin: 0 0 3em 0;
  }

  #footer header h2 {
    font-size: 1.75em;
  }


  footer {
  background-color: var(--verde-oliva);
  color: #fff;
  padding: 2rem 0;
  }

  footer a {
  color: #fff;
  text-decoration: none;
  }

  footer a:hover {
  text-decoration: none;
  }

    #contador {
      font-size: 2rem;
      font-weight: bold;
      color: var(--verde-oliva);
    }

    .section-title {
      border-left: 5px solid var(--verde-oliva);
      padding-left: 10px;
      margin-bottom: 1rem;
    }

    .section-title ::after {
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
  bottom: 0;
  content: '';
  width: 50px;
  height: 1px;
  margin: 0 auto;
  background: rgba(0, 0, 0, 0.08);
  