#hero .blue-shadow{
    bottom:-44%;
}
#hero .red-shadow{
    bottom:-44%;
}
#hero p{
    color: #3C434A;
}
#hero .phone-img{
    max-width: 297px;
    /* box-shadow: 4px -4px 80px 0 rgba(0, 0, 0, 0.35), 1.21px -1.206px 24.118px 0 rgba(0, 0, 0, 0.23), 0.5px -0.501px 10.017px 0 rgba(0, 0, 0, 0.17), 0.18px -0.181px 3.623px 0 rgba(0, 0, 0, 0.12); */
}
#hero .phone-container{
    width: auto;
    top: 19%;
    left: 55%;
}
@media screen and (max-width: 1846px) {
    #hero .phone-container{
        top: 14%;
    }
}
@media screen and (max-width: 1732px) {
    #hero .phone-img{
        max-width: 220px;
    }
    #hero .analytics-img{
        max-width: 198px;
        left: 10% !important;
    }
    #hero .phone-container{
        top: 31%;
    }
}
@media screen and (max-width: 1621px) {
    #hero .phone-container{
        top: 24%;
    }
}
@media screen and (max-width: 1463px) {
    #hero .phone-img{
        max-width: 180px;
    }
    #hero .analytics-img{
        max-width: 160px;
        left: 11% !important;
    }
    #hero .phone-container{
        top: 33%;
    }
}
@media screen and (max-width: 1363px) {
    #hero .phone-img{
        max-width: 160px;
    }
    #hero .analytics-img{
        max-width: 142px;
        left: 12% !important;
    }
    #hero .phone-container{
        top: 36%;
    }
}
@media screen and (max-width: 991px) {
    #hero .phone-container{
        top: 60%;
        left: 20% !important;
    }
    #hero .right-img{
        max-width: 85%;
    }
}
@media screen and (max-width: 576px) {
    #hero .phone-img{
        max-width: 120px;
    }
    #hero .analytics-img{
        max-width: 107px;
        left: 13% !important;
    }
    #hero .phone-container{
        top: 64%;
        left: 20% !important;
    }
}

#hero .analytics-img{
    top: 2%;
    left: 9%;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
}

#hero .analytics-img.active{
    opacity: 1;
}