/*CSS THAT IS SHARED BETWEEN AUTHORING AND THE AUTHORING STAGE. The purpose is to include helper classes that exist in both*/
@import url("./common.css");
/*Tree tab and sub tab list css */
@import url("./ui/tree-tabs.css");

@import url("../includes/js/external/jquery/select2/css/select2.min.css");

/* Global Reset
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*/
@font-face{ 
	font-family: "Open Sans";
	src: url("../includes/fonts/OpenSans-Regular.ttf");
}
*:not([contenteditable]):not(input):not(textarea){
	user-select: none;
}
.user-selectable,
.user-selectableContainer *{
	user-select: text !important;
}
html {color:#333;font-family:'Open Sans';font-size:12px;background-repeat:repeat;height:100%;width:100%;}
html, body {
	background-color: #f2f2f2;
}		

.topBlackBarLink{
	height: 50px;
	line-height: 50px;
	vertical-align: middle;
	border-left: 1px solid #333;
	width: 130px;
	text-align: center;
	text-decoration: none;
	cursor:pointer;
	color: white !important;
	text-decoration:none !important;	
}

/*body {height:100%;width:100%;}*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,hr {
	margin:0;
	padding:0;	
}
li {list-style:none}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img, button {
	border:0;
	background: none repeat scroll 0 0 transparent;
}
address,caption,cite,code,dfn,em,strong,th,var,optgroup {}
del,ins {text-decoration:none;}
caption,th {}h1,h2,h3,h4,h5,h6 {font-weight: normal;}
q:before,q:after {content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup {vertical-align:baseline;}
sub {vertical-align:baseline;}
legend {color:#333333;}
input,button,textarea,select,optgroup,option {font-family:'Open Sans'}
input,button,textarea,select {outline:none!important;}
div fieldset legend {
	font-size:12px;
	margin-bottom:5px;
}
/* Stops iframes from having weird margining issues caused by being inline elements*/
iframe { display:block; }

.logo_flow,
.logo_claro,
.logo_mobile,
.logo_capture,
.logo_convey{
	background-image: url(../images/loginscreen/logosSprite.png);
	background-repeat: no-repeat;
	width: 45px; 
	height: 45px;
	display: inline-block;
	margin-left: 10px;
	opacity: 0.75;
	display: none;
}

.logo_flow{
	background-position: -45px 0px;
}

.logo_claro{
	background-position: -45px -45px;
}

.logo_capture{
	background-position: -45px -90px;
}

.logo_mobile{
	background-position: -45px -135px;
}

.logo_convey{
	background-position: -45px -180px;
}

.logo_flow.on{
	background-position: 0px 0px;
	opacity: 1;
}

.logo_claro.on{
	background-position: 0px -45px;
	opacity: 1;
}

.logo_capture.on{
	background-position: 0px -90px;
	opacity: 1;
}

.logo_mobile.on{
	background-position: 0px -135px;
	opacity: 1;
}

.logo_convey.on{
	background-position: 0px -180px;
	opacity: 1;
}

textarea {
	resize: none;
}
.cke_skin_kama, .cke_skin_kama * {
   outline: none !important;
}
/* Google Translate */
.goog-te-banner-frame{display:none !important;}
/* FOR translate.clarolive.com
.goog-tooltip {
    display: block !important;
}
.goog-tooltip:hover {
    display: block !important;
}
*/
.goog-tooltip {
    display: none !important;
}
.goog-tooltip:hover {
    display: none !important;
}
.goog-text-highlight {
    background-color: transparent !important;
    border: none !important; 
    box-shadow: none !important;
}
body{top:0px !important;}
/* end google translate */
.clearfix:before,
.clearfix:after{
  display: table;
  content: " ";
}
.clearfix:after,
.container:after{
  clear: both;
}

/* End Global Reset */
/* LCMS Styles 
==================================
dominKnow LCMS

Created, Designed and Developed by dominKnow Inc
Graphics By dominKnow Inc
www.dominKnow.com

Version Info: see app_version.cfm
Copyright 2010 dominKnow Inc
==================================== */

.selectedTab { background-color : #f4f4f4;  color : #f4f4f4;border-left:1px solid black;border-top:1px solid black;font-weight:bold;text-transform:capitalize;float:left;height:20px;}
.notSelectedTab {  background-color : #FFFFFF;  color : #FFFFFF;border-bottom:1px solid black;border-left:1px solid black;border-top:1px solid black;font-weight:bold;text-transform:capitalize;float:left;height:20px;}

/* reference section sub tab styles */
TD.selectedTab { background-color : #f4f4f4;  color : #f4f4f4;}
TD.darkBorder {  background-color : #000000;  color : #000000;}
TD.lightBorder {  background-color : #f4f4f4;  color : #f4f4f4;}
TD.notSelectedTab {  background-color : #FFFFFF;  color : #FFFFFF;}

/* end referece styles */

/* Student side row colors */
TR.tableheaderColor { background-color: #f4f4f4;}
TR.alternateRowColor { background-color: #f4f4f4;}
TR.alternateRowPlain { background-color: #ffffff;}
TR.alternateRowOver { background-color: #fff0f5;}
/* end student row colors */

/* admin row style */
.oddRow {background-color: #ffffff;}
tr.oddRow > td, div.oddRow {padding-top:3px;padding-bottom:3px;padding-left:3px;}
.evenRow {background-color: #f4f4f4;}
tr.evenRow > td, div.evenRow {padding-top:3px;padding-bottom:3px;padding-left:3px;}
tr.selectedRow > td {padding-top:3px;padding-bottom:3px;padding-left:3px;}
tr.hoverRow > td {padding-top:3px;padding-bottom:3px;padding-left:3px;}
thead > tr {background-color: #f4f4f4;}
th.ltext {font-weight:bold;padding-top:3px;padding-bottom:3px;padding-left:3px;}
/* End admin row styles */

/* global table data/form data and element styles */	
.cheader {font-size: 16px; font-style: normal; font-weight: bolder; color: #191970; text-align: center}
.lheader {font-size: 16px; font-style: normal; font-weight: bolder; color: #191970; text-align: left}
.sub_header {font-size: 13px; font-style: normal; font-weight: bolder; color: #191970; text-align: left}
.ltext {font-size: 11px; font-style: normal; font-weight: normal; color: #191970; text-align: left}
.rtext {font-size: 11px; font-style: normal; font-weight: normal; color: #191970; text-align: right}
.ctext {font-size: 11px; font-style: normal; font-weight: normal; color: #191970; text-align: center}

/*Default Claro Header background */
.headerBar {
	height: 20px;
	background-repeat: repeat-x;
	background-image: url("../images/adminicons/navigationMenu/appMenu-headerSlice.png");
	background-position: 0 -1px;
	color: #FFF;
	line-height: 19px;
	padding-left: 5px;
}
/* text box */
INPUT, TEXTAREA, SELECT,  .select2 .select2-selection  {            
	color:#191970;
	font-size:11px;/* NOTE, changing this requires at minimum looking at the select2 declartaion below*/

	border-width:1px;
	border-style: solid;

	border-left-color:#A8BAC2; /* great green-grey: 94A6AE */
	border-top-color:#A8BAC2;

	border-right-color:#DFE5E7;
	border-bottom-color:#DFE5E7;

	/*background: white url(../images/system/inputBackG.gif) top left repeat-x;*/
} 
/*adding here for all lms.css select2 setups to align with selects above.*/
.select2 .select2-selection__rendered {
	padding-left: 3px !important;
	line-height: 18px !important;
	color:#191970 !important;
}
.select2 .select2-selection--multiple .select2-selection__rendered {
	padding-left: 0px !important;
}
.select2 .select2-selection{
	border-left-color:#A8BAC2 !important; /* great green-grey: 94A6AE */
	border-top-color:#A8BAC2 !important;

	border-right-color:#DFE5E7 !important;
	border-bottom-color:#DFE5E7 !important;
}	
.select2 .select2-selection,
.select2 .select2-selection__arrow {
	height: 20px !important;
	border-radius: 0 !important;
}

.select2-container.select2-container--open{
    z-index: 9999999;
}

.select2 .select2-selection.select2-selection--multiple {
	height: auto !important;
}
.select2 .select2-selection.select2-selection--multiple {
	height: auto !important;
}
.select2-container .select2-search--inline .select2-search__field {
	resize: none!important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
	padding-left: 5px!important;
	padding-right: 23px!important;
	background-color: #3b6bfa!important;
    border: 2px solid #3b6bfa!important;
	color: #fff;
	border-radius: 10px;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple .select2-selection__choice {
	padding-left: 5px!important;
	padding-right: 5px!important;
	background-color: #7a7c82!important;
    border: 2px solid #7a7c82!important;
	border-radius: 10px;
	color: #fff;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	left: auto!important;
	right: 0!important;
	border-right: none!important;
	color: #fff!important;
	font-size: 13px!important;
	/*border-left: 1px #fff solid!important;*/
	border-radius: 0px!important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{
	background-color: transparent!important;
	opacity: 1;
}

.select2-container--default.invalid-form-field .select2-selection--single,
.select2-container--default.invalid-form-field .select2-selection--multiple{
	background-color: transparent!important;
	opacity: 1;
}

.select2-container .select2-results__message{
	/*display: none !important;*/
}
.select2 .select2-selection.no-arrow .select2-selection__arrow{
	display: none;
}

.select2 .select2-selection textarea {
	min-height: 18px;
}
/* > .box {font-size: small;} */
/*
.button {
	font-size:11px;
	margin:3px 5px;
	padding:3px 10px;
	text-align:center;
	background:none repeat scroll 0 0 #DCD9DF;
	border:1px solid #A3A3A3;
	color:#555555;
	cursor:pointer;
}
.button:hover {
	color:#333333;
}
*/
/*here*/
.button{	
	margin: 3px 5px;
	padding:3px 10px;
	
    background: #DCD9DF;
    border-color: #DFE5E7 #A8BAC2 #A8BAC2 #DFE5E7; 
    border-radius : 3px;
    
    border-style: solid;
    border-width: 1px;
    color: #555555;
    cursor: pointer;
    font-size: 11px;
    text-align:center;
    
    position:relative;
    display:inline-block;
    
    overflow:visible;
	font-family: Tahoma, Arial;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;    	
	
	filter 			: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#f1f1f1'); 
	background 		: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f1f1f1)); 
	background 		: -moz-linear-gradient(top,  #f6f6f6,  #f1f1f1);
	background      : linear-gradient(to bottom, #f6f6f6, #f1f1f1);  				    
}

.button:hover {
	-ms-filter	: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#adcdea')" ; 
	background 	: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#adcdea)) !important; 
	background 	: -moz-linear-gradient(top,  #f6f6f6,  #adcdea) !important;  
	background      : linear-gradient(to bottom, #f6f6f6, #adcdea);  		
}

.button.disabled-element:hover,
.button.submit-disabled:hover {
	background: #DCD9DF  !important;
	filter 	  : progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#f1f1f1') !important; 
	background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f1f1f1)) !important; 
	background: -moz-linear-gradient(top,  #f6f6f6,  #f1f1f1) !important;	
}

.uvOverlay1 button, .uvOverlay1 button:hover{
	background: none !important;
	border: 0 !important;
	filter: none !important;
}

.uvTitle{
	color: #8E8E8E;
	font-size: 18px !important;
	margin-bottom: 15px !important;
}

.uvSection{
	font-size: 120%;
	color: #292C33;
	margin-bottom: 10px;
}


button.addButton {
	width: 20px;
	margin:0px;
	padding:3px 0px;
}

/*new buttons.. stolen from BS*/
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    margin-left: 5px;
    margin-right: 5px;
}
.btn[disabled]{
	opacity: 0.5;
}
.btn-default {
	color: #333;
    background-color: #fff;
    text-shadow: 0 1px 0 #fff;
    background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
    background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
    background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    background-repeat: repeat-x;
    border-color: #ccc;
}

.btn-pill {
	border-radius : 50px;
	border  : 1px solid #ccc;
	color   : #333;
	padding : 5px 10px;
	cursor : pointer;

}
.btn-pill.selected {
	border-color : transparent;
}

.button.blue,
.btn.blue,
.btn-hoverBlue:hover,
.btn-hoverBlue.selected,
.btn-pill.blue.selected{
	background-color: #2E5379;
	color:white;
}
.button.grey,
.btn.grey,
.btn-hoverGrey:hover,
.btn-hoverGrey.selected,
.btn-pill.grey.selected{
	background-color: #777777;
	color:white;
}

.button.light-grey,
.btn.light-grey,
.btn-hoverLightGrey:hover,
.btn-hoverLightGrey.selected,
.btn-pill.light-grey.selected{
	background-color: #F0F0F0;
	color:#333;
}

html.claro-authoring .button.toolColour,
html.claro-authoring .btn.toolColour,
html.claro-authoring .btn-hoverToolColour:hover,
html.claro-authoring .btn-hoverToolColour.selected,
html.claro-authoring .btn-pill.toolColour.selected{
	background-color: #7D2C2F;
	color:#FFF;
}

html.flow-authoring .button.toolColour,
html.flow-authoring .btn.toolColour,
html.flow-authoring .btn-hoverToolColour:hover,
html.flow-authoring .btn-hoverToolColour.selected,
html.flow-authoring .btn-pill.toolColour.selected{
	background-color: #2D5379;
	color:#FFF;
}



.btn-set .btn {
	margin : 0;
	border-radius : 0;
}
.btn-set.btn-set-border .btn {
	border       : 1px solid #ececec;
	border-left  : none;
	margin-right : -1px;
}

.btn-set .btn:first-child {
	border-left               : 1px solid #ececec;
	border-top-left-radius    : 5px;
	border-bottom-left-radius : 5px;
}

.btn-set .btn:last-child {
	border-top-right-radius    : 5px;
	border-bottom-right-radius : 5px;
}




.fieldLegend {
	color : #616C8E;
	text-decoration: none;
	font-size : 8pt;
	font-weight: bold;
	text-transform: capitalize;
}
.infotitle {  color : #616C8E; text-decoration: none;font-size : 8pt; font-weight: bold;}
.info {  color : #616C8E; text-decoration: none;font-size : 8pt;}
.input_title {font-size: 8pt; font-weight: bold; color: #191970; text-align: center}
.input_titleleft {font-size: 8pt; font-weight: bold; color: #191970; text-align: left}
.input_titleright {font-size: 8pt; font-weight: bold; color: #191970; text-align: right}
.input_subtitle {font-size: 8pt; font-weight: bold; color: gray;}
.myHomeDivSquare {width:250px;height:200px;float:left;margin:10px;}
.myHomeDivRectangle {width:600px;margin:5px;}
/* end global table data/form data and element styles */	


/* Student Tree Styles low speed */
.menuItem {position:absolute; visibility:hidden; left:0px;}
	.menuItem BR { clear: both; }
	
	.node { color: black;
		font-weight : bold;
		font-size : 9pt;}
		
	.node:link { color: black; text-decoration: none; }
	.node:visited { color: black; text-decoration: none; }
	.node:visited:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc;}		
	.node:active { color: black; text-decoration: none; background:#dcdcdc; }
	.node:active:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc; }
	.node:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc; }
	
	.leaf { color: black;
		font-size : 9pt;}
		
	.leaf:link { color: Black; text-decoration: none;}
	.leaf:visited { color: Black; text-decoration: none; }
	.leaf:visited:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc; }
	.leaf:active { color: Black; text-decoration: none; background:#dcdcdc;}
	.leaf:active:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc; }
	.leaf:hover { color: #4682b4; text-decoration: underline; background:#dcdcdc; }
	
	/* v5.0 styles for test menu */
	.testsublinks  {color : #000000;text-decoration: underline;font-size : 8pt;}
	.testsublinks:hover  {color : #616C8E;text-decoration: underline;font-size : 8pt;}
	.testsublinks:visited  {color : #000000;text-decoration: underline;font-size : 8pt;}
	.testsublinks:visited:hover  {color : #616C8E;text-decoration: underline;font-size : 8pt;}	
/* end Student Tree Styles */


/* administrator link styles */
/* v4.01 */
.menulinks  {color : #616C8E;text-decoration: none;font-size : 12pt;}
.menulinks:hover  {color : #616C8E;text-decoration: underline;font-size : 12pt;}
.menulinks:visited  {color : #616C8E;text-decoration: none;font-size : 12pt;}
.menulinks:visited:hover  {color : #616C8E;text-decoration: underline;font-size : 12pt;}

/* v4.03+ */
	.menuHeader  {color : #9CA590;font-weight : normal;font-size : 10pt; cursor:pointer;}
	.menuTitle  {color : #9CA590;font-weight : bold;font-size : 10pt;}
	.menusublinks  {color : #616C8E;text-decoration: none;font-size : 8pt;}
	.menusublinks:hover  {color : #616C8E;text-decoration: underline;font-size : 8pt;}
	.menusublinks:visited  {color : #616C8E;text-decoration: none;font-size : 8pt;}
	.menusublinks:visited:hover  {color : #616C8E;text-decoration: underline;font-size : 8pt;}
	.whitetext  {color : #FFFFFF; font-weight : bold;font-size : 10pt;}
	.whitetext:hover  {color : #616C8E;text-decoration: underline;font-size : 10pt;}
	.whitetext:visited  {color : #FFFFFF;text-decoration: none;font-size : 10pt;}
	.whitetext:visited:hover  {color : #616C8E;text-decoration: underline;font-size : 10pt;}
/* end 4.03 */	

.drag {position:relative;cursor:hand}
.helplinks  {color : #FFFFFF;text-decoration: none;font-size : 10pt;}
.helplinks:hover  {color : #b0c4de;text-decoration: underline;font-size : 10pt;}
.helplinks:visited  {color : #FFFFFF;text-decoration: none;font-size : 10pt;}
.helplinks:visited:hover  {color : #b0c4de;text-decoration: underline;font-size : 10pt;}
.eoproperties {color : #0000cd;	font-size : 10pt;text-decoration: none;}
.eoproperties:hover  {color : #4682b4; font-size : 10pt;text-decoration: underline;}
.eoproperties:visited {color : #0000cd;font-size : 10pt;text-decoration: none;}	
.eoproperties:visited:hover  {color : #4682b4; font-size : 10pt;text-decoration: underline;}
.adminlinks  {color : #0000cd;text-decoration: none;font-size : 12pt;}
.adminlinks:hover  {color : #000000;text-decoration: underline;background-color: #b0c4de;font-size : 12pt;}
.adminlinks:visited  {color : #0000cd;text-decoration: none;font-size : 12pt;}
.adminlinks:visited:hover  {color : #000000;text-decoration: underline;background-color: #b0c4de;font-size : 12pt;}
.hiddenlayers {position:absolute; top:400px; width:200px; left:20px; visibility:hidden;}
/* end admin link styles */

/*Visibility styles */
.invisible {display:none}
.visible {visibility:visible}


/*Theme Button/Rollover Styles */
.mainUIText {font-size: 8pt;color: #000000;text-decoration: none;padding: 1px;}
.mainUITextButtons {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #FFFFFF;}
.mainUITextButtonsOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #f6f2f6;border: 1px solid #aaaaaa;}

.toolbarUITextButtonsGreen {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #FFFFFF;}
.toolbarUITextButtonsGreenOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #f6f2f6;border: 1px solid #BAFF96;}

.toolbarUITextButtonsBlue {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #FFFFFF;}
.toolbarUITextButtonsBlueOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #f6f2f6;border: 1px solid #60CEFF;}

.toolbarUITextButtonsOrange {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #FFFFFF;}
.toolbarUITextButtonsOrangeOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #f6f2f6;border: 1px solid #FFDF60;}

.mainUITextButtonsGreen {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #D5DDDD;}
.mainUITextButtonsGreenOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #DFFFD2;border: 1px solid #BAFF96;}

.mainUITextButtonsBlue {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px;}
.mainUITextButtonsBlueOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #BFE6FF;border: 1px solid #60CEFF;}

.mainUITextButtonsOrange {font-size: 9pt;color: #000000;text-decoration: none;padding: 2px;border: 0px solid #D5DDDD;}
.mainUITextButtonsOrangeOver {font-size: 9pt;color: #000000;text-decoration: none;padding: 1px;background-color: #FFECBF;border: 1px solid #FFDF60;}

.dpDayTD {
	border-bottom: thin solid #f4f4f4;
	border-right: thin solid #f4f4f4;
}
.dpTD {
	cursor:pointer;
	text-align: center;
}
.dpTDOver {
	cursor:pointer;
	background-color:#616C8E;
	color: White;
	text-align: center;
}
.dpTitleTD {
	font-weight: bold;
	text-align: center;
}
.dpTable {
	margin:5px;
	color : #616C8E; 
	text-decoration: none;
	
	font-size : 8pt;
}
.dpDayHighlightTD {
	cursor:pointer;
	text-align: center;
	border:1px solid #616C8E;
	background-color: #f4f4f4;
}

.dpDiv
 {
	background-color: #ffffff;
}
/* Stored for reference
theme=haloGreen
alternatingRowColor1=0xF7F7F7
alternatingRowColor2=0xFFFFFF
selectionColor=0xBAFF96
rollOverColor=0xDFFFD2
gridLineColor=0xD5DDDD

theme=haloBlue
alternatingRowColor1=0xF7F7F7
alternatingRowColor2=0xFFFFFF
selectionColor=0x60CEFF
rollOverColor=0xBFE6FF
gridLineColor=0xD5DDDD

theme=haloOrange
alternatingRowColor1=0xF7F7F7
alternatingRowColor2=0xFFFFFF
selectionColor=0xFFDF60
rollOverColor=0xFFECBF
gridLineColor=0xD5DDDD
*/
/* Styles for tabbed navigation */
li.selectedTab {
	display:inline;
	list-style:none;
	margin-left:10px;
	border-left:1px solid black;
	border-top:1px solid black;
	border-right:1px solid black;
	padding:2px;
	background-color: white;

}
li.unselectedTab {
	display:inline;
	list-style:none;
	margin-left:10px;
	margin-bottom:-1px;
	border-left:1px solid black;
	border-top:1px solid black;
	border-right:1px solid black;
	padding:2px;
	background-color: #f4f4f4;
}
/* class for an hr element used to force floated elements to stay in their container */
hr.floatContain
 {
	display:block;
	clear:both;
	visibility:hidden;
	height:0px;
}
/* Classes used to display alternating containers */

.evenDisplayBox
 {
	background-color: #ffffff;
	border: thin solid #aaaaaa;
	padding:5px;
	margin-bottom:10px;
}

.oddDisplayBox
 {
	background-color: #f4f4f4;
	border: thin solid #aaaaaa;
	padding:5px;
	margin-bottom:10px;
}

a.downloadLink,a.downloadLink:visited
 {
	color:#616C8E;
	text-decoration:none;
	padding-left:20px;
	height:20px;
	display:block;
}
a.downloadLink:hover
 {
	text-decoration:underline;
}
#waitOverlay {height:100%;width:100%;background-image:url(../images/spinner_24.gif);background-repeat:no-repeat;background-position:center center;position:absolute;top:0px;left:0px;
	background-color:#bbbbbb;
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
.spinner{
	background-image:url(../images/spinner_24.gif);
	background-repeat:no-repeat;
	background-position:center center;
}
.spinner.bars{
	background-image:url(../images/spinner_24.gif);
}
.dkiProgressBarStyle
 {
	margin:0; 
	padding:0;
	clear:both;
	background-image:url(../images/progressbar_bg.gif);
	background-repeat:repeat-x;
	background-position:center;
}
/* AJAX notification areas */
div.notify {padding:2px 2px 2px 5px;vertical-align:middle;}
div.notify.success {background:#eeffdd}
div.notify.failure {background:#ffe4c4}

.spacer {
	width:1px;
	height:16px;
	background-image:url(../images/v6/common/spacer.png);
	background-repeat:no-repeat;
	background-position: center center;
	float: left;
	vertical-align: middle;
}	

.spacer.inline{
	float: none;
	display: inline-block;
	margin: 0 3px;
}

.spacer.dark {
	background-image:url(../images/v6/common/spacerDark.png);
}



/* buttons across the system */
#bottomButtonbar{
	bottom:0px;
	position:fixed;
	width:100%;
	background-color:#e9e9e9;
	border-top: 1px solid #ccc;
	box-sizing: border-box;
}


.bottomButtonBar_wrapper {
	bottom:15px;
	right:15px;
	position:absolute;	
	background-color:#e9e9e9;
	border-top: 1px solid #ccc;
	box-sizing: border-box;
}

/*
 * here
 */
.bottomButton {	
	float: right;
	margin: 3px 5px;
	padding:3px 10px;
    background: #DCD9DF;
    border-color: #DFE5E7 #A8BAC2 #A8BAC2 #DFE5E7; 
    border-radius : 3px;
    line-height: 16px;
    border-style: solid;
    border-width: 1px;
    color: #555555;
    cursor: pointer;
    font-size: 11px;
    text-align:center;
    
    position:relative;
    display:inline-block;
    
    overflow:visible;
	font-family: Tahoma, Arial;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;    	
	
	filter 			: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#f1f1f1'); 
	background 		: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f1f1f1)); 
	background 		: -moz-linear-gradient(top,  #f6f6f6,  #f1f1f1);	   				    
}
.bottomButton span{
	padding: 2px 4px 2px 4px
}

.bottomButton:hover {
	-ms-filter	: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#adcdea')" ; 
	background 	: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#adcdea)) !important; 
	background 	: -moz-linear-gradient(top,  #f6f6f6,  #adcdea) !important;  	
}

.bottomButton.disabled-element:hover,.bottomButton.submit-disabled:hover,.bottomButton.disabled:hover{
	background: #DCD9DF  !important;
	filter 	  : progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#f1f1f1') !important; 
	background: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#f1f1f1)) !important; 
	background: -moz-linear-gradient(top,  #f6f6f6,  #f1f1f1) !important;	
}

/*
.bottomButton {	
	float: right;
	font-size:11px;
	margin: 3px 5px;
	padding:3px 10px;
	text-align:center;
	background:none repeat scroll 0 0 #DCD9DF;
	border:1px solid #A3A3A3;
	color:#555555;
	cursor:pointer;
}

.bottomButton:hover {
	color:#333333;
}

*/

.invalid-form-field {
	border: 1px solid #002BA6 !important;
	background-image:none;
	background-color: #D5E3F4 !important;
}

.submit-disabled{
	-moz-opacity:0.5;
	opacity:0.5;
	filter:alpha(opacity=50);
	cursor: default !important;
}

.disabled-element {
	-moz-opacity:0.5;
	opacity:0.5;
	filter:alpha(opacity=50);
}
.disabled-element,
.disabled-element * {
	cursor: default !important;
}

.slider-background {
	width:100px;
	height:20px;
	float:left;
	background-image: url(../images/v6/sliderBack.png);
	background-repeat:repeat-x;
}
.slider-thumb {
	background-image: url(../images/v6/sliderBar.png);
	background-repeat:no-repeat;
	background-position: center center;
	width:8px;
	height:20px;
	
}

.properties-panel {
	font-size:11px;
	color:#666;
	background-color: #f2f2f2;
}

.property-group-header {
	color: #333;
	display:block;
	font-size:12px;
	height:20px;
	padding-top:5px;
	width:100%;
	border-bottom:1px solid #cccccc;
	margin-bottom:5px;
}

.property-group-header span {
	padding-left:5px;
	font-size: 11px;
}

.property-group {
	margin-bottom:5px;
}

.property-group-content {
	padding-left:5px;
	padding-right:5px;
	padding-top:5px;
}

.property-button-bar {
	width: 100%;
	background-color: #e9e9e9;
	box-sizing: border-box;
	border-top: 1px solid #ccc;
}

.property-button-bar button {
	display:inline;
	margin-top:2px;
	margin-bottom:2px;
	margin-right:1px;
	float:right;
}
.property-button-bar:after {
	content:".";
	clear:both;
	display:block;
	height:0;
	visibility:hidden;
}

table.infotable {
	width:100%;
}

table.infotable {
	padding-left:5px;
}

table.infotable tr td {
	vertical-align:top;
	padding:2px 0px 4px 0px;
	font-size:10px;
	padding-right:10px;
}

/*
table.infotable tr:nth-child(odd) {
	background-color:#F2F2F2;
}
*/

table.infotable td:first-child { 
	padding-right:10px;
	padding-left:10px; 
	width:10px;
	white-space:nowrap;
	text-align:right;
}
table.infotable input, table.infotable textarea {
	width:90%;
}

table.infotable tr td input[type=checkbox] {
	width:15px;
}



.dki-helplink {
	display: inline-block;
	width: 16px;
	height: 16px;
	padding: 1px;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url("../images/adminicons/helpOff.png");
	vertical-align: top;
	cursor: pointer;
}

.dki-helplink:hover {
	background-image: url("../images/adminicons/helpOn.png");
}

.dki-helplink.toggled {
	background-image: url("../images/adminicons/helpOn.png");
}

.dki-helpdisplay {		
	border: 1px solid #999;
	box-shadow: 2px 2px 2px #333;
	-webkit-box-shadow: 2px 2px 2px #333;
	-moz-box-shadow: 2px 2px 2px #333;
	background-color: #e2e2e2;	
	max-width: 250px;
	overflow-y: auto;
	font-size: 10px;
	color: #646464;
	padding: 5px;
	text-align: left;
	white-space: normal;
	text-shadow: none;
	position: fixed;
	-moz-opacity:1;
	opacity:1;
	filter:alpha(opacity=100);
}

.dki-helpdisplay hr {
	border-color: #999;
	margin: 0;
	padding: 0;	
}
	
.mask {
	display: none;
	z-index:5000;						
	position:absolute;
	top:0px;
	left:0;
	-moz-opacity:0.6;
	opacity:0.6;
	filter:alpha(opacity=60);
	background-color:#999;
	height:100%;
	width:100%;
}	

.mask.dark{
	background-color:#333;
}

.text-ellipsis{
	overflow-x: hidden;
	text-overflow: ellipsis;
	white-space:nowrap;
	display:block;
}

/**
 * 	ensure all dki-widget elements are hidden by default
 */
dki-widget {
	display:none
}


/**
 * 	WIDGETS.COLOR BASE THEME STYLE
 */
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r1 {margin-bottom:5px}
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r2,
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r3,
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r4,
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r5,
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r6 {margin-top:0px;margin-bottom:0px}
.dki-color-menu .dki-menu-sctn .dki-theme-standard div.r6 {margin-bottom:5px}

.dki-theme-standard .c-1 {background-color:#ffffff}
.dki-theme-standard .c-2 {background-color:#000000} 
.dki-theme-standard .c-3 {background-color:#eeece1} 
.dki-theme-standard .c-4 {background-color:#1f497d} 
.dki-theme-standard .c-5 {background-color:#4f81bd} 
.dki-theme-standard .c-6 {background-color:#c0504d} 
.dki-theme-standard .c-7 {background-color:#9bbb59} 
.dki-theme-standard .c-8 {background-color:#8064a2} 
.dki-theme-standard .c-9 {background-color:#4bacc6} 
.dki-theme-standard .c-10 {background-color:#f79646}

.dki-theme-standard .c-11 {background-color:#f2f2f2} 
.dki-theme-standard .c-12 {background-color:#7f7f7f} 
.dki-theme-standard .c-13 {background-color:#ddd9c3} 
.dki-theme-standard .c-14 {background-color:#c6d9f0} 
.dki-theme-standard .c-15 {background-color:#dbe5f1} 
.dki-theme-standard .c-16 {background-color:#f2dcdb} 
.dki-theme-standard .c-17 {background-color:#ebf1dd} 
.dki-theme-standard .c-18 {background-color:#e5e0ec} 
.dki-theme-standard .c-19 {background-color:#dbeef3} 
.dki-theme-standard .c-20 {background-color:#fdeada}

.dki-theme-standard .c-21 {background-color:#d8d8d8} 
.dki-theme-standard .c-22 {background-color:#595959} 
.dki-theme-standard .c-23 {background-color:#c4bd97} 
.dki-theme-standard .c-24 {background-color:#8db3e2} 
.dki-theme-standard .c-25 {background-color:#b8cce4} 
.dki-theme-standard .c-26 {background-color:#e5b9b7} 
.dki-theme-standard .c-27 {background-color:#d7e3bc} 
.dki-theme-standard .c-28 {background-color:#ccc1d9} 
.dki-theme-standard .c-29 {background-color:#b7dde8} 
.dki-theme-standard .c-30 {background-color:#fbd5b5}

.dki-theme-standard .c-31 {background-color:#bfbfbf} 
.dki-theme-standard .c-32 {background-color:#3f3f3f} 
.dki-theme-standard .c-33 {background-color:#938953} 
.dki-theme-standard .c-34 {background-color:#548dd4} 
.dki-theme-standard .c-35 {background-color:#95b3d7} 
.dki-theme-standard .c-36 {background-color:#d99694} 
.dki-theme-standard .c-37 {background-color:#c3d69b} 
.dki-theme-standard .c-38 {background-color:#b2a1c7} 
.dki-theme-standard .c-39 {background-color:#92cddc} 
.dki-theme-standard .c-40 {background-color:#fac08f}

.dki-theme-standard .c-41 {background-color:#a5a5a5} 
.dki-theme-standard .c-42 {background-color:#262626} 
.dki-theme-standard .c-43 {background-color:#494429} 
.dki-theme-standard .c-44 {background-color:#17365d} 
.dki-theme-standard .c-45 {background-color:#366092} 
.dki-theme-standard .c-46 {background-color:#953734} 
.dki-theme-standard .c-47 {background-color:#76923c} 
.dki-theme-standard .c-48 {background-color:#5f497a} 
.dki-theme-standard .c-49 {background-color:#31859b} 
.dki-theme-standard .c-50 {background-color:#e36c09}

.dki-theme-standard .c-51 {background-color:#7f7f7f} 
.dki-theme-standard .c-52 {background-color:#0c0c0c} 
.dki-theme-standard .c-53 {background-color:#1d1b10} 
.dki-theme-standard .c-54 {background-color:#0f243e} 
.dki-theme-standard .c-55 {background-color:#244061} 
.dki-theme-standard .c-56 {background-color:#632423} 
.dki-theme-standard .c-57 {background-color:#4f6128} 
.dki-theme-standard .c-58 {background-color:#3f3151} 
.dki-theme-standard .c-59 {background-color:#205867} 
.dki-theme-standard .c-60 {background-color:#974806}	

.dki-standard-standard .c-1 {background-color:#ffffff} 
.dki-standard-standard .c-2 {background-color:#000000}
.dki-standard-standard .c-3 {background-color:#c00000}
.dki-standard-standard .c-4 {background-color:#ff0000}
.dki-standard-standard .c-5 {background-color:#ffc000}
.dki-standard-standard .c-6 {background-color:#ffff00}
.dki-standard-standard .c-7 {background-color:#92d050}
.dki-standard-standard .c-8 {background-color:#00b050}
.dki-standard-standard .c-9 {background-color:#00b0f0}
.dki-standard-standard .c-10 {background-color:#0070c0}
.dki-standard-standard .c-11 {background-color:#002060}
.dki-standard-standard .c-12 {background-color:#7030a0}


.dki-theme-test .c-1 {background-color:#ffffff} 
.dki-theme-test .c-2 {background-color:#000000} 
.dki-theme-test .c-3 {background-color:#7f7f7f} 
.dki-theme-test .c-4 {background-color:#0c0c0c} 
.dki-theme-test .c-5 {background-color:#1d1b10} 
.dki-theme-test .c-6 {background-color:#0f243e} 
.dki-theme-test .c-7 {background-color:#244061} 
.dki-theme-test .c-8 {background-color:#632423} 
.dki-theme-test .c-9 {background-color:#4f6128} 
.dki-theme-test .c-10 {background-color:#3f3151} 
.dki-theme-test .c-11 {background-color:#205867} 
.dki-theme-test .c-12 {background-color:#974806}	

/**
 * 	Apply to make element contents none selectedable
 */
.dki-noSelect {
    user-select 			: none; 
    -moz-user-select 		: -moz-none; 
    -khtml-user-select 		: none; 
    -webkit-user-select 	: none; 
    -o-user-select 			: none; 	
}
.xdki-noSelect input, .xdki-noSelect textarea, .xdki-fullselect{
	-moz-user-select 		: text !important;
}

/*
 * This is required for chrome otherwise it gets fubared but this may shoot me in the foot :-()
 */
#admin-authoring-tool-frame-wrap{
    user-select 			: none; 
    -moz-user-select 		: none; 
    -khtml-user-select 		: none; 
    -webkit-user-select 	: none; 
    -o-user-select 			: none; 		
}
#admin-authoring-tool{
    user-select 			: none; 
    -moz-user-select 		: none; 
    -khtml-user-select 		: none; 
    -webkit-user-select 	: none; 
    -o-user-select 			: none; 		
}
/*
 * Special css for html upload widget window in the asset manager. Since all windows are top level, the css for this particular window must reside here
 */
.uploadWindow .dki-body{
	color: #646464;
	background-color: #E5E5E5 !important;
	font-size: 10px;
	text-align: right;
}
.uploadWindow .dki-body p,.uploadWindow .dki-body input, .uploadWindow .dki-body textarea{
	padding-right : 10px;
	width : 75px;
	float : left;
	margin : 10px 0px 10px 5px;
}
.dki-text-style-bold{
	font-weight: bold;
}

.dki-text-style-italic{
	font-style: italic;
}

.dki-text-style-underline{
	text-decoration: underline;
}

.dki-text-style-strike{
	text-decoration: line-through;
}


/*
 * Following are used for the html 5 uploader
 */
.htmlUploader {
	position: absolute;
	cursor: pointer;
	top: 0px;
	right: 0px;
	left: 0px;
	bottom: 0px;
	cursor:pointer
}

.htmlUploader input{
	position:absolute;
	left:0px;
	top:0px;
	bottom:0px;
	right:0px;
	cursor:pointer;
	opacity:0;
	width:100%;
}

/*
 * standard css styles for modal 3 column FIXED layout
 */
.dki-3Col-fixed {}

.dki-3Col-fixed .dki-left{
	position:absolute !important;
	top:0px;
	left:0px;
	bottom:0px;
	width:200px;
	border-right:1px solid #e0e0e0;
	overflow:hidden
}

.dki-3Col-fixed .dki-left .section-title{
	border-bottom: 1px solid #AAA;
	margin-top:5px;
	margin-bottom:2px;
	padding:0px;
}
.dki-3Col-fixed .dki-left .action-items {
	padding : 2px 2px 2px 0px
}

.dki-3Col-fixed .dki-left .filter-items{
	padding:5px
}

.dki-3Col-fixed .dki-left .action-items .btn-Simple{
	border : none;
	display : block;
	margin : 0px;
	background : none
}

.dki-3Col-fixed .dki-mid{
	position:absolute !important;
	top:0px;
	left:200px;
	bottom:0px;
	right:200px	;
	overflow:hidden;
	border-left:1px solid #AAA
}
.dki-3Col-fixed .dki-mid .top-bar{
	position : absolute;
	left : 0px;
	right : 0px;
	top : 0px;
	height : 20px;
	text-align: left;
	padding-top:4px;
	padding-left:4px;
}

.dki-3Col-fixed .dki-mid .list{
	position : absolute;
	left : 0px;
	right : 0px;
	top : 26px;
	bottom : 0px;
	border-right:1px solid #AAA;
	width: inherit !important;
	background-image:url("../images/v6/table_headerBack.gif");
	background-repeat:repeat-x;
	background-position:0px 0px
}

.dki-3Col-fixed .dki-mid .list div.list-row-wrapper.header{
	width:100% !important;
	white-space : nowrap
}


.dki-3Col-fixed .dki-mid .list div.data-list-wrapper{
	overflow-x: hidden;
	position: absolute;
	top: 22px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	overflow-y: auto;
	height: inherit !important;
	width: inherit !important;
}

.dki-3Col-fixed .dki-mid .list div.list-row-wrapper.header div.list-column-header{
	float: none !important;
	display:inline-block
}



.dki-3Col-fixed .dki-right{
	position:absolute !important;
	top:0px;
	right:0px;
	bottom:0px;
	width:200px;
	overflow:hidden	
}


.dki-3Col-fixed .dki-right .top-bar{
	position:absolute;
	top:0px;
	right:0px;
	left:0px;
	bottom:40px;
	overflow-y: auto !important;
}
.dki-3Col-fixed .dki-right .top-bar div.dki-container{
	margin: 0px 0px 0px 0px !important
}

.dki-3Col-fixed .dki-right .top-bar .tab-btns{
	padding-top:4px
}
.dki-3Col-fixed .dki-right .top-bar .tabContent{
	position: absolute;
	top: 27px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	padding-top: 5px;
}

.dki-3Col-fixed .dki-right .top-bar .tab-btns ul.dkiTabSet{
	background-image : none;
	border-bottom:1px solid #AAA;
}
.dki-3Col-fixed .dki-right .top-bar .tab-btns ul.dkiTabSet li.selected{
	padding-top:1px
}

.dki-3Col-fixed .dki-right .buttonContainer{
	position:absolute;
	bottom:0px;
	right:0px;
	left: 0px;
	height:40px;
	text-align: right;
	padding-top:2px
}

/*
.dki-3Col-fixed .dki-right .prop{
	display:block;
	position:relative;
	margin-bottom:10px
}
.dki-3Col-fixed .dki-right .prop .key{
	width: 70px;
	position: absolute;
	display: inline-block;
	top: 0px;
	left: 0px;
}
.dki-3Col-fixed .dki-right .prop .value{
	position:relative;
	display:inline-block;
	padding-left:75px;
}
*/
.dki-3Col-fixed .dki-right .tab-details .btns{
	margin:15px 5px 5px 5px;
	text-align:center
}
.dki-3Col-fixed.flex .panelContainer {
	overflow-y : hidden;
}


.dki-3Col-fixed.flex  > *:not(.container-close),
.dki-3Col-fixed.flex .panelContainer > *,
.dki-3Col-fixed.flex .list > *{
	position : static !important;
}

.dki-3Col-fixed.flex .list {
	display        : flex;
	flex-direction : column;
	position       : relative !important;
	top            : 0;
	width          : 100% !important;
	height         : 100%;
}

.dki-3Col-fixed.flex .dki-mid .list div.data-list-wrapper {
	flex       : 1 0 auto;
	height     : 0px !important;
}

.dki-3Col-fixed.flex .dki-left,
.dki-3Col-fixed.flex .dki-right {
	padding  : 0 10px;
}
.dki-3Col-fixed.flex .dki-right {
	flex     : 0 0 250px;
	-ms-flex : 0 0 250px;	
}
.dki-3Col-fixed.flex .dki-left {
	flex     : 0 0 200px;
	-ms-flex : 0 0 200px;
}

/*
 * Standard form layout variables 
 */
.dki-editForm fieldset{
	border: 1px solid #AAA;
	padding: 10px;
	margin: 0 auto;	
}

.dki-editForm .field{
	display:block;
	position:relative;
	margin-bottom:10px;	
}

.dki-editForm .field .fieldName{
	width: 110px;
	position: absolute;
	display: inline-block;
	top: 0px;
	left: 0px;
}

.dki-editForm .field .fieldValue{
	position:relative;
	display:inline-block;
	left:115px;
}

/*
 * Styles Ribbon menu
 */
.dki-styles-checked{
	font-weight:bold;
}

.ui-resizable-handle{
	position: absolute;
	width: 16px;
	height: 16px;
}
.ui-resizable-se{
	right: 0px;
	bottom: 0px;
}
.ui-resizable-n{
	top: 0px;
	width: 100%;
	cursor: ns-resize;	
}
.ui-resizable-s{
	bottom: 0px;
	width: 100%;
	cursor: ns-resize;	
}
.ui-resizable-e{
	right: 0px;
	height: 100%;
	cursor: ew-resize;	
}
.ui-resizable-w{
	left: 0px;
	height: 100%;
	cursor: ew-resize;	
}

.ui-sortable-placeholder{	
	box-sizing: border-box;
	border-width: 1px;
	border-color: #efefef;
	border-style: solid;	
	background-color: #dcdcdc;
	visibility: visible;
	opacity: 0.5;
	z-index: 1010101010;
}

.ui-sortable-helper{
	opacity: 0.7;
}

.element-previewer{
	position: relative;
}

.element-previewer iframe{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	width: 100%;
	height: 100%;
}

.flatList>div{
	padding:10px 15px;
	width:92%;
	border: 1px solid #ddd;
	margin-top:-1px;
	position:relative;
	font-size:16px;
}
.flatList .inp{
	display:block;
	overflow:hidden;
	padding:2px;
}
.flatList input{
	border:none;
	position:relative;
	z-index:0;
	color:#000;
	opacity:0.7;
	font-size:16px;
	display:block;
	width:100%;
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.flatList .write{
	z-index:2;	
}

.flatList input.write:focus{
	border: 2px solid #F1CA7F !important;
	margin:-2px;
}
.flatList .dragmask{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:1;
}

.flatList i.fa{
	z-index:4;
	cursor:pointer;
	margin-top:2px;
}
.flatList i.fa-circle{
	font-size: 0.7em;
	transform: translateY(4px);
}
.flatList i.itemIco{
	margin-right:10px;
	position:relative;
	float:left;
}
#menuEdit_list.flatList i.itemIco{
	font-size: 1.5em;
	margin-top: 10px;
}
#menuEdit_list.flatList i.fa-circle{
	font-size: 1em;
	transform: translateY(4px);
}
.flatList span.itemNumberIcon{
	margin-right:10px;
	position:relative;
	float:left;
}
.flatList>div:hover i.delete{
	display:block;
	position:relative;
}

.flatList i.delete{
	float:right;
	display:none;
	cursor:pointer;
	margin-left:10px;
}
#menuEditWindow .flatList>div {
    padding: 10px;
    width: calc(100% - 25px);
    border: 1px solid #ddd;
    margin-top: 6px;
    position: relative;
    font-size: 16px;
}
#menuEditWindow .flatList>div i.delete{
	display: block;
    position: absolute;
    top: -5px;
    right: -6px;
    margin: 0;
    color: #555;
    font-size: 17px;
    background-color: #fff;
}
#menuEditWindow .flatList span.itemNumberIcon {
	top: 12px;
}
#menuEditWindow .item:hover {
    background-color: transparent;
}
#menuEditWindow .item {
	cursor: grab;
}
.flatList .addItem{
	border:none;
	cursor:pointer;
}

.flatList.ico-hidden i {
	visibility:hidden;
	display: none;
}
.flatList.number-hidden .itemNumberIcon {
	visibility:hidden;
	display: none;
}
.flatList.ico-hidden.number-hidden i.itemIco{
	display: block;
}

.flatList.ico-hidden i.delete {
	visibility:visible;
}

.icoEnable {
	height:30px;
	font-size:16px;
	vertical-align:middle;
	margin:5px 10px;
	cursor:pointer !important;
}


.flatList .addMenuItem {
	width:24px;
	height:20px;
	background-image:url('../images/adminicons/ribbon/contextTabs/selection/selection_add.png');
	background-repeat:no-repeat;
	vertical-align:middle;
	margin-right:10px;
	display:inline-block;
	background-position:0 -4px;
}

.dots-nav:before, .dots-nav:after {
    display: table;
    content: " ";
    clear: both;
}

.dots-nav {
	position: relative;
	display: block;
	list-style: none;
	cursor: default;
	padding-top: 5px;
}
.dots-nav .active .dot:after {
	background-color: #0b5396;
}

.dots-nav li {
	position: relative;
	display: block;
	height: 40px;
	cursor: pointer;
	text-align: center;
	float: left;
}
.dots-nav li .dot{
	color: #777;
	position: relative;
	top: 25px;
	text-decoration: none;
}

.dots-nav li:before{
	content: '';
	position: absolute;
	top: 8px;
	left: 0px;
	height: 1px;
	width: 100%;	
	background-color: #777;
}
.dots-nav li:first-child:before{
	left: 50%;
	width:50%;
}
.dots-nav li:last-child:before{
	width: 50%;
}

.dots-nav li .dot:after {
	content: '';
	position: absolute;
	top: -25px;
	left: 50%;
	margin-left: -8px;	
	width: 16px;
	height: 16px;
	background-color: white;
	border: 1px solid #0b5396;
	border-radius: 50%;

}

.exit {
	background-image : url(../images/ico_close.png);
	background-repeat: no-repeat;
	float:right;
	display:inline-block;
	height:16px;
	width:16px;
	margin-right:5px;
	cursor:pointer;
	vertical-align:middle;
}
.exit.white{
	background-image: url(../images/ico_close_white.png);
}

.multiEllipsis:after {
	content:"...";
    font-weight:bold;
    position:absolute;
    bottom:0;
    right:0;
    padding:0 5px;
    background-color:white;
}

.ui-resizable-iframeFix{
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	background-image: url(../images/transparent.gif);
	background-repeat: repeat;
	z-index: 1000;
}

.dki-ui-navigation {
	border-bottom: 1px solid #ccc;
	padding: 5px 0 5px 5px;
}

.dki-ui-navigation > .dki-ui-navigation-item {
	border-right: 1px solid #ccc;
	cursor:pointer;
	padding:3px 10px;
	position:relative;
	margin:5px 0;
	font-size:11px;
	box-sizing:border-box;
	display:inline-block;
	text-align:center;
}
.dki-ui-navigation > .dki-ui-navigation-item:last-child{
	border-right:none;
}
.dki-ui-navigation > .dki-ui-navigation-item.selected:after{
	content: ' ';
	border-bottom: 2px solid #0b5396;
	position: absolute;
	bottom: -2px;
	left: 5px;
	right: 5px;
}
.dki-ui-navigation:before {  
	content : " ";
	display:table;
}
#add_review_note_body .review_note_opts{
	padding-bottom:15px;
}
#add_review_note_body .review_note_opts > *{
	vertical-align:middle;
}
#add_review_note_body .review_note_opts label {
	margin-right:15px;
}
#add_review_note_body .review_note_opts input {
	margin-right:5px;
}
#add_review_note_body .review_note_rule{
	color:#aaa;
}

.disabler {
	display: none;
    background-color: rgba(125,125,125,0.5);
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 5000;
}
.disabler.clear {
    background-color: transparent;
}
.disabler .dki-waitMessage{
	top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
    padding: 10px 10px 10px 32px;
    text-align: left;
}


.tree-panel-list {
	overflow-y:auto;
	position:relative;
}
.tree-panel-list li > *  {
	margin-right:10px;
	height:100%;
	vertical-align:middle;
}
.tree-panel-list li {
	padding: 2.5px 5px;
	height:24px;
	border-bottom: 1px solid #ccc;
	font-size:12px;
	cursor:pointer;
}
.tree-panel-list li .avatar{
	width : 35px;
	float:left;
}
.tree-panel-list li .page-status-dot{
	float:left;
	margin-top:5px;
}
.tree-panel-list li .date{
	display:block;
	width:auto;
	line-height:22px;
}
.tree-panel-list li.selected {
	background-color: #cddff3;
}

.page-status-dot {
	border-radius:50%;
	display:inline-block;
	vertical-align:middle;
	background-color:rgb(147, 147, 151);
}

.page-status-dot.small {
	width:8px;
	height:8px;
	flex: 0 0 8px;
}
.page-status-dot.medium {
	width:12px;
	height:12px;
	flex: 0 0 12px;
}
.page-status-dot.large{
	width:16px;
	height:16px;
	flex: 0 0 16px;
}
.uploadFile {
	outline: 1px solid #ccc;
	background-image:none !important;
	background-color: rgb(241, 202, 127);
	outline : 2px #ff9900 solid !important;
	position:relative;
}
.uploadFile:before {
	content: "Drop Here";
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-10px;
	margin-left:-27px;
	color:#333;
	z-index:-1;
}
.load-spinner:before {
	content: " ";
    position: absolute;
    margin: auto;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: 7px;
    height: 7px;
    border-radius: 100%;
    box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    -o-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    -ms-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    -webkit-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    -moz-box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    animation: cssload-spin ease infinite 4.6s;
    -o-animation: cssload-spin ease infinite 4.6s;
    -ms-animation: cssload-spin ease infinite 4.6s;
    -webkit-animation: cssload-spin ease infinite 4.6s;
    -moz-animation: cssload-spin ease infinite 4.6s;
}

.load-spinner.sm:before{
	width: 4px;
    height: 4px;
	box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    -o-box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    -ms-box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    -webkit-box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    -moz-box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    animation: cssload-spin-sm ease infinite 4.6s;
    -o-animation: cssload-spin-sm ease infinite 4.6s;
    -ms-animation: cssload-spin-sm ease infinite 4.6s;
    -webkit-animation: cssload-spin-sm ease infinite 4.6s;
    -moz-animation: cssload-spin-s, ease infinite 4.6s;
} 
.load-spinner.success,
.load-spinner.warning {
	display         : flex !important;
	align-items     : center;
	justify-content : center;
	margin          : 0;
}
.load-spinner.success:before,
.load-spinner.warning:before {
	font            : normal normal normal 14px/1 FontAwesome;
	display         : flex !important;
	align-items     : center;
	justify-content : center;
	margin          : 0;
	position        : static;

}
.load-spinner.success:before{
	animation       : cssload-spin-success ease forwards 1s;
}
.load-spinner.success.done:before {
	content : "\f00c";
	flex    : 0 0 100%;
}
.load-spinner.warning:before{
	animation       : cssload-spin-warning ease forwards 1s;
}
.load-spinner.warning.done:before{
	content : "\f071";
	flex    : 0 0 100%;
}



@keyframes cssload-spin {
    0%,
    100% {
        box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    }
    25% {
        box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73);
    }
    50% {
        box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223);
    }
    75% {
        box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49;
    }
}
@keyframes cssload-spin-sm {
    0%,
    100% {
        box-shadow: 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223);
    }
    25% {
        box-shadow: -4px 4px rgb(223,223,223), -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223), 4px 4px rgb(79,77,73);
    }
    50% {
        box-shadow: -4px -4px rgb(79,77,73), 4px -4px rgb(223,223,223), 4px 4px rgb(79,77,73), -4px 4px rgb(223,223,223);
    }
    75% {
        box-shadow: 4px -4px #dfdfdf, 4px 4px #4f4d49, -4px 4px #dfdfdf, -4px -4px #4f4d49;
    }
}


@keyframes cssload-spin-success {
	40% {
		background-color : rgb(51,150,252);
		flex             : 0 0 7px;
   		height           : 7px;
   		padding          : 0;
   		font-size        : 0; /* hide the icon for now. keyframes will bring in any "on/off" change (like the content property) at 50%, so we want to hide it using font size until we're ready to show*/
	}
    60% {
		color       : rgb(51,150,252);
		flex        : 0 0 100%;
   		height      : 100%;
   		padding     : 3px;
   		font-size   : 1em;
   		box-shadow  : 0 0 rgb(51,150,252), 0 0 rgb(51,150,252), 0 0 rgb(51,150,252), 0 0 rgb(51,150,252);
 	}
    100% {
    	background-color : rgb(51,150,252);
		box-shadow       : 0 0 rgb(51,150,252), 0 0 rgb(51,150,252), 0 0 rgb(51,150,252), 0 0 rgb(51,150,252);
		flex             : 0 0 100%;
   		height           : 100%;
   		color            : #fff;
   		padding          : 3px;
   		content          : "\f00c";
   		font-size        : 1em;
    } 
}
@keyframes cssload-spin-warning {
	40% {
		background-color : rgb(240,196,51);
		flex             : 0 0 7px;
   		height           : 7px;
   		padding          : 0;
   		font-size        : 0; /* hide the icon for now. keyframes will bring in any "on/off" change (like the content property) at 50%, so we want to hide it using font size until we're ready to show*/
	}
    60% {
		box-shadow  : 0 0 rgb(240,196,51), 0 0 rgb(240,196,51), 0 0 rgb(240,196,51), 0 0 rgb(240,196,51);
		color       : rgb(240,196,51);
		flex        : 0 0 100%;
   		height      : 100%;
   		padding     : 3px;
   		font-size   : 1em;
 	}
    100% {
    	background-color : rgb(240,196,51);
		box-shadow       : 0 0 rgb(240,196,51), 0 0 rgb(240,196,51), 0 0 rgb(240,196,51), 0 0 rgb(240,196,51);
		flex             : 0 0 100%;
   		height           : 100%;
   		color            : #fff;
   		padding          : 3px;
   		content          : "\f071";
   		font-size        : 1em;
    } 
}

@-o-keyframes cssload-spin {
    0%,
    100% {
        box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    }
    25% {
        box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73);
    }
    50% {
        box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223);
    }
    75% {
        box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49;
    }
}

@-ms-keyframes cssload-spin {
    0%,
    100% {
        box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    }
    25% {
        box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73);
    }
    50% {
        box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223);
    }
    75% {
        box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49;
    }
}

@-webkit-keyframes cssload-spin {
    0%,
    100% {
        box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    }
    25% {
        box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73);
    }
    50% {
        box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223);
    }
    75% {
        box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49;
    }
}

@-moz-keyframes cssload-spin {
    0%,
    100% {
        box-shadow: 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223);
    }
    25% {
        box-shadow: -7px 7px rgb(223,223,223), -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73);
    }
    50% {
        box-shadow: -7px -7px rgb(79,77,73), 7px -7px rgb(223,223,223), 7px 7px rgb(79,77,73), -7px 7px rgb(223,223,223);
    }
    75% {
        box-shadow: 7px -7px #dfdfdf, 7px 7px #4f4d49, -7px 7px #dfdfdf, -7px -7px #4f4d49;
    }
}
.sandbox-disabler-wrapper{
	top: 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
}
.sandbox-mask{
	z-index: 50000;						
	position:absolute;
	top:0px;
	left:0;
	-moz-opacity:0.6;
	opacity:0.6;
	filter:alpha(opacity=60);
	background-color:#333;
	height:100%;
	width:100%;
}
.sandbox-disabler-message{
	color: white;
	font-size: 13px;
}

.sandbox-message-wrapper{
	z-index: 50001;
	position: absolute;
	top: 50%;
	margin-top: -20px;
	width: 100%;
	max-width: 280px;
	min-height: 90px;
	background-color: #333;
	padding: 15px;
}

.sandbox-message-wrapper .btn{
	margin-top: 25px;
	margin-right: 0px;
	float: right;
}

.dki-userCard-container .sandbox-message-wrapper{
	width: 210px;
	top: 87.5px !important;
	left: 25px !important;
}

.admin-in-link{
	z-index: 50005;
}

.downArrow { 
	margin-left:2px;
	vertical-align:middle;
	display:inline-block;
	height:9px;
	width:9px;
	background-image: url('../images/widgets/button/dropdownWhite.png');
	background-repeat:no-repeat;
 }

 .downArrow.black{
 	background-image: url(../images/adminicons/ribbon/dropDown.png);
 	background-position: center center;
}

html.mode-0 .mode-0-hidden {
	display:none !important;
}
html.mode-1 .mode-1-hidden {
	display:none !important;
}
html.mode-2 .mode-2-hidden {
	display:none !important;
}
html.claro-authoring .claro-hidden,
html.flow-authoring .flow-hidden{
	display:none !important;	
}
html.claro-authoring.mode-0 .claro-mode-0-hidden,
html.claro-authoring.mode-1 .claro-mode-1-hidden,
html.claro-authoring.mode-2 .claro-mode-2-hidden,
html.flow-authoring.mode-0 .flow-mode-0-hidden,
html.flow-authoring.mode-1 .flow-mode-1-hidden,
html.flow-authoring.mode-2 .flow-mode-2-hidden{
	display: none !important;
}
html.fixed-position-element-selected .fixed-position-element-hidden{
	display: none !important;
}
html.claro-authoring .tool-color{
	color:#7D2C2F;
}
html.claro-authoring .tool-bg{
	background-color:#7D2C2F;
}
html.flow-authoring .tool-color{
	color:#2D5379;
}
html.flow-authoring .tool-bg{
	background-color:#2D5379;
}
html .flow-bg{
	background-color:#2D5379 !important;
}

.checkbox{
	border       : 2px solid #333;
	color        : #333;
	width        : 14px;
    height       : 14px;
    cursor       : pointer;
    display      : inline-block;
}
.checkbox,
.checkbox + * {
	vertical-align:middle;
	margin-right: 5px;
}
.checkbox.checked:before{
	font      : normal normal normal 14px/1 FontAwesome;
	content   : '\f00c';
	font-size : 14px;
	display   : block;
}


div.picker-dialog{
	z-index: 5001;
}

/*Nub Menu Styles*/
.nubMenu {
	height:100%;
	position:relative;
	left:1px; /*Left 1 so that it overflows on top of the element beside it to allow the selected "nub" to overlap any borders*/
}
.nubMenu .filterGroup{
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
	padding-left:15px;
	padding-bottom: 5px;
}
.nubMenu .filterGroup:last-child {
	margin-bottom: 0;
	border-bottom:none;	
}
.nubMenu .nubMenuItem {
	padding: 7px 0;
	cursor:pointer;
	position:relative;
}
.nubMenu .nubMenuItem.selected:after {
	content : "";
	border  : 1px solid #ccc;
	background-color: #f2f2f2;
	position:absolute;
	right: -8px;
	top: 50%;
	margin-top:-6px;
	width: 12px;
	height:12px;
	clip-path:polygon(0 100%, 100% 0, 0 0);
	transform: rotate(-45deg);
}
.single-select-option.center {
	text-align    : center;
	margin-bottom : 10px;
}
.single-select-option > * {
	border-right : 1px solid #ccc;
	padding      : 0 10px;
	opacity      : 0.7;
	cursor       : pointer;
}
.single-select-option > *.selected {
	opacity : 1;
}
.single-select-option > *:last-child {
	border-right : none;
	padding-right : 0;
}
.single-select-option > *:first-child {
	padding-left : 0;
}

/*TOGGLES from base.css */

.tgl {
  display: none;
}

.tgl-btn {
	text-align:left !important;
}
.tgl-btn .dki-element-text{
	display: none !important;
}
.tgl, .tgl:after, .tgl:before, .tgl *, .tgl *:after, .tgl *:before, .tgl + .tgl-btn {
  box-sizing: border-box;
}
.tgl::-moz-selection, .tgl:after::-moz-selection, .tgl:before::-moz-selection, .tgl *::-moz-selection, .tgl *:after::-moz-selection, .tgl *:before::-moz-selection, .tgl + .tgl-btn::-moz-selection {
  background: none;
}
.tgl::selection, .tgl:after::selection, .tgl:before::selection, .tgl *::selection, .tgl *:after::selection, .tgl *:before::selection, .tgl + .tgl-btn::selection {
  background: none;
}
.tgl + .tgl-btn {
  outline: 0;
  display: inline-block;
  width: 4em;
  height: 2em;
  position: relative;
  cursor: pointer;
  vertical-align:middle;
  margin:5px 0px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.tgl + .tgl-btn:after, .tgl + .tgl-btn:before {
  position: relative;
  display: inline-block;
  content: "";
  width: 50%;
  height: 100%;
}
.tgl + .tgl-btn:after {
  left: 0;
}
.tgl + .tgl-btn:before {
  display: none;
}
.tgl:checked + .tgl-btn:after {
  left: 50%;
}
.tgl-light+.tgl-btn,
.tgl-normal+.tgl-btn {
	 border-radius: 2em;
	 padding: 2px;
	 -webkit-transition: all .4s ease;
	 transition: all .4s ease;
}
.tgl-light+.tgl-btn:after,
.tgl-normal+.tgl-btn:after {
	border-radius: 50%;
	background: #fff;
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
}
.tgl-light + .tgl-btn {
  background: #f0f0f0;
 
}
.tgl-light:checked + .tgl-btn,
.tgl-normal:checked+.tgl-btn {
  background: #9FD6AE;
}

.tgl-normal+.tgl-btn {
	background: #d0d0d0;
}


.source-file-preview{
	width: 100%;
	height: 100%;
	position: relative;
}
.source-file-preview:before{
	content: '\f016';
	font-family: FontAwesome;
	-webkit-text-stroke: 2px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 0;
	right: 0;
	margin-top: -30px;
	font-size: 60px;
	-webkit-text-stroke: 2px white;
}
.source-file-preview:after{
	content: attr(data-extension);
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin-top: -5px;
	font-size: 10px;
	text-align: center;
	font-size: 11px;
}

.tb-progress{
	height : 15px;
}
.tb-progress-bar{
	color: #ffff; 
	background-color: #1f5071;
	height:100%;
	width:0%
} 

.progress-border{
	border: 1px solid #ccc;
	height : 100%;
}

.dki-toggle-wrapper{
	display: flex;
	justify-content: center;
	align-items: center;
}
.dki-toggle-control,
.dki-toggle-label{
	display: inline-block;
}
.dki-toggle-control{
	height: 20px;
	width: 40px;
	margin-right: 5px;
	border: 1px solid white;
	border-radius: 20px;
	position: relative;
	transition: 0.2s ease-out;
}
.dki-toggle-control:before{
	content: '';
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	background-color: white;
	border-radius: 50%;
	top: 2px;
	left: 2px;
	transition: left 0.2s ease-out;
}
.dki-toggle-wrapper.toggled .dki-toggle-control:before{
	left             : 22px;
}

.dki-toggle-wrapper.toggled .dki-toggle-control,
.dki-toggle-wrapper.toggled.inverted .dki-toggle-control:before,
.dki-toggle-wrapper.inverted .dki-toggle-control {
	background-color : white;
}

.dki-toggle-wrapper.toggled:not(.inverted) .dki-toggle-control:before{
	background-color: #aaa;
}
.dki-toggle-wrapper.inverted .dki-toggle-control{
	border-color : #aaa;
}
.dki-toggle-wrapper.toggled.inverted .dki-toggle-control,
.dki-toggle-wrapper.inverted .dki-toggle-control:before {
	background-color :#aaa;
}
html.claro-authoring .dki-toggle-wrapper.toggled:not(.inverted) .dki-toggle-control:before,
html.claro-authoring .dki-toggle-wrapper.inverted:not(.toggled) .dki-toggle-control:before,
html.claro-authoring .dki-toggle-wrapper.inverted.toggled .dki-toggle-control{
	background-color: #933e3e;
}
html.flow-authoring .dki-toggle-wrapper.toggled:not(.inverted) .dki-toggle-control:before,
html.flow-authoring .dki-toggle-wrapper.inverted:not(.toggled) .dki-toggle-control:before,
html.flow-authoring .dki-toggle-wrapper.inverted.toggled .dki-toggle-control{
	background-color: #1f5071;
}

html.claro-authoring .dki-toggle-wrapper.inverted .dki-toggle-control{
	border-color : #933e3e;
}
html.flow-authoring .dki-toggle-wrapper.inverted .dki-toggle-control{
	border-color : #1f5071;
}


.minimizeArrow{
	display: block;
	width: 30px;
	height: 20px;
	border: 1px solid ##ccc;
	border-radius: 3px;
	background-color: white;
	margin: 10.5px auto !important;
}
.minimizeArrow:after{
	font-family: FontAwesome;
	content: '\f177';
	font-size: 15px;
	position: relative;
	top: 2px;
}

.minimizeArrow.minimized:after{
	content: '\f178';
}

.searchContainer {
	border        : 1px solid #ccc;
	border-radius : 30px;
	color         : #333;
}
.searchContainer input {
	border-right : 1px solid #ccc !important;
	height       : 24px;
}
.searchContainer input + .icon16.font.search {
	margin-left  : 10px;
	margin-right : 10px;
	cursor       : pointer;
	color        : #333;
}

.hoverMsg {
	position : absolute;
	top : 0;
	left : 0;
	right : 0;
	bottom : 0;
	z-index : 1;	
}
.hoverMsg > * {
	position : absolute;
	left : 50%;
	top : 50%;
	transform : translate(-50%,-50%);
	color : #FFF;
	z-index : 2;
	font-size : 1.75em;
	text-shadow : 0px 0px 5px rgba(0,0,0,0.5)
}
.hoverMsg {
	border-radius : 3px;
	background-color : rgba(0,0,0,0.2);
}

.tag-bubble{
	border-radius: 10px;
	background-color: #3b6bfa;
	border: 2px solid #3b6bfa;
	color: #fefefe;
	width: auto;
	margin: 0px 2px 2px 0px;	
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
}

.tag-bubble i{
	font-size: 13px;
	position: relative;
	top:2px;
}

.tag-bubble-label{
	padding: 0 5px;
}

.tag-bubble-delete{
	padding: 0 5px;
	border-left: 1px solid #f2f2f2;
	cursor: pointer;
}

.tag-bubble-delete:before{
	content: 'x';
	font-size: 14px;
	position: relative;
	top: -1px;
}

.tag-bubble-add{
	color: #0052CC;
	cursor: pointer;
}

#publishFilterListWindow .data-list-wrapper{
	height: auto !important;
	width: 100% !important;
	display: flex;
	flex-direction: column;
}

#publishFilterListWindow .data-list-wrapper .list-row-wrapper{
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100% !important;
}

.select-option-level--1{font-style: italic;}
.select-option-level-0{padding-left: 0;}
.select-option-level-1{padding-left: 10px;}
.select-option-level-2{padding-left: 20px;}
.select-option-level-3{padding-left: 30px;}
.select-option-level-4{padding-left: 40px;}
.select-option-level-5{padding-left: 50px;}
.select-option-level-6{padding-left: 60px;}
.select-option-level-7{padding-left: 70px;}
.select-option-level-8{padding-left: 80px;}
.select-option-level-9{padding-left: 90px;}

.select-option-filter .fa {
    display: inline-block;
    font-size: 14px;
    line-height: 18px;
    margin-right: 5px;
}


.publish-filter-tag.tag-bubble .tag-bubble-label{
	word-wrap: break-word;
	max-width: 150px;
}

#pageTabContent .publish-filter-tag.tag-bubble .tag-bubble-label{
	max-width: 130px;
}