#sticky .secondary-nav.payments {
    z-index: 0;
    position: relative;
}

.visual-group.payments.desktop {
    position: relative;
    top: -33px;
}

.visual-group.payments.desktop .featured-image.one img{
    width: 80%;
    position: relative;
    top: -28em;
    right: 12em;
    height: auto;
}

.visual-group.payments.desktop .featured-image.two img{
    width: 140%;
    position: relative;
    top: -49em;
    right: -2em;
    height: auto;
}

.intro .title{
    opacity: 0.7;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: 24px;
    text-transform: uppercase;
}
.intro h1 {
	color: #FFFFFF;
	font-size: 36px;
	font-weight: 500;
	letter-spacing: 1px;
	line-height: 49px;
    margin-bottom: 30px;
}
.intro .subtitle {
	opacity: 0.7;
	color: #FFFFFF;
	font-size: 16px;
	line-height: 21px;
}
.payments section{
    margin-top: 30px;
    margin-bottom: 80px;
}
.payments .heading{
    margin: 60px 0 0;
}
.payments .heading h1{
    color: #002C6D;
	font-size: 36px;
	font-weight: 600;
	line-height: 49px;
	text-align: center;
    margin-bottom: 20px;
}
.payments .heading h4{
    color: #F37F76;
    background: linear-gradient(to right, #e67b74, #efa86f, #dfc269);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 24px;
	text-align: center;
    text-transform: uppercase;
    margin-bottom: 30px;
}
.payments .heading p{
	color: #7BA8BB;
	font-size: 16px;
	line-height: 21px;
    text-align: center;
}
.payments .cta-text {
	color: #7BA8BB;
	font-size: 16px;
	line-height: 21px;
	text-align: center;
}
.payments .cta-text a{
    color: #002C6D;
	font-size: 16px;
	line-height: 21px;
    text-decoration: underline;
}
#overview .content img{
    margin-bottom: 20px;
}
#overview .content p,
.mob-app .content p,
#integration .content p {
	color: #50565D;
	font-size: 16px;
	line-height: 21px;
}
#overview .content .subtitle,
.mob-app .content .subtitle,
#integration .content .subtitle{
    color: #002C6D;
	font-size: 18px;
	font-weight: 600;
	line-height: 27px;
    margin-bottom: 20px;
}
#overview .scroll-to{
    position: relative;
    color: #F37F76;
	font-size: 16px;
	font-weight: 600;
	line-height: 19px;
    transition: color .15s ease-in-out;
    text-decoration: none;
}

#overview .scroll-to:hover:after,
#overview .scroll-to:hover{
    color: #1976D2;
}

#overview .scroll-to::after{
    content: "\f105";
    font-family: 'icomoon' !important;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    border: 0;
    position: absolute;
    top: 1px;
    right: -12px;
    transition: color .15s ease-in-out;
}
#get-started .scroll-to::after{
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

#hardware .content .subtitle{
    color: #002C6D;
	font-size: 18px;
	font-weight: 600;
	line-height: 27px;
}
#hardware .content .desc{
    color: #50565D;
	font-size: 16px;
	line-height: 21px;
    font-family: "Nunito";
    min-height: 90px;
}
#hardware .content ul{
    padding: 0;
    list-style-type: none;
    width: 120%;
    display: block;
    margin-right: 10%;
    margin-left: 10px;
}

#hardware .row.height-fix {
    margin-top: -50px;
}

#hardware .content ul.adjust {
    margin-left: 40px;
}

#hardware .content ul li{
    color: #002C6D;
	font-size: 16px;
	font-weight: 600;
	line-height: 21px;
    margin-bottom: 20px;
    list-style: disc;
}
#hardware .content .scroll-to {
	color: #F37F76;
	font-size: 14px;
	line-height: 21px;
}

#software .switch{
    margin: 40px 5px;
}
#software .switch .bar-gutter{
    position: relative;
    background-color: #c0c0c0;
    height: 2px;
    width: 80px;
    margin: 3px 10px;
}
#software .switch .count {
	color: #002C6D;
	font-family: "Josefin Sans";
	font-size: 11px;
	font-weight: 500;
	line-height: 13px;
	text-align: center;
}
#software .switch .tiny-bar{
    position: absolute;
    background-color: #002C6D;
    height: 2px;
    width: 20px;
    left: 0;
}
#software .switch-box:hover{
    cursor: pointer;
}
#software .switch-box h3{
    color: #002C6D;
	font-size: 18px;
	font-weight: 600;
	line-height: 27px;
    margin-bottom: 0;
    opacity: 0.3;
}
#software .switch-box p{
    color: #50565D;
	font-size: 16px;
	line-height: 21px;
    padding: 10px 30px 30px;
    margin-bottom: 0;
    opacity: 0.3;
}

