| Server IP : 65.108.144.40 / Your IP : 216.73.217.165 Web Server : Apache/2.4.52 (Ubuntu) System : Linux ubuntu-8gb-hel1-1 5.15.0-173-generic #183-Ubuntu SMP Fri Mar 6 13:29:34 UTC 2026 x86_64 User : dev ( 1000) PHP Version : 8.2.30 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /var/www/html/successkpi/wp-content/themes/successkpi/blocks/left-right-media-cards/ |
Upload File : |
.sk-related-resource-row {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.sk-related-resource-section .sk-related-resource-heading h2 {
text-align: center;
margin-bottom: 30px;
}
.sk-related-resource-video button.sk-play-video {
background: #f4f4ff;
color: #032169;
}
.sk-related-resource-row a.sk-related-resource-banner {
text-decoration: none;
}
.sk-related-resource-banner {
background: #F5F7FF;
border-radius: 20px;
width: 100%;
padding: 25px;
margin-bottom: 16px;
box-shadow: 0px 4px 3px rgba(0, 0, 0, 0.04);
transition: 0.4s ease-in-out;
}
.sk-related-resource-banner:hover {
box-shadow: 0 0px 20px 0 rgb(133 169 255);
}
.sk-related-resource-banner .sk-related-resource-text h2 {
color: #000;
font-weight: 600;
}
.sk-related-resource-banner .sk-related-resource-text h2 span {
color: #234CC6;
font-size: 26px;
line-height: 34px;
}
.sk-related-resource-wrapper {
display: flex;
width: 100%;
justify-content: space-between;
flex-wrap: wrap;
row-gap: 16px;
}
.sk-related-resource-wrapper .sk-related-resource-card {
width: 100%;
text-decoration: none;
display: block;
}
.sk-related-resource-wrapper .card .card-image img {
border-radius: 10px;
height: 100%;
width: 100%;
object-fit: cover;
}
.sk-related-resource-text {
padding-bottom: 24px;
}
.sk-related-resource-text span {
font-size: 16px;
color: #0d4ccd;
font-weight: 500;
}
.sk-related-resource-row a.sk-related-resource-banner p {
color: #000;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child {
width: 100%;
}
.sk-related-resource-wrapper .sk-related-resource-card .card {
padding: 22px;
border-radius: 20px;
background: linear-gradient(180deg, #F5F7FF 0%, #DCE3FF 100%);
box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.04);
border: 0 none;
transition: 0.4s ease-in-out;
}
.sk-related-resource-wrapper .sk-related-resource-card .card:hover {
box-shadow: 0 0px 20px 0 rgb(133 169 255);
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card {
display: flex;
align-items: center;
flex-direction: column;
padding: 15px 15px 15px 20px;
gap: 0;
background: linear-gradient(0deg, #f5f7ff 0, #dce3ff 100%);
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card picture {
border-radius: 10px;
width: 100%;
height: 200px;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .sk-card-content {
width: 100%;
}
.sk-related-resource-image img, .sk-related-resource-video img {
width: 100%;
border-radius: 10px;
}
.sk-related-resource-wrapper .sk-related-resource-card .sk-card-content-title {
color: #000;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 27px;
margin: 18px 0 12px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .sk-card-content-title {
font-size: 20px;
line-height: 30px;
}
.sk-related-resource-wrapper .sk-related-resource-card span {
color: #0d4ccd;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
transition: 0.3s ease-in-out;
}
.sk-related-resource-wrapper .sk-related-resource-card span:hover {
color: #428bca;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card {
width: 100%;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 25px;
padding: 15px 15px 15px 20px;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card picture {
border-radius: 10px;
width: 100%;
height: 300px;
flex-shrink: 0;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card picture > img.img-fluid {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .sk-card-content-title {
margin: 0 0 12px;
}
.sk-banner-health-wrapper .sk-banner-health-video {
position: relative;
padding-top: 27px;
overflow: hidden;
border-radius: 10px;
}
.sk-related-resource-video {
position: relative;
padding-top: 0;
overflow: hidden;
border-radius: 10px;
}
.sk-related-resource-video::after {
content: '''';
background: linear-gradient(180deg, rgba(35, 76, 198, 0) 0%, #0D4CD0 100%);
position: absolute;
bottom: -20px;
width: 100%;
height: 50px;
left: 0;
}
.sk-related-resource-video .video-thumbnail {
width: 100%;
display: block;
border-radius: 10px;
transition: 0.3s ease;
position: relative;
z-index: 2;
}
.sk-related-resource-video .resource-video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
z-index: 1;
}
.sk-related-resource-video.playing .video-thumbnail {
opacity: 0;
visibility: hidden;
}
.sk-related-resource-video.playing .resource-video {
z-index: 3;
}
.sk-related-resource-video .sk-play-video {
z-index: 4;
}
.sk-video-modal .modal-content {
position: relative;
display: flex;
flex-direction: column;
width: 100%;
pointer-events: auto;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, .2);
border-radius: .3rem;
outline: 0
}
.sk-video-modal .modal-content video {
width: 100%;
height: 100%;
object-fit: cover;
padding: 0;
}
.sk-play-video {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
right: 0;
width: 60px;
height: 60px;
margin: auto;
background: #a2abb8;
display: flex;
align-items: center;
border-radius: 50%;
justify-content: center;
font-size: 20px;
color: #fff;
border: 0 none;
}
.sk-video-modal .modal-dialog {
width: 80%;
max-width: 60%;
}
.sk-video-modal .btn-close {
color: #aaaaaa;
font-size: 20px;
font-weight: bold;
width: 30px;
height: 30px;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
position: absolute;
z-index: 9;
right: -10px;
top: -10px;
opacity: 1;
box-shadow: 0 0 11px #4a4545a8;
padding: 0;
}
.sk-related-resource-card .card-image {
width: 100%;
height: 200px;
}
.sk-related-resource-banner .sk-related-resource-image {
width: 100%;
height: 200px;
}
.sk-related-resource-banner .sk-related-resource-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.sk-related-resource-section.colored-bg .sk-related-resource-banner {
background: linear-gradient(180deg, #F4F6FF 0%, #83A8FF 100%);
}
.sk-related-resource-section.colored-bg .sk-related-resource-wrapper .sk-related-resource-card:first-child .card{
background: linear-gradient(98deg, #63B7A6 -7.18%, #FFF 106.25%);
}
.sk-related-resource-text h2 {
font-size: 26px;
line-height: 34px;
}
@media screen and (min-width:576px) {
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card {
flex-direction: row;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card {
align-items: center;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card .card picture {
width: 50%;
height: 200px;
}
.sk-video-modal .btn-close {
width: 40px;
height: 40px;
right: -20px;
top: -20px;
}
.sk-video-modal .modal-content video {
height: 460px;
padding: 10px;
}
}
@media screen and (min-width:767px) {
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card picture,
.sk-related-resource-card .card-image,
.sk-related-resource-banner .sk-related-resource-image {
height: 300px;
}
.sk-related-resource-video::after {
height: 122px;
}
}
@media screen and (min-width:992px) {
.sk-related-resource-wrapper {
width: 49%;
}
.sk-related-resource-wrapper .sk-related-resource-card {
display: flex;
}
.sk-related-resource-banner {
width: 49%;
margin-bottom: 0;
padding: 28px 41px;
}
.sk-related-resource-wrapper .sk-related-resource-card {
width: 48%;
}
.sk-related-resource-wrapper .sk-related-resource-card:not(:first-child) .sk-card-content-title {
margin-top: 18px;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card {
flex-direction: row;
gap: 25px;
width: 100%;
}
.sk-related-resource-wrapper .sk-related-resource-card .sk-card-content-title {
margin: 0 0 12px;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) {
width: 49%;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card {
width: 100%;
}
.sk-related-resource-section .sk-related-resource-heading h2 {
margin-bottom: 48px;
}
.sk-related-resource-card .card-image {
height: 130px
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card picture {
width: 50%;
height: 130px;
}
}
@media screen and (min-width:1200px) {
.sk-related-resource-wrapper .sk-related-resource-card:first-child .sk-card-content {
width: 48%;
}
.sk-related-resource-wrapper .sk-related-resource-card {
width: 48%;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card {
width: 100%;
}
.sk-related-resource-banner .sk-related-resource-text h2 span {
color: #234CC6;
}
}
@media screen and (min-width:1400px) {
.sk-related-resource-wrapper, .sk-related-resource-banner {
width: 632px;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card picture {
border-radius: 10px;
width: 50%;
height: 160px;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .sk-card-content {
width: 48%;
}
.sk-related-resource-wrapper .sk-related-resource-card:first-child .card picture > img.img-fluid {
height: 100%;
}
.sk-related-resource-wrapper .sk-related-resource-card {
width: 300px;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) {
width: 632px;
}
.sk-related-resource-wrapper:has(.sk-related-resource-card:nth-child(2)):not(:has(.sk-related-resource-card:nth-child(3))) .sk-related-resource-card {
width: 100%;
}
.sk-related-resource-banner .sk-related-resource-image {
width: 100%;
height: 350px;
}
}