/* ovveride default */

body {
    font-family: 'CeraGreek-Regular', Verdana, Arial, Helvetica, sans-serif;
}

.nav-tabs {
    border-bottom: none;
}
#wrapper {
    z-index: 100;
}
#header_desktop {
  position: fixed;
  left:0px;
  width:100%;
  z-index:9999;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
#header_desktop.headerNoSticky{
    position:relative;
    background: linear-gradient(to right,   #8C3CFA 0%, #8C3CFA 60%, #00E09D 100%);
}
#header_desktop.headerNoSticky.isFixed{
     position: fixed;
}
#header_desktop.isFixed{
    background: #fff !important;
    border-bottom:1px solid #e6e6e6;
}

.metaforika-header-div {
    height: 40px;
    background-color: #E6E6E6;
}

.logo-wrapper .logo {
    max-width: 270px;
}

.eshop_oroi a{
    color:#fff !important;
}

.metaforika-wrapper {
    color: #333333;
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 1px;
    position: relative;
}

.metaforika-mobile-header-div .metaforika-wrapper {
    letter-spacing: normal;
}

img.shipping-truck {
    width: 44px;
    margin-right: 5px;
}

.top-icons {
    position: absolute;
    right: 50px;
}

.top_item {
    float: left;
    margin-right: 20px;
    position: relative;
    color: #333333;
}

.top_item:last-child {
    margin-right: 0;
}

.top_item a {
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    align-self: center;
    align-content: center;
    color: #333333;
}

.mobile-header-div .top_item a {
    font-size: 23px;
}

.top_item a span.font-icons {
    font-size: 20px;
}

/* .main-header {
    border-bottom: 1px solid #ccc;
} */

.search {
    position: relative;
    width: 100%;
    height: 45px;
    max-width: 550px;
    border: 1px solid #cccccc;
    border-radius: 5px;
    z-index: 16;
    color: #666;
}

.search_in {
    position: relative;
    z-index: 5;
}

.search_left {
    display: table-cell;
    width: 100%;
}

.search_left_in {
    padding-left: 15px;
    padding-right: 20px;
}

.search_left input[type="text"] {
    background: none;
    border: none;
    /* font-family: "CeraGreek-Regular", Arial, Helvetica, sans-serif; */
    /* font-style: italic; */
    font-size: 16px;
    font-weight: normal;
    color: black;
    height: 45px;
    line-height: 45px;
    margin: 0;
    outline: medium none;
    padding: 0;
    width: 100%;
    border-bottom: 1px solid #fff;
    letter-spacing: normal;
}

.search_right {
    display: table-cell;
    position: relative;
    white-space: nowrap;
    vertical-align: middle;
    width: 1%;
}

.search_right button {
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0;
    height: 45px;
    padding-left: 20px;
    padding-right: 15px;
    font-size: 22px;
}

.top_item.basket_btn_h {
    border-left: 1px solid #cccccc;
    padding: 7px 15px;
    padding-left: 35px;
}

.telephone-wrapper {
    font-size: 24px;
    margin-right: 35px;
}

.telephone-wrapper a {
    color: #333333;
}

div.num-pieces-text {
    position: absolute;
    left: 47px;
    top: 5px;
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
}

span.num_pieces {
    position: absolute;
    left: 0;
    right: 0;
}

.cart-details {
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-size: 15px;
}

.cart-text-total {
    font-size: 24px;
}

.cart-text {
    letter-spacing: 0.8px;
}

.slideshow .owl-dots {
    text-align: center;
    margin-top: 20px;
}

.slideshow .owl-dots .owl-dot span {
    border: 1px solid #cccccc;
    background: #cccccc;
    border-radius: 20px;
    display: block;
    height: 12px;
    margin: 5px 7px;
    /* opacity: 0.5; */
    width: 12px;
}

.slideshow .owl-dots .owl-dot.active span {
    border: 1px solid #999999;
    background: #999999;
    height: 14px;
    width: 14px;
}


/* css hack for companies carousel only. */

.owl_slider_companies.owl-carousel .owl-nav.disabled {
    display: block !important;
}

.owl_slider_companies.owl-carousel .owl-nav .owl-prev {
    position: absolute;
    top: 40%;
    left: 0;
    margin-left: -20px;
    font-size: 20px;
}

.owl_slider_companies.owl-carousel .owl-nav .owl-next {
    position: absolute;
    top: 40%;
    right: 0;
    margin-right: -20px;
    font-size: 20px;
}

.banner_img {
    display: flex;
    justify-content: center;
    align-items: center;
}


/* menu */

.menu_out {
    position: relative;
    z-index: 15;
}

nav.menu ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

nav.menu ul li {
    /* flex-grow: 1; */
    margin: 0;
}


/* nav.menu ul li {
    border-right: 1px solid #c6c5c6;
}

nav.menu ul li:first-child {
    border-left: 1px solid #c6c5c6;
} */

nav.menu ul li a {
    padding: 0px;
    font-family: 'Syne-Regular';
    font-size : 17px;
    letter-spacing : 0.34px;
    color : #FFFFFF;
    position:relative;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

nav.menu ul li a.menu_link{
    cursor: pointer;
}

nav.menu ul li a.menu_link::before{
    content:'';
    position:absolute;
    background: currentColor; 
    width:0%;
    height:1px;
    left:0px;
    top:100%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
nav.menu ul li a.menu_link:hover::before,
nav.menu ul li a.menu_link.active::before{
     width:100%;
}
#header_desktop.isFixed nav.menu ul li a{
    color :#242833; 
}

nav.menu ul li{
    margin-right:35px;
}

nav.menu ul li span.fal{
    font-size: 12px;
    margin-left:10px;
}

nav.menu ul li:last-child{
    margin-right:0px;
}

/* nav.menu ul li:hover>a {
    background: #a40b2a;
    color: #fff;
} */

.menu_column_container {
    /* width:100%;
   
    column-count: 5;
    column-gap: 3%;
    column-width: 20%; */
    width: 100%;
    column-count: 4;
    column-gap: 30px;
    column-width: 25%;
}

.sub_menu_item_title {
    margin-bottom: 5px;
}

.sub_menu_item_title a {
    display: block;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 13px;
    font-weight: 700;
    color: #a40b2a;
    letter-spacing: 0.2px;
    text-align: left !important;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.sub_menu_item_title:hover>a {
    color: #000 !important;
}

.sub_menu_data_item {
    margin-bottom: 5px;
}

.sub_menu_data_item:last-child {
    margin-bottom: 0;
}

.sub_menu_data_item a {
    display: block;
    padding: 0 !important;
    margin: 0 !important;
    font-style: normal;
    font-size: 13px;
    font-weight: normal;
    color: #333333;
    letter-spacing: 0.2px;
    text-align: left !important;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.sub_menu_data_item:hover>a {
    color: #a40b2a !important;
}

.main_content_out {
    position: relative;
    z-index: 11;
}

.menu_wrapper_bg {
    display: none;
    position: fixed;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 15;
}

.menu_connection_bottom{
    position:Absolute;
    width:100%;
    height:40px;
    background:transparent;
    top:100%;
    left:0px;
}

.menu_item_bottom {
    display: none;
    position: absolute;
    z-index: -1;
    width: 100%;
    max-width:1140px;
    top:58px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    box-shadow: 0px 3px 2px 1px rgba(0,0,0,0.1);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.menu_item_bottom.type_1{
    padding:50px 0px;
}

.menu_item_bottom.type_1 .container .row .col-lg-6:first-child{
    border-right: 1px solid rgba(0,0,0,0.05);
}

.menu_item_bottom .containerIn{
    max-width:380px;
    padding-left:15%;
}

.menu_item_bottom .firtSubTitle{
  font-family: 'Syne-Bold';
  font-size : 17px;
  margin-bottom:15px;
  letter-spacing : 0.34px;
  color : #8C3CFA;
}

.menu_item_bottom .firtSubText{
  font-family: 'Syne-Regular';
  font-size : 14px;
  letter-spacing : 0.28px;
  color : #242833;
}

.menu_item_bottom  .firstSubMenu{
   margin-top:50px;
}

.menu_item_bottom .firstSubMenu .firstSubMenuItem .title{
  font-family: 'Syne-Medium';
  font-size : 17px;
  letter-spacing : 0.28px;
  color : #242833;
}
.menu_item_bottom  .firstSubMenu .firstSubMenuItem .text{
    font-family: 'Syne-Regular';
    font-size : 14px;
    color : #565a66;
}

.menu_item_bottom .firstSubMenu a .firstSubMenuItem{
    margin-bottom:45px;
}

.menu_item_bottom .firstSubMenu a:last-child .firstSubMenuItemd{
    margin-bottom:5px;
}

.menu_item_bottom .menu_in_col {
    padding-left: 30px;
    padding-right: 30px;
}

.menu_item_bottom .menu_in_col:nth-child(4n+1) {
    clear: both;
}

.menu_item_bottom_in_in {
    padding: 15px;
    padding-top: 22px;
    /*padding-bottom:100px;*/
}

.menu_column_container div {
    display: inline-block;
    width: 100%;
}

.sub_menu_item {
    margin-bottom: 20px;
}

.menu_img img {
    border-radius: 5px;
}

.menu_img a {
    display: block;
    padding: 0 !important;
}


/* end menu */

.logIn{
    margin-right:15px;
}

.logIn a{
  font-family: 'Syne-Regular';
  font-size : 17px;
  letter-spacing : 0.34px;
  color : #FFFFFF !important;
  text-decoration: underline !important;
}

.isFixed .logIn a{
    color : #242833 !important;
}

.restIcons{
    margin-top: 30px;
    padding: 0px 38px;
}

.restIcons .logIn a{

     color : #000 !important;
}

.reqDemo{
   margin-right:18px;
}

.reqDemo button{
    outline:none;
    border:none;
    width:180px;
    height:45px;
    display:flex;
    align-items: center;
    justify-content: center;
    border-radius:30px;
    background:#fff;
    font-family: 'Syne-SemiBold';
    font-size : 15px;
    letter-spacing : 0.15px;
    color : #8C3CFA;
    box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.05);
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.page_products .reqDemo button{
    color : #00d998;
}

.reqDemo button.isFixed, .isFixed .reqDemo button{
    color:#fff;
    background:#8C3CFA;
}

.page_products .reqDemo button.isFixed,
.page_products .isFixed .reqDemo button{
    background:#00d998;
}

#header_mobile .reqDemo button{
    background : #8C3CFA;
    color : #fff;
    width:120px;
    height:35px;
    font-family: 'Syne-Regular';
    font-size : 12px;
}

.page_products #header_mobile .reqDemo button{
    background : #00d998;
}

.resp-1400-menu .reqDemo{
    position: fixed;
    top:30px;
    right:0px;
    z-index:9999;
}

.language_item{
    width:37px;
    height:37px;
    display:flex;
    align-items: center;
    justify-content: center;
    border:2px solid #fff;
    border-radius:50%;
}

.isFixed .language_item{
    border:2px solid #242833;
}

.restIcons .language_item{
    height:30px;
    width:fit-content;
    padding:0px 20px 0px 10px;
    background: #f2f2f2;
    border:none;
    margin-top:20px;
    border-radius:30px;
    margin-left:-5px;
}

.restIcons .language_item img{
   width:15px;
   height:15px;
   object-fit: cover;
   border-radius:50%;
   margin-right:10px;
}

.language_item a{
    font-family: 'Syne-Regular';
    font-size : 13px;
    color : #FFFFFF !important;
}

.isFixed .language_item a{
    color : #242833 !important;
}

.restIcons .language_item a{
     color : #000 !important;
     display: flex;
}


section.rest-icons{
    width:293px;
}


section.menu_out{
    width:calc(100% - 543px);
    padding-right:5%;
}

section.menu_out.hideSection{
    width:calc(100% - 250px);
}

.newsletter-section {
    background-color: #242833;
    padding:100px 0px 80px 0px;
}

.newsletter_title h3 {
    /* font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif; */
    font-family: 'Syne-Medium';
    font-size : 48px;
    color: #fff;
}

.newsletter_area{
    width:100%;
    max-width: 580px;
}
/* .newsletter_item {
    padding-left: 13px;
    padding-right: 13px;
    background: #ffffff;
    border: 1px solid transparent;
    margin-bottom: 10px;
} */

.newsletter_item{
    width:calc(100% - 210px);
}

.newsletter_item input[type="text"] {
    width: 100%;
    max-width:327px;
    height: 62px;
    margin: 0;
    padding: 0;
    border: 1px solid #fff;
    background: none;
    outline: none;
    padding:0px 25px;
    font-family: 'Syne-Regular';
    font-size : 18px;
    line-height : 41.02px;
    letter-spacing : 0.18px;
    color : #FFFFFF;
    border-radius:30px;
    text-align: left;
}

.newsletter_item input[type="text"]::placeholder {
    color : #FFFFFF;
}

.newsletter_submit {
   width:195px;
   height:62px;
   border-radius:30px;
   background: #8C3CFA !important;
   display:flex;
   align-items: center;
   justify-content: center;
   font-family: 'Syne-Regular';
   font-size : 18px;
   letter-spacing : 0.18px;
   color : #FFFFFF;
   cursor: pointer;
}

.newsletter_submit[disabled="disabled"]{
    opacity:0.5;
}
.newsletter_submit .submitEffeButton{
    margin-left:25px;
    position:relative;
    width:35px;
    height:16px;
    border:2px solid #fff;
    border-radius:20px;
}

.newsletter_submit .submitEffeButton::before{
    content: '';
    width:8px;
    height:8px;
    border-radius:50%;
    background: #fff;
    position:Absolute;
    top:50%;
    transform: translateY(-50%);
    left:3px;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.newsletter_submit.active .submitEffeButton::before{
    left:calc(100% - 10px);
}


.custom-icons-1 {
    background-color: #333333;
}

.custom-icon-phone {
    font-size: 35px;
}

.custom-title {
    color: white;
    font-size: 21px;
    letter-spacing: 1px;
}

.custom-phone-title {
    color: white;
    font-size: 30px;
    letter-spacing: 1px;
}

.custom-phone-title a {
    color: white;
}

.custom-subtitle {
    color: white;
    font-size: 15px;
    letter-spacing: 1px;
    background-color: #333;
}

#bottom_out {
    padding-top:0px;
    padding-bottom: 50px;
    margin-top:-1px;
    /* background: #f3f3f3; */
}

#footer {
    /* background: #f3f3f3; */
    padding-top: 20px;
    /* padding-bottom: 20px; */
}

#footer a {
    color: #333;
}

.bottom_item h3 {
    font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 20px;
    color: #333;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

.footer-hours-in>div {
    color: #333;
}

.footer-hours-in {
    font-size: 17px;
    color: #333;
    letter-spacing: normal;
}

.social_item {
    /* float: left; */
    margin-right: 20px;
    font-size: 25px;
    color: #333;
    background: #F2F2F2;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bottom_item ul li a {
    display: block;
    margin-bottom: 4px;
    font-size: 17px;
    font-weight: normal;
    color: #333;
    letter-spacing: 0.5px;
}

.footer-copyright {
    background-color: #242833;
    color: #9499A8;
    font-family: 'Syne-Regular';
    font-size:14px;
    position: relative;
}

.footer-copyright::before {
    content:'';
    width:calc(100% - 30px);
    height:1px;
    background: rgba(255,255,255,0.1);
    position:absolute;
    left:15px;
    top:-25px;
}

#footer_right a {
    color: #9499A8;
}


