/*
 * Toastr8
 * Version 1.0.2
 * Copyright 2013 Samuel Pinto.
 * All Rights Reserved.
 * Use, reproduction, distribution, and modification of this code is subject to the terms and
 * conditions of the MIT license, available at http://www.opensource.org/licenses/mit-license.php
 *
* @author Samuel Pinto
* @version 1.0.1
* Project: https://github.com/saribe/toastr8
*/

/* ============================ POSITIONS ============================ */
.toast8-top-full-width {
    right: 0;
    top: 0;
    width: 100%;
}

.toast8-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast8-top-left {
    left: 0;
    top: 12px;
}

.toast8-top-right {
    top: 12px;
    right: 0;
}

.toast8-bottom-right {
    right: 0;
    bottom: 12px;
}

.toast8-bottom-left {
    bottom: 12px;
    left: 0;
}
/* ===== POSITIONS ===== */

/* ============================ TOAST ============================ */
#toast8-container *:before,
#toast8-container *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#toast8-container {
    position: fixed;
    z-index: 999999;
}

    #toast8-container > table:hover {
        opacity: 1;
        filter: alpha(opacity=100);
        cursor: pointer;
    }

        #toast8-container > table:hover .toast8-close-button {
            display: block !important;
        }

    #toast8-container > table {
        border-collapse: collapse;
        border-spacing: 0;
        overflow: hidden;
        margin: 5px 0;
        background-repeat: no-repeat;
        color: #ffffff;
        -ms-opacity: 0.9;
        opacity: 0.97;
        /*bootstrap fix  width: 24em;*/
        width: 25em;
        /* border-collapse: collapse; */
        min-height: 6.5em;
        /* box-shadow: 0px 0px 3px #d2d2d2; */
        max-width: 25em;
    }

    #toast8-container tr {
        vertical-align: top;
    }

        #toast8-container tr > td {
            padding: 0;
        }

        #toast8-container tr > .toast8-message-container {
            display: inherit;
            max-width: 23em;
        }

            #toast8-container tr > .toast8-message-container > .toast8-title {
                float: left;
                overflow: hidden;
                padding: 5px 7px;
                /* width: 100%; */
                /* height: 1.6em; */
                font-weight: bolder;
                /* font-size: 1em; */
                text-align: left;
                width: 100%;
                word-break: break-all;
                word-wrap: normal;
            }

            #toast8-container tr > .toast8-message-container > .toast8-message {
                float: left;
                overflow: hidden;
                padding: 5px 5px 5px 10px;
                -ms-word-wrap: break-word;
                word-wrap: break-word;
                text-align: left;
                /* font-size: 0.85em; */
                max-width: 24em;
                overflow: auto;
                max-height: 29em;
            }

                #toast8-container tr > .toast8-message-container > .toast8-message a,
                #toast8-container tr > .toast8-message-container > .toast8-message label {
                    color: #ffffff;
                }

                    #toast8-container tr > .toast8-message-container > .toast8-message a:hover {
                        color: #cccccc;
                        text-decoration: none;
                    }

        #toast8-container tr > .toast8-right-container {
            vertical-align: bottom;
            position: relative;
            width: 2em;
            text-align: right;
        }

            #toast8-container tr > .toast8-right-container i {
                font-size: 1.7em;
                margin: 7px;
            }

            #toast8-container tr > .toast8-right-container .toast8-close-button {
                background-color: transparent;
                border: 0;
                color: white;
                display: none;
                font-size: 1.3em;
                font-weight: bolder;
                height: 1.1em;
                line-height: 1.1em;
                min-width: 0;
                padding: 0;
                position: absolute;
                right: 0;
                top: 0;
                width: 1.1em;
            }

                #toast8-container tr > .toast8-right-container .toast8-close-button:hover,
                #toast8-container tr > .toast8-right-container .toast8-close-button:focus {
                    -ms-opacity: 1;
                    opacity: 1;
                    cursor: pointer;
                    background-color: #ffffff;
                    background-color: rgba(255,255,255,0.3);
                }

        #toast8-container tr > .toast8-avatar-container {
            background-color: #333333;
            background-color: rgba(51, 51, 51, 0.9);
            background-position: center center;
            background-repeat: no-repeat;
            height: 100%;
            line-height: 94px;
            max-height: 90px;
            padding: 0;
            text-align: center;
            width: 90px;
        }

            #toast8-container tr > .toast8-avatar-container i {
                border: 0;
                height: 90px;
                position: absolute;
                width: 90px;
            }

            #toast8-container tr > .toast8-avatar-container img {
                height: 100%;
                padding: 0;
                width: 100%;
            }

    #toast8-container.toast8-top-full-width > table,
    #toast8-container.toast8-bottom-full-width > table {
        margin: auto;
        width: 96%;
    }
/* ===== TOAST ===== */

