.projectPosts,
.statPosts {
    min-height: 450px;
    position: relative;
    overflow: hidden;
}
.projectPosts li:after {
    content: '';
    display: block;
    position: relative;
    bottom: -20px;
    width: 20%;
    left: 0;
    border-top: 1px solid #671132;
    transition: .3s;
}
.projectPosts li:hover:after {
    width: 30%;
    transition: .3s;
}
.projectPosts ul,
.statPosts ul {
    padding: 0;
    margin: 120px 0
}

.projectPosts li,
.statPosts li {
    display: block;
    padding: 20px 0;
}

.projectPosts li a {
    color: #671132;
    margin-left: 0;
    transition: margin-left .4s;
    -moz-transition: margin-left .4s;
    -webkit-transition: margin-left .4s
}

.linkStart {
    display: inline-block;
    width: 50px
}

.linkIndent {
    top: 4px;
    width: 0;
    display: inline-block;
    position: relative;
    overflow: hidden;
    transition: width .4s;
    -moz-transition: width .4s;
    -webkit-transition: width .4s
}

.projectPosts li:hover .linkIndent {
    width: 200px;
    transition: width .4s;
    -moz-transition: width .4s;
    -webkit-transition: width .4s
}

.projectPosts li:hover a,
.statPosts li:hover p {
    color: #671132;
    margin-left: 20px;
    transition: margin-left .4s;
    -moz-transition: margin-left .4s;
    -webkit-transition: margin-left .4s
}

.projectPosts li .img {
    position: absolute;
    top: 0;
    right: 0;
    width: 35%;
    height: 100%;
    opacity: 0;
    transition: opacity .4s;
    -moz-transition: opacity .4s;
    -webkit-transition: opacity .4s
}

.projectPosts li .imgOffice {
    position: absolute;
    top: 0;
    right: 0;
    width: 35%;
    height: 100%;
    opacity: 1
}

.projectPosts .firstImg .img,
.statPosts .firstImg img {
    opacity: 1 !important
}

.projectPosts li:hover .img,
.statPosts li:hover img {
    opacity: 1;
    transition: opacity .4s;
    -moz-transition: opacity .4s;
    -webkit-transition: opacity .4s
}

.mobileLink {
    display: none
}

.statPosts li:hover p {
    color: #000;
    margin-left: 30px;
    transition: margin-left .4s;
    -moz-transition: margin-left .4s;
    -webkit-transition: margin-left .4s
}

.statPosts li p {
    display: inline-block;
    margin-bottom: 0
}

.statPosts li .statGraph {
    width: 33%
}

.statPosts li p {
    margin-left: 0;
    color: #a3a3a3;
    transition: margin-left .4s;
    -moz-transition: margin-left .4s;
    -webkit-transition: margin-left .4s
}

.statPosts li:hover .linkIndent {
    width: 100%;
    transition: width .4s;
    -moz-transition: width .4s;
    -webkit-transition: width .4s
}

.statPosts li img {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    height: 100%;
    width: auto !important;
    transition: opacity .4s;
    -moz-transition: opacity .4s;
    -webkit-transition: opacity .4s
}

.statPosts li img.base {
    opacity: 1 !important
}

.btn {
  background-color: #671132;
  color: white;
  border: none;
  border-radius: 0;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
p a {
    position: relative;
    z-index: 2
}

p a:after,
p a:before {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 0;
    background-color: rgba(225, 122, 162, .5);
    opacity: 0;
    transform: translateY(-18px);
    transition: height .4s, cubic-bezier(.175, .885, .32, 1.275) .2s, opacity 0s;
    z-index: -1
}

p a:hover:after,
p a:hover:before,
p a:hover:focus {
    height: 7px;
    opacity: 1;
    transform: translateY(2px);
    transition: height .4s, cubic-bezier(.175, .885, .32, 1.275) .2s, opacity 0s
}

h1 a:after,
h1 a:before,
h2 a:after,
h2 a:before,
h3 a:after,
h3 a:before,
h4 a:after,
h4 a:before,
h5 a:after,
h5 a:before,
h6 a:after,
h6 a:before {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 0;
    background-color: rgba(225, 122, 162, .5);
    opacity: 0;
    transform: translateY(-18px);
    transition: height .4s, cubic-bezier(.175, .885, .32, 1.275) .2s, opacity 0s
}

h1 a:hover:after,
h1 a:hover:before,
h1 a:hover:focus,
h2 a:hover:after,
h2 a:hover:before,
h2 a:hover:focus,
h3 a:hover:after,
h3 a:hover:before,
h3 a:hover:focus,
h4 a:hover:after,
h4 a:hover:before,
h4 a:hover:focus,
h5 a:hover:after,
h5 a:hover:before,
h5 a:hover:focus,
h6 a:hover:after,
h6 a:hover:before,
h6 a:hover:focus {
    height: 7px;
    opacity: 1;
    transform: translateY(2px);
    transition: height .4s, cubic-bezier(.175, .885, .32, 1.275) .2s, opacity 0s
}

.circle {
    border: solid 4px #fff;
    border-radius: 50%;
    height: 250px;
    width: 250px;
    position: relative
}

.circleInner {
    width: 70%
}

.circleInner h3 {
    font-weight: 700
}

.view {
    font-family: 'Playfair Display', serif;
    margin: 0 !important
}

@media(max-width:1200px) {

    .projectPosts,
    .statPosts {
        min-height: 0
    }

    .projectPosts li img {
        display: none
    }

    .projectPosts li a,
    .statPosts li p {
        margin: auto
    }

    .linkIndent {
        display: none
    }

    .mobileLink {
        display: block
    }

    .statPosts .mobileLink {
        padding: 20px 0
    }

    .statPosts .mobileLink img {
        position: static;
        opacity: 1;
        display: block;
        height: auto !important
    }

    .statPosts .mobileLink p {
        margin-left: 0;
        color: #a3a3a3
    }

    .projectPosts li a,
    .projectPosts li:hover a {
        color: #fff
    }

    .deskLink {
        display: none
    }

    .projectPosts li:hover a,
    .statPosts li:hover p {
        margin-left: 0
    }

    .greyBg {
        background: 0 0 !important
    }
}

@media screen and (max-width: 992px){
  .projectPosts li::after {
      display: none;
      bottom: 0;
      width: 0;
      border-top: none;
  }
  .projectPosts li, .statPosts li{
    padding: 0;
  }
  #caseFeed.carousel{
    height: 300px;
  }
}
