Changed font

public/index.html

       type="text/css"
       href="https://fonts.googleapis.com/css?family=Mulish"
     />
+    <link
+      rel="stylesheet"
+      type="text/css"
+      href="https://fonts.googleapis.com/css?family=DM+Sans"
+    />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta

src/assets/styles/_base.scss

 
 * {
   box-sizing: border-box;
+  font-family: "DM Sans";
 }
 
 html {

src/components/About/AboutHeader/AboutHeader.styled.js

   margin: 72px;
 `;
 export const AboutHeaderTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 700;
   font-size: 72px;
   color: ${selectedTheme.primaryPurple};
 `;
 export const AboutHeaderParagraph = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;

src/components/About/AboutSection/AboutSection.styled.js

   margin-bottom: 72px;
 `;
 export const AboutSectionTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 24px;
   margin-bottom: 18px;
 `;
 export const AboutSectionText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;

src/components/About/CheckOffersButton/CheckOffersButton.styled.js

   height: 49px;
   & button {
     color: ${selectedTheme.primaryPurple};
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-style: normal;
     font-weight: 600;
     font-size: 12px;

src/components/Buttons/PrimaryButton/PrimaryButton.js

 };
 
 PrimaryButton.defaultProps = {
-  font: "Open Sans",
+  font: "DM Sans",
 };

src/components/Cards/ChatCard/ChatCard.styled.js

 `;
 export const UserName = styled(Typography)`
   margin-bottom: 12px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryPurple};
   font-weight: 700;
   font-size: 24px;
   }
 `;
 export const LastMessage = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryDarkTextThird};
   line-height: 22px;
   font-size: 16px;

src/components/Cards/ChatCard/LittleOfferDetails/LittleOfferDetails.styled.js

 `;
 
 export const OfferText = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: "12px";
   color: ${selectedTheme.primaryText};
 `;
 
 export const OfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   flex: 1;
   color: ${selectedTheme.primaryPurple};
   font-weight: 700;

src/components/Cards/ChatCard/MobileOfferDetails/MobileOfferDetails.styled.js

 `;
 
 export const OfferTitleMobile = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   display: none;
   flex: 1;
   color: ${selectedTheme.primaryPurple};
   }
 `;
 export const OfferTextMobile = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 9px;
   color: ${selectedTheme.primaryText};
 `;

src/components/Cards/ChatCard/OfferLocation/OfferLocation.styled.js

 `;
 
 export const XSText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 14px;

src/components/Cards/CreateOfferCard/CreateOffer.styled.js

   }
 `;
 export const CreateOfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   /* width: 328px;
   height: 33px; */
   text-align: center;
   }
 `;
 export const CreateOfferDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;
 `;
 export const SelectText = styled(Typography)`
   font-size: 16px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 400;
 `;
 export const SelectField = styled(Select)`
 `;
 
 export const SelectAltText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 
   font-style: italic;
   white-space: pre;

src/components/Cards/CreateOfferCard/FirstPart/FirstPartCreateOffer.styled.js

 import { TextField } from "../../../TextFields/TextField/TextField";
 
 export const CreateOfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;
   position: relative;
 `;
 export const CreateOfferDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;

src/components/Cards/CreateOfferCard/SecondPart/SecondPartCreateOffer.styled.js

   font-size: 13px;
   width: 100%;
   text-align: center;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   /* margin-top: 0px; */
 `;

src/components/Cards/FilterCard/FilterDropdown/Checkbox/CheckboxDropdownList/CheckboxDropdownList.styled.js

   padding-right: 6px;
   line-height: 12px;
   letter-spacing: 0.02em;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   cursor: pointer;
   margin-right: 3px;

src/components/Cards/FilterCard/FilterDropdown/Checkbox/CheckboxDropdownList/SearchField/SearchField.js

       value={props.value}
       onChange={props.onChange}
       textsize={"12px"}
