/*
 * OWNER: forms.css
 * Forms, inputs, tokens, typeahead, datepicker, switches, tinyMCE.
 * Not for composers chrome (composer), page headers (titles), or feed chrome (forum).
 * Includes viewport @media for form fields / page forms (peeled from responsive.css).
 */

form { margin: 0; }

/* BODY FORM */

body.form.body_12,
body.form #body,
body.form.body_12 footer,
body.form.body_2_10 { background: #f3f3f3; }

.mceEditor {
  -webkit-box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
}

/* tinyMCE */

body .cirkuitSkin .mceIframeContainer { padding: 8px; }
body .cirkuitSkin td.mceToolbar {
  background: #f2f2f2;
  padding: 3px 0;
}

body .ui_composer .cirkuitSkin table.mceLayout {
  border-color: #ddd;
}

body .ui_composer .cirkuitSkin table.mceLayout tr.mceFirst td {
  border-width: 1px 0;
}

body .ui_composer .cirkuitSkin table.mceLayout td.mceToolbar {
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
}

body.cirkuitSkin td.mceToolbar a {
  border-radius: 0;
}

body .cirkuitSkin .mceIframeContainer,
body .cirkuitSkin table.mceLayout tr.mceLast td,
body .edit .cirkuitSkin table.mceLayout {
  border-color: #ddd;
}

body .cirkuitSkin table.mceLayout tr.mceLast td {
  background: #fff;
  font-size: 10px;
  padding: 3px;
  text-transform: uppercase;
}

.cirkuitSkin table.mceLayout tr.mceLast td {
  background: white;
}

body .cirkuitSkin .mceStatusbar div { color: #999; }

.ui_composer .cirkuitSkin .mceButton {
  background: #f3f3f3;
  border-color: #ccc;
  border-radius: 0;
}

.ui_composer .cirkuitSkin .mceButton:hover {
  border-color: #aaa;
}

body .mce-panel {
  background: #ebebeb;
  background-image: none;
  border-color: #ccc;
  border-radius: 0;
}

table.mceLayout { width: 100%; }

.photo_item_edit .img_left { width: 55%; }
.photo_item_edit .data_right {
  box-sizing: border-box;
  padding-left: 20px;
  width: 45%;
}

/* INPUTS */

div.form_body label,
label.std_label {
	color: #666;
  display: block;
	float: left;
  font-size: 12px;
	font-weight: bold;
  line-height: 1.5;
  margin-right: 10px;
  padding: 9px 0;
  text-align: right;
	width: 25%;
  vertical-align: middle;
}

.ui_section.gateway_section div.form_body .radios label { padding: 3px 0 3px 20px; width: auto; }
.ui_section.gateway_section div.form_body .checkbox label.nofl { width: auto; }

.ui_section.gateway_section div.form_body label { width: 35%; }

.ui_section.gateway_section div.form_content,
.ui_section.gateway_section div.form_body .form_content.checkbox { margin-left: 37%; }

.form_body .file-item label.std_label,
div.form_body .submit-item label { padding: 0; }
.form_body.form-lg label.std_label { padding: 12px 0; }

div.form_body label .req {
	color: blue;
}

.node_properties label.std_label {
  color: #999;
  padding: 0;
  text-align: left;
  width: 100px;
}

#popup .popup-form:not(.create-form) div.form_body:not(.form-inline) label.std_label { width: 35%; }
#popup .popup-form:not(.create-form) div.form_body:not(.form-inline) div.form_content { margin-left: 38%; }

.select.long label.std_label { line-height: 30px; }
.wide label.std_label { width: 130px; }
label.std_label.no_s {
  padding: 3px 0 0;
  text-align: left;
}

label .ui_help_link { margin-left: 2px; }

.date-wrap,
input.text,
textarea {
	background: #fff;
	border: 1px solid #e0e0e0;
	color: #333;
  -moz-transition: all ease-in-out .15s;
  -webkit-transition: all ease-in-out .15s;
  transition: all ease-in-out .15s;
}

input.text,
textarea {
  display: block;
  padding: 5px;
}

input.text,
textarea,
select,
ul.token-input-list li input {
  font-family: 'Helvetica', Arial, sans-serif;
	font-size: 13px;
	line-height: 13px;
}

textarea { line-height: 1.5; }

.date-wrap,
ul.token-input-list,
.form_body input.text,
.form_body textarea {
  background: white;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  font-size: 14px;
  line-height: 18px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.date-wrap .date-wrap {
  background: none;
  border: 0;
  box-shadow: none;
}

input.text::placeholder,
input[type=text]::placeholder,
textarea::placeholder { color: #999; }

.date-wrap {
  display: inline-block;
  padding-right: 5px;
}

.select-item .date-wrap {
  background: none;
  border: 0;
  box-shadow: none;
}

.form_body.form-lg label,
.form_body.form-lg label.std_label,
.form_body.form-lg label.nofl,
.form_body.form-lg input.text,
.form_body.form-lg select,
#mainview .form_body input.text-lg,
#mainview .form_body select.text-lg {
  font-size: 20px;
  line-height: 1.1;
}

.form_body.form-lg textarea,
#mainview .form_body textarea.text-lg {
  font-size: 20px;
  height: 250px;
  line-height: 1.333;
}

div.form_body.form-lg .form_content.radios .radio_option {
  margin-bottom:5px;
}

.form_body input.text:focus,
.form_body textarea:focus,
.form_body select:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.form_body .fake_textarea input.text,
.form_body .fake_textarea input.text:focus {
  border-color: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
}

input.text.prefill {
  background: #eee;
  font-weight: bold;
}

span.ui_textfield input.text { display: inline-block; }

div.form_body.huge input.text,
.wider div.form_body.huge input.text,
.wider div.form_body.huge ul.token-input-list {
	font-size: 20px;
	width: 500px;
}

div.form_body.form-inline label.std_label {
	color: #555;
	float: none;
  font-size: 13px;
	display: block;
  line-height: normal;
  margin: 15px 0 5px 0;
	padding: 0;
	text-align: left;
	width: auto;
}

div.form_body.form-inline.form-mini label.std_label {
  font-size: 9px;
  padding: 0;
  text-transform: uppercase;
}

div.form_body.form-inline.form-mini .form_content { margin: 0; }
div.form_body.form-inline.form-lg label.std_label { font-size: 15px; padding: 10px 0 5px; }
div.form_body.form-inline.form-lg .radio_option label.std_label { padding: 5px 0 5px 5px; }
div.form_body.form-inline .submit-item label.std_label { display: none; }

div.form_body.form-inline .form_content {
	margin: 5px 0 0 0;
  width: auto;
}

div.form_body.huge span.form_item_left.small label { width: auto; }
div.form_body.huge span.form_item_left.small div.form_content { margin-left: 0; }

div.form_body.huge select { font-size: 20px; margin-top: 10px; border:1px solid #cbd4df; color: #444; }

div.form_body.huge label.nofl { font-size: 16px; }

div.form_body.huge label {
	font-size: 18px;
	padding-top: 12px;
}

.form-mini input.text {
	width: 245px;
}

body.popup .popup_section div.form_body {
  background: #fff;
  border: 0;
  margin: -10px;
}

div.form_body {
  background: #f9f9f9;
  border: 1px solid #ddd;
	padding: 15px;
	position: relative;
}

  body.form div.form_body { border: 0; }
  body.form .form_body.form-long { padding-bottom: 0; }
  body.form .nested_form div.form_body { padding-bottom: 20px; }
  body.form div.form_body.picture-form { padding-bottom: 15px; }
  body.form div.form_body.fade { opacity: .5; }

  .ui_section.gateway_section div.form_body {
    background:#fafafa;
    box-shadow:none;
    border:1px solid #eee;
  }
  
  .ui_section.gateway_section div.form_body input.text {
    border-radius: 3px;
  }
  
  .ui_section.gateway_section.notice-gateway div.form_body input.text,
  .ui_section.gateway_section.notice-gateway div.form_body textarea { background: #f2f2f2; }
  
	.ui_section.gateway_section.notice-gateway div.form_body textarea:focus,
  .ui_section.gateway_section.notice-gateway div.form_body input.text:focus { background: #fff; }

	#popup div.form_body {
		background: transparent;
		border: none;
		padding: 0;
		box-shadow: none;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
	}

div.form_body hr { margin: 15px 0; }

hr.thick { border-top-width: 5px; margin: 20px 0; }
hr.dashed { border-style: dashed; }

#popup div.form_body hr { margin: 12px 0 8px 0; }

div.form_body .form_help_text {
	color: #888;
	display: block;
	font-size: 12px;
	line-height: 15px;
	padding: 5px 0;
}

.form_body.form-inline .form_help_text,
#popup div.form_body .form_help_text { clear: both; }

div.form_body .checkbox:not(.switch) label:not(.nofl),
div.form_body div.radios:not(.switch) label:not(.nofl) {
  padding-top: 3px;
  text-align:right;
}

div.form_body .checkbox:not(.switch) .form_content label {
  padding-top: 0;
  text-align: left;
}

div.form_body .checkbox label { text-align: left; }
div.form_body .checkbox label {
  line-height: 22px;
  padding: 0;
  text-align: right; 
  width: 35%;
}

body.admin #popup div.form_body .checkbox.switch {
	margin: 0 0 5px 0;
}

body.admin #popup div.form_body .checkbox.switch.single-checkbox {
	margin: 15px 0 5px 0;
}

body.admin #popup div.form_body .checkbox.switch label {
	float: left;
	line-height: 22px;
	margin: 0;
	padding: 0;
	width: 80%;
}

body.admin #popup div.form_body.form-inline .form_content.checkbox {
	margin: 0;
	text-align: right;
}

