@media screen and (min-width:320px) {
    .afterloading .bold-textbox h1 {
        font-size: 54px;
    }
    .logo a {
        display: block
    }
    .logo a img {
        top: -14px;
        position: relative
    }
    .main-menu {
        position: fixed;
        z-index: 102;
        width: 100%
    }
    .main-menu .menu-icon:checked+label {
        position: absolute;
        top: 20px;
        right: 20px
    }
    .main-menu [type="checkbox"]:checked~nav .logo-menu {
        left: 20px;
        top: 20px
    }
    .followus-menu {
        left: 20px;
        bottom: 20px
    }
    .getintouch-outer.show .formmain img {
        display: none
    }
    header {
        position: relative;
        z-index: 21;
        padding: 0 15px
    }
    .main-banner {
        padding-top: 15px
    }
    .main-menu .menu-icon:not(:checked)+label.menustyle {
        top: 15px;
        right: 15px
    }
    .wavetextaction {
        font-size: 15px;
        margin-top: 15px;
        margin-right: 0
    }
    .banner-content .banner-content-small {
        font-size: 14px;
        letter-spacing: .6px;
        opacity: 1;
        animation: none
    }
    .bold-textbox h1 {
        font-size: 50px
    }
    .bold-textbox div {
        height: 60px
    }
    .bold-textbox {
        height: 200px
    }
    .banner-btn {
        margin-top: 30px
    }
    svg.scrolldown {
        display: none
    }
    .mouse-animation {
        opacity: 0
    }
    .about {
        padding-top: 0
    }
    .about:before {
        font-size: 3em
    }
    .is-visible.our-journey .our-journey-content .animated-title {
        width: 258px;
        font-size: 2.42em
    }
    .is-visible.our-journey .animated-title {
        color: #fff;
        height: 111px
    }
    .is-visible.our-journey .our-journey-content {
        margin-left: 4px
    }
    .journey-image {
        display: none
    }
    .journey-video {
        margin-right: 0;
        height: 215px
    }
    .journey-video a span img,
    .journey-image a span img {
        margin-left: 10px;
        width: 16px;
        margin-top: -8px
    }
    .journey-video a#vid {
        bottom: 20px;
        right: 20px;
        left: 20px
    }
    .journey-image a#gall {
        bottom: 0px;
        left: 0px;
        width: 100%;
        background: #fff;
        text-align: center;
    }
    .lineAnimated-journey {
        position: absolute;
        /*right:-100px*/
    }
    .projectFactsWrap .item {
        width: 100%;
        margin-bottom: 15px
    }
    .projectFactsWrap .item p.number {
        font-size: 1.42em
    }
    #projectFacts {
        padding: 50px 0
    }
    .skill-wrapper {
        padding: 0
    }
    .skill-wrapper-inner {
        padding: 40px 30px;
        background: #000
    }
    .skill-wrapper-inner .skill-heading {
        font-size: 1em
    }
    .skill-vector {
        margin: 0 auto 30px;
        display: block
    }
    .profile-name {
        font-size: 1.42em
    }
    .feedback-slider-item p {
        line-height: 1.4;
        font-size: .8em
    }
    .portfolio:before,
    .reviews:before,
    .ceosection::before,
    .title-inner-section-heading::after,
    .build-something-title::after {
        font-size: 3em
    }
    .title-inner-section-heading::after {
        font-size: 2em
    }
    .animated-heading div:first-of-type {
        animation: none
    }
    .animated-heading div:last-of-type,
    .animated-heading.teamsay div:last-of-type {
        width: auto;
        animation: none
    }
    .animated-heading div:last-of-type span {
        margin-left: 0
    }
    .team-heading-wrapper .team-heading-copy {
        font-size: 1.2em
    }
    .grid-container {
        display: block;
        margin-top: 25px
    }
    .grid-item {
        display: none;
        margin-bottom: 10px
    }
    .grid-item.item1,
    .grid-item.item3,
    .grid-item.item4,
    .grid-item.item5 {
        display: block
    }
    .portfolio {
        background: #fff
    }
    .reviews {
        background-image: url(../images/team/bg.jpg);
        padding: 0 0 70px
    }
    .section-ceo-about-profile {
        background-position: center;
        padding: 71px 0 0;
        position: relative
    }
    .is-visible.section-ceo-about-profile .ceosection {
        margin-top: 15px
    }
    .is-visible.section-ceo-about-profile .ceosection::before {
        left: 50%;
        transform: translateX(-50%);
        top: -50px
    }
    .title-ceo-secton {
        text-align: center
    }
    .ceosection p {
        font-size: .8em;
        display: block
    }
    .ceosection p.signature {
        font-size: 1.2em;
        text-align: right
    }
    .portfolio-btn {
        width: 230px
    }
    .animated-heading.testi div:last-of-type {
        width: auto;
        animation: none
    }
    .testimonial-section {
        padding: 20px 0
    }
    .title-inner-section-heading::after {
        top: -47px
    }
    .inner_testi_content2 {
        padding: 15px 15px 60px
    }
    .testi_inner_section_slider {
        padding: 0 15px 100px
    }
    .testi_inner_section_slider p {
        font-size: .8em
    }
    .profile_testi_set1 {
        bottom: -82px
    }
    .beesolver-culture-section {
        padding: 106px 0 70px 0
    }
    .is-visible.beesolver-culture-section .culture-heading .animated-title {
        top: 5%;
        height: 142px;
        width: 256px;
        left: 46%
    }
    .beesolver-culture-content .culture-heading {
        font-size: 1.7em
    }
    .culture-content-block {
        margin-top: 86px
    }
    .beesolver-culture-section .m-top-25 p {
        margin-bottom: 15px
    }
    /*.mapouter,.gmap_canvas{height:300px}*/
    .contactus,
    .followus {
        padding: 40px 15px 0;
        font-size: 15px;
        line-height: 24px
    }
    .container-footer {
        padding: 0
    }
    .lets-build-section {
        height: 330px;
        background-color: rgb(232 183 32 / 90%);
    }
    .videobackground {
        display: none
    }
    .content-align {
        top: 80px
    }
    .build-something-title::after {
        font-size: 2em;
        left: 0;
        margin-top: 40px
    }
    .lets-build-section h5 {
        text-align: left;
        font-size: 16px;
        margin: 10px 0
    }
    .is-visible .work-with-us {
        font-size: 16px;
        font-weight: 600;
    }
    .about-us-title,
    .portfolio-title,
    .teams-title,
    .testimonial-title {
        display: none
    }
    .reviews .team-heading-wrapper {
        padding-top: 40px
    }
    .reviews {
        padding-bottom: 40px
    }
    .section-ceo-about-profile {
        padding: 40px 0 0
    }
    .testimonial-section {
        padding: 20px 0 40px
    }
    .text-build {
        font-size: 107px
    }
    .is-visible .text-animation span {
        font-size: 26px
    }
    .contactus a {
        font-size: 15px
    }
    .contactus p {
        margin-bottom: 10px
    }
    .copyright {
        font-size: 10px;
        margin-top: 32px;
        letter-spacing: .2px
    }
    .getintouch-outer h1 {
        line-height: 35px;
        font-size: 30px;
        margin-bottom: 10px
    }
    .form-group {
        margin-bottom: 8px
    }
    .getintouch-outer .close-icon {
        position: absolute;
        right: 9px;
        top: -21px
    }
    .getintouch-outer .close-icon img {
        width: 20px
    }
    .getintouch-outer .banner-btn {
        margin-top: 17px;
        width: 130px
    }
    .is-visible .our-journey-content .animated-title {
        position: relative;
        left: 0;
        top: 0;
        transform: translateX(0)
    }
    .skill-vector.cloud-vector {
        margin-top: 35px
    }
    .logo.gallery a img {
        top: 0;
        position: relative
    }
    #gallery_page .gall.container {
        margin-top: 50px
    }
    .outerforceo .lineAnimated-ceo {
        bottom: -140px
    }
}

