/*
Theme Name: Aida Saravi
Theme URI: https://www.hidokmeh.com/
Author: Dokmeh Agency
Author URI: https://www.hidokmeh.com/
Description: Aida Saravi theme
Text Domain: dokmeh
*
/*
/*================FONTS===============*/
html,body,p,span,a,ul li,ol li,textarea,input,h1,h2,h3,h4,h5,h6{
    font-family: 'JetBrains Mono', monospace;
}
/*================FONTS===============*/
/*============GENERAL CLASS==============*/
html {line-height: 1.15;-webkit-text-size-adjust: 100%;}body {margin: 0;}main {display: block;}h1 {font-size: 2em;margin: 0.67em 0;}hr {-webkit-box-sizing: content-box;box-sizing: content-box;height: 0;overflow: visible;}pre {font-family: monospace, monospace;font-size: 1em;}a {background-color: transparent;}abbr[title] {border-bottom: none;text-decoration: underline;-webkit-text-decoration: underline dotted;text-decoration: underline dotted;}b, strong {font-weight: bolder;}code, kbd, samp {font-family: monospace, monospace;font-size: 1em;}small {font-size: 80%;}sub, sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}sub {bottom: -0.25em;}sup {top: -0.5em;}img {border-style: none;}button, input, optgroup, select, textarea {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;}button, input {overflow: visible;}button, select {text-transform: none;}button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}fieldset {padding: 0.35em 0.75em 0.625em;}legend {-webkit-box-sizing: border-box;box-sizing: border-box;color: inherit;display: table;max-width: 100%;padding: 0;white-space: normal;}progress {vertical-align: baseline;}textarea {overflow: auto;}[type="checkbox"], [type="radio"] {-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0;}[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}[type="search"] {-webkit-appearance: textfield;outline-offset: -2px;}[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}details {display: block;}summary {display: list-item;}template {display: none;}[hidden] {display: none;}
:root {
    --height-header: 12vh;
    --white-color: #fff;
    --black-color: #000000;
    --light-gray: #868686;
    --background-color:#FFF8E7;
    --header-height:12vh;
    --filter-height:5vh;
}
h1,h2,h3,h4,h5,h6 {
    font-weight: 700;
}

hr {
    margin: 1rem 0;
    color: inherit;
    border: 0;
    opacity: .25
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2;
}

.h1,
h1 {
    font-size: calc(1.375rem + 1.5vw)
}

@media (min-width:1200px) {
    .h1,
    h1 {
        font-size: 2.5rem
    }
}

.h2,
h2 {
    font-size: calc(1.325rem + .9vw)
}

@media (min-width:1200px) {
    .h2,
    h2 {
        font-size: 2rem
    }
}

.h3,
h3 {
    font-size: calc(1.3rem + .6vw)
}

@media (min-width:1200px) {
    .h3,
    h3 {
        font-size: 1.75rem
    }
}

.h4,
h4 {
    font-size: calc(1.275rem + .3vw)
}

@media (min-width:1200px) {
    .h4,
    h4 {
        font-size: 1.5rem
    }
}

.h5,
h5 {
    font-size: 1.25rem
}

.h6,
h6 {
    font-size: 1rem
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
    line-height: 1.5;
}

ul,li{
    padding: 0;
    margin: 0;
    list-style: none;
}
*:focus{
    outline: unset;
    outline-color: transparent !important;
    -webkit-box-shadow: unset !important;
    box-shadow: unset !important;
}
*,
::after,
::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}
a,a:hover {
    color: inherit;
    text-decoration: none;
}

html::-webkit-scrollbar {
    width: 6px;
}

html::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px var(--white-color);
    box-shadow: inset 0 0 6px var(--white-color);
}
html::-webkit-scrollbar-thumb {
    background-color: var(--black-color);
    outline: 1px solid var(--black-color);
    border-radius: 10px;
}
body{
    background-color: var(--white-color);
}
*,*:focus,*:focus-visible {
    outline: unset !important;
    outline-color: transparent !important;
}
::-moz-selection {
    background-color: var(--black-color);
    color: var(--white-color);
}
::selection {
    background-color: var(--black-color);
    color: var(--white-color);
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    border-bottom: 1px solid var(--black-color);
    -webkit-text-fill-color: var(--black-color);
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s;
}
.wpcf7-not-valid-tip {
    position: absolute;
    white-space: pre;
    right: 0;
    bottom: 0;
    -webkit-transform: translateY(-172%);
    -ms-transform: translateY(-172%);
    transform: translateY(-172%);
    font-size: 0.75rem;
}
.input.submit {
    position: relative;
    height: 6rem;
}

.input.submit input {
    padding: 0 !important;
    margin: 0 !important;
}

.wpcf7-spinner::after{
    content: 'LOADING ...';
    position: absolute;
    -webkit-animation: splotlight 1.5s linear infinite;
    animation: splotlight 1.5s linear infinite;
    color: #000;
    white-space: pre;
    top: 2px;
    right: 0;
    background-color: #fff;
    height: 30px;
    padding-top: 3px;
}

.wpcf7-spinner {
    margin: 0;
    border-radius: 0;
    position: absolute;
    background-color: transparent;
    width: auto;
    height: auto;
}
form.submitting input[type="submit"] {
    opacity: 0;
}

.wpcf7-spinner::before {
    opacity: 0;
    display: none;
}

@keyframes splotlight{
    0%{
        opacity:1
    }
    50%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
.wpcf7-form-control-wrap {display: block;}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #ff0000;
}
.wpcf7 form .wpcf7-response-output {
    padding: 12px 10px;
    position: absolute;
    width: 100%;
    bottom: -20px;
    text-align: center;
    -webkit-animation: splotlight 2s linear infinite;
    animation: splotlight 2s linear infinite;
}
@-webkit-keyframes splotlight{
    0%{
        opacity:1
    }
    50%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
@keyframes splotlight{
    0%{
        opacity:1
    }
    50%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
.wpcf7 form.sent .wpcf7-response-output {

}
form textarea ~ .wpcf7-not-valid-tip {
    bottom: 10px;
}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}
input[type="number"]{
    -moz-appearance: textfield;
}
.padding-class {
    padding-left: 5vw;
    padding-right: 5vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-class-big{
    padding-right: 10vw;
    padding-left: 10vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-class-half-big{
    padding-right: 5vw;
    padding-left: 10vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.padding-class-project {
    padding-left: 4vw;
    padding-right: 4vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.scroll-down {
    bottom: 0;
    height: 100px;
    left: 0;
    margin: 0 0 8vh 5vw;
    position: absolute;
    text-align: center;
    z-index: 1;
    -webkit-transition: all ease-in-out 1s;
    -o-transition: all ease-in-out 1s;
    transition: all ease-in-out 1s;
}
html.scroll .scroll-down {
    opacity: 0;
}
.scroll-down-text {
    color: #fff;
    font-size: 0.7rem;
    padding-bottom: 14px;
}
.scroll-down-bar {
    background: #aeaeae;
    top: 20px;
    display: inline-block;
    height: 65px;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    width: 2px;
    margin: 0 auto;
}
.scroll-down-bar::before {
    -webkit-animation: scrollDown 1.5s infinite;
    animation: scrollDown 1.5s infinite;
    background: #2c2c2c;
    content: '';
    display: inline-block;
    height: 35px;
    left: 0;
    position: absolute;
    top: 0;
    width: 2px;
    z-index: 1;
}
@-webkit-keyframes scrollDown {
    0% {
        -webkit-transform: translate3d(0, -32px, 0);
        transform: translate3d(0, -32px, 0);
    }
    50% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    100% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: translate3d(0, 65px, 0);
        transform: translate3d(0, 65px, 0);
    }
}
@keyframes scrollDown {
    0% {
        -webkit-transform: translate3d(0, -32px, 0);
        transform: translate3d(0, -32px, 0);
    }
    50% {
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    100% {
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-transform: translate3d(0, 65px, 0);
        transform: translate3d(0, 65px, 0);
    }
}
section.aboutSloganContainer .scroll-down .scroll-down-text {
    color: #fff;
}
form textarea {
    resize: unset;
}
section.aboutSloganContainer .scroll-down .scroll-down-bar {
    background-color: #fff;
}
section.drawSectionContainer {
    position: relative;
    width: 100%;
    display: block;
    padding-bottom: 3rem;
    background-color: #fff;
}
section.drawSectionContainer .buttonWrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 3rem;
    -moz-column-gap: 3rem;
    column-gap: 3rem;
}

section.drawSectionContainer .buttonWrapper button {
    background-color: transparent;
    border: unset;
    -webkit-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    transition: all linear 0.3s;
    cursor: pointer;
}

section.drawSectionContainer .buttonWrapper button:hover {
    opacity: 0.6;
}

section.drawSectionContainer h2 {
    font-weight: 300;
    text-transform: capitalize;
}

section.drawSectionContainer canvas#signature-pad {
    width: 100%;
    height: 25vh;
}
section.drawSectionContainer .drawSignatureWrap {
    position: relative;
    padding: 3rem 0;
}
.router-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    background-color: var(--black-color);
    pointer-events: none;
    z-index: 9998;
    /*display: none;*/
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: top;
    -ms-transform-origin: top;
    transform-origin: top;
    -webkit-transition: all ease-in-out 1200ms;
    -o-transition: all ease-in-out 1200ms;
    transition: all ease-in-out 1200ms;
}
.router-overlay.inSight{
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
}
.router-overlay-first {
    position: fixed;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    background-color: var(--white-color);
    pointer-events: none;
    z-index: 9998;
}
main.pageWrapper {
    padding-top: var(--height-header);
}
section.pageContainer {
    position: relative;
    width: 100%;
    display: block;
    padding-bottom: 7rem;
    padding-top: 2rem;
}
.dg.ac {
    display: none;
}
/*============GENERAL CLASS==============*/
/*============404==============*/
main.notFoundWrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

main.notFoundWrapper canvas {
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    top: 0;
    left: 0;
    z-index: 0;
}

main.notFoundWrapper .notFoundContainer {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

main.notFoundWrapper .notFoundContainer h1 {
    font-size: 9rem;
}

main.notFoundWrapper .notFoundContainer h2 {
    font-size: 3rem;
}
canvas#canvas-webgl {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    mix-blend-mode: difference;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    z-index: -1;
    pointer-events: none;
}
main.notFoundWrapper .notFoundContainer p {
    width: 25%;
    text-align: center;
    margin: 2rem 0;
}
main.notFoundWrapper .notFoundContainer a.button:hover {
    background-color: var(--white-color);
    color: var(--black-color);
}
main.notFoundWrapper .notFoundContainer a.button {
    text-transform: uppercase;
    font-weight: 900;
    background-color: var(--black-color);
    color: #fff;
    padding: 10px 20px;
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
    border: 1px solid var(--black-color);
}
/*============404==============*/
/*============LOADING==============*/
#loading {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: var(--white-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: all 1s cubic-bezier(.77,0,.175,1) 0s;
    -o-transition: all 1s cubic-bezier(.77,0,.175,1) 0s;
    transition: all 1s cubic-bezier(.77,0,.175,1) 0s;
}
html.loaded #loading {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
}
#loading .loading-text p {
    color: var(--black-color);
    font-weight: 400;
    font-size: 8rem;
    margin: 0;
    line-height: 8rem;
    opacity: 0;
}
#loading .loading-text {
    margin: 0;
    color: var(--black-color);
    text-transform: uppercase;
    position: relative;
    overflow: hidden;
}
#loading .loadLine {
    position: relative;
    width: 100%;
    height: 1px;
}