div.form_content {
  display: block;
	margin-left: 27%;
	vertical-align: middle;
  width: 60%;
}

div.form_body .submit-item div.form_content { width: auto; }

  div.form_content.checkbox {
    margin-bottom: 0;
  }
  
  .body_2_10 #mainview div.form_body.form-long:not(.form-inline) div:not(.form_item_right) div.form_content {
    float: none;
    width: auto;
  }
		
	div.form_body.form-long div.form_content.checkbox {
	  width: auto;
	}

  #popup .create-form div.form_content,
  #popup .create-form div.form_body .form_content.checkbox {
    margin-left: 0;
    text-align: left;
  }  

  div.popup_inner div.form_content {
      width: inherit;
  }

	label.nofl,
	div.form_body label.nofl {
		display: inline-block;
		float: none;
    font-size: 14px;
		font-weight: normal;
    line-height: normal;
    padding: 3px 0;
		width: auto;
	}
	
	div.form_body .radio_option label.nofl {
		padding-left: 20px;
		position: relative;
		text-align: left;
	}
	
	div.form_body.form-lg .radio_option label.nofl {
		line-height: 1.3;
		padding-left: 25px;
	}
	
	div.form_body .radio_option label input {
		left: 0;
		position: absolute;
		top: 2px;
	}
	
	div.form_body.form-lg .radio_option label input {
		top: 6px;
	}
  
  div.form_body .form_content.checkbox { margin-bottom: 10px; margin-left: 28%; width: auto; }
  div.form_body.form-inline .form_content.checkbox { margin-bottom: 5px; margin-left: 0px !important; }
  div.form_body .form_content.checkbox input { float: left; margin: 4px 0; }
  
  div.form_body.form-lg .form_content.checkbox { padding: 5px 0; }
  div.form_body.form-lg .form_content.checkbox input { margin-top: 3px; }
  div.form_body.form-lg .form_content.checkbox label.nofl { font-size: 14px; }
  body.admin div.form_body.form-inline .form_content.checkbox { line-height: 0; margin: 0; }
  
  div.form_body .checkbox label.nofl {
    display: block;
    float: none;
    line-height: 1.5;
    margin-left: 20px;
    padding: 0;
		text-align: left;
  }
	
	div.form_body.form-lg .checkbox label.nofl {
		line-height: 1.3;
	}
  
  .ui_section .content .highlight {
    background: rgba(0,0,0,.05);
    border: 1px solid rgba(0,0,0,.05);
    border-width: 1px 0;    
  }
  
  .ui_section.popup_section .content .highlight {
    margin-left: -10px;
    margin-right: -15px;
    padding: 15px;
  }
  
  .ui_section.gateway_section .content .highlight {
    padding: 15px;
  }
  
  .ui_section.gateway_section.notice-gateway .content .highlight {
    margin: 10px -40px;
    padding: 15px 40px;
  }
  
  #popup .create-form div.form_body label.std_label {
    font-size: 10px;
    text-align: left;
    text-transform: uppercase;
    padding: 5px 0 0;
    width: auto;
  }
  
  #popup .create-form div.form_body label.std_label { padding: 6px 0 3px; }
  #popup .create-form div.form_body label.std_label.man { margin: 0; }

  #popup .create-form div.form_body .form_item_left label,
  #popup .create-form div.form_body .form_item_right label { float: none; }
  
  #popup .create-form .form_item_left div.form_content,
  #popup .create-form .form_item_right div.form_content {
      width: 100%;
  }
    
  #popup .create-form div.form_body .form_item_left.select-item {
    text-align: left;
  }
    
  #popup .create-form div.form_body .form_item_left div.form_content,
  #popup .create-form div.form_body span.select-item .form_content,
  #popup .create-form div.form_body .form_item_right.select-item .form_content {
    margin-left: 0;
  }

  #popup .create-form div.form_body .form_item_long label.std_label {
    float: none;
  }

  #popup .create-form div.form_body span.text label,
  #popup .create-form div.form_body span.textarea label {
    width: 100%;
  }
		  
  #popup .create-form div.form_body label.nofl {
    font-size: 13px;
  }
  
  #popup div.form_body .form_content label.std_label {
    padding: 0;
    text-transform: none;
  }
  
  #popup .popup-color div.form_content,
  #popup .create-form .form_item_long:not(.select) div.form_content { 
    margin-left: 0;
    width: 100%;
  }
	
	#popup div.form_body .form_item_left label,
	#popup div.form_body .form_item_right label {
	  width: 110px;
	}
	
	#popup div.form_body .form_item_left select,
	#popup div.form_body .form_item_right select {
    min-width: 0;
	  width: 100%;
	}
	
	#popup .forum_popup div.form_body .form_item_left div.form_content,
	#popup .forum_popup div.form_body .form_item_right div.form_content {
	  margin-left: 120px;
	}
	
	#popup div.form_body.form-long div.form_content input.text:not(.input-med):not(.input-sm),
	#popup div.form_body.form-long div.form_content textarea {
	  box-sizing: border-box;
	  width: 100%;
	}
	
	#popup div.form_body label.nofl { 
	  text-align: left;
	  width: auto; 
	}
		
	#popup div.form_body textarea { height: 100px; }
		
	#popup div.form_body.full input.text,
	#popup div.form_body.full textarea {
	  width: 506px;
	}

	#popup div.form_body.lg ul.token-input-list {
		width: 320px;
	}
	
	#popup div.form_body.lg input.text,
	#popup div.form_body.lg textarea {
		width: 330px;
	}
	
	#popup div.paxl div.form_body input.text {
		width: 310px;
	}
	
	div.form_body span.file,
	div.form_body span.select {
	  display: block;
	  margin-bottom: 5px;
	}
  
  div.form_body span.file { margin: 10px 0 5px; }
	
	div.form_body:not(.form-inline) span.file label {
	  padding: 0;
	}
	
	div.form_body span.json label {
	  padding: 3px 0;
	}
	
	#popup span.file label {
	  padding: 1px 0 3px 0;
	}
	
	div.form_body.form-long input.text,
	div.form_body.form-long textarea {
		width: 500px;
	}
	
	div.form_body.form-long div.form_content ul.token-input-list,
	#popup div.form_body ul.token-input-list,
	div.form_body.form-long div.form_content input.text:not(.input-sm):not(.input-med):not(.input-lg):not(.input_mini),
	div.form_body.form-long div.form_content textarea {
	  box-sizing: border-box;
	  width: 100%;
	}
	
	div.form_body.form-inline input.text,
	div.form_body.form-inline textarea,
  div.form_body.form-inline table.mceLayout {
    box-sizing: border-box;
    width: 100%;
  }
  
  div.form_body.form-inline .input-group { width: 100%; }
  div.form_body.form-inline .input-group input.text { width: 100% !important; }

