﻿/* $4.1.12 - Patterns - Content - Modal */
.modal {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    height: 100%;
    left: 0;
    opacity: 0;
    padding: var(--space-l);
    pointer-events: none;
    position: fixed;
    top: 0;
    -webkit-transition: opacity 330ms ease;
            transition: opacity 330ms ease;
    width: 100%;
    z-index: 102;
    
    
    
    
}

.modal .animate {
    -webkit-animation-duration: 500ms;
            animation-duration: 500ms;
}

.modal.is--visible {
    opacity: 1;
    pointer-events: auto;
}

.modal-overlay {
    background-color: rgba(0, 0, 0, .25);
 }

.modal-wrapper {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
    box-shadow: var(--shadow-xl);

    max-width: 500px;
    width: 100%;
    
}

.modal-top {
    /*display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: var(--space-m) var(--space-m) var(--space-none);*/
    display: none !important;
}

.modal-title {
    -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
}

.modal-close a, 
.modal-close a:visited {
    color: var(--color-neutral-8);
}

.modal-close a:hover {
    color: var(--color-neutral-9);
}

.modal-content {
    max-height: 70vh;
    overflow-y: auto;
    padding: var(--space-m);
    
}

.modal-content .choices__list--dropdown {
    margin-bottom: var(--space-m);
}

.modal-content .choices__list--dropdown .choices__list {
    max-height: 200px;
}

.modal-footer {
    /*border-top: var(--border-size-s) solid var(--color-neutral-4);
    padding: var(--space-m);
    display: none;*/
    display: none !important;
}

.center {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
}
.notify
{
    display: flex;
    line-height: initial !important;
}
.notify-session-icon .fa
{
    color: orange;
}
.notify .notify-session-text
{
    margin-left: 5px;
    text-align: left;
}
.notify .notify-session-text span
{
    line-height: initial;
}
.notify .notify-countdown
{
    display: inline-block;
    margin-top: 10px;
}