| 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/hero-banner/ |
Upload File : |
.banner-section {
padding: 50px 0 80px;
background: linear-gradient(to bottom, #0D4DCE, #012169);
position: relative;
}
.banner-section .row {
align-items: center;
}
.banner-section.comp-sec-banner {
background-image: url(/wp-content/uploads/2026/04/compliance-and-security-banner-bg.webp);
background-repeat: no-repeat;
background-color: transparent;
background-position: center right;
padding: 80px 0 52px;
background-size: cover;
}
.info {
font-size: 18px;
line-height: 27px;
color: #fff;
margin-bottom: 7px;
display: inline-block;
text-transform: uppercase;
font-weight: 600;
}
.banner-section .banner-content h1 {
color: #fff;
font-weight: 600;
margin-bottom: 16px;
}
.banner-section.comp-sec-banner h1{
color: #000;
}
.banner-section .banner-content p {
font-size: 16px;
line-height: 24px;
color: #fff;
max-width: 430px;
}
.banner-section.comp-sec-banner p{
font-size: 16px;
line-height: 24px;
color: #3a3e50;
font-weight: 500;
}
.custom-btn {
color: #fff;
text-decoration: none;
font-size: 14px;
line-height: 21px;
padding: 14px 42px;
display: inline-block;
position: relative;
background: linear-gradient(275.13deg, #00309D -18.74%, #234CC6 57.32%, #002882 123.61%);
border-radius: 40px;
box-shadow: 0px 6px 3.9px 0px #001D7233;
}
.banner-section .banner-media {
width: 100%;
height: 100%;
position: relative;
}
.banner-section .banner-media img {
width: 100%;
height: 100%;
position: relative;
z-index: 9;
border-radius: 10px;
}
.banner-section .banner-media video {
width: 100%;
height: 100%;
}
.custom-btn:hover {
background: #012169;
}
.banner-logos:not(:has(*)){
display: none !important;
}
.banner-logos {
display: flex;
justify-content: space-around;
align-items: center;
flex-wrap: wrap;
margin-top: 50px;
gap: 20px;
}
section.banner-section .banner-content {
margin-bottom: 20px;
}
.banner-section.without-before-after .banner-media:before,
.banner-section.without-before-after .banner-media:after {
display: none;
}
.banner-section.about-banner {
padding: 60px 0 50px;
}
.banner-section.about-banner .banner-media video {
border-radius: 30px 8px;
}
.banner-section.about-banner:before {
content: '';
top: 0;
background-image: url(/wp-content/uploads/2026/04/hero-vector-about-bg_new.svg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
height: 100%;
width: 100%;
position: absolute;
display: inline-block;
right: 0;
opacity: 0.5;
}
.banner-section .banner-media .video-embed {
width: 100%;
height: 350px;
}
.banner-section .banner-media .video-embed iframe{
width: 100%;
height: 100%;
}
.banner-section.about-banner .banner-content p {
font-weight: 500;
}
.partner-banner-logo {
width: 150px;
height: 50px;
}
.partner-banner-logo img {
width: 100%;
height: 100%;
object-fit: contain;
}
.banner-meta-info span {
color: #fff;
}
.banner-meta-info .separator {
padding: 0 10px;
}
@media screen and (min-width:767px) {
.banner-section .banner-content {
margin-bottom: 0px;
}
.banner-section .banner-media img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.banner-section.about-banner:before {
background-size: contain;
}
}
@media screen and (min-width:992px) {
.banner-section .banner-media:has(img) {
width: auto;
height: 400px;
float: right;
}
.banner-section .banner-media:has(img):before {
content: '';
border-radius: 20px;
background: #0d4ccd;
box-shadow: 0 4px 3px 0 rgba(0, 0, 0, .04);
width: 160px;
height: 154px;
position: absolute;
right: -30px;
top: -30px;
}
.banner-media:has(img)::after {
content: '';
background-image: url(/wp-content/uploads/2026/05/svg-bg-banner.svg);
width: 407px;
height: 302px;
position: absolute;
bottom: -40px;
right: -30px;
z-index: 1;
}
}
@media screen and (min-width:1200px) {
.banner-section {
padding: 70px 0 110px;
}
}