-      font={"Open Sans"}
+      font={"DM Sans"}
       fullWidth
       height={"40px"}
       containerStyle={{ marginTop: "6px" }}

src/components/Cards/FilterCard/FilterDropdown/Radio/FilterRadioDropdown.js

             value={toSearch}
             onChange={(event) => setToSearch(event.target.value)}
             textsize={"12px"}
-            font={"Open Sans"}
+            font={"DM Sans"}
             fullWidth
             height={"40px"}
             containerStyle={{ marginTop: "6px" }}

src/components/Cards/FilterCard/FilterFooter/FilterFooter.js

           fullWidth
           onClick={props.toggleFilters}
           textcolor={selectedTheme.primaryPurple}
-          font="Open Sans"
+          font="DM Sans"
           style={{
             fontWeight: "600",
             fontSize: "12px",
         fullWidth
         onClick={handleFilters}
         textcolor={selectedTheme.primaryPurple}
-        font="Open Sans"
+        font="DM Sans"
         style={{
           fontWeight: "600",
           fontSize: "12px",

src/components/Cards/FilterCard/FilterHeader/FilterHeader.js

   return (
     <FilterHeaderContainer>
       <Title>{t("filters.title")}</Title>
-      <Link to="#" textsize={"12px"} font={"Open Sans"} onClick={clearFilters}>
+      <Link to="#" textsize={"12px"} font={"DM Sans"} onClick={clearFilters}>
         {t("filters.cancel")}
       </Link>
     </FilterHeaderContainer>

src/components/Cards/FilterCard/FilterHeader/FilterHeader.styled.js

   font-size: 24px;
   line-height: 33px;
   font-weight: 700;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   position: relative;
 `;

src/components/Cards/ItemDetailsCard/Information/Information.styled.js

   align-items: center;
 `;
 export const InfoText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-transform: capitalize;
   @media (max-width: 600px) {
     font-size: 12px;

src/components/Cards/ItemDetailsCard/ItemDetailsCard.styled.js

 `;
 
 export const PostDate = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryText};
   &::before {
     content: "Objavljeno: ";
     @media (max-width: 600px) {
       font-size: 9px;
-      font-family: "Open Sans";
+      font-family: "DM Sans";
     }
   }
   @media (max-width: 600px) {
   flex-direction: column;
 `;
 export const OfferAuthorName = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
 `;
 export const OfferLocation = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
 `;
 
 export const OfferCategory = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 33%;
 `;
 export const OfferPackage = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 34%;
 `;
 export const OfferViews = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 34%;
 `;
 export const OfferDescriptionTitle = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 16px;
   }
 `;
 export const OfferDescriptionText = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 22px;
   }
 `;
 export const DetailText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;

src/components/Cards/ItemDetailsCard/OfferDetails/OfferDetails.styled.js

 `;
 
 export const OfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   flex: 1;
   color: ${selectedTheme.primaryPurple};
   font-weight: 700;
   }
 `;
 export const OfferDescriptionTitle = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 16px;
   }
 `;
 export const OfferDescriptionText = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 22px;
 `;
 export const DesciprtionPostDate = styled(Typography)`
   display: none;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryText};
   margin-top: 18px;
     content: "Objavljeno: ";
     @media (max-width: 600px) {
       font-size: 9px;
-      font-family: "Open Sans";
+      font-family: "DM Sans";
     }
   }
   @media screen and (min-width: 600px) and (max-width: 1200px) {

src/components/Cards/LittleOfferCard/LittleOfferCard.styled.js

 export const OfferName = styled(Typography)`
     font-weight: 600;
     font-size: 16px;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     color: ${selectedTheme.primaryPurple};
 `
 export const OfferCategory = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 12px;
     color: ${selectedTheme.primaryDarkText};
 `

src/components/Cards/MessageCard/MessageCard.styled.js

     }
 `;
 export const MessageText = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     line-height: 22px;
     color: ${props => props.isMyMessage ? `white` : selectedTheme.messageText};

src/components/Cards/MiniChatCard/MiniChatCard.styled.js

 export const ProfileName = styled(Typography)`
   font-size: 16px;
   font-weight: 600;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${props => props.selected ? selectedTheme.primaryYellow : selectedTheme.primaryPurple};
 `;
 export const ProfileProduct = styled(Typography)`
   margin-top: 9px;
   font-size: 9px;
   color: ${props => props.selected ? "white" : selectedTheme.primaryDarkTextThird};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 10px;
   margin-left: 1px;
 `;
   font-size: 12px;
   font-weight: ${props => props.selected ? "400" : "600"};
   color: ${props => props.selected ? "white" : selectedTheme.primaryDarkTextThird};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 14px;
   margin-left: 1px;
 `;

src/components/Cards/OfferCard/DeleteOffer/DeleteOffer.styled.js

 `;
 
 export const DeleteQuestion = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   font-weight: 600;
   text-align: center;

src/components/Cards/OfferCard/OfferCard.styled.js

   `}
 `;
 export const OfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   flex: 1;
   color: ${selectedTheme.primaryPurple};
   font-weight: 700;
   flex-direction: column;
 `;
 export const OfferAuthorName = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryText};
   }
 `;
 export const OfferLocation = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryDarkText};
   line-height: 16px;
   font-size: 12px;
   }
 `;
 export const OfferCategory = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   `}
 `;
 export const OfferPackage = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
 `;
 export const OfferViews = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   `}
 `;
 export const OfferDescriptionTitle = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 16px;
 `;
 export const OfferDescriptionText = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 22px;
   }
 `;
 export const DetailText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;

