This commit is contained in:
Roman Pyrih
2026-03-11 10:45:20 +01:00
parent 947931f2b6
commit bcfc7c55ae
8 changed files with 622 additions and 16 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -3246,3 +3246,288 @@ footer#footer {
}
}
}
//* Page "Struktury" (new)
body.cms-id-15 {
._box-1 {
margin-bottom: 80px;
._row {
display: flex;
flex-direction: row;
column-gap: 90px;
@media (max-width: 1200px) {
column-gap: 50px;
}
@media (max-width: 991px) {
flex-direction: column;
}
._col-1 {
.box-title {
h2 {
color: $cDark;
font-family: $fInter;
font-weight: 500 !important;
font-size: 37px !important;
line-height: 1 !important;
margin: 0 0 59px 0 !important;
strong {
display: block;
padding-top: 20px;
padding-left: 55px;
color: $cGold;
font-family: $fNotoSerifDisplay;
font-weight: 400;
font-size: 37px;
line-height: inherit;
@media (max-width: 1200px) {
padding-left: 0;
padding-top: 0;
}
}
}
}
.box-text {
width: 100%;
@media (min-width: 992px) {
max-width: 406px;
}
p {
color: $cDark;
font-family: $fInter;
font-weight: 400 !important;
font-size: 14px !important;
line-height: 1.78 !important;
text-align: left;
&:last-child {
margin-bottom: 0;
}
}
}
}
._col-2 {
.box-structure-slider {
position: relative;
padding: 0 52px;
width: fit-content;
@media (max-width: 991px) {
margin: 0 auto;
}
.structure-slider {
width: 100%;
max-width: 473px;
@media (max-width: 1200px) {
max-width: 370px;
}
}
.swiper-button-next,
.swiper-button-prev {
color: #8c8c8c;
width: 14px;
}
.swiper-button-next {
right: 15px;
}
.swiper-button-prev {
left: 15px;
}
}
}
}
}
._box-2 {
._row {
.box-title {
h2 {
color: $cDark;
font-family: $fInter;
font-weight: 500 !important;
font-size: 37px !important;
line-height: 1 !important;
margin: 0 0 90px 0 !important;
@media (max-width: 1200px) {
margin: 0 0 60px 0 !important;
}
}
}
._tiles {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
column-gap: 50px;
row-gap: 28px;
._tile {
width: 340px;
cursor: pointer;
@media (max-width: 1200px) {
width: 270px;
}
@media (max-width: 991px) {
width: 295px;
}
@media (max-width: 767px) {
width: 350px;
}
&:hover {
._tile-content {
._tile-images {
.img-1 {
opacity: 0;
visibility: hidden;
}
.img-2 {
opacity: 1;
visibility: visible;
}
}
}
}
&.active {
._tile-content {
._tile-images {
opacity: 0;
visibility: hidden;
}
._tile-text {
opacity: 1;
visibility: visible;
}
}
}
._tile-content {
position: relative;
margin-bottom: 10px;
width: 340px;
height: 340px;
display: flex;
align-items: center;
justify-content: center;
@media (max-width: 1200px) {
width: 270px;
height: 270px;
}
@media (max-width: 991px) {
width: 295px;
height: 295px;
}
@media (max-width: 767px) {
width: 350px;
height: 350px;
}
._tile-images {
position: absolute;
inset: 0;
transition: all 300ms ease-in-out;
img {
width: 340px !important;
min-width: 340px !important;
height: 340px !important;
border-radius: 100%;
object-fit: cover;
@media (max-width: 1200px) {
width: 270px !important;
min-width: 270px !important;
height: 270px !important;
}
@media (max-width: 991px) {
width: 295px !important;
min-width: 295px !important;
height: 295px !important;
}
@media (max-width: 767px) {
width: 350px !important;
min-width: 350px !important;
height: 350px !important;
}
}
.img-1 {
position: absolute;
inset: 0;
z-index: 1;
opacity: 1;
visibility: visible;
transition: all 300ms ease-in-out;
}
.img-2 {
position: absolute;
inset: 0;
opacity: 0;
visibility: hidden;
transition: all 300ms ease-in-out;
}
}
._tile-text {
text-align: left !important;
padding: 25px;
opacity: 0;
visibility: hidden;
transition: all 300ms ease-in-out;
position: relative;
z-index: 2;
h5 {
color: $cDark;
font-family: $fInter;
font-weight: 400;
font-size: 14px !important;
line-height: 1.2;
margin: 0 0 10px 0 !important;
}
p {
color: $cDark;
font-family: $fInter;
font-weight: 700;
font-size: 10px;
line-height: 1.5;
margin: 0 0 10px 0 !important;
}
ul {
margin: 0 !important;
list-style: disc !important;
li {
color: $cDark;
font-family: $fInter;
font-weight: 400;
font-size: 10px;
line-height: 1.4;
padding: 0 !important;
}
}
}
}
h3 {
color: $cDark;
font-family: $fInter;
font-weight: 700;
font-size: 20px;
line-height: 1;
text-align: center !important;
margin: 0 !important;
}
}
}
}
}
}