diff --git a/assets/css/style.css b/assets/css/style.css
index f9282cf..cbc9e5e 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -2,67 +2,54 @@
   font-family: 'Lato-Thin';
   src: url(../fonts/Lato-Thin.ttf);
 }
-
 @font-face {
   font-family: 'Lato-Regular';
   src: url(../fonts/Lato-Regular.ttf);
 }
-
 @font-face {
   font-family: 'Lato-LightItalic';
   src: url(../fonts/Lato-LightItalic.ttf);
 }
-
 @font-face {
   font-family: 'Lato-Light';
   src: url(../fonts/Lato-Light.ttf);
 }
-
 @font-face {
   font-family: 'Montserrat-Light';
   src: url(../fonts/Montserrat-Light.otf);
 }
-
 @font-face {
   font-family: 'Montserrat-Hairline';
   src: url(../fonts/Montserrat-Hairline.otf);
 }
-
 @font-face {
   font-family: 'Montserrat-Regular';
   src: url(../fonts/Montserrat-Regular.otf);
 }
-
 @font-face {
   font-family: 'Montserrat-SemiBold';
   src: url(../fonts/Montserrat-SemiBold.otf);
 }
-
 @font-face {
   font-family: 'Montserrat-UltraLight';
   src: url(../fonts/Montserrat-UltraLight.otf);
 }
-
 @font-face {
   font-family: 'OpenSans-Light';
   src: url(../fonts/OpenSans-Light.ttf);
 }
-
 @font-face {
   font-family: 'OpenSans-Regular';
   src: url(../fonts/OpenSans-Regular.ttf);
 }
-
 @font-face {
   font-family: 'Georgia-Regular';
   src: url(../fonts/georgia.ttf);
 }
-
 @font-face {
   font-family: 'FabfeltScript';
   src: url(../fonts/FabfeltScript-Bold.otf);
 }
