/* Page tabs */

form.basic label 
{
    display:block;
    line-height:20px;
    font-weight:bold;
    color:#777;
    font-size:13px;
}

form.basic input[type=text], form.basic input[type=password] 
{
    width:260px;
    border-radius:5px;
    border:solid 1px #ccc;
    padding:5px;
    outline:none;
    margin:0 0 10px 0;
}

form.basic input[type=button], form.basic input[type=submit] 
{
    background:url(/images/bgBlue.jpg) repeat-x;
    padding:6px 24px;
    font-size:13px;
    font-weight:bold;
    color:#fff;
    border:solid 1px #1B65AF;
    border-radius:5px;
}

form.basic input[type=button].disabled, form.basic input[type=submit].disabled 
{
    background:url(/images/bgGray.jpg) repeat-x;
    border-color:#555;
}

form.basic input[type=button]:active, form.basic input[type=submit]:active 
{
    background-position:0px -10px;
    -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
    box-shadow: inner 0 0 10px rgba(0, 0, 0, 0.3);
}

form.basic input[type=text].formHighlight, form.basic input[type=password].formHighlight, form.basic textarea.formHighlight
{
    background:#FFF8C9 url(/images/bgAlertShort.jpg) repeat-x;
    border:solid 1px #FFCC00 !important;
}

.tabs 
{
    margin:0px 0 0 20px;
    padding:0px 4px;
    position:relative;
}

