:root{
	--c-black: #171717;
	
	--c-blue: #4285F4;
	--c-dark-blue:#146EB4;
	--c-light-blue: #cfe0e8;
	
	--c-red: #f44336;
	
	--c-grey: #EEEEEE;
	--c-light-grey: #FBFBFB;
}

::-webkit-scrollbar { height: 5px; width:5px; }
::-webkit-scrollbar-track { background: var(--c-light-blue); }
::-webkit-scrollbar-thumb { background: #aaa; border-radius:10px; box-shadow:0 0 2px #DDD; }
::-webkit-scrollbar-thumb:hover { background: var(--c-blue); }

body, html { overflow-x:hidden; }

.button { border:1px solid var(--c-blue); background-color:var(--c-blue); border-radius:5px!important; }
.button:hover { background-color:var(--c-dark-blue); border-color:var(--c-dark-blue); }
.button.red:hover { background-color:#DC143C; border-color:#DC143C; }
.button.black { background-color:#999!important; border-color:#999!important; }
.button.black:hover { background-color:#666!important; border-color:#999!important; }

.textbox, .textarea, .selection { border-radius:5px!important; }

.js-tooltip { display:flex; flex-direction:column; }
.js-tooltip .js-tooltip-images { display:flex; flex-direction:row; }
.js-tooltip .js-tooltip-images img { width:100px; height:auto; margin:0 auto; }

.modal h2 { background-color:var(--c-blue)!important; }
.container.main,.container.main>.table{height:100%}
.textbox,.textarea,.selection{max-width:400px}
.textbox.min-200 { width:200px; }
.textbox.min-100 { width:100px; }

.textarea.auto-height { min-height:unset; }

.multi-selection {display:inline-block; width:auto; vertical-align:top; margin-bottom:10px;}
.multi-selection a {background-color:#DDD; color:#000; display:inline-block; margin-left:10px; margin-top:10px; font-size:0.8em; padding:3px 5px; border-radius:10px;}
.multi-selection a:hover {background-color:#333; color:#FFF;}
.multi-selection .icon-cross { position:absolute; top:3px; right:3px; font-size: 0.5em; width: 20px; height: 20px; border-radius: 100%; line-height: 22px; padding: 0; background-color: #666!important; color:#FFF!important; margin:0; }
.multi-selection .selection-content {position:fixed; top:0; left:0; width:100%; height:100%; z-index:99999; text-align:center; display:none;}
.multi-selection .selection-content.active {display:block;}
.multi-selection .selection-content .selection-bg {position:absolute; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:.75;}
.multi-selection .selection-content .selected-items { display:block; width:100%; }
.multi-selection .selection-content .selection-body {display:inline-block; width:96%; max-width:300px; height:auto; margin:0; position:absolute; top:50%; left: 50%; transform:translate(-50%, -50%); background-color:#FFF; padding:10px;}
.multi-selection .selection-content .selection-body strong {margin-bottom:10px; display:inline-block;}
.multi-selection .selection-content .selection-body .lbjs {width:100%;box-sizing:border-box; text-align:left;}
.multi-selection .selection-content .selection-body .lbjs .lbjs-item.parent { font-weight:bold; }
.multi-selection .selection-content .selection-body .button {margin-top:10px;}
.multi-selection .selected-items .textbox.amount {width:50px;}

.main-menu,.main-content{padding:0}

.hamburger {position:fixed;display:block;top:5px;right:10px;z-index:11000;background-color:var(--c-blue)!important;border-radius:100%;width:40px;height:40px;outline:0;}
.hamburger .hamburger-inner, .hamburger .hamburger-inner::before, .hamburger .hamburger-inner::after, .hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after {background-color:#FFF; width:25px; height:3px;}
.hamburger .hamburger-inner::before { top:-6px; }
.hamburger .hamburger-inner::after { bottom:-6px; }
.hamburger:hover{opacity:1}
.hamburger.is-active:hover{opacity:1}

.main-menu { background-color:var(--c-light-blue);color:#FFF;position:fixed;top:0;left:-85%;width:85%;height:auto;min-height:100%; z-index:10000 }
.main-menu.active{left:0}
.main-menu .page-name { font-weight:bold;color:#FFF;display:block;margin-bottom:5px;background-color:var(--c-blue);padding:16px 10px;box-sizing:border-box;text-align:left; line-height:1.5em; }
.main-menu .page-name [class^="icon-"] {font-size:1.5em;color:inherit;display:inline-block;vertical-align:top;margin-right:5px}
.main-menu .page-name span { font-size:.8em; display:block; font-weight:normal; color:#DDD; }
.main-menu .page-name .member-name { display:inline-block; width: calc(100% - 40px); vertical-align: top; line-height: 1.3em; font-size:.8em; text-align: left; }

.main-menu .member-name {font-weight:bold}

.main-menu .member-type {font-size:.8em;font-style:italic}
.main-menu .member-type a{display:block;font-size:1.5em}
.main-menu .member-type a:hover{color:#F00}

.main-menu .menu-items { list-style-type:none;margin:0;padding:10px 0 70px;text-align:left }
.main-menu .menu-items li {display:block;padding:5px 10px;margin-bottom:5px;}
.main-menu .menu-items li.separator { height:1px; padding:0; border-bottom:1px dashed #FFF; }
.main-menu .menu-items li.active,.main-menu .menu-items li:hover{background-color:var(--copper-ex-light)}
.main-menu .menu-items li a { color:inherit; display:block; background-color:#FAFAFA; color:#000; box-sizing:border-box; text-transform:capitalize; padding:5px 10px; border-radius:5px;}
.main-menu .menu-items li.active a, .main-menu .menu-items li:hover a{ background-color:var(--c-dark-blue); color:#FFF; }
.main-menu .menu-items li span { background-color:#F00;color:#FFF;display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;border-radius:100%;font-size:0.7em;margin:-10px 0 0 10px;}

.main-menu .page-name,.main-content .page-menu{height:56px;box-sizing:border-box}

.main-content .page-menu { background-color:#FFF; color:var(--c-dark-blue); box-shadow:0 0 3px #333; position:relative; z-index:100; }
.main-content .page-menu .col, .main-content .page-content .col { text-align:left; padding:10px; }
.main-content > .page-content > .col {text-align:left;padding:10px;/* overflow-x:auto; */width:100vw}
.main-content .page-content .col table{min-width:800px}
.main-content .page-content .col table tr.parent {background-color:#CCC;}
.main-content .page-menu .col { font-size:.8em; }
.main-content .page-menu .col a.bt {display:block;margin:5px 0;color:#666}
.main-content .page-menu .col a.bt:hover,.main-content .page-menu .col a.bt.disabled{color:#DDD}
.main-content .page-menu .col .button { margin-bottom:10px; text-transform:capitalize; }
.main-content .page-menu .search-box {display:inline-block;border:1px solid #DDD;background-color:#FFF;padding:4px 10px; margin-bottom:10px; }
.main-content .page-menu .search-box .keyword { outline:0; border:0; background:transparent; }
.main-content .page-menu .search-box .submit{color:inherit;margin-left:10px}

.main-content .page-content .page-title {text-transform:capitalize;font-weight:normal;border-bottom:1px dashed #333;padding-bottom:10px;margin-bottom:20px; line-height:1.5em;}
.main-content .page-menu .page-title { margin:5px 0 0 0; font-size:1.5em; }
.main-content .page-content .page-title span {background-color:#333; color:#FFF; font-size:10px; display:inline-block; width:auto; height:auto; padding:0 5px; font-weight:normal; line-height:2em; }

.main-content .page-content label, .main-content .page-content [id$='_counter'], .main-content .page-content [id$='_display'] { font-size:.8em; margin-top:10px; }
.main-content .page-content form label.min-hide {display:none;}
.main-content .page-content h2 {color:var(--c-blue);}
.main-content .page-content .page-content-buttons { font-size:.8em; margin-bottom:10px; }

.main-content .page-content .page-content-options { border-top:1px solid #DDD; margin:10px 0; padding-top:10px; white-space:wrap; }
.main-content .page-content .page-content-options .selection, .main-content .page-content .page-content-options .textbox { border:0; border-bottom:1px solid #aaa; margin:10px 5px 0 0; padding-left:0; padding-right:0; width:25%; max-width:150px; display:inline-block; border-radius:0!important; }
.main-content .page-content .page-content-options .selection { width:44%; margin-top:9px; }
.main-content .page-content .page-content-options label { font-size:.7em; font-weight:normal; color:#999; height:auto; line-height:1em; min-width:unset; width:1px; white-space:nowrap; display:inline-block; vertical-align:top; margin:0; transform:translateX(100%); }
.main-content .page-content .page-content-options .button i { display:inline-block; vertical-align:top; }

.page-nav{display:block;width:100%;box-sizing:border-box;padding:10px;margin-top:10px}
.page-nav a{background-color:#DDD;border:1px solid #DDD;color:#333;text-align:center;display:inline-block;width:1.5rem;height:1.5rem;line-height:1.5rem;margin-left:5px;font-size:.8em;border-radius:100%;-webkit-border-radius:100%}
.page-nav a:hover, .page-nav a.active{font-weight:bold;background-color:var(--c-blue);color:#FFF;border-color:var(--c-main-bg)}

.main-content { padding-bottom:50px; position:relative; }
.main-content .table-list { border:1px solid #DDD; width:100%; border-spacing:0; border-collapse:collapse; font-size:.9em; }
.main-content .table-list .nowrap { white-space:nowrap; }
.main-content .table-list th {font-weight:bold;color:#666;text-transform:uppercase;background-color:#eee;padding:10px;border:1px solid #FFF;font-size:.8em}
.main-content .table-list tr:nth-child(odd){background-color:#F3F3F3}
.main-content .table-list tr:hover:nth-child(odd){background-color:#DDD}
.main-content .table-list tr:nth-child(even){background-color:#FBFBFB}
.main-content .table-list tr:hover:nth-child(even){background-color:#EEE}
.main-content .table-list td {padding:5px 10px;border:1px solid #FFF;font-size:.8em}
.main-content .table-list td .button { }
.main-content .table-list td span {background-color:#F44336; display:inline-block; font-size:0.8em; padding:3px 5px; color:#FFF; margin:2px; white-space:nowrap; }
.main-content .table-list td span.black { background-color:#333;}
.main-content .table-list td span.green { background-color:var(--c-blue);}
.main-content .table-list td a.bt {color:#333;margin:0 5px;font-size:1.3em}
.main-content .table-list td a.bt[class*="icon-caret"]{font-size:1.5em;margin:0 7px}
.main-content .table-list td a.bt:hover{color:#3C0}
.main-content .table-list td a.bt.icon-star-full {color:rgb(255, 180, 0);}
.main-content .table-list a{color:inherit}
.main-content .table-list a:hover{color:#BBB}

.main-content .table-list td .table-list-buttons { display:inline-block; margin-left:15px; }
.main-content .table-list td .table-list-buttons a { font-size:1.3em; margin-right:10px; display:inline-block; vertical-align:top; }
.main-content .table-list td .table-list-buttons [class^='icon-'] { color:#999; }
.main-content .table-list td .table-list-buttons [class^='icon-']:hover { color:#333; }
.main-content .table-list td .table-list-buttons .icon-trash { margin-top:-1px; }
.main-content .table-list td .table-list-buttons .button { font-size:.8em; display:inline-block; vertical-align:middle; padding:3px 5px; margin:0 0 0 5px; }

.main-content form .form-error-message { font-size:.8em; background-color:unset; border:unset; color:#F00; padding:10px 0; margin:5px 0; }
.main-content form label {margin-top:10px;}
.main-content form label span {font-size:0.8em;color:#F00;}
.main-content form .main-control { display: block; margin-top: 10px; }
.main-content form .main-control .button { font-size:.8em; }

.seo-checklist {border-bottom:1px solid #DDD; padding:20px 10px; font-size:.9em; }
.text-red {color:#FF0000;}
.seo-checklist .checkbox {pointer-events:none;}
.seo-checklist div { color:#DC143C; }
.seo-checklist div.checked {color:rgb(122, 208, 58);}
.seo-checklist div span {font-size:.8em; margin-left:5px; }

.main-content .footer { font-size:10px; text-align:right;background-color:#FAFAFA; padding:5px 10px; position:absolute; bottom: 5px; right: 5px; box-sizing:border-box; display:none; }

.table-over {width:calc(100vw - 20px);height:auto;overflow-x:auto;padding-bottom:10px;}

.progress-bar-container { height:20px; line-height:20px; }
.progress-bar { display:inline-block; vertical-align:middle; width:100%; height:20px; background-color:#BBB; position:relative; }
.progress-bar .progress-bar-percent { position:absolute; top:0; left:0; height:100%; background-color:var(--blue-light); max-width:100%; }
.progress-bar span { position:absolute!important; top:50%; left:50%; transform:translate(-50%, -50%); height:auto!important; background:unset!important; }

.manager-form { position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; background-color:rgba(0,0,0,0.7); display:none; overflow-y:auto; }
.manager-form .manager-form-container { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:94%; max-width:600px; border-radius:5px; background-color:#FFF; overflow-y:auto; max-height:90%; }
.manager-form .manager-form-container .icon-x { position:absolute; top:10px; right:5px; color:#000; font-size:1.2em; }
.manager-form .manager-form-container .manager-form-title { background-color:var(--c-blue); color:#FFF; padding:10px; box-sizing:border-box; border-top-left-radius:5px; border-top-right-radius:5px; }
.manager-form .manager-form-container .manager-form-content { padding:10px; box-sizing:border-box; text-align:left; }
.manager-form .manager-form-container label { margin-top:5px; vertical-align:middle; }
.manager-form .manager-form-container .textbox#color_picker { width:150px; height:40px; margin-top:0; }
.manager-form .manager-form-container .button { margin:10px 5px 0; min-width:80px; }
.manager-form .manager-form-container .manager-form-content .description { text-align:right; font-size:0.8em; color:#999; }
.manager-form .manager-form-container .minicolors-theme-default .minicolors-swatch { top:10px; }
.manager-form .manager-form-container .checkbox { display: inline-block; vertical-align: middle; }

@media(min-width:576px){
	.main-content form label {margin-top:0;}
}
@media(min-width:768px){
	.main-content .page-menu .col { height:56px; padding-top:15px; }
	.main-menu{width:40%;}
	.main-content .page-menu .col a.bt{display:inline-block;margin:0 20px 0 0}
	.main-content .page-menu .col .button{margin-bottom:0}
	.table-over { width:97vw; }
}
@media(min-width:992px){
	.main-menu{width:30%}
	.table-over { width:98vw; }
}
@media(min-width:1200px){
	.hamburger {display:none!important}
	.main-menu {position:fixed;display:table-cell;top:0;left:0;width:16.666%;z-index:1; }
	.main-menu .icon-cheveron-left { position:absolute; top:10px; right:3px; font-size:2em; color:#FFF; display: inline-block; animation: a9 1s 3; }
	.main-menu .page-name a { color:#FFF!important; }
	.main-content .page-menu .page-title { margin:0; }
	.main-content .page-content .col{ width:100%; overflow-x:unset; }
	.main-content .page-content .col table{min-width:unset}
	.main-content .page-content form label.min-hide {display:inline-block;}
	.main-content form .form-error-message { margin-left:155px; }
	.main-content form .form-error-message.align-left { margin-left:0; }
	.table-over { width:82vw; transition:all .3s; }
	
	.table.hide-menu .main-menu, .table.hide-menu .main-content { transition:all .3s; }
	.table.hide-menu .main-menu { width:50px!important; z-index:10; }
	.table.hide-menu .main-menu .icon-cheveron-left { display:none; }
	.table.hide-menu .main-menu .member-name { display:none; }
	.table.hide-menu .main-menu .menu-items { display:none; }
	.table.hide-menu .main-content { width:97%!important; padding-left:50px; }
	.table.hide-menu .main-content .table-over { width:94vw; }

	@keyframes a9 {
	  0%   { transform: translate( 10px)}
	  100% { transform: translate( 0)}
	}
}