Commit e0ee5abe authored by guido's avatar guido

responsive adjustments

parent 175d0dd3
......@@ -20,24 +20,93 @@ p { margin: 40px 0; }
li { list-style: hiragana; margin-bottom: 20px;}
a { color: #574843; text-decoration: none; }
@media (max-width: 999px) {
header {
position: relative;
height: 250px;
padding: 0;
width: 100%;
background-size: contain;
}
header h1 {
padding-top: 40px;
padding-left: 200px;
font-size: 3em;
}
header nav {
padding-left: 200px;
}
.container {
padding: 40px;
margin: 0;
width: 100%;
}
}
@media (min-width: 1000px) and (max-width: 1239px) {
header {
position: fixed;
top: 40px;
left: 640px;
height: 500px;
padding: 0;
width: 340px;
background-position: left bottom;
background-size: 260px 333px;
}
header h1 {
padding-left: 120px;
font-size: 2em;
}
header nav {
padding-left: 120px;
}
.container {
padding: 40px;
margin: 0 40px;
width: 600px;
}
}
@media (min-width: 1240px) {
header {
position: fixed;
bottom: 40px;
left: 640px;
height: 400px;
padding: 90px 0 0 270px;
width: 610px;
background-size: contain;
}
header h1 {
font-size: 3em;
}
.container {
padding: 40px;
margin: 0 40px;
width: 600px;
}
}
header {
text-align: center;
color: #574843;
position: fixed;
bottom: 40px; left: 640px;
height: 400px;
background-image: url('../images/bird.svg');
background-repeat: no-repeat;
background-size: contain;
width: 610px;
z-index: 9999;
padding: 90px 0 0 270px;
box-sizing: border-box;
}
header h1 {
margin: 0;
font-size: 3em;
}
......@@ -64,9 +133,6 @@ nav li {
font-size: 12px;
line-height: 18px;
background: #fff;
padding: 40px;
margin: 0 40px;
width: 600px;
position: relative;
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment