/* blockchain platform services styles here */

.blockchain-sub-page-banner-section  .service-speak-with-us p{
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--white-100);
    margin: 0 !important;
    
  }  

.common-blockchain-mobile-features{
	max-width: 400px;
	width: 100%;
	object-fit: contain;
}

.smart-justify{
	justify-content: space-between;
}

.wp-block-columns.smart-optimization-bg, .smart-optimization-bg{
	background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/03/13123334/smart-optimization-bg.png) no-repeat;
	background-size: cover;
	background-position: center;
	padding: 40px 100px;
	border-radius: 20px;
	margin-top: 48px;
}

.smart-optimization-content{
	justify-content: center;
	margin-left: 80px !important;
}

.smart-optimization-content h2{
  font-size: 40px;
  color: var(--white-100);
}

.smart-optimization-content p{
  font-size: 16px;
  line-height: 1.63;
  color: var(--white-100);
  margin-top: 24px;
}

.smart-optimize-img figure img{
	max-width: 360px;
	width: 100%;
	object-fit: contain;
}

/* Common service pages banner UI */
.blockchain-sub-page-banner-section {
	background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/03/17053527/common-bg-blockchain-new-v2.png);
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: calc(100% - -1px);
	background-size: 100%;
}

.blockchain-sub-banner-bg {
	position: relative;
}
.blockchain-sub-banner-bg:after {
	content: ' ';
    position: absolute;
    right: -210px;
    top: 0px;
    width: 100%;
    background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/03045956/banner-bg-banner.png);
    height: 100%;
    background-repeat: no-repeat;
    background-size: 960px !important;
    background-position: top center;
}
.blockchain-sub-banner-bg .wp-block-columns {
	z-index: 1;
}


.blockchain-sub-page-banner-section {
	height: calc(100vh - 4.5rem);
	position: relative;
	background-color: var(--grey-black);
	overflow: hidden;
	min-height: 760px;
}

.blockchain-sub-page-banner-section .container .banner-speak-with {
	margin-top: 1rem;
}
.blockchain-sub-page-banner-section .container .banner-speak-with figure {
	margin-left: 0;
}

.blockchain-sub-page-banner-section .container {
	display: flex;
	align-items: center;
	height: 100%;
}

.blockchain-sub-page-banner-section .container .wp-block-columns {
	width: 100%;
}
.blockchain-sub-page-banner-section h1 {
	font-weight: 800;
	font-size: 3.375rem;
	line-height: 3.875rem;
	color: var(--white-100);
	margin-bottom: 1rem;
	max-width: 534px;
	/*max-width: 440px; */
	width: 100%;
	word-wrap: break-word;
}
.blockchain-sub-page-banner-section h3 {
	font-style: normal;
	font-weight: 400;
	font-size: 0.875rem;
	line-height: 18px;
	color: var(--white-65);
	margin-bottom: 0.875rem;
}
.blockchain-sub-page-banner-section h4 {
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 2.125rem;
	color: var(--white-85);
	margin-bottom: 1rem;
	max-width: 31.25rem;
}
.blockchain-sub-page-banner-section p {
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.75rem;
	color: var(--white-65);
	margin-bottom: 1.5rem;
	max-width: 31.25rem;
}
.blockchain-sub-page-banner-section figure img {
	object-fit: contain;
	object-position: center;
}
.nft-banner-section .blockchain-sub-banner-bg {
	position: relative;
	background: none;
}
.nft-banner-section .blockchain-sub-banner-bg .wp-block-columns {
	z-index: 1;
}


.nft-banner-section .blockchain-sub-banner-bg:after {
    background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/28094737/nft-banner-background-bg.png);
}

.blockchain-sub-page-banner-section.nft-banner-section figure {
	max-width: 40rem;
}
.blockchain-sub-page-banner-section.token-banner-section figure {
	max-width: 40rem;
}


/* common blockchain platform with dark background bg */

.blockchain-sub-banner-bg-2{	
	height: 100%;
	background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/01143335/smart-main-banner-bg.png);
	background-repeat: no-repeat;
	background-position: top right, bottom center;
	background-size: 1160px;
}

.smart-contract-banner-img-size img{
	max-width: 32rem;
	width: 100%;
	position: relative;
    z-index: 100;
}

.dapps-banner-img-size img{
	max-width: 38rem;
	width: 100%;
}


