@charset "utf-8";
.input1, body {
    font-family:Roboto, sans-serif
}

.titlewrap span, h2 strong {
    background:linear-gradient(to right, #975ade, #af63d2, #d473c0, #ef7da7, #e6686f);
    -webkit-text-fill-color:transparent;
    font-weight:500
}

.contactform, .fixwrap, .free, .input1, .subm, .t-v {
    width:100%
}

*, .two-col.normalize .i3 {
    padding:0
}

.fixwrap, .midtextbox, .testimonial-wrap {
    margin-left:auto;
    margin-right:auto
}

.aligncenter, .aligncenter-m, .heading3, .linkbox li a {
    text-align:center
}

.col40 ul li a:hover, .linkbox li a:hover, .subtitle4 a, .subtitle4 a:hover, a, a.b:hover {
    text-decoration:none
}

.logo, .n-wrap, a {
    transition:222ms
}

.banner, .bg-faq, .p-box {
    overflow:hidden
}

.four-col, .service-cell {
    box-shadow:0 0 21px -5px #dedede
}

.p-box:hover img, .service-cell img, .show-reel:hover img {
    transform:scale(1.2)
}

.p-box:hover .play-btn, .show-reel .play-btn, .whatsapp i {
    animation-name:pulse;
    animation-duration:1.5s;
    animation-timing-function:ease-out;
    animation-iteration-count:infinite
}

body {
    font-optical-sizing:auto;
    font-weight:400;
    font-size:20px;
    line-height:35px;
    color:#515151
}

* {
    margin:0;
    box-sizing:border-box;
    -webkit-tap-highlight-color:rgba(255, 255, 255, 0)!important;
    -webkit-focus-ring-color:rgba(255, 255, 255, 0)!important
}

::selection {
    background-color:#f8e4b4;
    color:#000
}

.parentflex {
    display:flex;
    flex-wrap:wrap
}

.padmain {
    padding-left:10%;
    padding-right:10%
}

.padall {
    padding:3em
}

.pad-top, .pad-top-bottom {
    padding-top:5%
}

.pad-bottom, .pad-top-bottom {
    padding-bottom:5%
}

.float-right, .service-cell .link i {
    float:right
}

.fixwrap {
    max-width:1200px
}

.margin-top {
    margin-top:5%
}
.margin-top-small {
    margin-top:2%
}

.margin-bottom {
    margin-bottom:5%
}

.margin-bottom-small {
    margin-bottom:2%
}

#myVideo2, .sep {
    margin-bottom:.5em
}

.faq, .pad-left {
    padding-left:5em
}

.pad-left-small {
    padding-left:1.5em
}

.t-v {
    height:300px
}

h1 {
    font-size:45px
}

h2 {
    font-size:40px
}

h3 {
    font-size:30px
}

.bg-build h3, .midtextbox h3, .smltext, h4 {
    font-size:30px
}

.bg-blue h4, h5 {
    font-size:25px
}

h6 {
    font-size:18px
}

h1, h2, h3, h4, h5, h6 {
    line-height:normal;
    margin-bottom:20px;
    font-weight:600;
    color:#363535
}

h2 strong {
    -webkit-background-clip:text
}

.sep {
    column-count:2;
    gap:1em
}

.subm {
    font-size:15px
}

.subm span {
    flex:1 1 32%
}

.subm span:last-child {
    flex:2%;
    text-align:right
}

.subm span:nth-child(2) {
    text-align:right;
    line-height:55px
}

.input1 {
    border:2px solid #ccc;
    border-radius:7px;
    padding:1em;
    font-size:18px;
    margin-bottom:1em
}

.btn {
    font-size:15px;
    background-color:#2d2d2d;
    color:#fff;
    font-family:Outfit, sans-serif;
    padding:11px 21px;
    border:none;
    margin-top:3px;
    border-radius:5px
}

.smal-grad-txt, .titlewrap span {
    display:inline-block;
    font-size:16px
}

.btn:hover {
    background-color:#0cada5
}

.titlewrap span {
    color:#a74fab;
    -webkit-background-clip:text;
    text-transform:uppercase;
    margin-bottom:11px
}

