 .error-message {
            color: red;
            font-size: 12px;
            margin-top: 5px;
        }

        .error {
            border: 1px solid red;
        }

        .process {
            padding: 80px 0px;
            background: url(../images/bg-fixed1.jpg);
            width: 100%;
            float: left;
        }

        .wrap {
            max-width: 1200px;
            height: 375px;
            margin: auto;
            position: relative;
        }

        /* ================= ROWS ================= */
        .row {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .top-row {
            position: absolute;
            top: 20px;
            width: 100%;
        }

        .bottom-row {
            position: absolute;
            bottom: 20px;
            width: 100%;
        }

        /* ================= STEPS ================= */
        .step {
            width: 386px;
            height: 80px;
            display: flex;
            align-items: center;
            position: relative;
        }

        /* TEXT */
        .text {
            flex: 1;
            height: 115%;
            display: flex;
            align-items: center;
            padding-left: 30px;
            font-size: 18px;
            font-weight: 700;
            color: #fff;
            border-radius: 8px;
        }

        /* ICON */
        .icon {
            width: 90px;
            height: 100%;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
        }
        .icon img{
                width: 60%;
                padding: 5px;
        }

        /* COLORS */
        .teal .text {
            background: #4c8d9a;
        }

        .yellow .text {
            background: #f4b740;
        }

        /* SHAPES */
        .step.top .text {
            clip-path: polygon(0 0, 95% 0, 88% 100%, 0 100%);
            margin-right: -12%;
        }

        .step.bottom .text {
            clip-path: polygon(12% 0, 100% 0, 100% 100%, 5% 100%);
            margin-left: 2%;
            padding-left: 0;
            padding-right: 76px;
            justify-content: flex-end;
            margin-right: -41px;
            border-radius: 8px;
        }

        .step.bottom .text {
            clip-path: polygon(0 0,
                    97% 0,
                    100% -13%,
                    87% 100%,
                    0 100%)
        }


        /* RIGHT STEPS */
        .step.right {
            flex-direction: row-reverse;
        }

        /* ================= ARROWS ================= */
        .arrow {
            position: absolute;
            width: 110px;
        }

        .arrow img {
            width: 54%;
            position: absolute;
            right: 23%;
        }

        /* RIGHT */
        .arrow-right {
            top: 0px;
            left: 50%;
            transform: translateX(-50%);
        }

        /* DOWN */
        .arrow-down {
            right: 165px;
            top: 180px;
            transform: rotate(90deg);
        }

        /* LEFT */
        .arrow-left {

            left: 48%;
            transform: translateX(-50%) rotate(0deg);
            top: 5%;
        }

        /* UP */
        .arrow-up {
            left: 135px;
            top: 180px;
            transform: rotate(-90deg);
        }

        .content-para {
            width: 100%;
        }

        .content-para p {
            text-align: center;
            margin: 25px auto;
            float: none;
        }

        .img-sec {
            display: none;
        }

        .arrow-bottom img {
            width: 54%;
            position: absolute;
            right: 1%;
        }



        @media only screen and (min-width: 0px) and (max-width: 500px) {
            .wrap {
                display: none;
            }

            .img-sec {
                width: 100%;
                float: left;
                display: block;
            }

            .img-sec img {
                width: 100%;
                padding: 15px;
            }

            .content-para {
                width: 100%;
                float: left;
                text-align: center;
                padding: 10px;
            }

            .content-para p {
                text-align: center;
                margin: 36px auto 0px;
                float: none;
            }
        }

        @media only screen and (min-width: 501px) and (max-width: 1000px) {
            .wrap {
                display: none;
            }

            .img-sec {
                width: 100%;
                float: left;
                display: block;
                justify-content: center;
                align-items: center
            }

            .img-sec img {
                width: 60%;
                position: relative;
                /* justify-content: center; */
                left: 21%;
            }

            .content-para {
                width: 100%;
                float: left;
                text-align: center;
            }

            .content-para p {
                text-align: center;
                margin: 36px auto 0px;
                float: none;
            }

         
        }


        /* ================= MOBILE ================= */
        @media (max-width: 800px) {
            .wrap {
                height: auto;
            }

            .row,
            .arrow {
                position: relative;
                transform: none;
            }

            .arrow {
                display: block;
            }

            .step {
                width: 100%;
                margin-bottom: 45px;
            }

            .text {
                font-size: 14px;
            }


        }

        .project03 {
            padding: 5rem 0;
            background: url(../images/bg-fixed-last.jpg) !important;
            width: 100%;
            float: left;
        }