diff --git a/lib/api/quizRelase.ts b/lib/api/quizRelase.ts
index ae4025e..18846e9 100644
--- a/lib/api/quizRelase.ts
+++ b/lib/api/quizRelase.ts
@@ -1,5 +1,7 @@
 import { GetQuizDataResponse, parseQuizData } from "@model/api/getQuizData";
 import axios from "axios";
+import MobileDetect from 'mobile-detect';
+import device from "current-device";
 
 import type { AxiosError } from "axios";
 import { replaceSpacesToEmptyLines } from "../components/ViewPublicationPage/tools/replaceSpacesToEmptyLines";
@@ -9,12 +11,26 @@ let SESSIONS = "";
 
 const domain = location.hostname === "hbpn.link" ? "" : "https://s.hbpn.link";
 
+const md = new MobileDetect(window.navigator.userAgent);
+
+const userAgent = navigator.userAgent
+let OSDevice = md.os()
+if (OSDevice === null) {OSDevice = userAgent}
+
+const DeviceType = device.type
+let Device = md.mobile()
+if (Device === null) {Device = userAgent}
+
 export const publicationMakeRequest = ({ url, body }: any) => {
     return axios(url, {
         data: body,
         headers: {
             "X-Sessionkey": SESSIONS,
             "Content-Type": "multipart/form-data",
+            "DeviceType" : DeviceType,
+            "Device" : Device,
+            "OS": OSDevice,
+            "Browser" : userAgent
         },
         method: "POST",
     });
@@ -33,6 +49,10 @@ export async function getData(quizId: string): Promise<{
                 headers: {
                     "X-Sessionkey": SESSIONS,
                     "Content-Type": "application/json",
+                    "DeviceType" : DeviceType,
+                    "Device" : Device,
+                    "OS": OSDevice,
+                    "Browser" : userAgent
                 },
                 data: {
                     quiz_id: quizId,
diff --git a/lib/assets/icons/ArrowDownIcon.tsx b/lib/assets/icons/ArrowDownIcon.tsx
index 5939247..c62184b 100644
--- a/lib/assets/icons/ArrowDownIcon.tsx
+++ b/lib/assets/icons/ArrowDownIcon.tsx
@@ -22,7 +22,7 @@ export default function ArrowDownIcon(
             }}
         >
             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
-                <path d="M19.5 9L12 16.5L4.5 9" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+                <path d="M19.5 9L12 16.5L4.5 9" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
             </svg>
         </Box>
     );
diff --git a/lib/assets/icons/ContactFormIcon/AddressIcon.tsx b/lib/assets/icons/ContactFormIcon/AddressIcon.tsx
index 9918ee4..66ba584 100644
--- a/lib/assets/icons/ContactFormIcon/AddressIcon.tsx
+++ b/lib/assets/icons/ContactFormIcon/AddressIcon.tsx
@@ -2,17 +2,23 @@ import { Box } from "@mui/material";
 
 interface Props {
   color: string;
+  backgroundColor: string
 }
 
-export default function AddressIcon({ color }: Props) {
+export default function AddressIcon({ color, backgroundColor }: Props) {
   return (
     <Box
       sx={{
         // height: "38px",
-        // width: "45px",
+        // width: "24px",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
+        height: "58px",
+        width: "42px",
+        backgroundColor: {backgroundColor},
+        borderBottomLeftRadius: "12px",
+        borderTopLeftRadius: "12px",
       }}
     >
       <svg
diff --git a/lib/assets/icons/ContactFormIcon/EmailIcon.tsx b/lib/assets/icons/ContactFormIcon/EmailIcon.tsx
index ad09e98..4e75e1a 100644
--- a/lib/assets/icons/ContactFormIcon/EmailIcon.tsx
+++ b/lib/assets/icons/ContactFormIcon/EmailIcon.tsx
@@ -2,17 +2,23 @@ import { Box } from "@mui/material";
 
 interface Props {
   color: string;
+  backgroundColor: string
 }
 
-export default function EmailIcon({ color }: Props) {
+export default function EmailIcon({ color, backgroundColor }: Props) {
   return (
     <Box
       sx={{
         // height: "38px",
-        // width: "45px",
+        // width: "24px",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
+        height: "58px",
+        width: "42px",
+        backgroundColor: {backgroundColor},
+        borderBottomLeftRadius: "12px",
+        borderTopLeftRadius: "12px",
       }}
     >
       <svg
diff --git a/lib/assets/icons/ContactFormIcon/NameIcon.tsx b/lib/assets/icons/ContactFormIcon/NameIcon.tsx
index 8fafed2..5c23f04 100644
--- a/lib/assets/icons/ContactFormIcon/NameIcon.tsx
+++ b/lib/assets/icons/ContactFormIcon/NameIcon.tsx
@@ -2,9 +2,10 @@ import { Box } from "@mui/material";
 
 interface Props {
   color: string;
+  backgroundColor: string
 }
 
-export default function NameIcon({ color }: Props) {
+export default function NameIcon({ color, backgroundColor }: Props) {
   return (
     <Box
       sx={{
@@ -13,6 +14,11 @@ export default function NameIcon({ color }: Props) {
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
+        height: "58px",
+        width: "42px",
+        backgroundColor: {backgroundColor},
+        borderBottomLeftRadius: "12px",
+        borderTopLeftRadius: "12px",
       }}
     >
       <svg
diff --git a/lib/assets/icons/ContactFormIcon/PhoneIcon.tsx b/lib/assets/icons/ContactFormIcon/PhoneIcon.tsx
index 33266a5..e62fdbf 100644
--- a/lib/assets/icons/ContactFormIcon/PhoneIcon.tsx
+++ b/lib/assets/icons/ContactFormIcon/PhoneIcon.tsx
@@ -2,23 +2,29 @@ import { Box } from "@mui/material";
 
 interface Props {
   color: string;
+  backgroundColor: string
 }
 
-export default function PhoneIcon({ color }: Props) {
+export default function PhoneIcon({ color, backgroundColor }: Props) {
   return (
     <Box
       sx={{
         // height: "38px",
-        // width: "45px",
+        // width: "24px",
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
+        height: "58px",
+        width: "42px",
+        backgroundColor: {backgroundColor},
+        borderBottomLeftRadius: "12px",
+        borderTopLeftRadius: "12px",
       }}
     >
       <svg
-        width="15"
-        height="15"
-        viewBox="0 0 15 15"
+        width="17"
+        height="17"
+        viewBox="0 0 17 17"
         fill="none"
         xmlns="http://www.w3.org/2000/svg"
       >
diff --git a/lib/assets/icons/ContactFormIcon/TextIcon.tsx b/lib/assets/icons/ContactFormIcon/TextIcon.tsx
index b272b37..e4b1ce4 100644
--- a/lib/assets/icons/ContactFormIcon/TextIcon.tsx
+++ b/lib/assets/icons/ContactFormIcon/TextIcon.tsx
@@ -2,9 +2,10 @@ import { Box } from "@mui/material";
 
 interface Props {
   color: string;
+  backgroundColor: string
 }
 
-export default function TextIcon({ color }: Props) {
+export default function TextIcon({ color, backgroundColor }: Props) {
   return (
     <Box
       sx={{
@@ -13,6 +14,11 @@ export default function TextIcon({ color }: Props) {
         display: "flex",
         alignItems: "center",
         justifyContent: "center",
+        height: "58px",
+        width: "42px",
+        backgroundColor: {backgroundColor},
+        borderBottomLeftRadius: "12px",
+        borderTopLeftRadius: "12px",
       }}
     >
       <svg
diff --git a/lib/components/ViewPublicationPage/ContactForm.tsx b/lib/components/ViewPublicationPage/ContactForm.tsx
index 7613d40..68f0965 100644
--- a/lib/components/ViewPublicationPage/ContactForm.tsx
+++ b/lib/components/ViewPublicationPage/ContactForm.tsx
@@ -3,20 +3,29 @@ import EmailIcon from "@icons/ContactFormIcon/EmailIcon";
 import NameIcon from "@icons/ContactFormIcon/NameIcon";
 import PhoneIcon from "@icons/ContactFormIcon/PhoneIcon";
 import TextIcon from "@icons/ContactFormIcon/TextIcon";
-import { Box, Button, InputAdornment, Link, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
+import {
+    Box,
+    Button,
+    InputAdornment,
+    Link,
+    TextField as MuiTextField,
+    TextFieldProps,
+    Typography,
+    useTheme
+} from "@mui/material";
 
 import CustomCheckbox from "@ui_kit/CustomCheckbox";
-import { FC, useRef, useState } from "react";
+import {FC, useRef, useState} from "react";
 
-import { sendFC } from "@api/quizRelase";
-import { NameplateLogo } from "@icons/NameplateLogo";
-import { QuizQuestionResult } from "@model/questionTypes/result";
-import { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
-import { quizThemes } from "@utils/themes/Publication/themePublication";
-import { enqueueSnackbar } from "notistack";
-import { useRootContainerSize } from "../../contexts/RootContainerWidthContext";
-import { useQuizData } from "@contexts/QuizDataContext";
-import { DESIGN_LIST } from "@/components/ViewPublicationPage/Question";
+import {sendFC} from "@api/quizRelase";
+import {NameplateLogo} from "@icons/NameplateLogo";
+import {QuizQuestionResult} from "@model/questionTypes/result";
+import {AnyTypedQuizQuestion} from "@model/questionTypes/shared";
+import {quizThemes} from "@utils/themes/Publication/themePublication";
+import {enqueueSnackbar} from "notistack";
+import {useRootContainerSize} from "../../contexts/RootContainerWidthContext";
+import {useQuizData} from "@contexts/QuizDataContext";
+import {DESIGN_LIST} from "@/components/ViewPublicationPage/Question";
 
 
 const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
@@ -27,9 +36,9 @@ type Props = {
     onShowResult: () => void;
 };
 
-export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
+export const ContactForm = ({currentQuestion, onShowResult}: Props) => {
     const theme = useTheme();
-    const { settings, questions, quizId, show_badge } = useQuizData();
+    const {settings, questions, quizId, show_badge} = useQuizData();
 
     const [ready, setReady] = useState(false);
     const [name, setName] = useState("");
@@ -66,7 +75,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
         if (email.length > 0) body.email = email;
         if (phone.length > 0) body.phone = phone;
         if (adress.length > 0) body.address = adress;
-        if (text.length > 0) body.customs = { [FC.text.text || "Фамилия"]: text };
+        if (text.length > 0) body.customs = {[FC.text.text || "Фамилия"]: text};
 
         if (Object.keys(body).length > 0) {
             try {
@@ -79,7 +88,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                 const sessions = JSON.parse(localStorage.getItem("sessions") || "{}");
                 localStorage.setItem(
                     "sessions",
-                    JSON.stringify({ ...sessions, [quizId]: new Date().getTime() })
+                    JSON.stringify({...sessions, [quizId]: new Date().getTime()})
                 );
             } catch (e) {
                 enqueueSnackbar("ответ не был засчитан");
@@ -99,7 +108,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
     const isWide = Object.keys(filteredFC).length > 2;
 
     async function handleShowResultsClick() {
-        const FC: any = settings.cfg.formContact.fields 
+        const FC: any = settings.cfg.formContact.fields
         if (FC["email"].used !== EMAIL_REGEXP.test(email)) {
             return enqueueSnackbar("введена некорректная почта");
         }
@@ -156,7 +165,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                 msOverflowStyle: "none",
                 backgroundPosition: "center",
                 backgroundSize: "cover",
-                backgroundImage: settings.cfg.design
+                backgroundImage: settings.cfg.design && !isMobile
                     ? `url(${DESIGN_LIST[settings.cfg.theme]})`
                     : null,
             }}
@@ -168,6 +177,11 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                     height: "100%",
                     minHeight: "100vh",
                     display: isWide && !isMobile ? "flex" : undefined,
+                    background: settings.cfg.design && !isMobile
+                        ? quizThemes[settings.cfg.theme].isLight
+                            ? "transparent"
+                            : "linear-gradient(90deg,#272626, transparent)"
+                        : theme.palette.background.default,
                 }}
             >
                 <Box
@@ -180,31 +194,43 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                         borderRight: isWide && !isMobile ? "1px solid gray" : undefined,
                     }}
                 >
-                    <Typography
+                    <Box
                         sx={{
-                            textAlign: "center",
-                            m: "20px 0",
-                            fontSize: "28px",
-                            color: theme.palette.text.primary,
-                            wordBreak: "break-word"
+                            maxWidth: "630px",
+                            width: "100%",
+                            display: "flex",
+                            flexDirection: "column",
+                            alignItems: "flex-start",
+                            justifyContent: "center",
+                            padding: isMobile ? "20px 20px 0 20px" : "0 0 0 40px"
                         }}
                     >
-                        {settings.cfg.formContact.title ||
-                            "Заполните форму, чтобы получить результаты теста"}
-                    </Typography>
-                    {settings.cfg.formContact.desc && (
                         <Typography
                             sx={{
-                                color: theme.palette.text.primary,
                                 textAlign: "center",
                                 m: "20px 0",
-                                fontSize: "18px",
+                                fontSize: "28px",
+                                color: theme.palette.text.primary,
                                 wordBreak: "break-word"
                             }}
                         >
-                            {settings.cfg.formContact.desc}
+                            {settings.cfg.formContact.title ||
+                            "Заполните форму, чтобы получить результаты теста"}
                         </Typography>
-                    )}
+                        {settings.cfg.formContact.desc && (
+                            <Typography
+                                sx={{
+                                    color: theme.palette.text.primary,
+                                    m: "20px 0",
+                                    fontSize: "18px",
+                                    wordBreak: "break-word"
+                                }}
+                            >
+                                {settings.cfg.formContact.desc}
+                            </Typography>
+                        )}
+                    </Box>
+
                 </Box>
 
                 <Box
@@ -214,7 +240,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                         justifyContent: "center",
                         flexDirection: "column",
                         backgroundColor: theme.palette.background.default,
-                        p: "30px",
+                        p: "0px 20px 30px 20px",
                     }}
                 >
                     <Box
@@ -266,13 +292,13 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
                     >
                         <CustomCheckbox
                             label=""
-                            handleChange={({ target }) => {
+                            handleChange={({target}) => {
                                 setReady(target.checked);
                             }}
                             checked={ready}
                             colorIcon={theme.palette.primary.main}
                         />
-                        <Typography sx={{ color: theme.palette.text.primary }}>
+                        <Typography sx={{color: theme.palette.text.primary}}>
                             С&ensp;
                             <Link href={"https://shub.pena.digital/ppdd"} target="_blank">
                                 Положением об обработке персональных данных{" "}
@@ -326,18 +352,18 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
 };
 
 const Inputs = ({
-    name,
-    setName,
-    email,
-    setEmail,
-    phone,
-    setPhone,
-    text,
-    setText,
-    adress,
-    setAdress,
-}: any) => {
-    const { settings } = useQuizData();
+                    name,
+                    setName,
+                    email,
+                    setEmail,
+                    phone,
+                    setPhone,
+                    text,
+                    setText,
+                    adress,
+                    setAdress,
+                }: any) => {
+    const {settings} = useQuizData();
 
     const FC = settings.cfg.formContact.fields;
 
@@ -345,16 +371,16 @@ const Inputs = ({
 
     const Name = (
         <CustomInput
-            onChange={({ target }) => setName(target.value)}
+            onChange={({target}) => setName(target.value)}
             id={name}
             title={FC["name"].innerText || "Введите имя"}
-            desc={FC["name"].text || "имя"}
+            desc={FC["name"].text || "Имя"}
             Icon={NameIcon}
         />
     );
     const Email = (
         <CustomInput
-            onChange={({ target }) => setEmail(target.value)}
+            onChange={({target}) => setEmail(target.value)}
             id={email}
             title={FC["email"].innerText || "Введите Email"}
             desc={FC["email"].text || "Email"}
@@ -363,28 +389,28 @@ const Inputs = ({
     );
     const Phone = (
         <CustomInput
-            onChange={({ target }) => setPhone(target.value)}
+            onChange={({target}) => setPhone(target.value)}
             id={phone}
             title={FC["phone"].innerText || "Введите номер телефона"}
-            desc={FC["phone"].text || "номер телефона"}
+            desc={FC["phone"].text || "Номер телефона"}
             Icon={PhoneIcon}
         />
     );
     const Text = (
         <CustomInput
-            onChange={({ target }) => setText(target.value)}
+            onChange={({target}) => setText(target.value)}
             id={text}
             title={FC["text"].text || "Введите фамилию"}
-            desc={FC["text"].innerText || "фамилию"}
+            desc={FC["text"].innerText || "Фамилия"}
             Icon={TextIcon}
         />
     );
     const Adress = (
         <CustomInput
-            onChange={({ target }) => setAdress(target.value)}
+            onChange={({target}) => setAdress(target.value)}
             id={adress}
             title={FC["address"].innerText || "Введите адрес"}
-            desc={FC["address"].text || "адрес"}
+            desc={FC["address"].text || "Адрес"}
             Icon={AddressIcon}
         />
     );
@@ -410,16 +436,16 @@ const Inputs = ({
     }
 };
 
-const CustomInput = ({ title, desc, Icon, onChange, id }: {
+const CustomInput = ({title, desc, Icon, onChange, id}: {
     id: string;
     title: string;
     desc: string;
-    Icon: FC<{ color: string; }>;
+    Icon: FC<{ color: string; backgroundColor: string }>;
     onChange: TextFieldProps["onChange"];
 }) => {
     const theme = useTheme();
     const isMobile = useRootContainerSize() < 600;
-
+    const {settings} = useQuizData();
     return (
         <Box m="15px 0">
             <Typography mb="7px" color={theme.palette.text.primary}>
@@ -430,15 +456,22 @@ const CustomInput = ({ title, desc, Icon, onChange, id }: {
                 onChange={onChange}
                 sx={{
                     width: isMobile ? "300px" : "350px",
+                    backgroundColor: theme.palette.background.default,
                     "& .MuiOutlinedInput-notchedOutline": {
-                        borderColor: "#9A9AAF"
+                        borderColor: "#9A9AAF80",
+                        borderRadius: "12px"
+                    },
+                    "& .MuiInputBase-root": {
+                        paddingLeft: 0
                     }
+
                 }}
                 placeholder={desc}
                 InputProps={{
                     startAdornment: (
                         <InputAdornment position="start">
-                            <Icon color="gray" />
+                            <Icon color="gray"
+                                  backgroundColor={quizThemes[settings.cfg.theme].isLight ? "#F2F3F7" : "#F2F3F71A"}/>
                         </InputAdornment>
                     ),
                 }}
diff --git a/lib/components/ViewPublicationPage/ResultForm.tsx b/lib/components/ViewPublicationPage/ResultForm.tsx
index d28cf83..edfdf2b 100644
--- a/lib/components/ViewPublicationPage/ResultForm.tsx
+++ b/lib/components/ViewPublicationPage/ResultForm.tsx
@@ -5,25 +5,25 @@ import {
     useTheme
 } from "@mui/material";
 
-import { NameplateLogo } from "@icons/NameplateLogo";
+import {NameplateLogo} from "@icons/NameplateLogo";
 import YoutubeEmbedIframe from "./tools/YoutubeEmbedIframe";
 
-import { useQuizData } from "@contexts/QuizDataContext";
-import { quizThemes } from "@utils/themes/Publication/themePublication";
-import { useRootContainerSize } from "../../contexts/RootContainerWidthContext";
-import type { QuizQuestionResult } from "../../model/questionTypes/result";
-import { setCurrentQuizStep } from "@stores/quizView";
-import { DESIGN_LIST } from "@/components/ViewPublicationPage/Question";
+import {useQuizData} from "@contexts/QuizDataContext";
+import {quizThemes} from "@utils/themes/Publication/themePublication";
+import {useRootContainerSize} from "../../contexts/RootContainerWidthContext";
+import type {QuizQuestionResult} from "../../model/questionTypes/result";
+import {setCurrentQuizStep} from "@stores/quizView";
+import {DESIGN_LIST} from "@/components/ViewPublicationPage/Question";
 
 type ResultFormProps = {
     resultQuestion: QuizQuestionResult;
 };
 
-export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
+export const ResultForm = ({resultQuestion}: ResultFormProps) => {
     const theme = useTheme();
     const isMobile = useRootContainerSize() < 650;
     const isTablet = useRootContainerSize() < 1000;
-    const { settings, show_badge } = useQuizData();
+    const {settings, show_badge} = useQuizData();
     const spec = settings.cfg.spec
 
     return (
@@ -36,52 +36,67 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                 height: "100%",
                 minHeight: "100vh",
                 width: "100%",
-                pt: "28px",
                 overflow: "auto",
                 backgroundColor: theme.palette.background.default,
                 backgroundPosition: "center",
                 backgroundSize: "cover",
-                backgroundImage: settings.cfg.design
+                backgroundImage: settings.cfg.design && !isMobile
                     ? `url(${DESIGN_LIST[settings.cfg.theme]})`
                     : null,
-        }}
+
+            }}
         >
             <Box
                 sx={{
                     display: "flex",
                     flexDirection: "column",
-                    alignItems: "start",
-                    maxWidth: "844px",
-                    width:  "100%",
-                    padding: isMobile ? "0 16px" : isTablet ? "0 78px" : undefined,
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                    pt: "30px",
+                    width: "inherit",
+                    height: "inherit",
+                    background: settings.cfg.design
+                        ? quizThemes[settings.cfg.theme].isLight
+                            ? "transparent"
+                            : "linear-gradient(90deg,#272626, transparent)"
+                        : theme.palette.background.default,
                 }}
             >
-                {
-                    !resultQuestion?.content.useImage && resultQuestion.content.video && (
-                        <YoutubeEmbedIframe
-                            videoUrl={resultQuestion.content.video}
-                            containerSX={{
-                                width: isMobile ? "100%" : "490px",
-                                height: isMobile ? "100%" : "280px",
-                            }}
-                        />
-                    )
-                }
-                {
-                    resultQuestion?.content.useImage && resultQuestion.content.back && (
-                        <Box
-                            component="img"
-                            src={resultQuestion.content.back}
-                            sx={{
-                                width: "100%",
-                                maxWidth: "844px",
-                                height: spec ? "auto" : isMobile ? "100%" : "306px",
-                                borderRadius: "8px"
-                            }}
-                        ></Box>
-                    )
-                }
-                {resultQuestion.description !== "" &&
+                <Box
+                    sx={{
+                        display: "flex",
+                        flexDirection: "column",
+                        alignItems: "flex-start",
+                        width: "100%",
+                        maxWidth: "844px",
+                        padding: isMobile ? "0 16px" : isTablet ? "0 78px" : undefined,
+                    }}>
+                    {
+                        !resultQuestion?.content.useImage && resultQuestion.content.video && (
+                            <YoutubeEmbedIframe
+                                videoUrl={resultQuestion.content.video}
+                                containerSX={{
+                                    width: isMobile ? "100%" : "490px",
+                                    height: isMobile ? "100%" : "280px",
+                                }}
+                            />
+                        )
+                    }
+                    {
+                        resultQuestion?.content.useImage && resultQuestion.content.back && (
+                            <Box
+                                component="img"
+                                src={resultQuestion.content.back}
+                                sx={{
+                                    width: "100%",
+                                    maxWidth: "844px",
+                                    height: spec ? "auto" : isMobile ? "100%" : "306px",
+                                    borderRadius: "8px"
+                                }}
+                            ></Box>
+                        )
+                    }
+                    {resultQuestion.description !== "" &&
                     resultQuestion.description !== " " && (
                         <Typography
                             sx={{
@@ -96,96 +111,98 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                         </Typography>
                     )}
 
-                <Typography
-                    sx={{
-                        m: "20px 0",
-                        color: theme.palette.text.primary,
-                        wordBreak: "break-word"
-                    }}
-                >
-                    {resultQuestion.title}
-                </Typography>
-
-                {
-                    resultQuestion.content.text !== "" &&
-                    resultQuestion.content.text !== " " && (
-                        <Typography
-                            sx={{
-                                fontSize: "18px",
-                                m: "20px 0",
-                                wordBreak: "break-word",
-                                color: theme.palette.text.primary,
-                            }}
-                        >
-                            {
-                                resultQuestion.content.text
-                            }
-                        </Typography>
-                    )
-                }
-            </Box>
-
-            <Box width="100%">
-                <Box
-                    sx={{
-                        display: "flex",
-                        width: "100%",
-                        justifyContent: "end",
-                        px: "20px",
-                    }}
-                >
-                    {show_badge &&
-                    <Box
-                        component={Link}
-                        target={"_blank"}
-                        href={"https://quiz.pena.digital"}
+                    <Typography
                         sx={{
-                            display: "flex",
-                            alignItems: "center",
-                            mt: "15px",
-                            gap: "10px",
-                            textDecoration: "none",
-                            mb: "5px"
+                            m: "20px 0",
+                            color: theme.palette.text.primary,
+                            wordBreak: "break-word"
                         }}
                     >
-                        <NameplateLogo
-                            style={{
-                                fontSize: "34px",
-                                color: quizThemes[settings.cfg.theme].isLight ? "#000000" : "#F5F7FF",
-                            }}
-                        />
-                        <Typography
+                        {resultQuestion.title}
+                    </Typography>
+
+                    {
+                        resultQuestion.content.text !== "" &&
+                        resultQuestion.content.text !== " " && (
+                            <Typography
+                                sx={{
+                                    fontSize: "18px",
+                                    m: "20px 0",
+                                    wordBreak: "break-word",
+                                    color: theme.palette.text.primary,
+                                }}
+                            >
+                                {
+                                    resultQuestion.content.text
+                                }
+                            </Typography>
+                        )
+                    }
+                </Box>
+
+
+                <Box width="100%">
+                    <Box
+                        sx={{
+                            display: "flex",
+                            width: "100%",
+                            justifyContent: "end",
+                            px: "20px",
+                        }}
+                    >
+                        {show_badge &&
+                        <Box
+                            component={Link}
+                            target={"_blank"}
+                            href={"https://quiz.pena.digital"}
                             sx={{
-                                fontSize: "20px",
-                                color: quizThemes[settings.cfg.theme].isLight ? "#4D4D4D" : "#F5F7FF",
-                                whiteSpace: "nowrap",
+                                display: "flex",
+                                alignItems: "center",
+                                mt: "15px",
+                                gap: "10px",
+                                textDecoration: "none",
+                                mb: "5px"
                             }}
                         >
-                            Сделано на PenaQuiz
-                        </Typography>
-                    </Box>
-                    }
+                            <NameplateLogo
+                                style={{
+                                    fontSize: "34px",
+                                    color: quizThemes[settings.cfg.theme].isLight ? "#000000" : "#F5F7FF",
+                                }}
+                            />
+                            <Typography
+                                sx={{
+                                    fontSize: "20px",
+                                    color: quizThemes[settings.cfg.theme].isLight ? "#4D4D4D" : "#F5F7FF",
+                                    whiteSpace: "nowrap",
+                                }}
+                            >
+                                Сделано на PenaQuiz
+                            </Typography>
+                        </Box>
+                        }
 
-                </Box>
+                    </Box>
 
                     <Box
                         sx={{
-                            boxShadow: "0 0 15px 0 rgba(0,0,0,.08)",
+                            // boxShadow: "0 0 15px 0 rgba(0,0,0,.08)",
                             width: "100%",
                             flexDirection: "column",
                             display: "flex",
                             justifyContent: "center",
                             alignItems: "center",
-                            p: 
-                            (
-                                settings.cfg.resultInfo.showResultForm === "before" &&
-                                !Boolean(settings.cfg.score)
-                            ) ||
-                            (
-                                settings.cfg.resultInfo.showResultForm === "after" &&
-                                resultQuestion.content.redirect
-                            ) 
-                            ? "20px" : "0",
+                            border: "1px solid #9A9AAF80",
+                            p:
+                                (
+                                    settings.cfg.resultInfo.showResultForm === "before" &&
+                                    !Boolean(settings.cfg.score)
+                                ) ||
+                                (
+                                    settings.cfg.resultInfo.showResultForm === "after" &&
+                                    resultQuestion.content.redirect
+                                )
+                                    ? "20px" : "0",
                         }}
                     >
                         {settings.cfg.resultInfo.showResultForm === "before" && !Boolean(settings.cfg.score) && (
@@ -202,16 +219,17 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                             </Button>
                         )}
                         {settings.cfg.resultInfo.showResultForm === "after" &&
-                            resultQuestion.content.redirect && (
-                                <Button
-                                    href={resultQuestion.content.redirect}
-                                    variant="contained"
-                                    sx={{ p: "10px 20px", width: "auto", height: "50px" }}
-                                >
-                                    {resultQuestion.content.hint.text || "Перейти на сайт"}
-                                </Button>
-                            )}
+                        resultQuestion.content.redirect && (
+                            <Button
+                                href={resultQuestion.content.redirect}
+                                variant="contained"
+                                sx={{p: "10px 20px", width: "auto", height: "50px"}}
+                            >
+                                {resultQuestion.content.hint.text || "Перейти на сайт"}
+                            </Button>
+                        )}
                     </Box>
+                </Box>
             </Box>
         </Box>
     );
diff --git a/lib/components/ViewPublicationPage/ViewPublicationPage.tsx b/lib/components/ViewPublicationPage/ViewPublicationPage.tsx
index 7ec4b68..867a411 100644
--- a/lib/components/ViewPublicationPage/ViewPublicationPage.tsx
+++ b/lib/components/ViewPublicationPage/ViewPublicationPage.tsx
@@ -64,7 +64,7 @@ export default function ViewPublicationPage() {
               sx={{
                 fontSize: "16px",
                 padding: "10px 15px",
-                color: "#FFFFFF",
+                color: "#9A9AAF",
                 border: "1px solid #9A9AAF",
                 background: "rgba(154,154,175, 0.2)",
                 "&:disabled": {
diff --git a/lib/components/ViewPublicationPage/tools/Select.tsx b/lib/components/ViewPublicationPage/tools/Select.tsx
index 3795f24..db04121 100644
--- a/lib/components/ViewPublicationPage/tools/Select.tsx
+++ b/lib/components/ViewPublicationPage/tools/Select.tsx
@@ -88,6 +88,9 @@ export const Select = ({
             height: "48px",
             borderRadius: "10px",
           },
+          "& .MuiSelect-icon": {
+          color: theme.palette.primary.main
+          }
         }}
         MenuProps={{
           PaperProps: {
@@ -106,7 +109,7 @@ export const Select = ({
               flexDirection: "column",
               gap: "8px",
               "& .Mui-selected": {
-                backgroundColor: theme.palette.background.default,
+                backgroundColor: "#F2F3F7",
                 color: colorMain,
               },
             },
@@ -114,7 +117,7 @@ export const Select = ({
         }}
         inputProps={{
           sx: {
-            color: colorMain,
+            color: theme.palette.text.primary,
             display: "block",
             px: "9px",
             gap: "20px",
diff --git a/package.json b/package.json
index 52ac4d6..79560eb 100755
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@frontend/squzanswerer",
-    "version": "1.0.5",
+    "version": "1.0.6",
     "type": "module",
     "main": "./dist-package/index.js",
     "module": "./dist-package/index.js",
@@ -86,6 +86,8 @@
     },
     "dependencies": {
         "country-flag-emoji-polyfill": "^0.1.8",
-        "hex-rgb": "^5.0.0"
+        "current-device": "^0.10.2",
+        "hex-rgb": "^5.0.0",
+        "mobile-detect": "^1.4.5"
     }
 }
diff --git a/yarn.lock b/yarn.lock
index 4d84606..44316e8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1593,6 +1593,11 @@ csstype@^3.0.2, csstype@^3.1.2:
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
 
+current-device@^0.10.2:
+  version "0.10.2"
+  resolved "https://registry.yarnpkg.com/current-device/-/current-device-0.10.2.tgz#1e40176bee7da655383ab7245b853fae7d2dfc8e"
+  integrity sha512-FN223n2Cp1fRI/gyjJEAdagHhJ/2Z2STz3tUg1t4F259BhmVRCChkmxcgFtjYJsWuIacQEs7bqJpnAczIXIkWw==
+
 cypress@^13.6.1:
   version "13.6.3"
   resolved "https://registry.yarnpkg.com/cypress/-/cypress-13.6.3.tgz#54f03ca07ee56b2bc18211e7bd32abd2533982ba"
@@ -2687,6 +2692,11 @@ minimist@^1.2.8:
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
   integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
 
+mobile-detect@^1.4.5:
+  version "1.4.5"
+  resolved "https://registry.yarnpkg.com/mobile-detect/-/mobile-detect-1.4.5.tgz#da393c3c413ca1a9bcdd9ced653c38281c0fb6ad"
+  integrity sha512-yc0LhH6tItlvfLBugVUEtgawwFU2sIe+cSdmRJJCTMZ5GEJyLxNyC/NIOAOGk67Fa8GNpOttO3Xz/1bHpXFD/g==
+
 moment@^2.30.1:
   version "2.30.1"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.30.1.tgz#f8c91c07b7a786e30c59926df530b4eac96974ae"