모바일 레이아웃 태그를 수정해서 글의 위치를 옮기고 싶어요 + 어떻게 XeIcon 색상이 흰색이 나오는거죠?

제 웹페이지 URL : http://kimbapp.com

사용 XE버젼 :  XE최신 버젼 1.8.15

모바일 사용 레이아웃 : Xenon HS

사용 호스팅 : cafe24

문제1. Not a member, Please sign in using the padlock icon 이 너무 오른쪽에 치우져서 나오더라구요.  이를 왼쪽에 붙이거나, 왼쪽으로 더 이동시킬 수 있는 html 명령이 있을까요? 아래에 보시면 빨간색 태그가 이 부분이랑 관련되어 있는 것 같은데, 이 html을 어떻게 수정해야 할 지 모르겠더라구요.

-------------------------------------------------------------------------------------------------------------

<!--// mmenu 호환을 위해 유저 영역을 자바스크립트로 처리-->
<div class="userArea">
<block cond="!$is_logged"> <!--// 비회원 -->
    <div class="nickName"><font color='black'><b>Not a member</b></font></div>
    <div class="groupList"><b><font color='black'><center>Please sign in using the padlock icon.</center></font></b></div>
    <div class="memberBtn">
     <a href="{getUrl('act','dispMemberLoginForm')}"><span class="xe-icon xe-user-lock"></span></a>
        <a href="{getUrl('act','dispMemberSignUpForm')}"><span class="xe-icon xe-user-plus"></span></a>
    </div>
</block>

-----------------------------------------------------------------------------------------------------------

문제2. 스샷에서 보이는 user lock icon과 user pluse 아이콘을 어떻게 검정색으로 바꿀 수 있을까요?

사진에서 보시는 것처럼 제가 알기로 xi 아이콘들은 다 검정색으로 알고있는데 어떻게 위의 파랑색 태그에서는 스샷에서처럼 하얀색으로 아이콘이 나오게 하는 건가요? xi-user-lock 이 아니라 xe-icon xe-user-lock 이라서 그런건가요?

항상 친절한 xetown 여러분들 덕분에 겨우 겨우 홈페이지를 만들어 나가고 있습니다. 다시 한 번 도와주신다면 정말로 감사하겠습니다.

p.s. 혹시 이 모바일 레이아웃 페이지의 모든 태그가 필요하다면 올리겠습니다. 글이 너무 더러워질까봐 올리지 않았었습니다.