diff --git a/Web/Presenters/templates/Group/View.xml b/Web/Presenters/templates/Group/View.xml
index 219b751e..9189664e 100644
--- a/Web/Presenters/templates/Group/View.xml
+++ b/Web/Presenters/templates/Group/View.xml
@@ -98,28 +98,28 @@
     {var $avatarLink = ((is_null($avatarPhoto) ? FALSE : $avatarPhoto->isAnonymous()) ? "/photo" . ("s/" . base_convert((string) $avatarPhoto->getId(), 10, 32)) : $club->getAvatarLink())}
     <div style="position:relative;width:100%;"
         onmouseover="
-            groupAvatarChange.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
-            groupAvatarChange.style.opacity = '1';
+            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';
+            deleteButton.style.opacity = '0.7';
             "
         onmouseleave="
-            groupAvatarChange.style.backgroundColor = 'rgba(0, 0, 0, 0)';
-            groupAvatarChange.style.opacity = '0';
+            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">{_add_photo}</a>
+            <a href="/club{$club->getId()}/al_avatars" id="_newPicture" class="newpict">{_add_photo}</a>
             {else}
             <a id="_avatarDelete" href="/photo{$club->getAvatarPhoto()->getPrettyId()}/delete">
-                <img id="deleteButton" src="/assets/packages/static/openvk/img/delete.png" style="opacity:0;"></a>
-                <ul id="groupAvatarChange">
+                <img id="deleteButton" src="/assets/packages/static/openvk/img/delete.png"></a>
+                <ul id="avatarChange">
                         <li>
-                            <img src="/assets/packages/static/openvk/img/upload.png" id="_newAvatarPicture2"><a href="/club{$club->getId()}/al_avatars" id="_newAvatarPicture" style="color:#B2B2B2;" onmouseover="_newAvatarPicture.style.color = '#D9D9D9';" onmouseleave="_newAvatarPicture.style.color = '#B2B2B2';"> {tr("new_photo")}</a>
+                            <img src="/assets/packages/static/openvk/img/upload.png" id="uploadIcon"><a href="/club{$club->getId()}/al_avatars" id="_newPicture"> {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>
@@ -130,11 +130,10 @@
         {/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;
-                    groupAvatarChange.style.marginTop = image.height-33+"px";
-                    groupAvatarChange.style.width = image.width/1.25+"px"
+                    avatarChange.style.marginTop = image.height-33+"px";
+                    avatarChange.style.width = image.width/1.25+"px"
             });
         </script>
     </div>
diff --git a/Web/Presenters/templates/User/View.xml b/Web/Presenters/templates/User/View.xml
index 6f74d402..f47e766c 100644
--- a/Web/Presenters/templates/User/View.xml
+++ b/Web/Presenters/templates/User/View.xml
@@ -74,7 +74,7 @@
             {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%';
+                deleteButton.style.opacity='0.7';
                 {/if}
                 avatarChange.style.backgroundColor='rgba(0, 0, 0, 0.7)';
                 avatarChange.style.opacity='100%';
@@ -82,11 +82,10 @@
                 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%';
+                deleteButton.style.opacity='0';
                 {/if}
                 avatarChange.style.backgroundColor='rgba(0, 0, 0, 0)';
-                avatarChange.style.opacity='0%';
-                //pizdec
+                avatarChange.style.opacity='0';
                 "{/if}>
             <div n:if="!is_null($thisUser) && $user->getId() == $thisUser->getId()">
                 <div id="avatarEdit">
diff --git a/Web/static/css/avataredit.css b/Web/static/css/avataredit.css
index df10bebc..6b003576 100644
--- a/Web/static/css/avataredit.css
+++ b/Web/static/css/avataredit.css
@@ -17,7 +17,7 @@
 {
     opacity:0;
 }
-#avatarChange, #_avatarDelete, #groupAvatarChange {
+#avatarChange, #_avatarDelete, #_newPicture, #deleteButton, #_avatarDelete {
     -webkit-transition: all 200ms ease-in-out;
     -moz-transition: all 200ms ease-in-out;
     -o-transition: all 200ms ease-in-out;
@@ -40,6 +40,7 @@ div#avatarAll:hover #avatarChange {
 }
 #uploadIcon
 {
+    opacity:50%;
     position:absolute;
     left:0;
     margin-left:20px;
@@ -62,25 +63,4 @@ div#avatarAll:hover #avatarChange {
 .newpict:hover
 {
     color:#5680a0;
-}
-#groupAvatarChange
-{
-    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%;
-}
-#_newAvatarPicture2
-{
-    position:absolute;
-    left:0;
-    margin-left:20px;
-}
-#_newAvatarPicture:hover
-{
-    color:#D9D9D9;
-}
+}
\ No newline at end of file
diff --git a/Web/static/img/upload.png b/Web/static/img/upload.png
index 033009d2..e6280bc4 100644
Binary files a/Web/static/img/upload.png 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 ea3e797f..62b0c15a 100644
--- a/Web/static/js/openvk.cls.js
+++ b/Web/static/js/openvk.cls.js
@@ -134,7 +134,12 @@ document.addEventListener("DOMContentLoaded", function() { //BEGIN
     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>"+
+        "<div id='tmpdd' style='text-align:center'>"+tr('good_photo')+
+	"<br><br>"+tr('formats')+"<br><br>"+
+	"<label class=\"button\" style=\"\">"+tr('browse')+
+        "<input type=\"file\" id=\"ava\" name=\"ava\" style=\"display: none;\" onchange=\"filename.innerHTML=ava.files[0].name\" /></label>"+
+        "<div id=\"filename\" style=\"margin-top: 10px;\"></div>"+
+	"<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>", [