/*
 * LeaveNotice - plug in to notify users of leaving your site
 * Examples and documentation at: http://rewdy.com/tools/leavenotice-jquery-plugin
 *
 * STYLESHEET
 * --------------------------
 * This file can be edited to adjust the style of the dialog. You can change the IDs
 * used by sending options to the plugin when it is initiated. For more information 
 * on this, please refer to the documentation at:
 * http://rewdy.com/tools/leavenotice-jquery-plugin
 *
 * NOTE: This dialog loads within your page. Therefore, it takes on any global styling
 * you already have in place. You might need to override your other styles here if
 * you are having trouble getting things to appear as you want them to.
 *
 */

/* The style for the blackout div that appears when the exit dialog is shown. */
#ln-blackout {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 1000;
}

/* This style is for a container that holds the message dialog box. It has been added primarily to help with positioning. I know some people would complain about this, but it seems more efficient this way even it is isn't semanitc. */
#ln-messageHolder {
    position: fixed;
    top: calc(25vh);
    left: 0;
    width: 100%;
    max-width: 100%;
    z-index: 1001;
}

/* This style is for the div that holds the actual exit dialog. */
#ln-messageBox {
    margin: 0 auto;
    max-height: 450px;
    background-color: rgb(247, 238, 212);
    border: 10px solid rgb(228, 212, 175);
    -moz-box-shadow: 0 0 20px 10px #666;
    -webkit-box-shadow: 0 0 20px #666;
    text-align: center;
    padding: 20px;
    height: calc(50vh);
    overflow: auto;
    width: calc(100vw - 20px);
    max-width: 600px;
}

/* This style is applied to the link that closes the dialog. */
a#ln-cancelLink {
    background-color: #e6e6e6;
    font-weight: bold;
    padding: 5px;
    color: #666;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.8em;
}
a#ln-cancelLink:hover {
    background-color: #666;
    color: #e6e6e6;
}
#ln-cancelLink {
    padding: 10px;
}

a#ln-link {
    background-color: #e6e6e6;
    font-weight: bold;
    padding: 5px 25px 5px 25px;
    color: #666;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.8em;
}
a#ln-link:hover {
    background-color: #666;
    color: #e6e6e6;
}

/* This style is for the box that holds the section that says where the user is being directed to. */
.setoff {
    background-color: #f2f2f2;
    padding: 5px;
    margin: 10px 0 20px 0;
}