html{
	position:static;
	width:100%;
	height:100%;
	-webkit-overflow-scrolling: touch;
}
body{
	margin:0;
	background-color:#F8F9FD;
	overflow:hidden;
	bottom:0;
	top:0;
	left:0;
	right:0;
	color:#6b7c93;
	font-family: 'Muli', sans-serif;
	--color:rgb(216, 149, 48);
	--accent:rgb(55, 71, 79);
	--danger:#FF2C55;
	font-size:10pt;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	line-height:1.3;
	height:100%;
}

.sidebar{
	position:absolute;
	background-color:#FFF;
	bottom:0;
	top:0;
	left:0;
	width:270px;
	overflow-y:scroll;
	box-shadow:0 7px 30px rgba(0,11,80,0.08);
	transition:0.2s;
	padding:40px 0 40px 0;
	z-index:150;
}
.sidebar:before,.sidebar:after{
	content:"";
	position:fixed;
	width:270px;
	height:40px;
	z-index:200;
	pointer-events:none;
}
.sidebar:before{top:0;background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);}
.sidebar:after{bottom:0;background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);}
.menu-btn{
    position: absolute;
    padding: 10px 17px;
	left:210px;
    font-size: 21px;
    color: var(--color);
	z-index:300;
	cursor:pointer;
}

body.hide-sidebar .sidebar{
	left:-300px;
}

body.hide-sidebar .menu-btn{
	left:0;
	transition:0.2s;
}

.sidebar>.nav>h1{
	padding-left:15px;
	border-top:solid 1px #eee;
	padding-top:15px;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing:2px;
	margin-bottom:5px;
}
.sidebar>.nav a{
	display: block;
    padding: 12px 19px;
    margin: 0 10px;
	text-decoration:none;
	color:#6b7c93;
	border-radius:5px;
	overflow:hidden;
	position:relative;
	transition:0.2s;
}
.sidebar>.nav a.active,.sidebar .event-list>a.active{
	color:#fff;
	background-color:var(--color);
	border-radius:5px;
	box-shadow:0 4px 8px rgba(0,0,0,.1);
}
.sidebar>.nav a>i{
	margin-right:16px;
	color: var(--color);
}
.sidebar>.nav a.active>i{
	color:#FFF;
}
.sidebar .accountswitch{
	padding: 11px 21px 0px;
}

 .addons{
	padding:0 11px;
}
 .addons>a{
	width:33%;
	text-align:center;
	display: inline-block!important;
	margin:0!important;
	padding:4px 2px!important;
	vertical-align:top;
	height: 86px;
	box-sizing: border-box;
}
 .addons>a>img{
    width: 36px;
    height: 36px;
    background-color: var(--color);
    padding: 8px;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,.1);
    box-sizing: border-box;
    display: block;
    margin: 4px auto;
}
 .addons>a.manage>i{
	margin: 9px auto;
    display: block;
    font-size: 20px;
}
 .addons>a.manage{
	border: solid 1px #eee;
}

#body img.addon{
	width: 50px;
    display: block;
    margin: 33px auto;
    padding: 20px;
    border-radius: 16px;
    box-shadow: 0 7px 13px rgba(0,0,0,.15), 0 2px 3px rgba(0,0,0,.1);
}

.sidebar>.event-list{
    margin: 0 10px;
    position: absolute;
    background-color: #FFF;
    
    padding: 10px;
    border-radius: 10px;
	left:0;
	right:0;
}
.sidebar>.event-list.open{
	box-shadow: 0 3px 6px rgba(0,0,0,.1), 0 7px 39px rgba(0,0,0,.1);
	z-index:100;
	
}
.sidebar>.event-list>a{
	display: block;
    padding:0 0 0 40px;
	position: relative;
	cursor:pointer;
	overflow:hidden;
	max-height:0;
	transition:0.2s;
	text-decoration:none;
	color:#6b7c93;
	border-radius:5px;
}
.sidebar>.event-list.open>a,
.sidebar>.event-list.static>a{
	padding:8px 13px 8px 13px;
	max-height:100px;
}
.sidebar>.event-list>a>i{padding-right:13px;}

.sidebar>.event-list.open>.event,
.sidebar>.event-list.static>.event{
	padding:13px 23px 13px 40px;
	max-height:200px;
	border-top: solid 1px #eee;
}
.sidebar>.event-list>.event:first-child{
	padding:13px 23px 13px 40px;
	max-height:200px;
	border-top: 0;	
}
.sidebar>.event-list>.event:first-child:after{
	content: "V";
    font-family: "dripicons-v2" !important;
    position: absolute;
    right: 6px;
    top: 50%;
    margin-top: -7px;
	transition:0.2s;
}
.sidebar>.event-list.open>.event:first-child:after{transform:rotate(90deg);}

