diff --git a/new/css/assets.css b/new/css/assets.css new file mode 100644 index 0000000..e3d945f --- /dev/null +++ b/new/css/assets.css @@ -0,0 +1,34 @@ +.arrow { + border: solid black; + border-width: 0 4px 4px 0; + display: inline-block; + padding: 3px; + float: right; + } + + .right { + transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); + } + + .left { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); + } + + .up { + transform: rotate(-135deg); + -webkit-transform: rotate(-135deg); + } + + .down { + transform: rotate(45deg); + -webkit-transform: rotate(45deg); + } + + + + .vl { + border-left: 6px solid grey; + height: 375px; + } \ No newline at end of file diff --git a/new/css/dark-mode.css b/new/css/dark-mode.css new file mode 100644 index 0000000..1544aa7 --- /dev/null +++ b/new/css/dark-mode.css @@ -0,0 +1,3 @@ +.dark-mode { + background-color: darkgray; +} \ No newline at end of file diff --git a/new/css/footer.css b/new/css/footer.css new file mode 100644 index 0000000..6043cfd --- /dev/null +++ b/new/css/footer.css @@ -0,0 +1,57 @@ + footer { + bottom: 0; + width: 100%; + background-image: url("../src/misc/footerBg.png"); + background-size: cover; + z-index: -10; + padding-top: 100px; + } + footer a { + margin: 5px; + background-color: #10335C; + } + + + .contactIconDiv { + background-color: gray; + width: 31px; + border-radius: 5px; + padding: 3px; + padding-bottom: 0px; + } + + + #innerFooterBox { + margin: 20%; + margin-top: 600px; + margin-bottom: 15px; + display: flex; + } + #innerFooterBox div { + margin: 10px; + } + + + #toplinks { + flex: content; + flex-direction: column; + } + #topLinks a, h1 { + background-color: transparent; + color: white; + text-decoration: none; + font-size: 30px; + } + #topLinks div a { + text-align: right; + } + + .footer-bar { + background-color: black; + padding: 0px; + color: white; + text-align: center; + } + .footer-bar a { + background-color: black; + } \ No newline at end of file diff --git a/new/css/header.css b/new/css/header.css new file mode 100644 index 0000000..c3036c9 --- /dev/null +++ b/new/css/header.css @@ -0,0 +1,30 @@ + #header { + position: absolute; + top: 60; + width: 100%; + height: 500px; + background-image: url("../src/misc/headerBg.png"); + background-position: bottom; + background-size: cover; + z-index: -1; + } + #header h1 { + font-size: 200px; + padding-left: 70px; + } + + + .header a { + font-size: 50px; + } + + #error-msg { + color: #bababa; + margin-left: 200px; + margin-top: 300px; + margin-right: 100px; + border: 3px #bababa solid; + border-radius: 3px; + padding-left: 20px; + display: flex; + } \ No newline at end of file diff --git a/new/css/main.css b/new/css/main.css new file mode 100644 index 0000000..d41c988 --- /dev/null +++ b/new/css/main.css @@ -0,0 +1,9 @@ + html { + font-family: 'Courier New', monospace; + background-color: #bababa; + } + + + .body { + margin-top: 500px; + } \ No newline at end of file diff --git a/new/topnav.css b/new/css/topnav.css similarity index 68% rename from new/topnav.css rename to new/css/topnav.css index cd286c6..a97d601 100644 --- a/new/topnav.css +++ b/new/css/topnav.css @@ -2,17 +2,19 @@ box-sizing: border-box; } + body { margin: 0; } + .navbar { overflow: hidden; background-color: #333; font-family: Arial, Helvetica, sans-serif; + z-index: 9999999; } - - .navbar a { + .navbar a, button { float: left; font-size: 16px; color: white; @@ -20,6 +22,10 @@ padding: 14px 16px; text-decoration: none; } + + .navbar button { + background-color: none; + } .dropmenu { float: left; @@ -29,23 +35,45 @@ .navbar a:hover, .dropmenu:hover .dropmenubtn { - background-color: red; + background-color: #0D6769; } .dropmenu-content { display: none; position: absolute; - background-color: #f9f9f9; width: 100%; left: 0; - box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; + margin-top: 50px; + } + + .dropmenu-content-content { + box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); + padding-bottom: 2px; + margin: 5px; + margin-top: 10px; + background-color: #ccc; + border-radius: 10px; } - .dropmenu-content .header { - background: red; + .dropmenu-content .header-mega { + background: #0D6769; padding: 16px; color: white; + border-radius: 9px 9px 0px 0px; + } + + #header-mega-all { + background-color: #0E5773; + margin: 5px; + border-radius: 10px; + } + #header-mega-all a { + height: 100%; + width: 100%; + margin-left: 0px; + font-size: 15px; + border-radius: 8px; } .dropmenu:hover .dropmenu-content { @@ -101,16 +129,29 @@ .navbar a:hover, .dropdown:hover .dropbtn { - background-color: red; + background-color: #0D6769; } .dropdown-content { display: none; position: absolute; - background-color: #f9f9f9; min-width: 160px; - box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; + margin-top: 49px; + border-radius: 10px; + } + + .dropdown-content-content { + box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); + background-color: #0D6769; + margin-top: 10px; + padding: 3px; + border-radius: 10px; + } + + .dropdown-content-content a:hover { + color: #0D6769; + border-radius: 8px; } .dropdown-content a { @@ -134,11 +175,20 @@ .navbarbtn, .navbar a{ font-size: 16px; border: none; - border-radius: 3px; + border-radius: 4px; outline: none; color: white; padding: 14px 16px; background-color: inherit; font: inherit; margin: 3px; + } + + + .column a { + color: #0D6769; + } + + .column a:hover { + color: white; } \ No newline at end of file diff --git a/new/footer.css b/new/footer.css deleted file mode 100644 index 9552c53..0000000 --- a/new/footer.css +++ /dev/null @@ -1,17 +0,0 @@ - footer { - position: fixed; - bottom: 0; - width: 0; - } - - .contactIconDiv { - background-color: #195294; - width: 31px; - border-radius: 5px; - padding: 3px; - padding-bottom: 0px; - } - footer a { - margin: 5px; - background-color: #10335C; - } \ No newline at end of file diff --git a/new/index.html b/new/index.html index b17c3ea..f231f71 100644 --- a/new/index.html +++ b/new/index.html @@ -1,94 +1,136 @@ - +