/*--------------------------------------------+
 | Site: American Massage Therapy Association |
 | Part: Form styles                          |
 +--------------------------------------------*/

/* Basics
======================================================================*/
input, select, textarea { color: #414042; font-size: 1em; }
textarea { height: 10em; }


/* Specifics
======================================================================*/

/* Attachments */
.attachments dt { font-weight: bold; margin-top: 0.75em; }
.attachments a, .attachments span, .attachments strong { margin-right: 1em; }

/* Buttons */
a.btn, .btn a, input.btn, label.btn {
    -webkit-appearance: none;
    background: #ff5940;
    border: 1px solid #ff5940;
    border-radius: 0;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 0.4em 1em;
}

.btn:hover { background: #fff; color: #ff5940; text-decoration: none; }

    /* Toggle */
    .btn-toggle {
        background: #fdfdfd;
        background: -moz-linear-gradient(top, #fdfdfd 0%, #f0f0f0 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#f0f0f0));
        background: -webkit-linear-gradient(top, #fdfdfd 0%,#f0f0f0 100%);
        background: -o-linear-gradient(top, #fdfdfd 0%,#f0f0f0 100%);
        background: -ms-linear-gradient(top, #fdfdfd 0%,#f0f0f0 100%);
        background: linear-gradient(to bottom, #fdfdfd 0%,#f0f0f0 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#f0f0f0',GradientType=0 );
        border: 1px solid #d1d1d1;
        border-radius: 6px;
        cursor: pointer;
        display: inline-block;
        margin-bottom: 5px;
        padding: 0.5em 0.8em 0.5em 2.1em;
        text-indent: -1.4em;
    }
    
    .btn-toggle input { margin-left: 0; }
    .btn-toggle .mute { white-space: nowrap; }
    .btn-toggle.disabled, .btn-toggle.disabled.on { background: #fafafa; border-color: #fff; cursor: default; filter: none; color: #aaa; }
    .btn-toggle.disabled .mute, .btn-toggle.disabled.on .mute { color: #aaa; }
    .btn-toggle.disabled strong, .btn-toggle.disabled.on strong { color: #000; }
    
    .btn-toggle.on {
        background: #06447a;
        background: -moz-linear-gradient(top, #06447a 0%, #367dba 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#06447a), color-stop(100%,#367dba));
        background: -webkit-linear-gradient(top, #06447a 0%,#367dba 100%);
        background: -o-linear-gradient(top, #06447a 0%,#367dba 100%);
        background: -ms-linear-gradient(top, #06447a 0%,#367dba 100%);
        background: linear-gradient(to bottom, #06447a 0%,#367dba 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#06447a', endColorstr='#367dba',GradientType=0 );
        border-color: #06447a;
        color: #fff;
    }
    
    .btn-toggle.on .mute { color: #b3d1eb; }
    
    /* Wizard buttons */
    #pWizardButtons .btn-back {
        background: none;
        filter: none;
        -ms-filter: none;
        border: 0;
        color: #366cb3;
        cursor: pointer;
        font-weight: normal;
        margin: 0 23px 0 -14%;
        padding: 0;
        text-shadow: none;
    }

/* CAPTCHA */
.captcha strong { background: #004785; color: #fff; font-weight: normal; display: inline-block; padding: 0.5em 1em 0.6em; }

/* Checklists */
.checklist { border: 1px solid #ccc; max-height: 20em; line-height: 1.4;    margin: 0 0 1em 0; overflow: auto; }
.checklist input { margin-bottom: 1px; }
.checklist label { display: block; padding: 0.1em 0 0.1em 25px; height: 1%; text-indent: -25px; }
.checklist li { background: none; display: block; float: none; margin: 0; padding: 0; white-space: normal; width: 100%; }
.checklist li p { margin: 0; padding: 1em 0 0; }
.checklist li ul { margin: 0 0 0 2em; }
.checklist .mute { font-size: 1em; white-space: nowrap; }
.checklist p { font-weight: bold; margin-bottom: 0.25em; }
.checklist .selected { background: #ffa; }
.checklist ul { margin-bottom: 1em; }
.form .checklist { margin-top: 0.5em; position: relative; width: 97%; }
.form .checklist-ajax { height: 20em; }
.form .checklist-ajax-loading { background: url(/images/loading.gif) no-repeat 50% 50%; }

/* Convention registration */
.convention-registration dl.form dt { padding-top: 20px; }
.convention-registration h3, .convention-registration h4 { margin-top: 20px; }

/* Dedicated searches */
.dedicated-search { background: #e3e6e6; font-size: 17px; margin-bottom: 20px; overflow: hidden; padding: 15px 20px 20px; }
.dedicated-search .action, .dedicated-search .btn { display: block; padding: 0.35em 0; text-align: center; width: 100%; }
.dedicated-search .field-help { float: none; font-size: 12px; font-weight: normal; width: auto; }
.dedicated-search .fields { width: 100%; }
.dedicated-search .fields p { float: left; font-weight: bold; margin: 0 1% 0 0; width: 42%; }
.dedicated-search .fields p a { font-weight: normal; }
.dedicated-search .fields p.submit { margin: 0; padding-top: 2px; width: 13%; }
.dedicated-search .fields .txt { width: 90%; }

    /* Benefits */
    .benefits-search { margin: 0 auto; width: 85%; }
    .benefits-search .dedicated-search { padding: 20px; }
    .benefits-search .dedicated-search .txt { font-size: 20px; width: 97%; }
    
    /* Location search */
    .location-search .dedicated-search p { width: 70%; }
    .location-search .dedicated-search .txt { width: 97%; }
    .location-search .dedicated-search p.submit { width: 28%; }
    
    /* Popup */
    .qtip .dedicated-search { background: none; border: 0; margin: 0; padding: 0; }
    .qtip .dedicated-search .txt { width: 95%; }
    
    /* Sidebar */
    .content-secondary .dedicated-search { font-size: 100%; padding-bottom: 0; }
    .content-secondary .dedicated-search .btn { padding: 0.15em 1em 0.25em; width: auto; }

/* Fields - fields with text underneath them */
dl.form .fields .txt { width: 90%; }
.fields { width: 53%; }
.fields label { display: block; }
.fields .field-help { font-size: 12px; display: block; float: none; margin-top: 0.2em; width: auto; }
.form .fields p { float: left; margin: 0 1% 15px 0; }

    /* Certification fields */
    dl.form .fields .c-cert-date { width: 43%; }
    dl.form .fields .c-cert-date .txt { width: 70px; }
    dl.form .fields .c-cert-number { width: 50%; }
    
    /* Location fields */
    dl.form .fields .c-city { width: 50%; }
    dl.form .fields .c-city .txt { width: 89%; }
    dl.form .fields .c-state { width: 15%; }
    dl.form .fields .c-state .txt { width: 68%; }
    dl.form .fields .c-zip { margin-right: 0; width: 23%; }

/* Help text */
.field-help { color: #777; font-weight: normal; }

/* jQuery UI */
    /* Autocomplete */
    .ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active { margin: 0 !important; }
    
    .ui-menu.ui-widget-content {
        background: #fff;
        border: 0;
        border-radius: 0;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
        font-size: 18px;
        max-height: 250px;
        overflow-x: hidden;
        overflow-y: scroll;
        padding: 0;
    }
    
    .ui-menu.ui-widget-content .mute { font-size: 14px; }
    .ui-menu.ui-widget-content .ui-state-hover { background: #e3f5f4; border: 0; color: #0082d1; cursor: pointer; }

/* Layout */
.check { display: none; }
.form { margin: 0; width: 100%; }
.form .c2l, .form .c2r { margin-bottom: 0; }
.form .mute { font-size: 0.9em; }
.form p { margin-bottom: 0.5em; }
.form table td, .form table th { font-size: 1em; }
.form > tbody > tr > td, .form > tbody > tr > th { border: 0; padding: 0.5em 0; }
.form > tbody > tr > th { font-weight: normal; padding-right: 2%; text-align: right; vertical-align: top; width: 22%; }
	
/* Likert scales */
.likert { width: 100%; }
.likert label { display: block; padding: 0.5em 0; text-align: center; }
.likert label:hover, .likert label.sel { background: #d7e6f8; }
.likert tr:hover { background: #f5f8fd; }
.likert .scale { text-align: center; }
.likert .scale strong { display: block; }
.likert thead th { background: #f5f8fd; padding: 0.3em 1em; vertical-align: bottom; }
.likert td, .likert th { border: 1px solid #e3ebf6; vertical-align: middle; }
.likert tbody th { padding: 0.5em 1em; width: 50%; }
.likert td { width: 10%; }

/* New forms */
dl.form dt { clear: both; margin: 0; }
dl.form .field { float: right; margin-bottom: 1em; width: 65%; }
dl.form .label { float: left; text-align: right; width: 32%; }
dl.form .options-h li, dl.form .options-v li { clear: none; }
dl.form .txt { width: 60%; }
dl.form textarea.txt { width: 98%; }
    
    /* Multiple fields on a single line */
    dl.form .field-single-line { margin-bottom: 0.5em; overflow: hidden; width: 60%; }
    dl.form .field-single-line p { box-sizing: border-box; float: left; margin: 0; padding-right: 10px; }
    dl.form .field-single-line .txt { width: 100%; }
    
        /* Location fields */
        dl.form .field-single-line .field-loc-city { width: 50%; }
        dl.form .field-single-line .field-loc-state { width: 20%; }
        dl.form .field-single-line .field-loc-postal { float: right; padding-right: 0; width: 30%; }
        
        /* Name fields */
            /* Full name (first/middle/last) */
            dl.form .fields-name-full .field-name-first, dl.form .fields-name-full .field-name-last { width: 40%; }
            dl.form .fields-name-full .field-name-last { float: right; padding-right: 0; }
            dl.form .fields-name-full .field-name-middle { width: 20%; }
            
            /* Long name (first/middle/last/suffix) */
            dl.form .fields-name-long .field-name-first, dl.form .fields-name-long .field-name-last { width: 30%; }
            dl.form .fields-name-long .field-name-middle, dl.form .fields-name-long .field-name-suffix { width: 20%; }
            dl.form .fields-name-long .field-name-suffix { float: right; padding-right: 0; }
            
            /* Short name (first/last) */
            dl.form .fields-name-short .field-name-first, dl.form .fields-name-short .field-name-last { width: 50%; }
            dl.form .fields-name-short .field-name-last { float: right; padding-right: 0; }

dl#memberComplete.form .field { float: none; padding-left: 26%; }
dl#memberComplete.form .label { float: left; margin-left: -25%; text-align: right; width: 30%; }
dl#memberComplete.form .field-help-short { color: #777; font-weight: normal; margin-left:2em }

/* Notifications */
div.alert, div.confirm, div.notice { color: #000; margin-bottom: 1em; padding: 24px 30px 30px 55px; }
div.alert dl, div.confirm dl, div.notice dl, div.alert p, div.confirm p, div.notice p { margin-bottom: 0.5em; }
div.alert .mute, div.confirm .mute, div.notice .mute { font-size: 1em; }
div.alert h6, div.confirm h6, div.notice h6 { font-size: 1em; }
div.alert li, div.confirm li, div.notice li { background: none; padding: 0; }

    /* Alerts */
    .alert { color: #e30013; }
    div.alert { background: #ffd4d4 url(/images/admin/notify-alert.gif) no-repeat 24px 29px; border: 3px solid #dd9898; }
    
    /* Confirmations */
    div.confirm { background: #d8ffd4 url(/images/admin/notify-confirm.gif) no-repeat 24px 29px; border: 3px solid #9edd98; }
    
    /* Notices */
    div.notice { background: #fff6d3 url(/images/admin/notify-notice.gif) no-repeat 24px 29px; border: 3px solid #ffe27e; }
    div.notice span.loading { background: url(/images/loading-small.gif) no-repeat 95% 50%; padding-right: 2em; }

/* Options */
.options-h, .options-v { list-style: none; margin: 0 0 0.5em 0; }
td .options-h, td .options-v { margin: 0; }
.options-h img { border-bottom: 3px solid #fff; padding: 5px; vertical-align: middle; }
.options-h > li > input, .options-v > li > input { margin-bottom: -0.05em; }
.options-v li input[type="checkbox"]:first-of-type, .options-v li input[type="radio"]:first-of-type { float: left; margin-left: -25px; }
.options-h li, .options-v li { background: none; clear: both; margin-bottom: 0.3em; padding: 0; }
.options-h li { display: inline; margin-right: 0.7em; white-space: nowrap; }
.options-v li { padding-left: 25px; }
.options-v li p { margin: 0; text-indent: 0; }

/* Placeholder */
input.placeholder, textarea.placeholder { color: #777; font-style: italic; }
input::-moz-placeholder, textarea::-moz-placeholder { color: #999; font-style: italic; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #999; font-style: italic; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #999; font-style: italic; }

/* Progress forms */
#progress-form { background: #ebeded; padding: 15px; }
#progress-form .btn { margin-right: 23px; }
#progress-form dt .field-help { color: #818286; display: block; float: none; font-size: 12px; width: auto; }
#progress-form dl.form .label { width: 25%; }
#progress-form dl.form .field { width: 70%; }
#progress-form .form-content { background: #fff; float: right; padding: 30px 3%; width: 72%; }
#progress-form textarea.txt { width: 98%; }

    /* Tabs */
    #progress-form .form-nav, #progress-form #nav-wizard { float: left; list-style: none; margin: 15px 0 0 0; position: relative; width: 22%; }
    #progress-form .form-nav li, #progress-form #nav-wizard li { background: #d0d3d3; border-right: 0; font-size: 16px; margin-bottom: 8px; }
    #progress-form .form-nav a, #progress-form #nav-wizard span { display: block; padding: 10px 24px; }
    #progress-form .form-nav a:hover { text-decoration: none; }
    #progress-form .form-nav .current, #famt-edit .form-nav li:hover, #progress-form #nav-wizard .current { background: #fff; }
    #progress-form .form-nav .current a, #progress-form #nav-wizard .current span { font-weight: bold; margin-right: -18px; }
    #progress-form .form-nav .current a, #progress-form .form-nav li:hover a { color: #414042; }

/* Questions */
.questions > li { margin-bottom: 1.5em; }
.questions .answers { font-weight: normal; list-style: none; margin: 0; }
.questions .answers .correct { color: green; }
.questions .answers .incorrect { color: red; }
.questions .answers input { margin-left: -21px; }
.questions .answers li { padding: 0.5em 0.5em 0.5em 25px; }
.questions .answers li.sel { background: #ffc; }
.questions .answers p { margin: 0; }
.questions .question { font-weight: bold; }
.questions .question p { display: inline; }
.questions .source { font-style: italic; margin: 0.5em 0 0; }

/* Required text */
.req { color: #e30013; }

/* Search */
#search { clear: right; font-size: 16px; float: right; margin-bottom: 15px; white-space: nowrap; }
#search .btn { background: #0082d1; border-color: #0082d1; }
#search .btn:hover { background: #fff; color: #0082d1; }
#search .txt { padding: 0.4em 0.3em; width: 17em; }

    /* Benefits search */
    #search-benefits { border: 1px solid #dcddde; font-size: 23px; margin-bottom: 25px; padding-right: 100px; }
    #search-benefits .action { float: right; font-size: 30px; margin-right: -100px; padding: 0.2em 0; text-align: center; width: 100px; }
    #search-benefits .txt { border: 0; padding: 0.5em 0; text-indent: 0.5em; width: 100%; }

/* Sequencing */
.sequence { list-style: none; line-height: 1.4; margin-left: 0; }
.sequence .call-r { margin-top: 0; }

.sequence li {
	background: #f5f5f5;
	border: 1px solid #ddd;
	cursor: url(/images/shared/grab.cur), move;
	height: 1%;
	margin-bottom: 1px;
	padding: 0.3em 0.5em 0.4em;
}

.sequence-single li { cursor: default; }

/* Text boxes */
.form .c2l .txt, .form .c2r .txt { margin-bottom: 0.2em; width: 100%; }
.txt { width: 100%; }
.txt, .txt-date, .txt-med, .txt-num, .txt-tiny, .txt-mid, .txt-uppermed, .txt-sm, .txt-date-m-y { border: 1px solid #dcddde; box-sizing: border-box; padding: 0.5em 0.3em; }
.txt-date { width: 12em; }
.txt-date-m-y { text-align: center; width: 9%; }
.txt-med { width: 60%; }
.txt-mid { width: 12em; }
.txt-sm { width: 5em; }
.txt-num { width: 8em; }
.txt-tiny { text-align: center; width: 3em; }
.txt-uppermed { width: 60%; }

/* TinyMCE */
.mceToolbarContainer { position: static; }
.mceEditorContainer td { padding: 0; }
.mceEditor { width: 98% !important; }
.mce-content-body { background: #fff; min-height: 0; padding: 0.5em; text-align: left; }
.mce-content-body a { color: #5d859d !important; }
.mce-content-body p { margin-bottom: 0.65em !important; }

    /* since TinyMCE loads after page loads, there's a delay, so show loading gif */
    .mceEditorFrontEnd, .mceEditorFrontEndIntro, .mceEditorFrontEndSummary, .mceEditorBackEndSummary {
        background: url(/images/loading.gif) no-repeat 50% 50%;
        background-color: #eee;
        height: 150px;
    }