div.form_body input.link {
	background: none;
	border: none;
	color: #942937;
	padding: 0px;
}

div.form_body input.text,
div.form_body textarea {
	/* border: 1px solid #cbd4df; */
	border: 1px solid #ddd;
	box-sizing: border-box;
	color: #444;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	width: 100%;
	-webkit-appearance: none;
}

div.form_body .ui_textfield input.text {
    border: 0;
}

div.form_body input.text.code,
div.form_body textarea.code {
  font-family: 'Monaco', monospace;
}

div.form_body.form-lg .search_field input.text {
  border: 0;
  font-size: 15px;
  padding: 10px;
}

div.form_body.form-lg .ui_textfield button.search {
  padding: 5px 0;
  right: 5px;
  top: 7px;
}

div.form_body textarea.code_text {
  font-family: 'Monaco', monospace;
}

div.form_body input.text,
div.form_body textarea {
  margin: 0;
  padding: 8px;
}

div.form_body .ui_textfield { border-radius: 5px; }
div.form_body .ui_textfield input.text {
    border-radius: 5px;
    padding: 4px 8px;
}

div.form_body.form-long.form-inline label.std_label {
  float: left;
  padding: 8px 0 0 0;
  text-align: right;
}

div.form_body.form-long .file label.std_label { padding: 2px 0; }

div.form_body.form-long li.token-input-token { padding: 2px 2px 2px 9px; }
div.form_body.form-long ul.token-input-list li input { padding: 4px 5px; }

div.form_body.form-long.form-lg ul.token-input-list li input {
  font-size: 18px;
  line-height: 20px;
  padding: 7px;
}

.ui_composer_form select.input-sm {
  -webkit-appearance: none;
  background: #eee url('/foundation_static/images/tnd.gif') no-repeat 82px center;
  border-radius: 0;
  border: 1px solid rgba(0,0,0,.15);
  color: #555;
  display: inline-block;
  font-weight: bold;
  overflow: hidden;
  padding: 8px 25px 8px 8px;
  vertical-align: top;
  width: 100px;
}

.ui_composer_form select.input-sm:hover { 
  background-color: #e6e6e6;
  border-color: rgba(0,0,0,.2);
}

div.form_body:not(.form-inline) input.text.input-sm,
#popup div.form_body:not(.form-inline) input.text.input-sm { width: 25%; }

#popup div.form_body:not(.form-inline) input.text.input-med,
div.form_body:not(.form-inline) input.text.input-med { width: 40%; }

div.form_body:not(.form-inline) input.text.input-lg { width: 75%; }

div.form_body:not(.form-inline) input.text.input_xlg,
#popup div.form_body input.text.input-lg { width: 100%; }

#popup .fake_textarea textarea {
  padding: 0;
  width: 100%;
}

ul.token-input-list input.text { margin: 0px !important; }

div.form_body input.text:focus, 
div.form_body textarea:focus {
	color: black;
	border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
            box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

input.filled {
	background: #e2e8f7;
	border: 1px solid #bdc6d9;
	color: black;
	font-weight: bold;
}

/*div.form_body select {
  display: block;
  margin-top: 0px;
  margin-bottom: 0;
  padding: 5px;
  width: 152px;
  text-overflow: ellipsis;
}*/

.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}

.input-group-addon {
  background-color: #eee;
  border: 1px solid #ddd;
  border-radius: 0 3px 3px 0;
  border-width: 1px 1px 1px 0;
  display: table-cell;
  color: #888;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  padding: 6px;
  text-align: center;
}

.input-group-addon.left-addon {
  border-radius: 3px 0 0 3px;
  border-width: 1px 0 1px 1px;
}

.input-group .text, 
.input-group-btn {
  display: table-cell;
  width: auto !important;
}

.input-group-addon,
.input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}

.input-group input.text {
  width: 100% !important;
}

div.form_body select,
select.styled {
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border: 1px solid #ddd;
  border-bottom-color: #bbb;
  background: #fff;
  background-image: url('/foundation_static/images/drop_arr.png');
  background-image: url('/foundation_static/images/drop_arr.png'), -webkit-linear-gradient(top, #fff, #eee); /* For Safari 5.1 to 6.0 */
  background-image: url('/foundation_static/images/drop_arr.png'), -o-linear-gradient(top, #fff, #eee); /* For Opera 11.1 to 12.0 */
  background-image: url('/foundation_static/images/drop_arr.png'), -moz-linear-gradient(top, #fff, #eee); /* For Firefox 3.6 to 15 */
  background-image: url('/foundation_static/images/drop_arr.png'), linear-gradient(top, #fff, #eee); /* Standard syntax */
  background-repeat: no-repeat;
  background-position: right center;
  font-family: 'Helvetica', Arial, sans-serif;
  font-size: 12px;
  line-height: 14px;
  margin: 0;
  max-width: 100%;
  min-width: 165px;
  padding: 10px 18px 10px 8px;
  width: auto;
  text-overflow: ellipsis;
  -webkit-appearance: none;
}

.browse_bar select.styled { min-width: 0; }
.browse_bar input.text { padding: 8px; }
.browse_bar .ui_action_set button.search { top: 6px; }

.ui_page_header select { display: block; }

select.input_mini,
div.form_body select.input_mini { 
  width: 60px;
}

input.text.input_mini,
div.form_body input.text.input_mini {
  width: 44px;
}

div.form_body textarea {
	font-weight: normal;
	height: 150px;
}

div.form_body p.legend {
	color: #777;
	display: block;
	font-size: 11px;
	margin-bottom: 10px;
}

div.form_header {
	background-color: #e0e0e0;
	border: 0px;
	margin-bottom: 15px;
	padding: 5px 0;
	text-align: center;
}

div.form_subheader {
  background: #eee;
  border-bottom: 1px solid #ddd;
  color: #666;
  font-size: 14px;
  font-weight: bold;
  line-height: 36px;
  padding: 10px 15px;
}

  #popup div.form_body div.form_header span {
    font-size: 11px;
    line-height: 13px;
    margin-left: 170px;
  }
	
	#popup div.form_body.form-inline div.form_header span {
		margin-left: 0;
	}

div.form_body.form-long div.form_header,
.wide div.form_body div.form_header {
	margin: 24px 0;
}

#popup div.form_body div.form_header {
  margin: 10px 0;
}

#popup div.form_body.form-long div.form_header span,
#popup div.wide .edit div.form_header {
	margin-left: 10px;
}

