Patriksletmo (Talk | contribs) |
Patriksletmo (Talk | contribs) |
||
(18 intermediate revisions by the same user not shown) | |||
Line 110: | Line 110: | ||
text-align: center; | text-align: center; | ||
− | width: 19%; | + | width: 19.5%; |
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
Line 128: | Line 128: | ||
border: 1px solid #888; | border: 1px solid #888; | ||
border-top: none; | border-top: none; | ||
+ | z-index: 999; | ||
} | } | ||
Line 180: | Line 181: | ||
} | } | ||
− | #HQ_page .content h1, .content h2, .content h3, .content h4, .content h5 { | + | #HQ_page .content h1, #HQ_page .content h2, #HQ_page .content h3, #HQ_page .content h4, #HQ_page .content h5 { |
font-family: 'Playfair Display', serif; | font-family: 'Playfair Display', serif; | ||
− | |||
margin-top: 10px; | margin-top: 10px; | ||
font-weight: 700; | font-weight: 700; | ||
+ | } | ||
+ | |||
+ | .content h1 span, .content h2 span, .content h3 span, .content h4 span { | ||
+ | font-size: 130%; | ||
+ | } | ||
+ | |||
+ | .mw-headline { | ||
+ | display: inline-block; | ||
+ | width: 100%; | ||
+ | padding-top: 40px; | ||
+ | margin-top: -30px; | ||
} | } | ||
Line 191: | Line 202: | ||
} | } | ||
− | #HQ_page .content p { | + | #HQ_page .content p, #HQ_page .content li { |
font-family: 'Raleway', sans-serif; | font-family: 'Raleway', sans-serif; | ||
font-size: 110%; | font-size: 110%; | ||
Line 259: | Line 270: | ||
.team-container img { | .team-container img { | ||
+ | max-width: initial !important; | ||
height: 600px; | height: 600px; | ||
margin: auto; | margin: auto; | ||
position: relative; | position: relative; | ||
left: 50%; | left: 50%; | ||
− | transform: | + | transform: translate3d(-50%,0,0); |
+ | -webkit-transform: translate3d(-50%,0,0); | ||
display: block; /* optional */ | display: block; /* optional */ | ||
Line 271: | Line 284: | ||
filter: grayscale(100%); | filter: grayscale(100%); | ||
filter: gray; | filter: gray; | ||
− | |||
− | -webkit-transition: -webkit-filter | + | -webkit-transition: -webkit-filter 0.4s; |
− | -moz-transition: filter | + | -moz-transition: filter 0.4s; |
− | -ms-transition: filter | + | -ms-transition: filter 0.4s; |
− | -o-transition: filter | + | -o-transition: filter 0.4s; |
− | transition: filter | + | transition: filter 0.4s; |
− | transition: -webkit-filter | + | transition: -webkit-filter 0.4s; |
} | } | ||
Line 352: | Line 364: | ||
display: none; | display: none; | ||
} | } | ||
+ | |||
+ | #sponsors { | ||
+ | font-size: 0; | ||
+ | margin: 10px; | ||
+ | } | ||
+ | |||
+ | #sponsors p { | ||
+ | margin-left: 20px; | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | |||
+ | #sponsors a { | ||
+ | display: inline-block; | ||
+ | width: 20%; | ||
+ | box-sizing: border-box; | ||
+ | padding: 0 20px; | ||
+ | } | ||
+ | |||
+ | #sponsors img { | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .content { | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | #toc { | ||
+ | position: absolute; | ||
+ | display: inline-block; | ||
+ | border: none; | ||
+ | border-right: 1px solid #888; | ||
+ | background: none; | ||
+ | margin-right: 10px; | ||
+ | margin-top: -20px; | ||
+ | padding-right: 10px; | ||
+ | width: 200px; | ||
+ | height: 100%; | ||
+ | left: 30px; | ||
+ | } | ||
+ | |||
+ | #toc #toctitle { | ||
+ | text-align: left; | ||
+ | font-size: 18px; | ||
+ | padding-top: 12px; | ||
+ | } | ||
+ | |||
+ | #toc > ul { | ||
+ | padding-top: 12px; | ||
+ | font-family: 'Raleway', sans-serif; | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | |||
+ | #HQ_page .content #toc > ul li { | ||
+ | font-size: 14px; | ||
+ | } | ||
+ | |||
+ | #toc a { | ||
+ | color: #333; | ||
+ | } | ||
+ | |||
+ | #toc a { | ||
+ | display: inline-block; | ||
+ | border-left: 3px solid transparent; | ||
+ | padding-left: 5px; | ||
+ | } | ||
+ | |||
+ | #toc ul { | ||
+ | margin-left: 10px !important; | ||
+ | } | ||
+ | |||
+ | #toc > ul { | ||
+ | margin: 0 !important; | ||
+ | width: 200px; | ||
+ | } | ||
+ | |||
+ | #toc > ul > li > a span { | ||
+ | font-style: italic; | ||
+ | } | ||
+ | |||
+ | #toc .tocnumber { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .toc-fixed #toctitle { | ||
+ | position: fixed; | ||
+ | top: 40px; | ||
+ | } | ||
+ | |||
+ | .toc-fixed > ul { | ||
+ | position: fixed; | ||
+ | top: 71px; | ||
+ | } | ||
+ | |||
+ | .toc-fixed.toc-restricted #toctitle { | ||
+ | position: absolute; | ||
+ | top: inherit; | ||
+ | } | ||
+ | |||
+ | .toc-fixed.toc-restricted > ul { | ||
+ | position: absolute; | ||
+ | top: inherit; | ||
+ | bottom: 0; | ||
+ | } | ||
+ | |||
+ | #toc a.toc-selected { | ||
+ | border-left: 3px solid #019966; | ||
+ | } | ||
+ | |||
+ | .content.toc-exist { | ||
+ | padding-left: 260px; | ||
+ | } | ||
+ | |||
+ | img { | ||
+ | max-width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .menu .head { | ||
+ | height: 192px; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | #header-video { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | opacity: 0; | ||
+ | max-width: 100%; | ||
+ | } | ||
+ | |||
+ | #header-content { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | height: 192px; | ||
+ | |||
+ | padding-top: 10px; | ||
+ | padding-right: 13px; | ||
+ | } | ||
+ | |||
+ | #header-video.playing { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | #header-content.playing { | ||
+ | background: rgba(255, 255, 255, 0.8); | ||
+ | } | ||
+ | |||
+ | /** Notebook **/ | ||
+ | |||
+ | #notebook-content { | ||
+ | padding-top: 60px; | ||
+ | } | ||
+ | |||
+ | #notebook-categories { | ||
+ | position: absolute; | ||
+ | background: #FFFFFF; | ||
+ | width: 1040px; | ||
+ | box-sizing: border-box; | ||
+ | white-space: nowrap; | ||
+ | font-size: 0; | ||
+ | z-index: 100; | ||
+ | border: 2px solid #000; | ||
+ | } | ||
+ | |||
+ | #notebook-categories.notebook-fixed { | ||
+ | position: fixed; | ||
+ | top: 16px; | ||
+ | } | ||
+ | |||
+ | #notebook-categories span{ | ||
+ | display: inline-block; | ||
+ | width: 23%; | ||
+ | text-align: center; | ||
+ | line-height: 48px; | ||
+ | font-size: 13px; | ||
+ | } | ||
+ | |||
+ | #notebook-categories div { | ||
+ | display: inline-block; | ||
+ | width: 8%; | ||
+ | } | ||
+ | |||
+ | #notebook-content { | ||
+ | font-size: 0; | ||
+ | } | ||
+ | |||
+ | .nb-row { | ||
+ | height: 48px; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .nb-row-small { | ||
+ | height: 14px; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .nb-month { | ||
+ | line-height: 34px; | ||
+ | width: 100%; | ||
+ | font-size: 14px; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .nb-empty { | ||
+ | display: inline-block; | ||
+ | width: 23%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | .nb-mid-l { | ||
+ | display: inline-block; | ||
+ | width: 4%; | ||
+ | height: 100%; | ||
+ | border-right: 1px solid #000; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .nb-mid-r { | ||
+ | display: inline-block; | ||
+ | width: 4%; | ||
+ | height: 100%; | ||
+ | border-left: 1px solid #000; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .nb-mid-line-l { | ||
+ | display: inline-block; | ||
+ | width: 4%; | ||
+ | height: 100%; | ||
+ | border-right: 1px solid #000; | ||
+ | border-bottom: 2px solid #000; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .nb-mid-line-r { | ||
+ | display: inline-block; | ||
+ | width: 4%; | ||
+ | height: 100%; | ||
+ | border-left: 1px solid #000; | ||
+ | border-bottom: 2px solid #000; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .nb-line, .nb-line-l, .nb-line-r { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | width: 23%; | ||
+ | height: 100%; | ||
+ | border-bottom: 2px solid #000; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | |||
+ | .nb-line-l > span { | ||
+ | position: absolute; | ||
+ | text-align: left; | ||
+ | font-size: 12px; | ||
+ | bottom: -10px; | ||
+ | background: #FFF; | ||
+ | padding-right: 10px; | ||
+ | padding-left: 20px; | ||
+ | } | ||
+ | |||
+ | .nb-line-r > span { | ||
+ | position: absolute; | ||
+ | text-align: right; | ||
+ | font-size: 12px; | ||
+ | right: 0; | ||
+ | bottom: -10px; | ||
+ | background: #FFF; | ||
+ | padding-left: 10px; | ||
+ | padding-right: 20px; | ||
+ | } | ||
+ | |||
+ | .nb-line-l > span span, .nb-line-r > span span { | ||
+ | display: inline-block; | ||
+ | background: #000; | ||
+ | color: #FFF; | ||
+ | line-height: 18px; | ||
+ | width: 18px; | ||
+ | text-align: center; | ||
+ | border-radius: 9px; | ||
+ | } | ||
+ | |||
+ | span.with-content { | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | span.with-content:hover { | ||
+ | color: #019966; | ||
+ | } | ||
+ | |||
+ | span.with-content:hover span { | ||
+ | background-color: #019966; | ||
+ | } | ||
+ | |||
+ | .nb-details { | ||
+ | margin-top: -2px; | ||
+ | border-top: 2px solid #000; | ||
+ | border-bottom: 2px solid #000; | ||
+ | font-size: 12px; | ||
+ | padding: 20px; | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .nb-details img { | ||
+ | float: left; | ||
+ | max-width: 300px; | ||
+ | margin-right: 20px; | ||
+ | } | ||
+ | |||
+ | .nb-details > br { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | |||
/** Small screen **/ | /** Small screen **/ | ||
Line 371: | Line 700: | ||
.content-container { | .content-container { | ||
width: 100%; | width: 100%; | ||
+ | } | ||
+ | |||
+ | #toc { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .content.toc-exist { | ||
+ | padding-left: 30px; | ||
+ | } | ||
+ | |||
+ | #header-video { | ||
+ | display: none; | ||
} | } | ||
} | } | ||
Line 513: | Line 854: | ||
} | } | ||
− | + | #sponsors a { | |
− | + | display: block; | |
− | + | width: 100%; | |
+ | padding: 20px; | ||
+ | } | ||
} | } | ||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 18:40, 19 October 2016