/*
Theme Name: HIG Press
Author: HIG
Author URI: https://www.thehartford.com
Description: The Hartford - HIG Press Theme
Version: 2.131
*/

@media (min-width:768px){
  .wrapper{
    background-color:#ececec;
    max-width:1060px;
    margin-left:auto;
    margin-right:auto;
  }
  .site-header{
    background-color:#fff;
    border-bottom:1px solid #216bab;
    z-index:30;
  }

  .article-list-home,
  .article-list-category {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    gap: 30px;
    justify-content: center;
    background-color:#ececec;
    padding-left:15px;
    padding-right:15px;
  }
  .category-nav,
  .site-footer{
    margin-left: auto;
    margin-right:auto;
    padding-left:15px;
    padding-right:15px;
  }

  .article-list-home .article-card,
  .article-list-category .article-card,
  .article-list-home .al-grid-widget,
  .article-list-category .al-grid-widget  {
    margin: 10px 0 0;
    width: calc(33.33% - 20px);
  }

  .article-list-home .article-card:first-child,
  .article-list-home .article-card:first-child+.article-card {
    width: calc(50% - 15px);
    margin-top: 40px;
    margin-bottom: 0;
    display: flex;
  }

  .article-card {
    display: flex;
    background-color: #fff;
    padding-bottom: 0;
    flex-direction: column;
  }
  .article-card:hover{
    box-shadow:1px 1px 14px 2px rgb(100 100 100 / 50%)
  }

.article-card .post-image{
  order:0
}
  .article-card .reading-time{
  margin-bottom: 0;
  margin-top: auto;
  }
  
  .article-card .post-image img {
    max-width: 100%;
  }

  .article-card .post-box {
    padding: 15px;
    display: flex;
    flex-direction: column;
  }

  .article-card::after {
    width: calc(100% - 15px);
  }

  .article-list-home .article-card:first-child .post-box,
  .article-list-home .article-card:first-child+.article-card .post-box {
    margin-top: 0;
  }

  .article-card.cat-podcasts .post-image,
  .article-card.cat-brain-teasers .post-image {
    margin: 15px 15px 0;
    max-width: 100%;
    position:relative;
    z-index:2;
  }

  .article-card.cat-podcasts .post-cat,
  .article-card.cat-brain-teasers .post-cat {
    display: block;
  }

  .article-card.cat-podcasts .post-title,
  .article-card.cat-brain-teasers .post-title {
    text-align: left;
    max-width: 100%;
    margin-left:0;
  }
  
  .article-card.cat-podcasts .post-image::after,
  .article-card.cat-brain-teasers .post-image::after{
    top:auto;
    bottom:-22px;
  }  

  .category-nav .desktop-links{
    display:block;
  }
  .category-nav .mobile-dd{
    display:none;
  }

  .desktop-links {
    text-align: center;
  } 

  .single .article-list-category{
    background-color:transparent;
    max-width:980px;
  }
  
  .parallax-widget{
    flex: 1 0 calc(100% + 80px);
  }
  .wide-promo{
    display:flex;
    align-items:center;
    justify-content: center;
  }
  .pw-cover-top,
  .pw-cover-bottom{
    background-color:#ececec;
  }
  .pw-cover-top::after,
  .pw-cover-bottom::after{
    background-color:#ececec;
  }

  .page-numbers {
    background-color: #fff;
    transition: background-color .2s linear;
  }

  .har-article{
    max-width:900px;
    margin:0 auto;
    background-color: #fff;
  }
  #comments {
    max-width: 900px;
    margin: 0 auto;
    background-color: #fff;
    padding:0 60px 30px
  }  
  .entry-content{
    padding:0 25px 40px;
  }  

  .footer-promo-widget{
    text-align:left;
  }
  .footer-promo-widget .promo-widget-area {
    display:flex;
  }

  .footer-promo-widget .promo-widget-area {
    display:flex;
    align-items: center;
  }
  .footer-promo-widget .promo-widget-media {
    margin-right:30px
  }
  .footer-promo-widget .promo-title{
      margin-top:0
  }
    .footer-promo-widget .promo-widget-content {
        flex:1 1 auto;
    }

  .article-banner {
      padding: 20px 35px;
      text-align:left;
  }
  .article-banner .promo-widget-media{
      display:block;
      margin-right:20px
  }
  .article-banner .promo-widget-area{
      display:flex;
  }
  .article-banner .promo-widget-content{
      flex:1 1 auto;
  }

  .hig-share-options {
    right:auto;
    top: auto;
    left: 0
  }
	.hig-cta-content{
		margin-left:70px;
	}
	.hig-cta-body{
		margin-right:20px;
	}  
  .hig-cta-2 .hig-cta-content{
    display:flex;
  }
  .hig-cta-2 .btn-action{
    margin-top:0;
  }  
  .hig-cta-2 .hig-cta-body{
    max-width: 550px;
  }  
  .modal-dialog {
    width: 600px;
    margin: 30px auto; 
  }
  .modal-content {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); 
  }  
  .reply{
    margin-top:0;
    float:right;
  }
}

