generate stripes. new layout
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
+318
-243
@@ -7,462 +7,537 @@
|
|||||||
--ifm-white: #ffffff;
|
--ifm-white: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
|
||||||
|
}
|
||||||
|
|
||||||
.h1
|
body {
|
||||||
{
|
margin: 5em;
|
||||||
font-family: Helvetica;
|
background-color: var(--ifm-black);
|
||||||
font-size: 16px;
|
|
||||||
color: var(--ifm-white);
|
color: var(--ifm-white);
|
||||||
padding-top: 5px;
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
padding-bottom: 5px;
|
}
|
||||||
margin-bottom: 15px;
|
|
||||||
margin-top: 10px;
|
.header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: var(--ifm-white);
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: min(90%, 100rem);
|
||||||
|
/* 1600px */
|
||||||
|
margin: 0 auto;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-grid {
|
||||||
|
display: grid;
|
||||||
|
width: 100%;
|
||||||
|
grid-template-columns: auto 1fr;
|
||||||
|
gap: 0;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-link {
|
||||||
|
display: block;
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand-logos {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand-logos img {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
max-width: none;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prc-stripes,
|
||||||
|
.header-title {
|
||||||
|
grid-column: 1 / span 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.prc-stripes {
|
||||||
|
width: 90%;
|
||||||
|
--square: 0.55rem;
|
||||||
|
/* 10px */
|
||||||
|
height: calc(var(--square) * 3);
|
||||||
|
background:
|
||||||
|
conic-gradient(from 90deg at 50% 50%, #000 0 25%, #fff 0 50%, #000 0 75%, #fff 0) 0 0 / calc(var(--square) * 2) calc(var(--square) * 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-title {
|
||||||
|
margin: 0.625rem 0 0.9375rem;
|
||||||
|
/* 10px 0 15px */
|
||||||
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
|
line-height: 1em;
|
||||||
|
color: inherit;
|
||||||
|
padding-left: 5rem;
|
||||||
|
padding-right: 10rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h1 {
|
||||||
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
|
font-size: clamp(1.8rem, 1rem + 2vw, 3rem);
|
||||||
|
color: var(--ifm-white);
|
||||||
|
padding-top: 0.3125rem;
|
||||||
|
/* 5px */
|
||||||
|
padding-bottom: 0.3125rem;
|
||||||
|
/* 5px */
|
||||||
|
margin-bottom: 0.9375rem;
|
||||||
|
/* 15px */
|
||||||
|
margin-top: 0.625rem;
|
||||||
|
/* 10px */
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.p
|
.p {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
font-size: 1rem;
|
||||||
font-size: 6px;
|
|
||||||
color: var(--ifm-grey);
|
color: var(--ifm-grey);
|
||||||
margin-bottom: 45px;
|
margin-bottom: 2.8125rem;
|
||||||
|
/* 45px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.href
|
.href {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixlink
|
.mixlink {
|
||||||
{
|
line-height: 1rem;
|
||||||
line-height: 16px;
|
/* 16px */
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-size: 10px;
|
font-size: 0.625rem;
|
||||||
margin-bottom: 0;
|
/* 10px */
|
||||||
margin-top: 0;
|
margin: 0;
|
||||||
font-family: Helvetica;
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.amixlink
|
.amixlink {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
|
||||||
color: var(--ifm-grey);
|
color: var(--ifm-grey);
|
||||||
line-height: 1.6em;
|
line-height: 1.6em;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
font-size: 10px;
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
background: var(--ifm-deep-black);
|
background: var(--ifm-deep-black);
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
margin-top: 2px;
|
margin: 0.125rem 0;
|
||||||
margin-bottom: 2px;
|
/* 2px 0 */
|
||||||
padding: 2px 10px;
|
padding: 0.125rem 0.625rem;
|
||||||
border-radius: 20px;
|
/* 2px 10px */
|
||||||
|
border-radius: 1.25rem;
|
||||||
|
/* 20px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.amixlink:hover
|
.amixlink:hover {
|
||||||
{
|
|
||||||
color: #000;
|
color: #000;
|
||||||
background: var(--ifm-red);
|
background: var(--ifm-red);
|
||||||
}
|
}
|
||||||
|
|
||||||
.body
|
.body {
|
||||||
{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: var(--ifm-black);
|
background-color: var(--ifm-black);
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixsections
|
.mixsections {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
font-size: 12px;
|
|
||||||
color: var(--ifm-grey);
|
color: var(--ifm-grey);
|
||||||
padding: 5px;
|
padding: 0.3125rem;
|
||||||
|
/* 5px */
|
||||||
margin-top: 2%;
|
margin-top: 2%;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 0.3125rem;
|
||||||
margin-right: 15px;
|
/* 5px */
|
||||||
border: solid 3px var(--ifm-grey);
|
margin-right: 0.9375rem;
|
||||||
|
/* 15px */
|
||||||
|
border: solid 0.1875rem var(--ifm-grey);
|
||||||
|
/* 3px */
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.prclogo
|
.prclogo {
|
||||||
{
|
height: 7.5rem;
|
||||||
height: 120px;
|
/* 120px */
|
||||||
padding-bottom: 10px;
|
padding: 0.625rem 0 0.625rem 0.625rem;
|
||||||
padding-left: 10px;
|
/* 10px 0 10px 10px */
|
||||||
padding-top: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.divider
|
.divider {
|
||||||
{
|
height: 1.4375rem;
|
||||||
height: 23px;
|
/* 23px */
|
||||||
padding-bottom: 10px;
|
padding: 0.625rem 0 0.625rem 0.625rem;
|
||||||
padding-left: 10px;
|
/* 10px 0 10px 10px */
|
||||||
padding-top: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.h2
|
.footer {
|
||||||
{
|
|
||||||
font-family: Helvetica;
|
|
||||||
font-size: 24px;
|
|
||||||
color: var(--ifm-grey);
|
|
||||||
font-weight: 200;
|
|
||||||
border-bottom: 2px solid var(--ifm-grey);
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header
|
|
||||||
{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-height: 120px;
|
height: 15.625rem;
|
||||||
}
|
/* 250px */
|
||||||
|
border-top: 0.125rem solid var(--ifm-red);
|
||||||
.footer
|
/* 2px */
|
||||||
{
|
|
||||||
width: 100%;
|
|
||||||
height: 250px;
|
|
||||||
border-top: 2px solid var(--ifm-red);
|
|
||||||
float: left;
|
float: left;
|
||||||
clear: both;
|
clear: both;
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsectionmenu
|
.djsectionmenu {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
font-size: 1.125rem;
|
||||||
font-size: 18px;
|
/* 18px */
|
||||||
color: var(--ifm-red);
|
color: var(--ifm-red);
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
display: block;
|
display: block;
|
||||||
width: 10%;
|
width: 10%;
|
||||||
height: 130px;
|
height: 8.125rem;
|
||||||
|
/* 130px */
|
||||||
float: left;
|
float: left;
|
||||||
margin-top: 5px;
|
margin-top: 0.3125rem;
|
||||||
margin-bottom: 5px;
|
/* 5px */
|
||||||
min-width: 130px;
|
margin-bottom: 0.3125rem;
|
||||||
|
/* 5px */
|
||||||
|
min-width: 8.125rem;
|
||||||
|
/* 130px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsectionmenu:hover
|
.djsectionmenu:hover {
|
||||||
{
|
|
||||||
background-color: #e3301a;
|
background-color: #e3301a;
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsection
|
.djsection {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
|
||||||
font-size: 18px;
|
|
||||||
text-decoration: inherit;
|
text-decoration: inherit;
|
||||||
color: var(--ifm-red);
|
color: var(--ifm-red);
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsection:hover
|
.djsection:hover {
|
||||||
{
|
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h2
|
.h2 {
|
||||||
{
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
font-family: Helvetica;
|
|
||||||
color: var(--ifm-red);
|
color: var(--ifm-red);
|
||||||
font-size: 16px;
|
padding-top: 0.3125rem;
|
||||||
padding-top: 5px;
|
/* 5px */
|
||||||
border-bottom: 2px solid var(--ifm-red);
|
border-bottom: 0.125rem solid var(--ifm-red);
|
||||||
|
/* 2px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.homeheader
|
.homeheader {
|
||||||
{
|
|
||||||
background-image: url('/img/header.png');
|
background-image: url('/img/header.png');
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
padding-bottom: 20px;
|
padding-bottom: 1.25rem;
|
||||||
|
/* 20px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.bottomimg
|
.bottomimg {}
|
||||||
{
|
|
||||||
|
.imglink {
|
||||||
|
width: 12.5rem;
|
||||||
|
/* 200px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.imglink
|
.footerlegal {
|
||||||
{
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footerlegal
|
|
||||||
{
|
|
||||||
right: 0;
|
right: 0;
|
||||||
float: right;
|
float: right;
|
||||||
margin-top: 80px;
|
margin-top: 5rem;
|
||||||
|
/* 80px */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Three image containers (use 25% for four, and 50% for two, etc) */
|
.column {
|
||||||
|
|
||||||
.column
|
|
||||||
{
|
|
||||||
float: left;
|
float: left;
|
||||||
margin-left: 0px;
|
margin-left: 0;
|
||||||
padding-left: 2.5%;
|
padding-left: 2.5%;
|
||||||
padding-right: 2.5%;
|
padding-right: 2.5%;
|
||||||
width: 15%;
|
width: 15%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Clear floats after image containers */
|
.row::after {
|
||||||
|
|
||||||
.row::after
|
|
||||||
{
|
|
||||||
content: "";
|
content: "";
|
||||||
clear: both;
|
clear: both;
|
||||||
display: table;
|
display: table;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 768px)
|
@media screen and (max-width: 48rem) {
|
||||||
{
|
|
||||||
.column
|
/* 768px */
|
||||||
{
|
.column {
|
||||||
padding-left: 5%;
|
padding-left: 5%;
|
||||||
padding-right: 5%;
|
padding-right: 5%;
|
||||||
width: 40%;
|
width: 40%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer
|
.footer {
|
||||||
{
|
|
||||||
margin-top: 15%;
|
margin-top: 15%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.brand-logos img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 500px)
|
@media screen and (max-width: 31.25rem) {
|
||||||
{
|
|
||||||
.column
|
/* 500px */
|
||||||
{
|
.column {
|
||||||
padding-left: 0%;
|
padding-left: 0;
|
||||||
padding-right: 5%;
|
padding-right: 5%;
|
||||||
width: 45%;
|
width: 45%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.brand-logos img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.profileimg
|
.profileimg {
|
||||||
{
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
height: auto;
|
height: auto;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.profilesection
|
.profilesection {
|
||||||
{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-bottom: 2.5%;
|
margin-bottom: 2.5%;
|
||||||
background-color: var(--ifm-red);
|
background-color: var(--ifm-red);
|
||||||
}
|
}
|
||||||
|
|
||||||
.image_collage
|
.image_collage {
|
||||||
{
|
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
-webkit-column-count: 5;
|
-webkit-column-count: 5;
|
||||||
-webkit-column-gap: 0px;
|
-webkit-column-gap: 0;
|
||||||
-moz-column-count: 5;
|
-moz-column-count: 5;
|
||||||
-moz-column-gap: 0px;
|
-moz-column-gap: 0;
|
||||||
column-count: 5;
|
column-count: 5;
|
||||||
column-gap: 0px;
|
column-gap: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.image_collage img
|
.image_collage img {
|
||||||
{
|
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
height: auto !important;
|
height: auto !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1200px)
|
@media (max-width: 75rem) {
|
||||||
{
|
|
||||||
.image_collage
|
/* 1200px */
|
||||||
{
|
.image_collage {
|
||||||
-moz-column-count: 4;
|
-moz-column-count: 4;
|
||||||
-webkit-column-count: 4;
|
-webkit-column-count: 4;
|
||||||
column-count: 4;
|
column-count: 4;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1000px)
|
@media (max-width: 62.5rem) {
|
||||||
{
|
|
||||||
.image_collage
|
/* 1000px */
|
||||||
{
|
.image_collage {
|
||||||
-moz-column-count: 3;
|
-moz-column-count: 3;
|
||||||
-webkit-column-count: 3;
|
-webkit-column-count: 3;
|
||||||
column-count: 3;
|
column-count: 3;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 800px)
|
@media (max-width: 50rem) {
|
||||||
{
|
|
||||||
.image_collage
|
/* 800px */
|
||||||
{
|
.image_collage {
|
||||||
-moz-column-count: 2;
|
-moz-column-count: 2;
|
||||||
-webkit-column-count: 2;
|
-webkit-column-count: 2;
|
||||||
column-count: 2;
|
column-count: 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 400px)
|
@media (max-width: 25rem) {
|
||||||
{
|
|
||||||
.image_collage
|
/* 400px */
|
||||||
{
|
.image_collage {
|
||||||
-moz-column-count: 1;
|
-moz-column-count: 1;
|
||||||
-webkit-column-count: 1;
|
-webkit-column-count: 1;
|
||||||
column-count: 1;
|
column-count: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.content
|
.content {
|
||||||
{
|
padding-top: 3em;
|
||||||
width: 80%;
|
width: min(90%, 100rem);
|
||||||
padding-left: 10%;
|
/* 1600px */
|
||||||
padding-right: 10%;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.latest
|
.latest {
|
||||||
{
|
|
||||||
position: relative;
|
position: relative;
|
||||||
clear: both;
|
clear: both;
|
||||||
}
|
}
|
||||||
|
|
||||||
.latestdiv
|
.latestdiv {
|
||||||
{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
clear: both;
|
clear: both;
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sponsors
|
.sponsors {
|
||||||
{
|
margin-top: 1.25rem;
|
||||||
margin-top: 20px;
|
/* 20px */
|
||||||
clear: both;
|
clear: both;
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.linkimg:hover
|
.linkimg:hover {
|
||||||
{
|
|
||||||
filter: invert(70%);
|
filter: invert(70%);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width:499px)
|
@media (max-width: 31.1875rem) {
|
||||||
{
|
|
||||||
.djsectionmenu500
|
/* 499px */
|
||||||
{
|
.djsectionmenu500 {
|
||||||
height: 70px;
|
height: 4.375rem;
|
||||||
|
/* 70px */
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
min-width: 60px;
|
min-width: 3.75rem;
|
||||||
|
/* 60px */
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 600px) {
|
@media screen and (min-width: 37.5rem) {
|
||||||
|
|
||||||
.h1{
|
/* 600px */
|
||||||
font-size: 18px;
|
.h1 {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
/* 18px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.p
|
.p {
|
||||||
{
|
font-size: 0.5rem;
|
||||||
font-size: 8px;
|
/* 8px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixlink
|
.mixlink {
|
||||||
{
|
font-size: 0.75rem;
|
||||||
font-size: 12px;
|
/* 12px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.amixlink
|
.amixlink {
|
||||||
{
|
font-size: 0.75rem;
|
||||||
font-size: 12px;
|
/* 12px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixsections
|
.mixsections {
|
||||||
{
|
font-size: 0.875rem;
|
||||||
font-size: 14px;
|
/* 14px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.h2
|
.h2 {
|
||||||
{
|
font-size: 1.125rem;
|
||||||
font-size: 18px;
|
/* 18px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.header
|
.header {
|
||||||
{
|
max-height: 11.25rem;
|
||||||
max-height: 180px;
|
/* 180px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.prclogo
|
.prclogo {
|
||||||
{
|
height: 11.25rem;
|
||||||
height: 180px;
|
/* 180px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.divider
|
.divider {
|
||||||
{
|
height: 2.1875rem;
|
||||||
height: 35px;
|
/* 35px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsectionmenu
|
.djsectionmenu {
|
||||||
{
|
font-size: 1.5625rem;
|
||||||
font-size: 25px;
|
/* 25px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsection
|
.djsection {
|
||||||
{
|
font-size: 1.75rem;
|
||||||
font-size: 28px;
|
/* 28px */
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-title {
|
||||||
|
font-size: 1.125rem;
|
||||||
|
/* 18px */
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 768px) {
|
@media screen and (min-width: 48rem) {
|
||||||
.h1{
|
|
||||||
font-size: 26px;
|
/* 768px */
|
||||||
|
.h1 {
|
||||||
|
font-size: 1.625rem;
|
||||||
|
/* 26px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.p
|
.p {
|
||||||
{
|
font-size: 0.625rem;
|
||||||
font-size: 10px;
|
/* 10px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixlink
|
.mixlink {
|
||||||
{
|
font-size: 0.875rem;
|
||||||
font-size: 14px;
|
/* 14px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.amixlink
|
.amixlink {
|
||||||
{
|
font-size: 0.875rem;
|
||||||
font-size: 14px;
|
/* 14px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.mixsections
|
.mixsections {
|
||||||
{
|
font-size: 1rem;
|
||||||
font-size: 16px;
|
/* 16px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.h2
|
.h2 {
|
||||||
{
|
font-size: 1.5rem;
|
||||||
font-size: 24px;
|
/* 24px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.header
|
.header {
|
||||||
{
|
max-height: 13.75rem;
|
||||||
max-height: 220px;
|
/* 220px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.prclogo
|
.prclogo {
|
||||||
{
|
height: 13.75rem;
|
||||||
height: 220px;
|
/* 220px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.divider
|
.divider {
|
||||||
{
|
height: 2.6875rem;
|
||||||
height: 43px;
|
/* 43px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsectionmenu
|
.djsectionmenu {
|
||||||
{
|
font-size: 2.0625rem;
|
||||||
font-size: 33px;
|
/* 33px */
|
||||||
}
|
}
|
||||||
|
|
||||||
.djsection
|
.djsection {
|
||||||
{
|
font-size: 2.0625rem;
|
||||||
font-size: 33px;
|
/* 33px */
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-title {
|
||||||
|
font-size: 1.625rem;
|
||||||
|
/* 26px */
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,20 +12,33 @@
|
|||||||
<link rel="stylesheet" href="/static/<%= titles.css %>">
|
<link rel="stylesheet" href="/static/<%= titles.css %>">
|
||||||
</head>
|
</head>
|
||||||
<body class="body">
|
<body class="body">
|
||||||
|
<div class="container">
|
||||||
<header class="header">
|
<header class="header">
|
||||||
<a href="/"><img src="/static/<%= titles['header'] %>" alt="prc logo" class="prclogo"/></a>
|
<div class="header-grid">
|
||||||
</header>
|
<a href="/" class="header-link">
|
||||||
<div class="content">
|
<div class="brand-logos">
|
||||||
<h1 class="h1">Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
|
<img src="/static/PRC-Car.png" alt="Panama Racing Club car">
|
||||||
|
<img src="/static/PRC-Text.png" alt="Panama Racing Club">
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<div class="prc-stripes" aria-hidden="true"></div>
|
||||||
|
|
||||||
|
<h1 class="header-title">
|
||||||
|
Tons Of Mix - Downloads & Streams (right click + Save link as... for downloads)<br>
|
||||||
<%= titles.name %><br>
|
<%= titles.name %><br>
|
||||||
Sharing <%= total[0] %> files
|
Sharing <%= total[0] %> files
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
<div class="prc-stripes" aria-hidden="true"></div>
|
||||||
</div>
|
</div>
|
||||||
<img class="divider" src="/static/panamaracing.club_divider.png">
|
</header>
|
||||||
|
|
||||||
|
<br>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<% content_for("inner") %>
|
<% content_for("inner") %>
|
||||||
</div>
|
</div>
|
||||||
<img class="divider" src="/static/panamaracing.club_divider.png">
|
<div class="prc-stripes" aria-hidden="true"></div>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<section class="latest">
|
<section class="latest">
|
||||||
<div class="latest_files">
|
<div class="latest_files">
|
||||||
@@ -39,6 +52,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
<img class="divider" src="/static/panamaracing.club_divider.png">
|
<br>
|
||||||
|
<div class="prc-stripes" aria-hidden="true"></div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user