.product_item_text h3 {
    font-weight: normal;
    font-size: 17px;
    color: #4D4D4D;
    line-height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

.product_item_text h4 {
    font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #b3b3b3;
    letter-spacing: 0.7px;
}

.product_item_prices {
    display: table;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 25px;
    color: #333333;
    margin-bottom: 5px;
}

.products_price_old {
    float: left;
    position: relative;
    font-family: 'CeraGreek-Regular', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 21px;
    color: #999999;
    margin-right: 15px;
    /* text-decoration: line-through; */
    margin-top: 2px;
}

.products_price_new {
    float: left;
    color: #333333;
}

.strikediag {
    background: linear-gradient(to left top, transparent 47.75%, #333 49.5%, #333 50.5%, transparent 52.25%);
    text-decoration: none;
}

.product_item_image {
    position: relative;
    overflow: hidden;
    border-radius: 7px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.product_item_offer,
.product_item_new,
.product_item_best {
    /* background: url(/images/design/offer.png) top left no-repeat; */
    width: 48px;
    height: 48px;
    border-radius: 50px;
    background: #FFD1D1;
    text-align: center;
}

.product_item_new {
    background: #333333;
}

.product_item_offer_in,
.product_item_new_in,
.product_item_best_in {
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 14px;
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    height: inherit;
}

.product_item_best_in {
    font-size: 11px;
}

.product_item_new_in {
    color: #FFD1D1;
}

.color_box_in {    
    width: 32px;
    height: 32px;
}

.pro_area .pr_item {
    padding-left: 10px;
    padding-right: 10px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    /* to flex dimiourgei provlima otan px exw megalo titlo k den kovetai apo to ellipsis*/
    /* display: flex;
    justify-content: center; */
}

.product_item_favorite {
    float: left;
    cursor: pointer;
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
}

.product_item_favorite span.far.fa-heart {
    color: #ccc;
}

.product_item_favorite span.fas.fa-heart {
    color: #FFD1D1;
}

.product_item_cart {
    float: left;
    cursor: pointer;
    position: absolute;
    bottom: 15px;
    right: 20px;
    z-index: 2;
    font-size: 22px;
    color: #333;
}

.product_item_cart a {
    color: #fff;
}

.col.footer-cols {
    border-top: 1px solid #ccc;
    padding-top: 15px;
}

.col.footer-cols:last-child {
    border-bottom: 1px solid #ccc;
}

.accordion-footer-content {
    display: none;
}

.title_b {
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-size: 25px;
    font-weight: normal;
    color: #333;
    letter-spacing: 0.8px;
    text-align: center;
    padding-left: 15px;
    padding-right: 15px;
}

/* ==========================================================================
   Εναρμονιση τυπογραφιας: τιτλος του default banner (kind=33 κ.α.)

   ΤΟ ΠΡΟΒΛΗΜΑ: το .title_b ηταν το μονο title banner σε CeraGreek-Medium 25px,
   οταν ολα τα υπολοιπα ειναι Syne-Bold 52px (.cardsBanner .title,
   .banner_img_text .title, .slider-container .title). Φαινοταν σαν να ανηκει
   σε αλλο site - και με το effe ενεργο η διαφορα γινοταν ακομα πιο εντονη.

   ΓΙΑΤΙ ΕΙΝΑΙ SCOPED ΣΕ .banner_title_area ΚΑΙ ΟΧΙ ΣΚΕΤΟ .title_b:
   το .title_b το χρησιμοποιουν ΚΑΙ τα homepage_tabs (banners_alt.php:1348),
   που ειναι εξω απο το banner_title_area και οριζουν μεγεθος μονο κατω απο
   600px. Αν αλλαζαμε το βασικο .title_b, τα tabs θα γινονταν 52px Syne-Bold
   σε καθε οθονη πανω απο 600px.

   Το .banner_out.pricing_faqs .title_b (0,3,0) εχει μεγαλυτερη
   προτεραιοτητα απο αυτο εδω (0,2,0), οποτε τα FAQ μενουν στα 42px.

   ΠΡΟΣΟΧΗ ΣΤΗ ΘΕΣΗ: ο κανονας ειναι ΕΠΙΤΗΔΕΣ εδω, αμεσως μετα το βασικο
   .title_b, και οχι στο τελος του αρχειου. Το .customers-carousel-white
   .title_b (18px, κεφαλαια) εχει ΙΔΙΑ specificity - αν ημασταν πιο κατω θα
   το κερδιζαμε και τα λογοτυπα του pricing θα γινονταν 52px.
   ========================================================================== */

.banner_title_area .title_b {
    font-family: 'Syne-Bold', Arial, Helvetica, sans-serif;
    font-size: 52px;
    color: #242833;
    /* Το βασικο .title_b ειχε letter-spacing 0.8px (απο την εποχη του
       CeraGreek 25px). Ο τιτλος αναφορας (.cardsBanner .title) δεν εχει
       κανενα, οποτε το μηδενιζουμε για να ταιριαξει ακριβως. */
    letter-spacing: normal;
}

/* ΚΡΙΣΙΜΟ: με effe, το ορατο κειμενο ειναι το <span class="title play-color">
   μεσα στο h3 - οχι το ιδιο το h3. Το css/global-style.css:705 οριζει
   ".title { font-size:32px }" και ενας ΑΜΕΣΟΣ κανονας κερδιζει ΠΑΝΤΑ την
   κληρονομικοτητα, οση specificity κι αν εχει ο κανονας του γονεα. Γι' αυτο ο
   τιτλος εβγαινε 32px ενω το h3 ηταν 52px. Στο kind=25 δεν συμβαινει, γιατι
   εκει το .cardsBanner.banner_out .title (0,3,0) κερδιζει το .title (0,1,0). */
.banner_title_area .title_b .title {
    font-family: 'Syne-Bold', Arial, Helvetica, sans-serif;
    font-size: 52px;
}

/* Το css/global-style.css:5756 δινει ".banner_title_area_out { height:53px }" -
   καρφωτο υψος, φτιαγμενο για μονη σειρα 25px. Με τιτλο 52px (ποσο μαλλον σε
   δυο σειρες) + υποτιτλο, το περιεχομενο ξεπερναει κατα πολυ τα 53px και
   ξεχυνεται ΕΞΩ απο το background του banner, πανω στην επομενη ενοτητα.

   Ιδιο μοτιβο με το υπαρχον ".partner-badges .banner_title_area_out{height:unset}".
   Εξαιρουμε ρητα τις δυο περιπτωσεις που εχουν δικα τους μικροτερα μεγεθη και
   χωρανε ηδη στα 53px, για να μην αλλαξει το spacing τους. */
.banner_out:not(.customers-carousel-white):not(.pricing_faqs) .banner_title_area_out {
    height: unset;
    padding: 30px 0;
}

.title_b span {
    border-bottom: 2px solid #333;
    padding-bottom: 4px;
}

.homepage_tabs_top {
    max-width: 500px;
}

.homepage_tabs li a:not(.active) .title_b span {
    border-bottom: none;
}

.homepage_tabs li a:not(.active) h3 {
    color: #545454;
}

.pink-cirle {
    border-radius: 20px;
    background: #FFD1D1;
    width: 20px;
    height: 20px;
    top: -10px;
    right: -10px;
    font-size: 13px;
}

.no_products_image {
    max-width: 200px;
}


/* mobile_menu */

.responsive-menu-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0.7;
    background: black;
    z-index: 1500;
}

#mobile_menu_btn,
#close_mobile_menu,
#close_filter_resp {
    cursor: pointer;
}

/* .right_side_menu_opened #wrapper {
    left: 260px;
} */

#close_mobile_menu,
#close_filter_resp {
    font-size: 23px;
}

nav#mobile_menu, nav#mobile_menu_1400 {
    background-color: #fff;
    height: 100%;
    border-right: 1px solid rgba(0,0,0,0.1);
    overflow: hidden;
    /* padding-top: 25px; */
    padding-bottom: 25px;
    position: fixed;
    top: 67px;
    left: -100%;
    width: 100%;
    z-index: 999;
    -webkit-transition: left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -moz-transition: left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -o-transition: left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -ms-transition: left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    transition: left 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    /* visibility: hidden; */
}

.resp-1400-menu nav#mobile_menu_1400{
    left:0px;
    top: 0;
    max-width:260px;
}

.resp-1400-menu #mobile_menu_in{
    padding-top:0px !important;
}

.right_side_menu_opened nav#mobile_menu  {
    left: 0px;
}

nav#mobile_menu .menu_item_m .sub_menu_item_m {
    border-bottom: 1px solid #cdcdce;
    margin-left: 20px;
}


/* nav#mobile_menu .menu_item_m:last-child {
    margin-bottom: 0;
} */

nav#mobile_menu .menu_item_title_m,  nav#mobile_menu_1400 .menu_item_title_m{
    position: relative;
    cursor: pointer;
}

nav#mobile_menu .menu_item_title_m a, nav#mobile_menu_1400 .menu_item_title_m a {
    display: block;
    font-family: 'Syne-Regular';
    font-size: 17px;
    font-weight: normal;
    color: #000;
    letter-spacing: 0.34px;
    cursor: pointer;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

/* nav#mobile_menu .menu_item_title_m:hover>a {
    background: #a40b2a;
    color: #fff;
} */

nav#mobile_menu .menu_item_data_m {
    display: none;
}

nav#mobile_menu .sub_menu_item_m {
    margin-bottom: 5px;
    cursor: pointer;
}

nav#mobile_menu .sub_menu_item_m:last-child {
    margin-bottom: 0;
}

nav#mobile_menu .sub_menu_item_title_m a {
    display: block;
    font-size: 15px;
    font-weight: normal;
    color: #808080;
    letter-spacing: 0.6px;
    cursor: pointer;
    /* padding-left: 20px; */
    padding-right: 10px;
    padding-top: 13px;
    padding-bottom: 13px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}


/* nav#mobile_menu .sub_menu_item_title_m:hover a {
    color: #a40b2a;
} */

nav#mobile_menu .sub_menu_item_data_m {
    display: none;
}

nav#mobile_menu .sub_menu_item_title_m.active a,
nav#mobile_menu .sub_sub_menu_item_title_m.active a,
nav#mobile_menu .sub_sub_sub_menu_item_title_m.active a {
    color: #333333;
}

nav#mobile_menu .sub_sub_menu_item_m {
    margin-bottom: 5px;
    cursor: pointer;
}

nav#mobile_menu .sub_sub_menu_item_m:last-child {
    margin-bottom: 0;
}

nav#mobile_menu .sub_sub_menu_item_title_m a {
    display: block;
    font-size: 13px;
    font-weight: normal;
    color: #808080;
    letter-spacing: 0.6px;
    cursor: pointer;
    padding-left: 20px;
    padding-right: 10px;
    padding-top: 8px;
    padding-bottom: 8px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}


/* nav#mobile_menu .sub_sub_menu_item_title_m:hover a {
    color: #a40b2a;
} */

nav#mobile_menu .sub_sub_menu_item_data_m {
    display: none;
}

nav#mobile_menu .sub_sub_sub_menu_item_m {
    margin-bottom: 5px;
    cursor: pointer;
}

nav#mobile_menu .sub_sub_sub_menu_item_m:last-child {
    margin-bottom: 0;
}

nav#mobile_menu .sub_sub_sub_menu_item_title_m a {
    display: block;
    font-size: 13px;
    font-weight: normal;
    color: #808080;
    letter-spacing: 0.6px;
    cursor: pointer;
    padding-left: 30px;
    padding-right: 10px;
    padding-top: 8px;
    padding-bottom: 8px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}


/* nav#mobile_menu .sub_sub_sub_menu_item_title_m:hover a {
    color: #a40b2a;
} */

.width-6px {
    width: 6px;
}

.mobile-static-rest-links {
    background-color: #F6F6F6;
}

nav#mobile_menu .mobile-static-rest-links .menu_item_title_m a {
    font-size: 15px;
}

.mobile-static-rest-icons {
    width: 20px;
}


/* end mobile_menu */


/* TOASTS */

div.toast.favorite-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 15000;
    display: none;
}


/* END TOASTS */

.title_path h2 {
    color: #808080;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0.4px;
}

.title_path a {
    color: #808080;
}

.title_path a:last-child {
    color: #333;
}

.search_select2 {
    position: relative;
    z-index: 101;
    cursor: pointer;
    /* background: url(/images/design/select_arrow.png) center right no-repeat; */
    margin-left: 5px;
    margin-right: 10px;
    text-align: center;
    color: #333;
}

.search_select_in2,
.search_select_in2_title_left {
    height: 25px;
    line-height: 28px;
    width: 110px;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0.9px;
    display: inline;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
}

.search_select2::after {
    /* background:url(/images/design/select_arrow.png) center right no-repeat; */
    font-family: Font Awesome\ 5 Pro;
    content: '\f107';
    margin-left: 10px;
}

.select_options2 {
    display: none;
    position: absolute;
    z-index: 102;
    min-width: 150px;
    max-height: 300px;
    overflow: auto;
    border: 1px solid #000;
    background: #fff;
}

.option_item2 a {
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 12px;
    font-weight: normal;
    color: #333;
    letter-spacing: 0.9px;
}

.option_item2 a:hover {
    background: #333;
    color: #fff;
}

#filter_basic {
    margin-left: 25px;
    margin-top: 10px;
    margin-right: 25px;
}

.filter_text_prices {
    font-family: "CeraGreek-Light", Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #000000;
}

.filter_categories_item_title a {
    display: block;
    font-size: 17px;
    font-weight: normal;
    color: #000;
    letter-spacing: 0.6px;
    cursor: pointer;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.sub_filter_categories_item_title a {
    display: block;
    font-size: 15px;
    font-weight: normal;
    color: #000;
    letter-spacing: 0.6px;
    cursor: pointer;
    padding-left: 20px;
    padding-right: 10px;
    padding-top: 13px;
    padding-bottom: 13px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.sub_filter_categories_item_title:hover a {
    color: #333;
    /* background:url(/images/design/f_arrow.png) left center no-repeat; */
    /* padding-left: 10px; */
}

.sub_filter_categories_item.active .sub_filter_categories_item_title a {
    color: #333;
    /* background:url(/images/design/f_arrow.png) left center no-repeat; */
    /* padding-left: 10px; */
}

.sub_sub_filter_categories_item_title a {
    display: block;
    font-size: 14px;
    font-weight: normal;
    color: #808080;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 30px;
    padding-right: 20px;
}

.sub_sub_filter_categories_item_title:hover a {
    color: #333;
}

.sub_sub_filter_categories_item.active .sub_sub_filter_categories_item_title a {
    color: #333;
}

.sub_sub_sub_filter_categories_item_title a {
    display: block;
    font-size: 13px;
    font-weight: normal;
    color: #808080;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 40px;
    padding-right: 20px;
}

.sub_sub_sub_filter_categories_item_title:hover a {
    color: #333;
}

.sub_sub_sub_filter_categories_item_title.active a {
    color: #333;
}

.sub_filter_categories_item {
    border-bottom: 1px solid #cdcdce;
}

.filter_area_item_title {
    position: relative;
    font-weight: normal;
    font-size: 20px;
    color: #333;
    padding-top: 5px;
    padding-bottom: 15px;
    letter-spacing: 0.5px;
    cursor: pointer;
    margin-bottom: 15px;
    border-bottom: 1px solid black;
}

.filter_checkbox_item label {
    font-size: 16px;
    color: #333;
    cursor: pointer;
    margin: 0;
    display: inline-block;
}

.filter_area_item_area .filter_item_data a {
    display: block;
    font-size: 12px;
    font-weight: 900;
    color: #333;
    text-transform: uppercase;
    padding-left: 5px;
    padding-right: 5px;
}

.filter_checkbox_item input[type="checkbox"]+label span {
    float: left;
    /* background: url(/images/design/checkbox.png) top left no-repeat; */
    cursor: pointer;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: 0;
    color: #808080;
}


/* .filter_checkbox_item input[type="checkbox"]:checked+label span {
    background-position: bottom left;
} */

.filter_checkbox_item input[type="checkbox"]+label span:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f0c8';
}

.circle-font .filter_checkbox_item input[type="checkbox"]+label span:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f111';
}

.filter_checkbox_item input[type="checkbox"]:checked+label span:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f14a';
}

.circle-font .filter_checkbox_item input[type="checkbox"]:checked+label span:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f111';
    color: #FFD1D1;
    font-weight: bold;
}

.refresh_price a {
    display: block;
    background: #fff;
    border: 1px solid #8c8c8c;
    font-size: 12px;
    font-weight: normal;
    color: #8c8c8c;
    letter-spacing: 1.5px;
    padding: 8px;
}

.refresh_price a:hover {
    background: #FFD1D1;
    color: #fff;
}

.filter_area_categories {
    position: relative;
    background: #fff;
}


/* .filter_area_item_title span.slide_filter {
    background: url(/images/design/slide_filter.png) top left no-repeat;
    cursor: pointer;
    float: right;
    height: 10px;
    margin-left: 7px;
    width: 13px;
    margin-top: 4px;
}
.filter_area_item_title span.slide_filter.active {
    background-position: left bottom;
} */


/* .filter_area_item_title span.slide_filter:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f106';
}

.filter_area_item_title span.slide_filter.active:after {
    font-family: Font Awesome\ 5 Pro;
    content: '\f107';
} */

.filters-resp-bar {
    background: #FFD1D1;
    height: 50px;
    font-size: 13px;
    letter-spacing: 1px;
    color: #333;
}

.show-filters-resp {
    border-right: 1px solid white;
}

.filters-resp-bar .select_box2 {
    background: none;
}

.filter_responsive {
    position: absolute;
    display: none;
    left: 0;
    top: 45px;
    left: -300px;
    z-index: 1550;
    background: white;
}

.filter_responsive_left {
    float: left;
    position: relative;
    z-index: 1;
    width: 300px;
    /*padding:10px;
	background:#fff;*/
    background: #fff;
    /* -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5); */
    height: 100vh;
    overflow-y: scroll !important;
}

.filter_responsive_right {
    float: left;
    position: relative;
    z-index: 2;
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-top: 10px;
    background: #000;
    cursor: pointer;
}

.filter_responsive_right_in {
    width: 14px;
    height: 13px;
    background: url(/images/design/slider_filter.png) no-repeat;
    background-position: top left;
}

.filter_responsive_right_in.active {
    background-position: bottom left;
}

.filter_responsive .filter_area_prices {
    width: 260px;
}

#owl_product_quick,
.owl_product_r .item {
    position: relative;
    overflow: hidden;
    margin: 10px;
    border-radius: 7px;
    box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
}

.photo_small {
    margin-top: 3px;
    margin-bottom: 3px;
    /*text-align:center;
	height:80px; */
    cursor: pointer;
    /* background:#fff;
	border-radius:8px;*/
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
}

a.zoom_id.mag-glass {
    position: absolute;
    bottom: 15px;
    right: 15px;
    color: #E6E6E6;
    font-size: 25px;
}

.product_social {
    margin-top: 10px;
    font-size: 13px;
    font-weight: normal;
    color: #333;
    letter-spacing: 1.3px;
    line-height: 37px;
    display: flex;
    justify-content: start;
    align-items: center;
}

.social_item_s {
    float: left;
    margin-right: 10px;
}

