* {
	box-sizing: border-box;
}

.new-file form {
	border: 1px solid #ccc;
	display: flex;
	flex-wrap: nowrap;
}

.new-file input[type=file] {
	width: 85%;
	padding: 8px 0 0 5px !important;
}

.new-file input[type=submit] {
	font-size: 0;
	width: 15%;
	margin: 0 !important;
	padding: 5px;
	background-image: url("//media.travsrv.com/appSkins/23833/v6/themes/standard/images/publish-white.png");
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: center;
}

.file {
	white-space: nowrap;
}

.folder button[type=submit] {
	background-color: transparent;
	color: black;
	outline: none;
}

.folder button[type="submit"] svg path {
	fill: deepskyblue;
}

.folder .children {
	margin-left: 10px;
	padding-left: 10px;
	border-left: solid lightgray 1px;
}

div.file div.text {
	display: inline;
}

#imagePreview img {
	display: block;
}

.folder .icon {
	display: inline;
}

.folder button {
	border: none;
}

.folder a svg {
	width: 15px
}

div.folder button {
	display: inline;
	border: none;
	padding: 0;
	height: 25px;
}

div.file form {
	display: inline;
}

div.file {
	height: 25px;
}







/*!
* Bootstrap Reboot v4.3.0 (https://getbootstrap.com/)
* Copyright 2011-2019 The Bootstrap Authors
* Copyright 2011-2019 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
*/
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-family: sans-serif;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	width: 100%;
	height: 100%;
	overflow: hidden;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
	display: block;
}

body {
	margin: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: left;
	background-color: #fff;
	font-size: 16px;
	line-height: 1.4em;
}

[tabindex="-1"]:focus {
	outline: 0 !important;
}

hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	margin-bottom: 0.5rem;
}

p {
	margin-top: 0;
	margin-bottom: 1rem;
}

abbr[title],
abbr[data-original-title] {
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted;
	cursor: help;
	border-bottom: 0;
	-webkit-text-decoration-skip-ink: none;
	text-decoration-skip-ink: none;
}

address {
	margin-bottom: 1rem;
	font-style: normal;
	line-height: inherit;
}

ol,
ul,
dl {
	margin-top: 0;
	margin-bottom: 1rem;
}

	ol ol,
	ul ul,
	ol ul,
	ul ol {
		margin-bottom: 0;
	}

dt {
	font-weight: 700;
}

dd {
	margin-bottom: .5rem;
	margin-left: 0;
}

blockquote {
	margin: 0 0 1rem;
}

b,
strong {
	font-weight: bolder;
}

small {
	font-size: 80%;
}

sub,
sup {
	position: relative;
	font-size: 75%;
	line-height: 0;
	vertical-align: baseline;
}

sub {
	bottom: -.25em;
}

sup {
	top: -.5em;
}

a {
	color: #007bff;
	/*! text-decoration: none; */
	background-color: transparent;
	transition: all 0.5s ease-out;
}

	a:hover {
		color: #0056b3;
		text-decoration: underline;
	}

	a:not([href]):not([tabindex]) {
		color: inherit;
		text-decoration: none;
	}

		a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
			color: inherit;
			text-decoration: none;
		}

		a:not([href]):not([tabindex]):focus {
			outline: 0;
		}

pre,
code,
kbd,
samp {
	font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 1em;
}

pre {
	margin-top: 0;
	margin-bottom: 1rem;
	overflow: auto;
}

figure {
	margin: 0 0 1rem;
}

img {
	vertical-align: middle;
	border-style: none;
}

svg {
	overflow: hidden;
	vertical-align: middle;
}

table {
	border-collapse: collapse;
}

caption {
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
	color: #6c757d;
	text-align: left;
	caption-side: bottom;
}

th {
	text-align: inherit;
}

label {
	display: block;
	margin-bottom: 0;
}

button {
	border-radius: 0;
}

	button:focus {
		outline: 1px dotted;
		outline: 5px auto -webkit-focus-ring-color;
	}