src/components/Cards/UserReviewsCard/UserReviewsCard.styled.js

 `
 
 export const ReviewsTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   @media (max-width: 800px) {
     display: none;
 export const NoReviewsText = styled(Typography)`
   color: ${selectedTheme.primaryPurple};
   font-size: 24px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   font-weight: 700;
   width: 100%;
 export const NoReviewsAltText = styled(Typography)`
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   width: 100%;
   margin-bottom: 36px;
 export const ReviewQuoteBox = styled(Grid)`
 `
 export const ReviewQuoteText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
 `
 export const ReviewDetails = styled(Grid)`
 `
 export const ReviewDetailsText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   font-style: italic;
 export const ProfileName = styled(Typography)`
   font-weight: 600;
   font-size: 16px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 `
 export const ReviewContainer = styled(Box)`
 `

src/components/ChatColumn/ChatColumn.styled.js

 export const HeaderSelect = styled(Select)`
   width: 210px;
   height: 35px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 3px;
   font-weight: 400;
   position: relative;

src/components/CheckBox/CheckBox.styled.js

     `}
   margin-right: 0;
   & label {
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 12px;
   }
   & span:nth-child(1) svg {

src/components/CheckBox/Label.styled.js

 `
 
 export const LeftLabel = styled(FormLabel)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     max-width: 100px;
     cursor: pointer;
     color: ${selectedTheme.primaryText};
-    font-family: "Open Sans";
+    font-family: "DM Sans";
 
 `

src/components/CreateReview/CreateReview.styled.js

   width: 100%;
   text-align: center;
   color: ${selectedTheme.primaryPurple};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 24px;
   font-weight: 700;
   padding-bottom: 36px;

src/components/CreateReview/FirstStep/FirstStepCreateReview.styled.js

   width: 100%;
   text-align: center;
   color: ${selectedTheme.primaryPurple};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 24px;
   font-weight: 700;
   padding-bottom: 36px;
   }
 `;
 export const SelectOption = styled(Option)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   text-align: left;
   @media (max-width: 600px) {
 `;
 export const CommentField = styled(TextField)`
   & * {
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     &::-webkit-scrollbar {
       width: 5px;

src/components/CreateReview/ThirdStep/ThirdStepCreateReview.styled.js

 export const MainTitle = styled(Typography)`
   font-weight: 700;
   font-size: 24px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   width: 100%;
   color: ${selectedTheme.primaryPurple};
 export const AltTitle = styled(Typography)`
   width: 100%;
   text-align: center;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 400;
   font-size: 16px;
   color: ${selectedTheme.primaryPurple};

src/components/DirectChat/DirectChatContent/DirectChatContentHeader/DirectChatContentHeader.styled.js

 `
 export const ProfileName = styled(Box)`
     font-weight: 600;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     color: ${selectedTheme.primaryPurple};
 `
 export const ProfileLocationText = styled(Box)`
     color: ${selectedTheme.primaryDarkText};
     font-size: 12px;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     margin-left: 5.5px;
 
 `