@media screen and (min-width:568px) {
    .getintouch-outer h1 {
        margin-bottom: 20px
    }
    .afterloading .bold-textbox h1 {
        font-size: 72px
    }
    .bold-textbox {
        height: 260px
    }
    .bold-textbox div {
        height: 70px
    }
    .bold-textbox h1 {
        font-size: 72px
    }
    .is-visible .our-journey-content .animated-title {
        position: relative;
        left: 0;
        top: 0;
        transform: translateX(0)
    }
    .build-text-back {
        width: 600px
    }
    .skill-wrapper {
        padding: 0
    }
    .portfolio:before {
        font-size: 5em
    }
    .team-heading-wrapper .team-heading-copy {
        font-size: 1.5em
    }
    .reviews .slick-initialized .slick-slide {
        height: 177px
    }
    .reviews .sin-testiImage img {
        height: auto !important;
        margin: 57px auto
    }
    .beesolver-culture-content .culture-heading {
        font-size: 2.42em
    }
    .is-visible.beesolver-culture-section .culture-heading .animated-title {
        top: 5%;
        height: 203px;
        width: 374px;
        left: 36%
    }
    .culture-content-block {
        margin-top: 125px
    }
    .beesolver-culture-section {
        padding: 160px 0 106px 0
    }
    .beesolver-culture-section img {
        max-width: 100%;
        margin: 0 auto;
        display: block
    }
    .lets-build-section h5 {
        display: block
    }
    .lineAnimated-journey {
        right: -37px
    }
    .text-build {
        font-size: 150px
    }
    .container-footer .col-lg-7 {
        padding: 0 15px
    }
    .contactus a {
        font-size: 18px
    }
    .contactus {
        padding: 40px 15px 0;
        font-size: 17px;
        line-height: 24px
    }
    .copyright {
        font-size: 12px;
        margin-top: 87px
    }
}

