/*----------------------------------------------------------------------*/
/* Optionbar
/*----------------------------------------------------------------------*/
.fixed-optionbar .optionbar {
	position: fixed;
	width: auto;
	z-index: 100;
	top: 30px;
	border: 1px solid #fff;
	padding: 20px 0px 2px;
}
.dark-mode.fixed-optionbar .optionbar {
	border-color: #32373c;
}
.fixed-optionbar .optionbar:after {
	content: '.';
	display: block;
	border-bottom: 1px solid #dfdfdf;
	margin-top: 23px;
}
.fixed-optionbar .has-modules .optionbar:after {
	margin-right: 29px;
}
.fixed-optionbar .show-modules .optionbar:after {
	margin-right: 169px;
}
.fixed-optionbar .has-modules.show-modules .optionbar:after {
	margin-right: 173px;
}
.rtl.fixed-optionbar .has-modules .optionbar:after {
	margin-right: 0;
	margin-left: 30px;
}
.rtl.fixed-optionbar .show-modules .optionbar:after {
	margin-right: 0;
	margin-left: 169px;
}
.rtl.fixed-optionbar .has-modules.show-modules .optionbar:after {
	margin-right: 0;
	margin-left: 200px;
}
.optionbar {
	position: relative;
	z-index: 100;
	font-weight: 100;
	width: 100%;
	height: 38px;
	background-color: #fff;
}
.dark-mode .optionbar {
	background-color: #32373c;
}
.optionbar ul {
	height: 38px;
	margin: 0;
	padding: 0;
	margin-bottom: 4px;
}
.optionbar ul li {
	position: relative;
	float: left;
	margin: 0;
	border-left: 0;
	border-right: 0;
	margin-left: 1px;
}
.rtl .optionbar ul li {
	float: right;
	margin-left: 0px;
	margin-right: 1px;
}
.optionbar ul li.no-border-left {
	border-left: 0 !important;
}
.optionbar ul li.no-border-right {
	border-right: 0 !important;
}
.optionbar ul li.current_template {
	border-right: 0;
}
.optionbar ul li.current_template span {
	display: block;
	padding: 3px 13px 4px 12px;
	border: 1px solid #fff;
	font-size: 16px;
	line-height: 27px;
	height: 26px;
	cursor: pointer;
	max-width: 140px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.optionbar ul li:first-child {
	border-left: 0;
}
.optionbar ul li a {
	color: #333;
	text-decoration: none;
	display: block;
	padding: 8px 13px 1px 12px;
	border: 1px solid #fff;
	line-height: 1em;
	cursor: pointer;
	outline: 0;
}
.dark-mode .optionbar ul li.current_template span,
.dark-mode .optionbar ul li a {
	border-color: #32373c;
}
.optionbar ul li a.disabled {
	opacity: 0.2;
	filter: alpha(opacity=20);
}
.optionbar ul li a.mailster-icon {
	background-repeat: no-repeat;
	background-position: center;
	width: 10px;
	line-height: 8px;
	background-position: 999px 999px;
	background-image: none;
}
.optionbar ul li a.mailster-icon {
	padding-bottom: 1px;
	min-height: 23px;
}
.optionbar ul li a.mailster-icon {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 22px 22px;
}
.dark-mode .optionbar ul li a.mailster-icon:before {
	color: #fff;
}

.optionbar ul li a.mailster-icon.undo {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M8,5l-3,3l3,3"></path><path d="M5,8h9c3.314,0 6,2.462 6,5.5v0c0,3.038 -2.686,5.5 -6,5.5h-8"></path></g><path fill="none" d="M0,0h24v24h-24Z"></path></svg>');
}
.optionbar ul li a.mailster-icon.redo {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M16,11l3-3l-3-3"></path><path d="M18,19h-8c-3.3,0-6-2.5-6-5.5l0,0c0-3,2.7-5.5,6-5.5h9"></path></g><path fill="none" d="M24,24H0L0,0l24,0V24z"></path></svg>');
}
.optionbar ul li a.mailster-icon.clear-modules {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M18.414,6.414l-2.828,-2.828c-0.375,-0.375 -0.884,-0.586 -1.414,-0.586h-7.172c-1.105,0 -2,0.895 -2,2v14c0,1.105 0.895,2 2,2h10c1.105,0 2,-0.895 2,-2v-11.172c0,-0.53 -0.211,-1.039 -0.586,-1.414Z"></path><path d="M8,12.23h8"></path><path d="M8,15.23h8"></path><path d="M8,18h8"></path><path d="M8,8.251v-1.502c0,-0.414 0.335,-0.749 0.749,-0.749h1.502c0.414,0 0.749,0.335 0.749,0.749v1.502c0,0.414 -0.335,0.749 -0.749,0.749h-1.502c-0.414,0 -0.749,-0.335 -0.749,-0.749Z"></path></g><path fill="none" d="M0,0h24v24h-24Z"></path></svg>');
}
.optionbar ul li a.mailster-icon.clear-modules:hover {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M18.414,6.414l-2.828,-2.828c-0.375,-0.375 -0.884,-0.586 -1.414,-0.586h-7.172c-1.105,0 -2,0.895 -2,2v14c0,1.105 0.895,2 2,2h10c1.105,0 2,-0.895 2,-2v-11.172c0,-0.53 -0.211,-1.039 -0.586,-1.414Z"></path><path d="M8,8.251v-1.502c0,-0.414 0.335,-0.749 0.749,-0.749h1.502c0.414,0 0.749,0.335 0.749,0.749v1.502c0,0.414 -0.335,0.749 -0.749,0.749h-1.502c-0.414,0 -0.749,-0.335 -0.749,-0.749Z"></path></g><path fill="none" d="M0,0h24v24h-24Z"></path></svg>');
}
.optionbar ul li a.mailster-icon.code {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="none"><path d="M0 0h24v24h-24Z"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M13.78 4l-3.56 16"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M18 8l4 4 -4 4"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6 16l-4-4 4-4"></path></g></svg>');
}
.optionbar ul li a.mailster-icon.code.active {
	background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="3"/><rect width="3.5" height="3.5" x="7" y="7" rx=".5"/><path d="M13.5 7H17"/><path d="M13.5 10.5H17"/><path d="M7 13.5h10"/><path d="M7 17h10"/></g><path fill="none" d="M0 0h24v24H0Z"/></svg>');
}
.optionbar ul li a.mailster-icon.plaintext {
	background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M7 7h3"/><path d="M7 10.33h3"/><path d="M7 13.67l10 0"/><rect width="18" height="18" x="3" y="3" rx="4"/><path d="M7 17h4.16"/></g><path fill="none" d="M0 0h24v24H0Z"/></svg>');
}
.optionbar ul li a.mailster-icon.plaintext.active {
	background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="3"/><rect width="3.5" height="3.5" x="7" y="7" rx=".5"/><path d="M13.5 7H17"/><path d="M13.5 10.5H17"/><path d="M7 13.5h10"/><path d="M7 17h10"/></g><path fill="none" d="M0 0h24v24H0Z"/></svg>');
}
.optionbar ul li a.mailster-icon.precheck {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g fill="none"><path d="M0 0h24v24h-24v-24Z"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M11 12h10"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.414 10.586c.781.781.781 2.047 0 2.828 -.781.781-2.047.781-2.828 0 -.781-.781-.781-2.047 0-2.828 .781-.781 2.047-.781 2.828 0"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M11 5h10"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M3.02 4.508l1.653 1.488 3.327-2.996"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M11 19h10"></path><path stroke="%23545454" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6.414 17.586c.781.781.781 2.047 0 2.828 -.781.781-2.047.781-2.828 0 -.781-.781-.781-2.047 0-2.828 .781-.781 2.047-.781 2.828 0"></path></g></svg>');
}
.optionbar ul li a.mailster-icon.dfw {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2.7614" ry="0"></rect><polyline points="12.5,8.5 15.5,8.5 15.5,11.5"></polyline><polyline points="11.5,15.5 8.5,15.5 8.5,12.5"></polyline></g><path fill="none" d="M0 0h24v24h-24Z"></path></svg>');
}
.optionbar ul li a.mailster-icon.dfw.active {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M19 21h-14c-1.105 0-2-.895-2-2v-14c0-1.105.895-2 2-2h14c1.105 0 2 .895 2 2v14c0 1.105-.895 2-2 2Z"></path><polyline points="14,6 18,6 18,10"></polyline><polyline points="10,18 6,18 6,14"></polyline></g><rect width="24" height="24" fill="none"></rect></svg>');
}
.optionbar ul li a.mailster-icon.save-template {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M16.164 3h-11.157c-1.11 0-2.008.904-2 2.015l.104 14c.008 1.099.901 1.985 2 1.985h13.881c1.105 0 2-.895 2-2v-11.172c0-.53-.211-1.039-.586-1.414l-2.828-2.828c-.375-.375-.883-.586-1.414-.586Z"></path><path d="M15.993 3v3.909c0 .552-.448 1-1 1h-6c-.552 0-1-.448-1-1v-3.909"></path><path d="M7 21v-7.714c0-.71.576-1.286 1.286-1.286h7.429c.709 0 1.285.576 1.285 1.286v7.714"></path></g><path fill="none" d="M0 0h24v24h-24v-24Z"></path></svg>');
}

.optionbar ul li a.mailster-icon.loading {
	background-image: url('data:image/svg+xml;utf8,<svg version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke-linecap="round" stroke-width="1.5" stroke="%23545454" fill="none" stroke-linejoin="round"><path d="M6 4h12"></path><path d="M6 20h12"></path><path d="M8 4v4c0 .63.296 1.222.8 1.6l3.2 2.4 3.2-2.4c.504-.378.8-.97.8-1.6v-4"></path><path d="M16 20v-4c0-.63-.296-1.222-.8-1.6l-3.2-2.4 -3.2 2.4c-.504.378-.8.97-.8 1.6v4"></path></g><path fill="none" d="M24 24h-24v-24h24v24Z"></path></svg>');
}

.optionbar ul li a:hover,
.optionbar ul li a.active,
.optionbar ul li span:hover {
	background-repeat: no-repeat;
	background-position: center;
	overflow: hidden;
	background-color: #fafafa !important;
	border: 1px solid #999;
	border-radius: 2px;
	color: #23282d;
	box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba(0, 0, 0, 0.08);
}
.dark-mode .optionbar ul li a:hover,
.dark-mode .optionbar ul li a.active,
.dark-mode .optionbar ul li span:hover {
	border: 1px solid #191f25;
	background-color: #191f25 !important;
	box-shadow: inset 0 1px 0 #000, 0 1px 0 rgba(0, 0, 0, 0.08);
}
.optionbar ul li a:active,
.optionbar ul li a.active,
.optionbar ul li span:active {
	background-color: #ebebeb !important;
	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.3);
}
.dark-mode .optionbar ul li a:active,
.dark-mode .optionbar ul li a.active,
.dark-mode .optionbar ul li span:active {
	background-color: #191f25 !important;
	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.3);
}
.optionbar ul li select {
	margin: 5px;
}
.optionbar ul li:hover a {
	opacity: 1;
	filter: none;
}
.optionbar ul li:hover a.disabled {
	opacity: 0.2;
	filter: alpha(opacity=20);
}
.optionbar ul li div {
	display: none;
	position: absolute;
	padding: 10px 0 55px;
	right: -5px;
	background: rgba(255, 255, 255, 0.01);
}
.rtl .optionbar ul li div {
	left: -5px;
	right: inherit;
}
.optionbar ul li div.spinner {
	display: block;
	visibility: visible;
	padding: 0;
	float: left;
}
.optionbar ul li .ddarrow {
	height: 2px;
}
.ie .optionbar ul li div.ddarrow {
	background-position: center top;
}
.optionbar ul li .inner {
	position: static;
	border: 1px solid #dfdfdf;
	background: #f9f9f9;
	padding: 5px 0 0;
	min-width: 220px;
	background: #f9f9f9;
	max-height: 600px;
	overflow: scroll;
	overflow-y: auto;
	overflow-x: hidden;
}
.optionbar ul li .inner h4 {
	margin: 0;
	padding: 3px 10px 0;
}
.optionbar ul li .inner p {
	margin: 0;
	padding: 10px;
}
.mailster_template_save .inner {
	position: relative;
	padding: 0px 20px;
}
.mailster_template_save #new_template_name {
	font-size: 1.8em;
}
.mailster_template_save #new_template_saveas_dropdown {
	width: 280px;
}
.mailster_template_save #new_template-ajax-loading {
	visibility: visible;
	display: none;
	float: right;
}
.mailster_template_save .foot {
	padding: 10px 20px;
	border-top: 1px solid #dfdfdf;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}
.mailster_template_save .foot button {
	float: right;
	margin-left: 6px;
}
.rtl .mailster_template_save .foot button {
	margin-left: 0px;
	margin-right: 6px;
	float: left;
}
.mailster_template_save .foot.textleft {
	text-align: left;
}
.optionbar ul li:hover div {
	display: block;
}
.optionbar ul li .inner label {
	padding: 3px 0;
	display: block;
}
.optionbar ul li:hover a {
	background-color: #fff;
}
.optionbar ul li .inner ul {
	overflow: hidden;
	position: relative;
	height: auto;
	border: 0;
	margin-top: 10px;
	max-width: 220px;
}
.optionbar ul li .inner ul li {
	position: static;
	float: none;
	clear: both;
	display: block;
	border: 0;
	height: auto;
}
.optionbar ul li.current_template.single .inner ul li {
	border-right: 0;
	border-left: 0;
}
.optionbar ul li.current_template .inner ul li i.version {
	color: #ccc;
	padding-left: 3px;
	font-size: 0.8em;
}
.optionbar ul li .inner ul:first-child li {
}
.optionbar ul li .inner ul li a {
	display: block;
	white-space: nowrap;
	padding: 5px 15px;
	font-weight: 700;
	text-overflow: ellipsis;
	overflow: hidden;
}
.optionbar ul li .inner ul li ul {
	display: none;
	margin: 0;
	max-height: 200px;
	overflow: scroll;
	overflow-y: auto;
	overflow-x: hidden;
}
.optionbar ul li .inner ul li ul li {
}
.optionbar ul li .inner ul li ul li a {
	padding-left: 25px;
	font-weight: 100;
	text-overflow: ellipsis;
	overflow: hidden;
}
.optionbar ul li .inner ul li ul li a:hover,
.optionbar ul li .inner ul li ul li a.active:hover {
	color: #777;
	background: #fcfcfc;
}
.optionbar ul li .inner ul li ul li a.active {
	background-color: #777;
	font-weight: bold;
	color: #333;
}
#new_template-ajax-loading {
	float: left;
	margin-top: 6px;
}
