iframe {
    max-width: 95%
}

#allFooter ul {
    list-style: none !important;
}

section:nth-of-type(2) {
    display: none;
}

.heading-menu,
.breadcrumb {
    display: none
}

body {
    margin: 0;
    padding: 0
}

.af {
    font-family: 'ZohoPuvi';
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    margin: 0;
    padding: 0
}

.af p,
.af a,
.af li,
.af td,
.af td,
.af span,
.af label {
    line-height: 24px;
    font-size: 14px;
    font-weight: 300
}

.af h1,
.af h2,
.af h3,
.af h4,
.af h5,
.af h6 {
    margin: 0;
    color: #000
}

.af ul {
    padding-left: 0;
    margin: 0
}

.af li {
    list-style-type: none
}

.af a {
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.af a:hover {
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.af div,
.af a,
.af ul,
.af li,
.af input,
.af p,
.af h1,
.af h2,
.af span {
    box-sizing: border-box
}

.af div {
    box-sizing: border-box
}

.af {
    width: 100%;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
    float: none;
}

.ac {
    margin: 0 auto;
    position: relative;
    max-width: 1250px
}

img {
    -ms-interpolation-mode: bicubic;
    display: inline-block;
    height: auto;
    max-width: 100%;
    vertical-align: middle
}

.mob-ban-im {
    display: none
}

.ban {
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-ban-bg-23.png) #fdf5ef;
    background-size: 215px;
    padding: 80px 80px 200px;
    background-position: center;
    transition: all .5s ease;
    position: relative;
    overflow: hidden;
}

.ban:before {
    content: '';
    position: absolute;
    background-image: linear-gradient(to top, #fdf5ef 10%, transparent);
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.ban-head {
    padding-bottom: 110px
}

.ban-head h1 {
    font-size: 50px;
    font-weight: 600;
    line-height: 64px;
    padding-bottom: 10px
}

.ban-head p {
    font-size: 20px;
    line-height: 32px;
    margin-bottom: 40px
}

.one-line-form {
    width: 526px;
    margin: 0 auto
}

.one-line-form * {
    font-family: "ZohoPuvi", verdana, arial, sans;
    font-size: 14px;
    outline: 0;
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

.one-line-form>form>ul {
    margin: 0;
    padding: 0
}

.one-line-form>form>ul li {
    list-style-type: none;
    float: left;
    border: 1px solid #e6e6e6;
    background: #fff;
    position: relative
}

.one-line-form>form>ul li:nth-child(1) {
    width: 270px;
    position: relative;
    border-radius: 5px 0 0 5px;
    border-right-width: 0
}

.one-line-form>form>ul li:nth-child(1):before {
    content: '';
    position: absolute;
    width: 26px;
    height: 18px;
    margin: 16px 0 0 8px;
    pointer-events: none;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-ban-sprite-23.png);
    background-size: 76px;
    background-repeat: no-repeat;
    background-position: 0 0
}

.one-line-form>form>ul li:nth-child(3):before {
    content: '';
    position: absolute;
    width: 16px;
    height: 14px;
    margin: 18px 0 0 26px;
    pointer-events: none;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-ban-sprite-23.png);
    background-size: 65px;
    background-repeat: no-repeat;
    background-position: -31px -1px
}

.one-line-form>form>ul li:nth-child(3):after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    pointer-events: none;
    -moz-animation: bounce 3s infinite;
    -webkit-animation: bounce 3s infinite;
    animation: bounce 3s infinite;
    left: 25px;
    top: 13px;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-ban-sprite-23.png);
    background-size: 65px;
    background-repeat: no-repeat;
    background-position: -51px 1px
}

@-moz-keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -moz-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -moz-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}

@-webkit-keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -moz-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -moz-transform: translateY(-3px);
        -ms-transform: translateY(-3px);
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}

.one-line-form>form>ul li:nth-child(1) .form-icn {
    background: #f6f8fa;
    width: 38px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    border-radius: 3px 0 0 3px
}

.one-line-form>form>ul li:nth-child(1) .form-icn .icn-mail {
    background-position: -76px -64px;
    width: 17px;
    height: 12px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.one-line-form>form>ul li:nth-child(1) input {
    font-size: 14px;
    padding-left: 45px;
    border-radius: 5px 0 0 5px
}

.one-line-form>form>ul li:nth-child(1) input::placeholder {
    color: #b3b3b3
}

.one-line-form>form>ul li:nth-child(2) {
    width: 50px;
    border-left: 0;
    border-right: 0;
    position: relative
}

.one-line-form>form>ul li:nth-child(3) {
    padding-left: 0;
    border-color: #d63327;
    border-radius: 0 5px 5px 0
}

.one-line-form>form>ul li .ffw-errmsg {
    display: none;
    color: red;
    font-size: 12px;
    margin-top: -20px;
    position: absolute;
    font-weight: 300;
    white-space: nowrap
}

.one-line-form>form>ul li input {
    width: 100%;
    height: 50px;
    border: 0;
    padding: 0 10px;
    font-size: 14px;
    color: #000;
    font-weight: 300
}

.one-line-form>form>ul li .selectedCountry {
    text-align: left;
    width: 50px;
    height: 41px;
    position: absolute;
    color: #000;
    font-size: 14px;
    margin: 5px 0 0;
    line-height: 33px;
    left: 0;
    padding-left: 8px;
    border-left: 1px solid #e5e5e5;
    font-weight: 300;
    padding-top: 4px;
    overflow: hidden
}

.one-line-form>form>ul li .selectedCountry:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #1e0437;
    z-index: 0;
    right: 10px;
    top: 19px
}

.one-line-form>form>ul li .selectedCountry:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 33px;
    top: 0;
    right: 0;
    background-color: #e6e6e6;
    display: none
}

