﻿*:focus {outline: 0;}

button.standard {
	padding: 7px 20px;
	font-size: 14px;
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: #46a927;
	color: #fff;
}

button.cancel {
	padding: 7px 20px;
	font-size: 14px;
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: gray;
	color: #fff;
}

button.red {
    padding: 7px 20px;
	font-size: 14px;
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: red;
	color: #fff;
}

button.input-align {
	padding: 10px 20px; 
	width: 100%;
}

button.remove-tenant-share {
	padding: 10px 20px; 
	border-radius: 20px;
}

button.remove-tenant-share-mob {
	padding: 10px 20px; 
	border-radius: 20px;
    width: 100%;
}

button {
    border-radius: 5px;
}

.listbox {
	min-height: 200px;
	max-height: 200px;
	overflow: auto;
	border-radius: 0;
	background-color: #FFFFFF;
	border-style: solid;
	border-width: 1px;
	border-color: #cccccc;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	color: rgba(0, 0, 0, 0.75);
	display: block;
	font-family: inherit;
	font-size: 0.875rem;
	margin: 0 0 1rem 0;
	padding: 0.5rem;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: border-color 0.15s linear, background 0.15s linear;
	-moz-transition: border-color 0.15s linear, background 0.15s linear;
	-ms-transition: border-color 0.15s linear, background 0.15s linear;
	-o-transition: border-color 0.15s linear, background 0.15s linear;
	transition: border-color 0.15s linear, background 0.15s linear;
}

.alertify-notifier {
	color: #000;
	font-size: 11pt;
    z-index: 10003 !important;    
}

    .alertify-notifier > .ajs-message {
        border-radius: 5px !important;
    }

.hidden {
	display: none !important;
}

.deleted {
	text-decoration: line-through;
}

a.public-link {
	font-size: .75rem;
}

#form_builder_preview_container #user_uploded_logo_preview .active_logo img,
#form_builder_preview_container .form_field_option_settings .current_logo,
#form_logo {
	height: 75px;
	background: none;
}

input.imgup {
	font-weight: normal;
}

input[type="color"] {
	width: 48px;
	height: 48px;
	padding: 0px;
	border: 0px;
}

img.active_entry_image {
	height: 100px;
}

img.entry_image {
	height: 50px;
}

a.active_logo {
    font-weight: normal;
    font-size: .8rem !important;
}

a.active_logo span {
    mix-blend-mode: difference;
}

/*table header links in form entries page*/
#content_wrapper .form_entries_table table th a {
	background: #888;
	color: #fff;
	font-size: 1em;
	padding: 5px 10px;
	white-space: nowrap;
}

#form_builder_preview_container #user_uploded_logo_preview .active_logo img {
	float: left;
	border: none;
}

#form_builder_preview_container #user_uploded_logo_preview a:hover img {
	background: none;
	border: none;
}

#form_builder_preview_container #user_uploded_logo_preview .active_logo img :hover {
	background: none;
}

#form_content_wrapper label.radio {
	vertical-align: top;
	font-weight: normal;
}

h1.form_title_text {
	float: left;
	padding-left: 15px;
	padding-right: 15px;
}

span.extra_label_public {
	font-size: 13px;
	font-style: italic;
	color: #777777;
	font-weight: normal;
	position: absolute;
	right: 0;
	top: 22px;
	width: 190px;
}

input.error,
textarea.error
{
	background: #fff4f4;
	border-color: #d15959;
}

select.error {
    border-color: #d15959;
}

i.order-choice, i.remove-choice {
	color: lightgray;
	display: inline;
}

input.choice-label {
	display: inline;
	width: 75%;
	height: 24px;
	padding: 1px !important;
	margin-left: 5px !important;
	margin-right: 5px !important;
}

span.choice-item {
	display: block;
	padding-left: 10px;
}

a.add-choice, a.add-column, a.clear-default {
	font-size: 9pt;
	color: grey;
}

a.remove-choice, a.remove-column {
	color: red;
}

div.subfield {
	padding-left: 5px;
	padding-right: 0px;
	margin-bottom: 5px;
}

	div.subfield.odd {
		padding-left: 0px;
		padding-right: 5px;
	}

	div.subfield > span.bottom {
		font-size: 12px;
		font-style: italic;
		color: #777777;
		font-weight: normal;
	}

