diff --git a/public/assets/images/author.png b/public/assets/images/author.png
new file mode 100644
index 000000000..70c922bc6
Binary files /dev/null and b/public/assets/images/author.png differ
diff --git a/public/assets/images/image20.png b/public/assets/images/image20.png
new file mode 100644
index 000000000..548870b87
Binary files /dev/null and b/public/assets/images/image20.png differ
diff --git a/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.module.scss b/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.module.scss
new file mode 100644
index 000000000..d7ad9af46
--- /dev/null
+++ b/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.module.scss
@@ -0,0 +1,27 @@
+@import "../../../../styles/utilities";
+
+.featuredCard{
+    @apply flex flex-row justify-between;
+    padding-left: 11.2rem;
+    padding-right: 11.2rem;
+}
+.left{
+    max-width: 59.8rem;
+    min-height: 33.6rem;
+}
+.right{
+    max-width: 55.4rem;
+    min-height: 16.8rem;
+}
+.titleWrapper{
+    @apply flex flex-col items-start font-heading;
+    font-size: 3.2rem;
+    line-height: 4rem;
+    margin-bottom: 1.6rem;
+    .title{
+        margin-top: 0.4rem;
+    }
+}
+.content{
+    margin-top: 1.6rem
+}
\ No newline at end of file
diff --git a/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.tsx b/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.tsx
new file mode 100644
index 000000000..ec37f2b97
--- /dev/null
+++ b/src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.tsx
@@ -0,0 +1,35 @@
+
+import s from './FeaturedCardBlog.module.scss'
+import { Author, DateTime } from 'src/components/common'
+import Image from "next/image";
+
+interface FeaturedCardBlogProps{
+    title?: string,
+    content?: string,
+    imgSrc: any,
+    imgAuthor: any,
+    date: string,
+    authorName: string,
+}
+
+const FeaturedCardBlog = ({ title, content, imgSrc, imgAuthor, date, authorName }: FeaturedCardBlogProps) => {
+    return (
+        <section className={s.featuredCard}>
+
+            <div className={s.left}>
+                <Image src={imgSrc} alt="image feature card"/>
+            </div>
+            <div className={s.right}>
+                <div className={s.titleWrapper}>
+                    <DateTime date={date}/>
+                    <a className={s.title}>{title}</a>
+                </div>
+                <Author name={authorName} image={imgAuthor}/>
+                <div className={s.content}>{content}</div>
+            </div>
+
+        </section>
+    )
+}
+
+export default FeaturedCardBlog
\ No newline at end of file
diff --git a/src/components/modules/blogs/index.tsx b/src/components/modules/blogs/index.tsx
new file mode 100644
index 000000000..c56accd23
--- /dev/null
+++ b/src/components/modules/blogs/index.tsx
@@ -0,0 +1 @@
+export { default as FeaturedCardBlog } from './FeaturedCardBlog/FeaturedCardBlog'
\ No newline at end of file
diff --git a/src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.module.scss b/src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.module.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.tsx b/src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.tsx
new file mode 100644
index 000000000..7403a813a
--- /dev/null
+++ b/src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.tsx
@@ -0,0 +1,27 @@
+import { DateTime } from 'src/components/common'
+import s from './DeliveryAndPolicyContent.module.scss'
+
+interface DeliveryAndPolicyContentProps{
+    title?: string,
+    date: string,
+    content: string[],
+}
+
+const DeliveryAndPolicyContent = ( { title, date, content } : DeliveryAndPolicyContentProps) => {
+    return (
+        <section>
+
+            <div className={s.titleWrapper}>
+                <div>LASTEST UPDATED: 
+                    <DateTime date={date} />
+                </div>
+                <div className={s.title}>
+                    {title}
+                </div>
+            </div>
+
+        </section>
+    )
+}
+
+export default DeliveryAndPolicyContent
\ No newline at end of file
diff --git a/src/components/modules/delivery-policy/index.tsx b/src/components/modules/delivery-policy/index.tsx
new file mode 100644
index 000000000..7062c369f
--- /dev/null
+++ b/src/components/modules/delivery-policy/index.tsx
@@ -0,0 +1 @@
+export { default as DeliveryAndPolicyContent} from './DeliveryAndPolicyContent/DeliveryAndPolicyContent'
\ No newline at end of file