/* btn Style 1 Variables */
.navFootBtnList .btnTypeStyle1.zf-save {
  border: 1px solid rgba(var(--savebtn1-active-bdr-clr));
	color: rgba(var(--savebtn1-active-text-clr));
	background: rgba(var(--savebtn1-active-bg-clr));
}
.navFootBtnList .btnTypeStyle1.zf-save:hover {
  border-color: rgba(var(--savebtn1-hover-bdr-clr));
}
.navFootBtnList .btnTypeStyle1.zf-save em {
	color: rgba(var(--savebtn1-active-text-clr));
}
.navFootBtnList .btnTypeStyle1.zf-save:hover em {
	color: rgba(var(--savebtn1-hover-text-clr));
}
.navFootBtnList .btnTypeStyle1.zf-save:after {
	background-color: rgba(var(--savebtn1-hover-bg-clr));
}
/* btn Style 1 Variables End*/

/* btn Style 2 Variables */
.navFootBtnList .btnTypeStyle2.zf-save {
  background: rgba(var(--savebtn2-active-bg-clr));
  color: rgba(var(--savebtn2-active-text-clr));
  border: 3px solid rgba(var(--savebtn2-active-bdr-clr));
  box-shadow: 0.1em 0.1em rgba(var(--savebtn2-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle2.zf-save:hover {
  box-shadow: 0.25em 0.25em rgba(var(--savebtn2-active-bdr-clr));
}
/* btn Style 2 Variables End*/

/* btn Style 3 Variables*/
.navFootBtnList .btnTypeStyle3.zf-save {
   background: rgba(var(--savebtn3-active-bg-clr));
  border: 1px solid rgba(var(--savebtn3-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle3.zf-save em {
   color: rgba(var(--savebtn3-active-text-clr));
}
.navFootBtnList .btnTypeStyle3.zf-save::after {
  background: rgba(var(--savebtn3-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle3.zf-save::before {
 background: rgba(var(--savebtn3-hover-bg-clr));
}
/* btn Style 3 Variables end*/

/* btn Style 4 Variables*/
.navFootBtnList .btnTypeStyle4.zf-save::before, .navFootBtnList .btnTypeStyle4.zf-save::after {
    border-left: 1px solid rgba(var(--savebtn4-active-bdr-clr));
    border-top: 1px solid rgba(var(--savebtn4-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle4.zf-save::after {
    border-left: none !important;
    border-right: 1px solid rgba(var(--savebtn4-active-bdr-clr));
    border-bottom: 1px solid rgba(var(--savebtn4-active-bdr-clr));
    border-top: none !important;
}
.navFootBtnList .btnTypeStyle4.zf-save em {
    color: rgba(var(--savebtn4-active-text-clr));
    background-color: rgba(var(--savebtn4-active-bg-clr));
}
/* btn Style 4 Variables end*/

/* btn Style 5 Variables */
.navFootBtnList .btnTypeStyle5.zf-save {
  /* background-color: rgba(var(--submitbtn5-active-bg-clr)); */
  color: rgba(var(--savebtn5-active-text-clr));
  -webkit-mask-image: -webkit-radial-gradient(rgba(var(--savebtn5-active-bg-clr)), rgba(var(--savebtn5-active-text-clr)));
}

.navFootBtnList .btnTypeStyle5.zf-save:after {
  background: rgba(var(--savebtn5-active-bg-clr));
}
/* btn Style 5 Variables End*/


/* btn Style 6 Variables */
.navFootBtnList .btnTypeStyle6.zf-save {
  background: rgba(var(--savebtn6-active-bg-clr));
  color: rgba(var(--savebtn6-active-text-clr));
}

.navFootBtnList .btnTypeStyle6.zf-save::before {
  border: 1px solid rgba(var(--savebtn6-active-bdr-clr));
}
/* btn Style 6 Variables End */

/* btn Style 7 Variables */
.navFootBtnList .btnTypeStyle7.zf-save {
    color: rgba(var(--savebtn7-active-text-clr));
    background: rgba(var(--savebtn7-active-bg-clr));
    box-shadow: 0 8px 0 rgba(var(--savebtn7-shadow-clr));
}
.navFootBtnList .btnTypeStyle7.zf-save:active {
  box-shadow: 0 0 0 rgba(var(--savebtn7-active-shadow-clr));
}
/* btn Style 7 Variables End */


/* btn Style 8 Variables */
.navFootBtnList .btnTypeStyle8.zf-save {
    color: rgba(var(--savebtn8-active-text-clr));
    background-color: rgba(var(--savebtn8-active-bg-clr));
    border: 1px solid rgba(var(--savebtn8-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle8.zf-save::before {
  background-image: radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bdr-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    /*  */
      radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bdr-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, rgba(var(--savebtn8-active-bg-clr)) 20%, transparent 20%),
    radial-gradient(circle, transparent 10%, rgba(var(--savebtn8-active-bdr-clr))  20%, transparent 20%);
}
/* btn Style 8 Variables End */

/* btn Style 9 Variables */

.navFootBtnList .btnTypeStyle9.zf-save {
 color: rgba(var(--savebtn9-active-text-clr));
 background: rgba(var(--savebtn9-active-bg-clr));
 border: 2px solid rgba(var(--savebtn9-active-bdr-clr));
}

.navFootBtnList .btnTypeStyle9.zf-save::before {
 background: rgba(var(--savebtn9-active-bg-clr));
 box-shadow: 0 0 0 2px rgba(var(--savebtn9-active-bdr-clr)), 0 -0.55em 0 0 rgba(var(--savebtn9-active-bdr-clr));
}

.navFootBtnList .btnTypeStyle9.zf-save:hover::before {
 box-shadow: 0 0 0 2px rgba(var(--savebtn9-active-bdr-clr)), 0 -0.55em 0 0 rgba(var(--savebtn9-active-bdr-clr));
}

.navFootBtnList .btnTypeStyle9.zf-save:active::before {
 box-shadow: 0 0 0 2px rgba(var(--savebtn9-active-bdr-clr)), 0 0 rgba(var(--savebtn9-active-bdr-clr));
}
/* btn Style 9 Variables End */

/* btn Style 10 Variables */
.navFootBtnList .btnTypeStyle10.zf-save {
  border: .3px solid rgba(var(--savebtn10-active-bdr-clr));
  color: rgba(var(--savebtn10-active-text-clr));
}
.navFootBtnList .btnTypeStyle10.zf-save::after, .navFootBtnList .btnTypeStyle10.zf-save::before {
  background-color: rgba(var(--savebtn10-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle10.zf-save:hover em{
 color: rgba(var(--savebtn10-hover-text-clr));
}
/* btn Style 10 Variables End */


/* btn Style 11 Variables */
.navFootBtnList .btnTypeStyle11.zf-save {
  background-color: rgba(var(--savebtn11-active-bg-clr));
  color: rgba(var(--savebtn11-active-text-clr));
}

.navFootBtnList .btnTypeStyle11.zf-save:before {
  background: rgba(var(--savebtn11-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle11.zf-save:hover {
  color: rgba(var(--savebtn11-hover-text-clr));
}
/* btn Style 11 Variables end */

/* btn Style 12 Variables */
.navFootBtnList .btnTypeStyle12.zf-save {
  color: rgba(var(--savebtn12-active-text-clr));
  background: rgba(var(--savebtn12-active-bg-clr));
}

.navFootBtnList .btnTypeStyle12.zf-save::before {
  background-color: rgba(var(--savebtn12-hover-bg-clr));
}

.navFootBtnList .btnTypeStyle12.zf-save:hover {
  color: rgba(var(--savebtn12-hover-text-clr));
}
/* btn Style 12 Variables end*/


/* btn Style 13 Variables*/
.navFootBtnList .btnTypeStyle13.zf-save {
  border: 1px solid rgba(var(--savebtn13-active-bdr-clr));
  color: rgba(var(--savebtn13-active-text-clr));
}

.navFootBtnList .btnTypeStyle13.zf-save:hover {
  background: rgba(var(--savebtn13-hover-bg-clr));
  color: rgba(var(--savebtn13-hover-text-clr));
}

/* btn Style 13 Variables end*/

/* btn Style 14 Variables*/
.navFootBtnList .btnTypeStyle14.zf-save {
  background: rgba(var(--savebtn14-active-bg-clr));
  border: 2px solid rgba(var(--savebtn14-active-bdr-clr));
  color: rgba(var(--savebtn14-active-text-clr));
}

.navFootBtnList .btnTypeStyle14.zf-save:before {
  background-color: rgba(var(--savebtn14-hover-bg-clr));
}

.navFootBtnList .btnTypeStyle14.zf-save:hover, .navFootBtnList .btnTypeStyle14.zf-save:focus {
  color: rgba(var(--savebtn14-hover-text-clr));
}
/* btn Style 14 Variables End*/


/* btn Style 15 Variables*/
.navFootBtnList .btnTypeStyle15.zf-save {
  border: 3px solid rgba(var(--savebtn15-active-bdr-clr));
  background: rgba(var(--savebtn15-active-bg-clr));
  color: rgba(var(--savebtn15-active-text-clr));
}
.navFootBtnList .btnTypeStyle15.zf-save:hover {
  color: rgba(var(--savebtn15-hover-text-clr));
}

.navFootBtnList .btnTypeStyle15.zf-save:hover::after,
.navFootBtnList .btnTypeStyle15.zf-save:hover::before {
  border-color: rgba(var(--savebtn15-hover-bdr-clr));
}
/* btn Style 15 Variables End*/

/* btn Style 16 Variables*/
.navFootBtnList .btnTypeStyle16.zf-save {
    color: rgba(var(--savebtn16-active-text-clr));
}
.navFootBtnList .btnTypeStyle16.zf-save::before {
    background: rgba(var(--savebtn16-active-bg-clr));
}
.navFootBtnList .btnTypeStyle16.zf-save:hover::before {
    background: rgba(var(--savebtn16-active-bg-clr));
}
/* btn Style 16 Variables End*/

/* btn Style 17 Variables*/

.navFootBtnList .btnTypeStyle17.zf-save {
    color: rgba(var(--savebtn17-active-text-clr));
}
.navFootBtnList .btnTypeStyle17.zf-save:after {
  background-color: rgba(var(--savebtn17-active-bg-clr));
}
.navFootBtnList .btnTypeStyle17.zf-save:before {
  background-color: rgba(var(--savebtn17-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle17.zf-save:hover {
  color: rgba(var(--savebtn17-active-text-clr));;
}
/* btn Style 17 Variables end*/

/* btn Style 18 Variables*/
.navFootBtnList .btnTypeStyle18.zf-save::before {
    background: rgba(var(--savebtn18-active-bg-clr));
}
.navFootBtnList .btnTypeStyle18.zf-save::after {
    border: 1px solid rgba(var(--savebtn18-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle18.zf-save em {
    color: rgba(var(--savebtn18-active-text-clr));
}
/* btn Style 18 Variables end*/

/* btn Style 19 Variables */
.navFootBtnList .btnTypeStyle19.zf-save {
    color: rgba(var(--savebtn19-active-text-clr));
    border: 2px solid rgba(var(--savebtn19-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle19.zf-save:hover {
   color: rgba(var(--savebtn19-hover-text-clr));
}
.navFootBtnList .btnTypeStyle19.zf-save:after {
    background: rgba(var(--savebtn19-hover-bg-clr));
}
/* btn Style 19 Variables end*/

/* btn Style 20 Variables */
.navFootBtnList .btnTypeStyle20.zf-save {
    color: rgba(var(--savebtn20-active-text-clr));
    border: 2px solid rgba(var(--savebtn20-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle20.zf-save:after {
    background: rgba(var(--savebtn20-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle20.zf-save:hover {
    color: rgba(var(--savebtn20-hover-text-clr));
}
/* btn Style 20 Variables End */


/* btn Style 21 Variables */
.navFootBtnList .btnTypeStyle21.zf-save {
    color: rgba(var(--savebtn21-active-text-clr));
    border: 2px solid rgba(var(--savebtn21-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle21.zf-save:after {
    background: rgba(var(--savebtn21-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle21.zf-save:hover {
    color: rgba(var(--savebtn21-hover-text-clr));
}
/* btn Style 21 Variables End */

/* btn Style 22 Variables */
.navFootBtnList .btnTypeStyle22.zf-save {
    color: rgba(var(--savebtn22-active-text-clr));
    border: 2px solid rgba(var(--savebtn22-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle22.zf-save:after {
    background: rgba(var(--savebtn22-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle22.zf-save:hover {
    color: rgba(var(--savebtn22-hover-text-clr));
}
/* btn Style 22 Variables End*/

/* btn Style 23 Variables */
.navFootBtnList .btnTypeStyle23.zf-save {
    color: rgba(var(--savebtn23-active-text-clr));
    border: 2px solid rgba(var(--savebtn23-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle23.zf-save:after {
    border: 3px solid rgba(var(--savebtn23-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle23.zf-save:hover em {
      color: rgba(var(--savebtn23-hover-text-clr));
}
/* btn Style 23 Variables End*/

/* btn Style 24 Variables */
.navFootBtnList .btnTypeStyle24.zf-save {
    color: rgba(var(--savebtn24-active-text-clr));
    border: 2px solid rgba(var(--savebtn24-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle24.zf-save:after {
    border: 3px solid rgba(var(--savebtn24-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle24.zf-save:hover em{
      color: rgba(var(--savebtn24-hover-text-clr));
}
/* btn Style 24 Variables End*/

/* btn Style 25 Variables */
.navFootBtnList .btnTypeStyle25.zf-save {
    color: rgba(var(--savebtn25-active-text-clr));
    border: 2px solid rgba(var(--savebtn25-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle25.zf-save:after {
    border: 3px solid rgba(var(--savebtn25-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle25.zf-save:hover em{
      color: rgba(var(--savebtn25-hover-text-clr));
}
/* btn Style 25 Variables End*/

/* btn Style 26 Variables */
.navFootBtnList .btnTypeStyle26.zf-save {
    color: rgba(var(--savebtn26-active-text-clr));
    border: 2px solid rgba(var(--savebtn26-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle26.zf-save:after {
    border: 3px solid rgba(var(--savebtn26-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle26.zf-save:hover em{
      color: rgba(var(--savebtn26-hover-text-clr));
}
/* btn Style 26 Variables End*/

/* btn Style 27 Variables */
.navFootBtnList .btnTypeStyle27.zf-save {
    color: rgba(var(--savebtn27-active-text-clr));
    border: 2px solid rgba(var(--savebtn27-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle27.zf-save:before {
    color: rgba(var(--savebtn27-hover-text-clr));
    background: rgba(var(--savebtn27-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle27.zf-save:hover {
    color: rgba(var(--savebtn27-hover-text-clr));
}
/* btn Style 27 Variables End*/

/* btn Style 28 Variables */
.navFootBtnList .btnTypeStyle28.zf-save {
    color: rgba(var(--savebtn28-active-text-clr));
    border: 2px solid rgba(var(--savebtn28-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle28.zf-save:before {
    color: rgba(var(--savebtn28-hover-text-clr));
    background: rgba(var(--savebtn28-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle28.zf-save:hover {
    color: rgba(var(--savebtn28-hover-text-clr));
}
/* btn Style 28 Variables End*/

/* btn Style 29 Variables */
.navFootBtnList .btnTypeStyle29.zf-save {
    color: rgba(var(--savebtn29-active-text-clr));
    border: 2px solid rgba(var(--savebtn29-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle29.zf-save:before {
    color: rgba(var(--savebtn29-hover-text-clr));
    background: rgba(var(--savebtn29-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle29.zf-save:hover {
    color: rgba(var(--savebtn29-hover-text-clr));
}
/* btn Style 29 Variables End*/

/* btn Style 30 Variables */
.navFootBtnList .btnTypeStyle30.zf-save {
    color: rgba(var(--savebtn30-active-text-clr));
    border: 2px solid rgba(var(--savebtn30-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle30.zf-save:before {
    color: rgba(var(--savebtn30-hover-text-clr));
    background: rgba(var(--savebtn30-hover-bg-clr));
}
.navFootBtnList .btnTypeStyle30.zf-save:hover {
    color: rgba(var(--savebtn30-hover-text-clr));
}
/* btn Style 30 Variables End*/

/* btn Style 31 Variables */
.navFootBtnList .btnTypeStyle31.zf-save {
    background-color: rgba(var(--savebtn31-active-bg-clr));
    color: rgba(var(--savebtn31-active-text-clr));
    border: 2px solid rgba(var(--savebtn31-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle31.zf-save:after {
    background-image: repeating-linear-gradient(45deg, rgba(var(--savebtn31-active-bdr-clr)), rgba(var(--savebtn31-active-bdr-clr)) 1px, transparent 2px, transparent 5px);
    border-top: 1px solid rgba(var(--savebtn31-active-bdr-clr));
}
.navFootBtnList .btnTypeStyle31.zf-save:hover {
    background-color: rgba(var(--savebtn31-hover-bg-clr));
    color: rgba(var(--savebtn31-hover-text-clr));
    border-color: rgba(var(--savebtn31-hover-bdr-clr));
}
.navFootBtnList .btnTypeStyle31.zf-save:hover:after {
    background-image: repeating-linear-gradient(45deg, rgba(var(--savebtn31-hover-text-clr)), rgba(var(--savebtn31-hover-text-clr)) 1px, transparent 2px, transparent 5px);
    border-top: 1px solid rgba(var(--savebtn31-hover-bdr-clr));
}
@keyframes modelType31 {
0% {
    background-position: 0% 0;
}

100% {
    background-position: 100% 0;
}
}

/* btn Style 31 Variables End */






/* Default Shape CSS */
.navFootBtnList .zf-save.btnType1 {
  --save-btn-radius: 0px;
  /* --submit-btn-radius: 0px;
  --save-btn-radius: 0px;
  --review-btn-radius: 0px;
  --next-btn-radius: 0px;   */
}

.zf-save.btnType2 {
  --save-btn-radius: 8px;
  /* --submit-btn-radius: 8px;
  --save-btn-radius: 8px;
  --review-btn-radius: 8px;
  --next-btn-radius: 8px;   */
}

.zf-save.btnType3 {
  --save-btn-radius: 150px;
  /* --submit-btn-radius: 150px;
  --save-btn-radius: 150px;
  --review-btn-radius: 150px;
  --next-btn-radius: 150px;   */
}