.gradient-text {
    color:#a74fab;
    background:linear-gradient(to right, #0039e3, #0039e3, #5e28dd, #741bd9, #8600d4);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    display:inline-block
}
.gradient-testi {
    color:#a74fab;
    background:linear-gradient(to right, #6a26b9, #7b3bc6, #8d51d4, #df5e97, #ef7da7);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    display:inline-block
}

.smal-grad-txt, .two-col section i {
    background:linear-gradient(to right, #975ade, #af63d2, #d473c0, #ef7da7, #e6686f);
    -webkit-text-fill-color:transparent
}

.smal-grad-txt {
    color:#a74fab;
    -webkit-background-clip:text;
    margin-bottom:7px;
    font-weight:600
}

.icon, .icon2 {
    font-size:50px;
    display:inline-block
}

.icon {
    color:#a74fab;
    background:linear-gradient(to right, #0039e3, #0039e3, #5e28dd, #741bd9, #8600d4);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent
}

.col40, .icon2, .label {
    color:#fff
}

.icon2 {
    margin-bottom:11px
}

.col-d40, .two-col {
    flex:1 1 35%;
    min-width:222px
}

.two-col article, .two-col section {
    display:block;
    margin-top:30px;
    border-bottom:1px solid #ccc;
    padding-bottom:30px
}

.two-col article img {
    float:left;
    margin-right:21px;
    width:70px;
    height:auto;
    margin-bottom:20px
}

.two-col section strong {
    display:block;
    font-size:21px;
    color:#422043;
    font-weight:600;
    margin-bottom:7px
}

.two-col section i {
    font-size:50px;
    float:left;
    margin-right:20px;
    margin-bottom:60px;
    display:inline-block;
    width:60px;
    height:60px;
    -webkit-background-clip:text
}

.two-col section:last-child {
    border-bottom:none
}

.blogcell, .three-col {
    flex:1 1 30%;
    min-width:222px
}

.four-col {
    flex:1 1 22%;
    min-width:222px
}

.four-col section {
    padding:0.8em;
    font-size:16px;
    line-height:25px
}

.four-col section strong {
    display:block;
    margin-bottom:7px;
    font-size:21px;
    font-weight:600
}

.four-col span {
    position:relative
}

.col60 {
    width:60%
}

.col40 {
    flex:1 1 30%;
    background:linear-gradient(224deg, #8205d5 10%, #2036e2 100%);
    padding:3em;
    position:sticky;
    top:10px;
    height:480px
}

.col40 strong {
    font-size:25px;
    font-weight:500;
    display:block;
    margin-bottom:30px
}

.col40 ul li, .footercell ul li, .linkbox ul li {
    list-style:none
}

.col40 ul li a {
    display:block;
    border-bottom:1px solid rgba(255, 255, 255, .2);
    padding:11px 0;
    color:#d4d4d4
}

.col40 ul li a:hover {
    color:#fff
}

.col30 {
    flex:1 1 30%
}

.col30 section {
    margin-bottom:45px;
    width:100%;
    float:left
}

.i3 h5, .titlewrap h2 {
    margin-bottom:0
}

.col30 section img {
    width:35%;
    height:auto;
    float:left;
    margin-right:25px
}

.col30 section a {
    color:#242424;
    font-size:22px;
    display:block;
    margin-bottom:11px
}

.col30 section a:hover {
    text-decoration:none;
    color:#0752c6
}

.linkbox ul {
    display:flex;
    flex-wrap:wrap;
    gap:11px
}

.linkbox li a {
    border:1px solid #ccc;
    padding:7px 11px;
    font-size:15px;
    color:#242424
}

.linkbox li a:hover {
    color:#797979
}
.custom-bullets {
  list-style: none;
  margin: 0;
  padding: 0;
}

.custom-bullets li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 1em;
  line-height: 1.6;
}

/* bullet */
.custom-bullets li::before {
  content: "";
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  background-color: #8c4da9;
  border-radius: 50%;
  margin-top: 0.5em; 
}
.bullet-text {
  display: block;
}

.bullet-highlight {
  font-weight: 600;
  color: #252525;
  margin-right: 0.25em;
}


.col-d60 {
    flex:1 1 60%;
    position:relative;
    min-width:222px
}

.bedroom, .bg-faq:before, .label {
    position:absolute
}

.double1 {
    width:70%;
    height:auto
}

.bedroom {
    width:50%;
    bottom:-50px;
    right:0;
    z-index:2
}

.bedroom img, .logo img, .responsive img {
    width:100%;
    height:auto
}

.holder {
    width:100%;
    margin-top:50px
}

.label {
    background-color:#343434;
    bottom:0;
    right:0;
    padding:3px 21px;
    font-size:14px
}

.bg-faq, .bg-faq h2, .bg-faq i, .i3 h5 {
    position:relative
}

.i1, .i3 {
    padding:4%
}

.i1 {
    flex:25%;
    background:linear-gradient(224deg, #8205d5 10%, #2036e2 100%);
    min-height:600px
}

.bg-4, .bg01 {
    background-attachment:fixed
}

.bg-4, .bg-gray, .bg01, .i2 {
    background-size:cover;
    background-repeat:no-repeat
}

.i2 {
    flex:45%;
    background-image:url(../images/motion-graphics-e-learning-video.jpg);
    background-position:center center
}

.i2 .p-box {
    background-color:transparent;
    height:100%
}

.i2 .p-box .play-btn {
    opacity:1
}

.i3 {
    flex:30%
}

.i3 section {
    color:#daa520;
    font-size:35px
}

.i3 h5, .titlewrap h2 strong {
    color:#a74fab;
    font-weight:500;
    -webkit-text-fill-color:transparent
}

.i3 h5 {
    font-size:25px;
    background-image:linear-gradient(90deg, #975ade 20%, #ef7da7 60%);
    background-clip:text;
    -webkit-background-clip:text;
    width:100%;
    margin-top:5px;
    display:block
}

.i3 figure, a.b {
    margin-top:21px
}

.i3 span {
    color:#e0d4d4;
    font-weight:300;
    font-size:18px
}

.small-text, .thin strong, .thin2 strong {
    font-weight:600
}

.i3 figure img {
    border-radius:50%
}

.gap {
    gap:2em
}

.small-gap {
    gap:1em
}

.small-text {
    font-size:30px;
    color:#232323
}

.extra-small-text {
    font-size: 20px;
    color: #232323;
    text-decoration: none; 
}


.extra-small-text:hover {
    text-decoration: none; 
}
.big-gap {
    gap:5em
}

.thin-text {
    font-weight:400;
    color:#262626;
    font-size:38px;
    line-height:50px
}

.big-text {
    font-size:20px;
    line-height:35px
}

.thin, .thin2 {
    font-weight:300
}

.thin2 strong {
    font-size:50px
}

#cont .three-col strong a {
    font-size:30px;
    font-weight:400;
    color:#000
}


.titlewrap h2 strong {
    background:linear-gradient(to right, #975ade, #af63d2, #d473c0, #ef7da7, #e6686f);
    -webkit-background-clip:text
}

.titlewrap h2 span1 {
    font-weight:600;
    color:#1a1a1a;
    line-height:normal
}

.titlewrap h3 {
    line-height:50px;
    font-size:40px
}

.titlewrap h3 strong {
    color:#000
}

.colorblue {
    flex:1 1 60%
}

.colorblue h4 {
    font-size:35px;
    font-weight:400
}

.colorblue strong {
    flex:1 1 65%;
    color:#0038e3;
    font-weight:600
}

.two-col.normalize .i3 section {
    border:none;
    margin-top:0;
    padding:0
}

.bg01 {
    background-image:url(../images/animation-production.png);
    background-position:left bottom
}
.bg02 {
    background-image:url(../images/2d-3d-animation-services.png);
    background-position:left bottom
}

.bg-4 {
    background-image:url(../images/apartment-design-3d-visualization.jpg);
    background-position:center center;
    padding:0 2%
}

.midtextbox {
    width:100%;
    max-width:500px;
    padding:3em;
    background-color:#fff
}

.midtextbox strong {
    color:#000;
    font-weight:400;
    display:block;
    margin-bottom:11px
}

.bg-gray {
    background-color:#fafafa;
    padding-top:5%;
    background-position:left bottom
}

.bg-ornage {
    background-color:#ff9600
}

.bg-blue, .bg-dark-gray {
    background-color:#232323;
    color:#bcbcbc
}

.bg-blue {
    padding-right:5%
}

.bg-blue h2, .bg-blue h4, .bg-dark-gray h2, .faq2 h2, .faq2 h4, .form .subtitle4 a {
    color:#fff
}

.bg-black, .bg-faq {
    background-color:#000
}

.bg-black {
    color:#fff;
    width:100%;
    height:auto;
    display:inline-block;
    background-image:url(../images/bg-1.jpg);
    background-repeat:no-repeat;
    background-position:-5px -55px
}

.bg-faq, .globe {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover
}

.bg-faq {
    background-image:url(../images/faq.jpg);
    min-height:500px;
    padding:3%;
    color:#fff;
    flex:65%
}

.bg-faq:before {
    content:'';
    width:40%;
    height:100%;
    left:0;
    top:0;
    background:linear-gradient(224deg, #8205d5 10%, #2036e2 100%)
}

.subtitle-x:after, .subtitle-x:before, .subtitle:after, .subtitle:before {
    position:absolute;
    background-color:#ccc;
    bottom:50%;
    height:2px;
    width:50px
}

.bg-faq h2 {
    line-height:40px;
    padding-top:9%;
    z-index:1;
    max-width:340px;
    font-size:35px;
    font-weight:500
}

.bg-walkthrough {
    background-image:url(../images/architectural-3d-walkthroughs.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    min-height:600px
}

.building-story {
    background-image:url(../architectural/images/architectural-3d-rendering-services.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    min-height:500px
}


.deepblue {
    background-color:#0038e3;
    color:#c4cbd2;
    padding:3em
}

.deepblue h3 {
    color:#fff;
    font-size:30px
}

.bg-build {
    background-color:#272727;
    color:#b2b2b2
}

.bg-build span {
    width:100%;
    float:left
}

.bg-faq i {
    z-index:1;
    font-size:30px
}

.bg-1 {
    background-color:#f7f7f7
}

.globe {
    background-color:#0a0114;
    background-image:url(../images/testimon.jpg);
    color:#aaa;
    padding-top:7%;
    padding-bottom:9%
}

.footer {
    background-color:#16181c;
    color:#aaa;
    font-size:15px;
    line-height:25px
}

.testimonial-wrap {
    width:40%
}
.testi-name {
  font-size: 1.9rem;
  font-weight: 600;
}

/* Mobile / small screens */
@media (max-width: 768px) {
  .testi-name {
    font-size: 1.4rem; /* adjust to your liking */
  }
}
.faq-q {
  font-size: 1.4rem;
  font-weight: 600;
  color:#cab8d8
}

/* Mobile / small screens */

@media (max-width: 768px) {
  .faq-q {
    font-size: 1.2rem; /* adjust to your liking */
	color:#cab8d8
  }
}

.b-block {
    width:50%;
    float:left;
    padding-left:10%;
    padding-top:10%
}

.subtitle, .subtitle-x, .subtitle2 {
    padding:0;
    position:relative;
    line-height:normal
}

.reelblock {
    width:50%;
    float:left;
    position:relative
}
.lSPager li a {
    display: inline-block;
    padding: 5px;
    min-width: 2px;
    min-height: 2px;
    pointer-events: none;
    cursor: default;
}

.lSPager li {
    margin: 0 4px;
}

.b-block h2 {
    font-size:39px;
    line-height:45px;
    font-weight:400
}

.subtitle, .subtitle-x {
    font-size:20px;
    margin-left:80px;
    margin-bottom:11px;
    font-weight:600;
    color:#1760e8;
    background:linear-gradient(to right, #975ade, #af63d2, #d473c0, #ef7da7, #e6686f);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    display:inline-block
}

.service-cell:hover .num, .subtitle2 {
    font-weight:700
}

.banner, .form {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover
}

.heading2, .subtitle2, a.b {
    display:block
}

.subtitle-x:after, .subtitle:after {
    content:'';
    margin-left:20px
}

.subtitle-x:before, .subtitle:before {
    content:'';
    margin-left:-70px
}

.subtitle2:after, .subtitle2:before {
    bottom:50%;
    height:2px;
    width:100px;
    content:'';
    position:absolute;
    background-color:#fff
}

.subtitle2 {
    font-size:45px;
    color:#fff;
    margin:0 0 55px
}

.subtitle2:after {
    margin-left:20px
}

.subtitle2:before {
    margin-left:-120px
}

.subtitle3 {
    font-size:21px;
    margin-bottom:11px;
    font-weight:600
}

.subtitle4 {
    font-size:18px;
    font-weight:300;
    color:#232222
}

.subtitle4 a {
    color:#272525
}

.col30 section a.d, a:hover {
    text-decoration:underline
}

.col30 section a.tn, a:hover {
    text-decoration: underline; 
    text-underline-offset: 4px; 
}

.heading1, .heading2 strong, .heading3 strong {
    color:#d7aa80
}

.subtitle4 a:hover {
    color:#5b5a5a
}

.heading1 {
    font-weight:600;
    font-size:2.2vw
}

.heading2, .heading3 {
    font-size:1.6vw;
    color:#fff;
    font-weight:500
}

.heading2 {
    background-image:url(../images/trans-logo.png);
    background-repeat:no-repeat;
    padding-left:120px;
    min-height:65px;
    line-height:35px
}

.heading3 {
    width:100%
}

.banner {
    width:100%;
    height:100vh;
    position:relative;
    background-image:url(../images/animation-studio-india.webp);
    z-index:0
}

.banner:after {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    content:'';
    z-index:2;
    background-color:#0f1768;
    opacity:.5
}

.banner:before, .form:before, .works .p-box:before {
    left:0;
    width:100%;
    height:50%;
    content:'';
    position:absolute
}

.banner:before, .form:before {
    top:0;
    z-index:3;
    background:linear-gradient(180deg, rgba(0, 0, 0, .8) 0, rgba(0, 0, 0, 0) 56%)
}

#myVideo {
    width:100%;
    height:100vh;
    object-fit:cover
}

#myVideo2 {
    width:100%;
    height:auto
}

.works {
    padding-left:5%;
    padding-right:5%;
    background-color:#f4f3f5
}

.works .p-box {
    height:400px
}

.works .p-box:before {
    bottom:0;
    background:-webkit-linear-gradient(rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, .5) 100%);
    background:-o-linear-gradient(rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, .5) 100%);
    background:linear-gradient(rgba(255, 255, 255, 0) 0, rgba(0, 0, 0, .5) 100%);
    z-index:1
}

#rednder3d .p-box .p-box-text, .works .p-box .p-box-text {
    opacity:1;
    transition:311ms
}

#rednder3d .p-box .play-btn:after, .works .p-box .play-btn:after {
    background-image:url(../images/popup.png);
    background-repeat:no-repeat
}

#rednder3d .p-box {
    flex:27%;
    height:380px
}

#portfolio .p-box {
    height:280px
}

#portfolio .p-box .title {
    font-size:18px;
    color:#fff
}

.arrow-btn {
    position:absolute;
    width:50px;
    height:50px;
    border-radius:50%;
    z-index:3;
    top:50%;
    margin-top:-25px;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    left:50%;
    margin-left:-25px;
    background-color:#0481e8;
    background-image:url(../images/right-1.png);
    background-repeat:no-repeat;
    background-position:center center
}

.banner2, .form {
    z-index:0;
    padding-bottom:3em;
    width:100%;
    position:relative
}

.arrow-btn:hover {
    background-color:#0038e3
}

.banner2 .p-box, a.b:hover {
    background-color:transparent
}

.p-box:hover .arrow-btn {
    opacity:1;
    transition:222ms ease-in
}

.form {
    background-image:url("../images/form.jpg");
    background-attachment:fixed;
    min-height:50vh
}

.form .banner-text {
    top:45%
}

.banner2 {
    height:auto;
    background-image:linear-gradient(to right top, #8ea6ff, #d3ddf1, #b1c1f0, #a2c0f9, #809dd6)
}

.banner2 .banner-text {
    max-width:100%;
    position:relative;
    padding-top:15%
}

.banner2 .banner-text h1, .banner2 .banner-text span {
    color:#111010
}

.banner2 .banner-text h2 {
    color:#313132
}

.banner2 .p-box {
    height:550px;
    margin-top:-50px
}

.banner2:before, .wrap-bulding-st:before {
    height:50%;
    position:absolute;
    left:0;
    top:0;
    content:''
}

.banner2 .p-box img {
    height:auto;
    object-fit:none;
    opacity:1;
    position:static
}

.banner2 .p-box .play-btn {
    opacity:1;
    margin-top:-50px
}

.banner2 .p-box:hover img {
    transform:scale(1)
}

.banner2:before {
    width:100%;
    z-index:3;
    background:linear-gradient(0deg, rgba(5, 0, 0, 0) 35%, rgba(8, 0, 0, .46) 100%)
}

.n-wrap {
    width:100%;
    position:absolute;
    z-index:999999;
    padding-top:30px;
    top:.1px
}

.book {
    margin-left:5%
}

#menu, .titlewrap {
    margin-left:auto
}

.clients {
    justify-content:space-between
}

.clients img {
    width:225px;
    height:auto;
    border:1px solid #ccc;
    padding:1em 2em;
    border-radius:0;
    filter:grayscale(1)
}

a.b, a.c {
    text-align:center;
    padding:11px 0
}

.clients img:hover {
    filter:grayscale(0)
}

a {
    line-height:normal;
    color:#2946b4
}

a.b {
    color:#020202;
    width:150px;
    border-radius:25px;
    background-color:#fff;
    border:2px solid rgba(255, 248, 248, 0);
    font-size:15px
}

a.c, a.e {
    display:inline-block
}

.faq2, a.f {
    background-color:#232323
}

a.b:hover {
    border:2px solid #fff;
    color:#fff
}

a.c {
    color:#fff;
    border:2px solid #ff9e00;
    margin-top:33px;
    width:220px;
    border-radius:25px
}

.logo, a.bb {
    width:150px
}

a.c:hover {
    background-color:#ff9e00
}

a.c.linkcolor {
    color:#000;
    margin-top:-20px
}

a.c:hover.linkcolor {
    color:#fff
}

a.d {
    color:#020202;
    font-weight:500;
	text-decoration:none;
	border-bottom:2px solid #676767
}
a.uline {
	text-decoration:none;
	border-bottom:2px solid #ef86ff
}

a.bb, a.e, a.f {
    color:#fff
}

#back-top a:hover, .blogcell a, .service-cell .link a, a.bb:hover, a.bc:hover, a.e:hover, a.f:hover {
    text-decoration:none
}