.one-line-form>form>ul li input[type=submit] {
    font-size: 16px;
    background: #d63327;
    color: #fff;
    padding: 0 29px 0 51px;
    cursor: pointer;
    font-weight: 300;
    height: 50px;
    border: 0;
    border-radius: 0 4px 4px 0
}

.one-line-form>form>ul li input[type=submit]:hover {
    background: #9e0303;
    transition: all .5s ease
}

.one-line-form>form>ul li select {
    font-weight: 300;
    width: 50px;
    height: 50px;
    border: 0;
    padding: 0 10px;
    box-sizing: border-box;
    border-radius: 0;
    margin: 0;
    z-index: 9;
    position: relative;
    color: #000;
    font-size: 12px;
    opacity: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    float: left;
    background: #fff;
    overflow: hidden
}

.one-line-form>form>ul li select#country_state {
    position: relative;
    font-size: 14px;
    opacity: 1;
    width: 100px;
    float: left;
    padding-left: 0;
    line-height: 22px
}

.one-line-form>form>.misc-field .dwn-priv {
    margin-top: 0;
    line-height: 16px;
    font-weight: 200;
    padding-top: 5px
}

.one-line-form>form>.misc-field .dwn-priv,
.one-line-form>form>.misc-field .dwn-priv * {
    font-size: 11px;
    color: #000;
    line-height: 18px;
}

.one-line-form>form>.misc-field .dwn-priv strong {
    font-weight: 400
}

.one-line-form>form>.misc-field .dwn-priv a {
    font-size: 11px;
    text-decoration: underline
}

.one-line-form>form>.misc-field #meGDPRMessage {
    line-height: 16px;
    margin: 5px 0 0 !important;
    width: 100%
}

.one-line-form>form>.misc-field #meGDPRMessage label {
    font-size: 11px;
    line-height: 18px;
    color: #000;
    font-weight: 300;
    opacity: .8
}

.one-line-form>form>.misc-field #meGDPRMessage .checkmarkgdpr {
    margin-bottom: 0;
    height: 12px;
    width: 12px
}

.one-line-form>form>.misc-field::before {
    content: " ";
    display: table;
    clear: both
}

.one-line-form>form>.misc-field * {
    color: #a6a6a6;
    font-weight: 300
}

.one-line-form>form>.misc-field strong {
    font-weight: 600
}

.one-line-form>form>.misc-field a {
    color: #1281bd;
    text-decoration: underline
}

.one-line-form>.success-message {
    display: none
}

.one-line-form>.success-message h2 {
    margin-bottom: 10px;
    color: #000;
    font-size: 30px;
}

.one-line-form>.success-message p {
    font-size: 15px;
    line-height: 23px;
    margin-top: 0;
    color: #4e4e4e
}

.one-line-form>.success-message p a {
    font-size: 15px;
}

.one-line-form.success ul {
    display: none
}

.one-line-form.success .success-message {
    display: block
}

.one-line-form.success .misc-field {
    display: none
}

.one-line-form.with-state {
    width: 551px
}

.one-line-form.with-state ul li #headerCountryListItem:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #1e0437;
    z-index: 0;
    right: 7px;
    top: 23px
}

.one-line-form.with-state ul li:nth-child(1) {
    margin-left: 0;
    width: 200px
}

.one-line-form.with-state ul li #country_state {
    margin-left: 8px
}

.one-line-form.with-state ul li .selectedCountry:after {
    display: block
}

.one-line-form.with-state ul li input[type=submit] {
    padding: 0 20px 0 55px
}

.one-line-form.with-state ul li:nth-child(2) {
    width: 160px
}

.one-line-form.with-state .ffw-country-list {
    position: relative
}

.one-line-form.with-state .ffw-country-list:after {
    content: "";
    position: absolute;
    right: 4px;
    top: 19px;
    width: 13px;
    height: 13px;
    z-index: 1;
    zoom: .95
}

@media screen and (max-width: 620px) {
    .customerLogos {
        display: none !important
    }

    .one-line-form {
        width: 100%
    }

    .one-line-form ul li {
        width: 100% !important
    }

    .one-line-form ul li select {
        width: 100% !important
    }

    .one-line-form ul li:first-child {
        border: 1px solid #8ca2ba !important;
        margin-top: 5px !important;
        width: 100% !important;
        display: block
    }

    .one-line-form ul li input[type=submit],
    .one-line-form.with-state ul li input[type=submit] {
        padding: 0 20px
    }

    .one-line-form>form>ul li,
    .one-line-form>form>ul li:nth-child(1),
    .one-line-form>form>ul li input[type=submit],
    .one-line-form>form>ul li:nth-child(3) {
        border-radius: 5px
    }

    .one-line-form>form>ul li {
        background: none
    }

    .one-line-form ul li:nth-child(2) select {
        border: 1px solid #8ca2ba !important;
        margin-top: 5px !important;
        width: 100% !important;
        display: block;
        opacity: 1;
        -webkit-appearance: listbox;
        border-radius: 5px
    }

    .one-line-form ul li .selectedCountry {
        display: none;
        width: 100% !important
    }

    .one-line-form ul li:nth-child(3) {
        margin-top: 5px
    }

    .one-line-form.with-state {
        width: 100% !important
    }

    .one-line-form.with-state ul li select#country_state {
        margin-left: 0;
        padding: 0 10px;
        font-size: 12px
    }

    .one-line-form>form>ul li:nth-child(3):before,
    .one-line-form>form>ul li:nth-child(3):after {
        display: none
    }

    .one-line-form>form>ul li:nth-child(1) input {
        border-radius: 5px
    }
}

.tnks {
    width: 100%;
    text-align: center;
    display: none
}

.tnks h4 {
    font-size: 22px;
    font-weight: 500;
    color: #2a8701;
    border-top: 1px solid #00000030;
    padding-top: 25px
}

.tnks p {
    font-size: 18px;
    color: #333
}

