@import url('https://fonts.googleapis.com/css2?family=Questrial&display=swap');



.footer__widget,
.footer__widget-2 {
    -ms-grid-column-span: 3;
    grid-column: span 3
}

.header__support p {
    width: 100%;
    font-weight: 300;
    font-size: 15px;
    line-height: 1.3;
    color: var(--gray-2);
    text-align: right;
    margin-top: 0;
    transform: none
}

.animation__service_page a,
.div_class_one a:hover .div_class_one,
.menu-text-pp {
    color: #fff
}

img.menu_bar {
    width: 30px
}

.sticky-2 .header__logo-5 img,
.sticky-2 .header__nav-icon-5 {
    -webkit-filter: none;
    filter: none
}

.arrow_img img {
    margin-top: 55px
}

.header__inner-5 {
    padding: 0 50px
}

.header__logo-5 img,
.offcanvas__logo img,
img.footer__logo {
    width: 241px;
}

.portfolio-section {
    padding: 50px 0;
    background-color: #fff
}

.portfolio-section h2 {
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase
}

.portfolio-menu {
    text-align: center
}

.control {
    background: 0 0;
    padding: 5px 25px;
    border: 0;
    cursor: pointer;
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -ms-transition: 5s;
    -o-transition: 5s;
    transition: color .2s ease-out;
    vertical-align: middle;
    color: #212121;
    font-size: 15px;
    font-family: 'Questrial', sans-serif;
    font-weight: 800;
    line-height: 22px;
    white-space: nowrap
}

.control:hover,
.mixitup-control-active {
    background: 0 0;
    color: #989898
}

button:focus {
    outline: 0
}

.fancybox-container button:focus {
    outline: 0;
    box-shadow: none
}

.portfolio-item {
    padding-top: 30px
}

.pd,
.port_list {
    padding: 0
}

.pd img {
    height: 476px;
    transition: .5s;
    width: 100%;
    object-fit: cover
}

.portfolio-item li {
    list-style: none
}

.portfolio-overlay {
    position: absolute;
    z-index: 2;
    top: -224px;
    left: 0;
    background: rgba(0, 0, 0, .7);
    width: 100%;
    height: auto;
    text-align: center;
    visibility: hidden;
    transition: .5s;
    transform: scale(0);
    padding: 154px 0
}

.portfolio-overlay a,
.portfolio-overlay p {
    position: relative;
    z-index: 4
}

.portfolio-item:hover .portfolio-overlay::before {
    width: 80%;
    height: 80%;
    border-top: 1px solid #50977f;
    border-right: 1px solid #50977f;
    transition: width .1s .3s, height .1s .5s
}

.portfolio-item:hover .portfolio-overlay::after {
    width: 80%;
    height: 80%;
    border-bottom: 1px solid #50977f;
    border-left: 1px solid #50977f;
    transition: width .1s .6s, height .1s .7s
}

.portfolio-item li:hover .portfolio-overlay {
    visibility: visible;
    transform: scale(1)
}

.portfolio-overlay .category {
    margin-top: 70px;
    margin-bottom: 20px;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    text-align: left;
    padding-left: 50px
}

.category h3 {
    font-size: 35px;
    letter-spacing: -.03em;
    font-weight: 700
}

button.lets_btn,
button.modal_btn {
    margin-right: 20px;
    letter-spacing: 1px;
    text-transform: uppercase
}

.category h5 {
    font-size: 14px
}

.portfolio-overlay .magnify-icon {
    height: 40px;
    width: 40px;
    border-radius: 20px;
    background: #50977f;
    margin: 0 5px;
    cursor: pointer;
    display: inline-block;
    transition: .25s
}

.portfolio-overlay .magnify-icon:hover {
    background: #000
}

.portfolio-overlay .magnify-icon p span i {
    font-size: 15px;
    color: #fff;
    line-height: 40px;
    cursor: pointer
}

.brand__list.border_project {
    border-bottom: 0
}

.border_project .brand__item {
    text-align: center;
    border: 1px solid var(--white-3)
}

button.lets_btn.proposal_btn {
    background: #fd710f;
    color: #fff;
    border-color: #333;
    border-radius: 0
}

button.lets_btn {
    border: 1px solid #fd710f;
    color: #fff;
    padding: 9px 25px;
    font-size: 14px
}

button.lets_btn.proposal_btn:hover {
    background: 0 0;
    transition: 1s
}

button.lets_btn:hover {
    border: 1px solid #fff;
    transition: 1s
}

.accordion-body p,
.pad_botblog .fw-light.text-center,
section.faq__area-6 .accordion-body h4,
ul.header__links {
    margin-bottom: 20px
}

ul.footer__contact.privacy {
    text-align: right
}

.footer__subscribe.privacy_text {
    padding: 30px 0
}

.footer__copyright.privacy_logo {
    padding: 15px 0 15px 65px
}

ul.footer__contact.privacy li {
    display: inline;
    padding-right: 15px
}

.txt {
    text-align: left;
    padding-left: 10px;
    font-size: 15px
}