input,
button,
select,
optgroup,
textarea {
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	height: 40px;
	min-width: initial;
	border: 1px solid #ccc;
	vertical-align: top;
	padding: 5px;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

select {
	word-wrap: normal;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

	button:not(:disabled),
	[type="button"]:not(:disabled),
	[type="reset"]:not(:disabled),
	[type="submit"]:not(:disabled) {
		cursor: pointer;
	}

	button::-moz-focus-inner,
	[type="button"]::-moz-focus-inner,
	[type="reset"]::-moz-focus-inner,
	[type="submit"]::-moz-focus-inner {
		padding: 0;
		border-style: none;
	}

input[type="radio"],
input[type="checkbox"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
	-webkit-appearance: listbox;
}

textarea {
	overflow: auto;
	resize: vertical;
	/*! padding: 15px; */
}

fieldset {
	min-width: 0;
	padding: 0;
	margin: 0;
	border: 0;
}

legend {
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0;
	margin-bottom: .5rem;
	font-size: 20px;
	line-height: inherit;
	color: inherit;
	white-space: normal;
	font-weight: 500;
}

progress {
	vertical-align: baseline;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

[type="search"] {
	outline-offset: -2px;
	-webkit-appearance: none;
}

	[type="search"]::-webkit-search-decoration {
		-webkit-appearance: none;
	}

::-webkit-file-upload-button {
	font: inherit;
	-webkit-appearance: button;
}

output {
	display: inline-block;
}

summary {
	display: list-item;
	cursor: pointer;
}

template {
	display: none;
}

[hidden] {
	display: none !important;
}

/* Font Lato internal */

/* latin-ext */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 300;
	src: local('Lato Light'), local('Lato-Light'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/IY9HZVvI1cMoAHxvl0w9LVKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 300;
	src: local('Lato Light'), local('Lato-Light'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/22JRxvfANxSmnAhzbFH8PgLUuEpTyoUstqEm5AMlJo4.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin-ext */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 400;
	src: local('Lato Regular'), local('Lato-Regular'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/8qcEw_nrk_5HEcCpYdJu8BTbgVql8nDJpwnrE27mub0.woff2) format('woff2');
	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 400;
	src: local('Lato Regular'), local('Lato-Regular'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/MDadn8DQ_3oT6kvnUq_2r_esZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin-ext */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 700;
	src: local('Lato Bold'), local('Lato-Bold'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/rZPI2gHXi8zxUjnybc2ZQFKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 700;
	src: local('Lato Bold'), local('Lato-Bold'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/MgNNr5y1C_tIEuLEmicLmwLUuEpTyoUstqEm5AMlJo4.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin-ext */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 900;
	src: local('Lato Black'), local('Lato-Black'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/t85RP2zhSdDjt5PhsT_SnlKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Lato';
	font-style: normal;
	font-weight: 900;
	src: local('Lato Black'), local('Lato-Black'), url(//media.travsrv.com/appSkins/64/v6/themes/global/skins/brownstone/fonts/Lato/lEjOv129Q3iN1tuqWOeRBgLUuEpTyoUstqEm5AMlJo4.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

body {
	font-family: 'Lato', sans-serif;
	background-color: #333;
	font-size: 16px;
	color: #333;
	/*! position: relative; */
	width: 100%;
	height: 100%;
	overflow: hidden;
}

input[type=submit], button[type=submit] {
	background-color: #0072ce;
	color: white;
	border: none;
	padding: 0px 25px;
}

br {
	display: none;
}

.ajaxStatus {
	display: none !important;
}

/* Login */

.home.index {
	height: initial;
	overflow: unset;
	background-color: white;
}

	.home.index input, .home.index button {
		width: 100%;
		height: 50px;
	}

	.home.index #header {
		display: none;
	}

	.home.index .logOnOff {
		display: none;
	}

	.home.index #main {
		max-width: 460px;
		margin: 5% auto 0;
		position: static;
		padding: 30px;
		background-color: white;
		/*! border: 1px solid #ddd; */
		border-radius: 5px;
		box-shadow: 0 0 4px rgba(0,0,0,.19);
	}

	.home.index .mainContent {
		background-color: transparent;
		border: none;
		padding: 0;
		margin: 0;
	}

	.home.index .MainHeader {
		float: none;
		margin: 0 0 15px;
	}

		.home.index .MainHeader a {
			margin: 0 auto;
			border-right: none;
			width: 100px;
			height: 100px;
		}

	.home.index .mainContent legend {
		width: 100%;
		text-align: center;
	}

	.home.index .mainContent form label, .home.index .mainContent form legend {
		border-top: none;
		margin: 0;
		padding: 0;
	}

	.home.index .mainContent label {
		width: 100%;
		text-align: left;
		font-size: 16px
	}

	.home.index .mainContent label, .home.index .mainContent legend {
		color: #333;
	}

		.home.index .mainContent label.inline {
			width: initial;
			display: inline;
			padding: 0;
		}

	.home.index #forgotPassword {
		float: right;
		/*! color: white; */
		text-decoration: underline;
		margin: 16px 0 0;
	}

	.home.index input[type="radio"], .home.index input[type="checkbox"] {
		max-width: 20px;
		height: initial;
		height: 20px;
		margin: 4px 0 0;
	}

	.home.index input[type="submit"] {
		/*! background-color: #fff; */
		/*! color: #0072ce; */
		/*! border: none; */
	}

	.home.index #footer {
		max-width: 400px;
	}

/* notifications */

.flashMessage, .flashError {
	position: absolute;
	z-index: 9;
	background-color: lightyellow;
	width: 100%;
	text-align: center;
	box-shadow: 0 0 35px #333;
	padding: 15px;
	top: 0;
}

.flashError {
	color: white;
	background-color: red;
}

	.flashMessage .close, .flashError .close {
		position: absolute;
		right: 15px;
		top: 15px;
		color: red;
		font-weight: 700;
	}

	.flashError .close {
		color: white;
	}

.ui-dialog {
	position: fixed !important;
	background-color: rgba(0,0,0,.8);
	width: 100% !important;
	height: 100% !important;
	left: 0 !important;
	top: 0 !important;
}

	.ui-dialog div {
		max-width: 600px;
		background-color: white;
		padding: 10px 20px 50px;
		margin: 0 auto;
		text-align: center;
		font-size: 20px;
		height: initial !important;
	}

		.ui-dialog div:first-child {
			margin: 10% auto 0;
			padding: 50px 20px 0;
			font-weight: 700;
		}

	.ui-dialog .ui-dialog-titlebar-close {
		float: right;
		margin: -40px 0 0;
		color: red;
		text-decoration: none;
		font-weight: 300;
		font-size: 22px;
	}

.skin-selector {
	display: inline;
	position: relative;
}

/* Header */

#header {
	background-color: #0072ce;
	width: 100%;
	height: 101px;
	top: 0;
	z-index: 1;
}

.skins.edit #header {
	position: fixed;
}

.MainHeader a {
	background-image: url("//media.travsrv.com/appSkins/23833/v6/themes/standard/images/ARN-logo-social-media.jpg");
	display: block;
	width: 100px;
	height: 100px;
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: center 0px;
	background-color: white;
}

.skin-name {
	color: white;
	position: relative;
	display: inline;
	top: 40px;
}

a.compare-link {
	color: white;
	position: relative;
	top: 38px;
	padding-left: 10px;
}

.MainHeader {
	float: left;
}

.logOnOff {
	float: right;
	margin: 20px 15px 0;
	color: white;
}

.logOnOff a {
	color: white;
	text-decoration: underline;
}

body.impersonate .logOnOff {
    position: absolute;
    top: 5px;
    right: 0;
}

body.impersonate .logOnOff div, body.impersonating .logOnOff div {
    text-align: right;
}

body.impersonating .logOnOff {
    position: relative;
    top: -15px;
}

body.impersonate .logOnOff div span, body.impersonating .logOnOff div span {
    position: relative;
    top: 6px;
}

/* Main Content Area */

#main {
	margin: 0 auto;
	xposition: relative;
	width: 100%;
	top: 101px;
	height: 100%;
}

/* Navigation */

.navigation {
	display: block;
	width: 100%;
	background-color: #505050;
	color: white;
	vertical-align: top;
	height: 145px;
	height: 90px;
	padding: 20px 15px;
	border-bottom: 1px solid rgba(0,0,0,.05);
	border-radius: 0;
	margin: 0 auto 0;
	position: fixed;
	top: 101px;
	z-index: 1;
}

.skins.edit .navigation {
	width: 85%;
}

.navigation legend {
	float: none;
}

.navigation .accountDetails {
	xfloat: left;
	width: 100%;
}

.navigation form span:first-child {
	float: left;
	margin: 15px 0 0;
}

.chosen-container.chosen-container-single {
	height: 50px !important;
	max-width: 587px;
	width: 450px !important;
	margin: 12.8px 5px;
}

.chosen-container-single .chosen-single {
	height: 50px !important;
}

.chosen-container-single .chosen-drop {
	width: 98% !important;
	margin-top: -1px;
	margin: 0;
	padding: 0;
	font-size: 16px;
}

.chosen-container-single .chosen-search input[type="text"] {
	padding: 10px 20px 10px 5px !important;
}

.chosen-single span {
	margin: 12px !important;
	color: black;
	font-size: 16px;
}

.navigation .siteName {
	margin: 10px 0 0 0;
	xfloat: right;
}

.accountDetails fieldset div.chosen-search {
	width: 100%;
}

.accountDetails fieldset div {
	display: inline-block;
	xmargin: 0 0 0 10px;
}

	.accountDetails fieldset div.siteName {
		display: block;
		margin: 0;
	}

.navigation .accountTools {
	float: right;
	width: initial;
	xoutline: 1px solid red;
	margin: 38px 0 0;
}

	.navigation .accountTools a {
		margin: 0 0 0 10px;
		color: white;
	}

/* Fix the customer view navigation at smaller views */

.accountDetails div {
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 0 0 0 10px;
}

	.accountDetails div select {
		max-width: 400px;
		height: 35px;
		vertical-align: center;
	}

x.accountDetails div:last-child {
	display: block;
	border: none;
	margin: 0;
	padding: 0;
}

@media only screen and (max-width: 800px) {
	.accountDetails div {
		display: block !important;
		margin: 10px 0 0 0 !important;
		padding: 0 0 0 0 !important;
	}

		.accountDetails div select {
			max-width: initial;
			max-width: auto;
			height: initial;
			height: auto;
			vertical-align: unset;
		}
}

/* Main Content */

#theSkinEditor {
	padding: 40px;
	width: 85%;
	background-color: white;
	position: fixed;
	overflow-y: scroll;
	left: 0;
	top: 192px;
	bottom: 0;
}

#theSkinEditorHeader {
	border-bottom: 1px solid #ddd;
	margin: 0 0 35px;
}

	#theSkinEditorHeader ul {
		padding: 0;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
	}

		#theSkinEditorHeader ul li {
			list-style: none;
			padding: 15px 15px;
			position: relative;
			top: 3px;
		}

			#theSkinEditorHeader ul li.selected {
				border-bottom: 5px solid #0072ce;
			}

			#theSkinEditorHeader ul li a {
				color: inherit;
				text-decoration: none;
				font-weight: 700;
			}

