diff --git a/public/index.html b/public/index.html index abbdf60..4ed83ee 100644 --- a/public/index.html +++ b/public/index.html @@ -21,9 +21,98 @@ top: 0; left: 0; } + .nav { + height: 70px; + width: 100%; + background-color: #f1fdfd; + position: fixed; + } + + .nav > .nav-header { + display: inline; + } + + .nav > .nav-header > .nav-title { + display: inline-block; + font-size: 22px; + color: #f00; + /*padding: 10px 10px 10px 10px;*/ + } + + .nav > .nav-btn { + display: none; + } + + .nav > .nav-links { + display: inline; + float: right; + font-family: Roboto, helvetica, arial, sans-serif; + font-size: 24px; + } + + .nav > .nav-links > a { + display: inline-block; + padding: 23px 20px 13px 10px; + text-decoration: none; + color: #000000; + } + +.nav > .nav-links > a:hover { + background-color: rgba(0, 0, 0, 0.3); +} + +.nav > #nav-check { + display: none; +} + +@media (max-width:600px) { + .nav > .nav-btn { + display: inline-block; + position: absolute; + right: 0px; + top: 0px; + } + .nav > .nav-btn > label { + display: inline-block; + width: 50px; + height: 50px; + padding: 13px; + } + .nav > .nav-btn > label:hover { + background-color: rgba(0, 0, 0, 0.3); + } + .nav > .nav-btn > label > span { + display: block; + width: 25px; + height: 10px; + border-top: 2px solid #eee; + } + .nav > .nav-links { + position: absolute; + display: block; + width: 100%; + background-color: #333; + height: 0px; + transition: all 0.3s ease-in; + overflow-y: hidden; + top: 50px; + left: 0px; + } + .nav > .nav-links > a { + display: block; + width: 100%; + } + .nav > #nav-check:not(:checked) + .nav-links { + height: 0px; + } + .nav > #nav-check:checked + .nav-links { + height: calc(100vh - 50px); + overflow-y: auto; + } +} #headline { - margin-top: 70px; + margin-top: 0px; padding: 0.8em; color: white; font-family: Roboto, helvetica, arial, sans-serif; @@ -302,13 +391,37 @@ + +
+
+
+ +
+
+
+ +
+ +
+ Team + Technology + Contact +
+
+
+

ShanMukha Innovations

Developing a swiss army knife of clinical diagnostics to serve the needs of 4 Billion people.