diff --git a/src/components/UserEdit.tsx b/src/components/UserEdit.tsx
index 59a93252..7b6ee964 100644
--- a/src/components/UserEdit.tsx
+++ b/src/components/UserEdit.tsx
@@ -1,7 +1,7 @@
 import {
     Badge,
     Breadcrumb,
-    Button,
+    Button, Card,
     Col,
     Divider,
     Form,
@@ -33,6 +33,7 @@ import Column from "antd/lib/table/Column";
 import {useOidcUser} from "@axa-fr/react-oidc";
 
 const {Option} = Select;
+const {Meta} = Card;
 const {Title, Paragraph, Text} = Typography;
 
 interface TokenDataTable extends PersonalAccessToken {
@@ -208,14 +209,15 @@ const UserEdit = () => {
     }
 
     const transformTokenTable = (d: PersonalAccessToken[]): TokenDataTable[] => {
-        if(!d) {
+        if (!d) {
             return []
         }
         return d.map(p => ({
             key: p.id,
             status: Date.parse(p.expiration_date) > Date.now() ? "valid" : "expired",
             created_by_email: getEmail(p),
-            ...p} as TokenDataTable))
+            ...p
+        } as TokenDataTable))
     }
 
     const getEmail = (token: PersonalAccessToken): string => {
@@ -271,8 +273,10 @@ const UserEdit = () => {
 
     useEffect(() => {
         if (user.is_current || user.is_service_user) {
-            dispatch(personalAccessTokenActions.getPersonalAccessTokens.request({getAccessTokenSilently: getTokenSilently,
-                payload: user.id}))
+            dispatch(personalAccessTokenActions.getPersonalAccessTokens.request({
+                getAccessTokenSilently: getTokenSilently,
+                payload: user.id
+            }))
         }
     }, [user])
 
@@ -327,9 +331,14 @@ const UserEdit = () => {
                                 },
                             ]}
                 />
-                <Container style={{backgroundColor: "white", padding: "20px", borderRadius: "4px", boxSizing: "border-box", border: "0.5px solid #D9D9D9", marginBottom: "7px"}}>
+
+                <Card
+                    bordered={true}
+                    title={user.name}
+                    loading={loading}
+                    style={{marginBottom: "7px"}}
+                >
                     <div style={{maxWidth: "800px"}}>
