.blog_next_prev_buttons {
   margin-top: 80px;
}
.blog_next_prev_buttons {
   text-align: center;
   overflow: hidden;
   position: relative;
   background-color: #333;
}
.vc_row-fluid::before, .vc_row-fluid::after {
   content: "";
   display: table;
}
.post-pagi ul {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   width: 100%;
   padding: 0;
   margin: 0;
   list-style: none;
}
ul.controls li {
   width: 50%;
   line-height: 0;
   height: auto;
   padding: 6% 9%;
   min-height: 300px;
   -webkit-justify-content: center;
   justify-content: center;
   display: -webkit-flex;
   display: flex;
   -moz-box-align: center;
   -moz-box-pack: center;
   align-items: center;
   -webkit-align-items: center;
   float: none;
   overflow: hidden;
   position: relative;
   background-color: #333;
}
li.previous-post.mouse-leaving h3, li.next-post.mouse-leaving h3 {
   margin-bottom: 7px;
   position: relative;
   z-index: 9;
   display: inline-block;
   -webkit-transform: translateX(0) translateZ(0);
   -webkit-transition: transform 0.4s cubic-bezier(.05,.2,.1,1);
   transform: translateX(0) translateZ(0);
   transition: transform 0.4s cubic-bezier(.05,.2,.1,1);
}
li.previous-post.mouse-leaving:hover h3 {
   transform: translateX(40px) translateZ(0);
   backface-visibility: hidden;
}
ul.controls li:after {
   background-color: rgba(13,13,13,.35);
   position: absolute;
   left: 0;
   top: 0;
   content: '';
   display: block;
   z-index: 1;
   width: 100%;
   height: 100%;
   -webkit-transition: background-color 0.4s cubic-bezier(.05,.2,.1,1) 0s;
   transition: background-color 0.4s cubic-bezier(.05,.2,.1,1) 0s;
}
li.previous-post.mouse-leaving span{
   display: block;
   font-size: 16px;
   text-align: right;
}
li.next-post.mouse-leaving span {
   display: block;
   font-size: 16px;
   text-align: left;
}
li.previous-post.mouse-leaving span, li.next-post.mouse-leaving span {
   line-height: 31px;
   color: #fff;
}
li.previous-post.mouse-leaving h3 span {
   font-size: 16px;
   line-height: 31px;
}
span.text {
   font-size: 26px !important;
   line-height: 31px;
}




@keyframe rightAarrowEnd2{
   0% {
      transform: translateX(-42px) rotate(180deg);
   }
   100% {
      transform: translateX(-75px) rotate(180deg);
   }
}

li.previous-post.mouse-leaving:hover h3 {
   transform: translateX(40px) translateZ(0);
   backface-visibility: hidden;
}
li.next-post.mouse-leaving:hover h3 {
   -webkit-transform: translateX(-40px) translateZ(0);
   transform: translateX(-40px) translateZ(0);
   backface-visibility: hidden;
}


.blog_next_prev_buttons .previous-post h3 .next-arrow {
   -webkit-transform: translateX(38px) rotate(
      180deg
   );
   transform: translateX(38px) rotate(
      180deg
   );
   left: -43px;
   right: auto;
}

.line {
   animation: rightLineEnd 0.4s cubic-bezier(.05,.2,.1,1) forwards;
}
li.next-post.mouse-leaving .line {
   height: 2px;
   width: 45px;
   background-color: #fff;
   position: absolute;
   content: '';
   right: -74px;
   display: block;
   backface-visibility: hidden;
   top: 50%;
   -webkit-transform: translateY(-50%) translateX(28px) scaleX(0);
   -webkit-transform-origin: right;
   transform: translateY(-50%) translateX(28px) scaleX(0);
   transform-origin: right;
}
.next-post:hover h3 .next-arrow {
   -webkit-transform: translateX(42px);
   transform: translateX(42px);
}


li.previous-post.mouse-leaving .line {
   -webkit-transform: translateY(-50%) translateX(-28px) scaleX(0);
   -webkit-transform-origin: left;
   transform: translateY(-50%) translateX(-28px) scaleX(0);
   transform-origin: left;
   left: -74px;
   right: auto;
   height: 2px;
   width: 45px;
   background-color: #fff;
   position: absolute;
   content: '';
   backface-visibility: hidden;
   top: 50%;
}