@media all and (min-width: 2000px) {
	.nft-banner-section .blockchain-sub-banner-bg:after, .blockchain-sub-banner-bg:after {
		content: none;
	}
}

@media all and (max-width: 992px) {
	.blockchain-sub-banner-bg:after {
		content: none !important;
	}
}

@media all and (max-height: 820px) {

	.blockchain-sub-banner-bg:after {
		background-size: 800px !important;
		right: -200px;
	}
	.blockchain-sub-page-banner-section.token-banner-section figure {
		max-width: 32rem;
	}
}

/* new */
.blockchain-sub-banner-bg:before {
	content: " ";
    background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/28073106/banner-dot-bg.png);
    position: absolute;
    right: 100px;
    top: 0;
    z-index: 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 37%;
    height: 38%;
    opacity: 0.3;
}

.banner-img-container figure {
	position: relative;
	z-index: 2;
}
.banner-img-container {
	position: relative;
}

.banner-img-container:before {
	content: " ";
	background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/28073107/banner-grey-diamond.png);
	position: absolute;
	right: -50px;
	bottom: 10%;
	z-index: 1;
	width: 150px;
	height: 100px;
	transform: rotate(130deg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.banner-img-container figure:after {
	content: " ";
	background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/28073107/banner-grey-diamond.png);
	position: absolute;
	left: -120px;
	top: 10%;
	z-index: 1;
	width: 150px;
	height: 100px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.banner-img-container figure:before {
	content: " ";
	background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2023/04/28073108/banner-primary-diamond-bg.png);
	position: absolute;
	left: -120px;
	bottom: 10%;
	z-index: 1;
	height: 150px;
	width: 100px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
/* new */



/* new */
@media all and (min-width: 2000px) {
	.nft-banner-section .blockchain-sub-banner-bg:after, .blockchain-sub-banner-bg:after, .blockchain-sub-banner-bg:before, .banner-img-container figure:before, .banner-img-container figure:after, .banner-img-container:before {
		content: none;
	}
}

@media all and (max-width: 1200px) {
    .banner-img-container figure:before, .banner-img-container figure:after, .banner-img-container:before {
		content: none;
	}
}


@media all and (min-height: 1200px) {
	.blockchain-sub-banner-bg:after,
	.blockchain-sub-banner-bg:before{
		content: none;
	}
}

@media all and (max-height: 910px) {
	.blockchain-sub-page-banner-section.token-banner-section figure {
		max-width: 32rem;
	}
}

@media all and (max-width: 992px) {
	.blockchain-sub-banner-bg:after, .blockchain-sub-banner-bg:before {
		content: none !important;
	}
}
/* new */



/* 
    Workflow section styles here
        1.1 start and end section circle
        1.2 first, second and third section common styles
        1.3 Work details Card styles here
        1.4 First section styles starts here
        1.5 Middle section styles starts here
        1.6 Last section styles starts here

*/

#home_workflow {
    background-color: var(--grey-black-90);
}
#home_workflow .container {
    min-height: calc(100vh - 4.5rem);
    padding: 3.5rem 0;
    display: flex;
    align-items: center !important;
}
#home_workflow .container h2 {
    font-size: 2.375rem;
    line-height: 3.25rem;
    font-weight: 800;
    color: var(--white-100);
    margin-bottom: 1.5rem;
}

.flow-section {
    margin: 10rem 0 7.5rem !important;
    position: relative;
}

/* start and end section circle */
.flow-section::before, .flow-section::after {
    position: absolute;
    content: "";
    background: #646464;
    width: 0.875rem;
    height: 0.875rem;
    top: 1.125rem;
    border-radius: var(--border-radius-circle);
}

.flow-section::before {
    left: -0.5rem;
}
.flow-section::after {
    right: -0.5rem;
}

/* first, second and third section common styles */
.flow-section .first-section, .flow-section .middle-section, .flow-section .last-section {
    width: 25%;
    position: relative;
    padding: 0 1rem;
}

.product-workflow .flow-section .first-section ,.product-workflow .flow-section .middle-section ,.product-workflow .flow-section .last-section {
    width: 33.33%;
  }

.flow-section .wp-block-image {
    margin-bottom: 1.5rem;
}
.flow-section .wp-block-image figure {
    width: 3.125rem;
    height: 3.125rem;
}
.flow-section .wp-block-image figure img {
    width: 100%;
    height: 100%;
}

.flow-section .inner-box::after {
    content: "";
    position: absolute;
    right: 0;
    top: 1.125rem;
    height: 0.875rem;
    background: transparent;
    border-right: 0.063rem solid #646464;
}


.flow-section .first-section h3, .flow-section .middle-section h3, .flow-section .last-section h3 {
    font-size: 1.25rem;
    line-height: 1.5rem;
    font-weight: 800;
    color: #fff;
    max-width: 10rem;
    margin: 0 auto;
}

/* Work details Card styles here */
.flow-section .first-section .work-details, .flow-section .middle-section .work-details, .flow-section .last-section .work-details {
    position: absolute;
    width: 90%;
    height: auto;
    border-radius: var(--border-radius-10);
    box-shadow: 0.375rem 0.375rem 0.875rem #fb833d40;
    background-color: #fff;
    top: 1.937rem;
    left: 50%;
    z-index: 1;
    transform: translate(-50%,-50%);
    padding: 1.5rem 1rem;
    display: none;
}
/* .flow-section .first-section .work-details.show-work, .flow-section .second-section .work-details.show-work, .flow-section .third-section .work-details.show-work,
.flow-section .first-section:hover .work-details, .flow-section .middle-section:hover .work-details, .flow-section .last-section:hover .work-details {
    display: block;
} */
.flow-section .first-section .work-details h5, .flow-section .middle-section .work-details h5, .flow-section .last-section .work-details h5 {
    font-size: 1.375rem;
    line-height: 1.875rem;
    font-weight: 800;
    color: #fb833d;
    margin: 0 0 1.5rem;
    text-align: center;
}
.flow-section .first-section .work-details p, .flow-section .middle-section .work-details p, .flow-section .last-section .work-details p {
    font-size: 0.875rem;
    line-height: 1.86;
    font-weight: normal;
    color: var(--black-65);
    margin: 0;
    text-align: center;
}

/* First section styles starts here */

.flow-section .first-section::before, .flow-section .first-section::after {
    content: "";
    position: absolute;
    top: 1.5rem;
    background: var(--grey-light2);
}

.flow-section .first-section::before {
    left: -0.313rem;
    width: 5.75rem;
    height: 0.063rem;
}
.flow-section .first-section::after {
    right: -4.875rem;
    width: 10rem;
    height: 0.063rem;
}
.flow-section .first-section .wp-block-image figure {
    position: static;
}

/* Middle section styles starts here */

.flow-section .middle-section::after {
    content: "";
    position: absolute;
    right: -4.875rem;
    top: 1.5rem;
    width: 10rem;
    height: 0.063rem;
    background: var(--grey-light2);
}

/* Last section styles starts here */
.flow-section .last-section::after {
    content: "";
    position: absolute;
    right: -0.438rem;
    top: 1.5rem;
    width: 5.75rem;
    height: 0.063rem;
    background: var(--grey-light2);
}

/* case study and details page styles here  */

.page-id-2469,
.page-id-2495,
.page-id-2498,
.page-id-2500,
.page-id-2502{
    overflow-x: hidden;
}

.wp-block-image:not(.is-style-rounded) img {
    border-radius: 0;
}

.all-page-container {
    padding-top: 4.5rem;
    overflow-x: inherit;
}

.case-gap-sec {
    column-gap: 60px;
}

.case-download-mobile {
    display: none;
}

.case-mobile-icon {
    display: none;
}

.case-require {
    display: flex;
    justify-content: flex-end;
}

.case-require-section {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
}

/* Dispatch optimization Banner section */

.banner-bg-dispatch {
    background: var(--banner-dispatch);
}

.banner-bg-pricing {
    background: var(--banner-pricing);
}

.banner-bg-ingame {
    background: var(--banner-ingame);
}

.banner-bg-iqi {
    background: var(--banner-iqi);
}

/*---------------------------------------
 Banner section ------------------------ */
.banner-bg {
    background: var(--banner-case);
}

.banner-bg,
.banner-bg-pricing,
.banner-bg-dispatch,
.banner-bg-ingame,
.banner-bg-iqi {
    height: calc(100vh - 72px);
    display: flex;
    align-items: center;
}

.banner-sauce-img img {
    width: 592px;
}

.banner-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.banner-text h1 {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--black-100);
    padding-bottom: 1rem;
}

