/* @group Update
------------------------------------ */
.post-header { margin-bottom: 4.7rem; color:rgb(92 34 73); padding-top: 16.4rem;   background: #E6E2DD;}
.post-header time{ font-family: var(--control-font); font-size: 1.4em; letter-spacing: 0.5px; text-transform: uppercase; font-weight: 600; margin-bottom: 1rem; display: block;}
.post-header h1 { margin-bottom: 4rem;  }
.post-header .img-box { height: 53.3rem; padding-bottom: 2.4rem; padding-right: 7.1rem; }
.post-header .img-box {z-index: 1; }
.post-header .img-box::after { content: ''; position: absolute; right: 0; top: 0; height: 16rem; width: 12rem; z-index: -1; background-size: cover; }
.post-header .img-box::after { background: #836C69 none; z-index:-1; height: calc(100% - 9.4rem); width: calc(100% - 2.4rem); bottom: 0; top: auto; }
.post-header .back-btn{ display: flex; font-weight: 600; align-items: center; text-transform: uppercase; color:rgb(92, 34, 73); font-size: 1.4em; letter-spacing: 0.5px; margin-bottom: 5rem;}
.post-header .back-btn,
.post-header h1,
.post-header .img-box img,
.post-header .img-box::before,
.post-header .img-box::after,
.post-header time{ visibility: hidden;}

/* Post Detail
------------------------------------ */
.post-header .back-btn i{ color: #fff; transform: rotate3d(0, 0, 1, 180deg); font-size: 1em; display: flex; align-items: center; justify-content: center; background: rgb(92, 34, 73); height: 5.5rem; width: 5.5rem; border-radius: 50%; z-index: -1; margin-right: 1rem; }
.post-detail { color:#836C69; }
/* .post-detail p{ margin-bottom: 4rem;  } */
.post-detail h3{ font-size: 3.6em; }
.post-detail p,
.post-detail .bttn,
.post-detail h3{ visibility: hidden}

/* Animations Post Header
------------------------------------ */
.post-header.animateActive .back-btn,
.post-header.animateActive h1,
.post-header.animateActive time{ animation: fadeUp .6s forwards}
.post-header.animateActive .back-btn{ animation-delay: .2s;}
.post-header.animateActive time{ animation-delay: .4s;}
.post-header.animateActive h1{ animation-delay: .6s;}
.post-header.animateActive .img-box img,
.post-header.animateActive .img-box::before,
.post-header.animateActive .img-box::after{ animation: fullLeft 1.2s 1 cubic-bezier(0.4,0.0,0.2,1) forwards;}
.post-header.animateActive .img-box::after{ animation-delay: .6s;}
.post-header.animateActive .img-box::before{ animation-delay: .9s;}

/* Animations Post Detail
------------------------------------ */
.post-detail.animateActive p,
.post-detail.animateActive .bttn,
.post-detail.animateActive h3{ animation: fadeUp .6s forwards}
.post-detail.animateActive h3 { animation-delay: .2s;}
.post-detail.animateActive p { animation-delay: .3s;}
.post-detail.animateActive .bttn { animation-delay: .5s;}


.blog-widget + .marque-title h2{ color:rgb(92, 34, 73)}
.blog-widget + .contact-form{ background:#E6E2DD;}
.blog-widget + .contact-form h2{color: #5B766A;}
.blog-widget + .contact-form .img-box{ display: none;}
.blog-widget ~ .contact-form .bttn { color: #5E465C;}
.blog-widget ~ .contact-form .bttn-white:before { border: .15rem solid rgba(94,70,92,1);}
.blog-widget ~ .contact-form .bttn-white:after { background: #5E465C; }

@media only screen
and (min-width : 961px) {
  
  .post-header h1 { font-size: 5.5em; letter-spacing: 0.5px; line-height: 1.273em; max-width: 52.8rem; }
  .post-header .img-box { height: 57.8rem; padding-bottom: 4.5rem; padding-right: 12rem; }
  .post-header .img-box::before { content: ''; position: absolute; left: 0; bottom: 0; height: 16rem; width: 14rem; z-index: -1; background: white; }
  .post-header .img-box::after { height: 41.9rem; width: calc(100% - 8.33%); }
  .post-detail {padding-bottom: 8rem;}
  .post-detail .bttn { width: 24rem; margin-top: 2.3rem;}
  .post-detail h2{ margin-bottom: 1rem; font-size: 3.2em; line-height: 1.667em;} 
  .post-detail h3{ line-height: 1.667em; margin-bottom: 1.5rem;} 

  .blog-widget ~ .contact-form { padding: 13.7rem 0; }
  @media (hover: hover) {
    .blog-widget ~ .contact-form .bttn:hover { color: white;}

  }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .post-header{ margin: 0; padding-bottom: 3.5rem;}
    .post-header h1{ margin-bottom: 3.5rem;}
    .post-header .img-box { height: 26rem; }
    .post-detail{ background: #E6E2DD;}
    .post-detail h2{   font-size: 3em; line-height: 1.333em; margin-bottom: 2.5rem;}
    .post-detail p{   font-size: 1.5em; line-height:1.867em;}
    .post-detail .bttn { margin-top: 3.5rem;}

    .blog-widget ~ .contact-form{  padding: 4rem 0 7rem; }
    .blog-widget ~ .contact-form h2{  font-size: 4em; line-height: 1.250em; margin: 0 0 3.5rem; }
  }

/* @end */