a.d:hover {
    color:#124283
}

a.e {
    border-bottom:1px solid #fff;
    padding-bottom:7px;
    margin-top:36px;
    font-size:16px
}

a.bb, a.bc {
    display:inline-block;
    margin-top:21px;
    font-size:15px;
    font-weight:500;
    text-align:center
}

a.e:hover {
    color:#a4aab1
}

a.f {
    padding:11px 31px;
    float:right;
    border:2px solid #242424
}

a.f:hover {
    color:#242424;
    background-color:#fff
}

a.f i {
    margin-right:0;
    position:relative;
    right:-11px
}

a.bb {
    padding:11px 0;
    border-radius:25px;
    background:linear-gradient(224deg, #f472aa 5%, #ad71ef 85%)
}

a.bb:hover {
    background-color:transparent;
    background:linear-gradient(72deg, #f472aa 0, #ad71ef 100%)
}

.two-col.trust figure, .two-col.trust span {
    background-color:#e5fcf7;
    width:280px;
    height:280px;
    border-radius:50%
}

.play-btn:after, .two-col.trust figure {
    background-repeat:no-repeat;
    background-position:center center
}

a.bc {
    color:#242424;
    margin-left:2em;
    padding:5px 0;
    border-bottom:2px solid #676767
}

.footercell section, .social {
    border-bottom:1px solid rgba(255, 255, 255, .2)
}

a.bc:hover {
    color:#8d43ca
}

.col30 section a.tn {
    font-size:12px;
    color:#000;
    display:block
}

.col30 section a.tn:hover {
    color:#595959
}

#menu {
    width:auto;
    padding-left:2%
}

.logo {
    margin-right:30px
}

.banner-text {
    top:35%;
    position:absolute;
    z-index:3;
    width:100%;
    max-width:55%;
    color:#fff
}

.banner-text h1 {
    font-size:50px;
    color:#fff;
    margin-bottom:11px;
    line-height:58px;
    font-weight:700
}

.banner-text h2 {
    font-size:30px;
    color:#fff;
    margin-bottom:11px;
    line-height:40px;
    font-weight:500
}

.banner-text span {
    font-size:16px;
    line-height:29px;
    font-weight:300;
    margin-bottom:11px;
    display:block
}

.wrap {
    width:100%;
    padding-top:7%;
    padding-bottom:7%
}

.faq2 {
    color:#bcbcbc;
    padding:0 0 0 5%
}

.faq2 .faq {
    padding-left:0;
    padding-right:3em
}

.bg-f-q {
    background-color:#f3f2f2;
    padding:3em;
    color:#282828;
    flex:43%
}

.bg-f-q h4 {
    color:#151515
}

.p-box, .service-cell:hover .head a, .service-cell:hover .link a, .wrap-bulding-st h3 strong {
    color:#fff
}

.wrap-bulding-st {
    width:100%;
    padding-top:7%;
    padding-bottom:0;
    position:relative;
    min-height:700px
}

.wrap-bulding-st:before {
    width:100%;
    background-color:#54477f;
    z-index:-1
}

.wrap-bulding-st h3 {
    color:#fff;
    font-weight:400
}

.subtitle-link {
    font-size:25px;
    max-width:70%;
    border-left:5px solid #cd9452;
    padding-left:1em
}

.subtitle-link a {
    color:#000;
    font-weight:400
}

.titlewrap {
    width:100%;
    text-align:center;
    max-width:700px;
    margin-right:auto
}

.n-wrap.fixed {
    position:fixed;
    left:0;
    top:0;
    box-shadow:0 11px 31px -11px #3b384b;
    padding-top:2px;
    padding-bottom:2px;
    height:auto;
    background-color:#1d1d1d;
    z-index:99
}

.n-wrap.fixed .book {
    margin-top:2px
}

.n-wrap.fixed .logo {
    width:110px;
    margin-top:11px
}

@keyframes pulse {
    0% {
        box-shadow:0 0 0 0 rgba(255, 255, 255, .6)
    }

    80% {
        box-shadow:0 0 2px 22px rgba(0, 204, 102, 0)
    }

}

.trust {
    padding-top:4%;
    padding-left:2%
}

.two-col.trust figure {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    font-size:180px;
    font-weight:800;
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-image:url(../images/text-bg.jpg)
}

.two-col.trust figcaption {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    flex:1 1 20%;
    font-size:30px;
    line-height:35px;
    align-content:center;
    padding-left:1em
}

.two-col.trust figcaption strong {
    font-weight:800;
    display:block;
    color:#0b0b0b
}

.p-box {
    flex:1 1 22%;
    position:relative;
    height:470px;
    background-color:#000;
    display:flex;
    justify-content:center
}

.p-box img {
    width:100%;
    height:100%;
    transition:922ms ease-out;
    vertical-align:top;
    position:absolute;
    z-index:0;
    left:0;
    top:0;
    object-fit:cover;
    opacity:.7
}

.service-cell img, .show-reel img {
    height:100%;
    transition:522ms ease-out;
    z-index:0;
    object-fit:cover;
    vertical-align:top
}

.p-box .title {
    position:relative;
    z-index:3;
    font-weight:600;
    font-size:25px;
    margin-top:40px;
    color:rgba(255, 255, 255, .7)
}

.p-box-text, .play-btn, .play-btn:after, .show-reel img {
    position:absolute
}

.service-cell:hover, .show-reel {
    color:#fff;
    background-color:#000
}

.p-box-text {
    z-index:3;
    text-align:center;
    bottom:11%;
    opacity:0;
    font-size:16px
}

.p-box:hover .p-box-text {
    opacity:1;
    transition:522ms;
    bottom:14%
}

.p-box h3 {
    font-size:25px;
    display:block;
    font-weight:500;
    padding-bottom:0;
    margin-bottom:0;
    color:#f5f5f5
}

.blogcell a, .head a {
    color:#242424
}

.play-btn {
    width:70px;
    height:70px;
    border-radius:50%;
    z-index:3;
    top:50%;
    margin-top:-35px;
    display:flex;
    align-items:center;
    justify-content:center;
    opacity:0;
    left:50%;
    margin-left:-35px;
    background-image:linear-gradient(to right top, rgba(183, 131, 255, .95), rgba(227, 123, 224, .95), rgba(250, 124, 193, .95), rgba(255, 133, 166, .95), rgba(255, 147, 147, .95))
}

.b-pic, .service-cell, .show-reel {
    overflow:hidden;
    border-radius:0
}

.play-btn:after {
    content:'';
    background-image:url(../images/play.svg);
    width:30px;
    height:30px;
    margin-right:-3px
}

.p-box:hover .play-btn {
    opacity:1;
    transition:222ms ease-in
}

.show-reel {
    width:95%;
    position:relative;
    height:300px;
    display:flex;
    justify-content:center;
    margin-top:50px
}

.show-reel .play-btn {
    opacity:1
}

.show-reel img {
    width:100%;
    left:0;
    top:0;
    opacity:.7
}

.neg {
    margin-bottom:-5px
}

.service-cell {
    flex:1 1 30%;
    color:#595959;
    position:relative;
    min-height:380px;
    background-color:#fff;
    display:flex;
    justify-content:center
}

.service-cell:hover {
    transition:822ms
}

.service-cell img {
    width:100%;
    position:absolute;
    left:0;
    top:0;
    opacity:0
}

.service-cell:hover img {
    transform:scale(1);
    opacity:.7
}

.service-text {
    position:absolute;
    left:0;
    top:0;
    padding:2.8em;
    z-index:2;
    font-size:16px;
    line-height:27px
}

.service-cell .num {
    margin-bottom:31px;
    transition:222ms
}

.service-cell .head {
    font-weight:600;
    font-size:29px;
    margin-bottom:21px
}
.head a,
.head a:hover {
    text-decoration: none !important;
}

.service-cell .text {
    min-height:100px;
    line-height:27px
}

.service-cell .link {
    border-top:1px solid #ccc;
    padding-top:21px;
    position:relative
}

.service-cell .link a {
    color:#000;
    display:block
}

.blogcell a:hover h2 {
    color:#005aaf
}

.b-pic {
    margin-bottom:10px
}

.b-pic img {
    width:100%;
    height:auto;
    transition:422ms;
    vertical-align:top
}

.b-text h2 {
    font-size:18px;
    line-height:30px
}

#back-top a, .social i {
    text-align:center;
    line-height:normal
}

