.page-works .works-featured {
   position: relative;
   margin-top: 240px;
}
.page-works .works-featured:first-child {
   margin-top: 30vh;
}
.page-works .works-featured-header {
   position: relative;
   z-index: 1;
}
.page-works .works-featured .wrapper {
   max-width: 1400px !important;
   position: relative;
   width: 100%;
}
.page-works .works-featured-header .wrapper {
   display: flex;
}
.page-works .works-featured-header .block {
   box-sizing: border-box;
   flex-basis: 50%;
   padding-left: 180px;
   padding-right: 110px;
   margin-bottom: -40px;
}
.page-works .works-featured-header .block h1,
.page-works .works-featured-header .block h2{
   font-family: "SofiaPro", sans-serif;
   font-weight: 400;
   line-height: 1.154;
   color: rgba(62, 56, 82, 0.5);
   margin: 0 0 15px;
   font-size: 48.6px;
}
.page-works .works-featured-header .block h1 span.underline:after,
.page-works .works-featured-header .block h2 span.underline:after{
   content: '';
   position: absolute;
   left: -12px;
   bottom: 12%;
   z-index: -1;
   background: rgba(152, 149, 162, 0.15);
   width: 97%;
   height: 30%;
   transform: scale(1, 1) translate3d(0, 0, 0);
   transform-origin: left bottom;
   transition: transform 0.5s;
   will-change: transform;
}
.page-works .works-featured-header .block p {
   font-size: 18px;
   line-height: 1.5;
   color: #817d8e;
   margin: 0 0 18px;
}
.page-works .works-featured-header .block a {
   display: inline-block;
   position: relative;
   font-family: "ProximaNova", sans-serif;
   text-decoration: none;
}
.page-works .works-featured-header .block a:after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;  
   width: 100%;
   height: 1px;
   background: #f03454;
   transition: transform 0.3s, opacity 0.3s;
}
.page-works .works-featured-header .block a:hover:after {
   transform: translate3d(0, 10px, 0);
   opacity: 0;
}
.page-works .works-featured-body {
   position: relative;
   padding: 80px 0;
   transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.4s cubic-bezier(0.42, 0, 0.58, 1) 0s;
   transition-delay: 0.3s;
}
.page-works .works-featured-body-background {
   position: absolute;
   z-index: -1;
   top: 0;
   right: 0;
   bottom: 0;
   width: calc((100vw - 1400px) / 2 + 590px);
   background: rgba(161, 137, 174, 0.15);
}
.page-works .works-featured-body-thumbnail {
   overflow: hidden;
   /*   background-color: #b5c8fc; */
}
.page-works .works-featured-header .chatbot-point {
   width: 350px;
   height: 350px;
   left: 0;
}
.page-works .works-featured-body .chatbot-point {
   width: 300px;
   height: 300px;
   left: -120px;
}
#tatra-banka .works-featured-body-thumbnail {
   background-color: #d7dce1;
   box-shadow: 0 30px 45px 0 rgba(186, 188, 190, 0.25);
}
#fanvest .works-featured-body-thumbnail {
   background-color: #8BE1B9;
   box-shadow: 0 30px 45px 0 rgba(118, 200, 162, 0.247596);
}
#skipcash .works-featured-body-thumbnail {
   background-color: #93C7FA;
   box-shadow: 0 30px 45px 0 rgba(147, 199, 250, 0.25);
}
#caribu .works-featured-body-thumbnail {
   background-color: #b7d8fc;
   box-shadow: 0 30px 45px 0 rgba(161, 206, 235, 0.25);
}
#bigscoots .works-featured-body-thumbnail {
   background-color: #c3cdfd;
   box-shadow: 0 30px 45px 0 rgba(146, 171, 226, 0.25);
}
.works-featured-items .works-featured:first-child .works-featured-body-thumbnail {
   background-color: #d7dce1;
   box-shadow: 0 30px 45px 0 rgba(186, 188, 190, 0.25);
}
.page-works .works-featured-body-thumbnail .thumbnail {
   position: relative;
   width: 100%;
   height: 0;
   padding-bottom: 51.6%;
   background-repeat: no-repeat;
   background-size: auto 100%;
   background-position: center;
}
.page-works .works-featured-body-thumbnail .thumbnail video {
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%);
   height: 100%;
   width: auto;
   opacity: 1;
   transition: opacity 1s;
}
.page-works .works-featured:nth-child(even) .works-featured-body-background {
   right: unset;
   left: 0;
}
.page-works .works-featured:nth-child(even) .works-featured-header .block {
   margin-left: 50%;
   padding-left: 110px;
   padding-right: 180px;
}
section#bigscoots {
   margin-bottom: 20vh;
}
@media (min-width: 1441px) {
   .page-works .works-featured-header .block h1,
   .page-works .works-featured-header .block h2{
      font-size: 52px;
   }
   .page-works .works-featured-header .block p {
      font-size: 24px;
   }
}