.social_item_s:not(.share-button) {
    border: 1px solid #333;
    border-radius: 20px;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.social_item_s a {
    display: block;
    color: #333;
    font-size: 16px;
}

.product_item_icons {
    /* position: absolute; */
    right: 7px;
    top: 10px;
    z-index: 3;
}

.product_item_icons_item {
    /* display: table; */
    /* margin: 0 auto; */
    margin-bottom: 25px;
    margin-right: 8px;
}

.product_item_icons_item:last-child {
    /* margin-bottom: 0; */
    margin-right: 0;
}

.product_item_image_in .product_item_icons {
    position: absolute;
}

.product_item_image_in .product_item_icons_item {
    margin-bottom: 8px;
    margin-right: 0;
}

.product {
    text-align: left;
}

.product_title div.brand {
    font-size: 15px;
    font-weight: normal;
    font-family: "CeraGreek-Bold", Arial, Helvetica, sans-serif;
    /* font-style: italic; */
    color: #4D4D4D;
    letter-spacing: 1px;
    margin-bottom: 8px;
}

.product_title h1 {
    font-size: 18px;
    font-weight: normal;
    color: #4D4D4D;
    letter-spacing: 0.8px;
    margin-bottom: 25px;
}

.product_title h2 {
    /* font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif; */
    font-size: 12px;
    font-weight: normal;
    color: #000;
    letter-spacing: 1px;
    margin-bottom: 10px;
}

.product_price {
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 29px;
    color: #333;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-wrap: wrap;
}

.product_price .products_price_old {
    float: left;
    position: relative;
    font-weight: normal;
    font-size: 22px;
    color: #999999;
    margin-right: 25px;
    /* text-decoration: line-through; */
    margin-top: 0;
}

.product_price .products_price_new {
    float: left;
    font-size: 27px;
    color: #333;
}

.product_feautures .div_table,
.product_buttons {
    display: flex;
    /* justify-content: center; */
    align-items: center;
}

.basket_btn {
    float: left;
    background: #333;
    padding-left: 15px;
    padding-right: 15px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    border-radius: 4px;
}

.basket_btn a {
    display: block;
    background: url(/images/design/cart_add.svg) left center no-repeat;
    font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 18px;
    color: #fff !important;
    letter-spacing: 3px;
    padding-left: 45px;
    padding-right: 20px;
    padding-top: 13px;
    padding-bottom: 13px;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}


/* .basket_btn:hover {
    background: #a40b2a;
} */

.product_favorite {
    float: left;
    cursor: pointer;
    font-size: 30px;
    margin-left: 25px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}


/* .product_favorite_in {
    padding: 17px;
    border: 1px solid #ccc;
} */

.product_favorite:hover span {
    color: #FFD1D1;
}

.product_favorite:hover span::before {
    content: '\f004';
}

#product_quantity {
    float: left;
    max-width: 120px;
    border: 1px solid #ccc;
    /* border-radius:15px; */
    /* display: table;
    margin: 0 auto; */
}

.goto_basket {
    float: left;
    background: #f5afaf;
    border-radius: 4px;
    padding-left: 20px;
    padding-right: 20px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.goto_basket a {
    display: block;
    font-family: 'CeraGreek-Bold', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 18px;
    color: #fff;
    letter-spacing: 3px;
    padding-top: 13px;
    padding-bottom: 13px;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.goto_basket:hover {
    background: #333;
}

div.avail {
    margin-top: 30px;
    font-size: 12px;
    color: #333333;
}

div.avail.get-now {
    color: #235D0E;
}

.product_tabs {
    /* max-width: 500px; */
    margin: 0 auto;
    margin-top: 20px;
}

#product_tabs_top {
    position: relative;
    background: #F7F7F7;
    /* border-left: 1px solid #d4d4d4;
    border-right: 1px solid #d4d4d4;
    border-top: 1px solid #d4d4d4; */
}

#product_tabs_bottom {
    font-size: 15px;
    letter-spacing: 0.1px;
    line-height: 18px;
    /* border-left: 1px solid #d4d4d4;
    border-right: 1px solid #d4d4d4;
    border-bottom: 1px solid #d4d4d4; */
    height: 165px;
    overflow-y: auto;
}

#product_tabs_top .nav-tabs {
    display: flex;
    justify-content: space-around;
}

#product_tabs_top .nav-tabs>li>a {
    color: #4D4D4D;
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-size: 18px;
}

#product_tabs_top .nav-tabs>li {
    margin-bottom: 0;
    flex: auto;
    text-align: center;
}

#product_tabs_top .nav-tabs>li>a.active,
#product_tabs_top .nav-tabs>li>a.active:hover,
#product_tabs_top .nav-tabs>li>a.active:focus {
    /* color: #000000; */
    border: 1px solid transparent;
    background-color: #F7F7F7;
    border-bottom: 3px solid #FFD1D1;
}

#product_tabs_top .nav>li>a:hover,
#product_tabs_top .nav>li>a:focus {
    background-color: #F7F7F7;
}

#product_tabs_top .nav-tabs>li>a:hover {
    border-color: #F7F7F7;
    border-bottom: 3px solid #FFD1D1;
}

#product_tabs_bottom_in {
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: justify;
    font-size: 16px;
    color: #4D4D4D;
}

.p_features {
    max-width: 750px;
}

.tabs_item_title {
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #333333;
    letter-spacing: 1px;
    padding: 20px;
    /*border-bottom:1px solid #bfbfbf;*/
    background-color: #F7F7F7;
    cursor: pointer;
}

.tabs_item_title.active {
    background-color: #FFD1D1;
}

label[for="search-text-r"],
label[for="news_email"],
label[for="search-text"] {
    display: none;
}

.custom-icons-1>div>div>div>div>div {
    background-color: #333333;
}

.basket-text,
.search-text {
    color: #b3b3b3;
    font-family: "CeraGreek-Regular", Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: normal;
    margin-right: 5px;
    letter-spacing: 1px;
}

ul.my_pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    padding: 0;
    margin: 0;
}

ul.my_pagination>li {
    list-style: none;
    margin-right: 15px;
    border-bottom: 4px solid transparent;
}

ul.my_pagination>li:last-child {
    margin-right: 0;
}

ul.my_pagination>li>a {
    color: #D1D3D4;
}

ul.my_pagination>li:hover>a {
    color: #333;
}

ul.my_pagination>li.active {
    border-bottom: 4px solid #FFD1D1;
}

ul.my_pagination>li.active>a {
    color: #333;
}


/* Newsletter popup exit intent*/

div.beforeyougo {
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-size: 35px;
    color: #fff;
    margin-top: 30px;
}

div.minxaseteekpt {
    font-family: "CeraGreek-Regular", Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #fff;
    margin-top: 30px;
}

div.discount-per-cent-popup {
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-size: 70px;
    color: #fff;
}

div.after-discount-per-cent-popup {
    font-family: "CeraGreek-Regular", Arial, Helvetica, sans-serif;
    font-size: 20px;
    color: #fff;
    font-weight: normal;
}

div.newsletter_area_exit_intent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    margin-top: 25px;
    align-self: center;
}

div.newsletter_area_exit_intent .newsletter_item {
    width: 60%;
    margin-bottom: 0;
}

.newsletter_submit_exit_intent {
    background: #4e4949;
    font-family: "CeraGreek-Medium", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 13px;
    letter-spacing: 3px;
    width: 40%;
    height: 38px;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    margin-left: 10px;
}

.newsletter_submit_exit_intent:hover {
    background: #1a1a1a;
}

.newsletter_results_exit_intent {
    background: #fff;
    margin-top: 8px;
}

div.exit-modal {
    float: right;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
}

#megethologio .modal-body img {
    height: auto !important;
    max-width: 100%;
    margin: 0 auto;
    display: table;
}

.fb-plugin-followers {
    margin-top: 20px;
    max-width: 250px;
}