.banner-desc-p {
    padding-bottom: 0.75rem;
    font-size: 0.813rem;
    color: var(--black-45);
}

.banner-desc {
    font-size: 1.125rem !important;
    font-weight: normal;
    line-height: 1.56 !important;
    padding-bottom: 2.75rem;
    color: var(--black-45);
}

.banner-arrow {
    position: relative;
}

.banner-arrow:before {
    bottom: -66px;
    left: -130px;
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/08/27183027/arror-curve.png) no-repeat;
    background-size: contain;
}
/*---------------------------------------
 Case study service first ------------------------ */

.case-icons-end {
    display: flex;
    justify-content: end;
}

.figure-case-1,
.figure-case-2,
.figure-case-3,
.figure-case-4 {
    width: 52px;
    height: 52px;
    margin: 0 12px 0 0;
    padding: 14px 15px 14px 16px;
    border-radius: 6px;
    display: flex;
    align-items: center;
}

.figure-case-1 {
    background-color: var(--violet-light);
}
.figure-case-2 {
    background-color: var(--orange-light);
}
.figure-case-3 {
    background-color: var(--pink-light);
}
.figure-case-4 {
    background-color: var(--green-light);
}

.margin-top-48 {
    margin-top: 3rem;
}

.margin-bottom-81 {
    margin-bottom: 2.626rem;
}

.case-service-heading {
    font-size: 14px;
    font-weight: normal;
    color: var(--black-45);
    padding-bottom: 4px;
}

.case-service-title {
    font-size: 18px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: normal;
    color: #000;
}

/*---------------------------------------
 Case study service second ------------------------ */

.case-section-1 {
    width: 550px;
    padding: 32px;
    border-radius: 20px;
    border: solid 1px var(--primary-15);
    background-color: var(--light-pink);
    position: relative;
}

.case-section-1 h3 {
    font-size: 24px;
    font-weight: 800;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    color: var(--black-100);
    padding-bottom: 0.75rem;
}
.case-section-1 p {
    font-size: 15px;
    font-weight: normal;
    line-height: 1.6;
    letter-spacing: normal;
    color: var(--black-45);
    padding: 0;
}

.line:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--dark-orange);
    top: 22%;
    left: -1%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.line:before {
    content: "";
    top: 22%;
    right: 100%;
    margin: auto;
    position: absolute;
    width: 100vw;
    height: 1px;
    background: var(--dark-orange);
}

.line-2:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--dark-orange);
    top: 20%;
    right: -1%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.line-2:before {
    content: "";
    top: 20%;
    left: 100%;
    margin: auto;
    position: absolute;
    width: 100vw;
    height: 1px;
    background: var(--dark-orange);
}
.line-3:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--dark-orange);
    top: 24%;
    left: -1%;
    transform: translateY(-50%);
    border-radius: 50%;
}

.line-3:before {
    content: "";
    top: 24%;
    right: 100%;
    margin: auto;
    position: absolute;
    width: 100vw;
    height: 1px;
    background: var(--dark-orange);
}

.case-require img {
    width: 365px;
    height: 58px;
    object-fit: contain;
}

.case-challenge img {
    width: 290px;
    height: 59px;
    object-fit: contain;
}

.case-result img {
    width: 191px;
    height: 47px;
    object-fit: contain;
}

.case-study-icon {
    max-width: 119px;
    height: 119px;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: -8px 8px 24px 0 rgb(0 0 0 / 10%);
    border: solid 1px rgba(0, 0, 0, 0.05);
    background-color: var(--white-100);
    object-fit: contain;
    border-radius: 50%;
}

.case-2 {
    width: 77px;
    height: 119px;
}

.case-3 {
    width: 176px;
    height: 119px;
}

.case-study-icon img {
    width: 45px;
}

.require-case-line {
    position: relative;
}
.require-case-line:after {
    content: "";
    position: absolute;
    width: 100vw;
    height: 1px;
    left: 0;
    margin: auto;
    background: var(--light-daek-1);
}

.require-case-line-2 {
    position: relative;
}

.challenge-flex {
    display: flex;
    justify-content: space-between;
	align-items: start !important;
}

.case-result-between {
    justify-content: space-between;
	align-items: flex-start !important;
	
}

.require-case-line-2:before {
    content: "";
    position: absolute;
    width: 100vw;
    height: 1px;
    right: 0;
    margin: auto;
    background: var(--light-daek-1);
}

