.lighting-thumbnail{
    position: absolute;
    bottom: 110px;
    left: 70px;
}
.lighting-thumbnail > div svg text {font-family: "sofia-pro", "Tektur", sans-serif;font-size: 2rem;line-height: 4.5rem;text-align: left;letter-spacing: 0px;color: #ffffff;font-weight: lighter;}

main[data-lang="el"] .lighting-thumbnail > div svg text {
    font-size: 1.5rem;
}
.explore{
    background-color: black;
    width: 100%;
    display: grid;
    justify-content: center;
    grid-template-columns: auto;
    padding-top: 150px;
    padding-bottom: 100px;
}
.explore .content {
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto;
    justify-items: center;
    gap: 140px;
    padding-top: 100px;
}
.explore .content > div.top {position: relative;}
.explore .content > div.top > div.icon {position: relative;margin-bottom: 5px;/* top: -120px; */left: -110px;}
.explore .content > div.top > div.top-pic {
    width: 300px;
    height: 300px;
    display: grid;
    place-content: center;
}
.explore .content > div.top > div.top-pic img {
    width: 500px;
    height: auto;
}
.explore .content > div.bottom > div.subheader {padding-bottom: 50px;width: 90%;max-width: 1000px;margin: 0 auto;}
.explore .content > div.bottom > div.subheader h3 {
    text-align: left;
    font-size: 2.4rem;
    font-weight: 400;
    font-family: Sofia Sans Condensed, "Tektur", sans-serif;
    letter-spacing: 1.8px;
    color: #b12efd;
    text-transform: uppercase;
    opacity: 1;
}
.explore .content > div.bottom > div.subheader h4 {
    text-align: left;
    font-size: 1.6rem;
    font-weight: normal;
    font-family: Sofia Sans Condensed, "Tektur", sans-serif;
    letter-spacing: 0.8px;
    color: #b12efd;
    text-transform: uppercase;
    opacity: 1;
}
.explore .content > div.bottom > div.header {
    padding-bottom: 30px;
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
}
.explore .content > div.bottom > div.header h4 {
    text-align: left;
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 1;
    font-size: 3.5rem;
    font-weight: lighter;
    color: #ffffff;
}

main[data-lang="el"] .explore .content > div.bottom > div.header h4 {
    font-family: "Manrope", "Tektur", sans-serif;
}
.explore .content > div.bottom > div.header h3 {
    text-align: left;
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 1;
    font-size: 3.5rem;
    font-weight: lighter;
    color: #ffffff;
}
.explore .content > div.bottom > div.text {
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
}
.explore .content > div.bottom > div.text p {
    font-size: 2rem;
    line-height: 3.5rem;
    text-align: left;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
}
.benefits {
    background-color: black;
    width: 100%;
    display: grid;
    grid-template-columns: auto;
    overflow: hidden;
    position: relative;
    padding-bottom: 150px;
}
.benefits .circle {
    height: 100%;
    width: 100dvw;
    z-index: 1;
    position: absolute;
    right: 0;
    top: 0px;
    display: grid;
}
.benefits > .content {
    z-index: 1;
    display: grid;
    grid-template-columns: auto;
    width: 100%;
    /* padding-top: 200px; */
}
.benefits .content > div.header {
    padding-bottom: 100px;
    justify-self: center;
}
.benefits .content > div.main > div.main-top {
    display: grid;
    grid-template-columns: auto 900px auto;
    grid-template-rows: 1000px;
    position: relative;
    padding-bottom: 200px;
}
.benefits .content > div.main > div.main-top > div.main-top-left {
    display: grid;
    align-self: start;
    justify-self: end;
    align-content: baseline;
    height: fit-content;
    width: fit-content;
    position: relative;
    left: 100px;
}


.benefits .content > div.main > div.main-top > div  div.blue-icon {
    position: relative;
    left: -113px;
    bottom: -35px;
}
.benefits .content > div.main > div.main-top > div div.main-top-pic {
    width: 320px;
    height: auto;
}
.benefits .content > div.main > div.main-top > div div.main-top-pic img {
    width: 100%;
    height: auto;
}
.benefits .content > div.main > div.main-top > div div.text {
    width: 280px;
    padding-left: 15px;
}
.benefits .content > div.main > div.main-top > div.main-top-middle {
    width: 900px;
    height: auto;
    display: grid;
    align-self: center;
    justify-content: center;
}
.benefits .content > div.main > div.main-top > div.main-top-middle figure {
    position: relative;
}
img.products-crestron-main-img:last-child {
    visibility: hidden;
    position: absolute;
    left: 0;
    opacity: 0;
    transition: 0.3s;
}
.benefits .content > div.main > div.main-top > div.main-top-middle img {
    width: 100%;
    height: auto;
}
.benefits .content > div.main > div.main-top > div.main-top-middle figure:hover img.products-crestron-main-img:last-child  {
    opacity:1;
    visibility:visible;
}
.benefits .content > div.main > div.main-top > div.main-top-right {
    display: grid;
    align-self: end;
    justify-content: start;
    height: fit-content;
    width: fit-content;
    position: relative;
    left: -100px;
}

.benefits .content > div.main > div.main-top > div.main-top-right.visible {
    opacity: 1;
}
.benefits .circle div:first-child {
    height: 3000px;
    width: 3000px;
    background: radial-gradient(circle, rgba(84, 6, 131, 1) 0%, rgb(0 0 0) 50%, rgba(84, 6, 131, 0) 51%);
    z-index: 0;
    position: absolute;
    right: -1595px;
    top: -400px;
    display: grid;
}

.benefits .circle div:last-child {
    height: 2500px;
    width: 2500px;
    background: radial-gradient(circle, rgba(84, 6, 131, 1) 0%, rgb(0 0 0) 50%, rgba(84, 6, 131, 0) 51%);
    z-index: 0;
    position: absolute;
    left: -1000px;
    bottom: 1000px;
    display: grid;
}
.benefits > .header {
    display: grid;
    justify-content: center;
    padding-top: 250px;
    z-index: 1;
}
.benefits .header h3 {
    letter-spacing: 6.5px;
    text-transform: uppercase;
    font-style: normal;
    line-height: 13rem;
    font-weight: normal;
    font-size: 13rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    color: #FFFFFF;
}
main[data-lang="el"] .benefits .header h3 {font-size: 10rem;}

main[data-lang="el"] .benefits .customization > div > div.header h3 {
    font-size: 3.5rem;
}
.main-top p {
    color: #ffffff;
    font-size: 2rem;
    line-height: 2.5rem;
    letter-spacing: 0px;
    opacity: 1;
}

main[data-lang="el"] .main-top p {
    font-size: 1.8rem;
    line-height: 2.3rem;
}
.products-video{
    background: black;
    display: grid;
    justify-content: center;
    grid-template-columns: auto;
    padding-bottom: 150px;
    padding-left: 50px;
    padding-right: 50px;
    width: 100%;
}
.products-video .pic {
    max-width: 1340px;
    padding-top: 130px;
}
.products-video .pic picture img {
    width: 100%;
    height: auto;
}
.home-products.child-products{
    background: black;
}

.home-products > div.child-products-content-box {
    z-index: 1;
    position: relative;
}


.home-products.child-products > div > div.icon {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: auto auto;
    height: fit-content;
    gap: 3px;
    width: 113px;
    padding: 5px;
    position: relative;
    margin-bottom: -120px;
    left: -115px;
}

.home-products.child-products > div > div.icon > div {
    background: #b12efd;
}

.home-products.child-products > div.icon > div {
    background: #b12efd;
}

.home-products.child-products > div > div.icon .top {
    width: 75px;
    height: 75px;
    justify-self: start;
}

.home-products.child-products > div > div.icon .bottom {
    width: 25px;
    height: 25px;
    justify-self: end;
}
section.home-products.child-products .circle div:last-child {
    background: radial-gradient(circle, rgba(84, 6, 131, 1) 0%, rgb(0 0 0) 50%, rgba(84, 6, 131, 0) 51%);
}
.home-products.child-products > div > div.text {
    display: grid;
    justify-self: center;
    justify-content: center;
    width: 95%;
    max-width: 900px;
    padding-top: 120px;
    z-index: 1;
}
.home-products.child-products > div.subheader {
    /* background: yellowgreen; */
    justify-content: start;
    max-width: 1340px;
}
.home-products.child-products > div.subheader h4 {
    font-style: normal;
    font-weight: normal;
    font-size: 4rem;
    text-align: left;
    letter-spacing: 2px;
    color: #FFFFFF;
    text-transform: uppercase;
    opacity: 1;
    line-height: unset;
}
.home-products.child-products > div.products {
    padding-top: 200px;
}
.home-products.child-products > div.products div.subheader {grid-column: span 2;width: 100%;max-width: unset;justify-content: start;padding-top: unset;padding-bottom: 20px;}
.home-products.child-products > div.products div.subheader h4 {
    text-transform: uppercase;
    font-size: 4rem;
    font-weight: 100;
    line-height: unset;
}
.home-products.child-products > div > div.text p {
    font-size: 2rem;
    /* line-height: 6rem; */
    /* text-align: center; */
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
}

main[data-lang="el"] .home-products.child-products > div > div.text p {
    font-family: "Manrope", "Tektur", sans-serif;
}
.main-bottom h5{text-align: left;font-size: 2.5rem;font-weight: normal;font-family: Sofia Sans Condensed, "Tektur", sans-serif;letter-spacing: 0.8px;text-transform: uppercase;opacity: 1;color: #b12efd;}
.main-bottom h4{
    text-align: left;
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 1;
    font-size: 3.5rem;
    font-weight: 100;
    color: #ffffff;
    line-height: 5rem;
}

main[data-lang="el"] .main-bottom h4 {
    font-family: "Manrope", "Tektur", sans-serif;
    font-weight: 400;
}
.main-bottom p{
    font-size: 2rem;
    line-height: 4rem;
    letter-spacing: 0px;
    opacity: 1;
    color: #ffffff;
}

main[data-lang="el"] .main-bottom p {
    font-family: "Manrope", "Tektur", sans-serif;
}
.main-bottom .img {width: auto;object-fit: contain;max-width: 600px;}

.main-bottom .img figure {overflow: hidden;}
.main-bottom .img img {
     width: 100%;
     max-height: 350px;
     height: auto;
}



.benefits .content > div.main > div.main-bottom {
    display: grid;
    width: 90%;
    max-width: 1353px;
    margin: 0 auto;
}

.benefits div.main-bottom .description-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
    padding-bottom: 250px;
    align-items: center;
}

.lighting_content_1 .content {}

.benefits div.main-bottom .description-child[data-content-cat="security_content_1"] {align-items: center;}

.benefits div.main-bottom .description-child[data-content-cat="security_content_2"] {
    align-items: end;
}

.benefits div.main-bottom .description-child[data-content-cat="schedules_content_1"] {
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="schedules_content_3"] {
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="schedules_content_5"] {
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="schedules_content_6"] {}

.benefits .main-bottom .description-child.double[data-content-cat="shades_content_3"] > div .content-b .icon.blue-icon {
    display: none;
}

.benefits div.main-bottom .description-child[data-content-cat="hvac_content_1"] {
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="keypad_configuration_content_5"] {
    padding-bottom: unset;
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="schedules_content_6"] {
    padding-bottom: unset;
    align-items: center;
}

.benefits div.main-bottom .description-child[data-content-cat="audio_content_4"] {
    padding-bottom: unset;
}

.benefits div.main-bottom .description-child[data-content-cat="video_content_4"] {
    padding-bottom: unset;
}

.benefits div.main-bottom .description-child.inverted[data-content-cat="video_content_4"] .img-div {
    align-items: center;
}

.tabs[data-tab-section="2"] .tab-area-b > div .description-child {
    padding-bottom: unset;
}

.tabs[data-tab-section="3"] .tab-area-b > div .description-child {
    padding-bottom: unset;
}

.tabs[data-tab-section="4"] .tab-area-b > div .description-child {
    padding-bottom: unset;
}

.benefits div.main-bottom .description-child.double-picture {
    grid-template-columns: auto;
}

.benefits div.main-bottom .description-child.double-picture.title-right .title-div {
    width: 50%;
    justify-self: end;
}

.benefits div.main-bottom .description-child.double-picture .title-div .features-header {
    padding-bottom: 20px;
}

.benefits div.main-bottom .description-child.double-picture > div.content-div {display: grid;gap: 50px;}

.benefits div.main-bottom .description-child.double-picture > div.content-div .content-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.benefits div.main-bottom .description-child.double-picture > div.content-div .content-child {}

.benefits div.main-bottom .description-child.double-picture[data-content-cat="keypad_configuration_content_2"] > div.content-div .content-child {
    align-items: center;
}

.benefits div.main-bottom .description-child.double-picture[data-content-cat="keypad_configuration_content_3"] > div.content-div .content-child {
    align-items: center;
}

.benefits div.main-bottom .description-child.double-picture[data-content-cat="keypad_configuration_content_4"] > div.content-div .content-child {
    align-items: center;
}

.benefits div.main-bottom .description-child.double-picture > div.content-div .content-child.inverted .content {
    grid-row: 1;
    grid-column: 2;
}

.benefits div.main-bottom .description-child.double-picture > div.content-div .content-child.inverted .img-div {justify-items: start;}

.benefits div.main-bottom .description-child.double {
    /* align-items: center; */
}

.benefits div.main-bottom .description-child.double[data-content-cat="lighting_content_5"] .content-b > div.icon.blue-icon {
    display: none;
}

.benefits div.main-bottom .description-child.double[data-content-cat="security_content_3"] {
    padding-bottom: unset;
}

.benefits div.main-bottom .description-child.inverted .content {
    grid-column: 2;
    grid-row: 1;
}

.benefits div.main-bottom .description-child .content {
    position: relative;
    align-content: start;
    z-index: 1;
    display: grid;
    width: unset;
}


/* css gia fadein effect - arxi  */

.fade-in {
    opacity: 0;
    transition: opacity 4s ease;
}

.fade-in.visible {
    opacity: 1;
}

/* css gia fadein effect - telos  */


/* css gia sliding effect - arxi  */

.slide-from-left {
    opacity: 0;
    transform: translateX(-200px);
    transition: all 1s ease;
}
.slide-from-left.visible{
    opacity: 1;
    transform: translateX(0);
}
.slide-from-right{
    opacity: 0;
    transform: translateX(200px);
    transition: all 1s ease;
}
.slide-from-right.visible{
    opacity: 1;
    transform: translateX(0);
}
/* css gia sliding effect - arxi  */




.benefits div.main-bottom .description-child.double .content {gap: 20px;}

.benefits div.main-bottom .description-child.double .content > div {
    position: relative;
}

.benefits div.main-bottom .description-child.inverted .img-div {
    grid-column: 1;
    grid-row: 1;
    justify-items: start;
}

.benefits .main-bottom .description-child .features-header {
    padding-bottom: 40px;
}

.benefits .main-bottom .tabs .tab-area-b .features-header {
    padding-bottom: unset;
}

.benefits .main-bottom .description-child .subheader {
    padding-bottom: 5px;
}

.benefits .main-bottom .description-child .icon.blue-icon {
    position: relative;
    margin-bottom: 0px;
    left: -80px;
    width: 75px;
}

.benefits .main-bottom .tabs .description-child .icon.blue-icon {
    margin-bottom: -80px;
}


.benefits .main-bottom .description-child.double .content-a .icon.blue-icon {/* display: unset; */}

.benefits .main-bottom .description-child.double > div .icon.blue-icon {
    /* display: none; */
}

.benefits div.main-bottom .description-child.double[data-content-cat="security_content_3"] .content-b .icon.blue-icon, .benefits div.main-bottom .description-child.double[data-content-cat="security_content_3"] .content-c .icon.blue-icon {
    display: none;
}

.benefits .main-bottom .description-child.double .content-a .features-header {
    display: block;
}

.benefits .main-bottom .description-child.double > div .features-header {
    display: none;
}

.benefits .main-bottom .description-child .icon.blue-icon .top {
    width: 45px;
    height: 45px;
}

.custom-extra-content > div .icon .top {
}

.benefits .main-bottom .description-child .icon.blue-icon .bottom {width: 16px;height: 16px;margin: unset;}

.benefits div.main-bottom .description-child .img-div {
    display: grid;
    justify-items: end;
}

.benefits div.main-bottom .description-child[data-content-cat="lighting_content_5"] .img-div {
}

.benefits div.main-bottom .description-child[data-content-cat="video_content_3"] .img-div {
    /* background: bisque; */
    align-items: center;
}

.benefits .content > div.main > div.main-bottom .title {
    display: flex;
    width: 100%;
    justify-self: center;
}
.benefits .content > div.main > div.main-bottom .title h4 {
    letter-spacing: 1px;
    text-transform: uppercase;
    font-style: normal;
    line-height: 0rem;
    font-weight: normal;
    font-size: 4rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.benefits .content > div.main > div.main-bottom .title span {
    color: #ffffff;
    font-size: 2rem;
    line-height: 2rem;
    letter-spacing: 0px;
    opacity: 1;
    text-align: left;
}
.benefits .content > div.main > div.main-bottom .flex-box {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 {width: 100%;}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 50px 15px 80px 15px;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box .one-box-child {
    display: grid;
    grid-template-columns: auto;
    gap: 20px;
    width: 100%;
    max-width: 650px;
    justify-items: center;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2.sm-img .one-box .one-box-child {
    justify-content: start;
    padding-left: 20px;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box .one-box-child.right {
    padding-left: 20px;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box .one-box-child > div.content {justify-self: start;}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box .one-box-child .img {
    width: 100%;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2.sm-img .one-box .one-box-child .img {
    width: 320px;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box .one-box-child .img img {
    width: 100%;
    height: auto;
}
.benefits .grey {
    background: #272727;
}
.benefits .border-grey {
    border: 5px solid #272727;
}
.benefits .gradient {
    background: transparent linear-gradient(236deg, #0082FF 0%, #4C33FF 16%, #9105E2 32%, #b12efd 56%, #8C04DB 68%, #5D0094 78%, #09000F 95%, #000000 100%) 0% 0% no-repeat padding-box;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-1.inverted {
    flex-direction: row-reverse;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-2 .one-box.inverted {
    flex-direction: row-reverse;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-3.inverted {
    flex-direction: row-reverse;
}
.benefits .content > div.main > div.main-bottom .flex-box.box-4.inverted {
    flex-direction: row-reverse;
}

/* Tabs arxi */

.benefits .main-bottom .tabs {
    display: grid;
    grid-template-columns: auto;
    padding-left: 10px;
    padding-right: 10px;
    gap: 150px;
    padding-bottom: 150px;
    padding-top: unset;
}

.benefits .main-bottom .tabs[data-tab-section="3"] {
    padding-top: 100px;
}

.benefits .main-bottom .tabs[data-tab-section="4"] {
    padding-top: 100px;
}

.benefits .main-bottom .tabs[data-tab-section="2"] .tab-area-b {
    /* background: blueviolet; */
    min-height: 410px;
}

.benefits .main-bottom .tabs[data-tab-section="3"] .tab-area-b {
    /* background: blueviolet; */
    min-height: 410px;
}

.benefits .main-bottom .tabs[data-tab-section="4"] .tab-area-b {
    /* background: blueviolet; */
    min-height: 410px;
}


.benefits .main-bottom .tabs[data-tab-section="1"] .tab-area-b {
    min-height: 400px;
    /* background: blue; */
}


.benefits .main-bottom .tabs .tab-area-b h4 {
    display: none;
}

.benefits .main-bottom .tabs .tab-area-b h5 {
    text-align: left;
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 1;
    font-size: 3rem;
    font-weight: 700;
    color: #ffffff;
    line-height: 5rem;
}
.benefits .main-bottom .benefit-box-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-left: 10px;
    padding-right: 10px;
    gap: 50px;
}

.benefits .main-bottom .benefit-box-info[data-content-cat=hvac_content_4] {}

.benefits .main-bottom .benefit-box-info[data-content-cat=hvac_content_4] .box > div {
    min-height: 1050px;
}
.benefits .main-bottom .benefit-box-info .box .box-child {display: grid;justify-items: center;gap: 50px;padding-top: 50px;padding-bottom: 50px;padding-left: 20px;padding-right: 20px;}

.benefits .main-bottom .benefit-box-info[data-content-cat=shades_content_4] .box > div {
    min-height: 950px;
}

.benefits .main-bottom .benefit-box-info[data-content-cat=shades_content_4] .box .box-child .content {
    min-height: 325px;
    /* background: blueviolet; */
}

.benefits .main-bottom .benefit-box-info[data-content-cat=lighting_content_8] .box > div {
    min-height: 950px;
}

.benefits .main-bottom .benefit-box-info[data-content-cat=lighting_content_8] .box .box-child .content {
    min-height: 325px;
    /* background: blueviolet; */
}





.benefits .main-bottom .benefit-box-info .box .box-child .content {
    width: 90%;
    z-index: unset;
    padding-top: unset;
}

.benefits .main-bottom .benefit-box-info[data-content-cat=hvac_content_4] .box .box-child .content {
    min-height: 450px;
    /* background: blueviolet; */
}

.benefits .main-bottom .benefit-box-info .box .box-child .cta {
    transition: transform 1s;
}

.benefits .main-bottom .benefit-box-info .box .box-child .cta:hover {
    cursor: pointer;
    transform: scale(1.1);
}
.benefits .main-bottom .benefit-box-info .box .box-child .content .header {
    padding-bottom: 50px;
}
.benefits .main-bottom .benefit-box-info .box .box-child .cta a {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 10px;
}
.benefits .main-bottom .benefit-box-info .box .box-child .cta a > div.cta-arrow {
    background: #b12efd;
    width: 40px;
    height: 40px;
    display: grid;
    place-content: center;
}
.benefits .main-bottom .benefit-box-info .box .box-child .cta a > div.cta-arrow i {
    color: white;
    font-size: 2rem;
}
.benefits .main-bottom .benefit-box-info .box .box-child .cta a > div p {
    letter-spacing: 1.44px;
    font-size: 2rem;
}
.benefits .main-bottom .tabs .tab-area-b {
    display: grid;
    width: 100%;
    bottom: 24px;
}


.tabs[data-tab-section="1"] .tab-area-b > div .description-child {padding-bottom: unset;}
.benefits .main-bottom .tabs .tab-area-a {display: flex;flex-wrap: wrap;z-index: 1;gap: 10px;background: #272727;background: #3f0561;background: #b12efd;background: #B02BFD;justify-content: center;padding: 10px;border-radius: 10px;width: fit-content;margin: 0 auto;position: relative;}

.benefits .main-bottom .tabs .tab-area-a .selector {
    height: 100%;
    display:inline-block;
    position:absolute;
    left:0px;
    top:0px;
    z-index: 2;
    transition-duration:0.6s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    margin-top: 10px;
}
.benefits .main-bottom .tabs .tab-area-a > div {
    display: grid;
    z-index: 1;
}

.benefits .main-bottom .tabs .tab-area-a > div > div {
    opacity: 1;
    padding: 8px 23px;
    cursor: pointer;
    transition: 0.5s linear 0s;
}


.benefits .main-bottom .tabs > div .title-div h5 {
    color: white;
}

.benefits .main-bottom .tabs > div .title-div span {
    text-align: left;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: Sofia Sans Condensed, "Tektur", sans-serif;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    opacity: 1;
    color: white;
}

.benefits .main-bottom .tabs .tab-area-b > div.hide {
    display: none;
}


main[data-lang="el"] .benefits .main-bottom .tabs .tab-area-b p{
    font-family: "Manrope", "Tektur", sans-serif;
}

/* Tabs telos */




@supports (-webkit-touch-callout: none) {
    .main-bottom .img img {
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 350px;
        object-fit: contain;
    }
}


@media screen and (max-width: 1600px) {
    .benefits .header h3{font-size: 10rem;}

    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 8rem;
    }

    .benefits .content > div.main > div.main-top{
        grid-template-columns: auto auto;
        grid-template-rows: auto auto;
        gap: 50px;
    }
    .benefits .content > div.main > div.main-top > div.main-top-left{
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        align-self: unset;
        align-content: unset;
        position: relative;
        top: -113px;
        left: unset;
    }
    .benefits .content > div.main > div.main-top > div.main-top-middle{
        max-width: 60%;
        grid-column: 1 / 3;
        grid-row: 1 / 2;
        justify-self: center;
    }
    .benefits .content > div.main > div.main-top > div.main-top-right{
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        align-self: unset;
        align-content: unset;
        position: unset;
        left: unset;
    }

    .benefits div.main-bottom .description-child{
        grid-template-columns: 600px;
        justify-content: center;
        justify-items: center;
    }

    .benefits div.main-bottom .description-child.double-picture .title-div {
        width: 100%;
    }

    .benefits div.main-bottom .description-child.double-picture.title-right .title-div {
        width: 100%;
        justify-self: auto;
    }

    .benefits div.main-bottom .description-child.double-picture > div.content-div .content-child{
        grid-template-columns: 600px;
        justify-content: center;
        justify-items: center;
        gap: 50px;
    }

    .benefits div.main-bottom .description-child.double-picture > div.content-div {
        gap: 100px;
    }

    .benefits div.main-bottom .description-child.double-picture > div.content-div .content-child.inverted .content {
        grid-row: unset;
        grid-column: unset;
    }

    .benefits .main-bottom .benefit-box-info {
        grid-template-columns: 600px;
        justify-content: center;
        justify-items: center;
    }

    .benefits div.main-bottom .description-child.inverted .img-div {
        grid-column: 1;
        grid-row: 2;
    }

    .benefits div.main-bottom .description-child.inverted .content {
        grid-column: 1;
        grid-row: 1;
    }

    .benefits .main-bottom .tabs[data-tab-section="1"]{
        /* background: chocolate; */
        max-height: 1000px;
    }

    .benefits .main-bottom .tabs[data-tab-section="1"] .tab-area-b{min-height: 550px;}

    .benefits .main-bottom .tabs[data-tab-section="2"] .tab-area-b{
        min-height: 830px;
    }

    .benefits .main-bottom .tabs[data-tab-section="3"] .tab-area-b{
        min-height: 830px;
    }

    .benefits .main-bottom .tabs[data-tab-section="4"] .tab-area-b{
        min-height: 750px;
    }

}


@media screen and (max-width: 1366px) {
    .benefits > .content{
        padding-top: 160px;
    }
    .benefits .header h3{
        width: min-content;
        line-height: 9rem;
        align-items: baseline;
    }

    .benefits .header h3 span {
        line-height: 6rem;
    }

    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 7rem;
        line-height: 5rem;
    }

    .products-video .pic{padding-top: 50px;}

}


@media screen and (max-width: 1200px) {
    .benefits .content > div.main > div.main-top{grid-template-columns: auto;}

    .home-products.child-products > div.products div.subheader{
        grid-column: auto;
    }
    .products-video{
        padding-left: 10px;
        padding-right: 10px;
    }

    .home-products.child-products > div > div.icon{
        left: unset;
        /* padding-left: unset; */
    }

}


@media screen and (max-width: 1024px) {
    .benefits > .content{
        padding-top: 100px;
    }
    .benefits .header h3{font-size: 8rem;}
    .benefits .header h3 span {
        line-height: 2rem;
    }
    .benefits .content > div.main > div.main-top{
        grid-template-rows: auto auto auto;
        gap: unset;
    }


    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 6rem;
    }


    .benefits .content > div.main > div.main-top > div.main-top-left{grid-column: 1 / 3;grid-row: 2 / 3;justify-self: center;}
    .benefits .content > div.main > div.main-top > div.main-top-middle{width: auto;padding-bottom: 100px;}
    .benefits .content > div.main > div.main-top > div.main-top-right{grid-column: 1 / 3;grid-row: 3 / 4;justify-self: center;}
    .home-products.child-products > div.text{padding-top: 20px;}


}


    @media screen and (max-width: 992px) {
    .benefits > .content{
        padding-top: 40px;
    }
    .benefits > .header {
        padding-top: 150px;
    }
    .products-video .pic{
            padding-top: unset;
    }
    .home-products.child-products > div.text{
        padding-top: unset;
    }


}



@media screen and (max-width: 768px) {
    .lighting-thumbnail{
        left: 10px;
    }
    .benefits > .content{
        padding-top: 10px;
    }

    .benefits .header h3{
        font-size: 6rem;
        line-height: 4rem;
    }

    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 4rem;
        line-height: 3rem;
    }


    .explore .content > div.bottom > div.header h4{
        font-size: 3rem;
        line-height: 5rem;
    }

    .benefits div.main-bottom .description-child{
    grid-template-columns: 400px;
    }

    .benefits div.main-bottom .description-child.double-picture > div.content-div .content-child{
        grid-template-columns: 400px;
    }

    .benefits .main-bottom .benefit-box-info {
        grid-template-columns: 400px;
    }

    .benefits .main-bottom .benefit-box-info .img {
        width: 90%;
        width: fit-content;
        /* min-width: 190px; */
    }

    .main-bottom h4 {
        font-size: 3rem;
        line-height: 4rem;
    }

    .benefits .main-bottom .tabs[data-tab-section="1"]{
        max-height: 1300px;
    }

    .benefits .main-bottom .tabs[data-tab-section="1"] .tab-area-b{min-height: 700px;}

    .benefits .main-bottom .tabs[data-tab-section="2"] .tab-area-b{
        min-height: 930px;
    }

    .benefits .main-bottom .tabs[data-tab-section="3"] .tab-area-b{
        min-height: 930px;
    }

    .benefits .main-bottom .tabs[data-tab-section="4"] .tab-area-b{
        min-height: 880px;
    }

}

@media screen and (max-width: 576px) {
    .lighting-thumbnail{
        left: -10px;
    }
    .explore .content > div.top > div.top-pic img{
        width: 300px;
    }
    .explore .content > div.top > div.top-pic{
        width: 180px;
        height: 180px;
    }
    .explore .content > div.top > div.icon{
        width: 75px;
        /* top: -88px; */
        left: -82px;
        /* background: aliceblue; */
    }

    .benefits .header h3{
        font-size: 5rem;
        line-height: 4rem;
    }


    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 3.7rem;
        line-height: 2.5rem;
    }

    .benefits .content > div.main > div.main-top{
        padding-bottom: 150px;
    }
    .benefits .content > div.main > div.main-top > div.main-top-left{
        top: -50px;
    }
    .benefits .content > div.main > div.main-top > div div.blue-icon{
        display: none;
    }
    .home-products.child-products > div.products{
        padding-top: 100px;
    }
    .explore .content > div.bottom > div.header h4{
        font-size: 3rem;
        line-height: 5rem;
    }

    .benefits div.main-bottom .description-child{grid-template-columns: 350px;}

    .benefits div.main-bottom .description-child.double-picture > div.content-div .content-child{
        grid-template-columns: 350px;
    }

    .benefits .main-bottom .benefit-box-info {
        grid-template-columns: 350px;
    }

    .benefits .main-bottom .description-child .icon.blue-icon {left: -45px;margin-bottom: 5px;}

    .custom-extra-content > div .icon {
        left: -45px;
        margin-bottom: 5px;
        width: 83px;
    }

    .benefits div.main-bottom .description-child.double-picture .title-div{
        justify-self: auto;
    }

    .benefits .main-bottom .tabs[data-tab-section="2"] .tab-area-b{
        min-height: 1000px;
    }

    .benefits .main-bottom .tabs[data-tab-section="3"] .tab-area-b{
        min-height: 1000px;
    }

    .benefits .main-bottom .tabs[data-tab-section="4"] .tab-area-b{
        min-height: 1150px;
    }

    .home-products.child-products > div > div.icon{
        width: 70px;
        top: 0px;
    }

    .home-products.child-products > div > div.icon .top {
        width: 45px;
        height: 45px;
    }

    .home-products.child-products > div > div.icon .bottom {
        width: 16px;
        height: 16px;
    }

    .home-products.child-products > div > div.icon.top{
        width: 45px;
        height: 45px;
    }

    .home-products.child-products > div > div.icon.bottom{
        width: 18px;
        height: 18px;
        margin-right: 6px;
    }

    .benefits .main-bottom .benefit-box-info .box .box-child .cta a > div p{
        font-size: 1.5rem;
    }

    .benefits .main-bottom .benefit-box-info .box .box-child .cta:hover{
        transform: scale(1.06);
    }

    .home-products .products .content .info .cta:hover{
        transform: scale(1.06);
    }


    .custom-extra-content > div .icon .top {
        width: 45px;
        height: 45px;
    }

    .explore .content > div.bottom > div.text p{
        line-height: 3rem;
    }


    .main-bottom p{
        line-height: 3rem;
    }


}

@media screen and (max-width: 425px) {
    .explore .content > div.top > div.top-pic img{
        width: 200px;
    }
    .explore .content > div.top > div.top-pic{
        width: 120px;
        height: 120px;
    }
    .benefits {padding-bottom: 100px;}
    .benefits .header h3{
        font-size: 4rem;
    }

    main[data-lang="el"] .benefits .header h3
    {
        /* color: yellow; */
        font-size: 2.5rem;
        line-height: 0rem;
    }

    .benefits > .header{
    padding-top: 50px;
    }

    .benefits div.main-bottom .description-child{
    grid-template-columns: 80%;
    }

    .benefits div.main-bottom .description-child.double-picture > div.content-div .content-child{
        grid-template-columns: 80%;
    }

    .benefits .main-bottom .benefit-box-info {
        grid-template-columns: 80%;
    }

    .main-bottom h4 {
        font-size: 2rem;
        line-height: 2rem;
    }

    .benefits .main-bottom .tabs > div .title-div h5{
        font-size: 2rem;
    }

    .benefits div.main-bottom .description-child.double-picture .title-div{width: 80%;}

    .benefits div.main-bottom .description-child.double-picture.title-right .title-div {
        width: 80%;
    }

    .benefits .main-bottom .tabs[data-tab-section="1"] .tab-area-b{min-height: 820px;}

    .benefits .main-bottom .benefit-box-info .box .box-child .cta a > div p{
    /* background: violet; */
    padding-left: 5px;
    line-height: 2rem;
}

}

@media screen and (max-width: 375px) {
    .benefits .content > div.main > div.main-top > div div.main-top-pic{
        width: 280px;
    }
    .home-products.child-products > div.text p {width: 100%;}
    .lighting-thumbnail{bottom: 50px;}

}


@media screen and (max-width: 320px) {
    .lighting-thumbnail{
        bottom: -70px;
    }
}