diff --git a/Web/Presenters/templates/Group/View.xml b/Web/Presenters/templates/Group/View.xml
index e09e3f5f..c027ec08 100644
--- a/Web/Presenters/templates/Group/View.xml
+++ b/Web/Presenters/templates/Group/View.xml
@@ -96,9 +96,48 @@
 <div class="right_small_block">
     {var $avatarPhoto = $club->getAvatarPhoto()}
     {var $avatarLink = ((is_null($avatarPhoto) ? FALSE : $avatarPhoto->isAnonymous()) ? "/photo" . ("s/" . base_convert((string) $avatarPhoto->getId(), 10, 32)) : $club->getAvatarLink())}
-    <a href="{$avatarLink|nocheck}">
-        <img src="{$club->getAvatarUrl('normal')}" style="width: 100%; image-rendering: -webkit-optimize-contrast;" />
-    </a>
+    <div id="avatark" style="position:relative;width:100%;"
+        onmouseover="
+            avatarChange.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
+            avatarChange.style.opacity = '1';
+            _avatarDelete.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
+            _avatarDelete.style.opacity = '1';
+            deleteButton.style.opacity = '1';
+            "
+        onmouseleave="
+            avatarChange.style.backgroundColor = 'rgba(0, 0, 0, 0)';
+            avatarChange.style.opacity = '0';
+            _avatarDelete.style.backgroundColor = 'rgba(0, 0, 0, 0)';
+            _avatarDelete.style.opacity = '0';
+            deleteButton.style.opacity = '0';
+        ">
+        {if !is_null($thisUser) && $club->canBeModifiedBy($thisUser)}
+            {if is_null($avatarPhoto) == true}
+            <a href="/club{$club->getId()}/edit" id="_newAvatarPicture" class="newpict" style="position:absolute;margin-left:0;margin-right:0;">{_add_photo}</a>
+            {else}
+            <a id="_avatarDelete" href="/photo{$club->getAvatarPhoto()->getPrettyId()}/delete"
+                        style="position:absolute;right:0;top:0;background-color:rgba(51, 51, 51, 0); border-radius: 0px 0px 3px 3px;padding:2px;padding-left:3px;"><img id="deleteButton" src="/assets/packages/static/openvk/img/delete.png" style="opacity:0;"></a>
+                <ul id="avatarChange" style="position:absolute;width:100px;background-color:rgba(51, 51, 51, 0);list-style-type: none;font-size:11px;padding-top:10px;padding-bottom:10px;opacity:0%;">
+                        <li id="ff">
+                            <img src="/assets/packages/static/openvk/img/upload.png" style="position:absolute;left:0;margin-left:20px;"><a href="/club{$club->getId()}/edit" id="_newAvatarPicture" style="color:#B2B2B2;" onmouseover="_newAvatarPicture.style.color = '#D9D9D9';" onmouseleave="_newAvatarPicture.style.color = '#B2B2B2';"> {tr("new_photo")}</a>
+                        </li>
+                        <!--<li><img src="/assets/packages/static/openvk/img/miniature.png"><a href="javascript:alert('')" id="_changeMiniature" style="color:#B2B2B2;" onmouseover="_changeMiniature.style.color = '#D9D9D9';" onmouseleave="_changeMiniature.style.color = '#B2B2B2';">{tr("change_miniature")}</a></li>-->
+                </ul>
+            {/if}
+        {/if}
+        {if is_null($avatarPhoto) == false}<a href="/photo{$club->getAvatarPhoto()->getPrettyId()}"
+        {else}<a href="javascript:void(0)"
+        {/if}>
+        <img id="clubAvatar" src="{$club->getAvatarUrl('normal')}" style="width: 100%; image-rendering: -webkit-optimize-contrast;"></a>
+        <script>
+            //_newAvatarPicture.style.marginTop = clubAvatar.height-30+"px";
+            window.addEventListener("load", event => {
+                    let image = clubAvatar;
+                    avatarChange.style.marginTop = image.height-33+"px";
+                    avatarChange.style.width = image.width/1.25+"px"
+            });
+        </script>
+    </div>
     <div n:ifset="$thisUser" id="profile_links">
         {if $club->canBeModifiedBy($thisUser)}
             <a href="/club{$club->getId()}/edit" id="profile_link">{_edit_group}</a>