a.field-item {
	color: white;
	font-style: normal !important;
	background: #83a358;
	display: block;
	padding: 5px 10px;
	border: 1px solid #a8d46e;
	line-height: .9em;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.icon_img {
	display: block;
	float: left;
	width: 16px;
	height: 16px;
	text-indent: -9999px;
	margin-right: 10px;
}

.btn_title {
	display: block;
	float: left;
	font-size: .9em;
	color: #fff;
	padding-top: 2px;
	max-width: 130px;
}

.btn_heading .icon_img {
	background: url("/static/images/form_creator/desktop_heading.png");
}

.btn_numbers .icon_img {
	background: url("/static/images/form_creator/desktop_numbers.png");
}

.btn_input .icon_img {
	background: url("/static/images/form_creator/desktop_input.png");
}

.btn_paragraph .icon_img {
	background: url("/static/images/form_creator/desktop_paragraph.png");
}

.btn_paragraph .icon_img {
	background: url("/static/images/form_creator/desktop_paragraph.png");
}

.btn_radio .icon_img {
	background: url("/static/images/form_creator/desktop_radio.png");
}

.btn_checkbox .icon_img {
	background: url("/static/images/form_creator/desktop_checkbox.png");
}

.btn_dropdown .icon_img {
	background: url("/static/images/form_creator/desktop_dropbox.png");
}

.btn_text_label .icon_img {
	background: url("/static/images/form_creator/text-label.png");
}

.btn_page_break .icon_img {
	background: url("/static/images/form_creator/page_break.png");
    background-size: contain;
}

.btn_link .icon_img {
	background: url("/static/images/form_creator/link-icon-png-14.png");
    background-size: contain;
}

.tabs dd.active a, .tabs .tab-title.active a {
	border-top: 1px solid #dcdec6;
	border-right: 1px solid #dcdec6;
	border-left: 1px solid #dcdec6;
}

	.tabs dd.active a, .tabs .tab-title.active a:hover {
		background-color: white;
		font-weight: normal;
		border-top: 1px solid #dcdec6;
		border-right: 1px solid #dcdec6;
		border-left: 1px solid #dcdec6;
	}

.tabs dd > a, .tabs .tab-title > a {
	background-color: #dcdec6;
	font-family: Ubuntu !important;
	font-size: .8rem;
	border-top: 1px solid #dcdec6;
	border-right: 1px solid #dcdec6;
	border-left: 1px solid #dcdec6;
	padding: 5px 10px;
}

	.tabs dd > a:hover, .tabs .tab-title > a:hover {
		background-color: #dcdec6;
	}

.tabs-content .content {
	padding: 30px;
}

/*input heights in web api form settings not consistent*/
#content_wrapper #forms_settings #webapi_calls_list .wc_list_item .wc_list_item_content .form_item input[type="text"], #content_wrapper #forms_settings #webapi_calls_list .wc_list_item .wc_list_item_content .form_item select {
	height: 30px;
}

/*remove margin from hr*/
no-margin {
	margin: 0 !important;
}

div.row.border-bottom {
	border-bottom: 1px solid lightgray;
}

div.row.vertical-padding {
	padding-top: 5px;
	padding-bottom: 5px;
}

div.row.hover-highlight:hover {
	background-color: lightyellow;
}

em.small, a.small {
	font-size: 9pt;
}

span.small, label.small, p.small {
    font-size: 10pt;
}

.not-bold {
    font-weight: normal;
}

input.small {
	font-size: 10pt;
	padding: 2px;
	height: auto;
}

label.user-access {
	font-size: 10pt;
	height: 16px;
}

.no-padding {
	padding: 0px !important;
}

#open_form_settings_button {
	-webkit-text-stroke: 1px gray;
}

.first-tenant-item {
	border-top: 1px solid #dcdec6;
}

#form_creator_wrapper #form_created_options ul li {
	padding-left: 2px;
}

/*#form_creator_wrapper #form_created_options {
    left: 230px !important;
}

#form_element_buttons {
    width: 230px !important;
}*/

