/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* Sheeria Group Website Production
   v1.0 
*/
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;500;600;700&family=IBM+Plex+Sans+Arabic:wght@100;300;400;500;600;700&display=swap');

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
    margin-top: 0 !important;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}



/*--------------------------------------------------
# Typography
---------------------------------------------------*/

@font-face {
    /* font-family: Bronova; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-style: normal;
    font-weight: 400;
    /* src: url("/front/css/Bronova-Regular.woff"); */
}

@font-face {
    font-style: normal;
    font-weight: 700;
    /* src: url('/front/css/Bronova-Bold.woff'); */
}

body {
    /* font-family: Bronova; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 16px
}

h1.big-title {
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    line-height: 75px;
    margin-left: -7px;
    margin-top: 20px;
    margin-bottom: 69px;
    padding-right: 10px;
}
h1.about-title {
    font-size: 50px !important;
}

h1 {
    font-size: 44px;
    line-height: 60px;
    font-weight: 700;
    margin-bottom: 15px
}

h2 {
    font-size: 36px;
    line-height: 50px;
    font-weight: 700;

}

h3 {
    font-size: 30px;
    line-height: 40px;
    margin-left: -1px;
    font-weight: 700;

}

h4 {
    font-size: 24px;
    line-height: 35px;
    margin-left: -1px;
    font-weight: 700;

}

h5 {
    font-size: 16px;
    line-height: 32px;
    margin-left: -1px;
    font-weight: normal;
    margin-bottom: 1em;
}

h6 {
    font-size: 12px;
    line-height: 18px;
    margin: 0;
}

p {
    line-height: 28px;
    margin-bottom: 15px
}


.back-to-top {
    cursor: pointer
}

.sheeria-text-box .text-wrapper h3 {
    font-size: 23px;
}
/*--------------------------------------------------
# Forms
---------------------------------------------------*/

.sheeria-form {
    display: block;
    width: 100%;
    float: left;
}

.sheeria-form .field-wrap {
    width: 100%;
    display: block;
    float: left;
    margin-bottom: 15px;
    position: relative
}

.sheeria-form .field-wrap::after {
    content: "";
    display: block;
    width: 0%;
    height: 1px;
    background: #000;
    bottom: 0;
    left: 0;
    -webkit-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

.sheeria-form .field-wrap.focus::after {
    width: 100%;
}

.sheeria-form input,
.sheeria-form textarea {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #d7d7d7;
    outline: none !important
}

.sheeria-form textarea,
.sheeria-form input {
    padding: 25px 15px;

}

button.button.button-block {
    width: 100%;
    padding: 25px 15px;
    margin-top: 15px;
    font-size: 18px;
    color: #fff;
    border: none;
    background: #000;
}

::-webkit-input-placeholder {
    /* font-family: 'Bronova'; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 14px;
}

::-moz-placeholder {
    /* font-family: 'Bronova'; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 14px;
}

:-ms-input-placeholder {
    /* font-family: 'Bronova'; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 14px;
}

::-ms-input-placeholder {
    /* font-family: 'Bronova'; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 14px;
}

.sheeria-form textarea,
.sheeria-form input,
::placeholder,
button {
    /* font-family: 'Bronova'; */
    font-family: 'Dancing Script', cursive;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    font-size: 14px;
}

.send-wrap button {
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    cursor: pointer
}

.send-wrap {
    position: relative;
    display: block;
    float: left;
    width: 100%;
}

.send-wrap::after {
    content: "\f1d8";
    color: #000;
    font-family: 'Font Awesome 6 Free';
    position: absolute;
    top: 60%;
    left: 50%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    font-size: 30px;
    opacity: 0;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.send-wrap:hover button {
    background: #fff;
    border: 1px solid #d7d7d7;
}

.send-wrap:hover::after {
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 30px;
    opacity: 1;
}


/*--------------------------------------------------
# Site Header
---------------------------------------------------*/

.site-header {
    display: block;
    float: left;
    width: 100%;
    padding: 50px 5%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    z-index: 999
}

.site-branding {
    display: block;
    float: left;
    width: 45px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.site-logo,
.site-logo img {
    width: 100%;
}

.header-wrap {
    float: right;
    position: relative;
    z-index: 99;
    -webkit-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px);
}

.header-toggle,
.site-navigation,
.language-switcher {
    display: block;
    float: left;
}

.site-navigation {
    margin-right: 50px;
}

.language-switcher {
    margin-right: 190px;
}

ul.menu.main-menu {
    display: block;
    list-style: none;
}

ul.menu.main-menu li {
    display: inline-block;
    margin: 0 15px;
    font-size: 14px;
}

ul.menu.main-menu li a {
    text-decoration: none;
    color: #000;
}


ul.lang-switch {
    display: block;
    list-style: none;
}

ul.lang-switch li {
    display: inline-block;
    font-size: 14px;
}

ul.lang-switch li::after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 16px;
    vertical-align: middle;
    background: #000;
    margin: 0 10px;
}

ul.lang-switch li:last-child::after {
    display: none;
}


ul.lang-switch li a {
    text-decoration: none;
    color: #000;
    opacity: 0.4;
}

ul.lang-switch li.active a {
    opacity: 1;
}
/*--------------------------------------------------
## Page Transitions
---------------------------------------------------*/

.page-trans {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999999999;
    pointer-events: none
}

span.page-trans-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0%;
    background: #fff;
}

span.page-trans-overlay:first-child {
    background: #1BA2AD;
}

span.page-trans-overlay:nth-child(2) {
    background: #21509F;
}

.loading-logo {
    position: fixed;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    z-index: 999;
    opacity: 0
}

.loading-logo img {
    width: 100%;
}
/*--------------------------------------------------
## Fullscreen Menu
---------------------------------------------------*/

.hamburger-toggle {
    display: block;
    width: 25px;
    margin-top: 2px;
    cursor: pointer
}

.hamburger-toggle .toggle-line {
    width: 100%;
    height: 2px;
    background: #000;
    display: block;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease
}

.hamburger-toggle .toggle-line:last-child {
    margin-top: 5px;
}

.hamburger-toggle.is-active .toggle-line:first-child {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-bottom: -8px;
}

.hamburger-toggle.is-active .toggle-line:last-child {
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
}

.fullscreen-menu {
    position: fixed;
    top: 100px;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99;
    pointer-events: none;

}

.fullscreen-menu.is-active {
    pointer-events: all;

}

.fullscreen-menu-wrap {
    display: block;
    width: 50%;
    float: left;
    height: 100%;
    position: relative;
}

.fullscreen-cta {
    display: block;
    float: left;
    width: 50%;
    height: 50%;
    position: relative;
    overflow: hidden
}

.fullscreen-cta a::before {
    background-image: url("/front/img/greek-menu-bg.png");
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    -webkit-transform: translateY(50px);
    -ms-transform: translateY(50px);
    transform: translateY(50px);
    z-index: 2;
    position: relative;
}

.is-active .fullscreen-cta a::before {
    opacity: 1;
    -webkit-transition: all .4s ease .5s;
    -o-transition: all .4s ease .5s;
    transition: all .4s ease .5s;
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px)
}

.fullscreen-cta a {
    display: block;
    width: 100%;
    height: 100%;
    color: #fff;
    text-decoration: none;
    position: relative;
    overflow: hidden
}

.fullscreen-cta::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("/front/img/greek-pattern.png");
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
    opacity: 0;
    -webkit-transition: all .7s ease 0s;
    -o-transition: all .7s ease 0s;
    transition: all .7s ease 0s;
}

.fullscreen-cta a::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("/front/img/greek-pattern.png");
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
    -webkit-transform: translatex(50%) rotate(180deg);
    -ms-transform: translatex(50%) rotate(180deg);
    transform: translatex(50%) rotate(180deg);
    opacity: 0;
    -webkit-transition: all .7s ease 0s;
    -o-transition: all .7s ease 0s;
    transition: all .7s ease 0s;
}