diff --git a/Web/Presenters/templates/User/View.xml b/Web/Presenters/templates/User/View.xml
index d184a54a..c0a78ec6 100644
--- a/Web/Presenters/templates/User/View.xml
+++ b/Web/Presenters/templates/User/View.xml
@@ -70,10 +70,51 @@
     
     <div class="left_small_block">
         <div style="margin-left: auto;margin-right: auto;display: table;">
-            <a href="{$user->getAvatarLink()|nocheck}">
-                <img src="{$user->getAvatarUrl('normal')}"
-                     alt="{$user->getCanonicalName()}"
-                     style="width: 100%; image-rendering: -webkit-optimize-contrast;" />
+            <div
+            {if !is_null($thisUser) && $user->getId() == $thisUser->getId()} onmouseover="
+                {if is_null($user->getAvatarPhoto()) == false && $user->getAvatarPhoto()->getURL() != "$serverUrl/assets/packages/static/openvk/img/camera_200.png"}
+                _avatarDelete.style.backgroundColor='rgba(0, 0, 0, 0.7)';
+                deleteButton.style.opacity='100%';
+                {/if}
+                avatarChange.style.backgroundColor='rgba(0, 0, 0, 0.7)';
+                avatarChange.style.opacity='100%';
+                "
+                onmouseleave="
+                {if is_null($user->getAvatarPhoto()) == false && $user->getAvatarPhoto()->getURL() != "$serverUrl/assets/packages/static/openvk/img/camera_200.png"}
+                _avatarDelete.style.backgroundColor='rgba(0, 0, 0, 0)';
+                deleteButton.style.opacity='0%';
+                {/if}
+                avatarChange.style.backgroundColor='rgba(0, 0, 0, 0)';
+                avatarChange.style.opacity='0%';
+                //pizdec
+                "{/if}>
+            <div n:if="!is_null($thisUser) && $user->getId() == $thisUser->getId()">
+                <div id="avatarEdit" style="position:relative;">
+                    <div n:if="is_null($user->getAvatarPhoto()) == false && $user->getAvatarPhoto()->getURL() != '$serverUrl/assets/packages/static/openvk/img/camera_200.png'">
+                        <a id="_avatarDelete" href="/photo{$user->getAvatarPhoto()->getPrettyId()}/delete"
+                            style="position:absolute;right:0;top:0;background-color:rgba(51, 51, 51, 0); border-radius: 0px 0px 3px 3px;padding:2px;padding-left:3px;">
+                    <img id="deleteButton" src="/assets/packages/static/openvk/img/delete.png" style="opacity:0;"></a>
+                    </div>
+                </div>
+                <ul id="avatarChange" style="position:absolute;width:100px;background-color:rgba(51, 51, 51, 0);list-style-type: none;font-size:11px;padding-top:10px;padding-bottom:10px;opacity:0%;">
+                        <li><img src="/assets/packages/static/openvk/img/upload.png" style="position:absolute;left:0;margin-left:20px;"><a href="/al_avatars" id="_newPicture" style="color:#B2B2B2;" onmouseover="_newPicture.style.color = '#D9D9D9';" onmouseleave="_newPicture.style.color = '#B2B2B2';"> {tr("new_photo")}</a></li>
+                        <!--<li><img src="/assets/packages/static/openvk/img/miniature.png"><a href="javascript:alert('')" id="_changeMiniature" style="color:#B2B2B2;" onmouseover="_changeMiniature.style.color = '#D9D9D9';" onmouseleave="_changeMiniature.style.color = '#B2B2B2';">{tr("change_miniature")}</a></li>-->
+                </ul>
+                 
+            </div>
+                <a href="{$user->getAvatarLink()|nocheck}">
+                    <img src="{$user->getAvatarUrl('normal')}"
+                        id="avatarImage"
+                        alt="{$user->getCanonicalName()}"
+                        style="max-width:100%; image-rendering: -webkit-optimize-contrast;" />
+                <script>
+                    window.addEventListener("load", event => {
+                        let image = avatarImage;
+                        avatarChange.style.marginTop = image.height-32+"px";
+                        avatarChange.style.width = image.width/1.25+"px"
+                    });
+                 </script>
+            </div>
             </a>
         </div>
         <div n:ifset="$thisUser" id="profile_links">