src/components/DirectChat/DirectChatHeaderTitle/DirectChatHeaderTitle.styled.js

 
 `
 export const HeaderTitleContent = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     position: relative;
     left: 9px;

src/components/DirectChat/MiniChatColumn/MiniChatColumnHeader/MiniChatColumnHeaderTitle.styled.js

     }
 `
 export const HeaderTitleContent = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     position: relative;
     left: 9px;

src/components/Dropdown/DropdownItem/DropdownItem.styled.js

 `
 
 export const DropdownItemStyled = styled(Box)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
 `

src/components/Dropdown/DropdownList/DropdownList.styled.js

   padding-bottom: 10px;
   padding-top: 5px;
   padding-right: 0.9rem;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${(props) =>
     props.disabled
       ? selectedTheme.iconStrokeDisabledColor

src/components/Footer/AboutFooter.styled.js

   padding: 0 72px;
 `;
 export const AboutFooterText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 400;
   font-size: 16px;
   line-height: 22px;
   top: 29px;
 `;
 export const LinkText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryGrayText};

src/components/Header/AboutHeader/AboutHeader.styled.js

 `;
 export const LinkRoute = styled(Link)`
   text-decoration: none;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: ${props => props.selected ? "600" : "400"};
   font-size: 16px;
   line-height: 22px;

src/components/Header/Drawer/Drawer.styled.js

 `
 export const DrawerOption = styled(Typography)`
   font-weight: 600;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryPurple};
   font-size: 18px;
   position: relative;
   font-weight: 600;
   font-size: 14px;
   color: ${selectedTheme.primaryPurple};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   left: -14px;
   top: -3px;
 `
 export const HeaderTitle = styled(Typography)`
   font-weight: 700;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 18px;
   color: ${selectedTheme.primaryDarkTextThird};
   position: absolute;
 `
 export const MyUsername = styled(Typography)`
   font-size: 12px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryPurple};
   position: relative;
   top: 12px;

src/components/Header/Header.styled.js

   flex: 3;
   max-width: 520px;
   margin-right: 30px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   @media (max-width: 1700px) {
     margin-left: 15%;
   }
   color: ${selectedTheme.primaryPurple};
   padding-top: 5px;
   padding-right: 10px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 600;
   white-space: nowrap;
 `;
     top: 70px;
     height: 46px;
     left: -5px;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     ${props => !props.shouldShow && `display: none;`}
     & div {
       background-color: white;

src/components/Icon/IconWithNumber/IconWithNumber.styled.js

     font-size: 10px;
     bottom: 0;
     right: -5px;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
 `

src/components/ItemDetails/Header/Header.styled.js

   gap: 12px;
 `;
 export const HeaderText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryPurple};

src/components/ItemDetails/ItemDetails.styled.js

 `;
 
 export const OfferIconText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   margin-left: 7.2px;
 

src/components/ItemDetails/ItemDetailsHeaderCard/ItemDetailsHeaderCard.styled.js

 `;
 export const OfferTitle = styled(Typography)`
   margin-bottom: 12px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${(props) =>
     props.isMyProfile
       ? selectedTheme.primaryYellow
   flex-direction: column;
 `;
 export const OfferAuthorName = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
 `;
 export const OfferLocation = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
 `;
 export const OfferPIB = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${(props) =>
     props.isMyProfile
       ? selectedTheme.primaryDarkTextThird
 `;
 
 export const OfferCategory = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 33%;
 `;
 export const OfferPackage = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 34%;
 `;
 export const OfferViews = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   font-size: 12px;
   width: 34%;
 `;
 export const OfferDescriptionTitle = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 16px;
 `;
 export const OfferDescriptionText = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryDarkText};
   line-height: 22px;

