.block-scroll {
    overflow: hidden !important;
}

.modal {
    display: block; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal.transparent {
    background-color: rgba(0,0,0,0);
}

.modal.mobile {
    overflow: auto;
}

/* Modal Content/Box */
.modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: rgb(52, 50, 48);
    text-align: center;
    font-family: proxima-nova, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
}

@media (max-width: 360px) {
    .modal-content { font-size : 14px; }
}

.modal-content .button-close {
    display: block;
    padding: .25em .5em;
    font-size: 2em;
    font-weight: bold;
    color: #fff;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

.modal-content .button {
    color: #a2aaad;
    cursor: pointer;
}

.modal-content .button.disabled {
    color: #53575a;
}

.modal-content .button.border.disabled {
    border: 2px #a2aaad solid;
}

.modal-content .head {
    font-style: normal;
    font-weight: 600;
    color: #fff;
    padding: 1em 4em 1em 1em;
    border-width: 0;
    border-bottom-color: #fff;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.modal-content .subhead {
    padding: 1em 0 1em;
    color: #d0d3d4;
    border-width: 0;
    border-bottom-color: #fff;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.modal-content .subhead .item {
    text-align: left;
    padding: 0 2em 0;
    line-height: 1.5;
    cursor: pointer;
}

.modal-content .subhead .item > span {
    border-bottom: 2px solid;
}

.modal-content .subhead .item.selected {
    background-color: #4f4f4f;
    color: white;
    cursor: default;
}

.modal-content .subhead .item + .item {
    margin-top: .25em;
}

.modal-content .body {
    text-align  : left;
    color       : #d0d3d4;
}

.modal-content .body_field{
    border          : 2px solid #d0d3d4;
    width           : 95%;
    min-width       : 95%;
    max-width       : 95%;
    padding         : .45em;
    background-color: rgb(52, 50, 48);
    font-family     : proxima-nova,sans-serif;
    font-style      : normal;
    font-weight     : 400;
    display         : inline-block;
    color           : inherit;
}

.modal-content .body_field_box{
    white-space: nowrap;
}

.modal-content .mandatory.body_field_box::after{
    font-size   : 2em;
    padding-left: 0.2em;
    vertical-align : top;
    content : '*';
}

.modal-content .body_field_box.message{
    margin-top  : 1em;
}

.modal-content .body_field.name{
    margin-bottom  : 1em;
}

.modal-content form {
    margin: 0;
}
.modal.desktop .modal-content .body {
    padding: 2em 3em 2em 4em;
}

.modal.mobile .modal-content .body {
    padding: 2em;
}

.modal-content .footer {
    padding         : 1em 2em;
    border-top-color: #fff;
    border-top-width: 2px;
    border-top-style: solid;
    color           : #d0d3d4;
}

#feedback_agreement {
    display: block;
    width: 100%;
    margin-bottom: 2em;
    color: inherit;
    text-align: left;
}

#feedback_agreement::after {
    content : "By submitting feedback, you agree that your comments may be displayed on the JBJS website. All feedback is moderated before posting occurs.";
}

.modal.desktop .modal-content .footer,
.modal-content .play-btn-container
{
    text-align: right;
}

.modal.mobile .modal-content .footer {
    text-align: center;
}

@media (max-height: 500px) {
    #feedback_agreement.mobile  { margin-bottom: 1em; }
    .modal.mobile .modal-content .body { padding: 1em 2em; }
    textarea.message.mobile     { height: 3em; }
}

#modal_login_info > .modal-content > .head {
    padding: 1em;
}

#modal_login_info > .modal-content > .body {
    text-align: center;
}

#modal_login_info > .modal-content > .footer {
    text-align: center;
}