.brand__list.border_project img {
    width: 50px;
    object-fit: contain
}

.border_project .brand__item {
    padding: 10px 20px;
    display: flex;
    align-items: center
}

.portfolio__slide-2 .btn-common-wrap {
    padding-top: 40px
}

.pt-50 {
    padding-top: 60px
}

a.btn-common {
    border: 1px solid #333;
    padding: 10px 20px;
    border-radius: 10px
}

.roll__area,
.service__detail-circle span,
.service__img-wrapper span,
.shape .primary,
.workflow__slide::after {
    background-color:#fd710f
}

.wc-btn-black span,
.wc-btn-light span,
.wc-btn-pink span,
.wc-btn-primary span,
.wc-btn-secondary span {
    background-color: #fd710f !important
}

.wc-btn-black:hover,
.wc-btn-light:hover,
.wc-btn-pink:hover,
.wc-btn-primary:hover,
.wc-btn-secondary:hover {
    color: var(--black-2);
    border: 1px solid #fd710f !important
}

.offcanvas__links ul li {
    padding-bottom: 15px
}

ul.footer__social li a {
    border-radius: 50%;
    border: 1px solid;
    padding: 2px 0;
    width: 35px;
    height: 35px;
    text-align: center
}

.footer__social li {
    padding-right: 8px
}

ul.header__links i {
    color: #fff;
    padding-right: 6px
}

.offcanvas__mid {
    width: 77%;
    float: left
}

.offcanvas__left {
    width: 23%;
    float: left;
    background: #1d1d1d
}

.offcanvas__body {
    display: block;
    -ms-grid-columns: none;
    grid-template-columns: none;
    height: 100%;
    background: #fff
}

.div_class_one {
    width: 33%;
    float: left;
    padding: 50px 60px;
    border-right: 1px solid #e7e7e7;
    margin: 0
}

.div_class_one::nth-last-child() {
    border-right: 0
}

.div_class_one h3 {
    margin-bottom: 30px
}
.div_class_one .smenu-mtitle {
    font-size:22px;
    margin-bottom:30px;
    font-weight:400;
    position:relative;
    z-index:1;
}
.div_class_one li {
    padding-bottom: 10px
}

.div_class_one a {
    color: #333;
    font-size: 18px
}

.div_class_one:hover {
    background: #f8f8f8;
    color: #000
}

.offcanvas__menu-wrapper {
    margin-top: 95px
}

.service__detail-content.nogrid {
    display: block;
    padding-top: 15px
}

.border_zero {
    border: 0
}

.cursor1,
.cursor2 {
    border: 1px solid #0a57ff !important;
    display: none !important;
}

.div_class_one:hover a {
    color: #333 !important
}

.header__area-2 {
    background: #000 !important
}

.cursor2 {
    background-color: #0a57ff !important
}

ul.footer__social i {
    line-height: 30px
}

.opacity_one {
    opacity: 1 !important
}

#content2,
#content3,
.display_none,
nav.mean-nav {
    display: none
}

.div_class_one.active_sb a,
section.career__benefits.site_mp a,
ul#user-nav-tabs li a {
    color: #333
}

ul#user-nav-tabs li {
    display: inline;
    font-weight: 400;
    font-size: 20px;
    line-height: 1.4;
    color: var(--black-2);
    padding-right: 70px;
    position: relative
}

ul#user-nav-tabs {
    text-align: center;
    margin: 0 auto 60px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    padding-bottom: 30px
}

ul#user-nav-tabs li.active a {
    color: #fd710f
}

ul#user-nav-tabs li::after {
    position: absolute;
    content: "";
    width: 18px;
    height: 18px;
    left: calc(19% - -3px);
    top: 45px;
    background-color: #fd710f;
    border: 3px solid var(--white);
    border-radius: 100%;
    -webkit-animation: 1.5s 1s infinite wcBubble;
    animation: 1.5s 1s infinite wcBubble;
    -webkit-transition: .3s;
    transition: .3s
}

.modal-title {
    font-size: 25px
}

img.lets_img {
    width: 25px
}

.my_account button a {
    color: #fff;
    border: 1px solid #f29100;
    padding: 10px 15px
}

.my_account button {
    margin-top: 30px;
    margin-bottom: 0
}

.offcanvas__links {
    padding-left: 50px;
    padding-top: 50px
}

.display_desk,
.tech-btn.fade_bottom,
a.display_whtsapp {
    display: block
}

button.modal_btn {
    border: 1px solid #f29100;
    color: #fff;
    padding: 9px 25px;
    font-size: 14px;
    margin-bottom: 20px;
    background: #f29100
}

button.modal_btn:hover {
    border: 1px solid #f29100;
    color: #292929;
    background: 0 0
}

button.btn.btn-secondary {
    background: 0 0;
    color: #292929;
    border: 0;
    font-size: 22px
}

.choose__wraps p {
    max-width: 100%;
    font-size: 18px;
    line-height: 1.7;
    color: var(--black-3);
    margin-left: 0;
    margin-bottom: 20px;
    text-align: left
}

