/**
 * @author Will Steinmetz
 *
 * Styles for the notific8 JavaScript plug-in
 *
 * Copyright (c)2013-2016, Will Steinmetz
 * Licensed under the BSD license.
 * http://opensource.org/licenses/BSD-3-Clause
 */
/**
 * @author Will Steinmetz
 *
 * Style variables for the notific8 JavaScript plug-in
 *
 * Copyright (c)2013-2016, Will Steinmetz
 * Licensed under the BSD license.
 * http://opensource.org/licenses/BSD-3-Clause
 */
/**
 * @author Will Steinmetz
 *
 * Base styles for the notific8 JavaScript plug-in
 *
 * Copyright (c)2013-2016, Will Steinmetz
 * Licensed under the BSD license.
 * http://opensource.org/licenses/BSD-3-Clause
 */
.notific8-container {
    display: block;
    margin: 0;
    padding: 0;
    position: fixed;
}

.notific8-container.top {
    top: 0;
}

.notific8-container.bottom {
    bottom: 0;
}

.notific8-container.top.right, .notific8-container.bottom.right {
    right: 0;
}

.notific8-container.top.left, .notific8-container.bottom.left {
    left: 0;
}

.notific8-notification {
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
}

.notific8-notification:hover .notific8-close {
    display: block;
}

.notific8-close {
    cursor: pointer;
    display: none;
    position: absolute;
}

.notific8-close.sticky {
    display: block;
    position: absolute;
    text-align: center;
}

.right .notific8-notification {
    clear: right;
    float: right;
}

.left .notific8-notification {
    clear: left;
    float: left;
}

.top .notific8-notification {
    margin-top: 0.625em;
}

.bottom .notific8-notification {
    margin-bottom: 0.625em;
}

.notific8-notification.family-legacy,
.notific8-notification.legacy,
.notific8-notification.ocho {
    border-style: solid;
    border-width: 2px;
    color: #fff;
    font-size: 16px;
    min-height: 5.625em;
    padding: 0.625em;
    padding-right: 2.0625em;
    transition: all .2s ease-in-out;
    width: 22.375em;
}

.notific8-notification.family-legacy .notific8-heading,
.notific8-notification.legacy .notific8-heading,
.notific8-notification.ocho .notific8-heading {
    font-weight: bold;
    margin-bottom: 0.3125em;
    font-family: 'B Yekan';
}

.notific8-notification.family-legacy .notific8-message,
.notific8-notification.legacy .notific8-message,
.notific8-notification.ocho .notific8-message {
    font-size: 0.875em;
    font-family: "B Yekan";
}

.notific8-notification.family-legacy .notific8-close,
.notific8-notification.legacy .notific8-close,
.notific8-notification.ocho .notific8-close {
    border: none;
    font-size: 1.25em;
    line-height: 1em;
    padding: 0 .25em;
    right: -2px;
    top: 0;
}

.notific8-notification.family-legacy .notific8-close.sticky,
.notific8-notification.legacy .notific8-close.sticky,
.notific8-notification.ocho .notific8-close.sticky {
    font-size: 0.625em;
    line-height: 1.4em;
    padding: 0.2em 0;
    right: -3.7em;
    text-transform: uppercase;
    top: 3.4em;
    transform: rotate(90deg);
    width: 8.9em;
}

.left .notific8-notification.family-legacy,
.left .notific8-notification.legacy,
.left .notific8-notification.ocho {
    margin-left: -24.375em;
}

.left .notific8-notification.family-legacy.open,
.left .notific8-notification.legacy.open,
.left .notific8-notification.ocho.open {
    margin-left: 0;
}

.right .notific8-notification.family-legacy,
.right .notific8-notification.legacy,
.right .notific8-notification.ocho {
    margin-right: -24.375em;
}

.right .notific8-notification.family-legacy.open,
.right .notific8-notification.legacy.open,
.right .notific8-notification.ocho.open {
    margin-right: 0;
}

.notific8-notification.family-chicchat,
.notific8-notification.chicchat {
    background-color: #fff;
    border-radius: .25em;
    border-style: solid;
    border-width: 1px;
    border-left-width: 3.2142857143em;
    color: #121212;
    font-size: 0.875em;
    min-height: 7.5em;
    padding: 1.125em;
    transition: all .15s ease-in-out;
    width: 31.25em;
}

.notific8-notification.family-chicchat .notific8-heading,
.notific8-notification.chicchat .notific8-heading {
    font-weight: bold;
    margin-bottom: .5em;
}