-
 /* line 56, ../sass/_typography.scss */
 body {
   -webkit-font-smoothing: antialiased;
@@ -1636,34 +1623,40 @@ body {
   color: #1f62ae;
   transition: 1s;
 }
+/* line 232, ../sass/_event.scss */
+.comment-section .actions .author {
+  color: #303030;
+  font-weight: 700;
+  margin: 0;
+}
 
-/* line 236, ../sass/_event.scss */
+/* line 241, ../sass/_event.scss */
 .event-sidebar .owl-carousel {
   background: none;
   margin: 0;
 }
-/* line 241, ../sass/_event.scss */
+/* line 246, ../sass/_event.scss */
 .event-sidebar .participants img {
   border-radius: 5px;
 }
-/* line 245, ../sass/_event.scss */
+/* line 250, ../sass/_event.scss */
 .event-sidebar .author {
   display: block;
   margin-left: 4em;
   line-height: 50%;
   margin-top: 1em;
 }
-/* line 250, ../sass/_event.scss */
+/* line 255, ../sass/_event.scss */
 .event-sidebar .author a {
   color: #303030;
   font-weight: 700;
   font-size: 1.2em;
 }
-/* line 256, ../sass/_event.scss */
+/* line 261, ../sass/_event.scss */
 .event-sidebar .about-author {
   margin: 3em 0;
 }
-/* line 258, ../sass/_event.scss */
+/* line 263, ../sass/_event.scss */
 .event-sidebar .about-author p {
   font-style: italic;
   color: #666666;
@@ -1671,16 +1664,16 @@ body {
   line-height: 150%;
   text-align: justify;
 }
-/* line 267, ../sass/_event.scss */
+/* line 272, ../sass/_event.scss */
 .event-sidebar .form .form-control {
   border: #888888 solid 1px;
   border-radius: 2px;
 }
-/* line 270, ../sass/_event.scss */
+/* line 275, ../sass/_event.scss */
 .event-sidebar .form .form-control:focus {
   box-shadow: none;
 }
-/* line 274, ../sass/_event.scss */
+/* line 279, ../sass/_event.scss */
 .event-sidebar .form .subscribe-btn {
   color: #fff;
   background: #ed145b;
@@ -1691,7 +1684,7 @@ body {
 .gradient1 {
   background: #556270;
   /* fallback for old browsers */
-  background: -webkit-linear-gradient(to left, #556270, #ff6b6b);
+  background: -webkit-linear-gradient(to left, #556270, #FF6B6B);
   /* Chrome 10-25, Safari 5.1-6 */
   background: linear-gradient(to left, #556270, #ff6b6b);
   /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
@@ -1701,7 +1694,7 @@ body {
 .reef {
   background: #50C9C3;
   /* fallback for old browsers */
-  background: -webkit-linear-gradient(to left, #50c9c3, #96deda);
+  background: -webkit-linear-gradient(to left, #50C9C3, #96DEDA);
   /* Chrome 10-25, Safari 5.1-6 */
   background: linear-gradient(to left, #50c9c3, #96deda);
   /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
diff --git a/assets/js/message.js b/assets/js/message.js
index ae269ba..927d144 100644
--- a/assets/js/message.js
+++ b/assets/js/message.js
@@ -6,7 +6,6 @@ $(function () {
         var data = $(this).serialize();
         $.post(url, data).done(function(response){
             $('#result').prepend(response);
-            location.reload();
             $('.form-comments').trigger("reset");
             data = {};
         });
@@ -14,7 +13,7 @@ $(function () {
     });
 
     //reply to a comment
-    $('.reply').on('click', function (e) {
+    $(document).on('click', '.reply', function (e) {
         e.preventDefault();
         var parent = $(this).parent(); 
 
@@ -28,7 +27,6 @@ $(function () {
 
             $.post(url, form).done(function (response) {
                 parent.find('.reply-list').append(response);
-                location.reload();
                 $('.form-reply').trigger("reset");
                 data = {};
             });
diff --git a/events/api.py b/events/api.py
index 62443cc..aca71e6 100644
--- a/events/api.py
+++ b/events/api.py
@@ -3,8 +3,10 @@
 from rest_framework.viewsets import ViewSet
 from rest_framework.response import Response
 from rest_framework.permissions import AllowAny
+from rest_framework.renderers import JSONRenderer, TemplateHTMLRenderer
 from .models import Event, EventComment, Feedback
 from .serializers import EventSerializer, EventCommentSerializer, FeedbackSerializer
+from .forms import EventCommentForm
 
 from braces.views import LoginRequiredMixin
 
@@ -61,6 +63,7 @@ class EventCommentsAPI(LoginRequiredMixin, ViewSet):
     """API endpoint for the list of comments for specific event
     """
     serializer_class = EventCommentSerializer
+    renderer_classes = (TemplateHTMLRenderer, JSONRenderer)
 
     def list(self, *args, **kwargs):
         event_id = kwargs.get('event_id')
@@ -78,8 +81,22 @@ def create_comment(self, request, **kwargs):
                                             event_title=event_id,
                                             user=self.request.user.id))
         if serializer.is_valid():            
-            serializer.save()
-            return Response(serializer.data, status=201)
+            saved_data = serializer.save()
+
+            # build comment dict to be used on the comment template
+            result_comment = {
+                'event': { 'id': event_id },
+                'comment': { 'id': saved_data.id },
+                'form': EventCommentForm(),
+                'profile': saved_data.user,
+                'message': {
+                    'message': saved_data.comment,
+                    'get_full_name': saved_data.user.get_full_name(),
+                    'message_date': saved_data.comment_date
+                }
+            }
+
+            return Response(result_comment, status=201, template_name='events/comment.html')
         return Response(serializer.errors, status=400)
 
     def get_comment(self, request, **kwargs):
@@ -105,6 +122,7 @@ class EventCommentReplyAPI(LoginRequiredMixin, ViewSet):
     """API endpoint for the list of replies for a specific comment
     """
     serializer_class = EventCommentSerializer
+    renderer_classes = (TemplateHTMLRenderer, JSONRenderer)
     
     def list(self, *args, **kwargs):
         event_id = kwargs.get('event_id')
@@ -125,8 +143,13 @@ def create_reply(self, request, **kwargs):
                                             user=self.request.user.id,
                                             parent=comment_id))
         if serializer.is_valid():            
-            serializer.save()
-            return Response(serializer.data, status=201)
+            saved_data = serializer.save()
+
+            # build comment dict to be used on the comment template
+            result_reply = {
+                'reply': saved_data,
+            }
+            return Response(result_reply, status=201, template_name='events/reply.html')
         return Response(serializer.errors, status=400)
 
     def get_reply(self, request, **kwargs):
diff --git a/events/models.py b/events/models.py
index 4d77371..26516ee 100644
--- a/events/models.py
+++ b/events/models.py
@@ -96,4 +96,4 @@ class EventComment(models.Model):
     comment_date = models.DateTimeField(auto_now_add=True)
 
     def __str__(self):
-        return "{user} {comment}".format(user=self.user, comment=self.comment)
+        return "{user} {comment}".format(user=self.user, comment=self.comment)
\ No newline at end of file
diff --git a/templates/events/comment.html b/templates/events/comment.html
index c581233..e65351f 100644
--- a/templates/events/comment.html
+++ b/templates/events/comment.html
@@ -17,22 +17,24 @@
                      {{ message.message }}
                 </p>
             </div>
+
             <div class="actions">
+                <div class="reply-list">
+                </div>
                 <a href="#" class="reply">Reply</a>
                 <a href="#" class="favorite"><i class="fa fa-heart " aria-hidden="true"></i> <span>1</span> Favorite</a>
-                <div class="comment-reply hide">
-                 <form class="form-messages" method="post" >
-                    {% csrf_token %}
-                    <div class="event-content">
-                            <input type="hidden" class="parent-id" value="{{ message.id }}"/>
-                             {{ form.message }}
+                <div class="comment-reply hide">                               
+                    <form class="form-reply" action="{% url 'reply_list' event.id comment.id %}">
+                        {% csrf_token %}
+                        <input type="hidden" class="parent-id" value="{{ comment.id }}"/>
+                            {{ form.comment }}
                         <div class="text-right">
-                            <button class="btn post">Post</button>
+                            <button class="btn post">Reply</button>
                         </div>
-                    </div>
-                </form>
+                    </form>
                 </div>
             </div>
+
         </div>
     </div>
 </div>
diff --git a/templates/events/detail.html b/templates/events/detail.html
index af83aa8..2b7c944 100644
--- a/templates/events/detail.html
+++ b/templates/events/detail.html
@@ -66,6 +66,26 @@ <h5>
                                     </p>
                                 <div class="actions">
                                     <div class="reply-list">
+                                        {% for reply in comment.replies.all %}
+                                        
+                                            <div class="comment">
+                                                <a href="#" class="avatar">
+                                                    <img src="{{ reply.user.profile_picture|get_image_url }}">
+                                                </a>
+                                                <div class="content">
+                                                    <a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
+                                                    <a href="#" class="author">{{ reply.user.get_full_name }}</a>
+                                                    <div class="metadata">
+                                                        <span class="date">{{ reply.comment_date | timesince }}</span>
+                                                    </div>
+                                                    <div class="text">
+                                                        <p>
+                                                            {{ reply.comment }}
+                                                        </p>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        {% endfor %}
                                     </div>
                                     <a href="#" class="reply">Reply</a>
                                     <a href="#" class="favorite"><i class="fa fa-heart " aria-hidden="true"></i> <span>1</span> Favorite</a>
@@ -82,26 +102,7 @@ <h5>
                                 </div>
                                 </div>
                                 
-                                {% for reply in comment.replies.all %}
-                               
-                                    <div class="comment">
-                                        <a href="#" class="avatar">
-                                            <img src="{{ reply.user.profile_picture|get_image_url }}">
-                                        </a>
-                                        <div class="content">
-                                            <a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
-                                            <a href="#" class="author">{{ reply.user.get_full_name }}</a>
-                                            <div class="metadata">
-                                                <span class="date">{{ reply.comment_date | timesince }}</span>
-                                            </div>
-                                            <div class="text">
-                                                <p>
-                                                    {{ reply.comment }}
-                                                </p>
-                                            </div>
-                                        </div>
-                                    </div>
-                                {% endfor %}
+
                             </div>
                         </div>
                     </div>                 
diff --git a/templates/events/reply.html b/templates/events/reply.html
index a9dae88..25afdcf 100644
--- a/templates/events/reply.html
+++ b/templates/events/reply.html
@@ -1,23 +1,20 @@
 {% load staticfiles profile %}
 
 
-<div class="event-content comment-section">
-    <div class="comment">
-        <a href="#" class="avatar">
-            <img src="{{ profile.profile_picture|get_image_url }}">
-        </a>
-        <div class="content">
-            <a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
-            <a href="#" class="author">{{ message.user.get_full_name }}</a>
-            <div class="metadata">
-                <span class="date">{{ message.message_date | timesince }}</span>
-            </div>
-            <div class="text">
-                <p>
-                     {{ message.message }}
-                </p>
-            </div>
-            
+<div class="comment">
+    <a href="#" class="avatar">
+        <img src="{{ reply.user.profile_picture|get_image_url }}">
+    </a>
+    <div class="content">
+        <a href="#" class="pull-right close"><i class="fa fa-times" aria-hidden="true"></i></a>
+        <a href="#" class="author">{{ reply.user.get_full_name }}</a>
+        <div class="metadata">
+            <span class="date">{{ reply.comment_date | timesince }}</span>
+        </div>
+        <div class="text">
+            <p>
+                {{ reply.comment }}
+            </p>
         </div>
     </div>
 </div>