﻿body { padding-top: 0; }
.fireTitle { color: #001623; font-size: 42px; font-weight: bold; }
header nav ul li .requestDemoBtn, .mbMenu .requestDemoBtn { display:none }

.heroSection { padding-top: 5rem; padding-bottom: 4rem; background: rgb(2 21 36) url(/Images/b2beventapp/banner-bg.png); background-position: left; background-repeat: no-repeat; background-size: cover; }
.heroSection h1 { color: #fff; font-size: 42px; font-weight: bold; margin: 20px 0; }
.heroSection p { font-size: 20px; color: #fff; line-height: 27px; margin-bottom: 25px; }
.heroBtn { display: inline-block; margin: 5px; padding: 0 1.2rem; font-size: 14px; line-height: 3; border-radius: 3px; }
  .heroBtn.style1 { background: #ff008a; color: #fff; }  
.requestDemoCTA { padding: 3rem; border-radius: 8px; border: 1px solid rgba(255,255,255,.20); background: #f7f8fa; position: relative }
.requestDemoCTA h2 { color: #001623; font-size: 42px; font-weight: bold; }
.requestDemoCTA p { color: #001623; font-size: 22px; }
.heroSection h6 { margin: 0; color: #ff0080; padding: 0; font-size: 26px; }
.heroSection h2 { color: #e9b32e; font-size: 40px; font-weight: bold; margin: 0; }
.requestDemoCTATop { background: #313131; position: absolute; top: -55px; width: 93%; display: flex; border-radius: 15px; color: #fff; justify-content: space-between; padding: 15px 30px; }
.mobCenter p b { font-size: 20px; padding-top: 20px; display: block; }
.mobCenter p { padding: 0; margin: 5px 0; line-height: 26px; }

.gradientBG { background:linear-gradient(180deg, rgba(255,0,138,1) 0%, rgba(26,45,57,1) 100%); color:#fff }

/*RRRRR*/

/*PAGE SPACING*/
.spaceY { padding:4rem 0 }
.spaceT { padding-top:4rem }
.spaceB { padding-bottom:4rem }

.appFeatureBox { position:relative }
.appFeatureBox .appScreenshot { width:300px; position:relative; z-index:2 }
.appFeatureBox .screenShotContent { position:absolute; top:40px; left:380px; width:460px }
.appFeatureBox .sbox2 { text-align:right }
.appFeatureBox .sbox2 .screenShotContent { bottom:60px; top:inherit; right:380px; left:inherit }
.appFeatureBox .screenShotContent img { width:56px; height:56px }
.afgrBox1 { position:relative; padding-bottom:6rem; z-index:1 }
.afgrBox1:before { content:''; position:absolute; bottom:0; width:60%; height:56%; background:linear-gradient(0deg, rgba(255,0,138,1) 0%, rgba(26,45,57,1) 100%); left:-30px; z-index:-1; border-radius:0 50% 0 0 }
.afgrBox2 { position:relative; padding-top:3rem; z-index:1 }
.afgrBox2:before { content:''; position:absolute; top:0; width:60%; height:56%; background:linear-gradient(0deg, rgba(255,0,138,1) 0%, rgba(26,45,57,1) 100%); right:-30px; z-index:-1; border-radius:0 0 0 50% }
.afgBox1 { position:relative; padding-top:6rem; z-index:1 }
.afgBox1:before { content:''; position:absolute; top:0; width:60%; height:56%; background:#f8f8f8; right:-30px; z-index:-1; border-radius:0 0 0 50% }
.afgBox2 { position:relative; padding-bottom:3rem; padding-top:4rem; z-index:1 }
.afgBox2:before { content:''; position:absolute; bottom:0; width:60%; height:56%; background:#f8f8f8; left:-30px; z-index:-1; border-radius:0 50% 0 0 }
.hPoint { position:relative }
.hPoint span { width:20px; height:20px; display:block; background:#00dbff; border-radius:20px; border:4px solid #ffffff; position:absolute; left:-30px; top:2px; outline:2px solid #d9d9d9; z-index:1 }
.hPoint span:before { content:''; position:absolute; right:16px; top:4px; width:60px; height:2px; background:#d9d9d9 }
.sbox2 .hPoint span { left:inherit; right:-30px }
.sbox2 .hPoint span:before { right:inherit; left:16px }
.hPoint span.co2 { background:#ffc42c }
.hPoint span.co3 { background: #ac3afc }
.hPoint span.co4 { background: #00b0ac }
.hPoint span.co5 { background: #ff2b9f }
.hPoint span.co6 { background: #0393ef }
.cta { padding: 0 3rem 0 4rem; border-radius: 10px; color: #001623; background: #FFF1E2 0% 0% no-repeat padding-box; }
  .cta ul { list-style: none; display: inline-flex; margin-bottom: 20px; }
    .cta ul li svg { float: left; margin: -3px 10px 0 0; }
    .cta ul li { padding-right: 30px; color: #1A2D39; font-size: 18px; }
  .cta p { font-size: 20px; }
.Head2 { font-size: 2.5rem; font-weight: 500; margin: 0; }
/* TESTIMONIALS */
/*.testimonials { padding-top:350px }*/
.testimonials md-card { border-radius: 8px; box-shadow: none }
  .testimonials md-card .md-title { font-weight: bold }
  .testimonials md-card .md-subhead { color: #1a2d39; font-size: .875rem }
.testimonials md-card-avatar img { border-radius: 50%; width: 60px; min-width: 60px; height: 60px }
/*.testimonials .ratingImg { opacity:0; visibility:hidden; transition:all .2s }*/
.testimonials .ratingImg { height: 20px !important; width: auto }
.testimonials md-card md-card-actions md-card-avatar + md-card-header-text { max-height: 50px }
.testimonials md-card-content p { line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; transition: all .3s }
.testimonials md-card-content:hover p { -webkit-line-clamp: unset; }


.scheduleDemoSec { overflow: hidden }
.scheduleDemo { transform: skewY(-3deg); margin: 70px 0; background: transparent linear-gradient(90deg, #FF008A 0%, #FFBB29 37%, #FF8E17 69%, #0393EF 100%) 0% 0% no-repeat padding-box; opacity: 1; height: 50px; line-height: 50px; width: 100%; overflow: hidden; pointer-events: none }
.animate-marquee { white-space: nowrap }
  .animate-marquee span { color: #fff; padding: 10px; font-size: 19px; font-weight: bold }
    .animate-marquee span img { margin: 0px 20px; }
.animate-marquee { position: absolute; animation: marquee2 60s linear infinite; animation-direction: reverse }

.bannerForm { background: #FFFFFF 0% 0% no-repeat padding-box; border-radius: 15px; padding: 30px; width:85%; float: right }
.bannerForm h3 { color: #001623; font-size: 24px; font-weight: bold; margin: 0; }
.demoButton { width: 100%; padding: 5px; font-size: 21px; }
.privacyLink { text-decoration:underline; color:rgba(3, 147, 239, 1); display: block; padding: 6px; }
.privacyLink:hover { color: #ff008a; }
.stickyTop { position:sticky; top:100px }

@keyframes marquee2 {
  0% { transform: translateZ(0) }
  100% { transform: translate3d(-50%,0,0) }
}

/*RESPONSIVE*/
@media screen and (max-width:1024px) {
  .setRecaptcha { transform:scale(0.77); -webkit-transform:scale(0.77); transform-origin:0 0;-webkit-transform-origin:0 0 }
  .appFeatureBox .screenShotContent { width:200px }
  .afgrBox2:before, .afgBox1:before { right:0 }
  .appFeatureBox { overflow:hidden }
  .appFeatureBox .appScreenshot { object-fit:contain }
}
@media screen and (max-width:991px){
  .afgrBox1:before { width:0 }
  .appFeatureBox .screenShotContent { width:100%; position:initial; margin-top:2rem; padding-left:3rem }
  .afgrBox1, .afgBox1, .appFeatureBox .col-lg-6 { display:flex; padding-bottom:2rem }
  .appFeatureBox .sbox2 { display:block }
  .appFeatureBox .sbox2 .screenShotContent { padding-right:3rem }
  .afgrBox2:before { width:0 }
  .bannerForm { width:100% }
  .afgrBox1 { display:block }
}
@media screen and (max-width:579px) {
  .fs1 { font-size: 2.5rem }
  .fs2 { font-size: 2rem }
  .requestDemoCTA .right { text-align: left; margin-top: 1rem }
  .pushNotification {  width: 100%; padding-left: 40px; margin-bottom: 20px; }
  .pushNotification:last-child { margin-top: 40px; text-align: left; float: left; padding-right: 0; }
  .cta ul { display: block; }
  .cta { padding: 10px; }
  /*RRRR*/ .heroSection h1 { font-size:32px }
  .heroSection h2 { font-size:22px }
  .appFeatureBox .screenShotContent { position:relative; top:0; left:0; width:100%; padding-left:1rem }
  .appFeatureBox { text-align:center }
  .appFeatureBox .sbox2 { padding-bottom:2rem; text-align:center }
  .appFeatureBox .sbox2 .screenShotContent { bottom:0; right:0 }
  .afgrBox1:before, .afgrBox2:before, .afgBox1:before, .afgBox2:before { content:none }
  .hPoint span { display:none }
  .appFeatureBox .appScreenshot { width:80%; padding:1rem }
  .afgrBox1 { padding-bottom:1rem }
  .afgrBox2 { padding-top:1rem }
  .requestDemoCTA { text-align:center }
  .requestDemoCTATop { flex-direction:column; top:-134px; width:94%; left:16px }
  .afgrBox1, .afgBox1, .appFeatureBox .col-lg-6 { display:block; text-align:center }
}
