.slide {

  -webkit-animation: slide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

  animation: slide 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

}

/* ----------------------------------------------

* Generated by Animista on 2023-2-15 21:58:21

* Licensed under FreeBSD License.

* See http://animista.net/license for more info. 

* w: http://animista.net, t: @cssanimista

* ---------------------------------------------- */



/**

* ----------------------------------------

* animation slide-in-right

* ----------------------------------------

*/

.slide-logo {

  -webkit-animation: slide-logo 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

  animation: slide-logo 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

}

/* ----------------------------------------------

 * Generated by Animista on 2023-2-16 13:34:24

 * Licensed under FreeBSD License.

 * See http://animista.net/license for more info. 

 * w: http://animista.net, t: @cssanimista

 * ---------------------------------------------- */



/**

 * ----------------------------------------

 * animation slide-in-top

 * ----------------------------------------

 */

@-webkit-keyframes slide-logo {

  0% {

    -webkit-transform: translateY(-1000px);

    transform: translateY(-1000px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(0);

    transform: translateY(0);

    opacity: 1;

  }

}

@keyframes slide-logo {

  0% {

    -webkit-transform: translateY(-1000px);

    transform: translateY(-1000px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(0);

    transform: translateY(0);

    opacity: 1;

  }

}



@-webkit-keyframes slide {

  0% {

    -webkit-transform: translateX(1000px);

    transform: translateX(1000px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

    opacity: 1;

  }

}

@keyframes slide {

  0% {

    -webkit-transform: translateX(1000px);

    transform: translateX(1000px);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

    opacity: 1;

  }

}



body{

  display: flex;

  flex-direction: column;

}



#content {

  margin: 0;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#33658a+25,2f4858+80 */

background: #33658a; /* Old browsers */

background: -moz-linear-gradient(45deg,  #33658a 25%, #2f4858 80%); /* FF3.6-15 */

background: -webkit-linear-gradient(45deg,  #33658a 25%,#2f4858 80%); /* Chrome10-25,Safari5.1-6 */

background: linear-gradient(45deg,  #33658a 25%,#2f4858 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33658a', endColorstr='#2f4858',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */



}



#formulario{

  background-color: rgba(255, 255, 255, 0.139) !important;

  border: 2px rgba(255, 255, 255, 0.148) solid !important;

  box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.2), 0 6px 20px 0 rgba(255, 255, 255, 0.19) !important;

}

#email{
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}
#passtype {
  position: relative;
}
#password{
  padding-right: 30px;

}
#eye {
  position: absolute;
  display: inline;
  right: 1px;
  cursor: pointer;
  top: 37px
}