.tabs a
{
    display:inline-block;
    padding:3px 6px 3px 6px;
    font-size:12px;
    font-family:MS Sans Serif, Sans-Serif;
    text-decoration:none;
    border:solid 1px #BBBBBB;
    border-bottom:none;
    background-color:#CFCFCF;
    background-image: -moz-linear-gradient(top, #F2F2F2 0%, #CFCFCF 100%);
    background-image: -o-linear-gradient(top, #F2F2F2 0%, #CFCFCF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F2F2F2), color-stop(1, #CFCFCF));
    background-image: -webkit-linear-gradient(top, #F2F2F2 0%, #CFCFCF 100%);
    background-image: -ms-linear-gradient(top, #F2F2F2 0%, #CFCFCF 100%);
    background-image: linear-gradient(to bottom, #F2F2F2 0%, #CFCFCF 100%);
    margin:4px 0 0 0;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    cursor:default;
    position:relative;
    color:#333;
}

.tabs a:hover
{
    background-color:#96C7E4;
    background-image: -moz-linear-gradient(top, #EBF4FA 0%, #96C7E4 100%);
    background-image: -o-linear-gradient(top, #EBF4FA 0%, #96C7E4 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EBF4FA), color-stop(1, #96C7E4));
    background-image: -webkit-linear-gradient(top, #EBF4FA 0%, #96C7E4 100%);
    background-image: -ms-linear-gradient(top, #EBF4FA 0%, #96C7E4 100%);
    background-image: linear-gradient(to bottom, #EBF4FA 0%, #96C7E4 100%);
    border-color:#4FA2D2;
}

.tabs a.on 
{
    background:#fff;
}

.tabs br 
{
    clear:both;
}




/* Form and input styles */
.form
{
    margin: 10px 0px;
    display:none;
}

.form *
{
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

fieldset
{
    border: solid 1px #e2e2e2;
    margin-bottom: 10px;
    border-radius: 7px;
}

fieldset legend 
{
    font-size:10px;
    margin:0px 10px;
    text-transform:uppercase;
    color:#777;
}

label 
{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.form div.column
{
    width: 48%;
    min-width: 430px;
    float: left;
    margin-right:5px;
}

.form div.input
{
    position: relative;
    padding: 0 0 0 125px;
    margin: 5px;
    clear: both;
    height:30px;
}

.form div.input.heightAuto 
{
    height:auto;
}

.form div.input.noMarginBottom
{
    margin-bottom:0;
}

.form div.input.labelRight
{
    padding:0 0 0 22px;
}

.form div.input.labelRight label 
{
    position:static;
    line-height:32px;
}

.form div.input.labelRight input
{
    position:absolute;
    top:5px;
    left:5px;
}

.form div.input.float
{
    float:left;
    clear:none;
}

.form div.input.large 
{
    height:240px;
}

.form div.input.placeholder
{
    padding: 0;
}

.form div.input label
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 120px;
    text-align: right;
    line-height: 30px;
    font-size:12px;
    color:#fff;
    text-shadow: 1px 1px 3px rgba(0,0,0,.6);
}

.form div.input.height100, .form div.input.height100 label, .form div.input.height100 textarea
{
    height:100px;
}

.form div.input.height200, .form div.input.height200 label, .form div.input.height200 textarea
{
    height:200px;
}

.form div.input label.flow, .form div.input div.flow
{
    display: block;
    float: left;
    position: static;
    width: auto;
    line-height: 30px;
}

.form div.input label span.labelNote 
{
    line-height:18px;
    font-size:11px;
    display:block;
    margin:5px 0;
    text-align:center;
    border:solid 1px #318DC8;
    padding:3px;
    background:#E7F4FE;
    border-radius:7px;
}

.form div.input input[type=text], .form div.input select, .form div.input input[type=password], .form div.input textarea, .textInput
{
    width: 100%;
    min-width: 300px;
    font-size:12px;
}

.form div.input.float input[type=text], .form div.input.float input[type=password], form div.input.float textarea 
{
    min-width:auto;
}

.form div.input textarea 
{
    min-height:80px;
}

.form div.input input[type=checkbox]
{
    float: left;
    margin: 4px 4px 9px 0;
}

.form div.input input[type=text], .form div.input input[type=password], .form div.input select, .form div.input textarea, .textInput
{
    border-radius: 5px;
    outline: none;
    line-height: 16px;
    height: 24px;
    padding: 2px 4px;
    border: solid 1px #ccc;
    margin: 2px 0;
    position: absolute;
    top:0px;
    left:125px;
}

.form div.input input[type=button]
{
    margin-left: 0;
}

form div.input textarea
{
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    resize: none;
}

/* Checkbox label lists */
.form div.checklist 
{
    padding:5px;
}

.form div.checklist label 
{
    float:left;
    display:block;
    line-height:20px;
    padding:0 20px 0 20px;
    position:relative;
}

.form div.checklist label input[type=checkbox] 
{
    position:absolute;
    top:3px;
    left:3px;
}

/* Form insructions and alert overlays */

form div.input span.alert, form div.input span.instruction 
{
    position: absolute; 
    margin: 29px 0 0 0;
    top:0px;
    left:120px;
    padding:6px 10px;
    font-size:11px;
    z-index:100;
    border-radius:5px;
    font-weight:bold;
    display:none;
    min-width:200px;
}

form div.input.labelRight span.instruction 
{
    left:-6px;
}

form div.input span.instruction
{
    color:#fff;
    box-shadow:2px 2px 4px rgba(0, 0, 0, .5);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, .2);
    background-color:#80C9FF;
    background-image: -moz-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -o-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #80C9FF), color-stop(1, #0068A6));
    background-image: -webkit-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -ms-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: linear-gradient(to bottom, #80C9FF 0%, #0068A6 100%);
    border:solid 1px #0068A6;
}

form div.input span.instruction:after, form div.input span.instruction:before 
{
    bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;
}

form div.input span.instruction:after 
{
    border-color: rgba(255, 255, 255, 0); border-bottom-color: #80C9FF; border-width: 7px; left: 20px; margin-left: -10px;
}

form div.input span.instruction:before
{
    border-color: rgba(255, 255, 255, 0); border-bottom-color: #0068A6; border-width: 9px; left: 20px; margin-left: -12px;
}

form div.input span.alert
{
    color:#444;
    box-shadow:2px 2px 4px rgba(0, 0, 0, .5);
    
    background-color:#FFF457;
    background-image: -moz-linear-gradient(top, #FFF457 0%, #FFBF01 100%);
    background-image: -o-linear-gradient(top, #FFF457 0%, #FFBF01 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFF457), color-stop(1, #FFBF01));
    background-image: -webkit-linear-gradient(top, #FFF457 0%, #FFBF01 100%);
    background-image: -ms-linear-gradient(top, #FFF457 0%, #FFBF01 100%);
    background-image: linear-gradient(to bottom, #FFF457 0%, #FFBF01 100%);
    border:solid 1px #F0B500;
}

form div.input span.alert:after, form div.input span.alert:before 
{
    bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none;
}

form div.input span.alert:after 
{
    border-color: rgba(255, 255, 255, 0); border-bottom-color: #FFF457; border-width: 7px; left: 20px; margin-left: -10px;
}

form div.input span.alert:before
{
    border-color: rgba(255, 255, 255, 0); border-bottom-color: #F0B500; border-width: 8px; left: 20px; margin-left: -11px;
}

.code
{
    font-family: Courier;
}

/* Form Buttons */

.form input[type=submit], .form input[type=button], .btn
{
    width: auto;
    min-width: inherit;
    padding: 5px 20px;
    background-color:#0068A6;
    background-image: -moz-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -o-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #80C9FF), color-stop(1, #0068A6));
    background-image: -webkit-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: -ms-linear-gradient(top, #80C9FF 0%, #0068A6 100%);
    background-image: linear-gradient(to bottom, #80C9FF 0%, #0068A6 100%);
    border:solid 1px #0068A6;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    border-radius: 7px;
    -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, .2);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .2);
    text-decoration:none;
}

.form input[type=submit]:hover, .btn:hover
{
    background-color:#005B99;
    background-image: -moz-linear-gradient(top, #6EB8EE 0%, #005B99 100%);
    background-image: -o-linear-gradient(top, #6EB8EE 0%, #005B99 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6EB8EE), color-stop(1, #005B99));
    background-image: -webkit-linear-gradient(top, #6EB8EE 0%, #005B99 100%);
    background-image: -ms-linear-gradient(top, #6EB8EE 0%, #005B99 100%);
    background-image: linear-gradient(to bottom, #6EB8EE 0%, #005B99 100%);
}

.form input[type=submit].gray, .form input[type=button].gray, a.btn.gray
{
    background-color:#555555;
    background-image: -moz-linear-gradient(top, #BDBDBD 0%, #555555 100%);
    background-image: -o-linear-gradient(top, #BDBDBD 0%, #555555 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #BDBDBD), color-stop(1, #555555));
    background-image: -webkit-linear-gradient(top, #BDBDBD 0%, #555555 100%);
    background-image: -ms-linear-gradient(top, #BDBDBD 0%, #555555 100%);
    background-image: linear-gradient(to bottom, #BDBDBD 0%, #555555 100%);
    border-color: #535353;
}

.form input[type=submit].gray:hover, .form input[type=button].gray:hover, a.btn.gray:hover
{
    background-color:#464646;
    background-image: -moz-linear-gradient(top, #AAAAAA 0%, #464646 100%);
    background-image: -o-linear-gradient(top, #AAAAAA 0%, #464646 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #AAAAAA), color-stop(1, #464646));
    background-image: -webkit-linear-gradient(top, #AAAAAA 0%, #464646 100%);
    background-image: -ms-linear-gradient(top, #AAAAAA 0%, #464646 100%);
    background-image: linear-gradient(to bottom, #AAAAAA 0%, #464646 100%);
}

.form input.formHighlight, .form select.formHighlight
{
    border: solid 1px #F0B500 !important;
    background: #FFFCE1;
}

/* Form Read-Only and Disabled */
*[readonly=readonly], *[disabled=disabled], .disabled
{
    background: #eee;
}

.disabled
{
    border-color: #777 !important;
    color: #777 !important;
    cursor: wait !important;
}

.form input.labelMargin, .form textarea.labelMargin, .form img.labelMargin
{
    margin-left: 115px;
}

.form h1
{
    margin: 0 0 6px 0;
}


/* jQuery Timepicker */
.ui-timepicker-div .ui-widget-header
{
    margin-bottom: 8px;
}
.ui-timepicker-div dl
{
    text-align: left;
}
.ui-timepicker-div dl dt
{
    height: 25px;
    margin-bottom: -25px;
}
.ui-timepicker-div dl dd
{
    margin: 0 10px 10px 65px;
}
.ui-timepicker-div td
{
    font-size: 90%;
}
.ui-tpicker-grid-label
{
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}

/* File Upload Styles */
div#fileUpload
{
    width: 400px;
    margin-left: -200px;
}

#fileUploadFrame
{
    width: 100%;
    border: none;
    background: #fff;
    height: 120px;
    overflow: hidden;
}

#imageList img
{
    width: 50px;
    border: solid 1px #999;
    margin-right: 5px;
}

.formNote 
{
    border-top:solid 1px #ccc;
    border-bottom:solid 1px #ccc;
    padding:5px 0;
    margin:5px;
}

.formNote, .formNote * 
{
    font-weight:bold;
    font-size:15px;
}

/* CONTENT KEYS */

div#MultiLine fieldset 
{
    padding:3px;
    margin-bottom:2px;
}

div#MultiLine select
{
    font-size:14px;
    font-weight:bold;
    display:block;
    height:24px;
    line-height:26px;
    border-radius:5px;
    border-top-right-radius:0;
    border-bottom-right-radius:0;
    border:solid 1px #ccc;
    width:100%;
}

div#MultiLine fieldset textarea 
{
    width:100%;
    resize:none;
    min-height:200px;
    border-radius:5px;
    border:solid 1px #ccc;
    padding:3px;
    font-family:Courier;
    line-height:16px;
    font-size:12px;
    display:none;
}

/* File Upload Button Containers */
#fileUploadIFrameButton 
{
    width:600px;
    height:34px;
    margin:0;
    padding:0;
}

.code 
{
    font-size:12px;
    line-height:16px;
    font-family:Courier;
}

div.input.contentKey input[type=text], div.input.contentKey textarea, .contentKeyContainer 
{
    border:solid 1px #BDBDBD;
    background-color:#ECECEC;
    background-image: -moz-linear-gradient(top, #FFFFFF 0%, #ECECEC 100%);
    background-image: -o-linear-gradient(top, #FFFFFF 0%, #ECECEC 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #ECECEC));
    background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #ECECEC 100%);
    background-image: -ms-linear-gradient(top, #FFFFFF 0%, #ECECEC 100%);
    background-image: linear-gradient(to bottom, #FFFFFF 0%, #ECECEC 100%);
}

div.input.contentKey input[type=text], div.input.contentKey textarea
{
    padding-left:46px;
    cursor:pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

div.input.contentKey div.flag
{
    top:9px;
    left:130px;
    width:30px;
    height:11px;
    line-height:9px;
    padding-left:18px;
    background:url(/images/cultures/us.png) no-repeat;
    z-index:10;
    position:absolute;
}

div.input label.flag 
{
    padding-right:20px;
    background-repeat:no-repeat;
    background-position:right center;
}