blog_next_prev_buttons h3 span.text .next-arrow {
   position: absolute;
   backface-visibility: hidden;
   right: -43px;
   top: 50%;
   margin-top: -15px;
   height: 30px;
   width: 40px;
   display: block;
   transform: translateX(38px);
}
.blog_next_prev_buttons span.text .next-arrow {
   position: absolute;
   backface-visibility: hidden;
   right: -43px;
   top: 50%;
   margin-top: -15px;
   height: 30px;
   width: 40px;
   display: block;
   transform: translateX(38px);
}

.post-bg-img{
   width: 100%;
   position: absolute;
   left: 0;
   top: 0;
   background-size: cover;
   background-position: center;
   height: 100%;
   -ms-transition: transform 0.4s cubic-bezier(.05,.2,.1,1) 0s;
   -webkit-transition: transform 0.4s cubic-bezier(.05,.2,.1,1) 0s;
   transition: transform 0.4s cubic-bezier(.05,.2,.1,1) 0s;
}

.post-pagi ul li:hover .post-bg-img {
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
}
ul.controls li:hover:after {
   background-color: rgb(51 51 51 / 90%);
}
ul.controls li:after {
   background-color: rgba(13,13,13,.35);
   position: absolute;
   left: 0;
   top: 0;
   content: '';
   display: block;
   z-index: 1;
   width: 100%;
   height: 100%;
   -webkit-transition: background-color 0.4s cubic-bezier(.05,.2,.1,1) 0s;
   transition: background-color 0.4s cubic-bezier(.05,.2,.1,1) 0s;
}
span.text a {
   color: #fff;
}
ul.controls.full-width li {
   width: 100%;
}

ul.controls.full-width li.previous-post.mouse-leaving h3 span {
   text-align: center;
}

ul.controls.full-width li:hover h3 {
   -webkit-transform: translateX(-40px) translateZ(0);
   transform: translateX(-40px) translateZ(0);
   backface-visibility: hidden;
}



.blog_next_prev_buttons {
   margin-top: 80px;
   margin-bottom: 1.5em;
}
.blog_next_prev_buttons {
   text-align: center;
   overflow: hidden;
   position: relative;
   background-color: #333;
}
.container-wrap[data-nav-pos="after_project_2"] .bottom_controls #portfolio-nav ul,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .controls {
   display: -webkit-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   flex-wrap: wrap;
   width: 100%;
   padding: 0;
   margin: 0;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .previous-post, .blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .next-post {
   padding: 6% 9%;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .previous-post,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .next-post{
   width: 50%;
   line-height: 0;
   height: auto;
   padding: 6%;
   min-height: 300px;
   -webkit-justify-content: center;
   justify-content: center;
   display: -webkit-flex;
   display: flex;
   -moz-box-align: center;
   -moz-box-pack: center;
   align-items: center;
   -webkit-align-items: center;
   float: none;
   overflow: hidden;
   position: relative;
   background-color: #333;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .post-bg-img,
.blog_next_prev_buttons[data-style="fullwidth_next_only"] .post-bg-img{
   width: 100%;
   position: absolute;
   left: 0;
   top: 0;
   background-size: cover;
   background-position: center;
   height: 100%;
   -ms-transition: transform 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) 0s;
   -webkit-transition: transform 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) 0s;
   transition: transform 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) 0s;
}
.container-wrap[data-nav-pos="after_project_2"] .bottom_controls .controls li a, .blog_next_prev_buttons[data-style="fullwidth_next_prev"] li a {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 101;
   display: block;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post h3,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post h3 {
   color: #fff;
   position: relative;
   z-index: 100;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] h3 {
   display: inline-block;
   -webkit-transform: translateX(0px) translateZ(0);
   -webkit-transition: transform 0.4s cubic-bezier(0.05, 0.2, 0.1, 1);
   transform: translateX(0px) translateZ(0);
   transition: transform 0.4s cubic-bezier(0.05, 0.2, 0.1, 1);
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .previous-post:after,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .next-post:after {
   background-color: rgba(13,13,13,0.35);
   position: absolute;
   left: 0;
   top: 0;
   content: '';
   display: block;
   z-index: 1;
   width: 100%;
   height: 100%;
   -webkit-transition: background-color 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) 0s;
   transition: background-color 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) 0s;
}
.container-wrap[data-nav-pos="after_project_2"] .bottom_controls .previous-project span:not(.text), .blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post span:not(.text) {
   display: block;
   font-size: 14px;
   text-align: right;
}
.blog_next_prev_buttons[data-style*="next_prev"] .previous-post h3 span {
   text-align: right;
}
.blog_next_prev_buttons span {
   display: block;
   color: #fff;
   margin-bottom: 5px;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post span:not(.text) {
   display: block;
   font-size: 14px;
   text-align: left;
}
.blog_next_prev_buttons[data-style*="next_prev"] .next-post h3 span {
   text-align: left;
}
.blog_next_prev_buttons[data-style="fullwidth_next_only"]:hover .post-bg-img,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] li:hover .post-bg-img {
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .previous-post:hover:after,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] ul .next-post:hover:after {
   background-color: rgba(13,13,13,0.9);
}

