/* BOTONES */



.btn .vce-button {

  position: relative;

  margin: auto;

  padding: 19px 22px;

  transition: all 0.5s ease-out;

  background: transparent !important;

  color: var(--c-primario-dark) !important;

  border: solid 2px var(--c-primario-dark);



  font-family: inherit !important;

}



.vce-button--style-outline-text {

  font-family: inherit !important;

  text-transform: uppercase;

  color: inherit;

  font-weight: 400;

  font-size: 18px;

}



.btn .vce-button:before{

  content: "";

  display: block;

  position: absolute;

  top: 0 !important;

  bottom: 0;

  left: -4px;

  right: 0;

  height: 100%;

  width: 0%;

  background-color: var(--c-primario-dark);

  transition: all 0.5s ease-out;

  z-index: -1;

}



.btn .vce-button:hover:before {

  width: 104%;

}



.btn .vce-button:hover {

  color: var(--c-blanco) !important;

 }



/* BOTÓN BLANCO */





.btn-white .vce-button {

  position: relative;

  margin: auto;

  padding: 19px 22px;

  transition: all 0.5s ease-out;

  background: #ffffff1f !important;

  color: var(--c-blanco) !important;

  border: solid 2px var(--c-blanco);



  font-family: inherit !important;

}



.btn-white .vce-button:hover {

  color: var(--c-primario-dark) !important;

}



.btn-white .vce-button::before {

  content: "";

  display: block;

  position: absolute;

  top: 0 !important;

  bottom: 0;

  left: -4px;

  right: 0;

  height: 100%;

  width: 0%;

  background-color: var(--c-blanco);

  transition: all 0.5s ease-out;

  z-index: -1;

}





.btn-white .vce-button:hover::before {

  width: 104%;



}





/* BOTÓN ENVÍO FORMULARIO */







.btn-enviar input[type=submit] {



    color: var(--c-blanco) !important;



    box-shadow: 0 0 10px rgba(0,0,0,0.15);



    padding: 16px 20px;



    margin: 0px;



    position: relative;



    border-left: 7px solid var(--c-negro) !important;



    border-right: 7px solid var(--c-negro) !important;



    background-color: var(--c-primario) !important;



    text-transform: uppercase;



    font-size: 1rem /*16px*/ !important;



    font-weight: 600;



    letter-spacing: 0.05rem;



    overflow: hidden;



    display: inline-block;



    z-index: 1;



}







.btn-enviar input[type=submit]:hover {



  color: var(--c-negro) !important;



  background-color: var(--c-blanco) !important;



}







.btn-enviar input[type=submit]::after {



  content: "";



  background: var(--c-negro);



  position: absolute;



  z-index: -1;



  padding: 16px 20px;



  display: block;



  top: 0;



  bottom: 0;



  left: -100%;



  right: 100%;



  -webkit-transition: all 0.35s;



  transition: all 0.35s;



}







.btn-enviar input[type=submit]:hover::after {



  left: 0;



  right: 0;



  top: 0;



  bottom: 0;



  -webkit-transition: all 0.35s;



  transition: all 0.35s;



}