.button {
	padding: 7px 20px;
	font-size: 14px;
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial, sans-serif;
	background: #46a927;
	color: #fff;
	margin-bottom: 0;
}

.button_gray {
	background: #777 !important;
}

#content_wrapper .button {
	margin-left: 5px;
}

.select_bar, input.select_bar {
	padding: 5px;
	font-size: 1em;
	height: 35px;
	background-color: #fbfcf2;
	margin-bottom: 0;
	margin-top: 5px;
	border-radius: 5px;
}

.template_search {
	padding-top: 10px !important;
	height: 35px !important; 
	width: 100% !important;
	margin-top: 20px !important;
}

span.template_more_info {
	font-size: 9pt;
}

#content_wrapper #forms_list .form_list_item .form_name {
	display: initial !important;
}

span.permission_label {
	font-size: 9pt;
	padding: 2px;
	white-space: nowrap;
}

span.public {
	color: #8BC34A !important;
}

span.group {
	color: #EE7600 !important;
}

span.private {
	color: #FF9800 !important;
}

span.locked {
	color: #F44336 !important;
}

#content_wrapper .button {
	white-space: nowrap;
}

#form_builder_preview_container #form_builder_preview #form_content_wrapper {
	min-height: 100%;
}

textarea.display-only-control {
	height: 200px !important;
}

.button_whole_row {
	width: 100%;
	margin-bottom: 7px;
}

.stroke_black {
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.top_editor_button {
	margin-left: 10px;
}

.share-link {
	color: #000 !important;
	float: none !important;
	font-size: 10pt !important;
	margin: 0px !important;
}

@media print {
	a:link:after,
	a:visited:after {
		content: "" !important;
	}
}

.logo-background-preview {
	border: 2px dashed lightblue;
	width: 100%;
	height: 600px;
	overflow: hidden;
    margin-bottom: 20px;
}

.preview-div-label {
	top: 10px;
	left: 10px;
	font-size: 9pt;
	color: lightgray;
	position: relative;
}

.default-header-text {
	font-size: 2.75rem;
	position:relative;
	top: 10px;
}

.ui-widget {
	font-family: "Ubuntu", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.template-thumbnail {
	position: absolute;
	width: 1028px;
	height: 1250px;
	border: 1px solid #ddd;
	pointer-events: none;
	-webkit-transform: scale(0.2);
	-moz-transform: scale(0.2);
	-ms-transform: scale(0.2);
	transform: scale(0.2);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	transform-origin: 0 0;
}

.templates_list_item_bg {
	overflow: hidden;
	border: none !important;
}

.template_list_content {
	position: absolute !important;
	height: 250px !important;
	width: 22% !important;
}

@media only screen and (max-width: 1024px) {
	.template-thumbnail {
		position: absolute;
		width: calc(100% * 5);
		height: 1250px;
		border: 1px solid #ddd;
		pointer-events: none;
		-webkit-transform: scale(0.2);
		-moz-transform: scale(0.2);
		-ms-transform: scale(0.2);
		transform: scale(0.2);
		-webkit-transform-origin: 0 0;
		-moz-transform-origin: 0 0;
		-ms-transform-origin: 0 0;
		transform-origin: 0 0;
	}

	.template_list_content {
		position: absolute !important;
		height: 250px !important;
		width: 100% !important;
	}
}

.reveal-modal-bg {
	position: fixed;
    height: 100%;
    z-index: 10000 !important;
}

.reveal-modal {
	z-index: 10001 !important;
}

.field-label-input {
    display: inline !important;
    width: 80% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 2px !important;
    font-weight: bold !important;
    height: auto !important;
    margin: 0px !important;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    overflow: hidden;
}

    .field-label-input:focus, .field-label-input:focus {
        border: 1px dashed lightgray !important;
    }

.form-name-input {
    display: inline !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 2px !important;
    font-weight: bold !important;
    height: auto !important;
    margin: 0px !important;
    color: #333 !important;
    letter-spacing: 3px !important;
    font-size: 24px !important;
    margin-bottom: 0 !important;
}

    .form-name-input:focus {
        border: 1px dashed lightgray !important;
    }

.form-desc-input {
    display: inline;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 2px !important;
    font-weight: normal !important;
    height: auto !important;
    margin: 0px !important;
    color: #808080 !important;
    font-size: 13px !important;
    margin-bottom: 10px !important;
}

    .form-desc-input:focus {
        border: 1px dashed lightgray !important;
    }

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: lightgray !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: lightgray !important;
   opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: lightgray !important;
   opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: lightgray !important;
}
:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color:    #909;
}
::placeholder {
    color: lightgray !important;
}