#theSkinEditor fieldset label:first-child {
	margin: 0 0 6px;
	padding: 0;
	border: none;
	line-height: 1em;
}

#theThemeInfo form {
	display: inline-block;
	width: initial;
	xoutline: 1px solid red;
	vertical-align: top;
	margin: 0 0 10px 0;
}

#publishSiteButton {
	margin: 0 0 0 auto;
	background-color: darkorange;
	min-width: 200px;
	font-size: 20px;
	height: initial;
	padding: 15px;
	cursor: pointer;
	display: block;
	width: 200px;
	position: absolute;
	right: 30px;
	top: 70px;
}

.mainContent {
	display: block;
	background-color: #fff;
	padding: 40px;
	margin: 0;
	width: 100%;
	max-width: 100%;
	margin: 23px auto 0;
	border-radius: 0;
	height: 100%;
}

.skins.edit .mainContent {
	padding: 0;
	margin: 0 auto 0;
}

.mainContent label, .mainContent legend {
	xfont-size: 20px;
	font-weight: 500;
	color: #333;
	display: block;
	float: none;
	width: 100%;
	line-height: 1.7em;
	font-size: 16.5px;
}

.mainContent form label, .mainContent form legend {
	border-top: 1px solid #ddd;
	margin: 40px 0 0;
	padding: 25px 0 0;
}