#popup_overlay.create-form div.form_body.form-long div.form_header span {
  margin: 0;
  text-align: center;
}

  div.formheader span.form_header_text {
    font-size: 17px;
    font-weight: bold;
  }
  	
	div.form_header.lg span {
		font-size: 16px;
		padding: 0px 10px;
		text-transform: none;
	}

div.form_body .form_header span.form_header_text {
    background: none;
    color: rgba(0,0,0,.7);
    display: block;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.6;
    position: relative;
    text-transform: uppercase;
}

div.form_body .form_header span.form_header_legend {
  display: block;
}

div.form_body.form-long .form_header span.centered {
  display: block;
  margin: 0;
  text-align: center;
}

div.form_body .form_header span.form_header_legend {
  background: none;
  color: #999;
  font-weight: normal;
  text-transform: none;
}

div.form_body .form_header,
.wide div.form_body .form_header {
    background: rgba(0,0,0,.03);
    border: 1px solid rgba(0,0,0,.05);
    border-width: 1px 0;
    height: auto;
    margin: 15px 0;
    padding: 10px;
}

div.form_body .form_section {
  border-radius: 5px;
  padding: 15px 25px;
}

div.form_body .form_section .form_header {
  background: none;
  border: 0;
  padding: 0;
}

div.form_body .form_section .form_header span.form_header_text {
  font-size: 14px;
  text-transform: none;
}

div.form_body.form-long .form_section .form_header {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

div.form_body.form-long .form_section .form_header .form_header_legend {
	margin: 0 auto;
	max-width: 70%;
}

div.form_body .form_item_long:first-of-type label.std_label,
div.form_body div.form_header:first-of-type {
	margin-top: 0 !important;
}
	
div.error {
	background: #F0DADA;
	color: #900;
	margin-bottom: 20px;
	padding: 20px;
}

	div.error ul {
		list-style-type: circle;
		margin: 0 0 0 25px;
	}

	div.error li {
		color: #900;
		font-weight: normal;
		text-align: left;
	}
	
div.form_body input.error,
textarea.error,
div.form_body select.error {
	border: 1px solid #f00 !important;
}

div.form_body span.error_text {
  color: #f00;
  font-size: 10px;
  text-transform: uppercase;
}

input[disabled=1] {
	background: #eee;
}

/* FORM STYLES */
/* For forms only */

body.is_mobile .form_item_long,
div.form-inline .form_item_long,
body.mobile .form_item_long {
	float:none;
}

div.form_body.form-inline:not(.full-inline) .select:not(.form_item_right) label.std_label,
div.form_body.form-inline:not(.full-inline) .file:not(.form_item_right) label.std_label {
  float: left;
  width: 140px;
}

div.form_body.form-inline:not(.full-inline) .select:not(.form_item_right) .form_content,
div.form_body.form-inline:not(.full-inline) .file:not(.form_item_right) .form_content { margin-left: 150px; }

div.form_body.form-inline:not(.full-inline) .select:not(.form_item_right) .form_content select { min-width: 0; width: 100%; }

div.form_body.full-inline select {
  width: 100%;
}

#popup form.full .form_item_long,
form .form_item_left,
form .form_item_right,
form .form_item_long {
	box-sizing: border-box;
  display: block;
  float: none;
  margin-bottom: 5px;
  width: 100%;
}

form .submit-item.full { margin: 0; }
div.form_body .focus label.std_label { color: #000; }

#popup form .form_item_long {
  display: block;
  float: none;
	width:auto;
}

#popup .full-inline form .form_item_long {
	margin: 0;
}

#popup form .form_item_long:last-of-type { margin-bottom: 0; }

#popup form.full {
	padding-right:10px;
}

form .form_item_left {
	float: left;
	width: 52%;
}

form .form_item_left label.std_label {
	width: 50%;
}

form .form_item_right {
	width: 46%;
	float: right;
}

form .col1 {
	width: 31%;
	margin-right: 25px;
	float: left;
}

	form .col1 div.form_content input.text,
	form .form_item_left div.form_content input.text {
		width: 206px;
	}

form .col2 {
	width:31%;
	float:left;
}

form .col3 {
	width:31%;
	float:right;
}

/* flyout section */

.flyout-section div.form_body.form-inline label.std_label {
	font-size: 12px;
	margin: 15px 0 0;
	padding: 0;
	text-transform: none;
}

.flyout-section label {
  display: block;
  font-size: 12px;
	font-weight: bold;
	float: none;
	padding-top: 6px;
  text-align: left;
  width: 100%;
}

.flyout-section .submit-item label {
  display: none;
}

.flyout-section div.form_body .submit-item {
  padding: 0 0 5px;
}

.button-wrap {
	position: relative;
}

.button-wrap .flyout-section input.ui_button.primary-btn {
  width: 100%;
}

.flyout-section .form_content { margin-left: 0px; width: 100%; }
.flyout-section .submit-item .form_content { margin: 10px 0 0; }

.flyout-section input.text {
	border: 1px solid #ccc;
	box-sizing: border-box;
	padding: 8px;
	width: 100%;
}

	.flyout-section input.text:focus {
    background: #ffffff;
    border: 1px solid #4997d6;
    box-shadow: #4997d6 0px 0px 7px;
	}
	
	.flyout-section input.ui_button {
		margin: 0px;
	}

/* ALT EDIT */

body.trans-form div.form_body,
div.form_body.trans-form {
  background: none;
  border: 0;
  padding: 15px 0;
}

div.form_body.trans-form.nopad {
  padding: 0;
}

div.form_body.shadow {
  border-radius: 0px;
  box-shadow: inset rgba(0,0,0,.1) 0px 1px 5px;
}

div.form_body i.topcurl { display: none; }

body div.form_body.form-long .picture_upload div.form_header {
  margin: 20px 0;
}

div.form_body input.text.disabled,
div.form_body textarea.disabled {
  background: #f2f2f2;
  border-color: #ddd;
  color: #555;
}

div.form_body select[disabled=true] {
	color: #555;
}

div.form_body.form-inline.form-long input.text,
div.form_body.form-inline.form-long textarea,
div.form_body.form-inline.form-long ul.token-input-list {
    font-size: 18px;
    line-height: 22px;
    width: 870px;
}

