@media screen and (max-width: 576px){
	.cg-toast{
		font-size:75%;
	}
	.cg-toast.show{
		bottom:20%!important;
	}
	.cg-toast.show .cg-toast-desc{
		width:250px!important;
		text-wrap:wrap;
	}
}

.cg-toast {
    position:fixed;
    bottom:0;
    left:50%;
    transform:translate(-50%,100%);
    background-color:white;
    color:black;
    z-index:5;
    display:flex;
    flex-direction:row;
    border-radius:999px;
	transition: bottom .25s .5s ease, transform .25s .5s ease;
	justify-content:space-between;
	border:1px solid lightgrey;
}
.cg-toast .cg-toast-img{
	width:50px;
	height:50px;
	border:1px solid lightgrey;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:999px;
}
.cg-toast .cg-toast-desc{
	display:flex;
	width:0;
	overflow: hidden;
	white-space: nowrap;
	height:0;
	justify-content:center;
	align-items:center;
	transition: padding .25s ease, width .25s ease;
}

.cg-toast.show {
	bottom:10%;
    transform:translate(-50%,-50%);
	transition: bottom .25s ease, transform .25s ease;
}

.cg-toast.show .cg-toast-desc{
	width:600px;
	height:50px;
	padding: 0 5px;
	transition: padding .25s .5s ease, width .25s .5s ease;
}

.cg-toast .cg-toast-close{
	display:flex;
	justify-content:center;
	align-items:center;
	width:0;
	transition:width .25s;
	overflow:hidden;
	white-space: nowrap;
	visibility:hidden;
}
.cg-toast.show .cg-toast-close{
	width:50px;
	height:50px;
	visibility:visible;
	transition:width .25s .5s ease;
	cursor:pointer;
}
.cg-toast.show .cg-toast-desc span{
	color:blue;
	text-decoration:underline;
	cursor:pointer;
}