#theEditorForm {
	height: initial !important;
	height: auto !important;
}

#theSkinEditor fieldset:first-child select {
	display: block;
}

.currentFile {
	color: red;
	display: initial;
}

.resizable-textarea {
	margin: 15px 0 0;
}

textarea {
	background-color: #f7f9fa;
	width: 100% !important;
	height: 500px;
	font-family: serif;
	font-size: 1.2em;
	line-height: 1.4em;
	padding: 15px;
	border: 10px solid #ccc;
}

.image-preview {
	background-color: #f7f9fa;
	width: 100% !important;
	height: 500px;
	font-family: serif;
	font-size: 1.2em;
	line-height: 1.4em;
	padding: 50px 15px 15px;
	border: 10px solid #ccc;
	position: relative;
	margin: 15px 0 0;
}

	.image-preview legend {
		position: absolute;
		top: 10px;
	}

	.image-preview .currentFile {
		display: block;
	}

	.image-preview img {
		max-width: 100%;
	}

/* Tabs */


.rightControl #theSkinEditor {
	position: static;
	padding: 0;
	width: initial;
	background-color: transparent;
	overflow: auto;
}

#themeImages {
	top: 285px !important;
	border-top: 4px solid #e2e2e2 !important;
}

	#themeFiles legend, #themeImages legend {
		background: transparent;
		float: left;
	}