-                        <Paragraph style={{textAlign: "left", whiteSpace: "pre-line", fontSize: "1.5em"}}>{user.name}</Paragraph>
                         <Form layout="vertical" hideRequiredMark form={form}
                               initialValues={{
                                   name: formUser.name,
@@ -338,24 +347,25 @@ const UserEdit = () => {
                                   autoGroupsNames: formUser.autoGroupsNames,
                               }}
                         >
-                            <Row style={{ paddingBottom: "15px"}}>
-                                {!user.is_service_user && <Col xs={24} sm={24} md={11} lg={11} xl={11} xxl={11} span={11}>
-                                    <Form.Item
-                                        name="email"
-                                        label={<Text style={{fontSize: "16px", fontWeight: "500"}}>Email</Text>}
-                                        style={{marginRight: "70px"}}
-                                    >
-                                        <Input
-                                            disabled={user.id}
-                                            value={formUser.email}
-                                            style={{color: "#5a5c5a"}}
-                                            autoComplete="off"/>
-                                    </Form.Item>
-                                </Col>}
+                            <Row style={{paddingBottom: "15px"}}>
+                                {!user.is_service_user &&
+                                    <Col xs={24} sm={24} md={11} lg={11} xl={11} xxl={11} span={11}>
+                                        <Form.Item
+                                            name="email"
+                                            label={<Text style={{}}>Email</Text>}
+                                            style={{marginRight: "70px"}}
+                                        >
+                                            <Input
+                                                disabled={user.id}
+                                                value={formUser.email}
+                                                style={{color: "#5a5c5a"}}
+                                                autoComplete="off"/>
+                                        </Form.Item>
+                                    </Col>}
                                 <Col xs={24} sm={24} md={5} lg={5} xl={5} xxl={5} span={5}>
                                     <Form.Item
                                         name="role"
-                                        label={<Text style={{fontSize: "16px", fontWeight: "500"}}>Role</Text>}
+                                        label={<Text style={{}}>Role</Text>}
                                         style={{marginRight: "50px"}}
                                     >
                                         <Select style={{width: '100%'}}
@@ -366,11 +376,11 @@ const UserEdit = () => {
                                     </Form.Item>
                                 </Col>
                             </Row>
-                            {!user.is_service_user &&  <Row style={{ paddingBottom: "15px"}}>
+                            {!user.is_service_user && <Row style={{paddingBottom: "15px"}}>
                                 <Col span={9}>
                                     <Form.Item
                                         name="autoGroupsNames"
-                                        label={<Text style={{fontSize: "16px", fontWeight: "500"}}>Auto-assigned groups</Text>}
+                                        label={<Text style={{}}>Auto-assigned groups</Text>}
                                         tooltip="Every peer enrolled with this user will be automatically added to these groups"
                                         rules={[{validator: selectValidator}]}
                                     >
@@ -397,16 +407,27 @@ const UserEdit = () => {
                             </Space>
                         </Form>
                     </div>
-                </Container>
-                {user && (user.is_current || user.is_service_user) && <Container style={{backgroundColor: "white", padding: "20px", borderRadius: "4px", boxSizing: "border-box", border: "0.5px solid #D9D9D9"}}>
+                </Card>
+
+                {user && (user.is_current || user.is_service_user) && <Card
+                    bordered={true}
+                    loading={loading}
+                    style={{marginBottom: "7px"}}
+                >
                     <div style={{maxWidth: "800px"}}>
-                        <Paragraph style={{textAlign: "left", whiteSpace: "pre-line", fontSize: "1.5em"}}>Access tokens</Paragraph>
-                        <Row gutter={21} style={{marginTop: "-22px", marginBottom: "10px"}}>
+                        <Paragraph
+                            style={{textAlign: "left", whiteSpace: "pre-line", fontSize: "16px", fontWeight: "bold"}}>Access
+                            tokens</Paragraph>
+                        <Row gutter={21} style={{marginTop: "-16px", marginBottom: "10px"}}>
                             <Col xs={24} sm={24} md={20} lg={20} xl={20} xxl={20} span={20}>
-                                <Paragraph type={"secondary"} style={{textAlign: "left", whiteSpace: "pre-line"}}>Access tokens give access to the Netbird API</Paragraph>
+                                <Paragraph type={"secondary"}
+                                           style={{textAlign: "left", whiteSpace: "pre-line"}}>
+                                    Access tokens give access to NetBird API</Paragraph>
                             </Col>
                             <Col xs={24} sm={24} md={1} lg={1} xl={1} xxl={1} span={1} style={{marginTop: "-16px"}}>
-                                {personalAccessTokens && personalAccessTokens.length > 0 && <Button type="primary" onClick={onClickAddNewPersonalAccessToken}>Create Token</Button>}
+                                {personalAccessTokens && personalAccessTokens.length > 0 &&
+                                    <Button type="primary" onClick={onClickAddNewPersonalAccessToken}>Create
+                                        token</Button>}
                             </Col>
                         </Row>
                         {personalAccessTokens && personalAccessTokens.length > 0 &&
@@ -418,34 +439,62 @@ const UserEdit = () => {
                                 pagination={false}
                                 loading={tableSpin(loading)}
                                 dataSource={tokenTable}>
-                                <Column className={"non-highlighted-table-column"} sorter={(a, b) => ((a as TokenDataTable).created_at.localeCompare((b as TokenDataTable).created_at))}
+                                <Column className={"non-highlighted-table-column"}
+                                        sorter={(a, b) => ((a as TokenDataTable).created_at.localeCompare((b as TokenDataTable).created_at))}
                                         defaultSortOrder='descend'
                                         render={(text, record, index) => {
                                             return (<>
                                                 <Row>
                                                     <Col>
-                                                        <Badge status={(record as TokenDataTable).status === "valid" ? "success" : "error"} style={{marginTop: "1px", marginRight: "5px", marginLeft: "0px"}}/>
+                                                        <Badge
+                                                            status={(record as TokenDataTable).status === "valid" ? "success" : "error"}
+                                                            style={{
+                                                                marginTop: "1px",
+                                                                marginRight: "5px",
+                                                                marginLeft: "0px"
+                                                            }}/>
                                                     </Col>
                                                     <Col>
-                                                        <Paragraph style={{fontSize: "16px", fontWeight: "500", margin: "0px", padding: "0px"}}>{(record as TokenDataTable).name}</Paragraph>
-                                                        <Paragraph type={"secondary"} style={{fontSize: "13px", fontWeight: "400", margin: "0px", marginTop: "-2px", padding: "0px"}}>{"Created"  + ((record as TokenDataTable).created_by_email && user.is_service_user ? " by " + (record as TokenDataTable).created_by_email : "") + " on " + fullDate((record as TokenDataTable).created_at)}</Paragraph>
+                                                        <Paragraph style={{
+                                                            margin: "0px",
+                                                            padding: "0px"
+                                                        }}>{(record as TokenDataTable).name}</Paragraph>
+                                                        <Paragraph type={"secondary"} style={{
+                                                            fontSize: "13px",
+                                                            fontWeight: "400",
+                                                            margin: "0px",
+                                                            marginTop: "-2px",
+                                                            padding: "0px"
+                                                        }}>{"Created" + ((record as TokenDataTable).created_by_email && user.is_service_user ? " by " + (record as TokenDataTable).created_by_email : "") + " on " + fullDate((record as TokenDataTable).created_at)}</Paragraph>
                                                     </Col>
                                                 </Row>
-                                                </>)
+                                            </>)
                                         }}/>
                                 <Column render={(text, record, index) => {
-                                           return <>
-                                               <Paragraph type={"secondary"} style={{textAlign: "left", fontSize: "11px"}}>Expires on</Paragraph>
-                                               <Paragraph type={"secondary"} style={{textAlign: "left", marginTop: "-10px", marginBottom: "0", fontSize: "15px"}}>{fullDate((record as TokenDataTable).expiration_date)}</Paragraph>
-                                           </>
-                                        }}
+                                    return <>
+                                        <Paragraph type={"secondary"} style={{textAlign: "left", fontSize: "11px"}}>Expires
+                                            on</Paragraph>
+                                        <Paragraph type={"secondary"} style={{
+                                            textAlign: "left",
+                                            marginTop: "-10px",
+                                            marginBottom: "0",
+                                            fontSize: "15px"
+                                        }}>{fullDate((record as TokenDataTable).expiration_date)}</Paragraph>
+                                    </>
+                                }}
                                 />
                                 <Column render={(text, record, index) => {
-                                            return <>
-                                                <Paragraph type={"secondary"} style={{textAlign: "left", fontSize: "11px"}}>Last used</Paragraph>
-                                                <Paragraph type={"secondary"} style={{textAlign: "left",  marginTop: "-10px", marginBottom: "0", fontSize: "15px"}}>{(record as TokenDataTable).last_used ? fullDate((record as TokenDataTable).last_used) : "Never"}</Paragraph>
-                                            </>
-                                        }}
+                                    return <>
+                                        <Paragraph type={"secondary"} style={{textAlign: "left", fontSize: "11px"}}>Last
+                                            used</Paragraph>
+                                        <Paragraph type={"secondary"} style={{
+                                            textAlign: "left",
+                                            marginTop: "-10px",
+                                            marginBottom: "0",
+                                            fontSize: "15px"
+                                        }}>{(record as TokenDataTable).last_used ? fullDate((record as TokenDataTable).last_used) : "Never"}</Paragraph>
+                                    </>
+                                }}
                                 />
                                 <Column align="right"
                                         render={(text, record, index) => {
@@ -460,16 +509,23 @@ const UserEdit = () => {
                                 />
                             </Table>}
                         <Divider style={{marginTop: "-12px"}}></Divider>
-                        {(personalAccessTokens === null || personalAccessTokens.length === 0) && <Space direction="vertical" size="small" align="start"
-                                                                     style={{display: 'flex', padding: '45px 0px', marginTop: "-40px", justifyContent: 'center'}}>
-                            <Paragraph
-                                style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "16px"}}>
-                                You don’t have any access tokens yet.
-                            </Paragraph>
-                            <Button type="primary" onClick={onClickAddNewPersonalAccessToken}>Create Token</Button>
-                        </Space>}
+                        {(personalAccessTokens === null || personalAccessTokens.length === 0) &&
+                            <Space direction="vertical" size="small" align="start"
+                                   style={{
+                                       display: 'flex',
+                                       padding: '35px 0px',
+                                       marginTop: "-40px",
+                                       justifyContent: 'center'
+                                   }}>
+                                <Paragraph
+                                    style={{textAlign: "start", whiteSpace: "pre-line"}}>
+                                    You don’t have any access tokens yet
+                                </Paragraph>
+                                <Button type="primary" onClick={onClickAddNewPersonalAccessToken}>Create token</Button>
+                            </Space>}
                     </div>
-                </Container>}
+
+                </Card>}
             </div>
             <AddPATPopup/>
             {confirmModalContextHolder}
diff --git a/src/components/popups/AddPATPopup.tsx b/src/components/popups/AddPATPopup.tsx
index 2344e166..f39ece5c 100644
--- a/src/components/popups/AddPATPopup.tsx
+++ b/src/components/popups/AddPATPopup.tsx
@@ -130,27 +130,25 @@ const AddPATPopup = () => {
                 }
                 width={460}
             >
-                <Container style={{textAlign: "start"}}>
+                <Container style={{textAlign: "start", marginLeft: "-15px", marginRight: "-15px"}}>
                     <Paragraph
-                        style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "22px", fontWeight: "500"}}>
-                        {showPlainToken ? "Token created successfully!" : "Create a Personal Access Token"}
+                        style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "22px"}}>
+                        {showPlainToken ? "Token created successfully!" : "Create token"}
                     </Paragraph>
                     {!showPlainToken && <Paragraph type={"secondary"}
                                style={{
                                    textAlign: "start",
-                                   fontSize: "14px",
                                    whiteSpace: "pre-line",
                                    marginTop: "-23px",
                                    paddingBottom: "25px",
                                }}>
-                        {"This token can be used to authenticate against" + "\n" + "NetBird's Public API."}
+                        {"Use this token to access NetBird's public API"}
                     </Paragraph>}
                     {showPlainToken && <Paragraph type={"secondary"} style={{
                         textAlign: "start",
-                        fontSize: "14px",
                         whiteSpace: "pre-line",
-                        marginTop: "40px",
-                    }}>{"This token will not be shown again, so be sure to copy it and" + "\n" + "store in a secure location."}</Paragraph>}
+                        marginTop: "25px",
+                    }}>{"This token won't be shown again, so be sure to copy and store it in a secure location"}</Paragraph>}
                     {!showPlainToken && <Form layout="vertical" hideRequiredMark form={form}
                                               initialValues={{
                                                   expires_in: ExpiresInDefault,
@@ -160,14 +158,14 @@ const AddPATPopup = () => {
                             <Col span={24}>
                                 <Row align="top">
                                     <Col flex="auto">
-                                        <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "-8px"}}>Token name</Paragraph>
-                                        <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Create a name to identify the token easily</Paragraph>
+                                        <Paragraph style={{fontWeight: "bold", marginTop: "-10px"}}>Name</Paragraph>
+                                        <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Set an easily identifiable name for your token</Paragraph>
                                         <Form.Item
                                             name="name"
                                             style={{marginTop: "-10px"}}
                                             rules={[{
                                                 required: true,
-                                                message: 'Please add a name for this personal access token',
+                                                message: 'Please add a name for this token',
                                                 whitespace: true
                                             }]}
                                         >
@@ -179,9 +177,9 @@ const AddPATPopup = () => {
                                     </Col>
                                 </Row>
                             </Col>
-                            <Col span={24} style={{textAlign: "left"}}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500"}}>Expires in</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Number of days this token is valid for</Paragraph>
+                            <Col span={24} style={{textAlign: "left", marginTop: "10px"}}>
+                                <Paragraph style={{fontWeight: "bold", marginTop: "-10px"}}>Expires in</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Number of days this token will be valid for</Paragraph>
                                 <Form.Item
                                     name="expires_in"
                                     style={{marginTop: "-10px"}}
diff --git a/src/components/popups/AddServiceUserPopup.tsx b/src/components/popups/AddServiceUserPopup.tsx
index f8feaad0..0211aae0 100644
--- a/src/components/popups/AddServiceUserPopup.tsx
+++ b/src/components/popups/AddServiceUserPopup.tsx
@@ -199,10 +199,10 @@ const AddServiceUserPopup = () => {
                 }
                 width={460}
             >
-                <Container style={{textAlign: "start"}}>
+                <Container style={{textAlign: "start", marginLeft: "-15px", marginRight: "-15px"}}>
                     <Paragraph
-                        style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "22px", fontWeight: "500"}}>
-                        {"Add Service User"}
+                        style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "22px"}}>
+                        {"Add service user"}
                     </Paragraph>
                     <Paragraph type={"secondary"}
                                style={{
@@ -211,7 +211,7 @@ const AddServiceUserPopup = () => {
                                    marginTop: "-23px",
                                    paddingBottom: "25px",
                                }}>
-                        {"Service Users are non-login users that are not associated with any specific person."}
+                        {"Service users are non-login users that are not associated with any specific person."}
                     </Paragraph>
                     <Form layout="vertical" hideRequiredMark form={form}
                           initialValues={{
@@ -220,8 +220,8 @@ const AddServiceUserPopup = () => {
                     >
                         <Row gutter={16}>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "-10px"}}>Name</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Set a name to easily identify the user</Paragraph>
+                                <Paragraph style={{fontWeight: "bold", marginTop: "-10px"}}>Name</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Set a name to easily identify the user</Paragraph>
                                 <Form.Item
                                     name="name"
                                     rules={[{
@@ -232,14 +232,14 @@ const AddServiceUserPopup = () => {
                                     style={{marginTop: "-8px"}}
                                 >
                                     <Input
-                                        placeholder={'for example "Ansible User"'}
+                                        placeholder={'for example "Ansible user"'}
                                         ref={inputNameRef}
                                         autoComplete="off"/>
                                 </Form.Item>
                             </Col>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "0px"}}>Role</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Set a role for the user to assign dashboard access permissions</Paragraph>
+                                <Paragraph style={{fontWeight: "bold", marginTop: "0px"}}>Role</Paragraph>
+                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-15px"}}>Set a role for the user to assign access permissions</Paragraph>
                                 <Form.Item
                                     name="role"
                                     rules={[{
@@ -256,8 +256,8 @@ const AddServiceUserPopup = () => {
                                 </Form.Item>
                             </Col>
                             {/*<Col span={24}>*/}
-                            {/*    <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "0px"}}>Auto-assigned groups</Paragraph>*/}
-                            {/*    <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Add groups, that will be assigned to peers added by this user</Paragraph>*/}
+                            {/*    <Paragraph style={{fontWeight: "bold", marginTop: "0px"}}>Auto-assigned groups</Paragraph>*/}
+                            {/*    <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-15px"}}>Add groups, that will be assigned to peers added by this user</Paragraph>*/}
                             {/*    <Form.Item*/}
                             {/*        name="autoGroupsNames"*/}
                             {/*        label="Auto-assigned groups"*/}
diff --git a/src/components/popups/InviteUserPopup.tsx b/src/components/popups/InviteUserPopup.tsx
index f84b01ed..2d52bc28 100644
--- a/src/components/popups/InviteUserPopup.tsx
+++ b/src/components/popups/InviteUserPopup.tsx
@@ -12,7 +12,6 @@ import {
     Typography
 } from "antd";
 import {Container} from "../Container";
-import {CloseOutlined} from "@ant-design/icons";
 import React, {useEffect, useRef, useState} from "react";
 import {useDispatch, useSelector} from "react-redux";
 import {RootState} from "typesafe-actions";
@@ -20,7 +19,6 @@ import {useGetTokenSilently} from "../../utils/token";
 import {actions as userActions} from "../../store/user";
 import {actions as groupActions} from "../../store/group";
 import {User, UserToSave} from "../../store/user/types";
-import {Header} from "antd/es/layout/layout";
 import {RuleObject} from "antd/lib/form";
 import {CustomTagProps} from "rc-select/lib/BaseSelect";
 
@@ -200,10 +198,10 @@ const InviteUserPopup = () => {
                 }
                 width={460}
             >
-                <Container style={{textAlign: "start"}}>
+                <Container style={{textAlign: "start", marginLeft: "-15px", marginRight: "-15px"}}>
                     <Paragraph
                         style={{textAlign: "start", whiteSpace: "pre-line", fontSize: "22px", fontWeight: "500"}}>
-                        {"Invite User"}
+                        {"Invite user"}
                     </Paragraph>
                     <Paragraph type={"secondary"}
                                style={{
@@ -222,8 +220,8 @@ const InviteUserPopup = () => {
                     >
                         <Row gutter={16}>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "-10px"}}>Name</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Set a name to easily identify the user</Paragraph>
+                                <Paragraph style={{fontWeight: "bold", marginTop: "-10px"}}>Name</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Set a name to easily identify the user</Paragraph>
                                 <Form.Item
                                     name="name"
                                     rules={[{
@@ -240,8 +238,8 @@ const InviteUserPopup = () => {
                                 </Form.Item>
                             </Col>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "0px"}}>Email</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Provide the email address of the user</Paragraph>
+                                <Paragraph style={{ fontWeight: "bold", marginTop: "0px"}}>Email</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Provide the email address of the user</Paragraph>
                                 <Form.Item
                                     name="email"
                                     rules={[{
@@ -259,8 +257,8 @@ const InviteUserPopup = () => {
                                 </Form.Item>
                             </Col>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "0px"}}>Role</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Set a role for the user to assign dashboard access permissions</Paragraph>
+                                <Paragraph style={{ fontWeight: "bold", marginTop: "0px"}}>Role</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Set a role for the user to assign access permissions</Paragraph>
                                 <Form.Item
                                     name="role"
                                     rules={[{
@@ -277,8 +275,8 @@ const InviteUserPopup = () => {
                                 </Form.Item>
                             </Col>
                             <Col span={24}>
-                                <Paragraph style={{fontSize: "16px", fontWeight: "500", marginTop: "0px"}}>Auto-assigned groups</Paragraph>
-                                <Paragraph type={"secondary"} style={{fontSize: "14px", marginTop: "-18px"}}>Add groups, that will be assigned to peers added by this user</Paragraph>
+                                <Paragraph style={{fontWeight: "bold", marginTop: "0px"}}>Auto-assigned groups</Paragraph>
+                                <Paragraph type={"secondary"} style={{marginTop: "-15px"}}>Add groups, that will be assigned to peers added by this user</Paragraph>
                                 <Form.Item
                                     name="autoGroupsNames"
                                     tooltip="Every peer enrolled with this user will be automatically added to these groups"