.toast-title {font-weight:bold; }
.toast-message {-ms-word-wrap:break-word;word-wrap:break-word; }
.toast-message a, .toast-message label {color:#ffffff; }
.toast-message a:hover {color:#cccccc;text-decoration:none; }
.toast-close-button {line-height:0;top:20px;right:2px;position:absolute;float:left;font-size:25px;color:#000;font-weight:bold;cursor:pointer;opacity:0.4; }
.toast-close-button:hover, .toast-close-button:focus {color:#000000;text-decoration:none;cursor:pointer;opacity:1; }

/*Additional properties for button version iOS requires the button element instead of an anchor tag. If you want the anchor version, it requires `href="#"`.*/

button.toast-close-button {padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:none; }
.toast-top-center {top:0;right:0;width:100%; }
.toast-bottom-center {bottom:0;right:0;width:100%; }
.toast-top-full-width {top:0;right:0;width:100%; }
.toast-bottom-full-width {bottom:0;right:0;width:100%; }
.toast-top-left {top:12px;left:12px; }
.toast-top-right {top:12px;right:12px; }
.toast-bottom-right {right:-1px;bottom:32px; }
.toast-bottom-left {bottom:12px;left:12px; }
#toast-container {position:fixed;z-index:999999;pointer-events:none;/*overrides*/ }
#toast-container * {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box; }
#toast-container > div { position:relative;pointer-events:auto;overflow:hidden;width:350px;
                          -moz-border-radius:5px 0px 0px 5px;-webkit-border-radius:5px 0px 0px 5px;border-radius:5px 0px 0px 5px;border:1px solid #ddd;color:#ffffff;cursor:pointer;background-color:#000;-moz-box-shadow:0 0 12px rgba(0, 0, 0, 0.32);-webkit-box-shadow:0 0 12px rgba(0, 0, 0, 0.32);box-shadow:0 0 12px rgba(0, 0, 0, 0.32);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter:alpha(opacity=100); }
 
.toast {min-height:50px; opacity:1!important; padding:5px 18px 10px 60px; }
.toast .toast-message {font-size:14px;color:#fff !important;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;height:33px;line-height:1em; }
.toast .toast-close-button {color:#888; }
.toast .toast-close-button:focus {border:none;box-shadow:none;outline:none; }

.toast .toast-progress {background-color:#fabf03;opacity:1;border-radius:0 50px 50px 0; }
.toast-warning .toast-progress { background-color:#b16b07; }
#toast-container > .toast:after {content:"\f00c";font-family:FontAwesome;width:50px;height:calc(100% - 4px);position:absolute;left:0px;top:0px;color:#fff; z-index:0;text-align:center;font-size:25px;line-height:45px;transition:0.3s; }
#toast-container > .toast-success:after {content:"\f00c";}
#toast-container > .toast-error:after {content:"\f071"}
#toast-container > .toast-info:after {content:"\f05a"}
#toast-container > .toast-warning:after {content:"\f06a"}
#toast-container:hover > .toast:after {content:"\f00d"; color:#000; transition:0.3s; }
#toast-container:hover > .toast-notification:after {color:#fff; }
 
#toast-container > .toast-notification {background-color:#000;}/*black*/
#toast-container > .toast-success {background-color:#64bf7d; }/*green*/
#toast-container > .toast-error {background-color:#e85952; }/*red*/
#toast-container > .toast-info {background-color:#67c8e4; }/*light-blue*/
#toast-container > .toast-warning {background-color:#f1c236; }/*yellow*/


#toast-container.toast-top-center > div, #toast-container.toast-bottom-center > div {width:300px;margin-left:auto;margin-right:auto; }
#toast-container.toast-top-full-width > div, #toast-container.toast-bottom-full-width > div {width:96%;margin-left:auto;margin-right:auto; }

.toast-progress {position:absolute;left:0px;bottom:0px;height:4px;background-color:#000000;opacity:0.4;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=40);filter:alpha(opacity=40); }

/*Responsive Design*/
@media all and (max-width:240px) {
#toast-container > div {padding:8px 8px 8px 50px;width:11em; }
#toast-container .toast-close-button {right:-0.2em;top:-0.2em; }
}

@media all and (min-width:241px) and (max-width:480px) {
#toast-container > div {padding:8px 8px 8px 50px;width:18em; }
#toast-container .toast-close-button {right:-0.2em;top:-0.2em; }
}

@media all and (min-width:481px) and (max-width:768px) {
#toast-container > div {padding:15px 15px 15px 50px;width:25em; }
}


