body, input, select, textarea, div, p, a, h1, h2, h3 {
    font-family: 'Helvetica Neue', 'Roboto', Arial, sans-serif; font-weight: 300; box-sizing: border-box;
}
input:not([type=checkbox]), textarea, select {
   -webkit-appearance: none; -moz-appearance: none; appearance: none;
    padding: 8px 12px; font-size: 1.1em; border-radius: 4px; border: 0px;
}
select {
    background-image: url('../images/dd-arrow.svg'); background-repeat: no-repeat; background-position: right 10px center;
    padding-right: 38px; background-size: 20px auto;
}
body { background: #eff5f9; margin: 0px; }
.cloud #background {
    background-image: url('../images/background.jpg?ver=2');
    background-size: cover; z-index: -1000; height: 100%; width: 100%;
    display: block; position: fixed; margin-top: -85px;
}
.cell { display: table-cell; }
.row { display: table-row }

#contact_table {display: table; padding: 10px; font-size: 16px;}

#header {
    height: 60px; display: inline-block; width: 100%; z-index: 100;
    background: rgba(15,15,15,0.75); position: fixed; top: 0; left: 0px; right: 0px;
    box-shadow: 0 2px 8px 0px rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
}
#header #title { width: 50%; }

#title {
    color: white; margin: 0px auto; vertical-align: top; padding-top: 2px;
    font-size: 1.2em; left: 0; right: 0; text-align: center;
    font-family: 'Helvetica Neue', 'Roboto', Arial, sans-serif; font-weight: 300;
}
#logo { margin-left: 10px; display: inline-block; height: 100%; padding-top: 9px; }

/*** Sys Customizations ***/
.s-modal { background-color: rgba(255, 255, 255, 0.9); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.s-modal > p:last-of-type { margin-bottom: 20px; }
.s-modal-buttons input[type="button"], .s-notification .buttons input[type="button"] { border-radius: 100px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); color: rgb(0, 115, 222); cursor: pointer; opacity: 0.9; transition: 0.3s; }
.s-modal-buttons input[type="button"]:not(.gray), .s-notification:not(.error) .buttons input[type="button"]:not(.gray) { background-color: rgb(0, 115, 222); color: white; box-shadow: 0px 0px 5px rgba(0, 115, 222, 0.4); }
.s-modal-buttons input[type="button"]:hover, .s-notification:not(.error) .buttons input[type="button"]:hover { opacity: 1; }
.s-modal-buttons input[type=button]:disabled { color: rgba(0,0,0,0.4); background-color: rgba(146, 172, 196, 0.85); box-shadow: 0px 0px 5px rgba(146, 172, 196, 0.4); }
.s-modal div { box-sizing: border-box; }
.s-modal h1 { margin-bottom: 15px; }

/* ---- DROP DOWN MENU ---- */
#actions-menu div { padding: 15px; }
#actions-menu div, .sel-group div {
    color: gray; border-top: 1px rgba(128, 128, 128, 0.45) solid; width: 100%; cursor: pointer;
}
.sel-group div { height: 50px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
#actions-menu {
    position: fixed; top: -260px; right: 0; width: 220px;
    text-align: center; opacity: 0; background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 14px 0px rgba(0, 0, 0, 0.4);
    z-index: 99; border-radius: 0px 0px 4px 4px; -webkit-backdrop-filter: blur(10px);
}
#actions-menu.open { top: 60; opacity: 1; }