.b-text span {
    font-size:15px;
    padding:16px 0;
    display:block;
    color:#000
}

.blogcell:hover img {
    transform:scale(1.1)
}

.footercell {
    flex:1 1 20%;
    margin-bottom:25px
}

.footercell section {
    padding-bottom:21px;
    margin-bottom:11px;
    padding-top:9px;
    float:left;
    width:100%
}

.footercell section img {
    float:left;
    margin-right:21px;
    width:50px;
    height:auto;
    margin-bottom:20px
}

.footercell section:last-child {
    border:none
}

.footercell:first-child {
    flex:1 1 25%
}

.footercell:nth-child(2) {
    padding-left:3em
}

.f-logo {
    margin-bottom:11px
}

.footercell strong {
    font-weight:600;
    display:block;
    margin-bottom:21px;
    color:#fff
}

.credit a, .footercell a, a.subsribe {
    display:inline-block
}

.footercell a {
    padding:5px 0;
    color:#898989
}

.credit a:hover, .footercell a:hover {
    color:#fff;
    text-decoration:none
}

.footercell i {
    color:#fff;
    margin-right:5px
}

.footercell section span {
    display:block;
    font-size:21px;
    color:#daa520
}

.social {
    padding:10px 0;
    margin-bottom:21px;
    margin-top:21px;
    border-top:1px solid rgba(255, 255, 255, .2)
}

