.rspbld-elements {
	/* General admin vars */
	--rspbld-body-bg: #ffffff;
	--rspbld-border-color-1: #dddddd;
	--rspbld-border-color-2: #cccccc;
	--rspbld-border-color-3: #eeeeee;
	--rspbld-bg-inverse-rgb: 0, 0, 0;
	--rspbld-text-color: #555555;
	--rspbld-title-color: #333333;
	--rspbld-element-bg-rgba: 255, 255, 255, 0.75;
	
	/* Accordion vars */
	--rspbld-accordion-button-color: #000000;
	
	/* Tab vars */
	--rspbld-tab-nav-bg-color: #f5f5f5;
	--rspbld-tab-nav-link-color: #112855;
}

:root[data-color-scheme="dark"] .rspbld-elements {
	/* General admin vars */
	--rspbld-body-bg: #212529;
	--rspbld-border-color-1: #495057;
	--rspbld-border-color-2: #5d666f;
	--rspbld-border-color-3: #6f7a85;
	--rspbld-bg-inverse-rgb: 255, 255, 255;
	--rspbld-text-color: #ebebeb;
	--rspbld-title-color: #d6d6d6;
	--rspbld-element-bg-rgba: 0, 0, 0, 0.25;

	/* Accordion vars */
	--rspbld-accordion-button-color: #ffffff;

	/* Tab vars */
	--rspbld-tab-nav-bg-color: #2d3339;
	--rspbld-tab-nav-link-color: #fefefe;
}

.rspbld-elements *:not(.btn-close) {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#module-form .control-group div > small {
	display: none;
}
.rspbld-elements a, .rspbld-elements a:hover, .rspbld-elements a:active, .rspbld-elements a:focus {
	text-decoration: none;
}
.rspbld-elements a.invalid, .rspbld-elements a:hover.invalid, .rspbld-elements a:focus.invalid {
	color: #9d261d !important;
}
.rspbld-elements textarea, .rspbld-elements input[type="text"], .rspbld-elements input[type="password"], .rspbld-elements input[type="datetime"], .rspbld-elements input[type="datetime-local"], .rspbld-elements input[type="date"], .rspbld-elements input[type="month"], .rspbld-elements input[type="time"], .rspbld-elements input[type="week"], .rspbld-elements input[type="number"], .rspbld-elements input[type="email"], .rspbld-elements input[type="url"], .rspbld-elements input[type="search"], .rspbld-elements input[type="tel"], input[type="color"], .rspbld-elements .uneditable-input, .rspbld-elements .input-append .add-on, .rspbld-elements .input-prepend .add-on {
	min-height: 28px;
}
.rspbld-elements p:last-of-type {
	margin-bottom: 0;
}
.ui-state-highlight {
	border: 2px dashed var(--rspbld-border-color-2);
	border-radius: 0;
	min-height: 100%;
	margin-bottom: 5px;
}
.ui-sortable-helper {
	margin-bottom: 0 !important;
}
.rspbld-elements .calendar, .rspbld-elements .calendar table {
	width: 100%;
}
.float-left, .pull-left {
	float: left;
}
.float-right, .pull-right {
	float: right;
}
.text-left {
	text-align: left;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.tooltip .tooltip-inner {
	text-align: center;
}
.rspbld-elements .btn i, .rspbld-elements .accordion-toggle i, .rspbld-elements .progress i, .rspbld-elements .progress-circle i, .rspbld-elements .nav-tabs > li > a > i  {
	margin-right: 4px;
	vertical-align: middle;
}
.rspbld-container {
	background-color: var(--rspbld-body-bg);
	border: 1px solid var(--rspbld-border-color-1);
	padding: 25px;
	position: relative;
}
#jform_params_bootstrap_version .btn-group {
	display: block;
}
#jform_params_bootstrap_version .btn-group > .btn {
	border-radius: 0;
	margin: 0 0 calc(var(--border-width)*-1) 0;
	width: 100%;
}
#jform_params_bootstrap_version .btn-group > .btn:first-of-type {
	border-top-left-radius: var(--btn-border-radius);
	border-top-right-radius: var(--btn-border-radius);
}
#jform_params_bootstrap_version .btn-group > .btn:last-of-type {
	border-bottom-left-radius: var(--btn-border-radius);
	border-bottom-right-radius: var(--btn-border-radius);
}
.rspbld-container .element-container:hover {
	cursor: move;
}