/* alterations... merge into above rules after testing */
#actions-menu, #menu-list-desktop {
    top: 60; display: none; animation-duration: 0.3s; animation-fill-mode: forwards;
}
#actions-menu.open, #menu-list-desktop.open { display: inline-block; position: fixed; animation-name: menuOpen; }
@keyframes menuOpen {
    0% { opacity: 0; transform: translateY(-75px); }
    100% { opacity: 1; transform: translateY(0px); }
}
@keyframes menuClose {
    0% { opacity: 1; transform: translateY(0px); }
    100% { opacity: 0; transform: translateY(-75px); }
}
/* ---- DROP DOWN MENU end ---- */
#menu-list a, #menu-list-desktop a {
    color: white;
    text-decoration: none;
    text-align: center;
    font-family: 'Mulish', sans-serif;
    vertical-align: middle;
}
#menu-list{ 
    display: inline-table; height: auto; left: 240px; z-index: 101; position: fixed; top: 0px;
}
#menu-list a { display: table-cell; padding: 19px 30px 0px 30px; font-size: 1.2em; vertical-align: top; border-bottom: 2px rgba(255,255,255,0) solid; height: 58px; }
#menu-list ul li a {display: block;}
#menu-list a.headerlink { cursor: pointer; transition: 0.3s; }
#menu-list a.headerlink:hover { border-bottom: 2px white solid; }
#menu-list a.headerlink:active { color: rgba(95,181,241,1); }
#menu-list ul {font-size: inherit; display: table-cell; padding-inline-start: 0px; }
#menu-list li { font-style: normal; display: block; list-style: none; }

#menu-button img { margin-top: 15px; display: inline; }
#menu-button {
    height: 60px; margin: 0px; display: block; width: 60px; position: absolute; top: 0; right: 0;
    text-align: center; vertical-align: middle; cursor: pointer;
}
#menu-button.active { background: rgba(255, 255, 255, 0.25); }

#menu-list-desktop {
    display: table; background: rgba(255, 255, 255, 0.9); position: fixed; left: auto;
    width: 220px; opacity: 0; right: 0; box-shadow: 0 2px 14px 0px rgba(0, 0, 0, 0.4); z-index: 99; border-radius: 0px 0px 4px 4px;
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.d-list:not(:hover) span { display: none; }
.d-list span, #menu-list .d-list-sub {
    position: fixed; box-shadow: 0px 0px 10px rgba(0,0,0,0.2); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
#menu-list .d-list-sub { margin-left: 220px; display: none; background: rgba(255,255,255,0.75); color: black; }
.d-list span { background: rgba(15,15,15,0.75); }
.d-list-item { width: 220px; }

#menu-list .d-list-item:hover .d-list-sub { display: block; }
#menu-list .d-list-sub a.headerlink { color: black; }
#menu-list .d-list-sub a.headerlink:hover { border-bottom: 2px black solid; }
#d_button1 a {margin-top:2px;}

#footer a { padding: 13px 20px; display: inline-block; transition: 0.3s; }
#footer a:hover { color: #40b5f7; }

#menu-list-desktop a {
    display: block; padding: 15px 30px; color: gray;
    border-top: 1px rgba(128, 128, 128, 0.25) solid; cursor: pointer; transition: 0.3s;
}
#menu-list-desktop a:hover { background: white; }
#menu-list-desktop a:last-of-type, body:not(.logged-in) #login { border-bottom: 0px; border-radius: 0px 0px 4px 4px; }

#changingtext {margin-top: 32px; font-size: 2.4em;}

#users.table { min-height: 40px; background-color: #ffffcd; font-weight: 300;}

@font-face { font-family: 'Bariol Regular'; src: url(/fonts/Bariol_Regular.ttf); }
* { font-family: 'Bariol Regular', Arial, Helvetica, san-serif; }

img { display: block; }

.header div { border-bottom: 1px rgba(255,255,255,0.5) solid; padding: 7px 8px 6px 8px;}

#header .cell {vertical-align: middle;}
#header .cell2 { display: table-cell; vertical-align: middle; width: 100%; min-width: 100%;}

#search img {
    margin: -1px 0px; display: none;
}
.gray #search #l-3, .white #search #l-2 { display: block; }
.white #header { background: rgba(255,255,255,0.95) }
.gray #header { background: rgba(160,160,160,0.95) }