.x_y_pr_list {
    position: absolute;
    width: 100%;
    height: 44px;
    text-align: center;
    z-index: 9998;
    bottom: 0;
    left: 0;
    padding: 0;
    background: rgb(240, 124, 174, 0.8);   
    font-family: 'CeraGreek-Medium', Arial, Helvetica, sans-serif;
    font-size: 18px;
    color: white;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.x_y_pr_list span {
    font-size: 38px;
}

.product_item:hover .x_y_pr_list {
    opacity: 0;
}

.basic_col_l {
    max-width: 400px;
    width: 100%;
}

.slider_item{
    position:relative;
    height:100vh;
    min-height:800px;
    background-size: cover;
    background-repeat: no-repeat;
}

.page_blog-list .slider_item{
    height:100vh !important;
    min-height:800px !important;
}

.slider-container{
    width:calc(100% - 220px);
    margin:0 auto;
    padding-top:80px;
    height:calc(100%);
}

.slider-container .general-infos, .slider-container .video-gif-player{
    width:50%;
    padding:0px 15px;
}

.slider-container .general-infos{
    /*max-width:550px;*/
    max-width:750px;
}

.slider-container .video-gif-player{
    display: flex;
    justify-content: end;
}

.slider-container .video-gif-player video{
    width:100%;
    max-width:500px;
    margin-right:50px;
}

.slider-container .title{
    font-family: 'Syne-Bold';
    font-size: 56px;
    color:#fff;
    margin-bottom:20px;
    opacity:0;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.slider-container .title.view{
    opacity:1;
}

.slider-container .subtitle{
  font-family: 'Syne-SemiBold';
  font-size : 24px;
  line-height : 35.71px;
  letter-spacing : 0.96px;
  color : #00F2A1;
  margin-bottom:20px;
   opacity:0;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.slider-container .subtitle.view{
    opacity:1;
}

.slider-container .text{
  font-family: 'Syne-Regular';
  font-size : 20px;
  line-height : 31px;
  color : #FFFFFF;
   opacity:0;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.slider-container .general-infos .buttons{
    margin-top:100px;
}


.slider-container .text.view{
    opacity:1;
}

.slider-container .buttonsLink button{
    outline:none;
    border:1px solid #fff;
    padding:0px 35px;
    height:62px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    font-family: 'Syne-SemiBold';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #FFFFFF;
    margin-right:25px;
    border-radius: 30px;
    opacity:0;
    
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.slider-container .buttonsLink.view button{
    opacity:1;
}

.slider-container .buttonsLink:hover button{
     background: #fff;
      color : #8C3CFA;
}

.slider-container button i{
    margin-left:15px;
}

.first-slider-loader{
   position:absolute;
   width:100%;
   heighT:100%;
   top:0px;
   left:0px;
   /* Ημιδιαφανο: το background του slide (μωβ) ΠΡΕΠΕΙ να φαινεται απο πισω
      οσο τρεχει το loader. Ο συγχρονισμος γινεται στο περιεχομενο, οχι εδω. */
   background: rgba(255,255,255,0.3);
   z-index:999;
}

.first-slider-loader-in{
    width:100%;
    height:100%;
    display:flex;
    align-items: center;
    justify-content: center;
}

.first-slider-loader-in img{
    width:35px !important;
}

.customers-carousel.banner_out.b_img{
    margin-bottom:0px; 
}

.banner_out.customers-carousel-white{
    padding-top:50px;
}

.banner_out.customers-carousel-white.partner-badges{
    padding:80px 15px 50px 15px;
    border-top:1px solid #e6e6e6;
}

.partner-badges .banner_title_area_out {
    height:unset;
}

.customers-carousel.banner_out .main_box_area {
     /* --bg-opacity: 0.5;
    background: rgba(36, 40, 51, var(--bg-opacity)); */
    /* background: rgb(36, 40, 51); */
    padding:0px;
    margin-left: -15px;
    margin-right: -15px;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}


.photo_slider_item{
    width:100%;
    max-width:115px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.photo_slider_item img{
    width:100%;
}
/* ΤΟ ΒΑΣΙΚΟ ΚΕΝΟ ΤΩΝ BANNER (desktop).
   Ολες οι παραλλαγες του cardsBanner κραταν το ΙΔΙΟ padding, ωστε δυο banner
   με ιδια δομη τιτλου να μη διαφερουν οπτικα. Παλιοτερα καθε παραλλαγη ειχε
   δικο της νουμερο (integration 130, featured 125, analytics/customer 130/110,
   bannerCardsStyle2 140/130) - διαφορες που δεν εξυπηρετουσαν κατι, απλα
   εκαναν το ενα banner να "καθεται" αλλιως απο το διπλανο του.
   Στα <=1200 γινονται ολα 80px και στα <=768 50px (02-general-responsive.css),
   εκει ηταν ηδη ενιαια. */
.cardsBanner.banner_out{
  padding:140px 0px;
  margin-bottom:0px;
}

/* Εξαιρεση με λογο: το featuresSubItem ειναι συνεχεια του banner απο πανω του,
   οποτε δεν θελει δικο του κενο στην κορυφη. */
.cardsBanner.banner_out.featuresSubItem {
    padding:0px 0px 130px 0px;
}

.cardsBanner.bannerCardsStyle2.banner_out{
    padding:140px 0px;
}

.cardsBanner.banner_out .title-area{
  margin-bottom:100px;
}

.cardsBanner.banner_out.pricing_faqs .title-area{
  margin-bottom:70px;
}

.cardsBanner.banner_out .title-area.withText{
  margin-bottom:50px;
}

.signupFormBanner .title-area{
    padding-top:0px !important;
}


.cardsBanner.banner_out.analytics .title-area{
  margin-bottom:0px;
}

.cardsBanner.banner_out .cardsContainer{
    margin-bottom:80px;
}

.cardsContainer.bannerCardsStyle4.container-fluid{
    max-width:1600px;
}

.cardsBanner.banner_out.customer .title-area{
    margin-bottom:20px;
}

/* Ιδιο padding με ολα τα υπολοιπα cardsBanner (ηταν 130/110).
   Το εσωτερικο τους κενο τιτλου-περιεχομενου μενει διαφορετικο (title-area
   margin-bottom 0/20 πιο κατω) - εκει ο τιτλος καθεται διπλα στο κειμενο, δεν
   ειναι η ιδια δομη με τα banner με καρτες. */
.cardsBanner.analytics.banner_out, .cardsBanner.customer.banner_out{
    padding: 140px 0px;
}

.cardsBanner.customer.banner_out{
  margin-bottom:0px;
}

.cardsBanner.customer.banner_out.featuresSubItem{
    background:#FFF;
}

.cardsBanner.textImg.banner_out .title-area{
    height:auto;
}

.cardsBanner.bannerCardsStyle2.banner_out .title-area{
    background-size: cover;
    background-repeat: no-repeat;
    /*filter: grayscale(100%);*/
    transition: filter 0.3s ease-out;
    margin-bottom:0px;

    /* Ηταν "height:533px" (σταθερο). Δυο προβληματα: το κουτι δεν μεγαλωνε
       οταν ο υποτιτλος πηγαινε σε 3 σειρες, και οι καρτες - που ανεβαινουν με
       αρνητικο margin - εμπαιναν ΜΕΣΑ στην περιοχη του κειμενου. Ετσι το
       κειμενο κρυβοταν απο κατω τους.

       Τωρα:
       - min-height αντι για height: το κουτι μεγαλωνει οσο χρειαζεται, αντι
         να κρυβει οτι δεν χωραει.
       - 573px (αντι 533): λιγο περισσοτερος χωρος, ωστε το κεντραρισμενο
         περιεχομενο να μενει αρκετα πανω απο τις καρτες.

       Το .cardsContainer κραταει το αρχικο -140px, αρα οι καρτες ξεκινανε στα
       433px ενω το κειμενο τελειωνει γυρω στα 330 - η επικαλυψη με το
       background του banner διατηρειται, χωρις να αγγιζει το κειμενο.

       ΠΡΟΣΟΧΗ: απο 769px και πανω αυτο το min-height ισχυει πλεον ΜΟΝΟ οταν το
       banner εχει φωτογραφια φοντο (.hasPhotoBack). Χωρις φωτογραφια το υψος
       το οριζει το κειμενο - βλ. τον κανονα ":not(.hasPhotoBack)" πιο κατω. */
    box-sizing: border-box;
    min-height: 573px;
}

.cardsBanner.bannerCardsStyle2.banner_out .title-area-in{
    margin-top:-50px;
}

/* --------------------------------------------------------------------------
   "Μικρος υποτιτλος" σε ΚΙΝΗΤΟ (κλαση shortSubTitle απο το banners.php, οταν
   το sub_title_gr/en δεν πιανει δευτερη σειρα).

   Το min-height στα <=768 (313px, 02-general-responsive.css) ειναι
   υπολογισμενο για τιτλο 2 σειρων + υποτιτλο 2 σειρων. Με λιγοτερο κειμενο το
   align-items:center μοιραζει το περισσευμα πανω και κατω, και οι καρτες
   ανεβαινουν σταθερα (-90px) οποτε δεν το απορροφουν - ετσι εμενε μεγαλο κενο
   πριν τις καρτες.

   Εδω δεν ριχνουμε απλα το min-height, το βγαζουμε τελειως: το υψος το οριζει
   το κειμενο και το μονο σταθερο ειναι το padding-bottom.
   120 - 90 (το margin-top των καρτων στο ιδιο breakpoint) = 30px ορατο κενο,
   ιδιο παντα, με 1 ή με 3 σειρες τιτλου.

   ΜΟΝΟ σε κινητο. Σε desktop το κενο μενει οπως ηταν - εκει το θελουμε αερατο.
   -------------------------------------------------------------------------- */

@media (max-width: 768px) {

    .cardsBanner.bannerCardsStyle2.shortSubTitle.banner_out .title-area {
        min-height: 0;
        padding-bottom: 120px;
    }

    /* Το -50px παραπανω υπαρχει για να "ανεβαζει" το κειμενο μεσα στο σταθερο
       κουτι των 313px. Χωρις min-height δεν εχει τι να ανεβασει: τρωει τα 50px
       padding-top του ιδιου του section και ο τιτλος κολλαει στην κορυφη.
       Το μηδενιζουμε, ωστε το κενο απο πανω να μεινει οσο και στα υπολοιπα
       banner (το padding-top του section). */
    .cardsBanner.bannerCardsStyle2.shortSubTitle.banner_out .title-area-in {
        margin-top: 0;
    }
}

/* --------------------------------------------------------------------------
   bannerCardsStyle2 ΧΩΡΙΣ φωτογραφια φοντο (κλαση hasPhotoBack απο το
   banners.php - μπαινει μονο οταν το πεδιο photoBack εχει τιμη).

   Το min-height:573 πιο πανω ειναι φτιαγμενο για τη ΧΕΙΡΟΤΕΡΗ περιπτωση:
   τιτλος 3 σειρων + υποτιτλος 2 σειρων, ωστε οι καρτες (margin-top:-140px) να
   μην ακουμπησουν το κειμενο. Επειδη ομως το .title-area κεντραρει καθετα
   (align-items:center), οσο λιγοτερο κειμενο υπαρχει τοσο μεγαλωνει το κενο:
   με τιτλο μιας σειρας + υποτιτλο περισσευουν ~470px που μοιραζονται πανω και
   κατω (~187px πριν τον τιτλο, ~147px μεχρι τις καρτες). Μικροτερο σταθερο
   νουμερο ΔΕΝ ειναι λυση - θα ξαναεφερνε τις καρτες πανω στο κειμενο στα
   banner με πολλες σειρες.

   Οποτε εδω το υψος το οριζει το κειμενο και το μονο σταθερο ειναι το
   padding-bottom. Ιδιο κενο με 1 ή με 3 σειρες τιτλου, και καμια πιθανοτητα
   επικαλυψης.

   Οπου ΥΠΑΡΧΕΙ φωτογραφια, το ψηλο κουτι μενει - εκει το υψος ειναι το εφε,
   οχι κενος χωρος.

   ΤΟ ΝΟΥΜΕΡΟ: το ορατο κενο τιτλου-περιεχομενου ειναι ΤΟ ΙΔΙΟ με ολα τα αλλα
   banner, δηλαδη οσο το ".cardsBanner.banner_out .title-area{margin-bottom}":
   100px σε desktop, 30px σε κινητο. Επειδη οι καρτες ανεβαινουν, το βαζουμε
   σαν padding-bottom μαζι με την επικαλυψη:
     desktop  240 = 140 (margin-top καρτων) + 100
     <=768    120 =  90 (margin-top καρτων) +  30
   Αν αλλαξει καποια μερα το margin-bottom των υπολοιπων banner, αυτα τα δυο
   νουμερα ειναι που πρεπει να ακολουθησουν.
   -------------------------------------------------------------------------- */

.cardsBanner.bannerCardsStyle2.banner_out:not(.hasPhotoBack) .title-area {
    min-height: 0;
    padding-bottom: 240px;
}

/* Το -50px υπαρχει για να "ανεβαζει" το κειμενο μεσα στο σταθερο κουτι.
   Χωρις κουτι δεν εχει τι να ανεβασει - θα εκοβε το padding-top του section
   και ο τιτλος θα κολλαγε στην κορυφη. */
.cardsBanner.bannerCardsStyle2.banner_out:not(.hasPhotoBack) .title-area-in {
    margin-top: 0;
}

@media (max-width: 768px) {

    .cardsBanner.bannerCardsStyle2.banner_out:not(.hasPhotoBack) .title-area {
        padding-bottom: 120px;
    }
}

/* Το "pt-lg-0" ειναι bootstrap utility που μπαινει χειροκινητα στο class_name
   (banner id 86) και μηδενιζει το padding-top του section - ειχε νοημα οσο το
   κουτι των 573px εδινε μονο του αφθονο κενο πανω απο τον τιτλο. Τωρα που το
   υψος το οριζει το κειμενο, ο τιτλος θα κολλαγε στην κορυφη, οποτε το κενο το
   ξαναδινουμε εδω. Ιδιο breakpoint με το ιδιο το pt-lg-0 (>=992px). */
@media (min-width: 992px) {

    .cardsBanner.bannerCardsStyle2.banner_out:not(.hasPhotoBack).pt-lg-0 .title-area {
        padding-top: 140px;
    }
}

.cardsBanner.bannerCardsStyle2.banner_out .cardsContainer{
    /* Μενει στο αρχικο -140: οι καρτες επικαλυπτουν ακριβως το padding-bottom
       του .title-area, δηλαδη κενο χωρο. Αν το διπλασιαζαμε, θα ξαναεμπαιναν
       μεσα στο κειμενο. */
    margin-top:-140px;
}


.cardsBanner.textImg.banner_out .title-area-in {
    position: unset;
    top:unset;
}

.cardsBanner.banner_out .title{
    font-family: 'Syne-Bold';
    font-size: 52px;
    color:#242833;
}

.cardsBanner.banner_out.key_integrations .title,
.cardsBanner.banner_out.integration_overview .title,
.cardsBanner.banner_out.roiCalc .title{
      font-size : 42px;
}

.cardsBanner.banner_out .title.play-color{
    position:relative;
    width:fit-content;
    background: #dedede;
    padding:0px;
    border:none;
    color:transparent;
    overflow: hidden;
    margin:0 auto;
}

.cardsBanner.banner_out.featuresSubItem .title{
      font-size: 42px;
}

.cardsBanner.banner_out .title.play-color.customer,
.cardsBanner.banner_out.integration  .title.play-color{
    background: #fff;
}

.cardsBanner.customer.banner_out .title{
    font-size: 54px;
}

.cardsBanner.textImg.banner_out .title.play-color{
   margin-left:0px;
}

/* .cardsBanner.customer.banner_out .title.play-color{
    width:300px;
} */

.cardsBanner.banner_out.featuresSubItem  .textDescription{
      font-family: 'Syne-Regular';
      font-size : 20px;
      line-height : 31px;
      color : #242833;
      max-width:550px;
}

.cardsBanner.banner_out.featuresSubItem  .textDescription strong{
    font-family: 'Syne-Bold';
    font-size : 24px;
    line-height : 32px;
    color : #242833;
}

.cardsBanner.banner_out .title.bannerCardsStyle2{
    position:relative;
    width:fit-content;
    font-family: 'Syne-Bold';
    font-size: 52px;
    padding:0px;
    color:#fff;
    overflow: hidden;
    margin:0 auto;
}

.cardsBanner.banner_out .title.play-color .colored-back, 
.cardsBanner.banner_out .title.play-color .colored-back.integration,
.cardsBanner.banner_out .subtitle.play-color .colored-back.subtitleSameAnim{
     position:Absolute;
     top:0px;
     left:-100%;
     width:100%;
     height:100%;
     z-index:999;
}

.core_value_pillars.integration.banner_out {
    background:#F2F2F2;
}

.cardsBanner.banner_out .title.play-color svg.cutout{
   position:Absolute;
   top:50%;
   left:50%;
   transform: translate(-50%,-50%);
   width:calc(100% + 4px);
   height:calc(100% + 4px);
   z-index:99999;
}

/* .cardsBanner.banner_out .title.play-color svg text{
    font-family: 'Syne-Bold';
    font-size: 52px;
}

.cardsBanner.customer.banner_out .title.play-color svg text{
    font-family: 'Syne-Bold';
    font-size: 54px;
} */

.banner_out.title-link{
    padding:100px 0px;
}

.banner_out.title-link .title-area{
  font-family: 'Syne-Medium';
  font-size : 48px;
  color : #242833;
  margin-bottom:60px;
}
.banner_out.title-link.pricing .title-area {
    font-family: 'Syne-Bold';
    font-size : 56px;
    color : #8C3CFA;
    margin-bottom: 40px;
}
.banner_out.title-link .title-area.has-subTitle{
    margin-bottom:40px;
}

.banner_out.title-link .subtitle-area{
  font-family: 'Syne-Regular';
  font-size : 26px;
  margin:0 auto;
  margin-bottom:40px;
  color : #242833;
  max-width:767px;
  padding:0px 15px;
}

.banner_out.title-link.pricing .subtitle-area{
  font-family: 'Syne-SemiBold';
  font-size : 24px;
  letter-spacing : 0.96px;
}

.banner_out.title-link button{
    padding:0px 35px;
    height:62px;
    display:flex;
    align-items: center;
    background: #8C3CFA;
    border:none;
    outline:none;
    border-radius:30px;
    font-family: 'Syne-SemiBold';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #FFFFFF;
    margin:0 auto;
}

.banner_out.title-link button.sameWidth{
    width:300px;
}

.cardsBanner.banner_out .subtitle{
  font-family: 'Syne-Bold';
  font-size : 26px;
  line-height : 35.71px;
  color : #242833;
  margin-top:20px;
}

.cardsBanner.banner_out.roiCalc .subtitle{
     font-size : 24px;
}

.cardsBanner.banner_out .subtitle.play-color{
    position: relative;
    width: fit-content;
    background: #dedede;
    font-family: 'Syne-Bold';
    font-size: 52px;
    padding: 0px;
    line-height: normal;
    border: none;
    color: transparent;
    overflow: hidden;
    margin: 0 auto;

}

.cardsBanner.banner_out.featuresSubItem .subtitle.play-color{
     font-size: 42px;
}

.cardsBanner.banner_out .subtitle.play-color.green{
     background: #fff;
     margin:unset;
}

.cardsBanner.banner_out.featuresSubItem .subtitle.play-color.green{
    background: #dedede;
}

.cardsBanner.banner_out .subtitle.play-color svg.cutout {
    position: Absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    z-index: 99999;
}

.cardsBanner.banner_out .subtitle.bannerCardsStyle2{
     color : #fff;
}

.cardsContainer{
    max-width:1600px;
}

.cardsContainer.bannerCardsStyle3{
    max-width:100%;
}

.cardsContainer.simpleCardsImg{
     max-width:100%;
}

.cardsContainerTitle{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  color : #242833;
  margin-top:30px;
  margin-bottom:20px;
}

/* .cardBannerImg{
    width:55px !important;
} */

.cardsContainerSubtitle{
   font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 24px;
  color : #242833;
}

.bannerCardsStyle3 .cardsContainerSubtitle{
  font-size : 18px;
  line-height : 26px;
  margin-bottom:15px;
}

.cardBannerItem{
    max-width:320px;
}

.bannerCardsStyle3  .cardBannerItem{
     max-width:420px;
}

.bannerCardsStyle3  .cardBannerItem a{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 31px;
  color : #8C3CFA;
  text-decoration: underline;
}

/* ==========================================================================
   Ελευθερο HTML καρτας (banner kind 25, homepage_banner_photo.code_gr / code_en)
   Markup απο το developers.html (.example dl/dt/dd - problem/solution/result).

   ΟΛΑ κατω απο το .cardBannerCode: ο συντακτης γραφει σκετα <dl>/<dt>/<dd>,
   οποτε αν στυλιζαμε τα tags "γυμνα" θα βαφαμε καθε dl/dt/dd του site.

   CONFLICTS - το Bootstrap οριζει ηδη:
     dl,ol,ul { margin-top:0; margin-bottom:1rem }
     dt       { font-weight:700 }
     dd       { margin-bottom:.5rem; margin-left:0 }
     p        { margin-top:0; margin-bottom:1rem }
   Τα margin τα ξαναδηλωνουμε ρητα, αλλιως η καρτα αποκτα κενα που δεν εχει το
   σχεδιαστικο.
   ========================================================================== */

.cardBannerCode{
    margin-top: 14px;
}

.cardBannerCode dl{
    margin: 0;
}

.cardBannerCode dt{
    font-family: 'Syne-SemiBold';
    font-weight: normal;
    font-size: 11.5px;
    line-height: 16px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #8C3CFA;
    margin-top: 14px;
}

/* Η πρωτη ετικετα ακουμπαει στον τιτλο - το margin το δινει το .cardBannerCode */
.cardBannerCode dt:first-of-type{
    margin-top: 0;
}

.cardBannerCode dd{
    font-family: 'Syne-Regular';
    font-size: 14px;
    line-height: 21px;
    color: #55535F;
    margin: 4px 0 0;
}

/* Δικλειδα για οτι αλλο γραφτει στο ιδιο πεδιο */
.cardBannerCode p{
    font-family: 'Syne-Regular';
    font-size: 14px;
    line-height: 21px;
    color: #55535F;
    margin: 0 0 10px;
}

.cardBannerCode p:last-child{
    margin-bottom: 0;
}

.cardBannerCode a{
    color: #8C3CFA;
}

/* Συνδεσμος απλης καρτας (banner kind 25, homepage_banner_photo.button_* + link_*)
   Οψη οπως το .tile-link του developers.html - κειμενο-συνδεσμος, οχι κουμπι -
   αλλα στο μωβ του site (#8C3CFA) αντι για το τιρκουαζ του σχεδιαστικου.
   Το βελακι το γραφει ο συντακτης μεσα στο "Ονομα Κουμπιου" ("Read the reference →"),
   γι' αυτο ΔΕΝ προστιθεται απο εδω. */
.cardBannerItem a.cardLinkArrow{
    display: inline-block;
    margin-top: 12px;
    font-family: 'Syne-SemiBold';
    font-size: 15px;
    line-height: 22px;
    color: #8C3CFA;
    text-decoration: none;
    transition: color .2s ease;
}

.cardBannerItem a.cardLinkArrow:hover,
.cardBannerItem a.cardLinkArrow:focus{
    color: #6E23D6;
    text-decoration: none;
}

.cardBannerItem a.cardLinkArrow:active{
    color: #5B1BB8;
}

.bannerCardsStyle3  .cardBannerItem img{
    margin-right:20px;
}

.bannerCardsStyle3 .cardsContainerTitle{
    margin-top:10px;
}

.cardBannerItem.bannerCardsStyle2{
    max-width:380px;
    background: #fff;
    border-radius: 20px;
    padding:50px 40px;
    box-shadow: 0 0 15px 5px rgba(0,0,0,0.1);
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.cardBannerItem.bannerCardsStyle2.doNotShowYet{
    opacity:0;
}

/* --------------------------------------------------------------------------
   "Μικροτερες καρτες" (homepage_banner_photo.smaller_cards = 1, kind 25)

   Ιδια καρτα, πιο μαζεμενη: μικροτερο κουτι, μικροτερο εικονιδιο και
   μικροτερη τυπογραφια. Χρωματα, σκια και στηλες μενουν ιδια - γι' αυτο
   ειναι κλαση πανω στην υπαρχουσα .cardBannerItem και οχι δευτερο στυλ.

   Το max-width ειναι που τις κανει "μαζεμενες": στα >=1400px η καρτα
   παιρνει width:100% απο τη στηλη της, οποτε χωρις αυτο θα ανοιγε οσο
   και η κανονικη. Το κεντραρισμα το κανει ηδη το .cardsContainer .row.
   -------------------------------------------------------------------------- */

.cardBannerItem.smallerCards{
    max-width:280px;
}

/* Οι καρτες πλησιαζουν μεταξυ τους απο ΤΗ ΣΤΗΛΗ, οχι απο margin στην καρτα:
   η col-xl-3 πιανει 25% του πλατους, οποτε η μικρη καρτα εμενε κεντραρισμενη
   με τεραστιο κενο δεξια-αριστερα. 310px = 280 της καρτας + τα 15+15 padding
   της στηλης, αρα το κενο αναμεσα σε δυο καρτες βγαινει 30px.
   Το κεντραρισμα ολης της σειρας το κανει ηδη το .row.justify-content-center. */
@media (min-width: 1200px) {

    .cardsContainer .row > .smallerCardsCol {
        -ms-flex: 0 0 310px;
        flex: 0 0 310px;
        max-width: 310px;
    }
}

.cardBannerItem.bannerCardsStyle2.smallerCards{
    padding:26px 24px;
    border-radius:18px;
    box-shadow: 0 0 12px 3px rgba(0,0,0,0.07);
}

/* Στο grid το μεγεθος ερχεται απο html attributes (width/height) - το css
   τα υπερισχυει. Στο carousel ειναι inline style και μπαινει απο τη php. */
.cardBannerItem.smallerCards img{
    width:44px;
    height:44px;
}

.cardBannerItem.smallerCards .cardsContainerTitle{
    font-size:17px;
    margin-top:20px;
    margin-bottom:10px;
}

.cardBannerItem.smallerCards .cardsContainerSubtitle{
    font-size:15px;
    line-height:22px;
}

.cardBannerItem.onlyImgs{
    max-width:215px;
    margin:10px;
    display:inline block; 
}

.cardsBanner button{
    outline: none;
    border:none;
    height:62px;
    padding:0px 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    border:none;
    background: #8C3CFA;
    font-family: 'Syne-SemiBold';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #FFFFFF;
    margin:0 auto;
}

.requestField .itemInput{
    width: calc((100% - 310px) / 3);
}

.requestField .itemInput:last-child{
     width:310px;
}

.requestField .itemInput:last-child div:last-child{
    width:100%;
}

.requestField .itemInput div:first-child{
  font-family: 'Syne-Regular';
  font-size : 18px;
  padding-left:25px;
  letter-spacing : 0.18px;
  color : #8C3CFA;
  margin-bottom:15px;
}

.requestField .itemInput div:last-child{
    width:100%;
    padding-right:15px;
}

.requestField .itemInput input{
    width:100%;
    border:none;
    outline:none;
    height:62px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    padding:0px 25px;
}

.requestField .itemInput input::placeholder{
    font-family: 'Syne-Regular';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #9499A8;
}

.cardsBanner.roiCalc button{
    width:100%;
    padding:0px;
    font-size: 18px;
}

.cardsBanner button i{
    margin-top:3px;
    margin-left:10px;
}

.cardsBanner.integration button,
.cardsBanner.analytics button{
    border: 2px solid #8C3CFA;
    background: none;
    color:#8C3CFA;
}

.cardsBanner.customer button{
    border: 2px solid #242833;
    background: none;
    color : #242833;
}

.cardsBanner.textImg button{
    margin-left:0px;
}

.cardsBanner.featuresSubItem  button{
    border: 1px solid #8C3CFA;
    height: 51px;
    width:191px;
    padding: 0px;
    background: #fff;
    font-size: 16px;
    letter-spacing: 0.16px;
    color: #8C3CFA;
    margin:unset;
    margin-right:25px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cardsBanner.featuresSubItem  button:hover{
    background: #8C3CFA;
    color:#fff;
}

.cardsBanner.featuresSubItem  .buttonArea{
   margin-top:40px;
}

.cardsBanner.featuresSubItem video{
    border-radius:30px;
    width:100%;
}
.suggestionsArea{
    margin:70px 0px 70px 0px;
}

.suggestionsArea.withText{
    margin:20px 0px 20px 0px;
}

.container-fluid.featuresItem{
  max-width:1600px;
}
.suggestionsArea .suggestionItem{
    position:relative;
    padding-left:30px;
    font-family: 'Syne-Regular';
    font-size : 24px;
    color : #515057;
    margin-bottom:20px;
}

.suggestionsArea.withText .suggestionItem{
     font-size : 18px;
     margin-bottom:15px;
}

.suggestionsArea .suggestionItem::before{
     font-family: Font Awesome\ 5 Pro;
    content: '\f00c';
    color:#00E09D;
    position:Absolute;
    top:0px;
    left:0px;
}

.suggestionsArea .suggestionItem:last-child{
    margin-bottom:0px;
}

.cardsBanner.textImg .col-lg-5.position-relative{
    min-height:300px;
    padding:50px 0px 50px 0px;
}

.cardsBanner.textImg.analytics  .col-lg-5.position-relative{
    min-height:unset;
    padding:0px;
}


.fullScreenImg{
    position: absolute;
    top:-50%;
    left:50%;
    transform: translateX(-50%);
    heighT:150%;
}

.caseStudies .owl-dots{
    text-align: center;
    margin-top:30px;
}

.caseStudies button{
    width:15px;
    height:15px;
    border-radius:50%;
    outline:none;
    background: #B3B3B3 !important;
    border:none !important;
    display: inline-block;
    margin-right:10px;
}

.caseStudies button.active{
    background: #00E09D !important;
}

.cardsBanner.customer .description{
    margin-bottom:50px;
    margin-top:10px;
}

.cardsBanner.customer .caseStudies img{
    border-radius:20px;
}

.cardsBanner.customer .description .text{
  font-family: 'Syne-Regular';
  font-size : 20px;
  line-height : 33px;
  color : #242833;
  margin-bottom:30px;
  max-width:550px;
}

.cardsBanner.customer .description .author{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 25.2px;
  color : #242833;
}

.cardsBanner.customer .description .name{
    font-family: 'Syne-Bold';
}

.cardsBanner.customer .caseStudies .case-item .logo{
    position: absolute;
    top:25px;
    right:30px;
}

.cardsBanner.customer .caseStudies .case-item .goals{
    position: absolute;
    bottom:30px;
    left:30px;
}

/* .cardsBanner.customer .caseStudies .case-item .goals .goal-item{
    margin-bottom:0px;
} */

.cardsBanner.customer .caseStudies .case-item .goals .goal-item .title{
    font-family: 'Syne-SemiBold';
    font-size: 25px;
    color:#fff;
}

.cardsBanner.customer .caseStudies .case-item .goals .goal-item .rate{
    font-family: 'Syne-SemiBold';
    font-size: 60px;
    color:#00E09D;
}

.cardsBanner.customer .caseStudies .case-item .goals .goal-item img{
    width:25px;
    border-radius:0px;
}

.cardsBanner.customer .caseStudies .case-item .logo img{
    border-radius:0px;
    width:120px;
    height:auto;
}

.banner_img_text{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
}

.banner_img_text.left{
    left:15px;
}

.banner_img_text.right{
    right:15px;
}

.banner_img_text .title{
  font-family: 'Syne-Bold';
  font-size : 52px;
  color : #FFFFFF;
  margin-bottom:30px;
}

.banner_img_text .text{
  font-family: 'Syne-Bold';
  font-size : 24px;
  line-height : 35.71px;
  color : #FFFFFF; 
  max-width:700px;
  margin-bottom:50px;
}

.banner_img_text button{
    border:1px solid #fff;
    background: transparent;
    outline: none;
    display: flex;
    align-items: center;
    heighT:62px;
    padding:0px 35px;
    border-radius:40px;
    font-family: 'Syne-SemiBold';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #FFFFFF;
    margin:0 auto;
}

.banner_img_text button.bannersButtons{
    width:420px;
}

#footer{
    background: #242833;
}

.footerColumn {
    position: relative;
}

.footerColumn .title{
  font-family: 'Syne-Bold';
  font-size: 14px;
  line-height : 37.8px;
  letter-spacing : 0.56px;
  color : #9499A8;
}

.footerColumn .items a{
  font-family: 'Syne-Regular';
  font-size: 14px;
  line-height : 37.8px;
  letter-spacing : 0.56px;
  color : #9499A8 !important;
}

.socials a i{
    font-size: 22px;
    margin-right:50px;
    color:#9499A8;
}


.socials a:last-child i{
    margin-right:0px;
}

/*new code*/
.resp-1400-menu{
    display:none;
}

.resp-1400-logo{
    width:100%;
    text-align: center;
    padding:60px 0px;
}

#mobile_menu_in{
    padding:0px 15px;
}

div.mobile_menu{
    position: fixed;
    top:0px;
    left:0px;
    background: #fff;
    height:100%;
    width:260px;
    z-index:9999;
    border-right:1px solid rgba(0,0,0,0.1);
    -webkit-transition: all 0.88s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -moz-transition: all 0.88s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -o-transition: all 0.88s cubic-bezier(0.694, 0.0482, 0.335, 1);
    -ms-transition: all 0.88s cubic-bezier(0.694, 0.0482, 0.335, 1);
    transition: all 0.88s cubic-bezier(0.694, 0.0482, 0.335, 1);
}

.resp-991-menu div.mobile_menu{
    left:-100%;
    top:67px;
    width:100%;
    max-width: 250px;
    display:none;
}

.right_side_menu_opened .resp-991-menu div.mobile_menu{
    left:0px;
}

.resp-1400-menu{
    width:260px;
}

.mobile_menu .menuItem{
   margin-bottom:15px;
}

.mobile_menu .menu-item{
    width:calc(100% - 50px);
    font-family: 'Syne-Regular';
    font-size: 16px;
    letter-spacing: 0.28px;
    color: #242833;
    margin-left:35px;
    position:relative;
}

.mobile_menu .menu-item.has_children::after{
  font-family: Font Awesome\ 5 Pro;
  content: '\f078';
  position: absolute;
  top:calc(50% + 3px);
  transform: translateY(-50%);
  right:0px;
  font-size: 12px;
  color:#8C3CFA;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
   -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.mobile_menu .menu-item.has_children.active::after{
      transform: translateY(-50%) rotate(180deg);
}

.mobile_menu .menuChild{
   margin-left:35px;
   margin-right:20px;
   padding-top:15px;
   display:none;
}


.mobile_menu .menuChild .menu-child-item .title{
    font-family: 'Syne-Bold';
    font-size: 14px;
    letter-spacing: 0.24px;
    line-height: 0px;
    color: #8C3CFA;
}

.mobile_menu .menuChild .menu-child-item .text{
    font-family: 'Syne-Regular';
    font-size: 14px;
    color: #565a66;
}

.mobile_menu  .menuChildChild{
    margin-bottom:20px;
}

.mobile_menu  .menuChildChild .title{
    font-family: 'Syne-Medium';
    font-size: 14px;
    letter-spacing: 0.28px;
    margin-top:10px;
    color: #242833;
}

.mobile_menu  .menuChildChild .text{
    font-family: 'Syne-Regular';
    font-size: 13px;
    color: #565a66;
}

.mobile_menu .mobile_menu_body{
    max-height:calc(100vh - 300px);
    overflow-y:auto;
}

.resp-from-1400{
  display: none;
}

.owl-carousel.bannerCarousel .owl-stage-outer{
  padding:20px 0px; 
}
.pricing-tables .owl-carousel .owl-dots button{
    border-radius: 50%;
    outline:none;
}
.cardsBanner .owl-carousel button, .pricing-tables .owl-carousel .owl-dots button{
    border:none;
    width:13px;
    height:13px;
    background: #e6e6e6;
    display: inline-block;
    margin-right:10px;
    position:relative;
    top:-1px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cardsBanner .owl-carousel button.active, .pricing-tables .owl-carousel .owl-dots button.active{
    background: #00E09D;
    width:15px;
    height:15px;
    margin-top:0px;
    top:0px;
}

.cardsBanner .owl-carousel .owl-dots, .pricing-tables .owl-carousel .owl-dots{
    text-align: center;
    margin-top:30px;
}

.cardsBanner .owl-carousel button:last-child, .pricing-tables .owl-carousel .owl-dots button:last-child{
    margin-right:0px;
}

.fullBackPhoto.featuresItem{
    max-width: 100%;
}

.fullBackPhoto.featuresItem .text{
    text-align: center;
    margin:0 auto;
    margin-bottom:50px;
}

.fullBackPhoto.featuresItem .banner_img_text button{
    background: #fff;
    color:#8C3CFA;
}
.banner_out.fullBackPhoto .container-fluid.photo_b {
    width: 100%;
}


.fullBackPhoto .img-fluid{
  min-height:500px;
  object-fit: cover;
  width: 100%;
}

.menuButtons{
    padding:100px 0px;
    max-width:1600px;
}

.menuButtons a button.desktopVersion{
    border:none;
    width:311px;
    height:55px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    outline:none;
    font-family: 'Syne-Regular';
    font-size : 20px;
    line-height : 25px;
    color : #242833;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.menuButtons a button.desktopVersion.Type1:hover, .menuButtons a button.desktopVersion.Type1.active{
    color:#fff !important;
    background: #8c3cfa !important;
}


.menuButtons .owl-carousel .owl-dots{
    display: flex;
    justify-content: center;
    margin-top:20px;
}

.menuButtons .owl-carousel .owl-dots button{
    width:10px;
    height:10px;
    background: #f7f1ff;
    border-radius:50%;
    margin-right:10px;
    outline:none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.menuButtons .owl-carousel .owl-dots button:last-child{
    margin-right:0px;
}

.menuButtons .owl-carousel .owl-dots button.active{
    width:12px;
    height:12px;
     background: #8c3cfa;
}

.featuresItem img.fullScreenImg{
    width:100%;
    position:relative;
    top:0;
    left:0;
    transform:unset;
    height:auto;
    border-radius:30px;
}

.bannerCardsStyle4 .cardBannerItem img{
    filter:grayscale(100);
    margin:0 auto;
}


.bannerCardsStyle4 .cardsContainerTitle{
  font-size : 16px;
  color : #242833;
  margin:0 auto;
  margin-bottom:30px;
  margin-top:10px;
  max-width:250px;
}

.bannerFeatrueArea{
    font-family: 'Syne-Regular';
    font-size: 16px;
    color : #242833;
    margin-bottom:35px;
}

.bannerFeatrueArea .bannerFeature{
    width:fit-content;
    position:relative;
    margin:0 auto;
}

.bannerFeatrueArea .bannerFeature::before{
   content:'';
   width:3px;
   height:3px;
   background: #242833;
   border-radius:50%;
   position:Absolute;
   top:50%;
   transform: translateY(-50%);
   left:-8px;
}

.bannerCardsStyle4 a{
    font-family: 'Syne-Regular';
    color : #8C3CFA;
    text-decoration: underline;
}

.bannerCardsStyle4 .cardBannerItem{
    margin:0 auto;
    max-width: 320px;
    padding:10px 15px 40px 15px;
    border-radius:30px;
    box-shadow: 8px 8px 15px 1px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   "Support κάρτες" (homepage_banner_photo.support_cards = 1, kind 25)

   Ιδια δεδομενα με τις υπολοιπες καρτες - αλλαζει ΜΟΝΟ η οψη:
     photo_name        -> εικονιδιο (ηδη ερχεται σε χρωματιστο πλαισιο 46x46)
     name_gr/en        -> τιτλος
     text_gr/en        -> περιγραφη
     banner_features   -> η εντονη γραμμη (π.χ. "Typical reply: under 5 minutes")
     button + link     -> pill κουμπι με περιγραμμα

   Ολοι οι κανονες ειναι scoped στο .supportCard, οποτε δεν αγγιζουν καμια αλλη
   καρτα - ακομα κι οταν το banner ειναι bannerCardsStyle4.
   ========================================================================== */

.cardBannerItem.supportCard{
    margin:0 auto;
    max-width:340px;
    padding:34px 28px 36px 28px;
    border-radius:24px;
    background:#fff;
    /* Απαλη, ισοκατανεμημενη σκια αντι για τη μετατοπισμενη 8px/8px του style4 */
    box-shadow: 0 10px 30px rgba(28, 27, 34, 0.08);
}

/* Το grayscale του style4 ειναι για λογοτυπα συνεργατων - εδω το εικονιδιο
   πρεπει να κρατησει το χρωμα του. Το ιδιο το svg φερνει το πλαισιο του. */
.cardBannerItem.supportCard img{
    width:46px;
    height:46px;
    margin:0 auto;
    filter:none;
}

.cardBannerItem.supportCard .cardsContainerTitle{
    font-family: 'Syne-SemiBold';
    font-size:18px;
    line-height:26px;
    color:#242833;
    max-width:none;
    margin:18px auto 8px auto;
}

.cardBannerItem.supportCard .cardsContainerSubtitle{
    font-family: 'Syne-Regular';
    font-size:15px;
    line-height:23px;
    color:#55535F;
    margin-bottom:16px;
}

/* Τα χαρακτηριστικα δεν ειναι πια λιστα με κουκιδες αλλα μια εντονη γραμμη. */
.cardBannerItem.supportCard .bannerFeatrueArea{
    font-family: 'Syne-SemiBold';
    font-size:15px;
    color:#242833;
    margin-bottom:24px;
}

.cardBannerItem.supportCard .bannerFeatrueArea .bannerFeature::before{
    display:none;
}

/* Ο συνδεσμος γινεται κουμπι. Το ".bannerCardsStyle4 a" του δινει υπογραμμιση -
   εδω εχουμε μεγαλυτερη specificity, οποτε κερδιζει χωρις !important. */
.cardBannerItem.supportCard a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-family: 'Syne-Medium';
    font-size:15px;
    line-height:1;
    color:#8C3CFA;
    text-decoration:none;
    border:1.5px solid #8C3CFA;
    border-radius:30px;
    padding:13px 26px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.cardBannerItem.supportCard a:hover{
    background:#8C3CFA;
    color:#fff;
}

/* Το "featured" ειχε δικο του padding 125px - τωρα ακολουθει το ενιαιο 140px
   του .cardsBanner.banner_out (βλ. σχολιο εκει). */

/* Υποτιτλος default banner - ιδια τυπογραφια με το .cardsBanner.banner_out
   .subtitle (η αναφορα ειναι το banner 86 στο /solution/). Ο επιλογεας
   πιανει ΜΟΝΟ αυτο το ειδος: κανενα αλλο banner δεν βαζει .subtitle μεσα
   σε .banner_title_area. */
.banner_title_area .subtitle {
    font-family: 'Syne-Bold', Arial, Helvetica, sans-serif;
    font-size: 26px;
    line-height: 35.71px;
    color: #242833;
    text-align: center;
    margin-top: 20px;
}

.customers-carousel-white .title_b {
  font-family: 'Syne-SemiBold';
  font-size : 18px;
  text-transform : uppercase;
  color : #242833;
  /* Ρητο, ωστε να μη το παρασυρει το letter-spacing:normal του
     .banner_title_area .title_b - πριν το κληρονομουσε απο το βασικο .title_b. */
  letter-spacing : 0.8px;
}

.customers-carousel-white .title_b span {
    border-bottom:none;
    padding-bottom: 0px;
}

.banner_out.pricing-tables{
    padding:115px 15px 150px 15px;
}

/* Επιλογεας διαρκειας συνδρομης πανω απο τους πινακες τιμων (/pricing/) */
.ptDurations{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:6px;
    width:max-content;
    max-width:calc(100% - 30px);
    margin:0 auto 40px auto;
    padding:6px;
    border-radius:40px;
    background:#fff;
    box-shadow:0 10px 30px rgba(36,40,51,0.10);
}

.ptDur{
    border:none;
    outline:none;
    background:transparent;
    color:#6C7183;
    font-family:'Syne-SemiBold', sans-serif;
    font-size:15px;
    padding:11px 24px;
    border-radius:30px;
    cursor:pointer;
    transition:background .25s ease, color .25s ease;
}

.ptDur:hover{
    color:#242833;
}

.ptDur.isOn{
    background:#8C3CFA;
    color:#fff;
}

/* Σημειωση ΦΠΑ μεσα σε καθε πακετο (/pricing/), στο τελος της καρτελας, κεντραρισμενη, γκρι γραμματα */
.priceTable .tableBody .priceVatNote{
    width:100%;
    margin:18px 0 0 0;
    text-align:center;
    font-family: 'CeraGreek-Regular', sans-serif;
    font-size:12.5px;
    letter-spacing:0.2px;
    color:#8A8F9C;
}

.container-fluid .priceTable{
    margin-right:20px;
}

.container-fluid .priceTable:last-child{
    margin-right:0px;
}

.priceTable{
    width: 320px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    box-shadow:8px 8px 15px 1px rgba(0, 0, 0, 0.2);
}
.priceTable .tableHeader{
    background: #dedede;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.priceTable .tableHeader .headerTop{
    padding:30px 15px 25px 25px;
    border-bottom:1px solid #fff;
}

.priceTable .tableHeader .price{
    padding:25px;
    font-family: 'Syne-SemiBold';
    font-size : 36px;
}

.priceTable .tableHeader .price span{
    margin-right:-8px;
}

/* Το ποσο («€ 99») μενει παντα σε ΜΙΑ γραμμη: χωρις αναδιπλωση αναμεσα στο € και τον
   αριθμο, και καμια απο τις δυο πλευρες (ποσο / «monthly» + toggle) δεν συρρικνωνεται */
.priceTable .tableHeader .price > div:first-child{
    white-space:nowrap;
    flex-shrink:0;
}

.priceTable .tableHeader .price > div:last-child{
    flex-shrink:0;
}

.priceTable .tableHeader .price div:last-child{
    font-family: 'Syne-Regular';
    font-size : 16px;
}

.priceTable .tableHeader .price div .toggle{
     margin-left:15px;
     width:32px;
     height:18px;
     border-radius:10px;
     background: #242833;
     position: relative;
}

.priceTable .tableHeader .price div .toggle::after{
    content:'';
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background: currentColor;
    top:50%;
    transform: translateY(-50%);
    left:5px;
}

.priceTable .tableHeader .headerTop .title{
  font-family: 'Syne-SemiBold';
  font-size : 28px;
}

.priceTable .tableHeader .headerTop .sub_title{
    font-family: 'Syne-Regular';
    font-size : 23px;
}

.priceTable .tableBody{
    padding:30px 30px 16px 30px; /* κατω 16px (ηταν 40px): τελευταιο στοιχειο ειναι η σημειωση ΦΠΑ */
    background: #fff;
}

.priceTable .tableBody .moreDetails{
    position: relative;
    padding-top:30px;
}

.priceTable .tableBody .moreDetails::before{
    content: '';
    position: absolute;
    top:0px;
    left:-30px;
    width:calc(100% + 60px);
    height: 2px;
    background: #f2f2f2;
}

.priceTable button, .cookies-popup-buttons button, .cookies-popup-buttons a.cookies-settings{
    width:100%;
    height:48px;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    border:none;
    border-radius: 30px;
    background: #242833;
    font-family: 'Syne-Medium';
    font-size : 16px;
    letter-spacing : 0.16px;
    color : #FFFFFF;
    margin:35px auto;
}

.cookies-popup-buttons button{
    margin:0 auto;
    background: #8c3cfa;
    color: #fff;
}

#cookies-popup .cookies-popup-buttons button{
    width:fit-content;
    padding-left:30px;
    padding-right:30px;
    margin:unset;
}

 .cookies-popup-buttons a.cookies-settings{
    text-decoration: none;
    background: none;
    border:1px solid #8c3cfa;
    color:#8c3cfa;
    margin:0 auto;
 }

 #cookies-popup .cookies-popup-buttons button:first-child{
    background: none;
    border:1px solid #8c3cfa;
    color:#8c3cfa;
 }

.priceTable .tableBody .featureTxt{
    font-family: 'Syne-Regular';
    font-size : 16px;
    margin-bottom: 25px;
    position: relative;
    padding-left:20px;
    width:fit-content;
    cursor: pointer;
}

.priceTable .tableBody .featureTxt .tooltiptext {
  visibility: hidden;
  width: 220px;
  background-color: #242833;
  color: #ffffff;
  text-align: center;
  border-radius: 3px;
  padding:15px;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Syne-Regular';
  font-size : 10px;
}

.priceTable .tableBody .featureTxt .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #242833 transparent transparent transparent;
}

.priceTable .tableBody .featureTxt:hover .tooltiptext {
  visibility: visible;
}

.priceTable .tableBody .featureTxt::before{
    content: '\f00c';
    font-family: Font Awesome\ 5 Pro;
    color:#fff;
    padding:3px;
    font-size: 9px;
    border-radius:50%;
    background:#242833;
    position:Absolute;
    top:2px;
    left:0px;

}

.priceTable .tableBody .featureTxt::after{
    content: '\f05a';
    font-family: Font Awesome\ 5 Pro;
    font-size: 12px;
    color:#242833;
    position:Absolute;
    top:4px;
    right:-20px;
}

.priceTable .tableBody .featureTxt:last-child, .priceTable .tableBody .moreDetails .featureTxt:last-child{
    margin-bottom:0px;
}

.priceTable .tableBody .moreDetails  .featureDetails{
    margin-bottom:40px;
    position: relative;
    width:fit-content;
    font-family: 'Syne-Medium';
    font-size : 12px;
    letter-spacing : 1.44px;
    color : #242833;
}

.priceTable .tableBody .moreDetails  .featureDetails::after{
    content: '';
    position: absolute;
    width:100%;
    height:1px;
    background: #242833;
    left:0px;
    bottom:-2px;
}

.priceTableCarousel.owl-carousel .owl-item{
    padding-bottom:30px;
}

.priceTableCarousel.owl-carousel .owl-item .priceTable{
    margin:0 auto;
}

.carouselItemCollector{
   width:100%;
   padding:0px;
   position:Absolute;
   top:-2px;
   left:50%;
   transform: translateX(-50%);
   overflow:hidden;
   height:100px;
}

.carouselItemCollectorIn {
    height: 500%;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
}

.carouselItemCollectorIn .carouselItem{
    position:relative;
    display:flex;
    align-items: center;
    padding-left:10px;
    z-index:1;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.carouselItemCollectorIn .carouselItem .carouselItemBackground{
    position:Absolute;
    width:100%;
    height:100%;
    z-index:-1;
    left:0;
    top:0;
    transform: rotate(30deg);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.carouselItemCollectorIn .carouselItem.active{
    width:40% !important;
}


.carouselItemCollectorIn .carouselItem .item .sub{
    font-size: 10px;
    width:100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
} 

.carouselItemCollectorIn .carouselItem .item span{
    font-size: 10px;
}

.carouselItemCollectorIn .carouselItem.active .item span{
     font-size: 12px;
}

.carouselItemCollectorIn .carouselItem.active .item{
    font-family: 'Syne-SemiBold';
    font-size: 18px;
} 

.carouselItemCollectorIn .carouselItem.active .item .sub{
    font-family: 'Syne-Regular';
    font-size: 16px;
}

.carouselItemCollectorIn .carouselItem.active::before{
   content:'';
   position:Absolute;
   width:4px;
   height:100%;
   transform: rotate(30deg);
   background: #fff;
   top:0;
   left:-8%;
}

.carouselItemCollectorIn .carouselItem::before{
   content:'';
   position:Absolute;
   width:4px;
   height:100%;
   transform: rotate(30deg);
   background:transparent;
   top:0;
   left:-8%;
}

.carouselItemCollectorIn .carouselItem.active::before{
   background: #fff;
}

.carouselItemCollectorIn .carouselItem.firstCard.active::before{
    background:transparent;
}

.carouselItemCollectorIn .carouselItem::after{
   content:'';
   position:Absolute;
   width:4px;
   height:100%;
   background:transparent;
   transform: rotate(30deg);
   top:0;
   right:3%;
}

.carouselItemCollectorIn .carouselItem.active::after{
   background: #fff;
}

.carouselItemCollectorIn .carouselItem.lastCard.active::after{
   background:transparent;
}

.partner-badges .h_item{
    width:fit-content;
    display: inline-block;
    margin:0px 35px;
}

.partner-badges .h_item img{
    filter: grayscale(100%);
    margin-top:35px;
}

.banner_out.pricing_faqs{
   padding:115px 15px 140px 15px;
}

.banner_out.pricing_faqs .title_b{
  font-family: 'Syne-Bold';
  font-size : 42px;
  color : #8C3CFA;
}

.banner_out.pricing_faqs .banner_title_area_out{
  margin-bottom:70px;
}

.banner_out.pricing_faqs .container .faqItem{
    background: #fff;
    border-radius:3px;
    padding:50px 40px;
    margin-bottom: 10px;
}

.banner_out.pricing_faqs .container .faqItem:last-child{
    margin-bottom:0px;
}

.banner_out.pricing_faqs .container .faqItem .question{
  font-family: 'Syne-Bold';
  font-size : 20px;
  color : #242833;
  position: relative;
  cursor:pointer;
  -webkit-transition: all 0.3s ease;
   -moz-transition: all 0.3s ease;
   -o-transition: all 0.3s ease;
   transition: all 0.3s ease;
}

.banner_out.pricing_faqs .container .faqItem .question.active{
    color : #8C3CFA;
}

.banner_out.pricing_faqs .container .faqItem .question::after{
    content: '\f078';
    font-family: Font Awesome\ 5 Pro;
    font-size : 27px;
    color : #8C3CFA;
    position:Absolute;
    top:50%;
    transform: translateY(-50%);
    right:0px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.banner_out.pricing_faqs .container .faqItem .question.active::after{
    transform: translateY(-50%) rotate(180deg);
}

.banner_out.pricing_faqs .container .faqItem .answer{
  display: none;
  padding-top:40px;
  font-family: 'Syne-Regular';
  font-size : 18px;
  color : #242833;
}

.presantationPhoto{
    height:calc(100vh - 93px);
    object-fit: cover;
}

.presantationBlogInfos{
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    left:8%;
}

.presantationBlogInfos .title{
    position:relative;
    width:fit-content;
    font-family: 'Syne-Bold';
    font-size : 42px;
    color:#fff;
    margin-bottom:20vh;
}

.presantationBlogInfos .title div:first-child{
  font-family: 'Syne-Regular';
  font-size : 44px;
}

.presantationBlogInfos .title::after{
    content:'';
    background:linear-gradient(to right, #8C3CFA 0%, #8C3CFA 60%, #00E09D 100%);
    width:100%;
    height:5px;
    position:Absolute;
    left:0px;
    top:calc(100% + 5px);
}

.categoryPage .presantationBlogInfos .title::after{
    background:linear-gradient(to right, #00E09D 0%, #00E09D 60%, #8C3CFA 100%);
}

.presantationBlogInfos .date{
  font-family: 'Syne-Bold';
  font-size : 26px;
  text-transform : uppercase;
  color : #FFFFFF;
  margin-bottom:50px;
}

.categoryPage .presantationBlogInfos .date{
    text-transform: unset;
}

.presantationBlogInfos .date div:last-child{
   font-family: 'Syne-Regular';
   font-size : 22px;
   margin-top:10px;
}

.presantationBlogInfos .description{
  font-family: 'Syne-Regular';
  font-size : 60px;
  line-height : 70px;
  color : #FFFFFF;
  max-width:60vw;
}

.categoryPage .presantationBlogInfos .description{
  max-width:55vw;
}

.presantationBlogInfos button{
    width:300px;
    height:62px;
    display:flex;
    align-items:center;
    justify-content: center;
    outline:none;
    border:none;
    border-radius:30px;
    background: #8c3cfa;
    font-family: 'Syne-Bold';
    font-size : 20px;
    letter-spacing : 0.2px;
    color : #FFFFFF;
    margin-top:35px;
}

.categoryPage  .presantationBlogInfos button{
     background: #00E09D;
}

.categoryPage .companyLogo{
   width:260px;
   position: absolute;
   right:70px;
   bottom:60px;
}

.categoryPage .companyLogo img{
    width:100%;
}

form#blogSearch .formIn {
    padding:40px 15px 60px 15px;
    font-family: 'Syne-Regular';
    font-size : 16px;
    color : #242833;
}

form#blogSearch .formIn div.formPart{
    width:100%;
    max-width:273px;
    margin-right:40px;
    position: relative;
}

form#blogSearch .formIn div.formPart .error{
    position:absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 0);
    color: #dc2626;
    width:100%;
    padding:5px;
    text-align: center;
    background: rgba(0,0,0,0.1);
    border-radius:20px;
    opacity:0;
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s ease;
}

form#blogSearch .formIn div.formPart .error.active{
    transform: translate(-50%, -50%);
    opacity: 1;
}

form#blogSearch .formIn div.formPart:last-child{
    margin-right:0px;
}

form#blogSearch .inputCategoryField,
form#blogSearch .inputSearchField{
  width:100%;
  border-bottom:2px solid #242833;
  position:relative;
  padding:15px 0px;
  cursor: pointer;
}

form#blogSearch .inputCategoryField:after,
form#blogSearch .inputSearchField::after{
    content: '\f078';
    font-family: Font Awesome\ 5 Pro;
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    right:5px;
    color:#000;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

form#blogSearch .inputCategoryField.active:after{
    transform: translateY(-50%) rotate(180deg);
}

form#blogSearch .formIn button{
    font-family: 'Syne-Bold';
}

form#blogSearch .categoriesOptions{
    display:none;
    position:Absolute;
    width:100%;
    top:calc(100% + 2px);
    left:0px;
    z-index:999;
    background: #f7f1ff;
    box-shadow:8px 8px 15px 1px rgba(0, 0, 0, 0.1);
}

.categoryPage form#blogSearch .categoriesOptions{

     background: #eef5f3;
}

form#blogSearch .categoriesOptions .categoryOption{
    padding:15px 1px 15px 30px;
    background: transparent;
    color : #242833;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

form#blogSearch .categoriesOptions .categoryOption:hover{
    background: #8C3CFA;
    color : #fff;
}

