summaryrefslogtreecommitdiff
path: root/site/assets/css
diff options
context:
space:
mode:
Diffstat (limited to 'site/assets/css')
-rw-r--r--site/assets/css/css.css130
-rw-r--r--site/assets/css/splash.css9
2 files changed, 99 insertions, 40 deletions
diff --git a/site/assets/css/css.css b/site/assets/css/css.css
index b8798cd9..b9ae0a4f 100644
--- a/site/assets/css/css.css
+++ b/site/assets/css/css.css
@@ -11,10 +11,11 @@ html, body {
html {
background: #181818;
}
-
+a {outline : none;}
+img {border : 0;}
.content {
opacity: 0;
- transition: opacity 0.2s cubic-bezier(0,1,1,1);
+ transition: opacity 0.1s cubic-bezier(0,1,1,1);
}
html.desktop .content,
html.mobile .content {
@@ -48,16 +49,28 @@ header .logo {
background-image: url(../img/megapixels_logo_white.svg);
background-size: contain;
background-repeat: no-repeat;
- margin-top: 7px;
- margin-right: 10px;
- width: 39px;
- height: 30px;
+ margin-top: 0px;
+ margin-right: 8px;
+ width: 20px;
+ height: 20px;
}
header .site_name {
font-family: 'Roboto', sans-serif;
- font-weight: bold;
+ font-weight: 600;
+ text-transform: uppercase;;
color: #fff;
- font-size: 14px;
+ font-size: 12px;
+ line-height: 12px;
+ letter-spacing: 4px;
+}
+header .site_name.splash{
+ font-size: 20px;
+ line-height: 20px;
+ font-weight: 400;
+}
+header .links{
+ font-size: 18px;
+ line-height: 18px;
}
header .sub {
margin-left: 4px;
@@ -82,25 +95,30 @@ header .links {
header .links span,
header .links a {
display: block;
- color: #777;
+ color: #d7ba5a;
text-decoration: none;
text-transform: uppercase;
margin-right: 32px;
- transition: color 0.1s cubic-bezier(0,0,1,1), border-color 0.1s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1), border-color 0.05s cubic-bezier(0,0,1,1);
border-bottom: 1px solid rgba(255,255,255,0);
padding: 3px;
- font-weight: 500;
+ font-weight: 400;
}
header .links a.active {
- color: #bbb;
+ color: #f3c266;
+ border-bottom: 1px solid rgba(240,200,150,255);
}
.desktop header .links a:hover {
- color: #fff;
- border-bottom: 1px solid rgba(255,255,255,255);
+ color: #e9bb5f;
+ border-bottom: 1px solid rgba(240,200,150,255);
}
.desktop header .links a.active:hover {
- color: #fff;
- border-bottom: 1px solid rgba(255,255,255,255);
+ color: #e9bb5f;
+ border-bottom: 1px solid rgba(240,200,150,255);
+}
+header .links.splash{
+ font-size:22px;
+ font-weight: 400;
}
/* footer */
@@ -129,7 +147,7 @@ footer > div:nth-child(2) {
footer a {
display: inline-block;
color: #888;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
margin-right: 5px;
}
footer a:hover {
@@ -144,7 +162,7 @@ h1 {
font-size: 28pt;
margin: 75px 0 10px;
padding: 0;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
font-family: 'Roboto';
}
h2 {
@@ -153,15 +171,15 @@ h2 {
font-size: 28pt;
margin: 20px 0 10px;
padding: 0;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
font-family: 'Roboto';
}
h3 {
margin: 0 0 20px 0;
padding: 20px 0 0 0;
- font-size: 16pt;
+ font-size: 18pt;
font-weight: 500;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
font-family: 'Roboto';
}
h4 {
@@ -169,7 +187,7 @@ h4 {
padding: 0;
font-size: 11pt;
font-weight: 500;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
font-family: 'Roboto';
}
.content h3 a {
@@ -206,7 +224,7 @@ th, .gray {
/* content */
.content {
- padding-top: 70px;
+ padding-top: 28px;
padding-bottom: 100px;
min-height: calc(100vh - 55px);
line-height: 1.5;
@@ -227,7 +245,7 @@ section {
line-height: 36px;
}
p {
- margin: 0 0 20px 0;
+ margin: 0 10px 20px 0;
line-height: 2;
font-size: 16px;
font-weight: 300;
@@ -236,7 +254,7 @@ p {
color: #fff;
text-decoration: none;
border-bottom: 1px dashed;
- transition: color 0.2s cubic-bezier(0,0,1,1);
+ transition: color 0.1s cubic-bezier(0,0,1,1);
}
.desktop .content a:hover {
color: #fff;
@@ -278,7 +296,7 @@ p {
padding-top: 10px;
padding-right: 20px;
margin-right: 20px;
- margin-bottom: 10px;
+ margin-bottom: 30px;
/*border-right: 1px solid #444;*/
font-family: 'Roboto';
font-size: 14px;
@@ -386,7 +404,7 @@ section img {
margin: 0 auto;
}
section .image {
- margin-bottom: 40px;
+ margin-bottom: 20px;
}
section.images {
display: flex;
@@ -440,12 +458,20 @@ section.fullwidth .image {
}
.caption {
text-align: left;
- font-size: 9pt;
+ font-size: 10pt;
color: #999;
max-width: 960px;
margin: 10px auto 10px auto;
font-family: 'Roboto';
}
+.caption a{
+ color:#ccc;
+ border: 0;
+}
+.caption a:hover{
+ color:#fff;
+ border: 0;
+}
.sideimage {
margin: 0px 0 40px 0;
display: flex;
@@ -595,8 +621,8 @@ section.fullwidth .image {
height: 140px;
padding: 10px;
color: white;
- font-weight: 300;
- font-family: 'Roboto Mono'
+ font-weight: 400;
+ font-family: 'Roboto'
}
.desktop .content .dataset-list a{
border:none;
@@ -632,6 +658,7 @@ section.intro_section {
justify-content: center;
align-items: center;
background-color: #111111;
+ margin-bottom: 30px;
}
.intro_section .inner {
max-width: 960px;
@@ -648,13 +675,19 @@ section.intro_section {
font-size: 17px;
line-height: 36px;
max-width: 680px;
- font-weight: 400;
+ font-weight: 300;
color: #ddd;
}
-.intro_section div > span {
- box-shadow: -10px -10px #181818, 10px -10px #181818, 10px 10px #181818, -10px 10px #181818;
+.intro_section .hero_desc .bgpad {
+ box-shadow: -7px -7px #181818, 7px -7px #181818, 7px 7px #181818, -7px 7px #181818;
background: #181818;
}
+.intro_section .hero_subdesc .bgpad {
+ box-shadow: -8px -8px #181818, 8px -8px #181818, 8px 8px #181818, -8px 8px #181818;
+ background: #181818;
+}
+
+
.firefox .intro_section div > span {
box-decoration-break: clone;
}
@@ -669,6 +702,29 @@ page-specific formatting
margin-bottom: 10px
}
+.hr-wave-holder {
+ /* Clip edges, as some of the lines don't terminate nicely. */
+ overflow: hidden;
+ position: relative;
+ width: 100%;
+ height: 50px;
+ margin-top:100px;
+}
+
+.hr-wave-line1 {
+ background: linear-gradient(45deg, transparent, transparent 49%, #fff 49%, transparent 51%);
+}
+.hr-wave-line2 {
+ background: linear-gradient(-45deg, transparent, transparent 49%, #fff 49%, transparent 51%);
+}
+.hr-wave-line {
+ background-size: 20px 20px;
+ position: absolute;
+ width: 100%;
+ height: 10px;
+}
+
+
/* map */
.map-legend-item{
@@ -692,14 +748,16 @@ page-specific formatting
}
.content-about .about-menu ul li{
display:inline-block;
- font-size: 12px;
+ font-size: 14px;
font-weight: 400;
- margin-right: 5px;
+ margin-right: 8px;
text-transform: uppercase;
- margin-right: 10px
+ margin-right: 15px;
+ font-family: 'Roboto';
}
.content-about .about-menu ul li a{
border-bottom: 0;
+ color:#aaa;
}
diff --git a/site/assets/css/splash.css b/site/assets/css/splash.css
index 9dd5afba..8b07918b 100644
--- a/site/assets/css/splash.css
+++ b/site/assets/css/splash.css
@@ -18,14 +18,15 @@ footer {
footer div {
z-index: 2;
}
-header, footer {
- text-shadow: 0 0 5px #191919, 0 0 5px #191919, 0 0 5px #191919;
+footer {
+ /*text-shadow: 0 0 5px #191919, 0 0 5px #191919, 0 0 5px #191919;*/
+ background: #111;
}
header > div a,
footer > div {
- background: rgba(25, 25, 25, 0.8);
+ /*background: rgba(25, 25, 25, 0.8);
padding: 3px;
- border-radius: 2px;
+ border-radius: 2px;*/
}
header .links a.activeLink {
color: white;
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-10 16:13:40 +0000