diff --git a/index.css b/index.css
new file mode 100644
index 0000000..4300932
--- /dev/null
+++ b/index.css
@@ -0,0 +1,177 @@
+*{
+ padding: 0;
+ margin: 0;
+ text-decoration: none;
+ list-style: none;
+ box-sizing: border-box;
+}
+body{
+ font-family: montserrat;
+ background-color: #E7E4D6;
+}
+nav{
+ background: orange;
+ height: 80px;
+ width: 100%;
+}
+label.logo{
+ color: black;
+ font-size: 35px;
+ line-height: 80px;
+ padding: 0 100px;
+ font-weight: bold;
+}
+nav ul{
+ float: right;
+ margin-right: 20px;
+}
+nav ul li{
+ display: inline-block;
+ line-height: 80px;
+ margin: 0 5px;
+}
+nav ul li a{
+ color: black;
+ font-size: 17px;
+ font-weight: bold;
+ padding: 7px 13px;
+ border-radius: 3px;
+}
+
+active,a:hover{
+ background: #1b9bff;
+ transition: .5s;
+}
+.checkbtn{
+ font-size: 30px;
+ color: black;
+ float: right;
+ line-height: 80px;
+ margin-right: 40px;
+ cursor: pointer;
+ display: none;
+}
+#check{
+ display: none;
+}
+@media (max-width: 952px){
+ label.logo{
+ font-size: 30px;
+ padding-left: 50px;
+ }
+ nav ul li a{
+ font-size: 16px;
+ }
+}
+@media (max-width:858px){
+ .checkbtn{
+ display: block;
+ }
+ ul{
+ position: fixed;
+ width: 100%;
+ height: 100vh;
+ background: #E7E4D6;
+ top: 80px;
+ left: -100;
+ text-align: center;
+ transition: all .5s;
+ }
+ nav ul li{
+ display: block;
+ margin: 50px 0;
+ line-height: 30px;
+ }
+ nav ul li a{
+ font-size: 20px;
+ }
+ a:hover,a.active{
+ background: none;
+ color:#0082e6
+ }
+ #check:checked ~ ul{
+ left: 0;
+ }
+}
+h1{
+ font-size: 60px;
+ font-weight: bolder;
+ margin-top: 240px;
+ margin-left: 220px;
+ letter-spacing: 4px;
+ font-family: "Andada Pro", sans-serif
+}
+h2{
+ font-size: 40px;
+ font-weight: bold;
+ margin-top: 10px;
+ margin-left: 220px;
+ word-spacing: 4px;
+ font-family: "Andada Pro", sans-serif
+}
+h3{
+ font-size: 30px;
+ font-weight: lighter;
+ margin-left: 220px;
+ margin-top: 15px;
+ word-spacing: 4px;
+ font-family: "Andada Pro", sans-serif
+}
+.frame{
+ height: 480px;
+ width: 430px ;
+ position: absolute;
+ top: 20%;
+ right: 175px;
+ background-color: transparent;
+ border: 2px solid black;
+ padding: 20px;
+ border-radius: 20px;
+ border-width: 4px;
+}
+.frame img {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ max-width: 50%;
+ max-height: 60%;
+}
+.circle {
+ position: absolute;
+ top: 40%;
+ left: 45%;
+ transform: translate(-50%, -50%);
+ width: 200px;
+ height: 200px;
+ background-color: orange;
+ border-radius: 50%;
+ z-index: 0;
+}
+.text {
+ position: absolute;
+ bottom: 45px;
+ left: 50%;
+ transform: translateX(-50%);
+ text-align: center;
+ font-size: 20px;
+ font-weight: bold;
+ color: black;
+ font-family: "Andada Pro", sans-serif
+}
+.last{
+ /* display: flex; */
+ background-color: orange;
+ width: 100%;
+ bottom: 0;
+ height: 100px;
+ margin-top: 16%;
+ border: none;
+ display: flex;
+ align-items: center;
+}
+.phoneicon{
+ margin-right: 60px;
+ font-size: 20px;
+ font-weight: lighter;
+}
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..7a112f8
--- /dev/null
+++ b/index.html
@@ -0,0 +1,74 @@
+
+
+
+
+ Responsive web design
+
+
+
+
+
+
+
+
+
+
+ Hello!
+ My name is Kuenzang Rabten.
+ Currently pursuing Bachelors
of Engineering in
Software Engineering.
+
+
+
+
+
+