.search_bar {
    margin: 0px !important;
}

.public_form_field {
    margin-bottom: 20px;
}

strong.tab-title {
    margin-bottom: 20px;
}

#content_wrapper .tenants_list .form_list_item .tenant_status {
    margin-top: 10px;
    margin-left: 10px;
}

ul.pricing-table li.title, ul.pricing-table li.description, .truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

label.checkbox {
    margin-top: 5px;
}

.slight-padding {
    padding: 10px !important;
}

.no-margin {
    margin: 0px !important;
}

.auto-width {
    width: auto !important;
}

div.spacer {
    height: 10px;
}

.full-width {
    width: 100% !important;
}

.red {
    color: red;
}

.green {
    color: green;
}

.white {
    color: white;
}

#home_teaser #teaser_wrap #teaser_content #registration_form {
    padding-top: 45px !important;
}

#form_builder_preview_container #form_builder_settings .settings_forms .content {
    padding: 10px;
    border-top: 1px solid #dcdec6;
    border-bottom: 1px solid #dcdec6;
    border-right: 1px solid #dcdec6;
    border-left: 1px solid #dcdec6
}

.design_modal .templates_list_container .templates_list, .design_modal .preview_template_container .templates_list {
    height: 80%;
    overflow-y: scroll;
}

.drag-button {
    cursor: move;
    color: gray;
}

.drop-placeholder {
    visibility: visible;
    position: relative;
    background-color: lightgoldenrodyellow;
    padding:12px;
    height:50px;
    width:100%;
}

div.form_item_add_delete {
    /*position: absolute;
    width: 100px;*/  /*Commented out for #3136*/
    right: 10px;
    z-index: 20;
}

.editor-save-indicator {
    font-size: 13px;
    padding-top: 13px !important;
    padding-left: 13px !important;
    color: #aaa;
}

#mobile_field_element_setting {
    background-color: #efefef;
}

label > input[type="checkbox"] {
    position: relative;
    /*top: 2px;*/
}

div.form_elements_holder i {
    font-weight: normal;
    font-style: italic;
}

div.form_elements_holder em {
    font-weight: normal;
    font-style: oblique;
    font-size: smaller;
}

.panel.white-panel {
    background-color: white !important;
}

.inside-text-box {
    width: 100%;
    padding: 0px 10px;
    position: absolute;
    top: 8px;
    pointer-events: none;
}

    .inside-text-box > * {
        float: right;
        pointer-events: all;
    }

    .inside-text-box > a.remove-share-link {
        position: relative;
        bottom: 3px;
    }

.margin-left {
    margin-left: 10px;
}

.margin-right {
    margin-right: 10px;
}

.margin-bottom {
    margin-bottom: 10px;
}

.margin-bottom-2x {
    margin-bottom: 20px;
}

.margin-top {
    margin-top: 10px;
}

.margin-top-2x {
    margin-top: 20px;
}

.padding-top-5x {
    padding-top: 50px;
}

.padding-bottom-5x {
    padding-bottom: 50px;
}

.inside-text-area {
    position: absolute;
    bottom: 24px;
    pointer-events: none;
}

    .inside-text-area > label {
        float: left;
        display: block;
        pointer-events: all;
        height: 16px;
        margin-right: 10px;
    }

    .inside-text-area > a.remove-share-link {    
        display: block;
        pointer-events: all;
        margin-top: 1px;
    }

textarea.no-resize {
    resize: none;
}

div.row.panel.sharing-list {
    padding: 10px !important;
}

#PreviewFormModal {
    overflow-x: hidden;
    overflow-y: scroll;
}