.ban-ani {
    width: 574px;
    height: 388px;
    margin: 0 auto;
    display: table;
    position: relative;
    transition: all .2s ease
}

.ban-ani.ani .bani2 {
    height: 270px
}

.ban-ani.ani .bani5 {
    opacity: 1
}

.bani6,
.bani7,
.bani8,
.bani9 {
    opacity: 0
}

.ban-ani.ani .bani6,
.ban-ani.ani .bani7,
.ban-ani.ani .bani8,
.ban-ani.ani .bani9 {
    opacity: 1;
    transform: scale(1) translate(0px, 0px)
}

.ban-ani span {
    position: absolute;
    background-image: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri-23.png);
    background-size: 550px;
    background-repeat: no-repeat;
    transition: all .5s ease
}

.bani1 {
    width: 720px;
    height: 70px;
    background-position: -8px -696px;
    left: 30px;
    bottom: 0
}

.bani2 {
    width: 249px;
    height: 0;
    background-position: -198px -3px;
    left: 182px;
    bottom: 26px
}

.bani3 {
    width: 208px;
    height: 140px;
    background-position: -493px -81px;
    bottom: 40px;
    left: 324px
}

.bani4 {
    width: 62px;
    height: 62px;
    background-position: -543px -10px;
    left: 372px;
    bottom: 169px;
    animation: anihead 3s linear 0s both infinite;
    transform-origin: bottom
}

@keyframes anihead {
    0% {
        transform: rotate(-5deg)
    }

    50% {
        transform: rotate(5deg)
    }

    100% {
        transform: rotate(-5deg)
    }
}

.bani5 {
    left: 28px;
    bottom: -1px;
    opacity: 0;
    background-position: -6px -130px;
    width: 544px;
    height: 370px;
}

.bani6 {
    background-position: -6px -25px;
    height: 50px;
    left: -19px;
    top: 150px;
    transform: scale(2.5) translate(-100px, 50px);
    width: 47px;
}

.bani7 {
    background-position: -94px -24px;
    height: 46px;
    left: 107px;
    top: 44px;
    transform: scale(2.5) translate(-100px, -54px);
    width: 36px;
}

.bani8 {
    background-position: -178px -14px;
    height: 58px;
    left: 415px;
    top: -9px;
    transform: scale(2.5) translate(100px, -54px);
    width: 58px;
}

.bani9 {
    background-position: -271px -20px;
    height: 55px;
    left: 500px;
    top: 198px;
    transform: scale(2.5) translate(150px, 50px);
    width: 55px;
}

.sli .inn {
    margin-top: -200px;
    overflow: initial;
    max-height: initial;
    width: 100%;
    max-width: 1100px;
    display: inline-block;
}

.sli .flex-control-paging {
    background: #fff;
    width: fit-content;
    padding: 8px 15px 0;
    border-radius: 30px;
    bottom: -4px;
    border: 1px solid #cecece;
    box-shadow: 0 11px 14px -6px #00000073;
    display: inline-table;
}

.sli .flex-control-paging {
    background: #fff;
    width: fit-content;
    padding: 10px 15px 0;
    border-radius: 30px;
    bottom: -4px;
    border: 1px solid #cecece;
    box-shadow: 0 11px 14px -6px #00000024
}

.sli .flex-control-paging li a {
    width: 18px;
    height: 18px;
    display: block;
    background: #b7c1c3;
    cursor: pointer;
    text-indent: -9999px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    border: 3px solid #fff
}

.sli .flex-control-paging li a {
    width: 16px;
    height: 16px;
    display: block;
    background: #b7c1c3;
    cursor: pointer;
    text-indent: -9999px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
    border: 3px solid #fff
}

.sli .flex-control-paging li a.flex-active {
    background: #cd741d;
    cursor: default;
    box-shadow: 0 0 0 2px #cd741d
}

.sec-box-main {
    background: #f7fafc
}

.sec-box h2 span {
    display: block;
    font-size: 30px;
    line-height: 40px
}

.pri-22 {
    padding: 90px 0
}

.pri-22 .tit-get {
    margin-bottom: 40px
}

.pri-22 .tit-get h2 {
    font-size: 36px;
    font-weight: 500;
    line-height: 40px
}

.pri-box-main {
    width: 33.333%;
    float: left;
    padding: 10px
}

.pri-box {
    border: 1px solid #95bee4;
    border-radius: 10px;
    transition: all .5s ease
}

.pri-box .editi {
    display: block;
    background: #d4e3e8;
    border-radius: 10px 10px 0 0;
    font-weight: 500;
    text-transform: uppercase;
    padding: 14px 10px;
    letter-spacing: 1px
}

.all-fea-free {
    font-weight: 500;
    font-size: 17px;
    color: #000;
    padding: 30px 0 0;
    position: relative
}

