
		body {
			--menu_height: 40px;
			width: 99%;
			/*height: 100vh !important;
			overflow: hidden;*/
		}

		.main-container {
			position: relative;
			left: 0;
			top: 0;
			width: 100%;
		}

		.scroll-wrap {
			padding-bottom: 30px;
		}

		.dropdown-menu.open {
			left: -70px;
		}

		[id='panel-roles'], [id='panel-payment-groups'] {
			all: inherit;
		}
		
		.payment-group-selected {
			border: 3px solid #ff0000;
			border-radius: 8px;
			padding: 10px 10px 10px 0;
		}

		.panel-profile {
			border: 1px solid #ccc;
			border-radius: 8px;
			margin-bottom: 10px;
		}

		.choice-item-accordion {
			cursor: pointer;
			display: grid;
			grid-template-columns: 1fr 32px;
			align-items: center;
			padding: 5px 10px;
			border-bottom: 1px solid #dfdfdf;
		}

		.choice-item-collapse {
			height: 50px;
			line-height: 50px;
			padding-left: 30px;
			cursor: pointer;
			border-bottom: 1px solid #dfdfdf;
			font-style: italic;
			background-color: #f7f7f7;
			margin-bottom: 5px;
		}

		.choice-item-row {
			display: grid;
			grid-template-columns: 1fr 32px;
			height: 50px;
			border-bottom: 1px solid #dfdfdf;
			line-height: var(--menu_height);
			padding: 5px 10px;
			grid-gap: 5px;
			margin-bottom: 5px;
			cursor: pointer;
		}

		.choice-item-icon {
			line-height: var(--menu_height);
			text-align: end;
			font-size: 2em;
			color: red;
			-webkit-transition: color 1s ease-out;
		}

		.video-guide-wrap {
			width: 80%;
		}

		.choice-items-wrapper {
			width: 100%;
			overflow: hidden;
			position: relative;
			min-height: 100vh;
			margin-top: 0;
		}

		.choice-items-wrap {
			background: #fff;
			position: relative;
			z-index: 99;
			min-height: 100vh;
		}

		.slide-in {
			animation: slide-in 0.5s forwards;
			-webkit-animation: slide-in 0.5s forwards;
		}

		.slide-out {
			animation: slide-out 0.5s forwards;
			-webkit-animation: slide-out 0.5s forwards;
		}

		.slide-out .choice-item-icon {
			color: #e1e1e1;
		}

		.slide-out .selected .choice-item-icon {
			color: #ff0000;
		}

		@keyframes slide-in {
			0% { transform: translateX(-87%); }
			100% { transform: translateX(0%); }
		}

		@-webkit-keyframes slide-in {
			0% { transform: translateX(-87%); }
			100% { -webkit-transform: translateX(0%); }
		}

		@keyframes slide-out {
			0% { transform: translateX(0%); }
			100% { transform: translateX(-87%); }
		}

		@-webkit-keyframes slide-out {
			0% { -webkit-transform: translateX(0%); }
			100% { -webkit-transform: translateX(-87%); }
		}

		.rotating {
			animation: rotation 2s infinite linear;
		}

		@-webkit-keyframes rotation {
			from { transform: rotate(0deg); }
			to { transform: rotate(359deg); }
		}

		.sections {
			transform: translateX(-105%);
			/*background: #000000c4;
			color: #fff;*/
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: 0;
			padding: 10px 10px 10px 55px;
			background: #f8f8f8;
		}

		.section-view {
			animation: section-view 0.5s forwards;
			-webkit-animation: section-view 1.5s forwards;
		}

		.section-hide {
			animation: section-hide 0.5s forwards;
			-webkit-animation: section-hide 1.5s forwards;
		}

		.section-hide .choice-item-icon {
			color: #0000001f;
		}

		@keyframes section-view {
			0% { transform: translateX(-105%); }
			100% { transform: translateX(0%); }
		}

		@-webkit-keyframes section-view {
			0% { transform: translateX(-105%); }
			100% { -webkit-transform: translateX(0%); }
		}

		@keyframes section-hide {
			0% { transform: translateX(0%); }
			100% { transform: translateX(-105%); }
		}

		@-webkit-keyframes section-hide {
			0% { -webkit-transform: translateX(0%); }
			100% { -webkit-transform: translateX(-105%); }
		}

		.scroll-base {
			left: 55px;
			width: calc(100% - 60px);
		}

		.data-style {
			display: grid;
			grid-template-columns: 1fr;
			grid-column-gap: 5px;
			grid-template-areas:
				"title icon"
				"value icon";
			align-items: center;
			/*line-height: 35px;*/
			margin-bottom: 10px;
		}


		.data-style-title {
			grid-area: title;
			font-size: 0.8em;
			color: #ccc;
			letter-spacing: 2px;
			white-space: nowrap;
		}

		.data-style-value {
			font-size: 1.3em;
			white-space: nowrap;
		}

		.data-style-missing {
			font-size: 1.3em;
			color: #ff0000;
		}

		.data-style-edit {
			font-size: 1.3em;
			color: #ccc;
			/*margin-left: 15px;*/
			cursor: pointer;
		}

		.data-style-edit-link {
			font-size: 1.3em;
			color: #ccc;
			cursor: pointer;
			text-align: center;
		}

		.close-data, .close-info {
			position: fixed;
			right: 20px;
			top: 105px;
			font-size: 2.5em;
			cursor: pointer;
			z-index: 99999;
			color: #000;
			text-shadow: 1px 1px 0 #ccc;
		}

		.table-separate {
			grid-column: 1 / -1;
			height: 2px;
			border-bottom: 1px solid #ddd;
			width: 100%;
		}

		.phones-table {
			display: grid;
			grid-template-columns: 1fr 80px 35px;
			justify-items: start;
			align-items: center;
			grid-row-gap: 5px;
		}

		.phones-table-title {
			background: #d1d1d1;
			color: #fff;
			justify-self: stretch;
			padding: 2px 5px;
			font-size: .8em;
		}

		.address-table {
			display: grid;
			grid-template-columns: 24px 1fr 24px;
			grid-column-gap: 5px;
			border-bottom: #ddd solid 1px;
			margin-bottom: 10px;
			padding-bottom: 5px;
		}

		.address-table-mark {
			align-self: center;
			color: #ccc;
		}

		.address-table-content {
			align-self: center;
		}

		.address-table-icon {
			grid-column-start: 3;
			grid-column-end: 4;
			grid-row-start: 1;
			grid-row-end: 4;
			align-self: center;
		}

		.address-table-zip-city {
			display: grid;
			grid-template-columns: 1fr;
			grid-gap: 5px;
		}

		.phones-table-code-phone {
			display: grid;
			grid-template-columns: 1fr;
			grid-gap: 5px;
			align-items: center;
		}

		.phones-table-btn {
			justify-self: center;
			grid-column-start: 1;
			grid-column-end: 2;
		}

		.emails-table {
			display: grid;
			grid-template-columns: 1fr 35px;
			grid-row-gap: 5px;
			border-bottom: #ddd solid 1px;
			margin-bottom: 10px;
			padding-bottom: 5px;
			align-items: center;
		}

		.emails-table-type {
			font-size: .8em;
			color: #878787;
		}

		.emails-table-type-second {
			font-size: .8em;
			color: #878787;
			grid-row-start: 2;
		}

		.emails-table-title-action {
			padding: 0;
			grid-column-start: 2;
			grid-column-end: 3;
			grid-row-start: 1;
			grid-row-end: 2;
			background: #d1d1d1;
			color: #fff;
			font-size: .8em;
			padding: 2px 5px;
			justify-self: stretch;
		}

		.emails-table-title-type {
			display: none;
		}

		.emails-table-title-title {
			background: #d1d1d1;
			color: #fff;
			justify-self: stretch;
			padding: 2px 5px;
			font-size: .8em;
		}

		.emails-table-icon {
			grid-column-start: 2;
			grid-column-end: 3;
			grid-row-start: 2;
			grid-row-end: 4;
			align-self: center;
			justify-self: center;
		}

		.emails-table-icon-second {
			grid-column-start: 2;
			grid-column-end: 3;
			grid-row-start: 1;
			grid-row-end: 3;
			align-self: center;
			justify-self: center;
		}

		.columns {
			display: grid;
			grid-template-columns: 1fr 1fr;
			align-items: end;
		}

		.columns-two {
			display: grid;
			grid-template-columns: 1fr;
			align-items: end;
		}

		.role-box {
			border: 3px solid #ccc;
			margin: 0 15px 15px 0;
			padding: 10px;
			max-width: 100%;
		}

		.role-subroles-grid {
			display: grid;
			grid-template-columns: 1fr;
		}

		.role-missing-sexual {
			display: grid;
			grid-template-columns: 1fr 25px;
			grid-template-areas: 
				"group icon"
				"service icon"
				"mark mark_icon"
			;
			align-items: center;
		}

		.role-missing-data-where {
			display: grid;
			grid-template-columns: 200px 1fr 25px;
			align-items: center;
			grid-auto-rows: 35px;
		}

		@media screen and (min-width: 769px) {
			.role-missing-data-where :nth-child(6n-8), .role-missing-data-where :nth-child(6n-7), .role-missing-data-where :nth-child(6n-6) {
				background: #f1f1f1;
				padding: 10px 0 10px 3px !important;
				margin-left: 0 !important;
				height: 36px;
			}
		}

		@media screen and (max-width: 768px) {
		    .role-missing-data-where {
		        grid-template-columns: 1fr 25px;
		    }

		    .role-missing-data-where > :nth-child(3n+1) {
				grid-column: 1 / -1;
		    }

			.role-missing-data-where :nth-child(6n+4), .role-missing-data-where :nth-child(6n+5), .role-missing-data-where :nth-child(6n+6) {
				background: #f1f1f1;
				padding: 10px 0 10px 3px !important;
				margin-left: 0 !important;
			}
		}

		.role-subtext-key {
			font-size: .8em;
			padding: 2px 3px 2px 0;
			margin-left: 3px;
		}

		.role-subtext-wrapper {
			font-size: .8em;
			padding: 2px 3px 2px 0;
			margin-left: 3px;
			display: flex;
			align-items: center;
			height: 36px;
		}

		.role-subtext-page {
			border-radius: 2px;
			padding: 2px 3px;
			color: #fff;
		}

		.role-subtext-page-wrapper {
			border-radius: 2px;
			padding: 2px 3px;
			color: #fff;
			display: flex;
			align-items: center;
		}

		.role-missing-data {
			display: grid;
			grid-template-columns: 1fr 25px;
			align-items: center;
		}

		.role-missing-data div:nth-child(4n-5), .role-missing-data div:nth-child(4n-4) {
			background: #f1f1f1;
		}

		.available-roles-wrapper, .available-roles-wrapper-small {
			display: grid;
			grid-template-columns: 1fr 60px 1fr 60px;
			align-items: center;
			grid-auto-rows: 35px;
		}

		.available-roles-wrapper :nth-child(8n-11), .available-roles-wrapper :nth-child(8n-10), .available-roles-wrapper :nth-child(8n-9), .available-roles-wrapper :nth-child(8n-8) {
			background: #f1f1f1;
			padding: 10px 0 10px 3px !important;
			margin-left: 0 !important;
			height: 36px;
		}

		.available-roles-wrapper :nth-child(8n-10) {
			padding: 10px 3px 10px 3px !important;
		}


		.personal-driver-image {
			height: 290px;
			object-fit: cover;
			width: auto;
		}

		@media screen and (max-width: 768px) {
			.available-roles-wrapper {
				grid-template-columns: 1fr 60px;
			}

			.personal-driver-image {
				height: auto !important;
				width: 100%;
			}

		}

		.role-subtext-subrole {
			border: 1px solid;
			border-radius: 3px;
			padding: 2px 3px;
		}

		.role-missing-media-upload {
			display: grid;
			grid-template-columns: 40px 1fr 20px 20px 150px;
			grid-template-rows: 1fr;
			gap: 0;
			background: #ccc;
		}

		.role-missing-media-upload-cell {
			display: flex;
			align-items: flex-start;
			justify-content: flex-start;
			writing-mode: vertical-rl;
			transform: rotate(-180deg);
			color: white;
			font-size: .8em;
			margin: 5px 0;
		}

		.role-missing-media-content-upload {
			display: grid;
			grid-template-columns: 40px 1fr 20px 20px 150px;
			align-items: center;
			gap: 0;
		}

		.role-missing-media-content-upload .grid-cell:nth-child(10n-14),
		.role-missing-media-content-upload .grid-cell:nth-child(10n-13),
		.role-missing-media-content-upload .grid-cell:nth-child(10n-12),
		.role-missing-media-content-upload .grid-cell:nth-child(10n-11),
		.role-missing-media-content-upload .grid-cell:nth-child(10n-10) {
			background: #f1f1f1;
			padding: 10px 0;
		}

		.role-missing-media-content-upload .grid-cell {
			text-align: -webkit-left;
			font-size: .8em;
		}

		.roles-subroles-wrapper {
			display: flex;
			flex-wrap: wrap;
			grid-gap: 5px;
			align-items: center;
		}

		.role-missing-media {
			display: grid;
			grid-template-columns: 60px 1fr 55px 45px;
		}

		.role-missing-media div:nth-child(8n-11), .role-missing-media div:nth-child(8n-10), .role-missing-media div:nth-child(8n-9), .role-missing-media div:nth-child(8n-8) {
			background: #f1f1f1;
		}

		.role-required-media {
			display: grid;
			grid-template-columns: 1fr 75px 35px;
		}

		.role-required-media-title {
			font-size: .8em;
			color: #fff;
			background: #ccc;
			padding: 2px 3px;
			overflow: hidden;
		}

		.role-required-media div:nth-child(6n-8), .role-required-media div:nth-child(6n-7), .role-required-media div:nth-child(6n-6) {
			background: #f1f1f1;
		}

		.priorities-data-wrap {
			display: grid;
			grid-template-columns: 1fr;
			grid-column-gap: 5px;
			align-items: center;
		}

		.section-global {
			padding: 30px 5px 20px 5px;
		}

		.section-global [name^='checkbox-input-'] {
			max-height: 0;
		}

		.customer-media-wrap {
			display: grid;
			grid-template-columns: 70px 1fr;
			grid-template-areas: 
				"flag_title flag"
				"title_title title"
				"description_title description"
				"info_title info"
				"owntag_title owntag"
				"select_title select"
				"button_title button"
				"delete_info delete_info"
				"others others"
				"scroll scroll"
			;
			grid-gap: 5px;
			align-items: baseline;
			margin: 0 10px 10px;
			padding-bottom: 20px;
			border-bottom: 3px solid #ccc;
		}

		[data-section="photovideo"]:hover {
			color: #ff0000;
		}

		.media-wrap {
			display: grid;
			grid-template-columns: 70px 1fr;
			grid-template-areas: 
				"type_tag_title type_tag"
				"tag_title tag"
				"duration_title duration"
				"size_title size"
				"owntag_title owntag"
				"permission_title permission"
				"id_title id"
				"represents_title represents"
				"admin_title admin"
				"title_title title"
				"select select"
				"button button"
				"scroll scroll"
			;
			grid-column-gap: 5px;
			align-items: baseline;
			margin: 0 10px 10px;
		}

		.media-wrapper {
			display: grid;
			grid-template-columns: 1fr;
			grid-template-areas: 
				"image"
				"data"
			;
			grid-column-gap: 5px;
			margin: 0 10px 10px;
			min-height: 240px;
		}

		.media-wrap-value-row {
			border-bottom: 1px dashed #ccc;
			padding-bottom: 5px;
		}

		.media-wrap-title-row {
			font-size: .7em;
			color: #a1a1a1;
		}

		.thumbnail-accordion {
			display: flex;
			flex-wrap: wrap;
			padding: 0 20px;
			justify-content: flex-start;
		}

		.thumbnail-accordion-image {
			display: block;
			width: 22%;
			//height: auto;
			margin: 0 5px 5px 0;
			position: relative;
		}

		.thumbnail-accordion-dummy {
			margin-top: 100%;
		}

		@media screen and (min-width: 768px) {
			
			.video-guide-wrap {
				width: 80%;
			}

			.choice-items-wrapper {
				width: 80%;
			}

			@keyframes slide-in {
				0% { transform: translateX(-92%); }
				100% { transform: translateX(0%); }
			}

			@-webkit-keyframes slide-in {
				0% { transform: translateX(-92%); }
				100% { -webkit-transform: translateX(0%); }
			}

			@keyframes slide-out {
				0% { transform: translateX(0%); }
				100% { transform: translateX(-92%); }
			}

			@-webkit-keyframes slide-out {
				0% { -webkit-transform: translateX(0%); }
				100% { -webkit-transform: translateX(-92%); }
			}

			/*.data-style {
				grid-template-columns: 1fr 1fr;
				line-height: 35px;
			}*/

		}

		@media screen and (min-width: 992px) {
			
			.section-global {
				padding: 30px 5px 20px 20px;
			}

			.scroll-wrap {
				padding-right: 17px;
			}

			.video-guide-wrap {
				width: 50%;
			}

			.choice-items-wrapper {
				width: 50%;
			}

			@keyframes slide-in {
				0% { transform: translateX(-92%); }
				100% { transform: translateX(0%); }
			}

			@-webkit-keyframes slide-in {
				0% { transform: translateX(-92%); }
				100% { -webkit-transform: translateX(0%); }
			}

			@keyframes slide-out {
				0% { transform: translateX(0%); }
				100% { transform: translateX(-92%); }
			}

			@-webkit-keyframes slide-out {
				0% { -webkit-transform: translateX(0%); }
				100% { -webkit-transform: translateX(-92%); }
			}

			.emails-table {
				grid-template-columns: 1fr 190px 35px;
			}

			.emails-table-title-action {
				padding: 2px 5px;
				grid-column-start: 3;
				grid-column-end: 4;
				grid-row-start: 1;
				grid-row-end: 2;
			}

			.emails-table-title-type {
				display: block;
				grid-column-start: 2;
				grid-column-end: 3;
				grid-row-start: 1;
				grid-row-end: 2;
				background: #d1d1d1;
				color: #fff;
				font-size: .8em;
				padding: 2px 5px;
			}

			.emails-table-title-title {
				background: #d1d1d1;
				color: #fff;
				justify-self: stretch;
				padding: 2px 5px;
				font-size: .8em;
			}

			.emails-table-type {
				grid-column-start: 2;
				grid-column-end: 3;
				grid-row-start: 2;
				grid-row-end: 3;
				padding: 2px 5px;
			}

			.emails-table-icon {
				grid-column-start: 3;
				grid-column-end: 4;
				grid-row-start: 2;
				grid-row-end: 4;
				align-self: center;
				justify-self: center;
			}

			.emails-table-type-second {
				font-size: .8em;
				color: #878787;
				grid-row-start: 1;
				grid-row-end: 2;
				grid-column-start: 2;
				grid-column-end: 3;
				padding: 2px 5px;
			}

			.emails-table-icon-second {
				grid-column-start: 3;
				grid-column-end: 4;
				grid-row-start: 1;
				grid-row-end: 2;
				align-self: center;
				justify-self: center;
			}

			.address-table {
				grid-template-columns: 24px 1fr 24px;
			}

			.address-table-zip-city {
				grid-template-columns: 25% 1fr;
			}

			.phones-table-code-phone {
				grid-template-columns: 37% 1fr;
			}

			.phones-table-btn {
				grid-column-start: 1;
				grid-column-end: 3;
			}

			.data-style {
				grid-template-columns: 1fr 1fr 24px;
				grid-gap: 5px;
				grid-template-areas:
					"title value icon";
			}

			.columns {
				grid-template-columns: 1fr 1fr 1fr 1fr;
			}

			.emails-table-icon {
				grid-column-start: 3;
				grid-column-end: 4;
				grid-row-start: 2;
				grid-row-end: 4;
				align-self: center;
				justify-self: center;
			}

			.emails-table-type-second {
				font-size: .8em;
				color: #878787;
				grid-row-start: 1;
				grid-row-end: 2;
				grid-column-start: 2;
				grid-column-end: 3;
				padding: 2px 5px;
			}

			.emails-table-icon-second {
				grid-column-start: 3;
				grid-column-end: 4;
				grid-row-start: 1;
				grid-row-end: 2;
				align-self: center;
				justify-self: center;
			}

			.address-table {
				grid-template-columns: 24px 1fr 24px;
			}

			.address-table-zip-city {
				grid-template-columns: 25% 1fr;
			}

			.phones-table-code-phone {
				grid-template-columns: 37% 1fr;
			}

			.phones-table-btn {
				grid-column-start: 1;
				grid-column-end: 3;
			}

			.data-style {
				grid-template-columns: 1fr 1fr 24px;
				grid-gap: 5px;
				grid-template-areas:
					"title value icon";
			}

			.columns {
				grid-template-columns: 1fr 1fr 1fr 1fr;
			}

			.columns-two {
				grid-template-columns: 1fr 1fr;
			}

			.menu-box {
				width: 20%;
			}

			.role-box {
				max-width: 46%;
			}

			.role-subroles-grid {
				grid-template-columns: 1fr 1fr;
			}

			.priorities-data-wrap {
				grid-template-columns: 120px 1fr;
			}

			.close-data, .close-info {
				right: 20px;
			}

			.thumbnail-accordion-image {
				width: 14%;
			}

		}

		.radio_highlight {
			color: #ff0000;
			font-size: 1.7em;
		}

		.info-profile {
			position: fixed;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			background: #fff;
			transform: translateX(-105%);
			z-index: 99999;
		}

		.icon-faq {
			color: #ccc;
			font-size: 1.7em;
			position: absolute;
			top: -3px;
			margin-left: 10px;
		}

		.icon-faq.highlight {
			font-size: 1em !important;
			top: 4px;
			color: #ccc !important;
		}

		#accordion .panel-title a span {
			top: 15px !important;
		}

		.icon-woman-silhouette-01 {
			font-size: 14em;
			color: #cecece;
			position: relative;
			margin-bottom: 20px;
		}

		.highlight {
			border: 1px solid #ff0000;
			border-radius: 4px;
		}

		.activities-table {
			display: grid;
			grid-column-gap: 5px;
			grid-template-columns: 150px 1fr 24px 24px;
			max-width: 100%;
			overflow: hidden;
			margin-top: 20px;
		}

		.icon-ios15-5g .path1::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-5g .path2::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-full-battery .path1::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-full-battery .path2::before {
			color: #fff;
			opacity: 1;
		}
		
		.icon-ios15-full-battery .path3::before {
			color: #fff;
			opacity: 1;
		}
		
		.icon-ios15-cellular-signal .path1::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-cellular-signal .path2::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-cellular-signal .path3::before {
			color: #fff;
			opacity: 1;
		}

		.icon-ios15-cellular-signal .path4::before {
			color: #fff;
			opacity: 1;
		}

		.tattoo-wrap, .hair-wrap {
			width: 150px;
			height: 150px;
			position: relative;
			overflow: hidden;
		}
		.tattoo-wrapper, .hair-wrapper {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			border: 1px solid #ccc;
		}

		.tattoo-image, .hair-image {
			position: relative;
			text-align: center;
			font-size: 2em;
			top: 50%;
			transform: translateY(-50%);
			color: #ccc;
			cursor: pointer;
		}

		.tattoo-wrapper:hover, .hair-wrapper:hover {
			background: #ffefef;
		}

		.tattoo-image-img, .hair-image-img {
			position: relative;
			left: 0;
			top: 0;
			width: 100%;
			object-fit: cover;
		}

		.tattoo-trash, .hair-trash {
			position: absolute;
			right: 10px;
			top: 10px;
			font-size: 1.5em;
			color: #fff;
			text-shadow: 1px 1px 4px #000;
			cursor: pointer;
		}

		.section-top {
			margin: 40px 0 10px 0;
		}

		.section-boxes {
			margin-bottom: 20px;
			padding: 10px;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
		}

		.section-item {
			margin-bottom: 20px;
			border-bottom: solid 1px #ccc;
			/*padding: 10px;*/
			border: 1px #ddd solid;
			border-radius: 8px;
		}

		.section-item-new-value {
			padding: 10px;
			position: relative;
		}

		.section-item-values {
			padding: 10px;
			background: #ff00000d;
			border-bottom-right-radius: 8px;
			border-bottom-left-radius: 8px;
		}

		.checkbox+.checkbox, .radio+.radio {
			margin-top: 10px;
		}

		[name='propose-own-tag'].fill {
			animation: blinker 1s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
		}

		[id='get-loaded-media-btn'].fill, [id='load-media-btn'].fill, [id='test-uploaded-id-card'].fill, [id='write-us-btn'].fill, [id='check-assigned-roles'].fill, [id='address-add-btn'].fill, [id='next-email-btn'].fill, [id='phone-add-btn'].fill, [id='reload-event-priorities-btn'].fill, [id='very-important'].fill, [id='has-own-tag'].fill, [id='unblock-emails-btn'].fill, [id='new-password-btn'].fill {
			animation: blinker 1s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
		}

		[id^='add-own-tag-btn-'].fill, [id^='add-new-tag-btn-'].fill {
			animation: blinker 1s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
		}

		[id^='check-select-role-caption-'].fill, [id^='benefit-btn-caption-'].fill, [id^='get-questions-btn-'].fill {
			animation: blinker 1s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
		}

		.choice-item-icon.fill {
			animation: blinker 1s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
		}

		@keyframes blinker {
			to {
				opacity: 0;
			}
		}

		.blockquote-gray {
			border-color: #aaa;
			color: #000;
			background-color: #fff;
			font-size: 1em;
		}

		.blockquote-red {
			border-color: #ff0000;
			color: #000;
			background-color: #ffe5e5;
			font-size: 1em;
		}

		.blockquote-green {
			border-color: #008000;
			color: #000;
			background-color: #d2fbd2;
			font-size: 1em;
		}

		.blockquote-blue {
			border-color: #0000ff;
			color: #000;
			background-color: #e0e0ff;
			font-size: 1em;
		}

		.range-wrap {
			display: grid;
			grid-template-columns: 20px 20px 20px 20px;
			grid-column-gap: 10px;
			grid-template-areas:
				"title max range"
				"title value range"
				"title min range";
		}

		.range-wrap-h {
			display: grid;
			grid-template-columns: 58px 59px 58px;
			grid-row-gap: 10px;
			grid-template-areas:
				"title title title"
				"min value max"
				"range range range";
		}

		input[type=range][orient=horizontal] {
			-webkit-appearance: none;
			appearance: none;
			width: 175px;
			height: 8px;
			/*padding: 0 5px;*/
			cursor: pointer;
			background: transparent;
		}

		input[type="range"][orient=horizontal]::-webkit-slider-runnable-track {
			background: #a1a1a150;
			width: 175px;
			height: 7px;
			border-radius: 8px;
		}

		input[type="range"][orient=horizontal]::-webkit-slider-thumb {
			-webkit-appearance: none;
			appearance: none;
			margin-top: -4px;
			background-color: #a1a1a1;
			height: 1.5rem;
			width: 1.5rem;
			border-radius: 50%;
		}

		input[type="range"][orient=horizontal].fill::-webkit-slider-runnable-track {
			background: #ff000050;
			width: 175px;
			height: 7px;
			border-radius: 8px;
		}

		input[type="range"][orient=horizontal].fill::-webkit-slider-thumb {
			-webkit-appearance: none;
			appearance: none;
			margin-top: -4px;
			background-color: #ff0000;
			height: 1.5rem;
			width: 1.5rem;
			border-radius: 50%;
		}

		input[type=range][orient=vertical] {
			appearance: slider-vertical;
			width: 8px;
			height: 175px;
			padding: 0 5px;
			cursor: pointer;
			background: transparent;
		}

		.range-text-wrap {
			position: relative;
			display: grid;
			justify-content: center;
			align-items: center;
		}

		.range-text {
			transform: rotate(180deg);
			writing-mode: vertical-lr;
			text-shadow: 1px 1px 0 #fff;
		}

		.range-text-h {
			text-shadow: 1px 1px 0 #fff;
		}

		.range-text.title, .range-text-h.title {
			text-align: center;
			text-transform: uppercase;
		}

		.range-text.min, .range-text-h.min {
			text-align: left;
		}

		.range-text.max, .range-text-h.max {
			text-align: right;
		}

		.range-text.value, .range-text-h.value {
			border: 1px solid #ddd;
			border-radius: 4px;
			width: max-content;
			height: max-content;
			min-height: 28px;
			padding: 5px 0;
			align-self: center;
			text-align: center;
		}

		.range-text-h.value {
			min-width: 28px;
			min-height: unset;
			padding: 0 5px;
		}

		.range-wrapper {
			padding: 10px;
			margin: 0 10px 10px 0;
			border: 1px solid #ccc;
			width: fit-content;
			/*background: linear-gradient(135deg, rgba(255,0,0,0.15), rgba(255,255,255,0.25));*/
			box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.25), -8px -8px 12px 0 rgba(255, 255, 255, 0.3);
		}

		[name='range-wrapper-frequency'].fill {
			background: linear-gradient(135deg, rgba(255,0,0,0.15), rgba(255,255,255,0.25));
		}

		.role-main-desc {
			text-shadow: 1px 1px 2px #fff;
			font-style: italic;
			line-height: 16px;
			color: #000;
		}

		.role-desc {
			text-shadow: 1px 1px 2px #fff;
			font-style: italic;
			line-height: 16px;
			color: #878787;
			font-size: .8em;
		}

		.role-subtext {
			font-size: .8em;
			text-shadow: 1px 1px 2px #fff;
		}

		.complete-box {
			background: #ccc;
			margin-bottom: 15px;
			padding: 2px 5px;
			color: #fff;
			text-align: center;
		}

		.croppie-grid {
			position: relative;
			display: grid;
			grid-template-rows: 1fr;
			grid-template-columns: 280px;
			justify-content: center;
		}

		.croppie-idcard-grid {
			position: relative;
			display: grid;
			grid-template-rows: 1fr;
			grid-template-columns: 280px;
			justify-content: center;
		}

		#croppie-size-title {
			position: absolute;
			text-align: left;
			bottom: -25px;
			left: 45px;
		}

		.croppie-container .cr-slider-wrap {
			margin-top: 25px;
		}

		.priorities-wrap {
			display: grid;
			grid-template-columns: 15px 1fr 24px 24px;
			grid-gap: 5px;
			grid-template-areas: 
				"rank data move delete"
				"rank space space space"
				"rank events events goto"
				;
			align-items: center;
			border-bottom: 2px solid #787878;
			margin-bottom: 15px;
			padding-bottom: 10px;
		}

		.priorities-wrap.heads {
			grid-template-columns: 15px 1fr;
			grid-gap: 0;
			align-items: baseline;
			border-bottom: none;
			margin-bottom: 0;
			padding-bottom: 15px;
		}

		.priorities-titles {
			background: #d1d1d1;
			justify-self: stretch;
			color: #fff;
			font-size: .8em;
			padding: 2px 3px;
		}

		.event-title-selections {
			text-align: left;
			transform: scale(.8);
			line-height: 16px;
			margin: 0;
			margin-left: -6px;
		}

		.event-item-selections {
			font-size: .7em;
			padding: 2px 3px;
			border: 1px solid #ccc;
			width: fit-content;
			margin: 0 5px 5px 0;
		}

		.section-item-next-item {
			display: grid;
			grid-template-columns: 1fr 32px;
			align-items: stretch;
		}

		.section-item-next-item-plus {
			display: grid;
			grid-template-columns: 50px 1fr;
			align-items: baseline;
		}

		.section-item-next-item-plus.inside-flex {
			grid-template-areas: 
				"plus title"
				"empty flex"
		}

		.section-item-next-item-plus-admin {
		    display: grid;
		    grid-template-columns: 50px 1fr 50px;
		    align-items: baseline;
		}

		.section-item-next-item-plus-admin.inside-flex {
			grid-template-areas: 
				"plus title refresh"
				"empty flex refresh"
		}

		.accordion-plus {
			font-size: 1.3em;
			color: #ccc;
			cursor: pointer;
			margin: 10px 0;
			padding: 5px;
			width: 32px;
			height: 32px;
			text-align: center;
			border: 1px solid #ccc;
			border-radius: 4px;
		}

		.no-interested-role {
			margin-top: 10px;
			padding: 10px;
			border: 5px solid #ff0000;
		}

		[name='sexual-group-btn'].active {
			background: #ff0000;
			color: #fff;
		}

		.media-scroll-btn {
			font-size: 24px;
			width: 30px;
			transform: rotate(90deg);
			border: 1px solid #ccc;
			border-radius: 4px;
			padding: 2px 3px;
			box-shadow: 2px -2px 4px 0 #ccc;
		}

		.represents-wrap {
			width: 100%;
			height: 100%;
			position: relative;
			border: 1px solid #ccc;
			padding: 10px;
			text-align: center;
		}

		.represents-caption {
			font-size: 2em;
			color: #ccc;
		}

		.display-full-medium {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: 999999;
			display: none;
			background: #fff;
		}

		.display-full-medium.active {
			display: block;
		}

		.button-icon {
			border: 1px solid #ccc;
			border-radius: 4px;
			width: fit-content;
			padding: 2px;
			margin: 5px 2px;
			box-shadow: 2px 2px 6px #ccc;
		}

		.selected-sexual-practicles {
			font-size: .7em;
			border: 1px solid #ccc;
			border-radius: 4px;
			padding: 2px 3px;
			margin: 0 5px 5px 0;
			background: #ff00000d;
			width: 80px;
			height: 50px;
			position: relative;
			box-shadow: 4px 4px 8px 0px #ccc;
			overflow: hidden;
		}

		.selected-sexual-practicles-text {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			text-align: center;
			line-height: 10px;
			text-shadow: 1px 1px 0 #fff;
		}

		.customer-group-wrap {
			display: grid;
			grid-template-columns: 90px 1fr;
			grid-column-gap: 5px;
			grid-row-gap: 2px;
			grid-template-areas: "caption caption"
				"rate_title rate"
				"bonus_title bonus_title"
				"bonus bonus";
			position: relative;
			left: 0;
		}

		.thumbnail-medium {
			width: 100%;
			height: 100%;
			object-fit: cover;
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
			right: 0;
		}

		.with-own-tag {
			border: 3px solid #ff0000;
		}

		.choice-section-item {
			padding: 10px;
			width: 30%;
			color: #fff;
			margin: 0 0 5px 5px;
		}

		.choice-section-item:hover, .choice-section-item:focus, .choice-section-item:active {
			color: #fff;
		}