diff --git a/Web/static/img/delete.png b/Web/static/img/delete.png
new file mode 100644
index 00000000..352df253
Binary files /dev/null and b/Web/static/img/delete.png differ
diff --git a/Web/static/img/miniature.png b/Web/static/img/miniature.png
new file mode 100644
index 00000000..6eeb6277
Binary files /dev/null and b/Web/static/img/miniature.png differ
diff --git a/Web/static/img/upload.png b/Web/static/img/upload.png
new file mode 100644
index 00000000..e6280bc4
Binary files /dev/null and b/Web/static/img/upload.png differ
diff --git a/Web/static/js/openvk.cls.js b/Web/static/js/openvk.cls.js
index 0ecc385e..571223a0 100644
--- a/Web/static/js/openvk.cls.js
+++ b/Web/static/js/openvk.cls.js
@@ -65,7 +65,6 @@ function toggleMenu(id) {
         });
     }
 }
-
 document.addEventListener("DOMContentLoaded", function() { //BEGIN
 
     u("#_photoDelete").on("click", function(e) {
@@ -88,7 +87,66 @@ document.addEventListener("DOMContentLoaded", function() { //BEGIN
         
         return e.preventDefault();
     });
-
+    u("#_avatarDelete").on("click", function(e) {
+        var formHtml = "<form id='tmpPhDelF' action='" + u(this).attr("href") + "' >";
+        formHtml    += "<input type='hidden' name='hash' value='" + u("meta[name=csrf]").attr("value") + "' />";
+        formHtml    += "</form>";
+        u("body").append(formHtml);
+        
+        MessageBox(tr('prevention'), tr('delete_photo'), [
+            tr('delete'),
+            tr('close')
+        ], [
+            (function() {
+                u("#tmpPhDelF").nodes[0].submit();
+            }),
+            (function() {
+                u("#tmpPhDelF").remove();
+            }),
+        ]);
+        
+        return e.preventDefault();
+    });
+    u("#_newPicture").on("click", function(e) {
+        MessageBox(tr('new_photo'), 
+        "<form id='tmpPhDelF' action='" + u(this).attr("href") + "' method='POST' enctype='multipart/form-data'>"+
+        "<div id='tmpdd' style='text-align:center'>"+tr('real_photo')+"<br><br>"+tr('formats')+"<br><br>"+"<input type='file' accept='image/*' name='blob' value='"+tr('select_file')+"'><br><br>"+tr('upload_problems')+"<br></div>"+
+        //"<p><input type='checkbox' name='makeAvatarPost'>"+tr('leave_photo')+"</p>"+
+        "<input type='hidden' name='hash' value='" + u("meta[name=csrf]").attr("value") + "' />"+
+        "</form>", [
+            tr('upload_button'),
+            tr('close')
+        ], [
+            (function() {
+                u("#tmpPhDelF").nodes[0].submit();
+            }),
+            (function() {
+                u("#tmpPhDelF").remove();
+            }),
+        ]);
+        
+        return e.preventDefault();
+    });
+    u("#_newAvatarPicture").on("click", function(e) {
+        MessageBox(tr('new_photo'), 
+        "<form id='tmpPhDelF' action='" + u(this).attr("href") + "' method='POST' enctype='multipart/form-data'>"+
+        "<div id='tmpdd' style='text-align:center'>"+tr('good_photo')+"<br><br>"+tr('formats')+"<br><br>"+"<input type='file' accept='image/*' name='ava' value='"+tr('select_file')+"'><br><br>"+tr('upload_problems')+"<br></div>"+
+        //"<p><input type='checkbox' name='makeAvatarPost' value='1'>"+tr('leave_photo')+"</p>"+
+        "<input type='hidden' name='hash' value='" + u("meta[name=csrf]").attr("value") + "' />"+
+        "</form>", [
+            tr('upload_button'),
+            tr('close')
+        ], [
+            (function() {
+                u("#tmpPhDelF").nodes[0].submit();
+            }),
+            (function() {
+                u("#tmpPhDelF").remove();
+            }),
+        ]);
+        
+        return e.preventDefault();
+    });
     /* @rem-pai why this func wasn't named as "#_deleteDialog"? It looks universal IMO */
 
     u("#_noteDelete").on("click", function(e) {