.pri-22 .points h4:before {
    content: '';
    position: absolute;
    background: #c8c5c2;
    background: -webkit-linear-gradient(to right, #ffffff00, #c8c5c2, #ffffff00);
    background: linear-gradient(to right, #ffffff00, #c8c5c2, #ffffff00);
    width: 80%;
    height: 1px;
    left: 10%;
    right: 0;
    top: -22px
}

.pri-box.pri-box-stan {
    background: #fff;
    border: 1px solid #b0c1e0
}

.pri-box.pri-box-stan .editi {
    background: #eaf1fe
}

.pri-box.pri-box-stan,
.pri-box.pri-box-pro {
    min-height: 600px
}

.pri-box.pri-box-pro {
    background: #fff4e5;
    border: 1px solid #fdc373
}

.pri-box.pri-box-pro .editi {
    background: #fdc373
}

.pri-box.pri-box-pro .cta a {
    color: #fff;
    background: #000
}

.pri-box .tit-free {
    padding-top: 30px
}

.pri-box .tit-free h2 {
    font-size: 44px;
    font-weight: 500;
    color: #475061
}

.pri-box .tit-free h5 {
    font-size: 16px;
    font-weight: 300;
    padding: 15px 0
}

.tit-pre {
    padding-top: 30px
}

.tit-pre h5 {
    font-size: 16px;
    font-weight: 300
}

.tit-pre h5 span {
    display: block;
    font-size: 44px;
    font-weight: 500;
    line-height: 65px;
    position: relative;
    color: #475061
}

.tit-pre h5 span i {
    font-style: normal;
    font-size: 22px;
    font-weight: 500;
    margin: -8px 0 0 -15px;
    position: absolute
}

.pri-box .cta {
    margin-top: 10px
}

.pri-box .cta a {
    border: 1px solid #333;
    font-size: 16px;
    font-weight: 400;
    padding: 12px 72px 12px 50px;
    display: table;
    margin: 0 auto;
    border-radius: 5px;
    color: #000;
    position: relative;
    overflow: hidden
}

.pri-box:hover {
    box-shadow: 0 17px 20px -11px #0000005c
}

.pri-box:hover .cta a {
    background: #f73749;
    border: 1px solid #f73749;
    color: #fff
}

.pri-box .cta a span:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -889px -199px;
    background-size: 1000px 650px;
    width: 14px;
    height: 12px;
    right: 47px;
    top: 19px;
    transition: all .5s ease
}

.pri-box:hover .cta a span:before {
    background-position: -921px -198px
}

.pri-box.pri-box-pro .cta a span:before {
    background-position: -920px -198px
}

.pri-box .cta a::before {
    background: #fff;
    content: "";
    height: 155px;
    opacity: 0;
    position: absolute;
    top: -50px;
    transform: rotate(35deg);
    width: 50px;
    transition: all 3000ms cubic-bezier(0.19, 1, 0.22, 1)
}

.pri-box .cta a::after {
    background: #fff;
    content: "";
    height: 120px;
    opacity: 0;
    position: absolute;
    top: -27px;
    transform: rotate(71deg);
    transition: all 3000ms cubic-bezier(0.19, 1, 0.22, 1);
    width: 8rem
}

.pri-box .cta a::before {
    left: -50%
}

.pri-box .cta a::after {
    left: -100%
}

.pri-box:hover .cta a::before {
    left: 120%
}

.pri-box:hover .cta a::after {
    left: 200%;
    opacity: .6
}

.pri-22 .points {
    padding: 40px 25px 10px
}

.pri-22 .points h4 {
    text-align: left;
    padding: 0 0 15px 20px;
    font-weight: 500;
    font-size: 16px;
    position: relative
}

.pri-22 .points .p-list {
    padding-bottom: 20px
}

.pri-22 .points .p-list2 {
    margin-bottom: 13px
}

.pri-22 .points .p-list li {
    text-align: left;
    padding: 0 0 10px 44px;
    font-size: 15px;
    position: relative
}

.pri-22 .points .p-list li:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -949px -196px;
    background-size: 1000px 650px;
    width: 12px;
    height: 15px;
    left: 20px;
    top: 5px
}

.pri-box-pro .tit-pre h5 span {
    color: #d55516
}

.pri-box-free {
    background: #f9fdff;
    border: 1px solid #d4e3e8
}

.why {
    padding: 130px 0 90px;
    background: #f7fafc
}

.why .tit h2 {
    font-size: 36px;
    font-weight: 200;
    line-height: 50px;
    margin-bottom: 40px
}

.why .tit h2 span {
    display: block;
    font-size: 36px;
    font-weight: 500;
    line-height: 46px
}

.why ul li {
    float: left;
    width: 50%;
    text-align: left;
    padding: 15px;
    position: relative
}

.why ul li:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #fff0d3;
    transition: all .5s ease;
    border-radius: 20px;
    opacity: 0
}

.why ul li:hover:before {
    transform: scale(1) rotate(-2deg);
    opacity: 1
}

.why ul li ol>li:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -980px -194px;
    background-size: 1000px 650px;
    width: 14px;
    height: 14px;
    left: 0;
    top: 7px;
    opacity: 1
}

.why ul li .box1 ol li {
    width: 50%
}

.why ul li div {
    background: #fff;
    border: 1px solid #efefef;
    padding: 120px 40px 40px;
    border-radius: 20px;
    float: left;
    width: 100%;
    min-height: 425px;
    position: relative
}

.why ul li div:before {
    content: '';
    position: absolute;
    width: 70px;
    height: 66px;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -625px -104px;
    background-size: 1000px;
    top: 40px
}

.why ul li:nth-child(2) div:before {
    background-position: -725px -103px
}

.why ul li:nth-child(3) div:before {
    background-position: -826px -101px
}

.why ul li:nth-child(4) div:before {
    background-position: -935px -103px
}

.why ul h4 {
    font-size: 22px;
    font-weight: 500;
    padding-bottom: 25px;
    line-height: 32px
}

.why ul li ol {
    float: left;
    width: 100%
}

.why ul li ol li {
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    padding: 0 0 15px 25px;
    position: relative
}

.why ul li ol li a {
    font-size: 16px;
    line-height: 28px;
}

.cus-says {
    padding-bottom: 140px
}

.cus-says .tit {
    padding-bottom: 40px
}

.cus-says .tit h2 {
    font-size: 36px;
    font-weight: 200;
    line-height: 50px;
    margin-bottom: 40px
}

.cus-says .tit h2 span {
    display: block;
    font-size: 36px;
    font-weight: 500;
    line-height: 46px
}

.cus-says .inn ul li {
    float: left;
    width: 33.3333%;
    padding: 0 10px
}

.cus-box {
    background: #fff;
    border: 1px solid #d4e3e8;
    padding: 30px;
    border-radius: 10px;
    position: relative
}