/*------------------------------------------------
 other case section ------------------------------ */

.case-studies-h3 {
    padding-bottom: 32px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.38;
    letter-spacing: normal;
    color: var(--darken-light-black);
}

.case-study-box {
    width: 354px;
    border-radius: 4px;
}

.case-studies-titile {
    font-size: 20px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: normal;
    color: var(--black-100);
    padding-top: 20px;
    padding-bottom: 12px;
}

/*
.case-studies-desc {
    font-size: 12px;
    font-weight: normal;
    line-height: 1.67;
    letter-spacing: normal;
    color: rgba(0, 0, 0, 0.45);
    padding-bottom: 20px;
}
*/

.margin-bottom-3 {
    margin-bottom: 3rem;
}

.show-for-work {
    margin-bottom: 3.75rem;
}

p.case-read {
    font-size: 14px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: normal;
    color: var(--light-darken-black);
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

p.case-read img {
    padding-left: 6px;
    width: 20px !important;
}

.case-date {
    font-size: 12px;
    font-weight: normal;
    letter-spacing: normal;
    color: rgba(0, 0, 0, 0.45);
}

.case-gap-52 {
    gap: 52px;
	align-items: baseline !important;
}

.text-align-end {
    text-align: end;
}

.case-studies-img-relative {
    position: relative;
	border: 1px solid var(--light-grey-22);
	border-radius: 6px;
}

.bottom-left {
    position: absolute;
    bottom: 12px;
    left: 16px;
    border: 1px solid var(--grey-light5);
    padding: 4px 6px;
    border-radius: 4px;
    color: var(--grey-light5);
}
/*-------------------------------------
 case study download ------------ */

.case-download {
    width: 351px;
}

.case-download-bg {
    background-color: var(--primary-10);
}

.case-download-h2 {
    font-size: 32px;
    font-weight: 800;
    color: var(--black-100);
    padding-bottom: 0.5rem;
}

/* form overwrite style here */

#case_study_download .case-form-inputs {
    margin: 0 0 0;
}

#case_study_download .case-form-inputs .wpforms-field-container {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    margin: 0 -0.5rem;
}

#case_study_download .case-form-inputs .wpforms-field {
    width: 50%;
    padding: 0.5rem;
    position: relative;
}

#case_study_download .case-form-inputs .wpforms-field-container .wpforms-field-label {
    position: absolute;
    top: 1.938rem;
    left: 1.75rem;
    font-size: 0.875rem;
    line-height: 1.125rem;
    font-weight: normal;
    color: var(--black-45);
    transition: all ease-in-out 0.2s;
    pointer-events: none;
}
#case_study_download .case-form-inputs .wpforms-field .wpforms-required-label {
    color: var(--black-45);
}

#case_study_download .case-form-inputs .wpforms-field .wpforms-field-large {
    min-height: 3.75rem;
    padding: 1.5rem 1rem 0.75rem 1rem;
    font-size: 0.875rem;
    font-weight: 800 !important;
}
#case_study_download select {
    -webkit-appearance: none !important;
}
#case_study_download .case-form-inputs .wpforms-form .wpforms-field-container .wpforms-field-select {
    position: relative;
}
#case_study_download .case-form-inputs .wpforms-form .wpforms-field-container .wpforms-field-select::after {
    content: "";
    position: absolute;
    top: 45%;
    right: 1rem;
    transform: translate(-50%);
    border-left: 0.313rem solid transparent;
    border-right: 0.313rem solid transparent;
    border-top: 0.313rem solid #000;
}
#case_study_download .case-form-inputs .wpforms-field .wpforms-field-large:hover,
#case_study_download .case-form-inputs .wpforms-field .wpforms-field-large:focus {
    border-color: var(--primary-100);
}
#case_study_download .case-form-inputs .wpforms-field .wpforms-has-error {
    padding: 1.5rem 3rem 0.75rem 0.75rem;
}
#case_study_download .case-form-inputs .wpforms-field .label-active,
#case_study_download .case-form-inputs .wpforms-field .label-active .wpforms-required-label {
    top: 1rem;
}
#case_study_download .case-form-inputs .wpforms-field .label-active,
#case_study_download .case-form-inputs .wpforms-field .label-active .wpforms-required-label {
    color: var(--primary-100);
}
#case_study_download .case-form-inputs .wpforms-field select option:first-child {
    display: none;
}
#case_study_download .case-form-inputs .wpforms-field.wpforms-field-textarea {
    width: 100%;
}
#case_study_download .case-form-inputs .wpforms-field.wpforms-field-textarea .wpforms-field-large {
    resize: none;
    max-height: 9.875rem;
}