.is-active .fullscreen-cta::before {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    opacity: .5;
    -webkit-transition: all .7s ease .2s;
    -o-transition: all .7s ease .2s;
    transition: all .7s ease .2s;
}

.is-active .fullscreen-cta a::after {
    -webkit-transform: translatex(0%) rotate(180deg);
    -ms-transform: translatex(0%) rotate(180deg);
    transform: translatex(0%) rotate(180deg);
    opacity: .5;
    -webkit-transition: all .7s ease .2s;
    -o-transition: all .7s ease .2s;
    transition: all .7s ease .2s;
}


.cta-wrap i {
    display: block;
    margin-top: 20px;
}

.cta-wrap {
    position: absolute;
    right: 5%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: right;
    opacity: 0;
    visibility: hidden
}

.cta-text {
    font-size: 44px;
    font-weight: 700;
    line-height: 70px;
}

.cta-icon {
    display: inline-block;
    position: relative;
    margin-top: 50px;
    margin-right: 20px;
    -webkit-transform: translateX(-70px);
    -ms-transform: translateX(-70px);
    transform: translateX(-70px);
    opacity: 0;
}

.cta-text div {
    -webkit-transform: translateX(-70px);
    -ms-transform: translateX(-70px);
    transform: translateX(-70px);
    opacity: 0;
}

.cta-icon i {
    margin: 0;
    font-size: 30px;
    line-height: 30px;
}

.cta-icon::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 75px;
    height: 75px;
    border: 1px solid #fff;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.fullscreen-widget {
    display: block;
    float: left;
    width: 50%;
    height: 50%;
    position: relative
}

.fs-menu {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.fs-widget-menu li {
    line-height: 25px
}

.fs-widget-menu a {
    color: #000;
    text-decoration: none
}

.fs-menu ul.menu.main-menu li {
    display: block;
    font-size: 44px;
    line-height: 100px;
    margin-bottom: 30px;
    -webkit-transform: translateY(50px);
    -ms-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
    font-weight: 500;
}

.fs-menu ul.menu.main-menu li a {
    color: #fff;
    position: relative;
}

.fs-menu ul.menu.main-menu li a::after {
    content: "("attr(data-index) ")";
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: translate(100%, -50%);
    -ms-transform: translate(100%, -50%);
    transform: translate(100%, -50%);
    font-size: 20px;
    opacity: 0.4;
}

.fs-widget-wrap {
    position: absolute;
    bottom: 5%;
    right: 5%;
    text-align: right;
    -webkit-transform: translateY(50px);
    -ms-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
}

.fs-widget-wrap .language-switcher {
    margin-right: 0;
}

.fs-widget-wrap .menu {
    margin-bottom: 35px;
}

.fs-widget-wrap .language-switcher {
    display: block;
    width: 100%;
    margin-bottom: 35px;
}

.fullscreen-menu-wrap::after,
.fullscreen-cta::after,
.fullscreen-widget::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: #1A98A3;
    z-index: -1;
    -webkit-transition: width .6s cubic-bezier(.645, .045, .355, 1);
    -o-transition: width .6s cubic-bezier(.645, .045, .355, 1);
    transition: width .6s cubic-bezier(.645, .045, .355, 1);
}



.is-active .fullscreen-menu-wrap::after,
.is-active .fullscreen-cta::after,
.is-active .fullscreen-widget::after {
    width: 100%;
}

.fullscreen-cta::after {
    background: #1E4695;
    left: unset;
    right: 0
}

.fullscreen-widget::after {
    background: #ebebeb;
    left: unset;
    right: 0;
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s
}

/*--------------------------------------------------
# Intro
---------------------------------------------------*/
.sheeria-intro {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;

}

/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {

    .sheeria-intro {
        /* The hack for Safari */
        height: -webkit-fill-available;
    }
}

.intro-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 3
}



.intro-logo img {
    width: 150px;
}

.sheeria-intro::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease
}

.sheeria-intro.done::after {
    opacity: 1;
}

.sheeria-intro.done {
    pointer-events: none
}


.sheeria-intro .intro-video,
.sheeria-intro .intro-video video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;

}

/* This used to work for the parent element of button divs */
/* But it does not work with newer browsers, the below doesn't hide the play button parent div */

.sheeria-intro .intro-video video::-webkit-media-controls-panel {
    display: none !important;
    -webkit-appearance: none;
}

/* Old shadow dom for play button */

.sheeria-intro .intro-video video::-webkit-media-controls-play-button {
    display: none !important;
    -webkit-appearance: none;
}

/* New shadow dom for play button */

/* This one works! */

.sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
    display: none !important;
    -webkit-appearance: none;
}

.sheeria-intro .intro-video video::-webkit-media-controls {
    opacity: 0;
}

.sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
    display: none !important;
}

.sheeria-intro .intro-video video::-webkit-media-controls-panel,
.sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
    display: none !important;
}

.intro-button {
    position: absolute;
    bottom: 25%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    border: 1px solid #1DA5AF;
    padding: 20px 40px;
    border-radius: 30px;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    z-index: 10;
    cursor: pointer;
    white-space: nowrap
}

.intro-button:hover {
    background: #1DA5AF;
    color: #fff;
}

/*--------------------------------------------------
# Site Footer
---------------------------------------------------*/
div#footer {
    padding: 60px 0 30px 0;
    border-top: 2px solid #EAEAEA;
    margin-bottom: 0;
}

.footer-headline {
    display: block;
    padding: 75px 50px;
    background: #1DA5AF;
    border-radius: 35px;
    position: relative
}

.footer-headline::after {
    content: "";
    position: absolute;
    top: 100px;
    right: 100px;
    opacity: 0;
    -webkit-transition: all .5s ease .5s;
    -o-transition: all .5s ease .5s;
    transition: all .5s ease .5s;
    width: 200px;
    height: 200px;
    background-image: url("/front/img/head-arrow.png");
    background-size: 200px 200px;
    display: block
}

.footer-headline.is-inview::after {
    top: 0;
    right: 0;
    opacity: 1;
}

.footer-headline a {
    text-decoration: none
}

.fh-sub-text {
    color: #fff;
    opacity: 0.8;
    display: block;
    margin-bottom: 35px;
    font-weight: 700;
}

.fh-title {
    color: #fff;
    font-size: 60px;
    font-weight: 700;
}

.fh-title .circle::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(20deg);
    -ms-transform: translate(-50%, -50%) rotate(20deg);
    transform: translate(-50%, -50%) rotate(20deg);
    width: 200px;
    height: 200px;
    display: block;
    background-image: url("/front/img/about-title-shine.png");
    background-size: 200px 200px;
}

.fh-title .circle {
    position: relative;
    overflow: visible;
    display: inline-block;
}

.wrapper.footer-top {
    margin-bottom: 50px;
}

ul.menu.footer-menu {
    display: block;
    list-style: none;
}

ul.menu.footer-menu li {
    display: block;
    width: 100%;
    line-height: 30px;
}

ul.menu.footer-menu li a {
    text-decoration: none;
    color: #000;
}

.wrapper-full.footer-sub-bar {
    margin-bottom: 0;
    padding: 0 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.back-to-top {
    display: block;
    float: right;
    position: fixed;
    bottom: 2.5%;
    left: 2.5%;
    width: 75px;
    height: 75px;
    -webkit-transform: translateY(50%);
        -ms-transform: translateY(50%);
            transform: translateY(50%);
    opacity: 0;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}
.back-to-top.is-inview {
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
}

.back-to-top .svg-circle {
    width: 100%;
    height: 100%;
    position: absolute
}
#btt-1 {
    opacity: .4
}

.back-to-top .svg-circle:last-child {
    -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
            transform: rotate(-90deg);
}

.back-to-top i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    color: #1BA2AD;
    font-size: 20px;
    opacity: .5;
    -webkit-transition: opacity .4s ease;
    -o-transition: opacity .4s ease;
    transition: opacity .4s ease;

}