.experience,
.experience h2 {
    font-weight: 400;
    color: var(--white)
}

.colum_footerone {
    width: 100%;
    float: left
}

.colum_footertwo {
    width: 60%;
    float: left
}

.choose__wraps h3 {
    margin-bottom: 40px;
    font-size: 50px;
    text-transform: uppercase;
    text-align: left
}

.footer__row {
    margin-bottom: 0
}

.counter__img-3 img {
    max-width: 100%
}

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

.img-anim img,
.port_list .portfolio-img-box {
    height: auto
}

.modal-body {
    padding: 20px 30px
}

.portfolio__slide-2 .slide-img img {
    width: 100%;
    height: auto;
    object-fit: cover
}

.portfolio__slide-2 .slide-img {
    padding-right: 0
}

.no-mobpad,
.offcanvas__menu-wrapper.mean-container {
    padding-top: 0
}

.mean-container .mean-bar {
    min-height: auto
}

.logo_sidebar img {
    width: 150px;
    margin-bottom: 20px
}

.choose__wraps .sec-sub-title {
    text-align: left;
    padding-top: 100px
}

ul.menu-anim .accordion-button:not(.collapsed) {
    color: #000;
    background-color: transparent;
    box-shadow: none
}

ul.menu-anim .accordion-item {
    box-shadow: none;
    border: 0
}

.offcanvas__social {
    padding-top: 80px
}

.hero__title-wrapper {
    max-width: 90% !important
}

.hero__sub-title {
    right: -60px !important
}

.experience h2 {
    font-size: 50px;
    line-height: 1.3
}

.experience {
    font-size: 18px;
    line-height: 1.4
}

.workflow__area-3 .wf_panel {
    width: 100%;
    height: 100vh
}

.contact__info ul li a {
    text-decoration-line: none
}

.contact__info li {
    font-weight: 300;
    font-size: 17px;
    line-height: 1.5;
    color: var(--black-2);
    display: block;
    margin-bottom: 10px
}

.faq__list-6 li,
.service_h3 li {
    list-style: disc;
    color: var(--black-3)
}

.contact__info li a,
.offcanvas__links ul li a {
    font-size: 17px
}

.development__content,
a.disply_ablock {
    display: block !important
}

.footer__copyright p {
    max-width: 100%;
    font-size: 14px
}

.service_h3 h3 {
    margin: 20px 0
}

.offcanvas__social img {
    width: 255px;
    margin-bottom: 40px
}

.development__wrapper p,
.service_h3 h4,
.service_h3 h5,
.service_h3 p {
    margin-bottom: 15px
}

.offcanvas__social ul li {
    padding-bottom: 15px
}

.offcanvas__social ul li a {
    font-size: 22px
}

.service_h3 h5 {
    margin-top: 15px
}

.service__detail-img {
    margin-bottom: 40px
}

.service_h3 ul {
    padding-left: 20px;
    padding-bottom: 10px
}

.service_h3 p {
    text-align: justify
}

.service_h3 li {
    line-height: 1.5;
    font-weight: 400;
    font-size: 16px
}

.story__area .from-text {
    background: #fd710f !important;
    height: auto
}

.faq__list-6 li {
    font-size: 18px;
    line-height: 1.4;
    padding-bottom: 10px
}

.faq__list-6 ul,
.hero__about-content .thanks_img-row .hero-title {
    padding-bottom: 20px
}

.faq__list-6 ul {
    padding-left: 22px
}

.offcanvas__social a.active,
.page-link,
section.career__benefits.site_mp a:hover {
    color: #f29100
}

section.career__benefits.site_mp ul li ul {
    margin-top: 10px
}

.div_class_one.active_sb {
    background: #f8f8f8;
    color: #333
}

.div_class_one.active_sb a.active_ssb {
    color: #90b73c
}

.div_class_one li a:hover {
    color: #90b73c !important
}

.cta__title-2 {
    font-size: 80px
}

.pad_notp {
    padding-top: 0 !important
}

li a.product {
    left: auto;
    right: -135px;
    position: fixed;
    transform: rotate(89deg);
    background-color: rgb(185, 12, 18);
    padding: 12px 25px;
    color: white;
    top: 400px;
    border-radius: 0px 0px 12px 12px;
    font-size: 20px;
}
.offcanvas__mid li a.mob_product {

    background-color: #b90c12;

    color: white !important;
  
}
.offcanvas__mid li a.product:hover {
    color: white !important;
}

@media(max-width:1600px) {
    .div_class_one h3 {
        font-size: 22px
    }
    .div_class_one {
        padding: 30px 40px
    }
    .offcanvas__links ul li a {
        font-size: 15px
    }
    ul.header__links {
        margin-bottom: 10px
    }
    .research__area .sec-title-wrapper p {
        font-size: 17px
    }
    .research__area .sec-title-wrapper {
        padding-right: 80px;
        padding-bottom: 50px
    }
    .research__number span {
        font-size: 38px;
        width: 150px;
        height: 150px
    }
    .research__item p {
        max-width: 400px
    }
    .counter__wrapper-3 {
        height: 100%
    }
    .counter__area-3 .counter__img-3 {
        margin-top: -126px
    }
    .cta__content-3 a {
        width: 195px;
        height: 195px;
        font-size: 20px
    }
    .offcanvas__menu-wrapper {
        margin-top: 30px
    }
}