.templates_disabler {
    display: block;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.joyride-tip-guide {
    z-index: 11000 !important;
}

/*ul[data-dropdown-content] {
    background: #222;
    border-color: #222;
}

    ul[data-dropdown-content] > li :hover {
        background: #444;
        color: white;
    }*/


table.survey-table {    
    width: 100%
}

    table.survey-table * {
        font-size: 9pt;
        font-weight: normal;
    }

    table.survey-table td.radio, table.survey-table th {
        text-align: center;
        vertical-align: top;
    }

#entries-table th, #entries-table td {
    max-width: 250px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.not-bold {
    font-weight: normal !important;
}

img.current_logo {
    max-width: 350px;
    max-height: 50px;
}

.columns-1, .columns-2, .columns-3, .columns-4, .columns-5,
.columns-6, .columns-7, .columns-8, .columns-9 {
    -moz-column-gap: 10px;
    -webkit-column-gap: 10px;
    column-gap: 10px;
}

.columns-1 {
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
}
.columns-2 {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;
}
.columns-3 {
    -moz-column-count: 3;
    -webkit-column-count: 3;
    column-count: 3;
}
.columns-4 {
    -moz-column-count: 4;
    -webkit-column-count: 4;
    column-count: 4;
}
.columns-5 {
    -moz-column-count: 5;
    -webkit-column-count: 5;
    column-count: 5;
}
.columns-6 {
    -moz-column-count: 6;
    -webkit-column-count: 6;
    column-count: 6;
}
.columns-7 {
    -moz-column-count: 7;
    -webkit-column-count: 7;
    column-count: 7;
}
.columns-8 {
    -moz-column-count: 8;
    -webkit-column-count: 8;
    column-count: 8;
}
.columns-9 {
    -moz-column-count: 9;
    -webkit-column-count: 9;
    column-count: 9;
}

.entry-table-span {
    line-height: 1.5em !important;
}

#content_wrapper #form_entry_extended #form_entry_sidebar .form_entry_extra_info .large-12 {
    font-size: .8em;
    text-align: center;
    padding: 0 0 0 0;
    margin-bottom: 10px;
}

#content_wrapper #form_entry_extended #form_entry_sidebar .form_entry_extra_info .large-12 .wrap {
    background: #edeee6;
    padding: 5px 0;
}

.hide-in-place {
    visibility: hidden;
}

.hide {
    display: none !important;
}

.auto-width {
    width: auto !important;
}

.subscribebeta_input
{
    padding: 28px!important;
    border-radius: 10px!important;
    font-size: 1.25em!important;
}

.subscribebeta_button {
    background: #3fae18;
    border: 1px solid #3fae18;
    color: #fff;
    display: block;
    text-align: center;
    padding: 10px;
    font-size: 1.4em;
    border-radius: 10px;
}

.floatLeft {
    float: left !important;
}
.floatRight {
    float: right !important;
}

.disabled:not(.pace) {
    opacity: .5;
    pointer-events: none;
}

.survey-answers-row {
    margin-bottom: 10px;
    border: 1px solid lightgray;
    padding: 5px;
}

table.survey-table th label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

table.survey-table {
    width: 100%;
    max-width: 100% !important;
    table-layout: fixed;
}

/*.control-tooltip {
    display: none !important;
}*/

.tooltip-button {
    color: #333;
    border-radius: 3px;
    background-color: limegreen;
    border: none;
    align-content: center;
    vertical-align: middle;
    padding-top: 0px;
    font-weight: bold;
}

#form_builder_preview_container .form_field_option_settings .fo_setting ul li.sortable_choice input {
    margin: 0 0 0 0 !important;
}

.CodeMirror *:not(.cm-strong) {
    font-weight: initial;    
}

div.markdown *:not(strong) {
    font-weight: initial;    
}

div.markdown ul {
    list-style: initial !important; 
    margin-left: 20px !important;
    margin-bottom: 1rem !important;
}

@media only screen and (max-width: 40em) {
    #signup_register div.content_wrap3 {
        width: 320px !important; 
        padding: 0px !important;
    }
	
	#signup_register div.form_wrapper {
		border-radius: 0px;
		background-color: rgba(255,255,255,.8);
	}
}