#loading .loadLine::before {
    content: '';
    -webkit-transition: all 2s cubic-bezier(.77,0,.175,1) 0s;
    -o-transition: all 2s cubic-bezier(.77,0,.175,1) 0s;
    transition: all 2s cubic-bezier(.77,0,.175,1) 0s;
    position: absolute;
    width: 0;
    height: 100%;
    background-color: var(--black-color);
    left: 0;
    top: -17px;
    -webkit-animation: growLine 2s cubic-bezier(.77,0,.175,1) forwards 0.2s;
    animation: growLine 2s cubic-bezier(.77,0,.175,1) forwards 0.2s;
}
@-webkit-keyframes growLine{
    to{
        width:100%
    }
}
@keyframes growLine{
    to{
        width:100%
    }
}
#loading .loading-text p .char {
    opacity: 0;
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
}
/*============LOADING==============*/
/*----------CURSOR---------------*/
#vertical.no-mouse {
    pointer-events: none;
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#cursor {
    position: fixed;
    z-index: 900;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    opacity: 1;
    mix-blend-mode: difference;
    opacity: 0;
    -webkit-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    transition: all linear 0.3s;
}
.object, .circle, .hbar, .bar {
    position: fixed;
    will-change: transform;
}

.bar {
    height: 300vh;
    margin: -150vh 0 0 0;
}
html.loaded #cursor {
    opacity: 1;
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s;
}
.hbar {
    width: 500vw;
    margin: 0 0 0 -250vw;
}

.circle {
    border-radius: 50%;
}
#vertical .hbar {
    margin: -250vh 0 0 0 ;
    height: 500vh;
}
html.home #cursor {
    mix-blend-mode: overlay;
}

html.home #cursor .hbar,#cursor .hbar {
    border-color: #fff !important;
}

html.home #cursor .coordinate-box .simultaneousC span,#cursor .coordinate-box .simultaneousC span {
    color: #fff;
}
/*----------CURSOR---------------*/
/*============NAV & HEADER==============*/
header {
    position: fixed;
    width: 100%;
    z-index: 99;
    height: var(--height-header);
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 5vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-column-gap: 5rem;
    -moz-column-gap: 5rem;
    column-gap: 5rem;
}
header .identity {
    position: relative;
    display: inline-block;
}
header .identity img {
    width: 13rem;
    height: auto;
    aspect-ratio: auto 6 / 1;
    -o-object-fit: contain;
    object-fit: contain;
}
header #menu {
    position: relative;
    width: 70px;
    height: 27px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    cursor: pointer;
    padding: 5px 10px;
}
header #menu span {
    position: relative;
    width: 100%;
    display: block;
    height: 1px;
    background-color: var(--white-color);
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.Menu-list-item {
    position: relative;
    color: transparent;
    cursor: pointer;
    display: inline-block;
}

.Menu-list-item::before {
    content: "";
    display: block;
    position: absolute;
    top: 49%;
    left: 30px;
    right: 0;
    height: 1px;
    border-radius: 4px;
    margin-top: -2px;
    background: #ffffff;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    transition: -webkit-transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    -o-transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98), -webkit-transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    z-index: 1;
    pointer-events: none;
}

.Mask {
    white-space: pre;
    display: block;
    position: absolute;
    overflow: hidden;
    color: #ffffff;
    top: 0;
    height: 49%;
    -webkit-transition: all 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    -o-transition: all 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    transition: all 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
    left: 35px;
}

.Mask span {
    display: block;
}

.Mask + .Mask {
    top: 48.9%;
    height: 51.1%;
}

.Mask + .Mask span {
    -webkit-transform: translateY(-49%);
    -ms-transform: translateY(-49%);
    transform: translateY(-49%);
}

.Menu-list-item:hover .Mask, .Menu-list-item:active .Mask {
    color: rgb(147 149 152);
    -webkit-transform: skewX(12deg) translateX(3px);
    -ms-transform: skewX(12deg) translateX(3px);
    transform: skewX(12deg) translateX(3px);
}

.Menu-list-item:hover .Mask + .Mask, .Menu-list-item:active .Mask + .Mask {
    -webkit-transform: skewX(12deg) translateX(-3px);
    -ms-transform: skewX(12deg) translateX(-3px);
    transform: skewX(12deg) translateX(-3px);
}

.Menu-list-item:hover::before, .Menu-list-item:active::before {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.Menu-list-item a > span:first-child {
    display: inline-block;
    margin-right: 10px;
    color: #ffffff;
    font-size: 16px;
    position: absolute;
}
#menu-container {
    position: fixed;
    z-index: 98;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    background-color: var(--black-color);
}
#menu-container canvas#webgl-canvas {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    opacity: .7;
}
#menu-container canvas#canvas {
    position: absolute;
    z-index: 0;
}
#menu-container .menuWrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 13rem;
    -moz-column-gap: 13rem;
    column-gap: 13rem;
}

#menu-container .menuWrapper .menu-contact-info {
    position: relative;
    width: 50%;
}

#menu-container .menuWrapper nav.menu {
    /* width: 42%; */
    position: relative;
}
.dg.ac {
    display: none !important;
}
#menu-container .menuWrapper .menu-contact-info-wrapper {
    position: relative;
    width: 48%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 60vh;
    -webkit-column-gap: 4rem;
    -moz-column-gap: 4rem;
    column-gap: 4rem;
}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap {
    width: 35%;
    color: #fff;
}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box {
    width: 70%;
    position: relative;
    height: 100%;
}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap ul {position: relative;text-align: right;}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap ul li {
    line-height: 1.7;
}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap h3.text {
    margin-bottom: 1.2rem;
    padding-left: 5rem;
    text-align: right;
    font-size: 1rem;
}
#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box span:first-child {
    display: block;
    width: 3px;
    height: 100%;
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    position: relative;
    opacity: 0;
}

#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box span:last-child {}

#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box::before {
    content: '';
    display: block;
    width: 3px;
    height: 100%;
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    position: absolute;
    left: 0;
}

#menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
    background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#menu-container .menuWrapper nav.menu ul.Menu-list {
    font-size: 3rem;
    line-height: 1.2;
    text-transform: capitalize;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transform: rotateX(-10deg) rotateY(20deg);
    transform: rotateX(-10deg) rotateY(20deg);
    margin: 0;
    padding: 0;
    row-gap: 2rem;
    font-weight: 300;
    width: auto;
}
html.op-menu header #menu span {
    opacity: 0;
    width: 80%;
}

html.op-menu header #menu span:first-child {
    opacity: 1;
    height: 4px;
    -webkit-transform: rotate(45deg) translate(2px, 7px);
    -ms-transform: rotate(45deg) translate(2px, 7px);
    transform: rotate(45deg) translate(2px, 7px);
}

html.op-menu header #menu span:last-child {
    opacity: 1;
    height: 4px;
    -webkit-transform: rotate(-45deg) translate(2px, -8px);
    -ms-transform: rotate(-45deg) translate(2px, -8px);
    transform: rotate(-45deg) translate(2px, -8px);
}
header.white-header .identity svg#logo path {
    fill: #000;
}
header.white-header #menu span {
    background-color: #000;
}
header.white-header {
    background-color: var(--white-color);
}
html.op-menu header.white-header {
    background-color: transparent;
}

html.op-menu header.white-header .identity svg#logo path {
    fill: var(--white-color);
}

html.op-menu header.white-header #menu span {
    background-color: #fff;
}
header.transparent-header.bg-effect {
    background-color: var(--white-color);
}
header.transparent-header {
    -webkit-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}
header.transparent-header.bg-effect .identity svg#logo path {
    fill: #000;
}

header.transparent-header .identity svg#logo path {
    -webkit-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}

header.transparent-header.bg-effect #menu span {
    background-color: var(--black-color);
}

html.op-menu header.transparent-header.bg-effect {
    background-color: transparent;
    -webkit-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}

html.op-menu header.transparent-header .identity svg#logo path {
    fill: #fff;
}