.event-wrapper {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: auto;
	grid-row-gap: 5px;
	grid-template-areas: 
		"a a b b c c"
		"d d d d d d"
		"e e e e e e"
		"f f f f f f"
		"g g g g g g"
		"h h h i i i"
		"j j j j j j"
		"k k k k k k"
		"l l l l l l"
		"m m m m m m"
		"n n n n n n"
		"o o o o o o"
		"p p p p p p"
		;
	align-items: center;
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.25), -8px -8px 12px 0 rgba(255, 255, 255, 0.3);
	background: linear-gradient(135deg, rgba(255,176,176,0.38), rgba(255,255,255,0.25));
	width: 285px;
	margin: 0 20px 45px 0;
}

.event-wrapper.Europe {
	background: linear-gradient(135deg, rgba(118,118,255,0.22), rgba(255,255,255,0.25));
}

.event-wrapper.novalid {
	background: linear-gradient(135deg, rgba(0,0,0,0.22), rgba(255,255,255,0.25));
	-webkit-filter: grayscale(100%);
}

.event-flag-wrap {
	width: 75px;
	position: relative;
	margin: 0 auto;
	grid-area: b;
	margin-bottom: 30px;
}

.event-flag {
	object-fit: cover;
	width: 100%;
	height: auto;
	position: absolute;
	transform: translateY(-62%);
}

