#snackbar {
   display:none;
    min-width: 100%;
    background:#28a745;
 
    text-align: center;
    border-radius: 0px;
    padding: 0px;
    position: fixed;
    z-index: 99999999999999999;color:#fff;
    left: auto;
    top: 0;border: 0px solid #28a745;
    font-size: 13px;
    right: 0px;
    font-weight: 600;
  text-transform: uppercase;
}

#snackbar.show {
  display:block;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;  padding: 10px;
}


#snackbar1{
   display:none;
    min-width: 100%;
    background:red;
 
    text-align: center;
    border-radius: 0px;
    padding: 0px;
    position: fixed;
    z-index: 99999999999999999;color:#fff;
    left: auto;
    top: 0;border: 0px solid #28a745;
    font-size: 13px;
    right: 0px;
    font-weight: 600;
  text-transform: uppercase;
}

#snackbar1.show {
  display:block;
  -webkit-animation: fadein 0.8s, fadeout 0.8s 4.5s;
  animation: fadein 0.8s, fadeout 0.8s 4.5s;  padding: 10px;
}
#snackbar4{
   display:none;
    min-width: 100%;
    background:red;
 
    text-align: center;
    border-radius: 0px;
    padding: 0px;
    position: fixed;
    z-index: 99999999999999999;color:#fff;
    left: auto;
    top: 0;border: 0px solid #28a745;
    font-size: 13px;
    right: 0px;
    font-weight: 600;
  text-transform: uppercase;
}

#snackbar4.show {
  display:block;
  -webkit-animation: fadein 0.8s, fadeout 0.8s 4.5s;
  animation: fadein 0.8s, fadeout 0.8s 4.5s;  padding: 10px;
}
#snackbar3{
   display:none;
    min-width: 100%;
    background:#28a745;
 
    text-align: center;
    border-radius: 0px;
    padding: 0px;
    position: fixed;
    z-index: 99999999999999999;color:#fff;
    left: auto;
    top: 0;border: 0px solid #28a745;
    font-size: 13px;
    right: 0px;
    font-weight: 600;
  text-transform: uppercase;
}

#snackbar3.show {
  display:block;
  -webkit-animation: fadein 0.8s, fadeout 0.8s 4.5s;
  animation: fadein 0.8s, fadeout 0.8s 4.5s;  padding: 10px;
}
#snackbar2 {
   display:none;
    min-width: 100%;
    background:red;
 
    text-align: center;
    border-radius: 0px;
    padding: 0px;
    position: fixed;
    z-index: 99999999999999999;color:#fff;
    left: auto;
    top: 0;border: 0px solid #28a745;
    font-size: 13px;
    right: 0px;
    font-weight: 600;
  text-transform: uppercase;
}

#snackbar2.show {
  display:block;
  -webkit-animation: fadein 0.8s, fadeout 1s 4.5s;
  animation: fadein 0.8s, fadeout 0.8s 4.5s;  padding: 10px;
}

@-webkit-keyframes fadein {
  from {top: 0; opacity: 0;} 
  to {top: 0px; opacity: 1;}
}

@keyframes fadein {
  from {top: 0; opacity: 0;}
  to {top: 0%; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {top: 0%; opacity: 1;} 
  to {top: 0; opacity: 0;}
}

@keyframes fadeout {
  from {top: 0%; opacity: 1;}
  to {top: 0; opacity: 0;}
}