.categoryPage form#blogSearch .categoriesOptions .categoryOption:hover{
    background: #00d998;
}

form#blogSearch .inputSearchField::after{
   content: '\f002';
   color : #8C3CFA;
}

.categoryPage form#blogSearch .inputSearchField::after{
   color : #00d998;
}

form#blogSearch .inputSearchField input{
    outline:none;
    border:none;
    width:calc(100% - 30px);
    background: none;
}

form#blogSearch .inputSearchField input::placeholder {
   font-family: 'Syne-Regular';
   font-size : 16px;
   color : #242833;
}

form#blogSearch button{
   width:100%;
   height:51px;
   background: #8C3CFA;
   color:#fff;
   border:none;
   outline: none;
   border-radius:30px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.categoryPage form#blogSearch button{
   background: #00d998;
}

.blogCategoryArea{
    padding:105px 15px 150px 15px;
}


.blogCategoryArea .title{
    width:100%;
    max-width:1600px;
    margin:0 auto;
    margin-bottom:100px;
}

.blogCategoryArea .title h3{
  font-family: 'Syne-Bold';
  font-size : 42px;
  color : #242833;
}


.blogCategoryArea.recent{
    background: #f7f1ff;
}

.blogCategoryArea.popular{
    background: #eef5f3;
}