.event-city {
	grid-area: d;
	text-align: center;
}

.event-country {
	grid-area: e;
	text-align: center;
}

.event-continent {
	grid-area: f;
	text-align: center;
}

.event-content {
	grid-area: g;
	font-size: .7em;
	text-align: center;
	margin-top: 10px;    
}

.event-date-start {
	grid-area: h;
	text-align: center;
	transform: scale(0.8);
}

.event-date-end {
	grid-area: i;
	text-align: center;
	transform: scale(0.8);
}

.event-pre-salary {
	grid-area: j;
	text-align: center;
}

.event-salary {
	grid-area: k;
	text-align: center;
}
.event-post-salary {
	grid-area: l;
	text-align: center;
}

.event-intimity {
	grid-area: m;
	margin-top: 10px;
}

.event-item-selection {
	grid-area: n;
}

.event-outfit-requirement {
	grid-area: o;
}

.event-goto-event {
	grid-area: p;
	text-align: center;
	margin-top: 10px;
}

.questions-label {
	display: grid;
	grid-template-columns: 24px 1fr;
	grid-template-areas: "icon text";
}

.no-spinner::-webkit-inner-spin-button,
.no-spinner::-webkit-outer-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}
.no-spinner {
	-moz-appearance: textfield !important;
	appearance: textfield !important;
}

.spinner-border {
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	border: 0.2em solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: spinner 0.75s linear infinite;
	margin-left: 5px;
}

.spin-icon {
	display: inline-block;
	animation: spinner 0.75s linear infinite;
}

@keyframes spinner {
	100% {
		transform: rotate(360deg);
	}
}