.transition, .sel-group div {
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -ms-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.text {padding: 0px 19px 19px 19px;}
.spacediv { height: 60px; width: 100%; }
.halfspacediv { height: 30px; width: 100%; }

.center {max-width:700px;margin: 0px auto; margin-top:20px;text-align: center }

.box {
    border-radius: 10px;
    margin: auto; height: auto; padding: 15px 10px; text-align: center;  
    display: inline-block; width: 100%; z-index: 100;
    background: rgba(15,15,15,0.75); position: fixed; top: 0; left: 0px; right: 0px;
    box-shadow: 0 2px 8px 0px rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
}

#gotobody3 { font-size: 1.3em; color: #ffffff;}

table {
    font-size: 16px;
    }
#body3 table { 
    padding: 10px;
    }
.table {  
    width: 100%;
    font-size: 16px;
    border: solid black;
    border-spacing: 0px;
    border-width: 1px;
    }
#body2 tr, #body2 td { border: 1px solid black; color: #212121; font-weight: 300;padding: 10px;}
#body2b tr, #body2b td { border: 1px solid black; color: #212121; font-weight: 300;padding: 10px;}
.gray2 { background-color:rgba(223, 223, 223, 1); }
.gray { background-color:rgba(223, 223, 223, .60); }
.blue {background-color:#83c6ff; }
.green { background-color:#d6fdd0; }
.button {
    background: none; padding: 0 0 0 0; margin-top: 10px;
}
.button input[type="button"] {
    background-color:rgba(95,181,241,1);
    border:1px solid #72b2e9;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:3px;
    cursor:pointer;
    display:block;
    width:115px;
    height:45px;
    font-size: 1.5em;
    text-transform: uppercase;
    color: #ffffff;
}
.button input[type="button"]:hover {
    background-color:rgba(78, 154, 219, 1);
    font-size: 1.5em; border: 0px; border-radius: 3px; display: inline-block;
    text-transform: uppercase; color: #ffffff; background: rgba(117, 191, 255, 1);
    cursor: pointer; vertical-align: middle; text-align: center;
}
#customsoftware{
    width: 80%;
    margin: 0 auto;
}
#actions-menu div { padding: 15px; }
#actions-menu div, .sel-group div {
    color: gray; border-top: 1px rgba(128, 128, 128, 0.45) solid; width: 100%; cursor: pointer;
}
#actions-menu div { text-transform: uppercase; }