@media(max-width:1400px) {
    .offcanvas__mid {
        margin-top: 75px
    }
    .div_class_one h3 {
        font-size: 18px
    }
    .div_class_one img {
        width: 40px
    }
    .div_class_one {
        margin: 0
    }
    .div_class_one a {
        font-size: 16px
    }
    .offcanvas__menu-wrapper {
        margin-top: 0
    }
    ul.header__links {
        margin-bottom: 18px
    }
    .offcanvas__links ul li {
        padding-bottom: 15px
    }
    .offcanvas__links ul li a {
        font-size: 14px
    }
    .offcanvas__links {
        padding-left: 25px;
        padding-top: 35px
    }
    .offcanvas__social ul li a {
        font-size: 20px
    }
    .offcanvas__social ul li {
        padding-bottom: 11px
    }
    .offcanvas__social {
        padding-left: 25px;
        padding-top: 25px
    }
}

@media(max-width:1199px) {
    .footer__widget,
    .footer__widget-2 {
        -ms-grid-column-span: 3;
        grid-column: span 4
    }
    .brand__list.border_project img {
        width: 35px
    }
    .txt {
        text-align: left;
        padding-left: 10px;
        font-size: 13px
    }
    .border_project .brand__item {
        padding: 15px 10px
    }
    .footer__widget-4 {
        display: none
    }
    .footer__copyright.privacy_logo {
        padding: 15px 0 15px 65px;
        text-align: center;
        padding-bottom: 0 !important
    }
    .footer__copyright {
        padding-bottom: 30px !important;
        grid-column: 1/12;
        padding: 0;
        text-align: center
    }
    .div_class_one {
        padding: 30px 20px
    }
    .div_class_one a {
        font-size: 15px
    }
    .div_class_one li,
    .offcanvas__social ul li {
        padding-bottom: 10px
    }
    .offcanvas__social ul li a {
        font-size: 18px
    }
    .offcanvas__links ul li {
        padding-bottom: 15px
    }
    .footer__social li {
        padding-right: 0
    }
    .offcanvas__links {
        padding-left: 20px;
        padding-top: 45px;
        padding-right: 20px
    }
    .div_class_one h3,
    ul.header__links {
        margin-bottom: 10px
    }
    .offcanvas__mid {
        margin-top: 38px
    }
}