#software .switch-box h3,
#software .switch-box p {
    -webkit-transition: opacity 0.15s ease-in-out;
    -moz-transition: opacity 0.15s ease-in-out;
    -ms-transition: opacity 0.15s ease-in-out;
    -o-transition: opacity 0.15s ease-in-out;
    transition: opacity 0.15s ease-in-out;
}

#software .switch-box:hover h3,
#software .switch-box:hover p {
    opacity: 1 !important;
}

#software .subheading{
    margin-bottom: 40px;
}
#software .subheading h1{
    color: #002C6D;
	font-size: 36px;
	font-weight: 600;
	line-height: 49px;
}
#software .subheading p{
	color: #7BA8BB;
	font-size: 16px;
	line-height: 21px;
}
.mob-app .content .subtitle{
    margin-bottom: 10px;
}
.mob-app .content{
    margin-bottom: 40px;
}

#pos .heading h1,
#pos .heading h4,
#pos .heading p{
    text-align: left;
}

#integration .heading img{
    margin-bottom: 30px;
}
#integration h3{
    color: #002C6D;
	font-size: 26px;
	font-weight: 600;
	line-height: 40px;
	text-align: center;
}
#integration .content{
    text-align: left;
    padding-left: 50px;
}
#integration .content .check{
    position: relative;
}
#integration .content .check::before{
    content: url(/images/payments/tick.png);
    position: absolute;
    top: 2px;
    left: -45px;
}
#integration .content .subtitle{
    margin-bottom: 10px;
}
#testimonial h2 {
    color: #002C6D;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.6em;
}

#testimonial cite {
    color: #7BA8BB;
    font-size: 16px;
    font-weight: 600;
    font-family: Nunito;
}

#testimonial .title{
    color: #F37F76;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 24px;
    text-align: left;
    text-transform: uppercase;
}
#testimonial .btm-img,
#testimonial .left-img{
    width: 100%;
}

#get-started .cta-pagelinks .icon_wallet,
#get-started .cta-pagelinks .scroll-to  {
    opacity: 1;
    transition: all 0.25s ease-in-out;
    text-decoration: none;
}

#get-started .cta-pagelinks:hover,
#get-started .cta-pagelinks:hover .icon_wallet,
#get-started .cta-pagelinks:hover .scroll-to {
    opacity: 0.5;
    text-decoration: none;
}

#get-started .subtitle {
    color: #002C6D;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

#get-started .scroll-to{
    position: relative;
    color: #F37F76;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    text-decoration: none;
    transition: color .15s ease-in-out;
}

#get-started .scroll-to:hover {
    color: #F37F76;
}

#get-started .scroll-to::after{
    content: "\f105";
    font-family: 'icomoon' !important;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    border: 0;
    position: absolute;
    top: -1px;
    right: 15px;
}

.coming-soon-txt {
    color: #F37F76;
    font-size: 12px;
    margin-bottom: 5px;
}

.coming-soon-txt.custom {
    margin-top: -23px;
    font-weight: 600;
}

.laptop-frame {
    background: url(../../../uploads/2025/08/img_software_portal_5.png) no-repeat top left;
    background-size: contain;
    width: 110%;
    height: 100%;
    position: absolute;
    left: -14%;
    top: 16%;
    z-index: -1;
}

.laptop-shadow {
    background: url(../../../uploads/2025/08/img_software_portal_6.png) no-repeat top left;
    background-size: contain;
    width: 114%;
    height: 100%;
    position: absolute;
    left: -15%;
    top: 83%;
    z-index: -2;
}

img.portal_img {
    width: 100%;
    top: 0px;
    position: absolute;
}

img.icon_wallet {width: 60px; height: auto;}

#software.adjust {
    margin-bottom: 0;
}

#integration p {
    color: #7BA8BB;
}

#integration p.adjust {
    width: 90%;
    display: block;
    margin: 0 auto;
}

#integration .content.adjust {
    width: 80%;
    display: block;
    margin: 0 auto;
}
