@media only screen and (min-width:1921px) { }
@media only screen and (min-width:1681px) {
    .container { max-width: 1536px; }
}
@media only screen and (max-width:1800px) {
    h1, .th1, h2 { font-size: 80px; }
    .t200 { font-size: 170px; }
    .maskimgvid { min-height: 720px; }
    .pb-300 { padding-bottom: 250px; }
    .mb-300 { margin-bottom: 250px; }
    .thankyoupage { padding: 200px 0px; }
    .theflowsection h2 { font-size: 200px; }
    .contactinfo-address-left { width: 65%; }
    .contactinfo-address-right { width: 35%; }
    .topoffset { margin-top: 200px; }
}
@media only screen and (max-width:1600px) {
    body { font-size: 20px; line-height: 30px; }
    .t200 { font-size: 150px; }
    .t150 { font-size: 110px; }
    h1, .th1, h2 { font-size: 80px; }
    h3, .th3 { font-size: 48px; }
    h4, .th4{font-size: 26px;}
    h5, .th5 { font-size: 20px; }
    .t50 { font-size: 40px; }
    .t40 { font-size: 30px; line-height: 1.4; }
    .mb-100 { margin-bottom: 70px; }
    .mb-300 { margin-bottom: 150px; }
    .pb-300 { padding-bottom: 150px; }
    .pt-300 { padding-top: 150px; }
    .mb-200 { margin-bottom: 120px; }
    .mt-70 { margin-top: 50px; }
    .mb-80 { margin-bottom: 50px; }
    .mt-100 {margin-top: 50px;}
    .mb-150 {margin-bottom: 100px;}
    .left-padding { padding-left: calc(((100% - 1320px) - 24px) / 2); }
    .right-padding { padding-right: calc(((100% - 1320px) - 24px) / 2); }
}
@media only screen and (max-width:1440px) {
    .hero-home-banner { padding-bottom: 150px; padding-top: 150px; }
    .hero-home-banner .mb-70 { margin-bottom: 30px; }
    .textelementbg p { margin-bottom: 30px; }
    .theflowsection h2 { font-size: 120px; }
    .proapelement h3 { font-size: 36px; }
    .textLineWrapper { margin-bottom: 50px; }
    .arwtitle::after { width: 50px; height: 50px; }
    .footervector  img { width: 55%; }
    .titisticky { padding-bottom: 350px; }
    .approcmain { margin-top: -350px; }
    .proapelement p { right: 0px; margin-left: 0px; padding-left: 30px; }
    .prodesck .btn-theme { margin-left: 30px; }
    .colfooter { margin-bottom: 100px; }
    .socialicon { margin-top: 20px; }
    .topoffset { margin-top: 180px; }
    .contactinfo-address-left span, .contactinfo-num span { padding-right: 10px; }
    .blogListmain .row:nth-child(even) .blog-box:first-child{margin-top: 70px}
    .blog-box{margin-bottom: 70px;}
    .blogListmain .row:nth-child(even) .blog-box:first-child .blogimg{min-height:526px;}
    .category-list ul li, .category-list ul li:before{margin-right: 10px}
    .category-list ul li a, .category-list ul li:before{font-size: 36px;}
    .category-list ul{margin-bottom: 70px;}
    .blogdetailcontent h1{font-size: 50px;}
    .blogdetailcontent h2{font-size: 45px;}
    .blogdetailcontent h3{font-size: 36px;}
    .blogdetailcontent h4{font-size: 30px;}
    .blogdetailcontent h5{font-size: 24px;}
    .prjimgitem:last-child {margin-right: 120px;}
    .stickyhrwrapper{top: 100px;}
    .prjimgitem img{max-width: 520px;max-height: 520px;}
}
@media only screen and (max-width:1366px) {
    .maskimgvid { min-height: 630px; top: 13vh; }
    .left-padding { padding-left: calc(((100% - 1110px) - 24px) / 2); }
    .right-padding { padding-right: calc(((100% - 1110px) - 24px) / 2); }
    .blogListmain .row:nth-child(even) .blog-box:first-child .blogimg{min-height:451px;}
    .blogdetailcontent {padding-right: 110px;}
}
@media only screen and (max-width:1280px) { }
@media only screen and (max-width:1200px) {
    .left-padding { padding-left: calc(((100% - 940px) - 24px) / 2); }
    .mb-100 { margin-bottom: 50px; }
    .pb-300 { padding-bottom: 100px; }
    .pt-300 { padding-top: 100px; }
    .mb-300 { margin-bottom: 100px; }
    .mb-200 { margin-bottom: 70px; }
    .mb-150 { margin-bottom: 80px; }
    .mb-50 { margin-bottom: 30px; }
    .t200 { font-size: 100px; line-height: 1.2; }
    .t150 { font-size: 75px; }
    .t36 { font-size: 24px; letter-spacing: 0px; line-height: 30px; }
    .t30 { font-size: 20px; }
    .t40 { font-size: 24px; line-height: 36px; }
    .t50 { font-size: 36px; }
    h1, .th1, h2 { font-size: 50px; letter-spacing: 0px; }
    h3, .th3 { font-size: 45px; }
    h4, .th4 { font-size: 24px; }
    header .logo, .mainheader.sticky .logo { padding: 15px 0px; }
    .navbtn { display: inline-flex; width: 40px; height: 40px; padding: 9px; }
    .mainheader.sticky .navbtn, .innerheader .navbtn { border-color: #4E5C5A; }
    .mainheader.sticky .icnline, .innerheader .icnline { background-color: #4E5C5A; }
    .navmenu { overflow: auto; border-radius: 0px; z-index: 50; padding: 70px 30px; position: fixed; overflow: auto; height: 100%; width: 400px; background: #fff; right: -100%; top: 0px; -webkit-transition: right 0.9s; -o-transition: right 0.9s; transition: right 0.9s; flex-wrap: wrap; align-items: flex-start; flex-direction: column; }
    .navmenu.slide { right: 0px; }
    .navmenu > ul { margin-right: 0px; display: inline-block; vertical-align: top; width: 100%; }
    .navmenu>ul>li { margin: 0px 0px 20px; padding: 0px; }
    .navmenu>ul>li a { font-size: 36px; color: #555; padding-bottom: 10px; display: inline-block; }
    .navmenu > ul  li  ul { position: relative; margin-left: 0px; background-color: transparent; padding: 0px; margin-top: 10px; box-shadow: none; }
    .navmenu > ul > li  ul  li  a { font-size: 20px; color: #4E5C5A; padding-bottom: 0px; }
    .navmenu > ul li ul li ul { padding: 20px 0px 0px 20px }
    .navmenu > ul li ul li ul li { position: relative; }
    .navmenu > ul li ul li { position: relative; margin-bottom: 10px; }
    .navmenu>ul>li:last-child, .navmenu > ul li ul li:last-child { margin-bottom: 0px; }
    .navmenu > ul > li > a:after { background-color: #4E5C5A; }
    .navmenu > ul > li:last-child { display: inline-block; }
    .navmenu > ul > li.menu-item-has-children { position: relative; }
    .sub-menu-arrow { position: absolute; right: 0px; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; }
    .navarrow { width: 13px; height: 10px; display: inline-block; }
    .navarrow::before { content: ''; width: 13px; height: 10px; display: inline-block; transition: all 0.2s ease; vertical-align: top; background: url(../images/menu-arrow-mobile.svg) no-repeat; background-position: center; left: 0; background-size: 13px; }
    .navarup::before { transform: rotate(180deg); }
    .closeBtn::before, .closeBtn::after { background-color: #4E5C5A; }
    .mainheader .closeBtn { display: inline-flex; }
    .mainheader .logo img { max-width: 120px; }
    .navmenu > ul > li:last-child >  a { padding: 0px 0px; }
    .rightcnthed { display: flex; }
    .hero-home-banner .btn-theme-white { z-index: 5; margin-bottom: 50px; }
    .subtext { margin-bottom: 30px; margin-top: 50px; }
    .bannerimg { top: -250px; }
    .maskimgvid { min-height: 520px; top: 15vh; }
    .hero-home-banner { padding-bottom: 100px; padding-top: 100px; }
    .proapelement p { right: 0px; margin-right: 0px; padding-left: 0px; }
    .proapelement h3 { font-size: 30px; letter-spacing: -1px; }
    .proapelement:nth-last-child(2) { margin-bottom: 40px; }
    .textLineWrapper { height: inherit; overflow: hidden; margin-bottom: 30px; }
    .textScale { transform: translateY(100px); }
    .textscalerow { margin-bottom: 100px; }
    .theflowtop, .theflowbottom, .theflowsection { height: inherit; }
    .fakeheight { display: none; }
    .theflowsection .split-line { transform: translateY(100px); }
    .theflowswrap { display: flex; flex-direction: column; }
    .theflowcenter { position: relative; top: 0px; transform: translateY(0px); order: 3; }
    .theflowsection h2 { font-size: 80px; margin-bottom: 0px; }
    .theflowtop { order: 1; }
    .theflowbottom { order: 2; margin-bottom: 30px; }
    .prodesck .btn-theme { margin-left: 0px; }
    .btn-theme-white, .btn-theme, .nextbtn { font-size: 20px; }
    .btn-theme-white::before, .btn-theme::before, .nextbtn::after { width: 36px; height: 36px; }
    .btn-theme-white span::after, .btn-theme span::after, .nextbtn span::after { bottom: -6px; }
    .btn-theme-white::before, .btn-theme::before{margin-right: 10px;}
    .nextbtn::after{margin-left: 10px;}
    .arwtitle::after { width: 40px; height: 40px; background-size: 12px; bottom: 5px; }
    .socialicon a { width: 40px; height: 40px; }
    .footerlink ul li a { font-size: 20px; }
    .mainfooter { padding: 70px 0px 0px; }
    .thankyoupage { padding: 150px 0px; }
    .theflowsection { position: relative; }
    .theflowcenter { flex-wrap: wrap; }
    .theflowcenterimg { margin-bottom: 50px; }
    .projectimgrow { padding-top: 0px; position: relative; }
    .prodslider .slick-arrow { width: 50px; height: 50px; }
    .prodslider .slick-prev { left: auto; right: -50px; }
    .prodslider .slick-next { left: auto; right: -110px; }
    .projectimgrow { clip-path: initial; }
    .proapelement h3 { transform: none; }
    .approcmain .h-spacer { display: none; }
    .proapelement { position: relative; top: 0px; margin-bottom: 0px; }
    .approcmain .slick-dots { bottom: 0px; }
    .mainfooter .btn-theme-white { font-size: 60px; }
    .mainfooter .btn-theme-white::before { width: 70px; height: 70px; background-size: 20px; }
    .copyright { font-size: 16px }
    .topoffset { margin-top: 100px; }
    .contactinfo-address-left { width: 100%; }
    .contactinfo-address-right { width: 100%; margin-bottom: 20px; }
    .contactinfo-num { flex-wrap: wrap; }
    .contactinfo-num p:last-child { margin-left: 0px; margin-top: 10px; }
    .contactinfo-num p { width: 100%; }
    .contactinfo-form.mb-150 { margin-bottom: 50px; }
    .form-control { padding: 0px 0px 10px; font-size: 20px; }
    .blogListmain .row:nth-child(even) .blog-box:first-child{margin-top: 50px}
    .blog-box{margin-bottom: 50px;}
    .blogListmain .row:nth-child(even) .blog-box:first-child .blogimg{min-height:376px;}
    .bltitlecol{margin-bottom: 30px;}
    .bloglisting-title.mb-100{margin-bottom: 50px}
    .category-list ul li a, .category-list ul li:before{font-size: 24px;}
    .category-list ul li{padding: 5px 0px;}
    .blogdetailcontent h1{font-size: 40px;}
    .blogdetailcontent h2{font-size: 36px;}
    .blogdetailcontent h3{font-size: 30px;}
    .blogdetailcontent h4{font-size: 24px;}
    .blogdetailcontent h5{font-size: 20px;}
    .blogdetailrow .datecol{font-size: 24px;}
    .protitlecat{transform: scale(0.6) translateY(150px); display: inline-block;}
    .projectcatimg {clip-path: inset(10%);}
    .protitlecat{font-size: 80px;}
    .projectlistsection{padding: 0px 43px;}
    .projectlistsection .row{margin: 0px -15px;}
    .projectlistsection .row [class*="col-"]{padding: 0px 15px;}
    .projectlistsection .row [class*="col-"]{margin-bottom: 50px;}
    .prjlistimg::before, .prodslider a::before{opacity: 1;background-color: rgba(78, 92, 90, 0.4);}
    .projectlistsection .btn-arrow, .prodslider .btn-arrow, .prjslider .btn-arrow{opacity: 1;margin-top: 0px;width: 50px;height: 50px;}
    .imghorizontal { display: flex;width: max-content;animation: scrollCol 20s linear infinite; -webkit-animation: scrollCol 20s linear infinite; will-change: transform; transform: translateZ(0);}
    .stickyhrwrapper {margin-left: 12px;}
    .h-spacer{display: none;}
    .prjimgitem img{max-height: 350px;max-width: 400px;}
    .btn-outline{padding: 20px;font-size: 20px;text-align: center;line-height: 1.2;}
    .btncatmarqee a {min-width: 250px;}
}
@media only screen and (max-width:992px) {
    .left-padding {padding-left: calc(((100% - 690px) - 24px) / 2);}
    .t200 { font-size: 80px; }
    .t50 { font-size: 30px; }
    .prodtitle { margin-bottom: 20px; justify-content: flex-start; align-items: flex-start; }
    .prodtitle br { display: none; }
    .mainfooter .th1 { font-size: 30px; }
    .arwtitle::after { width: 30px; height: 30px; background-size: 12px; bottom: 0; right: 60px; }
    .bannerimg .h-spacer { display: none; }
    .maskimgvid { min-height: initial; }
    .bannerimg { top: 0px; }
    .hero-home-banner .btn-theme-white { margin-bottom: 30px; }
    .subtext { margin-top: 0px; }
    .approcmain { margin-top: 0px; }
    .titisticky { padding-bottom: 0px; position: relative; top: 0px; }
    .item:last-child { margin-top: -20px; }
    .slimgcap h3 { font-size: 36px; }
    .approchrow .split-word { margin-right: 0px; }
    .projectright { width: 100%; }
    .protitle { width: 100%; padding-top: 0px; padding-right: 0px; padding-bottom: 20px; }
    .protitle .mb-50 { margin-bottom: 20px; }
    .pagenotfound img { width: 350px; }
    .footervector  img { width: 58%; margin-top: 30px; }
    .theflowsection h2 { font-size: 60px; }
    .mainfooter .btn-theme-white { font-size: 36px; }
    .mainfooter .btn-theme-white::before { width: 40px; height: 40px; background-size: 12px; }
    .copyright { font-size: 16px; margin-bottom: 30px; }
    .colfooter { margin-bottom: 50px; }
    .footervector { align-items: flex-end; }
    .socialicon { margin-top: 0px }
    .blogListmain .row:nth-child(even) .blog-box:first-child .blogimg {min-height: 336px;}
    .category-list{width: 80%;}
    .categorybtn{width: 21%;}
    .category-list ul{margin-bottom: 50px;}
    .blogdetailcontent{padding-right: 30px;}
    .protitlecat{font-size: 60px;}
    .protitlecat{transform: scale(0.7) translateY(100px); display: inline-block;}
    .projectItemcat:first-child{margin-top: -15%;}
    .projectItemcat:last-child{margin-bottom: 0px;}
    .projectItemcat{margin-top: -20%;margin-bottom: 150px;}
    .projectrotop{margin-bottom: 100px;}
    .projectlistsection{padding: 0px 30px;}
}
@media only screen and (max-width:767px) {
    .mainheader .logo img { max-width: 100px; }
    .mb-300 { margin-bottom: 60px; }
    .pb-300 { padding-bottom: 60px; }
    .container { padding: 0px 20px; }
    .t200 { font-size: 45px; line-height: 55px; }
    .t40 { font-size: 20px; line-height: 30px; }
    h1, .th1, h2 { font-size: 30px; margin-bottom: 20px; }
    h3, .th3 { font-size: 30px; }
    .hero-home-banner { padding-top: 100px; padding-bottom: 50px; }
    .maskimgvid { top: 0px; position: relative; width: 100%; }
    .image-wrap { margin-bottom: 20px; }
    .proapelement { margin-bottom: 0px; }
    .proapelement:nth-last-child(2) { margin-bottom: 0px; }
    .proapelement:nth-last-child(2):last-child p { margin-bottom: 0px; }
    .textLineWrapper { margin-bottom: 10px; }
    .textscalerow { margin-bottom: 60px; }
    .theflowsection h2 { font-size: 36px; }
    .colfooter { margin-bottom: 20px; }
    .arwtitle::after { right: 0px; top: 10px; bottom: auto; }
    .footerlink ul { display: flex; flex-wrap: wrap; }
    .footerlink ul li { width: 33.33%; }
    .footervector  img { display: none; }
    .cotactinfo:last-child { margin-bottom: 0px; }
    .navmenu { width: 100%; }
    .arwtitle { padding-right: 50px; }
    .mainheader .btn-theme-white { display: none; }
    .proapelement { text-align: center; }
    .prodtitle { align-items: center; text-align: center; }
    .prodtitle { margin-bottom: 15px; }
    .prodesck { align-items: center; margin-bottom: 40px; }
    .pagelogo { padding: 0px 20px; text-align: center; }
    .pagelogo img { max-height: 90px; }
    .textlinelogo {max-width: 325px;margin: 0 auto;}
    .proapelement h3 { font-size: 24px; }
    .theflowbottom { margin-bottom: 20px; }
    .arwtitle::after { width: 40px; height: 40px; }
    .copyright { font-size: 16px; }
    .thankyoupage { padding: 100px 0px 60px; }
    .cotactinfo i { margin-right: 15px; }
    .projectimgrow { padding: 0px 20px; }
    .slimgcap { padding: 20px; }
    .slimgcap h3 { font-size: 20px; }
    .scroll-container { height: 100vh; }
    .pagenotfound img { width: 250px; }
    .pagenotfound br { display: none; }
    .mainfooter .btn-theme-white { font-size: 55px; }
    .mainfooter .btn-theme-white::before { width: 70px; height: 70px; background-size: 16px;margin-right: 20px; }
    .socialicon { margin-top: 10px; }
    .topoffset { margin-top: 100px; }
    .contactinforow .row [class*="col-"]:first-child { margin-bottom: 20px; }
    .contactinforsticky { position: static; top: 0vh; }
    .mb-150 { margin-bottom: 40px; }
    .blogListmain .row:nth-child(even) .blog-box:first-child{margin-top: 0px}
    .blogimgcol{margin-bottom: 20px}
    .category-list{width: 100%;}
    .categorybtn{width: 100%;text-align: left;margin-bottom: 20px;}
    .categoryrow{flex-wrap: wrap;flex-direction: column-reverse;}
    .category-list ul {margin-bottom: 20px;}
    .category-list ul li a, .category-list ul li:before{font-size: 20px;}
    .blogdetailrow{padding: 0px 20px;}
    .blogdatsticky{padding-left: 0px;position: relative;top: 0px;margin-bottom: 20px;}
    .blogtitledetail{padding-left: 0px;margin-bottom: 20px;}
    .blogimg.mb-100{margin-bottom: 20px;}
    .blogdetailcontent h2 {font-size: 30px;letter-spacing: -1px;}
    .blogdetailcontent h3 {font-size: 24px;letter-spacing: -1px;}
    .blogdetailcontent h4 {font-size: 20px;letter-spacing: -1px;}
    .blogdetailcontent h5 {font-size: 18px;letter-spacing: -1px;}
    .blogdetailcontent{padding: 0px;}
    .protitlecat{transform: scale(0.8) translateY(30px);display: inline-block;}
    .protitlecat {font-size: 30px;margin-bottom: 20px;}
    .projectrotop {margin-bottom: 50px;}
    .projectItemcat{margin-bottom: 50px;}
    .projectItemcat:first-child {margin-top: -10%;}
    .projectItemcat{margin-top: -15%;}
    .projectrotop .mb-50{margin-bottom: 20px;}
    .blogdetailrow .container { padding: 0px; }
    .blogdetailnav{margin-top: 0px;padding-top: 30px;}
    .otherbloglist .blog-box:first-child { margin-bottom: 40px; }
    .projectlistsection{padding: 0px 20px;}
    .prolistintoprow .mb-100 { margin-bottom: 20px; }
    .prjlistimg {clip-path: inset(15%);}
    .projectlistsection .row [class*="col-"]{margin-bottom: 30px;}
    .projectdetailtop .mt-100{margin-top: 20px;margin-bottom: 30px;}
    .prjimgitem img {max-height: 250px;max-width: 200px}
    .projectdetailtop .row [class*="col-"]:first-child{margin-bottom: 20px;}
    .otherproject .mb-50{margin-bottom: 20px;}
    .btncatmarqee a {min-width: inherit;padding: 12px 30px;flex-shrink: 0;}
    .footerlink ul li {
    margin-bottom: 10px;
}
}

@media only screen and (max-width:580px) { }
@media only screen and (max-width:399px) {
    .pagelogo img { max-height: 80px; }
    h1, .th1, h2{font-size: 28px;}
}

/* animation keyframe css */
.animated { animation-duration: 1s; animation-fill-mode: both; }
.animated.infinite { animation-iteration-count: infinite; }
@keyframes fadeInDown {
    0% { opacity: 0; transform: translateY(-100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInDown { animation-name: fadeInDown; }
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translateX(-100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInLeft { animation-name: fadeInLeft; }
@keyframes fadeInRight {
    0% { opacity: 0; transform: translateX(100px); }
    100% { opacity: 1; transform: translateX(0); }
}
.fadeInRight { animation-name: fadeInRight; }
@keyframes fadeInUp {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeInUp { animation-name: fadeInUp; }
@keyframes fadeIn {
    0% { opacity: 0; transform: translateY(100px); }
    100% { opacity: 1; transform: translateY(0); }
}
.fadeIn { animation-name: fadeIn; }

@keyframes scrollCol {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
@-webkit-keyframes scrollCol {
  0% { -webkit-transform: translateX(0); }
  100% { -webkit-transform: translateX(-50%); }
}