div.form_body.form-inline.form-long ul.token-input-list input.text { width: auto; }
div.form_body.form-inline.form-long li.token-input-token img {
    margin-right: 8px;
    width: 30px;
}
div.form_body.form-inline.form-long li.token-input-token p {
    font-size: 18px;
    line-height: 29px;
}
div.form_body.form-inline.form-long li.token-input-token span.token-input-delete-token {
    margin: 7px 7px 0 0;
}

div.form_body.form-inline.form-long input.text.datepicker { width: 100px !important; }

div.form_body.form-inline form .col1,
div.form_body.form-inline form .col2,
div.form_body.form-inline form .col3 {
    display: block;
    float: none;
    width: auto;
}

div.form_body.form-inline.form-long input.ui_button {
    font-size: 16px;
    padding: 10px 20px;
}

div.form_body.form-inline.form-long label,
div.form_body.form-inline.form-long select {
    font-size: 16px;
    line-height: 32px;
}

div.form_body.form-inline.form-long div.form_header {
    background: #eee;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    height: auto;
    margin: 20px -30px;
    padding: 20px 30px;
}

div.form_body.form-inline.form-long div.form_header span {
    color: #999;
    font-size: 20px;
    font-weight: normal;
    text-transform: uppercase;
    width: 100%;
}

/* JCROP */
/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */

.jcrop-holder {
    text-align: left;
}

.jcrop-vline, .jcrop-hline {
    font-size: 0;
    position: absolute;
    background: white url('/foundation_static/images/Jcrop.gif') top left repeat;
}

    .jcrop-vline {
    height: 100%;
    width: 1px !important;
    }

    .jcrop-hline {
    width: 100%;
    height: 1px !important;
    }

    .jcrop-handle {
    font-size: 1px;
    width: 7px !important;
    height: 7px !important;
    border: 1px #eee solid;
    background-color: #333;
    *width: 9px;
    *height: 9px;
    }

    .jcrop-tracker {
    width: 100%;
    height: 100%;
    }

    .custom .jcrop-vline,
    .custom .jcrop-hline {
    background: #AE2B3A;
    }

    .custom .jcrop-handle {
    border-color: black;
    background-color: #AE2B3A;
    }
    

/* TOKEN-INPUT */

/* TOKENS */

ul.token-input-list {
    overflow: hidden;
    height: auto !important;
    height: 1%;
    width: 511px;
    /* border: 1px solid #cbd4df; */
    border: 1px solid #ddd;
    cursor: text;
    font-size: 12px;
    color: #444;
    z-index: 200;
    margin: 0;
    padding: 1px;
    background-color: #fff;
    list-style-type: none;
}

.ui_composer_form .tokenizer_wrap ul.token-input-list {
    margin: 0px;
}

div.form_body.form-inline ul.token-input-list { 
  box-sizing: border-box;
  width: 100%;
}

div.form_body ul.token-input-list { width: auto; }

ul.token-input-list li {
    list-style-type: none;
}

ul.token-input-list li input {
  border: 0;
  font-size: 14px;
  line-height: 24px;
  width: 100% !important;
  padding: 5px;
  background-color: white;
  box-sizing: border-box;
  -webkit-appearance: caret;
}

.ui_composer_form ul.token-input-list li input { padding: 10px 8px; }
.ui_composer_form .field_area,
.ui_composer_form .link_attachment { border-top: 1px dashed #cbd4df; padding: 5px; }
.ui_composer_form .field_area input.text { padding: 0; }
.ui_composer_form .link_attachment input.ui_button { border: 1px solid rgba(0,0,0,.1); border-radius: 3px; }
.ui_composer_form .link_attachment input.text {
  background: none;
  display: inline-block;
  padding: 0 0 0 10px;
}

.ui_comment_composer ul.token-input-list {  width: 100%;  }
.ui_comment_composer ul.token-input-list li input {
	font-size: 13px;
	line-height: 26px;
}

.ui_comment_composer ul.token-input-list {
	padding: 0;
}

.ui_composer ul.token-input-list li input {
  font-size: 13px;
  line-height: 17px;
}

li.token-input-token {
    line-height: 0;
    white-space: nowrap;
    overflow: hidden;
    height: auto !important;
    height: 1%;
    margin: 0 0 1px;
    padding: 1px 1px 1px 8px;
    background-color: #eff2f7;
    border: 1px solid #ccd5e4;
    color: #000;
    cursor: default;
    display: block;
}

ul.token-input-list li:nth-last-child(1),
ul.token-input-list li:nth-last-child(2) { margin: 0 !important; }

ul.token-input-list.float li.token-input-token {
    float: left;
}

ul.token-input-list.float li.token-input-token span.token-input-delete-token {
    margin-left: 5px;
}

.ui_composer_form .tokenizer_wrap.full li.token-input-token {
    float: none;
}

li.token-input-token-pills {
    border-radius: 5px;
    float: left;
}

li.token-input-token p {
    display: inline-block;
    float: left;
		font-size: 14px;
    line-height: 26px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 80%;
}

.ui_composer_form .tokenizer_wrap li.token-input-token span.token-input-delete-token {
    margin: 4px;
}

li.token-input-token img {
    float: left;
    margin-left: -7px;
    margin-right: 5px;
    width: 26px;
}

.form-inline li.token-input-token img { width: 28px; }
.form-inline li.token-input-token p { font-size: 14px; line-height: 28px; }

.form-lg li.token-input-token p {
	font-size: 18px;
	line-height: 28px;
}

.form-lg li.token-input-token img {
	width: 28px;
}

.form-lg li.token-input-token span.token-input-delete-token {
  margin: 6px;
}

li.token-input-token span {
    float: right;
    color: #777;
    cursor: pointer;
}

li.token-input-token span.token-input-delete-token {
    background: url('/foundation_static/images/xes.png') 0px 0px;
    display: inline-block;
    float: right;
    height: 15px;
    margin: 5px 5px 0 0;
    text-indent: -999px;
    width: 15px;
}

.form-inline li.token-input-token span.token-input-delete-token {
	margin: 7px 5px 0 0;
}

li.token-input-token span.token-input-delete-token:hover {
    background-position-y: -15px;
}

li.token-input-token span.token-input-delete-token:active {
    background-position-y: -30px;
}

li.token-input-selected-token {
    background-color: #0377cc;
    color: #fff;
}

li.token-input-selected-token span {
    color: #bbb;
}

/* TYPEAHEAD DROPDOWN */

div.token-input-dropdown {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: rgba(0,0,0,.2) 0px 1px 5px;
  border-top: 0;
  cursor: default;
  font-size: 12px;
  line-height: 16px;
  overflow: hidden;
  padding: 2px;
  position: absolute;
  width: 100%;
  z-index: 1;
}

div.form_body div.token-input-dropdown {
  width: 380px;
}

div.token-input-dropdown {
  width: 510px;
  z-index: 2000;
}

div.token-input-dropdown p {
  margin: 0;
  padding: 2px 5px;
}

div.token-input-dropdown ul {
  margin: 0;
  padding: 0;
}

div.token-input-dropdown ul li {
  background-color: #fff;
  padding: 3px;
  list-style-type: none;
}

div.token-input-dropdown ul li.token-input-dropdown-item {
  background-color: #fafafa;
  color: #333;
}

div.token-input-dropdown ul li.token-input-dropdown-item2 {
  background-color: #fff;
}

div.token-input-dropdown ul li em {
  font-weight: bold;
  font-style: normal;
}

div.token-input-dropdown ul li img {
  border-radius: 3px;
  float: left;
  margin-right: 5px;
  width: 20px;
}

div.token-input-dropdown ul li.token-input-selected-dropdown-item {
  background-color: #5393d9;
  color: white;
}

div.token-input-dropdown ul li.token-input-selected-dropdown-item span.fcg {
  color: white;
}

/* AUTO-COMPLETE */

ul.ui-autocomplete {
    background: white;
    border-radius: 3px;
    box-shadow: rgba(0,0,0,.25) 0px 1px 5px;
    position: absolute;
    right: 16px !important;
    max-width: 340px;
    z-index: 1500 !important;
}

#nav.lgout ul.ui-autocomplete {
    width: 246px;
}

