/**
 * Style border-only-button
 * */

.border-only-button {
}
.border-only-button {
}
.border-only-button {
}
.border-only-button {
}

/**
 * slidinging gradient-filled
 * */

/**
 * slidinging-gradintent-outlined
 * */

/**
 * slidinging gradient-filled
 * */

body.cx.rb_dev .cx_btn,
body.cx.rb_dev .cx_btn_el a {
  padding: 10px 20px;
  display: inline-block;
  /*font-size: 0.9em;*/
  /*font-weight: 500;*/
  text-align: center;
  border: none;
  outline: none;
  text-decoration: none;
  border-radius: var(--cx-btn-radius);
  cursor: pointer;
  /*text-transform: capitalize;*/
  display: inline-flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
}

.cx_btn .cx-custom-currency,
.cx_btn .cx_fn_feeling_lucky {
  display: flex;
  align-items: center;
}

/*primary*/
body.cx.rb_dev .cx_btn.cx_btn_primary,
body.cx.rb_dev .cx_btn_el.cx_btn_primary a {
  background-color: var(--e-primary);
  color: var(--e-btn-color);
  transition: all 0.2s ease-in;
}

body.cx.rb_dev .cx_btn.cx_btn_primary:hover,
body.cx.rb_dev .cx_btn_el.cx_btn_primary a:hover {
  background-color: var(--e-primary-dark);
  color: var(--e-btn-color);
}

/* primary gradient */
body.cx.rb_dev .cx_btn.cx_btn_primary_gradient,
body.cx.rb_dev .cx_btn_el.cx_btn_primary_gradient a {
  background-image: var(--cx-primary-gradient);
  color: var(--e-btn-color);
  transition: all 0.2s ease-in;
}

/* primary outline */
body.cx.rb_dev .cx_btn.cx_btn_primary_outline {
  background-color: transparent;
  color: var(--e-site-text-light);
  border: 2px solid var(--e-primary);
  display: block;
  font-size: 1em;
  font-weight: 500;
  transition: all 0.2s ease-in;
}

.cx_btn.cx_btn_primary_outline > i {
  color: var(--e-primary);
}

.cx_btn.cx_btn_primary_outline:hover {
  background-color: var(--e-primary);
  color: var(--e-primary-complement-light);
  transition: all 0.2s ease-in;
}
.cx_btn.cx_btn_primary_outline:hover > i {
  color: var(--e-primary-complement-light);
}

/* outline primary */
body.cx.rb_dev .cx_btn.cx_btn_primary_outline_round {
  background-color: transparent;
  color: var(--e-primary);
  border: 2px solid var(--e-primary);
  border-radius: var(--cx-radius-xl);
  font-size: 0.8em;
  display: block;
  transition: all 0.2s ease-in;
}

.cx_btn.cx_btn_primary_outline_round:hover {
  background-color: var(--e-primary);
  color: var(--e-primary-complement-light);
}

/*btn-color white
btn-color-rev grey-black
btn-secondary white
btn-secondary-dark grey-white */

/* secondary */
body.cx.rb_dev .cx_btn.cx_btn_secondary,
body.cx.rb_dev .cx_btn_el.cx_btn_secondary a {
  background-color: var(--e-bg-purple-2);
  color: var(--e-common-white);
  transition: all 0.2s ease-in;
}

body.cx.rb_dev .cx_btn.cx_btn_secondary span {
  position: relative;
  display: inline-block;
  transition: transform 0.2s;
}

body.cx.rb_dev .cx_btn.cx_btn_secondary:hover,
body.cx.rb_dev .cx_btn_el.cx_btn_secondary a:hover {
  background-color: var(--e-bg-orange);
  color: var(--e-common-white);
}

body.cx.rb_dev .cx_btn.cx_btn_secondary:hover span[data-hover]::after {
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  content: attr(data-hover);
  text-align: center;
}

body.cx.rb_dev .cx_btn.cx_btn_secondary:hover span[data-hover] {
  transform: translateY(-100%);
  transform-origin: 0% 0%;
}

/* secondary outline */
body.cx.rb_dev .cx_btn.cx_btn_secondary_outline,
body.cx.rb_dev .cx_btn_el.cx_btn_secondary_outline a {
  background-color: transparent;
  color: var(--e-common-white);
  border: 1.5px solid var(--e-border-white-01);
  transition: all 0.2s ease-in;
}

body.cx.rb_dev .cx_btn.cx_btn_secondary_outline:hover,
body.cx.rb_dev .cx_btn_el.cx_btn_secondary_outline a:hover {
    background-color: var(--e-bg-purple);
    border-color: var(--e-common-white);
    color: var(--e-common-white);
}

/* tertiary */
body.cx.rb_dev .cx_btn.cx_btn_tertiary,
body.cx.rb_dev .cx_btn_el.cx_btn_tertiary a {
  background-color: var(--e-bg-dark-grey-blue);
  color: var(--e-text-white-095);
  transition: all 0.2s ease-in;
  border: 1px solid var(--e-border-dark-grey-blue);
}



body.cx.rb_dev .cx_btn.cx_btn_tertiary:hover,
body.cx.rb_dev .cx_btn_el.cx_btn_tertiary a:hover {
  background-color: var(--e-bg-orange);
  color: var(--e-text-white-095);
  border: 1px solid var(--e-border-dark-grey-blue);
}