.sidebar>.event-list>.event>div{
	letter-spacing:1px;
	text-transform: uppercase;
}
.sidebar>.event-list>.event>span{
	position: absolute;
    left: 14px;
    top: 0px;
    bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width:10px;
}
.sidebar>.event-list>.event>span>span{
    transform: rotate(-90deg);
    text-align: center;
    width: 42px;
    position: absolute;
    padding: 2px;
    font-size: 11px;
    z-index: 1;
    border-radius: 4px;
}

section .event .name>span{
	position: absolute;
	left: 17px;
	top: 0px;
	height:69px;
	display: flex;
	align-items: center;
	justify-content: center;
	width:10px;
}
section .event .name>span>span{
	transform: rotate(-90deg);
	text-align: center;
	width: 42px;
	position: absolute;
	font-size: 11px;
	z-index: 1;
	padding:2px 4px;
	top: 23px;
}

section{
	min-width:250px;
	left:270px;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	overflow-y:scroll;
	padding:15px 30px;
	transition:0.2s;
	padding-top:54px;
}

body.hide-sidebar section{
	left:0px;
}
::-webkit-scrollbar{width:0;}

::-webkit-scrollbar-thumb{
	border-radius:10px;
	background-color:var(--color);
}

.topbar{
	position:absolute;
	left:0;
	right:0;
	top:0;
	text-align:right;
	vertical-align:middle;
	height:50px;
	border-bottom:solid 1px #eee;
	padding:0 8px;
	z-index:100;
	background-color:inherit;
}

.topbar>a{
	display: inline-block;
    padding: 16px 12px;
    overflow: hidden;
    cursor: pointer;
    position: relative;
}

.contain{
	max-width:1170px;
	margin:0 auto;
	position:relative;
}
.contain.small{max-width:1050px;}
.contain.tiny{max-width:900px;}
.contain.nano{max-width:500px;}

.placeholder{
	text-align:center;
	margin:80px 0;
}
.placeholder>i{
	font-size:80px;
}

#body{
	min-height:100px;
}

@media screen and (max-width:768px){
	section{
		padding:54px 15px 15px 15px;
	}
}
.input{
	width:100%;
	padding:15px 25px;
	box-sizing: border-box;
	border:solid 1px #d6e7f0;
	border-radius:9px;
	outline:none;
	font-family: 'Muli', sans-serif;
	transition:0.2s;
	background-color:#FFF;
	-webkit-appearance: none;
}

.input.dateinput{
	padding:0;
	width:auto;
	overflow:hidden;
	vertical-align: middle;
	max-width:400px;
}

.input.dateinput>div{
	display:inline-block;
	vertical-align: top;
	border-right:solid 1px #d6e7f0;
}

.input.dateinput>div:first-child{
	width: calc(100% - 100px);
}

.input.dateinput input{
	position:relative;
	border:0;
	padding:11px;
	outline:0;
	
	font-family: 'Muli', sans-serif;
	width: 100%;
    box-sizing: border-box;
}
input::-webkit-calendar-picker-indicator{appearance: none;display:none;}

.input.dateinput>div:last-child{border:0;}

.input[readonly]{
	pointer-events:none;
	border-color:#FFF;
}
.input.small{
	padding:7px 15px;
}

.input:focus{
	border-color:var(--color);
}

input.checkbox{
	display:none;
}

select.input {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDUxMiA1MTIiIGZpbGw9JyM2YjdjOTMnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwb2x5Z29uIHBvaW50cz0iMzk2LjYsMTYwIDQxNiwxODAuNyAyNTYsMzUyIDk2LDE4MC43IDExNS4zLDE2MCAyNTYsMzEwLjUgIi8+PC9zdmc+);
    background-position: right 8px center;
    background-size: 20px;
    background-repeat: no-repeat;
}

div.fake-checkbox{
	display: inline-block;
    width: 23px;
    height: 23px;
    border: solid 1px #ddd;
    border-radius: 5px;
    vertical-align: middle;
    margin: 0 6px;
	position:relative;
	overflow:hidden;
	cursor:pointer;
}
div.fake-checkbox.checked:after{
	content: "S";
    font-family: "dripicons-v2" !important;
    position: absolute;
    font-size: 18px;
    right: 2px;
    color: var(--color);
    top: 1px;
}
div.fake-checkbox.checked.master:after{color: var(--accent);}
div.fake-checkbox.checked.radio:after{
	content:"-";
	font-size: 48px;
    top: -19px;
    right: -12px;
}
label>small{
	display:block;
	font-size:12px;
	opacity:0.6;
}