/* Column */
.rspbld-container .column-content {
	background-color: rgba(var(--rspbld-bg-inverse-rgb), 0.15);
	padding: 10px 10px 51px 10px;
	position: relative;
}
.rspbld-container .column-content .add-element-container {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0;
	width: 100%;
}
.rspbld-container .column-content .add-element {
	background-color: var(--bs-success);
	color: #ffffff;
	display: block;
	font-size: 18px;
	padding: 10px;
	text-align: center;
	-webkit-transition: background-color .2s linear;
	-moz-transition: background-color .2s linear;
	transition: background-color .2s linear;
	width: 100%;
}
.rspbld-container .column-content .add-element:hover {
	background-color: rgba(var(--bs-success-rgb), 0.8);
}
.rspbld-container .column-actions {
	font-size: 0;
	height: 24px;
	padding: 0;
	position: absolute;
	right: 10px;
	top: -24px;
}
.rspbld-container .column-actions a {
	color: var(--rspbld-text-color);
	display: inline-block;
	font-size: 16px;
	line-height: 24px;
	height: 24px;
	width: 24px;
	text-align: center;
}
.rspbld-container .column-actions a.published {
	color: var(--bs-success);
}
.rspbld-container .column-actions a.unpublished {
	color: var(--bs-danger);
}
/* End column */

/* Element */
.rspbld-container .element-container {
	display: block;
}
.rspbld-container .element {
	background-color: rgba(var(--rspbld-element-bg-rgba));
	border: 1px solid var(--rspbld-border-color-2);
	margin-bottom: 5px;
	min-height: 87px;
	padding: 24px 24px 24px 10px;
	position: relative;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	transition: all .2s linear;
}	
.rspbld-container .element:hover {
	background-color: var(--rspbld-body-bg);
}
.rspbld-container .element-image {
	margin-right: 5px;
	padding: 6px;
	width: 37px;
}
.rspbld-container .element-title {
	color: var(--rspbld-title-color);
	display: inline-block;
	font-size: 16px;
	line-height: 18px;
	margin: 0;
}
.rspbld-container .element-type {
	font-size: 12px;
	line-height: 14px;
	margin: 0;
}
.rspbld-container .element-actions {
	display: flex;
	height: 22px;
	position: absolute;
	right: 0;
	top: 0;
}
.rspbld-container .element-actions a {
	color: var(--rspbld-text-color);
	display: block;
	font-size: 14px;
	line-height: 22px;
	height: 22px;
	width: 22px;
	text-align: center;
}
.rspbld-container .element-actions a:not(.publish-element):hover {
	color: #3071a9;
	text-decoration: none;
}
.rspbld-container .element-actions a.published {
	color: var(--bs-success);
}
.rspbld-container .element-actions a.unpublished {
	color: var(--bs-danger);
}
.rspbld-container .element-actions a > .fa {
	vertical-align: middle;
}
/* End element */

/* Modal general styling */
.rspbld-elements .modal .control-group label {
	width: auto;
}
.rspbld-elements .modal a[target="_blank"]:before {
	content: none;
}
.rspbld-elements .modal input, .rspbld-elements .modal select, .rspbld-elements .modal textarea {
	max-width: none;
	width: 100%;
}
.rspbld-elements .modal .modal-content {
	border-radius: 0;
}
.rspbld-elements .modal .chosen-container {
	max-width: none;
	width: 100% !important;
}
.rspbld-elements .modal .chosen-single {
	width: 100%;
}
.rspbld-elements .modal .field-calendar input {
	width: auto;
}
.rspbld-elements .modal .field-calendar .btn {
	margin: 0;
}
.rspbld-elements .modal.btn {
	display: inline-block;
	position: static;
}
.rspbld-elements .modal .chzn-container-single, .rspbld-elements .modal .chzn-single {
	width: 100% !important;
}
.rspbld-elements .modal .minicolors-theme-bootstrap .minicolors-swatch {
	border-radius: 0;
	left: 5px;
	top: 5px;
	height: calc(1.5em + 1.2rem - 8px);
	width: calc(1.5em + 1.2rem - 8px);
}
.rspbld-elements .modal .minicolors-theme-bootstrap .minicolors-panel {
	height: 152px;
	width: 173px;
	left: 0;
	top: 45px;
}
.rspbld-elements div.modal {
	height: auto;
	top: 50%;
	left: 50%;
	padding: 0;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 90vw;
}
.rspbld-elements .modal .modal-body {
	height: 80vh;
	padding: 20px;
	overflow: hidden;
	width: 100%;
}
.rspbld-elements .modal .modal-body > .row {
	margin: 0;
}
.rspbld-elements .modal .modal-dialog {
	max-width: none;
}
.rspbld-elements .modal .modal-header h1, .rspbld-elements .modal .modal-header h2, .rspbld-elements .modal .modal-header h3 {
	line-height: 46px;
	margin: 0;
}
.rspbld-elements .modal .modal-header .close {
	font-size: 2rem;
	line-height: 46px;
	width: 50px;
	position: absolute;
	right: 15px;
	top: 0;
	padding: 0 10px;
}
.rspbld-elements .modal .modal-header .close:focus {
	outline: none;
}
.rspbld-elements .modal .modal-body .control-group {
	margin: 20px 0;
}
.rspbld-elements .modal .btn-group .btn {
	margin-right: 0;
}
.rspbld-elements .modal .input-prepend input[type="text"] {
	background-color: transparent;
	width: 245px;
	padding: 8px;
}

