@import url('https://fonts.googleapis.com/css2?family=Aldrich&family=Monoton&family=Rubik:wght@300;400;700&display=swap');

/* font-family: 'Aldrich', sans-serif;
font-family: 'Monoton', sans-serif;
font-family: 'Rubik', sans-serif; */
html,
* {
    cursor: none;
}

@font-face {
    font-family:'Britannic T';
    src: url('../font/Britannic T Bold.eot');
    src: url('../font/Britannic T Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/Britannic T Bold.woff2') format('woff2'),
        url('../font/Britannic T Bold.woff') format('woff'),
        url('../font/Britannic T Bold.svg#Britannic T Bold') format('svg');
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-00FE;
}

*,
*::before,
*::after {
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -o-box-sizing:border-box;
    -ms-box-sizing:border-box;
    outline: none;
}

html, body {
    font-family: 'Rubik', sans-serif;
    font-size:18px;
    color:#fff;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    padding:0;
    margin:0;
    background:#000000 !important;
}


h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, ul, li {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    list-style:none;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display:block;
}

h1, h2, h3, h4, h5, h6 {
    line-height:1.5;
    margin:0;
}

h2{
    font-size:150px;
    color:#0b0b0b;
}

h3{
    font-size:75px;
    color:#0b0b0b;
}

h4{
    font-size:45px;
    color:#0b0b0b;
}

article, p {
    font-size:18px;
    color:#0b0b0b;
    line-height:1.5;
    padding:0;
    margin:0;
}

a {
    color:#0b0b0b;
    text-decoration:none;
    transition:all .5s ease;
    -webkit-transition:all .5s ease;
    -moz-transition:all .5s ease;
    display: inline-block;
}

a:hover {
    color:#0b0b0b;
}

img {
    vertical-align:middle;
    border-style:none;
    max-width:100%;
}

.btn{
    font-size:15px;
    color:#ffffff;
    text-transform:uppercase;
    display:inline-block;
    padding:20px 60px;
    background:#0b0b0b;
}

.clearfix {
    display:inline-block;
}

.clearfix::after {
    visibility:hidden;
    display:block;
    font-size:0;
    content:"";
    clear:both;
    height:0;
}

* html .clearfix {
    height:1%;
}

.clearfix {
    display:block;
}

/*******/

.o-scroll {
    background-color: #d4c9c9;
    overflow: hidden
}

html.has-scroll-smooth {
    overflow: hidden
}