#search input::-webkit-input-placeholder { color: white; }
#search input::-moz-placeholder { color: white; }
#search input:-ms-input-placeholder { color: white; }
#search input:-moz-placeholder { color: white; }
#search input{
    background-color: rgba(0,0,0,0); border: 1px white solid; color: white !important;
    border-radius: 3px; padding: 8px 36px 8px 8px; font-size: 1em; width: 175px;
    background-image: url('../images/search.svg'); background-repeat: no-repeat; background-size: 20px 20px;
    background-position: center right 8px; box-sizing: border-box; margin: 0px;
}
@media (max-width: 600px) {
    #search input { position: absolute; width: calc(100% - 95px); top: -50px; opacity: 0; }
    .search-active #search input { top: 21px; opacity: 1; }
    #mobile-switch { display: block; }
    .search-active #header #title, .search-active #mobile-switch { opacity: 0; }
    #users { min-width: auto; }
    #errors div { max-width: none; };
    #errors { width: 100%; }
    #errors.open { left: 0; }
}
#footer {
    background: #212121; width: 100%; height: auto; position: static; bottom: 0px;
}
#body3 a, #body3 a:visited {
    text-decoration: none; margin: 0px auto; vertical-align: top; text-align: center; font-size: 1.2em; left: 0; right: 0; 
    font-family: 'Bariol Regular', Arial, Helvetica, san-serif; color:#5fb5f1;
}
#footercell { width: 100%; min-width: 100%; padding: 13px; }
#footer .cell { display: table-cell; padding: 0px 50px; }
#footer a {
    color: #ffffff; text-decoration: none; margin: 0px auto; vertical-align: top;
    text-align: center; font-size: 1.2em; left: 0; right: 0; font-family: 'Bariol Regular', Arial, Helvetica, san-serif;
}
#comments { height: 200px; }
#contactform2 #comments { height: 140px; }
#contactinfo p { color: #212121; text-align: center; font-size: 1.0em; position: relative; }
body, div, input {}
.section {
    background-color: rgba(96,96,108,0.7);
    border-radius: 3px; box-shadow: 0 2px 8px 4px rgba(0, 0, 0, 0.14); left: 0; right: 0;
    margin: auto; height: auto; padding: 15px 10px; text-align: center;            
}
section { background: black; }
.hidden { display: none; }
.unchanged, .unchanged:active { color: #CCC; cursor: default; box-shadow: none; }
/*** SEL GROUP ***/

.sel-group {
    background: white;
    border-radius: 4px;
    /*border: 1px rgba(128, 128, 128, 0.45) solid;*/
    margin: 7px 0px;
    box-shadow: 0px 0px 6px rgba(0,0,0,0.1);
}
.sel-group div:first-child { border-top: 0px; }
.sel-group div .label {
    height: 100%; width: calc(100% - 80px); display: inline-block; padding: 15px; box-sizing: border-box;
}
.sel-group div .delete {
    background-image: url('../images/x1.svg'); background-repeat: no-repeat; background-position: center;
    background-size: 15px; cursor: pointer; height: 15px; width: 15px; display: inline-block;
    box-sizing: border-box; float: right; margin: 17px 15 0px -30px; opacity: 0;
}
.sel-group div:hover .delete { opacity: 1; }
.sel-group div {
    background-position: center right -30px; background-image: url('../images/check-blue.svg');
    background-repeat: no-repeat; background-size: 20px auto;
}
.sel-group div.selected {
    background-position: center right 15px;
}
.sel-group div:active { box-shadow: inset 0px 0px 12px rgba(0,0,0,0.15); }

/*** MODAL BOX ***/
.modal-box .row { display: table-row; }
.modal-layer{
    margin: 0px; background-color: black; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%;
    animation-name: trnsprt-appear; animation-duration: 0.4s; animation-fill-mode: forwards;
    animation-timing-function: ease; animation-iteration-count: 1; animation-play-state: running;
    z-index: 1000;
}
.modal-box{
    background: #eaeaea; width: 90%; border-radius: 4px; text-align: center; vertical-align: middle;
    position: fixed; top: 0px; bottom: 0; left: 0; right: 0; margin: auto;
    animation-name: appear; animation-duration: 0.2s; animation-fill-mode: forwards;
    animation-timing-function: ease; animation-iteration-count: 1; animation-play-state: running;
    z-index: 1001;
}
.modal-box iframe{
    height: calc(100% - 3px);
    /*height: 100%;*/
    width: 100%;
}
.modal-box #modal-bar{
    color: #4994f5; border-bottom:1px #DDD solid;
    background-repeat: no-repeat; background-position: right 10px center; cursor: pointer; background-color: white;
    border-top-right-radius: 4px; border-top-left-radius: 4px; display: table-cell; padding: 8px;
}
.modal-div { width: 100%; padding: 15px 20px; box-sizing: border-box; }
.modal-box #modal-content{ margin-bottom: 5px; display: table-cell; }
.modal-box #modal-content .modal-div { vertical-align: middle; display: table; }
.modal-box #bttn-row input {  min-width: 120px; width: 50px; padding: 15px 20px;}
.modal-box h3 { text-align: center; }
.modal-box .details {
    font-size:0.9em; line-height: 1.3em; margin:4px 0px 10px 0px; color:#555; text-align: center;
}
#load-bar {
    background: #01a0ef; height: 5px; position: fixed; top: -5px; left: 0px; width: 100%;
    transition: top 0.3s ease-out, opacity 0.3s ease-out; z-index: 99999; opacity: 0px;
}
.button {
    font-size: 1em; border: 0px; border-radius: 3px; display: inline-block;
    text-transform: uppercase; padding: 8px 25px;
    cursor: pointer; vertical-align: middle; text-align: center;
    width: 150px; display: block; background-color:rgba(95,181,241,1); color:#ffffff;margin: 0px auto 0px auto;
}