.cus-box:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -438px -209px;
    background-size: 1000px 650px;
    width: 69px;
    height: 60px;
    left: 0;
    right: 0;
    margin: auto;
    top: -40px
}

.cus-box p {
    font-size: 16px;
    line-height: 28px
}

.cus-box h5 {
    font-size: 18px;
    font-weight: 500;
    margin-top: 25px;
    padding-bottom: 5px
}

.reso {
    background-image: linear-gradient(to top, #fdefe5 00%, transparent);
    padding: 0 0 90px
}

.reso h2 {
    font-size: 36px;
    font-weight: 500;
    line-height: 46px;
    margin-bottom: 40px
}

.reso ul li {
    float: left;
    width: 33.333%;
    padding: 8px
}

.reso ul li .box {
    background: #fff;
    border: 1px solid #d4e3e8;
    padding: 30px 30px 130px;
    border-radius: 10px;
    position: relative;
    text-align: left;
    overflow: hidden
}

.reso ul li .box:hover a {
    background: #e5891a
}

.reso ul li .box:hover img {
    filter: grayscale(0);
    width: 150px;
    height: 160px
}

.reso ul li .box span {
    font-size: 13px;
    background: #000;
    color: #fff;
    padding: 1px 7px;
    border-radius: 5px;
    display: inline-block
}

.reso ul li .box h4 {
    font-size: 19px;
    font-weight: 500;
    line-height: 28px;
    padding: 15px 0 25px
}

.reso ul li .box a {
    background: #f43a4e;
    font-size: 15px;
    color: #fff;
    font-weight: 400;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 2px;
    position: relative
}

.reso ul li .box img {
    position: absolute;
    width: 140px;
    right: 0;
    bottom: 0;
    height: 150px;
    object-fit: cover;
    box-shadow: 0 1px 8px 5px #00000017;
    transition: all .5s ease;
    filter: grayscale(1)
}

.explor-cta a {
    border: 2px solid #333;
    font-size: 16px;
    font-weight: 400;
    padding: 12px 55px 12px 40px;
    display: table;
    margin: 0 auto;
    border-radius: 5px;
    color: #000;
    position: relative
}

.explor-cta a:hover {
    background: #000;
    color: #fff
}

.explor-cta a:hover:before {
    border-left: 6px solid #fff
}

.explor-cta a:before {
    content: '';
    position: absolute;
    right: 32px;
    top: 18px;
    transition: all .5s ease;
    border-top: 6px solid #fff0;
    border-right: 6px solid #fff0;
    border-bottom: 6px solid #fff0;
    border-left: 6px solid #000
}

.explor-cta {
    float: left;
    width: 100%;
    padding-top: 25px
}

.cus {
    position: relative;
    padding: 100px 0 150px;
}

.cus .explor-cta {
    padding: 0px 0 50px;
}

.cus:before {
    content: '';
    position: absolute;
    background-image: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-city-23.png);
    background-repeat-y: no-repeat;
    background-size: 900px;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 142px;
    transition: all .5s ease;
    animation: citymove 2000s linear 0s both
}

@keyframes citymove {
    from {
        background-position: -12px 0
    }

    to {
        background-position: -20000px 0
    }
}

.cus .tit h2 {
    display: table;
    color: #000;
    background: #fff;
    font-size: 32px;
    line-height: 38px;
    font-weight: 600;
    padding: 0 40px 70px;
    position: relative;
    margin: 0 auto
}

.cus .tit h2:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat;
    background-size: 1000px;
    background-position: -174px -130px;
    width: 453px;
    height: 13px;
    transition: all .5s ease;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 40px
}

.customerLogos {
    position: relative;
    margin: 0 auto;
    display: table;
    float: initial
}

.customerLogos span {
    height: 60px;
    position: relative;
    background-repeat: no-repeat;
    display: inline-block;
    margin: 0 20px 25px;
    transition: all .5s ease;
    transform: translateY(-10px) scale(0.5);
    opacity: 0;
    background-image: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png);
    background-size: 1102px;
    width: 87px;
    height: 34px;
    background-position: -27px -30px;
    filter: grayscale(1)
}

.customerLogos.animated span {
    opacity: 1;
    transform: translateY(0px) scale(1)
}

.customerLogos.animated span.cus-1 {
    transition-delay: 1.3s
}

.customerLogos.animated span.cus-2 {
    transition-delay: 1.4s
}

.customerLogos.animated span.cus-3 {
    transition-delay: 1.5s
}

.customerLogos.animated span.cus-4 {
    transition-delay: 1.6s
}

.customerLogos.animated span.cus-5 {
    transition-delay: 1.7s
}

.customerLogos.animated span.cus-6 {
    transition-delay: 1.8s
}

.customerLogos span.cus-1 {
    background-position: -27px -30px;
    width: 87px !important
}

.customerLogos span.cus-2 {
    background-position: -184px -31px;
    width: 155px;
    height: 34px
}

.customerLogos span.cus-3 {
    background-position: -407px -16px;
    width: 146px;
    height: 39px;
    top: -10px
}

.customerLogos span.cus-4 {
    background-position: -620px -32px;
    width: 71px;
    height: 31px
}

.customerLogos span.cus-5 {
    background-position: -735px -28px;
    width: 140px;
    height: 30px
}

.customerLogos span.cus-6 {
    background-position: -927px -23px;
    width: 159px;
    height: 29px
}

.customerLogos span.cus-7 {
    background-position: -20px -126px;
    width: 159px;
    height: 37px;
    top: -2px
}

.cus-says .flex-control-nav,
.reso .flex-control-nav {
    display: none
}

.meet {
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-line-bg1-23.png) #1d222c;
    padding: 90px 0 190px;
    background-size: 230px;
    position: relative
}