ul.ui-autocomplete li {
    border-bottom: 1px solid #eee;
    display: block;
    float: none !important;
}

ul.ui-autocomplete li:last-of-type {
    border: 0px;
}

ul.ui-autocomplete li a:active,
ul.ui-autocomplete li a:hover {
    background: #EDEFF4 !important;
    color: black;
}

ul.ui-autocomplete a {
    cursor: pointer;
    display: block;
    float: none !important;
    font-weight: bold;
    padding: 5px;
    text-shadow: none !important;
    text-decoration: none;
}

ul.ui-autocomplete a.ui-state-focus {
  background: #EDEFF4;
}

ul.ui-autocomplete li img {
    float: left;
    margin-right: 10px;
    width: 40px;
}

body.is_mobile ul.ui-autocomplete li img { width: 80px; }
body.is_mobile ul.ui-autocomplete li .node_name p { font-size: 16px; }
body.is_mobile ul.ui-autocomplete li .node_subtitle {
  text-overflow: initial;
  white-space: normal;
}

ul.ui-autocomplete a.ui-state-hover {
    color: black !important;
    background: #EDEFF4;
    font-weight: bold;
}

ul.ui-autocomplete a.ui-state-hover .fcg {
    color: #555 !important;
}

.CodeMirror {
  border: 1px solid #ccc;
}

/* DATE PICKER */

.ui-datepicker {
    background: white;
    border: 1px solid #ccc;
		box-shadow: rgba(0,0,0,.2) 0px 2px 8px;
		border-radius: 6px;
    display: none;
		margin-left: -1px;
		margin-top: 3px;
    padding: 8px;
		z-index: 1500;
}

.ui-helper-hidden-accessible {
    display: none;
}

.ui-datepicker-title {
    background: #eee;
    border: 1px solid #ddd;
    margin: 5px 0;
    padding: 3px;
    text-align: center;
}

.ui-corner-all {
    cursor: pointer;
}

.ui-datepicker-next {
    float: right;
}

.ui-date-picker table {
    border-collapse: collapse;
}

.ui-datepicker td,
.ui-datepicker th {
    text-align: center;
}

.ui-datepicker a.ui-state-default {
    border: 1px solid white;
    display: block;
    padding: 1px 5px;
}

.ui-datepicker a.ui-state-default:hover {
    background: #dee4ee;
    border: 1px solid #bcc9de;
    text-decoration: none;
}

input.hidden_file {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

div.form_body label.hidden_file {
  float: none;
  margin: 0;
  padding: 0;
  text-align: center;
  width: auto;
}

div.form_body input.text.datepicker {
    background: transparent url('/foundation_static/images/cal_icon.gif') no-repeat right 50%;
    box-shadow: none;
    border: 0 !important;
    cursor: pointer;
    margin: 0;
    padding-right: 20px;
    width: 120px !important;
}

div.form_body.full-inline .date-wrap {
  box-sizing: border-box;
  width: 100%;
}

div.form_body.full-inline input.text.datepicker {
  width: 100% !important;
}

.ui_section.flyout-section div.form_body input.text.datepicker {
  width: 196px !important;
}

div.form_body input.text.datepicker:focus {
    background-image: url('/foundation_static/images/cal_icon_hover.gif');
}

body.grouped_form .ui_page_inner #flash_msg { margin: 10px 10px 0; }
body.form .ui_page_inner .ui_body_block #flash_msg .alert { margin: 0; }

/* JSON */

#routes div.form_content {
    margin: 0 5%;
    text-align: center;
    width: auto;
}

#routes label.std_label {
    display: block;
    float: none;
    font-size: 20px;
    margin: 0 auto 15px;
    text-align: center;
    width: auto;
}

#routes a.ui_button {
    display: inline-block;
    font-size: 14px;
    margin: 0 auto;
    padding: 8px 12px;
    width: auto;
}
#routes a.ui_button .ui_button_text {
    font-size: 14px;
    text-transform: none;
}

div.form_body .json { margin-top: 5px; }

#json_form_form_extra_columns {
  margin-top: 3px;
}

.json_items {
    margin-top: 10px;
    text-align: left;
}

.json_row {
  border-bottom: 1px solid #ddd;
  font-weight: bold;
  line-height: 25px;
}

  a.json_updown {
    background: #eee;
    border: 1px solid #ddd;
    color: #999;
    font-weight: normal;
    padding: 4px 8px;
    text-decoration: none;
  }
  
  a.json_updown:hover {
    background: #e9e9e9;
    border-color: #ccc;
    color: #666;
  }

  .json_row a.block { 
    background-image:url('/foundation_static/images/edit.gif');
    background-repeat: no-repeat;
    background-position: -10px 6px;
    display: block; 
    padding: 6px 6px 6px 0;
    text-decoration: none;
    -webkit-transition: linear .1s;
  }
  
  .json_row.ordered a.block {
    overflow: hidden;
    padding: 0;
    width: 80%;
  }
  
  .json_row.ordered:hover {
    background: #f2f2f2;
  }
  
  .json_row.ordered a.block:hover {
    background-color: transparent;
    background-position: 5px 6px;
  }
  
  .json_row a.block:hover {
    background-color: #f2f2f2;
    background-position: 5px 11px;
    padding-left: 20px;
  }
  
  .json_row a .json_label {
    float: left;
  }
  
  .json_row a .json_attrs,
  .json_row a .json_details {
    color: #999;
    float: right;
    font-weight: normal;
  }
  
  .json_row.ordered .json_details { padding-right: 10px; }

  .json_row img {
    border: 1px solid #ccc;
    float: left;
    margin-right: 8px;
    width: 22px;
  }

/* angular specific */
input.ng-invalid.ng-dirty {
    background-color: #FA787E;
}

input.ng-valid.ng-dirty {
    background-color: #78FA89;
}

/* 2_10 FORM */

body.grouped_form.form .ui_page_content {
  background: #fff;
  border: 1px solid #ccc;
  border-width: 0 0 0 1px;
  margin: 0;
  width: 789px;
}

body.grouped_form #leftbar img.nodepic {
  background: #fff;
  padding: 5px;
  border: 1px solid #ddd;
  margin-bottom: 10px;
  width: 130px;
}

body.grouped_form.form #leftbar img.nodepic { 
  margin: 10px; 
  width: 118px;
}

body.grouped_form:not(.form) #leftbar img.nodepic {
  border-right: 0;
  width: 139px;
}

body.grouped_form #leftbar {
  margin: 0;
  width: 150px;
}

body.grouped_form:not(.form) #leftbar.nopic {
  margin: 70px 0 0 0;
}

body.grouped_form #leftbar.nopic {
  margin: 60px 0 0 0;
}

