/**
 * blog.css
 *
 * These are the styles for the blog / news component.
 *
 * Index
 * - Blog Base 
 * - Blog Category Navigation
 */
.section-latest-post aside {
  position: relative;
  min-height: 600px;
}
.section-latest-post h2 {
  margin: 1rem 0;
}
.section-latest-post h2 a:link,
.section-latest-post h2 a:visited {
  color: #006EB0;
  text-decoration: none;
}
.section-latest-post h2 a:hover {
  opacity: 0.6;
}
.section-latest-post h2 a:hover {
  opacity: 0.8;
}
.section-latest-post p {
  font-size: 16px; font-size: 1rem;
}
.section-latest-post .publication-date {
  font-size: 14px; font-size: 0.875rem;
}
.section-latest-post .blog-category,
.card-img .blog-category {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  padding: 0 1.5rem;
  margin: 0;
  width: auto;
  height: 24px;
  color: #fff;
  font-size: 12px; font-size: 0.75rem;
  line-height: 1.9;
  border-radius: 2px;
  background-color: #225FA3;
  z-index: 3;
}
/* Navigation - Category */
.nav-category {
  padding-right: 2rem;
  padding-left: 2rem;
  align-content: center;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
  .nav-category a {
    margin: 0 0.5rem 1rem;
    align-content: center;
    -ms-align-items: center;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 180px;
    height: 40px;
    font-size: 18px; font-size: 1.125rem;
    font-weight: 500;
    text-decoration: none;
    border-radius: 100px;
    padding-left: 10px;
    padding-right: 10px;
  }
  
  .nav-category a:link,
  .nav-category a:visited {
    color: #006EB0;
    background-color: #fff;
  }
  
  .nav-category a:hover,
  .nav-category a.selected   {
    color: #fff;
    background-color: #006EB0;
  }
  .nav-category a:active  { opacity: 0.8; }
/* Navigation - Category */
/* Section Post */
.section-blog {
  padding-top: 1rem;
}
.section-post-listings {
  padding-top: 0;
}
.page-post-details .section-post-listings,
.page-generic-content .section-post-listings {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  align-content: flex-start;
  -ms-align-items: stretch;
  align-items: stretch;
  justify-content: center;
}
  .page-post-details .section-post-listings .section-heading,
  .page-generic-content .section-post-listings .section-heading {
    padding-left: 0;
    padding-right: 0;
  }
  
  .page-post-details .section-post-listings .section-heading aside,
  .page-generic-content.section-post-listings .section-heading aside {
    -ms-align-items: flex-start;
    align-items: flex-start;
  }
/* Section Post */
/* Blog Pagination */
.section-pagination {
  height: 50px;
  border-bottom: 1px solid rgba(56, 121, 193, 0.2);
}
  .section-pagination aside {
    width: 45%;
  }
  
  .section-pagination aside:nth-of-type(1) {
    width: 55%;
    justify-content: flex-end;
  }
  .section-pagination form {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    width: 100%;
  }
  .section-pagination .select-dropdown {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    align-content: flex-start;
    -ms-align-items: flex-start;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0 1rem 0 0;
    width: 50%;
    max-width: 200px;
    height: 49px;
    border: none;
    border-right: 1px solid rgba(56, 121, 193, 0.2);
    transition: all 0.3s ease-out;
      -webkit-transition: all 0.3s ease-out;
  }
  
  .section-pagination .select-items-per-page {
    max-width: 220px;
  }
  
  .section-pagination form .select-dropdown label {
    padding-top: 0;
    height: 49px;
    color: #fff;
    font-size: 16px; font-size: 1rem;
    font-weight: 500;
  }
  
    .section-pagination .select-dropdown:nth-of-type(1) label {
      padding-left: 0;
    }
  
    .section-pagination .select-dropdown svg {
      position: absolute;
      top: 0.8rem;
      right: 1rem;
      width: 24px;
      height: 24px;
    }
    
    .section-pagination .select-dropdown select {
      position: absolute;
      top: 0;
      left: 0;
      padding-top: 0;
      width: 115%;
      min-height: 50px;
      font-size: 16px; font-size: 1rem;
      line-height: 3;
      border: none;
      background: none;
      background-color: rgba(255,255,255, 0);
      cursor: pointer;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      box-sizing: content-box;
      -moz-box-sizing:content-box;
      -webkit-box-sizing:content-box; 
      border-radius: 0;
      outline: none !important;
      box-shadow: none !important;
        -webkit-box-shadow: none !important;
    }
    
    .section-pagination .select-items-per-page select,
    .section-pagination .select-jump-to-page select {
      padding-left: 1rem;
    }
    
    
  .nav-pagination {
    height: 49px;
    width: 100%;
    justify-content: flex-end;
  }
  
    .nav-pagination a,
    .nav-pagination p {
      align-content: center;
      -ms-align-items: center;
      align-items: center;
      justify-content: ;
      padding: 0 2rem;
      height: 49px;
      color: #333;
      font-weight: 500;
    }
  
    .nav-pagination a:link,
    .nav-pagination a:visited {
      color: #333;
      text-decoration: none;
    }
    
    .nav-pagination a:hover,
    .section-pagination .select-dropdown:hover { opacity:  0.6; }
    .nav-pagination a:visited { opacity: 0.8; }
    
    .btn-previous,    
    .btn-next {
      position: relative;
      border: none;
    }
    
      .btn-previous:after,    
      .btn-next:before {
        position: absolute;
        top: 10px;
        content: '';
        width: 1px;
        height: 30px;
        background-color:rgba(56, 121, 193, 0.2);
      }
      
          .btn-next:before {
            left: 0;
          }
        
          .btn-previous:after {
            right: 0;
          }
    
    .nav-pagination .btn-next {
      padding-right: 0;
    }
    
    .nav-pagination a svg {
      width: 24px;
      height: 24px;
    }
    
    .btn-previous svg {
      margin-right: 0.5rem;
    }
    
    .btn-next svg {
      margin-left: 0.5rem;
    }
    
    .current-page,
    .total-pages {
      margin: 0 0.3rem;
    }
    
    .page-of,
    .total-pages {
      font-weight: 300;
    }
    
    .top-pagination {
      border-top: 1px solid rgba(56, 121, 193, 0.2);
      border-bottom: none;
    }
    
    .bottom-pagination {
      border-top: none;
      border-bottom: 1px solid rgba(56, 121, 193, 0.2);
    }
    
/* Blog Pagination */
/* Blog Details Page */
.impact-post {
  padding-top: 4rem;
  padding-bottom: 4rem;
  color: #fff;
  background-color: #3879C1;
  min-height: 600px;
}
.section-post-article,
.post-title,
.post-article {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  color: #3879C1;
}
.quotation-block {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.post-title,
.quotation-block,
.post-article {
  position: relative;
  margin: 0 auto;
  width: 80%;
  max-width: 1000px;
  z-index: 1;
}
.post-title {
  color: #fff;
}
  .post-title h1 {
    margin-top: 1rem;
    font-size: 60px; font-size: 3.75rem;
  }
  hr.intro-para {
    width: 100%;
    margin: 0 0;
    border-color: #ddd;
  }  
  .post-article, .quotation-block {
    margin: 0 auto;;
    width: 90%;
    max-width: 1000px;
  }
  
  .post-article img {
    margin-top: 1.5rem;
    width: 100%;
    height: auto;
    flex-shrink: 0;
    background-color: #3879C1;
  }
  
  .img-caption {
    font-size: 12px; font-size: 0.75rem;
    padding: 1rem 0;
  }
  
  .post-article hr {
    height: 1px;
    border-color: #ddd;
  }
  
.page-blog-details .section-heading h2 {
  text-transform: none;
}
.page-blog-details .section-heading .btn-link {
  padding-right: 0;
  justify-content: flex-end;
}
  
/* Blog Details Page */
/* 1024px and smaller */
@media only screen and (max-width: 1024px) {
  
  .impact-post {
    padding-top: 5rem;
    min-height: 500px;
  }
  
  .post-title, .post-article {
    width: 100%;
    max-width: 100%;
  }
  
  .post-title h1 {
    margin-top: 1rem;
    font-size: 40px; font-size: 2.5rem;
  }
  
  .section-latest-post aside {
    min-height: auto;
  }
  
  .section-latest-post .aside-post-img {
    min-height: 400px;
    background-position: center center;
    -webkit-background-size: cover;
    background-size: cover;
  }
  
  .post-article img {
    display: block;
    width: 100%;
    height: auto;
    flex-shrink: 0;
  }
  
  .section-latest-post  aside:nth-of-type(2) {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  
  .section-pagination  {
    padding-left: 0;
    padding-right: 0;
    height: auto;
  }
  
  .section-pagination .container {
    max-width: 100%;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-align-items: stretch;
    align-items: stretch;
    justify-content: center;
  }
  
  .section-pagination .container aside {
    height: 50px;
    width: 100%;
    justify-content: center;
  }
  
  .section-pagination .container aside:nth-of-type(1) {
    border-bottom: 1px solid rgba(56, 121, 193, 0.2);
  }
  
  .section-pagination form,
  .nav-pagination {
    justify-content: center;
  }
  
  .page-post-details .section-post-listings .card:last-of-type {
    display: none;
  }
  
  .page-search-site .section-pagination, 
  .page-search-site-results .section-pagination {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  }
  
}
/* 768px and smaller */
@media only screen and (max-width: 768px) { 
  
  .post-title h1 {
    font-size: 36px; font-size: 2.25rem;
  }
  
  .section-latest-post .aside-post-img {
    min-height: 320px;
  }
  
  .section-pagination {
    height: auto;
    border-top: 1px solid rgba(56, 121, 193, 0.2);
  }
  
  .section-pagination form {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: auto;
  }
  
  .section-pagination .select-dropdown {
    margin-bottom: 0;
    width: 50%;
    max-width: 50%;
  }
  
  .section-pagination .select-jump-to-page {
    width: 100%;
    max-width: 100%;
    border-top: 1px solid rgba(56, 121, 193, 0.2);
    border-right: none;
  }
  
  .section-pagination .select-items-per-page,
  .section-pagination .select-jump-to-page {
    border-right: none;
  }
  
  .nav-pagination a, .nav-pagination p {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
  }
  
  .section-pagination form .select-dropdown label {
    padding-left: 1rem;
  }
  
  .section-pagination .select-dropdown select {
    padding-left: 1.5rem;
  }  
  
  .section-pagination form,
  .section-pagination .container aside {
    height: auto;
  }
  
  .nav-pagination p {
    margin-top: 0;
    margin-bottom: 0;
  }
  
  .nav-category a {
    min-width: 28%;
    font-size: 14px; font-size: 0.875rem;
  }
}
/* 580px and down */
@media only screen and (max-width: 580px) {
  
  .nav-pagination {
    background-color: #fff;
  }
  
  .nav-pagination a, 
  .nav-pagination p {
    padding-right: 1rem;
    padding-left: 1rem;
  }
  
  .page-post-details .section-post-listings .card:nth-of-type(2) {
    display: none;
  }
}
/* 400px and down */
@media only screen and (max-width: 400px) {
  
  .section-pagination .select-dropdown:nth-of-type(1) {
    max-width: 50%;
  }
  
  .section-pagination .select-dropdown:nth-of-type(2) {
    max-width: 50%;
    justify-content: center;
  }
  
  .section-pagination .select-dropdown label {
    justify-content: center;
  }
  
  .section-pagination .select-dropdown:nth-of-type(2) label {
    justify-content: flex-start;
  }
  
  .nav-pagination {
    height: 99px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  
  .nav-pagination .btn-previous {
    order: 1;
    width: 50%;
    max-width: 50%;
    justify-content: flex-end;
  }
  
  .nav-pagination .btn-next {
    order: 2;
    width: 50%;
    max-width: 50%;
    border-left: none;
  }
  
  .nav-pagination p {
    order: 3;
    width: 100%;
  }
  
  .nav-pagination p {
    border-top: 1px solid rgba(56, 121, 193, 0.2);
    justify-content: center;
  }
  
}