diff --git a/CHANGELOG.md b/CHANGELOG.md
index 62f0a64..2cfb44d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,10 +1,11 @@
 # Restreamer-UI
 
-#### v1.1.0 > v1.3.1
+#### v1.1.0 > v1.3.2
 
--   Add Owncast to publication services
--   Add Telegram to publication services
--   Fix VAAPI encoder
+-   Add Owncast to publication services ([#369](https://github.com/datarhei/restreamer/issues/369))
+-   Add Telegram to publication services (thx Martin Held)
+-   Fix publication service icon styles
+-   Fix VAAPI encoder 
 
 #### v1.0.0 > v1.1.0
 
diff --git a/src/views/Main/Egress.js b/src/views/Main/Egress.js
index 9ce3ba2..e479ccf 100644
--- a/src/views/Main/Egress.js
+++ b/src/views/Main/Egress.js
@@ -29,6 +29,11 @@ const useStyles = makeStyles((theme) => ({
 			minWidth: 30,
 			marginRight: 6,
 			float: 'left',
+			'& img': {
+				maxWidth: 22,
+				maxHeight: 22,
+				marginBottom: '0!important',
+			},
 		},
 		'& .egress-right-edit': {
 			float: 'right',
diff --git a/src/views/Publication/Add.js b/src/views/Publication/Add.js
index aa87d0d..0887aaa 100644
--- a/src/views/Publication/Add.js
+++ b/src/views/Publication/Add.js
@@ -13,6 +13,7 @@ import CircularProgress from '@mui/material/CircularProgress';
 import Divider from '@mui/material/Divider';
 import Grid from '@mui/material/Grid';
 import Link from '@mui/material/Link';
+import Stack from '@mui/material/Stack';
 import Tab from '@mui/material/Tab';
 import Tabs from '@mui/material/Tabs';
 import TextField from '@mui/material/TextField';
@@ -49,6 +50,9 @@ const useStyles = makeStyles((theme) => ({
 		maxHeight: 64,
 		marginTop: '-0.065em',
 	},
+	serviceName: {
+		marginTop: '-.2rem',
+	},
 	buttonGroup: {
 		marginTop: '0.5em',
 		marginBottom: '-0.5em',
@@ -375,12 +379,24 @@ export default function Add(props) {
 								</Tabs>
 								<TabPanel value={$tab} index="general" className="panel">
 									<Grid container spacing={2}>
-										<Grid item xs={12} md={2}>
-											<ServiceIcon className={classes.serviceIcon} />
-										</Grid>
-										<Grid item xs={12} md={10}>
-											<Typography variant="h1">{service.name}</Typography>
-											<Typography>v{service.version}</Typography>
+										<Grid item xs={12}>
+											<Stack
+												direction="row"
+												justifyContent="flex-start"
+												alignItems="center"
+												spacing={2}
+											>
+												<ServiceIcon className={classes.serviceIcon} />
+												<Stack
+													direction="column"
+													justifyContent="center"
+													alignItems="flex-start"
+													spacing={0}
+												>
+													<Typography variant="h1" className={classes.serviceName}>{service.name}</Typography>
+													<Typography>v{service.version}</Typography>
+												</Stack>
+											</Stack>
 										</Grid>
 										<Grid item xs={12} className={classes.serviceDescription}>
 											<Typography>{service.description}</Typography>
@@ -418,12 +434,24 @@ export default function Add(props) {
 								</TabPanel>
 								<TabPanel value={$tab} index="process" className="panel">
 									<Grid container spacing={2}>
-										<Grid item xs={12} md={2}>
-											<ServiceIcon className={classes.serviceIcon} />
-										</Grid>
-										<Grid item xs={12} md={10}>
-											<Typography variant="h1">{service.name}</Typography>
-											<Typography>v{service.version}</Typography>
+										<Grid item xs={12}>
+											<Stack
+												direction="row"
+												justifyContent="flex-start"
+												alignItems="center"
+												spacing={2}
+											>
+												<ServiceIcon className={classes.serviceIcon} />
+												<Stack
+													direction="column"
+													justifyContent="center"
+													alignItems="flex-start"
+													spacing={0}
+												>
+													<Typography variant="h1" className={classes.serviceName}>{service.name}</Typography>
+													<Typography>v{service.version}</Typography>
+												</Stack>
+											</Stack>
 										</Grid>
 										<Grid item xs={12}>
 											<Divider />
@@ -451,12 +479,24 @@ export default function Add(props) {
 								</TabPanel>
 								<TabPanel value={$tab} index="encoding" className="panel">
 									<Grid container spacing={2}>
-										<Grid item xs={12} md={2}>
-											<ServiceIcon className={classes.serviceIcon} />
-										</Grid>
-										<Grid item xs={12} md={10}>
-											<Typography variant="h1">{service.name}</Typography>
-											<Typography>v{service.version}</Typography>
+										<Grid item xs={12}>
+											<Stack
+												direction="row"
+												justifyContent="flex-start"
+												alignItems="center"
+												spacing={2}
+											>
+												<ServiceIcon className={classes.serviceIcon} />
+												<Stack
+													direction="column"
+													justifyContent="center"
+													alignItems="flex-start"
+													spacing={0}
+												>
+													<Typography variant="h1" className={classes.serviceName}>{service.name}</Typography>
+													<Typography>v{service.version}</Typography>
+												</Stack>
+											</Stack>
 										</Grid>
 										<Grid item xs={12}>
 											<Divider />
diff --git a/src/views/Publication/Edit.js b/src/views/Publication/Edit.js
index 92adeeb..6970ff0 100644
--- a/src/views/Publication/Edit.js
+++ b/src/views/Publication/Edit.js
@@ -11,6 +11,7 @@ import CircularProgress from '@mui/material/CircularProgress';
 import Divider from '@mui/material/Divider';
 import Grid from '@mui/material/Grid';
 import Link from '@mui/material/Link';
+import Stack from '@mui/material/Stack';
 import Tab from '@mui/material/Tab';
 import Tabs from '@mui/material/Tabs';
 import TextField from '@mui/material/TextField';
@@ -52,6 +53,9 @@ const useStyles = makeStyles((theme) => ({
 		maxHeight: 64,
 		marginTop: '-0.065em',
 	},
+	serviceName: {
+		marginTop: '-.2rem',
+	},
 }));
 
 export default function Edit(props) {
@@ -389,12 +393,24 @@ export default function Edit(props) {
 						</Tabs>
 						<TabPanel value={$tab} index="general" className="panel">
 							<Grid container spacing={2}>
-								<Grid item xs={12} md={2}>
-									<ServiceIcon className={classes.serviceIcon} />
-								</Grid>
-								<Grid item xs={12} md={10}>
-									<Typography variant="h1">{$service.name}</Typography>
-									<Typography>v{$service.version}</Typography>
+								<Grid item xs={12}>
+									<Stack
+										direction="row"
+										justifyContent="flex-start"
+										alignItems="center"
+										spacing={2}
+									>
+										<ServiceIcon className={classes.serviceIcon} />
+										<Stack
+											direction="column"
+											justifyContent="center"
+											alignItems="flex-start"
+											spacing={0}
+										>
+											<Typography variant="h1" className={classes.serviceName}>{$service.name}</Typography>
+											<Typography>v{$service.version}</Typography>
+										</Stack>
+									</Stack>
 								</Grid>
 								<Grid item xs={12} className={classes.serviceDescription}>
 									<Typography>{$service.description}</Typography>
@@ -426,15 +442,27 @@ export default function Edit(props) {
 						</TabPanel>
 						<TabPanel value={$tab} index="process" className="panel">
 							<Grid container spacing={2}>
-								<Grid item xs={12} md={2}>
-									<ServiceIcon className={classes.serviceIcon} />
+								<Grid item xs={12}>
+									<Stack
+										direction="row"
+										justifyContent="flex-start"
+										alignItems="center"
+										spacing={2}
+									>
+										<ServiceIcon className={classes.serviceIcon} />
+										<Stack
+											direction="column"
+											justifyContent="center"
+											alignItems="flex-start"
+											spacing={0}
+										>
+											<Typography variant="h1" className={classes.serviceName}>{$service.name}</Typography>
+											<Typography>v{$service.version}</Typography>
+										</Stack>
+									</Stack>
 								</Grid>
-								<Grid item xs={12} md={10}>
-									<Typography variant="h1">{$service.name}</Typography>
-									<Typography>v{$service.version}</Typography>
-								</Grid>
-								<Grid item xs={12} className={classes.serviceDescription}>
-									<Typography>{$service.description}</Typography>
+								<Grid item xs={12}>
+									<Divider />
 								</Grid>
 								<Grid item xs={12}>
 									<Typography variant="h2">
@@ -446,9 +474,6 @@ export default function Edit(props) {
 								</Grid>
 								<Grid item xs={12}>
 									<Grid container spacing={1} className={classes.gridContainer}>
-										<Grid item xs={12}>
-											<Divider />
-										</Grid>
 										{$unsavedChanges === true && (
 											<Grid item xs={12}>
 												<BoxText>
@@ -490,15 +515,27 @@ export default function Edit(props) {
 						</TabPanel>
 						<TabPanel value={$tab} index="encoding" className="panel">
 							<Grid container spacing={2}>
-								<Grid item xs={12} md={2}>
-									<ServiceIcon className={classes.serviceIcon} />
+								<Grid item xs={12}>
+									<Stack
+										direction="row"
+										justifyContent="flex-start"
+										alignItems="center"
+										spacing={2}
+									>
+										<ServiceIcon className={classes.serviceIcon} />
+										<Stack
+											direction="column"
+											justifyContent="center"
+											alignItems="flex-start"
+											spacing={0}
+										>
+											<Typography variant="h1" className={classes.serviceName}>{$service.name}</Typography>
+											<Typography>v{$service.version}</Typography>
+										</Stack>
+									</Stack>
 								</Grid>
-								<Grid item xs={12} md={10}>
-									<Typography variant="h1">{$service.name}</Typography>
-									<Typography>v{$service.version}</Typography>
-								</Grid>
-								<Grid item xs={12} className={classes.serviceDescription}>
-									<Typography>{$service.description}</Typography>
+								<Grid item xs={12}>
+									<Divider />
 								</Grid>
 								<Grid item xs={12}>
 									<Typography variant="h2">
diff --git a/src/views/Publication/Services/Bitmovin.js b/src/views/Publication/Services/Bitmovin.js
index 6906cf9..d7f0f5e 100644
--- a/src/views/Publication/Services/Bitmovin.js
+++ b/src/views/Publication/Services/Bitmovin.js
@@ -42,7 +42,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="Bitmovin Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="Bitmovin Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/CDN77.js b/src/views/Publication/Services/CDN77.js
index 33ec340..fb341d6 100644
--- a/src/views/Publication/Services/CDN77.js
+++ b/src/views/Publication/Services/CDN77.js
@@ -42,7 +42,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="DaCast Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="DaCast Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/Core.js b/src/views/Publication/Services/Core.js
index cd76e70..4ee99b2 100644
--- a/src/views/Publication/Services/Core.js
+++ b/src/views/Publication/Services/Core.js
@@ -45,7 +45,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="datarhei.com Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="datarhei.com Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/DaCast.js b/src/views/Publication/Services/DaCast.js
index 150d056..77d8410 100644
--- a/src/views/Publication/Services/DaCast.js
+++ b/src/views/Publication/Services/DaCast.js
@@ -45,7 +45,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="DaCast Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="DaCast Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/Icecast.js b/src/views/Publication/Services/Icecast.js
index 727923e..ba3fd2e 100644
--- a/src/views/Publication/Services/Icecast.js
+++ b/src/views/Publication/Services/Icecast.js
@@ -48,7 +48,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="Icecat Logo" style={{ marginBottom: '-7px' }} {...props} />;
+	return <img src={Logo} alt="Icecat Logo" {...props} />;
 }
 
 function init(settings, metadata) {
diff --git a/src/views/Publication/Services/Livespotting.js b/src/views/Publication/Services/Livespotting.js
index 6ba2af8..9374fc9 100644
--- a/src/views/Publication/Services/Livespotting.js
+++ b/src/views/Publication/Services/Livespotting.js
@@ -42,7 +42,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="livespotting.com Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="livespotting.com Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/Red5.js b/src/views/Publication/Services/Red5.js
index 1e6aa3e..83ce49d 100644
--- a/src/views/Publication/Services/Red5.js
+++ b/src/views/Publication/Services/Red5.js
@@ -44,7 +44,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="Red5 Logo" style={{ marginBottom: '-7px' }} {...props} />;
+	return <img src={Logo} alt="Red5 Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/Restream.js b/src/views/Publication/Services/Restream.js
index 88b3569..7d2b009 100644
--- a/src/views/Publication/Services/Restream.js
+++ b/src/views/Publication/Services/Restream.js
@@ -45,7 +45,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="restream.io Logo" style={{ marginBottom: '-6px' }} {...props} />;
+	return <img src={Logo} alt="restream.io Logo" {...props} />;
 }
 
 function init(settings) {
diff --git a/src/views/Publication/Services/WOWZA.js b/src/views/Publication/Services/WOWZA.js
index ea67d02..4cc7c43 100644
--- a/src/views/Publication/Services/WOWZA.js
+++ b/src/views/Publication/Services/WOWZA.js
@@ -47,7 +47,7 @@ const requires = {
 };
 
 function ServiceIcon(props) {
-	return <img src={Logo} alt="wowza.com Logo" style={{ marginBottom: '-7px' }} {...props} />;
+	return <img src={Logo} alt="wowza.com Logo" {...props} />;
 }
 
 function init(settings) {