#wpforms-submit-2472 {
    padding: 0.813rem 1.5rem;
    font-size: 1.125rem;
    line-height: 1.5rem;
    font-size: 20px;
    font-weight: 800;
    background-color: var(--black-100);
    color: var(--white-100);
    border: none;
    cursor: pointer;
    overflow: hidden;
    border-radius: 4px;
}

div.wpforms-container-full .wpforms-form .wpforms-submit-container {
    padding: 10px 4px !important;
}

.case-form-btn {
    margin-top: 12px;
}

/* other case studies  */

.other-case-studies {
    margin-top: 3.75rem;
    margin-bottom: 3.75rem;
}

/*list page styles here */

p.case-studies-heading-para{
	font-size: 16px;
	font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
    color: var(--black-100);
    padding-bottom: 12px; 
}

.list-banner-bg {
    background-image: var(--list-bg-color);
  	padding: 40px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.list-banner-para {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.56;
    letter-spacing: normal;
    color: var(--white-65);
    max-width: 500px;
    margin: 0 auto;
}

.list-banner-heading {
    font-size: 60px;
    font-weight: 800;
    letter-spacing: 0.63px;
    text-align: center;
    color: var(--white-100);
}

.list-sauce-box {
    max-width: 440px;
    max-height: 400px;
    border-radius: 10px;
    background-color: var(--list-box);
    display: flex;
    justify-content: center;
    align-items: center;
}
.list-sauce-para {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    color: var(--dark-orange);
    max-width: 136px;
    height: 28px;
    padding: 8px;
    border-radius: 4px;
    background-color: var(--primary-10);
    margin-top: 76px;
    margin-bottom: 16px;
	text-align: center;
}
.list-sauce-heading {
    font-size: 24px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: normal;
    color: var(--grey-dark4);
    padding-bottom: 6px;
}

.list-sauce-desc {
    font-size: 14px;
    font-weight: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: var(--black-45);
    padding-bottom: 16px;
}

.list-sauce-pb {
    padding-bottom: 64px;
}

.list-sauce-position {
    position: relative;
    top: -20px;
}

.list-iqi-bg,
.list-ingame-bg,
.list-sauce-bg,
.list-dispatch-bg,
.list-pricing-bg {
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.list-iqi-bg {
    background: var(--list-iqi-color);
}

.list-ingame-bg {
    background: var(--list-ingame-color);
}

.list-sauce-bg {
    background: var(--list-sauce-color);
}

.list-dispatch-bg {
    background: var(--list-dispatch-color);
}

.list-pricing-bg {
    background: var(--list-pricing-color);
}

.mt-64 {
    margin-top: 64px;
}

.list-iqi-h3 {
    font-size: 32px;
    font-weight: 800;
    color: var(--white-100);
}

.list-iqi-para {
    font-size: 14px;
    font-weight: normal;
    line-height: 1.71;
    letter-spacing: normal;
    max-width: 350px;
    color: var(--white-65);
}

.list-patch-pricing {
    max-width: 500px !important;
}

.list-iqi-read {
    font-size: 16px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: normal;
    color: var(--white-85);
    display: flex;
    align-items: center;
}

.list-iqi-read .wp-image-1946 {
    margin-left: 6px;
}

.list-iqi-tech {
    font-size: 10px;
    font-weight: 800;
    line-height: normal;
    letter-spacing: 1.5px;
    text-align: justify;
    color: var(--white-100);
    padding-bottom: 16px;
}

.list-iqi-img {
    width: 215px;
    object-fit: contain;
    z-index: 3;
}

.list-iqi-positon {
    position: relative;
    top: 80px;
}

.iqi-full-width img {
    width: 100%;
}

.iqi-content-padding {
    padding-left: 60px;
    padding-top: 84px;
}

.pb-6 {
    padding-bottom: 6px;
}

.pb-16 {
    padding-bottom: 16px;
}

.list-iqi-tech-align {
    display: flex;
    align-items: end;
    padding-bottom: 48px;
}

.list-iqi-align-gap {
    display: flex;
    align-items: center;
    gap: 18px;
}

.case-list-pages {
    padding-bottom: 36px;
}

.list-icons-size img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.list-sauce-feature {
    font-size: 10px;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: justify;
    color: var(--white-100);
    max-width: 80px;
    padding: 6px;
    border-radius: 4px;
}

.details-inside-text {
    opacity: .4;
    font-size: 40px!important;
    font-weight: 800;
    line-height: 1;
    letter-spacing: normal;
    text-align: justify;
    color: var(--light-text-1) !important;
	padding-left: 60px;
}

.wp-block-cover {
    min-height: 200px;
    object-fit: contain;
}

.list-iqi-read a:hover{
	text-decoration: underline !important;
    color: var(--white-100) !important;
}

.list-ingame-direct,
.list-sauce-direct,
.list-dispatch-direct,
.list-pricing-direct,
.list-iqi-direct{
	cursor: pointer;
}

.list-iqi-font{
  font-size: 36px;
}


/* Product page overall style here */

.product-banner-heading h1{
  font-size: 42px;
  font-weight: 800;
  line-height: 1.29;
}

.product-banner-heading p:nth-child(2){
  font-size: 20px;
  font-weight: 800;
  color: var(--black-85);
}

.product-banner-heading p:nth-child(3){
  font-size: 16px;
  line-height: 1.5;
  color: var(--black-65);
  max-width: 700px;
  margin: 0 auto;
}

/* product page main style here */

.maxis-product-bg,
.maxis-crm-product-bg,
.maxis-time-product-bg,
.tokan-product-bg{
	border-radius: 20px;
}

.product-mobile-img{
	display: none;
}
.product-mobile-img-center{
	display: none;
}

.maxis-time-product-bg{
	background-color: var(--primary-08);
}

.maxis-product-bg{
	background-color: var(--maxis-bot-product-bg);
}

.maxis-crm-product-bg{
	background-color: var(--maxis-crm-product-bg);
}

.tokan-product-bg{
	background-color: var(--tokan-product-calib-bg);
}

.first-product-maxis{
	position: relative;
}

.tokan-product-bg:after{
	background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/09/23125026/tokan-io-bg.png) no-repeat;
}

.maxis-time-product-bg:after{
	background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/09/23125022/maxis-time-bg.png) no-repeat;
}

