.error-box {
            color: #000;
            width: 200px;
            text-align: center;
            border: 3px solid #000;
            padding: 10px;
            display: block;
            position: absolute;
            margin-left: 480px;
            border-radius: 5px;
            border: 3px solid #CF272F;
            margin-top: -15px;
            max-height: 40px;
            overflow-y: scroll;
            font-size: 12px;

        }


        .error-detected {
          color: red!important;
          border: 3px solid red !important;
          margin-top: -30px;
        }





        @media screen and (max-width: 1650px) {
          .error-box {

                      margin-left: 390px;


                  }
        }



        @media screen and (max-width: 1450px) {
          .error-box {

                      margin-left: 340px;


                  }
        }




        @media screen and (max-width: 1250px) {
          .error-box {

                      margin-left: 260px;


                  }
        }


        @media screen and (max-width: 1050px) {
          .error-box {

                      margin-left: 190px;


                  }
        }



        @media screen and (max-width: 850px) {
          .error-box {

                      margin-left: 190px;
                      margin-top: 20px;
                      max-height: 30px;

                  }
        }


        @media screen and (max-width: 650px) {
          .error-box {

                      margin-left: 100px;
                      margin-top: 20px;
                      max-height: 30px;

                  }
        }



        @media screen and (max-width: 450px) {
          .error-box {

                      margin-left: 40px;
                      margin-top: 20px;
                      max-height: 30px;

                  }
        }