#modal-element-settings .loader, #modal-element-settings .element-preview .preview-loader, #modal-element-settings .rspbld-editor-container .editor-loader {
	background-color: var(--rspbld-body-bg);
	background-image: url('../../../media/com_rspagebuilder/images/loader.gif');
	background-size: 42px 42px;
	background-position: center center;
	background-repeat: no-repeat;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 9999;
}
#modal-element-settings .control-group .control-label {
	width: 200px;
}
#modal-element-settings .control-group.full-width .control-label {
	width: 100%;
}
.options-tab .nav.nav-tabs {
	margin-bottom: 0;
	border-bottom-color: var(--rspbld-border-color-2);
}
.options-tab .nav.nav-tabs .nav-item.show .nav-link, .options-tab .nav.nav-tabs .nav-link.active {
	border-top-color: var(--rspbld-border-color-2);
	border-left-color: var(--rspbld-border-color-2);
	border-right-color: var(--rspbld-border-color-2);
}
.options-tab .nav-tabs + .tab-content {
	border-left: 1px solid var(--rspbld-border-color-2);
	border-bottom: 1px solid var(--rspbld-border-color-2);
	border-right: 1px solid var(--rspbld-border-color-2);
	height: calc(80vh - 85px);
	overflow-x: hidden;
	padding: 0 10px;
}

/* Elements list modal */
#modal-elements-list.modal .modal-body > .row {
	height: 100%;
	overflow-y: auto;
}
#modal-elements-list.modal .modal-body > .row > [class^="col-"]:first-of-type {
	background-color: var(--rspbld-body-bg);
	position: sticky;
	top: 0;
}
#modal-elements-list .element {
	display: none;
}

/* Elements categories */
#modal-elements-list .elements-categories {
	background-color: rgba(var(--rspbld-bg-inverse-rgb), 0.075);
	margin: 0 0 15px 0;
}
#modal-elements-list .elements-categories > ul {
	display: block;
	padding: 0;
	margin: 0;
	list-style: none;
}
#modal-elements-list .elements-categories > ul li a  {
	color: var(--rspbld-title-color);
	display: block;
	font-weight: 700;
	padding: 7px 15px;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	transition: all .2s linear;
}
#modal-elements-list .elements-categories > ul li.active a, #modal-elements-list .elements-categories > ul li a:hover, #modal-elements-list .elements-categories > ul li a:focus {
	background-color: #122942;
	color: #ffffff;
	text-decoration: none;
}
/* End elements categories */

/* Elements filter */
#modal-elements-list .elements-filter {
	border: 1px solid var(--rspbld-border-color-1);
	padding: 5px;
	margin-bottom: 10px;
}
/* End elements filter */

/* Elements list */
#modal-elements-list .elements-list-wrapper > ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
}
#modal-elements-list .elements-list-wrapper > ul li {
	margin: 5px 0;
	width: 50%;
}
#modal-elements-list .elements-list-wrapper > ul li.filter-hidden {
	display: none;
	visibility: hidden;
}
#modal-elements-list .elements-list-wrapper > ul li a {
	display: block;
	padding: 20px 10px;
	height: 100%;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	transition: all .2s linear;
	width: 100%;
}
#modal-elements-list .elements-list-wrapper > ul li a:hover, #modal-elements-list .elements-list-wrapper > ul li a:focus {
	background-color: rgba(var(--rspbld-bg-inverse-rgb), 0.075);
	text-decoration: none;
}
#modal-elements-list .elements-list-wrapper > ul li img {
	padding: 10px;
	margin-bottom: 10px;
}
#modal-elements-list .elements-list-wrapper > ul li.hidden {
	display: none;
}
#modal-elements-list .elements-list-wrapper .element-title {
	color: var(--rspbld-title-color);
	margin: 0;
	font-size: 14px;
	line-height: 16px;
}
#modal-elements-list .elements-list-wrapper .element-subtitle {
	color: var(--rspbld-title-color);
	margin-top: 2px;
	font-size: 12px;
	line-height: 14px;
}