.notific8-notification.family-chicchat .notific8-close,
.notific8-notification.chicchat .notific8-close {
    background-color: transparent;
    border: none;
    right: .5em;
    top: .325em;
}

.notific8-notification.family-chicchat .notific8-close.sticky,
.notific8-notification.chicchat .notific8-close.sticky {
    font-size: .75em;
    text-decoration: underline;
}

.right .notific8-notification.family-chicchat,
.right .notific8-notification.chicchat {
    margin-right: -32.25em;
}

.right .notific8-notification.family-chicchat.open,
.right .notific8-notification.chicchat.open {
    margin-right: .625em;
}

.left .notific8-notification.family-chicchat,
.left .notific8-notification.chicchat {
    margin-left: -32.25em;
}

.left .notific8-notification.family-chicchat.open,
.left .notific8-notification.chicchat.open {
    margin-left: .625em;
}

.notific8-notification.family-atomic,
.notific8-notification.atomic {
    border-left-width: 3.2142857143em;
    border-radius: 3px;
    font-size: 0.875em;
    min-height: 5em;
    padding: 0;
    transition: all .15s ease-in-out;
    width: 31.25em;
}

.notific8-notification.family-atomic .notific8-heading,
.notific8-notification.atomic .notific8-heading {
    padding: .75em;
}

.notific8-notification.family-atomic .notific8-message-content,
.notific8-notification.atomic .notific8-message-content {
    width: 100%;
}

.notific8-notification.family-atomic .notific8-message,
.notific8-notification.atomic .notific8-message {
    font-size: 0.8571428571em;
    padding: 0.75em;
}

.notific8-notification.family-atomic .notific8-close,
.notific8-notification.atomic .notific8-close {
    background-color: transparent;
    border: none;
    right: .5em;
    top: .325em;
}

.notific8-notification.family-atomic .notific8-close.sticky,
.notific8-notification.atomic .notific8-close.sticky {
    font-size: .75em;
    text-decoration: underline;
}

.right .notific8-notification.family-atomic,
.right .notific8-notification.atomic {
    margin-right: -32.25em;
}

.right .notific8-notification.family-atomic .notific8-heading,
.right .notific8-notification.atomic .notific8-heading {
    border-top-right-radius: 3px;
}

.right .notific8-notification.family-atomic.open,
.right .notific8-notification.atomic.open {
    margin-right: .625em;
}

.left .notific8-notification.family-atomic,
.left .notific8-notification.atomic {
    margin-left: -32.25em;
}

.left .notific8-notification.family-atomic.open,
.left .notific8-notification.atomic.open {
    margin-left: .625em;
}

.notific8-notification.family-materialish,
.notific8-notification.materialish {
    border-radius: 2px;
    font-size: 0.875em;
    min-height: 3em;
    max-width: 568px;
    min-width: 288px;
    opacity: 0;
    transition: all .15s ease-in-out;
}

.notific8-notification.family-materialish .notific8-message,
.notific8-notification.materialish .notific8-message {
    margin: 1em 6em 1em 1.7142857143em;
}

.notific8-notification.family-materialish.open,
.notific8-notification.materialish.open {
    opacity: 1;
}

.notific8-notification.family-materialish.has-heading .notific8-message,
.notific8-notification.materialish.has-heading .notific8-message {
    margin-bottom: .25em;
    margin-top: .25em;
}

.notific8-notification.family-materialish .notific8-close,
.notific8-notification.materialish .notific8-close {
    background-color: transparent;
    border: none;
    line-height: 1.4285714286em;
    margin-top: -0.7142857143em;
    right: 1.7142857143em;
    top: 50%;
}

.notific8-notification.family-materialish .notific8-heading,
.notific8-notification.materialish .notific8-heading {
    font-size: 0.7857142857em;
    font-weight: 100;
    margin-left: 2.1818181818em;
    margin-top: 0.4545454545em;
}

.notific8-notification.family-materialish.sticky .notific8-message,
.notific8-notification.materialish.sticky .notific8-message {
    line-height: 1.4285714286em;
    margin-right: 8.5714285714em;
}

.notific8-notification.family-materialish.sticky .notific8-close.sticky,
.notific8-notification.materialish.sticky .notific8-close.sticky {
    text-transform: uppercase;
}

.notific8-notification.family-materialish.sticky .notific8-close.sticky:hover,
.notific8-notification.materialish.sticky .notific8-close.sticky:hover {
    text-decoration: underline;
}