div.intl-tel-input {
    width: 100%;
}

.display-inline {
    display: inline;
}



div.tabs-content {
    border: 1px solid lightgray !important;
    border-top: none !important;
}

ul.tabs {
    background-color: #dcdec6;
}

#form_builder_preview_container #form_builder_preview .form_content_wrapper .form_item .form_item_add_delete,
#form_builder_preview_container #form_builder_settings_tab_content .form_content_wrapper .form_item .form_item_add_delete 
{
	display: block !important;
	opacity: 0.25 !important;
}

#form_builder_preview_container #form_builder_preview .form_content_wrapper .form_item:hover .form_item_add_delete,
#form_builder_preview_container #form_builder_settings_tab_content .form_content_wrapper .form_item:hover .form_item_add_delete
{
	opacity: 1.00 !important;
}

.btn_mobile_cancel_add {
    position: fixed;
    top: 1px;
    right: 1px;
}

.mobile_back_button {
    border-radius: 30px !important;
    border: 1px solid #999 !important;
    background: grey !important;
    padding: 10px !important;
    margin-top: 5px !important;
}

.integration-image {
    height: 128px;
    width: 128px;
}

.close-properties {
    position: absolute;
    right: 0;
    top: 0;
    padding-top: 10px;
    padding-right: 10px;
}

img.integration-modal-logo {
    height: 48px;
    display: inline;
}

img.integration-logo {
    height: 88px;
}

.integration-modal-title {
    display: inline;
    margin-left: 20px;
}

.integration-app {
    padding: 10px;    
}

.linebreak {
    display:block; 
    width:100%;
    height:24px;
}

.offline-ui {
    z-index: 10000 !important;
    margin-left: 85%;
}

.active-tabular-data-column {
    border: 2px dashed #aaa;
}

.tdcol {
    text-align: center;
}

.tdcol input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  padding: 10px;
}

video {
  width: 100%    !important;
  height: auto   !important;
}
.text-right {
    text-align: right;
}

table.readonly input {
    pointer-events: none;
}

.video-control-error {
    padding: 30px;
    background-color: #ccc;
}

span.grippy {
    content: '.......';
    width: 10px;
    height: 20px;
    display: inline-block;
    /*overflow: hidden;*/
    line-height: 5px;
    padding: 3px 4px;
    cursor: move;
    vertical-align: middle;
    margin-top: -.7em;
    /*margin-right: .3em;*/
    font-size: 10px;
    font-family: sans-serif;
    letter-spacing: 2px;
    color: #cccccc;
    text-shadow: 1px 0 1px black;
    float: right;
    margin-right: -1px;
    top: 50%;
    position: absolute;
    right: 1px;
}

span.grippy::after {
  content: '.. .. .. ..';
}
    span.grippy.hide {
        display:none!important;
    }


#form_created_options.show-for-small-only, #form_created_options.show-for-small-only li a {
    font-size: 0.75em !important;
    font-weight: normal !important;
}

#form_created_options.show-for-small-only li a {
    padding: 5px 7px !important;
}

#form_created_options.show-for-small-only .button_group_right {
    margin: 0 0 !important;
    padding: 0 0 !important;
}

#form_created_options.show-for-small-only .button_group_right a {
    margin: 0px !important;
}

#form_created_options.show-for-small-only .button_group_right #form_publish_button_dropdown {
    position: absolute!important;
    top: 30px!important;
    right: 0px!important;
    background: #4e7e0b!important;
    z-index: 8000!important;
    width: 250px!important;
}

.td-column-header-input {
    width: calc(100% - 40px) !important;
    display: inline !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    height: 24px !important;
    margin-bottom: 2px !important;
}

