Edit in JSFiddle

var myApp = angular.module("myApp", ["aa.formExtensions", "aa.notify"]);

myApp.controller("myCtrl1", ['$scope', function ($scope) {

}]);

<script src="https://rawgit.com/AngularAgility/AngularAgility/master/dist/angular-agility.js"></script>
<div ng-app="myApp">
    <div aa-notify style="position: fixed; bottom: 10px; right: 10px; z-index:1000;"></div>
    <div class="container" ng-controller="myCtrl1">
        <div ng-form="exampleForm" class="form-horizontal">
            <input type="text" aa-field-group="myName" required />
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-3">
                    <button aa-submit-form="save()" class="btn btn-default">Save</button>
                </div>
            </div>
        </div>
    </div>
</div>

input.ng-dirty.ng-valid, select.ng-dirty.ng-valid {
    border: 1px solid Green;
}
input.ng-dirty.ng-invalid, select.ng-dirty.ng-invalid, input.ng-invalid.aa-invalid-attempt, select.ng-invalid.aa-invalid-attempt, input.ng-invalid.aa-had-focus, select.ng-invalid.aa-had-focus, input.explicit-add-error, select.explicit-add-error {
    border: 1px solid Red;
}
div.validation-icons {
    margin-left: -40px;
    margin-top: 5px;
}
div.validation-icons i.fa-check {
    color: green;
}
div.validation-icons i.fa-exclamation-circle {
    color: red;
}
div.validation-error {
    color: red;
    font-weight: bold;
    text-align: left;
    width: 300px;
}