@media (min-width: 992px) { /* 1170 */

  body {
    background-color: #aaa;
  }

  .site-header {
    background-color: #fff;
  }

  .topper {
    padding-left: 40px;
    padding-right: 40px;
  }

  .header-logo {
    padding-left: 40px;
    margin-top: 28px;
    margin-bottom: 22px;
    max-width: none;
  }

  .nav-menu {
    padding-right: 40px;
    max-height: none !important;
    width: auto;
    flex: 1 1 0;
    position: static;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    overflow: visible;
    border-top: 0 !important;
  }

  .site-header {
    padding: 0;
  }

  .topper {
    display: flex;
    justify-content: flex-end;
    flex: 1 0 100%;
    background-color: #e4eff6;
    border-bottom: 1px solid #216bab;
    padding-left:40px;
    padding-right:40px;
  }

  .topper .social-sites {
    margin: 2px 20px;
  }

  .mob-topper {
    display: none;
  }

  .har-part {
    height: 74px;
  }

  .em-part {
    max-width:230px;
  }

  .sba-part {
    height: 58px;

  }

  .mob-nav-menu-control {
    display: none;
  }

  .header-search {
    order: 2;
    padding-right: 0;
  }

  .header-search::after {
    content: none;
  }

  input#s {
    width: 160px;
  }

  #menu-main-navigation {
    display: flex;
    align-items: end;
    margin: 0 4px;
    justify-content: center;
  }

  #menu-main-navigation>li::after {
    content: none;
  }

  #menu-main-navigation>li {
    padding: 0;
    border-bottom: 0;
    flex: 0 1 0;
    font-size:18px;
  }

  #menu-main-navigation>li.current-menu-item>a::after,
  #menu-main-navigation>li.current-post-ancestor>a::after,
  #menu-main-navigation>li:hover>a::after {
    content: " ";
    border: 0;
    position: absolute;
    bottom: 10px;
    height: 4px;
    width: 100%;
    transform: none;
    top: auto;
    right: auto;
    left: 0;
    transition: bottom .1s linear;
  }

  #menu-main-navigation>li:hover>a::after {
    bottom: 0;
  }

  li.current-menu-item>a[href*="/business-management"]::after,
  li.current-post-ancestor>a[href*="/business-management"]::after,
  li:hover>a[href*="/business-management"]::after,
  li.current-menu-item>a[href*="/auto"]::after,
  li.current-post-ancestor>a[href*="/auto"]::after,
  li:hover>a[href*="/auto"]::after {
    background-color: var(--category-1)
  }

  li.current-menu-item>a[href*="/finance"]::after,
  li.current-post-ancestor>a[href*="/finance"]::after,
  li:hover>a[href*="/finance"]::after,
  li.current-menu-item>a[href*="/family"]::after,
  li.current-post-ancestor>a[href*="/family"]::after,
  li:hover>a[href*="/family"]::after {
    background-color: var(--category-2)
  }

  li.current-menu-item>a[href*="/managing-employees"]::after,
  li.current-post-ancestor>a[href*="/managing-employees"]::after,
  li:hover>a[href*="/managing-employees"]::after,
  li.current-menu-item>a[href*="/home"]::after,
  li.current-post-ancestor>a[href*="/home"]::after,
  li:hover>a[href*="/home"]::after {
    background-color: var(--category-3)
  }

  li.current-menu-item>a[href*="/media"]::after,
  li.current-post-ancestor>a[href*="/media"]::after,
  li:hover>a[href*="/media"]::after,
  li.current-menu-item>a[href*="/lifestyle"]::after,
  li.current-post-ancestor>a[href*="/lifestyle"]::after,
  li:hover>a[href*="/lifestyle"]::after {
    background-color: var(--category-4)
  }

  li.current-menu-item>a[href*="/wellness"]::after,
  li.current-post-ancestor>a[href*="/wellness"]::after,
  li:hover>a[href*="/wellness"]::after {
    background-color: var(--category-5)
  }  

  #menu-main-navigation>li>a {
    margin: 0 10px;
    padding: 18px 0;
  }

  #menu-main-navigation>li>a::before {
    content: none;
  }

  .sub-menu {
    position: absolute;
    z-index: 999;
    top: 100%;
    width: 260px;
    background-color: #fff !important;
    transition-duration: .01s;
    left: 10px;
    margin:0;
  }

  #menu-main-navigation>li.menu-item-open {
    background-color: transparent;
  }

  #menu-main-navigation>li.menu-item-open a {
    color: #3a5a78
  }

  .menu-item-open>.sub-menu {
    max-height: 0;
  }

  .site-navigation {
    flex: 1 1 0;
  }
  #menu-main-navigation > li::before{
    content:none;
  }

  .menu-item:hover .sub-menu {
    max-height: 500px;
    box-shadow: 1px 2px 3px 0 rgba(100, 100, 100, .5);
    border: 1px solid #ececec;
    transition-duration: .3s;
  }

  .sub-menu a {
    border-top: 1px solid #ccc;
    padding: 20px 24px;
    color: #216bab;
  }

  .sub-menu li:first-child a {
    border-top: 0;
  }

  .sub-menu a:hover {
    color: #fff !important;
    background-color: #3a5a78;
  }

  .hero-banner {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    position: relative;
    z-index: 22;
    background-color:#ececec;
  }

  .hero-image {
    flex: 0 0 60%;
    order: 2;
    z-index: 20;
    position: relative;
  }

  .hero-box {
    z-index: 22;
    position: relative;
    top: auto;
    align-self: center;
    right: -40px;
    margin-left: 0;
    margin-top:0;
    padding-left: 0;
    padding-top: 30px;
    padding-right: 0;
  }

  .hero-box::before {
    content: " ";
    position: absolute;
    height: 100%;
    width: calc(100% + 70px);
    background-color: #fff;
    left: -40px;
    top: 0;
    box-shadow: 3px 3px 8px 0 rgba(100, 100, 100, .6);
    z-index: -1;
  }

  .hero-box::after {
    width: calc(100% + 30px);
  }
  .category-nav{
    background-color:#ececec;
  }



  .article-meta{
      margin-left:40px;
      margin-right:40px;
      padding-top:12px;
  }
  .article-meta::after{
      width: calc(100% + 20px);
      left: 20px;
      right:auto;
  }
  .article-meta .post-author{
    margin-bottom:0;
  }
  .article-meta .reading-time{
    position: absolute;
    right: 20px;
    bottom: 15px;
  }
  .article-tags{
    padding-right:100px;
    margin-top:20px;
  }
  .post-action-mobile,
  .post-pub-mobile{
      display:none;
  }
  .post-cat-pub{
      display:flex;
      justify-content:space-between;
  }
  .post-pub-desktop {
      display: block;
  }
  .blog-post-date{
      font-size:14px;
      display:inline-block;
      margin:20px 0
  }
  .post-pub-desktop .blog-post-date + .blog-post-date{
      border-left:1px solid #484848;
      margin-left:4px;
      padding-left:6px
  }
  .entry-title{
      margin-top:0
  }

  .post-action-desktop{
    display:flex;
    justify-content:flex-end;
    padding: 15px 80px;
    max-width:1060px;
    background-color: #ececec;
    box-shadow: 2px 2px 4px 0 rgb(100 100 100 / 30%);
    position: relative;
    z-index: 9;
    font-size:16px;
    overflow: visible;
  }
  .post-action-desktop .btn-link{
      font-weight:400
  }
  .post-action-desktop .hig-share-options {
      top: 0px;
      bottom: auto;
  } 

  .sticky-action-bar{
    transform:translateY(-100px);
    transition:transform .3s linear;
  }

  .scroll-up .sticky-action-bar{
    position: fixed;
    top: -1px;
    width: 100%;
    transform: translateY(0);
  }

  #respond{
      border:1px solid #999;
      padding:30px;
  }

  .article-list-home, 
  .article-list-category,
  .category-nav,
  .site-footer{
    padding-left:40px;
    padding-right:40px;
  }
  .footer-promo-widget{
    margin:0 auto;
  }
  .footer-promo-widget > article{
    padding:20px 36px;
  }
  .site-footer, 
  .footer-promo-widget{
    max-width:1060px;
    position:relative;
    z-index:33;
  }

  .pw-content > article{
    max-width:1060px;
  }

  .article-banner {
    padding: 20px 60px;
  }
  .article-banner .promo-widget-area{
      display:flex;
      position:relative;
  }
  .article-banner .promo-widget-content{
      margin-right: 280px;

  }
  .article-banner .promo-action{
      position:absolute;
      right:0;
      width: 260px;
      top:0;
      margin-top:0;
      text-align: right;
      height: 100%;
      display: flex;
      flex-direction:column;
      justify-content:center;
  }
  .article-banner .promo-btn{
      padding-right:20px;
      padding-left:20px;
  }

  ul#menu-footer-nav {
    list-style: none;
    columns: 2;
  }

  .footer-main {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content:  space-between;
  }

  .footer-branding {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      order: 2;
  }

  .footer-logos {
      flex: 1 0 auto;
  }

  nav.footer-nav {
      width: 50%;
      text-align: start;
  }  

}




@media (min-width: 1170px){
  /*
  #menu-main-navigation {
    margin: 0 20px;
  }
  #menu-main-navigation>li {
    font-size:20px;
  }
  #menu-main-navigation>li>a {
    margin: 0 16px;
  }  
  .sub-menu{
  	left:16px;
	}
  */

  .wide-promo{
    justify-content:space-between;
  }
  .wide-promo-image{
    display:block;
  }
  .parallax-widget {
      height: 440px;
  }
  .wide-promo-content {
      padding: 20px 200px;
  }

}