button.btn{
	border:0;
}
button.btn:focus{
	outline:0;
}
.form-linear label{
	display:inline-block;
	width:120px;
	vertical-align:middle;
	text-align:right;
	margin-right:20px;
}
.form-linear>div{
	margin-bottom:15px;
}
.form-linear .has-label{
	width:calc(100% - 145px);
	display:inline-block;
	vertical-align:middle;
}
.imageupload{
    border: dashed 2px #ddd;
    border-radius: 9px;
    position: relative;
	
	padding:20px;
	margin:6px;
	height:175px;
	transition:0.2s;
}
.imageupload:hover{
	background-color:#F8F9FD;
}
.imageupload>input[type='file']{
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
	cursor:pointer;
}
.imageupload>input[type='text']{
	height:0px;
	border:0;
	padding:0;
	margin:0;
	font-size:0px;
	opacity:0;
	pointer-events:none;
}
.imageupload .images{
	position:absolute;
	right:8px;
	top:8px;
	bottom:8px;
	display:inline-block;
	padding:10px;
	background-color:#FFF;
	border-radius:5px;
	box-shadow:0 2px 6px rgba(0,0,0,.1);
	z-index:10;
	overflow:hidden;
	
}
.imageupload .images>div {
    height:160px;
	width:160px;
	border-radius:5px;
	overflow:hidden;
	display:inline-block;
	margin:6px;
	background-size: cover;
	border:solid 1px #d6e7f0;
}
.add-helpbar{
	padding-right:300px;
	position:relative;
	overflow:hidden;
}

.helpbar{
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	width:280px;
}
.helpbar>div.out{
	opacity:0;
}
.helpbar>div{
    border: solid 1px var(--color);
    position: absolute;
    padding: 12px;
	border-radius:4px;
	opacity:1;
	transition:0.3s;
}
.helpbar>div:before{
    position: absolute;
    content: "";
    width: 15px;
    left: -9px;
    top: 8px;
    height: 15px;
    border-top: solid 1px var(--color);
    border-left: solid 1px var(--color);
    transform: rotate(-45deg);
    background-color: #fff;
}

.alert{
	padding: 10px;
    background-color: #edf2f9;
    color: #6f8a96;
    border-radius: 5px;
    margin-bottom: 7px;
    padding-left: 49px;	
	position:relative;
	transition:0.2s;
	text-align:left;
    margin:9px 11px 17px 11px;
	font-weight:bold;
}
.alert>*{
	display:inline-block;
	vertical-align:middle;
}
.alert:before{
	content:"I";
	font-family:"dripicons-v2" !important;
	position:absolute;
	left:14px;
	top:50%;
	font-size:20px;
	margin-top:-14px;
}
.alert.success:before{content:"\e04e";}
.alert.success{
	border-color:var(--accent);
	background-color:#d9ffec;
	color:#07b35f;
}
.alert.danger:before{content:"\e04d";}
.alert.danger{
	border-color:var(--danger);
	background-color:#ffebef;
	color:var(--danger);
}
.alert.color{
	border-color:var(--color);
	background-color:#e3f6ff;
	color:#03A9F4;
}

.alert.tiny{
	margin: 5px;
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: 9pt;
}


form.invalid .input:invalid{
	border:solid 1px var(--danger)!important;
}
.form-error.out{
	max-height:0;
	transition:0.2s;
	overflow:hidden;
}
.form-error{
    color: var(--danger);
    max-height: 100px;
    background-color: #ffebef;
    margin: 3px;
    padding: 3px 8px;
    border-radius: 5px;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
}

.input-addon{
	position:absolute;
	margin:16px;
	pointer-events:none;
	z-index:1;
}
.input-addon.small{margin:8px 16px;}
.input-addon.right{
	right:0;
}
.input-addon:not(.right) + .input{
	padding-left:25px;
}

.input-toggler{
	width:100px!important;
	text-align:center;
}
.input-toggler>small{display:block;}

.maxlength{
	position:absolute;
	right:1px;
	top:1px;
	background-color:#d6e7f0;
	color:#8e98a0;
	padding:1px 6px;
	font-size:8pt;
	border-top-right-radius:9px;
	border-bottom-left-radius:5px;
}