.blogCategoryArea.backgrey{
     background: #f2f2f2;
}

.blogCategoryArea .blogPosts{
    width:100%;
    max-width:1600px;
    margin:0 auto;
}

.blogPageIn.container-fluid{
    max-width:1600px;
    padding-bottom:50px;
}

.blogCategoryArea .blogPosts .blogItem, .blogPageIn .blogItem{
  padding-bottom:100px;
}

.blogCategoryArea.popular .blogPosts .blogItem,
.categoryPage .blogItem{
  padding-bottom:80px;
}

.blogPageIn .blogItem{
    margin-top:30px;
}

.blogCategoryArea .blogPosts .blogItem img, .blogPageIn .blogItem img{
    border-radius:10px;
    margin-bottom: 30px;
}

.blogCategoryArea .blogPosts .blogItem .blogInfos, .blogPageIn .blogItem .blogInfos{
  font-family: 'Syne-Regular';
  font-size : 18px;
  color : #8C3CFA;
  margin-bottom:25px;
}

.blogCategoryArea.popular .blogPosts .blogItem .blogInfos,
.categoryPage .blogItem .blogInfos{
     color : #00d998;
}

.blogCategoryArea .blogPosts .blogItem .sortText, .blogPageIn .blogItem .sortText{
  font-family: 'Syne-Medium';
  font-size : 21px;
  line-height : 31px;
  color : #242833;
  min-height:100px;
}

.blogCategoryArea .blogPosts .blogItem button, .blogPageIn .blogItem button{
    outline: none;
    border:2px solid #8c3cfa;
    height:45px;
    width:177px;
    border-radius:30px;
    background: transparent;
    font-family: 'Syne-Medium';
    font-size : 16px;
    letter-spacing : 0.16px;
    color : #8C3CFA;
    position:absolute;
    bottom:0;
    left:0;
}

.blogCategoryArea.popular .blogPosts .blogItem button,
.categoryPage .blogItem button{
    background: #00d998;
    color:#fff;
    border:none;
}

.blogItem img.customerLogo{
    width:134px;
    position:Absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
}

.blogPosts.owl-carousel .owl-dots{
    margin-top:20px;
    text-align: center;
}

