body{
                /*overflow: hidden;*/
                width : 100%;
        background: rgb(52,1,103);
background: linear-gradient(180deg, rgba(52,1,103,1) 31%, rgba(0,0,0,1) 67%);
                margin: 0px !important;
                height: 100vh;
                }
                .header
                  {
                  width : 100%;
                  position: fixed;
                  height : 0.3vh;
                  max-height: 0.5vh;
                  background: rgb(74,6,74);
background: linear-gradient(90deg, rgba(74,6,74,1) 28%, rgba(198,119,184,1) 65%);
                  top:0;
                  }
                  .footer
                  {
                  width : 100%;
                  position: fixed;
                  height : 0.3vh;
                  max-height: 0.5vh;
                  background: rgb(74,6,74);
background: linear-gradient(90deg, rgba(74,6,74,1) 28%, rgba(198,119,184,1) 65%);
                  bottom:0;
                  }
                .content{
                width : 100%;
                }
                .content2 {
                  width: 100%;
                  display: none;
                  height: 100%;
                  background-size: cover;
                }
                .button-div
                {
                 position: absolute;
                }

                .image1{
                   width: auto;
          height: 40vh;
          margin-top: 2.5vh;
                }
                .image2{
                        width: auto;
          height: 25vh;
          z-index: 1;
          cursor: pointer;
          margin-top: -6vh;

                }
                 .image3{
                          width: auto;
          height: 77vh;
          text-align: center;
          margin-top: -9vh;
          z-index: 0;
                  }
                .image4{
                  width: 60%;
          height: auto;
          text-align: center;
          margin-top: -45vh;
          z-index: 0;
                }

                .btn-logo {
                  position: fixed;
                  height: 35%;
                  bottom: 0;
                  width: 100%;
                  display: flex;
                  flex-direction: column;
                  justify-content: flex-start;
                  text-align: center;
                }
                
                .bttn {
                  height: 45%;
                }
                
                .logo {
                  height: 55%;
                  position: relative;
                }
                
                .image5 {
                  height: 90%;
                  width: auto;
                  z-index: 1;
                  cursor: pointer;
                  margin-top: 0;
                }
                
                .image6 {
                  width: auto;
                  height: 75%;
                  margin-top: 0;
                  z-index: 0;
                  position: absolute;
                  margin: auto;
                  bottom: 0;
                  left: 0;
                  right: 0;
                }
        /*iphone 5*/

                /* Portrait */
                @media only screen
                and (min-device-width: 320px)
                and (max-device-width: 568px)
                and (-webkit-min-device-pixel-ratio: 2)
                and (orientation: portrait)

                        {
                        .image1{
                          width: auto;
                          height: 36vh;
                          margin-top: 1.7vh;
                        }
                        .image2{
                          width: auto;
                          height: 19vh;
                          z-index: 1;
                          cursor: pointer;
                        }
                         .image3{
                          width: auto;
                          height: 56vh;
                          text-align: center;
                          margin-top: -2vh;
                          z-index: 0;
                          }
                        .image4{
                          width: 100%;
                          height: auto;
                          text-align: center;
                          margin-top: -30vh;
                          z-index: 0;
                        }
                        }


                 /*iphone 6*/
                /* Portrait */
        @media only screen
        and (min-device-width: 375px)
        and (max-device-width: 667px)
        and (-webkit-min-device-pixel-ratio: 2)
        and (orientation: portrait)   {


                 .image1{
                  width: auto;
                  height: 38vh;
                  margin-top: 1.7vh;
                }
                .image2{
                  width: auto;
                  height: 21vh;
                  z-index: 1;
                  cursor: pointer;
                }
                 .image3{
                  width: auto;
                  height: 58vh;
                  text-align: center;
                  margin-top: -2vh;
                  z-index: 0;
                  }
                .image4{
                  width: 100%;
                  height: auto;
                  text-align: center;
                  margin-top: -30vh;
                  z-index: 0;
                }
                }


          /* Portrait X */
        @media only screen
        and (min-device-width: 375px)
        and (max-device-width: 812px)
        and (-webkit-min-device-pixel-ratio: 3)
        and (orientation: portrait) {



                 .image1{
                  width: 100%;
                  height: 38vh;
                  margin-top: 2.5vh;
                }
                .image2{
                 width: auto;
                  height: 20vh;
                  z-index: 1;
                  cursor: pointer;
                margin-top: -2vh;
                }
                 .image3{
                  width: auto;
                  height: 60vh;
                  text-align: center;
                  margin-top: -3vh;
                  z-index: 0;
                  }
                .image4{
                  width: 100%;
                  height: auto;
                  text-align: center;
                  margin-top: -8vh;
                  z-index: 0;
                }
                }
                /*iphone 6+*/

           /* Portrait */
        @media only screen
                and (min-device-width : 414px)
                and (max-device-width : 736px)
                and (device-width : 414px)
                and (device-height : 736px)
                and (orientation : portrait)
                and (-webkit-min-device-pixel-ratio : 3)
                and (-webkit-device-pixel-ratio : 3){

                 .image1{
                  width: auto;
                  height: 36vh;
                  margin-top: 1.7vh;
                }
                .image2{
                  width: auto;
                  height: 19vh;
                  z-index: 1;
                  cursor: pointer;
                }
                 .image3{
                  width: auto;
                  height: 57vh;
                  text-align: center;
                  margin-top: -2vh;
                  z-index: 0;
                  }
                .image4{
                  width: 100%;
                  height: auto;
                  text-align: center;
                  margin-top: -25vh;
                  z-index: 0;
                }
                }
           /* your css rules for iphone xr */
                @media only screen
          and (device-width : 414px)
          and (device-height : 896px)
          and (-webkit-device-pixel-ratio : 2) {
        .image1{
                  width: 100%;
                  height: 36vh;
                  margin-top: 2.5vh;
                }
                .image2{
                 width: auto;
                  height: 18vh;
                  z-index: 1;
                  cursor: pointer;
                  margin-top: 0vh;
                }
                 .image3{
                  width: auto;
                  height: 58vh;
                  text-align: center;
                  margin-top: -3vh;
                  z-index: 0;
                  }
                .image4{
                  width: 100%;
                  height: auto;
                  text-align: center;
                  margin-top: -13vh;
                  z-index: 0;
                }

                }
          /*12, 13 ,13 pro*/
          @media only screen
                and (device-width: 390px)
                and (device-height: 844px)
                and (-webkit-device-pixel-ratio: 3) {

                .image1{
                  width: 100%;
                  height: 38vh;
                  margin-top: 2.5vh;
                }
                .image2{
                 width: auto;
                  height: 20vh;
                  z-index: 1;
                  cursor: pointer;
                  margin-top: 0vh;
                }
                 .image3{
                  width: auto;
                  height: 60vh;
                  text-align: center;
                  margin-top: -3vh;
                  z-index: 0;
                  }
                .image4{
                  width: 100%;
                  height: auto;
                  text-align: center;
                  margin-top: -17vh;
                  z-index: 0;
                }

                }
                 /* your css rules for ipad portrait */
           /* Portrait */
        @media only screen
        and (min-device-width: 768px)
        and (max-device-width: 1024px)
        and (orientation:portrait)
        {
         .image1{
                   width: auto;
          height: 44vh;
          margin-top: 2.5vh;
                }
                .image2{
                        width: auto;
          height: 25vh;
          z-index: 1;
          cursor: pointer;
          margin-top: -6vh;

                }
                 .image3{
                          width: auto;
          height: 77vh;
          text-align: center;
          margin-top: -7vh;
          z-index: 0;
                  }
                .image4{
                  width: 100%;
          height: auto;
          text-align: center;
          margin-top: -45vh;
          z-index: 0;
                }
        }

         /* your css rules for ipad landscape */
           /* landscape */
        @media only screen
        and (min-device-width: 768px)
        and (max-device-width: 1024px)
        and (orientation:landscape)
        {
         .image1{
                   width: auto;
          height: 40vh;
          margin-top: 2.5vh;
                }
                .image2{
                        width: auto;
          height: 25vh;
          z-index: 1;
          cursor: pointer;
          margin-top: -6vh;

                }
                 .image3{
                          width: auto;
          height: 77vh;
          text-align: center;
          margin-top: -7vh;
          z-index: 0;
                  }
                .image4{
                  width: 60%;
          height: auto;
          text-align: center;
          margin-top: -45vh;
          z-index: 0;
                }
        }
body{
	display: none;
        overflow:hidden !important;
}
        .log{
                position: fixed;
                width: 100%;
                bottom: 0;
                text-align: center;
        }
    .image4
        {
                margin-top: 0vh !important;

        }