/* ============================ MESSAGE TYPE ============================ */
.toast8-avatar {
    background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAMCAgMCAgMDAwMEAwMEBQgFBQQEBQoHBwYIDAoMDAsKCwsNDhIQDQ4RDgsLEBYQERMUFRUVDA8XGBYUGBIUFRT/2wBDAQMEBAUEBQkFBQkUDQsNFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBT/wgARCABZAFoDASIAAhEBAxEB/8QAGwABAAMAAwEAAAAAAAAAAAAAAAUGBwEDBAL/xAAUAQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIQAxAAAAHQQAHPrPG54AAAHf0W8ssnyIjM9johUgAALvSJM1V8/Qptwy8iQADtO+x2/wBRnMlboYqMnbfaZdEbPmRCgTsFaS/gAAVO2V0zkC50y8lvAAAhZqHMvB//xAAnEAAABQQCAQMFAAAAAAAAAAABAgMEBQYQESAAFBIWISIwMTM1QP/aAAgBAQABBQL+AAyPTXx9vooomXVZx6bMnH0cm8IqmZFTenkcnvUCIFV3p0/xvURvjvHO+m5KYDl4Y3iEk87jnZu0VdGJTxhIVZ1Dn9ReziQcSApU+YybqLXa6pJiso2blbI8VSIsQYRqIoM0W1hDPJVn1HN4UvlIb1CnlC9PFy63nQyxvTpffeZDMdenfx7y/wCut//EABQRAQAAAAAAAAAAAAAAAAAAAFD/2gAIAQMBAT8BE//EABQRAQAAAAAAAAAAAAAAAAAAAFD/2gAIAQIBAT8BE//EAC4QAAIAAwUFBwUAAAAAAAAAAAECAAMREiAhMFEQMTJCcRMiI0FSYYEzQHKSsf/aAAgBAQAGPwL7CgivYv8ArlLLXiMCyKt5ts9MzyaGRsGGRNmaYC5LmDmFDkTl6G5JXqcgPy7mgEGoOypwEFhwDBb9Ja194706jaARYbFNDuj6GP5R2YGB5FirzLDaUrFSLSepbqoN7GkBFGA2WXUMNDFbJHzHhoF99vd4GxFxPapyJb6NS450XI6MLk49Mib8f25O6jIndNv/xAApEAEAAQEGBQQDAQAAAAAAAAABEQAgITAxQVEQcYGhsWGR8PFAwdHh/9oACAEBAAE/IfwEIJXQpPId5UikSE0cEkZWCii4b3NqKdSAZJf1oQZMJgC6Xk631YIqFOh94Ab8f0WANUvgwJWz3HpRBgSJwB0AvVr+TG3tzLxz0HWpQHqEqGm3ePk18zHirsprhz50flum4oli3qBzs5JMFBuMx3d+Cpj0K6dYcVMyz1e/AAiCOlFcIGLbcsZMuPYwB1LvD/LHJN93AnXcWPabzgcmS7LHxW2B2Lycf//aAAwDAQACAAMAAAAQ8880888o0c888sQk888cs408sc88s8o888sc/8QAFBEBAAAAAAAAAAAAAAAAAAAAUP/aAAgBAwEBPxAT/8QAFBEBAAAAAAAAAAAAAAAAAAAAUP/aAAgBAgEBPxAT/8QAJxABAAEBBgYDAQEAAAAAAAAAAREAITAxUWFxIEGBkaGxEMHw0UD/2gAIAQEAAT8Q/wACQHQBKuUVIBxnA+qUAiEIS52NdBmugW9Kkodgk3OMjQrc0kC2YMsxUhU9cc9v7cWmIhNSvh3rD5lUEjmoh3iHS4llgrmiK8nngigb2AB9+LhLajEzpbuJNDMYlIjzPgJ5qUAGKtExUIMwq9S9o48wgVm/yVNFjEi7qT2q0VGesJYOncoErdnlREItzlerF8GlANJMcaVkl2ok9qZAaMThCedwFielDOTAt5y1fi0FkyDfRqACYx3tRENIQK+qXz8BSCFEiU2GyRKfA+zgnrJJZhaJ7pcAMlnSj7HfgBO3sof5cfhUk++CSHgT+fouPwLHAfqZrsF//9k=');
}

.toast8 {
    background-color: #030303;
}

.toast8-success {
    background-color: #5cb85c;
    border: 1px solid #4cae4c;
}

.toast8-error {
    background-color: #d9534f;
    border: 1px solid #d43f3a;
}

.toast8-info {
    background-color: #5bc0de;
    border: 1px solid #46b8da;
}

.toast8-warning {
    background-color: #f0ad4e;
    border: 1px solid #eea236;
}

.toast8-facebook {
    background-color: #335795;
}

.toast8-twitter {
    background-color: #4099FF;
}

.toast8-skype {
    background-color: #50DBF9;
}

.toast8-windows {
    background-color: #2E8DEF;
}

.toast8-android {
    background-color: #A4C739;
}

.toast8-linkedin {
    background-color: #0074C4;
}

.toast8-google-plus {
    background-color: #D50F0F;
}

.toast8-linux {
    background-color: #4D5259;
}

.toast8-github {
    background-color: #000;
}
/* ===== MESSAGE TYPE ===== */

/*Responsive Design*/
@media (max-width: 240px) {
    #toast8-container > table {
        font-size: 70%;
        width: 15em;
    }

    #toast8-container tr > .toast8-avatar-container {
        display: none;
    }
}

@media (max-width: 480px) {
    #toast8-container > table {
        font-size: 75%;
        width: 16em;
    }
}

@media (max-width: 768px) {
    #toast8-container > table {
        font-size: 85%;
        min-width: 20em;
        width: 20em;
    }

    #toast8-container tr > .toast8-right-container i {
        font-size: 1em;
        margin: 5px;
    }
}

.slideOutRight {
    animation-name: slideOutRight;
    -webkit-animation-name: slideOutRight;
    animation-duration: 0.8s;
    -webkit-animation-duration: 0.8s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
    opacity: 0 !important;
}

@keyframes slideOutRight {
    0% {
        transform: translateX(0%);
        opacity: 1;
    }

    65% {
        transform: translateX(-4%);
    }

    100% {
        transform: translateX(140%);
        opacity: 0.1;
    }
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateX(0%);
        opacity: 1;
    }

    65% {
        -webkit-transform: translateX(-4%);
    }

    100% {
        -webkit-transform: translateX(140%);
        opacity: 0.1;
    }
}