.back-to-top:hover i {
    opacity: 1
}

/*--------------------------------------------------
# Page Headers
---------------------------------------------------*/


.page-header-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.about-header .page-header-bg {
    height: 83%
}

.sheeria-page-header {
    position: relative;
    width: 100%;

}
.sheeria-page-header::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    bottom: 0;
    transform: translateY(100%);
    height: 500px;
    z-index: -1;
    background: rgb(239, 238, 239);
    background: linear-gradient(180deg, rgba(239, 238, 239, 1) 0%, rgba(255, 255, 255, 0) 100%);
}
.page-header-bg video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transform: scale(1.5);
    -ms-transform: scale(1.5);
    transform: scale(1.5);
}

.page-title {
    position: absolute;
    top: 50%;
    left: 5%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.page-title::before {
    content: url("/front/img/page-title-shine.png");
}

.page-title h1.big-title {
    font-size: 100px;
    line-height: 110px;
}

.page-title-wrap {
    position: relative;
    width: 100%;
    height: 100vh;
    display: block;
    float: left;
}

/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {

    .page-title-wrap {
        /* The hack for Safari */
        height: -webkit-fill-available;
    }
}


.page-content-wrap {
    display: block;
    float: left;
    position: relative;
    width: 100%;
}

.page-header-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.page-header-content .c-col-9 {
    padding: 6%;
}

.page-header-content .c-col-3 {
    padding-top: 10%;
    padding-left: 5%;
}

.about-header .scroll-button {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
}

.about-header .sheeria-title::before {
    display: none;

}

.about-header .sheeria-title::after {
    content: "";
    background-image: url("/front/img/about-title-shine.png");
    width: 150px;
    height: 150px;
    -webkit-transform: translateY(-50px) translateX(-50px);
    -ms-transform: translateY(-50px) translateX(-50px);
    transform: translateY(-50px) translateX(-50px);
    background-size: 150px 150px;
    top: 0;
    position: absolute;
    left: 0;
    opacity: 0;
    -webkit-transition: all .75s ease;
    -o-transition: all .75s ease;
    transition: all .75s ease
}

.about-header .sheeria-title.is-inview::after {
    opacity: 1
}

.page-desc {
    position: absolute;
    right: 5%;
    bottom: 0;
    transform: translateY(50%);
    padding: 50px;
    background: #1BA2AD;
    border-radius: 35px;
    z-index: 2;
}

.page-desc-title {
    color: rgb(255 255 255 / 40%);
    display: block;
    margin-bottom: 35px;
    font-size: 20px;
}

.page-description {
    color: #fff;
    font-weight: 400;
    font-size: 25px;
    line-height: 35px;
    width: 20rem;
}

.page-desc::before {
    content: "";
    display: block;
    width: 50px;
    height: 50px;
    margin-bottom: 50px;
    background-image: url("/front/img/page-desc-icon.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

/*--------------------------------------------------
# Greek Theater Section
---------------------------------------------------*/
.greek-theater-section {
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 20%;
}

.greek-bg {
    position: absolute;
    width: 100%;
    height: auto;
    z-index: -1;
}

.greek-bg img {
    width: 100%;
}

.greek-light {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transform-origin: top;
    -ms-transform-origin: top;
    transform-origin: top
}

.greek-logo {
    display: block;
    margin: 0 auto;
    margin-bottom: 75px;
}

.greek-wrap {
    display: block;
    margin: 0 auto;
    text-align: center;
    padding: 10% 0;
}

.greek-content {
    color: #fff;
}

.greek-content h2 {
    font-size: 50px;
}

.greek-content .text-wrapper {
    margin-bottom: 50px;
}

.greek-button {
    display: inline-block;
    position: relative;
    width: 90px;
    height: 90px;
    cursor: pointer
}

.greek-button a {
    width: 100%;
    height: 100%;
    display: block;
}

.greek-button span {
    width: 100%;
    height: 100%;
    border: 1px solid #fff;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    opacity: .9
}

.greek-button span:nth-child(3) {
    width: 130%;
    height: 130%;
    opacity: .7;
    -webkit-animation-name: width1;
    animation-name: width1;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}

@-webkit-keyframes width1 {
    from {
        width: 120%;
        height: 120%;
        opacity: .7;
    }

    to {
        width: 140%;
        height: 140%;
        opacity: 0;
    }
}

@keyframes width1 {
    from {
        width: 120%;
        height: 120%;
        opacity: .7;
    }

    to {
        width: 140%;
        height: 140%;
        opacity: 0;
    }
}

@-webkit-keyframes width2 {
    from {
        width: 140%;
        height: 140%;
        opacity: .4;
    }

    to {
        width: 170%;
        height: 170%;
        opacity: 0;
    }
}

@keyframes width2 {
    from {
        width: 140%;
        height: 140%;
        opacity: .4;
    }

    to {
        width: 170%;
        height: 170%;
        opacity: 0;
    }
}


.greek-button span:last-child {
    width: 160%;
    height: 160%;
    opacity: .4;
    -webkit-animation-name: width2;
    animation-name: width2;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}


.greek-button .button-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/*--------------------------------------------------
# Circular Video
---------------------------------------------------*/

.circular-video {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-bottom: 50%;
    border-top-left-radius: 50vw;
    border-top-right-radius: 50vw;
    position: relative;
}

.circular-video::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    top: unset;
    left: 0;
    bottom: 0;
    -webkit-transition: all .8s ease-in-out;
    -o-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out;
}

.circular-video.is-inview::after {
    height: 0%;
}

.circular-video video {
    width: 100%;
}

.circular-video::before {
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(to top,#fff, #ffffff1f, rgba(255, 255, 255, 0));
    position: absolute;
    /* top: unset; */
    left: 0;
    bottom: 0;
    /* -webkit-transition: all .8s ease-in-out;
    -o-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out; */
}


/*--------------------------------------------------
# Sheeria Vision
---------------------------------------------------*/
.sheeria-vision-objective {
    display: block;
    float: left;
    width: 100%;
    padding-bottom: 10%;
}

.sheeria-vision-objective > div {
    display: block;
    float: left;
    width: 50%;

    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 50%;
    height: 0;
    padding-bottom: 50%;
    position: relative;
}

.sheeria-vision-objective div div {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.svo-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 35px;
    opacity: .6;
}

.svo-content {
    font-size: 30px;
    font-weight: 700;
    line-height: 40px;
}

.svo-content h4 {
    display: block;
    width: 100%
}

.svo-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.sheeria-vision {
    -webkit-transform: translateX(4.1%);
    -ms-transform: translateX(4.1%);
    transform: translateX(4.1%);
}

.sheeria-objective {
    -webkit-transform: translateY(25%) translateX(-4.1%);
    -ms-transform: translateY(25%) translateX(-4.1%);
    transform: translateY(25%) translateX(-4.1%);
}


.sheeria-vision-objective .svg-circle {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.sheeria-vision .svg-circle.low {
    position: absolute;
    top: 50%;
    left: 20%;
    opacity: .1;
}

.sheeria-objective .svg-circle.low {
    position: absolute;
    top: -50%;
    right: 20%;
    opacity: .1;
}

.sheeria-vision-objective .svg-circle.low {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
}

/*--------------------------------------------------
# Grid System
---------------------------------------------------*/

.svg-bg,
.svg-bg svg {
    width: 100%;


}


#page {
    visibility: visible
}

.hide_desktop {
    display: none
}

.wrapper-small {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 100px;

}

.wrapper {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 100px;

}

.wrapper-full {
    width: 100%;
    margin-bottom: 100px;
}

.section {
    width: 100%;
    margin-bottom: 100px;
    position: relative;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

.section.has-svg-bg .wrapper-full {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.section.fullscreen {
    height: 100vh;
    margin-bottom: 0;

}

/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {

    .section.fullscreen {
        /* The hack for Safari */
        height: -webkit-fill-available;
    }
}


.section.contact-sec {
    margin-top: -10%;
    background: #fff;
    border-top-left-radius: 75px;
    border-top-right-radius: 75px;
    box-shadow: -1px -4px 15px 3px rgba(0, 0, 0, 0.04);
    -webkit-box-shadow: -1px -4px 15px 3px rgba(0, 0, 0, 0.04);
    -moz-box-shadow: -1px -4px 15px 3px rgba(0, 0, 0, 0.04);
}

.section.has-bg {
    margin-bottom: 350px;
    padding-top: 100px;
    margin-top: 350px;
}

.page-content .section:last-child {
    margin-bottom: 0
}

.send-back {
    z-index: -2
}


.section.send-back {
    z-index: -9
}

.sec-bg-ov {
    position: absolute;
    width: 25%;
    top: 0;
    z-index: -2;
}

.sec-bg-ov:nth-child(1) {
    left: 0;
    height: calc(100% + 100px);
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
}

.sec-bg-ov:nth-child(2) {
    left: 25%;
    height: calc(100% + 200px);
    -webkit-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px);
}

.sec-bg-ov:nth-child(3) {
    left: 50%;
    height: calc(100% + 300px);
    -webkit-transform: translateY(-150px);
    -ms-transform: translateY(-150px);
    transform: translateY(-150px);
}


.sec-bg-ov:nth-child(4) {
    left: 75%;
    height: calc(100% + 200px);
    -webkit-transform: translateY(-100px);
    -ms-transform: translateY(-100px);
    transform: translateY(-100px);
}

.wrapper:after,
.wrapper-small:after,
.wrapper-full:after,
section:after {
    display: table;
    clear: both;
    content: '';
}

.c-col-1,
.c-col-2,
.c-col-3,
.c-col-4,
.c-col-5,
.c-col-6,
.c-col-7,
.c-col-8,
.c-col-9,
.c-col-10,
.c-col-11,
.c-col-12 {
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.no-gap {
    padding-left: 0;
    padding-right: 0;
}

.c-col-6 {
    width: 50%;
}

.c-col-4 {
    width: 33.333333%
}

.c-col-8 {
    width: 66.666666%
}

.c-col-3 {
    width: 25%;
}

.c-col-2 {
    width: 16.6666666%
}

.c-col-5 {
    width: 41.666666%
}

.c-col-10 {
    width: 83.333333%
}

.c-col-9 {
    width: 75%
}

.c-col-12 {
    width: 100%;
}

.no-margin {
    margin-bottom: 0 !important
}
.no-margin1 {
    margin-bottom: 100px !important
}

.align-center {
    text-align: center
}

    #contact-mobile{
        display: none;
        /*visibility: hidden;*/
    }


@media only screen and (max-width: 576px) {

    .intro-logo img {
        width: 100px !important;
    }
    .wrapper {
        max-width: 90%;
        margin-bottom: 25px;
    }

    .wrapper-small {
        max-width: 90%;
        margin-bottom: 25px;
    }

    .wrapper-full {
        margin-bottom: 100px;
    }

    .c-col-1,
    .c-col-2,
    .c-col-3,
    .c-col-4,
    .c-col-5,
    .c-col-6,
    .c-col-7,
    .c-col-8,
    .c-col-9,
    .c-col-10,
    .c-col-11,
    .c-col-12 {
        width: 100%;
        margin-bottom: 35px;
    }

    .fit-col {
        margin: 0;
    }
    
    .footer-mobile{
        display: none !important;
    }
    #contact-mobile{
        display: block;
        /*visibility:visible;*/
    }


}


@media only screen and (min-width: 576px) {
    .wrapper {
        max-width: 90%;
    }

    .wrapper-small {
        max-width: 90%;
    }
    

}

@media only screen and (min-width: 768px) {
    .wrapper {
        max-width: 90%;
    }

    .wrapper-small {
        max-width: 88%;
    }

}

@media only screen and (min-width: 992px) {
    .wrapper {
        max-width: 914px;
    }

    .wrapper-small {
        max-width: 700px;
    }

}

@media only screen and (min-width: 1200px) {
    .wrapper {
        max-width: 1174px;
    }

    .wrapper-small {
        max-width: 850px;
    }

}

@media only screen and (min-width: 1600px) {
    .wrapper {
        max-width: 1350px;
    }

    .wrapper-small {
        max-width: 1100px;
    }

}

.section.parallax-bg {

    width: 100%;
    z-index: -1;
    background-size: cover;
    background-position: 50% 0%;
    background-repeat: no-repeat;
    overflow: hidden;

}

/*--------------------------------------------------
# Page Widgets
---------------------------------------------------*/
/*--------------------------------------------------
## Single Image
---------------------------------------------------*/

.single-image {
    display: block;

}

.single-image img {
    display: inline-block
}



.single-image.align-right {
    text-align: right
}

/*--------------------------------------------------
## Sheeria Page Navigation
---------------------------------------------------*/
.sheeria-page-nav {
    display: block;
    text-align: center;
    position: relative;
    margin-top: 50px;
}

.sheeria-page-nav a {
    text-decoration: none;
    color: #000;
}

.sheeria-page-nav a:hover .nav-icon {
    background: #fff;
    color: #1DA5AF;
}

.sheeria-page-nav a:hover .nav-icon::after {
    border-color: #fff;
}

.nav-icon {
    padding: 30px;
    background: #1DA5AF;
    display: inline-block;
    border-radius: 50%;
    color: #fff;
    position: relative;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease
}

.nav-icon::after {
    content: "";
    display: block;
    position: absolute;
    width: 110%;
    height: 110%;
    border: 1px solid #1DA5AF;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease
}

.nav-bg-text {
    position: absolute;
    left: 0;
    -webkit-transform: translateY(-35%);
    -ms-transform: translateY(-35%);
    transform: translateY(-35%);
    width: 100%;
}

.nav-sub-title {
    color: #1DA5AF;
    margin-top: 25px;
}

.nav-title {
    font-size: 23px;
    line-height: 35px;
}

/*--------------------------------------------------
## Sheeria Services
---------------------------------------------------*/
.sheeria-services {
    display: block;
    float: left;
    width: 100%;
    height: 0;
    position: relative;
    overflow: hidden;
}

.services-wrap {
    height: 500px;
    display: block;
    width: 66%;
    float: left;
}

.service.swiper-slide {
    opacity: 0;
    -webkit-transition: opacity .4s ease;
    -o-transition: opacity .4s ease;
    transition: opacity .4s ease;
}

.service.swiper-slide.swiper-slide-active {
    opacity: 1;
}

.sheeria-services-hold {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 80%;
    z-index: 1
}

/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {

    .sheeria-services-hold {
        /* The hack for Safari */
        height: -webkit-fill-available;
    }
}


.services-head {
    display: block;
    float: left;
    width: 33%;
}

h2.service-title {
    color: #fff;
    margin-bottom: 25px;
}

p.service-content {
    color: #fff;
    width: 60%;
}

.services-head .text-wrapper {
    color: #fff
}

.services-head .sheeria-title {
    color: #fff;
}

.sheeria-services .sheeria-title::before {
    background-image: url("/front/img/highlight-white.png");
}

.services-wrap.swiper-container.swiper-initialized.swiper-horizontal.swiper-pointer-events {
    width: 66%;
}

.services-scroll {
    position: absolute;
    bottom: 5%;
    width: 98%;
    cursor: pointer
}

.services-fraction {
    display: block;
    float: left;
    color: #fff;
    margin-top: 150px
}

span.sf-tot {
    opacity: .3;
}

span.sf-curr::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: 1px;
    vertical-align: middle;
    background: #fff;
    margin: 0 10px;
    opacity: .3;
}

.mouse-icon {
    width: 35px;
    height: 60px;
    display: block;
    margin: 0 auto;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1
}

span.mi-foundation {
    display: block;
    width: 100%;
    height: 100%;
    border: 2px solid #fff;
    border-radius: 25px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

span.mi-dot {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(10px);
    -ms-transform: translateX(-50%) translateY(10px);
    transform: translateX(-50%) translateY(10px);
}

.mi-bg {
    position: absolute;
    left: 50%;

    -webkit-transform: translateX(-50%) translateY(10%);

    -ms-transform: translateX(-50%) translateY(10%);

    transform: translateX(-50%) translateY(10%)
}

.mi-bg.index_0 {

    -webkit-transform: translateX(-50%) translateY(-10%);

    -ms-transform: translateX(-50%) translateY(-10%);

    transform: translateX(-50%) translateY(-10%)
}

.mi-bg:nth-child(even) path {
    fill: #1A98A3;
}

.services-link {
    position: fixed;
    z-index: 2;
    left: 50%;
    bottom: 0;
    width: 35vh;
    height: 35vh;
    -webkit-transform: translate(-50%, 50%);
    -ms-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
}

.services-link::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0%;
    height: 0%;
    border-radius: 50%;
    background: #fff;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: -1;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

.services-link::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0%;
    height: 0%;
    border-radius: 50%;
    background: transparent;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: -1;
    border: 1px solid #fff;
    -webkit-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;
}

.services-link.is-inview::after {
    width: 100%;
    height: 100%;
}

.services-link.is-inview::before {
    width: 105%;
    height: 105%;
}


.services-link a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    text-decoration: none;
    color: #1A98A3;
    font-size: 20px;
    text-align: center;
    line-height: 30px;
    font-weight: 700;
}

.services-link:hover::before {
    width: 110%;
    height: 110%;
}

.services-link a span {
    position: absolute;
    left: 50%;
    top: 35%;
    -webkit-transform: translate(-50%, -25%);
    -ms-transform: translate(-50%, -25%);
    transform: translate(-50%, -25%);
    opacity: 0;
    -webkit-transition: all 1s ease .5s;
    -o-transition: all 1s ease .5s;
    transition: all 1s ease .5s;
}

.services-link.is-inview a span {
    opacity: 1;
    top: 25%;
}

.services-link a i {
    font-size: 100px;
    position: absolute;
    top: 20%;
    left: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -25%) rotate(0deg);
    -ms-transform: translate(-50%, -25%) rotate(0deg);
    transform: translate(-50%, -25%) rotate(0deg);
    z-index: 0;
    color: #000;
    -webkit-transition: all 1.5s ease .5s;
    -o-transition: all 1.5s ease .5s;
    transition: all 1.5s ease .5s;
}