.handle, .handle2 {
	background-image: url("//media.travsrv.com/appSkins/23833/v6/themes/standard/images/files.png?v=2") !important;
	background-color: #0072ce !important;
	height: 80px !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 22px !important;
	top: -5px !important;
	cursor: pointer;
	border-radius: 15px 0px 0px 0px;
	display: none !important;
}

.handle2 {
	background-image: url("//media.travsrv.com/appSkins/23833/v6/themes/standard/images/images.png") !important;
}

.fileList br {
	display: block;
}

.deleteIcon {
	width: 15px;
}

.imageFile span {
	position: absolute;
	background-color: #FFFFE0;
	padding: 5px;
	left: -1000px;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
}

#themeFiles input[type=submit], #themeImages input[type=submit] {
	margin: 10px 0 20px;
	display: block;
}

#themeFiles input[type=file], #themeImages input[type=file] {
	margin: 0;
	padding: 0;
	border: none;
	background-color: #f5f5f5;
	width: 100%;
}

#themeFiles #newFileName {
	width: 100%;
}

#saveFile {
	display: block !important;
	margin: 15px 0 15px auto;
}

#RightOuter {
	position: absolute;
	width: 15%;
	top: 0px;
	bottom: 0;
	right: 0;
	height: 100%;
}

@media only screen and (max-height: 1100px) {
	#RightOuter {
		xheight: 91%;
	}
}

