/* --------------------------// Form Elements */
form {
  width: 100%;
}
/* Inline Block */
#Instructor select ~ [type="text"],
#Instructor select ~ select,
#SearchBox  select ~ [type="text"],
#SearchBox input[type="text"],
#SearchBox select,
.input-icon,
[type="button"],
[type="submit"],
button,
form,
input[type="date"],
input[type="number"],
input[type="password"],
input[type="text"],
label,
label,
label.checkbox [type="checkbox"],
label.checkbox a,
select,
textarea,
.date-range .x-form-field-wrap,
span.requiredField {
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  *display:inline;
}

/* Font size */
input[type="text"],
input[type="number"],
input[type="date"],
input[type="password"],
select,
label:not([class*="x-form-"]),
textarea {
  margin-bottom : 8px;
  font-size     : 12px;
}

input[type="text"],
input[type="password"],
select,
label {
  height      : 21px !important;
  padding     : 0 5px;
  line-height : 21px;
}

    label.text {
        padding: 0px;

    }

select {
  -webkit-appearance: menulist-button;
  padding: 0 1px 0 5px;
  border: 1px solid #A7A7A7;
  border-radius: 3px;
  color: #333333;
  box-shadow: none;
}

select[multiple] { height: 160px !important; }

label:not([class*="x-form-"]) {
  margin-right : 10px;
  margin-bottom: 8px;
}

label input[type="checkbox"] { margin-top: 1px; margin-right: 5px; }

textarea {
  height: 60px;
  resize: none;
  overflow: auto;
  padding: 5px 7px;
  line-height: 16px;
}

.calposition input[type="text"] {
  padding-left: 23px;
}

input[type="text"],
input[type="password"],
textarea {
  border     : 1px solid #A7A7A7;
  color      : #333;
  box-shadow : inset 0 1px 2px rgba(0,0,0,0.17);
}

input[type="text"][disabled],
select[disabled] {
  color      : #999999;
  background : #F9F9F9 !important;
}

input[type="radio"],
input[type="checkbox"] {
  position : relative;
  top      : 1px;
  margin   : 0 8px 0 0;
}

/* At some point make .scale-form do this instead of it always being implicit */
/* Eg: .scale-form input[type="text"] { width: 100%; } */
[class*="span"] input[type="text"],
[class*="span"] input[type="password"],
[class*="span"] input[type="url"],
[class*="span"] input[type="time"],
[class*="span"] input[type="date"],
[class*="span"] textarea,
[class*="span"] select { width: 100%; }

/* Label */

.input-icon {
  position: relative;
  white-space: normal;
}


.input-icon [class*="icon-"] {
  position : absolute;
  top      : 1px;
  left     : 1px;
}

.template-icon > [class*="icon-"]{
  position : absolute;
  top      : 0px;
  left     : -20px;
}

.input-icon input { padding-left: 23px !important; }

input.none {
  border: none;
  background-color: transparent;
}

.requiredField {
  background: #FFB2AB;
}

.requiredField input[type='checkbox'] {
  margin: 1px;
}

.requiredField [type="radio"],
.requiredField [type="checkbox"] {
  padding: 0;
  margin: 0;
}

.requiredField [type="radio"] {
  margin: 0 2px;
}

input[type='text'].requiredField,
input[type='password'].requiredField,
input[type='date'].requiredField,
select.requiredField,
textarea.requiredField
{
  border: 1px solid #E7291A;
  background: #ffffff;
}

input[type='text'].requiredField.useTemplate,
input[type='password'].requiredField.useTemplate,
input[type='date'].requiredField.useTemplate,
select.requiredField.useTemplate,
textarea.requiredField.useTemplate {
  border       : 1px solid #A7A7A7;
}

span.requiredField,
div.requiredField {
  margin       : 0px 6px 2px 0px;
  border       : 1px solid #E7291A;
  border-radius: 3px;
}

input[type='text'].requiredField.active,
input[type='password'].requiredField.active,
textarea.requiredField.active,
input[type='date'].requiredField.active,
select.requiredField.active {
  border       : 1px solid #A7A7A7;
}

span.requiredField.active,
span.requiredField.active input,
span.requiredField.useTemplate,
span.requiredField.useTemplate input {
  background: transparent;
}

span.requiredField.active,span.requiredField.useTemplate {
  border: 1px solid transparent;
}

  [class*="alert-"] + .iform,
  .iform + .iform {
    margin-top: 20px;
  }

  [class*="form"] .sectionHelp {
    margin-bottom: 10px;
    padding      : 2px;
    border-bottom: 1px solid #EAEAEA;
    font-size    : 85%;
    color        : #666;
  }

  [class*="form"] tr.extJS {
    width         : auto;
    margin        : 0;
    padding       : 0;
    font-size     : 100%;
    vertical-align: middle;
  }

  [class*="form"] td.extJS {
    margin        : 0;
    padding       : 0;
    font-size     : 90%;
    vertical-align: middle;
  }

  .formGray span.extJS {
    margin        : 0;
    padding       : 0;
    font-size     : 90%;
    vertical-align: middle;
  }

  [class*="form"] tr.error {
    padding         : 5px;
    color           : #C33;
    background-color: #FCC;
  }

[class*="section_form"] label {
  margin-bottom: 0;
}