.services-link.is-inview i {
    opacity: .02;
    -webkit-transform: translate(-50%, -25%) rotate(130deg);
    -ms-transform: translate(-50%, -25%) rotate(130deg);
    transform: translate(-50%, -25%) rotate(130deg);
}

.services-link:hover i {
    -webkit-transform: translate(-50%, -25%) rotate(180deg);
    -ms-transform: translate(-50%, -25%) rotate(180deg);
    transform: translate(-50%, -25%) rotate(180deg);
}

/*--------------------------------------------------
## Sheeria Text Box
---------------------------------------------------*/

.sheeria-text-box {
    display: block;
    width: 100%;
    float: left;
    padding: 5% 5% 10% 5%;
    position: relative;
    color: #fff;
    -webkit-transform: translateY(-35%);
    -ms-transform: translateY(-35%);
    transform: translateY(-35%);
    mix-blend-mode: multiply;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.sheeria-text-box::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #1BA2AD;
    border-radius: 35px;
    z-index: -1;
}

.sheeria-text-box::before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 150px;
    height: 150px;
    background: #fff;
    border-radius: 50%;
    -webkit-transform: translate(50%, 50%);
    -ms-transform: translate(50%, 50%);
    transform: translate(50%, 50%);
}

.sheeria-text-box .scroll-button {
    position: absolute;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
}