/* Icons background color */
img.rspbld_accordion {
	background-color: #a55e35;
}
img.rspbld_alert {
	background-color: #588ebc;
}
img.rspbld_animated_number {
	background-color: #baa846;
}
img.rspbld_button {
	background-color: #7baf81;
}
img.rspbld_carousel {
	background-color: #463777;
}
img.rspbld_countdown_timer {
	background-color: #aecc28;
}
img.rspbld_divider {
	background-color: #a3a1a0;
}
img.rspbld_google_map {
	background-color: #b21d00;
}
img.rspbld_horizontal_icon_box {
	background-color: #908bbc;
}
img.rspbld_horizontal_image_box {
	background-color: #ee7674;
}
img.rspbld_icon {
	background-color: #eac13a;
}
img.rspbld_image {
	background-color: #473ec9;
}
img.rspbld_list {
	background-color: #049c3d;
}
img.rspbld_masonry_boxes {
	background-color: #8fbcd6;
}
img.rspbld_module {
	background-color: #d31b43;
}
img.rspbld_openstreetmap {
	background-color: #a8c686;
}
img.rspbld_personal_box {
	background-color: #ad8662;
}
img.rspbld_portfolio_filtering {
	background-color: #bc77ef;
}
img.rspbld_price_box {
	background-color: #4cbaba;
}
img.rspbld_progress_bars {
	background-color: #e08f33;
}
img.rspbld_progress_circles {
	background-color: #744341;
}
img.rspbld_spacer {
	background-color: #2f93e0;
}
img.rspbld_tab {
	background-color: #99467e;
}
img.rspbld_testimonial_box {
	background-color: #cc6e61;
}
img.rspbld_text_block {
	background-color: #64b759;
}
img.rspbld_vertical_icon_box {
	background-color: #614f9b;
}
img.rspbld_vertical_image_box {
	background-color: #e55252;
}
img.rspbld_video {
	background-color: #dea739;
}
img.rspbld_youtube_background_video_box {
	background-color: #dd0000;
}
/* End icons background color */
/* End elements list */
/* End elements list modal */

/* Add / edit element modal */
#modal-element-settings.modal .modal-body {
	overflow-y: auto;
}
#modal-element-settings .element-image, #modal-element-settings .element-title, #modal-element-settings .element-type, #modal-element-settings .element-actions {
	display: none;
}
#modal-element-settings .element-container {
	overflow: hidden;
}
#modal-element-settings .element-preview {
	border: 1px solid var(--rspbld-border-color-2);
	line-height: 24px;
	min-height: 50px;
	padding: 15px;
	position: relative;
}
#modal-element-settings .element-preview > div.pull-left, #modal-element-settings .element-preview > div.pull-right {
	float: none;
}
#modal-element-settings .element-preview .btn i {
	margin-right: 4px;
	vertical-align: middle;
}
#modal-element-settings .add-item {
	margin-bottom: 15px;
	margin-top: 20px;
}
#modal-element-settings .add-item .fa {
	line-height: inherit;
	vertical-align: top;
}
#modal-element-settings .field-calendar .js-calendar {
	margin-top: 0 !important;
}
#modal-element-settings .iterative-items .accordion-item {
	border: none;
	border-radius: 4px;
	box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.3);
	margin-bottom: 10px;
	position: relative;
}
#modal-element-settings .iterative-items .accordion-button {
	background-color: rgba(var(--rspbld-bg-inverse-rgb), 0.075);
	color: var(--rspbld-title-color);
	padding: 20px 30px 20px 20px;
	text-decoration: none;
}
#modal-element-settings .iterative-items .accordion-button:hover, #modal-element-settings .iterative-items .accordion-button:focus {
	border-color: transparent;
	box-shadow: none;
	color: var(--rspbld-title-color);
}
#modal-element-settings .iterative-items .accordion-button:after {
	content: none;
}
#modal-element-settings .iterative-items .item-actions {
	position: absolute;
	right: 2px;
	top: 2px;
	z-index: 3;
}
#modal-element-settings .iterative-items .item-actions a {
	color: var(--rspbld-text-color);
	display: block;
	font-size: 14px;
	height: 20px;
	width: 20px;
	text-align: center;
}
#modal-element-settings .iterative-items .item-actions a:hover {
	color: #3071a9;
}
#modal-element-settings .iterative-items .item-actions .move-item:hover {
	cursor: move;
}
#modal-element-settings .iterative-items .accordion-inner {
	border: none;
	padding: 10px 15px;
}
#modal-element-settings .iterative-items .ui-state-highlight {
	margin-bottom: 10px;
}
#modal-element-settings [id*="marker_address_"] + .location-results ul {
	-webkit-box-shadow: 0 2px 6px 0 rgba(0,0,0,.3);
	-moz-box-shadow: 0 2px 6px 0 rgba(0,0,0,.3);
	box-shadow: 0 2px 6px 0 rgba(0,0,0,.3);
	list-style: none;
	margin: 0;
	padding: 5px 0;
}
#modal-element-settings [id*="marker_address_"] + .location-results ul li {
	padding: 2px 7px;
}
#modal-element-settings [id*="marker_address_"] + .location-results ul li:hover {
	background-color: #122942;
	color: #ffffff;
	cursor: pointer;
}
/* End add / edit element modal */