@media screen and (min-width:768px) {
    .banner-content .bannerinnerblock {
        padding-left: 60px
    }
    .beesolvertext {
        display: block;
        padding-left: 230px
    }
    .outerforceo .lineAnimated-ceo {
        bottom: -155px
    }
    .ceosection p.signature {
        font-size: 2em
    }
    .getintouch-outer .form-group {
        margin-bottom: 1rem
    }
    .getintouch-outer h1 {
        line-height: 45px;
        font-size: 2.5rem;
        margin-bottom: 0
    }
    .about {
        padding-top: 50px
    }
    .about-wrapper-inner {
        padding: 80px 0
    }
    .about:before,
    .title-inner-section-heading::after {
        font-size: 5.5em
    }
    .journey-video {
        height: 468px
    }
    .our-journey {
        height: 570px
    }
    .projectFactsWrap .item {
        width: 25%
    }
    .grid-container {
        display: grid;
        margin-top: 25px
    }
    .grid-container .grid-item {
        display: block
    }
    .team-heading-wrapper .team-heading-copy {
        font-size: 2em;
        margin-top: 50px
    }
    .reviews .slick-initialized .slick-slide {
        height: 220px
    }
    .section-ceo-about-profile {
        padding: 50px 0 0;
        background-position: center
    }
    .title-ceo-secton {
        text-align: left
    }
    .ceosection::before {
        left: 16px;
        transform: none;
        top: -50px
    }
    .testimonial-section .title-inner-section-heading::after {
        top: -98px
    }
    .is-visible.beesolver-culture-section .culture-heading .animated-title {
        top: 50%;
        left: 50%
    }
    .beesolver-culture-section {
        padding: 80px 0
    }
    .getintouch-image {
        display: block
    }
    .afterloading .lines-outer {
        display: none
    }
    .lineAnimated-aboutus {
        width: 100%;
        position: absolute;
        bottom: 26px
    }
    .about-us-title,
    .portfolio-title,
    .teams-title,
    .testimonial-title {
        display: none
    }
    .projectFactsWrap .item {
        margin-bottom: 0
    }
    .reviews .team-heading-wrapper {
        padding-top: 65px
    }
    .testimonial-section {
        padding: 0 0 50px
    }
    .lets-build-section {
        height: 310px
    }
    .copyright {
        font-size: 12px;
        margin-top: 0
    }
    .getintouch-outer.show .formmain img {
        display: block
    }

}

