@media (max-width: 576px) {
    #block-crabitoo-heroimage {
        width: 100%;
        margin: 0;
        width: 100%;
    }

    h3 {
        font-size: 2.5rem;
    }

    .region-hero>div {
        padding: .5rem;
        width: 100%;
    }

    #block-crabitoo-herocontent {
        padding: 1rem;
        width: 100%;
        margin: 0;
    }

    #hero {
        min-height: auto;
        height: auto;
    }

    #block-crabitoo-herocontent h1 {
        font-size: 3.2rem;
        line-height: 3.8rem;
        margin-top: 0;
        margin-bottom: 1rem;
        -webkit-text-stroke: 1px #002870;
    }

    #block-crabitoo-ourmission ul li h4 {
        font-size: 1.5rem;
    }

    .navbar-brand {
        margin-left: .5rem;
    }

    .path-frontpage h2 {
        font-size: 1rem;
    }

    #about {
        margin-top: 1rem;
    }

    footer {
        padding: 2rem 0;
    }

    #block-crabitoo-contactinformation {
        margin-left: 0;
    }

    #block-crabitoo-logoandtext p {
        margin-top: 2rem;
    }

    #block-crabitoo-ourmission .field--name-body ul li {
        min-height: 420px;
    }

    #block-crabitoo-ourmission .field--name-body ul li p {
        font-weight: 300;
        font-size: 1.4rem;
        line-height: 1.8rem;
        margin: auto;
    }


    #block-crabitoo-ourmission .field--name-body ul li .front img {
        top: 30px;
        left: 30px;
    }

    #accordionFlush,
    .accordion-body {
        height: auto;
    }

    #mission {
        padding-bottom: 0;
    }

    #block-crabitoo-premiumservices {
        margin-top: 0;
    }

    #why-choose-us {
        margin-top: 0;
    }

    .card-element {
        width: 100%;
        padding-right: 0;
    }

    .region {
        padding: 0 .5rem;
    }

    #why-choose-us {
        padding: 2rem 0;
    }

    #block-crabitoo-imagewhychooseus::after,
    #block-crabitoo-imageweareamericans::after {
        top: 1.5rem;
        left: -.5rem;
        width: 105%;
        height: 100%;
        rotate: -8deg;
    }

    #block-crabitoo-imageweareamericans::after {
        height: 90%;
    }

    #block-crabitoo-imageweareamericans::before {
        height: 90%;
        left: -.5rem;
    }

    /* #block-crabitoo-imagewhychooseus::before {
        top: 0;
        left: 0;
        width: 110%;
        height: 120%;
       
    }*/

    #block-crabitoo-imagewhychooseus::before {
        top: 1.5rem;
        left: 0;
        height: 80%;
        width: 100%;
    }

    .path-about .image-content,
    #block-crabitoo-imagewhychooseus,
    #block-crabitoo-aboutusimage,
    #block-crabitoo-imageweareamericans {
        overflow: hidden;
    }

    #block-crabitoo-imagewhychooseus,
    #block-crabitoo-aboutusimage,
    #block-crabitoo-imageweareamericans {
        width: 100%;
        margin-bottom: 3rem;
    }

    #block-crabitoo-whychooseus {
        margin-top: 2rem;
    }

    #block-crabitoo-aboutus {
        padding: 0 .5rem;
    }

    #block-crabitoo-imageheroservices,
    #block-crabitoo-imageheropricing,
    #block-crabitoo-imageherocontact,
    #block-crabitoo-wanttojoinus .image-content {
        width: 100%;
        margin-top: 3rem;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    #block-crabitoo-aboutusimage,
    #block-crabitoo-wanttojoinus .image-content,
    .path-about #block-crabitoo-content .image-content {
        width: 85%;
        padding-top: 0;
        margin: 0 auto;
    }

    #block-crabitoo-aboutus ul li {
        font-size: 1rem;
        padding-left: .3rem;
    }

    #block-crabitoo-animatedscrollmistakes {
        margin-top: 0;
    }

    #block-crabitoo-aboutusimage::before {
        left: 1.5rem;
    }

    .carousel-content {
        margin-bottom: 0;
        width: 100%;
        height: 90%;
        margin-top: 0rem;
        padding-top: 0;
    }

    .carousel-content::before {
        top: 1.5rem;
        left: .5rem;
    }

    .carousel-content::after {
        right: .5rem;
    }

    #block-crabitoo-aboutusimage::after {
        right: -.5rem;
    }

    /* #block-crabitoo-herocontent h1 span.change-color {
        color: #002870;
        -webkit-text-stroke: 1px var(--bs-white);
    }

    #block-crabitoo-herocontent h1 span.add-border {
        -webkit-text-stroke: 1px #002870;
    } */

    #block-crabitoo-ourmission .field--name-body ul li {
        width: 100%;
        margin-bottom: 2.5rem;
        margin-right: 1rem;
        margin-left: 1rem;
    }

    #block-crabitoo-technologiesweuse .card-item {
        width: 47%;
    }

    #accordion h2 {
        font-size: 1rem;
    }

    #accordion {
        padding: 2rem 0;
    }

    #accordion-image-wrapper {
        display: none;
    }

    #accordionFlush {
        width: 100% !important;
        padding: 0 .5rem;
    }

    #block-crabitoo-ourdetailedservices .tab-pane ul {
        width: 100%;
        order: 2;
    }

    #block-crabitoo-ourdetailedservices #myTabContent .tab-pane p {
        margin-bottom: .5rem;
    }

    #block-crabitoo-ourdetailedservices .nav-tabs {
        margin-top: .5em;
        flex-direction: column;
    }

    .nav-tabs .nav-item {
        border-right: none;
    }

    #services {
        margin: 3rem 0 0;
    }

    .btn-primary {
        background: linear-gradient(to left, var(--bs-orange-yellow), var(--bs-orange));
    }

    #block-crabitoo-ourdetailedservices button.nav-link,
    #block-crabitoo-pricingtable button.nav-link {
        height: 46px;
    }

    #block-crabitoo-ourdetailedservices button.nav-link.active,
    #block-crabitoo-pricingtable button.nav-link.active {
        border-radius: 30px;
        font-size: 1.1rem;
        margin: 1rem 0;
        padding: .5rem 1rem .8rem;
    }

    #block-crabitoo-ourdetailedservices #myTabContent .explanation {
        width: 100%;
        order: 1;
        margin-top: 1rem;
    }

    #block-crabitoo-ourdetailedservices {
        padding: 0 .5rem;
    }

    #contact-left,
    #contact-right {
        width: 100%;
    }

    #contact-wrapper .container {
        flex-wrap: wrap;
    }

    #contact-left .container {
        padding: 0;
    }

    #contact-left {
        margin-right: 0;
        padding: 0;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    #contact-right {
        margin-top: 0;
    }

    #contact-right.container {
        padding-left: 0;
    }

    .field--name-field-last-name,
    .field--name-field-first-name,
    .field--name-field-company,
    .field--name-field-email {
        margin-right: 0;
    }

    .form-item {
        margin-bottom: 0;
    }

    #contact-right {
        margin-bottom: 2rem;
        margin-top: 2rem;
    }

    #block-crabitoo-imagerightside::after {
        width: 70%;
        right: 2rem;
    }

    .path-contact #edit-actions {
        margin-top: 2rem;
    }

    #block-crabitoo-digitalexpertise {
        margin: 2rem 0 4rem;
    }

    .accordion-button {
        align-items: start;
    }

    .path-about #block-crabitoo-content {
        margin-bottom: 2rem;
    }

    .path-about #block-crabitoo-content .image-content::before {
        height: 100%;
        width: 115%;
    }

    .path-about #block-crabitoo-content .image-content::after {
        height: 100%;
    }

    #block-crabitoo-wanttojoinus .image-content {
        margin-bottom: 3rem;
    }

    #block-crabitoo-wanttojoinus h3 {
        margin-top: 0;
    }

    #block-crabitoo-imagecrabitoo {
        width: 80%;
        margin-bottom: 3rem;
        margin: 0rem auto 3rem;
    }

    #block-crabitoo-imagecrabitoo::before {
        height: 100%;
    }

    #block-crabitoo-wanttojoinus h2 {
        margin: 1rem auto 1rem;
    }

    .path-pricing #block-crabitoo-content .price {
        text-align: center;
    }

    .path-pricing #block-crabitoo-content #marketing li {
        flex-direction: column;
    }

    .path-pricing #block-crabitoo-content #marketing .inline-price {
        justify-content: end;
    }

    .path-pricing #block-crabitoo-content #marketing .inline-price {
        width: 100% !important;
        margin-top: .5rem;
    }
}