File: //proc/self/root/proc/self/cwd/wp-content/themes/consultio/assets/scss/elementor/news.scss
.ct-recent-news1 {
font-family: 'Barlow', sans-serif;
.item--image {
min-width: 136px;
width: 136px;
margin-right: 30px;
a {
position: relative;
overflow: hidden;
@include border-radius(10px);
display: block;
}
img {
@include transition(all .25s cubic-bezier(.645,.045,.355,1));
}
@media #{$max-sm} {
width: 90px;
min-width: 90px;
margin-right: 20px;
}
}
.item--date {
font-size: 15px;
color: #666666;
font-weight: 500;
margin-top: -2px;
@media #{$max-sm} {
margin-top: -7px;
}
}
.item--title {
font-size: 18px;
line-height: 1.5;
color: #000000;
font-family: inherit;
margin-bottom: 4px;
a {
color: inherit;
&:hover {
color: inherit;
text-decoration: underline;
}
}
}
.ct-recent-new-item {
display: flex;
flex-wrap: nowrap;
+ .ct-recent-new-item {
margin-top: 34px;
}
&:hover .item--image img {
@include transform(scale(1.12));
}
}
.ct-recent-news-button {
margin-top: 35px;
a {
font-size: 15px;
font-weight: 700;
color: #000000;
i {
font-weight: 400;
margin-left: 8px;
@include transition(all .25s cubic-bezier(.645,.045,.355,1));
}
&:hover {
color: $primary_color;
i {
margin-left: 12px;
}
}
}
}
}
.ct-blog-carousel-layout9, .ct-blog-grid-layout4 {
.item--title {
margin-bottom: 12px;
font-size: 22px;
line-height: 1.3636363;
a {
color: inherit;
&:hover {
color: inherit;
}
}
}
.item--body {
padding: 26px 16px 15px;
@media #{$max-lg} {
padding-left: 0;
padding-right: 0;
}
}
.item--meta {
list-style: none;
display: inline-flex;
align-items: center;
font-size: 15px;
color: #7a7a7a;
margin-bottom: 10px;
li {
display: flex;
flex-wrap: nowrap;
align-items: center;
}
a {
color: inherit;
&:hover {
color: inherit;
}
}
i {
margin-right: 10px;
color: $primary_color;
}
li + li {
margin-left: 22px;
}
}
.item--content {
font-size: 18px;
line-height: 1.4444;
margin-bottom: 17px;
@media #{$max-lg} {
font-size: 16px;
}
}
.grid-item-inner {
padding: 16px;
background-color: #fff;
box-shadow: 0 0 40px rgba(#363535, 0.08);
margin: 40px 0;
}
.slick-dots {
margin-top: 25px;
margin-bottom: 20px;
}
}
.ct-blog-grid-layout4 {
.grid-item-inner {
margin-top: 0;
}
}
.ct-blog-grid-layout5 {
.item--featured {
width: 47%;
position: relative;
overflow: hidden;
@media #{$max-md} {
width: 100%;
min-height: 280px;
}
a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
@include transition(all 500ms ease-out 0s);
}
}
.item--title {
margin-bottom: 12px;
font-size: 20px;
line-height: 1.45;
color: #000000;
@media #{$max-lg} {
font-size: 18px;
}
a {
color: inherit;
&:hover {
color: #444;
}
}
}
.item--category {
font-size: 12px;
text-transform: uppercase;
color: #010101;
font-weight: 500;
font-family: "Rubik";
line-height: 25px;
padding: 0 12px;
display: inline-block;
margin-bottom: 14px;
background-color: #edf1f5;
border-radius: 25px;
a {
color: inherit;
&:hover {
color: inherit;
}
}
}
.item--content {
font-size: 15px;
line-height: 26px;
color: #5c5c5e;
margin-bottom: 23px;
}
.item--readmore a {
box-shadow: none;
font-size: 14px;
font-weight: 600;
color: #000;
line-height: 48px;
padding: 0 20px;
border-radius: 48px;
background: #d3dde7;
z-index: 1;
&:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 48px;
@include background-horizontal(#ff5400, #ffd200);
@include transition(all 300ms linear 0ms);
z-index: -1;
opacity: 0;
}
&:after {
display: none;
}
&:hover {
color: #fff;
&:before {
opacity: 1;
}
}
}
.item--date {
position: absolute;
z-index: 1;
height: 62px;
width: 62px;
background-color: #262626;
border-radius: 62px;
top: 16px;
left: 16px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
text-align: center;
span {
display: block;
line-height: 1;
font-size: 16px;
font-weight: 700;
color: #fff;
}
}
.item--body {
width: 53%;
padding: 30px;
@media #{$max-lg} {
padding-left: 22px;
padding-right: 22px;
}
@media #{$max-md} {
width: 100%;
}
}
.grid-item-inner {
display: flex;
flex-wrap: wrap;
background-color: #fff;
@include box-shadow(0 2px 30px rgba(#041445, 0.1));
margin-bottom: 40px;
border-radius: 5px;
overflow: hidden;
&:hover {
.item--featured a {
@include transform(scale3d(1.1, 1.1, 1.1));
}
}
}
}