body { background: #FCF5EF; }

#header { margin:10px 0 30px; }
#header h1 { margin:0 0 10px; }
#header h1 a { display: block; width: 215px; height: 50px; overflow: hidden; }
#nav .events { font-size:150%; }
#nav .jobs { font-size:100%; }
#nav .selected { text-decoration: underline; }
#nav a { padding:.2em; color: #663201; }

a { color: #17D1A8; }
a:hover{ color:#555555; }
h2, h1 { color:#663201; }
td { vertical-align: top; }
.actionbox{ border:1px solid #ccc; }
.boxed{ padding:4px; text-align:left; margin: 15px 0; }
.boxed th{ text-align:left; padding:0 5px 5px; margin-bottom:3px; border-bottom:1px solid #ddd; }
.boxed td{ padding:5px; border-bottom:1px solid #ddd; }
.boxed td.empty{ /*text-align:center;*/ }
.boxed .edit{ font-size:77%; padding-right:5px; /*border-right:1px solid #ddd;*/ }
.boxed .edit a{ display: inline-block; color:#aaa; border:1px solid #ddd; border-radius: 3px; padding:5px; background:#fff; text-decoration:none; }
.boxed .del{ padding-left:5px; /*border-left:1px solid #ccc;*/ }
.boxed .del button{ font-size:77%; color:#aaa; background:#fff; border:1px solid #ddd; border-radius: 2px; padding:3px; cursor:pointer; cursor:hand; }
p.action{ margin:0; padding:5px; /*text-align:right;*/ }
p.action a, p.center a{ text-decoration:none; }
p.center{ margin:0; padding:5px 5px 0; text-align:center; }

legend { color: #663201; margin: 0 0 -1.4em -7em; width: 7em; text-align: left; }
.fieldset { margin-left: 7em; padding: 0; border-color: transparent; }
label { display: inline-block; vertical-align: top; width: 7em; color: #663201; text-align: left; }
.radiolabel,
.checkboxlabel { width: auto; padding: 0 2ex 0 .5ex; }

.contract { font: 85% verdana, arial; color: #663201; }
.contract h1,
.contract h2 { font-weight: normal; }
.contract h1 { text-align:center; }
.contract #header { margin: 0 auto; }
.contract #header h1 a { height: 64px; margin: 0 auto; }
.contract p,
.contract ul { color: #000; margin: 3px 0; padding:0; }
.contract ol strong { color: #663201; font-weight:normal; font-size:120%; }
.contract strong.focus { color: #000; font-weight:bold; font-size:130%; }
.contract li { margin: 10px 0 20px; padding:0; }
.contract table { color:#000; font:normal 100% verdana, arial; }

.signed { margin-top: 75px; } 
.signed td { border-top: 1px solid #000; vertical-align: top; color:#000; font-size: 100%; padding:5px 10; }

/* --- Dialog Modal Overlay --- */
/* The iframe itself sitting in the parent page */
iframe.dialog {
    border: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background: transparent;
}

/* The full-screen backdrop inside the iframe */
.dialog-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20000;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    justify-content: center;
    align-items: center;
    animation: backdropFadeIn 0.2s ease-out;
}

@keyframes backdropFadeIn {
    from { background-color: rgba(0, 0, 0, 0); }
    to { background-color: rgba(0, 0, 0, 0.55); }
}

/* The actual modal dialog containing the form */
.dialog-modal {
    background: #FCF5EF;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    position: relative;
    /* This allows it to natively shrink to fit the content! */
    max-width: 90vw;
    max-height: 90vh;
    overflow: auto;
    text-align: left;
    animation: dialogFadeIn 0.2s ease-out;
}

@keyframes dialogFadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

/* Close button on the modal */
.dialog-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #fff;
    border: 1px solid #d4c3b3;
    color: #663201;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    line-height: 24px;
    text-align: center;
    padding: 0;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    transition: 0.2s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
}

.dialog-close:hover {
    background: #663201;
    color: #fff;
    border-color: #663201;
    transform: scale(1.1);
}
