*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Montserrat', sans-serif;
margin: 0;
}
a {
text-decoration: none;
color: inherit;
}
ul {
list-style: none;
}
button {
border: none;
background: none;
cursor: pointer;
font-family: inherit;
}
p {
font-size: 16px;
line-height: 150%;
margin-top: 0;
margin-bottom: 1.2rem;
}
h1{
font-family: 'museo700', Georgia, 'Times New Roman', serif;
}
h2,h3,h4,h5,h6{
font-family: 'museo300', Georgia, 'Times New Roman', serif;
}
h3{
margin-bottom: 10px;
}
h1.blog-title {
font-size: 42px;
margin-bottom: 26px;
}
.listing-page .blog-detail h1 {
color: #ffff;
font-size: 35px;
margin-bottom: 18px;
}
.heading2 h2 {
margin-bottom: 26px;
font-size: 36px;
}
.heading2 p {
margin-top: 0;
max-width: 1035px;
display: inline-block;
}
.heading2 {
width: 100%;
}
img{
width:100%;
height:100%;
}
/* Header logo — match the main site sizing (style.css isn't loaded here) */
.logo {
max-width: 260px;
}
.blog header.sticky-nav {
position: sticky;
background-color: #5c0375;
}
.archive header.sticky-nav {
position: sticky;
background: #5c0375;
}
/* Blog single — header stays sticky, but without the on-scroll animation
(no fixed-switch / slide-down). Native position:sticky pins it smoothly. */
.single-post header.sticky-nav,
.single-post header.sticky-nav.nav-scrolled {
position: sticky;
top: 0;
background: #5c0375;
box-shadow: none;
animation: none;
}
.archive .main-content {
background: #fff;
}
.blog-detail .post-content {
margin-top: 15px;
font-size: 14px;
}
.blog-detail h2 {
margin-bottom: 25px;
font-size: 30px;
font-weight: 400;
}
/* ==========================================================================
Blog single — content vertical rhythm (headings, text, media, tables)
========================================================================== */
.blog-detail .post-content h1,
.blog-detail .post-content h2,
.blog-detail .post-content h3,
.blog-detail .post-content h4,
.blog-detail .post-content h5,
.blog-detail .post-content h6 {
margin: 35px 0 15px;
line-height: 1.3;
}
/* No stray gap above the first block of the article */
.blog-detail .post-content > *:first-child {
margin-top: 0;
}
.blog-detail .post-content p,
.blog-detail .post-content li {
font-size: 14px;
}
.blog-detail .post-content p {
margin: 0 0 20px;
}
/* Links — theme colour, underlined, underline removed on hover.
Scoped to plain in-content links only (no class). This deliberately
leaves every classed anchor untouched — buttons/CTAs/share buttons
(.btn, .main-btn, .Ctabtn, .ai-share-button, etc.) keep their own styling. */
.blog-detail .post-content a:not([class]) {
color: #5c0375;
text-decoration: underline;
}
.blog-detail .post-content a:not([class]):hover,
.blog-detail .post-content a:not([class]):focus {
color: #5c0375;
text-decoration: none;
}
/* Content images keep their aspect ratio (overrides global img{width/height:100%}) */
.blog-detail .post-content img {
display: block;
width: auto;
height: auto;
max-width: 100%;
margin: 20px 0 25px;
border-radius: 8px;
}
.blog-detail .post-content figure {
margin: 25px 0;
}
.blog-detail .post-content figure img {
margin: 0;
}
.blog-detail .post-content figure figcaption {
margin-top: 8px;
font-size: 14px;
color: #6b6b6b;
text-align: center;
}
/* Lists — keep the existing custom bullet styling, just add outer spacing */
.blog-detail .post-content ul,
.blog-detail .post-content ol {
margin: 0 0 20px;
}
.blog-detail .post-content blockquote {
margin: 25px 0;
padding: 15px 25px;
border-left: 4px solid #C2C904;
background: #f7f7ef;
}
.blog-detail .post-content table {
width: 100%;
margin: 0 0 25px;
border-collapse: collapse;
}
.blog-detail .post-content th,
.blog-detail .post-content td {
padding: 10px 12px;
border: 1px solid #ddd;
text-align: left;
vertical-align: top;
}
.blog-detail .post-content th {
background: #f5f5f5;
font-weight: 600;
}
.related-posts .blog-list.category-list {
border: 0;
background: transparent;
}
.blog-list.category-list .image {
width: 100%;
height: 189px;
}
.related-posts .col-md-4 {
padding: 0 1.2rem;
}
.blog-list.category-list .image img {
position: unset;
transform: unset;
width: 100%;
height: 100%;
}
.single-post .entry-content .post-content ul li {
padding: 0px 0px 5px 18px;
margin-bottom: 5px;
line-height: 1.8;
list-style: none;
padding-left: 40px;
position: relative;
}
.single-post .entry-content .post-content ul li:before{
content:"";
background: url('data:image/svg+xml,') left no-repeat;
position: absolute;
position: absolute;
top: 3px;
left: 0;
width: 22px;
height: 22px;
background-size: 100%;
}
.blog-list.category-list .content {
background: #f5f5f5;
padding: 20px;
width: 100%;
height: calc(100% - 190px);
min-height: auto;
}
div#case-studies-container {
display: flex;
flex-wrap: wrap;
}
.filter-item {
padding: 0 1.5rem;
}
.container {
max-width: 1512px;
margin: 0 auto;
padding: 40px 110px 40px 117px;
}
.single-post .post-thumb .detail_image {
position: relative;
min-height: 300px;
background: #eee;
}
.single-post .post-thumb .detail_image .caption {
width: 100%;
position: absolute;
bottom: 0;
padding: 30PX;
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.26) 26%, rgba(0,0,0,0.92) 92%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.26) 26%, rgba(0, 0, 0, 0.92) 92%, rgba(0, 0, 0, 1) 100%);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.26) 26%, rgba(0, 0, 0, 0.92) 92%, rgba(0, 0, 0, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
}
.author_info {
display: none;
}
.listing-page .blog-listing {
padding-right: 3%;
}
.mar-b-30 {
margin-bottom: 30px !important;
}
.blog-list {
display: flex;
flex-wrap: wrap;
background: #f5f5f5;
margin-bottom: 3.6%;
border: 1px solid #f5f5f5;
}
.blog-list .image {
width: 50%;
position: relative;
overflow: hidden;
}
.blog-list .content {
width: 50%;
padding: 3%;
min-height: 300px;
}
section.listing-page.row {
display: flex;
}
.blog-list .content h3 {
margin-bottom: 5px;
font-size: 1.3rem;
font-weight: normal;
}
.blog-list .content h3 a {
color: #000;
}
.blog-list .content p.small {
font-size: 0.9rem;
margin-bottom: 15px;
margin-top: 0px;
border: 0px none;
}
.btn-know-more {
display: inline-flex;
align-items: center;
justify-content: center;
width: fit-content;
padding: 10px 24px;
font-size: 18px;
font-weight: 600;
color: #2b2b2b;
background: transparent;
border: 2px solid #c2c904;
border-radius: 3px;
transition: background-color 0.2s ease, color 0.2s ease;
}
.btn-know-more:hover {
background-color: #c2c904;
color: #ffffff;
}
.sidebar_main h2 {
margin-bottom: 15px;
text-align: left;
font-size: 1.3rem;
font-weight: 600;
position:relative;
}
.content .entry-content p{
margin-bottom:20px;
}
.wp-block-group__inner-container.is-layout-flow.wp-block-group-is-layout-flow {
margin-bottom: 20px;
}
.sidebar_main h2:after {
content: "";
width: 24px;
height: 24px;
position: absolute;
margin: 0px;
bottom: 1px;
transform: scale(0.6);
line-height: 1;
background: url('data:image/svg+xml,');
background-position: left top;
background-repeat:no-repeat;
}
.main-content {
clear: both;
display: block;
}
.casestudy-list-inner .wp-project {
width: 100%;
position: relative;
overflow: hidden;
}
.casestudy-list-inner .wp-project .wp-pro-img {
float: left;
width: 100%;
position: relative;
overflow: hidden;
background: rgb(239, 239, 239);
}
.casestudy-list-inner .wp-project .wp-pro-img.small-image {
padding-top: calc(67.5% - 15px);
}
.casestudy-list-inner .wp-project .wp-pro-cont {
position: absolute;
bottom: -100%;
left: 0px;
right: 0px;
transition: 1s;
padding: 30px;
background: #c2c904;
}
.pink_bgcolor {
background-color: rgb(194, 201, 4);
}
.casestudy-list-inner .wp-project:hover .wp-pro-cont {
bottom: 0px;
}
.casestudy-list-inner .wp-project .wp-pro-img img {
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(1);
min-width: 100%;
height: 100%;
object-fit: cover;
transition: 2.5s;
}
.case_study_about {
background: #fff;
text-align: center;
}
.image_sticky_box {
position: sticky;
top: 70px;
}
/*technology*/
.technologies-sec {
background: #fff;
}
.technology_logos {
display: flex;
justify-content: center;
gap: 35px;
margin-top: 40px;
flex-wrap:wrap;
}
.image-name-wrapper {
display: flex;
flex-direction: column;
align-items: center;
max-width: 127px;
gap: 15px;
}
.image-name-wrapper span {
display: flex;
align-items: flex-start;
min-height: 36px;
}
.image_box {
min-width: 120px;
height: 100%;
}
.image_box img {
width: 60px;
max-width: 100%;
max-height: 100%;
object-fit: contain;
height: 100%;
}
/*breadcrumb*/
.breadcrumb {
width: 100%;
padding: 7px 0px;
font-size: 12px;
margin: 0px 0;
display: block;
background: #fff;
}
.breadcrumb .container {
padding-top: 0;
padding-bottom: 0;
}
.breadcrumb ul{
display:flex;
align-item:center;
}
.breadcrumb ul li {
list-style: none;
display: inline-block;
float: left;
color: #000;
position: relative;
font-size: 12px;
line-height: 1.4;
}
.breadcrumb ul li a {
color: #000;
text-decoration: none;
text-transform: capitalize;
}
.breadcrumb ul li+li:before {
content: '';
/*position: absolute;*/
/*top: 50%;*/
/*left: 0px;*/
margin: 0 5px;
transform: translate(-50%, -50%) rotate(-45deg);
width: 6px;
height: 5px;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
display: inline-flex;
}
.breadcrumb ul li span {
color: #C2C904;
}
/*banner*/
.herobanner {
background: url(../images/background/casestudy-banner.jpg) center center no-repeat #333;
background-size: cover;
float: left;
width: 100%;
position: relative;
min-height: 100vh;
padding-top: 14%;
padding-bottom: 10%;
min-height: inherit;
}
.herobanner:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .7);
}
.herobanner .herobanner-content {
width: 100%;
padding: 0px;
position: relative;
}
.herobanner.case-innerpage-banner .herobanner-content .magento-flex .magento-cont.no-pm {
padding: 0px !important;
width: 80%;
margin: 0px !important;
border: 0px none !important;
}
.herobanner.case-innerpage-banner .herobanner-content .magento-flex .magento-cont h1 {
margin-bottom: 30px;
line-height: 1;
text-transform: inherit;
color: inherit;
font-size: 4rem;
text-align: left;
}
.white {
color: #fff;
}
.text-center{
text-align:center;
}
/*service*/
.service-list {
background-color: #fff;
color: #000;
height: 100%;
padding: 25px;
border-radius: 10px;
}
.service-list:hover {
background-color: #C2C904;
color: #fff;
}
.service-list .service_icon svg {
width: 83px;
height: 83px;
border-radius: 50%;
padding: 20px;
margin-bottom: 20px;
background-color: #EAE5ED;
}
.why-coding-sprint .row {
display: flex;
}
.col-lg-4 {
padding-left:1.5rem;
padding-right:1.5rem;
}
.feat_benefit {
padding: 10px 40px;
margin: 30px 0;
border-right: 1px solid silver;
min-height: 132px;
}
.fetures-box {
flex:1;
}
.feat_benefit svg {
margin-bottom: 20px;
width: 35px;
height: 35px;
}
.feat_benefit h3 {
color: #36235A;
font-size: 22px;
}
.Process_sec {
background: #fff;
}
.Process_sec .row {
display: flex;
flex-wrap:wrap;
justify-content:center;
}
.process_icon svg {
transform: rotate(90deg);
margin: 20px auto;
}
.cta-row {
align-items: center;
padding: 70px 40px 80px;
}
.cta-inner {
background-image: url(https://www.chillicommerce.newsoftdemo.info/assets/images/background/online-shop-website.jpg);
width: 100%;
height: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position:relative;
}
.cta-inner:before {
content: "";
background: rgba(53, 4, 69, 0.8);
position: absolute;
width: 100%;
height: 100%;
inset: 0;
}
.cta-row .heading2 {
width: 66.66666667%;
}
.cta-row .heading2 h2 {
font-size: 32px;
font-weight: 400;
line-height: 1.2;
color: #ffffff;
}
.cta-row p {
color: #fff;
}
.btn-get-in-touch {
display: inline-flex;
align-items: center;
justify-content: center;
width: fit-content;
padding: 8px 24px;
font-size: 16px;
font-weight: 600;
color: #ffffff;
background: transparent;
border: 2px solid #c2c904;
border-radius: 3px;
transition: background-color 0.2s ease, color 0.2s ease;
}
.btn-get-in-touch:hover {
background-color: #c2c904;
color: #350445;
}
.mini-container-inner {
position: relative;
}
.news-sec .row {
display: flex;
}
.news-card {
padding: 0 50px;
}
/* Case study single — body copy at 14px */
.case_study_about .about_content,
.case_study_about .about_content p,
.case_study_about .about_content li,
.process_content,
.process_content p,
.process_content li,
.flexible-sec .full-content p {
font-size: 14px;
}
.border_box_content {
border-radius: 7px;
position: relative;
height: 310px;
}
.overlay-bg {
background: #00000085;
padding: 40px;
border-radius: 7px;
position: relative;
height: 100%;
overflow-y: hidden;
}
.blog-image-container {
width: 100%;
height: 100%;
display: block;
position: absolute;
border-radius: 7px;
}
.blog-image-container img {
width: 100%;
height: 100%;
border-radius: 7px;
object-fit: cover;
object-position: center;
}
.item-content {
position: absolute;
padding: 40px 40px 30px;
left: 0;
right: 0;
bottom: 0;
}
.news-card h3 {
font-size: 22px;
margin: 0;
color: #FFF5F5;
}
.news-card p {
margin: 0;
color: #FFF5F5;
line-height: 1.2;
margin-bottom: 5px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
a.blog-btn {
color: #2B2B2B;
padding: 10px 30px;
margin-top: 35px;
display: inline-block;
background: #C2C904 0% 0% no-repeat padding-box;
border: 2px solid #C2C904;
border-radius: 22px;
}
/* Card "Read More" — match the unified button style */
.news-card a.blog-btn {
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
color: #392b2b;
padding: 10px 20px;
border-radius: 0;
text-transform: none;
}
a.blog-btn:hover {
background: #4F5104;
border-color: #C2C904;
color: #fff;
}
.overlay-bg:hover {
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(11px);
}
/* Card reveal — show only the title by default, reveal text + button on hover.
The excerpt + button live in .item-extra (a block wrapper) so it collapses
cleanly to 0 height (the -webkit-box excerpt won't collapse on its own). */
.news-card .item-extra {
opacity: 0;
max-height: 0;
overflow: hidden;
transition: opacity 600ms ease, max-height 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.news-card:hover .item-extra,
.news-card:focus-within .item-extra {
opacity: 1;
max-height: 220px;
}
.news-card .item-extra p {
margin: 12px 0 0;
}
.news-card .item-extra a.blog-btn {
margin-top: 20px;
}
.fetures-sec .row {
display: flex;
flex-wrap:wrap;
}
.btn-cont .small-btn {
font-weight: 700;
text-transform: capitalize;
letter-spacing: 1px;
border: 2px solid #fff;
color: #fff;
display: flex;
align-items: center;
width: fit-content;
line-height: normal;
height: auto;
padding: 10px 15px;
}
a.small-btn:hover {
background-color: #fff;
color: #C2C904;
}
.listing-page .secondary .s2_form_widget p {
width: 100%;
text-align: left;
margin: 0px;
}
.listing-page .secondary .s2_form_widget label, .listing-page .secondary .s2_form_widget br {
display: none;
}
input[type="submit"], input[type="button"]
{
-webkit-appearance: none;
}
.content_cta_banner .ctaContainer {
display: flex;
align-items: center;
justify-content: space-between;
margin: 0;
position: relative;
z-index: 1;
}
.content_cta_banner {
background: #1f1f1f;
padding: 15px 40px;
margin: 40px 0;
box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .46);
border-radius: 3px;
position: relative;
}
.content_cta_banner:before {
content: "";
background: url(https://www.jspanther.com/blog/app/uploads/2023/09/cta-pattern.png);
background-repeat: no-repeat;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-size: cover;
}
.content_cta_banner .ctaContainer>div.ctaContent * {
color: #fff;
margin: 6px 0;
}
.content_cta_banner .ctaContainer>div.ctaContent * {
color: #fff;
margin: 6px 0;
}
.content_cta_banner .ctaContainer>div.ctaContent h5 {
font-size: 22px;
font-weight: 600;
line-height: 1.3;
}
.content_cta_banner .ctaContainer>div.ctaContent a {
background: #C2C904;
border: 2px solid #C2C904;
color: #392b2b;
/* height: 48px; */
display: flex;
width: fit-content;
padding: 10px 20px;
margin-top: 15px;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
text-transform: none;
text-decoration: none;
line-height: 1;
transition: background-color 0.3s ease, color 0.3s ease;
}
/* Hover — match the blog's green buttons (a.blog-btn) */
.content_cta_banner .ctaContainer>div.ctaContent a:hover,
.content_cta_banner .ctaContainer>div.ctaContent a:focus {
background: #4F5104;
border-color: #C2C904;
color: #fff;
}
.listing-page .secondary .s2_form_widget input[type="submit"] {
border: 0px none;
font-weight: 700;
font-size: 0.85rem;
line-height: 50px;
height: 48px;
padding: 0px 1.5rem;
display: inline-block;
text-align: center;
text-transform: uppercase;
padding: 0 2rem;
color: #fff;
text-decoration: none;
cursor: pointer;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
background-color: #5c0075;
border: 1px solid #5c0075;
width: 100%;
border-radius: 6px;
}
.listing-page .secondary .s2_form_widget input[type=submit] {
background: #C2C904;
border: 2px solid #C2C904;
color: #392b2b;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 1;
height: auto;
padding: 10px 20px;
text-transform: none;
border-radius: 0;
}
/* Hover — match the theme's green buttons (a.blog-btn) */
.listing-page .secondary .s2_form_widget input[type=submit]:hover,
.listing-page .secondary .s2_form_widget input[type=submit]:focus {
background: #4F5104;
border-color: #C2C904;
color: #fff;
}
.listing-page .secondary .s2_form_widget p input[type="email"] {
color: #000;
float: left;
width: 100%;
margin-bottom: 15px;
font-size: 0.875rem;
background: #fff;
border: 0px none;
outline: none;
text-align: center;
padding: 0px 10px;
height: 44px;
line-height: 44px;
border-radius: 6px;
}
.listing-page .secondary .s2_form_widget {
float: left;
width: 100%;
border: 3px solid #e1e1e1;
padding: 30px 30px;
background: url(https://www.chilliapple.co.uk/blog/app/uploads/2023/04/stayInTouchBg.png) top center no-repeat #e1e1e1;
color: #2B2B2B;
background-size: cover;
font-size: 15px;
font-weight: 400;
line-height: 1.6;
}
/* Widget copy spacing — separate the intro/disclaimer text blocks */
.listing-page .secondary .s2_form_widget p {
margin: 0 0 14px;
}
/* Drop empty paragraphs so they don't add blank vertical gaps */
.listing-page .secondary .s2_form_widget p:empty {
display: none;
}
.listing-page .secondary h2.widget-title {
position: relative;
font-size: 1.4rem;
}
.widget-area ul.wpp-list, .widget_recent_entries ul {
margin: 0 0 40px 0;
padding: 10px 0 0 0;
border-top: 2px solid #000;
}
.widget-area ul.wpp-list li, .widget_recent_entries ul li {
margin: 12px 0 18px;
padding: 0;
font-size: 13px;
color: #000;
font-weight: 600;
line-height: 148%;
display: block;
}
.widget-area ul.wpp-list li a, .widget_recent_entries ul li a {
color: #000;
transition: all 0.4s ease 0s;
}
.widget-area ul.wpp-list li span, .widget_recent_entries ul li span {
color: #7f7f7f;
display: block;
font-size: 12px;
padding-top: 5px;
}
ul.wpp-list li span {
display: none !important;
}
.wpp-excerpt:empty {
display: none;
}
.free-cons-cta {
width: 100%;
height: auto;
border: 3px solid #c2c900;
text-align: center;
padding: 37px;
margin-bottom: 35px;
background: url(https://www.chillicommerce.newsoftdemo.info/blog/wp-content/uploads/2026/03/newsletter-bg.webp) top center no-repeat #3b0142;
border: 3px solid #3b0142;
color: #fff;
background-size: cover;
margin-top:30px;
display: inline-block;
}
.free-cons-cta p {
font-weight: 500;
line-height: 140%;
font-family: 'Museo500';
font-size: 22px;
}
.free-cons-cta .cta_image {
padding: 0;
display: block;
/* margin: -50px 0 0 0; */
margin-bottom: 20px;
}
.free-cons-cta p:last-child {
margin-bottom: 0;
}
.free-cons-cta .small-btn {
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 1;
height: auto;
background: #C2C904;
border: 2px solid #C2C904;
color: #392b2b;
text-transform: none;
text-decoration: none;
display: inline-block;
padding: 10px 20px;
transition: background-color 0.3s ease, color 0.3s ease;
}
.free-cons-cta .small-btn:hover,
.free-cons-cta .small-btn:focus {
background: #4F5104;
border-color: #C2C904;
color: #fff;
}
.free-cons-cta .cta_image img {
height: auto;
width: auto;
}
#custom_html-2, aside#custom_html-3 {
padding-top: 30px;
padding-bottom: 10px;
}
.blog-list .image img {
display: block;
position: absolute;
height: 100%;
width: auto;
max-width: inherit;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.post-content td {
border: 1px solid #ddd;
padding: 8px;
}
/* ---------------------------------------------------------------------------
Blog listing pagination (.navigation output by new_numeric_posts_nav()).
The markup had no styles at all, so the list rendered as bare stacked text.
Matches the listing "Read More" button (.btn-know-more): #c2c904 accent,
2px border, 3px radius, Montserrat 600.
--------------------------------------------------------------------------- */
.blog-listing .navigation {
clear: both;
width: 100%;
margin: 10px 0 20px;
}
.blog-listing .navigation ul {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}
.blog-listing .navigation li.page-item {
display: block;
margin: 0;
}
.blog-listing .navigation li.page-item a,
.blog-listing .navigation li.page-item span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
height: 44px;
padding: 0 14px;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 1;
color: #2b2b2b;
background: transparent;
border: 2px solid #dcdcdc;
border-radius: 3px;
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.blog-listing .navigation li.page-item a:hover,
.blog-listing .navigation li.page-item a:focus {
background-color: #c2c904;
border-color: #c2c904;
color: #ffffff;
}
.blog-listing .navigation li.page-item a:focus-visible {
outline: 2px solid #4f5104;
outline-offset: 2px;
}
/* Current page */
.blog-listing .navigation li.page-item.active a {
background-color: #c2c904;
border-color: #c2c904;
color: #ffffff;
cursor: default;
pointer-events: none;
}
/* Previous / Next text buttons */
.blog-listing .navigation li.page-prev a,
.blog-listing .navigation li.page-next a {
padding: 0 20px;
white-space: nowrap;
}
/* Ellipsis between page-number gaps */
.blog-listing .navigation li.page-dots span {
min-width: auto;
padding: 0 6px;
color: #6b6b6b;
background: transparent;
border-color: transparent;
}
@media screen and (max-width: 575px) {
.blog-listing .navigation ul {
gap: 8px;
}
.blog-listing .navigation li.page-item a,
.blog-listing .navigation li.page-item span {
min-width: 38px;
height: 38px;
padding: 0 10px;
font-size: 15px;
}
.blog-listing .navigation li.page-prev a,
.blog-listing .navigation li.page-next a {
padding: 0 14px;
}
}
@media (max-width: 1680px) {
.news-card {
padding: 0 20px;
}
.item-content {
padding: 40px 28px 30px;
}
}
@media screen and (min-width: 992px) {
.listing-page .col-md-9.blog-listing {
width: 74.8%;
}
.col-lg-6 {
flex: 0 0 auto;
width: 50%;
}
.col-lg-4 {
flex: 0 0 auto;
width: 33.33333333%;
}
.col-md-3 {
width: 25%;
}
.col-md-4 {
flex: 0 0 auto;
width: 33.33333333%;
}
}
@media screen and (max-width: 1366px) {
.blog-list .content {
width: 100%;
min-height: inherit;
}
.blog-list .image {
width: 100%;
padding-top: 60%;
position: relative;
overflow: hidden;
}
.blog-list .image img {
display: block;
width: 100%;
position: absolute;
height: 100%;
top: 0%;
left: 50%;
transform: translate(-50%, 0%);
}
}
@media(max-width:1200px)
{
.container{
padding: 30px;
height: auto;
}
.filter-item{
padding: 0 0.9rem;
}
.wp-pro-cont.purple p{
font-size:15px;
}
}
@media screen and (max-width: 1024px) {
.casestudy-list-inner .wp-project .wp-pro-cont {
padding: 4%;
}
}
@media(max-width:991px)
{
.container{
padding: 30px 20px;
height: auto;
}
.why-coding-sprint .row{
flex-wrap:wrap;
gap:20px;
}
.filter-item{
flex: 50%;
padding: 0 0.9rem;
}
section.listing-page.row {
flex-wrap:wrap;
}
.listing-page .col-md-9.blog-listing {
width: 100%;
}
.col-md-3.col-sm-12.col-xs-12.sidebar_main{
width:100%;
}
}
@media(max-width:871px){
.fetures-box {
flex: 50%;
}
}
@media screen and (max-width: 767px) {
.casestudy-list-inner .wp-project .wp-pro-cont {
bottom: 0px;
left: 0px;
right: 0px;
position: relative;
float: left;
}
.filter-item {
width: 50%;
}
}
@media screen and (max-width: 657px) {
.filter-item {
flex: 100%;
}
}
@media (max-width: 497px) {
.fetures-box {
flex: 100%;
}
.feat_benefit {
border-bottom: 1px solid silver;
}
.heading2 h2 {font-size:30px;}
}