.blogPosts.owl-carousel .owl-dots button{
    margin-right:10px;
    width:13px;
    height:13px;
    background: #e6e6e6;
    border-radius: 50%;
    outline: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.blogPosts.owl-carousel .owl-dots button.active{
    background: #8c3cfa;
    width:15px;
    height:15px;
}

.blogPosts.owl-carousel .owl-dots button:last-child{
    margin-right:0px;
}

.blogPosts.owl-carousel .owl-nav{
    position: absolute;
    top: -70px;
    righT: 0px;
    padding:0px 15px;
}

.blogPosts.owl-carousel .owl-nav button{
    width:40px;
    height:40px;
    display:flex;
    align-items: center;
    justify-content: center;
    border:1px solid #242833;
    border-radius:50%;
    outline:none;
    display: inline-block;
}

.blogPosts.owl-carousel .owl-nav button.viewAll{
     width:90px;
     border-radius:30px;
     position:relative;
     top:-5px;
     outline:none;
     background: none;
}

.blogPosts.owl-carousel .owl-nav button:first-child{
    margin-right:20px;
}

.blogPosts.owl-carousel .owl-nav button i{
    color:#242833;
    font-size: 25px;
}

.blogCategoryArea.recent .blogPosts.owl-carousel .owl-nav button{
    border:1px solid  #8c3cfa;
}


.blogCategoryArea.recent .blogPosts.owl-carousel .owl-nav button i{
    color: #8c3cfa;
}

.LoadMore, .LoadMoreStories{
    padding:70px 15px;
    display:flex;
    justify-content: center;
    background: #f2f2f2;
    width:calc(100% + 30px);
    margin-left:-15px;
}

.LoadMore button, .LoadMoreStories button{
   outline: none;
   width:240px;
   height:45px;
   font-family: 'Syne-Medium';
   font-size : 16px;
   letter-spacing : 0.16px;
   color : #242833;
   display: flex;
   align-items: center;
   justify-content: center;
   border:1px solid #242833;
   border-radius:30px;
   cursor: pointer;
}

.LoadMore button.inactive, .LoadMoreStories button.inactive{
    opacity:0.2;
    cursor:default;
}

.blogPage .title{
    font-family: 'Syne-SemiBold';
    color :#8c3cfa;
    padding:50px 0px 30px 0px;
}

.blogPage.categoryPage .title{
    color:#242833;
    padding:110px 0px 70px 0px;
}

.blogPage .title span{
    font-family: 'Syne-Regular';
    color : #242833;
}

.searchHeader{
    padding:90px 8% 125px 8%;
    background: #f7f1ff;
    margin-bottom:70px;
}

.searchHeader.categoryPage{
background:#eef5f3;
}

.searchLogo{
    color:#242833;
    position: relative;
}

.searchLogo div:first-child{
    font-family: 'Syne-Regular';
    font-size: 44px;
}

.searchLogo div:last-child{
    font-family: 'Syne-Bold';
    font-size: 52px;
}

.searchLogo::after{
    content:'';
    position: absolute;
    top:calc(100% + 8px);
    left:0px;
    width:100%;
    height:5px;
    background:linear-gradient(to right,   #8C3CFA 0%, #8C3CFA 60%, #00E09D 100%);
}

.categoryPage .searchLogo::after{
    background: linear-gradient(to right, #00E09D 0%, #00E09D 60%, #8C3CFA 100%);
}

.searchHeader .searchForm{
    width:100%;
    max-width:920px;
}


.searchHeader form#blogSearch .formIn {
    padding: 0px;
    margin-bottom:-13px;
}

.searchBlogResults{
    padding:110px 0px 110px 0px;
    background: #fff;
}

.searchBlogSeperateLine{
    background: #f2f2f2;
    height:3px;
    width:100%;
}

.roiCalculatorWrap{
    width:100%;
    max-width:1340px;
    margin:0 auto;
}

.roiCalculatorWrap .replyField{
    margin-top: 70px;
    background: #fff;
    border-radius:20px;
    text-align: center;
    padding:70px 15px 60px 15px;
    font-family: 'Syne-Regular';
    font-size : 22px;
    color : #242833;
}

.roiCalculatorWrap .replyField div:nth-child(1){
    font-family: 'Syne-Bold';
    font-size : 34px;
    color : #8C3CFA;
    margin-bottom:15px;
}

.roiCalculatorWrap .replyField div:nth-child(2){
    margin-bottom:40px;
}

.roiCalculatorWrap .replyField div:nth-child(3){
  font-size : 13px;
}

.page_blog .photoWrapper img{
    height:460px;
    object-fit: cover;
}

.blogInside{
    width:100%;
    max-width:980px;
    margin:0 auto;
    padding-top:75px;
    padding-bottom:160px;
}

.blogInside.customerStory{
    max-width:100%;
}

.blogInside.customerStory .inStory{
    width:100%;
    padding-left:15px;
    padding-right:15px;
}

.blogInside.customerStory .inStory.forBlogInfos{
   padding-top:75px;
}

.blogInside.customerStory .inStoryPartIn{
    width:100%;
    max-width:980px;
    margin:0 auto;
}

.blogInside .blogInfos{
  font-family: 'Syne-Regular';
  font-size : 18px;
  text-transform : uppercase;
  color : #8C3CFA;
  margin-bottom:35px;
}

.blogInside.customerStory .blogInfos{
    color : #00E09D;
}

.blogInside .shortTxt{
  font-family: 'Syne-Regular';
  font-size : 46px;
  line-height : 56px;
  color : #242833;
  position:relative;
  padding-bottom:70px;
  margin-bottom:40px;
}


.blogInside .shortTxt::after{
    content:'';
    background:linear-gradient(to right, #8C3CFA 0%, #8C3CFA 60%, #00E09D 100%);
    width:100%;
    height:2px;
    position:Absolute;
    left:0px;
    bottom:0px;
}

.blogInside.customerStory .shortTxt::after{
    background:linear-gradient(to right, #00E09D 0%, #00E09D 60%, #8C3CFA 100%);
}

.blogInside .title{
  font-family: 'Syne-Medium';
  font-size : 28px;
  line-height : 37px;
  color : #242833;
  padding:30px 15px;
}

.blogInside .simpleText{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 31px;
  color : #515057;
  padding:20px 15px;
}

.blogInside .simpleText .twoColumnsText{
  column-count: 2;
  column-gap: 40px;
}

.blogInside .highLight{
  font-family: 'Syne-Regular';
  font-size : 18px;
  line-height : 25px;
  color : #515057;
  text-align: center;
  padding:35px 75px;
  background: #f7f1ff;
  max-width:calc(100% - 30px);
  margin:30px auto;
  border-radius: 10px;
}

.blogInside .imgText{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 31px;
  color : #515057;
}


.reveal-left {
  opacity: 0;
  transform: translateX(-80px);
  transition: opacity 0.9s ease, transform 0.9s cubic-bezier(.25,.46,.45,.94);
}

.reveal-right {
  opacity: 0;
  transform: translateX(80px);
  transition: opacity 0.9s ease, transform 0.9s cubic-bezier(.25,.46,.45,.94);
}

.reveal-active {
  opacity: 1;
  transform: translateX(0);
}


/* IMPORTANT for SVG transforms */

#logoEe{
    transform: scale(3);
    margin:100px auto;
}

#ee1, #ee2{
  transform-box: fill-box;
  transform-origin: center;
  transition: transform 800ms ease-in-out;
}

#logoEe.rotated #ee1{ transform: rotate(-10deg); }
#logoEe.rotated #ee2{ transform: rotate(70deg); }

.noResults{
    position:relative;
    width:fit-content;
    margin:100px auto;
    left:-60px;
}

.sadFace{
    position:absolute;
    left:calc(100% - 40px);
    top:-40px;
}

.sadFace i{
    font-size: 400px;
    color:#242833;
}

.sadFace .sadFaceSvg{
    display:block;
    width:400px;
    height:400px;
    overflow:visible;
}

.sadFace .glassLens{
    stroke-dasharray: 360;
    stroke-dashoffset: 360;
}
.sadFace .glassSpark{
    transform-box: fill-box;
    transform-origin: center;
}

/* τα εφέ τρέχουν κατευθείαν από CSS — χωρίς JS trigger */
.noResults .sadFaceSvg{ animation: glassFloat 5s ease-in-out infinite; }
.noResults .glassLens{ animation: glassDraw 1.1s ease-out forwards; }
.noResults .glassScan{ animation: glassScan 2.6s ease-in-out 1s infinite; }
.noResults .s1{ animation: glassTwinkle 2.6s ease-in-out 1.2s infinite; }
.noResults .s2{ animation: glassTwinkle 2.6s ease-in-out 1.7s infinite; }
.noResults .s3{ animation: glassTwinkle 2.6s ease-in-out 2.1s infinite; }

@keyframes glassFloat{
    0%,100%{ transform: translateY(0) rotate(0deg); }
    50%{ transform: translateY(-12px) rotate(-3deg); }
}
@keyframes glassDraw{
    to{ stroke-dashoffset: 0; }
}
@keyframes glassScan{
    0%{ transform: translateY(-32px); opacity:0; }
    15%{ opacity:1; }
    85%{ opacity:1; }
    100%{ transform: translateY(32px); opacity:0; }
}
@keyframes glassTwinkle{
    0%,100%{ opacity:0; transform: scale(0.4); }
    50%{ opacity:1; transform: scale(1); }
}

/* μήνυμα + CTA κάτω από το εικονίδιο */
.noResultsText{
    text-align:center;
    margin-top:48px;
}
.noResultsCta{
    display:inline-block;
    font-family:'Syne-SemiBold', sans-serif;
    font-size:.95em;
    letter-spacing:.4px;
    color:#fff;
    text-decoration:none;
    padding:13px 32px;
    border-radius:40px;
    background:linear-gradient(90deg,#00f2a1 0%,#3f9fca 50%,#8C3CFA 100%);
    background-size:200% 100%;
    background-position:0 0;
    transition:background-position .5s ease, transform .25s ease, box-shadow .25s ease;
}
.noResultsCta:hover{
    color:#fff;
    background-position:100% 0;
    transform:translateY(-2px);
    box-shadow:0 10px 24px rgba(63,159,202,.35);
}

/* accessibility: σεβασμός στο prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
    .noResults .sadFaceSvg,
    .noResults .glassLens,
    .noResults .glassScan,
    .noResults .s1,
    .noResults .s2,
    .noResults .s3,
    #logoEe #ee1, #logoEe #ee2{
        animation:none !important;
        transition:none !important;
    }
    .sadFace .glassLens{ stroke-dashoffset:0; }
    .sadFace .glassScan,
    .sadFace .glassSpark{ opacity:1; }
    .noResultsCta{ transition:none; }
    .noResultsCta:hover{ transform:none; }
}

.cookies_alert_popup_in .cookies_respect_privacy {
    font-family: 'Syne-Medium';
    font-size: 1.2em;
    letter-spacing: 0.16px;
    color:#242833;
}

.cookies_alert_popup_in {
    font-family: 'Syne-Regular';
    font-size: .92em;
    line-height: 20px;
}

.cookies_alert_popup_in .fa-cookie-bite, #cookies-popup  .fa-cookie-bite{
    color: #8c3cfa;
    background: #fff;
    position: absolute;
    font-size: 17px;
    top: 1px;
    left: calc(50% - 17px);
    transform: translateX(-50%);
}

#cookies-popup .modal-header{
    padding:20px 0px;
    border-bottom:1px solid #dedede;
}

#cookies-popup .modal-title{
    font-family: 'Syne-Medium';
    font-size: 1.2em;
    letter-spacing: 0.16px;
    font-weight: 600;
    color:#242833;
}

#cookies-popup .logo-cookies{
    width:250px;
    text-align: right;
    padding-right:15px;
}

#cookies-popup  .cookies-popup-close{
   position: absolute;
   top:10px;
   right:10px;
}

#cookies-popup  .fa-cookie-bite {
    top: 1px;
    left: calc(100% - 141px);
    transform:unset;
}

#cookies-popup .cookiesExplainTitle{
    width:calc(100% - 250px);
    text-align: left;
    padding-left:15px;
}

#cookies-popup .modal-header button.close {
    border-radius:50%;
    background: #e4e4e4;
    color: #8c3cfa;
}

div.cookies-popup-close span {
    font-size: 18px;
}

.cookies_popup_text {
    font-weight: normal;
    font-size: 16px;
    max-height: unset;
    min-height:450px;
}

.cookies_popup_text .cookiesTitleTabs{
   width:250px;
}

.cookies_popup_text .cookiesContainerText{
   width:calc(100% - 250px);
}

.cookiesTitleTabs .tabItem{
    padding:15px 10px 15px 20px;
    background: #f4f4f4;
    border-bottom:1px solid #dedede;
    font-family: 'Syne-Regular';
    font-size: 16px;
    position: relative;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cookiesTitleTabs .tabItem::before{
    content:'';
    position: absolute;
    top:0px;
    left:0px;
    width:5px;
    height:0px;
    background: #8c3cfa;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cookiesTitleTabs .tabItem.active{
    background: #fff;
    border-bottom:1px solid #000;
}

.cookiesTitleTabs .tabItem.active::before{
    height:100%;
}

.cookiesContainerText{
    padding: 20px 15px 20px 15px;
}

.cookiesContainerText .textItem{
    display: none;
    font-family: 'Syne-Regular';
    font-size: 14px;
    line-height: 22px;
}

div.sub-title-choice {
   padding:15px 0px;
}

div.sub-title-choice strong{
    font-family: 'Syne-Medium';
    font-size: 1.1em;
    letter-spacing: 0.16px;
    font-weight: 600;
}

#cookies-popup .modal-footer{
    padding:20px 0px;
    border-top:1px solid #dedede;
}

.custom-control{
    display: flex;
    align-items: center;
}

.custom-control .toggle_avt_button{
    width:35px;
    height:10px;
    border-radius:10px;
    background: #767676;
    position:relative;
    cursor: pointer;
         -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.custom-control .toggle_avt_button.active{
     background: #8c3cfa;
}

.custom-control .toggle_avt_button::before{
    content: '';
    width:20px;
    height:20px;
    border-radius:50%;
    background: #4d4d4d;
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
     -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.custom-control .toggle_avt_button::after{
    content: '';
    width:22px;
    height:22px;
    border-radius:50%;
    background: none;
    border:2px solid rgba(0, 217, 152, 0);
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
     -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.custom-control .toggle_avt_button.active::before{
     background: #BA8AFC;
     left:calc(100% - 20px);
}

.custom-control .toggle_avt_button.active::after{
    left:calc(100% - 20px);
    border:2px solid rgba(0, 217, 152, 1);
}

.customerStoryBasicImg .customerLogo{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}

.customerStoryBasicImg .customerLogo img{
    width:260px;
    filter: brightness(1);
}

.inStory .titleComponent{
  font-family: 'Syne-Medium';
  font-size : 28px;
  color : #242833;
  margin-bottom:50px;
}

.inStory ul{
padding-inline-start:20px;
}

.helpAreaSearch{
    background: #f7f1ff;
    padding:60px 0px;
}

.helpAreaSearch .title{
  font-family: 'Syne-Bold';
  font-size : 56px;
  line-height : 65px;
  color : #8C3CFA;
  margin-bottom:10px;
}

.helpAreaSearch .subtitle{
  font-family: 'Syne-SemiBold';
  font-size : 24px;
  line-height : 35.71px;
  letter-spacing : 0.48px;
  color : #242833;
}

form#help_search_form{
    width:calc(100% - 30px);
    max-width: 950px;
    height: 57px;
    background: #fff;
    border:1px solid rgba(0,0,0,0.6);
    border-radius:30px;
    margin-top:50px;
    padding-left:50px;
    box-shadow:none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

form#help_search_form input{
    width:calc(100% - 50px);
    border:none;
    display: flex;
    align-items: center;
    font-family: 'Syne-Regular';
    font-size : 16px;
    color : #242833;
    outline:none;
}

form#help_search_form input::placeholder {
   color : #242833;
}

form#help_search_form::before{
    font-family: Font Awesome\ 5 Pro;
    content: '\f002';
    font-size : 16px;
    color : #8C3CFA;
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    left:20px;
}

form#help_search_form:focus-within, form#help_search_form:hover{
    border:1px solid rgba(0,0,0,0.2);
    box-shadow: 0 0 30px -5px rgba(0,0,0,0.5);
}

form#help_search_form button{
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    right:20px;
    border:none;
    outline:none;
    background: none;
    z-index: -1;
    opacity:0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

form#help_search_form button i{
    font-size: 16px;
    color:#222;
}

form#help_search_form:has(input:not(:placeholder-shown)) button{
    opacity:1;
    z-index:999;
}

.helpItem{
    max-width:318px;
    margin-top:70px;
}

.helpItem img{
  width:50px;
  margin-bottom:30px;
}

.helpItem .title{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  color : #242833;
  margin-bottom:15px;
}

.helpItem .text{
  min-height:125px;
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 24px;
  color : #242833;
}

.helpItem button{
    border:1px solid #8C3CFA;
    border-radius:30px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    width:177px;
    height:45px;
    font-family: 'Syne-Medium';
    font-size : 16px;
    letter-spacing : 0.16px;
    color : #8C3CFA;
}
.resultsAreaDefaultSubCategories.bordered{
    border-bottom:1px solid rgba(0,0,0,0.1);
}

.resultsAreaDefaultSubCategoriesFirstView{
    padding:20px 15px 120px 200px;
}

.helpCenterChildrenContent{
    max-width: 950px;
    margin:0 auto;
    padding:40px 15px 140px 15px;
}

.helpCenterChildrenContent.insideArticle{
   max-width:1140px;
}

.resultsAreaDefaultSubCategories .category-root{
    margin:0 auto;
    margin-bottom:50px;
}

.resultsAreaDefaultSubCategories.insideArticle .category-root{
    max-width: 920px;
}
.resultsAreaDefaultSubCategories .category-root a{
    font-family: 'Syne-Regular';
    font-size : 12px;
    color : #9499a8;
}

.resultsAreaDefaultSubCategories .category-root a:last-child{
    color:#515057
}

.resultsAreaDefaultSubCategories .category-root i:has(+ a:last-child){
    color:#515057
}

.resultsAreaDefaultSubCategories .categoryTitle{
  font-family: 'Syne-Bold';
  font-size : 42px;
  line-height : 49px;
  color : #8C3CFA;
  margin-bottom:20px;
}

.resultsAreaDefaultSubCategories .categoryTitle img{
  width:50px;
  margin-right:20px;
}

.resultsAreaDefaultSubCategories .categoryText{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 24px;
  color : #242833;
  margin-bottom:10px;
}

.resultsAreaDefaultSubCategories  .faqByCategoryTable{
   margin-top:50px;
   width:100%;
   padding:20px 30px;
   border:1px solid rgba(0,0,0,0.1);
   border-radius:10px;
}

.resultsAreaDefaultSubCategories  .faqByCategoryTable .title{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  color : #242833;
  width:100%;
  padding-bottom:20px;
  border-bottom: 1px solid rgba(0,0,0,0.1);
}
/* FAQ accordion (functional styles only) */
.faqByCategoryTable .faqItem{
    padding:20px 0px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.faqByCategoryTable .faqItem:last-child{
    border-bottom:none;
    padding:20px 0px 0px 0px;
}

.faqByCategoryTable .faqItem a{
    width:100%;
}
.faqByCategoryTable .faqItem a > div{
    width:100%;
  cursor: pointer;
  display: flex;
  /* align-items: center; */
  justify-content: space-between;
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 30px;
  color : #242833;
}
.faqByCategoryTable .faqItem a > div i{
  display: inline-block;
  font-size : 16px;
  line-height : 30px;
  color : #8C3CFA;

}

/* .container-fluid.helpCenterChildrenContent.insideArticle{

} */

.otherArticlesSameParentTitle{
  font-family: 'Syne-SemiBold';
  font-size : 12px;
  line-height : 18px;
  letter-spacing : 0.56px;
  color : #8C3CFA;
  margin-bottom:10px;
}

.otherArticlesSameParentItem a{
    font-family: 'Syne-SemiBold';
    font-size : 14px;
    line-height : 18px;
    letter-spacing : 0.56px;
    color:#242833;
    margin-bottom:15px;
}

.otherArticlesSameParentItem a.active{
    color : #8C3CFA;
}

.otherArticlesSameParentItem a i{
    margin-right:5px;
    margin-top:2px;
}

.otherArticlesSameParentTitleSeeMore{
  font-family: 'Syne-Regular';
  font-size : 14px;
  line-height : 18px;
  letter-spacing : 0.56px;
  color : #8C3CFA;
  text-decoration : underline;
}

.articleTitle{
    margin-top:20px;
    margin-bottom:55px;
    font-family: 'Syne-Medium';
    font-size : 28px;
    line-height : 37px;
    color : #242833;
}

.sectionsBox{
    padding:25px;
    width:100%;
    background: #f3ebfe;
    border-radius: 10px;
    margin-bottom:55px;
}

.sectionsBox .title{
  font-family: 'Syne-SemiBold';
  font-size : 12px;
  line-height : 30px;
  letter-spacing : 0.56px;
  color : #8C3CFA;
}

.sectionsBox .sectionItemTitle{
  font-family: 'Syne-Regular';
  font-size : 14px;
  line-height : 30px;
  letter-spacing : 0.56px;
  color : #242833;
  cursor: pointer;
}

.sectionsBox .sectionItemTitle.active{
    color : #8C3CFA;
}

.sectionsBox .sectionItemTitle span{
    margin-left:10px;
}

#footerArticle{
   height:80px;
   background: #f2f2f2;
   margin-top:100px;
   font-family: 'Syne-Regular';
   font-size : 14px;
   letter-spacing : 0.56px;
   color : #9499A8;
}

#footerArticle img{
    width:50px;
}

.sectionItem{
    margin-bottom:70px;
}

.sectionItem .title{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  line-height : 26px;
  color : #8C3CFA;
  margin-bottom:35px;
}

.sectionItem .title span{
  margin-left:10px;
}

.componentText .title{
  font-family: 'Syne-SemiBold';
  font-size : 16px;
  line-height : 27px;
  color : #515057;
}

.componentText .text{
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 27px;
  color : #515057;
}

.componentImage img{
    border-radius: 10px;
    box-shadow:5px 5px 20px 0px rgba(0,0,0,0.3);
}

.componentHighLight{
    padding:30px 35px;
    background: #f3ebfe;
    border-radius:10px;
    font-family: 'Syne-Regular';
    font-size : 16px;
    line-height : 27px;
    color : #242833;
}

.componentHighLight .title{
     font-family: 'Syne-SemiBold';
     display: flex;
     align-items: center;
     margin-bottom:10px;
    font-size : 16px;
     color : #242833;
}

.componentHighLight .title img{
    width:20px;
    margin-right:10px;
}

.voteSection{
    padding-top:50px;
    border-top:1px solid rgba(0,0,0,0.1);
}

.voteSection .title{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  line-height : 27px;
  color : #242833;
  margin-bottom:25px;
}

.voteButtons{
    margin-bottom:80px;
}

.voteButtons input{
    display: none;
}

.voteButtons .voteBtn{
   width:112px;
   height:47px;
   border-radius:30px;
   background: #9499a8;
   display: flex;
   align-items: center;
   font-family: 'Syne-SemiBold';
   font-size : 18px;
   line-height : 24.19px;
   color : #FFFFFF;
   cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.voteButtons .voteBtn .icon{
    background: #fff;
    color:#9499a8;
    border-radius:50%;
    width:17px;
    height:17px;
    border-radius:50%;
}

.voteButtons .voteBtn .icon i{
    color:#9499a8;
    font-size: 12px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.voteButtons .voteBtn:hover, .voteButtons .voteBtn:has(input:checked){
     background: #00d998;
}

.voteButtons .voteBtn:hover .icon i, .voteButtons .voteBtn:has(input:checked) .icon i{
      color: #00d998;
}

.voteSection  .restVoteArea{
   padding:45px 0px;
   background: #f7f1ff;
   border-radius:20px;
   width: 100%;
   max-width: 620px;
   margin:0 auto;
}

.voteSection  .restVoteArea .restVoteAreaIn{
  width:fit-content;
}

.voteSection  .restVoteArea .restVoteAreaIn .voteWhy, .voteSection .voteFooter{
    width:calc(100% - 30px);
    max-width: 400px;
    margin:0 auto;
}

.voteSection  .restVoteArea .restVoteAreaIn .voteWhyTitle{
  font-family: 'Syne-SemiBold';
  font-size : 20px;
  line-height : 27px;
  color : #242833;
  margin-bottom:30px;
}

/* Radio reason: tetragonismeno anti gia kyklo */
.voteReason input[type="radio"]{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width:13px;
    height:13px;
    border:1px solid rgba(0,0,0,0.6);
    border-radius:3px;
    background:#fff;
    margin:0 10px 0 0;
    cursor:pointer;
    position:relative;
    top:1px;
    flex-shrink:0;
    -webkit-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.voteReason {
  font-family: 'Syne-Regular';
  font-size : 16px;
  line-height : 29px;
  color : #242833;
}

.voteReason input[type="radio"]:checked{
    border-color:#9499a8;
    background:#fff;
}

.voteReason input[type="radio"]:checked::after{
    content:"";
    position:absolute;
    left:50%;
    top:45%;
    width:4px;
    height:8px;
    border:solid #000;
    border-width:0 2px 2px 0;
    -webkit-transform: translate(-50%,-50%) rotate(45deg);
    -ms-transform: translate(-50%,-50%) rotate(45deg);
    transform: translate(-50%,-50%) rotate(45deg);
}

.voteSection textarea{
    margin-top:15px;
    outline:none;
    border:none;
    width:100%;
    height:122px;
    border-radius:20px;
    padding:15px;
    font-family: 'Syne-Regular';
    font-size : 16px;
    color : #000;
}

.voteSection textarea::placeholder{
     color : #9499A8;
}

.voteSection .voteSubmit{
    outline: none;
    width:177px;
    height:45px;
    border-radius:30px;
    border:1px solid #8C3CFA;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Syne-Medium';
    font-size : 16px;
    letter-spacing : 0.16px;
    color : #8C3CFA;
    margin:0 auto;
    margin-top:25px;
    margin-bottom:25px;
}

.voteSection .voteFooter{
   max-width: 550px;
   font-family: 'Syne-Regular';
   font-size : 16px;
   line-height : 27px;
   color : #515057;
}

.voteSection .voteFooter a{
    color:#8c3cfa;
    text-decoration: underline;
}

.voteSection .voteResult {
   border-radius:50px;
   font-family: 'Syne-Regular';
   font-size : 16px;
   margin:0 auto;
   width:calc(100% - 30px);
   max-width:450px;
}

.voteSection .voteResult.voteError{
   margin-top:15px;
   padding:20px 15px;
   background: rgba(204,0,0,0.1);
   color:rgba(204,0,0,0.8);
}

.voteSection .voteResult.voteOk{
   margin-top:15px;
   padding:20px 15px;
   background:1px solid rgba(0,204,0,0.2);
   color:rgb(0,204,0);
}

/* ── Help Center search results ───────────────────────────── */
.helpSearchResults{
    max-width:950px;
    width:calc(100 - 30px);
    margin:0 auto;
    padding:40px 15px 120px 15px;
}

.helpSearchResults .resultsTitle{
    font-family:'Syne-Regular';
    font-size:20px;
    line-height:27px;
    color:#9499a8;
    margin-bottom:30px;
}

.helpSearchResults .resultsTitle strong{
    font-family:'Syne-SemiBold';
    color:#242833;
}

.helpSearchResultsList{
    display:flex;
    flex-direction:column;
}

.helpSearchResultsList .helpResultItem{
    display:block;
    border:1px solid rgba(0,0,0,0.1);
    border-radius:12px;
    padding:25px 30px;
    margin-bottom:20px;
    text-decoration:none;
    -webkit-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
}

.helpSearchResultsList .helpResultItem:hover{
    border-color:#8C3CFA;
    -webkit-box-shadow:0 6px 20px rgba(140,60,250,0.08);
    box-shadow:0 6px 20px rgba(140,60,250,0.08);
}

.helpSearchResultsList .helpResultTitle{
    font-family:'Syne-SemiBold';
    font-size:20px;
    line-height:27px;
    color:#242833;
    margin-bottom:12px;
}

.helpSearchResultsList .helpResultItem:hover .helpResultTitle{
    color:#8C3CFA;
}

.helpSearchResultsList .helpResultText{
    font-family:'Syne-Regular';
    font-size:16px;
    line-height:26px;
    color:#515057;
}

.helpSearchResultsList .helpResultText strong{
    font-family:'Syne-SemiBold';
    font-weight:normal;
    color:#242833;
}

.signUpTabel{
    margin-top:100px;
}

/* ==========================================================================
   Slideshow: κωδικας απο τη βαση (slideshow_photo.code_gr / code_en)
   Μπαινει στη θεση της εικονας/βιντεο του half slider (.slider-code-player).
   Το markup ερχεται απο το optisleek-solution.html (hero-visual / hero-loop).
   ΣΗΜ.: δεν χρησιμοποιουμε CSS variables εδω - τα χρωματα μπαινουν κατευθειαν,
   ωστε το block να δουλευει αυτονομα μεσα στο slideshow.
   ========================================================================== */

.slider-code-player {
    width: 100%;
    max-width: 520px;
}

.slider-code-player .hero-visual,
.hero-visual {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 24px;
    padding: 26px;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.loop-node {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border-radius: 16px;
    padding: 14px 18px;
    color: #1C1B22;
}

.loop-ico {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #F1EAFE;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.loop-ico svg {
    width: 22px;
    height: 22px;
    stroke: #8C3CFA;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.loop-node:nth-of-type(3) .loop-ico { background: #E2F6F4; }
.loop-node:nth-of-type(3) .loop-ico svg { stroke: #0FA79E; }
.loop-node:nth-of-type(5) .loop-ico { background: linear-gradient(135deg, #F1EAFE, #E2F6F4); }

.loop-name {
    display: block;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.1px;
}

.loop-desc {
    display: block;
    font-size: 12.5px;
    color: #55535F;
}

.loop-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    padding: 6px 0;
}

.loop-link svg {
    width: 20px;
    height: 20px;
    stroke: rgba(255, 255, 255, 0.85);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.loop-back {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed rgba(255, 255, 255, 0.4);
    color: rgba(255, 255, 255, 0.9);
    font-size: 12.5px;
}

.loop-back svg {
    width: 46px;
    height: 22px;
    flex-shrink: 0;
}

/* ==========================================================================
   Codebox: παραθυρο κωδικα απο τη βαση (slideshow_photo.code_gr / code_en)
   Markup απο το developers.html (.codebox / .code-head / .tok-*).
   Ιδια λογικη με το hero-loop πιο πανω: χωρις CSS variables, ωστε το block να
   δουλευει αυτονομα οπου κι αν κολληθει.

   ΠΡΟΣΟΧΗ ΣΤΑ CONFLICTS - το Bootstrap οριζει ηδη:
     code { font-size:87.5%; color:#e83e8c; word-wrap:break-word }   -> ροζ γραμματα
     pre  { display:block; font-size:87.5%; color:#212529 }          -> σκουρο σε σκουρο
     pre  { white-space:pre-wrap !important }                        -> σπαει τις γραμμες
   Γι' αυτο τα .codebox pre / .codebox code ξαναδηλωνουν ρητα χρωμα και μεγεθος,
   και το white-space θελει ΚΑΙ αυτο !important για να νικησει το δικο του.
   Το .dot ειναι πολυ γενικο ονομα - μενει ΠΑΝΤΑ κατω απο το .codebox.
   ========================================================================== */

.codebox {
    background: #1F1E27;
    border: 1px solid #33323E;
    border-radius: 16px;
    overflow: hidden;
    font-size: 13px;
    line-height: 1.7;
    text-align: left;
}

.codebox .code-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid #33323E;
}

.codebox .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.codebox .code-title {
    margin-left: auto;
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: 0.05em;
}

.codebox pre {
    margin: 0;
    padding: 18px 20px;
    overflow-x: auto;
    /* Νικαει το pre-wrap!important του Bootstrap: ο κωδικας δεν πρεπει να
       σπαει σε τυχαιο σημειο - καλυτερα οριζοντια κυλιση. */
    white-space: pre !important;
    font-family: 'SF Mono', ui-monospace, 'Cascadia Code', Menlo, Consolas, monospace;
    font-size: 13px;
    line-height: 1.7;
    color: #E6E4F0;
    background: none;
    border: none;
}

.codebox code {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background: none;
    padding: 0;
    border-radius: 0;
    word-wrap: normal;
    word-break: normal;
}

.codebox .tok-k { color: #B07CFF; }
.codebox .tok-s { color: #5FE3D5; }
.codebox .tok-c { color: #6E6C7E; }
.codebox .tok-n { color: #F2C97D; }

/* Οταν το codebox μπαινει στη θεση της εικονας του half slider */
.slider-code-player .codebox {
    max-width: 520px;
}

/* ==========================================================================
   Ισοϋψεις καρτες banner (bannerCardsStyle2)
   Το .row του Bootstrap ειναι flex, αρα οι στηλες ειναι ΗΔΗ ισοϋψεις
   (align-items:stretch). Αυτο που δεν γεμιζε ητανε η ιδια η καρτα μεσα στη
   στηλη - γι' αυτο καθε καρτα επαιρνε το υψος του περιεχομενου της.
   ========================================================================== */

/* --- A. Grid ---
   Ισχυει σε ΚΑΘΕ αναλυση. Ηταν κλειδωμενο σε @media (min-width:1400px) με τον
   φοβο οτι το width:100% θα εσπαγε το carousel πιο κατω απο εκει. Δεν το σπαει:
   ο selector ζηταει ".row > [class*=col-]", ενω το carousel ΔΕΝ εχει ουτε .row
   ουτε στηλες (markup: .cardsContainer > .bannerCarousel > .sliderItem).
   Ετσι, οταν το banner ΔΕΝ εχει responsive carousel, οι καρτες ηταν ανισοϋψεις
   σε ολα τα πλατη κατω απο 1400. */

.cardsContainer .row > [class*="col-"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
}

.cardsContainer .row > [class*="col-"] > .cardBannerItem.bannerCardsStyle2 {
    width: 100%;
    height: 100%;
    /* το περιεχομενο ξεκιναει απο πανω - αλλιως με align-items:center θα
       "επλεε" στη μεση οταν η καρτα ψηλωνει */
    align-items: flex-start !important;
}

/* --- B. Carousel ---
   Το owl βαζει τα .owl-item δικα-δικα με inline width, οποτε το καθενα παιρνει
   το υψος του περιεχομενου του - γι' αυτο οι καρτες εβγαιναν ανισες και
   μετατοπισμενες. Κανοντας το .owl-stage flex container, ολα τα slide της ιδιας
   σελιδας τεντωνονται στο ψηλοτερο (align-items:stretch, το default).

   ΤΟ height:auto ΕΙΝΑΙ ΑΠΑΡΑΙΤΗΤΟ: το owl γραφει inline height στα .owl-item
   οταν τρεχει με autoHeight, που θα ακυρωνε το stretch.
   ΤΟ flex-shrink:0 ΕΠΙΣΗΣ: το πλατος του καθε slide το οριζει το owl inline,
   και χωρις αυτο το flex θα το μαζευε. */

.owl-carousel.bannerCarousel .owl-stage {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.owl-carousel.bannerCarousel .owl-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: auto;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.owl-carousel.bannerCarousel .sliderItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
}

.owl-carousel.bannerCarousel .sliderItem > .cardBannerItem,
.owl-carousel.bannerCarousel .owl-item > .cardBannerItem {
    width: 100%;
    /* max-width:380px παραμενει απο τον βασικο κανονα - το margin:0 auto ειναι
       που κραταει την καρτα κεντραρισμενη μεσα στο slide οταν το slide ειναι
       πιο φαρδυ απο 380. */
    margin: 0 auto;
    -ms-flex-align: start;
    align-items: flex-start !important;
}

/* ==========================================================================
   Slideshow: το δεξι περιεχομενο (video/gif ή κωδικας απο τη βαση) να
   εμφανιζεται ΜΑΖΙ με το κειμενο, οχι πριν απο αυτο.

   Το .title/.subtitle/.text ειχαν ηδη opacity:0 + κλαση .view. Τα
   .video-gif-player / .slider-code-player δεν ειχαν, οποτε φαινονταν αμεσως
   ενω το κειμενο περιμενε. Ακολουθουν τωρα το ιδιο μοτιβο.
   ========================================================================== */

.slider-container .video-gif-player,
.slider-container .slider-code-player {
    opacity: 0;
    transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
}

.slider-container .video-gif-player.view,
.slider-container .slider-code-player.view {
    opacity: 1;
}