.social i {
    border-radius:50%;
    color:#302c42;
    padding-top:5px;
    height:30px;
    width:30px;
    transition:232ms;
    font-size:18px;
    background-color:#fff;
    margin-right:15px
}

.social i:hover {
    color:#fff;
    background-color:#0e0c17;
    transform:rotate(360deg)
}

.credit {
    width:100%;
    border-top:1px solid rgba(248, 248, 248, .1);
    padding-top:30px
}

.credit .two-col:last-child {
    text-align:right
}

.credit a {
    color:#9799a2;
    margin-left:21px
}

.footercell .free.y1 {
    font-weight:600;
    color:#fff
}

.footercell .free.y2 {
    background:linear-gradient(to right, #975ade, #af63d2, #d473c0, #ef7da7, #e6686f);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent
}

a.subsribe {
    background-color:#e70d0d;
    border-radius:5px;
    padding:11px 21px;
    color:#fff;
    margin-top:11px;
    font-weight:500
}

#back-top a, .whatsapp i {
    border-radius:50%;
    color:#fff
}

#back-top {
    position:fixed;
    bottom:7px;
    right:7px;
    float:right;
    z-index:9
}

#back-top a {
    display:block;
    -webkit-transition:1s;
    -moz-transition:1s;
    transition:1s;
    background-color:#797979;
    font-size:21px;
    padding:9px 11px
}