.sheeria-text-box .sheeria-title {
    width: 25%;
}

.sheeria-text-box .text-wrapper {
    width: 75%;
}

/*--------------------------------------------------
## Sheeria Button
---------------------------------------------------*/
.s-button {
    display: inline-block;
    position: relative;
    border: 1px solid #74BCC3;
    border-radius: 35px;
}

.s-button a {
    display: inline-block;
    padding: 10px 40px 10px 25px;
    border-radius: 35px;
    text-decoration: none;
    color: #000;
    font-weight: 700;
}

.s-button::after {
    content: "\f178";
    font-family: 'Font Awesome 6 Free';
    font-weight: 600;
    color: #74BCC3;
    background: #fff;
    padding: 15px;
    border-radius: 50%;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    display: inline-block;
    margin: 5px;
}

.s-button:hover::after {
    background: #74BCC3;
    color: #fff;
}

/*--------------------------------------------------
## Greek Theater Page
---------------------------------------------------*/

.the-greek-theater {
    display: block;
    float: left;
    width: 100%;
    box-sizing: border-box;
}

.greek-head {
    display: block;
    width: 100%;
    background: #21509F;
    padding: 5%;
    box-sizing: border-box;
    color: #fff;
    overflow: hidden;
    background-image: url("/front/img/gh-bg.png");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding-top: 160px;
}

.greek-head::before {
    content: "";
    display: block;
    position: absolute;
    top: -5%;
    left: 0;
    background-image: url("/front/img/greek-light.png");
    background-repeat: no-repeat;
    width: 40%;
    height: 100%;
    background-size: 100%;
    background-size: 100%;
    transform: rotate(20deg);
    transform-origin: top;
    animation-name: lightAnim;
    animation-duration: 15s;
    animation-iteration-count: infinite;
}

@keyframes lightAnim {
    0% {
        transform: rotate(20deg);

    }

    50% {
        transform: rotate(-20deg);

    }

    100% {
        transform: rotate(20deg);

    }
}

.greek-head .page-title::before {
    /* content: url("/front/img/page-title-shine-light.png"); */
    display: none
}

.greek-head .page-title {
    position: relative;
    top: unset;
    left: unset;
    transform: none;

}

.gh-images {
    display: block;
    float: left;
    width: 100%;
    margin-top: 100px;
}

.gh-image {
    display: block;
    float: left;
    width: 50%;
    padding-right: 5%;
    box-sizing: border-box;
}

.gh-image img {
    width: 100%;
}

.greek-form-sec {
    display: block;
    float: left;
    width: 100%;
    padding: 100px 0;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    margin-top: -35px;
    background: #fff;
}

.sheeria-form .field-wrap.half {
    width: 48%;
}

.tgt-logo {
    display: inline-block;
    width: 130px;
    margin-bottom: 25px;
    opacity: 0;

}

.tgt-logo img {
    width: 100%;
}

.gh-image-right {
    transform: translateY(-20%)
}

/*--------------------------------------------------
## Works Grid
---------------------------------------------------*/

.sheeria-works {
    display: block;
    float: left;
    width: 100%;
    /* padding: 0 5%; */
    box-sizing: border-box
}

.sheeria-work {
    display: block;
    width: 40%;
    float: left;
    margin: 0 5%;
    margin-bottom: 75px;

}

.sheeria-work a {
    text-decoration: none;
}

.work-image,
.work-image img {
    width: 100%;
    display: block;
    float: left;
    margin-bottom: 25px;
}

.work-image img {
    object-fit: cover;
    border-radius: 35px;
}

.work-meta {
    display: block;
    float: left;
    margin-left: 15px;
}

.work-title {
    font-size: 45px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #000
}

.work-cat {
    color: rgb(0 0 0 / 50%);
}

.works-load-more {
    display: block;
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 75px;
}

.lm-button {
    padding: 20px 40px;
    border: 1px solid #21509F;
    display: inline-block;
    background: #F2F2F2;
    font-weight: 700;
    border-radius: 35px;
    transition: all .4s ease;
}

.lm-button:hover {
    color: #fff;
    background: #21509F;
}

/*--------------------------------------------------
## Gallery
---------------------------------------------------*/

