@charset "utf-8";
/* CSS Document */

#mitoast {
  visibility: hidden;
  position: fixed;
  z-index: 10000;
  right: 2.5%;
  top: 10%;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: .25rem;
  box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,.1);
  max-width: 310px;
  width: 310px;
  opacity: 1;
}

.toast-header {
    padding: 0.25rem 0.75rem;
    background-clip: padding-box;
    font-size: 16px;
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.toast-body {
    padding: 0.75rem;
    background-color: #FFF;
    font-size: 16px;
}

.titulo-success {
    color: #3c763d;
    background-color: #dff0d8;
}

.titulo-info {
    color: #31708f;
    background-color: #d9edf7;
}

.titulo-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
}

.titulo-danger {
    color: #545454;
    background-color: #F2DEDE;
}
 

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}
    

.text-muted {
    color: #6c757d!important;
	align: right;
}


#mitoast.mostrar {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 9.6s;
  animation: fadein 0.5s, fadeout 0.5s 9.6s;
}

#mitoast.toast-body-success {
    border-color: #d6e9c6;
}

#mitoast.toast-body-info {
    border-color: #bce8f1;
}

#mitoast.toast-body-warning {
    border-color: #faebcc;
}

#mitoast.toast-body-danger {
  border-color: #D0021B;
}
 
@-webkit-keyframes fadein {
  from {right: 0; opacity: 0;} 
  to {right: 2.5%; opacity: 1;}
}
 
@keyframes fadein {
  from {right: 0; opacity: 0;}
  to {right: 2.5%; opacity: 1;}
}
 
@-webkit-keyframes fadeout {
  from {right: 2.5%; opacity: 1;} 
  to {right: 0; opacity: 0;}
}
 
@keyframes fadeout {
  from {right: 2.5%; opacity: 1;}
  to {right: 0; opacity: 0;}
}

#mitoast.cerrar {
  /* visibility: visible; */
  -webkit-animation: fadeout 0.5s 9.8s;
  animation: fadeout 0.5s 9.8s;
}
 
@-webkit-keyframes fadeout {
  from {right: 2.5%; opacity: 1;} 
  to {right: 0; opacity: 0;}
}
 
@keyframes fadeout {
  from {right: 2.5%; opacity: 1;}
  to {right: 0; opacity: 0;}
}
 