@media only screen and (max-height: 900px) {
	#RightOuter {
		xheight: 89%;
	}
}

@media only screen and (max-height: 800px) {
	#RightOuter {
		height: 100%;
		padding: 200px 0 20px;
	}
}

#RightOuter > * {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0px;
	padding: 100px 0 0;
}

.rightInner {
	border-left: 5px solid #e2e2e2;
}

.rightControl {
	overflow: scroll;
	background-color: #eee;
	padding: 0;
	height: 100%;
}

#themeFiles, #themeImages {
	position: static !important;
	display: block !important;
	padding: 20px;
	height: 100% !important;
	right: 0 !important;
	line-height: 1.4em !important;
	xborder-top: 15px solid #eee;
	border-bottom: 15px solid #eee;
}

	#themeFiles .folder .file:last-child {
		margin: 0 0 15px 0;
	}

#theBulkDeleteForm div {
	position: relative;
	height: 15px;
}

#theBulkDeleteForm button[type="submit"] {
	position: absolute;
	top: -11px;
}

button[type="submit"].bulk-delete {
	visibility: visible;
	color: red;
	background-color: transparent;
	padding: 0;
	height: initial;
	text-decoration: underline;
	margin: 0 0 15px 0;
}

	button[type="submit"].bulk-delete:hover {
		color: maroon;
	}

@media only screen and (max-width: 1360px) {
	.navigation .siteName {
		margin: 10px 0 0 0;
		float: none;
	}

	.navigation {
		height: 150px;
	}

	#theSkinEditor {
		top: 248px;
	}
}

@media only screen and (max-width: 1700px) {
	#theSkinEditor, .skins.edit .navigation {
		width: 75%;
	}

	#RightOuter {
		width: 25%;
	}
}

@media only screen and (max-width: 1400px) {
	#theSkinEditor, .skins.edit .navigation {
		width: 75%;
	}

	#RightOuter {
		width: 25%;
	}
}

@media only screen and (max-width: 1000px) {
	.navigation {
		height: 170px;
	}

		.navigation .accountDetails {
			float: none;
		}

		.navigation .accountTools {
			float: none;
			margin: 0;
			display: block;
			text-align: center;
		}

			.navigation .accountTools a {
				margin: 0;
			}

	#theSkinEditor {
		top: 271px;
	}

	#publishSiteButton {
		top: 30px;
	}
}

@media only screen and (max-width: 800px) {
	html, body {
		overflow: unset;
	}

	.skins.edit #header {
		position: static;
	}

	#header, .navigation {
		position: static;
	}

	#theSkinEditor, .skins.edit .navigation {
		width: 100%;
	}

	.navigation {
		height: initial;
	}

		.navigation input, .navigation button, .navigation select {
			width: 100%;
		}

		.navigation .accountDetails {
			float: none;
		}

		.navigation .siteName {
			margin: 10px 0 0 0;
			float: none;
			text-align: center;
		}

	#main {
		position: static;
	}

	#publishSiteButton {
		right: 20px;
		top: 46px;
	}

	#theSkinEditor {
		padding: 20px;
		width: 100%;
		position: relative;
		overflow-y: scroll;
		top: 0;
	}

	#RightOuter {
		position: static;
		width: 100%;
	}

		#RightOuter > * {
			position: static;
		}
}

@media only screen and (max-width: 420px) {
	.logOnOff {
		float: none;
		margin: 0;
		text-align: right;
	}

	#publishSiteButton {
		position: static;
	}
}

/* Skin Log */

#skinLog {
	background-color: #eee;
	margin: 15px 0 0;
	font-size: 15px;
}

	#skinLog label {
		font-size: 15px;
		background-color: #e5e5e5;
		padding: 10px !important;
		border: 2px solid white !important;
		margin: 0 !important;
		border-bottom: none !important;
		font-weight: 900;
	}

	#skinLog table {
		width: 100%;
	}

		#skinLog table tr {
			xbackground-color: #eee;
		}

		#skinLog table th,
		#skinLog table td {
			padding: 10px;
			border: 2px solid white;
		}