/*** Login Section ***/
#login-modal { background-color: rgba(15,15,15,0.75); }
#user-login {
    width: 100%; margin: 0px; display: block;
}
#user-login .button { padding: 14px 25px; }
body.logged-in #user-login {
    opacity: 0; top: -500px; z-index: -100;
}
#user-login .row input {
    -webkit-appearance: none; width: 100%;
    border: 0px; margin-bottom: 15px; color: #444; border-radius: 3px;
    background-repeat: no-repeat; background-position: center right 10px;
    padding: 5px 10px; height: 40px; font-size: 1.4em; font-weight: 300;
}
#user-login .row { padding: 12px 10px 10px; display: inherit; }
#user-login .row a { color: white; display: block; font-size: 1.5em; margin-bottom: 25px; text-align: middle; }

/*** UI Switch/Toggle ***/
.switch { 
    height: 34px; width: 80px; border-radius: 17px; display: block; background: #40b5f7; padding: 4px; transition: 0.3s; margin: 2px 0px; color: white;
}
.switch.off { background: #d7e1ed; color: rgba(0,0,0,0.6); }
.switch a { height: 26px; width: 26px; border-radius: 13px; display: block; background: white; transition: 0.3s; animation-duration: 0.4s; animation-name: switch-on; }
.switch.off a { animation-name: switch-off; }
.switch:not(.off) a { transform: translateX(46px) }
.switch:before { content: "On"; position: relative; left: 12px; margin-bottom: -20px; display: inline-block; top: 4px; font-size: 1em; transition: 0.3s; }
.switch.off:before { content: "Off"; left: 37px; }
@keyframes switch-on {
    0% { width: 26px; margin-left: 0px; }
    50% { width: 40px; margin-left: -14px; }
    100% { width: 26px; margin-left: 0px; }
}
@keyframes switch-off {
    0% { width: 26px; }
    50% { width: 40px; }
    100% { width: 26px; }
}

/*** LOAD BAR ***/
.api-loading #load-bar {
    top: 0px;
    background-image: -moz-linear-gradient(160deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 25%, rgba(255,255,255,0.5) 60%, rgba(255,255,255,0) 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(25%,rgba(255,255,255,0)), color-stop(60%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
    background-image: -webkit-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%);
    background-image: -o-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%);
    background-image: -ms-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%);
    background-image: linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%);
    background-repeat: repeat-y;
    background-position:-2500px 0;
    animation: shimmerBackground 0.8s linear infinite;
    animation-delay: 0.5s;
    transition-delay: 0.5s;
}
/*** CONNECTION ERROR MESSAGE ***/
.notification.bottom:not(.left):not(.right) {
    background: rgb(95,181,241); color: white; text-align: center; padding: 10px; margin: 0px auto;
    position: fixed; bottom: 20px; left: 0px; right: 0px; z-index: 2000; transform: translateY(80x); opacity: 0;
    width: 90%; max-width: 600px; border-radius: 10px; box-shadow: 0px 0px 20px rgba(0,0,0,0.35); animation-fill-mode: forwards;
    animation-name: notification-bottom; animation-duration: 0.5s; animation-timing-function: ease-in-out;
}
.notification input[type=button] { background: white; color: rgb(95,181,241); margin: 0px; padding: 6px 12px; margin-left: 12px; font-size: 1em; }
.notification input[type=button].gray { background: rgba(255,255,255,0.7); }
.notification p { display: inline-block; margin: 10px 0px; }
.notification.error { background: rgb(207, 0, 15) !important; }
.notification.error input[type=button] { color: rgb(207, 0, 15) !important; }

#json-error {
    background: rgb(207, 0, 15); color: white; text-align: center; padding: 14px; margin: 0px auto;
    position: fixed; top: calc(100% - 70px); left: 0px; right: 0px; z-index: 2000; max-width: 500px; width: 90%;
    border-radius: 10px; box-shadow: 0px 0px 20px rgba(0,0,0,0.35); transform: translateY(80px);
}