.container-wrap[data-nav-pos="after_project_2"] .bottom_controls .controls li a, .blog_next_prev_buttons[data-style="fullwidth_next_prev"] li a {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 101;
   display: block;
}

.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post.mouse-leaving h3 .next-arrow {
   animation: rightArrowEnd 0.7s cubic-bezier(0, 0.2, 0.1, 1) forwards;
}

.blog_next_prev_buttons[data-style="fullwidth_next_prev"] h3 .next-arrow {
   position: absolute;
   backface-visibility: hidden;
   right: -43px;
   top: 50%;
   margin-top: -15px;
   height: 30px;
   width: 40px;
   display: block;
   transform: translateX(38px);
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post:hover h3 .next-arrow,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post:hover h3 .next-arrow {
   -webkit-transform: translateX(42px);
   transform: translateX(42px);
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post.mouse-leaving h3 .next-arrow {
   animation: rightArrowEnd2 0.7s cubic-bezier(0, 0.2, 0.1, 1) forwards;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post:hover h3 {
   transform: translateX(40px) translateZ(0);
   backface-visibility: hidden;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post:hover h3 {
   -webkit-transform: translateX(-40px) translateZ(0);
   transform: translateX(-40px) translateZ(0);
   backface-visibility: hidden;
}

.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post.mouse-leaving h3 .next-arrow line,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post.mouse-leaving h3 .next-arrow line {
   animation: rightArrowLineEnd 0.4s cubic-bezier(0.3, 0.2, 0.1, 1) 0.25s forwards;
   stroke-dashoffset: 40px;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post:hover h3 .next-arrow {
   animation: rightArrowStart2 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) forwards;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post h3 .next-arrow line,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post h3 .next-arrow line {
   stroke: #ffffff;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post.mouse-leaving h3 .next-arrow line,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post.mouse-leaving h3 .next-arrow line {
   animation: rightArrowLineEnd 0.4s cubic-bezier(0.3, 0.2, 0.1, 1) 0.25s forwards;
   stroke-dashoffset: 40px;
}

.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post h3 .next-arrow line,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post h3 .next-arrow line {
   stroke-width: 2px;
   stroke-dasharray: 10px;
   stroke-dashoffset: 30px;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post h3 .next-arrow {
   -webkit-transform: translateX(38px) rotate(180deg);
   transform: translateX(38px) rotate(180deg);
   left: -43px;
   right: auto;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .controls .previous-post:hover .next-arrow line,
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .controls .next-post:hover .next-arrow line {
   animation: rightArrowLineStart 0.3s cubic-bezier(0.05, 0.2, 0.1, 1) 0.1s forwards;
   stroke-dashoffset: 30px;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post:hover h3 .text .line {
   -webkit-transform: translateY(-50%) translateX(0px) scaleX(1);
   -webkit-transform-origin: right;
   transform: translateY(-50%) translateX(0px) scaleX(1);
   transform-origin: right;
   animation: rightLineStart2 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) forwards;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post h3 .text .line {
   -webkit-transform: translateY(-50%) translateX(-28px) scaleX(0);
   -webkit-transform-origin: left;
   transform: translateY(-50%) translateX(-28px) scaleX(0);
   transform-origin: left;
   left: -74px;
   right: auto;
}

.blog_next_prev_buttons[data-style="fullwidth_next_prev"] h3 .text .line {
   height: 2px;
   width: 45px;
   background-color: #fff;
   position: absolute;
   content: '';
   right: -74px;
   display: block;
   backface-visibility: hidden;
   top: 50%;
   -webkit-transform: translateY(-50%) translateX(28px) scaleX(0);
   -webkit-transform-origin: right;
   transform: translateY(-50%) translateX(28px) scaleX(0);
   transform-origin: right;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post:hover h3 .text .line {
   -webkit-transform: translateY(-50%) translateX(0px) scaleX(1);
   -webkit-transform-origin: right;
   transform: translateY(-50%) translateX(0px) scaleX(1);
   transform-origin: right;
   animation: rightLineStart2 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) forwards;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .next-post:hover h3 .text .line {
   -webkit-transform: translateY(-50%) translateX(0px) scaleX(1);
   -webkit-transform-origin: left;
   transform: translateY(-50%) translateX(0px) scaleX(1);
   transform-origin: left;
   animation: rightLineStart 0.4s cubic-bezier(0.05, 0.2, 0.1, 1) forwards;
}
ul.controls.hs-pagination-single .previous-post,
ul.controls.hs-pagination-single .next-post {
   width: 100%;
}
.hs-pagination-single .container-wrap[data-nav-pos="after_project_2"] .bottom_controls .previous-project span:not(.text),
.hs-pagination-single .blog_next_prev_buttons[data-style="fullwidth_next_prev"] .previous-post span:not(.text) {
   text-align: center;
}
.blog_next_prev_buttons[data-style="fullwidth_next_prev"] .hs-pagination-single .next-post:hover h3 .text .line {
   margin-top: 0;
}
@keyframes rightLineEnd {
   0% {
      transform: translateY(-50%) translateX(0px) scaleX(1);
   }
   100% {
      transform: translateY(-50%) translateX(28px) scaleX(0);
   }
}
@keyframes rightLineStart2 {
   0% {
      transform: translateY(-50%) translateX(88px) scaleX(0);
   }
   100% {
      transform: translateY(-50%) translateX(0px) scaleX(1);
   }
}
@keyframes rightLineEnd2 {
   0% {
      transform: translateY(-50%) translateX(0px) scaleX(1);
   }
   100% {
      transform: translateY(-50%) translateX(-28px) scaleX(0);
   }
}
@keyframes rightLineEnd2 {
   0% {
      transform: translateY(-50%) translateX(0px) scaleX(1);
   }
   100% {
      transform: translateY(-50%) translateX(-28px) scaleX(0);
   }
}
@keyframes rightLineStart2 {
   0% {
      transform: translateY(-50%) translateX(88px) scaleX(0);
   }
   100% {
      transform: translateY(-50%) translateX(0px) scaleX(1);
   }
}
@keyframes rightArrowLineStart {
   0% {
      stroke-dashoffset: 30px;
   }
   100% {
      stroke-dashoffset: 40px;
   }
}
@keyframes rightArrowStart {
   0% {
      transform: translateX(-50px);
   }
   100% {
      transform: translateX(42px);
   }
}

@keyframes rightArrowStart2 {
   0% {
      transform: translateX(50px) rotate(180deg);
   }
   100% {
      transform: translateX(-42px) rotate(180deg);
   }
}
@keyframes rightArrowEnd2 {
   0% {
      transform: translateX(-42px) rotate(180deg);
   }
   100% {
      transform: translateX(-75px) rotate(180deg);
   }
}

@keyframes rightArrowLineEnd {
   0% {
      stroke-dashoffset: 40px;
   }
   100% {
      stroke-dashoffset: 50px;
   }
}

@media(max-width:690px){
   .blog_next_prev_buttons svg,.blog_next_prev_buttons .line {
      display: none !important;
   }
}
