Difference between revisions of "Template:Vilnius-Lithuania/CSS/Awards"
| (2 intermediate revisions by the same user not shown) | |||
| Line 32: | Line 32: | ||
width: 70vw; | width: 70vw; | ||
margin: 0 auto; | margin: 0 auto; | ||
| + | } | ||
| + | @media screen and (min-width: 768px) { | ||
| + | .mainBlock .item.grandPrize h3 { | ||
| + | font-size: 2.3em | ||
| + | } | ||
} | } | ||
.mainBlock .item.grandPrize img { | .mainBlock .item.grandPrize img { | ||
| Line 69: | Line 74: | ||
} | } | ||
.mainBlock .main-prizes .otherItems .item { | .mainBlock .main-prizes .otherItems .item { | ||
| − | + | margin: 0 10px; | |
} | } | ||
.mainBlock .main-prizes .otherItems .item img { | .mainBlock .main-prizes .otherItems .item img { | ||
| Line 111: | Line 116: | ||
padding-top: 50px; | padding-top: 50px; | ||
font-family: "montserrat-bold"; | font-family: "montserrat-bold"; | ||
| + | font-size: 2.3em | ||
} | } | ||
| + | |||
.mainBlock .nominations { | .mainBlock .nominations { | ||
width: 60vw; | width: 60vw; | ||
Latest revision as of 23:35, 3 December 2020
main {
justify-content: center;
} main #index{ display: none }
.mainBlock {
width: 80vw;
} .mainBlock h3, .mainBlock h2 {
text-transform: uppercase; text-align: center;
margin: 20px 0 20px 0 !important; font-family: 'montserrat-bold'; } .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;
} @media screen and (min-width: 768px) {
.mainBlock .item.grandPrize h3 {
font-size: 2.3em
}
} .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 {
margin: 0 10px;
} .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";
font-size: 2.3em }
.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;
}
}