.maxis-crm-product-bg:after{
	background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/09/23125033/maxis-crm-bg.png) no-repeat;
}


.maxis-crm-product-bg:after,
.maxis-time-product-bg:after,
.tokan-product-bg:after{
	content: "";
	display: block;
    position: absolute;
    width: 158px;
  	height: 263px;
	object-fit: contain;
    background-size: 100%;
    right: 0;
    bottom: 0;
	top: 16px;
}

.maxis-product-bg:after{
		background: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/09/23125017/maxis-bot-bg.png)no-repeat;
    content: "";
	display: block;
    position: absolute;
    width: 158px;
  	height: 263px;
	object-fit: contain;
    background-size: 100%;
    right: 0;
    bottom: 0;
	top: 0;
}


.first-ourproduct{
	padding-top: 3.5rem;
	padding-bottom: 1.5rem;
}

.product-main-heading h2{
  max-width: 700px;
  font-size: 40px;
  font-weight: 800;
  line-height: 1.25;
  color: var(--black-100);
  margin: 0 auto;
}

.product-explore{
	padding-bottom: 3.25rem;
}

/* product floater */

.request-demo-floater a{
    padding: 7px 14px 6px 12px;
    border-radius: 6px;
    background-color: rgba(251,131,61,.1);
    font-size: 14px !important;
    font-weight: 800 !important;
    color: var(--dark-orange) !important;
}

.product-floater a{
	display: flex !important;
}

.request-demo-floater a:before{
	content: "";
    background-image: url(https://media.calibraint.com/calibraint-wordpress/wp-content/uploads/2022/09/13050758/orange-chat-product.png) !important;
    background-size: contain;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    margin-right: 8px;
}

.request-demo-floater a:hover::before{
	filter: brightness(7) contrast(3) grayscale(1);
}

.request-demo-floater a:hover{
  padding: 7px 14px 6px 12px;
  border-radius: 6px;
  background-color: var(--primary-100);
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--white-100) !important;
}

.product-floater{
	padding: 12px !important;
}

.products-floating-align{
	display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}