#back-top a:hover {
    background-color:#000
}

.whatsapp {
    position:fixed;
    z-index:9999;
    bottom:7%;
    right:5px
}

.whatsapp i {
    font-size:30px;
    background-color:#4dc33b;
    padding:7px 9px
}

.whatsapp:hover i {
    color:#4dc33b;
    background-color:#fff
}

@media screen and (max-width:1600px) {
    .banner-text {
        max-width:65%
    }

}

@media screen and (max-width:1440px) {
    .p-box {
        height:350px
    }

    .reel-cell .play-btn {
        left:14%
    }

}

@media screen and (max-width:1380px) {
    .banner-text h1 {
        font-size:45px;
        line-height:55px
    }

}

@media screen and (max-width:1024px) {
    .fixwrap, .padmain {
        padding-left:3%;
        padding-right:3%
    }

    .p-box {
        flex:1 1 30%
    }

    .thin-text {
        font-size:30px;
        line-height:normal
    }

    .service-cell {
        flex:1 1 35%;
        min-width:222px
    }

    .clients img {
        width:180px
    }

    .banner2 .two-col, .bg-faq {
        flex:100%
    }

    .footercell:nth-child(2) {
        padding-left:2%
    }

    .bg-blue {
        padding-right:0
    }

    .pad-left {
        padding-right:3em
    }

    .banner-text {
        max-width:100%;
        padding-left:15%;
        padding-right:15%;
        text-align:center;
        left:0
    }

    .banner2 .banner-text {
        text-align:left
    }

    .banner-text h1 {
        font-size:5vw;
        line-height:6vw
    }

    .subtitle {
        margin-left:0
    }

    a.b {
        display:inline-block
    }

    .two-col.trust figcaption {
        font-size:40px;
        line-height:45px
    }

    .testimonial-wrap {
        width:85%
    }

    .banner2 {
        height:90vh
    }

    .banner2 .p-box {
        margin-top:11px
    }

}