body.grouped_form:not(.form) .container_12 .grid_10 {
  border-left: 1px solid #ddd;
  margin-left: 0;
  padding-left: 15px;
  width: 774px;
}

body.form #secondary-nav li a {
  color: #999;
}

body.grouped_form #secondary-nav,
body.grouped_form.form #leftbar #secondary-nav li a {
  background: none;
  border-color: #ccc;
  border-radius: 0;
}

body.grouped_form.form #leftbar #secondary-nav li a {
  border-top: 1px solid #eee;
  padding: 12px 8px;
}

body.grouped_form.form #leftbar #secondary-nav li a {
  border-color: #e5e5e5;
}

body.grouped_form #leftbar #secondary-nav li a:hover,
body.grouped_form #leftbar #secondary-nav li a.active,
body.grouped_form #leftbar #secondary-nav li a.active:hover {
  background: #d5d5d5;
  border-color: #d5d5d5;
  color: #444;
}

body.grouped_form.form #body .grid_12 {
  background: #e5e5e5;
  border: 1px solid #ccc;
}

body.form:not(.trans-form):not(.grouped_form) #mainview {
  background: white;
  border: 1px solid #ddd;
}

body.form.body_2_10 #pagecontent { background: #f9f9f9; }

body.grouped_form #mainview {
  border-width: 0;
}

  body.form #body .ui_page_header_inline .ui_page_header,
  body.grouped_form #body .ui_page_header_inline .ui_page_header {
    border: 0;
    margin: 0;
    padding: 15px;
  }
  
  body.form #body .ui_page_header_inline.no_nav .ui_page_header {
    border-bottom: 1px solid #ddd;
  }
  
  body.grouped_form:not(.form) #body .ui_page_header_inline .ui_page_header {
    padding: 0 0 15px;
  }

  body.form div.form_body div > div.form_header:first-of-type {
    margin-top: 0;
  }

  body.form div.form_body .picture_upload div.form_header {
    background: #f3f3f3;
    padding: 10px;
  }
  
  body.form div.form_body .picture_upload .new_upload div.form_header {
    background: none;
    border-top: none;
    font-weight: 800;
    padding-top: 0;
  }
  
  body.form div.form_body div.form_header.top { margin-top: 0; }
  
  .ui_section.gateway_section div.form_body div.form_header span {
    margin: 0;
  }

body.grouped_form.form #leftbar #secondary-nav li:last-of-type a {
  border-bottom: 1px solid #dbdad7;
}

body.grouped_form.form #leftbar #secondary-nav li a.active {
  color: #000;
  font-weight: bold;
}
  
body.form div.form_body .picture_upload { 
  max-width: 300px; 
  margin-bottom: 15px;
  text-align: center;
}

div.form_body .submit-item {
  border-top: 1px solid rgba(0,0,0,.1);
  clear: both;
  padding: 10px 0 0 0;
  float: none;
  display: block;
  margin: 10px 0 0;
  width: auto;
}

div.form_body.trans-form .submit-item { margin: 15px 0 0; padding: 15px 0 0; }
div.form_body.trans-form .submit-item .form_content { float: left; }

div.form_body .submit-item .spinner {
  left: 10px;
  line-height: 30px;
  position: absolute;
}

#popup_overlay.full_form div.content { padding-bottom: 0 !important; }
#popup_overlay.full_form div.form_body .submit-item {
  background: #eee;
  border-top: 1px solid #ccc;
  margin: 0 -25px;
  padding: 10px 25px;
}

#popup div.form_body .submit-item { border: 0; padding: 0; }
#popup div.form_body .submit-item .std_label { display: none; }

#popup div.popup-form div.form_body .submit-item {
  background: rgba(0,0,0,.05);
  border-top: 1px solid #ccc;
  margin: 10px -10px -10px;
  padding: 3px 10px 8px;
  text-align: right;
}

#popup div.popup-form div.form_body .submit-item .fl_r {
  margin-left: 5px;
}

div.form_body.contact_form .submit-item {
  margin: 10px 0 0;
  padding: 10px 0 0;
}

.ui_section.gateway_section .submit-item label { display: none; }
.ui_section.gateway_section .form-inline .recaptcha div.form_content,
.ui_section.gateway_section .submit-item div.form_content { margin: 0; }
.ui_section.gateway_section .submit-item input.ui_button:not(.wide-btn) {
  display: block;
  margin: 0 auto;
  width: 60%;
}

.ui_section.gateway_section.centered-gateway div.form_body.form-inline .submit-item { text-align: center; }
.ui_section.gateway_section div.form_body .submit-item { margin: 10px 0 0; padding: 10px 0 0; }
.ui_section.gateway_section.notice-gateway div.form_body .submit-item { border: 0; margin: 20px 0 0; padding: 0; }
.ui_section.gateway_section.gateway-lg:not(.centered-gateway) div.form_body .submit-item { text-align: right; }
.ui_section.gateway_section div.form_body .submit-item label { display: none; }

body.form:not(.trans-form) div.form_body .submit-item {
  background: #fff;
  padding: 10px;
}

body.form:not(.trans-form) div.form_body.form-long .submit-item {
  margin: 15px -15px 0;
}

/* SWITCH */

div.form_body.form-long .checkbox label.std_label {
  padding: 2px 0;
}

.switch * { cursor: pointer; }

.switch input {
  height: 22px;
  margin: 0;
  opacity: 0;
  position: absolute;
  width: 42px;
  z-index: 1000;
}

.switch span.switcher {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
  background-color: rgba(0,0,0,.02);
  border: 1px solid #ddd;
  border-radius: 4px;
  transition: all .5s;
  box-shadow: 1px 2px 3px rgba(0,0,0,0.1) inset;
}

.switch input:checked+span {
  background-color: #65a2d6;
  border-color: rgba(0,0,0,.1);
  box-shadow: inset rgba(0,0,0,.1) 0px 1px 3px;
}

.switch input:disabled+span {
	background-color: #ccc;
}

.switch span.switcher:after {
  content: "";
  position: absolute;
  background-color: #fff;
  top: 1px;
  left: 1px;
  height: 18px;
  width: 17px;
  border-radius: 2px;
  box-shadow: 1px 1px 3px rgba(0,0,0,0.1);
  -webkit-transition: all .2s;
}

.switch input:checked+span:after {
  left: 54%;
  transition: all .2s;
}

/* ALT LABELS */

div.form_body.form-long label.std_label,
div.form_body.form-long .form_help_text,
div.form_body.form-long div.form_header {
  font-family: "Raleway";
}

div.form_body.form-long.form-lg label.std_label {
	font-size: 14px;
	line-height: 26px;
}

/* ==========================================================================
   RESPONSIVE — forms / inputs / tokens (from responsive.css)
   ========================================================================== */

/* Mobile phones */
@media screen and (max-width: 570px) {

body.form div.form_body .picture_upload { max-width: none; }
body.form:not(.trans-form):not(.grouped_form) #mainview {
    border-width: 0px 0px 1px 0px;
    margin: -10px -10px 0 -10px;
  }
body.form div.form_body { padding: 15px; }
div.form_body.form-long div.form_header,
	.wide div.form_body div.form_header {
		margin: 15px -15px;
	}
div.form_body.form-inline .form_content select,
  div.form_body:not(.form-inline) .form_content input[type=text],
  div.form_body:not(.form-inline) .form_content input[type=password],
	div.form_body:not(.form-inline) .form_content select {
	  width: 100%;
	}
