.blog ::before {
    background: url(../images/blogs-aftr.png) 0 0/cover;
    background-repeat: no-repeat !important;
    height: 995px;
    width: 100%;
    position: absolute;
    content: '';
    bottom: -160px;
    right: 0;
    z-index: -11111
}

.blog-main,
.categries strong,
.index-right-banner .index1_right,
.line,
.modal-content,
.process-null1,
.process-null2,
.process-null3,
.process-null4 {
    position: relative
}

.blog-box,
.blogs-two::after,
.blogs-two::before,
.blogs::after,
.blogs::before,
.sec-box {
    position: absolute
}

.blogs {
    background: url(../images/blogs-banner.jpg) 0 0/cover no-repeat
}

.blog-hero {
    padding: 70px 0
}

.blogs::before {
    content: '';
    background: url(../images/blogs-aftr.png) 0 0/contain no-repeat;
    height: 908px;
    width: 437px;
    right: 0;
    bottom: -96px
}

.blogs-two::after,
.blogs::after {
    height: 312px;
    left: 1px;
    content: ''
}

.modal-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    border: none !important;
    border-radius: .3rem;
    outline: 0
}

.blogs::after {
    background: url(../images/blogs-before2.png) 0 0/contain no-repeat;
    width: 100px;
    top: 67px
}

.blog-form {
    background: url(../images/form-ban.png) 0 0/100% 100% no-repeat;
    min-height: 545px;
    display: flex;
    justify-content: center;
    padding-top: 60px;
    padding-left: 40px
}

.blog-box {
    display: flex;
    float: left;
    z-index: 1;
    top: 250px;
    left: 30px
}

.blog-details {
    padding: 12px 13px;
    color: #fff;
    font-size: 16px;
    font-family: Poppins, sans-serif
}

.blog-details p:first-child {
    font-size: 18px;
    font-weight: 600;
    font-family: Poppins, sans-serif;
    line-height: 22px
}

.blog-details p:last-child {
    font-size: 16px;
    line-height: 32px
}

.blog-content {
    padding: 26px 0 0
}

.blog-content strong {
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    cursor: pointer
}

.blog-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 29px;
    padding: 10px 0
}

.categories-box {
    border: 1px solid #00000030;
    border-radius: 9px;
    padding: 15px;
    margin: 22px 0
}

.blog-ctdetails ul li {
    line-height: 33px;
    padding: 0 2px;
    font-size: 16px;
    font-weight: 500;
    transition: .3s ease-in-out
}

.blog-ctdetails ul li:hover {
    color: #7faf5f;
    cursor: pointer
}

.blog-ctdetails span {
    float: right
}

.categries strong {
    font-size: 20px;
    font-weight: 700;
    line-height: 45px
}

.categries strong::before {
    position: absolute;
    content: '';
    background: #dedede;
    width: 355px;
    height: 1px;
    bottom: -10px
}

.bcont-btn a {
    color: #000;
    font-size: 18px;
    font-weight: 500;
    text-decoration: revert
}

.blog-mainpost {
    display: flex;
    justify-content: space-between;
    margin: 16px 0
}

.blog-contents {
    padding: 0 20px
}

.blog-contents strong {
    font-size: 16px;
    font-weight: 700;
    transition: ease-in-out
}

.blog-contents strong:hover {
    color: #82b361;
    cursor: pointer
}

.blog-contents p {
    font-size: 16px;
    font-weight: 500;
    padding: 7px 0
}

.blog-btns {
    margin: 20px -10px
}

.bcont-btn {
    padding: 20px 0
}

.blog-img img {
    width: 100%;
    height: auto
}

.sec-box {
    top: 200px
}

.sticky a.head-cta-btn {
    color: #000 !important;
    background: 0 0 !important;
    border: 1px solid #000
}

.blog-tittle strong {
    font-size: 22px;
    padding: 0;
    line-height: 60px
}

.blogs-two {
    background: url(../images/blogsdetail-banner.jpg) 0 0/cover no-repeat
}

.blogs-two::after {
    bottom: 0;
    background: url(../images/blogs-detail-after.png) 0 0/contain no-repeat;
    width: 100px
}

.blogs-two::before {
    content: '';
    background: url(../images/blogs-before02.png) 0 0/contain no-repeat;
    height: 350px;
    width: 220px;
    right: -93px;
    top: 90px
}

