diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..8040b1d
Binary files /dev/null and b/.DS_Store differ
diff --git a/assets/.DS_Store b/assets/.DS_Store
new file mode 100644
index 0000000..87e7286
Binary files /dev/null and b/assets/.DS_Store differ
diff --git a/assets/img/.DS_Store b/assets/img/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/assets/img/.DS_Store differ
diff --git a/assets/img/likelion-header.jpg b/assets/img/likelion-header.jpg
deleted file mode 100644
index 063ee37..0000000
Binary files a/assets/img/likelion-header.jpg and /dev/null differ
diff --git a/assets/img/likelion-header.png b/assets/img/likelion-header.png
new file mode 100644
index 0000000..4454689
Binary files /dev/null and b/assets/img/likelion-header.png differ
diff --git a/assets/img/mob_nav_about.png b/assets/img/mob_nav_about.png
new file mode 100644
index 0000000..59d4236
Binary files /dev/null and b/assets/img/mob_nav_about.png differ
diff --git a/assets/img/mob_nav_bot.png b/assets/img/mob_nav_bot.png
new file mode 100644
index 0000000..9e69b4a
Binary files /dev/null and b/assets/img/mob_nav_bot.png differ
diff --git a/assets/img/mob_nav_top.png b/assets/img/mob_nav_top.png
new file mode 100644
index 0000000..d6edbcf
Binary files /dev/null and b/assets/img/mob_nav_top.png differ
diff --git a/index.html b/index.html
index 0c8a0f4..c825885 100644
--- a/index.html
+++ b/index.html
@@ -10,16 +10,26 @@
+
+
+
diff --git a/styles/index.css b/styles/index.css
index 0d7f2ca..023f265 100644
--- a/styles/index.css
+++ b/styles/index.css
@@ -3,21 +3,103 @@ body {
height: 100vh;
}
+.memory--heart {
+ color:#F9C756;
+ display: inline-block;
+ width: 25px;
+ height: 20px;
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath fill='F5F5F5' d='M12 20h-2v-1H9v-1H8v-1H7v-1H6v-1H5v-1H4v-1H3v-1H2v-2H1V5h1V4h1V3h1V2h5v1h1v1h2V3h1V2h5v1h1v1h1v1h1v5h-1v2h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1zm-7-9v1h1v1h1v1h1v1h1v1h1v1h2v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1V9h1V6h-1V5h-1V4h-3v1h-1v1h-1v1h-2V6H9V5H8V4H5v1H4v1H3v3h1v2z'/%3E%3C/svg%3E");
+}
+
#likelion-header {
/*
'>' : 직접적인 자식 요소일 때만 스타일을 적용하고 싶을 때 사용
만약 모든 하위 요소 중에서 #header_logo를 선택하고 싶다면 >를 생략
*/
display: flex;
- flex-direction: column;
- border: 1px solid black;
- padding: 50px;
+ flex-direction: row;
+
+ font-family: "Jersey 10";
+ font-weight: 400;
+ font-style: bold;
+ color: #F9C756;
- > #header_logo {
+ width: 100%;
+ height: auto;
+ flex-shrink: 0;
+
+ background: #0D1C3C;
+ box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+
+ position: sticky;
+ top: 1px;
+
+ > #header-padding {
+ padding: 30px;
+ }
+
+ #header_logo {
+ font-size: 50px;
img {
- width: 100px;
+ width: 80px;
+ display: inline-block;
+ padding-right: 10px;
}
}
+
+ #header_text {
+ display: inline-block;
+ }
+}
+
+#navigation {
+ display: inline-block;
+ position: absolute;
+ right: 50px;
+ top: 35px;
+}
+
+@media screen and (max-width: 750px){
+ #navigation {
+ display: none;
+ }
+ .mobile-nav {
+ display: none;
+ }
+}
+
+.mobile-nav {
+ position: fixed;
+ right: 2%;
+ bottom: 0;
+ display: block;
+
+ img{
+ width:50px;
+ }
+}
+
+@media screen and (min-width: 750px){
+ .mobile-nav {
+ display: none;
+ }
+}
+
+#header-home, #header-about, #header-contact {
+ padding-left: 30px;
+ font-size: 40px;
+}
+
+#likelion-header a {
+ color: #F9C756;
+}
+
+#likelion-header a:link {
+ color: #F9C756;
+ background-color: transparent;
+ text-decoration: none;
}
#likelion-banner {
@@ -48,6 +130,7 @@ body {
#footer {
border: 1px solid slategrey;
width: 100%;
- padding: 50px;
+ /* padding: 50px; */
height: 50px;
}
+
- I FRONTEND
-
+
+
+ 