.sheeria-gallery {
    width: 100%;
    display: block;
    float: left;
}

.sheeria-gallery .gallery-item {
    width: 30%;
    margin-right: 3%;
    display: block;
    float: left;
    padding: 50px;
    /* background: #ebebeb; */
    /*background: #efefef;*/
    background: #fff;
    box-sizing: border-box;
    margin-bottom: 3%;
    height: 500px;
    border-radius: 8px;
    -webkit-box-shadow: 3px 3px 10px 3px #e6e6e6;
    -moz-box-shadow: 3px 3px 10px 3px #e6e6e6;
    box-shadow: 3px 3px 10px 3px #e6e6e6;
}

.sheeria-gallery .gallery-item img,
.sheeria-gallery .gallery-item video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


.gallery-item.vid {
    width: 63%;
}
.gallery-lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgb(0 0 0 / 80%);
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .4s ease, visibility .4s ease;
}

.gallery-lightbox.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: all
}

.gallery-lightbox .gallery-item video,
.gallery-lightbox .gallery-item img {
    position: absolute;
    width: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 100%);
    height: auto;
    transition: all .6s ease;
}

.gallery-lightbox.is-open .gallery-item video,
.gallery-lightbox.is-open .gallery-item img {

    transform: translate(-50%, -50%);
}

.gallery-lightbox .gallery-item {
    padding: 0;
    background: none;
    margin: 0;
    height: unset;
    margin: 0;
}

.s-slide-next,
.s-slide-prev {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    font-size: 30px;
    color: #fff;
    cursor: pointer;
    z-index: 3
}

.s-gallery-close {
    position: fixed;
    top: 50px;
    left: 50px;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
    z-index: 3
}

.s-slide-prev {
    left: 50px;
}

.s-slide-next {
    right: 50px;
}

/*--------------------------------------------------
## Project Page
---------------------------------------------------*/
.project-header {
    display: block;
    width: 100%;
    height: 100vh;
    position: relative;
    border-bottom: 2px solid #EAEAEA;
    margin-bottom: 75px;
    background-image: repeating-radial-gradient(circle at 0 0, transparent 0, #ffffff 10px), repeating-linear-gradient(#e9e9e9, #ffffff);
    background-color: #ffffff;
}

.project-title::before {
    content: url("/front/img/page-title-shine.png");
}

.project-header .section {
    height: 100vh;
}

.project-header .section .wrapper {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}

.project-title {
    margin-bottom: 50px;
}

.project-detail {
    display: block;
    float: left;
    margin-right: 100px;
}

.pd-title {
    font-size: 18px;
    display: block;
    margin-bottom: 15px;
    opacity: .5;
}

.pd-cont {
    font-size: 20px;
    font-weight: 700;
}

/*--------------------------------------------------
## Sheeria Title
---------------------------------------------------*/

.sheeria-title {
    display: block;
    float: left;
    position: relative;
    width: 100%
}

.sheeria-title::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: translate(-150%, 100%);
    -ms-transform: translate(-150%, 100%);
    transform: translate(-150%, 100%);
    width: 20px;
    height: 20px;
    background-image: url("/front/img/highlight.png");
    background-size: 20px 20px;
    background-repeat: no-repeat;
    opacity: 0;
    -webkit-transition: all .6s ease .3s;
    -o-transition: all .6s ease .3s;
    transition: all .6s ease .3s;
}

.sheeria-title.is-inview::before {
    opacity: 1;
    -webkit-transform: translate(-150%, 0%);
    -ms-transform: translate(-150%, 0%);
    transform: translate(-150%, 0%);
}

.sheeria-title h5 {
    line-height: 25px;
    font-weight: 700
}

.sheeria-title.light {
    color: #fff
}

/*--------------------------------------------------
## Landing Section
---------------------------------------------------*/
.sheeria-landing {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden
}


/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {

    .sheeria-landing {
        /* The hack for Safari */
        height: -webkit-fill-available;
    }
}


.landing-content {
    position: absolute;
    top: 45%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    z-index: 2
}

.landing-content .scroll-button {
    display: inline-block;
    margin-top: 20px;
    position: relative;
    min-width: 1px;
    cursor: pointer
}

#scroll-button-text {
    letter-spacing: 1px;
    font-size: 7px;
    width: 100%;
    color: #21509F;
    font-weight: 700;
    opacity: 0
}

.scroll-button-icon,.scroll-button-icn {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -100%);
    -ms-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
    font-size: 25px;
    color: #74BCC3;
    opacity: 0;
}

.scroll-button.active .scroll-button-icon {
    opacity: 1;
    transform: translate(-50%, -50%);
}
.scroll-button.active .scroll-button-icn {
    opacity: 1;
    transform: translate(-50%, -50%);
}

.scroll-button.active #scroll-button-text {
    opacity: 1
}

.scroll-button-icon::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #F2F2F2;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    z-index: -1;
    border: 1px solid #1BA2AD;
    opacity: 0;
    -webkit-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease
}

.scroll-button-icn::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #F2F2F2;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    z-index: -1;
    border: 1px solid #1BA2AD;
    opacity: 0;
    -webkit-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease
}

.scroll-button.active .scroll-button-icon::after {
    opacity: 1
}

.scroll-button-icon.in-view::after {
    opacity: 1;
}
.scroll-button.active .scroll-button-icn::after {
    opacity: 1
}

.scroll-button-icn.in-view::after {
    opacity: 1;
}
.landing-image {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    -webkit-transform: translatey(67%);
    -ms-transform: translatey(67%);
    transform: translatey(67%);
}

.landing-image::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: rgb(255, 255, 255);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 40%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(40%, rgba(0, 0, 0, 1)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 40%);
    opacity: 0;
    -webkit-transition: all .7s ease .7s;
    -o-transition: all .7s ease .7s;
    transition: all .7s ease .7s;
}

.landing-image.is-inview::after {
    opacity: 1
}

.sheeria-chairs {
    display: block;
    width: 100%;
    height: auto;
}

.sheeria-chairs > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    float: left;
    width: 100%;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sheeria-chairs img {
    z-index: -1
}

.charis-a {
    margin-bottom: -10%;
}

.charis-b {
    margin-bottom: -9%;
}

.charis-c {
    margin-bottom: -14%;
}

.charis-a img {
    width: 10%;
    margin: 0 6px;
}

.charis-b img {
    width: 11%;
    margin: 0 5px;
}

.charis-c img {
    width: 15%;
    margin: 0 15px;
}

.charis-d img {
    width: 25%;
    margin: 0 8px;
}

.charis-a img:first-child,
.charis-b img:first-child,
.charis-a img:last-child,
.charis-b img:last-child {
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    transform: translateY(-40px);
}

.charis-a img:nth-child(2),
.charis-b img:nth-child(2),
.charis-a img:nth-child(8),
.charis-b img:nth-child(8) {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
}

.charis-a img:nth-child(3),
.charis-b img:nth-child(3),
.charis-a img:nth-child(7),
.charis-b img:nth-child(7) {
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
}

.charis-a img:nth-child(4),
.charis-b img:nth-child(4),
.charis-a img:nth-child(6),
.charis-b img:nth-child(6) {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.charis-c img:first-child,
.charis-c img:last-child,
.charis-d img:first-child,
.charis-d img:last-child {
    -webkit-transform: translateY(-60px);
    -ms-transform: translateY(-60px);
    transform: translateY(-60px);
}

.charis-c img:nth-child(2),
.charis-c img:nth-child(6) {
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    transform: translateY(-40px);
}

.charis-c img:nth-child(3),
.charis-c img:nth-child(5) {
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
}

.charis-d img:nth-child(2),
.charis-d img:nth-child(4) {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
}


/*--------------------------------------------------
## Play Music Button
---------------------------------------------------*/

.play-music-button {
    display: inline-block;
    position: fixed;
    cursor: pointer;
    z-index: 11;
    right: 5%;
    bottom: 5%;
}

.play-music-button.align-right {
    float: right
}

.pmb-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -45%);
    -ms-transform: translate(-50%, -45%);
    transform: translate(-50%, -45%);
    z-index: 5;
    color: #fff;
    width: 40px;
    height: 35px;
    z-index: 7;
    display: block;
    text-align: center;
}