src/components/ItemDetails/ItemDetailsHeaderCard/OfferDetail/Category/CategoryDetail.styled.js

   flex-direction: row;
   align-items: center;
   gap: 7px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   margin-bottom: 7px;
   }
 `;
 export const DetailText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${props => props.isMyProfile ? "white" : selectedTheme.primaryText};
   line-height: 16px;
   font-size: 16px;

src/components/ItemDetails/ItemDetailsHeaderCard/OfferDetail/PIB/PIBDetail.styled.js

   flex-direction: row;
   align-items: center;
   gap: 7px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   line-height: 16px;
   margin-bottom: 7px;
   }
 `;
 export const DetailText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${props => props.isMyProfile ? "white" : selectedTheme.primaryText};
   line-height: 16px;
   font-size: 16px;

src/components/ItemDetails/ItemDetailsHeaderCard/StatisticDetails/StatisticDetails.styled.js

   }
 `;
 export const StatusText = styled(Grid)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   @media (max-width: 600px) {
     font-size: 12px;

src/components/Login/Description/LoginDescription.styled.js

 import selectedTheme from "../../../themes";
 
 export const LoginDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;

src/components/Login/ErrorMessage/ErrorMessage.styled.js

 
 export const ErrorText = styled(Typography)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: -12px;
   height: 20px;

src/components/Login/Title/LoginTitle.styled.js

 import selectedTheme from "../../../themes";
 
 export const LoginTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;

src/components/MarketPlace/Header/Header.styled.js

   align-items: center;
 `;
 export const HeaderLocation = styled(Box)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryPurple};
   font-weight: 700;
   line-height: 22px;
 export const HeaderSelect = styled(Select)`
   width: 210px;
   height: 35px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 3px;
   font-weight: 400;
   position: relative;
   }
 `;
 export const SelectItem = styled(MenuItem)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 `;
 export const SelectOption = styled(Option)`
   @media (max-width: 600px) {
   margin-right: 40px;
 `;
 export const HeaderAltLocation = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryText};
   margin-left: 5px;
   }
 `;
 export const MySwapsTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: ${selectedTheme.primaryDarkTextThird};
   position: relative;

src/components/MarketPlace/Offers/OffersNotFound.styled.js

 `;
 
 export const OffersNotFoundHeading = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 72px;
   font-weight: 700;
   color: ${selectedTheme.primaryPurple};
 `;
 
 export const OffersNotFoundDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   color: #818181;
   margin: 9px 0 46px 0;

src/components/Paging/Paging.styled.js

 export const PagingContainer = styled(Box)`
   width: calc(100% / 12 * 8.5);
   text-align: center;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   display: flex;
   flex: 1;
   justify-content: center;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   height: 40px;
   min-width: 40px;
   max-width: 40px;
   font-weight: 600;
   font-size: 16px;
   line-height: 18px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   height: 40px;
   min-width: 40px;
   max-width: 40px;

src/components/Popovers/HeaderPopover/HeaderPopover.styled.js

   color: white;
   width: 100%;
   min-width: 270px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 `;
 export const PopoverList = styled(List)`
   width: 100%;
 export const PopoverListItemAvatarContainer = styled(ListItemAvatar)``;
 export const PopoverButton = styled(Button)`
   color: ${selectedTheme.primaryPurple};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 600;
   font-size: 12px;
   text-align: right;
   font-weight: 600;
   padding-top: 5px;
   font-size: 13px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 `;

src/components/Popovers/PhonePopover/PhonePopover.styled.js

   text-align: center;
   align-items: center;
   display: flex;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   left: 18px;
   top: 5px;
   position: relative;
   left: 18px;
   top: 5px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 600;
   font-size: 16px;
   line-height: 22px;

src/components/Prices/Plan/Plan.styled.js

     props.highlighted && `box-shadow: 4px 4px 9px rgba(0, 0, 0, 0.12);`}
 `;
 export const PlanTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-weight: 600;
   font-size: 24px;
   line-height: 33px;
       : selectedTheme.primaryPurple};
 `;
 export const PlanTitleDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;
   gap: 9px;
 `;
 export const PlanPrice = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 24px;
     props.highlighted ? "white" : selectedTheme.primaryPurple};
 `;
 export const PlanPriceMonthly = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 24px;
   gap: 6px;
 `;
 export const PlanDetailTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 16px;
       : selectedTheme.primaryPurple};
 `;
 export const PlanDetailDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 100;
   font-size: 16px;
 export const BuyButton = styled(PrimaryButton)`
   text-align: center;
   margin-top: 18px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 12px;