.notific8-notification.family-legacy.teal,
.notific8-notification.legacy.teal,
.notific8-notification.ocho.teal {
    background-color: #069;
    border-color: #09c;
    color: #fff;
}

.notific8-notification.family-legacy.teal .notific8-close,
.notific8-notification.legacy.teal .notific8-close,
.notific8-notification.ocho.teal .notific8-close {
    background-color: #09c;
    color: #fff;
}

.notific8-notification.family-legacy.amethyst,
.notific8-notification.legacy.amethyst,
.notific8-notification.ocho.amethyst {
    background-color: #5D2D77;
    border-color: #915faa;
    color: #fff;
}

.notific8-notification.family-legacy.amethyst .notific8-close,
.notific8-notification.legacy.amethyst .notific8-close,
.notific8-notification.ocho.amethyst .notific8-close {
    background-color: #915faa;
    color: #fff;
}

.notific8-notification.family-legacy.ruby,
.notific8-notification.legacy.ruby,
.notific8-notification.ocho.ruby {
    background-color: #a10;
    border-color: #d10;
    color: #fff;
}

.notific8-notification.family-legacy.ruby .notific8-close,
.notific8-notification.legacy.ruby .notific8-close,
.notific8-notification.ocho.ruby .notific8-close {
    background-color: #d10;
    color: #fff;
}

.notific8-notification.family-legacy.tangerine,
.notific8-notification.legacy.tangerine,
.notific8-notification.ocho.tangerine {
    background-color: #e88f00;
    border-color: #ffb23f;
    color: #fff;
}

.notific8-notification.family-legacy.tangerine .notific8-close,
.notific8-notification.legacy.tangerine .notific8-close,
.notific8-notification.ocho.tangerine .notific8-close {
    background-color: #ffb23f;
    color: #fff;
}

.notific8-notification.family-legacy.lemon,
.notific8-notification.legacy.lemon,
.notific8-notification.ocho.lemon {
    background-color: #ffcc00;
    border-color: #ffde00;
    color: #333;
}

.notific8-notification.family-legacy.lemon .notific8-close,
.notific8-notification.legacy.lemon .notific8-close,
.notific8-notification.ocho.lemon .notific8-close {
    background-color: #ffde00;
    color: #333;
}

.notific8-notification.family-legacy.lime,
.notific8-notification.legacy.lime,
.notific8-notification.ocho.lime {
    background-color: #32b512;
    border-color: #38d315;
    color: #fff;
}

.notific8-notification.family-legacy.lime .notific8-close,
.notific8-notification.legacy.lime .notific8-close,
.notific8-notification.ocho.lime .notific8-close {
    background-color: #38d315;
    color: #fff;
}

.notific8-notification.family-legacy.ebony,
.notific8-notification.legacy.ebony,
.notific8-notification.ocho.ebony {
    background-color: #121212;
    border-color: #666;
    color: #fff;
}

.notific8-notification.family-legacy.ebony .notific8-close,
.notific8-notification.legacy.ebony .notific8-close,
.notific8-notification.ocho.ebony .notific8-close {
    background-color: #666;
    color: #fff;
}

.notific8-notification.family-legacy.smoke,
.notific8-notification.legacy.smoke,
.notific8-notification.ocho.smoke {
    background-color: #efefef;
    border-color: #ababab;
    color: #333;
}

.notific8-notification.family-legacy.smoke .notific8-close,
.notific8-notification.legacy.smoke .notific8-close,
.notific8-notification.ocho.smoke .notific8-close {
    background-color: #ababab;
    color: #fff;
}

.notific8-notification.family-chicchat.cobalt,
.notific8-notification.chicchat.cobalt {
    border-color: #3171B2;
}

.notific8-notification.family-chicchat.cobalt .notific8-close,
.notific8-notification.chicchat.cobalt .notific8-close {
    color: #3171B2;
}

.notific8-notification.family-chicchat.ruby,
.notific8-notification.chicchat.ruby {
    border-color: #a10;
}

.notific8-notification.family-chicchat.ruby .notific8-close,
.notific8-notification.chicchat.ruby .notific8-close {
    color: #a10;
}

.notific8-notification.family-chicchat.honey,
.notific8-notification.chicchat.honey {
    border-color: #f2cc00;
}

.notific8-notification.family-chicchat.honey .notific8-close,
.notific8-notification.chicchat.honey .notific8-close {
    color: #f2cc00;
}