@media(max-width:991px) {
    .portfolio__slide-2 .slide-img img {
        height: auto
    }
    .border_project .brand__item {
        padding: 20px;
        display: inherit
    }
    .txt {
        padding-left: 0
    }
    .footer__widget {
        -ms-grid-column-span: 5;
        grid-column: span 5;
        padding-right: 30px
    }
    .footer__widget-2 {
        -ms-grid-column-span: 7;
        grid-column: span 7
    }
    .display_none,
    nav.mean-nav {
        display: block
    }
    .display_desk {
        display: none
    }
    .header__logo-2 img,
    img.logo-secondary {
        width: 100px
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li a {
        color: #000;
        font-size: 23px
    }
    .offcanvas__mid {
        width: 100%;
        float: none;
        margin-top: 75px
    }
    .header__inner-5 {
        padding: 0 15px
    }
    .offcanvas__area {
        background-color: #fff
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li a:hover span {
        --m: none
    }
    .offcanvas__close {
        position: absolute;
        right: 15px;
        top: 5px
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li a.mean-expand:hover {
        background: 0 0;
        opacity: 1
    }
    .workflow__area-3 .wf_panel {
        width: 100%;
        height: auto
    }
}

@media(max-width:767px) {
    .footer__widget,
    .footer__widget-2 {
        -ms-grid-column-span: 12;
        grid-column: span 12
    }
    .choose__wraps h2 {
        font-size: 18px;
        padding-bottom: 5px
    }
    .modal-body {
        padding: 10px 15px
    }
    .n__marg input {
        margin: 0
    }
    .footer__copyright {
        margin-top: 15px;
        margin-left: -40px
    }
    .footer__copyright.privacy_logo img {
        margin-top: 45px
    }
    .footer__widget {
        padding-right: 0
    }
    .counter__img-3 img,
    .footer__widget p {
        max-width: 100%
    }
    .footer__widget-2,
    .footer__widget-3 {
        padding: 0
    }
    .offcanvas__mid {
        margin-top: 58px
    }
    .choose__wraps h3 {
        margin-bottom: 20px;
        font-size: 28px
    }
    .choose__wraps .sec-sub-title {
        margin-top: 0;
        padding-top: 0
    }
    .choose-wrapper {
        background-image: none
    }
    .mean-container .mean-bar {
        min-height: auto;
        overflow-y: scroll;
        height: 800px;
        overflow-x: hidden
    }
    nav.mean-nav a.active {
        color: #f7941d !important
    }
    .footer__copyright p {
        font-size: 12px
    }
    .counter__img-3 {
        margin-top: 0
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li a {
        font-size: 15px;
        padding: 15px 0 15px 15px
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li li a {
        font-size: 15px;
        padding: 10px 0 7px 30px
    }

    .header__logo-5 img, .offcanvas__logo img, img.footer__logo {
        width: 120px;
    }

    .de-title h1 {
        font-size: 56px !important;
        margin-top: 50px !important;
        text-align: center !important;
    }

        
    .de-title h3 {
        font-size: 40px !important;
    }

    .de-title h3 span {
        font-size: 40px !important;
        text-align: center !important;
    }

    .our-journey h4, p {
        text-align: center;
    }

    .why-choose-us h1 {
        margin-top: 12px;
        font-size: 56px !important;
        text-align: center;
    }

    .why-choose-us li {
        font-size: 25px;
        line-height: 38px;
    }

    .de-title-3 h1 {
        font-size: 56px;}

    
    .our-process {
        display: none;
    }



}

@media(max-width:745px) {
    button.lets_btn {
        display: none
    }
    .header__logo-2 img,
    img.logo-secondary {
        width: 100px
    }
    .offcanvas__menu-wrapper.mean-container .mean-nav ul li a {
        color: #000
    }
    .offcanvas__mid {
        width: 100%;
        float: none
    }
    .cta__title-2 {
        font-size: 40px
    }
    .workflow__area-3 .wf_panel {
        width: 100%;
        height: auto
    }
}

@media(max-width:390px) {
    .mean-container .mean-bar {
        max-height: 580px;
        overflow-y: scroll;
        overflow-x: hidden
    }
}

.pagination {
    margin-bottom: 0;
    list-style-type: none;
    align-items: center;
    justify-content: center
}

.portfolio-more figcaption,
.thanks_img-row {
    align-items: center;
    display: flex
}

.pagination li {
    margin-right: 10px
}

.portfolio-img-box {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    margin-bottom: 0
}

.portfolio-more figcaption {
    padding: 0 30px;
    background-color: rgba(58, 52, 42, .7);
    -webkit-transition: background-color .35s;
    transition: background-color .35s;
    align-content: stretch;
    flex-direction: column;
    justify-content: center;
    flex-wrap: nowrap;
    height: 100%
}

.portfolio-more:hover figcaption::before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.portfolio-more:hover figcaption {
    background-color: rgba(58, 52, 42, 0)
}

.port_list img.image-box_item_port,
.thanks_img img {
    width: 100%
}

.portfolio-img-box .portfolio-figcaption {
    background: rgba(0, 0, 0, .7);
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: .4s ease-in-out;
    -moz-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
    z-index: 9
}

.portfolio-more figcaption::before {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity .35s, -webkit-transform .35s;
    transition: opacity .35s, transform .35s;
    -webkit-transform: scale(0);
    transform: scale(0);
    border: 0;
    content: ''
}

.portfolio-img-box:hover .portfolio-figcaption {
    opacity: 1
}

.portfolio-figcaption p {
    font-weight: 400;
    font-size: 40px;
    line-height: 1;
    color: var(--white);
    text-align: center
}

.portfolio__area-2::after {
    background: 0 0 !important
}

.portfolio-figcaption .image-box-p {
    font-weight: 100;
    font-size: 17px;
    line-height: 1.4;
    color: var(--white);
    text-align: center;
    padding-top: 10px
}

.portfolio-figcaption .btn-common-wrap a {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: var(--white)
}

a.btn-web {
    border: 1px solid #fff;
    padding: 10px 20px;
    border-radius: 10px
}

.tech-txt {
    color: var(--white)
}

.disply-tech .tech-txt {
    color: #e08600
}

.disply-tech li {
    display: inline-block;
    padding-right: 20px;
    color: #f29100
}

.disply-tech ul {
    text-align: center;
    padding-top: 30px
}

.portfolio-v3 h2.sec-title-3.title-anim {
    padding-top: 100px
}

.active>.page-link,
.page-link.active {
    background-color: #f29100;
    border-color: #f29100
}

.page-link:hover {
    color: #000
}

.pad_botblog {
    padding-bottom: 50px
}

.innerright {
    border-radius: .5rem
}

.disply_workflex {
    display: flex;
    align-items: center;
    flex-wrap: nowrap
}

.whatsapplogo_icon.call_bottom_icon {
    bottom: 75px
}

.whatsapplogo_icon.mailto_icon {
    bottom: 135px
}

.whatsapplogo_icon {
    position: fixed;
    bottom: 15px;
    z-index: 999;
    left: 30px;
    right: auto;
    width: 50px;
    height: 50px;
    background: #fd710f;
    font-size: 19px;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    line-height: 51px
}

.whatsapplogo_icon:hover {
    background: #25d366
}

.whatsapplogo_icon img {
    width: 23px;
    margin-top: -5px
}

.whatsapplogo_icon.call_bottom_icon:hover {
    background: #17aef3
}

.whatsapplogo_icon.mailto_icon:hover {
    background: #4d4d4f
}

.whatsapplogo_icon.call_bottom_icon img {
    width: 26px
}

@media(max-width:1600px) {
    .portfolio-figcaption .image-box-p {
        font-weight: 100;
        font-size: 14px
    }
    .portfolio-figcaption p {
        font-size: 25px
    }
    .portfolio-more .btn-common-wrap.pt-50 {
        padding-top: 35px
    }
    .offcanvas__links {
        padding-top: 20px
    }
    .offcanvas__social {
        padding-top: 25px
    }
    .portfolio-more .portfolio-more {
        margin-top: 40px
    }
}

@media(max-width:1300px) {
    .portfolio-figcaption a.btn-web {
        font-size: 13px;
        padding: 5px 10px
    }
    .portfolio-figcaption .image-box-p {
        line-height: 1.4;
        font-weight: 100;
        font-size: 13px
    }
    .disply-tech ul {
        text-align: center;
        padding-top: 10px
    }
    .portfolio-figcaption p {
        font-size: 20px
    }
    .portfolio-figcaption .btn-common-wrap.pt-50 {
        padding-top: 12px
    }
    .choose__wraps p {
        max-width: 100%;
        font-size: 16px
    }
    .choose__wraps h3 {
        margin-bottom: 6px;
        font-size: 40px
    }
    .choose__wraps .sec-sub-title {
        padding-top: 50px
    }
}

@media(max-width:1199px) {
    .width-100 {
        width: 100%
    }
    .counter__area-3 .counter__img-3 {
        margin-top: 0
    }
    .workflow__area-3 .wf_panel {
        width: 100%;
        height: 100%
    }
    .cta__title-2 {
        font-size: 60px
    }
    .txt-center {
        text-align: center
    }
    .disply_workflex {
        display: flex;
        flex-direction: column
    }
    .workflow__area-3 {
        background-color: var(--pink-4)
    }
    .counter__img-3 img {
        margin-bottom: 50px
    }
}

@media(max-width:991px) {
    .portfolio__slide-2 .btn-common-wrap.pt-50.opacity_one {
        padding-top: 35px
    }
    .portfolio__slide-2 p {
        padding-bottom: 20px;
        font-size: 16px
    }
    .solution__img-1.web_solution-img {
        margin-top: 0
    }
    .thanks_img-row .wc-btn-primary {
        padding: 20px;
        width: 120px;
        height: 120px;
        font-weight: 400;
        font-size: 14px
    }
    .choose__wraps .sec-sub-title {
        padding-top: 0
    }
    .portfolio-more .portfolio-more {
        margin-top: 40px
    }ul#user-nav-tabs li {
    padding-right: 40px; 
    }
}

@media(max-width:767px) {
    .portfolio__slide-2 .slide-img {
        order: 0 !important
    }
    .portfolio__slide-2 .slide-content {
        padding-left: 15px
    }
    .border_project .brand__item {
        padding: 10px 20px;
        display: flex
    }
    .portfolio__slide-2 .sec-title {
        line-height: 1.1;
        padding-bottom: 15px;
        padding-left: 0;
        font-size: 26px
    }
    .portfolio__slide-2 .btn-common-wrap.pt-50.opacity_one {
        padding-top: 35px
    }
    .no-mobpad {
        padding-top: 0 !important
    }
    .research__area .sec-title-wrapper {
        padding-right: 0 !important;
        padding-bottom: 30px !important
    }
    .research__area .sec-title {
        padding-bottom: 20px !important
    }
    .research__number span {
        font-size: 25px;
        width: 80px;
        height: 80px
    }
    .research__number span img {
        width: 50px;
        height: 50px;
    }
    .counter__area-3 .counter__img-3,
    .portfolio-more .portfolio-more {
        margin-top: 0
    }
    .contact__btm {
        padding-top: 20px
    }
    .line::after {
        display: none
    }
    .cta__title-2 {
        font-size: 30px
    }
    .about__title-wrapper {
        padding-bottom: 0
    }
    .solution__img-1.web_solution-img {
        margin-top: 20px
    }
    .hero__about-content .thanks_img-row .hero-title {
        padding: 0 0 20px
    }
    .mb-pb-50 {
        padding-bottom: 20px
    }
    .whatsapplogo_icon {
        left: 5px
    }
    .scroll-top {
        right: 35px;
        bottom: 85px
    }
    ul.footer__contact br {
        display: block
    }.footer__copyright {
    margin-top: 0;
    margin-left: 0;
}.footer__copyright.privacy_logo {
    padding: 0; 
}.footer__copyright.privacy_logo img {
    margin-top: 15px;
}.portfolio__slide-2 .slide-content {
    padding-right: 15px;
}
}

@media(max-width:575px) {
    ul#user-nav-tabs li {
        font-size: 14px;
        padding-right: 8px
    }
    .modal-dialog.modal-dialog-centered.lets-modal {
        padding-right: 15px
    }
}

input.telcode {
    color: #b1b1b1
}

input.telcode::-webkit-input-placeholder {
    color: #b1b1b1
}

input.telcode::-moz-placeholder {
    color: #b1b1b1
}

input.telcode:-ms-input-placeholder {
    color: #b1b1b1
}

input.telcode::-ms-input-placeholder {
    color: #b1b1b1
}

input.telcode::placeholder {
    color: #b1b1b1
}

.error {
    font-size: 13px;
    color: red
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 400
}

.portfolio_mr .portfolio-more {
    text-align: center;
    margin-bottom: 39px
}

.lets-modal button.modal_btn {
    background: #f1400a;
}
 


.image-grid div {
    width: 25%;
    height: 280px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
  }
  
  .image-grid {
    display: flex;
    flex-wrap: wrap;
  }
  
  .image01 { background-image: url('../imgs/canvas/1.jpg'); }
  .image02 { background-image: url('../imgs/canvas/2.jpg'); }
  .image03 { background-image: url('../imgs/canvas/3.jpg'); }
  .image04 { background-image: url('../imgs/canvas/4.jpg'); }
  .image05 { background-image: url('../imgs/canvas/5.jpg'); }
  .image06 { background-image: url('../imgs/canvas/6.jpg'); }
  .image07 { background-image: url('../imgs/canvas/7.jpg'); }
  .image08 { background-image: url('../imgs/canvas/8.jpg'); }
  .image09 { background-image: url('../imgs/canvas/9.jpg'); }
  .image10 { background-image: url('../imgs/canvas/10.jpg'); }
  .image11 { background-image: url('../imgs/canvas/11.jpg'); }
  .image12 { background-image: url('../imgs/canvas/12.jpg'); }
  
  @media screen and (max-width: 400px) {
    .image-grid {
      flex-direction: column;
      flex-wrap: no-wrap;
    }
    .image-grid div { width: 100%; }
  }






  .direction-aware-hover {
    background-image: url(/public/uploads/portfolio/1.jpg);
    display: inline-block;
    height: 420px;
    margin: 0;
    overflow: hidden;
    position: relative;
    width: 24%;
    margin: 0px 10px;
    background-size: cover;
}
  
  .direction-aware-hover > * {
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: rotate(45deg);
    z-index: 1;
  }
  
  .direction-aware-hover__left {
    left: -70.75%;
    right: 70.75%;
  }
  
  .direction-aware-hover__right {
    left: 70.75%;
    right: -70.75%;
  }
  
  .direction-aware-hover__top {
    bottom: 70.75%;
    top: -70.75%;
  }
  
  .direction-aware-hover__bottom {
    bottom: -70.75%;
    top: 70.75%;
  }
  
  .direction-aware-hover__content {
    background: rgb(255 124 8 / 85%);
    color: rgb(238, 238, 238);
    height: 100%;
    opacity: 0;
    transform: none;
    transition: opacity 0.25s ease 0s, left 0.25s ease-in-out 0s, top 0.25s ease-in-out 0s, z-index 0s linear 0.25s;
    width: 100%;
    z-index: -1;
}
  
  .direction-aware-hover__content:after {
    bottom: -100%;
    content: '';
    left: -100%;
    position: absolute;
    right: -100%;
    top: -100%;
    z-index: -1;
  }
  
  *:hover ~ .direction-aware-hover__content {
    transition: opacity 0s,
      left 0s ease-in-out,
      top 0s ease-in-out,
      z-index 0s linear 0s;
    z-index: 1;
  }
  
  .direction-aware-hover__left:hover ~ .direction-aware-hover__content {
    left: -100%;
  }
  
  .direction-aware-hover__right:hover ~ .direction-aware-hover__content {
    left: 100%;
  }
  
  .direction-aware-hover__top:hover ~ .direction-aware-hover__content {
    top: -100%;
  }
  
  .direction-aware-hover__bottom:hover ~ .direction-aware-hover__content {
    top: 100%;
  }
  
  
  .direction-aware-hover__content:hover {
    left: 0;
    opacity: 1;
    top: 0;
    transition: opacity 0.25s,
      left .25s ease-in-out,
      top .25s ease-in-out,
      z-index 0s linear 0s;
    z-index: 1;
  }

  .boxes .box1,.boxes .box2 {
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
}

.boxes {
    position: relative;
    padding: 80px 0px;
}




dd.direction-aware-hover__content {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
}

.box1 dl.direction-aware-hover:nth-child(2) {
    background-image: url(/public/uploads/portfolio/10.jpg);
}
.box1 dl.direction-aware-hover:nth-child(3) {
    background-image: url(/public/uploads/portfolio/12.jpg);
}
.box1 dl.direction-aware-hover:nth-child(4) {
    background-image: url(/public/uploads/portfolio/3.jpg);
}

.box2 dl.direction-aware-hover:nth-child(1) {
    background-image: url(/public/uploads/portfolio/7.jpg);
}
.box2 dl.direction-aware-hover:nth-child(2) {
    background-image: url(/public/uploads/portfolio/8.jpg);
}
.box2 dl.direction-aware-hover:nth-child(3) {
    background-image: url(/public/uploads/portfolio/13.jpg);
}
.box2 dl.direction-aware-hover:nth-child(4) {
    background-image: url(/public/uploads/portfolio/14.jpg);
}

.form-check-input:checked[type=radio] {
    background-color: #fd710f;
}


option:checked,
option:hover {
  background-color: #fd710f;
}





.qty .count {
    color: #000;
    display: inline-block;
    vertical-align: top;
    font-size: 25px;
    
    line-height: 30px;
    padding: 0 2px;
    
    text-align: center;
}
.qty .plus {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    color: white;
    width: 30px;
    height: 30px;
    font: 30px/1 Arial,sans-serif;
    text-align: center;
    border-radius: 50%;
    }
.qty .minus {
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    color: white;
    width: 30px;
    height: 30px;
    font: 30px/1 Arial,sans-serif;
    text-align: center;
    border-radius: 50%;
    background-clip: padding-box;
}
div {
    text-align: left;
}
.minus:hover{
    background-color: #fd710f !important;
}
.plus:hover{
    background-color: #fd710f !important;
}
/*Prevent text selection*/
span{

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;

}



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

.heading-counter {
    width: 136px;
}





.section-cards {
    z-index: 3;
    position: relative;
}

.section-gray {
    /* background: #E5E5E5; */
    padding: 60px 0 30px 0;
}


/*---------------------------------------------------------------------- /
CARDS
----------------------------------------------------------------------- */

.card {
    display: inline-block;
    position: relative;
    width: 100%;
    margin-bottom: 30px;
    border-radius: 6px;
    color: rgba(0, 0, 0, 0.87);
    background: #fff;
   
}



.card .card-image {
    
    position: relative;
    overflow: hidden;
    
    
}

.card .card-image img {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    pointer-events: none;
}

.card .card-image .card-caption {
    position: absolute;
    bottom: 15px;
    left: 15px;
    color: #fff;
    font-size: 1.3em;
    text-shadow: 0 2px 5px rgba(33, 33, 33, 0.5);
}

.card img {
    width: 100%;
    height: auto;
}

.img-raised {
    box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}

.card .ftr {
    margin-top: 15px;
}

.card .ftr div {
    display: inline-block;
}

.card .ftr .author {
    color: #888;
}

.card .ftr .stats {
    float: right;
    line-height: 30px;
}

.card .ftr .stats {
    position: relative;
    top: 1px;
    font-size: 14px;
}


/* ============ Card Table ============ */

.table {
    margin-bottom: 0px;
}

.card .table {
    padding: 15px 30px;
}

.card .table-primary {
    background: linear-gradient(60deg, #ab47bc, #7b1fa2);
}

.card .table-info {
    background: linear-gradient(60deg, #26c6da, #0097a7);
}

.card .table-success {
    background: linear-gradient(60deg, #66bb6a, #388e3c);
}

.card .table-warning {
    background: linear-gradient(60deg, #ffa726, #f57c00);
}

.card .table-danger {
    background: linear-gradient(60deg, #ef5350, #d32f2f);
}

.card .table-rose {
    background: linear-gradient(60deg, #ec407a, #c2185b);
}

.card [class*="table-"] {
    color: #FFFFFF;
    border-radius: 6px;
}

.card [class*="table-"] .card-caption a,
.card [class*="table-"] .card-caption,
.card [class*="table-"] .icon i {
    color: #FFFFFF;
}

.card [class*="table-"] .icon i {
    border-color: rgba(255, 255, 255, 0.25);
}

.card [class*="table-"] .author a,
.card [class*="table-"] .ftr .stats,
.card [class*="table-"] .category,
.card [class*="table-"] .card-description {
    color: rgba(255, 255, 255, 0.8);
}

.card [class*="table-"] .author a:hover,
.card [class*="table-"] .author a:focus,
.card [class*="table-"] .author a:active {
    color: #FFFFFF;
}

.card [class*="table-"] h1 small,
.card [class*="table-"] h2 small,
.card [class*="table-"] h3 small {
    color: rgba(255, 255, 255, 0.8);
}





.de-title {
    display: inline-block;
    text-align: left;
}


.de-title h1{

    font-size: 85px;
    margin-top: -50px;
    color: black;
    font-family: 'Questrial', sans-serif;
    font-weight: 600;
}


.why-choose-us h1 {
    font-size: 75px !important;
    margin-top: 50px;
    color: black;
    font-family: 'Questrial', sans-serif;
    font-weight: bolder;
}

.de-title h2{
    letter-spacing: 10px;
    font-size: 32px;
    margin-top: -50px;
}


.de-title h3{
    font-size: 50px;
    color: black;
    padding-right: 10px;
    font-family: 'Questrial', sans-serif;
    font-weight: 600;
}


.de-title h3 span{
    font-size: 50px;
    color: #fd710f;
    padding-right: 10px;
    font-family: 'Questrial', sans-serif;
    font-weight: 600;
}



.navbar-collapse a {
    font-size: 16px;
}



.careers-box {
    background-color: #fd710f;
    color: #000;
}

.careers-box p {

    color: #000;
}