#block-42109 { height: 410px; margin-top: 130px; padding: 0 30px; position: relative; } #block-42109 .text-center.position-relative { position: static!important; } #block-42109 .block-background { height: 100%; padding: 0!important; border-radius: 10px; overflow: hidden; position: relative; } #block-42109 .block-background:before { content: ''; background: rgba(0,0,0,0.3); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } #block-42109 h2 { color: #fff; margin-bottom: 20px; position: absolute; bottom: 0; left: 20px; text-shadow: 0 0 2px rgba(0,0,0,0.7); font-size: 42px; } #block-42109 p { color: #fff; } #block-42109 a { margin: 20px 10px; } @media(max-width: 768px) { #block-42109 { height: auto; } #block-42109 .block-background { height: 230px; } #block-42109 .block-background:before { flex: 0 0 20%; max-width: 20%; } }
#block-42111 { padding: 30px; } #block-42111 .row { margin: 0 -10px; } #block-42111 .container-md { width: 100%; margin: 0!important; max-width: 100%; padding: 0; } #block-42111 .title { display: none; } #block-42111 .block-title { text-align: left; padding-top: 60px; padding-bottom: 40px; } #block-42111 .container { position: relative; } #block-42111 .block-subtitle { text-align: center; font-size: 16px; position: absolute; top: 20px; left: 50%; transform: translate(-50%, 0%); } #block-42111 .zone-item { border: none; padding: 10px; background: transparent; box-shadow: none !important; height: 300px; position: relative; } #block-42111 .zone-item i { background-color: #E84241; color: white; padding: 12px; border-radius: 50%; position: absolute; bottom: 30px; right: 30px; transition: all ease-in-out 300ms; } #block-42111 .zone-item i:before { width: 20px; height: 20px; display: flex; justify-content: center; align-items: center; } #block-42111 .zone-item:hover i { transform: scale(1.3); } #block-42111 .zone-item > a { display: block; height: 100%; overflow: hidden; position: relative; overflow: hidden; } #block-42111 .zone-item > a:before { content: ''; background: rgba(0,0,0,0.2); top: 0; left: 0; position: absolute; width: 100%; height: 100%; transition: all ease-in-out .3s; z-index: 1; } #block-42111 .zone-item > a:hover:before { background: rgba(0,0,0,0.2); } #block-42111 .zone-item img { transition: all 1s ease-in-out; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; object-position: center; } #block-42111 .zone-item a:hover img { position: absolute; transform: translate(-50%, -50%) scale(1.2); } #block-42111 .card-title { position: absolute; top: 10%; left: 0%; font-size: 22px; line-height: 1.2; font-weight: 600; background: transparent; padding: 5px 20px; text-align: center; transition: all ease-in-out .3s; z-index: 9; text-shadow: 0 0 2px rgba(0,0,0, 0.7); } #block-42111 .zone-item a:hover .card-title { transform: translate(0%, 30%); color: #fff; } #block-42111 .h5 { text-shadow: 0 0 2px rgba(0,0,0,0.9); font-weight: 600; margin: 0; top: 10%; } @media(min-width: 768px) { #block-42111 .col-md-12 { flex: 0 0 20%; max-width: 20%; } #block-42111 .col-md-12 .h5 { font-size: 20px; text-align: start; width: 100%; } }