html.op-menu header.transparent-header.bg-effect #menu span {
    background-color: var(--white-color);
}
header.white-header.notFoundHeader {
    background-color: transparent;
}
/*============NAV & HEADER==============*/
/*============HOME==============*/
main.homeWrapper {
    position: relative;
    width: 100%;
    display: block;
    height: 100vh;
    overflow: hidden;
}
main.homeWrapper section.homeContainer {
    position: relative;
    width: 100%;
    height: 100%;
    display: inline-block;
}
main.homeWrapper section.homeContainer .video-overlay {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 0;
}
main.homeWrapper section.homeContainer .video-overlay video {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
main.homeWrapper section.homeContainer .homeWrap {
    position: relative;
    z-index: 1;
}
main.homeWrapper section.homeContainer .homeWrap {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn {
    position: relative;
    width: 50%;
    overflow: hidden;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap {
    position: relative;
    height: 50%;
    overflow: hidden;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p.location {
    font-weight: 500;
    text-transform: capitalize;
    margin-bottom: 0.5rem;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p.date {
    font-weight: 100;
}
#menu-container .video-mobile-overlay-wrapper {
    display: none;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn:first-child {
    height: 100%;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.other {
    margin-top: 1rem;
    padding-top: 1rem;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .homeColumnBox {
    position: relative;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -webkit-transform: translateX(-120%);
    -ms-transform: translateX(-120%);
    transform: translateX(-120%);
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap > * {
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran p {
    -webkit-transform: translateY(500%);
    -ms-transform: translateY(500%);
    transform: translateY(500%);
}
body.loadPage main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap > * {
    -webkit-transform: translateY(0) !important;
    -ms-transform: translateY(0) !important;
    transform: translateY(0) !important;
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.other p {
    -webkit-transform: translateY(-500%);
    -ms-transform: translateY(-500%);
    transform: translateY(-500%);
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child {
    padding: 3rem 0 3rem 2rem;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child::before {
    content: '';
    position: absolute;
    width: 3px;
    height: 0;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}
body.loadPage main.homeWrapper section.homeContainer .homeWrap .homeColumn .homeColumnBox {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s;
}
main.homeWrapper section.homeContainer .video-overlay::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--black-color);
    opacity: 0.25;
}
body.loadPage section.aboutSloganContainer .slogan-info-wrap h1 {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s;
}

body.loadPage section.aboutSloganContainer .slogan-info-wrap p.text {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 1.2s;
    -o-transition-delay: 1.2s;
    transition-delay: 1.2s;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::before {
    content: '';
    width: 0;
    height: 3px;
    position: absolute;
    bottom: 0;
    right: 0;
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn h1 {
    margin: 0;
    font-weight: 100;
    text-align: justify;
    line-height: 1.5;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child .content {
    margin: 3rem 0;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child .content p {
    margin: 0;
    font-weight: 400;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child ul.social-media {
    list-style: none;
    margin: 0 0 3rem 0;
    padding: 0;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-column-gap: 2rem;
    -moz-column-gap: 2rem;
    column-gap: 2rem;
    margin-bottom: 0.5rem;
}

main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap > p {
    margin: 0;
    width: 25%;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap > p .line {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:first-child {
    font-size: 6rem;
    font-weight: 700;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:last-child {
    font-weight: 700;
    font-size: 4rem;
    letter-spacing: 0.7rem;
}
main.homeWrapper section.homeContainer .homeWrap .homeColumn h1 .line span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
body.loadePage main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::before {
    width: 100%;
}

body.loadPage main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::before {
    width: 100%;
}

body.loadPage main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child::before {
    height: 100%;
}
/*============HOME==============*/
/*------------------------------------------------contact*/
#slogan.contactSlogan #map {
    width: 100%;
    height: calc(100vh - var(--header-height));
}

section.contact-container {
    padding-top: 80px;
    padding-bottom: 60px;

}

section.contact-container .contact-item {
    padding-bottom: 10px;
    margin-bottom: 60px;
    border-bottom: 1px solid #8F8F8F;
}

section.contact-container .contact-item .title {
    margin-bottom: 10px;
    padding-bottom: 10px;
    text-transform: capitalize;
    font-size: 2rem;
}

section.contact-container .contact-item li {
    padding-bottom: 5px;
}

section.contact-container .contact-form input , section.contact-container .contact-form textarea {
    width: 100%;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #000;
    padding: 15px 0;
    margin-bottom: 20px;
}
section.contact-container .contact-form input[type="submit"] {
    border: none;
    text-align: right;
    font-size: 1.5rem;
    text-transform: uppercase;
}
#slogan.contactSlogan #map {
    width: 100%;
    height: calc(100vh - var(--header-height) - var(--header-height));
}

#slogan.contactSlogan #map img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
main.contactWrapper {
    padding-top: var(--height-header);
    opacity: 0;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}

body.loadPage main.contactWrapper {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
/*------------------------------------------------contact*/
/*------------------------------------------------blog*/
main.wrapper.blogWrapper:before {
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    background-color: var(--black-color);
    left: calc((100% / 3 ) * 2);
}
.blogSlogan .banner-text {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--light-gray);
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: right;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 1;
}
.blogSlogan .banner-text:before {
    content: '';
    position: absolute;
    width: 3px;
    height: 0;
    top: 50%;
    right: 5vw;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}

.blogSlogan .banner-text h1 {
    position: relative;
    padding-top: 20px;
    font-weight: 300;
    padding-right: 2rem;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -webkit-transform: translateY(-120%);
    -ms-transform: translateY(-120%);
    transform: translateY(-120%);
}
.blogSlogan .banner-text .bannerDate {
    height: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    overflow: hidden;
}
body.loadPage .blogSlogan .banner-text .date {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

body.loadPage .blogSlogan .banner-text h1 {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}
.blogSlogan .banner-text .bannerTitle {
    height: 50%;
    overflow: hidden;
}

body.loadPage .blogSlogan .banner-text:before {
    height: 90%;
}

.blogSlogan .banner-text:after {
    content: '';
    height: 3px;
    position: absolute;
    right: 5vw;
    width: 0;
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    top: 50%;
}

body.loadPage .blogSlogan .banner-text:after {
    width: 95%;
}
.blogSlogan .banner-text > * {
    padding-right: 0;
}
.blogSlogan .banner-text .date {
    color:var(--white-color);
    padding-bottom: 1rem;
    padding-right: 2rem;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -webkit-transform: translateY(120%);
    -ms-transform: translateY(120%);
    transform: translateY(120%);
}
.blogSlogan {
    position: relative;
}
.blogSlogan .banner-image {
    width: 100%;
    height: calc(100vh - var(--header-height));
    position: relative;
}

.blogSlogan .banner-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.blog-title {
    margin: 30px 0 20px;
}
.blog-item-container {
    position: relative;
    margin: 100px 0 120px;
}
.blog-item ,
.blog-item:hover{
    display: block;
    color: var(--light-gray);
}
.blog-item-image-date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.blog-item-image-date .blog-item-date{
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}
.blog-item:hover .blog-item-image-date .blog-item-date {
    letter-spacing: 3px;
}
.blog-item-image-date .blog-item-image {
    height: 60vh;
    position: relative;
}
.blog-item-image-date .blog-item-image ,
.blog-item-image-info-date .blog-item-info{
    width: calc((100% / 3 ) * 2);
}
.blog-item-image-date .blog-item-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.blog-item-date > * {
    text-align: center;
    width: 100%;
}
.blog-item-image-info-date .blog-item-info {
    padding: 30px 0;
}
.blog-item-image-info-date .blog-item-info > * {
    font-size: 1rem;
    font-weight: 300;
}
.blog-item-container .huge-title {
    position: absolute;
    z-index: -1;
}
.pagination-container {
    width: calc((100% / 3 ) * 2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding-top: 32px;
    padding-bottom: 32px;
    position: relative;
    color: var(--light-gray);
    padding-bottom: 3rem;
}
section.drawSectionContainer.blogPage {
    padding-top: 8rem;
}
.pagination-container:before {
    content: '';
    position: absolute;
    top: 0;
    width: calc(100% - 10vw);
    right: 0;
    height: 1px;
    background-color: var(--black-color);
}
.pagination-container .pagination-arrow img {
    cursor: pointer;
    width: 55px;
}
main.blogWrapper {
    padding-top: var(--height-header);
}
.blogSlogan::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.3);
    z-index: 1;
}
section.blogContainer {
    padding-bottom: 3rem;
}
.blog-item-image-date .blog-item-image::before {
    content: '';
    position: absolute;
    width: 2px;
    top: 50%;
    right: 3rem;
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(49.48%, #000000), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    height: 0;
}

.blog-item-image-date .blog-item-image::after {
    content: '';
    position: absolute;
    right: 3rem;
    height: 2px;
    background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, #000000 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(#000000));
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000000 100%);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    width: 0;
}
.blog-item.active .blog-item-image-date .blog-item-image::after {
    width: 110%;
}

.blog-item.active .blog-item-image-date .blog-item-image::before {
    height: 55%;
}
/*------------------------------------------------blog*/
/*------------------------------------------------blogSingle*/
.blogSingleSlogan .banner-image
.carousel-main ,
.blogSingleSlogan .banner-image .carousel-main .flickity-slider .carousel-cell{
    width: 100%;
    height: calc(100vh - var(--header-height) - var(--header-height));
}
.blogSingleSlogan .banner-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.blogSingleSlogan .banner-image .carousel-nav {
    padding: 15px;
}
.blogSingleSlogan .banner-image .flickity-slider{
    width: 100%;
    height: 100%;
}
main.blogSingleWrapper {
    padding-top: var(--height-header);
}
.blogSingleSlogan .banner-image .carousel-nav .flickity-viewport{
    width: 100%;
}
.blogSingleSlogan .banner-image .carousel-nav .carousel-cell {
    width: 85px;
    height: 85px;
    margin-right: 25px;
}
main.blogSingleWrapper .blogSingleSlogan .banner-image {
    position: relative;
}

main.blogSingleWrapper .blogSingleSlogan .banner-image .scroll-down {
    bottom: 6vh;
}
main.blogSingleWrapper {
    opacity: 0;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}

body.loadPage main.blogSingleWrapper {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s;
}
main.blogSingleWrapper .blogSingleSlogan .banner-image .scroll-down .scroll-down-text {
    color: #000;
}
.blogSingleSlogan .banner-image .carousel-main button.flickity-button ,
.blogSingleSlogan .banner-image .carousel-main .flickity-page-dots ,
.blogSingleSlogan .banner-image .carousel-nav button.flickity-button {
    display: none;
}
.blogSingle-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 80px 0 20px;
}

.blogSingle-content .text, .blogSingle-content .feature {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.blogSingle-content .text img {
    max-width: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
.blogSingle-content .text * {
    font-weight: normal;
}

.blogSingle-content .feature {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
}

.blogSingle-content .feature .share {
    border-left: 1px solid #000;
    padding-left: 20px;
    cursor: pointer;
}

.blogSingle-content .feature img {
    display: block;
}
section.blogSingle-content {
    padding-bottom: 6rem;
}
/*------------------------------------------------blogSingle*/
/*==================ABOUT US====================*/
main.wrapper {
    position: relative;
    width: 100%;
    display: block;
}
section.aboutSloganContainer {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh;
    overflow: hidden;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
section.aboutSloganContainer .slogan-overlay-background {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}
body.loadPage section.aboutSloganContainer::before {
    height: 70vh;
}
body.loadPage section.aboutSloganContainer::after {
    width: 61vw;
}
section.aboutSloganContainer .slogan-overlay-background img {
    position: absolute;
    width: 100%;
    height: 130%;
    bottom: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
}
section.aboutSloganContainer .slogan-overlay-background::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
}
section.aboutSloganContainer .slogan-info-wrap {
    position: relative;
    z-index: 1;
    color: #fff;
}
section.aboutSloganContainer .slogan-info-wrap h1 {
    font-weight: 700;
    font-size: 5rem;
    text-transform: capitalize;
    opacity: 0;
    position: relative;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}

section.aboutSloganContainer .slogan-info-wrap p.text {
    width: 55%;
    opacity: 0;
    position: relative;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}
section.aboutSloganContainer .slogan-info-wrap p.text .line {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
section.aboutSloganContainer::before {
    content: '';
    position: absolute;
    width: 3px;
    height: 0;
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
    z-index: 1;
    right: 5vw;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}
section.aboutSloganContainer::after {
    content: '';
    position: absolute;
    width: 61vw;
    right: 5vw;
    width: 0;
    height: 3px;
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
}
section.aboutContainer {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 5rem;
    padding-bottom: 5rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

section.aboutContainer .about-column-one {
    width: 30%;
}

section.aboutContainer .about-column-two {
    width: 65%;
    position: relative;
    padding-top: 8rem;
}

section.aboutContainer .studio-wrap {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 3rem;
}

section.aboutContainer .ceo-wrap {
    position: relative;
    width: 100%;
    height: 70vh;
    overflow: hidden;
    padding-top: 1rem;
}
section.aboutContainer .studio-wrap .info-wrap {
    position: relative;
}

section.aboutContainer .studio-wrap .studio-image-wrap.mobile {
    display: none;
}
section.aboutContainer .studio-image-wrap img {
    width: 100%;
}

section.aboutContainer .ceo-wrap img {
    width: 100%;
    height: 120%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    bottom: 0;
    left: 0;
}
section.aboutContainer .studio-wrap .info-wrap h2 {
    font-weight: 700;
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}
section.aboutContainer .about-ceo {
    position: relative;
    width: 100%;
    display: block;
    padding-top: 4rem;
}

section.aboutContainer .about-ceo .content {
    width: 50%;
}

section.aboutContainer .about-column-two::before {
    content: '';
    position: absolute;
    width: 3px;
    height: 100%;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(49.48%, #000000), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
}
section.aboutContainer .about-ceo::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, #000000 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(#000000));
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000000 100%);
    width: 100%;
    height: 3px;
}
section.aboutContainer .about-ceo h2 {
    text-transform: capitalize;
    margin-bottom: 2rem;
    font-weight: 300;
}
section.aboutContainer .studio-image-wrap.desktop {
    padding-right: 5vw;
    padding-bottom: 2rem;
}
section.aboutAwardsContainer {
    position: relative;
    width: 100%;
    display: block;
    padding-top: 3rem;
    padding-bottom: 5rem;
}

section.aboutAwardsContainer h2,section.aboutMembersContainer h2 {
    font-weight: 300;
    text-transform: capitalize;
    margin-bottom: 2rem;
}

section.aboutAwardsContainer .awardsWrapper {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
section.aboutAwardsContainer .awardsWrapper .awardWrapBox {
    position: relative;
    width: 25%;
    margin-bottom: 3rem;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap {
    position: relative;
    width: 92%;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia {
    width: 100%;
    height: 16rem;
    margin-bottom: 1rem;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .award-info {
    text-align: center;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia.pc img {
    -o-object-fit: cover;
    object-fit: cover;
}
section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .award-info p.year ,
section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .award-info a.link {
    margin-bottom: 0;
    font-weight: bold;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox:nth-of-type(4n+2) .awardWrap, section.aboutAwardsContainer .awardsWrapper .awardWrapBox:nth-of-type(4n+3) .awardWrap {
    margin: 0 auto;
}

section.aboutAwardsContainer .awardsWrapper .awardWrapBox:nth-of-type(4n+4) .awardWrap {
    margin-left: auto;
    margin-right: 0;
}
section.aboutMembersContainer {
    position: relative;
    width: 100%;
    display: block;
    padding-top: 0;
    padding-bottom: 8rem;
}
section.aboutMembersContainer .memberWrapper {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
section.aboutMembersContainer .memberWrapper .memberWrap {
    width: calc(100%/6);
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
section.aboutMembersContainer .memberWrapper .memberWrap .memberMedia {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 100%;
}
section.aboutMembersContainer .memberWrapper .memberWrap .memberMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
}
section.aboutMembersContainer .memberWrapper .memberWrap .memberInfo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 0.7rem;
    background-color: rgba(255,255,255,1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
    -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
    transition: all cubic-bezier(0.4, 0, 0.2, 1) .6s;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
}
section.aboutMembersContainer .memberWrapper .memberWrap .memberInfo h3 {
    text-transform: capitalize;
    font-size: 1.3rem;
}
section.aboutMembersContainer .memberWrapper .memberWrap .memberInfo span {
    text-transform: capitalize;
    font-size: .9rem;
}
section.aboutMembersContainer .memberWrapper .memberWrap:hover .memberInfo {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

section.aboutMembersContainer .memberWrapper .memberWrap:hover .memberMedia img {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
}
/*==================ABOUT US====================*/
/*==================PROJECTS====================*/
#filterContainer {
    position: fixed;
    top: var(--height-header);
    right: 0;
    height: var(--filter-height);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    overflow: hidden;
    width: 100%;
    padding-right: 5vw;
    background-color: var(--white-color);
    z-index: 10;
    cursor: pointer;
}
#filterContainer #filterBox {
    position: relative;
    text-align: right;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

#filterContainer #filterBox span {
    white-space: pre;
    display: block;
    position: absolute;
    right: 0;
    color: #848484;
    font-size: 1.2rem;
    text-transform: capitalize;
    font-weight: 700;
    -webkit-transition: all ease-in-out 0.4s;
    -o-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
}

#filterContainer #filterBox span:last-child {
    -webkit-transform: translateY(300%);
    -ms-transform: translateY(300%);
    transform: translateY(300%);
}

#filterContainer #filterBox span:first-child {
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    top: 50%;
}
#filterWrapper {
    position: fixed;
    width: 90vw;
    left: 5vw;
    z-index: 9;
    background-color: rgba(255,255,255,.9);
    top: calc(var(--height-header) + var(--filter-height));
    padding: 1.5rem 1.2rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
}
main.projectsWrapper {
    padding-top: calc(var(--height-header) + var(--filter-height));
    opacity: 0;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}
body.loadPage main.projectsWrapper {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
section.projectContainer .grid:after {
    content: '';
    display: block;
    clear: both;
}
section.projectContainer .grid-item,section.projectContainer .grid-sizer {
    width: calc(100%/3);
}
section.projectContainer {
    position: relative;
    width: 100%;
    display: block;
    padding-bottom: 8rem;
}
section.projectContainer .project_filter {
    position: absolute;
    width: calc(100% - 8vw);
    height: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-color: rgb(251 249 249 / 50%);
    padding: 80px;
    z-index: 10;
}

section.projectContainer .projectsWrap {
    position: relative;
    width: 100%;
    display: block;
    padding: 1vw;
}

section.projectContainer .projectsWrap .projectMedia {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 1rem;
}

section.projectContainer .projectsWrap .projectMedia img {
    width: 100%;
    max-width: 100%;
    height: auto;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -webkit-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;
}
section.projectContainer .projectsWrap:hover .projectMedia img {
    -webkit-transition-duration: 7s;
    -o-transition-duration: 7s;
    transition-duration: 7s;
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}
section.projectContainer .projectsWrap .project-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 8px;
    -moz-column-gap: 8px;
    column-gap: 8px;
}

section.projectContainer .projectsWrap .project-info p {
    margin: 0;
}

section.projectContainer .projectsWrap .project-info p.project-name {
    font-weight: bold;
}
#filterWrapper .filterBox {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#filterWrapper .filterBox h3 {
    text-transform: capitalize;
    margin-bottom: 1.4rem;
    font-size: 1.4rem;
}
#filterWrapper .filterBox ul li:last-child p {
    margin: 0;
}

#filterWrapper .filterBox ul li p {
    cursor: pointer;
    text-transform: capitalize;
    -webkit-transition: all ease-in-out 0.2s;
    -o-transition: all ease-in-out 0.2s;
    transition: all ease-in-out 0.2s;
    display: inline-block;
}

#filterWrapper .filterBox ul li p.is-checked {
    background-color: #848484;
    color: #fff;
    padding: 0 3px;
}
#filterWrapper .filterWrap {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px;
}
#filterWrapper .filterBox ul li p:hover {
    opacity: .5;
}
#filterContainer.change #filterBox span:last-child {
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
}

#filterContainer.change #filterBox span:first-child {
    -webkit-transform: translateY(-300%);
    -ms-transform: translateY(-300%);
    transform: translateY(-300%);
}
/*==================PROJECTS====================*/
/*===============SINGLE PROJECTS================*/
main.singleProjectsWrapper {
    padding-top: var(--height-header);
    opacity: 0;
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    transform: translateY(60px);
    -webkit-transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
    -o-transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1);
    transition: opacity .6s cubic-bezier(.215,.61,.355,1),transform .6s cubic-bezier(.215,.61,.355,1),-webkit-transform .6s cubic-bezier(.215,.61,.355,1);
}
body.loadPage main.singleProjectsWrapper {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}

section.singleProjectGalleryContainer {
    position: relative;
    width: 100%;
    height: calc(100vh - var(--height-header));
}

section.singleProjectGalleryContainer .galleryContainer {
    position: relative;
    width: 100%;
    height: 100%;
    /* z-index: 1; */
}

section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper2 {
    position: relative;
    width: 100%;
    height: 69vh;
    margin-bottom: 20px;
}
section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper {padding-left: 5vw;padding-right: 3vw;}
section.singleProjectGalleryContainer .galleryContainer .swiper img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper img {
    opacity: .6;
    -webkit-filter: contrast(0.5);
    filter: contrast(0.5);
    -webkit-transition: all linear .4s;
    -o-transition: all linear .4s;
    transition: all linear .4s;
}
section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper .swiper-slide-thumb-active img {
    opacity: 1;
    -webkit-filter: unset;
    filter: unset;
}
section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper {
    position: absolute;
    right: 7vw;
    bottom: 24vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 5rem;
    -moz-column-gap: 5rem;
    column-gap: 5rem;
}

section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-next {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    margin: 0;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    background-image: url(./assets/images/left-arrow.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-transform: scale(-1);
    -ms-transform: scale(-1);
    transform: scale(-1);
}

section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-prev {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    margin: 0;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    background-image: url(./assets/images/left-arrow.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-prev::after,section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-next::after{
    opacity: 0;
}
section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .gallery-arrows-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-column-gap: 5rem;
    -moz-column-gap: 5rem;
    column-gap: 5rem;
}
section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .fullscreen-wrap {
    cursor: pointer;
    pointer-events: none;
    position: relative;
    z-index: 1;
}
#gallerySlider {
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: var(--white-color);
    -webkit-transition: all .5s cubic-bezier(.77,0,.175,1) 0s;
    -o-transition: all .5s cubic-bezier(.77,0,.175,1) 0s;
    transition: all .5s cubic-bezier(.77,0,.175,1) 0s;
    opacity: 0;
    pointer-events: none;
}
#gallerySlider .swiper.myGallerySwiper {
    position: relative;
    width: 100%;
    height: 100%;
}
#gallerySlider .close-gallery {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
    cursor: pointer;
}
#gallerySlider .swiper.myGallerySwiper img {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    max-height: 100%;
    max-width: 100%;
    padding: 5%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#gallerySlider .close-gallery img {
    height: 1.5rem;
}
#gallerySlider .swiper.myGallerySwiper .swiper-button-next {
    background-image: url(./assets/images/left-arrow-black.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-transform: scale(-1);
    -ms-transform: scale(-1);
    transform: scale(-1);
}
#gallerySlider .swiper.myGallerySwiper .swiper-button-prev {
    background-image: url(./assets/images/left-arrow-black.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
#gallerySlider .swiper.myGallerySwiper .swiper-button-next::after,#gallerySlider .swiper.myGallerySwiper .swiper-button-prev::after{
    opacity: 0;
}
html.openGallery #gallerySlider {
    opacity: 1;
    pointer-events: auto;
}
section.singleProjectGalleryContainer .gallery-info-wrap {
    position: absolute;
    height: 69vh;
    top: 0;
    width: 100%;
    right: 0;
    pointer-events: none;
    z-index: 1;
    text-align: right;
    padding-right: 5vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

section.singleProjectGalleryContainer .gallery-info-wrap .project-summery-box {
    position: relative;
    width: 70%;
    margin-left: auto;
    margin-right: 0;
    padding-right: 2rem;
    height: 50%;
    padding-top: 1rem;
}

section.singleProjectGalleryContainer .gallery-info-wrap::before {
    content: '';
    position: absolute;
    width: 3px;
    height: 90%;
    right: 5vw;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(49.48%, #000000), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
}

section.singleProjectGalleryContainer .gallery-info-wrap::after {
    content: '';
    position: absolute;
    width: 70%;
    right: 5vw;
    height: 3px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, #000000 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(#000000));
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000000 100%);
}
section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper2::before {content: '';position: absolute;width: 100%;height: 100%;top: 0;left: 0;background-color: rgba(255,255,255,.15);z-index: 2;pointer-events: none;}
section.singleProjectTitleContentContainer {
    position: relative;
    width: 100%;
    padding-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 6rem;
}

section.singleProjectTitleContentContainer .projectTitleWrap {
    width: 49%;
}

section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer {
    width: 49%;
    padding-top: 1rem;
}

section.singleProjectTitleContentContainer .projectTitleWrap h1 {
    color: #848484;
    font-weight: 300;
}

section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper {
    position: relative;
    padding-bottom: 3rem;
    margin-bottom: 3rem;
    border-bottom: 1px solid #D9D9D9;
}

section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: .4rem;
    -moz-column-gap: .4rem;
    column-gap: .4rem;
    line-height: 2.1;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul li span {
    color: #848484;
    font-weight: 300;
    display: inline-block;
    text-transform: capitalize;
}
section.singleProjectTitleContentContainer .projectAwardsContainer_wrapper h2 {
    margin-bottom: 2rem;
    color: #848484;
    font-weight: 300;
    font-size: 1.5rem;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-bottom: 1rem;
    margin-bottom: 3rem;
    border-bottom: 1px solid #D9D9D9;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap {
    width: 25%;
    margin-bottom: 1rem;
    padding-left: 5px;
    padding-right: 5px;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .awardMedia {
    height: 8rem;
    margin-bottom: 1rem;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .awardMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .awardMedia.archInCharge {
    height: auto;
    aspect-ratio: 1/1;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .awardMedia.archInCharge img {
    -o-object-fit: cover;
    object-fit: cover;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .award-info {
    text-align: center;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap .award-info p.awards-title {
    color: #8F8F8F;
}
section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectContent {
    color: #848484;
}

section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectContent img {
    width: 100%;
    max-width: 100%;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
}
/*===============SINGLE PROJECTS================*/
.load-wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    background-color: rgba(255,255,255,.8);
    width: 66vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
section.blogContainer {
    position: relative;
}
.load-wrap p {
    text-transform: uppercase;
    -webkit-animation: splotlight 1s linear infinite;
    animation: splotlight 1s linear infinite;
}
.pagination-container span.page-numbers.current {
    opacity: .5;
    text-decoration: underline;
}
@media only screen and (max-width: 768px){
    .load-wrap {
        width: 100%;
    }
    /*============GENERAL CLASS==============*/
    :root {
        --filter-height:7vh;
    }
    .padding-class {
        padding-left: 20px;
        padding-right: 20px;
    }
    .scroll-down {
        margin: 0 0 4vh 20px;
    }
    .padding-class-half-big {
        padding-right: 20px;
        padding-left: 20px;
    }
    #cursor{
        display: none;
    }
    /*============GENERAL CLASS==============*/
    /*============404==============*/
    main.notFoundWrapper .notFoundContainer {
        padding: 0 20px;
    }

    main.notFoundWrapper {
        padding-top: var(--height-header);
    }

    main.notFoundWrapper .notFoundContainer p {
        width: 100%;
        margin: 1rem 0 2rem;
    }

    main.notFoundWrapper .notFoundContainer h1 {
        font-size: 5rem;
    }

    main.notFoundWrapper .notFoundContainer h2 {
        font-size: 1.6rem;
    }

    main.notFoundWrapper canvas {
        padding-left: 0;
    }
    /*============404==============*/
    /*============LOADING=============*/
    #loading .loading-text p {
        font-size: 3rem;
        line-height: 3rem;
    }
    #loading .loadLine::before {
        top: -8px;
    }
    /*============LOADING=============*/
    /*============NAV & HEADER==============*/
    header .identity svg#logo {
        -webkit-transform: scale(.7);
        -ms-transform: scale(.7);
        transform: scale(.7);
        display: inline;
        -webkit-transform-origin: left;
        -ms-transform-origin: left;
        transform-origin: left;
    }
    header .identity {
        text-align: left;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    header #menu {
        width: 52px;
        padding: 0;
        height: 20px;
    }
    header {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .padding-class-big {
        padding-right: 20px;
        padding-left: 20px;
    }

    #menu-container .menuWrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #menu-container .menuWrapper .menu-contact-info-wrapper {
        width: 100%;
        height: auto;
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-top: 2rem;
        display: none;
    }

    #menu-container .menuWrapper nav.menu {
        width: 100%;
    }

    #menu-container .menuWrapper nav.menu ul.Menu-list {
        -webkit-transform: unset !important;
        -ms-transform: unset !important;
        transform: unset !important;
        font-size: 1.8rem;
    }

    .Menu-list-item {
        -webkit-transform: unset !important;
        -ms-transform: unset !important;
        transform: unset !important;
    }

    #menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-frame-box {
        width: 40%;
    }

    html.op-menu header #menu span:first-child {
        -webkit-transform: rotate(45deg) translate(8px, 2px);
        -ms-transform: rotate(45deg) translate(8px, 2px);
        transform: rotate(45deg) translate(8px, 2px);
    }

    html.op-menu header #menu span:last-child {
        -webkit-transform: rotate(-45deg) translate(8px, -3px);
        -ms-transform: rotate(-45deg) translate(8px, -3px);
        transform: rotate(-45deg) translate(8px, -3px);
    }
    #menu-container canvas#webgl-canvas {
        display: none;
    }

    #menu-container .video-mobile-overlay-wrapper {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        opacity: .7;
        display: block;
    }

    #menu-container .video-mobile-overlay-wrapper video {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
    }
    /*============NAV & HEADER==============*/
    /*============HOME==============*/
    main.homeWrapper section.homeContainer .homeWrap {
        height: calc(100vh - var(--height-header));
        margin-top: var(--height-header);
        overflow: hidden;
        overflow-y: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn {
        width: 100%;
        height: auto;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn:first-child {
        height: auto;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        padding: 1rem 0 1rem 1.1rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn h1 {
        font-size: 1.6rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child .content {
        margin: 2rem 0;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child ul.social-media {
        margin: 0 0 2rem 0;
        line-height: 2.5;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:first-child {
        font-size: 2.8rem;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:last-child {
        font-size: 1.8rem;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
        margin-bottom: 2rem;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap > p {
        width: 100%;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child::before {
        opacity: 0;
    }

    main.homeWrapper section.homeContainer::before {
        content: '';
        position: absolute;
        width: 3px;
        height: 0;
        left: 20px;
        top: 55%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(49.48%, #FFFFFF), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 49.48%, rgba(255, 255, 255, 0) 100%);
        -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
        -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
        transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    }

    body.loadPage main.homeWrapper section.homeContainer .homeWrap::before {
        height: 100%;
        left: 20px;
    }

    body.loadPage main.homeWrapper section.homeContainer::before {
        height: 85%;
        z-index: 1;
    }

    main.homeWrapper section.homeContainer {padding: 0 0 1rem;}

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::before {
        background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
        background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
        background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::after {
        content: '';
        width: 0;
        height: 3px;
        position: absolute;
        top: 0;
        right: 0;
        background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
        background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(#FFFFFF));
        background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
        -webkit-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
        -o-transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
        transition: all cubic-bezier(0.4, 0, 0.2, 1) 1s;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap {
        padding: 1rem 0 1rem 1.1rem;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.other {
        padding-bottom: 2rem;
    }

    body.loadPage main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.tehran::after {
        width: 100%;
    }

    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p.date {
        margin: 0;
    }
    /*============HOME==============*/
    /*============ABOUT==============*/
    section.aboutSloganContainer .slogan-info-wrap h1 {
        font-size: 2.5rem;
        margin-bottom: 1rem;
    }

    section.aboutSloganContainer .slogan-info-wrap p.text {
        width: 100%;
        margin: 0;
    }

    section.aboutSloganContainer {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        padding-top: 20vh;
        height: calc(var(--vh, 1vh) * 100);
    }
    section.aboutContainer {
        padding-top: 2rem;
        padding-bottom: 2rem;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    section.aboutContainer .about-column-one {
        width: 100%;
        padding-right: 1.2rem;
    }

    section.aboutContainer .about-column-two {
        width: 100%;
        padding-top: 2rem;
        padding-right: 1.2rem;
    }

    section.aboutContainer .studio-wrap {
        margin-bottom: 2rem;
    }
    section.aboutContainer .studio-wrap .studio-image-wrap.mobile {
        display: block;
        margin-top: 1rem;
    }

    section.aboutContainer .studio-image-wrap.desktop {
        display: none;
    }

    section.aboutContainer .about-ceo {
        padding-top: 1rem;
    }

    section.aboutContainer .about-column-two::before {
        opacity: 0;
    }

    section.aboutContainer .about-ceo .content {
        width: 100%;
    }

    section.aboutContainer .about-ceo h2 {
        margin-bottom: 1.4rem;
    }

    section.aboutContainer .about-ceo::before {
        opacity: 0;
    }
    section.aboutContainer::before {
        content: '';
        position: absolute;
        width: 3px;
        height: 100%;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(49.48%, #000000), to(rgba(0, 0, 0, 0)));
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 49.48%, rgba(0, 0, 0, 0) 100%);
        right: 20px;
    }

    section.aboutContainer .studio-wrap::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 3px;
        right: -1.2rem;
        bottom: 0;
        background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 0%, #000000 100%);
        background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(#000000));
        background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000000 100%);
    }

    section.aboutAwardsContainer {
        padding-top: 1rem;
        padding-bottom: 3rem;
    }

    section.aboutAwardsContainer h2, section.aboutMembersContainer h2 {
        margin-bottom: 1rem;
    }

    section.aboutAwardsContainer .awardsWrapper {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-column-gap: .5rem;
        -moz-column-gap: .5rem;
        column-gap: .5rem;
    }

    section.aboutAwardsContainer .awardsWrapper .awardWrapBox {
        width: calc(50% - .5rem);
        margin-bottom: 2rem;
    }

    section.aboutAwardsContainer .awardsWrapper .awardWrapBox:nth-of-type(2n) .awardWrap {
        margin-left: auto;
        margin-right: 0;
    }

    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap {
        width: 96%;
    }

    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia {
        height: 12rem;
    }

    section.aboutMembersContainer .memberWrapper .memberWrap {
        width: 100%;
    }
    section.aboutMembersContainer {
        padding-bottom: 5rem;
    }

    section.drawSectionContainer .drawSignatureWrap {
        padding: 2rem 0;
    }

    section.drawSectionContainer .buttonWrapper {
        -webkit-column-gap: 3rem;
        -moz-column-gap: 3rem;
        column-gap: 3rem;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        row-gap: 1rem;
    }

    section.drawSectionContainer .buttonWrapper button {
        padding: 0;
    }
    /*============ABOUT==============*/
    /*===========PROJECTS============*/
    section.projectContainer .grid-item, section.projectContainer .grid-sizer {
        width: 100%;
    }

    .padding-class-project {
        padding-left: 20px;
        padding-right: 20px;
    }
    section.projectContainer .project_filter  {
        width: calc(100% - 40px);
    }
    section.projectContainer .projectsWrap {
        padding: 0;
        margin-bottom: 30px;
    }

    section.projectContainer .projectsWrap .project-info span {
        display: none;
    }

    section.projectContainer .projectsWrap .project-info {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        row-gap: 4px;
    }

    #filterContainer {
        height: var(--filter-height);
    }
    #filterWrapper {
        left: 20px;
        width: calc(100% - 40px);
        height: calc(100vh - var(--height-header) - var(--filter-height));
        padding: 15px 0 30px;
        overflow: hidden;
    }
    #filterWrapper .filterWrap {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        row-gap: 2rem;
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
    }
    #filterWrapper .filterBox {
        -webkit-box-flex: unset;
        -ms-flex: unset;
        flex: unset;
        width: 100%;
    }
    section.projectContainer {
        padding-bottom: 3rem;
    }
    section.drawSectionContainer canvas#signature-pad {
        height: 35vh;
    }
    /*===========PROJECTS============*/
    /*=======SINGLE PROJECTS==========*/
    section.singleProjectGalleryContainer .gallery-info-wrap {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    section.singleProjectGalleryContainer .gallery-info-wrap .project-summery-box {
        width: 90%;
        padding-top: 2rem;
    }
    section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper {
        left: 20px;
    }
    section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper {
        padding-left: 20px;
    }
    section.singleProjectTitleContentContainer {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-bottom: 3rem;
    }
    section.singleProjectTitleContentContainer .projectTitleWrap {
        width: 100%;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer {
        width: 100%;
        padding-top: 2rem;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper {
        padding-bottom: 2rem;
        margin-bottom: 2rem;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer .awardWrap {
        width: 50%;
        padding: 0 6px;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer {
        margin-bottom: 2rem;
    }
    /*=======SINGLE PROJECTS==========*/
    /*============BLOG===============*/
    .blogSlogan .banner-text h1 {
        font-size: 1rem;
    }
    .blog-item-container {
        margin: 60px 0 45px;
    }
    .blog-item-image-date {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    main.wrapper.blogWrapper:before {
        opacity: 0;
    }
    .blog-item-image-date .blog-item-image, .blog-item-image-info-date .blog-item-info {
        width: 100%;
    }
    .blog-item-image-date .blog-item-image {
        height: 42vh;
    }
    .blog-item-image-date .blog-item-date p {
        margin: 1rem 0;
    }
    .blog-item-image-info-date .blog-item-info {
        padding: 10px 0;
    }
    .pagination-container {
        width: 100%;
    }
    .pagination-container:before {
        width: 100%;
    }
    .pagination-container .pagination-arrow img {
        width: 30px;
    }
    section.drawSectionContainer.blogPage {
        padding-top: 4rem;
    }
    section.blogContainer {
        padding-bottom: 1rem;
    }
    .blog-item-image-date .blog-item-image::before {
        height: 60%;
        right: 1.5rem;
    }

    .blog-item-image-date .blog-item-image::after {
        width: 100%;
        right: 1.5rem;
    }
    /*============BLOG===============*/
    /*========SINGLE BLOG============*/
    .blogSingleSlogan .banner-image .carousel-main, .blogSingleSlogan .banner-image .carousel-main .flickity-slider .carousel-cell {
        height: calc(100vh - var(--header-height) - var(--header-height) - 2rem);
    }
    main.blogSingleWrapper .blogSingleSlogan .banner-image .scroll-down {
        bottom: 13vh;
    }
    section.blogSingle-content {
        margin: 2rem 0 3rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding-bottom: 1rem;
    }
    .blogSingle-content .feature {
        margin-bottom: 2rem;
    }
    /*========SINGLE BLOG============*/
    /*========CONTACT US===========*/
    #slogan.contactSlogan #map {
        height: 48vh;
    }

    section.contact-container {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    section.contact-container .contact-item {
        margin-bottom: 2rem;
    }

    section.contact-container .contact-item .title {
        font-size: 1.5rem;
    }
    section.contact-container .contact-item li{
        line-height: 2;
    }
    /*========CONTACT US===========*/
}
@media only screen and (min-width: 640px)  and (max-width: 768px){
    /*============NAV & HEADER==============*/
    /*============NAV & HEADER==============*/
    /*================HOME==================*/
    section.aboutMembersContainer .memberWrapper .memberWrap {
        width: 50%;
    }
    /*================HOME==================*/
    /*==============PROJECTS================*/
    #filterContainer #filterBox span:last-child {
        -webkit-transform: translateY(330%);
        -ms-transform: translateY(330%);
        transform: translateY(330%);
    }
    section.projectContainer .grid-item, section.projectContainer .grid-sizer {
        width: 50%;
    }
    section.projectContainer .projectsWrap {
        padding: 10px;
    }
    /*==============PROJECTS================*/
    /*==========SINGLE PROJECTS=============*/
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
    /*==========SINGLE PROJECTS=============*/
    /*===============BLOG===================*/
    main.wrapper.blogWrapper:before {
        opacity: 1;
    }
    .blog-item-image-date .blog-item-image, .blog-item-image-info-date .blog-item-info {
        width: calc((100% / 3 ) * 2);
    }
    .blog-item-image-date .blog-item-image {
        height: 30vh;
    }
    .pagination-container:before {
        width: calc(100% - 20px);
    }
    .pagination-container {
        width: calc((100% / 3 ) * 2);
    }
    /*===============BLOG===================*/
}
@media only screen and (min-width: 769px)  and (max-width: 1199px){
    /*============404==============*/
    main.notFoundWrapper canvas {
        margin-left: 60px;
    }
    main.notFoundWrapper .notFoundContainer {
        padding-right: 50px;
    }
    /*============404==============*/
    /*============GENERAL CLASS==============*/
    .padding-class {
        padding-left: 3vw;
        padding-right: 3vw;
    }
    .padding-class-half-big {
        padding-left: 3vw;
        padding-right: 3vw;
    }
    .scroll-down {
        margin: 0 0 6vh 3vw;
    }
    .padding-class-big {
        padding-right: 3vw;
        padding-left: 3vw;
    }
    section.aboutMembersContainer {
        padding-bottom: 5rem;
    }
    .padding-class-project {
        padding-left: 2vw;
        padding-right: 2vw;
    }
    section.projectContainer .project_filter  {
        width: calc(100% - 4vw);
    }
    #cursor{
        display: none;
    }
    /*============GENERAL CLASS==============*/
    /*===============LOADING================*/
    #loading .loading-text p {
        font-size: 6rem;
        line-height: 5rem;
    }
    #loading .loadLine::before {
        top: -7px;
    }
    /*===============LOADING================*/
    /*============NAV & HEADER==============*/
    header {
        padding: 0 3vw;
    }
    #menu-container canvas#webgl-canvas {
        display: none;
    }

    #menu-container .video-mobile-overlay-wrapper {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        opacity: .7;
    }
    #menu-container .video-mobile-overlay-wrapper video {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
    }
    /*============NAV & HEADER==============*/
    /*===============HOME=================*/
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:first-child {
        font-size: 3.5rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:last-child {
        font-size: 2.2rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child ul.social-media {
        line-height: 2.5;
    }
    /*===============HOME=================*/
    /*================ABOUT==================*/
    section.aboutSloganContainer .slogan-info-wrap h1 {
        font-size: 4rem;
    }
    section.aboutSloganContainer .slogan-info-wrap p.text {
        width: 60%;
    }
    section.aboutContainer .about-column-one {
        width: 44%;
    }
    section.aboutContainer .about-column-two {
        width: 52%;
        padding-top: 8rem;
    }
    section.aboutContainer .ceo-wrap {
        height: 50vh;
    }
    section.aboutContainer .about-ceo .content {
        width: 92%;
    }
    section.aboutSloganContainer::before {
        right: 3vw;
    }
    section.aboutSloganContainer::after {
        right: 3vw;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap {
        width: 95%;
    }

    section.aboutAwardsContainer .awardsWrapper .awardWrapBox {
        margin-bottom: 2rem;
    }

    section.aboutAwardsContainer {
        padding-bottom: 3rem;
    }

    section.aboutMembersContainer .memberWrapper .memberWrap {
        width: 25%;
    }
    /*================ABOUT==================*/
    /*================PROJECTS==================*/
    #filterContainer {
        padding-right: 3vw;
        right: 0;
    }
    #filterWrapper {
        width: 100%;
        left: 0;
        padding: 2rem 3vw;
    }
    section.projectContainer .projectsWrap .project-info {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    /*================PROJECTS==================*/
    /*============SINGLE PROJECTS================*/
    section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper2 {
        height: 72vh;
    }
    section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper {
        padding-left: 3vw;
    }
    section.singleProjectTitleContentContainer .projectTitleWrap h1 {
        font-size: 2rem;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper {
        padding-bottom: 2rem;
        margin-bottom: 2rem;
    }

    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectAwardsContainer {
        margin-bottom: 2rem;
    }
    /*============SINGLE PROJECTS================*/
    /*=================BLOG======================*/
    .blog-item-image-date .blog-item-image::before {
        height: 60%;
        right: 1.5rem;
    }
    .blog-item-image-date .blog-item-image::after {
        width: 100%;
        right: 1.5rem;
    }
    .blogSlogan .banner-text:before {
        right: 3vw;
    }

    .blogSlogan .banner-text:after {
        right: 3vw;
    }

    .blogSlogan .banner-text h1 {
        font-size: 2rem;
    }

    .blog-item-image-date .blog-item-image {
        height: 32vh;
    }

    .pagination-container:before {
        width: calc(100% - 3vw);
    }

    section.drawSectionContainer.blogPage {
        padding-top: 5rem;
    }

    .blog-item-container {
        margin: 80px 0 70px;
    }
    /*=================BLOG======================*/
    /*=============CONTACT US==================*/
    #slogan.contactSlogan #map {
        height: 45vh;
    }
    section.contact-container .contact-item li{
        line-height: 2;
    }
    /*=============CONTACT US==================*/
}
@media only screen and (min-width: 1200px) and (max-width: 1400px){
    /*============LOADING==============*/
    #loading .loading-text p {
        font-size: 6rem;
        line-height: 5rem;
    }
    #loading .loadLine::before {
        top: -6px;
    }
    /*============LOADING==============*/
    /*============404==============*/
    main.notFoundWrapper .notFoundContainer h1 {
        font-size: 5rem;
    }
    main.notFoundWrapper .notFoundContainer h2 {
        font-size: 1.8rem;
    }
    main.notFoundWrapper .notFoundContainer p {
        margin: 1rem 0 1.5rem;
        font-size: .9rem;
    }
    main.notFoundWrapper .notFoundContainer {
        padding-right: 72px;
    }
    /*============404==============*/
    /*============NAV & HEADER==============*/
    header .identity svg#logo {
        -webkit-transform: scale(.8);
        -ms-transform: scale(.8);
        transform: scale(.8);
        -webkit-transform-origin: left center;
        -ms-transform-origin: left center;
        transform-origin: left center;
    }
    html.op-menu header #menu span:first-child,html.op-menu header #menu span:last-child {
        height: 3px;
    }
    header {
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
    }
    #menu-container .menuWrapper nav.menu ul.Menu-list {
        font-size: 2.2rem;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap {
        width: 40%;
        font-size: .8rem;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper {
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap h3.text {
        font-size: .9rem;
        padding-left: 3rem;
    }
    .Menu-list-item a > span:first-child {
        font-size: 12px;
    }
    /*============NAV & HEADER==============*/
    /*===============HOME=================*/
    main.homeWrapper section.homeContainer .homeWrap .homeColumn h1 {
        font-size: 1.4rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child .content {
        font-size: .9rem;
        margin: 2rem 0;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child ul.social-media {
        margin-bottom: 2rem;
        font-size: .9rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:first-child {
        font-size: 4rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:last-child {
        font-size: 2.5rem;
        margin-top: 3px;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap > p {
        width: 30%;
        font-size: .9rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p.date {
        margin: 0;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.other {
        margin-top: 0;
        padding-top: 0;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p {
        font-size: .9rem;
    }
    /*===============HOME=================*/
    /*===============ABOUT=================*/
    section.aboutSloganContainer .slogan-info-wrap h1 {
        font-size: 3.5rem;
    }
    section.aboutSloganContainer .slogan-info-wrap p.text {
        width: 60%;
        font-size: .9rem;
    }
    section.aboutContainer {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
    section.aboutContainer .studio-wrap .info-wrap h2 {
        font-size: 1.4rem;
    }
    section.aboutContainer .content {
        font-size: .9rem;
    }
    section.aboutContainer .about-ceo .content {
        width: 55%;
    }
    section.aboutAwardsContainer {
        padding-top: 2rem;
        padding-bottom: 4rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia {
        height: 12rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .award-info {
        font-size: .9rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox {
        margin-bottom: 2rem;
    }
    section.aboutMembersContainer .memberWrapper .memberWrap {
        width: 20%;
    }
    section.aboutMembersContainer {
        padding-bottom: 6rem;
    }
    section.drawSectionContainer .buttonWrapper button {
        font-size: .9rem;
    }
    section.aboutMembersContainer .memberWrapper .memberWrap .memberInfo h3 {
        font-size: 1.15rem;
    }
    section.drawSectionContainer canvas#signature-pad {
        height: 30vh;
    }
    section.drawSectionContainer .drawSignatureWrap {
        padding: 2rem 0;
    }
    section.aboutContainer .about-ceo h2 {
        font-size: 1.6rem;
    }
    /*===============ABOUT=================*/
    /*===============PROJECTS=================*/
    #filterContainer #filterBox span {
        font-size: 1rem;
    }

    section.projectContainer .projectsWrap .project-info p {
        font-size: .9rem;
    }

    #filterWrapper .filterBox h3 {
        font-size: 1.2rem;
    }

    #filterWrapper .filterBox ul li p {
        font-size: .9rem;
    }
    section.projectContainer {
        padding-bottom: 6rem;
    }

    section.drawSectionContainer h2 {
        font-size: 1.8rem;
    }
    /*===============PROJECTS=================*/
    /*===========SINGLE PROJECTS==============*/
    section.singleProjectGalleryContainer .galleryContainer .swiper.mySwiper2 {
        height: 68vh;
    }
    section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-next,section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .swiper-button-prev {
        width: 1.2rem;
    }
    section.singleProjectGalleryContainer .gallery-arrows-fullscreen-wrapper .fullscreen-wrap img {
        width: 1.2rem;
    }
    section.singleProjectTitleContentContainer .projectTitleWrap h1 {
        font-size: 1.9rem;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul li span {
        font-size: .9rem;
    }
    /*===========SINGLE PROJECTS==============*/
    /*================BLOG====================*/
    .blogSlogan .banner-text .date {
        font-size: .9rem;
    }
    .blogSlogan .banner-text h1 {
        font-size: 1.7rem;
    }
    .blog-item-container {
        margin: 60px 0 70px;
    }
    .blog-item-container:last-child {
        margin-bottom: 20px;
    }
    section.drawSectionContainer.blogPage {
        padding-top: 5rem;
    }
    .pagination-container .pagination-arrow img {
        width: 40px;
    }
    /*================BLOG====================*/
    /*============SINGLE BLOG=================*/
    .blogSingleSlogan .banner-image .carousel-main, .blogSingleSlogan .banner-image .carousel-main .flickity-slider .carousel-cell {
        height: calc(100vh - var(--header-height) - var(--header-height) - 2rem);
    }

    main.blogSingleWrapper .blogSingleSlogan .banner-image .scroll-down {
        bottom: 11vh;
    }
    .blogSingle-content .text h1 {
        font-size: 2.2rem;
    }

    .blogSingle-content .text h2 {
        font-size: 1.8rem;
    }

    .blogSingle-content .text h3 {
        font-size: 1.6rem;
    }

    .blogSingle-content .text h4 {
        font-size: 1.5rem;
    }
    /*============SINGLE BLOG=================*/
    /*============CONTACT US=================*/
    section.contact-container {
        padding-top: 3rem;
        padding-bottom: 4rem;
    }

    section.contact-container .contact-item .title {
        font-size: 1.6rem;
    }

    section.contact-container .contact-item ul li a {
        font-size: .9rem;
    }

    section.contact-container .contact-item {
        margin-bottom: 40px;
    }

    section.contact-container .contact-form input[type="submit"] {
        font-size: 1.2rem;
    }
    /*============CONTACT US=================*/
}
@media only screen and (min-width: 1401px) and (max-width: 1600px){
    /*============LOADING============*/
    #loading .loading-text p {
        font-size: 7rem;
        line-height: 6rem;
    }
    #loading .loadLine::before {
        top: -8px;
    }
    /*============LOADING============*/
    /*============404============*/
    main.notFoundWrapper .notFoundContainer {
        padding-right: 76px;
    }

    main.notFoundWrapper .notFoundContainer h1 {
        font-size: 7rem;
    }

    main.notFoundWrapper .notFoundContainer h2 {
        font-size: 2rem;
    }
    /*============404============*/
    /*============NAV & HEADER============*/
    header .identity svg#logo {
        -webkit-transform: scale(.85);
        -ms-transform: scale(.85);
        transform: scale(.85);
    }
    header {
        -webkit-column-gap: 2rem;
        -moz-column-gap: 2rem;
        column-gap: 2rem;
    }
    #menu-container .menuWrapper nav.menu ul.Menu-list {
        font-size: 2.5rem;
    }
    .Menu-list-item a > span:first-child {
        font-size: 13px;
        margin-right: 8px;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper {
        -webkit-column-gap: 3rem;
        -moz-column-gap: 3rem;
        column-gap: 3rem;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap h3.text {
        font-size: .9rem;
    }
    #menu-container .menuWrapper .menu-contact-info-wrapper .menu-contact-info-wrap ul {
        font-size: .9rem;
    }
    /*============NAV & HEADER============*/
    /*============HOME============*/
    main.homeWrapper section.homeContainer .homeWrap .homeColumn h1 {
        font-size: 1.6rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child .content {
        margin: 2rem 0;
        font-size: .9rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn:last-child ul.social-media {
        margin: 0 0 2rem 0;
        font-size: .9rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:first-child {
        font-size: 4rem;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap .sqm-box span:last-child {
        font-size: 2.2rem;
        margin-top: 5px;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .total-sqm-wrap > p {
        font-size: .9rem;
        width: 30%;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p.date {
        margin: 0;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap.other {
        padding-top: 0;
    }
    main.homeWrapper section.homeContainer .homeWrap .homeColumn .location-time-wrap p {
        font-size: .9rem;
    }
    /*============HOME============*/
    /*============ABOUT============*/
    section.aboutSloganContainer .slogan-info-wrap h1 {
        font-size: 4rem;
    }
    section.aboutSloganContainer .slogan-info-wrap p.text {
        width: 60%;
        font-size: .9rem;
    }
    section.aboutContainer {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
    section.aboutContainer .studio-wrap .info-wrap h2 {
        font-size: 1.4rem;
    }
    section.aboutContainer .content {
        font-size: .9rem;
    }
    section.aboutContainer .about-ceo h2 {
        font-size: 1.8rem;
        margin-bottom: 1.5rem;
    }
    section.aboutContainer .about-ceo .content {
        width: 55%;
    }
    section.aboutAwardsContainer {
        padding-top: 2rem;
        padding-bottom: 4rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox {
        margin-bottom: 2rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .awardMedia {
        height: 14rem;
    }
    section.aboutAwardsContainer .awardsWrapper .awardWrapBox .awardWrap .award-info {
        font-size: .9rem;
    }
    section.aboutMembersContainer .memberWrapper .memberWrap {
        width: 20%;
    }
    section.aboutMembersContainer .memberWrapper .memberWrap .memberInfo h3 {
        font-size: 1.2rem;
    }
    section.aboutMembersContainer {
        padding-bottom: 6rem;
    }

    section.drawSectionContainer .drawSignatureWrap {
        padding: 2rem 0;
    }

    section.drawSectionContainer .buttonWrapper button {
        font-size: .9rem;
    }
    /*============ABOUT============*/
    /*============PROJECTS============*/
    section.projectContainer .projectsWrap .project-info p {
        font-size: .9rem;
    }

    #filterContainer #filterBox span {
        font-size: 1rem;
    }

    #filterWrapper .filterBox h3 {
        font-size: 1.3rem;
    }

    #filterWrapper .filterBox ul li p {
        font-size: .9rem;
    }
    /*============PROJECTS============*/
    /*=========SINGLE PROJECTS========*/
    section.singleProjectTitleContentContainer .projectTitleWrap h1 {
        font-size: 2rem;
    }
    section.singleProjectTitleContentContainer .projectDetailsAwardsContentContainer .projectDetailsWrapper ul li span {
        font-size: .9rem;
    }
    /*=========SINGLE PROJECTS========*/
    /*=========BLOG========*/
    .blogSlogan .banner-text .date {
        font-size: .9rem;
    }
    .blogSlogan .banner-text h1 {
        font-size: 1.7rem;
    }
    .blog-item-container {
        margin: 70px 0 85px;
    }
    section.drawSectionContainer.blogPage {
        padding-top: 5rem;
    }
    /*=========BLOG========*/
    /*======SINGLE BLOG======*/
    .blogSingleSlogan .banner-image .carousel-main, .blogSingleSlogan .banner-image .carousel-main .flickity-slider .carousel-cell {
        height: calc(100vh - var(--header-height) - var(--header-height) - 1.5rem);
    }

    main.blogSingleWrapper .blogSingleSlogan .banner-image .scroll-down {
        bottom: 9vh;
    }
    .blogSingle-content .text h1 {
        font-size: 2.2rem;
    }

    .blogSingle-content .text h2 {
        font-size: 1.8rem;
    }

    .blogSingle-content .text h3 {
        font-size: 1.6rem;
    }

    .blogSingle-content .text h4 {
        font-size: 1.5rem;
    }
    /*======SINGLE BLOG======*/
    /*============CONTACT US=================*/
    section.contact-container {
        padding-top: 3rem;
        padding-bottom: 4rem;
    }

    section.contact-container .contact-item .title {
        font-size: 1.6rem;
    }

    section.contact-container .contact-item ul li a {
        font-size: .9rem;
    }

    section.contact-container .contact-item {
        margin-bottom: 40px;
    }

    section.contact-container .contact-form input[type="submit"] {
        font-size: 1.2rem;
    }
    /*============CONTACT US=================*/
}