@media screen and (max-width:820px) {
    .b-block, .reelblock, .show-reel {
        width:100%
    }

    .p-box {
        flex:45%
    }

    .book {
        margin-right:15%
    }

    .p-box-text, .play-btn {
        opacity:1
    }

    .footercell:nth-child(2), .pad-left-small {
        padding-left:0
    }

    .banner2 {
        height:100vh
    }

    .banner2 .banner-text {
        padding-left:2%;
        padding-right:2%
    }

    .four-col {
        flex:48%
    }

    .i1, .i2, .i3 {
        flex:100%;
        min-height:300px
    }

    .i2 .p-box {
        height:500px
    }

    .col60, .three-col {
        flex:100%
    }

    .faq {
        padding-left:3em;
        padding-right:3em
    }

    .bg-f-q.two-col {
        flex:100%;
        margin-bottom:5%
    }

    .faq2 .faq {
        padding-left:2em;
        padding-right:2em
    }

    .faq2 {
        padding-right:5%
    }

    #rednder3d .p-box {
        flex:45%;
        min-width:222px
    }

    .col40 {
        height:auto
    }

    .mob-cent {
        text-align:center
    }

    .float-right {
        float:none
    }

    .subm span, .subm span:last-child {
        flex:100%;
        text-align:center
    }

    .subm span:nth-child(2) {
        text-align:center;
        line-height:55px
    }

    .bg-walkthrough {
        min-height:500px;
        background-position:center center
    }

}

