<!-- 6/15/18 toast css -->
body{
margin:0;
padding:0;
}
#toast {
visibility: hidden;
max-width: 50px;
height: 50px; margin: auto;
background-color: #333;
color: #fff;
text-align: center;
border-radius: 2px;
position: fixed;
z-index: 2;
left: 0;right:0;
bottom: 30px;
font-size: 17px;
white-space: nowrap;
}
#toast #img{
width: 50px;
height: 50px;
float: left;
padding-top: 16px;
padding-bottom: 16px;
box-sizing: border-box;
background-color: #111;
color: #fff;
}
#toast #desc{
color: #fff;
padding: 16px;
overflow: hidden;
white-space: nowrap;
}
#toast.show {
visibility: visible;
-webkit-animation: fadein 0.5s, expand 0.5s 0.5s,stay 3s 1s, shrink 0.5s 2s, fadeout 0.5s 2.5s;
animation: fadein 0.5s, expand 0.5s 0.5s,stay 3s 1s, shrink 0.5s 4s, fadeout 0.5s 4.5s;
}
#toast2 {
visibility: hidden;
max-width: 50px;
height: 50px; margin: auto;
background-color: #333;
color: #fff;
text-align: center; //center
border-radius: 2px;
position: fixed;
z-index: 1;
left: 0;right:0;
bottom: 30px;
font-size: 10px;//Was 17px
white-space: nowrap;
}
#toast2 #img{
width: 50px;
height: 50px;
float: left;
padding-top: 16px;
padding-bottom: 16px;
box-sizing: border-box;
background-color: #111;
color: #fff;
} #toast2 a:link {
color: white;
} a:visited {
color: blue; // 4/30/19 was white
}
#toast2 #desc{
color: #fff;
padding: 16px;
//    background-color: #fff;
overflow: hidden;
white-space: nowrap;
}
#toast2.show {
visibility: visible;
-webkit-animation: fadein 0.5s, expand 0.5s 0.5s,stay 3s 1s, shrink 0.5s 2s, fadeout 0.5s 2.5s;
animation: fadein 0.5s, expand 0.5s 0.5s, stay 11s 1s, shrink 0.5s 0s, fadeout 0.5s 12s;
}
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;} 
to {bottom: 30px; opacity: 1;}
}
@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 30px; opacity: 1;}
}
@-webkit-keyframes expand {
from {min-width: 50px} 
to {min-width: 370px}
}
@keyframes expand {
from {min-width: 50px}
to {min-width: 370px}
}
@-webkit-keyframes stay {
from {min-width: 370px} 
to {min-width: 370px}
}
@keyframes stay {
from {min-width: 370px}
to {min-width: 370px}
}
@-webkit-keyframes shrink {
from {min-width: 370px;} 
to {min-width: 50px;}
}
@keyframes shrink {
from {min-width: 370px;} 
to {min-width: 50px;}
}
@-webkit-keyframes fadeout {
from {bottom: 30px; opacity: 1;} 
to {bottom: 60px; opacity: 0;}
}
@keyframes fadeout {
from {bottom: 30px; opacity: 1;}
to {bottom: 60px; opacity: 0;}
}