html.has-scroll-dragging {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.has-scroll-smooth body {
    overflow: hidden
}

.has-scroll-smooth [data-scroll-container] {
    min-height: 100vh
}

[data-scroll-direction=horizontal] [data-scroll-container] {
    height: 100vh;
    display: inline-block;
    white-space: nowrap
}

[data-scroll-direction=horizontal] [data-scroll-section] {
    display: inline-block;
    vertical-align: top;
    white-space: nowrap;
    height: 100%
}
.cursor {position: fixed; width: 30px; height: 30px; background: url(../images/logo-green.png) center center no-repeat; background-size: cover; pointer-events: none; mix-blend-mode: difference; z-index: 999999; transition: transform 0.2s;}


.o-title {
    line-height:1;
    margin: 0;
    padding: 0;
    perspective: 1200px;
    -webkit-perspective: 1200px
}

.o-title_line {
    line-height:1;
    display: block;
    opacity: 0;
    transform-origin: center top;
    transform-style: preserve-3d;
    transform: translateY(100%) rotateX(-80deg);
    transition: opacity .8s cubic-bezier(.215, .61, .355, 1), transform .8s cubic-bezier(.215, .61, .355, 1);
    font-size: 0
}
.o-title.is-inview .o-title_line{
    transform: translateY(0%) rotateX(0deg);
    opacity: 1;
    transition-delay: .3s
}

.o-title.is-inview .o-title_line:nth-child(2) {
    transition-delay: .5s
}

.o-title.is-inview .o-title_line:nth-child(3) {
    transition-delay: .6s
}

.o-title.is-inview .o-title_line:nth-child(4) {
    transition-delay: .7s
}

.container{max-width: 1460px}
.dl-sections{padding:100px 0 0 0;}
header{position: absolute; top: 0px; left: 0px; padding: 30px 30px 0 30px; width: 100%; display: flex; align-items: center; justify-content: space-between; z-index: 3}
.logo{width: 50px; }
.btn-touch{font-family: 'Aldrich', sans-serif; color: #E6FF29; font-size: 18px; font-weight: 400; line-height: 28px; }
.btn-touch svg{margin-left: 10px}
.btn-touch:hover{color: #E6FF29}
.social {
    position: fixed;
    right: 30px;
    top: 50%;
    margin-top: -54px;
}
.social li a{color: #E6FF29}

.menu-bottom-fixed{position: fixed; bottom: 30px; width: 100%; display: flex; justify-content: center; z-index: 54}
.menu-bottom-fixed .mobile-menu{display: none}
.menu-bottom-fixed ul.nav-menu{margin: 0px; padding: 10px; list-style: none; border-radius: 18px; background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); display: flex;}
.menu-bottom-fixed ul.nav-menu li{margin-right: 10px}
.menu-bottom-fixed ul.nav-menu li a{color: #fff; border-radius: 10px; border: 1px solid rgba(245, 245, 245, 0.18); line-height: 48px; color: #FFF; font-size: 16px; font-weight: 400; min-width: 130px; text-align: center;}
.menu-bottom-fixed ul.nav-menu li a:hover,
.menu-bottom-fixed ul.nav-menu li.current-menu-item a{border: #E6FF29 1px solid; color: #E6FF29}
.menu-bottom-fixed ul.nav-menu li:last-child{margin-right: 0px}
.menu-bottom-fixed ul.nav-menu li:last-child a{border: #E6FF29 1px solid; background: #E6FF29; color: #000}


.home-section{width: 100%; padding: 0px; height: 100vh; overflow: hidden; position: relative;}
.home-section video{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover; opacity: 0.2}
.home-section::before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 243px; z-index: 2; background: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, 0.00) 100%); }
.home-section img{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover; opacity: 0.2}
.home-section .content-area{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 2}
.home-section .content-area h1{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 120px; font-weight: 400; line-height: 140px; letter-spacing: -6px; text-transform: uppercase; text-align: center; margin: 0px}
.home-section .content-area h1 span{color: #E6FF29}

.about-section{width: 100%; padding:30px 0px 120px 0px; position: relative;}
.about-section::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 0px; right: -464px}
.about-section .container{z-index: 3; position: relative;}
.about-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0}
.about-section h2 span{color: #E6FF29}
.about-section .content-area{width: 50%; margin-left: 50%}
.about-section .content-area p{color: #FFF; font-size: 22px; font-weight: 400; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 35px 0}
.about-section .content-area a{font-family: 'Aldrich', sans-serif; text-transform: uppercase; color: #E6FF29; font-size: 18px; }
.about-section .content-area a svg{margin-left: 15px; }
.about-section .video-area{width: 80%; height: 680px; border-radius: 0px 200px 0px 0px; overflow: hidden; position: relative;  margin-top: 120px; }
.about-section .video-area img{filter: grayscale(1); position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; width: 100%; height: 100%; object-fit: cover;}

.scroll-text{position: relative; height: 140px; margin-bottom: 60px; opacity: 0.6}
.scroll-text .hightlighted{ font-family:'Britannic T'; -webkit-text-stroke: 2px #E6FF29; font-size: 160px; line-height: 140px; width: 6000px; margin-left: -300px; text-transform: uppercase; color: #000}


.service-section{width: 100%; padding:0px 0px 120px 0px; position: relative;}
.service-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.service-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.service-section h2 span{color: #E6FF29}
.service-section .content-area{width: 50%; margin-left: 50%; margin-bottom: 120px}
.service-section .content-area p{color: #FFF; font-size: 22px; font-weight: 400; line-height: 30px; letter-spacing: 0.44px; margin: 0}

.service-section .service-block{position: relative; height: 100vh; overflow: hidden; }
.service-section .service-block.reveal{transform: translateY(50px) scale(0.7); opacity: 0; transition: 1s all ease; }
.service-section .service-block.reveal.active{transform: translateY(0) scale(1); opacity: 1; width: 100%; }
.service-section .service-block img{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover; opacity: 0.2}
.service-section .service-block .service-detail{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; padding: 120px 0}
.service-section .service-block .service-detail .container{position: relative;}
.service-section .service-block .service-detail h3{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.service-section .service-block .service-detail h3 span{color: #E6FF29}
.service-section .service-block .service-detail ul.link{margin: 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.service-section .service-block .service-detail ul.link li{margin: 0 20px 20px 0}
.service-section .service-block .service-detail ul.link li a{border-radius: 25px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 15px 30px; font-size: 16px; line-height: 20px; font-weight: 400; color:#fff}
.service-section .service-block .service-detail ul.link li a svg{margin-left: 15px}
.service-section .service-block .service-detail ul.link li a:hover{background: #E6FF29; color: #000}
.service-section .service-block .service-detail ul.link li a:hover svg path{stroke:#000}
.service-section .service-block .service-detail .link-main {position: absolute; top: 30px; right: 30px; z-index: 9999; }
.service-section .service-block .service-detail .link-main .top{border-bottom: #E6FF29 1px solid; margin-bottom: 5px; display: flex; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 18px; font-weight: 400; line-height: 18px; text-transform: uppercase; align-items: end;}
.service-section .service-block .service-detail .link-main .top .line{width: 40px; margin-right: 10px}
.service-section .service-block .service-detail .link-main .top .line span{border-top: #E6FF29 1px solid; margin-bottom: 5px; height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-section .service-block .service-detail .link-main .top .line span:nth-of-type(1){width: 10px}
.service-section .service-block .service-detail .link-main .top .line span:nth-of-type(2){width: 20px}
.service-section .service-block .service-detail .link-main .top .line span:nth-of-type(3){width: 30px}
.service-section .service-block .service-detail .link-main .bottom{border-top: #E6FF29 1px solid; display: flex; justify-content: flex-start; flex-direction: row-reverse; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 17px; font-weight: 400; line-height: 25px;}
.service-section .service-block .service-detail .link-main .bottom .line{width: 40px; margin-left: 10px; padding-top: 5px}
.service-section .service-block .service-detail .link-main .bottom .line span{border-top: #E6FF29 1px solid;  height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-section .service-block .service-detail .link-main .bottom .line span:nth-of-type(1){width: 30px; margin-left: 10px}
.service-section .service-block .service-detail .link-main .bottom .line span:nth-of-type(2){width: 20px; margin-top: 5px; margin-left: 20px}
.service-section .service-block .service-detail .link-main .bottom .line span:nth-of-type(3){width: 10px; margin-top: 5px; margin-left: 30px}
.service-section .service-block .service-detail .link-main:hover .top,
.service-section .service-block .service-detail .link-main:hover .bottom{color: #E6FF29}
.service-section .service-block .service-detail .link-main:hover .top .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-section .service-block .service-detail .link-main:hover .bottom .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-section .service-block .service-detail .link-main:hover .bottom .line span:nth-of-type(1),
.service-section .service-block .service-detail .link-main:hover .bottom .line span:nth-of-type(2),
.service-section .service-block .service-detail .link-main:hover .bottom .line span:nth-of-type(3){margin-left: 0px}


.work-section{width: 100%; padding:30px 0px 120px 0px; position: relative;}
.work-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.work-section::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 258px; left: -685px}
.work-section::after{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1150px; height: 1150px; content: ''; position: absolute; top: 1258px; right: -600px}
.work-section .container{z-index: 3; position: relative;}
.work-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.work-section h2 span{color: #E6FF29}
.work-section .content-area{width: 50%; margin-left: 50%; margin-bottom: 80px}
.work-section .content-area p{color: #FFF; font-size: 22px; font-weight: 400; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 35px 0}
.work-section .content-area a{font-family: 'Aldrich', sans-serif; text-transform: uppercase; color: #E6FF29; font-size: 18px; }
.work-section .content-area a svg{margin-left: 15px; }
.work-section ul.work-list{margin: 0px -90px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.work-section ul.work-list li{padding: 0 90px; width: 50%; margin-bottom: 80px}
.work-section ul.work-list li:nth-of-type(2){margin-top: 100px}
.work-section ul.work-list li:nth-of-type(4){margin-top: 100px}
.project-block{width: 100%; height: 900px; overflow: hidden; position: relative;}
.project-block img{width: 100%; height: 100%; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; position: absolute;}
.project-block::before{content: ''; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%; background: linear-gradient(207deg, rgba(0, 0, 0, 0.43) 0%, rgba(0, 0, 0, 0.78) 100%); z-index:2}
.project-block .name-area{position: absolute; bottom: 35px; left: 0px; width: 100%; z-index: 2;}
.project-block .name-area .top{border-bottom: #E6FF29 1px solid; margin-bottom: 10px; display: flex; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 50px; font-weight: 400; line-height: 50px; text-transform: uppercase; align-items: end;}
.project-block .name-area .top .line{width: 100px; margin-right: 15px}
.project-block .name-area .top .line span{border-top: #E6FF29 1px solid; margin-bottom: 10px; height: 1px; display: block;}
.project-block .name-area .top .line span:nth-of-type(1){width: 75px}
.project-block .name-area .top .line span:nth-of-type(2){width: 87px}
.project-block .name-area .top .line span:nth-of-type(3){width: 100px}
.project-block .name-area .bottom{border-top: #E6FF29 1px solid; display: flex; justify-content: flex-start; flex-direction: row-reverse; color: #E6FF29; font-size: 30px; font-weight: 400; line-height: 36px; font-family: 'Rubik', sans-serif;}
.project-block .name-area .bottom .line{width: 100px; margin-left: 15px; padding-top: 10px}
.project-block .name-area .bottom .line span{border-top: #E6FF29 1px solid;  height: 1px; display: block;}
.project-block .name-area .bottom .line span:nth-of-type(1){width: 100px}
.project-block .name-area .bottom .line span:nth-of-type(2){width: 87px; margin-top: 10px; margin-left: 13px}
.project-block .name-area .bottom .line span:nth-of-type(3){width: 75px; margin-top: 10px; margin-left: 25px}
.project-block .project-name{position: absolute; bottom: 340px; right: -190px; transform: rotate(-90deg); font-family: 'Britannic T'; color: #fff; font-size: 120px; z-index: 2; opacity: 0.3; line-height: 120px;}
.project-block .link {position: absolute; top: 30px; right: 30px; z-index: 9999; }
.project-block .link .top{border-bottom: #E6FF29 1px solid; margin-bottom: 5px; display: flex; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 18px; font-weight: 400; line-height: 18px; text-transform: uppercase; align-items: end;}
.project-block .link .top .line{width: 40px; margin-right: 10px}
.project-block .link .top .line span{border-top: #E6FF29 1px solid; margin-bottom: 5px; height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-block .link .top .line span:nth-of-type(1){width: 10px}
.project-block .link .top .line span:nth-of-type(2){width: 20px}
.project-block .link .top .line span:nth-of-type(3){width: 30px}
.project-block .link .bottom{border-top: #E6FF29 1px solid; display: flex; justify-content: flex-start; flex-direction: row-reverse; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 17px; font-weight: 400; line-height: 25px;}
.project-block .link .bottom .line{width: 40px; margin-left: 10px; padding-top: 5px}
.project-block .link .bottom .line span{border-top: #E6FF29 1px solid;  height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-block .link .bottom .line span:nth-of-type(1){width: 30px; margin-left: 10px}
.project-block .link .bottom .line span:nth-of-type(2){width: 20px; margin-top: 5px; margin-left: 20px}
.project-block .link .bottom .line span:nth-of-type(3){width: 10px; margin-top: 5px; margin-left: 30px}
.project-block .link:hover .top,
.project-block .link:hover .bottom{color: #E6FF29}
.project-block .link:hover .top .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-block .link:hover .bottom .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-block .link:hover .bottom .line span:nth-of-type(1),
.project-block .link:hover .bottom .line span:nth-of-type(2),
.project-block .link:hover .bottom .line span:nth-of-type(3){margin-left: 0px}

.blog-section{width: 100%; padding:0px 0px 120px 0px; position: relative;}
.blog-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.blog-section::before{border-radius: 1150px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1150px; height: 1150px; content: ''; position: absolute; top: 180px; left: -472px; opacity: 0.3}
.blog-section .container{z-index: 3; position: relative;}
.blog-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.blog-section h2 span{color: #E6FF29}
.blog-section .content-area{width: 50%; margin-left: 50%; margin-bottom: 80px}
.blog-section .content-area p{color: #FFF; font-size: 22px; font-weight: 400; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 35px 0}
.blog-section .content-area a{font-family: 'Aldrich', sans-serif; text-transform: uppercase; color: #E6FF29; font-size: 18px; }
.blog-section .content-area a svg{margin-left: 15px; }
ul.blog-list{margin: 0px; padding: 0px; list-style: none; border-top: 1px solid #1E1E1E; }
ul.blog-list li{width: 100%; border-bottom: 1px solid #1E1E1E; padding: 30px 300px 30px 300px; position: relative;}
ul.blog-list li.reveal{position: relative; transform:perspective(2500px) rotateX(-100deg); opacity: 0; transition: 1s all ease;}
ul.blog-list li.reveal.active{transform: perspective(2500px) rotateX(0deg); opacity: 1;}
ul.blog-list li .name{color: #FFF; font-family: 'Aldrich', sans-serif; font-size: 40px; font-weight: 400; line-height: 40px; letter-spacing: -2px; margin: 0 0 15px 0}
ul.blog-list li p{color: #FFF; font-size: 18px; font-weight: 400; line-height: 26px; letter-spacing: 0.36px; opacity: 0.5; margin: 0px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
ul.blog-list li .date{font-family: 'Britannic T'; color: #E6FF29; text-align: center; font-size: 65px; font-weight: 400; line-height: 42px; text-transform: uppercase; width: 120px; position: absolute; left: 0px; top: 50%; margin-top: -62px}
ul.blog-list li .date span{color: #FFF; font-size: 100px; line-height: 70px; display: block; margin-bottom: 12px}
ul.blog-list li .link {position: absolute; top: 50%; right: 0px; margin-top: -25px; z-index: 9999;}
ul.blog-list li .link .top{border-bottom: #E6FF29 1px solid; margin-bottom: 5px; display: flex; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 18px; font-weight: 400; line-height: 18px; text-transform: uppercase; align-items: end;}
ul.blog-list li .link .top .line{width: 40px; margin-right: 10px}
ul.blog-list li .link .top .line span{border-top: #E6FF29 1px solid; margin-bottom: 5px; height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
ul.blog-list li .link .top .line span:nth-of-type(1){width: 10px}
ul.blog-list li .link .top .line span:nth-of-type(2){width: 20px}
ul.blog-list li .link .top .line span:nth-of-type(3){width: 30px}
ul.blog-list li .link .bottom{border-top: #E6FF29 1px solid; display: flex; justify-content: flex-start; flex-direction: row-reverse; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 17px; font-weight: 400; line-height: 25px;}
ul.blog-list li .link .bottom .line{width: 40px; margin-left: 10px; padding-top: 5px}
ul.blog-list li .link .bottom .line span{border-top: #E6FF29 1px solid;  height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
ul.blog-list li .link .bottom .line span:nth-of-type(1){width: 30px; margin-left: 10px}
ul.blog-list li .link .bottom .line span:nth-of-type(2){width: 20px; margin-top: 5px; margin-left: 20px}
ul.blog-list li .link .bottom .line span:nth-of-type(3){width: 10px; margin-top: 5px; margin-left: 30px}
ul.blog-list li:hover .link .top,
ul.blog-list li:hover .link .bottom{color: #E6FF29}
ul.blog-list li:hover .link .top .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
ul.blog-list li:hover .link .bottom .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
ul.blog-list li:hover .link .bottom .line span:nth-of-type(1),
ul.blog-list li:hover .link .bottom .line span:nth-of-type(2),
ul.blog-list li:hover .link .bottom .line span:nth-of-type(3){margin-left: 0px}

.review-section{width: 100%; padding:0px 0px 120px 0px; position: relative;}
.review-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.review-section::before{border-radius: 1150px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1150px; height: 1150px; content: ''; position: absolute; top: -180px; right: -600px; opacity: 0.5}
.review-section .container{z-index: 3; position: relative;}
.review-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.review-section h2 span{color: #E6FF29}
.review-section .review-block{background: #0B0B0B; min-height: 540px; padding: 80px 40px; position: relative; margin-top: 50px}
.review-section .review-block::before{content: ''; background: url(../images/quote.png) center center no-repeat; width: 122px; height: 102px; position: absolute; top: -50px; left: 40px}
.review-section .review-block .message{color: #FFF; font-size: 20px; font-weight: 300; line-height: 30px;letter-spacing: 0.4px; opacity: 0.68; }
.review-section .review-block .name{background: #E6FF29; position: absolute; bottom: 0px; left: 0px; width: 100%; color: #000; font-size: 28px; font-weight: 500; line-height: 28px; letter-spacing: -0.56px; padding: 18px}
.review-section .review-block .name span{display: block; color: #000; font-size: 18px; font-weight: 400; line-height: 18px; letter-spacing: -0.36px; opacity: 0.5; margin-top: 4px}
.review-section .review-block .name::before{content: ''; background: #0B0B0B; height: 30px; width: 200px; position: absolute; right: 0px; top: 0px}
.review-section .review-block .name::after{content: ''; position: absolute; right: 200px; top: 0px; width: 0; height: 0; border-top: 30px solid #0B0B0B; border-left: 40px solid transparent;}
.review-section .owl-nav{display: none}

.footer-main{width: 100%; padding:0px 0px 120px 0px; position: relative; background: #000;}
.footer-main video{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover; opacity: 0.2}
.footer-main .scroll-text .hightlighted	{text-transform: lowercase;}
.footer-main::before{background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.00) 100%); content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height:240px}
.footer-main .leftside{width: 50%; padding-top: 20px}
.footer-main .leftside .logo{width: 500px}
.footer-main .rightside{width: 50%; padding-top: 160px}
.footer-main h2{font-family: 'Aldrich', sans-serif; color: #E6FF29; font-size: 80px;  line-height: 70px; letter-spacing: -3.2px; margin: 0 0 45px 0}
.footer-main h2 span{color: #FFF; font-size: 50px;letter-spacing: -1px; display: block;}
.footer-main p{color: #FFF; font-size: 30px; font-weight: 400; line-height: 48px; margin-bottom: 20px}


.reveal{position: relative; transform: translateY(250px); opacity: 0; transition: 1s all ease;}
.reveal.active{transform: translateY(0); opacity: 1;}

/* h2.reveal{position: relative; transform: translateY(100%) rotateX(-80deg); opacity: 0; transition: 1s all ease; transform-style: preserve-3d; transition: opacity .8s cubic-bezier(.215, .61, .355, 1), transform .8s cubic-bezier(.215, .61, .355, 1);}
h2.reveal.active{transform: translateY(0%) rotateX(0deg); opacity: 1; transition-delay: 0.5s}
.content-area.reveal{position: relative; transform:perspective(2500px) rotateX(-100deg); opacity: 0; transition: 1s all ease;}
.content-area.reveal.active{transform: perspective(2500px) rotateX(0deg); opacity: 1; transition-delay: 1s} */

.loader-area{position: fixed; width: 100%; height: 100vh; background: #000; z-index: 99; display: flex; align-items: center; top: -100%; transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease;}
.loader-area.active{top: 0px; transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease;}

.animation-area{width: 1140px; margin: 0 auto; display: flex;}
.animation-area .logo-icon-box{margin-right: 50px}
.animation-area .nectar-title path:nth-child(1){stroke-dasharray: 1155; stroke-dashoffset: 1155; animation: nectar-line-stroke 3s ease forwards }
.animation-area .nectar-title path:nth-child(2){stroke-dasharray: 954; stroke-dashoffset: 954; animation: nectar-line-stroke 3s ease forwards 0.3s}
.animation-area .nectar-title path:nth-child(3){stroke-dasharray: 754; stroke-dashoffset: 754; animation: nectar-line-stroke 3s ease forwards 0.6s}
.animation-area .nectar-title path:nth-child(4){stroke-dasharray: 614; stroke-dashoffset: 614; animation: nectar-line-stroke 3s ease forwards 0.9s}
.animation-area .nectar-title path:nth-child(5){stroke-dasharray: 940; stroke-dashoffset: 940; animation: nectar-line-stroke 3s ease forwards 1.2s}
.animation-area .nectar-title path:nth-child(6){stroke-dasharray: 484; stroke-dashoffset: 484; animation: nectar-line-stroke 3s ease forwards 1.5s}

@keyframes nectar-line-stroke {
    to{
        stroke-dashoffset: 0;
    }
}
@keyframes nectar-fill {
    from{
        fill: transparent;
    }
    to{
        fill:#e6ff29
    }
}
@keyframes line-stroke {

    to{
        stroke-dashoffset: 0;
    }
}

#logo-icon line:nth-child(1){stroke-dasharray: 89; stroke-dashoffset: 89; animation: line-stroke 1s ease forwards }
#logo-icon line:nth-child(2){stroke-dasharray: 116; stroke-dashoffset: 116; animation: line-stroke 1s ease forwards;  animation-delay: 1s; }
#logo-icon line:nth-child(3){stroke-dasharray: 143; stroke-dashoffset: 143; animation: line-stroke 1s ease forwards;  animation-delay: 2s; }
#logo-icon line:nth-child(4){stroke-dasharray: 197; stroke-dashoffset: 197; animation: line-stroke 2s ease forwards;  animation-delay: 3s; }
#logo-icon line:nth-child(5){stroke-dasharray: 197; stroke-dashoffset: 197; animation: line-stroke 2s ease forwards;  animation-delay: 3s; }
#logo-icon line:nth-child(6){stroke-dasharray: 157; stroke-dashoffset: 157; animation: line-stroke 1s ease forwards;  animation-delay: 2s; }
#logo-icon line:nth-child(7){stroke-dasharray: 136; stroke-dashoffset: 136; animation: line-stroke 1s ease forwards;  animation-delay: 1s; }
#logo-icon line:nth-child(8){stroke-dasharray: 116; stroke-dashoffset: 116; animation: line-stroke 1s ease forwards;}


.inner-section{width: 100%; padding:0px; position: relative; height: 100vh; display: flex; align-items: center;}
.inner-section::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 0px; right: -464px}
.inner-section .container{z-index: 3; position: relative;}
.inner-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase;}
.inner-section h1{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 100px; font-weight: 400; line-height: 100px; letter-spacing: -4px; margin: 30px 0 0 0; }
.inner-section h1 span{color: #E6FF29}
.inner-section svg{width: 100%; position: absolute; bottom: 0px; left: 0px; }


.about-area{width: 100%; padding:120px 0px 0px 0px; position: relative;}
.about-area .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.about-area h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.about-area h2 span{color: #E6FF29}
.about-area .content-area{width: 80%; margin-left: 20%; margin-bottom: 120px}
.about-area .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.about-area .three-box-content{position: relative; height: 982px;}
.about-area .three-box-content .green-block{max-width: 420px; background: #E6FF29; padding: 30px; margin-bottom: 100px}
.about-area .three-box-content .green-block h3{font-family: 'Aldrich', sans-serif; font-size: 34px; text-transform: uppercase; position: relative; line-height: 40px; padding-top: 10px; margin: 0 0 15px 0; font-weight: 700}
.about-area .three-box-content .green-block h3 span{font-family: 'Britannic T'; position: absolute; top: -78px; font-size: 90px; line-height: 90px; color: #000; -webkit-text-stroke: 2px #E6FF29;}
.about-area .three-box-content .green-block.one{position: absolute; top: 0px; left: 450px}
.about-area .three-box-content .green-block.two{position: absolute; top: 300px; right: 50px}
.about-area .three-box-content .green-block.three{position: absolute; top: 600px; left: 50px}
.about-area .photo-area{width: 100%; height: 768px; position: relative; overflow: hidden; margin-top: 120px}
.about-area .photo-area video{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover;}
.about-area .photo-area img{width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; object-fit: cover;}

.creative-area{width: 100%; padding:0px 0px 60px 0px; position: relative;}
.creative-area .scroll-text{margin-top: -72px}
.creative-area .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.creative-area h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.creative-area h2 span{color: #E6FF29}
.creative-area .flex-area{display: flex; flex-wrap: wrap; width: 80%; margin-left: 20%}
.creative-area .content-area{width: 46%; border: #E6FF29 1px solid; padding: 40px; margin-left:2%; margin-right: 2%; margin-bottom: 60px}
.creative-area .content-area h3{font-family: 'Britannic T'; font-size: 50px; line-height: 50px; color: #E6FF29; font-weight: 700; margin: 0 0 20px 0}
.creative-area .content-area p{color: #FFF; font-size: 20px; font-weight: 300; line-height: 26px; letter-spacing: 0.44px; margin: 0}
.creative-area .content-area:nth-of-type(2),
.creative-area .content-area:nth-of-type(3){background: #E6FF29;}
.creative-area .content-area:nth-of-type(2) h3,
.creative-area .content-area:nth-of-type(3) h3{color: #000}
.creative-area .content-area:nth-of-type(2) p,
.creative-area .content-area:nth-of-type(3) p{color: #000; opacity: 0.8}



.team-section{width: 100%; padding:30px 0px 120px 0px; position: relative;}
.team-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.team-section .container{z-index: 3; position: relative;}
.team-section h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.team-section h2 span{color: #E6FF29}
.team-section .content-area{width: 50%; margin-left: 50%; margin-bottom: 80px}
.team-section .content-area p{color: #FFF; font-size: 22px; font-weight: 400; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 35px 0}
.team-section .content-area a{font-family: 'Aldrich', sans-serif; text-transform: uppercase; color: #E6FF29; font-size: 18px; }
.team-section .content-area a svg{margin-left: 15px; }
.team-section .team-block{background:#E6FF29; position: relative; padding: 25px; border-radius: 15px; display: flex; justify-content: flex-end;}
.team-section .team-block .photo{width: 400px; height: 500px; position: relative; border-radius: 15px; overflow: hidden;}
.team-section .team-block .photo img{width: 100%; height: 100%; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; position: absolute; }
.team-section .team-block .number{position: absolute; color: #000; top: 25px; left: 25px; font-size: 100px; font-weight: 700; line-height: 100px}
.team-section .team-block .detail{position: absolute; bottom: 25px; left: 25px}
.team-section .team-block .detail .name{font-size: 100px; font-weight: 700; line-height: 100px; color: #000; font-family: 'Britannic T';}
.team-section .team-block .detail .position{font-size: 36px; color: #000; margin-top: 10px; text-transform: uppercase;}

svg .draw {
    fill: transparent;
    stroke-width: 1;
    stroke-dasharray: 9680;
    stroke-dashoffset: 9680;

    animation: animate 8s forwards;
}
@keyframes animate {
    to {
        stroke-dashoffset: 0;
        animation-delay: 8s;
    }
}


.service-page{width: 100%; padding:120px 0px 120px 0px; position: relative;}
.service-page .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.service-page h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.service-page h2 span{color: #E6FF29}
.service-page .content-area{width: 80%; margin-left: 20%; margin-bottom: 120px}
.service-page .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.service-page .service-list{border-bottom:#2f2f2f 1px solid}
.service-page .service-block{border-top:#2f2f2f 1px solid; padding: 115px 120px 50px 0px; position: relative; }
.service-page .service-block .number{font-family: 'Britannic T'; position: absolute; top: 40px; left: 0px; font-size: 130px; line-height: 130px; color: #000; -webkit-text-stroke: 2px #E6FF29; opacity: 0.3;}
.service-page .service-block .title{font-family: 'Aldrich', sans-serif; color: #fff; font-size: 45px; line-height: 50px; margin-bottom: 20px; text-transform: uppercase;position: relative; z-index: 2}
.service-page .service-block .content-block{width:75%}
.service-page .service-block .content-block p{color: #FFF; font-size: 20px; font-weight: 300; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 20px 0}
.service-page .service-block .content-block ul.sublist{margin: 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.service-page .service-block .content-block ul.sublist li{margin: 0 20px 20px 0}
.service-page .service-block .content-block ul.sublist li a{border-radius: 25px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 15px 30px; font-size: 16px; line-height: 20px; font-weight: 400; color:#fff}
.service-page .service-block .content-block ul.sublist li a svg{margin-left: 15px}
.service-page .service-block .content-block ul.sublist li a:hover{background: #E6FF29; color: #000}
.service-page .service-block .content-block ul.sublist li a:hover svg path{stroke:#000}
.service-page .service-block .link-main{position: absolute; top: 50px; right: 0px; z-index: 9999; }
.service-page .service-block .link-main .top{border-bottom: #E6FF29 1px solid; margin-bottom: 5px; display: flex; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 18px; font-weight: 400; line-height: 18px; text-transform: uppercase; align-items: end;}
.service-page .service-block .link-main .top .line{width: 40px; margin-right: 10px}
.service-page .service-block .link-main .top .line span{border-top: #E6FF29 1px solid; margin-bottom: 5px; height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-page .service-block .link-main .top .line span:nth-of-type(1){width: 10px}
.service-page .service-block .link-main .top .line span:nth-of-type(2){width: 20px}
.service-page .service-block .link-main .top .line span:nth-of-type(3){width: 30px}
.service-page .service-block .link-main .bottom{border-top: #E6FF29 1px solid; display: flex; justify-content: flex-start; flex-direction: row-reverse; font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 17px; font-weight: 400; line-height: 25px;}
.service-page .service-block .link-main .bottom .line{width: 40px; margin-left: 10px; padding-top: 5px}
.service-page .service-block .link-main .bottom .line span{border-top: #E6FF29 1px solid;  height: 1px; display: block; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-page .service-block .link-main .bottom .line span:nth-of-type(1){width: 30px; margin-left: 10px}
.service-page .service-block .link-main .bottom .line span:nth-of-type(2){width: 20px; margin-top: 5px; margin-left: 20px}
.service-page .service-block .link-main .bottom .line span:nth-of-type(3){width: 10px; margin-top: 5px; margin-left: 30px}
.service-page .service-block .link-main:hover .top,
.service-page .service-block .link-main:hover .bottom{color: #E6FF29}
.service-page .service-block .link-main:hover .top .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-page .service-block .link-main:hover .bottom .line span{width: 40px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.service-page .service-block .link-main:hover .bottom .line span:nth-of-type(1),
.service-page .service-block .link-main:hover .bottom .line span:nth-of-type(2),
.service-page .service-block .link-main:hover .bottom .line span:nth-of-type(3){margin-left: 0px}
.service-page .service-block svg.icon-svg{position: absolute; bottom: 0px; right: 0px; width: 50%}
.service-page .service-block svg.icon-svg path {
    fill: transparent;
    stroke: #e6ff29;
    stroke-width: 1;
    stroke-dasharray: 9680;
    stroke-dashoffset: 9680;
    transition: all 2s;
    transition-timing-function: ease-in-out;
}

.service-page .service-block:hover svg.icon-svg path{
    stroke-dashoffset: 0px;
    transition: all 6s;
    transition-timing-function: ease-in-out;
}

.contact-page{width: 100%; padding:120px 0px 120px 0px; position: relative;}
.contact-page::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: -100px; left: -464px}
.contact-page .container{position: relative; z-index: 1}
.contact-page .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.contact-page h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.contact-page h2 span{color: #E6FF29}
.contact-page .content-area{width: 80%; margin-left: 20%; margin-bottom: 120px}
.contact-page .content-area ul.radio-area{margin: 0px -8px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.contact-page .content-area ul.radio-area li{padding: 0 8px; width: 25%;}
.contact-page .form-group{margin: 0 0 15px 0; position: relative;}
.contact-page .form-group label{font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #E6FF29}
.contact-page .form-group .form-control {border-radius: 5px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); color: #fff; font-size: 14px; letter-spacing: 1px; padding: 14px 15px; line-height: 22px;}
.contact-page .form-group .form-control:focus{box-shadow: none;  border: #E6FF29 1px solid}
.contact-page .form-group .form-control::-moz-placeholder {color: #fff !important; opacity: 1;}
.contact-page .form-group .form-control:-ms-input-placeholder {color: #fff !important;}
.contact-page .form-group .form-control::-webkit-input-placeholder {color: #fff !important;}
.contact-page .btn-submit{border-radius: 5px; border: #E6FF29; background: #E6FF29; padding: 15px 35px; font-size: 16px; color: #000; text-align: center; font-weight: 400;}
.contact-page input[type=radio].css-radio {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0; }
.contact-page input[type=radio].css-radio + label.css-radiolabel{cursor: pointer; position: relative; margin: 0px; width: 100%; border-radius: 5px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 15px; font-size: 14px; color: #fff; text-align: center; font-weight: 400;}
.contact-page input[type=radio].css-radio:checked + label.css-radiolabel{background: #E6FF29; color: #000}

.contact-info{width: 100%; padding:120px 0px 120px 0px; position: relative;}
.contact-info .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.contact-info h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.contact-info h2 span{color: #E6FF29}
.contact-info .content-area{width: 80%; margin-left: 20%; }
.contact-info .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0}
.contact-info .content-area .info{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 40px 0 0 0; width: 80%}
.contact-info .content-area .info a{color: #fff}
.contact-info .content-area .info strong{font-family: 'Britannic T'; color: #E6FF29; line-height: 46px; font-size: 46px; display: block; margin-bottom: 10px}


.project-page{width: 100%; padding:120px 0px 120px 0px; position: relative;}
.project-page::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; bottom: 258px; left: -685px;}
.project-page .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.project-page .container{position: relative; z-index: 2}
.project-page h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.project-page h2 span{color: #E6FF29}
.project-page .content-area{width: 80%; margin-left: 20%; margin-bottom: 120px}
.project-page .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.project-page ul.work-list{margin: 0px -90px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.project-page ul.work-list li{padding: 0 90px; width: 50%; margin-bottom: 100px}
.project-page ul.work-list li:nth-of-type(even){margin-top: 100px}
.project-page .project-block .project-name{bottom: 334px; right: -358px; width: 800px;}
.project-page .project-block .project-info{position: absolute; bottom: 30px; left: 30px; z-index: 4; font-family: 'Britannic T'; font-size: 60px; color: #fff; line-height: 60px}
.project-page .project-block .project-info span{color: #E6FF29; display: block; font-family: 'Aldrich', sans-serif; text-transform: uppercase; font-size: 30px; line-height: 30px; margin-top: 10px}
.project-page .project-block::after {content: ''; position: absolute; bottom: -540px; left: -540px; width: 540px; height: 540px; z-index: 3; border-radius: 375px; background: rgba(0, 0, 0, 0.10); backdrop-filter: blur(10px); transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-page .project-block:hover::after{bottom: -220px; left: -110px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-page .project-block::before{transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.project-page .project-block:hover::before{opacity: 0; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}


.blog-list-page{width: 100%; padding:120px 0px 120px 0px; position: relative;}
.blog-list-page::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; bottom: 258px; left: -685px;}
.blog-list-page .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.blog-list-page .container{position: relative; z-index: 2}
.blog-list-page h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.blog-list-page h2 span{color: #E6FF29}
.blog-list-page .content-area{width: 80%; margin-left: 20%; margin-bottom: 120px}
.blog-list-page .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}

.project-inner-section{width: 100%; padding:0px; position: relative; padding: 200px 0; display: flex; align-items: center;}
.project-inner-section::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 0px; right: -464px}
.project-inner-section .container{z-index: 3; position: relative;}
.project-inner-section .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase;}
.project-inner-section h1{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 100px; font-weight: 400; line-height: 100px; letter-spacing: -4px; margin: 0 0 25px 0; }
.project-inner-section h1 span{color: #E6FF29}
.project-inner-section .content-area{width: 80%; margin-left: 20%; margin-bottom: 60px}
.project-inner-section .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.project-inner-section .project-main-photo{padding: 80px}
.project-inner-section .project-main-photo .photo-area{border: #000 8px solid; border-radius: 25px; overflow: hidden;}

.project-detail{width: 100%; padding:0px 0px 120px 0px; position: relative;}
.project-detail::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 258px; left: -685px;}
.project-detail .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.project-detail .container{position: relative; z-index: 2}
.project-detail h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.project-detail h2 span{color: #E6FF29}
.project-detail .content-area{width: 80%; margin-left: 20%; margin-bottom: 80px}
.project-detail .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.project-detail .content-area ul.sublist{margin: 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.project-detail .content-area ul.sublist li{margin: 0 20px 20px 0}
.project-detail .content-area ul.sublist li a{border-radius: 25px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 15px 30px; font-size: 16px; line-height: 20px; font-weight: 400; color:#fff}
.project-detail .content-area ul.sublist li a svg{margin-left: 15px}
.project-detail .content-area ul.sublist li a:hover{background: #E6FF29; color: #000}
.project-detail .content-area ul.sublist li a:hover svg path{stroke:#000}
.project-detail .photo-list-area{display: flex; flex-wrap: wrap; margin: 0 -20px}
.project-detail .photo-list-area .photo{width: 50%; padding: 0 20px; margin-bottom: 40px}
.project-detail .photo-list-area .photo:last-child{width: 100%}
.project-detail .large-photo{display: flex; padding: 50px 50px 0 50px; align-items: center;}
.project-detail .large-photo .leftside{width: 40%; height: 1180px; overflow: hidden;}
.project-detail .large-photo .rightside{width: 60%; padding: 0px 50px 0px 100px}
.project-detail .large-photo .rightside .tablet-area{border: #000 8px solid; border-radius: 25px; overflow: hidden;}


.service-main-block{width: 100%; padding:0px 0px 180px 0px; position: relative;}
.service-main-block::before{border-radius: 1577px; opacity: 0.5; z-index: 1; background: rgba(230, 255, 41, 0.30); filter: blur(200px); width: 1577px; height: 1577px; content: ''; position: absolute; top: 258px; left: -685px;}
.service-main-block .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.service-main-block .container{position: relative; z-index: 2}
.service-main-block h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.service-main-block h2 span{color: #E6FF29}
.service-main-block .content-area{width: 80%; margin-left: 20%; margin-bottom: 80px}
.service-main-block .content-area p{color: #FFF; font-size: 28px; font-weight: 300; line-height: 36px; letter-spacing: 0.44px; margin: 0 0 25px 0}
.service-main-block .content-area a.link{border-radius: 25px; border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 15px 30px; font-size: 16px; line-height: 20px; font-weight: 400; color:#fff}
.service-main-block .content-area a.link svg{margin-left: 15px}
.service-main-block .content-area a.link:hover{background: #E6FF29; color: #000}
.service-main-block .content-area a.link:hover svg path{stroke:#000}
.service-main-block .content-flex{display: flex; margin: 0 -40px}
.service-main-block .content-flex .half-block{width: 50%; padding: 0 40px}
.service-main-block .content-flex .half-block .inner-block{border: 1px solid rgba(245, 245, 245, 0.18); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); padding: 40px;}
.service-main-block .content-flex .half-block .inner-block h3{font-family: 'Britannic T'; color: #E6FF29; font-size: 60px; line-height: 70px; margin: 0 0 30px 0}
.service-main-block .content-flex .half-block .inner-block ol{margin: 0px; padding: 0px 0px 0px 50px;list-style: none;}
.service-main-block .content-flex .half-block .inner-block ol li{color: #FFF; font-size: 20px; font-weight: 300; line-height: 30px; letter-spacing: 0.44px; margin: 0 0 10px 0; position: relative; padding-left: 25px}
.service-main-block .content-flex .half-block .inner-block ol li::before{content: ''; width: 14px; height: 14px; background: #E6FF29; position: absolute; top: 8px; left: 0px; transform: rotate(45deg);}
.service-main-block .content-flex .half-block:nth-child(2n+2){margin-top: 100px}

.service-whatwedo-area{width: 100%; padding:0px 0px 60px 0px; position: relative;}
.service-whatwedo-area .scroll-text{margin-top: -72px}
.service-whatwedo-area .subtitle{color: #E6FF29; font-size: 18px; font-weight: 500; line-height: 30px; letter-spacing: 6.3px; text-transform: uppercase; margin-bottom: 35px}
.service-whatwedo-area h2{font-family: 'Aldrich', sans-serif; color: #FFF; font-size: 80px; font-weight: 400; line-height: 90px;letter-spacing: -4px; margin: 0 0 50px 0; text-transform: uppercase;}
.service-whatwedo-area h2 span{color: #E6FF29}
.service-whatwedo-area .flex-area{display: flex; flex-wrap: wrap; width: 80%; margin-left: 20%}
.service-whatwedo-area .content-area{width: 100%; border: #E6FF29 1px solid; padding: 40px; margin-bottom: 30px}
.service-whatwedo-area .content-area h3{font-family: 'Britannic T'; font-size: 50px; line-height: 50px; color: #E6FF29; font-weight: 700; margin: 0 0 20px 0}
.service-whatwedo-area .content-area p{color: #FFF; font-size: 20px; font-weight: 300; line-height: 26px; letter-spacing: 0.44px; margin: 0}
.service-whatwedo-area .content-area:nth-of-type(2n+2){background: #E6FF29;}
.service-whatwedo-area .content-area:nth-of-type(2n+2) h3{color: #000}
.service-whatwedo-area .content-area:nth-of-type(2n+2) p{color: #000; opacity: 0.8}