.filter-toggle{
	text-align:center;
	margin:15px 0;
}
.filter-toggle a{
	border-radius:99px;
	color:#6b7c93;
	border:solid 2px;
	font-weight:bold;
	display:inline-block;
	padding:2px 10px;
	margin:2px;
	cursor:pointer;
	opacity:0.6;
	transition:0.2s;
}
.filter-toggle a:hover{
	opacity:1;
}
.filter-toggle a.active{
	color:var(--color);
}
.filter-toggle a>i{transition:0.2s;padding:0px;font-size:0px;}
.filter-toggle a.active>i{font-size:12px;padding:5px;}

@media screen and (max-width:1150px){
	
	body.show-sidebar .form-linear .input .input{
		width:100%;
	}
	body.show-sidebar .form-linear .input label{
		text-align:left;
	}
	.add-helpbar{
		padding-right:200px;
	}
	.helpbar{
		width:180px;
	}
}


@media screen and (max-width:990px){
	
	body.show-sidebar .add-helpbar{
		padding:0;
	}
	body.show-sidebar .helpbar{
		display:none;
	}
}
@media screen and (max-width:768px){
	.form-linear .has-label{
		width:100%;
	}
	.form-linear label{
		text-align:left;
		width:100%;
		margin-right:0;
	}
	.add-helpbar{padding-right:0;}
	.helpbar{display:none;}
	
	.imageupload .images>div{
		width:50px;
		height:50px;
		display:block;
	}
}.justify,.justify-fill{
    justify-content: space-between;
    display: flex;
	width:100%;
	box-sizing: border-box;
}
.justify>*{
	align-self:center;
}
.justify-fill>*{
	width:100%;
	align-self:center;
}
.justify.align-top>*,.justify-fill.align-top>*{
	align-self:unset;
}
.card{
	background-color:#FFF;
	border-radius:.75rem;
	box-shadow:0 7px 25px rgba(0,11,80,.04), 0 1px 6px rgba(0,11,80,.1);
	padding:20px;
	box-sizing:border-box;
	margin:0 10px;
	position:relative;
	overflow:hidden;
}

.card.card2{
	box-shadow:0 10px 30px rgba(0,11,80,.07), 0 3px 10px rgba(0,11,80,.12);
}

.well{
	border-radius:.75rem;
	padding:20px;
	box-sizing:border-box;
	margin:0 10px;
	position:relative;
	overflow:hidden;
	border:dashed 2px;
}

.no-pad{
	padding-left:0;
	padding-right:0;
}

.steps{
	justify-content:space-between;
	display:flex;
	counter-reset:number;
}
.steps>div{
	width:100%;
	text-align:center;
	margin-top:40px;
	position:relative;
	counter-increment: number;
}
.steps>div:before{
	content:"";
	position:absolute;
	width:100%;
	left:50%;
	height:2px;
	background-color: var(--color);
	margin-top:-25px;
}
.steps>div:after {
    content: counter(number);
    position: absolute;
    width: 26px;
    height: 26px;
    left: 50%;
    margin: -40px -15px;
    background-color: var(--color);
    top: 0;
    border-radius: 30px;
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
	border:solid 2px var(--color);
}
.steps>div:last-child:before{display:none;}

