/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 05 2022 | 13:29:01 */
body{opacity:0;}
body.page-loaded {
  	opacity:1;
  	transition: opacity 0.8s ease-in-out;
}
body.page-transition {
  	opacity:0;
  	transition: opacity 0.8s ease-in-out;
}

.display-regular {font-family:'SF Pro Display';}
.display-light {font-family:'Sf Pro Display Light'!important;}
.main-container .row-container .row-parent .single-internal-gutter .uncont > * {margin-top: 0;}
.service-list li {list-style:none;}
.number-service .icon-expand .icon-box-content {
    width: 65%;
  	z-index:2;
  	position: relative;
}
.arrow-02 h5 {padding-left:20px;}
.open-items.overlay.overlay-sequential .menu-sidebar-inner .menu-smart > li {width:max-content;}
.menu-dark a.menu-smart-toggle:hover, .menu-dark .menu-smart a:hover, .menu-dark a.menu-smart-toggle:focus, .menu-dark .menu-smart a:focus {
    color: #777777;
}
.current-menu-item:after, 
.menu-dark a.menu-smart-toggle:not(.current-menu-item):hover:after, 
.menu-dark .menu-smart:not(.current-menu-item) a:hover:after, 
.menu-dark a.menu-smart-toggle:not(.current-menu-item):focus:after, 
.menu-dark .menu-smart:not(.current-menu-item) a:focus:after {
    content:"";
  	width:100%;
  	display:block;
  	height:1px;
  	background-color:#0f0;
  	position: relative;
	top: -2.3vh;
  	left:-10px;
}
.menu-dark a.menu-smart-toggle, .menu-dark .menu-smart, .menu-dark a.menu-smart-toggle, .menu-dark .menu-smart a {
    transition:all 0.3s ease-in-out;
}
.hover-text .text-lead p {
    font-family: "Sf Mono Medium";
  	font-size: 65px !important;
	margin-top: -140px;
  	transition:all 0.3s ease-in-out;
  	opacity:0; 
}
.hover-text:hover .text-lead p {
    font-family: "Sf Mono Medium";
  	font-size: 65px !important;
	margin-top: -140px;
  	opacity:1; 
}
.hover-text h2 {
  	transition:all 0.3s ease-in-out;
  	opacity:1; 
}
.hover-text:hover h2 {
  	opacity:0; 
}

.fa-angle-up::before {
    content: "\f106";
    font-size: 26px;
    padding: 0.3rem 0.3rem;
    margin: 0;
    line-height: 1;
}
.menu-wrapper .row-menu .row-menu-inner {
    padding: 18px 108px 18px 108px!important;
}
.mobile-menu-button {
    padding: 0 56px 0 36px!important;
}
.mmb-container {height: 50px; top: 38px!important;}
.lines-button .lines, .lines-button .lines::before, .lines-button .lines::after, .lines-button .lines > span {width: 35px;}
.lines-button .lines::after {top: -9px;}
.lines-button .lines::before {top: 9px;}
.lines-button .lines::before, .lines-button .lines::after, .lines-button .lines > span {transform-origin: 17.5px center;}
.overlay.overlay-menu .overlay-bg {opacity: 1;}
.site-info.uncell {padding-right:128px;}
.t-entry-tag {pointer-events: none!important;}
.menu-light .row-brand, .menu-light .row-menu .row-menu-inner {border-bottom: 0!important;}
.align-left {text-align:left!important;}
.align-right {text-align:right!important;}
.background .wrap {
    width: 40vw;
    margin: auto auto;
    text-align: center;
    display: flex!important;
    justify-content: center!important;
    flex-direction: column!important;
    height: 100vh!important;
    align-items: center!important;
}
.lines::before {top: 9px;}
.lines::after {top: -9px;}
.lines, .lines::before, .lines::after  {width: 30px;height: 3px;}
.lines-button.x2.close .lines::before, .lines-button.x2.close .lines::after {width: 30px;}