div.form_body:not(.form-inline) .form_content select {
    font-size: 16px;
    line-height: 1.3;
    padding: 10px;
  }
div.form_body:not(.form-inline) .form_content .token-input-list input {
    line-height: normal;
    padding: 9px;
  }
div.form_body span.checkbox:not(.switch) input, 
  div.form_body div.radios:not(.switch) input {
    float: left;
    margin: 0px 10px 4px 0;
  }
div.form_body span.checkbox:not(.switch) label.nofl, 
  div.form_body div.radios:not(.switch) label.nofl {
    display: table-cell;
    padding-top: 0;
    text-align: left;
  }
div.form_body span.form_help_text { width: auto; }

}

/* Between large tablet and wide desktop */
@media screen and (min-width: 880px) and (max-width:1360px) {

#sidebar form span.form_item_long.recaptcha {
    margin: 15px -22px 0;
  }

}

/* Mid desktop (slightly narrower mainview) */
@media screen and (max-width: 1000px) and (min-width: 880px) {

body.grouped_form.form .ui_page_content { width: 689px; }
.body_2_10 .grid_10 div.form_body.form-long div.form_content { width: 420px; }

}

/* iPad / tablet portrait */
@media screen and (max-width: 880px) and (min-width: 763px) {

body.grouped_form.form .ui_page_content { width: 589px; }
body.grouped_form.form div.form_body.form-long:not(.form-inline) div.form_content {
    width: auto;
  }
div.form_body.form-long.form-inline label.std_label {
		display: block;
		float: none;
		margin: 10px 0 5px;
    padding: 0;
		text-align: left;
		width: 100%;
	}
div.form_body.form-inline.form-long .form_content {
    margin: 0;
  }
div.form_body.form-long input.text, 
	div.form_body.form-long textarea {
	  width: 470px;
	}
div.form_body.form-long ul.token-input-list {
	  width: 480px;
	}

}

/* Single column (phones + small tablets) */
@media screen and (max-width: 762px) {

.ui_section.gateway_section .submit-item input.ui_button:not(.wide-btn),
	.ui_section.gateway_section .submit-item input.ui_button {
		width: auto;
	}
body.grouped_form.form .ui_page_content { border-left: 0; }
#mainview .node_properties label.std_label { float: none; width: 100px; }
#popup div.form_body div.form_content ul.token-input-list {
    width: 100%;
  }
body.form div.form_body.picture .picture_upload,
	.photo_outer #photo img {
    box-sizing: border-box;
	  max-width: none;
	  width: 100%;
	}
#popup div.form_content { margin: 0; }
#popup div.form_body span.checkbox label,
	div.form_body span.checkbox label {
	  float: left;
    margin: 0;
    width: auto;
	}
.switch span.switcher {
    height: 26px;
    width: 60px;
  }
.switch span.switcher:after {
    height: 24px;
    width: 27px;
  }
#mainview div.form_body:not(.form-inline) span.checkbox div.form_content {
	  margin-left: 155px;
	  text-align: right;
	}
#mainview div.form_body.form-inline span.checkbox div.form_content {
	  margin-left: 0;
	  text-align: left;
	}
#popup div.form_body.form-long div.form_content { margin-left: 0; }
.ui_section.gateway_section div.form_body input.text {
    margin: 0;
	  box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  -webkit-box-sizing: border-box;
	  width: 100%;
	}
body.form #body .ui_page_body { padding: 10px 0; }
body.form.body_2_10 #body .ui_page_body { padding-bottom: 0; }
body.form div.form_body { padding-bottom: 0; }
body.form div.form_body div.form_header div { margin: 0; text-align: center; }
body.form:not(.trans-form) div.form_body .submit-item { background: #fff; margin: 10px -15px 0px; padding: 10px 15px; }
body.form:not(.trans-form) div.form_body .submit-item .ui_button { font-size: 14px; padding: 10px 15px; width: auto; }
body.form:not(.trans-form) div.form_body .submit-item .form_content:not(.with_right) .ui_button { font-size: 18px; padding: 15px; width: 100%; }
body.form div.form_body .submit-item label { display: none; }
div.form_body input.text,
  div.form_body textarea {
    border-radius: 0;
    font-size: 16px;
    margin: 0;
    padding: 11px 10px;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }
div.form_body ul.token-input-list li.token-input-token img { border-radius: 3px; width: 32px; }
div.form_body ul.token-input-list li input,
  div.form_body ul.token-input-list li.token-input-token p { font-size: 16px; line-height: 32px; }
li.token-input-token span.token-input-delete-token { margin-top: 8px; }
.ui_section.email_box .form_body input.text { padding: 6px; width: 75%; }
div.form_body:not(.form-lg) label.std_label,
  div.form_body.form-long.form-inline label.std_label,
	div.form_body.form-long label.std_label {
    color: #666;
		display: block;
		float: none;
    font-size: 13px;
    line-height: normal;
		margin: 15px 0 5px 0;
    padding: 0;
		text-align: left;
    text-transform: normal;
		width: 100%;
	}
div.form_body.form-long .submit-item .form_content:not(.with_right) input.ui_button.primary-btn {
    width: 100%;
  }
div.form_body.form-long .submit-item label.std_label {
    display: none;
  }
div.form_body .checkbox label { margin-bottom: 0; }
.gateway_section .form_body:not(.form-inline) label.std_label,
  div.form_body:not(.form-inline) label.std_label {
    color: #666;
    float: none;
    font-size: 13px;
    margin: 10px 0 5px;
    padding: 8px 0 0 0 !important;
    text-align: left;
    width: 100%;
  }
#popup .popup-form:not(.create-form) div.form_body:not(.form-inline) label.std_label,
	#popup div.form_body:not(.form-inline) label.std_label {
		float: left;
		margin: 0;
		padding: 0;
	}
#body div.form-long:not(.form-inline) div.form_content,
	#body div.form_body:not(.form-inline) span div.form_content {
		margin-left: 0 !important;
        margin-right: 0;
	}
.ui_section.gateway_section div.form_body div.form_content,
	.ui_section.gateway_section div.form_body .form_content.checkbox,
	div.form_body.form-long div.form_content,
	div.form_body div.form_content {
    margin: 0;
	  width: auto !important;
	}
div.form_body.form-inline:not(.full-inline) span.select:not(.right) .form_content {
    margin: 0;
  }
div.form_body.form-long input.text,
	div.form_body.form-long textarea,
	div.form_body.form-inline:not(.no_stretch) input.text,
	div.form_body.form-inline:not(.no_stretch) textarea {
		width: 100% !important;
	}

}

/* Large laptop / wide desktop */
@media screen and (min-width: 1200px) {

body.grouped_form.form .ui_page_content {
      width: 939px;
  }
.grid_12 div.form_body.form-long input.text, 
  .grid_12 div.form_body.form-long textarea {
    font-size: 16px;
    line-height: 20px;
  }

}

/* Widescreen / large display */
@media screen and (min-width: 1360px) {

body.grouped_form.form .ui_page_content { width: 999px; }
li.token-input-token img { width: 24px; }
li.token-input-token p { font-size: 14px; line-height: 24px; }
li.token-input-token span.token-input-delete-token { margin: 4px 4px 0 0; }

}