/*
Theme Name: Escape the Villa
Author: Ali Alaa El Dine
Version: 1.0.04
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

*{
  -webkit-box-sizing: border-box !important;
  -moz-box-sizing: border-box !important;
  -ms-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

:root {
  /*--main-pad-horiz: 120px;
  --blks-pad-horiz: 30px;
  --blks-margin-fix: -30px;*/
}

/*html{
  scroll-behavior: smooth;
}*/

body{
	padding: 0;
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
  background-color: #101112;
  font-family: "Maven Pro", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}

p{
    margin: 0;
}

a, input, button, textarea{
    outline: none !important;
}

h1, h2, h3, h4{
  font-weight: 400;
	margin: 0;
}

h1.light, h2.light, h3.light, h4.light{
  font-weight: 300;
}

h1.reg, h2.reg, h3.reg, h4.reg{
  font-weight: 400;
}

h1.medium, h2.medium, h3.medium, h4.medium{
  font-weight: 500;
}

h1.sbold, h2.sbold, h3.sbold, h4.sbold{
  font-weight: 600;
}

h1.bold, h2.bold, h3.bold, h4.bold{
  font-weight: 700;
}

.mobile-only{
    display: none;
}

.light{
  font-weight: 300;
}
.reg{
  font-weight: 400;
}
.medium{
  font-weight: 500;
}
.sbold{
  font-weight: 600;
}
.bold{
  font-weight: 700;
}

a, input, textarea, button{
	outline: none !important;
}

header.escapevilla-header .mobile_menu_cta{
	cursor: pointer;
    height: 26px;
    right: 0;
    position: absolute;
    text-decoration: none;
    top: 50%;
    width: 35px;
    z-index: 22;
		margin: -13px 0 0;

	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	/*-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-ms-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;*/

	-webkit-transition: 0.4s cubic-bezier(0.1, 0.12, 0, 1);
	-moz-transition: 0.4s cubic-bezier(0.1, 0.12, 0, 1);
	-ms-transition: 0.4s cubic-bezier(0.1, 0.12, 0, 1);
	-o-transition: 0.4s cubic-bezier(0.1, 0.12, 0, 1);
	transition: 0.4s cubic-bezier(0.1, 0.12, 0, 1);
}

header.escapevilla-header.scrolling  .mobile_menu_cta{
  margin: -6px 0 0;
}

header.escapevilla-header .mobile_menu_cta span {
	background-color: #ffffff;
    border-radius: 0;
    display: block;
    height: 3px;
    left: 0;
    opacity: 1;
    position: absolute;
    width: 100%;

	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);

	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-ms-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

header.escapevilla-header .mobile_menu_cta span:nth-child(1) {
	top: 0px;
}

header.escapevilla-header .mobile_menu_cta span:nth-child(2),header.escapevilla-header .mobile_menu_cta span:nth-child(3) {
	top: 11px;
}

header.escapevilla-header .mobile_menu_cta span:nth-child(4) {
	top: 22px;
}

header.escapevilla-header .mobile_menu_cta.open span:nth-child(1) {
	top: 11px;
	width: 0%;
	left: 50%;
}

header.escapevilla-header .mobile_menu_cta.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

header.escapevilla-header .mobile_menu_cta.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

header.escapevilla-header .mobile_menu_cta.open span:nth-child(4) {
	top: 11px;
	width: 0%;
	left: 50%;
}

.escapevilla-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 20;
  transition: all 300ms ease;
}

.scrolling .escapevilla-header{
  background-color: #101112;
}

.escapevilla-header .header-wrapper{
  padding: 25px 60px;
  transition: all 300ms ease;
}

.scrolling .escapevilla-header .header-wrapper{
  padding: 9px 60px 11px;
}

.escapevilla-header .header-container{
  position: relative;
}

.escapevilla-header .logo{
  max-width: 130px;
  position: relative;
  z-index: 15;
  transition: all 300ms ease;
}

.scrolling .escapevilla-header .logo{
  max-width: 90px;
}

.escapevilla-header .logo a{
  display: block;
  text-decoration: none;
  width: 100%;
  height: auto;
}

.escapevilla-header .logo a svg{
  width: 100%;
  height: auto;
  display: block;
}

.escapevilla-header .escapevilla-hblk.menu{
  position: fixed;
  background-color: #101112;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.escapevilla-header .escapevilla-hblk.menu {
  position: fixed;
  background-color: #101112;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  padding: 165px 60px 60px;
  display: none;
}