/* Footer */

#footer {
	text-align: center;
	margin: 25px auto 0;
	font-size: 14px;
}

.footerLegal p:last-child {
	display: none;
}




.text-editor {
	height: 500px;
}



#theModalOverlay {
	display: none;
	height: 100%;
	width: 100%;
	z-index: 400;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
}



#theModalContent {
	z-index: 550;
	background-color: white;
	position: absolute;
	top: 20%;
	left: 50%;
	margin: 0 0 0 -250px;
	padding: 25px;
}

	#theModalContent form {
		display: flex;
		flex-wrap: wrap;
	}

	#theModalContent label {
		width: 100%;
	}

	#theModalContent input[type='text'] {
		width: 100%;
		margin: 10px 0;
	}

	#theModalContent input[type='submit'] {
		width: 50%;
		margin: 0 5px 0 0;
	}



.flashError, .flashMessage {
	z-index: 600;
}



.publish-confirmation textarea {
	height: 200px;
}



.publish-log .created-on {
	white-space: nowrap;
}



.infoIcon {
	height: 16px;
	width: 16px;
}

.arnConfigKey {
	font-weight: bold;
}

.arnConfigValues > * {
	margin-right: 10px;
}

.arnConfigValues {
	display: flex;
	flex-direction: row;
	padding-left: 10px;
	margin-right: -10px;
}

.arnConfigName {
	font-weight: bold;
}

div.ui-tooltip {
	max-width: 600px;
	background-color: #ffeeca;
}

.arnConfigText {
	padding-left: 10px;
}

.file input[type='checkbox'] {
	position: relative;
	top: -6px;
}

.compareskins #header {
	display: none;
}

x.compareskins .mainContent {
	margin: 0;
}

.skin-compare {
	height: 50%;
	overflow: scroll;
	margin-bottom: 10px;
	border: 1px solid black;
}

.file-compare {
	height: 50%;
	overflow: scroll;
	position: relative;
	xborder: 1px solid black;
	border: 1px solid #bebebe;
}


	.file-compare .content {
		font-family: monospace;
		padding: 0 10px;
		background-color: #FFF5EE;
		min-height: 400px;
		margin-bottom: 60px;
	}

x.file-compare .content del {
	width: 50%;
}

x.file-compare .content ins {
	width: 50%;
}


.file-compare br {
	display: inline;
}

tr.same {
	background-color: lightgreen;
}


tr.different, tr.leftmissing, tr.rightmissing {
	background-color: lightcoral;
}


table.files {
	width: 100%;
}

	table.files thead {
		xposition: sticky;
		xtop: 0;
	}


	table.files td, table.files th {
		width: 50%;
	}


	table.files a {
		display: block;
		width: 100%;
		color: black;
	}

.skin-id {
	padding: 0 10px;
}

.skin-compare .header span, .skin-compare .header label {
	display: inline;
	background-color: #444;
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
	font-family: sans-serif;
	font-weight: 600;
	letter-spacing: .5px;
}

.skin-compare .header {
	position: sticky;
	top: 0;
	background-color: #F5F6F6;
	padding: 0 10px;
}

.file-compare .title {
	position: sticky;
	top: 0;
	xbackground-color: #FAF9F6;
	border-bottom: 1px solid black;
	padding: 12px;
	text-align: center;
	box-shadow: 0 -6px 10px 5px rgb(0 0 0 / 30%);
	-webkit-background-clip: text;
	-moz-background-clip: text;
	xbackground-clip: text;
	color: #666;
	font-family: sans-serif;
	font-weight: 600;
	letter-spacing: .5px;
	width: 100%;
	xheight: 50px;
	margin: auto;
	background: #f4f4f4;
}

table.files td {
	padding: 0 10px;
}