@media screen and (max-width:500px) {
    body {
        font-size:16.5px;
        line-height:28px
    }

    .two-col {
        margin-bottom:30px
    }

    .service-text {
        padding:1.8em
    }

    .service-cell {
        min-height:320px
    }

    .m-left, .titlewrap.w, .two-col section {
        text-align:left
    }

    .b-block, .credit, .two-col.c, h5 {
        text-align:center
    }

    #back-top {
        right:-100px
    }

    h2 {
        font-size:26px
    }

    #cont .three-col strong a, .midtextbox h3, .p-box .title, h4 {
        font-size:20px
    }

    .small-text, h5 {
        font-size:21px
    }

    .col30 {
        margin-top:50px
    }

    .small-text, .wrap-bulding-st h3 {
        margin-top:30px
    }

    .col30 section a, .two-col section strong {
        font-size:18px
    }

    .titlewrap h3, .titlewrap h3 strong, h3 {
        font-size:22px
    }

    .wrap {
        padding-top:15%;
        padding-bottom:10%
    }

    .bg-f-q {
        padding:1.5em
    }

    .trust {
        display:flex;
        justify-content:center
    }

    .two-col.trust figure {
        background-color:#e5fcf7;
        width:180px;
        height:180px;
        font-size:100px
    }

    .two-col.trust figcaption {
        padding:0 0 0 1em;
        font-size:25px;
        line-height:30px
    }

    .two-col.trust span {
        width:180px;
        height:180px;
        border-radius:50%
    }

    .titlewrap h3 {
        line-height:30px;
        margin-bottom:40px
    }

    .footercell, .p-box {
        flex:100%
    }

    .p-box h3 {
        font-size:21px
    }

    .works .p-box {
        height:350px
    }

    #rednder3d .p-box {
        height:320px
    }

    .b-block h2 {
        font-size:25px;
        line-height:normal
    }

    .b-block {
        padding:2em
    }

    .big-gap, .gap {
        gap:1em
    }

    .globe {
        padding-top:15%;
        padding-bottom:20%
    }

    .clients img {
        width:47%;
        padding:9px
    }

    .book {
        display:none
    }

    .banner-text {
        width:100%;
        max-width:100%;
        padding-left:5%;
        padding-right:5%
    }

    .banner-text h1 {
        font-size:7vw;
        line-height:8vw
    }

    .banner-text h2 {
        font-size:5vw;
        line-height:6vw
    }

    .logo {
        margin-left:0.2em
    }

    .bg-faq:before {
        width:100%;
        height:50%
    }

    .bg-faq h2 {
        max-width:100%;
        font-size:30px
    }

    .margin-top {
        margin-top:9%
    }

    a.f {
        float:none
    }

    .faq {
        padding:2em
    }

    .credit .two-col:last-child {
        text-align:center;
        margin-top:11px
    }

    .credit a {
        margin-left:9px;
        margin-right:9px
    }

    .bg-blue h4 {
        font-size:30px;
        margin-bottom:50px;
        text-align:left
    }

    .bg-f-q.two-col, .building-story, .faq2 .faq, .i3 h5 {
        margin-bottom:0
    }

    .banner2 .banner-text {
        padding-top:35%
    }

    .banner2 {
        height:auto
    }

    .banner2 .p-box {
        margin-top:0;
        height:400px
    }

    .banner2 .p-box img {
        height:auto;
        object-fit:contain
    }

    .subtitle-link {
        font-size:20px;
        max-width:100%
    }

    .aligncenter-m, .m-left2 {
        text-align:left;
        padding-left:10%
    }

    .i3 h5 {
        text-align:left;
        font-size:20px
    }

    .colorblue h4, .smltext {
        font-size:25px
    }

    .i3 {
        padding-top:50px;
        padding-bottom:50px
    }

    .i1 {
        padding:3em
    }

    .colorblue h4 {
        text-align:center
    }

    .banner2:before {
        height:25%
    }

    .faq2 {
        padding:0
    }

    .bg-f-q.two-col {
        padding:50px 2em
    }

    .sep {
        column-count:1
    }

    #cont .three-col {
        font-size:12px;
        line-height:20px;
        margin-bottom:21px
    }

    .t-v {
        height:230px
    }

    .faq2 .faq {
        padding-top:70px
    }

    .form .banner-text {
        text-align:left;
        top:auto;
        bottom:10%;
        padding-left:10%
    }

    .subtitle4 {
        font-size:13px
    }

}

@media screen and (max-width:412px) {
    .two-col.trust figcaption {
        font-size:20px;
        line-height:25px
    }

    h2 {
        font-size:22px
    }

}

@media screen and (max-width:1190px) and (orientation:landscape) {
    .book {
        margin-right:10%
    }

    .p-box {
        flex:30%
    }

    .banner {
        height:130vh
    }

    .banner-text {
        max-width:60%;
        top:25%;
        text-align:left
    }

    .banner-text h1 {
        font-size:4vw;
        line-height:normal
    }

    .banner-text h2 {
        font-size:2.5vw;
        line-height:normal
    }

    .subtitle {
        margin-left:14%
    }

    .banner2 {
        height:auto;
        min-height:1100px
    }

    #myVideo {
        width:100%;
        height:100%
    }

    .clients img {
        width:170px;
        padding:9px
    }

    .fixwrap, .padmain {
        padding-left:3%;
        padding-right:3%
    }

}
