* {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
      .banner-p1,#disableDiv, #PopupContainer, #commonHeader,body {
        background-color: #0a2bb2;
        color: #fff;
      }
      .title.page-heading {
        color: #fff;
        text-align: center;
      }
      .section-banner {
        margin: 50px auto;
      }
      .manageengine-logo {
        text-align: center;
        margin: 15px 0;
      }
      .manageengine-logo img {
        width: 250px;
      }
      .banner-p1 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }
      .description {
        display: flex;
        margin: 10px 0;
        position: relative;
      }
      .des-img {
        padding: 10px 20px;
        text-align: center;
        /* width: 380px; */
      }
      h1{color: #fff;}
      div#disableDiv{display: none;}
      img{border-radius: 5px;}
      .image {
        width: fit-content;
        margin: auto;
      }
      .des-img img {
        width: 300px;
      }
      .arrow {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0 20px;
      }
      .arrow img {
        width: 100px;
      }
      .des-img h2 {
        margin: 10px 0;
      }
      /* .tx-lf {
        text-align: justify;
      } */
      .descrip-hover {
        padding: 10px;
        background: rgb(0, 0, 0);
        border-radius: 5px;
        position: absolute;
        z-index: 99999999;
        visibility: hidden;
        opacity: 0;
        transition: visibility 0s, opacity 0.5s linear;
      }
      .tip-tool:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        border-right: 8px solid #000;
      }
      .descrip-hover.tip-tool:before {
        top: -12px;
        left: 0px;
        right: 0;
        margin: auto;
        transform: rotate(90deg);
      }
      .tip-tool p {
        font-size: 16px;
        line-height: 1.6;
        color: #fff;
        margin: 0;
        /* width: 250px; */
      }
      .title.page-heading {
        font-size: 1.4em;
      }
      .img-des1.des-img:hover .descrip-hover.tip-tool.para1,
      .img-des2.des-img:hover .descrip-hover.tip-tool.para2,
      .img-des3.des-img:hover .descrip-hover.tip-tool.para3 {
        visibility: visible;
        opacity: 1;
      }
      .descrip-hover.tip-tool.para1 {
        top: 98%;
        left: 0;
        width: 25%;
      }
      .descrip-hover.tip-tool.para2 {
        top: 98%;
        left: 0;
        right: 0;
        margin: auto;
        width: 25%;
        text-align: center;
      }
      .descrip-hover.tip-tool.para3 {
        top: 98%;
        right: 0;
        width: 25%;
      }
      .celebration-start{margin: 2em auto;width: 90%;}
      .celebration-start.bg-white h2{font-size: 34px;}
      .celebration-start p {font-size: 17px;line-height: 25px;}
      .mtd10{margin: 10px 0;}
      .mtd20{margin: 20px 0;}

      .play-video{text-align: center;margin: 30px 0;}
      .profile img{width: 250px;}
      .flex-row{display: flex;justify-content: center;align-items: center;}
      .profile{margin: 20px;width: 30%;text-align: center;}
      .celebration-eve img{width: 400px;}
      .celebration-photo{width: fit-content;}
      .paused {
  animation-play-state: paused;
}
.cele-pro img{width: 350px;}
.cele-pro{height: 300px;}
.cele-start img{width: 830px;}
.cele-start p{font-size: 17px;line-height: 25px;}
.banner-p1{position: relative;}
.logo1 img{
    position: absolute;
    top: 0;
    left: 0;
    width: 3em;
} 
.logo2 img{
    position: absolute;
    bottom: 10px;
    left: 0px;
    width: 12%;
} 
.logo3 img{
    position: absolute;
    bottom: 10px;
    right: 0px;
    width: 3em;
} 
.logo4 img{
  
    position: absolute;
    top: 0;
    right: 0;
    width: 12%;
} 
#commonHeader{margin-top: 130px;}
@media screen and (max-width:920px){
    .descrip-hover.tip-tool.para1,.descrip-hover.tip-tool.para2,.descrip-hover.tip-tool.para3{width: 29%;}
}

@media screen and (max-width:520px){
    #commonHeader{
        margin-top: 100px;
    }
    .logo4 img{width: 7em;}
    .logo1 img{width: 2em;}
    .title.page-heading{font-size: 15px;width: 96%;}
    iframe{width: auto;}
    .description{
        flex-direction: column;
    }
    .descrip-hover.tip-tool.para2,.descrip-hover.tip-tool.para1,.descrip-hover.tip-tool.para3{width: 100% !important;}
    .arrow{padding: 20px;transform: rotate(90deg);}
    .descrip-hover.tip-tool.para2{top: 64%;}
    .descrip-hover.tip-tool.para1{top: 28%;}
    .profile{width: 90%;}
    .flex-row{flex-direction: column;}
}


@media screen and (max-width:380px){
    iframe{width: 250px;}

}