.compareskins {
	background-color: red;
}

	/***** ************************ ******/
	/***** New skin Editor updates ******/
	/***** ************************ ******/

	.compareskins .skin-compare .header {
		background-color: #FAF9F6;
	}

	.compareskins input[type="checkbox"] {
		box-sizing: border-box;
		margin: -5px 40px 0 0px;
	}

.mainContent form label {
	border-top: none;
}

.compareskins .header input {
	min-width: 18px;
}

/*updated without js*/
.compareskins .skin-compare .header {
	text-align: center;
	padding: 20px 0px;
	xborder-bottom: 1px solid #d6d6d6;
	position: fixed;
	top: 0;
	width: 100%;
	max-width: 100%;
	box-shadow: 0 -6px 10px 5px rgb(0 0 0 / 30%);
}

.compareskins .mainContent {
	display: block;
	xbackground-color: #fff;
	background-color: #F6F7FA;
	padding: 40px 0;
}

.compareskins .skin-compare {
	margin-top: 60px;
}

x.compareskins .content {
	position: absolute;
	top: 80px;
	margin: auto 0;
	width: 100%;
}

.compareskins .skin-compare {
	height: 50%;
	overflow-y: scroll;
	overflow-x: hidden;
	xborder: 1px solid black;
	margin: 92px auto 0;
	border: 1px solid #bebebe;
}

.compareskins table.files {
	width: 100%;
	xposition: fixed;
	xdisplay: flex;
	xjustify-content: center;
	xmargin-top: 0;
	xalign-items: center;
	background-color: #dcdcdc;
	height: 60px;
	box-shadow: 0px 14px 5px -15px #333;
}

.compareskins span.label {
	background-color: #333;
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: rgb(255 255 255 / 50%) 0px 3px 3px;
	font-family: sans-serif;
	font-weight: 600;
}

.compareskins .mainContent {
	margin: 10px 0;
}

.compareskins .chosen-container-single .chosen-single {
	outline: 0;
	border: 0;
	cursor: pointer;
	font-weight: 600;
	color: rgb(72, 76, 122);
	font-size: 14px;
	xbackground-image: linear-gradient(180deg,#fff,#f5f5fa);
	box-shadow: 0 4px 11px 0 rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 20%);
	background: linear-gradient(#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);
	transition: all .2s ease-out;
}

.compareskins .chosen-container-single .chosen-drop {
	width: 100% !important;
}

.compareskins .chosen-single span {
	color: #444;
}

.compareskins table.files td {
	padding: 0 10px;
}

.compareskins .chosen-container-single .chosen-single:hover {
	background: linear-gradient(to bottom, #eee 5%, #fff 100%);
	background-color: #e9e9e9;
}

.compareskins.role-system table.files thead {
    top: 90px;
}

/*new updates march 1 2023*/
table.files thead {
	position: fixed;
	top: 71px;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
}

/*for images compare side by side.*/

.file-compare div.left, 
.file-compare div.right {
	background-color: #eee;
	border: 1px solid #ccc;	
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
    -webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	padding: 10px;
	margin: 10px;
    text-align: center;
	width:100%;
	align-self: flex-start;
	min-height: 100px;
}

.file-compare div.left img, 
.file-compare div.right img {
	max-width: 100%;
}

.file-compare .compare-item-wrapper  {	
	display: -webkit-box;
	display: -moz-box;
    display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-webkit-box-orient: horizontal; 
	-moz-box-orient: horizontal;
	 box-orient: horizontal;
	 flex-direction: row;
	 
	 -webkit-box-pack: center;
	 -moz-box-pack: center;
	  box-pack: center;
	 justify-content: center;

	 -webkit-box-align: center;
	  -moz-box-align: center;
	  box-align: center;  
	  align-items: center;
}

@media only screen and (max-width: 1000px) {
	.chosen-container.chosen-container-single {
		width: 340px !important;
	}
	.file-compare .compare-item-wrapper {
		flex-wrap:wrap;
	}
}