@media screen and (min-width:992px) {
    .getintouch-outer .modal-dialog {
        max-width: 900px
    }
    #carrer-form {
        overflow-y: hidden
    }
    .main-banner {
        background-image: url(../images/banner/1.jpg);
        height: 100vh
    }
    .banner-content .bannerinnerblock {
        position: relative;
        right: 110px
    }
    .beeline-animation {
        display: block
    }
    .skill-wrapper-inner {
        padding: 40px 30px;
        background: url(../images/skill/inner-bg.jpg);
        background-size: 100%
    }
    .lets-build-section {
        height: 330px
    }
    .our-journey {
        padding: 100px 0;
        height: auto
    }
    .our-journey-inner {
        display: flex
    }
    .about-content {
        margin-left: -25%;
        margin-top: 10%
    }
    .about-wrapper-inner {
        padding: 0 0 100px;
        display: flex
    }
    .main-menu .menu-icon:checked+label,
    .main-menu .menu-icon:not(:checked)+label {
        right: 20px;
        transition: all 1s ease
    }
    .main-menu .nav ul li a {
        font-size: 8vh
    }
    .inline-photo.is-visible .about-img {
        margin-top: 50px
    }
    .projectFactsWrap .item p.number {
        font-size: 2.42em
    }
    .about:before,
    .title-inner-section-heading::after,
    .portfolio:before,
    .reviews:before,
    .ceosection::before {
        font-size: 7em
    }
    .team-heading-wrapper .team-heading-copy {
        font-size: 2.42em;
        margin-top: 0
    }
    .testimonial-section .team-heading-wrapper {
        margin-top: 100px
    }
    .portfolio .team-heading-wrapper {
        margin-top: 100px
    }
    .is-visible.section-ceo-about-profile .ceosection::before {
        left: 16px;
        transform: none;
        top: -139px
    }
    .is-visible.section-ceo-about-profile .ceosection {
        margin-top: 126px
    }
    .section-ceo-about-profile {
        background-position: top right
    }
    .testimonial-section .title-inner-section-heading::after {
        top: -120px
    }
    .followus {
        padding: 15px;
        font-size: 21px;
        line-height: 29px
    }
    .beesolver-culture-section .m-top-25 p {
        font-size: 18px
    }
    .ceosection p {
        font-size: 21px
    }
    .videobackground {
        display: block;
        height: 300px
    }
    .container.content-align {
        top: 80px
    }
    .build-something-title::after {
        font-size: 3em;
        left: 0;
        margin-top: 0
    }
    .lets-build-section h5 {
        text-align: left;
        font-size: 16px;
        margin: 10px 0
    }
    .is-visible .work-with-us {
        font-size: 16px
    }
    .build-text-back {
        width: 500px;
        background-size: 100%
    }
    .container.content-align {
        top: 95px
    }
    .is-visible .text-animation span {
        font-size: 27px
    }
    .portfolio .team-heading-wrapper {
        margin-top: 50px
    }
    .is-visible.section-ceo-about-profile .ceosection {
        margin-top: 0
    }
    .videobackground {
        display: block;
        height: 330px
    }
    .carrer-page h2 {
        font-size: 35px
    }
    .career-form img,
    .workwith-us img {
        width: 70%
    }
}

@media screen and (min-width:1024px) {
    .main-banner {
        overflow: hidden
    }
    .mouse-animation {
        opacity: 1
    }
    .banner-content .bannerinnerblock {
        padding-left: 0
    }
}