.meet:before {
    content: '';
    position: absolute;
    background-image: linear-gradient(to top, #1d222c 70%, transparent);
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.meet .tit {
    text-align: center;
    width: 100%
}

.meet .tit h2 {
    font-size: 35px;
    font-weight: 500;
    line-height: 48px;
    margin-bottom: 40px
}

.meet .tit h2 span {
    display: block;
    font-size: 36px;
    font-weight: 200;
    line-height: 46px
}

.meet-tab-tit {
    width: 100%
}

.meet-tab-tit ul {
    float: initial;
    width: 100%;
    position: relative;
    background: #fff;
    border: 1px solid #efefef;
    border-radius: 50px;
    padding: 8px 8px 2px;
    margin: 0 auto;
    margin-bottom: 50px
}

.meet-tab-tit ul li {
    transition: .3s ease-in;
    display: table-cell;
    width: 2%
}

.meet-tab-tit ul li span {
    font-size: 13.5px;
    line-height: 22px;
    color: #6e7a8b;
    font-weight: 400;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
    text-align: center;
    padding: 6px 0;
    z-index: 1;
    transition: all .5s ease
}

.meet-tab-tit ul li span:hover {
    color: #a8bbd6
}

.topics-tb2 {
    width: 100%;
    display: none;
    text-align: left;
    float: left
}

.topic-1 {
    display: block
}

.move2 {
    background: #00313e;
    width: 190px;
    height: 41px;
    display: inline-block;
    border-radius: 30px;
    position: absolute;
    left: 7px;
    top: 5px;
    transition: all .5s ease;
    background: #065ce0
}

.scrn {
    width: 55%;
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0;
    padding-right: 15px
}

.scrn img {
    width: 100%
}

.con {
    width: 45%;
    padding: 10px 0 0 50px;
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0;
    transition: all .5s ease
}

.con ul li:before {
    content: '';
    position: absolute;
    width: 13px;
    height: 11px;
    left: 0;
    top: 8px;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -980px -194px;
    background-size: 1000px 650px;
    width: 14px;
    height: 14px
}

.secu .con h2 {
    margin-bottom: 50px
}

.secu .con h2::after {
    content: "";
    background: #1770fb;
    position: absolute;
    left: 0;
    bottom: -21px;
    height: 4.5px;
    width: 70px;
    border-radius: 2px
}

.secu .con li a {
    color: #27adff;
    font-size: 16px
}

.secu .con a.lm {
    color: #27adff;
    font-size: 16px;
    text-decoration: underline;
    display: inline-block;
    margin-top: 20px
}

.aniscrn .scrn,
.aniscrn .con {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
    transition: all .5s ease;
    float: left
}

.con h2 {
    font-size: 28px;
    line-height: 34px;
    font-weight: 500;
    position: relative;
    margin: 10px 0 25px;
    text-align: left
}

.con h4 {
    font-size: 16px;
    font-weight: 300;
    display: block;
    color: #00a4cf;
    line-height: 28px;
    border-radius: 2px;
    text-transform: uppercase;
    letter-spacing: 1px
}

.con p {
    margin: 0 0 18px;
    font-size: 16px;
    line-height: 28px;
    color: #27adff
}

.secu .con p a {
    font-size: 16px;
    line-height: 28px;
    color: #27adff
}

.con ul li {
    padding: 0 0 8px 30px;
    font-size: 16px;
    line-height: 28px;
    position: relative
}

.secu .con * {
    color: #fff
}

.secu .tit h2,
.secu .tit h2 span {
    color: #fff
}

.secu .meet-tab-tit ul {
    background: #252b37;
    border: 1px solid #3d4659
}

.secu .meet-tab-tit ul li span.act {
    color: #fff
}

.secu .con {
    padding: 10px 50px 0 0
}

.secu .scrn {
    padding: 0 0 0 10px
}

.sec-box {
    background: #ffdfa1;
    border-radius: 10px;
    padding: 50px 30px 50px 250px;
    margin-top: -90px;
    position: relative
}

.sec-box:before {
    content: '';
    position: absolute;
    background: url(https://www.manageengine.com/microsoft-365-management-reporting/images/mmp-hom-spri1-23.png) no-repeat -12px -169px;
    background-size: 900px;
    width: 330px;
    height: 209px;
    left: 90px;
    top: 32px
}

.sec-box div {
    padding-left: 250px;
    text-align: left
}

.sec-box div h2 {
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 30px;
    line-height: 50px
}

.sec-box div p {
    font-size: 20px;
    line-height: 32px;
    padding-bottom: 30px
}

.sec-box div a {
    background: #d31111;
    font-size: 18px;
    color: #fff;
    font-weight: 400;
    display: inline-block;
    padding: 15px 50px 15px 40px;
    border-radius: 5px;
    position: relative
}

.sec-box div a:before {
    content: '';
    position: absolute;
    right: 27px;
    top: 20px;
    transition: all .5s ease;
    border-top: 6px solid #fff0;
    border-right: 6px solid #fff0;
    border-bottom: 6px solid #fff0;
    border-left: 6px solid #fff
}

.sec-box div a:hover {
    background: #f60303;
    box-shadow: 0 13px 11px -6px #3333339c
}

.sec-box div a:hover:before {
    right: 25px
}

.secu .explor-cta a {
    float: left;
    border: 2px solid #fff;
    color: #fff;
}

.secu .explor-cta a:before {
    border-left: 6px solid #fff;
}

.secu .explor-cta a:hover {}

.secu .explor-cta a:hover:before {}

.fea-nav-link span.act:after,
.fea-nav-link span.act:before {
    display: none
}

.fea-nav-link {
    background: #fff;
    width: 100%;
    padding: 0 0 20px
}

.fea-nav-link span.act {
    background: none;
    color: #013d98;
    border-bottom: 2px solid #013d98
}

.fea-nav-link span {
    color: #8b8b8b;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    font-size: 15px;
    font-weight: 400;
    padding: 5px 0 8px;
    width: 16.4%;
}

.fea-nav-list {
    background: #fff
}

.fea-list-cont>ul {
    width: 33.333%;
    padding: 0 1%;
    float: left;
    box-sizing: border-box
}

.fea-list-cont>ul li {
    padding: 10px 0;
    color: #fff
}

.fea-nav-list a {
    color: #333;
    font-size: 14px;
    font-weight: 300;
    position: relative
}

.fea-nav-list a:before {
    content: '';
    position: absolute;
    width: 7px;
    height: 7px;
    background: #80b2fe;
    border-radius: 50px;
    margin: 4px 0 0 -15px
}

.footer-links .container {
    width: 100%;
    max-width: 1200px
}

.footer-links h2 {
    font-size: 24px;
    font-weight: 500
}

.footer-links {
    padding: 30px 0 50px;
    border-top: 1px dotted #DDD
}

.footer-stripe {
    float: left;
    width: 100%
}

.fea-nav .h2 {
    font-size: 24px;
    font-weight: 500;
    color: #000;
    line-height: 40px;
    padding-top: 80px;
    display: inline-block;
    width: 100%;
}

@media screen and (max-width:992px) {
    .meet-tab-tit {
        display: none
    }

    .scrn,
    .con {
        -webkit-transform: translateX(1px);
        transform: translateX(1px);
        opacity: 1;
        transition: all .5s ease
    }

    .scrn {
        width: 100%;
        padding: 0 0 30px
    }

    .con {
        width: 100%;
        padding: 0
    }

    .topics-tb2 {
        display: table;
        border: 1px solid #4f545f;
        padding: 25px;
        border-radius: 10px;
        margin-bottom: 15px;
        display: grid;
        background: #1b202a
    }

    .sec-box {
        padding: 50px 30px;
        text-align: center
    }

    .sec-box:before {
        display: none
    }

    .sec-box div {
        padding: 0;
        text-align: center
    }

    .sec-box div a {
        position: relative;
        top: 0;
        right: 0
    }

    .secu .con {
        padding-right: 0;
        padding-bottom: 30px
    }
}

@media screen and (max-width:769px) {
    .secu .tit h2 {
        font-size: 24px;
        padding-top: 30px
    }

    .secu .scrn {
        padding: 30px 0 0
    }

    .meet .tit h2 {
        font-size: 24px;
        line-height: 32px
    }

    .meet .tit h2 span {
        font-size: 20px;
        line-height: 28px
    }

    .con h4 {
        font-size: 14px
    }

    .con h2 {
        font-size: 22px;
        line-height: 30px
    }
}

@media screen and (max-width:1360px) {
    .ban-head h1 {
        font-size: 40px;
        line-height: 52px
    }
}

@media screen and (max-width:1290px) {
    .ac {
        max-width: 95%
    }

    .reso ul li .box img {
        width: 100px;
        height: 120px
    }

    .meet-tab-tit ul li span {
        font-size: 12px
    }

    .move2 {
        width: 158px
    }
}

@media screen and (max-width:1100px) {
    .why ul li {
        width: 100%
    }

    .why ul li div {
        min-height: auto
    }

    .move2 {
        width: 160px
    }

    .meet-tab-tit ul li span {
        font-size: 11px
    }

    .cus-says {
        padding-bottom: 100px
    }

    .fea-nav-link span {
        font-size: 14px;
    }
}

@media screen and (max-width:1050px) {
    .ban-head p br {
        display: none
    }

    .pri-box.pri-box-stan,
    .pri-box.pri-box-pro {
        min-height: 700px
    }

    .move2 {
        width: 140px
    }
}

@media screen and (min-width:992px) {
    .meet-tab-tit ul li span {
        text-overflow: ellipsis;
        overflow: hidden
    }
}

@media screen and (max-width:992px) {

    .ban-ani,
    .reso ul li .box img {
        display: none
    }

    .reso ul li .box {
        padding: 30px
    }

    .mob-ban-im {
        display: block
    }

    .pri-box.pri-box-stan,
    .pri-box.pri-box-pro {
        min-height: auto
    }

    .ban-head {
        padding-bottom: 30px
    }

    .pri-box-main {
        width: 100%
    }

    .pri-box {
        max-width: 500px;
        margin: 0 auto;
        display: table;
        width: 100%
    }
}

@media screen and (max-width:769px) {
    .ban {
        padding: 80px 30px 200px
    }

    .ban-head h1 {
        font-size: 32px;
        line-height: 44px
    }

    .cus .tit h2 {
        padding: 0 0 90px
    }

    .sec-box div h2 {
        font-size: 28px;
        line-height: 40px
    }

    .sec-box div h2 span {
        font-size: 20px;
        line-height: 45px
    }

    .cus-says .inn ul li {
        width: 100%;
        padding: 0 0 40px
    }

    .cus-says .inn ul li:last-child {
        padding-bottom: 0
    }

    .cus-says {
        padding-bottom: 30px
    }

    .reso ul li {
        width: 100%;
        padding: 0
    }

    .ban-head h1 br {
        display: none
    }

    .pri-22 .tit-get h2,
    .why .tit h2,
    .why .tit h2 span {
        font-size: 30px
    }

    .cus-box:before {
        top: 26px
    }

    .cus-box {
        padding: 100px 30px 30px
    }
}

@media screen and (max-width:769px) {
    .footer {
        display: block;
    }

    #meCommonFooterNew {
        display: inline-block;
        width: 100%;
    }
}

@media screen and (max-width:550px) {
    .why ul li .box1 ol li {
        width: 100%
    }
}

@media screen and (max-width:500px) {

    .ds-list li,
    .cus .tit h2:before {
        width: 100%
    }
}

@media screen and (max-width:420px) {
    .customerLogos span {
        margin: 0 10px 25px;
    }
}

@media screen and (max-width: 1025px) {
    .menu-icon {
        display: none;
    }
}

/* Download CTA */
body .CS_CTAContainer {
    display: none;
    box-sizing: border-box;
    font-family: "ZohoPuvi"
}

body .CS_CTAContainer.CS_CTA_Center {
    text-align: center
}

body .CS_CTAContainer.CS_CTA_mt_10 {
    margin-top: 10px
}

body .CS_CTAContainer.CS_CTA_mt_20 {
    margin-top: 20px
}

body .CS_CTAContainer.CS_CTA_mt_30 {
    margin-top: 30px
}

body .CS_CTAContainer.CS_CTA_mb_10 {
    margin-bottom: 10px
}

body .CS_CTAContainer.CS_CTA_mb_20 {
    margin-bottom: 20px
}

body .CS_CTAContainer.CS_CTA_mb_30 {
    margin-bottom: 30px
}

body .CS_CTAContainer a {
    margin: 0;
    padding: 0;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    text-transform: none;
    border: none
}

body .CS_CTAContainer a.CS_CTABtn {
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    background: #ef292c;
    color: #fff;
    padding: 10px 43px;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    border-width: 0;
    transition: background 0.3s ease-in-out
}

body .CS_CTAContainer a.CS_CTABtn:hover {
    background: #c71a1d;
    text-decoration: none
}

body .CS_CTAContainer a.CS_CTABtn:after {
    display: none
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_r6 {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_r4 {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_arrow {
    position: relative;
    padding: 10px 55px 10px 30px
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_arrow::before {
    content: "";
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAdCAYAAAC0T3x2AAAABHNCSVQICAgIfAhkiAAAALtJREFUSEvt1u0RQDAMBmCZwCpGMIpNGM0KNmADG1Tqo3do8wb1L73zK7k8J9cEKsBxznWc0kppxAfVgQkGpVporYt2xm5dtC02RzZHoQPZLgMXqrhqKaz5hmP+kU4N4hPtUA8w9LmR4gMH63Wp/ohtCNEctvcPWED8y5w+ExmxE3KDMrXxhkShj1gUSUIvsSQiQg8xEYGQEoOICgKYClFDCUyNPIIu2HhMvHY3wf+6a6F9qEe/VrSIz1sANr+NSDcXBosAAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: center;
    width: 12px;
    height: 14px;
    border-bottom: 2px solid #fff;
    position: absolute;
    top: 50%;
    right: 35px;
    transform: translateY(-50%);
    pointer-events: none
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_sm {
    font-size: 14px;
    line-height: 24px
}

body .CS_CTAContainer a.CS_CTABtn.CS_CTABtn_large {
    font-size: 20px;
    line-height: 30px
}

@media screen and (max-width:992px) {
    body .CS_CTAContainer {
        text-align: center
    }
}

.cta-foot-red-ani-24 {
    background: #E9142B;
    padding: 12px 53px 12px 30px !important;
    display: inline-block;
    border-radius: 3px;
    text-decoration: none;
    text-align: center;
    position: relative;
    text-decoration: none
}

.cta-foot-red-ani-24:link,
.cta-foot-red-ani-24:visited {
    border: none;
    overflow: hidden;
    transition: all .3s ease-in-out
}

.cta-foot-red-ani-24::before {
    background: #fff;
    content: "";
    height: 155px;
    opacity: 0;
    position: absolute;
    top: -50px;
    transform: rotate(35deg);
    width: 50px;
    transition: all 3000ms cubic-bezier(0.19, 1, 0.22, 1)
}

.cta-foot-red-ani-24::after {
    background: #fff;
    content: "";
    height: 120px;
    opacity: 0;
    position: absolute;
    top: -27px;
    transform: rotate(71deg);
    transition: all 3000ms cubic-bezier(0.19, 1, 0.22, 1);
    width: 8rem
}

.cta-foot-red-ani-24::before {
    left: -50%
}

.cta-foot-red-ani-24::after {
    left: -100%
}

.cta-foot-red-ani-24:hover,
.cta-foot-red-ani-24:active {
    transform: translateY(-3px);
    color: #fff;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.3);
    text-decoration: none;
}

.cta-foot-red-ani-24:hover::before {
    left: 120%;
    opacity: .5s
}

.cta-foot-red-ani-24:hover::after {
    left: 200%;
    opacity: .6
}

.cta-foot-red-ani-24 span {
    z-index: 20;
    font-size: 18px;
    color: #fff;
    line-height: 30px;
    margin-top: 0;
    font-style: normal;
    font-weight: 400;
}

.dwn-cta-ani-24 {
    width: 14px;
    height: 15px;
    border-bottom: 2px solid #fff;
    display: inline-block;
    position: absolute;
    margin: 8px 0 0 10px;
    pointer-events: none
}

.dwn-cta-ani-24:before,
.dwn-cta-ani-24:after {
    content: '';
    position: absolute;
    -moz-animation: dwncta-bounce 3s infinite;
    -webkit-animation: dwncta-bounce 3s infinite;
    animation: dwncta-bounce 3s infinite
}

.dwn-cta-ani-24:before {
    height: 0;
    width: 0;
    border: none;
    border-top: 7px solid #fff;
    border-left: 7.2px solid rgba(0, 0, 0, 0);
    border-right: 7px solid rgba(0, 0, 0, 0);
    left: 0;
    top: 3px
}

.dwn-cta-ani-24:after {
    width: 4.5px;
    height: 8px;
    background: #fff;
    display: inline-block;
    top: -4px;
    left: 5px
}

@-moz-keyframes dwncta-bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -moz-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -moz-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}

@-webkit-keyframes dwncta-bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}

@keyframes dwncta-bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    40% {
        -moz-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        -webkit-transform: translateY(-6px);
        transform: translateY(-6px)
    }

    60% {
        -moz-transform: translateY(-3px);
        -ms-transform: translateY(-3px);
        -webkit-transform: translateY(-3px);
        transform: translateY(-3px)
    }
}