src/components/Prices/PricesComponent.styled.js

 export const CartIcon = styled(Cart)``;
 export const SendIcon = styled(Send)``;
 export const PricesAltText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;

src/components/Prices/PricesHeader/PricesHeader.styled.js

 import { ArrowButton } from "../../Buttons/ArrowButton/ArrowButton";
 
 export const PricesHeaderTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 700;
   font-size: 72px;
 `;
 export const LinkText = styled(Typography)`
   border-bottom: 1px dotted ${selectedTheme.primaryPurple};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryPurple};

src/components/PrivacyPolicy/PrivacyPolicyHeader/PrivacyPolicyHeader.styled.js

   margin: 72px;
 `;
 export const PrivacyPolicyHeaderTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 700;
   font-size: 72px;
   color: ${selectedTheme.primaryPurple};
 `;
 export const PrivacyPolicyHeaderParagraph = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;

src/components/PrivacyPolicy/PrivacyPolicySection/PrivacyPolicySection.styled.js

     margin-top: 25px;
 `;
 export const PrivacyPolicySectionTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 600;
   font-size: 24px;
   margin-bottom: 18px;
 `;
 export const PrivacyPolicySectionText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   font-size: 16px;

src/components/Profile/Header/Header.styled.js

   gap: 12px;
 `;
 export const HeaderText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   line-height: 22px;
   font-size: 16px;
   color: ${selectedTheme.primaryPurple};

src/components/Profile/ProfileOffers/NoProfileOffers.js/NoProfileOffers.styled.js

     width: 100%;
 `
 export const NoProfileOffersMainText = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-weight: 700;
     font-size: 24px;
     text-align: center;
     line-height: 33px;
 `
 export const NoProfileOffersAltText = styled(Typography)`
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 16px;
     color: ${selectedTheme.primaryGrayText};
     text-align: center;

src/components/Profile/ProfileOffers/ProfileOffers.styled.js

 `;
 export const HeaderTitle = styled(Typography)`
   font-size: 16px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryDarkTextThird};
   position: relative;
   margin-left: 10px;
 export const HeaderSelect = styled(Select)`
   width: 210px;
   height: 35px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 3px;
   font-weight: 400;
   position: absolute;

src/components/ProfileCard/EditProfile/EditProfile.styled.js

 `;
 
 export const ProfileHeader = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 24px;
   font-weight: 700;
   margin-top: 9px;
 
 export const ErrorMessage = styled(Typography)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: 20px;
   font-size: 14px;

src/components/ProfileCard/ProfileCard.styled.js

 //       : selectedTheme.primaryPurple};
 //   font-weight: 700;
 //   font-size: 24px;
-//   font-family: "Open Sans";
+//   font-family: "DM Sans";
 //   margin-bottom: 5px;
 //   @media (max-width: 600px) {
 //     font-size: 18px;
 //   color: ${(props) =>
 //     props.isMyProfile ? "white" : selectedTheme.primaryDarkText};
 //   margin-top: 0.18rem;