@media screen and (min-width:1200px) {
    .banner-content {
        position: absolute;
        top: 50%;
        left: 34%;
        transform: translateY(-50%) translateX(-34%) scale(.91)
    }
    .reviews .team-heading-wrapper {
        padding-top: 145px
    }
    .career-form img,
    .workwith-us img {
        width: 80%
    }
    .main-banner .container,
    .main-banner .container-fluid,
    .main-banner .skill-content {
        transform: scale(.91)
    }
    .afterloadingbody .beeline-animation {
        display: block
    }
    .getintouch-outer p {
        margin-top: 20px
    }
    .getintouch-outer h1 {
        line-height: 38px;
        font-size: 2rem
    }
    .getintouch-outer .close-icon {
        position: absolute;
        right: -11px;
        top: -20px
    }
    .getintouch-inner .banner-btn {
        margin-top: 15px
    }
    .loader {
        background: url(../images/loader-bg.jpg) #000 no-repeat;
        background-size: 100% 100%;
        z-index: 999
    }
    svg.scrolldown {
        display: block
    }
    .followus-menu {
        left: 20px;
        bottom: 127px
    }
    header {
        position: relative;
        z-index: 21;
        padding: 0 100px
    }
    .header-wrapper {
        float: left
    }
    .wavetextaction {
        margin-right: 100px
    }
    .about:before,
    .title-inner-section-heading::after {
        font-size: 8em
    }
    .inline-photo.is-visible .about-img {
        margin-top: 50px
    }
    .journey-video {
        height: auto;
        margin-right: 15px
    }
    .journey-image {
        display: block;
        position: relative;
    }
    .feedback-slider-item p {
        line-height: 1.7;
        font-size: 1em
    }
    .testimonial-section .title-inner-section-heading::after {
        top: -140px
    }
    .reviews .slick-initialized .slick-slide {
        height: auto
    }
    .beesolver-culture-content .culture-heading {
        font-size: 3.42em
    }
    .is-visible.beesolver-culture-section .culture-heading .animated-title {
        top: 50%;
        left: 50%;
        height: 290px;
        width: 550px;
        margin-top: 30px
    }
    .build-text-back {
        width: 800px;
        background: url(../images/build/reach-our-team.png) no-repeat
    }
    .is-visible .text-animation span {
        font-size: 64px
    }
    .videobackground,
    .lets-build-section {
        height: 560px
    }
    .container.content-align {
        top: 160px
    }
    .lets-build-section h5 {
        text-align: left;
        font-size: 24px;
        padding: 6px 31px;
        font-weight: 600;
        margin: 25px 0
    }
    .build-something-title::after {
        font-size: 150px
    }
    .is-visible .work-with-us {
        font-size: 21px;
        font-weight: 900;
        display: block
    }
    .mapouter,
    .gmap_canvas {
        height: 500px
    }
    .address-block {
        padding-left: 45px;
        padding-top: 90px
    }
    .address-block p {
        margin-bottom: 20px
    }
    .contactus,
    .followus {
        padding: 0 15px 10px
    }
    .container-footer .col-md-7 {
        padding: 0
    }
    .ceosection p.signature {
        font-size: 3.2em
    }
    .about-wrapper-inner {
        padding: 100px 0 150px
    }
    .grid-item {
        margin-bottom: 0
    }
    .grid-item.item2 img,
    .grid-item.item6 img {
        height: 381px
    }
    .is-visible.our-journey .our-journey-content .animated-title {
        font-size: 3.42em;
        width: 322px;
        height: 145px
    }
    .is-visible .skill-wrapper-inner {
        padding: 80px 100px
    }
    .getintouch-outer h1 {
        line-height: 38px;
        font-size: 2rem
    }
    .afterloading .lines-outer {
        display: block
    }
    .about-us-title,
    .portfolio-title,
    .teams-title,
    .testimonial-title {
        display: block
    }
    .portfolio .team-heading-wrapper {
        margin-top: 100px
    }
    .testimonial-section .team-heading-wrapper {
        margin-top: 145px
    }
    .copyright {
        font-size: 12px;
        margin-top: 87px
    }
    .is-visible.section-ceo-about-profile .ceosection {
        margin-top: 80px
    }
    .lineAnimated-aboutus {
        left: -190px;
        width: 55%;
        position: absolute;
        bottom: 62px
    }
    .reviews .reviews-slider {
        position: relative;
        height: 300px
    }
    .gallerytext h1 {
        font-size: 72px
    }
    .carrer-banner-description {
        padding-top: 377px
    }
    .beesolvertext {
        padding-left: 395px
    }
    .carrer-page h2 {
        font-size: 51px
    }
    .perks-benefits ul.perk-list-items li {
        width: 33%
    }
    .perks-benefits ul.perk-list-items a {
        font-size: 26px
    }
    .perks-benefits ul.perk-list-items li {
        padding: 20px 40px
    }
    .position-details p.job-location,
    .position-details p.job-experience,
    .position-details p.job-description-heading {
        font-size: 23px;
        margin-bottom: 5px
    }
    .carrer-page p {
        margin-bottom: 15px;
    }
    .beesolvervalues ul {
        font-size: 26px
    }
    .beesolvervalues-outer {
        background: url(../images/beesolver-values-bg.jpg);
        background-size: cover;
        height: 762px
    }
    .beesolvervalues {
        background: #fff;
        padding: 70px 257px
    }
    .perks-benefits ul.perk-list-items {
        margin-top: 50px
    }
    .carrer-banner-description span {
        display: block
    }
    .beesolvervalues ul {
        font-weight: 700
    }
}

@media screen and (min-width:1360px) {
    .mouse-animation {
        position: fixed;
        top: 700px;
        left: 50%;
        transform: translateX(-50%);
        width: 21px;
        cursor: pointer;
        z-index: 99
    }
    .portfolio-btn {
        margin: 70px auto
    }
    .getintouch-outer h1 {
        font-size: 2.5rem
    }
}

@media screen and (max-width:767px) {
    svg {
        width: 100% !important
    }
    .afterloading .lines-outer {
        display: none
    }
    .lineAnimated-ceo {
        width: 100%
    }
    .clients-logo .logoimages {
        display: block
    }
    .clients-logo .logoimages {
        display: block
    }
}

.portfolio-btn:hover .rect-shape {
    fill: #fff
}