/* View element HTML modal */
#modal-element-view-html .modal-body > textarea {
	height: 100%;
	width: 100%;
	resize: none;
}
/* End view element HTML modal */
/* End modal general styling */

/* General elements styling */
.rspbld-title.h1, .rspbld-title.h2, .rspbld-title.h3, .rspbld-title.h4, .rspbld-title.h5, .rspbld-title.h6,
h1.rspbld-title, h2.rspbld-title, h3.rspbld-title, h4.rspbld-title, h5.rspbld-title, h6.rspbld-title,
.rspbld-subtitle.h1, .rspbld-subtitle.h2, .rspbld-subtitle.h3, .rspbld-subtitle.h4, .rspbld-subtitle.h5, .rspbld-subtitle.h6,
h1.rspbld-subtitle, h2.rspbld-subtitle, h3.rspbld-subtitle, h4.rspbld-subtitle, h5.rspbld-subtitle, h6.rspbld-subtitle,
.rspbld-item-title.h1, .rspbld-item-title.h2, .rspbld-item-title.h3, .rspbld-item-title.h4, .rspbld-item-title.h5, .rspbld-item-title.h6,
h1.rspbld-item-title, h2.rspbld-item-title, h3.rspbld-item-title, h4.rspbld-item-title, h5.rspbld-item-title, h6.rspbld-item-title {
	margin: .5rem 0;
}
.rspbld-image img {
	width: 100%;
}
/* End general elements styling */

@media (min-width: 576px) {
	#modal-elements-list .elements-list-wrapper > ul li {
		width: 33.3333%;
	}
}
@media (min-width: 768px) {
	#jform_params_bootstrap_version .btn-group {
		display: inline-flex;
	}
	#jform_params_bootstrap_version .btn-group > .btn {
		margin: 0 0 0 calc(var(--border-width)*-1);
		width: auto;
	}
	#jform_params_bootstrap_version .btn-group > .btn:first-of-type {
		border-top-left-radius: var(--btn-border-radius);
		border-bottom-left-radius: var(--btn-border-radius);
	}
	#jform_params_bootstrap_version .btn-group > .btn:last-of-type {
		border-top-right-radius: var(--btn-border-radius);
		border-bottom-right-radius: var(--btn-border-radius);
	}
	#modal-elements-list.modal .modal-body > .row > [class^="col-"]:first-of-type {
		position: static;
	}
	#modal-elements-list .elements-nav {
		position: sticky;
		top: 0;
	}
	#modal-element-view-html.modal {
		width: 70vw;
	}
	#modal-element-settings.modal .modal-body {
		overflow-y: hidden;
	}
	.options-tab .nav-tabs .nav-link {
		padding: 8px 12px;
	}
	#modal-element-settings .element-preview {
		max-height: calc(80vh - 42.5px);
		overflow-y: auto;
	}
}
@media (min-width: 992px) {
	.options-tab .nav-tabs .nav-link {
		padding: 0.5rem 1rem;
	}
}
@media (min-width: 1200px) {
	.rspbld-elements .modal .modal-body {
		height: 70vh;
	}
	#modal-elements-list.modal {
		width: 70vw;
	}
	#modal-elements-list .elements-list-wrapper > ul li {
		width: 25%;
	}
	#modal-row-settings.modal, #modal-column-settings.modal, #modal-element-view-html.modal {
		width: 50vw;
	}
	.options-tab .nav-tabs + .tab-content {
		height: calc(70vh - 85px);
	}
	#modal-element-settings .element-preview {
		max-height: calc(70vh - 42.5px);
	}
}
@media (min-width: 1400px) {
	#modal-elements-list .elements-list-wrapper > ul li {
		width: 20%;
	}
}