/* simple */
body.cx.rb_dev .cx_btn.cx_btn_simple,
body.cx.rb_dev .cx_btn_el.cx_btn_simple a {
  padding: 0;
  background-color: transparent;
  color: var(--e-yellow-1);
  fill: var(--e-yellow-1);
}

body.cx.rb_dev .cx_btn.cx_btn_simple svg,
body.cx.rb_dev .cx_btn_el.cx_btn_simple a svg{
  width: 22px;
}

.cx_btn .loading-icon-container {
  display: none;
}

.cx_btn.cx_btn_icon {
  padding: 7px 7px;
  font-style: 0.7em;
}
.cx_btn.cx_btn_icon.cx-ajax-loading > .button-icon {
  display: none;
}

.cx-ajax-loading .loading-icon-container {
  display: inline-block;
  animation-name: rotate_complete;
  animation-duration: 0.8s;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
}

/**/
body.cx.rb_dev .cx_btn_mini_primary {
  padding: 5px 7px;
  background-color: var(--e-body-secondary-bg);
  color: #ffffff;
  border-radius: var(--cx-btn-radius);
}

/* code from front.css start */

.btn-block,
.btn-block_el a {
  display: block;
  width: 100%;
}

.btn_white,
.cx_btn_el.cx_btn_primary.btn_white_el a {
  background-color: #ffffff;
  color: var(--e-btn-color-rev);
}

/* code from front.css ends */

/*code from base.css moved here */
body.cx.rb_dev .btn-primary,
.cx-btn-primary {
  background: #566984;
  border-color: #40526b;
  color: white;
}
body.cx.rb_dev .btn-primary:hover,
.cx-btn-primary:hover {
  background: #536f96;
}

.btn.cx-btn-outline {
  border: 2px solid #566984;
  background-color: transparent;
  padding: 7px 20px;
  color: #566984;
  font-size: 1rem;
  font-weight: 500;
  transition: all 0.2s ease-in;
}
.btn.cx-btn-outline:hover {
  border-color: #d88821;
  color: #d88821;
}

.btn-secondary {
  background: #272626;
  border: 1px solid #0e0e0e;
}
.btn-secondary:hover {
  background: #464343;
}


/*for hover underline*/

body.cx.rb_dev .cx_btn.cx_btn_hover_underline ,
body.cx.rb_dev .cx_btn_el.cx_btn_hover_underline a {
  position: relative;
  padding: 0;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_underline::after ,
body.cx.rb_dev .cx_btn_el.cx_btn_hover_underline a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 1px;
    background-color: currentColor;
    content: "";
    transition: 0.4s;
    opacity: 0;
    visibility: hidden;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_underline:hover::after ,
body.cx.rb_dev .cx_btn_el.cx_btn_hover_underline a:hover::after {
    width: 100%;
    opacity: 1;
    visibility: visible;
}

/* for hover underline from center  */

body.cx.rb_dev .cx_btn.cx_btn_hover_underline_center {
    position: relative;
    padding: 0;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_underline_center:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0%;
    height: 1px;
    background-color: currentColor;
    content: "";
    transition: 0.4s;
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_underline_center:hover::after,
body.cx.rb_dev .cx_btn.cx_btn_hover_underline_center.active::after {
    width: 100%;
    opacity: 1;
    visibility: visible;
}

/*for hover top dot*/

body.cx.rb_dev .cx_btn.cx_btn_hover_top_dot {
    position: relative;
    padding: 0;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_top_dot::before{
    position: absolute;
    content: "";
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: currentColor;
    transition: 0.3s;
    opacity: 0;
    visibility: hidden;
}

body.cx.rb_dev .cx_btn.cx_btn_hover_top_dot:hover::before,
body.cx.rb_dev .cx_btn.cx_btn_hover_top_dot.active::before {
    opacity: 1;
    visibility: visible;
    top: -10px;
}

/*radius */

body.cx.rb_dev .cx_btn.radius-100,
body.cx.rb_dev .cx_btn_el.radius-100 a {
  border-radius:100px;
}

/* padding */

body.cx.rb_dev .cx_btn.p115{
  padding: 0 115px;
}

@media (max-width: 767px) {

  body.cx.rb_dev .cx_btn.p115{
    padding: 0 45px;
  }
  
}

body.cx.rb_dev .cx_btn.p45 {
  padding:0 45px;
} 

body.cx.rb_dev .cx_btn.p30,
 body.cx.rb_dev .cx_btn_el.p30 a{
  padding: 0 30px;
}
/*height*/

body.cx.rb_dev .cx_btn.height-54 {
  height:54px;
}

body.cx.rb_dev .cx_btn.height-50,
body.cx.rb_dev .cx_btn_el.height-50 a {
  height:50px;
}

/*reomve br tag from button*/

body.cx.rb_dev .cx_btn br {display: none;}


/*testimonial arrow btn*/

.cx_arrow_btn_wrapper .cx_arrow_btn .arrow-icon {
    transition:all 0.4s;
}

.cx_arrow_btn_wrapper:hover .cx_arrow_btn .next-arrow-icon {
    transform: translate(20px, -20px);
}

.cx_arrow_btn_wrapper:hover .cx_arrow_btn .pre-arrow-icon {
    transform: translate(-20px, 20px);
}

/*active*/

.hover-color--e-yellow-1.active {
  color: var(--e-yellow-1);
}


/*contact form 7 spinner*/


.cx_btn .wpcf7-spinner {
  margin: 0;
  width: 0;
  height: 0;
  align-self: center;
}

.cx_btn .wpcf7-spinner::before {
  top: 0;
}