diff --git a/public/assets/css/mobile.css b/public/assets/css/mobile.css index a5c25c430eff492178166aa350bf889b5f0007fc..29c0f154b0ecb5c8c16631af575c81ed2eb5ff0e 100644 --- a/public/assets/css/mobile.css +++ b/public/assets/css/mobile.css @@ -1,78 +1,91 @@ -@media only screen and (max-width : 800px) { - - .content { - padding-left: 5%; - padding-right: 5%; - } - - nav { - background-color: rgba(16, 16, 16, 0.8); - height: auto; - padding: 0; - position: absolute; - right: -40%; - top: 20px; - width: 40%; - margin: 0; - z-index: 1000; - transition: right 0.4s; - } - - nav ul { - flex-direction: column; - } - - nav li { - display: block; - padding-top: 10px; - padding-bottom: 10px; - margin-top: 10px; - margin-bottom: 10px; - } - - nav a { - font-size: 0.8em; - } - - nav a:hover { - border-bottom: unset; - padding-bottom: unset; - } - - .hamburger { - display: none; - flex-direction: column; - justify-content: space-between; - width: 40px; - height: 40px; - background-color: rgba(16, 16, 16, 0.8); - margin-top: 20px; - padding: 8px; - transition: margin-right 0.4s; - } - - .line { - background-color: white; - height: 2px; - } - - .slide-nav { - right: 0; - } - - .slide-hamburger { - margin-right: 40%; - } - - .overflow-visible{ - overflow: visible; - } - - .logo{ - width: 80px; - height: 80px; - margin-left: 8vw; - } - - +@media only screen and (max-width : 800px) { + + .content { + padding-left: 5%; + padding-right: 5%; + } + + nav { + background-color: rgba(16, 16, 16, 0.8); + height: auto; + padding: 0; + position: absolute; + right: -40%; + top: 20px; + width: 40%; + margin: 0; + z-index: 1000; + transition: right 0.4s; + } + + nav ul { + flex-direction: column; + } + + nav li { + display: block; + padding-top: 10px; + padding-bottom: 10px; + margin-top: 10px; + margin-bottom: 10px; + } + + nav a { + font-size: 0.8em; + } + + nav a:hover { + border-bottom: unset; + padding-bottom: unset; + } + + .hamburger { + display: none; + flex-direction: column; + justify-content: space-between; + width: 40px; + height: 40px; + background-color: rgba(16, 16, 16, 0.8); + margin-top: 20px; + padding: 8px; + transition: margin-right 0.4s; + } + + .line { + background-color: white; + height: 2px; + } + + .slide-nav { + right: 0; + } + + .slide-hamburger { + margin-right: 40%; + } + + .overflow-visible{ + overflow: visible; + } + + .logo{ + width: 80px; + height: 80px; + margin-left: 8vw; + } + + +} + +@media only screen and (max-width : 400px) { + + #projectlogo img{ + width: 50px; + } + + #projectname { + font-size: 12px; + } + + } \ No newline at end of file