/* Css Document*/
/* Font css */
@font-face {
    font-family: Lato-Regular;
    src: url(../assets/font/Lato-Regular.eot);
    src: url(../assets/font/Lato-Regular.woff) format("woff"),url(../assets/font/Lato-Regular.ttf) format("truetype"),url(../assets/font/Lato-Regular.svg) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Lato-Bold;
    src: url(../assets/font/Lato-Bold.eot);
    src: url(../assets/font/Lato-Bold.woff) format("woff"),url(../assets/font/Lato-Bold.ttf) format("truetype"),url(../assets/font/Lato-Bold.svg) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

/* Reset Start */
html { height: 100%;  }
html,body {width:100%;}

/***** Global Classes and declarations *****/
body, p, h1, h2, h3, h4, h5, h6, ol,li, input { margin: 0; padding: 0; list-style:none; }
body {font-size: 62.5%; background:#fff; font-family: 'Lato-Regular';}
* {outline:none; padding:0; margin:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
a, ul li a, p a.btn {text-decoration: none; outline:none!important; }
p, ul li, h1, h2, h3, h4, h5, h6, pre, a{line-height:1.2;}
p, ul li, ol li {font-size:1.5em;}
a:hover {text-decoration: none; }
a.selected {cursor:default;}
a:hover.selected {text-decoration:none;}
img {border:none;}
li, li li, li a, li li a, li p, li a i, p, p a, a,
h1, h1 a, 
h2, h2 a, 
h3, h3 a, 
h4, h4 a, 
h5, h5 a, 
h6, h6 a {font-size:1em;}
a {color:#000;}
p {font-size:1.4em; }
input,textara {font-size:1.2em;}
p > span {font-family: 'Lato-Bold';}
h1, h2, h3, h4, h5, h6 {font-weight:normal; margin:0; font-family: 'Lato-Bold'; color:#00908a; text-transform:uppercase; }
h2 {font-size:2em;}
h3 {font-size:1.8em;}
h4 {font-size:1.6em;}
h5 {font-size:1.4em;}
h6 {font-size:1.2em;}

.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clear{clear:both;font-size:1%;height:0;line-height:0; display:block; width:0;}
html[xmlns] .clearfix {display: block; }

i {line-height:normal;}
textarea {resize:none; }
.clearThis {clear:both;}
canvas {width:100% !important;}
select {font-size:1.2em; height:30px; width:100%;}
input[type=text] {-webkit-appearance:none;}
input::-ms-clear {display: none;}
.highlight {color:#ae275f;}
/* Reset End */

/* Header Css*/
.headerMaster {width:100%; position:relative; z-index:10;}
.header-placeHolder {position:relative; width:100%; height:80px; /*background:#e5e4e2;*/ /*background:url("../images/header-bg.jpg") no-repeat center bottom;*/ text-align:center;}
.header {padding:10px; background:#fff; height:75px; text-align:center;}
.header .progress {float:left; padding-top:16px;}
.header .axis {float:right; padding-top:7px;}
.header .PingPay {display:inline-block; position:absolute; left:50%; top:5px; z-index:1; margin-left:-90px;}

/* New Header */
.headerNew.ipl {
    border-top: 30px solid #97144d;
}
.ipl .LogoPart {
    position: relative;
    top: -10px;
    background: #97144d;
    padding: 0px 0 0 80px;
    font-family: Arial;
    font-size: 36px;
    display: inline-block;
    height: 70px;
    vertical-align: middle;
}
.ipl .LogoPart a {
    color: #fff;
    text-decoration: none;
}
.ipl .LogoPart img{
    width: 86%;
    float: right;
    position: relative;
    z-index: 2;
    right: 10px;
}
.ipl .LogoPart::after {
    content: '';
    background: #97144d;
    position: absolute;
    height: 120%;
    width: 50px;
    border-radius: 0 0 20px 0;
    right: 0;
    top: -13px;
    margin-right: -37px;
    transform: rotate(35deg);
}
.ipl .LogoPart span {
    position: absolute;
    top: 7px;
    left: 100%;
    width: 15px;
    height: 15px;
    margin-left: 50px;
    transform: rotate(17deg);
}
.ipl .LogoPart span::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
    background: #97144d;
    width: 100%;
    height: 100%;
}
.ipl .LogoPart span::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: #fff;
    top: 0;
    left: 0;
    border-top-left-radius: 30px;
}
/* New Header end */

.mailer-listing{margin: 0 0 15px 15px;}
.mailer-listing li {
    list-style: disc;
}

.sections {width:100%; text-align:center;/* padding:20px 0 100px;*/}
.container {max-width:960px; width:100%; margin:0 auto; /*padding-top:20px;*/padding: 0 15px;}
/*#section_1, #section_2 , #section_3 , #section_4 {height:100%; clear:both;}*/

/*section 1 - About Ping Pay*/
.full, .slide {width:100%;}
.slide {position:relative; display:inline-block;}
.section1Banner {height:205px; display:none; width:100%; background:url("../images/section1mobImg.jpg") no-repeat center bottom; text-align:center; background-size:cover;}
h1 {font-size:2.2em; color:#ae275f; padding:10px 0;}

/*.section1 {background:url("../images/Page122.jpg") no-repeat center -133px; text-align:center;}*/
.section1 {background-image:url("../images/Page122.jpg"); width:100%; background-position:center 80px; background-repeat:no-repeat; position:relative; background-size:cover; text-align:center;}
.section2 {background-image:url("../images/Image_02.jpg"); width:100%; background-position:0 0; background-repeat:no-repeat; position:relative; background-size:cover; text-align:center;}
.section3 {background-image:url("../images/Image_03.jpg"); width:100%; background-position:right 0; background-repeat:no-repeat; position:relative; background-size:cover; text-align:center;}
.section4 {background-image:url("../images/Image_04.jpg"); width:100%; background-position:0 0; background-repeat:no-repeat; position:relative; background-size:cover;}


/*#section_1 {background:url("../images/Image_01.jpg") no-repeat center -57px; margin-top:-80px; padding-top:80px; position:relative;}*/
#section_1 .container {position:relative;}
#section_1 .container p {font-size:1.4em;}

.redLine{width:145px; height:146px; background:url(../images/line-bg.png) no-repeat center bottom; bottom:20%; position:absolute; left:43%;}
.mobile {padding:0 7px; width:146px; overflow:hidden; position:absolute; left:0; bottom:8%; height:146px; text-align:center;}
.mobile .ov {overflow:hidden; width:100%; height:100%; display:block; }
.slideM {width:100%; height:100%; text-align:center; position:relative;}
.slideM .pWrap {display:table; height:100%;}
/*.redLine p{float:left;}	*/
.redLine p.text1{padding:24px 0 0 0;}
.redLine p.text2{padding:45px 0 0 0;}
.redLine p.text3{padding:25px 0 0 0;}
.redLine p.text4{padding:27px 0 0 0;}
#section_1 .mobile p {color:#ae275f; font-size:16px; font-family: 'Lato-Bold';  text-transform:uppercase; display:table-cell; vertical-align:middle; width:100%;}
.padBt5 {padding-bottom:5px;}
.slideM .pWrap {width:100%; position:relative; display:none;}
.slideM .pWrap.active {display:table;}
.slideM .pWrap.next {left:100%; top:0; position:absolute; display:table;}
.downArrow, .downArrow2, .downArrow3 {background:url("../images/down-arrow.png") no-repeat 0 0; width:53px; height:27px; text-align:center; cursor:pointer; margin:0 auto; position:absolute; left:47%; bottom:0.5%;}
.section1Banner {display:none; background:url("../images/section1mobImg.jpg") no-repeat 0 0; background-size:cover;}

/* Section 2 css*/
/*#section_2 {background:url(../images/Image_02.jpg) no-repeat #bce0f0; width:100%; background-position:0 0; position:relative; background-size:cover; padding:0;}*/
#section_2 .container {width:920px;}
.galleryTabs {margin:0 auto; width:66%; /*width:35%;*/}
.galleryWrap{width:688px; margin:0 auto;}
.galleryWrap h2{font-size:23px; color:#ae275f; padding-top:10px;}
.galleryWrap p{color:#282727; font-size:14px; width:657px; text-align:center; line-height:20px; padding:10px 0 15px;}
.galleryWrap span{color:#ae275f;}
/*dropdown css*/
.dropdownWrap {border:1px solid #cbcbcb; background:#fff; width:190px; margin:0 auto; /*visibility:hidden;*/ display:none;}
.dropdownWrap .selectbg {background: url(../images/red-downarrow.png) no-repeat scroll right center transparent; position: relative; width: 98%; height:35px; margin-bottom:3px;}
.dropdownWrap .selectbg select { cursor: pointer; height: 25px; opacity: 0; position: absolute; filter: alpha(Opacity=0); top:4px; width: 190px; left:0; }
.dropdownWrap .selectbg .selectedvalue { color: #ae2962; font-size: 14px; height:36px; left: 0; line-height: 1.6em; overflow: hidden; position: absolute; padding:8px 0 0 13px; top:0; width:190px; font-family:'Lato-Regular'; text-align:left;}
.tabsContainer{float:left; width:920px; padding:20px 0 0;}
.tabWrap{width:688px; margin:0 auto;}
.tabWrap ul.galleryTabs li{float:left; width:220px; font-size:17px; color:#fff; margin:0 0 0 5px; padding:15px 0; cursor:pointer; position:relative; text-transform:uppercase;}
.tabWrap ul.galleryTabs li.arrowBlue{background:#016ba7;}
.tabWrap ul.galleryTabs li.arrowGreen{background:#509032;}
.tabWrap ul.galleryTabs li.arrowpurple{background:#6c1b78;}
.tabWrap ul.galleryTabs li span {width:220px; display:block;}
.tabWrap ul.galleryTabs li.selected span {position:absolute; top:50px; left:0; height:8px;}
.tabWrap ul.galleryTabs li.arrowBlue.selected span{background:url(../images/arrowblue.png) no-repeat center 0;}
.tabWrap ul.galleryTabs li.arrowGreen.selected span{background:url(../images/arrowgreen.png) no-repeat center 0;}
.tabWrap ul.galleryTabs li.arrowpurple.selected span{background:url(../images/arrowpurple.png) no-repeat center 0;}
.tabContWrap{float:left; clear:both;}
.tabContent{float:left; padding:20px 0;}
.tabContent .lhs{width:709px; float:left;}
.tabContent.firstTab .lhs  {margin:0 auto; width:77%; float:none;}
.tabContent .lhs .videoLink{padding:0 0 0 57px;}
.tabContent .lhs .videoLink iframe{width:642px; height:375px;}
.tabContent .rhs{float:left; width:209px; padding:0 0 0 15px;}
.rhs h3{font-size:13px; color:#282727; padding:0 0 5px 0; font-family:'Lato-Regular'; text-align:left;}
.rhs .videoBox{border:2px solid transparent; margin:0 0 6px 0; float:left; width:178px;}
.rhs .active{border:2px solid #b52159;}
.rhs .active .videoText{background-color:#b52159;}
.videoImg{float:left; position:relative;}
.videoImg span{background:url(../images/video-triangle.png) no-repeat right bottom; width:38px; height:42px; position:absolute; top:13px; left:62px;}
.videoText{float:left; background:#7b7b7b; font-size:14px; color:#fff; text-align:left; padding:8px 10px; margin:-4px 0 0; width:174px;}
.videoImg img{height:84px; width:174px;}



/******** Start ScrollBar *************/
.scroll_pane{ float: left; height:355px; overflow: hidden; position: relative; width:210px; clear:both; }

.jspContainer{overflow: hidden; position: relative;}
.jspPane{position: absolute;}
.jspVerticalBar{position: absolute;	top: 0;	right: 0; width: 11px; height: 468px;}
/*.jspHorizontalBar{position: absolute; bottom: 0; left: 0; width: 100%; height: 16px;}*/
.jspCap{display: none;}
.jspHorizontalBar .jspCap{float: left;}
.jspVerticalBar .jspTrack,
.jspVerticalBar .jspDrag{float: left; width:11px; margin:0;}
.jspVerticalBar .jspTrack{/*background:url(../../2014_images/scroll-track-bg.jpg) repeat-y;*/ position: relative; background-color:#d7d7d7;}
.jspVerticalBar .jspDrag{background:#626262; position: relative; top: 0; left:0; cursor: pointer; width:11px;}
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag{float: left;	height: 100%;}
.jspArrow{text-indent: -20000px; display: block; cursor: pointer;	padding: 0;	margin: 0;}
.jspArrow.jspDisabled{cursor: default;}
/*.jspVerticalBar .jspArrow{height: 10px; width:7px; display:none;}
.jspVerticalBar .jspArrowUp{background:#000;}
.jspVerticalBar .jspArrowDown{background:#000; position:absolute; bottom:0; left:0;}

.jspHorizontalBar .jspArrow{width:11px; float: left; height: 100%;}
.jspVerticalBar .jspArrow:focus{outline: none;}*/
.jspCorner{background: #eeeef4;	float: left; height: 100%;}
/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner{margin: 0 -3px 0 0;}

/* Section 3 css*/
/*#section_3 {padding:0; background-image:url("../images/Image_03.jpg"); width:100%; background-position:right 0; background-repeat:no-repeat; position:relative; background-size:cover;}*/
/*#section_3 .container {top:50%; -webkit-transform: translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); max-width:916px; position:relative; padding:0; display:inline-block;}*/
.blocksSection {width:100%; display:inline-block; margin-top:30px;}
.blockContainer {width:439px; float:left; position:relative;}
.firstBC {margin-right:19px;}
.block {background:#fff; width:100%; height:269px; margin:0 0 20px 0; position:relative;}
.blockContent {background:#fff; position:absolute;left:0; width:100%; padding:6px 25px; }
.blockContent.topPos {top:0px;} 
.blockContent.bottomPos {top:0px;}
.blockContent.active {z-index:99;}
.blockContent h2 {color:#ae275f; font-size:1.6em; margin:0 0 8px 0;}
.blockContent p {text-align:justify;}

.tabs {display:none;}
.tabs li {float:left; width:24%; opacity:0.5; margin-left:4px;}
.tabs li:first-child {margin-left:0;}
.tabs li.active {opacity:1;}
.tabs li p {padding:0 0 10px 0;}

.icon {background:url(../images/ico1.png) 0 0 no-repeat; display:inline-block; width:115px; height:114px; margin:0 0 8px 0}
.icon {width:126px\9; height:125px\9; }
.icon-1 {background:url(../images/ico1.png) 0 0 no-repeat; background-size:100% auto;}
.icon-2 {background:url(../images/ico4.png) 0 0 no-repeat; background-size:100% auto;}
.icon-3 {background:url(../images/ico2.png) 0 0 no-repeat; background-size:100% auto;}
.icon-4 {background:url(../images/ico3.png) 0 0 no-repeat; background-size:100% auto;}

.plus-icon {background:url("../images/sprite.png") no-repeat; background-position:-26px -421px; cursor:pointer; width:25px; height:25px; display:block; position:absolute; right:0px; bottom:0px;}
.minus-icon {background:url("../images/sprite.png") no-repeat; background-position:-57px -421px; cursor:pointer; width:25px; height:25px; display:block; position:absolute; right:0px; bottom:-1px; display:none}
.plus-icon.active {background-position:-57px -421px;}
.moreContent {display:none; height:394px;  height:385px\9;}
.moreContent ul {padding-bottom:20px;}
.lessContent, .moreContent {text-align:left;}

/* Section 4 css */
/*#section_4 {padding:0; background-image:url("../images/Image_04.jpg"); width:100%; background-position:0 0; background-repeat:no-repeat; position:relative; background-size:cover;}*/
#section_4 .container {max-width:804px;}
.section4Content {padding-top:30px;}
#section_4 .content {width:506px; text-align:left; padding-top:50px; float:left;}
#section_4 .content * {color:#2c2c2c;}
#section_4 h2 {padding-bottom:10px; left:-13px; position:relative;}

.download {display:block; padding:15px 0; float:left;}
.download p {font-family: 'Lato-Bold'; padding-bottom:10px;}
.download ul, .download ul li {float:left;}
.download ul li:first-child {padding-right:70px;}

.blockContent ul li {list-style:none; padding:0 0 6px 12px;  background:url(../images/disc-bullet.png) no-repeat 0 4px;}
.mobLogo {display:none; width:100%; text-align:center; padding:20px 0;}
.bullets li {list-style:disc outside; text-align:justify; padding:0 0 6px 0; }

.QR_device {float:left; margin-right:30px; position:relative; width:216px;}
.qrPingpay {position:absolute; left:50%; bottom:101px; width:107px; height:106px; margin-left:-46px; display:block;}

/* Footer css */
.footerMaster {width:100%; background:#ffffff; padding:10px 80px; float:left}
.footer {float:left; width:100%; text-align:center; position:relative;}
.footer .links {position:absolute; left:201px; top:5px;}
.footer .links li {float:left; padding:0 5px; border-left:1px solid #333;}
.footer .links li:first-child {padding-left:5px;}
.footer .special {position:absolute; right:0; top:0px; line-height:13px; font-size:13px;}
.footer .special a {float:right; padding-left:5px;}

.social {display:inline-block;}
.social li {float: left; padding: 0 0 0 7px;}
.social li:first-child {padding: 0;}
.footer p.copyright{float:left; padding:5px 0 0 0;}

/* Common Buttons */
.desktop .deviceData {display:none;}
.device .desktopData {display:none;}

.pagings {position:fixed; right:20px; top:40%; z-index:5;}
.pagings ul li {width:11px; height:11px; background:url("../images/sprite.png") no-repeat; display:block; margin:10px 0;  background-position:-358px -398px; cursor:pointer;}
.pagings ul li.current {cursor:default; background-position:-373px -398px;}
.pagings ul li a {display:block; width:11px; height:11px;}

.androidOs{float:left; position:fixed; top:81%; left:3%; width:103px;}
.androidOs a.androidPhone{width:103px; float:left; padding:0 0 8px 0;}
.androidOs a.iPhone{width:103px; float:left;}
.androidOs span.smsBtn{float:left; padding:0 0 8px 0;}


/*Faq Section*/
.header-placeHolder_Faq{background:rgb(226, 226, 226) none repeat scroll 0 0; width:100%; height:70px;}
.faqSection{float:left; width:100%; background:rgb(226, 226, 226) none repeat scroll 0 0;}
.accordion{width:940px; margin:0 auto; padding:20px 0;}
.accordion h2{ font-size:17px; color:#ae275f; padding:0px 0 10px 0px;}
.accordion h3 {background:#ececec url(../images/bg-togglecontent.png) repeat-y right 0;  border:1px solid #bababa;  width:97%; cursor:pointer; margin:0 0 5px 0; font-family:'Lato-Regular';}
.accordion h3 span {display:block; background:url(../images/plus.png) no-repeat 99% center; font-size:16px; color:#414040; padding:7px 33px 7px 9px; text-transform:none;}
.accordion h3 span.active {background:url(../images/minus.png) no-repeat 99% center;}
.innerToggle, .toggleContent {display:none; padding:15px 0;}
.toggleContent p {font-size:14px; color:#606060; padding:0px 30px; margin:0;}
.innerToggle a {color:#ba2661;}
.accordion h4 {background:url(../images/plus_sign.gif) no-repeat 0 1px; font-size:15px; padding:0 0 8px 15px; color:#ba2661; cursor:pointer; font-family:'Lato-Regular'; text-transform:none;}
.accordion h4.active {background:url(../images/minus_sign.gif) no-repeat 0 1px;}
.innerToggle {padding:0 0 15px 0;}
.innerToggle p {font-size:15px; color:#606060; padding:0 15px 6px 15px;}
.innerToggle ul {margin-left:34px;}
.innerToggle ul li {list-style:disc outside; padding:0 15px 5px 0; color:#606060; font-size:16px;}
.innerToggle p strong{font-family:'Lato-Bold';}
.alphaList{list-style-type:lower-alpha!important}
.alphaUl{padding-left:36px;}
.fdRdAccord ul > li{margin-bottom:15px;}
.fdRdAccord ol > li{margin-bottom:8px;}
.fdRdAccord ol{margin-top:10px;}
.plusSign {font-family: 'Lato-Bold';}
footer {
    display: block;
    clear: both;
    overflow: hidden;
    width: 100%;
    background-color: #444;
    color: #fff;
    padding: 10px 0;
}
ul.ftrLinks {
    display: inline-block;
    float: right;
}
ul.ftrLinks li, .copyRight {
    display: inline-block;
    color: #e4e4e4;
    font-size: 15px;
}
ul.ftrLinks li a {
    color: #e4e4e4;
    padding: 0 1rem;
    border-right: 1px solid #767676;
    display: inline-block;
    text-decoration: none;
}
ul.ftrLinks li:last-child a {
    border: none;
}

@media (max-width:991px){
    ul.ftrLinks li a{padding: 0;}
.ipl .LogoPart {
    height:50px;
    padding:5px 10px;
    max-width:152px;
}
.ipl .LogoPart img{
    width:95%;
    right:0;
}
.ipl .LogoPart span{
    transform:rotate(18deg);
    margin-left:30px;
}
.ipl .LogoPart:after{
    top:-11px;
    margin-right:-24px;
    transform:rotate(32deg);
}
.headerNew.ipl{
    border-top:15px solid #97144d;
}
}