-//   font-family: "Open Sans";
+//   font-family: "DM Sans";
 //   font-size: 16px;
 //   padding-top: 1px;
 //   @media (max-width: 600px) {
 //   color: ${(props) =>
 //     props.isMyProfile ? "white" : selectedTheme.primaryDarkText};
 //   display: unset;
-//   font-family: "Open Sans";
+//   font-family: "DM Sans";
 //   letter-spacing: 0.02em;
 //   font-size: 16px;
 //   position: relative;
 //   margin-right: 2rem;
 //   display: unset;
 //   margin-left: 1rem;
-//   font-family: "Open Sans";
+//   font-family: "DM Sans";
 //   font-size: 16px;
 //   margin-bottom: 2px;
 //   @media (max-width: 600px) {
 
 export const HeaderTitle = styled(Typography)`
   font-size: 16px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryDarkTextThird};
   position: relative;
   @media (max-width: 600px) {

src/components/ProfileCard/ProfileContact/ProfileContact.styled.js

   color: ${(props) =>
     props.isMyProfile ? "white" : selectedTheme.primaryDarkText};
   display: unset;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   letter-spacing: 0.02em;
   font-size: 16px;
   position: relative;

src/components/ProfileCard/ProfileMainInfo/ProfileMainInfo.styled.js

       : selectedTheme.primaryPurple};
   font-weight: 700;
   font-size: 24px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-bottom: 5px;
   @media (max-width: 600px) {
     font-size: 18px;
   color: ${(props) =>
     props.isMyProfile ? "white" : selectedTheme.primaryDarkText};
   margin-top: 0.18rem;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   padding-top: 1px;
   @media (max-width: 600px) {

src/components/ProfileCard/ProfileStats/ProfileStats.styled.js

   margin-right: 2rem;
   display: unset;
   margin-left: 1rem;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   margin-bottom: 2px;
   @media (max-width: 600px) {

src/components/ProfileMini/ProfileMini.styled.js

   }
 `;
 export const ProfileHeaderText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   margin-left: 7.2px;
 