@media (max-width: 1440px)  {
   .page-works .works-featured {
      margin-top: 210px;
   }

   .page-works .works-featured .wrapper {
      max-width: 1180px !important;
   }
   .page-works .works-featured-header .block {
      padding-left: 110px;
      padding-right: 80px;
      margin-bottom: -32px;
   }

   .page-works .works-featured-body {
      padding: 65px 0;
   }

   .page-works .works-featured-body-background {
      width: calc((100vw - 1180px) / 2 + 340px);
   }


   .works-featured-items .works-featured:first-child .works-featured-body-thumbnail {
      box-shadow: 0 20px 40px rgba(186, 188, 190, 0.25);
   }

   .page-works .works-featured:nth-child(even) .works-featured-header .block {
      padding-left: 110px;
      padding-right: 80px;
   }

}

@media (max-width: 1200px) {
   .page-works .works-featured .wrapper {
      padding: 0 40px;
   }

   .page-works .works-featured-header .block {
      padding-left: 80px;
      padding-right: 0;
   }

}

@media (max-width: 1024px) {
   .page-works .works-featured {
      margin-top: 145px;
   }

   .page-works .works-featured-header .block h1 span.underline,
   .page-works .works-featured-header .block h2 span.underline{
      display:inline;
   }

   .page-works .works-featured-body {
      padding: 40px 0;
   }

   .page-works .works-featured-body-background {
      top: 80px;
      width: 100%;
   }

   .page-works .works-featured-header .block {
      flex-basis: 480px;
      padding-left: 60px;
      padding-right: 0;
      margin-bottom: 0;
   }

   .page-works .works-featured-body-thumbnail .thumbnail {
      padding-bottom: 67.5%;
   }

   .page-works .works-featured:nth-child(even) .works-featured-header .block {
      flex-basis: 480px;
      padding-left: 60px;
      padding-right: 0;
      margin-left: 0;
      margin-bottom: 0;
   }

   .page-works .works-featured-header .block h1 span.underline:after ,
   .page-works .works-featured-header .block h2 span.underline:after {
      display:none;
   }


}

/* @media (max-width: 768px) {
.works-featured-items .works-featured:first-child .works-featured-body-thumbnail .thumbnail {
background-image: url(//f.hubspotusercontent20.net/hubfs/2474026/PLATFORM_2020/images/tatrabanka-mockup-mobile.png) !important;
}
} */



@media (max-width: 667px) {
   .page-works .works-featured {
      margin-top: 90px;
   }

   .page-works .works-featured-header .block {
      padding-left: 15px;
   }

   .page-works .works-featured-header .block h1,
   .page-works .works-featured-header .block h2{
      font-size: 30px;
      line-height: 40px;
   }

   .page-works .works-featured-header .block p {
      font-size: 16px;
   }

   .page-works .works-featured-body {
      padding: 25px 0;
   }

   .page-works .works-featured-body-background {
      top: 50px;
   }

   .page-works .works-featured:first-child {
      margin-top: calc(30vh - 35px);
   }

   .page-works .works-featured:nth-child(even) .works-featured-header .block {
      padding-left: 15px;
   }

}

@media (max-width: 640px) {
   .page-works .works-featured .wrapper {
      padding: 0 25px;
   }
}