.artikkeli-content {
display: flex;
flex-wrap: wrap;
gap: 35px;
}
.grid-post { }
.artikkeli-wrapper {
display: flex;
flex-direction: row;
gap:20px;
position: relative;
border-radius: 20px; }
.artikkeli-image-link {
position: relative;
width:40%;
height: 500px;
top:0;
transition: ease all .3s;
}
.artikkeli-wrapper:hover .artikkeli-image-link {
top:-20px;
filter: drop-shadow(0px 15px 5px rgba(0, 0, 0, .2));
transform: rotate(-0.5deg) scale(1.01);
}
.grid-post .artikkeli-image {
width: 350px;
height: 100%;
object-fit: cover;
background: #fff;
border-radius: 20px;
}
.grid-post .artikkeli-image.no-thumbnail {
width: 100%;
height: 300px;
object-fit: cover;
background: #000000;
border-radius: 20px;
position: relative;
}
.grid-post .artikkeli-image.no-thumbnail::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url() no-repeat 95% 100%;
background-size: 150px;
}
.fullwidth-container {
width: 60%;
border: 0px solid #e8e8e8;
border-radius: 20px;
box-shadow: 0px 0px 3px rgba(0, 0, 0, .2);
padding:50px 30px 30px 30px;
transition: ease all .4s;
}
.artikkeli-wrapper:hover .fullwidth-container { 
transform: scale(1.03);
box-shadow: 0px 0px 7px rgba(0, 0, 0, .3);
}
.grid-post a.artikkeli-card-link-btn {
font-size: 1em;
font-weight: bold;
border-radius: 0;
padding: 10px 0px;
color:#000;
display: inline-block;
transition: .2s;
}
.grid-post a.artikkeli-card-link-btn::after {
content: "\f061";
font-family: "Font Awesome 5 Free";
font-size: .8em;
font-weight: 600;
margin-left: 8px;
transition:ease all .2s;
}
.grid-post a.artikkeli-card-link-btn:hover::after {
margin-left: 15px;
}
.grid-post h3.artikkeli-title {
font-size: 1.3em;
line-height: 1.2em;
font-weight: bold;
color:#000;
margin: 0 0 20px 0;
}
.grid-post .artikkeli-meta {
}
.grid-post .artikkeli-text {
font-size: 1em;
margin: 0 0 20px 0;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 12;
-webkit-box-orient: vertical;
max-height: 14em;
}
.myPostSwiper {
padding: 30px !important;
margin: -30px !important;
overflow: hidden;
}
.swiper-slide {
height: auto;
padding-bottom: 10px;
}
.swiper-pagination {
position: relative !important;
margin: 20px 0 0 0;
}
.swiper-pagination-bullet {
width: 13px !important;
height: 13px !important;
}
.swiper-pagination-bullet-active {
background: #00325B !important;
}
@media only screen and (max-width: 969px) {
.artikkeli-wrapper {
flex-direction: column;
gap:10px;
}
.artikkeli-image-link {
width: 100%;
height: 150px;
}
.grid-post .artikkeli-image {
width: 100%;
}
.fullwidth-container {
width: 100%;
}
}