.pmb-icon span {
    display: inline-block;
    background: #fff;
    height: 75%;
    width: 7px;
    vertical-align: middle;
}

#pmb-text {
    font-size: 10px;
    opacity: 0
}

.play-music-button::before {
    content: "";
    display: block;
    position: absolute;
    width: 50px;
    height: 50px;
    background: #000;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    border-radius: 50%;
    -webkit-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease
}

.play-music-button.is-sticked::before {
    width: 75px;
    height: 75px
}

/*--------------------------------------------------
## Clients
---------------------------------------------------*/

.sheeria-clients {
    display: block;
    float: left;
    width: 100%;
}

.clients-wrap {
    display: block;
    float: left;
    width: 100%;
}

.sheeria-clients .client {
    display: block;
    width: 20%;
    float: left;
    border: 1px solid #00000012;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 0;
}

.sheeria-clients .client img {
    width: 60%;
    display: inline-block;
}

.sheeria-clients .client img.light-logo {
    display: none;
}

.sheeria-clients .client:hover img.light-logo {
    display: inline-block
}

.sheeria-clients .client:hover img.dark-logo {
    display: none
}

.sheeria-clients .client:hover {
    background: #000
}

.sheeria-clients .Acquisitions:hover {
    background: #f2f2f2;
  }

/*--------------------------------------------------
## Team Carousel
---------------------------------------------------*/

.sheeria-team-carousel {
    display: block;
    float: left;
    width: 100%;
}

.team-carousel-head {
    display: block;
    float: left;
    width: 30%;
    margin-left: 6%;
}

.team-wrapper {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 50px;
    -webkit-transform: translateX(25%);
    -ms-transform: translateX(25%);
    transform: translateX(25%);
    margin-bottom: 100px;
}

.team-member-image,
.team-member-image img {
    width: 100%;
}

.team-member-name {
    font-size: 30px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 5px;
}

.team-member-title {
    opacity: .5;
}

.team-member {
    -ms-flex-preferred-size: 400px;
    flex-basis: 400px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 400px
}

.team-wrapper .sheeria-page-nav {
    margin-left: 130px;
    /* top: 50%; */
    top: 0;
    -webkit-transform: translateY(30%);
    -ms-transform: translateY(30%);
    transform: translateY(30%);
}

/*--------------------------------------------------
## Empty Space
---------------------------------------------------*/
.empty-space {
    display: block;
    width: 100%;
    float: revert;
    clear: both
}

/*--------------------------------------------------
## Text Wrapper
---------------------------------------------------*/
.text-rg {
    /* text-align: left; */
    text-align: justify;
}
.text-wrapper {
    display: block;
    float: left;
    width: 100%;

}