/*** Copied from maint-login.php { ***/
#login-modal-wrap { background-color: rgba(0, 0, 0, 0); }
#user-login #dropdown {
    display: none;
}
#user-login.edit div#dropdown.row {
    display: block;
}
#user-login.edit div#admin_login.row, #user-login.edit input.button {
    display: none;
}
#sel {
    width: 100%; border: 0px; margin-bottom: 15px; color: #444; border-radius: 3px;
    background-repeat: no-repeat; background-position: center right 10px; padding: 5px 10px;
    height: 40px; font-size: 1.4em; font-weight: 300;
}
#pwd-reset {
    display: block; background: rgba(255,255,255,0.1); padding: 5px; border-radius: 4px; color: rgba(255, 255, 255, 0.8);
    margin: 20px auto 10px; font-size: 0.9em; width: 150px; transition: 0.3s; cursor: pointer;
}
#pwd-reset:hover:not(:active) { background: rgba(255,255,255,0.2); }

/*** Update Password ***/
#up-modal fieldset input[type=text], #up-modal fieldset input[type=password] {
    border: 0px; font-size: 1.1em; box-sizing: border-box; margin: 5px 0px;
    padding: 8px 12px; border-radius: 4px; width: 100%; height: auto;
}
#up-modal fieldset { padding: 0px; }
#up-modal input[type=button]:hover {
    background: rgba(255, 255, 255, 0.8); border: 0px; color: inherit;
}
#up-modal input[type=button]:active {
    background: rgba(255, 255, 255, 0.5);
    box-shadow: 0px 0px 5px rgba(0,0,0,0.1);
}
#up-modal input { transition: 0.3s; }
#up-modal .modal-footer a {
    color: rgba(95,181,241,1); text-decoration: none;
}
.modal.error input.login {
    box-shadow: inset 0px 0px 0px 2px rgb(236, 131, 122);
}
.up-error { display: none; color: rgb(255, 73, 63); margin: 10px 0px; font-size: 0.95em; }
.modal.error #up_login_error { display: block; }
.modal.authorized #up_password, .modal.authorized .modal-footer { display: none; }
#up_password_error { font-size: 0.8em; text-align: left; }
.up-row a {
    color: white; font-size: 1em; display: inline-block; padding: 8px 10px; background: rgba(0,0,0,0.5);
    border-radius: 4px; width: auto; text-decoration: none;
}
#tfa_wrap { width: 100%; transition: 0.3s; margin: -40 auto; transform: scale(0.1); opacity: 0; }
#tfa_wrap.show { margin: 0px auto; transform: scale(1); opacity: 1; }
#tfa_wrap p { font-size: 0.9em; margin: 0px auto 10px; color: white; }
/*** Copied from maint-login.php } ***/

/*.modal-box.fixed { top: 150px; position: absolute; bottom: auto; }*/
@keyframes trnsprt-appear {
    0% {opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; filter: alpha(opacity=0);}
    100% {opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; filter: alpha(opacity=40);}
}
@keyframes trnsprt-disappear {
    0% {opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; filter: alpha(opacity=40);}
    100% {opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; filter: alpha(opacity=0);}                
}
@keyframes appear {
    0% {opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; filter: alpha(opacity=0);}
    100% {opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; filter: alpha(opacity=100);}
}
@keyframes disappear {
    0% {opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; filter: alpha(opacity=100);}
    100% {opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; filter: alpha(opacity=0);}
}
@keyframes shimmerBackground {
    0% {background-position:-2500px 0; opacity: 0.8;}
    50% { opacity: 1;}
    100% {background-position:2500px 0; opacity: 0.8;}
}
@keyframes notification-bottom {
    0% { opacity: 0; transform: translateY(80px); }
    60% { opacity: 1; transform: translateY(-10px); }
    100% { opacity: 1; transform: translateY(0px); }
}