.steps>div.active ~ div{color:#b4becb;border-color: #b4becb;}
.steps>div.active ~ div:before,.steps>div.active ~ div:after,.steps>div.active:before{background-color: #b4becb;border-color: #b4becb;}
.steps>div.active:after{background-color:#FFF;color:var(--color);}
.steps>div.active{color:var(--color);}
.tabs{
	position:relative;
	overflow-x:scroll;
	overflow-y:hidden;
	padding-bottom: 2px;
	-ms-overflow-style: none;
}
.tabs::-webkit-scrollbar{height:0;}
.tabs a{
	text-align:center;
	display:inline-block;
	width:100%;
	padding:15px;
	cursor:pointer;
	text-transform: uppercase;
	text-decoration:none;
	color:#6b7c93;
	overflow:hidden;
	transition:0.2s;
	min-width:90px;
	position:relative;
	align-self: flex-end;
}
.tabs a.active{
	color:var(--color);
}
.tabs a:after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	background-color:#d6e7f0;
	height:2px;
	bottom:0;
	transition:0.2s;
}
.tabs a.active:after{
	background-color:var(--color);
}

.tabs>.indicator{
	height:2px;
	position:absolute;
	background-color:var(--color);
	transition:0.2s;
}

.tab-content{
	position:relative;
}
.tab-content>div{
	position:relative;
	transition:0.2s;
}
.tab-content>div.out{
	position:absolute;
	top:0;
	right: 0;
    left: 0;
	overflow: hidden;
	max-height:0;
}

.btn{
	border-radius:4px;
	padding:16px 32px;
	display:inline-block;
	letter-spacing:2px;
	background-color:#FFF;
	cursor:pointer;
	text-decoration:none;
	position:relative;
	white-space:nowrap;
	overflow:hidden;
	box-sizing: border-box;
	text-decoration:none;
	color:inherit;
	vertical-align: top;
}
.btn.solid{
	background-color:var(--color);
	color:#FFF;
	box-shadow:0 4px 10px rgba(0,11,80,0.2);
}
.btn.default{
	background-color:rgb(237,245,248);
	color:#6b7c93;
	box-shadow:0 3px 7px rgba(0,11,80,0.1);
}
.btn.success{background-color:var(--accent);}
.btn.danger{background-color:var(--danger);}

.btn.tiny{
    padding: 4px 12px;
    font-size: 10px;
}
.btn.tiny.solid{
	box-shadow:0 1px 3px rgba(0,11,80,0.1);
}
.page{
	pointer-events:none;
	opacity:0;
	position:absolute;
	transition:0.2s;
	top:0;
}
.page.active{
	opacity:1;
	position:relative;
	pointer-events:auto;
}

.ripple{
	position:absolute;
	width:0;
	height:0;
	border-radius:500px;
	background: radial-gradient(ellipse at center, rgba(248,249,253,0.6) 0%,rgba(248,249,253,0.8) 100%);
	pointer-events:none;
	transition:0.5s;
}
.ripple.color{
	background: radial-gradient(ellipse at center, rgba(245,124,0,0.9) 0%,rgba(245,124,0,1) 100%);
	
}
.out{
	opacity:0!important;
	transform:scale(0.9)!important;
	pointer-events:none!important;
	transition:0.3s;
}

.dropdown{
	position:absolute;
	z-index:1100;
	transform:scale(1);
	opacity:1;
	pointer-events:all;
	transition:0.3s;
}
.dropdown.fill{width:0px;}
.label{
	border-radius:5px;
	font-weight:bold;
	background-color: #d6e7f0;
	color: #8e98a0;
	padding:3px 10px;
    display: inline-block;
    margin: 2px 0;
}
.label.draft{color: #dea600;background-color: #ffedb5;}
.label.live{color: #00dc71;background-color: #a8ffd5;}
.label.off{color: #ff0000;background-color: #ffbdbd;}
.label.color{color: #00b0ff;background-color: #afe7ff;}
.label.purple{color: #9b3cff;background-color: #ddb8ff;}
.label.info{color: #32bfd5;background-color: #dbfaff;}
.label.action {background-color: rgb(255 235 214);color: var(--color);}

.inline{
	display:inline-block;
	width:auto!important;
}

.title{
	color:var(--color);
	letter-spacing:2px;
	font-size:calc(20px + 0.5vw);
}

.selection{
	justify-content: center;
    display: flex;
    width: 100%;
	margin:0 auto;
	flex-wrap: wrap;
}
.selection>a{
	display:block;
	text-align:center;
	border:dashed 2px #99a7b9;
	margin:12px;
	padding:16px;
	border-radius:5px;
	width:200px;
	cursor:pointer;
	transition:0.2s;
	opacity:0.8;
	position:relative;
	overflow:hidden;
	text-decoration:none;
	color:inherit;
}
.selection>a.active{
	border-style:solid;
	border-color:var(--color);
	opacity:1;
}

.selection.link h1,.selection.link i{color:var(--color);}
.selection.link>a{
	border:solid 2px #FFF;
    background-color: #FFF;
    box-shadow: 0 6px 13px rgba(0,0,0,.06);	
	transition:0.2s;
}
.selection.link>a:hover{
	border-color:var(--color);
}
.selection i{
	font-size:calc(30px + 1vw);
}
.detail{
	max-width: 400px;
    margin: 0 auto;
}
.detail h2{
	color:var(--color);
	border-top: solid 1px #eee;
    margin-top: 10px;
    padding-top: 12px;
}
.detail .item{padding:8px;}
.detail .item>label{float:right;color:#000;}


.colordot{
		display:inline-block;
		box-shadow:0 1px 5px rgba(0,0,0,.15);
		width:22px;
		height:22px;
		margin:5px;
		border-radius:20px;
		vertical-align: middle;
}
.spreadsheet{position:relative;}
.spreadsheet .headings{
	padding-right: 78px;	
}
.spreadsheet .headings>div{
	
	background: #ebf5fb;
    border-radius: 99px;
    text-align: center;
    padding: 4px 0;
    margin: 0 6px;
	
}

.spreadsheet .rows>div{transition:0.2s;}

.spreadsheet .rows .input{
	border:0;
	border-radius:0;
	box-shadow:0 0 0 1px #d6e7f0;
}

.spreadsheet .rows>div.empty{opacity:0.5;}
.spreadsheet .rows>div.empty a{opacity:0;pointer-events:none;}

.spreadsheet .indicator{
	border:solid 2px var(--color);
	position:absolute;
	z-index:1000;
	pointer-events:none;
	transition:0.2s;
}

.spreadsheet .input.invalid{
	box-shadow: 0 0 0 1px red;
    z-index: 1;
    position: relative;
}

.spreadsheet .textarea-cont{height:45px;}
.spreadsheet textarea{
	position:absolute;
	left:0;
	top:0;
	height:45px;
}

.spreadsheet textarea:focus{
	height:100px;
	z-index:100;
}

@media screen and (min-width:991px){
	.hide{
		display:none;
	}
}
@media screen and (max-width:990px){
	.justify:not(.small):not(.tiny),.justify-fill:not(.small):not(.tiny){
		display:block;
		margin-left:0;
		margin-right:0;
	}
	.justify-fill:not(.small):not(.tiny)>*{width:100%!important;margin:15px 0;}
	.hide-small{
		display:none;
	}
}
@media screen and (max-width:768px){
	.justify:not(.tiny),.justify-fill:not(.tiny){
		display:block;
		margin-left:0;
		margin-right:0;
	}
	.justify-fill:not(.tiny)>*{width:auto!important;}
	.fill-small{
		width:100%;
		display:block;
		text-align:center;
	}
	.hide-tiny{
		display:none;
	}
}@font-face {
  font-family: "dripicons-v2";
  src:url("/assets/fonts/dripicons-v2.eot");
  src:url("/assets/fonts/dripicons-v2.eot?#iefix") format("embedded-opentype"),
    url("/assets/fonts/dripicons-v2.woff") format("woff"),
    url("/assets/fonts/dripicons-v2.ttf") format("truetype"),
    url("/assets/fonts/dripicons-v2.svg#dripicons-v2") format("svg");
  font-weight: normal;
  font-style: normal;
}
i{
	font-family: "dripicons-v2" !important;
	font-style: normal;
	vertical-align: middle;
}
.disabled{
	opacity:0.3;
	pointer-events:none;
	cursor:not-allowed;
}
form.disabled{opacity:0.8;}

a.inline{
	cursor:pointer;
	color:var(--color);
	font-size:11px;
	text-transform: uppercase;
}

.color-text{
	color:var(--color);
}
.text-success{
	color:var(--accent);
}
.text-danger{
	color:red;
}

.pa{padding-left:5px;padding-right:5px;box-sizing: border-box;}

.mt1{margin-top:5px;}
.mt2{margin-top:15px;}

.mb1{margin-bottom:5px;}
.mb2{margin-bottom:15px;}
.mb3{margin-bottom:30px;}
.mb4{margin-bottom:45px;}

.mh1{margin-left:5px;margin-right:5px;}
.mh2{margin-left:15px;margin-right:15px;}

.text-right{text-align:right;}
.text-center{text-align:center;}
.text-left{text-align:left;}

h1,h2,h3,h4{margin:0;font-weight:normal;}

.relative{position:relative;}

.fill{width:100%;}@keyframes spin {from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.loader{
	background-color:inherit;
}
.loader>.cover{
	background-color:inherit;
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index: 1;
	opacity:0.7;
}
.loader>.circle{
    content: "";
    margin: 0 auto;
    width: 30px;
    height: 30px;
    height: 30px;
    border-radius: 30px;
    border: solid 2px rgba(0,0,0,.1);
    border-top-color: var(--color);
    animation: spin 1.5s linear infinite;
    position: absolute;
    right: 0;
    left: 0;
    top: calc(50% - 15px);
	z-index: 2;
}
.btn .loader{
	min-height:0;
}
.btn .loader>.circle,
h1 .loader>.circle,
h2 .loader>.circle{
	margin:0 auto;
	width:20px;
	height:20px;
	top: calc(50% - 11px);
}
.btn.tiny .loader>.circle{
	width: 11px;
    height: 11px;
    top: calc(50% - 8px);
}
.btn.solid .loader>.circle,
.card.total .loader>.circle{border-top-color:#FFF;}

.datatable .loader{
	width:0!important;
	margin:0!important;
	background:#FFF;
}

.chart{
	min-height:300px;
	margin:20px 0;
}

.list a{
	padding: 8px 11px;
    display: block;
    position: relative;
    text-decoration: none;
    color: inherit;
    text-align: left;
	overflow:hidden;
	transition:0.2s;
	margin:2px;
	border-radius:5px;
	cursor:pointer;
	white-space: nowrap;
}
.list a:hover{
	background-color:#eff1f7;
}
.list a>i{
	margin-right: 11px;
	vertical-align: top;
}

.listed>div{padding:10px;border-bottom:solid 1px #eee;transition:0.2s;}

.listed.has-click>div:hover{
	background-color:#F5F5F5;
	cursor:pointer;
}

.datepicker{
	width:350px;
	text-align:center;
}
.datepicker .header>a{
	
	padding:6px 0;
	margin:2px 0;
	cursor:pointer;
	border-radius:5px;
	transition:0.2s;
	overflow:hidden;
	user-select:none;
	-ms-user-select: none;
	position:relative;
}
.datepicker .grid>div{
	width:14.28%;
	display:inline-block;
	vertical-align:top;
	text-align:center;
	padding: 8px 0px;
	cursor:pointer;
	overflow:hidden;
	user-select:none;
	-ms-user-select: none;
	position:relative;	
	transition:0.2s;
	border-radius:5px;
}
.datepicker .header>a:hover,.datepicker .grid>div:hover,.datepicker .timepicker .arrows>a:hover{
	background-color:#eee;
}
.datepicker .grid>div.active{
	background-color:#03a9f4;
	background-color:var(--color);
	color:#FFF;
	box-shadow:0 2px 5px rgba(0,0,0,.1);
}
.datepicker .grid>div.locked{
	pointer-events:none;
	opacity:0.3;
}
.datepicker .clock>.slide_container{
	width:30px;
	background-color: #eee;
    border-radius: 5px;
}
.datepicker .clock>.slide_container>div{
	position:absolute;
	top:0;
	cursor: move;cursor: grab;cursor: -moz-grab;cursor: -webkit-grab;
	user-select:none;
	-ms-user-select: none;
}
.datepicker .clock>.slide_container,.datepicker .clock>span{
	height: 21px;
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    padding: 4px;
}
.datepicker .timepicker{
    overflow: hidden;
	line-height:1;
}
.datepicker .timepicker .slide_container>div>div{
	padding: 7px 0;
    width: 30px;
    height: 16px;
}
.datepicker .timepicker .arrows{
	height:35px;
}
.datepicker .timepicker .arrows>a{
	padding: 5px 10px;
    display: inline-block;
    margin: 0px 8px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 16px;
	user-select:none;
	-ms-user-select: none;
}
.datepicker .clock{
    overflow: hidden;
	position: relative;	
    padding: 102px 0;
    text-align: center;	
}

.multidates{
	width:100%;
}

.multidates .header .btn{width:100px;}

.multidates .grid{
	border: solid 0 #d2e1eb;
    border-width: 0 1px 1px 0;
}
.multidates .grid>div{
    height: 88px;
    border: solid 0 #d2e1eb;
    border-width: 1px 0px 0px 1px;
    border-radius: 0;
	width: calc(14.28% - 1px);	
}
.multidates .grid>div>span{
	display:block;
	background-color:rgb(4,169,244);
	background-color:var(--color);
	text-align:center;
	border-radius:5px;
	padding:4px;
	color:#FFF;
	margin:4px;
	box-shadow: 0 3px 6px rgba(0,0,0,.1);
}
.multidates .grid>div>span.soldout{opacity:0.6;}

.multidates .grid>.head{
	height:20px;
	font-weight:bold;
	pointer-events:none;
}
.multidates .grid>.subtle{
	pointer-events:none;
}
.daterangepicker{
	background-color:#FFF;
	border-radius:7px;
	border:solid 1px #d6e7f0;
	cursor:pointer;
}
.daterangepicker.daterange{
	max-width: 300px;
	display: flex;
	margin-left:auto;
	margin-right:auto;
	justify-content: space-between;
}
.daterangepicker>a{
	font-size: 21px;
    margin: 12px 6px 0 6px;
    display: block;
}
.daterangepicker>div{
	width:100%;
	padding:10px 24px;
}
.daterangepicker>div>div{color:#000;}
.daterangepicker>.end{
	text-align:right;
	padding-right:15px;
	border-right:solid 1px #e1ecf2;
}
.daterangepicker.timeid{
	padding: 6px;
}
.daterangepicker.timeid .label{
	margin:4px;
}
.daterange_drop{
	width:100%;
	max-width:340px;
	margin-left: -19px;
	margin-top:-16px;
}
.daterange_drop>.input{
	padding:0;
	display: flex;
	justify-content: space-between;
	overflow:hidden;
	position: relative;
	padding-left:12px;
}
.daterange_drop>.input>div{width: 50%;}
.daterange_drop>.input small{
	position:absolute;
	margin-top:5px;
	margin-left:5px;
	pointer-events:none;
}
.daterange_drop>.input input{
	padding:22px 6px 9px 6px;
	border:0;
}
.daterange_drop>.input>.end>small{
	right:18px;
}
.daterange_drop>.input>.end>input{text-align:right;}
.daterange_drop>.list>a.active{
	color:var(--color);
}
.daterange_drop>.list>a.active:after{
	color:var(--color);
	content:"S";
	font-family: "dripicons-v2" !important;
	right: 10px;
    position: absolute;
}
.dialog{
	transition:0.2s;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    position: fixed;
	background: rgba(0,0,0,.7);
	background: radial-gradient(ellipse at center,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.7) 100%);
    z-index: 1000;
    display: flex;
    justify-content: center;
}
.dialog.out{
	transform:scale(1)!important;
}
.dialog>div{
	align-self: center;
	width:100%;
	overflow-y: scroll;
    max-height: 100%;
}
.dialog .btn{
	-webkit-transform: translate3d(0, 0, 0);
}
.input.copy{color:var(--color);cursor:pointer;padding-right:47px;word-wrap:break-word;}
.input.copy + .btn{
    position: absolute;
    padding: 4px 11px;
    font-size: 7pt;
    top: 50%;
    right: 0;
    margin-top: -11px;
    background-color: transparent;
}
@media screen and (max-width:768px){
	.input.copy{padding-right:25px;}
}.editlist{
	margin-bottom:8px;
	background-color:#FFF;
	box-shadow:0 2px 8px rgba(0,0,0,.1);
	border-radius:5px;
	padding:12px;
}
.drag-handle {
    background: URL(/assets/img/draghandle.svg) no-repeat;
    display: inline-block;
    width: 11px;
    height: 30px;
    padding: 8px;
    background-position: center;
	cursor: move;
    cursor: grab;cursor: -moz-grab;cursor: -webkit-grab;
}
.editlist .options{
	width:auto;
}
.editlist .options>.btn{
	align-self: center;
	padding: 14px;
}
.editlist .options .main-option>i{
	transform:rotate(90deg);
	font-size:20px;
	display:block;
}
.dragging-placeholder{
	border:dashed 2px #dcdfed;
	margin:5px 0;
	background:#eff1f7;
}
.dragging{
	position:absolute!important;
	pointer-events:none;
	width:600px;
	opacity:0.7;
	transition:0s!important;
}

a.status>i{
    width: 7px;
    height: 7px;
    border-radius: 10px;
    background-color: attr(data-color);
    position: absolute;
    margin-top: 4px;
    left:9px;
}
a.status{
	padding-left: 25px!important;
	width:115px;
}.report-item>div>div{
	width:100%;
}
.report-item>div>div .panel-right{
	border-right:solid 1px #eee;
}
.report-item strong{
	display:block;
}.tagbox .tag-list{
	padding:8px;
	border:solid 1px #d6e7f0;
	border-radius:5px;
	min-height: 100px;
}
.tagbox .tag-list>.label{margin:5px;cursor:pointer;}

.tagbox .pallet>div{
	width:30px;
	height:30px;
	border-radius:5px;
	border:solid 1px #d6e7f0;
	margin:3px;
	display:inline-block;
	cursor:pointer;
}

.tagbox .pallet>div.selected:after{
    content: "S";
    font-family: "dripicons-v2" !important;
    color: #FFF;
    position: absolute;
    font-size: 20px;
    margin-left: 5px;
    margin-top: 2px;
}

.tagbox .tag{
	display:inline-block;
	border-radius:4px;
	margin:3px;
	overflow:hidden;
}
.tagbox .tag>a,.tagbox .tag>span{
	display:inline-block;
	padding:3px 6px;
	border-right:solid 1px;
}
.tagbox .tag>a{
	cursor:pointer;
	transition:0.2s;
	background-color:rgba(0,0,0,0);
}
.tagbox .tag>*:last-child{border:0;}
.tagbox .tag>a:hover{
	background-color:rgba(0,0,0,.05);
}

.tagbox .tag a.drag{
	cursor:move;
	cursor:grab;
}

.tagboxbtn>.tagbox{
	display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    margin-top: -3px;
}