.text-wrapper.highlight.green::before {
    content: "";
    display: block;
    margin: 0 auto;
    width: 20px;
    height: 20px;
    background-image: url("/front/img/highlight-green.png");
    background-size: 20px 20px;
    background-repeat: no-repeat;
    margin-bottom: 10px;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
    opacity: 0;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.align-center {
    text-align: center
}

.text-wrapper.highlight.green.is-inview::before {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.fill-line {
    position: relative;
}

.fill-line.line-fill-layer {
    top: 0;
    left: 0;
    width: 0%;
    white-space: nowrap;
    overflow: hidden;
    color: #000
}

.has-anim {
    opacity: 0
}

img.has-anim {
    opacity: 1
}


/*--------------------------------------------------
# Text Scroll Animations
---------------------------------------------------*/

.anim-line {
    display: block;
    overflow: hidden
}

.anim-line span {
    display: block
}


/*------------------------------------------------------------------
# Responsive
-------------------------------------------------------------------**/
/*------------------------------------------------------------------
## Phone
-------------------------------------------------------------------**/

@media only screen and (max-width: 450px) {

    .s-button a {
        padding: 10px 20px;
    }

    .mi-bg::after {
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        height: 100vh;
        background: #21509f;
        bottom: 0;
        transform: translateY(50%) scaleY(5);
        transform-origin: top;
    }

    .mi-bg:nth-child(even)::after {
        background: #1A98A3;
    }

    .mi-bg.index_0 {

        transform: translateX(-50%) translateY(-50%) scale(0.3);
    }


    .intro-logo {
        width: 100px;
    }

    .intro-button {
        padding: 10px 20px;
        font-size: 14px;
        bottom: 30%
    }

    .gallery-lightbox .gallery-item video,
    .gallery-lightbox .gallery-item img {
        width: 90%;
    }

    .s-slide-next {
        right: 30px;
    }

    .s-slide-prev {
        left: 30px;
    }

    .greek-head {
    background-image: none;
    /* padding-top: 15%; */
    padding-top: 150px;
}

.greek-desc br {
    display: none;
}

.gh-image {
    width: 100%;
    padding: 0;
    margin-bottom: 50px;
}

.greek-head::before {
    /* left: 50%; */
    left:0;
    top: -5%;
    width: 100%;
    /* transform: translateX(-50%); */
}

    .project-detail {
        margin-bottom: 50px;
    }

    .project-detail:last-child {
        margin-bottom: 0;
    }

    .sheeria-gallery .gallery-item {
        width: 100%;
        margin-right: 0;
        padding: 20px;
    }

    .sheeria-work {
        margin: 0;
        width: 100%;
        margin-bottom: 50px;
    }

    .sheeria-works {
        padding: 0;
    }

    .page-description br {
        display: none;
    }

    .page-description {
        font-size: 18px;
        line-height: 25px;
        display: block;
        width: 100%;
        float: left;
    }

    .page-desc {
        padding: 35px;
        right: 5%;
        transform: translateY(40%);
        left: 5%;
    }

    .page-desc::before {
        float: left;
        width: 35px;
        height: 35px;
        margin-right: 15px;
    }

    .page-desc-title {
        float: left;
        margin-top: 10px;
    }

    .sheeria-text-box {
        -webkit-transform: translateY(-60%);
        -ms-transform: translateY(-60%);
        transform: translateY(-60%)
    }

    .play-music-button {
        right: 20%
    }

    .mi-bg {
        -webkit-transform: translateX(-50%) translateY(10%) scale(0.3);
        -ms-transform: translateX(-50%) translateY(10%) scale(0.3);
        transform: translateX(-50%) translateY(10%) scale(0.3);
    }

    .about-header .scroll-button {
        bottom: -3%
    }

    h1.big-title {
        font-size: 35px;
        line-height: 45px;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    
    h1.abouttext {
        font-size: 27px !important;
        /*text-align: justify !important;*/
    }

    .page-title h1.big-title {
        font-size: 60px;
        line-height: 70px;
    }

    .section.contact-sec {
        border-top-left-radius: 50px;
        border-top-right-radius: 50px
    }

    .services-wrap {
        height: 300px
    }

    .site-navigation {
        display: none;
    }

    .site-branding {
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    /* .language-switcher {
        display: none;
    } */

    .fullscreen-menu-wrap,
    .fullscreen-cta,
    .fullscreen-widget {
        width: 100%;
    }

    .fs-menu ul.menu.main-menu li {
        font-size: 40px;
        line-height: 50px;
        margin-bottom: 15px;
    }

    .fullscreen-menu-wrap {
        height: 70%;
    }

    .cta-text {
        font-size: 30px;
        line-height: 40px;
        display: inline-block;
    }

    .cta-icon {}

    .cta-icon::after {
        display: none;
    }

    .fullscreen-cta {
        height: 30%;
    }

    .fullscreen-widget {
        height: 25%;
        display: none;
    }

    .fs-widget-wrap {
        left: 0;
        right: unset;
        width: 100%;
        text-align: unset;
        padding: 0 5%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    ul.menu.fs-widget-menu {
        display: block;
        float: left;
        width: 50%;
    }

    .fs-widget-wrap .language-switcher {
        display: block;
        float: left;
        width: 50%;
    }


    img.like-this {
        width: 60vw;
    }


    .landing-image {
        -webkit-transform: translateY(60%) scale(1.5);
        -ms-transform: translateY(60%) scale(1.5);
        transform: translateY(60%) scale(1.5)
    }

    .landing-image.is-inview::after {
        opacity: .7;
    }

    .charis-d img {
        margin: 0 2px;
    }

    .charis-c img {
        margin: 0 5px;
    }

    .charis-b img {
        margin: 0 2px;
    }

    .charis-a img {
        margin: 0 2px;
    }

    .sheeria-title br {
        display: none
    }

    .hide-mobile {
        display: none
    }

    .play-music-button.align-right {}

    h1 {
        font-size: 30px;
        line-height: 40px;
    }

    .services-head {
        width: 100%;
        margin-bottom: 50px;
    }

    .services-wrap.swiper-container {
        display: block;
        float: left;
        width: 100%;
    }

    .services-fraction {
        margin-top: 50px;
    }

    p.service-content {
        width: 100%;
    }

    .sheeria-services-hold {
        top: 35%
    }

    .team-member {
        -ms-flex-preferred-size: 65vw;
        flex-basis: 65vw;
        width: 65vw
    }

    .team-wrapper {
        -webkit-transform: translateX(5%);
        -ms-transform: translateX(5%);
        transform: translateX(5%)
    }

    .text-wrapper p br {
        display: none
    }

    .sheeria-clients .client {
        width: 50%;
    }

    .footer-headline {
        padding: 15px;
        border-radius: 15px;
    }

    .fh-title {
        font-size: 30px;
        line-height: 43px;
    }

    .c-col-9.footer-top-right {
        padding: 0;
    }

    .fh-sub-text {
        margin-bottom: 20px;
    }

    .footer-headline::after {
        opacity: .2;
        top: -15px;
        position: static;
        width: 100px;
        height: 100px;
        background-size: 100px 100px;
    }

    .wrapper.footer-top {
        margin-bottom: 0;
    }

    .wrapper.footer-bottom .c-col-2 {
        width: 50%;
        padding: 0 5px;
        margin-bottom: 15px
    }

    .wrapper-full.footer-sub-bar {
        text-align: center;
    }

    .back-to-top {
        display: none
    }

    .text-wrapper br {
        display: none
    }

    .sheeria-services-hold {
        opacity: 0;
    }

    .sheeria-title::before {
        position: static;
        display: block;
        width: 20px;
        margin-bottom: 10px;
    }

    .fullscreen-widget .text-wrapper {
        width: 50%;
        float: right;
    }

    .fh-title .circle::after {
        width: 100px;
        height: 100px;
        background-size: 100px 100px;
    }

    .sheeria-vision-objective > div {
        width: 100%;
        padding-bottom: 100%;
    }

    .svo-content h4 {
        font-size: 16px;
        line-height: 25px;
    }

    .svo-title {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .greek-bg {
        height: 100%;
    }

    .greek-bg img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
    }

    .greek-wrap {
        padding-bottom: 0;
    }

    .page-header-content {
        height: auto;
        position: static;
        overflow: hidden;
        background: #1DA5AF;
        border-top-left-radius: 50px;
        border-top-right-radius: 50px;
    }

    .svg-bg {
        display: none;
    }

    .page-header-content .c-col-3 {
        padding-left: 15px;
        padding-right: 15px;
    }

    h2 {
        font-size: 24px;
        line-height: 32px;
    }

    .about-header .scroll-button::after {
        content: "";
        display: block;
        width: 150px;
        height: 150px;
        background: #fff;
        position: absolute;
        top: 50%;
        left: 0;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        border-radius: 50%;
        z-index: -1;
    }

    .about-header .page-header-bg {
        height: 65%
    }

    .page-header-content .sheeria-title {
        display: inline-block;
        float: none;
        width: auto;
    }

    .page-header-content .c-col-3 {
        text-align: center
    }

    .greek-content h2 {
        font-size: 35px;
        line-height: 45px;
    }

    p.g-text {
        padding: 0 15px;
    }

    .sheeria-title.is-inview::before {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }


    /* This used to work for the parent element of button divs */
    /* But it does not work with newer browsers, the below doesn't hide the play button parent div */

    .sheeria-intro .intro-video video::-webkit-media-controls-panel {
        display: none !important;
        -webkit-appearance: none;
    }

    /* Old shadow dom for play button */

    .sheeria-intro .intro-video video::-webkit-media-controls-play-button {
        display: none !important;
        -webkit-appearance: none;
    }

    /* New shadow dom for play button */

    /* This one works! */

    .sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
        display: none !important;
        -webkit-appearance: none;
    }

    .sheeria-intro .intro-video video::-webkit-media-controls {
        opacity: 0;
    }

    .sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
        display: none !important;
    }

    .sheeria-intro .intro-video video::-webkit-media-controls-panel,
    .sheeria-intro .intro-video video::-webkit-media-controls-start-playback-button {
        display: none !important;
    }

    .sheeria-text-box .sheeria-title {
        width: 100%;
    }

    .sheeria-text-box .text-wrapper {
        width: 100%;
    }

    .sheeria-text-box .scroll-button {
        right: unset;
        left: 50%;
        -webkit-transform: translateY(50%);
        -ms-transform: translateY(50%);
        transform: translateY(50%);
    }

    .sheeria-text-box::before {
        right: unset;
        left: 50%;
        -webkit-transform: translate(-50%, 50%);
        -ms-transform: translate(-50%, 50%);
        transform: translate(-50%, 50%);
    }

    .sheeria-text-box {
        padding-bottom: 150px;
    }

    .sheeria-vision {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .sheeria-objective {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }

    .sheeria-vision-objective {
        margin-top: 50px;
    }

    .svg-circle.low {
        display: none;
    }

    .greek-logo {
        width: 25%;
        margin-top: 50px;
    }

    .greek-logo img {
        width: 100%;
    }

    .greek-content {
        display: block;
        width: 80%;
        margin: 0 auto;
    }

    .greek-theater-section {
        overflow: hidden;
    }

    .sheeria-text-box .text-wrapper h3 {
        /* font-size: 25px; */
        font-size: 16px;
        line-height: 35px;
    }

    .g-text br {
        display: none
    }


}

/*------------------------------------------------------------------
## Tablets
-------------------------------------------------------------------**/



@media (min-width: 450px) and (max-width: 1180px) {

    .intro-logo img {
        width: 150px !important;
    }

    h1.big-title {
        font-size: 50px;
        line-height: 60px;
    }

    p.service-content {
        width: 100%
    }

    .text-wrapper br {
        display: none
    }

    .sheeria-clients .client {
        width: 50%;
    }

    .c-col-3.footer-top-left {
        width: 100%;
    }

    .c-col-9.footer-top-right {
        width: 100%;
    }

    .wrapper.footer-bottom .c-col-2 {
        width: 25%;
    }

    .wrapper.footer-bottom .c-col-4 {
        display: none;
    }

    .team-member {
        width: 250px;
        -ms-flex-preferred-size: 250px;
        flex-basis: 250px;
    }

    .c-col-md-12 {
        width: 100%;
    }

    .like-this {
        width: 350px
    }

    .landing-image {
        -webkit-transform: scale(1.2) translateY(50%);
        -ms-transform: scale(1.2) translateY(50%);
        transform: scale(1.2) translateY(50%);


    }

    .page-header-content .c-col-9 {
        padding: 5%;
    }

    h2 {
        font-size: 30px;
        line-height: 40px;
    }

    #scroll-button-text {
        font-size: 7.5px
    }

    .sheeria-clients .client {
        width: 20%
    }
    



}