@media only screen and (max-width: 1024px) and (min-device-width: 481px) {
    #main_container_wrapper.expanded #form_element_buttons {
        width: 220px !important;
    }

    #main_container_wrapper.expanded #form_creator_wrapper {
        margin-left: 220px !important; 
    }

    #main_container_wrapper.expanded #form_creator_wrapper #form_created_options {
        left: 220px !important;
        right: 0px;
    }

    #main_container_wrapper.expanded #form_element_buttons ul li a .btn_title {
        display:block !important;
    }

    #main_container_wrapper.expanded a#medium_controls_toggle {
        left:220px!important;
    }

    #main_container_wrapper.collapsed #form_element_buttons {
        width: 0px !important;
    }

    #main_container_wrapper.collapsed #form_creator_wrapper {
        margin-left: 0px !important; 
    }

    #main_container_wrapper.collapsed #form_creator_wrapper #form_created_options {
        left: 0px !important;
        right: 0px;
    }

    #main_container_wrapper.collapsed #form_element_buttons ul li a .btn_title {
        display:block !important;
    }

    
    #main_container_wrapper.collapsed a#medium_controls_toggle {
        left:0px!important;
    }

    #main_container_wrapper a#medium_controls_toggle {
        display: block!important;
    }

    #main_container_wrapper div.form_item a.mobile_toggle_cog_btn {
        display: none;
    }

    #form_element_buttons ul li a .icon_fontawesome {
        margin: 0 10px 0 0 !important;
    }

    #slimScrollMenu {
        padding-right: 10px!important;
    }
}

#main_container_wrapper a#medium_controls_toggle {
        display:none;
        position: fixed;
        top: 80vh;
        left: 0px;
        padding: 10px;
        border-radius: 0px 10px 10px 0px;
        background-color: #333;
        color: limegreen;
        font-weight: bold;
        font-size: large;
}

.show-for-small-only ul li.editor-save-indicator {
    padding-top:5px !important;
}

div.form_item div div div div label.auto-width {
    display: inline !important;
}

.resizable-helper {
    border:1px dotted #ccc;
}

.form_item.active div.ui-resizable-handle.ui-resizable-e {
    border-right: 2px dotted #ccc;
    cursor: ew-resize;
    width:20px;
}

.form_item.active {
    border-right: 2px dotted #ccc;
}

#pages-footer {
    bottom: 0;
    position: fixed;
    padding: 10px;
    background: #f4f4f4;
    border-top: 1px solid #d9dbc7;
    z-index: 9999;
}

.page-break-top {
    height:1px;
    /*padding-top: 30px !important;
    padding-bottom: 30px !important;*/
}

.page-break-top.field.last {
    /*padding-top: 30px !important;*/
    padding-bottom: 5px !important;
}

.page-break-middle {
    margin-left: -30px;
    margin-top:30px;
    width: 150%;
    padding: 20px;
}

    .page-break-middle .add-page {
        background: transparent;
        border: 1px solid;
        padding: 5px 15px;
        border-radius: 5px;
        font-weight: normal;
        mix-blend-mode: difference;
    }

    .page-break-middle.last {
        margin-bottom: -31px !important;        
        height: 100px;
    }

.page-break-bottom {
    padding-top:10px;
    height: 50px;
}

.page-break {
    height: 40px;
}

    .page-break:hover {
        background: #fff !important;
    }

.delete-page-button {
    padding: 3px 10px;
    position: absolute;
    right: 0px;
    color: red;
    border: 1px solid red;
    border-radius: 3px;
    margin-top: 10px;
    font-weight: normal;
}

    .delete-page-button:hover {
        color: white;
        background-color: red;
    }

.page-break-button {
    border: 1px solid;
    border-radius: 3px;
    padding: 5px;
}

    .page-break-button:hover {
        color: white;
        background-color: #008CBA;
    }

.line.form_content_wrapper.last {
    margin-bottom: 0px !important;
    padding: 0px!important;
    min-height: initial !important;
    padding-left: 30px !important;
    margin-top: -40px;
}

#pages-footer > div > a {
    margin-left: 10px;
}

.switch-label {
    font-size: 1.2rem;
}

.banner-button {
    background-color: #fff;
    font-weight: normal;
    border: 1px solid;
    border-radius: 3px;
    padding: 3px 10px;
    position: absolute;
    right: 60px;    
    width: 160px;
    z-index: 1;
}

    .banner-button:hover {
        color: white;
        background-color: #008CBA;
    }

#form-title-visibility {    
    top: 120px;    
}

#set-banner-image, #set-banner-image-uploading {
    top: 150px;
}