.detail-container .detail-label, .portfolio-wrapper div[class*="sharer-"].share-button .social ul li {color: #777 !important;}
.detail-label {font-weight: 400!important;}
.vertical-scroll {transform: rotate(270deg);transform-origin: center center;}
.vertical-touch {transform: rotate(270deg);transform-origin: center left;}
.vertical-arrow img {width:88px!important;}
.icon-box-left .icon-box-content {padding-left: 0!important;}
.icon-box-left .icon-box-icon {vertical-align: middle!important;position: relative;top: 3px;}

.pt-0 {margin-top:0!important;}
.pt-00 {padding:0!important;}
.pt-00 .single-block-padding {padding: 0;}

.view-class::before {content:'view';display:block;position:absolute;color:#000;font-size:17px;right:134px;text-transform:uppercase;font-weight:300;top:-1px;font-family:'Sf Pro Display Light';transition:all 0.5s ease-in-out;}
.view-class:hover:before {right:188px;}
.view-class::after {content:'';width:20px;height:1px;background:#000;position:absolute;right:113px;top:16px;transition:all 0.5s ease-in-out;}
.view-class:hover:after {width:75px; right:113px;}

.more-class {margin-left:60px;}
.more-class::before {content:'view';display:block;position:absolute;color:#000;font-size:17px;left:-60px;text-transform:uppercase;font-weight:300;top:-1px;font-family:'Sf Pro Display Light';}
.more-class:hover:before {content:'view';display:block;position:absolute;color:#000;font-size:17px;left:-60px;text-transform:uppercase;font-weight:300;top:-1px;}
.more-class.white::before {content:'view';display:block;position:absolute;color:#fff;font-size:17px;left:-130px;text-transform:uppercase;font-weight:300;top:-1px;}
.more-class::after {content:'';width:20px;height:1px;background:#000;position:absolute;left:-22px;top:16px;transition:all 0.5s ease-in-out;}
.more-class:hover:after {width:75px;}
.more-class h5 {transition:all 0.5s ease-in-out;}
.more-class:hover h5 {margin-left:55px;}
.more-class.white::after {content:'';width:20px;height:1px;background:#fff;position:absolute;left:-20px;top:16px;}
.more-class.white:hover:after {width:75px;}

.post-content .list-clients ul:not(.no-list) {list-style: none;color:#1d1d1b;letter-spacing:2px;font-size:22px;font-weight:300;font-family:'Sf Pro Display Light';}
.uppercase {text-transform:uppercase;}
.vertical-scroll img {max-width: 100px!important;}
.vertical-touch img {max-width: 100px!important;}
.subtitle {color:#545454;font-family: 'Sf Pro Display'; font-weight:500;}
.vertical-scroll .icon-box-icon {text-align:right!important;}
.vertical-touch .icon-box-icon {text-align:right!important;}
.push-copy {padding-left:19vw;}
.footer-scroll-top {right: 30px;}
.menu-overlay .vmenu-container .menu-smart a:not(.wc-forward) {
    font-size: 5vh !important;
    line-height: 1em;
    text-transform: capitalize;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
}
.overlay.style-dark-bg {background-color: rgb(20, 22, 24) !important;}
.menu-accordion:first-child:before {
  	content:"MENU";
  	color:#545454;
  	font-size:20px;
  	transform: rotate(270deg);
	display: block;
	transform-origin: left bottom;
	font-weight: bold;
	position: relative;
	top: 100px;
	right: 50px;
}
.menu-accordion::after {
  	content:'(+30) 2410 258 084 \A info@sowl.gr \A \A 13, PANOS str. – 41222 \A Larissa, Greece';
  	color:#fff;
  	font-size:15px;
	display: block;
	font-weight: 600;
	position: absolute;
	bottom: 20vh;
	right: 12vw;
	width: 300px;
   	white-space: pre; /* or pre-wrap */
  	text-transform: uppercase;
  	line-height:1.7em;
}

.menu-overlay .vmenu-container .menu-sidebar-inner {margin-left:20vw;}
.number-service .icon-box-left .icon-box-icon, 
.number-service .icon-box-right .icon-box-icon, 
.number-service .icon-box-left .icon-box-content, 
.number-service .icon-box-right .icon-box-content {
    vertical-align:middle!important;
}
.number-service .icon-box-left .icon-box-heading > * {display:block;margin-left:-50%;}
.number-service .fa-container {margin-left:-20%!important;display:block!important;z-index:1;top: -17px;}
.vert-no {position:absolute!important;bottom:10vh;left:36px;transform:rotate(270deg);transform-origin: left center;bottom: -180px;left: -120px;width:100px;}
.vert-no-2 {position: absolute !important;transform: rotate(270deg);transform-origin: left center;bottom: 80px;left: 25px;width: 100px;}
.dark .style-color-xsdn-bg {background-color: #101213;}
.dark .mobile-menu-button-light .lines, .dark .mobile-menu-button-light .lines::before, .dark .mobile-menu-button-light .lines::after {background: #fff;}
.dark #main-logo .navbar-brand img {filter: invert(100%);}
.dark .invert {filter: invert(100%);}
.ext-list {letter-spacing:0.1em;color:#2b2a29;}
.ext-list ul {list-style: none!important;padding:0 0 0 2px!important;}
.ext-list li {font-size:18px;font-weight:100;line-height:2;}

.tmb-dark.tmb-content-under.tmb .t-entry p.t-entry-meta span.t-entry-tax,
.tmb-dark.tmb-content-under.tmb .t-entry p.t-entry-meta span.t-entry-date
{display:none!important;}
.tmb-dark.tmb-content-under.tmb .t-entry p.t-entry-meta span.t-entry-tag a {font-size:32px;text-transform:uppercase;color:#fff!important;}
.single-gutter > div > .tmb{
    padding-right: 36px;
    border-bottom: 5px solid #fff;
    padding-bottom: 15px;
}
.single-gutter > div > .tmb:last-child {border-bottom: 0;}
.tmb .t-entry-text {padding-left:50px;}
.post-footer .row-container .double-bottom-padding {padding-bottom: 0;}
h1, .nuage {font-weight:400!important;}
#footer-social .penta-h-padding {padding-left:0!important;padding-right: 40px !important;margin-bottom: -20px;}
#design-work {margin-top: -154px!important;}
#type-effect{height: calc(100vh - 72px) !important;}
#scroll .uncont {margin-top:-30vh;margin-right: 58px;}
#scroll .icon-box.icon-inline {transform: rotate(270deg)!important;transform-origin: bottom right!important;}
#scroll .icon-box-icon img {max-width: 90px!important}
#scroll .icon-box.icon-inline {text-align: right;}
#scroll .icon-box-left .icon-box-heading {text-align:right!important; margin-left:0;}
#clients .clients .uncont {transform: rotate(270deg)!important;transform-origin: center center!important;}
#clients .clients .icon-box.icon-inline {text-align: right;}
#clients .clients .icon-box-icon img {max-width: 90px!important}
#clients .clients .icon-box-left .icon-box-heading {text-align:left!important;margin-left:0!important;}
#in-touch .contact-footer {margin-top:-154px!important;}
#in-touch .icon-box.icon-inline {transform: rotate(270deg)!important;transform-origin: bottom right!important;}
#in-touch .icon-box-icon img {max-width: 90px!important}
#in-touch .icon-box.icon-inline {text-align: right;padding-bottom: 16px;}
#in-touch .icon-box-left .icon-box-heading {text-align:left;margin-left:20px;}
#services-no .uncont {transform: rotate(270deg)!important;transform-origin: left bottom!important;}
#latest .main-container .row-container .row-parent .no-internal-gutter .uncont > * {margin-left: 20px;}
#insights .t-entry-visual-cont {display:none!important;}
#insights .t-inside:hover .t-entry-visual-cont {display:block!important;}
#insights .t-entry-visual {
  	position: fixed !important;
	right: -33vw !important;
	top: 50px !important;
	width: 30vw;
	height: auto;
	z-index: 0;
}

#insights .left-image {margin-top:-40px;z-index:1;}
#insights .white-back {background:#fff;z-index:10;width:max-content!important;padding-right:20px;}
#insights .tmb-dark.tmb .t-entry-text .t-entry-title a,
#insights .tmb-dark.tmb .t-entry-text .t-entry-title
{color:#4c4c4c;}
#insights .tmb-dark.tmb-bordered.tmb-no-bg.tmb-media-first.tmb > .t-inside .t-entry-visual {border:0!important;}

.portfolio-template-default .main-container .row-container .row-parent {padding: 0;}
.portfolio-template-default .menu-container.style-color-xsdn-bg {background-color: transparent!important;}
.portfolio-template-default .main-wrapper {margin-top: -94px;}
.row-navigation.row-navigation-light {
    outline-color: #fff;
    background-color: #fff;
    padding: 36px;
}
.isotope-filters ul.menu-smart a:not(.social-menu-link) {font-weight:300;}
.idea h1 {margin-top:-100px!important;}
.rotate {transform: rotate(-90deg);transform-origin:bottom left;}
.rotate-lb {transform: rotate(-90deg);transform-origin: left bottom;}
.latest-title {
  	position:absolute!important;
  	display:block!important;
  	right: -50px;
	bottom: 0;
	width: 100vh;
}
.t-entry-title:hover:after {
    content: "";
    width:auto;
    display: block;
    height: 1px;
    background-color: #0f0;
    position: relative;
    top: -2.3vh;
    left: -30px;
}
.t-entry-meta .small-spacer {display:none!important;}
.wpcf7-inline-wrapper {margin-top:0;}
.wpcf7-inline-wrapper.wpcf7-input-group > :first-child input {border:0; box-shadow:none;}
.style-light .btn-default.sowl-btn {
    color: #000 !important;
    background-color: #fff !important;
}
.footer-scroll-top {right: 50px;}
.footer-scroll-top.footer-scroll-higher {bottom: 25px;}
.inactive a {color: #545454!important;}
#label-block {
  	position: absolute!important;
	top: calc(100vh - 300px)!important;
	left: 50px!important;
}
.label-vert {
  	transform: rotate(-90deg);
	width: max-content;
	transform-origin: center center;
	line-height: 0.7;
  	z-index: 999999;
}


@media (max-width: 767px) {

.menu-wrapper .row-menu .row-menu-inner {padding: 0;}
.mobile-menu-button {padding: 0 36px;}
#scroll .icon-box.icon-inline {width:100%;height: 30px;}
#scroll .uncell {padding-bottom: 36px!important;padding-left: 36px!important;}
#type-effect .uncell {padding-bottom: 36px!important;padding-left: 36px!important;padding-right:36px;}
#type-effect .uncont {padding-top:0!important;}
.icon-box-left .icon-box-content {padding-left: 5px !important;vertical-align: middle;}
.icon-box-left .icon-box-icon {top: 5px;}
.icon-box-icon {width:32px!important;}
#scroll .uncont {margin-top:-60vh; margin-right:36px;}
#scroll .uncont {padding-top:10px!important;}
#scroll .icon-box-left .icon-box-heading {width:60px;}
.hover-text .text-lead p,  .hover-text:hover .text-lead p {font-size: 35px !important; line-height:1;}
.hover-text:hover .text-lead p {margin-top:-120px!important;}
#clients .clients .icon-box-left .icon-box-heading {width: 160px;}
#design .quad-block-padding {padding: 0;}
#design .align-left {text-align: right !important;}
#in-touch .uncell {padding:0!important;}
#in-touch .pos-top {padding: 5px 0px 0px 0px!important;}
.more-class::before {left:unset;right: 70px;}
.more-class::after {right: 49px;left:unset;}
#clients .pos-top {padding: 0!important;}
.push-copy {padding: 0 38px!important; text-align: left;}
footer .footer-last {padding: 0!important;}
.footer-social {padding-bottom:0!important;}
.menu-accordion::after {font-size: 12px;bottom: 8vh;}
body.menu-mobile-centered .overlay-menu .navbar-main .menu-sidebar-inner {vertical-align: top;width: 100%;}
body.menu-mobile-centered .overlay-menu .navbar-main .menu-sidebar-inner ul.menu-smart li.menu-item > a {font-size: 7.5vw !important; line-height: 1.1 !important;}
#design-work .quad-block-padding {padding: 0;}
#design-work .align-left {text-align: right !important;}
#newsletter {padding:0 5%!important;}
.number-service .fa-container {margin-left: 0% !important;}
#about-photo .exa-bottom-padding {padding-bottom: 36px!important;}
#latest .ext-list li {font-size: 15px;line-height: 1.5;padding-bottom: 20px;}
#insights .insight-titles .tmb .t-entry-text {padding-left: 0!important;}
.vc_custom_1616368033416 {padding:0!important;}
#insights .tmb-dark.tmb-content-under.tmb .t-entry p.t-entry-meta span.t-entry-tag a {font-size: 24px;line-height: 1;}
body.single-post .post-content {padding-top: 200px!important;}
.footer-scroll-top {right: 36px;}
#label-block {left: -10px!important;}
.isotope-filters a {padding: 5px 7px 5px 7px;}
.wpcf7-inline-wrapper.wpcf7-input-group .wpcf7-inline-field {display: block;width:100%;text-align:center;}
body:not(.rtl) .wpcf7-inline-wrapper.wpcf7-input-group > *:first-child input:not(.btn), body.rtl .wpcf7-inline-wrapper.wpcf7-input-group > *:first-child input:not(.btn) {text-align: center;}
#newsletter h3 {text-align:center;}
.footer-social {padding:0!important;}
.footer-social .col-lg-3 {padding-top:10px!important;}
.mobile-padding {padding-left:36px!important;padding-right:36px!important;}
.mobile-left-padding {padding-left:50px!important;}
#design-about .no-block-padding {padding:0!important;}
#clients .clients .icon-box-left .icon-box-heading {width: 100%;}
.main-container .cols-sm-responsive {margin-left: 0!important;}
.post-content ul:not(.no-list) {padding: 0;}
.clients .icon-expand .icon-box-content, .icon-expand .icon-box-icon {width: 60%;}
.list-clients li {font-size:11px; letter-spacing:1px;}
.mini p span {font-size:10px!important;}
.tmb .t-entry-text {padding-left: 0;}
#insights .t-entry-visual {position: absolute !important;right: unset!important;top: 0 !important;left: -10% !important;width: calc(100vw - 72px) !important;  }
.menu-wrapper .row-menu .row-menu-inner {padding: 18px 38px 18px 38px !important;}
.menu-container .logo-container {padding: 30px 100px 27px 0px !important;}
.icon-box .icon-media {vertical-align: middle!important;}
.mobile-menu-button {padding: 0 32px 0 36px !important;}
.menu-container.menu-hided {transform: translate3d(0px, -125px, 0px)!important;}
#design-work, #services {margin-top: 0 !important;}	
.client-col .list-clients {column-count: 2!important;}
}

@media (min-width: 412px) and (max-width: 412px) {
	#scroll .icon-box-icon img {padding-top:10px;}
  	#scroll .uncont {margin-top:-40vh; margin-right:36px;}
}

@media (min-width: 768px) and (max-width: 1024px) {
#scroll .icon-box-left .icon-box-heading {width:60px;}
#in-touch .uncell {padding:0!important;}
#in-touch .pos-top {padding: 5px 0px 0px 0px!important;}
.more-class::before {left:unset;right: 140px;}
.more-class::after {right: 70px;left:unset;}
.push-copy {padding: 0 36px!important;text-align:left!important;}
footer .footer-last {padding: 0!important;}
.menu-accordion::after {bottom: 8vh;right: 0;width: 100%;}
body.menu-mobile-centered .overlay-menu .navbar-main .menu-sidebar-inner {vertical-align: top;width: 100%;}
body.menu-mobile-centered .overlay-menu .navbar-main .menu-sidebar-inner ul.menu-smart li.menu-item > a {font-size: 7.5vw !important; line-height: 1.1 !important;}
#design .align-left {text-align: right !important;}
#design .quad-block-padding {padding: 0;}
#design-work .quad-block-padding {padding: 0;}
#design-work .align-left {text-align: right !important;}
.number-service .icon-box-left .icon-box-heading > * {margin-left: -17vw;}
#about-photo .exa-bottom-padding {padding-bottom: 36px!important;}

}