.notific8-notification.family-chicchat.shamrock,
.notific8-notification.chicchat.shamrock {
    border-color: #8bb92d;
}

.notific8-notification.family-chicchat.shamrock .notific8-close,
.notific8-notification.chicchat.shamrock .notific8-close {
    color: #8bb92d;
}

.notific8-notification.family-atomic.cerulean,
.notific8-notification.atomic.cerulean {
    background-color: #c9e0f2;
    border-color: #4F99D3;
    color: #454545;
}

.notific8-notification.family-atomic.cerulean .notific8-heading,
.notific8-notification.atomic.cerulean .notific8-heading {
    background-color: #a1c8e7;
    border-bottom: solid 1px #78b1dd;
}

.notific8-notification.family-atomic.tomato,
.notific8-notification.atomic.tomato {
    background-color: #eeb9ba;
    border-color: #D03E41;
    color: #454545;
}

.notific8-notification.family-atomic.tomato .notific8-heading,
.notific8-notification.atomic.tomato .notific8-heading {
    background-color: #e49092;
    border-bottom: solid 1px #da6769;
}

.notific8-notification.family-atomic.mustard,
.notific8-notification.atomic.mustard {
    background-color: #f8f5df;
    border-color: #DDCE61;
    color: #454545;
}

.notific8-notification.family-atomic.mustard .notific8-heading,
.notific8-notification.atomic.mustard .notific8-heading {
    background-color: #efe8b5;
    border-bottom: solid 1px #e6db8b;
}

.notific8-notification.family-atomic.pear,
.notific8-notification.atomic.pear {
    background-color: #dfeec5;
    border-color: #9ECC4E;
    color: #454545;
}

.notific8-notification.family-atomic.pear .notific8-heading,
.notific8-notification.atomic.pear .notific8-heading {
    background-color: #c9e39d;
    border-bottom: solid 1px #b4d776;
}

.notific8-notification.family-atomic.amethyst,
.notific8-notification.atomic.amethyst {
    background-color: #ab73ca;
    border-color: #5D2D77;
    color: #eee;
}

.notific8-notification.family-atomic.amethyst .notific8-heading,
.notific8-notification.atomic.amethyst .notific8-heading {
    background-color: #954ebc;
    border-bottom: solid 1px #7a3b9c;
}

.notific8-notification.family-atomic.onyx,
.notific8-notification.atomic.onyx {
    background-color: #929292;
    border-color: #454545;
    color: #eee;
}

.notific8-notification.family-atomic.onyx .notific8-heading,
.notific8-notification.atomic.onyx .notific8-heading {
    background-color: #787878;
    border-bottom: solid 1px #5f5f5f;
}

.notific8-notification.family-materialish.twilight,
.notific8-notification.materialish.twilight {
    background-color: #323232;
    color: #eee;
}

.notific8-notification.family-materialish.lilrobot,
.notific8-notification.materialish.lilrobot {
    background-color: #A4C639;
    color: #eee;
}

.notific8-notification.family-materialish.cupcake,
.notific8-notification.materialish.cupcake {
    background-color: #FFBAD2;
    color: #323232;
}

.notific8-notification.family-materialish.eclair,
.notific8-notification.materialish.eclair {
    background-color: #654848;
    color: #eee;
}

.notific8-notification.family-materialish.honeycomb,
.notific8-notification.materialish.honeycomb {
    background-color: #f6e080;
    color: #323232;
}

.notific8-notification.family-materialish.lollypop,
.notific8-notification.materialish.lollypop {
    background-color: #54b2a9;
    color: #eee;
}

.notific8-notification.family-materialish.marshmallow,
.notific8-notification.materialish.marshmallow {
    background-color: #fff8ed;
    color: #323232;
}

.notific8-notification.family-materialish.strawberry,
.notific8-notification.materialish.strawberry {
    background-color: #BE2625;
    color: #eee;
}

.notific8-notification.family-materialish.creamsicle,
.notific8-notification.materialish.creamsicle {
    background-color: #F7BB67;
    color: #323232;
}

.notific8-notification.family-materialish.purple-rain,
.notific8-notification.materialish.purple-rain {
    background-color: #694489;
    color: #eee;
}

.notific8-notification.family-materialish.peafowl,
.notific8-notification.materialish.peafowl {
    background-color: #1D7CF2;
    color: #eee;
}

/*# sourceMappingURL=notific8.css.map */