#remove-banner-image {
    top: 180px;
}

.no-border {
    border: none !important;
}

.set-title-banner {
    font-weight: normal;
    margin-left: 3px;
}

#title_section {
    min-height: 100px !important;
    margin-bottom: 0px !important;
    padding: 0px !important;
    background-color: #fff;
}

#title-banner-image {
    position: relative;
    width: 100%;
    height: auto;
}

#title-banner-text {
    position: absolute;
    width: 60%;
    padding: 10px 30px;
    background-color: rgba(255,255,255, 0.5);
        border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

#form_content_wrapper {
    border-top: 1px solid #eee;
}

#title-banner-text > * {
    margin-bottom: 0px;
}

.active-logo-button a {
    padding: 2px;
    border-radius: 3px;
    background-color: rgba(0,0,0,0.6);
    width: 26px;
    height: 26px;
    text-align: center;
    vertical-align: middle;
    position: absolute !important;
}

#active-logo-drop {
    padding: 10px;
    width: 120px
}

#active-logo-drop a {
    position: relative !important;
    height: initial;
    width: 100%;
    background-color: initial;
    border-radius: initial;
    padding: 2px;
    display: inline-block !important;
    color: #000 !important;
    font-size: 0.8rem !important;
    margin-bottom: 5px !important;
}

.active-banner-button a {
    padding: 5px;
    font-size: 0.6rem;
    border-radius: 3px;
    color: #fff;
    background-color: rgba(0,0,0,0.6);
    width: 30px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    position: absolute !important;
    z-index: 1;
}

#active-banner-drop {
    padding: 10px;
    width: 160px;
    font-weight: normal;
}

#active-banner-drop a {
    position: relative !important;
    height: initial;
    width: 100%;
    background-color: initial;
    border-radius: initial;
    padding: 2px;
    display: inline-block !important;
    color: #000 !important;
    font-size: 0.8rem !important;
    margin-bottom: 5px !important;
}

#form-name-medium-up {
    padding: 12px !important;
}

#form-name-small {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 2px !important;
}

.button_group_right {
    border-left: none !important;
}

input[type="jscolor"] {
    border: 1px solid #ccc;
    padding: 8px;
    border-radius: 1px;
    width: 100px;
}

#title_section {
    background-color: #ddd !important;
}

#SettingsDrop {
    z-index: 99999;
}

.delete-rule {
    position: absolute;
    top: 10px;
    right: 28px;
    color: red;
}

.edit-rule {
    position: absolute;
    top: 10px;
    right: 48px;
    color: black;
}

div.columns .panel {
    padding: 12px;
}

.button-group.tiny a {
    padding: 7px 15px;
}

.button-group.tiny a:not(#cf-text-preview) {
    border: 1px solid #ccc !important;
}

.button-group.tiny i.contrast {
    mix-blend-mode: difference;
}

#cf-text-preview {
}

.pagebreak_container {
    background:transparent!important;
}

#form-name-medium-up br {
    display: none !important;
}

.form_item:hover {
    background:none !important;
}

.display-flex {
    display:flex!important;
    width:100%!important;
}


#form_content_wrapper .li-field-item {
    display:flex;
}

.row.markdown:first-of-type {
    padding-top: 0px !important;
}

.public_form_field.small-12:first-of-type {
    padding-top: 0px !important;
}

label > div.range-slider {
    margin-top: 2px;
}

.hidden-spectrum {
    /* display: none; */
    height: 0px !important;
    width: 0px !important;
    border: 0px !important;
    padding: 0px !important;
    margin-left: -45px !important;
    margin-top: 20px !important;
}

.epf-button {
    background: #65aa41;
    border: 1px solid #487133;
    color: #fff;
    font-weight: bold;
    font-size: .9em;
    padding: 0.85em 1em;
    text-transform: initial;
}

    .epf-button::after {
        display: none;
    }

a.sp-cancel {
    display: none;
}

.sp-replacer {
    height: 2.3125rem !important;
    padding-top: 7px !important;
    border-color: #cccccc !important;
    background-color: #FAFAFA !important;
}

margin-bottom-20 {
    margin-bottom: 20px;
}