html {
  scroll-behavior: smooth;
}
.MyLPs {
  color: white;
  position: relative;
  line-height: 1.2;
  font-weight: 500;
  background-color: #e0e0e0;
  overflow: hidden;
  max-width: 1920px;
  width: 100%;
  margin: 0 auto;
  font-family: 'Proxima Nova', sans-serif !important;
}
.MyLPs img {
  width: auto;
  max-width: 100%;
}
.MyLPs .btnCommon {
  font-size: 18px;
  font-weight: 700;
  color: #2d2d40;
  background-color: white;
  border-radius: 5px;
  padding: 15px 10px;
  display: block;
  transition: all linear 0.2s;
  display: flex;
  justify-content: center;
  max-width: 300px;
  margin: 10px auto;
  -webkit-box-shadow: 5px 6px 12px 1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 5px 6px 12px 1px rgba(0, 0, 0, 0.15);
  box-shadow: 5px 6px 12px 1px rgba(0, 0, 0, 0.15);
}
.MyLPs .btnCommon span {
  align-self: center;
}
.MyLPs .btnCommon:hover {
  /*background-color: @blue;*/
}
.MyLPs .linkStretched {
  z-index: 5;
  overflow: hidden;
  display: block;
  position: absolute !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.MyLPs .f18 {
  font-size: 1.125rem;
  line-height: 1.2;
}
.MyLPs .f22 {
  font-size: 1.375rem;
  line-height: 1.2;
}
.MyLPs .f25 {
  font-size: 1.5625rem;
  line-height: 1.2;
}
.MyLPs .f30 {
  font-size: 1.875rem;
  line-height: 1.2;
}
.MyLPs .f32 {
  font-size: 2rem;
  line-height: 1.2;
}
.MyLPs .f40 {
  font-size: 2.5rem;
  line-height: 1.2;
}
.MyLPs .f50 {
  font-size: 3.125rem;
  line-height: 1.2;
}
.header {
  display: flex;
  justify-content: center;
  /*background:white;*/
}
.header .banner {
  background: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/header_banner.jpg') center center no-repeat;
  background-size: cover;
  width: 100%;
}
.triliza {
  flex-shrink: 0;
  width: 641px;
  background-color: #ddbd8e;
}
.triliza ul {
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}
.triliza ul li {
  width: 33.3%;
  aspect-ratio: 1;
  border-bottom: solid thin #f3d8b0;
  border-right: solid thin #f3d8b0;
  position: relative;
  overflow: hidden;
}
.triliza ul li span {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.triliza ul li span:last-child {
  /*display: none;*/
}
.triliza ul li img {
  width: auto !important;
  max-width: unset !important;
}
.triliza ul li:nth-child(3),
.triliza ul li:nth-child(6),
.triliza ul li:nth-child(9) {
  border-right: none !important;
}
.triliza ul li:nth-child(7),
.triliza ul li:nth-child(8),
.triliza ul li:nth-child(9) {
  border-bottom: none;
}
.triliza ul li:first-child span:last-child {
  top: -100%;
  animation: triliza1 infinite cubic-bezier(0.125, 0.68, 0.405, 1.25) 5s;
}
.triliza ul li:nth-child(8) span:last-child {
  top: -100%;
  animation: triliza1 infinite cubic-bezier(0.125, 0.68, 0.405, 1.25) 5s;
  animation-delay: 1s;
}
.triliza ul li:nth-child(2) span:last-child {
  top: -100%;
  animation: triliza2 5s infinite ease;
  animation-delay: 1s;
}
.triliza ul li:nth-child(6) span:last-child {
  top: -100%;
  animation: triliza2 5s infinite ease;
  animation-delay: 4s !important;
}
.triliza ul li:nth-child(3) span:last-child {
  left: -100%;
  animation: triliza3 5s infinite ease ;
  animation-delay: 1s;
}
.triliza ul li:nth-child(7) span:last-child {
  left: -100%;
  animation: triliza3 infinite ease 5s;
  animation-delay: 2s;
}
.triliza ul li:nth-child(4) span:last-child {
  left: 150%;
  animation: triliza4 infinite ease 5s 3s;
}
.triliza ul li:nth-child(5) span:last-child {
  top: 150%;
  animation: triliza5 infinite ease 5s 4s;
}
.triliza ul li:nth-child(9) span:last-child {
  top: 150%;
  animation: triliza5 infinite ease 5s;
  animation-delay: 2s;
}
@keyframes triliza1 {
  0% {
    top: -100%;
  }
  40% {
    top: 50%;
  }
  70% {
    top: 50%;
  }
  100% {
    top: 150%;
  }
}
@keyframes triliza2 {
  0% {
    top: -100%;
  }
  40% {
    top: 50%;
  }
  70% {
    top: 50%;
  }
  100% {
    top: 150%;
  }
}
@keyframes triliza3 {
  0% {
    left: -100%;
  }
  40% {
    left: 50%;
  }
  70% {
    left: 50%;
  }
  100% {
    left: 150%;
  }
}
@keyframes triliza4 {
  0% {
    left: 150%;
  }
  40% {
    left: 50%;
  }
  70% {
    left: 50%;
  }
  100% {
    left: -100%;
  }
}
@keyframes triliza5 {
  0% {
    top: 150%;
  }
  40% {
    top: 50%;
  }
  70% {
    top: 50%;
  }
  100% {
    top: -150%;
  }
}
.section2 {
  background-color: #3f4eab;
  padding-block: 2.3em;
}
.breakfast {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/breakfast-poster.jpg');
}
.kathariotita {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/kathariotita-poster.jpg');
}
.atmosphera {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/atmosphera-poster.jpg');
}
.tech {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/tech-poster.jpg');
}
.carousels-wrap {
  padding-block: 2em;
  display: flex;
  background-size: auto;
  background-position: left bottom;
  background-repeat: no-repeat;
  padding-block: 3em;
  overflow: hidden;
  margin-bottom: 2rem;
}
.carousels-wrap h2 {
  margin-block: 0;
  font-weight: 800;
}
.category-title {
  flex: 0 0 450px;
  text-align: center;
}
.carousel-container {
  width: calc(100% - 450px);
  margin-left: 2%;
  display: flex;
  align-items: center;
  margin-block: 3rem 1rem;
}
.carousel-container .owl-carousel .owl-nav {
  width: fit-content;
  position: absolute;
  right: 3rem;
  bottom: -11px;
}
.carousel-container .owl-carousel .owl-nav button {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  background: #ffc539 url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/arrow.png') center center no-repeat !important;
  background-size: auto;
  opacity: 1 !important;
}
.carousel-container .owl-carousel .owl-nav button span {
  display: none;
}
.carousel-container .owl-carousel .owl-nav button.owl-prev {
  transform: rotate(-180deg);
}
.carousel-container .owl-carousel .owl-nav button.disabled {
  background: #decbaf url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/arrow.png') center center no-repeat !important;
}
.carousel-container .owl-carousel .owl-dots {
  width: fit-content;
  margin-top: 3rem !important;
}
.carousel-container .owl-carousel .owl-dots .owl-dot span {
  width: 20px;
  height: 20px;
  background-color: #dcd8d8;
}
.carousel-container .owl-carousel .owl-dots .owl-dot.active span {
  background-color: #ffc439;
}
.carousel-container .owl-carousel .item {
  height: 100%;
  width: 210px;
}
.product-wrap {
  background-color: #3f4eab;
  display: block;
  text-align: center;
  color: white;
  font-size: 1.25rem;
  border-radius: 10px;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s;
}
.product-wrap .poster {
  background-color: white;
  border-radius: 10px;
  /*padding: 1em;*/
  display: block;
  overflow: hidden;
}
.product-wrap .poster img {
  margin: 0 auto;
  transition: transform 0.2s;
}
.product-wrap .title {
  display: block;
  flex: 1 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-block: 0.4em 0.5em;
  padding-inline: 0.5em;
}
.product-wrap:hover {
  transform: scale(0.95);
}
.outdoors {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/outdoor-poster.jpg');
}
.garden {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/garden-poster.jpg');
}
.kathariotita2 {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/kathariotita2-poster.jpg');
}
.vertical_categories {
  background-color: #8dbdd1;
  background-position: center 60%;
  background-repeat: no-repeat;
  background-size: 85%;
  padding-block: 2rem;
  height: 100%;
}
.vertical_categories h2 {
  text-align: center;
  margin-block: 0;
  height: 120px;
}
.ver_prod_container {
  margin-top: 8rem;
}
.pr_frontida {
  background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/pr_frontida-poster.jpg');
  background-position: left bottom;
}
.call-center {
  margin-bottom: 2rem;
  background: #c4c2ec url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/call-center-poster.png') center center no-repeat;
  background-size: auto;
  padding-block: 2rem;
  padding-inline: 1rem;
}
.call-center .f22 span {
  font-weight: 700;
  background-image: linear-gradient(to right, #d6d4f4 0%, #d6d4f4 100%);
  background-repeat: repeat-x;
  background-position: 0 100%;
  background-size: 100% 12px;
}
.call-center-left {
  text-align: center;
}
.call-center-left a {
  margin: 0 auto 1rem auto;
}
.collapsible-box-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.collapsible-box-trigger {
  background-color: white;
  font-size: 1.375rem;
  text-align: center;
  position: relative;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: solid thin #e0e0e0;
  cursor: pointer;
  display: none;
}
.collapsible-box-trigger .poster {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.collapsible-box-trigger span {
  position: relative;
}
.collapsible-box-trigger span::before {
  content: '';
  position: absolute;
  right: -35px;
  top: 55%;
  height: 20px;
  width: 20px;
  background: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/arrow.png') center center no-repeat;
  background-size: 100%;
  transform: translateY(-50%) rotate(90deg);
  transition: transform 0.2s;
}
.collapsible-box-trigger.active span::before {
  transform: translateY(-50%) rotate(-90deg);
}
.collapsible-box {
  display: grid;
  grid-template-rows: 1fr;
  transition: grid-template-rows 0.4s ease-out;
  background-color: white;
  /*height: calc(~"100% - 70px");*/
  height: 100%;
}
.collapsible-box.active {
  grid-template-rows: 1fr;
}
.collapsible-box .content {
  overflow: hidden;
  text-align: center;
  margin-inline: 1rem;
}
.collapsible-box .content img {
  margin: 0 auto;
}
@media (min-width: 1440px) {
  .fixed_container {
    flex-basis: 1440px !important;
    max-width: 1440px !important;
  }
}
@media (max-width: 1360px) {
  .triliza {
    width: 450px;
  }
  .triliza li span {
    width: 100% !important;
    max-width: 100% !important;
  }
  .triliza li span img {
    width: inherit !important;
    max-width: inherit !important;
  }
}
@media (max-width: 1200px) {
  .ver_prod_container {
    margin-top: 5rem;
  }
  .call-center-left a {
    font-size: 1.875rem !important;
  }
  .call-center-left .f20 {
    font-size: 1.125rem !important;
  }
  .call-center-right .f22 {
    font-size: 1.125rem !important;
  }
}
@media (max-width: 991px) {
  .triliza {
    width: 350px;
  }
  .carousels-wrap {
    display: block;
    background-image: none;
    padding-block: 2em;
  }
  .category-title {
    flex: 0 0 450px;
    text-align: left;
    padding-inline: 2rem;
  }
  .carousel-container {
    width: 100%;
    margin-left: 0;
    margin-block: 1rem;
  }
  .carousel-container .owl-stage-outer {
    padding-left: 2em;
  }
  .carousel-container .owl-dots {
    margin-left: 2em;
  }
  .ver_prod_container {
    padding-inline: 1rem;
  }
  .call-center-left a {
    font-size: 1.5625rem !important;
  }
  .call-center-left a img {
    width: 27px;
  }
  .collapsible-box .content {
    margin-inline: 1rem;
  }
}
@media (max-width: 768px) {
  .MyLPs .f30 {
    font-size: 1.5625rem;
  }
  .MyLPs .f22 {
    font-size: 1.125rem;
  }
  .header {
    display: block;
  }
  .header .banner {
    background: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/header_banner-m.jpg') center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 70vw;
  }
  .product-wrap {
    font-size: 1.125rem;
  }
  .carousels-wrap h2 {
    font-size: 2rem !important;
  }
  .outdoors,
  .garden,
  .kathariotita2 {
    background-image: none;
  }
  .ver_prod_container {
    margin-top: 1.2rem;
  }
  .vertical_categories {
    background-size: 100%;
  }
  .vertical_categories h2 {
    height: auto;
    font-size: 2rem !important;
  }
  .pr_frontida {
    background-size: 70%;
  }
  .call-center {
    background: #c4c2ec url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/call-center-poster-m.jpg') left bottom no-repeat;
    background-size: auto;
  }
  .call-center-left {
    order: 2;
    margin-top: 1rem;
    text-align: right;
  }
  .call-center-left a {
    margin-right: 0;
  }
  .call-center-right {
    text-align: right;
  }
  .collapsible-box-wrapper {
    margin-bottom: 2rem;
  }
  .collapsible-box-wrapper .DesktopPoster {
    display: none;
  }
  .collapsible-box-trigger {
    display: flex;
  }
  .collapsible-box {
    grid-template-rows: 0fr;
    height: unset;
  }
  .collapsible-box.active {
    grid-template-rows: 1fr;
  }
}
@media (max-width: 576px) {
  .carousel-container .owl-carousel .owl-dots {
    margin-top: 1.5rem !important;
  }
  .carousel-container .owl-carousel .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
  }
  .carousel-container .owl-carousel .owl-nav {
    bottom: unset;
    top: -70px;
    right: 0.8rem;
  }
  .carousel-container .owl-carousel .owl-nav button,
  .carousel-container .owl-carousel .owl-nav button.disabled {
    height: 35px;
    width: 35px;
    background-size: 18px !important;
  }
  .product-wrap .poster {
    text-align: center;
  }
  .product-wrap .poster img {
    width: 180px;
    margin: 0 auto;
  }
  .vertical_categories h2 {
    text-align: left;
    padding-inline: 2rem;
  }
  .pr_frontida {
    background-image: url('https://support3.you.gr/you/redesign/landing_pages/touristikos-eksoplismos/pr_frontida-poster-m.jpg');
    background-size: 48%;
    background-position: right bottom;
  }
  .call-center {
    padding-block: 2rem 20%;
  }
  .call-center-left a {
    font-size: 1.125rem !important;
  }
  .call-center-left a img {
    width: 18px;
  }
  .call-center-left .f20 {
    font-size: 0.8rem !important;
  }
  .collapsible-box-wrapper {
    margin-bottom: 1.2rem;
  }
  .collapsible-box-trigger {
    height: 50px;
    font-size: 1.125rem;
  }
  .collapsible-box-trigger .poster {
    width: 70px;
  }
}
@media (max-width: 400px) {
  .pr_frontida {
    background-size: 60%;
  }
}