diff --git a/solutions/position/1/decktop-view.jpg b/solutions/position/1/decktop-view.jpg
new file mode 100644
index 0000000..e01945f
Binary files /dev/null and b/solutions/position/1/decktop-view.jpg differ
diff --git a/solutions/position/1/index.html b/solutions/position/1/index.html
new file mode 100644
index 0000000..30aee6b
--- /dev/null
+++ b/solutions/position/1/index.html
@@ -0,0 +1,48 @@
+
+
+
+
+
+ Navbar-bottom
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/solutions/position/1/mobile-view.jpg b/solutions/position/1/mobile-view.jpg
new file mode 100644
index 0000000..3489772
Binary files /dev/null and b/solutions/position/1/mobile-view.jpg differ
diff --git a/solutions/position/1/style.css b/solutions/position/1/style.css
new file mode 100644
index 0000000..b16429d
--- /dev/null
+++ b/solutions/position/1/style.css
@@ -0,0 +1,85 @@
+
+
+*{
+ margin: 0;
+}
+.wrapper{
+ height: 100vh;
+ width: 100vw;
+ background: #FFBFCB;
+}
+nav.navbar{
+ position: fixed;
+ bottom: 0;
+ width: 100%;
+}
+.nav-container{
+ display: flex;
+ justify-content: space-between;
+ padding: 20px;
+ background: #FFF;
+}
+.wrapper a{
+ color: initial;
+ text-decoration: none;
+}
+.icons{
+ display: flex;
+ justify-content: center;
+ width: 100%;
+}
+.icons i{
+ font-size: 40px;
+}
+.search{
+ position: relative;
+}
+.search-input-container{
+ position: absolute;
+ transform: translateY(0);
+ width: 100%;
+ height: 30px;
+ transition: transform 0.3s linear;
+ z-index: -1;
+}
+.showSearch.search-input-container{
+ transform: translateY(-80px);
+}
+.search-input-container form{
+ width: 100%;
+ height: 100%;
+}
+.search-input-container input{
+ width: 100%;
+ height: 100%;
+ border: 1px solid #000;
+ border-radius: 5px;
+ padding: 0;
+ padding-left: 10px;
+ font: 400 18px;
+}
+.search-input-container input:focus{
+ outline: none;
+}
+
+.chat i{
+ position: relative;
+}
+.chat i::after{
+ position: absolute;
+ content: '';
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ right: 0;
+ top: 0;
+ background-color: red;
+}
+@media only screen and (max-width:768px){
+ .icons i{
+ font-size: 30px;
+ }
+ .search-input-container{
+ width: 200%;
+ }
+}
\ No newline at end of file
diff --git a/solutions/position/2/bg.jpg b/solutions/position/2/bg.jpg
new file mode 100644
index 0000000..dd0a4a2
Binary files /dev/null and b/solutions/position/2/bg.jpg differ
diff --git a/solutions/position/2/index.html b/solutions/position/2/index.html
new file mode 100644
index 0000000..2ebe100
--- /dev/null
+++ b/solutions/position/2/index.html
@@ -0,0 +1,28 @@
+
+
+
+
+
+ Blog Card
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/solutions/position/2/preveiw.jpg b/solutions/position/2/preveiw.jpg
new file mode 100644
index 0000000..68392de
Binary files /dev/null and b/solutions/position/2/preveiw.jpg differ
diff --git a/solutions/position/2/style.css b/solutions/position/2/style.css
new file mode 100644
index 0000000..758750f
--- /dev/null
+++ b/solutions/position/2/style.css
@@ -0,0 +1,103 @@
+
+
+*{
+ margin: 0;
+}
+body{
+ background: #bf8a8a;
+}
+.wrapper{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100vh;
+ width: 100vw;
+}
+.blog-wrap{
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ min-width: 300px;
+ min-height: 300px;
+ background: url('bg.jpg') no-repeat center/cover;
+ position: relative;
+ border-radius: 15px;
+ overflow: hidden;
+ padding: 10px;
+}
+.blog-wrap::before{
+ position: absolute;
+ content: '';
+ width: 100%;
+ height: 100%;
+ background: #000;
+ filter: opacity(0.5);
+ top: 0;
+ left: 0;
+}
+.blogtop,
+.blogbottom{
+ display: flex;
+ position: relative;
+}
+.blogtop{
+ justify-content: space-between;
+ align-items: center;
+}
+.blogbottom{
+ justify-content: end;
+ gap: 10px;
+}
+.food button{
+ background: transparent;
+ padding: 5px;
+ border: none;
+ cursor: pointer;
+ font-size: 25px;
+ color: #fff;
+}
+.save button{
+ background: red;
+ padding: 20px;
+ border: none;
+ cursor: pointer;
+ font-size: 20px;
+ color: #fff;
+ border-radius: 20px;
+}
+.upload,
+.dots {
+ filter: brightness(0.7);
+}
+.upload{
+ background: #fff;
+ height: 50px;
+ width: 50px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border: none;
+ border-radius: 100%;
+ cursor: pointer;
+ > i {
+ font-size: 18px;
+ }
+}
+.dots{
+ background: #fff;
+ border: none;
+ height: 50px;
+ width: 50px;
+ border-radius: 50%;
+ cursor: pointer;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 3px;
+ > span{
+ height: 10px;
+ width: 9px;
+ border-radius:50%;
+ background-color: #000;
+ }
+}