src/components/Radio/Button/RadioButton.styled.js

     `}
   margin-right: 0;
   & label {
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     font-size: 12px;
   }
   & span:nth-child(1) svg {

src/components/Select/Select.styled.js

     padding: 2px;
     font-size: 16px;
     font-weight: 600;
-    font-family: "Open Sans";
+    font-family: "DM Sans";
     cursor: pointer;
     & fieldset {
         border-color: ${props => props.borderColor ? props.borderColor : selectedTheme.primaryPurple} !important;

src/components/StepProgress/StepProgress.styled.js

       ? selectedTheme.primaryPurple
       : selectedTheme.primaryDarkGrayText};
   border-radius: 100%;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   border: 5px solid
     ${(props) =>

src/components/Styles/globalStyles.js

 // import Mulish from "./fonts/Mulish-Regular.ttf"
 const GlobalStyle = createGlobalStyle`
   ${'' /* @font-face {
-    font-family: 'Open Sans';
+    font-family: 'DM Sans';
     src: url(${OpenSans}) format('truetype');
     font-weight: 400;
     font-style: normal;

src/components/TextFields/TextField/TextField.js

   italicPlaceholder: false,
   showAnimation: false,
   height: "48px",
-  // font: "Open Sans"
+  // font: "DM Sans"
 };

src/components/UserReviews/NoReviews/NoReviews.styled.js

 export const NoReviewsText = styled(Typography)`
   color: ${selectedTheme.primaryPurple};
   font-size: 24px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   font-weight: 700;
   width: 100%;
 export const NoReviewsAltText = styled(Typography)`
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   width: 100%;
   margin-bottom: 36px;

src/components/UserReviews/UserReviews.styled.js

 `;
 
 export const ReviewsTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   @media (max-width: 600px) {
     font-size: 12px;
 export const NoReviewsText = styled(Typography)`
   color: ${selectedTheme.primaryPurple};
   font-size: 24px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   font-weight: 700;
   width: 100%;
 export const NoReviewsAltText = styled(Typography)`
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   text-align: center;
   width: 100%;
   margin-bottom: 36px;
 export const ThumbBox = styled(Grid)``;
 export const ReviewQuoteBox = styled(Grid)``;
 export const ReviewQuoteText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
 `;
 export const ReviewDetails = styled(Grid)``;
 export const ReviewDetailsText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 12px;
   color: ${selectedTheme.primaryDarkText};
   font-style: italic;
 export const ProfileName = styled(Typography)`
   font-weight: 600;
   font-size: 16px;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
 `;
 export const ReviewContainer = styled(Box)``;

src/pages/CreateOffer/CreateOffer.styled.js

   align-items: center;
 `;
 export const CreateOfferTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;
   margin-bottom: 40px;
 `;
 export const CreateOfferDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;

src/pages/ErrorPages/NotFoundPage.styles.js

 `;
 
 export const ErrorHeading = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 72px;
   font-weight: 700;
   color: ${selectedTheme.primaryPurple};
 `;
 
 export const ErrorMessage = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-size: 16px;
   font-weight: 400;
   color: #818181;

src/pages/ForgotPasswordPage/ForgotPassword.styled.js

   }
 `;
 export const ForgotPasswordTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;
   margin-top: 36px;
 `;
 export const ForgotPasswordDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;
 `;
 export const ErrorMessage = styled(Typography)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: -7px;
   font-size: 14px;

src/pages/ForgotPasswordPage/ForgotPasswordMailSent/MailSent.styled.js

   }
 `;
 export const Title = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   width: 328px;
   height: 33px;
   margin-top: 6px;
 `;
 export const Description = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 279px;
   font-style: normal;
   height: 216px;
 `;
 export const StandardText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   font-size: 16px;
   padding-right: 6px;

src/pages/RegisterPages/Register/FirstPart/FirstPartOfRegistration.styled.js

   width: 335px;
 `;
 export const RegisterDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   display: flex;
 `;
 export const ErrorMessage = styled(Typography)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: -7px;
   font-size: 14px;

src/pages/RegisterPages/Register/Register.styled.js

   }
 `;
 export const RegisterTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;
   }
 `;
 export const RegisterDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 221px;
   font-style: normal;
   justify-content: center;
 `;
 export const FooterText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: #505050;
   text-align: center;
   width: 330px;
 `;
 export const ErrorMessage = styled(Box)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: 5px;
   text-align: left;

src/pages/RegisterPages/Register/SecondPart/SecondPartOfRegistration.styled.js

   width: 335px;
 `;
 export const RegisterDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   display: flex;
 `;
 export const ErrorMessage = styled(Typography)`
   color: red;
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   position: relative;
   top: -7px;
   font-size: 14px;

src/pages/RegisterPages/Register/ThirdPart/ThirdPartOfRegistration.styled.js

   width: 335px;
 `;
 export const RegisterDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   font-style: normal;
   font-weight: 400;
   display: flex;

src/pages/RegisterPages/RegisterSuccessful.js/RegisterSuccessful.styled.js

   margin-top: 32px;
 `;
 export const RegisterDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 36px;
   width: 430px;
   font-style: normal;

src/pages/ResetPasswordPage/ResetPasswordPage.styled.js

   }
 `;
 export const ResetPasswordTitle = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   width: 328px;
   height: 33px;
   text-align: center;
   margin-top: 36px;
 `;
 export const ResetPasswordDescription = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   margin-top: 9px;
   width: 270px;
   font-style: normal;
   justify-content: center;
 `;
 export const FooterText = styled(Typography)`
-  font-family: "Open Sans";
+  font-family: "DM Sans";
   color: ${selectedTheme.primaryText};
   padding-right: 6px;
   text-align: center;