.background {
  background: url(../images/blog/bg.png) no-repeat;
  background-size: 100% auto; }

section.first {
  background: linear-gradient(rgba(73, 101, 177, 0.5), rgba(141, 163, 224, 0.5));
  background-size: cover;
  padding: 11rem 0 9rem; }
  @media (max-width: 767.98px) {
    section.first {
      padding: 5rem 0 3rem; } }

section.blog {
  background: linear-gradient(rgba(141, 163, 224, 0.5), #8da3e0);
  padding: 3.5rem 20px 0; }
  section.blog .mobile-nav {
    margin-bottom: 10px; }
  section.blog .blog__nav {
    padding-right: 0;
    padding-top: 40px; }
    section.blog .blog__nav li a {
      display: block;
      padding: 10px 20px;
      margin: 3px 0;
      font-size: 18px;
      color: #fff;
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px; }
      section.blog .blog__nav li a:hover, section.blog .blog__nav li a.active {
        color: #5A76C3;
        background-color: #fff; }
  section.blog .blog__content {
    background: #fff;
    padding: 50px;
    color: #62646D; }
    section.blog .blog__content .page-title {
      color: #5A76C3; }
    section.blog .blog__content h2 {
      color: #5A76C3;
      margin: 50px 0 10px; }
    section.blog .blog__content h3 {
      margin: 20px 0 10px; }
    section.blog .blog__content em {
      color: #999;
      font-size: 12px; }
    section.blog .blog__content ul.disc {
      margin-left: 20px; }
      section.blog .blog__content ul.disc > li {
        list-style: disc; }
    section.blog .blog__content > ol {
      padding-left: 20px; }
  @media (max-width: 767.98px) {
    section.blog {
      padding: 0; }
      section.blog .blog__nav {
        display: none; }
      section.blog .blog__content {
        padding: 20px; }
        section.blog .blog__content h2 {
          margin-top: 30px;
          font-size: 1.3rem; } }