.cm-web-flow .top-section {
  text-align: center;
  margin-bottom: 50px;
}
.cm-web-flow .top-section p:last-child {
  margin-bottom: 0;
}

.cm-web-flow .top-section h2 {
  margin-bottom: 0;
}

.cm-web-flow .bottom-section {
  padding-top: 220px;
}
.cm-web-flow .bottom-section .inner-content {
  margin: 0 auto;
  width: 699px;
  height: 451px;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.cm-web-flow .bottom-section .inner-content > div {
  transition: 0.3s ease all;
}
.cm-web-flow .middle-section {
  padding-top: 44%;
}
.cm-web-flow .middle-section h2 {
  text-align: center;
  padding-top: 0;
  margin: 0 auto;
  max-width: 250px;
}

.cm-web-flow .step-1 {
  bottom: 7%;
  left: -44%;
  position: absolute;
  text-align: right;
  width: 40%;
}
.cm-web-flow .step-2 {
  position: absolute;
  text-align: right;
  width: 40%;
  bottom: 52%;
  left: -39%;
}
.cm-web-flow .step-3 {
  position: absolute;
  text-align: right;
  width: 50%;
  left: -38%;
  top: -25%;
}
.cm-web-flow .step-4 {
  top: -45%;
  position: absolute;
  left: 19%;
  width: 60%;
  text-align: center;
}

.cm-web-flow .step-5 {
  position: absolute;
  text-align: left;
  width: 50%;
  right: -38%;
  top: -25%;
}
.cm-web-flow .step-6 {
  position: absolute;
  text-align: left;
  width: 40%;
  bottom: 52%;
  right: -39%;
}
.cm-web-flow .step-7 {
  position: absolute;
  text-align: left;
  width: 40%;
  bottom: 7%;
  right: -44%;
}
.cm-web-flow .inner-content .wrp-col h6 {
  color: #263367;
  margin-bottom: 14px;
}
.cm-web-flow .inner-content .wrp-col p {
  font-size: 14px;
  margin-bottom: 0;
}
.cm-web-flow .inner-content .image-txt-wrp .txt-n {
  color: #fff;
  font-size: 19px;
  position: absolute;
}

.cm-web-flow .inner-content .image-txt-wrp .icon-img {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  height: 44px;
  width: 44px;
}

.cm-web-flow .inner-content .image-txt-wrp .num_text-1 {
  right: -38%;
  top: 43%;
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-1 {
  top:44%;
  right: -82%;
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-2 {
  bottom: -3%;
  right: -41%;
  transform: rotate(30deg);
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-2 {
  bottom: -49%;
  right: -77%;
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-3 {
  right: -40%;
  bottom: -79%;
  transform: rotate(60deg);
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-3 {
  right: -56%;
  bottom: -150%;
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-4 {
  right: 46.2%;
  bottom: -167%;
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-4 {
  right: 44%;
  bottom: -263%;
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-5 {
  left: -42%;
  bottom: -116%;
  transform: rotate(-60deg);
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-6 {
  bottom: -3%;
  left: -44%;
  transform: rotate(-30deg);
}
.cm-web-flow .inner-content .image-txt-wrp .num_text-7 {
  left: -38%;
  top: 41%;
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-7 {
  left: -81%;
  top: 42%;
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-6 {
  bottom: -43%;
  left: -79%;
}
.cm-web-flow .inner-content .image-txt-wrp .icon-img-5 {
  left: -59%;
  bottom: -205%;
}

.cm-web-flow .middle-section.ipad-view{
  display:none;
}



.cm-web-flow .inner-content .image-txt-wrp .icon-img{
  transition: 0.3s ease;

}

.cm-web-flow .inner-content .image-txt-wrp .txt-n{
  transition: 0.3s ease;
  cursor: pointer;
}



/*  eight steps*/


.cm-web-flow .bottom-section .wrp-col{
  height: 130px;
  overflow: auto;
  padding-right: 10px;
}

.cm-web-flow .bottom-section .wrp-col::-webkit-scrollbar{
  width: 0;
}
.cm-web-flow .bottom-section .wrp-col::-webkit-scrollbar-track{
  background: #263367;
}
.cm-web-flow .bottom-section .wrp-col::-webkit-scrollbar-thumb{
  background: #263367;
}
.cm-web-flow .bottom-section .wrp-col::-webkit-scrollbar-thumb:hover{
  background: #263367;
}

.cm-web-flow.eight_steps_main .step-8{
  position: absolute;
  text-align: left;

}

.cm-web-flow.eight_steps_main .inner-content .wrp-col p{
  line-height:1.4;
}


.cm-web-flow.eight_steps_main .img-ipad-view {
  display: none;
}

.cm-web-flow .bottom-section .step-num .image-txt-wrp,
.cm-web-flow .bottom-section .step-num .wrp-col {
  transition: 0.3s ease;
}



{# Dark Theme #}

.cm-web-flow.dark_theme  {
  background-color: #263367;
}
.cm-web-flow.dark_theme .top-section * {
  color: #ffffff;
}
.cm-web-flow.dark_theme .middle-section * {
  color: #ffffff;
}
.cm-web-flow.dark_theme .inner-content .wrp-col{
  color: #ffffff;
}
.cm-web-flow.dark_theme .inner-content .wrp-col h6{
  color: #ffffff;
}
.cm-web-flow.dark_theme .inner-content .wrp-col p{
  color: #ffffff;
}

.cm-web-flow.dark_theme .inner-content .image-txt-wrp .txt-n{
  color: #263367;
}


.cm-web-flow.nine_steps_main .middle-section h2 {
  font-size: 24px;
}

@media(min-width:1200px) {
  /* ninth steps */



  .cm-web-flow.nine_steps_main .bottom-section .inner-content {
    height: 561px;
  } 

  .cm-web-flow.nine_steps_main .middle-section {
    padding-top: 40%;
  }

  .cm-web-flow.nine_steps_main .step-1 {
    left: -43%;
    bottom: -12%;
  }

  .cm-web-flow.nine_steps_main  .step-2 {
    bottom: 19%;
    left: -43%;
  }
  .cm-web-flow.nine_steps_main .image-txt-wrp .num_text-1 {
    right: -86%;
    top: -45%;
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    right: -109%;
    top: -100%;
  }

  .cm-web-flow.nine_steps_main  .inner-content .image-txt-wrp .num_text-2 {
    bottom: 75%;
    right: -54%;
    transform: rotate(351deg);
  }

  .cm-web-flow.nine_steps_main  .inner-content .image-txt-wrp .icon-img-2 {
    bottom: 87%;
    right: -92%;
  }

  .cm-web-flow.nine_steps_main .step-3 {
    left: -53%;
    top: 24%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-3 {
    bottom: 32%;
    right: -48%;
    transform: rotate(25deg);
  }

  .cm-web-flow.nine_steps_main.inner-content .image-txt-wrp .icon-img-3 {
    bottom: -175%;
    right: -77%;
  }
  .cm-web-flow.nine_steps_main .step-4 {
    left: -17%;
    top: 0;
    width: 45%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-4 {
    bottom: 11%;
    right: -12%;
    transform: rotate(60deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    bottom: -50%;
    right: -32%;
  }

  .cm-web-flow.nine_steps_main .step-5 {
    right: 14%;
    top: -181px;
    width: 49%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: -109%;
    left: 25%;
    transform: rotate(272deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -174%;
    left: 21%;
  }
  .cm-web-flow.nine_steps_main .step-6 {
    bottom: 99%;
    right: -32%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-6 {
    bottom: -97%;
    left: -61%;
    transform: rotate(311deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -155%;
    left: -85%;
  }
  .cm-web-flow.nine_steps_main .step-7 {
    bottom: 66%;
    right: -48%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-7 {
    left: -70%;
    top: 118%;
    transform: rotate(346deg);
  }

  .cm-web-flow.nine_steps_main .step-8 {
    bottom: 15%;
    right: -51%;
  }

  .cm-web-flow.nine_steps_main .step-8 {
    position: absolute;
    text-align: left;
    width: 40%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-8 {
    left: -79%;
    top: 7%;
    transform: rotate(16deg);
  } 
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-8{
    left: -117%;
    top: -24%;
  }

  .cm-web-flow.nine_steps_main .step-9 {
    bottom: -89px;
    right: -49%;
    position: absolute;
    text-align: left;
    width: 40%;
  }


  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-9 {
    left: -109%;
    top: -45%;
    transform: rotate(49deg);
  } 
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-9{
    left: -131%;
    top: -109%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    bottom: 3%;
    right: -76%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-7 {
    left: -109%;
    top: 130%;
  }

  /* ninth steps end here  */



  {# Five STeps #}

  .cm-web-flow.five_steps_main .middle-section {
    padding-top: 45%;
  }
  .cm-web-flow.five_steps_main .step-1 {
    bottom: 15%;
  }
  .cm-web-flow.five_steps_main .step-2 {
    bottom: 75%;
    left: -35%;
  }
  .cm-web-flow.five_steps_main .step-3 {
    top: -40%;
    left: 23%;
    text-align: center;
  }
  .cm-web-flow.five_steps_main .step-4 {
    right: -38%;
    top: auto;
    left: auto;
    width: 45%;
    bottom: 75%;
  }

  .cm-web-flow.five_steps_main .step-5 {
    bottom: 15%;
    left: auto;
    right: -44%;
    top: auto;
    width: 40%;
  }

  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    top: 40%;
    right: -88%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-1 {
    right: -45%;
    top: 30%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -100%;
    right: -84%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-2 {
    bottom: -37%;
    right: -54%;
    transform: rotate(44deg);
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-3 {
    left: 51.5%;
    bottom: -105%;
    transform: rotate(0deg);
    right: auto;

  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    right: auto;
    bottom: -198%;
    left: 48%;
  }

  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-4 {
    left: -41%;
    bottom: -33%;
    right: auto;
    transform: rotate(-46deg);
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    right: auto;
    bottom: -100%;
    left: -68%;
  }

  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-5 {
    left: -43%;
    bottom: 56%;
    transform: rotate(-9deg);
  }

  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    left: -87%;
    bottom: 30%;
  }
  {# End Five STeps #}

  {# Six STeps #}

  .cm-web-flow.six_steps_main .middle-section {
    padding-top: 45%;
  }
  .cm-web-flow.six_steps_main .step-1 {
    bottom: 15%;
    left: -42%;
    width: 40%;

  }
  .cm-web-flow.six_steps_main .step-2 {
    bottom: 55%;
    left: -35%;
    width: 40%;
  }
  .cm-web-flow.six_steps_main .step-3 {
    top: -35%;
    left: -10%;
    width: 45%;
    text-align: right;
  }
  .cm-web-flow.six_steps_main .step-4 {
    left: auto;
    width: 45%;
    bottom: auto;
    top: -35%;
    right: -10%;
    text-align: left;
  }

  .cm-web-flow.six_steps_main .step-5 {
    bottom: 55%;
    left: auto;
    right: -35%;
    top: auto;
    width: 40%;
  }
  .cm-web-flow.six_steps_main .step-6 {
    bottom: 15%;
    right: -42%;
    width: 40%;
  }

  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    top: 42%;
    right: -87%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-1 {
    right: -45%;
    top: 47%;
    left: auto;
    bottom: auto;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -42%;
    right: -76%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-2 {
    bottom: 2%;
    right: -44%;
    transform: rotate(32deg);
    left: auto;
    top: auto;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-3 {
    left: auto;
    bottom: -93%;
    transform: rotate(-14deg);
    right: -10%;

  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    right: -24%;
    bottom: -171%;
    left: auto;
  }

  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-4 {
    right: auto;
    bottom: -93%;
    transform: rotate(20deg);
    left: -10%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    left: -24%;
    bottom: -171%;
    right: auto;
    top: auto;
  }

  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: 2%;
    left: -44%;
    transform: rotate(-32deg);
    right: auto;
  }

  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    right: auto;
    top: auto;
    bottom: -42%;
    left: -76%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .num_text-6 {
    left: -45%;
    top: 47%;
    bottom: auto;
    right: auto;
    transform: rotate(0deg);
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    top: 42%;
    left: -87%;
    right: auto;
  }

  {# End Six STeps #}

}


@media (min-width:1341px){
  .cm-web-flow.eight_steps_main .bottom-section .inner-content {
    height: 455px;
    width: 672px;
  }

  .cm-web-flow.eight_steps_main .middle-section {
    padding-top: 40%;
  }

  .cm-web-flow.eight_steps_main  .step-1 {
    left: -47%;
    bottom: 4%;
  }

  .cm-web-flow.eight_steps_main  .step-2 {
    bottom: 53%;
    left: -46%;
  }
  .cm-web-flow.eight_steps_main .image-txt-wrp .num_text-1 {
    right: -46%;
    top: 59%;
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    right: -89%;
    top: 35%;
  }

  .cm-web-flow.eight_steps_main  .inner-content .image-txt-wrp .num_text-2 {
    bottom: -43%;
    right: -49%;
    transform: rotate(15deg);
  }

  .cm-web-flow.eight_steps_main  .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -69%;
    right: -88%;
  }

  .cm-web-flow.eight_steps_main .step-3 {
    left: -53%;
    top: -29%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-3 {
    bottom: -110%;
    right: -52%;
    transform: rotate(46deg);
  }

  .cm-web-flow.eight_steps_main.inner-content .image-txt-wrp .icon-img-3 {
    bottom: -175%;
    right: -77%;
  }
  .cm-web-flow.eight_steps_main .step-4 {
    left: 37px;
    top: -49%;
    width: 45%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-4 {
    bottom: -133%;
    right: 18%;
    transform: rotate(76deg);
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    bottom: -219%;
    right: 6%;
  }

  .cm-web-flow.eight_steps_main .step-5 {
    right: -3%;
    top: -42%;
    width: 43%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: -102%;
    left: 0%;
    transform: rotate(291deg);
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -195%;
    left: -14%;
  }
  .cm-web-flow.eight_steps_main .step-6 {
    bottom: 88%;
    right: -46%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-6 {
    bottom: -72%;
    left: -69%;
    transform: rotate(321deg);
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -143%;
    left: -102%;
  }
  .cm-web-flow.eight_steps_main .step-7 {
    bottom: 45%;
    right: -46%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-7 {
    left: -42%;
    top: 98%;
    transform: rotate(346deg);
  }

  .cm-web-flow.eight_steps_main .step-8 {
    bottom: 6%;
    right: -46%;
  }

  .cm-web-flow.eight_steps_main .step-8 {
    position: absolute;
    text-align: left;
    width: 40%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-8 {
    left: -42%;
    top: 79%;
    transform: rotate(16deg);
  } 
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-8{
    left: -87%;
    top: 47%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    bottom: -180%;
    right: -77%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -196%;
    left: -14%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -141%;
    left: -102%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-7 {
    left: -86%;
    top: 112%;
  }

  /*start text*/
  .cm-web-flow.seven_steps_main.cm_webflow_height .inner-content .image-txt-wrp .num_text-1 {
    right: -38%;
    top: 32%;
  }

  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-4 {
    bottom: -123%;
    right: 46.2%;
  }

  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-5 {
    bottom: -83%;
    left: -42%;
  }

  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-7 {
    left: -38%;
    top: 30%;
  }

  /*end text*/

  /*start image */
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -48%;
    right: -77%;
  }



  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -155%;
    left: -60%;
  }

  .cm-web-flow.seven_steps_main.cm_webflow_height .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -51%;
    left: -78%;
  }

  /*end image*/
  .cm-web-flow.seven_steps_main .bottom-section .inner-content .image-txt-wrp:hover+.wrp-col{
    opacity: 0.8;
  }
  .cm-web-flow.seven_steps_main .bottom-section .inner-content .image-txt-wrp:hover .icon-img {
    transform: scale(1.03);
  }
  .cm-web-flow.seven_steps_main.bottom-section .inner-content .image-txt-wrp:hover .txt-n {
    opacity: 0.8;
  }


  .cm-web-flow.eight_steps_main .bottom-section .inner-content .image-txt-wrp:hover .icon-img {
    transform: scale(1.03);
  }
  .cm-web-flow.eight_steps_main .bottom-section .inner-content .image-txt-wrp:hover .txt-n {
    opacity: 0.8;
  }
  .cm-web-flow.eight_steps_main .bottom-section .inner-content .image-txt-wrp:hover + .wrp-col {
    opacity: 0.8;
  }

  /* Seven */
  .cm-web-flow.seven_steps_main .bottom-section .step-num .wrp-col {
    height: 130px;
    overflow: auto;
    padding-right: 10px;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-1 {
    right: -38%;
    top: 31%;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-2 {
    bottom: -3%;
    right: -41%;
    transform: rotate(30deg);
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-4 {
    bottom: -126%;
    right: 46.2%;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: -84%;
    left: -43%;
    transform: rotate(-60deg);
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: -84%;
    left: -43%;
    transform: rotate(-60deg);
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .num_text-7 {
    left: -38%;
    top: 29%;		
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    bottom: -156%;
    right: -57%;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    bottom: -206%;
    right: 44%;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -156%;
    left: -59%;
  }
  .cm-web-flow.seven_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -54%;
    left: -79%;
  }


  .cm-web-flow.eight_steps_main .bottom-section .inner-content .image-txt-wrp:hover+.wrp-col * {
    color: #fff;
  }

}


@media(min-width:1200px) and (max-width:1340px){
  .cm-web-flow .step-1 {
    bottom: 7%;
    left: -32%;
    width: 31%;
  }

  .cm-web-flow .inner-content .image-txt-wrp .num_text-1 {
    right: -42%;
    top: 50%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-1 {
    right: -96%;
    top: 51%;
  }

  .cm-web-flow .step-7 {
    bottom: 7%;
    right: -32%;
    width: 31%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .num_text-7 {
    left: -42%;
    top: 48%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-7 {
    left: -96%;
    top: 51%;
  }

  .cm-web-flow .step-2 {
    bottom: 53%;
    left: -32%;
    width: 35%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .num_text-2 {
    bottom: -4%;
    right: -41%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -38%;
    right: -82.2%;
  }

  .cm-web-flow .step-6 {
    bottom: 53%;
    right: -32%;
    width: 35%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .num_text-6 {
    bottom: -4%;
    left: -44%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -41%;
    left: -84.2%;
  }

  .cm-web-flow .step-3 {
    left: -26%;
    top: -32%;
    width: 40%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .num_text-3 {
    bottom: -67%;
    right: -44%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-3 {
    bottom: -131%;
    right: -66%;
  }

  .cm-web-flow .step-5 {
    right: -26%;
    top: -32%;
    width: 40%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .num_text-5 {
    bottom: -101%;
    left: -48%;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -173%;
    left: -70%;
  }

  /*   eight steps  */


  .cm-web-flow.eight_steps_main .bottom-section .inner-content {
    height: 464px;
  }

  .cm-web-flow.eight_steps_main .step-1 {
    bottom: 4%;
    left: -33%;
  }

  .cm-web-flow.eight_steps_main .image-txt-wrp .num_text-1 {
    right: -51%;
    top: 56%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    right: -99%;
    top: 33%;
  }

  .cm-web-flow.eight_steps_main .step-2 {
    bottom: 53%;
    left: -33%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-2 {
    bottom: -42%;
    right: -32%;
    transform: rotate(20deg);
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -67%;
    right: -78%;
  }

  .cm-web-flow.eight_steps_main .step-3 {
    left: -29%;
    top: -18%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-3 {
    bottom: -76%;
    right: -31%;
    transform: rotate(42deg);
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    bottom: -142%;
    right: -60%;  
  }

  .cm-web-flow.eight_steps_main .step-4 {
    left: 7%;
    top: -48%;
    width: 40%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-4{
    bottom: -121%;
    right: 12.8%;
    transform: rotate(254deg);
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    bottom: -217%;
    right: 6%;
  }
  .cm-web-flow.eight_steps_main .step-5{
    right: 9%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-5{
    bottom: -71%;
    left: 22%;
    transform: rotate(289deg);
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -164%;
    left: 6%;
  }

  .cm-web-flow.eight_steps_main .step-6 {
    bottom: 93%;
    right: -31%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-6 {
    bottom: -93%;
    left: -51%;
    transform: rotate(321deg);
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -165%;
    left: -87%;

  }

  .cm-web-flow.eight_steps_main .step-7 {
    bottom: 51%;
    right: -29%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-7 {
    left: -86%;
    top: 138%;
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-7{
    left: -30%;
    top: 122%;
    transform: rotate(350deg);
  }


  .cm-web-flow.eight_steps_main .step-8 {
    bottom: 7%;
    right: -31%;
    width: 30%;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .num_text-8 {
    bottom: -10%;
    left: -37%;
    transform: rotate(16deg);
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img-8 {
    left: -99%;
    top: 55%;

  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-2 {
    bottom: -51%;
    right: -83%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-1 {
    right: -38%;
    top: 31%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-3 {
    bottom: -109%;
    right: -46%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-3 {
    bottom: -178%;
    right: -65%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height .inner-content .image-txt-wrp .num_text-5 {
    bottom: -102%;
    left: -46%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -176%;
    left: -70%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-6 {
    bottom: -6%;
    left: -44%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -55%;
    left: -83%;
  }
  .cm-web-flow.seven_steps_main.cm_webflow_height  .inner-content .image-txt-wrp .num_text-7 {
    left: -38%;
    top: 28%;
  }

  {#  Five STeps #}
  .cm-web-flow.five_steps_main .bottom-section .inner-content {
    width: 660px;
  }

  .cm-web-flow.five_steps_main .step-5 {
    right: -38%;
    width: 35%;
  }
  .cm-web-flow.five_steps_main .step-3 {
    left: 31%;
    width: 40%;
  }

  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    right: -100%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-2 {
    right: -73%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-2 {
    right: -108%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    left: 40%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-3 {
    left: 44%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    left: -66%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .num_text-4 {
    left: -38%;
  }
  .cm-web-flow.five_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    left: -93%;

  }
  {# End Five STeps #}

  {#  Six STeps #}
  .cm-web-flow.six_steps_main .step-1 {
    left: -29%;
    width: 33%;
  }
  .cm-web-flow.six_steps_main .step-2 {
    left: -28%;
    width: 35%;
  }
  .cm-web-flow.six_steps_main .step-5 {
    right: -28%;
    width: 35%;
  }
  .cm-web-flow.six_steps_main .step-6 {
    bottom: 15%;
    right: -29%;
    width: 33%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-2 {
    right: -82%;
  }
  .cm-web-flow.six_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    left: -82%;
  }
  {# End Six STeps #}


  /*   ninth steps */

  .cm-web-flow.nine_steps_main .step-1 {
    left: -25%;
    bottom: -11%;
  }

  .cm-web-flow.nine_steps_main  .step-2 {
    bottom: 20%;
    left: -29%;
  }
  .cm-web-flow.nine_steps_main .image-txt-wrp .num_text-1 {
    right: -79%;
    top: -36%;
    transform: rotate(-47deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-1 {
    right: -109%;
    top: -100%;
  }

  .cm-web-flow.nine_steps_main  .inner-content .image-txt-wrp .num_text-2 {
    bottom: 74%;
    right: -45%;
    transform: rotate(350deg);
  }

  .cm-web-flow.nine_steps_main  .inner-content .image-txt-wrp .icon-img-2 {
    bottom: 84%;
    right: -81%;
  }

  .cm-web-flow.nine_steps_main .step-3 {
    left: -31%;
    top: 17%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-3 {
    bottom: 0%;
    right: -34%;
    transform: rotate(25deg);
  }

  .cm-web-flow.nine_steps_main.inner-content .image-txt-wrp .icon-img-3 {
    bottom: -24%;
    right: -66%;
  }
  .cm-web-flow.nine_steps_main .step-4 {
    left: -21%;
    top: -36px;
    width: 45%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-4 {
    bottom: -20%;
    right: -22%;
    transform: rotate(60deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-4 {
    bottom: -76%;
    right: -41%;
  }

  .cm-web-flow.nine_steps_main .step-5 {
    right: 14%;
    top: -181px;
    width: 49%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-5 {
    bottom: -109%;
    left: 25%;
    transform: rotate(272deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-5 {
    bottom: -176%;
    left: 22%;
  }
  .cm-web-flow.nine_steps_main .step-6 {
    bottom: 99%;
    right: -23%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-6 {
    bottom: -97%;
    left: -61%;
    transform: rotate(311deg);
  }
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-6 {
    bottom: -154%;
    left: -86%;

  }
  .cm-web-flow.nine_steps_main .step-7 {
    bottom: 66%;
    right: -23%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-7 {
    left: -43%;
    top: 119%;
    transform: rotate(346deg);
  }

  .cm-web-flow.nine_steps_main .step-8 {
    bottom: 15%;
    right: -40%;
  }

  .cm-web-flow.nine_steps_main .step-8 {
    position: absolute;
    text-align: left;
    width: 40%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-8 {
    left: -55%;
    top: 7%;
    transform: rotate(16deg);
  } 
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-8{
    left: -90%;
    top: -24%;
  }

  .cm-web-flow.nine_steps_main .step-9 {
    bottom: -89px;
    right: -29%;
    position: absolute;
    text-align: left;
    width: 40%;
  }


  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .num_text-9 {
    left: -60%;
    top: -45%;
    transform: rotate(49deg);
  } 
  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-9{
    left: -82%;
    top: -109%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-3 {
    bottom: 3%;
    right: -76%;
  }

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img-7 {
    left: -89%;
    top: 130%;
  }


  /*  end ninth steps*/

}



@media(max-width:1199px){

  .cm-web-flow.nine_steps_main .inner-content .image-txt-wrp .icon-img{
    filter: unset;
  }

  .cm-web-flow .bottom-section,
  .cm-web-flow.eight_steps_main{
    padding-top: 0;
  }
  .cm-web-flow {
    padding-bottom: 90px;
  }
  .cm-web-flow .page-center {
    padding-left: 0;
    padding-right: 0;
  }

  .cm-web-flow .middle-section {
    display: none;
    padding-top: 0;
  }

  .cm-web-flow .middle-section.ipad-view {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 50px;
  }
  .cm-web-flow .middle-section {
    padding-top: 0;
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
  }

  .cm-web-flow .middle-section h2 {
    width: auto;
    max-width: none;
    display: inline-block;
    margin: 0;
  }
  .cm-web-flow .bottom-section .inner-content .step-num {
    position: static !important;
  }
  .cm-web-flow .bottom-section .inner-content {
    display: flex;
    flex-wrap: wrap;
    height: auto;
    margin: 0 -10px;
    row-gap: 50px;
    width: auto;
    background-image: none !important;
  }
  .cm-web-flow .bottom-section .inner-content .step-num {
    position: static !important;
    width: 33.33%;
    padding: 0 10px;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
  }

  .cm-web-flow .inner-content .image-txt-wrp .txt-n, 
  .cm-web-flow .inner-content .image-txt-wrp .icon-img {
    position: static !important;
    color: inherit;
  }
  .cm-web-flow .inner-content .image-txt-wrp .icon-img {
    filter: invert(1);
  }
  .cm-web-flow .bottom-section .inner-content .image-txt-wrp {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
  }
  .cm-web-flow .inner-content .image-txt-wrp .txt-n {
    margin-right: 20px;
    transform: rotate(0);
    font-size: 24px;
    font-weight: 700;
  }

  .cm-web-flow .bottom-section .inner-content .image-txt-wrp {
    order: 1;
  }
  .cm-web-flow .bottom-section .step-num > div {
    order: 2;
  }
  .cm-web-flow .img-ipad-view img {
    width: 60px;
    margin-right: 20px;
  }
  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img {
    filter: unset;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .txt-n {
    color: #ffffff;
  }
  .cm-web-flow.eight_steps_main.cm_webflow_height .wrp-col {
    height: auto;
    overflow: unset;
  }
  .cm-web-flow.eight_steps_main {
    padding-bottom: 0;
  }

  .cm-web-flow.eight_steps_main .inner-content .image-txt-wrp .icon-img {
    filter: invert(1);
  }
  .cm-web-flow .middle-section h2 br {
    display: none;
  }

  .cm-web-flow.cm_webflow_height .wrp-col,
  .cm-web-flow.eight_steps_main.cm_webflow_height .wrp-col {
    height: auto;
  }


  .cm-web-flow.dark_theme .inner-content .image-txt-wrp .txt-n {
    color: #fff !important;
  }

}

@media(max-width:767px){
  .cm-web-flow {
    padding-bottom: 60px;
  }
  .cm-web-flow .bottom-section .inner-content .step-num {
    width: 100%;
  }
  .cm-web-flow .top-section{
    margin-bottom:30px;
  }
  .cm-web-flow .bottom-section .inner-content {
    margin: 0;
  }
  .cm-web-flow.cm_webflow_height .wrp-col,
  .cm-web-flow.eight_steps_main.cm_webflow_height .wrp-col,
  .cm-web-flow .bottom-section .inner-content .step-num{
    padding-right: 0;
    padding-left: 0;
  }
}


@media(max-width:479px){
  .cm-web-flow .middle-section.ipad-view {
    display: block;
  }
  .cm-web-flow .img-ipad-view img {
    width: 60px;
    margin: 0 auto;
  }
  .cm-web-flow .img-ipad-view {
    display: block;
  }

}