.main *,
 .main ::after,
 .main ::before {
     margin: 0;
     padding: 0;
     -webkit-box-sizing: border-box;
     box-sizing: border-box
 }
 .heading-menu
  {
     display: none
 }
#scroll {padding: 0}
 img {
     width: 100%;
     height: auto
 }
 .main {
     font-family: 'ZohoPuvi';
     font-weight: 300;
     color: #102336
 }
 .main h1,
 .main h2,
 .main h3,
 .main p {
     color: inherit;
     line-height: 1.4
 }
 .main .my-container {
     max-width: 1250px;
     margin: 0 auto;
     padding: 0 25px;
     position: relative;
     z-index: 1
 }
 .main .lr-container {
     display: table;
     width: 100%
 }
 .main .lhs {
     display: table-cell;
     vertical-align: middle;
     width: 50%;
     -webkit-transition: all .3s ease-in-out;
     -o-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out;
     opacity: 1
 }
 .main .rhs {
     display: table-cell;
     vertical-align: middle;
     width: 50%;
     -webkit-transition: all .3s ease-in-out;
     -o-transition: all .3s ease-in-out;
     transition: all .3s ease-in-out;
     opacity: 1
 }
 .main a {
     text-decoration: none
 }
 .main h2 {
     font-size: 30px;
     font-weight: 500;
     line-height: 1.3;
     margin-bottom: 25px
 }
 .main p {
     font-size: 16px;
     line-height: 1.8
 }
 .main strong {
     font-weight: 500
 }
 .sprite span,
 .banner .sprite .ban1::before,
 .banner .sprite .ban1::after,
 .banner .sprite .ban3::after,
 .banner .sprite .ban4::after,
 .banner .sprite .ban4::before,
 .sec2 .lhs h2::after,
 .sec2 .sprite .man::before {
     background: url(/sites/meweb/images/se/log-management/images/ediscovery-hfp-sprite.png) no-repeat;
     background-size: 546px;
     position: absolute
 }
 .sec2 .ic1::before,
 .sec2 .ic2::before,
 .sec2 .ic3::before,
 .sec2 .ic4::before,
 .sec2 .ic5::before {
     background: url(/sites/meweb/images/se/log-management/images/ediscovery-hfp-mob-sprite.png) no-repeat;
     background-size: 264px;
     content: '';
     position: absolute;
     top: 6px;
     left: -60px
 }
 .banner {
     background: -o-linear-gradient(top, #d6fff7 10%, #fff);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #d6fff7), to(#fff));
     background: linear-gradient(to bottom, #d6fff7 10%, #fff);
     padding: 80px 0 150px
 }
 .banner h1 {
     font-size: 37px;
     font-weight: 600;
     line-height: 1.4;
     color: #000;
     margin-bottom: 20px
 }
 .banner p {
     font-size: 18px;
     line-height: 1.6;
     margin-bottom: 40px
 }
 .banner .lhs {
     width: calc(100% - 430px);
     padding-right: 180px
 }
 .banner .rhs {
     float: right;
     width: 400px;
     height: 346px;
     position: relative;
     top: -20px
 }
 .banner .sprite .ban1::before {
     content: '';
     background-position: -429px -16px;
     width: 74px;
     height: 57px;
     top: 100px;
     left: -38px;
     -webkit-animation: fade 1s 3s both, ban-icon1 10s linear 3s infinite both;
     animation: fade 1s 3s both, ban-icon1 10s linear 3s infinite both
 }
 .banner .sprite .ban1 {
     background-position: -7px -9px;
     width: 393px;
     height: 410px
 }
 .banner .sprite .ban1::after {
     content: '';
     background-position: -444px -198px;
     width: 58px;
     height: 71px;
     top: 100px;
     right: -6px;
     -webkit-animation: fade 1s 3s both, ban-icon2 10s linear 3s infinite both;
     animation: fade 1s 3s both, ban-icon2 10s linear 3s infinite both
 }
 @-webkit-keyframes ban-icon1 {
     0%,
     50%,
     100% {
         -webkit-transform: translate(184px, 86px);
         transform: translate(184px, 86px)
     }
     25% {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0)
     }
     75% {
         -webkit-transform: translate(374px, 0px);
         transform: translate(374px, 0px)
     }
 }
 @keyframes ban-icon1 {
     0%,
     50%,
     100% {
         -webkit-transform: translate(184px, 86px);
         transform: translate(184px, 86px)
     }
     25% {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0)
     }
     75% {
         -webkit-transform: translate(374px, 0px);
         transform: translate(374px, 0px)
     }
 }
 @-webkit-keyframes ban-icon2 {
     0%,
     50%,
     100% {
         -webkit-transform: translate(-184px, 86px);
         transform: translate(-184px, 86px)
     }
     25% {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0)
     }
     75% {
         -webkit-transform: translate(-374px, 0px);
         transform: translate(-374px, 0px)
     }
 }
 @keyframes ban-icon2 {
     0%,
     50%,
     100% {
         -webkit-transform: translate(-184px, 86px);
         transform: translate(-184px, 86px)
     }
     25% {
         -webkit-transform: translate(0, 0);
         transform: translate(0, 0)
     }
     75% {
         -webkit-transform: translate(-374px, 0px);
         transform: translate(-374px, 0px)
     }
 }
 .banner .sprite .ban2 {
     background-position: -440px -104px;
     width: 63px;
     height: 63px;
     top: 3px;
     left: 154px;
     -webkit-animation: ban-icon 1s linear 3.5s both, rotate 8s linear 4s infinite both;
     animation: ban-icon 1s linear 3.5s both, rotate 8s linear 4s infinite both
 }
 @-webkit-keyframes ban-icon {
     from {
         top: 134px;
         opacity: 0
     }
     to {
         top: 3px;
         opacity: 1
     }
 }
 @keyframes ban-icon {
     from {
         top: 134px;
         opacity: 0
     }
     to {
         top: 3px;
         opacity: 1
     }
 }
 @-webkit-keyframes rotate {
     from,
     to {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg)
     }
     50% {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }
 @keyframes rotate {
     from,
     to {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg)
     }
     50% {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }
 .banner .sprite .ban3 {
     background-position: 0 -458px;
     width: 325px;
     height: 213px;
     bottom: -56px;
     right: 54px;
     -webkit-animation: laptop 1s 1s linear both;
     animation: laptop 1s 1s linear both
 }
 @-webkit-keyframes laptop {
     from {
         -webkit-transform: translateY(-466px);
         transform: translateY(-466px);
         opacity: 1
     }
     to {
         -webkit-transform: translateY(0);
         transform: translateY(0);
         opacity: 1
     }
 }
 @keyframes laptop {
     from {
         -webkit-transform: translateY(-466px);
         transform: translateY(-466px);
         opacity: 1
     }
     to {
         -webkit-transform: translateY(0);
         transform: translateY(0);
         opacity: 1
     }
 }
 .banner .sprite .ban3::after {
     content: '';
     background-position: -278px -696px;
     width: 244px;
     height: 154px;
     bottom: 42px;
     left: 46px
 }
 .banner .sprite .ban4::before {
     content: '';
     background-position: -435px -301px;
     width: 75px;
     height: 75px;
     left: 44px;
     top: 42px
 }
 .banner .sprite .ban4 {
     background-position: -1px -700px;
     width: 260px;
     height: 163px;
     bottom: 40px;
     left: 56px;
     opacity: 0;
     -webkit-animation: fadeUp 1s 1.6s ease-in both;
     animation: fadeUp 1s 1.6s ease-in both
 }
 .banner .sprite .ban4::after {
     content: '';
     background-position: -442px -408px;
     width: 68px;
     height: 69px;
     right: 44px;
     top: 42px;
     -webkit-animation: icon-blink 4s linear 4s infinite;
     animation: icon-blink 4s linear 4s infinite
 }
 .banner .sprite .ban5 {
     background-position: -352px -506px;
     width: 184px;
     height: 166px;
     bottom: 18px;
     right: 34px;
     -webkit-animation: fade 1s 3.6s both, scan 3s linear 4s infinite;
     animation: fade 1s 3.6s both, scan 3s linear 4s infinite
 }
 @-webkit-keyframes fade {
     from {
         opacity: 0
     }
     to {
         opacity: 1
     }
 }
 @keyframes fade {
     from {
         opacity: 0
     }
     to {
         opacity: 1
     }
 }
 @-webkit-keyframes scan {
     20% {
         -webkit-transform: translate(-8px, 0px);
         transform: translate(-8px, 0px)
     }
     40% {
         -webkit-transform: translate(-8px, 8px);
         transform: translate(-8px, 8px)
     }
     60% {
         -webkit-transform: translate(10px, 10px);
         transform: translate(10px, 10px)
     }
     80% {
         -webkit-transform: translate(10px, 0px);
         transform: translate(10px, 0px)
     }
     0%,
     100% {
         -webkit-transform: translate(0px, 0px);
         transform: translate(0px, 0px)
     }
 }
 @keyframes scan {
     20% {
         -webkit-transform: translate(-8px, 0px);
         transform: translate(-8px, 0px)
     }
     40% {
         -webkit-transform: translate(-8px, 8px);
         transform: translate(-8px, 8px)
     }
     60% {
         -webkit-transform: translate(10px, 10px);
         transform: translate(10px, 10px)
     }
     80% {
         -webkit-transform: translate(10px, 0px);
         transform: translate(10px, 0px)
     }
     0%,
     100% {
         -webkit-transform: translate(0px, 0px);
         transform: translate(0px, 0px)
     }
 }
 @-webkit-keyframes icon-blink {
     0% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
     25% {
         -webkit-transform: scale(.9);
         transform: scale(.9)
     }
     50% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
     75% {
         -webkit-transform: scale(.9);
         transform: scale(.9)
     }
     100% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
 }
 @keyframes icon-blink {
     0% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
     25% {
         -webkit-transform: scale(.9);
         transform: scale(.9)
     }
     50% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
     75% {
         -webkit-transform: scale(.9);
         transform: scale(.9)
     }
     100% {
         -webkit-transform: scale(1);
         transform: scale(1)
     }
 }
 .int .my-container {
     max-width: 1400px
 }
 .intro {
     border-radius: 10px;
     padding: 60px 224px 300px;
     margin: 0 80px;
     margin-bottom: 120px;
     opacity: 1;
     position: relative;
     background: -o-linear-gradient(top, #fdf7e2 80%, rgba(0, 0, 0, 0));
     background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, #fdf7e2), to(rgba(0, 0, 0, 0)));
     background: linear-gradient(to bottom, #fdf7e2 80%, rgba(0, 0, 0, 0));
     text-align: center
 }
 .intro-icon1 {
     content: '';
     position: absolute;
     background: url(/sites/meweb/images/se/log-management/images/ediscovery-hfp-mob-sprite.png) no-repeat -6px -81px;
     background-size: 264px 336px;
     width: 237px;
     height: 243px;
     top: -58px;
     left: -58px;
     z-index: -1
 }
 .intro-icon2 {
     content: '';
     position: absolute;
     background: url(/sites/meweb/images/se/log-management/images/ediscovery-hfp-mob-sprite.png) no-repeat -6px -81px;
     background-size: 264px 336px;
     width: 237px;
     height: 243px;
     top: -58px;
     right: -58px;
     z-index: -1
 }
 .intro:before {
     content: "";
     background-image: url(/sites/meweb/images/se/log-management/images/ediscovery-hfp-into-bg.png);
     position: absolute;
     width: 100%;
     height: 340px;
     background-size: cover;
     left: 0;
     bottom: -160px;
     z-index: 1
 }
 .animated.intro {
     -webkit-animation: fadeUp 1s ease-in both;
     animation: fadeUp 1s ease-in both
 }
 .intro h2 span {
     color: #e00b0b
 }
 .intro p {
     line-height: 1.8
 }
 .intro p:first-child {
     padding-bottom: 30px
 }
 .intro p:nth-child(4) {
     padding-bottom: 40px
 }
 .center-img {
     width: 70%;
     margin: auto;
     margin-top: -350px;
     margin-bottom: 80px;
     opacity: 1;
     position: relative;
     z-index: 1
 }
 .animated.center-img {
     -webkit-animation: fadeUp 1s ease-in both;
     animation: fadeUp 1s ease-in both
 }
 .sec1 .odd,
 .sec1 .even {
     margin-bottom: 80px
 }
 .sec1 .even .lhs {
     position: relative;
     width: 60%;
     left: -70px
 }
 .sec1 .even .rhs {
     width: 70%;
     padding-left: 30px
 }
 .sec1 .odd .lhs {
     width: 40%;
     padding-right: 30px
 }
 .sec1 .odd .rhs {
     position: relative;
     right: -60px
 }
 .animated .lhs {
     -webkit-animation: fadeInLeft 1.2s ease-in-out both;
     animation: fadeInLeft 1.2s ease-in-out both
 }
 .animated .rhs {
     -webkit-animation: fadeInRight 1.2s ease-in-out both;
     animation: fadeInRight 1.2s ease-in-out both
 }
 .sec2 {
     margin-bottom: 100px
 }
 .sec2 .my-container {
     max-width: 1400px
 }
 .sec2 .lr-container {
     background-color: #d7fff7;
     padding: 54px 80px;
     overflow: hidden
 }
 .sec2 .lhs {
     width: 500px;
     vertical-align: top
 }
 .sec2 .lhs h2 {
     font-size: 34px;
     font-weight: 300;
     padding-left: 40px;
     display: inline-block;
     position: relative
 }
 .sec2 .lhs h2::after {
     content: '';
     background-position: -380px -936px;
     width: 86px;
     height: 66px;
     bottom: -70px;
     right: -12px
 }
 .sec2 .lhs h2 strong {
     display: block;
     font-weight: 500
 }
 .sec2 .sprite .man {
     background-position: -18px -890px;
     width: 269px;
     height: 514px;
     bottom: 0;
     left: 62px
 }
 .sec2 .sprite .man::before {
     content: '';
     background-position: -350px -1106px;
     width: 122px;
     height: 41px;
     top: 20px;
     left: -70px
 }
 .animated .lhs .sprite .man::before {
     -webkit-animation: plane 6s 1s both;
     animation: plane 6s 1s both
 }
 @-webkit-keyframes plane {
     from {
         left: -240px;
         top: -50px;
         opacity: 0
     }
     to {
         opacity: 1
     }
 }
 @keyframes plane {
     from {
         left: -240px;
         top: -50px;
         opacity: 0
     }
     to {
         opacity: 1
     }
 }
 .sec2 .sprite .building {
     background-position: -14px -1434px;
     width: 514px;
     height: 336px;
     bottom: 40px;
     left: -120px
 }
 .sec2 .rhs {
     width: calc(100% - 500px)
 }
 .sec2 ul {
     padding-left: 60px
 }
 .sec2 ul li:not(:last-child) {
     margin-bottom: 30px
 }
 .sec2 ul li h3 {
     font-size: 18px;
     font-weight: 500;
     padding-bottom: 18px;
     position: relative
 }
 .sec2 ul li p {
     font-size: 18px
 }
 .sec2 .ic1::before {
     background-position: -7px -13px;
     width: 42px;
     height: 46px
 }
 .sec2 .ic2::before {
     background-position: -62px -15px;
     width: 41px;
     height: 41px
 }
 .sec2 .ic3::before {
     background-position: -115px -17px;
     width: 42px;
     height: 37px
 }
 .sec2 .ic4::before {
     background-position: -170px -15px;
     width: 38px;
     height: 42px
 }
 .sec2 .ic5::before {
     background-position: -221px -10px;
     width: 39px;
     height: 52px
 }
 @-webkit-keyframes fadeInLeft {
     from {
         -webkit-transform: translateX(-100%);
         transform: translateX(-100%)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @keyframes fadeInLeft {
     from {
         -webkit-transform: translateX(-100%);
         transform: translateX(-100%)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @-webkit-keyframes fadeInRight {
     from {
         -webkit-transform: translateX(100%);
         transform: translateX(100%)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @keyframes fadeInRight {
     from {
         -webkit-transform: translateX(100%);
         transform: translateX(100%)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @-webkit-keyframes fadeUp {
     from {
         -webkit-transform: translateY(100px);
         transform: translateY(100px)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @keyframes fadeUp {
     from {
         -webkit-transform: translateY(100px);
         transform: translateY(100px)
     }
     to {
         -webkit-transform: translateX(0px);
         transform: translateX(0px);
         opacity: 1
     }
 }
 @media (max-width: 1350px) {
     .sec1 .even .lhs {
         left: 0
     }
     .sec1 .odd .rhs {
         right: 0
     }
 }
 @media (max-width: 1200px) {
     .banner .lhs {
         padding-right: 60px
     }
     .intro {
         padding: 60px 100px 300px
     }
 }
 @media (max-width: 1130px) {
     .sec2 .lr-container {
         padding: 54px 25px
     }
     .sec2 .lhs {
         width: 400px
     }
     .sec2 .rhs {
         width: calc(100% - 400px)
     }
     .sec2 .lhs h2 {
         font-size: 30px;
         padding-left: 24px
     }
     .sec2 .lhs .sprite {
         -webkit-transform: scale(0.8);
         -ms-transform: scale(0.8);
         transform: scale(0.8);
         position: relative;
         top: 557px
     }
 }
 @media (max-width: 992px) {
     .animated .rhs,
     .animated .lhs,
     .animated.center-img {
         animation: none;
     }
     .main .lhs,
     .main .rhs,
     .center-img {
         opacity: 1;
     }
     .main h2 {
         font-size: 26px
     }
     .sprite,
     .banner .rhs,
     .intro-icon1,
     .intro-icon2,
     .sec2 .lhs h2::after {
         display: none
     }
     .banner {
         padding-bottom: 60px
     }
     .banner .lhs {
         display: block;
         float: none;
         width: 74%;
         margin: 0 auto;
         text-align: center;
         padding-right: 0
     }
     .int .my-container {
         max-width: 1200px
     }
     .intro {
         padding: 40px 80px 280px;
         margin: 0 20px;
         margin-bottom: 120px
     }
     .sec1 {
         margin-bottom: 80px
     }
     .sec1 .lr-container {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
         -ms-flex-wrap: wrap;
         flex-wrap: wrap;
         width: 80%;
         margin: 0 auto;
         background-color: #fffdf4;
         border: 1px solid #fbf2cd;
         border-radius: 8px;
         padding: 30px;
         margin-bottom: 40px;
         row-gap: 40px;
         overflow: hidden
     }
     .sec1 .lr-container.even {
         background-color: #f9fdff;
         border: 1px solid #d2f2fd
     }
     .sec1 .lr-container.row3 {
         background-color: #fef4f4;
         border: 1px solid #ffc6c8
     }
     .sec1 .lr-container.even .lhs {
         -webkit-box-ordinal-group: 2;
         -ms-flex-order: 1;
         order: 1
     }
     .sec1 .even .lhs,
     .sec1 .even .rhs,
     .sec1 .odd .lhs,
     .sec1 .odd .rhs {
         width: 100%;
         padding-left: 0;
         padding-right: 0
     }
     .sec2 .lr-container {
         display: block
     }
     .sec2 .lhs,
     .sec2 .lhs {
         display: block;
         width: 100%
     }
     .sec2 .lhs h2 {
         display: block;
         font-size: 30px;
         text-align: center;
         padding-left: 0;
         margin-bottom: 40px
     }
     .sec2 ul li h3 {
         padding-bottom: 10px
     }
 }
 @media (max-width: 767px) {
     .banner .lhs {
         width: 100%
     }
 }
 @media (max-width: 600px) {
     #titlediv {
         display: none
     }
     .zsiq_theme1 .zsiq_flt_rel {
         border-radius: 50px 0 0 50px !important;
     }
     .main h2 {
         font-size: 18px;
         margin-bottom: 10px
     }
     .main p {
         font-size: 14px
     }
     .banner h1 {
         font-size: 30px
     }
     .banner p {
         font-size: 14px;
         margin-bottom: 30px
     }
     .intro {
         margin: 0;
         margin-bottom: 125px;
         padding-left: 20px;
         padding-right: 20px;
         padding-bottom: 260px
     }
     .intro p:nth-child(4) {
         padding-bottom: 20px
     }
     .center-img {
         width: 100%;
         margin-bottom: 60px
     }
     .sec1,
     .sec2 {
         margin-bottom: 60px
     }
     .sec1 .lr-container {
         width: 100%;
         padding: 25px 18px;
         margin-bottom: 30px
     }
     .sec2 .my-container {
         max-width: 100%;
         padding: 0
     }
     .sec2 .lr-container {
         padding: 40px 25px
     }
     .sec2 .lhs h2 {
         font-size: 24px
     }
     .sec2 ul li p {
         font-size: 14px
     }
 }
 @media screen and (max-width : 1100px) {
     .banner .animated .rhs {
         transform: scale(.7);
         animation: none;
         opacity: 1;
     }
 }