.comments-tittle strong {
    font-size: 22px;
    font-weight: 600;
    line-height: 85px
}

.blog-comentbox {
    display: flex;
    border-bottom: 1px solid #0000002b;
    margin: 38px 0
}

.blog-comnetcontents {
    padding: 0 16px
}

.blog-comnetcontents strong {
    font-size: 16px;
    font-weight: 600
}

.rep-btn a {
    border: 1px solid #000;
    color: #000;
    padding: 10px 32px;
    border-radius: 38px;
    font-weight: 600
}

.rep-btn {
    margin: 25px 0
}

.blog-comnetcontents span {
    font-size: 14px;
    font-weight: 400
}

.blog-leave strong {
    font-size: 45px;
    font-weight: 600;
    line-height: 100px
}

.leave-from input[type=email],
.leave-from input[type=text] {
    width: 100%;
    padding: 0 16px;
    margin: 0 0 30px;
    height: 50px;
    border-radius: 25px;
    border: 0 solid;
    background: #f7f9fa;
    outline: 0
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.leave-from textarea {
    width: 100%;
    border-radius: 10px;
    border: 0 solid;
    background: #f7f9fa;
    padding: 10px 16px;
    outline: 0
}

.blog-btns a,
.blog-btns input[type=submit] {
    font-size: 16px;
    font-weight: 400;
    background: #82b361
}

.blog-btns a {
    padding: 15px 40px !important
}

.blog-btns input[type=submit] {
    padding: 15px 50px !important;
    border-radius: 20px;
    border: 1px solid #fff0;
    transition: .3s ease-in-out
}

.blog-btns input[type=submit]:hover {
    background: 0 0;
    border: 1px solid #000
}

.chicago {
    background: url(../images/chicago-banner.jpg) no-repeat !important;
    z-index: 0
}

.chicago .clect-rightcontent {
    position: relative;
    z-index: 1
}

.chicago .celect-leftcontent {
    padding-top: 0;
    position: relative;
    z-index: 999
}

.chicago .left-firstwrap {
    border-bottom: none
}

.chicago .banner-formwrap .head-cta-btn p,
.chicago .head-cta-btn .btn-text,
.chicago .play-text .gen-text,
.index-process .banner-formwrap .head-cta-btn p,
.newheader ul li a {
    color: #fff !important
}

.chicago .gen-heading {
    font-size: 46px;
    color: #fff
}

.chicago .round-black i,
.index-process .round-black i {
    color: #000;
    background: #fff
}

.chicago .head-cta-btn {
    background: linear-gradient(90deg, #478c78 0, #226373 35%, #85b94b 100%);
    border: 1px solid #fff0
}

.chicago .head-cta-btn:hover,
.index-process .head-cta-btn:hover {
    background: #fff;
    border: 1px solid #fff
}

.chicago .head-cta-btn:hover .btn-text {
    color: #000 !important
}

.chicago .banner-formwrap,
.index-process .banner-formwrap {
    background: url(../images/unite-game/unite-form.png) 0 0/100% 100% no-repeat
}

.chicago .banner-formwrap .head-cta-btn:hover p,
.chicago .banner-formwrap p,
.index-process .banner-formwrap .head-cta-btn:hover p,
.index-process .banner-formwrap p {
    color: #282828 !important
}

.chicago .banner-formwrap input,
.chicago .banner-formwrap textarea,
.index-process .banner-formwrap textarea {
    border-color: #ccc;
    color: #000 !important
}

.newheader .head-cta-btn,
.sticky a.tel_ {
    background: #fff !important;
    border: 1px solid
}

.chicago .banner-formwrap input::placeholder {
    color: #000 !important
}

.chicago .banner-formwrap textarea::placeholder {
    color: #000 !important
}

.chicago .banner-formwrap .head-cta-btn,
.index-process .banner-formwrap .head-cta-btn {
    background: #282828;
    border: 1px solid #fff0
}

.chicago .round-wrapper .gen-text,
.index-process .round-wrapper .gen-text,
.sticky {
    border-bottom: 1px solid #fff
}

.chicago .banner-formwrap .head-cta-btn:hover,
.index-process .banner-formwrap .head-cta-btn:hover {
    background: 0 0;
    border: 1px solid #282828
}

.chicago2 {
    background: url(../images/chicago-banner2.jpg) 0 0/cover
}

.cusapp-img img {
    height: auto;
    margin: 60px 0
}

.chicago-img img {
    width: 100%;
    height: auto;
    margin: 30px 0
}

.chicago .hero-bg_text {
    left: -30%;
    top: 12%
}

.menuSec ul li a:hover,
.newheader ul li a:hover {
    color: #d30407 !important
}

.index-process .head-cta-btn:hover .btn-text,
.menuSec li:hover a,
.sticky ul li a {
    color: #000 !important
}

.index-process .banner-formwrap input:hover,
.sticky {
    color: #000
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    z-index: 9999
}

.white img {
    filter: invert(1)
}

.newheader .head-cta-btn {
    color: #000 !important
}

.sticky.head-cta-btn {
    background: #000 !important;
    color: #fff !important
}

header.sticky .logo img {
    background: url(../images/celect-logo.png) left top no-repeat !important;
    width: 80px;
    height: 40px
}

.popupform {
    background: url(../images/popup-bg2.png) left top/100% 100% no-repeat;
    width: 1100px;
    height: 710px;
    padding-top: 0;
    overflow: visible;
    margin: 100px 0 0 -200px
}

.popupform h6 {
    color: #fff;
    width: 246px;
    text-align: center;
    font-size: 17px;
    position: absolute;
    top: 180px;
    line-height: 28px;
    left: -85px
}

form.validate-popup.pop-new {
    margin-right: 0
}

form.validate-popup {
    width: 540px;
    float: left;
    padding: 20px
}

.popupform h2 {
    text-align: center;
    font-size: 40px;
    margin: 10px 0 0;
    font-weight: 800;
    line-height: 50px;
    font-family: Raleway, sans-serif
}

.popupform h2+p {
    font-size: 14px;
    text-align: center;
    margin-top: 10px;
    color: #636060;
    letter-spacing: 0;
    margin-bottom: 10px;
    line-height: 1.5
}

html *,
html:after,
html:before {
    box-sizing: border-box
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

.popupform ul li {
    text-align: left;
    position: relative;
    width: 100%;
    margin: 8px 0;
    display: inline-block
}

.popupform .fancybox-close-small {
    position: absolute;
    top: 100px;
    background: #333;
    opacity: 1;
    border-radius: 50px;
    color: #fff;
    font-weight: 700;
    border: 1px solid;
    height: 45px;
    width: 45px;
    left: 170%
}

img.popupLogo {
    width: 10%
}

.fancybox-close-small:after {
    content: "x";
    position: absolute;
    top: 5px;
    right: 7px;
    width: 30px;
    height: 30px;
    font: 300 20px/30px Arial, Montserrat, Helvetica, sans-serif;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    border-width: 0;
    background: 0 0;
    transition: .2s;
    box-sizing: border-box;
    z-index: 2
}

.popupform ul li input[type=email],
.popupform ul li input[type=text],
.popupform ul li textarea,
input.required.number {
    border: 2px solid #cecac5;
    padding: 12px 10px 12px 33px;
    width: 100%;
    border-radius: 6px;
    font-size: 14px;
    color: #000;
    outline: 0 !important;
    box-shadow: rgb(99 99 99 / 20%) 0 2px 8px 0 !important
}

.modal-backdrop {
    position: relative !important
}

.modal {
    top: 0;
    left: 0;
    z-index: 1060;
    width: 100%;
    height: 100%;
    overflow-x: hidden !important;
    overflow-y: hidden;
    outline: 0;
    background: #000000c4 !important
}

.case-hero p,
.process-title {
    width: 70%;
    text-align: center
}

.modal-content {
    background: 0 0 !important
}

.fancybox-close-small:hover {
    opacity: 1;
    background: #15162b !important;
    transform: rotate(180deg)
}

.popupform ul li i {
    position: absolute;
    top: 15px;
    left: 10px;
    color: #00000080
}

.popupform ul li input[type=submit] {
    background: linear-gradient(0deg, #c7060a 0, #15172b 35%, #d70407 100%) !important;
    font-size: 18px;
    color: #fff;
    border: 1px solid #d70407;
    border-radius: 50px;
    width: 200px;
    text-align: center;
    margin: 0 auto;
    padding: 12px 10px;
    display: block
}

.index-process {
    background: url(../images/process-banner.jpg) 0 0/cover no-repeat
}

.index-process .head-cta-btn {
    background: #fff;
    border: 1px solid #fff0
}

.index-process .banner-formwrap input {
    border-color: #ccc;
    color: #fff
}

.index-process .banner-formwrap input::placeholder {
    color: #000 !important
}

.index-process .banner-formwrap textarea::placeholder {
    color: #000 !important
}

section.process {
    padding: 76px 0
}

.process-title {
    margin: 0 auto
}

.process-title strong {
    font-size: 45px;
    font-weight: 800;
    line-height: 50px;
    padding-bottom: 5px
}

.process-content span {
    font-size: 155px;
    font-weight: 700;
    color: #e9e9e9 !important;
    position: absolute;
    z-index: -1;
    margin: -52px -40px
}

.process-content strong {
    font-size: 24px;
    font-weight: 700;
    line-height: 35px
}

.process-content p,
.process-title p {
    font-size: 16px;
    font-weight: 400;
    padding: 10px 0;
    font-family: Poppins, sans-serif
}

.process-title p {
    line-height: 22px
}

.process-content p {
    line-height: 23px;
    overflow-y: scroll;
    height: 130px
}

.index-process .uiux-heading,
.section-title {
    font-size: 45px
}

.index-process .play-text .gen-text {
    line-height: 22px;
    color: #fff
}

.process-box {
    border: 1px solid;
    padding: 0 0 0 40px;
    border-radius: 55px;
    margin: 40px 0;
    width: 100%;
    height: 295px;
    overflow: hidden
}

.process-null1::before,
.process-null2::before,
.process-null3::before,
.process-null4::before {
    content: '';
    border-radius: 50px;
    z-index: 1
}

.process-box:hover {
    width: 100%;
    height: 295px;
    position: relative;
    transition: .3s ease-in-out
}

.process-box:hover span,
.process-content span {
    color: #ada7a721 !important
}

.process-content {
    margin: 55px 0 2px
}

.process-null1:after {
    content: '';
    position: absolute;
    background: url(../images/process-before.png) 0 0/cover no-repeat;
    width: 262px;
    height: 56px;
    left: -75px;
    top: 285px;
    transform: rotate(59deg);
    overflow: hidden
}

.process-null1::before {
    position: absolute;
    background-color: #82b361;
    width: 30px;
    height: 30px;
    left: 67px;
    top: 290px
}

.process-null2:after {
    content: '';
    position: absolute;
    background: url(../images/process-after.png) 0 0/cover no-repeat;
    width: 262px;
    height: 60px;
    right: -238px;
    top: 401px;
    transform: rotate(139deg);
    overflow: hidden
}

.process-null2::before {
    position: absolute;
    background-color: #82b361;
    width: 30px;
    height: 30px;
    top: 425px;
    right: -153px
}

.process-null3:after {
    content: '';
    position: absolute;
    background: url(../images/process-after.png) 0 0/cover no-repeat;
    width: 262px;
    height: 60px;
    left: -225px;
    top: 654px;
    transform: rotate(308deg);
    overflow: hidden
}

.process-null3::before {
    position: absolute;
    background-color: #82b361;
    width: 30px;
    height: 30px;
    top: 655px;
    left: -135px
}

.process-null4:after {
    content: '';
    position: absolute;
    background: url(../images/process-after.png) 0 0/cover no-repeat;
    width: 262px;
    height: 70px;
    left: -230px;
    top: 411px;
    transform: rotate(229deg);
    overflow: hidden
}

.process-null4::before {
    position: absolute;
    background-color: #82b361;
    width: 30px;
    height: 30px;
    top: 440px;
    left: -150px
}

.ind .service-content-wrapper a,
.ins .service-content-wrapper a,
.loc .service-content-wrapper a {
    width: 100%
}

.index-right-banner:before {
    background: url(../images/index-right-main.webp) 0 0/cover no-repeat;
    position: absolute;
    content: "";
    right: -3%;
    bottom: -10%;
    width: 100%;
    height: 840px;
    max-width: 940px
}

.index-right1 {
    position: absolute;
    top: 60px;
    right: -50%;
    width: 100%;
    max-width: 80px;
    animation: 3s ease-out 4s infinite alternate-reverse bounce-top
}

.index-right7,
.index-right8 {
    max-width: 75px;
    position: absolute;
    width: 100%
}

.index-right8 {
    bottom: -350px;
    right: 47%;
    animation: 3s ease-out 1s infinite alternate-reverse bounce-top
}

.index-right7 {
    right: -31%;
    bottom: -330px;
    animation: 3s ease-out 2s infinite alternate-reverse bounce-top
}

.index-right6 {
    position: absolute;
    right: 30%;
    bottom: -160px;
    max-width: 100px;
    animation: 4s ease-out 3s infinite alternate-reverse bounce-top
}

.index-right5 {
    position: absolute;
    top: -50px;
    left: -4%;
    width: 100%;
    max-width: 80px;
    animation: 2s ease-out 2s infinite alternate-reverse bounce-top
}

.index-right2 {
    position: absolute;
    top: -245px;
    right: -32%;
    width: 100%;
    max-width: 90px;
    animation: 3s ease-out infinite alternate-reverse bounce-top
}

.index-right3 {
    position: absolute;
    left: 44%;
    bottom: 30px;
    width: 100%;
    max-width: 80px;
    animation: 4s ease-out 1s infinite alternate-reverse bounce-top
}

.index-right4 {
    position: absolute;
    top: -243px;
    right: 14%;
    max-width: 85px;
    width: 100%;
    animation: 3s ease-out infinite alternate-reverse bounce-top
}

div#myModal .modal-dialog {
    margin: 40px auto 0
}

.case-hero strong {
    font-size: 35px;
    text-align: center;
    margin: 0 auto 10px;
    display: block;
    line-height: 50px;
    font-weight: 800
}

.case-hero p {
    font-size: 16px;
    font-weight: 400;
    margin: 0 auto;
    line-height: 22px
}

.case-study-wrapper .what-we-do-action {
    float: left;
    width: 33.33%
}

.case-study-detail-page .section.section-testimonial,
.main-menu .sub-menu li:hover,
.primary-bg,
.secondary-bg2 {
    background-color: #f4f6f9
}

.case-study-wrapper .action-svg-holder svg {
    width: 67px !important;
    top: 27px !important;
    position: relative
}

.what-we-do-action a {
    color: #82b361 !important;
    font-weight: 700
}

.bx-pager-item,
.number span,
.project-slides-lt,
.project-slides-rt,
.tags,
.testimonial-list li,
.what-we-do-action {
    display: inline-block
}

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

.action-svg-holder.medium-icon-container,
.btn,
.dev-bg,
.text-center {
    text-align: center
}

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

.action-svg-holder {
    background-color: #fff;
    height: 150px;
    width: 150px;
    transition: .3s linear;
    -webkit-transition: .3s linear;
    -moz-transition: .3s linear
}

.action-svg-holder,
.tags {
    box-shadow: 0 4px 15px 1px rgb(233 234 235 / 90%);
    border-radius: 27px;
    margin: 4px 7px
}

.onHoverFill,
.svg-parent:hover a svg .onHoverFill {
    fill: #82b361
}

.section-title {
    color: #1a1a1a;
    font-weight: 800;
    text-align: left;
    line-height: 50px;
    margin-bottom: 10px;
    font-family: Poppins, sans-serif
}

.case-content p,
.section-sub-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-align: left
}

.section-sub-title {
    width: 100%;
    font-family: Poppins, sans-serif
}

.case-content .action-svg-holder,
.tags {
    box-shadow: none !important;
    border-radius: 50px;
    margin: inherit;
    background-color: transparent !important;
    height: 100px !important;
    text-align: left
}

.section.section-1.primary-bg.section-right-img-cs.section-lr-img-cs.show-header-border,
section.case-profiles {
    padding: 50px 0
}

.case-study-wrapper .section-title {
    line-height: normal;
    font-size: 31px;
    color: #1a1a1a
}

.case-content p {
    padding: 5px 0
}

.case-content svg#Layer_1 {
    width: 100px;
    height: 100px
}

.gray {
    background: #f5f5f5 !important
}

@keyframes bounce-top {
    0%,
    100% {
        transform: translateY(0)
    }
    60% {
        transform: translateY(-20px)
    }
}