.escapevilla-header .escapevilla-hblk.menu .escapevilla-menu-wrap{
  width: 100%;
  height: 100%;
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.escapevilla-header .escapevilla-hblk.menu ul.menu{
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}

.escapevilla-header .escapevilla-hblk.menu ul.menu li{
  padding: 15px;
}

.escapevilla-header .escapevilla-hblk.menu ul.menu li a {
  font-size: 32px;
  line-height: 40px;
  font-weight: 800;
  font-family: "Montserrat";
  text-decoration: none;
  cursor: pointer;
  transition: all 300ms ease;
}

.escapevilla-header .escapevilla-hblk.menu ul.menu li a:hover,
.escapevilla-header .escapevilla-hblk.menu ul.menu li a.active{
  color: #f4c400;
}

section.escape-sec .sec-wrap,
section.escape-sec.hero .slide-txts,
footer.escapevilla-footer .footer-wrapper{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

section.escape-sec.hero .sec-wrap{
  max-width: unset;
  padding: 0;
}

.hero-slider .hero-slide{
  width: 100%;
  height: 100vh;
  position: relative;
}

.hero-slider .hero-slide .slide-bg{
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero-slider .hero-slide .slide-bg.mob{
  display: none;
}

.hero-slider .hero-slide .hero-slide-wrap{
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  padding: 130px 0 40px;
  background: linear-gradient(270deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.7) 55%, rgba(0,0,0,0.95) 100%);
}

.hero-slider .hero-slide .hero-slide-wrap .hero-slide-cont{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-slider .hero-slide .slide-txts .slide-tag-container{
  padding: 0 0 20px;
  font-size: 0;
  line-height: 0;
}

.hero-slider .hero-slide .slide-txts .slide-tag-container .slide-icon{
  display: inline-block;
  vertical-align: middle;
  max-width: 45px;
  padding: 0 10px 0 0;
}

.hero-slider .hero-slide .slide-txts .slide-tag-container .slide-icon img{
  width: 100%;
  height: auto;
  display: block;
}

.hero-slider .hero-slide .slide-txts .slide-tag-container .slide-tag{
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  text-transform: uppercase;
  line-height: 26px;
  color: #aaa;
}

.hero-slider .hero-slide .slide-txts .slide-title {
  max-width: 720px;
  padding: 0 0 20px;
}

.hero-slider .hero-slide .slide-txts .slide-title h1 {
  font-size: 66px;
  line-height: 66px;
  letter-spacing: 5px;
}

.hero-slider .hero-slide .slide-txts .slide-text{
  font-size: 18px;
  line-height: 26px;
  max-width: 720px;
}

.hero-slider .hero-slide .slide-txts .escape-cta-wrap{
  padding: 40px 0 0;
}

.escape-cta{
  font-family: "Montserrat";
  text-transform: uppercase;
  background-color: #f4c400;
  height: 50px;
  line-height: 50px;
  border: 1px solid #f4c400;
  display: inline-block;
  text-decoration: none;
  font-weight: 700;
  color: #fff;
  padding: 0 40px;
  cursor: pointer;
  letter-spacing: 2px;
  transition: all 300ms ease;
}

.escape-cta:hover{
  background-color: transparent;
  color: #f4c400;
}

.hero-slider .slick-dots{
  position: absolute;
  bottom: 20px;
  padding: 0;
  margin: 0;
  display: block;
  width: 100%;
  text-align: center;
}

.hero-slider .slick-dots li{
  font-size: 0;
  line-height: 0;
  padding: 0 5px;
  display: inline-block;
  vertical-align: middle;
}

.hero-slider .slick-dots li button{
  background-color: transparent;
  border: 1px solid #f4c400;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  overflow: hidden;
  text-indent: -5000px;
  transition: all 300ms ease;
}

.hero-slider .slick-dots li.slick-active button{
  background-color: #f4c400;
}

.emotions-list .emotion {
  display: inline-block;
  vertical-align: middle;
  width: 25%;
  padding: 20px;
}

.emotions-list .emotion .emotion-icon .emotion-icon-wrap{
  width: 100%;
  height: auto;
}

.emotions-list .emotion .emotion-icon .emotion-icon-wrap svg{
  width: 100%;
  height: auto;
  display: block;
}

.emotions-list .emotion .emotion-icon .emotion-icon-wrap svg circle,
.emotions-list .emotion .emotion-icon .emotion-icon-wrap svg path{
  fill: rgba(255,255,255,0.5);
  transition: all 300ms ease;
}

.emotions-list .emotion .emotion-icon .emotion-icon-wrap svg path{
  fill: rgba(255,255,255,0);
}

.emotions-list .emotion .emotion-inner{
  cursor: pointer;
}

.emotions-list .emotion .emotion-inner:hover .emotion-icon .emotion-icon-wrap svg circle,
.emotions-list .emotion .emotion-inner.active .emotion-icon .emotion-icon-wrap svg circle{
  fill: #f4c400;
}

.emotions-list .emotion .emotion-icon {
  padding: 15px;
  position: relative;
}

.emotions-list .emotion .emotion-icon .corner{
  width: 20%;
  padding-bottom: 20%;
  position: absolute;
  opacity: 0;
  transition: all 300ms ease;
}

.emotions-list .emotion .emotion-inner.active .emotion-icon .corner{
  opacity: 1;
}

.emotions-list .emotion .emotion-icon .corner.corner1{
  left: 0;
  top: 0;
  border-top: 1px solid #f4c400;
  border-left: 1px solid #f4c400;
}

.emotions-list .emotion .emotion-icon .corner.corner2{
  right: 0;
  top: 0;
  border-top: 1px solid #f4c400;
  border-right: 1px solid #f4c400;
}

.emotions-list .emotion .emotion-icon .corner.corner3{
  left: 0;
  bottom: 0;
  border-bottom: 1px solid #f4c400;
  border-left: 1px solid #f4c400;
}

.emotions-list .emotion .emotion-icon .corner.corner4{
  right: 0;
  bottom: 0;
  border-bottom: 1px solid #f4c400;
  border-right: 1px solid #f4c400;
}

.emotions-list .emotion .emotion-title{
  padding: 15px 0 0;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}

.emotions-list .emotion .emotion-inner:hover .emotion-title,
.emotions-list .emotion .emotion-inner.active .emotion-title{
  color: #f4c400;
}

.emotions-container .emotions-data .emotion-info p{
  padding: 0 0 15px;
}

.emotions-container .emotions-data .emotion-info p:last-child{
  padding: 0;
}

.abt-blks{
  display: flex;
  gap: 50px;
}

.abt-blks .abt-blk{
  flex: 1;
}

.emotions-container .emotions-list {
  max-width: 500px;
  margin: 0 auto;
  padding: 30px 0;
}

section.escape-sec .sec-cont {
  padding: 60px 0;
}

section.escape-sec.about .sec-cont {
  padding: 120px 0 60px;
}

section.escape-sec.hero .sec-cont {
  padding: 0;
}

.abt-blks .abt-blk.abt-img .abt-bg {
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.abt-blks .abt-blk.abt-img .abt-bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: linear-gradient(270deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.7) 55%, rgba(0,0,0,0.95) 100%);
}

.emotions-container .emotions-data .emotion-info{
  display: none;
}

.sec-title h2 {
  font-family: "Montserrat";
  font-weight: 300;
  font-size: 18px;
  line-height: 26px;
  color: #f4c400;
  position: relative;
  display: inline-block;
  padding: 0 0 5px;
}

.sec-title h2:after{
  content: "";
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(255,255,255,0.5);
}

.sec-title{
  padding: 0 0 10px;
}

.sec-subtitle{
  font-size: 26px;
  line-height: 34px;
}

footer.escapevilla-footer .footer-container{
  padding: 30px 0 20px;
}

footer.escapevilla-footer .sm-links ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

footer.escapevilla-footer .sm-links ul li{
  padding: 0 7px;
  display: inline-block;
  vertical-align: middle;
}

footer.escapevilla-footer .sm-links ul li:first-child{
  padding-left: 0;
}

footer.escapevilla-footer .sm-links ul li:last-child{
  padding-right: 0;
}

footer.escapevilla-footer .sm-links ul li a{
  width: 30px;
  height: 30px;
  display: flex;
  background-color: #fff;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  transition: all 300ms ease;
}

footer.escapevilla-footer .sm-links ul li a:hover{
  opacity: 0.7;
}

footer.escapevilla-footer .sm-links ul li a img{
  width: 60%;
  height: auto;
  display: block;
}

.contact-info-form-map,
.escape-testimonials,
.quests-container{
  padding: 40px 0 0;
}

.contact-info-form-map .contact-blks{
  display: flex;
  gap: 50px;
}

.contact-info-form-map .contact-blks .contact-blk.info-form{
  flex: 0.4;
}

.contact-info-form-map .contact-blks .contact-blk.map{
  flex: 0.6;
}

.contact-info-form-map .contact-blks .contact-blk.map .map-wrapper{
  width: 100%;
  height: 100%;
  opacity: 0.7;
}

.contact-info-form-map .contact-blks .contact-blk.map .map-wrapper iframe{
  display: block;
  border: none;
  width: 100%;
  height: 100%;
}

.contact-blk.info-form .cinf-blk{
  padding: 0 0 20px;
}

.contact-blk.info-form .cinf-blk.escape-form{
  padding: 20px 0 0;
}

.contact-blk.info-form .cinf-blk .cinf-blk-title{
  color: #ccc;
}

.contact-blk.info-form .cinf-blk .cinf-blk-links .cinf-link a{
  color: #fff;
  text-decoration: none;
}

.contact-blk.info-form .cinf-blk .cinf-blk-links .cinf-link a:hover{
  text-decoration: underline;
}

.contact-blk.info-form .cinf-blk.escape-form .escape-form-wrap{
  padding: 10px 0 0;
}

.escape-form .field-wrap span.wpcf7-form-control-wrap{
  display: block;
  position: relative;
  width: 100%;
  padding: 0 0 20px;
}

.escape-form .field-wrap span.wpcf7-form-control-wrap input,
.escape-form .field-wrap span.wpcf7-form-control-wrap textarea{
  background-color: #191a1c;
  border: none;
  width: 100%;
  height: 40px;
  padding: 0 10px;
  color: #fff;
  font-family: "Maven Pro", sans-serif;
  font-size: 15px;
  font-weight: 300;
  letter-spacing: 0.5px;
}

.escape-form .field-wrap span.wpcf7-form-control-wrap textarea{
  height: 120px;
  resize: none;
  padding: 10px;
}

.escape-form .field-wrap span.wpcf7-form-control-wrap .wpcf7-not-valid-tip {
  position: absolute;
  font-size: 11px;
  line-height: 13px;
  bottom: 5px;
  letter-spacing: 0.5px;
}

.wpcf7 form .wpcf7-response-output{
  margin: 0;
  padding: 10px 0 0;
  border: none;
  font-size: 14px;
  line-height: 22px;
}

.escape-form .submit-wrap .wpcf7-submit{
  font-family: "Montserrat";
  text-transform: uppercase;
  background-color: #f4c400;
  height: 50px;
  line-height: 50px;
  border: 1px solid #f4c400;
  display: inline-block;
  text-decoration: none;
  font-weight: 700;
  color: #fff;
  padding: 0 40px;
  cursor: pointer;
  letter-spacing: 2px;
  transition: all 300ms ease;
}

.escape-form .submit-wrap .wpcf7-submit:hover{
  background-color: transparent;
  color: #f4c400;
}

.testimonial-slide .testimonial-img{
  position: relative;
  width: 100%;
  height: auto;
  padding: 0 0 30px;
}

.testimonial-slide .testimonial-img img{
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  z-index: 1;
  aspect-ratio: 5/4;
  object-fit: cover;
}

.testimonial-slide .testimonial-img .test-emotion{
  width: 60px;
  height: 60px;
  position: absolute;
  bottom: 0;
  left: 20px;
  background-color: rgba(150,150,150,0.5);/*#f4c400;*/
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonial-slide .testimonial-img .test-emotion svg{
  width: 70%;
  height: auto;
  display: block;
}

.escape-testimonials .testimonial-slide{
  padding: 0 15px;
}

.testimonial-slide .testimonial-txts{
  padding: 20px 0 0;
}

.testimonial-slide .testimonial-txts .testimonial-title{
  font-weight: 600;
  font-size: 18px;
  line-height: 22px;
  padding: 0 0 15px;
}

.testimonial-slide .testimonial-txts .testimonial-desc{
  color: #ccc;
  font-style: italic;
  padding: 0 0 15px;
}

.testimonial-slide .testimonial-txts .testimonial-name-date .testimonial-date{
  color: #aaa;
}

.escape-testimonials .slick-dots{
  margin: 0;
  padding: 40px 0 0;
  list-style: none;
  width: 100%;
  text-align: center;
}

.escape-testimonials .slick-dots li{
  font-size: 0;
  line-height: 0;
  padding: 0 5px;
  display: inline-block;
  vertical-align: middle;
}

.escape-testimonials .slick-dots li button{
  background-color: transparent;
  border: 1px solid #f4c400;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  overflow: hidden;
  text-indent: -5000px;
  transition: all 300ms ease;
}

.escape-testimonials .slick-dots li.slick-active button{
  background-color: #f4c400;
}

.quests-container .quests-list {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}

.quests-container .quests-list .quest-card {
  flex: 0 0 calc(50% - 15px);
}

.quests-container .quests-list .quest-card .quest-img{
  position: relative;
  width: 100%;
  height: auto;
  z-index: 1;
}

.testimonial-slide .testimonial-img .testimonial-img-wrap{
  position: relative;
}

.testimonial-slide .testimonial-img .testimonial-img-wrap:after,
.quests-container .quests-list .quest-card .quest-img::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(270deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.5) 55%, rgba(0,0,0,0.7) 100%);
  z-index: 2;
}

.quests-container .quests-list .quest-card .quest-img img {
  width: 100%;
  height: auto;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  display: block;
}

.quests-container .quests-list .quest-card .quest-img-info{
  position: relative;
}

.quests-container .quests-list .quest-card .quest-info{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background-color: rgba(0,0,0,0.35);

  opacity: 0;
  transition: all 300ms ease;
}

.quests-container .quests-list .quest-card .quest-card-cont:hover .quest-info{
  opacity: 1;
}

.quests-container .quests-list .quest-card .quest-info .corner{
  width: 15%;
  padding-bottom: 15%;
  position: absolute;
}

.quests-container .quests-list .quest-card .quest-info .corner.corner1{
  left: 0;
  top: 0;
  border-top: 1px solid #f4c400;
  border-left: 1px solid #f4c400;
}

.quests-container .quests-list .quest-card .quest-info .corner.corner2{
  right: 0;
  top: 0;
  border-top: 1px solid #f4c400;
  border-right: 1px solid #f4c400;
}

.quests-container .quests-list .quest-card .quest-info .corner.corner3{
  left: 0;
  bottom: 0;
  border-bottom: 1px solid #f4c400;
  border-left: 1px solid #f4c400;
}

.quests-container .quests-list .quest-card .quest-info .corner.corner4{
  right: 0;
  bottom: 0;
  border-bottom: 1px solid #f4c400;
  border-right: 1px solid #f4c400;
}

.quests-container .quests-list .quest-card .quest-desc{
  padding: 25px 0 0;
  font-size: 15px;
  line-height: 22px;
  opacity: 0;
  transition: all 300ms ease;
}

.quests-container .quests-list .quest-card .quest-card-cont:hover .quest-desc{
  opacity: 1;
}

.quests-container .quests-list .quest-card .quest-title{
  position: absolute;
  bottom: 20px;
  left: 20px;
  font-size: 20px;
  text-transform: uppercase;
  font-family: "Montserrat";
  letter-spacing: 0.5px;
  font-weight: 600;
  color: #f4c400;
}

.quest-info-header .icn svg{
  width: 18px;
  height: auto;
  display: block;
}

.quest-info-header .icn svg path{
  fill: #f4c400;
}

.quest-info-header .qst-head-blk .complexity .icn svg{
  opacity: 0.4;
  display: inline-block;
  width: 14px;
}

.quest-info-header .qst-head-blk .complexity .icn svg.active{
  opacity: 1;
}

.quests-container .quests-list .quest-card .quest-info-header{
  padding: 15px;
}

.quest-card .quest-info-header .qst-head-blks .qst-head-blk.pl-time{
  display: flex;
  gap: 15px;
  align-items: center;
  flex-wrap: wrap;
}

.quest-card .quest-info-header .qst-head-blk .players,
.quest-card .quest-info-header .qst-head-blk .time,
.quest-card .quest-info-header .qst-head-blk .complexity{
  font-size: 0;
  flex: 0 0 calc(50% - 8px);
}

.quest-card .quest-info-header .qst-head-blk .complexity{
  text-align: right;
}

.quest-card .quest-info-header .qst-head-blk span{
  display: inline-block;
  vertical-align: middle;
  line-height: 0;
}

.quest-card .quest-info-header .qst-head-blk span.txt{
  font-size: 13px;
  line-height: 16px;
}

.quest-info-header .qst-head-blk .icn{
  padding: 0 5px 0 0;
}

.quest-info-header .qst-head-blk .complexity .icn{
  padding: 0 0 0 5px;
}