(Created page with "main { justify-content: center; } .mainBlock { width: 80vw; } .mainBlock h3, .mainBlock h2 { text-transform: uppercase; text-align: center; } .mainBlock a { text-de...") |
|||
Line 1: | Line 1: | ||
main { | main { | ||
justify-content: center; | justify-content: center; | ||
+ | } | ||
+ | main #index{ | ||
+ | display: none | ||
} | } | ||
Revision as of 23:20, 3 December 2020
main {
justify-content: center;
} main #index{ display: none }
.mainBlock {
width: 80vw;
} .mainBlock h3, .mainBlock h2 {
text-transform: uppercase; text-align: center;
} .mainBlock a {
text-decoration: none; color: #121212; display: flex; flex-direction: column; align-items: center;
} .mainBlock .item {
display: flex; flex-direction: column; align-items: center;
} .mainBlock .item.grandPrize {
flex-flow: column-reverse; width: 70vw; margin: 0 auto;
} .mainBlock .item.grandPrize img {
width: 40vw; max-width: 300px;
} .mainBlock .main-prizes {
display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr 1fr;
} .mainBlock .main-prizes h3 {
font-size: 2vw;
} @media screen and (min-width: 1024px) {
.mainBlock .main-prizes h3 { font-size: 1.5em; }
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes h3 { font-size: 4vw; }
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes > .grandPrize { display: none; }
} .mainBlock .main-prizes .otherItems {
display: grid; grid-template-columns: 1fr 1fr 1fr; grid-auto-rows: minmax(min-content, max-content); gap: 10px 10px; width: 70vw; margin: 0 auto;
} .mainBlock .main-prizes .otherItems .item {
align-self: center;
} .mainBlock .main-prizes .otherItems .item img {
width: 15vw; height: 15vw; max-width: 160px; max-height: 160px;
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes .otherItems .item img { width: 35vw; height: 35vw; max-width: 160px; max-height: 160px; }
} .mainBlock .main-prizes .otherItems .grandPrize {
display: none;
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes .otherItems .grandPrize { display: flex; flex-flow: column; width: initial; margin: 0; }
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes .otherItems { grid-template-columns: 1fr 1fr; width: 80vw; margin: 30px 0; }
} @media screen and (max-width: 767px) {
.mainBlock .main-prizes { display: block; }
} .mainBlock .title {
padding-top: 50px; font-family: "montserrat-bold";
} .mainBlock .nominations {
width: 60vw; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; margin: 0 auto; align-items: baseline; justify-items: center; padding: 50px 0;
} .mainBlock .nominations h3 {
font-size: 1.5vw;
} @media screen and (min-width: 1024px) {
.mainBlock .nominations h3 { font-size: 1.2em; }
} @media screen and (max-width: 767px) {
.mainBlock .nominations h3 { font-size: 3.5vw; }
} .mainBlock .nominations img {
width: 10vw; height: 10vw; max-width: 130px; max-height: 130px; min-width: 80px; min-height: 80px;
} .mainBlock .nominations .item {
width: 15vw;
} @media screen and (max-width: 767px) {
.mainBlock .nominations { grid-template-columns: 1fr 1fr; width: 80vw; }
}