/* ---------------------------  iForm Styles */

.iform { border: 1px solid; }

.iform input[type="text"],
.iform input[type="password"],
.iform textarea,
.iform select { width: 100%; }

.iform { padding: 1px; }

/* iForm forms */
.formGray   { background-color : #FAFAFA ; border-color  : #a0a0a0 ; }
.formYellow { background-color : #FFFAE2 ; border-color  : #d19223 ; }
.formBlue   { background-color : #F2FBFF ; border-color  : #7d98d4 ; }
.formGreen  { background-color : #EDFFED ; border-color  : #52b148 ; }
.formPink   { background-color : #ffe6e6 ; border-color  : #f59090 ; }
.formPurple { background-color : #FBF5FF ; border-color  : #DABAFE ; }
.formWhite  { background-color : #fff    ; border-color  : #999999 ; }

/* iForm Label Colors */
.formYellow .iform-label { color: #9c4820; }
.formBlue .iform-label   { color: #4378B1; }
.formGreen .iform-label  { color: #1F882D; }
.formPink .iform-label   { color: #a02d66; }
.formPurple .iform-label { color: #8861A3; }

/* iForm Alerts */
.formBlue .alert-hint {
  border-color : #94AFD1;
  color        : #1C4C88;
  background   : #E5F5FF;
}

.formYellow .alert-hint {
  color        : #8A2700;
  border-color : #d7ba8b;
  background   : #fff2d0;
}

.formGreen .alert-hint {
  color: #125613;
  border-color : #91D78B;
  background   : #daffc6;
}

.formPink .alert-hint {
  border-color : #D89AAE;
  color        : #96154D;
  background   : #FCDAE5;
}

.formPurple .alert-hint {
  border-color : #D4ACE0;
  color        : #642674;
  background   : #F5E4FF;
}

/* Iform Dates and Times */
.iform [name*="MeetingStartHour"],
.iform [name*="MeetingEndHour"] {
  width: 85px;
}
.iform [name*="MeetingStartMin"],
.iform [name*="MeetingEndMin"] {
  margin-left: 5px;
  width: 55px;
}

.iform [name*="SubStartHour"],
.iform [name*="SubEndHour"] {
  width: 85px;
}
.iform [name*="SubStartMin"],
.iform [name*="SubEndMin"] {
  margin-left: 5px;
  width: 55px;
}

#inside .iform [name*="meetingdate"] {
  width: 80px;
  margin-right: 10px;
}

#inside .iform input[name^="RL_"],
#inside .iform input[name^="INT_"] {
  width: 101px;
  text-align: right;
}

#inside .iform input[type^="checkbox"] {
  width: auto !important;
}

.iform-label_checkbox {
  position: relative;
}

.iform-label_checkbox-container {
  position: absolute;
  left: 0;
  top: 0;
}

.iform-label_checkbox_text {
  margin-left: 10px;
}

.iform .smallText {
  margin-bottom: 5px;
  display: inline-block;
}

.iform .smallText ~ b {
  margin-top: 10px;
}

#inside label.iform-label,
#inside label.iform-value,
#inside label.iform-value ~ label.iform-label,
#inside label.iform-label ~ label.iform-label {
  width        : 100%;
  height       : auto !important;
  margin       : 3px 0 0;
  padding-left : 12px;        /* changed from 22px */
  line-height  : 16px;
}

    #inside label.iform-text,
    #inside label.iform-value,
    #inside label.iform-value ~ label.iform-text,
    #inside label.iform-text ~ label.iform-text {
        width: 100%;
        height: auto !important;
        margin: 3px 0 0;
        padding-left: 0px; /* changed from 22px */
        line-height: 16px;
    }

#inside label.iform-value {
  padding-left: 0;
}

.iform-input { padding-right: 12px; }

.iform select,
.iform input[type="text"],
.iform input[type="number"],
.iform input[type="date"],
.iform input[type="url"] { margin-right: 10px; }

/* needed for manage and WEbReg */

.textbox {
  border           : thin solid #ccc;
  font-size        : 12px;
  color            : #000;
  background-color : #fff;
}

.label {
  margin         : 5px;
  text-align     : right;
  font-size      : 13px;
  font-weight    : normal;
  vertical-align : text-top;
  color          : #1F1F2E;
}

/* Needed for LearningPlan/Catalog.asp */

input.sub,
input.sel {
  height              : 16px;
  border              : 1px solid;
  border-top-color    : #696;
  border-right-color  : #363;
  border-bottom-color : #363;
  border-left-color   : #696;
  font-size           : 9px;
  font-weight         : bold;
  color               : #050;
  background-color    : #fed;
}

input.sub {
  width: 115px;
}

input.sel {
  width: 55px;
}

[class^="form"] h1.section-title table {
  box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
}

/********************* general forms upgrade ***********************/

  .input .label {
    float     : left;
    width     : 100px;
    text-align: right;
  }

  .input .input_column {
    float     : left;
    width     : 400px;
    text-align: left;
  }

.x-form-field-trigger-wrap input.x-form-text {
    margin-right: 0px;
}

#inside .iform ul {
    list-style: disc;
    padding-left:20px;
}

#inside .iform ol {
    list-style: decimal;
    padding-left:20px;
}