@import 'include/thirdparty/Bootstrap3/scss/bootstrap/_variables.scss';
@import 'include/thirdparty/Bootstrap3/scss/bootstrap/_mixins.scss';
@import 'include/thirdparty/Bootstrap3/scss/bootstrap/_utilities.scss';

@import 'mixins.scss';
@import 'variables.scss';

@import 'admin_toolbar.scss';

/*
 * Reset CSS
 * There are two admin content containers where we attempt to reset the css
 * so a user's theme does not interfere with the display of admin content
 *
 * #gp_admin_html
 * 		contain areas that are not inline in the users theme like the sidepanel, inline editing dialogs, admin_box
 *
 */
#gp_admin_html,
#gp_admin_fixed{
	position: absolute;
	top: 0;
	left: 0;
	height: auto;
	text-transform: none;
	}
#gp_admin_fixed{
	position: fixed;
	}

#gp_admin_html{
	color: #333;
	font-size: 13px;
	font-family: "Segoe UI", "San Francisco", "Helvetica Neue", "DejaVu Sans", "Arial", sans-serif;
	line-height: 130%;
	/* background:none; */
	}
#gp_admin_html *{

	text-shadow: none;
	@include box-sizing( content-box );
	/* background: none; prevents other backgrounds from showing. "inherit" wouldn't make sense */
	font-family:inherit; font-size:inherit; line-height:inherit; // conflicts with fontawesome
	}

#gp_admin_html hr{
	border: 0 none;
	border-bottom: 1px solid #ddd;
	}

#gp_admin_html label{
	font-weight: normal;
	}

#gp_admin_html li{
	list-style: none;
	background-image: none; /* ex: a bullet image for <li>, but it messes up ckeditor */
	}

#gp_admin_html table,
#gp_admin_html form{
	background: none;
	margin: 0;
	padding: 0;
	}
#gp_admin_html input,
#gp_admin_html textarea{
	width: auto;
	}
#gp_admin_html table{
	/* margin: 0; changes bordered display */
	/* width: auto; /* this changes ckeditor display */
	}

#gp_admin_html td,
#gp_admin_html th{
	vertical-align: top;
	}
#gp_admin_html a{
	cursor: pointer;
	}
#gp_admin_html a img{
	border: none;
	}


#gp_admin_html a,
#gp_admin_html a:visited,
#gp_admin_html a:hover{
	color: #226699;
	text-decoration: none;
}
#gp_admin_html a:hover{
	color: #CC4422;
	}

#gp_admin_html a *{
	color: inherit;
	text-decoration: inherit;
	}


#gp_admin_html h1,
#gp_admin_html h2,
#gp_admin_html h3{
	margin: .8em 0;
	}

#gp_admin_html h1{
	font-size: $font-size-h1;
	}

#gp_admin_html h2{
	font-size: $font-size-h2;
	}

#gp_admin_html h3{
	font-size: $font-size-h3;
	}

#gp_admin_html h4{
	font-size: $font-size-h4;
	}

#gp_admin_html h1,
#gp_admin_html h1 a,
#gp_admin_html h1 a:visited,
#gp_admin_html h2,
#gp_admin_html h2 a,
#gp_admin_html h2 a:visited,
#gp_admin_html h3,
#gp_admin_html h3 a,
#gp_admin_html h3 a:visited,
#gp_admin_html h4,
#gp_admin_html h4 a,
#gp_admin_html h4 a:visited{
	color: #333;
	text-align: left;
	text-shadow: none;
	font-weight: normal;
	}

#gp_admin_html h1:first-child,
#gp_admin_html h2:first-child,
#gp_admin_html h2:first-of-type,
#gp_admin_html h2.first-child,
#gp_admin_html h3:first-child{
	margin-top: 0;
	padding-top: 0;
	}


#gp_admin_html p{
	margin: 1em 0;
	}

#gp_admin_html .gpselect,
#gp_admin_html .gpcheckbox,
#gp_admin_html .gpcancel,
#gp_admin_html .gpsubmit,
#gp_admin_html .gpbutton,
#gp_admin_html .gpdisabled{
	display: inline-block;
	background-color: #f1f1f1;
	border-radius: 6px;
	border: 1px solid #ccc;

	color: #333 !important;
	text-shadow: 1px 1px 0 #fff;
	white-space: nowrap;

	padding: 4px 8px;
	height: auto;
	@include box-sizing( border-box );
	}

#gp_admin_html .gptextarea,
#gp_admin_html .gp_scrolllist,
#gp_admin_html .gpinput{
	background: #fff;
	border-radius: 6px;
	border: 1px solid #ccc;
	color: #333;
	padding: 4px 6px;
	height: auto;
	@include box-shadow( inset 0 0 1px rgba(0,0,0,0.2) );
	@include box-sizing( border-box );
	}

#gp_admin_html .gpinput,
#gp_admin_html .gpselect,
#gp_admin_html .gpsubmit,
#gp_admin_html .gpcancel{
	margin: 0 7px 0 0;
	}

#gp_admin_html .gpcheckbox.checked,
#gp_admin_html .gpselect,
#gp_admin_html .gpsubmit,
#gp_admin_html .gpbutton{
	cursor: pointer;
	@include gradient-vertical(#FBFBFB, #E9E9E9);
	}

#gp_admin_html .gpcheckbox,
#gp_admin_html .gpcancel{
	cursor: pointer;
	border-color: #ddd;
	@include gradient-vertical(#FFFFFF, #F7F7F7);
	}

#gp_admin_html .gpdisabled{
	background-color: #f7f7f7;
	border: 1px solid #ddd;
	color: #999;
	}

#gp_admin_html .gpselect option{
	text-shadow: none;
	padding: 0 5px;
	}
#gp_admin_html .gpcheckbox input{
	margin: 0;
	padding: 0;
	vertical-align: middle;
	}
#gp_admin_html .gpinput{
	white-space: nowrap;
	}
#gp_admin_html .gpinput_warning{
	border-color: red;
	}
#gp_admin_html .gpreadonly{
	background: #f5f5f5;
	}

#gp_admin_html .sync_label{
	background: #f1f1f1;
	}

#gp_admin_html .padded_table td{
	padding: 5px;
	}

#gp_admin_html pre{
    background:  #F7F7F7;
    border-left: 1px solid #CCC;
    margin-left: 20px;
    padding: 10px;
    white-space: pre-wrap;
    word-wrap: break-word;
	}

#gp_admin_html pre.inline{
    margin-right: 20px;
    display: inline-block;
}

#gp_admin_html .show_character_count{
	position: relative;
	display: inline-block;
	padding: 0;
	}
#gp_admin_html .show_character_count textarea{
	padding-bottom: 27px;
	border: 0 none;
	border-radius: 4px;
	}
#gp_admin_html .character_count{
	display: block;
	border-top: 1px solid #eee;
	height: 22px;
	line-height: 22px;
	font-size: 11px;
	padding: 0 6px;
	color: #888;
	text-align: right;
	}

/**
 * Admin container
 *
 */

#admincontainer{
	margin-left: 180px;
	position: relative;
}

#admincontent_panel{
	display: block;
	padding: 0;
	font-weight: normal;
	background: $gp_panel_bg;
	}

.gpbody #admincontent_panel{
	padding: 0 40px 0 (40px - $gp_nav_link_padding_x);
	}

#admincontent_panel,
#admincontent_panel *{
	@include box-sizing( border-box );
	font-size: $gp_nav_font_size;
	line-height: $gp_nav_font_size;
	}

#admincontent_panel .GPAREA{
	display: inline;
	}
#admincontent_panel div.GPAREA:after{
	display: none;
	}

#admincontent_panel ul{
	float: left;
	}
#admincontent_panel ul,
#admincontent_panel li,
#admincontent_panel span,
#admincontent_panel a{
	display: inline-block;
	margin: 0;
	padding: 0;
	list-style: none;
	color: $gp_nav_link_color !important;
	position: relative;
	white-space: nowrap;
	}

#admincontent_panel ul a{
	display:block;
	}

/* #admincontent_panel b, */
#admincontent_panel span,
#admincontent_panel a{
	padding: $gp_nav_link_padding_y $gp_nav_link_padding_x;
	}

#admincontent_panel a:hover{
	color: $gp_nav_link_color_hover !important;
	background: lighten($gp_panel_bg,10%);
	}

#admincontent_panel a[href$='ToggleVisibility'] { 
	background:#C44830; 
	}

#admincontent_panel a[href$='ToggleVisibility']:hover { 
	background:#DC5135; 
	}

#admincontent_panel span > .fa,
#admincontent_panel a > .fa{
	margin-right: 4px;
	}

#admincontent_panel ul ul{
	display: none;
	position: absolute;
	top: 100%;
	background: $gp_panel_bg;
	min-width: 100%;
	}
#admincontent_panel ul ul li{
	display: block;
	}

#admincontent_panel .panel_tab_label{
	padding-right:8px;
	}
#admincontent_panel .panel_tabs a{
	border-right:1px solid lighten($gp_panel_bg,10%);
	border-left:1px solid lighten($gp_panel_bg,10%);
	font-weight:normal;
	}

/**
 * Search
 *
 */
#panel_search{
	float: right;
}

#panel_search span{
	position: relative;
	display: inline-block;
	height: $gp_nav_height;
	padding:0;
	}

#panel_search input{
	border: 0 none;
	border-radius: 3px;
	width: 160px;
	color: $gp_nav_link_color_hover;
	font-size: $gp_nav_font_size;
	height: $gp_nav_height - 8px;
	padding: ($gp_nav_link_padding_y - 4px) 4px ($gp_nav_link_padding_y - 4px) 25px;
	margin: 4px 0;
	background-color: lighten($gp_panel_bg, 10%);
	@include transition( all .2s ease-out);
	}

#panel_search span > i{
	position: absolute;
	top: 0;
	left: 0px;
	width: 25px;
	text-align: center;
	color: lighten($gp_panel_bg,30%);
	height: $gp_nav_height;
	line-height: $gp_nav_height;
	}

#panel_search input:focus{
	background-color: #f1f1f1;
	color: #333;
	}

#panel_search button{
	display: none;
	}

#panel_search .tslogo{
	vertical-align: top;
	}

/**
 * Admin Breadcrumbs
 *
 */
#admin_breadcrumbs{
	background: $gp_bread_bg;
	padding: 0 (40px- $gp_bread_link_padding_x);
	font-size: $gp_bread_font_size;
	}
#admin_breadcrumbs a{
	color: $gp_bread_link_color !important;
	padding: $gp_bread_link_padding_y $gp_bread_link_padding_x;
	display: inline-block;
	}
#admin_breadcrumbs a:hover{
	color: $gp_bread_link_color_hover !important;
	}



#admin_drag_box{
	position: fixed;
	border: 2px dashed #000;
	z-index: 90000;
	padding: 0;
	border-radius: 3px;

	background-color: #fff; /* important for ie to prevent text selection underneath drag box */
	@include opacity(.4);
}


/**
 *  Admin Pages
 *
 */
#admincontent{
	position: relative;
	color: #333;
	font-size: 13px;
	width: auto;
	height: 100%;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	@include box-sizing( border-box );

}



#admincontent_inner{
	padding: 30px 40px 10em 40px;
	overflow: hidden;
	background-color: #fff;

	//subset of bootstrap components
	//@import 'include/thirdparty/Bootstrap3/scss/_bootstrap.scss';
	@import 'include/thirdparty/Bootstrap3/scss/bootstrap/scaffolding.scss';
	@import 'include/thirdparty/Bootstrap3/scss/bootstrap/type.scss';
	@import 'include/thirdparty/Bootstrap3/scss/bootstrap/grid.scss';

	.bg-danger{
		padding:15px;
		}

}

#admincontent_inner #finder,
#admincontent_inner #finder *{
	@include box-sizing(content-box);
}

#admincontent .nowrap{
	white-space: nowrap;
	}

#admincontent .formlabel{
	text-align: right;
	font-weight: bold;
	}

#admincontent li a{
	text-decoration: none;
	}


#gp_admin_html .admin_note,
#gp_admin_html .sm{
	font-size: $font-size-small;
	}
#gp_admin_html .admin_note a{
	text-decoration: none;
	}
#gp_admin_html .text-muted{
	color: #666;
	}


/*** admin_box ***/


#gp_admin_box1{
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: #000;
	}
#gp_admin_box{
	position: absolute;
	top: 0;
	margin-top: 40px;
}
#gp_admin_boxc{
	background: #fff !important;
	width: 640px;
	padding: 20px !important;
	}
#gp_admin_boxc.iframe{
	padding: 25px 1px 20px 0 !important;
	}
#gp_admin_boxc iframe{
	width: 100%;
	border: 0;
}

#gp_admin_box h2,
#gp_admin_box h3{
	margin-top: 0;
	padding-top: 0;
	}
a.gp_admin_box_close{
	position: absolute;
	top: 7px;
	right: 7px;
	text-decoration: none;
	height: 16px;
	width: 16px;
	@include gpimg( 'cancel.png', 50%, 50% );
	}
#gp_admin_box h2 a,
#gp_admin_box h3 a,
#gp_admin_box h4 a{
	text-decoration: none;
	color: #444;
	}


input.admin_box_close{
	display: none;
	}
#gp_admin_box input.admin_box_close{
	display: inline;
	}



.layout_color_id{
	display: inline-block;
	width: 16px;
	height: 16px;
	vertical-align: middle;
	padding: 0;
	margin: 0;
	cursor: pointer;
	border-radius: 5px;
	}

.layout_default{
	@include opacity(.6);
}

/* For new content areas, empty areas and hidden areas */
body.edit_layout .GPAREA{
	min-height: 1em;
	}

body.gpAdmin .GPAREA[data-gp_hidden="true"] { 
	display: none!important; 
	}

body.gpAdmin div.editable_area{
	min-height: 1em;
}


/* general */

.bordered{
	margin-top: 1em;
	border-spacing: 0;
	border-top: 1px solid #eee;
	}

.full_width,
#gp_admin_html .full_width{
	width: 100%;
	}

.bordered > tbody > tr > th,
.bordered > thead > tr > th,
.bordered > tbody > tr > td,
.bordered > tfoot > tr > td{
	padding: 7px;
	border-bottom: 1px solid #eee;
	text-align: left;
	color: #444 !important;
	background-color: #fff;
	}

.bordered > tbody > tr > th,
.bordered > thead > tr > th{
	background-color: #eee;
	white-space: nowrap;
	color: #000;
	text-shadow: 0 1px 0 #fff !important;
	border-bottom: 1px solid #ddd;
	font-weight: bold;
	}

.bordered > tbody > tr.even > td,
.bordered.striped tbody > tr:nth-child(2n) > td{
	background: #f5f5f5;
}


#gp_admin_html .bordered.middle > tbody > tr > td{
	vertical-align: middle;
	}



/* collapsible */
.collapsible h4{
	margin: 0;
	border: 0 none;
	}
.collapsible h4 a{
	display: block;
	cursor:  pointer;
	padding: 5px 6px;
	margin-top: 5px;
	border-radius: 3px;
	color: #333 !important;
	background: #f1f1f1;
	border: 1px solid #ccc !important;
	border-color: #ddd #ddd #ccc #ddd !important;
	@include gradient-vertical(#f7f7f7, #ddd);
	}

.collapsible h4 a:before{
	display: inline-block;
	font-family: FontAwesome;
	content: "\f0d7"; // fa caret-down
	color: #666;
	width: 1.2em;
	text-align: center;
	}

.collapsible h4.gp_collapsed a{
	border-radius: 3px;
	}

.collapsible h4.gp_collapsed a:before{
	content: "\f0da"; // fa caret-right
	color: #888 !important;
	}

.collapsible h4 a:focus{
	outline: 0; /* prevent dotted outline from click */
	}

.collapsible > div{
	border-radius: 0 0 3px 3px;
	background: #fff;
	padding: 5px;
	}


/* configuration table */
table.configuration{
	width: 100%;
	}
table.configuration select{
	width: 15em;
}
table.configuration input,
table.configuration textarea{
	border: 1px solid #bbb;
	border-radius: 3px;
	padding: 3px;
	}
table.configuration textarea{
	width: 100%;
	}
table.configuration td:first-child{
	width: 20%;
	}


table.tablesorter th.gp_header{
	cursor: pointer;
	}
table.tablesorter th.gp_header:before{
	content: "\21C5";
	float: right;
	}
table.tablesorter th.gp_header_asc:before{
	content: "\2193";
	}
table.tablesorter th.gp_header_desc:before{
	content: "\2191";
	}






/* New Expandable Menu Control */

.expand_child,
.expand_child_click{
	position: relative;
}

.expand_child ul,
.expand_child_click ul{
	position: absolute;
	display: none;
	}
.expand ul{
	display: block;
	}
.expand .expand_child ul,
.expand .expand_child_click ul{
	display: none;
	}
.expand .expand ul{
	display: block;
	}


.hidden_options{
	visibility: hidden;
	}

.expand .hidden_options{
	visibility: visible;
	}

/* don't show any drop down menus when dragging */
.drag_active ul{
	display: none !important;
	}
.drag_active .hidden_options{
	visibility: hidden !important;
	}


/*	 Drag 'n Drop   */


.draggable_element{
	cursor: move;
	}
.draggable_hidden{
	@include opacity(.3);
}
.target{
	left: -5px;
	top: -5px;
	visibility: visible !important;
	@include box-shadow( 5px 5px 5px #888 );
	@include opacity(1);
	}





/*
 * Admin Panel
 * This is the panel of admin links that is displayed across all pages when the user is logged in
 *
 */

/* simple panel */
#simplepanel{
	position: fixed;
	z-index: 9002;
	}
#simplepanel > div{
	padding: 0;
	margin: 0 0 5px 0;
	width: auto;
	min-width: 130px;

	display: block;
	border: 1px solid #000;
	border-radius: 5px;
	background: $gp_panel_bg;
	@include box-shadow( 0 0 3px rgba(0,0,0,0.6) );
	}

#gp_admin_html ul,
#simplepanel ul{
	overflow: visible;
	}

#simplepanel a,
#simplepanel span,
#simplepanel div{
	line-height: 18px;
	text-decoration: none;
	color: $gp_panel_link_color !important;
	}
#simplepanel img{
	border: 0;
	margin: 0;
	padding: 0;
	}



/* toolbar */

#simplepanel .toolbar{
	position: relative;
	//border-bottom: 1px solid #111;
	cursor: move;
	line-height: 0;
	}
#simplepanel .toolbar > a{
	display: inline-block;
	height: 32px;
	width: 20% !important;
	min-width: 32px;
	vertical-align: top;
	padding: 8px;
	@include box-sizing( border-box );
	}
#simplepanel .toolbar > a i{
	margin: 0;
	}

#simplepanel .toolbar .toggle_panel{
	@include gpimg( 'icons.png', 50%, -32px );
	}
#simplepanel.compact > div{
	width: 32px;
	min-width: 0;
	}
#simplepanel.compact .toolbar .toggle_panel{
	@include gpimg( 'icons.png', 50%, -64px );
	}
#simplepanel.minb:hover > div{
	margin: 0 0 200px 0; /* prevent the menu from disappearing if changing the display makes the user mouseout */
	}
#simplepanel.toggledmin > div{
	margin: 0 !important; /* don't add margin at bottom if the display was just changed */
	}
#simplepanel.minb .toolbar .toggle_panel{
	@include gpimg( 'icons.png', 50%, 0 );
	}

#simplepanel .toolbar .extra{
	float: right;
	}
#simplepanel.compact .toolbar .extra,
#simplepanel.minb .toolbar .extra{
	display: none;
	}
#simplepanel.minb:hover .toolbar .extra{
	display: inline-block;
	}


/* panelgroup */
#simplepanel .panelgroup{
	position: relative;
	display: block;
	}


/* toplink */
#simplepanel .toplink{
	text-decoration: none;
	display: block;
	white-space: nowrap;
	margin: 0;
	height: 16px;
	padding: 8px;
	}

#simplepanel .fa{
	height: 16px;
	width: 16px;
	line-height:16px;
	text-align:center;
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	font-size:14px;
	}

#simplepanel .toolbar .fa{
	font-size:16px;
	}
#simplepanel .gpversion{
	color: #888 !important;
	font-size: 11px;
	padding: 10px;
	}

#simplepanel .toplink span{
	display: inline-block;
	font-size: 13px;
	line-height: 16px;
	height: 16px;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 130px;
	color: #f5f5f5;
	}

#simplepanel.compact .toplink span{
	display: none;
	}



/* panelgroup2 */
#simplepanel.compact .panelgroup .panelgroup2{
	position: absolute;
	top: 0;
	left: 100%;
	display: none !important;
	padding-left: 8px;
	padding-right: 5px;
	margin-left: -3px; /* for IE */
	background-image: url('../../include/imgs/blank.gif'); /* for IE */
	}

#simplepanel.compact .panelgroup:hover .panelgroup2{
	display: block !important;
	}

/* submenu */
#simplepanel .submenu{
	position: relative;
	background-color: $gp_panel_bg_light;
	border-top: 1px solid #111;
	border-bottom: 1px solid #3f3f3f;
	margin: 0;
	padding: 0;
	}
#simplepanel .submenu ul,
#simplepanel .submenu li{
	margin: 0;
	padding: 0;
	list-style: none;
	}


#simplepanel .submenu ul{
	z-index: 9010;
	margin-left: -1px;
	margin-right: -1px;
	}

#simplepanel .submenu li > a,
#simplepanel .submenu li > span{
	display: block;
	padding: 3px 14px;
	white-space: nowrap;
	overflow: hidden;
	}
#simplepanel .submenu a.submenu_top{
	display: none;
	}
#simplepanel .submenu .expand_child > a:after{
	font-size: 10px;
	vertical-align: top;
	color: #aaa;
	content: "\25B6";
	padding-left: 9px;
	position: absolute;
	right: 0px;
	padding-right: 3px;
	background-color: inherit;
	}

#simplepanel .submenu a:hover{
	background-color: #222;
	}
#simplepanel .submenu li.selected a{
	background-color: #222;
	font-weight: bold;
	}



#simplepanel.compact .submenu{
	border: 1px solid #000;
	border-radius: 5px;
	}

#simplepanel.compact .submenu a.submenu_top{
	display: block;
	padding-top: 7px;
	padding-bottom: 7px;
	height: 16px;
	font-weight: bold;
	background-color: #222;
	border-bottom: 1px solid #000;
	}

#simplepanel .submenu li.separator{
	border-bottom: 1px solid #3f3f3f;
	}
#simplepanel .submenu li:last-child{
	border-bottom: 0 none;
	}






/* third level */

#simplepanel .expand ul{
	position: absolute;
	left: 100%;
	top: 0;
	background-color: $gp_panel_bg;
	border: 1px solid rgba(0,0,0,0.4);
	border-radius: 5px;
	}
#simplepanel .expand ul a:hover{
	background: $gp_panel_bg_light;
	}


/*
 * Minimum display
 */
#simplepanel.minb > div{
	min-width: 0;
	}
#simplepanel.minb .toolbar a:nth-child(n+2),
#simplepanel.minb .panelgroup{
	display: none;
	}
#simplepanel.minb:hover .panelgroup{
	display: block;
	}
#simplepanel.minb:hover .toolbar a:nth-child(n+2){
	display: inline-block;
	}
#simplepanel.toggledmin .panelgroup,
#simplepanel.toggledmin .toolbar a:nth-child(n+2){
	display: none !important;
	}



#gp_edit_overlay{
	position: absolute;
	height: 0;
	width: 0;
	overflow: visible;
	z-index: 8999;
	}

#gp_edit_overlay div,
#gp_edit_box{
	position: absolute;
	top: 0;
	right: 0;
	z-index: 8998;
	display: none;
	cursor: pointer;

	background-color: #eee;
	@include opacity(.5);

	border: 1px dashed red;
	border-radius: 3px;

	-moz-border-image: url('../../include/imgs/editing.gif') 1 repeat;
	-webkit-border-image: url('../../include/imgs/editing.gif') 1 repeat;
	border-image: url('../../include/imgs/editing.gif') 1 repeat;
}

#gp_edit_overlay > span{
	position: absolute;
	z-index: 8999;
	display: block;
	border-radius: 3px;
	overflow: hidden;

	margin: 2px;
	max-width: 200px;
	background: rgba(238,238,238,0.95);
	padding: 2px;
	border: 1px solid rgba(200,200,200,0.2);
	@include box-shadow( 0 0 3px rgba(0,0,0,0.6) );

	}

#gp_edit_overlay span > *{
	display: none !important;
	}
#gp_edit_overlay span a{
	position: relative;
	color: #444 !important;
	padding: 4px 7px;
	border: 1px solid transparent;
	margin: 0 24px 0 0;
	font-size: 13px !important;
	cursor: pointer;
	white-space: nowrap;
	line-height: 100%;
	border-radius: 2px;
	}

#gp_edit_overlay span a:hover{
	background: rgba(200,200,200,0.5);
	}

#gp_edit_overlay span.gp_hover *{
	display: block !important;
	}
#gp_edit_overlay .gp_separator{
	margin: 2px 0;
	border: 0 none;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #f5f5f5;
	}

#gp_edit_overlay span a.gp_overlay_expand{
	display: block !important;
	padding: 1px !important;
	height: 17px;
	width: 17px;
	line-height:17px;
	text-align:right;
	margin: 0;
	font-size:16px !important;
	}

#gp_edit_overlay span.gp_hover a.gp_overlay_expand{
	float: right;
	z-index: 9001;
	text-align:center;
	}
#gp_edit_overlay span.gp_hover a.gp_overlay_expand:before{
	content:'\f00d';
	}

/* adminlinks */
#adminlinks2{
	position: relative;
	z-index: 10;
	margin-right: -30px;
	}


#adminlinks2 .panelgroup{
	display: inline-block;
	vertical-align: top;
	padding: 10px 20px 10px 0;
	width: 270px;
	@include box-sizing( border-box );
	}

.columns_3 #adminlinks2 .panelgroup{
	width: 33%;
	}

.columns_2 #adminlinks2 .panelgroup{
	width: 49%;
	}

.columns_1 #adminlinks2 .panelgroup{
	width: 99%;
	}


#adminlinks2 .panelgroup2{
	border: 1px solid #ddd;
	border-radius: 3px;
	overflow: hidden;
	margin: 3px 0;
	}


#adminlinks2 > div > a,
#adminlinks2 > div > span{
	padding: 7px 3px;
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-shadow: 0 1px 0 #fff;
	font-size: 18px;
	color: #333 !important;
	}

#adminlinks2 > div > span.layout_label > a {
	color: #333;
	}

#adminlinks2 ul,
#adminlinks2 li{
	list-style: none;
	padding: 0;
	margin: 0;
	z-index: 10;
	}

#adminlinks2 li{
	position: relative;
	margin-top: -1px;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
	}


#adminlinks2 li > a,
#adminlinks2 li > span{
	font-size: 13px;
	padding: 5px 12px;
	display: block;
	white-space: nowrap;
	min-width: 170px;
	outline: 0 none;
	color: #333 !important;
	}
#adminlinks2 li a:hover{
	color: #226699 !important;
	text-decoration: none;
	}

#adminlinks2 li.submenu_top{
	display: none;
	}

#adminlinks2 li.separator{
	border-bottom: 1px dotted #ccc;
	}

#adminlinks2 li.expand_child_click{
	border-top: 1px solid #f5f5f5;
	border-bottom: 1px solid #f5f5f5;
	background: #f9f9f9;
	}

#adminlinks2 li.expand_child_click > a:before{
	font-size: 10px;
	vertical-align: top;
	color: #888;
	content: "\25B6";
	padding-right: 5px;
	}
#adminlinks2 li.expand > a:before{
	content: "\25BC";
	}

#adminlinks2 li.expand,
#adminlinks2 li:hover{
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	z-index: 11;
	}

#adminlinks2 li.expand_child_click ul{
	position: relative;
	z-index: 11;
	background: #fff;
	}

#adminlinks2 li.expand_child_click li{
	overflow: hidden;
	text-overflow: ellipsis;
	border: 0 none;
	border-radius: 0;
	margin: 0;
	}

#adminlinks2 li.expand_child_click li > a,
#adminlinks2 li.expand_child_click li > span,
#adminlinks2 li.expand_child_click li > b,
#adminlinks2 li.expand_child_click li > form{
	font-size: 13px;
	display: block;
	padding: 3px 25px;
	}
#adminlinks2 li.expand_child_click li:hover{
	background: #f7f7f7;
	}

#adminlinks2 .gp_notice{
	margin: 5px;
	}

/*
 *
 * Overlay
 */


#loading1{
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: #fff;
	background: rgba(255,255,255,0.3);
	text-align: center;
	}

#loading1 i{
	position: absolute;
	top: 40%;
	}


div.inline_box{
	padding: 2em;
	}

div.inline_box h2{
	margin-top: 0;
	color: #333;
	}

div.inline_box td{
	padding: .5em;
	}
div.inline_box .formlabel{
	text-align: right;
	font-size: 85%;
	white-space: nowrap;
	}

div.inline_box input, div.inline_box select, div.inline_box textarea{
	padding: 3px 5px;
	}
div.inline_box .cancel{
	display: inline !important;
	}
div.inline_box li{
	list-style: none;
	}
div.inline_box label{
	display: block;
	}


/*
 * Addon
 */


#gp_admin_html .rating{
	display: inline-block;
	height: 16px;
	position: relative;
	vertical-align: top;
	}

#gp_admin_html .rating a{
	position: relative;
	display: inline-block;
	height: 16px;
	width: 16px;
	padding: 0;
	@include gpimg( 'stars.png', 0, 0 );
	}
#gp_admin_html .rating a.unset{
	background-position: 0 -16px;
	}



.gp_notice,
.gp_warning{
	border: 1px solid #fcefa1;
	padding: 7px 9px;
	border-radius: 5px;
	background: #fffde6;
	}
.gp_notice,
.gp_warning b{
	display: block;
	}

.gp_warning{
	border-color: #cd0a0a;
	background: #fef1ec;
	color: #cd0a0a;
	}

.gp_passed{
	border: 1px solid #6aa84f;
	padding: 5px 7px;
	background-color: #bdf5a4;
	border-radius: 5px;
	}


body #addon_about{
	margin-top: 30px;
	border: 1px solid #ccc;
	padding: 14px;
	max-width: 600px;
	border-radius: 5px;
	line-height: 170%;
	}
#addon_about h3{
	margin-bottom: .5em;
	}


/*
	Admin_Users
*/

#gp_admin_html label.all_checkbox{
	position: relative;
	white-space: nowrap;
	margin-right: 7px;
	margin-bottom: 7px;
	overflow: hidden;
	display: inline-block;
	vertical-align: middle;
}
#gp_admin_html label.all_checkbox > span{
	width: 140px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: block;
	cursor: pointer;
	border: 1px solid #ddd;
	background-color: #f1f1f1;
	padding: 4px 7px;
	border-radius: 3px;
	}
#gp_admin_html label.all_checkbox input:checked + span{
	color: $btn-success-color;
	background-color: $btn-success-bg;
	border-color: $btn-success-border;
	}

#gp_admin_html label.all_checkbox input{
	position: absolute;
	left: -20px;
	z-index: -1;
	}
#gp_admin_html label.select_all{
	padding: 5px 0;
	margin-bottom: 5px;
	}


/* tabs */
.layout_links{
	margin: 0 0 12px 0;
	/*
	text-align: justify;
	position: relative;
	width: 100%;
	&:after { // create a line break to justify line
		content: "";
		display: inline-block;
		width: 100%;
		height: 1px;
		}
		*/
	}
.layout_links a,
#gp_admin_html .layout_links a{
	display: inline-block;
	text-decoration: none;
	font-weight: bold;
	margin: 3px 0;
	padding: 3px 5px;
	border-radius: 3px !important;
	font-size: 13px;

	background-color: #f1f1f1;
	border: 1px solid #e1e1e1;
	color: #777;
	// max-width: 16%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	}

.layout_links a.selected,
#gp_admin_html .layout_links a.selected{
	border: 1px solid #444;
	background-color: #777;
	color: #fff;
	}

#area_lists{
	position: relative;
	}
#area_lists table{
	width: 100%;
	}
#area_lists td.add{
	text-align: right;
	}

/* jquery ui autocomplete */
#gp_admin_html{

	.ui-autocomplete{
		z-index: 12000;

		/* for auto-complete scrolling */
		max-height: 250px;
		overflow-y: auto;
		}

	.ui-autocomplete .ui-menu-item{
		min-width: 200px !important;
		padding-right: 30px !important;
		}

	.ui-menu .ui-menu-item{
		font-size: 14px;
		line-height: 14px !important;
		padding: .3em .4em !important;
		margin: .1em 0 !important;
		border: 1px solid transparent;
		white-space: nowrap;
		overflow: hidden;
		}
	.ui-menu-item a{
		color: #333;
		}

	.ui-menu-item span{
		font-size: 11px;
		padding-top: 1px;
		line-height: 11px;
		display: block;
		color: #777;
		}
	}




/* Upload form
 * Needed for inline editing and upload manager
 */

.gp_upload_form{
	position: relative;
	display: block;
	font-size: 13px !important;
	cursor: pointer;
	overflow: hidden;
	height: 100%;
	}
#ckeditor_area .gp_upload_form{
	padding: 0 0 5px 0 !important;
	}

.gp_object_wrapper{
	position: relative;
	z-index: 10001;
	@include opacity(0);
	cursor: pointer;
	}
.gp_upload_form *{
	cursor: pointer;
	}

/* floating areas */

#gp_admin_box,
.gp_floating_area{
	border: 1px solid #fff;
	border-radius:  6px;
	background: #ededed;
	background: #ededed -moz-linear-gradient(top, #fafafa 5px, #ededed 25px);
	background: #ededed -webkit-linear-gradient(top, #fafafa 5px,#ededed 25px);
	background: #ededed -o-linear-gradient(top, #fafafa 5px,#ededed 25px);
	background: #ededed -ms-linear-gradient(top, #fafafa 5px,#ededed 25px);
	background: #ededed linear-gradient(top, #fafafa 5px,#ededed 25px);
	@include box-shadow( 0 0 6px rgba(0, 0, 0, 0.4) );
	}

#gp_admin_box > div,
.gp_floating_area > div{
	padding: 4px;
	border-radius: 6px;
}

.gp_floating_area .toolbar{
	text-align: left;
	margin-bottom: 2px;
	cursor: move;
	min-height: 18px;
	cursor: move;
	/* font-weight: bold; */
	font-size: 13px;
	position: relative;
	color: #777 !important;
	}

.gp_floating_area .gp_right{
	float: right;
	}

.gp_floating_area .gp_right a,
.gp_floating_area .gp_right span{
	display: inline-block;
	margin: 0 0 0 8px;
	}

.unavail{
	visibility: hidden;
	}

/**
 * drop down menus
 *
 */
.dd_menu{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	width: 150px;
	}
.dd_menu ul,
.dd_menu li,
.dd_menu li a,
.dd_menu .dd_list{
	list-style: none;
	padding: 0;
	margin: 0;
	line-height: 130% !important;
	background: #fff;
	white-space: nowrap;
	width: auto;
	}
.dd_menu a{
	color: #333 !important;
	position: relative;
	}
.dd_menu{
	position: relative;
	line-height: 100% !important;
	height: 26px;
	}
.dd_menu > a{
	border: 1px solid #ccc;
	overflow: hidden;
	border-radius:  3px;
	background: #fff;
	display: block;
	padding: 0 20px 0 7px;
	line-height: 24px !important;
	height: 24px;
	white-space: nowrap;
	}
.dd_menu > a input{
	border: 0 none;
	background: #fff;
	width: 100%;
}

.dd_menu > a:after{
	position: absolute;
	right: 0;
	padding: 0 4px;
	border-radius: 2px;
	font-size: 10px;
	color: #666;
	content: "\25BC";
	padding-left: 5px;
	background: #fff;
	}

.dd_menu .dd_list{
	position: absolute;
	padding: 0;
	display: none;
	border-radius: 5px;
	border: 1px solid #ccc;
	top: 100%;
	margin-top: -1px;
	z-index: 11020; /* place over messages */
	overflow: hidden;
	}

.dd_list > ul{
	max-height: 300px;
	overflow: auto;
	overflow-x: hidden !important;
	overflow-y: auto !important;
}

.dd_list .list_heading{
	font-weight: bold;
	padding: 0 10px;
	background: #f1f1f1 !important;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	margin-bottom: 3px;
	font-size: 15px;
	}
.dd_list li:first-child .list_heading{
	border-top: 0 none;
	}


.dd_list li > span,
.dd_list li > b,
.dd_list li > a{
	padding: 3px 17px !important;
	display: block;
	min-width: 200px;
	position: relative;
	}

.dd_list li.selected > *{
	font-weight: bold;
	}
.dd_list li > *:hover{
	background: #f5f5f5;
	}
.dd_list li.selected > *:before{
	content: "\25B6";
	font-size: 8px;
	color: #aaa;
	margin-left: -10px;
	position: absolute;
	}


#admin_search .match_stats{
	color: #666;
	display: block;
	}
#admin_search .result_list h4{
	margin: 20px 0 0 0;
	}
#admin_search .result_list h4 a{
	font-weight: normal;
	font-size: 17px;
	margin: 0;
	color: #226699 !important;
	border-bottom: 0 none;
	}


.ui-selectable-helper{
	z-index: 10000 !important;
	}




#gp_admin_html .hmargin_tabs,
#gp_admin_html .hmargin{
	margin-top: 0;
	margin-bottom: 1em;
	color: #333;
	}

.hmargin a,
.hmargin span{
	display: inline-block;
	white-space: nowrap;
	}
.hmargin_tabs a,
.hmargin_tabs span{
	border-right: 2px solid #eee;
	padding: 0 10px;
	margin: 0;
	display: inline-block;
	white-space: nowrap;
	}

.hmargin_tabs a,
.hmargin a{
	color: #888 !important;
	border-bottom: 0 none  !important;
	}
.hmargin_tabs a:hover,
.hmargin a:hover{
	color: #333 !important;
	}
.hmargin span{
	color: #bbb;
	margin: 0 5px;
	}

.hmargin_tabs *:last-child{
	border: 0 none;
	}

.well{
	border: 1px solid #ddd;
	padding: 20px;
	background: #f9f9f9;
	border-radius: 3px;
	margin-bottom: 20px;
}


/**
 * Full Size Admin Area
 *
 */
.admin_body{
	margin: 0;
	padding: 0;
	height: 100%;
	box-sizing: border-box;

	body{
		margin: 0;
		padding: 0;
		height: 100%;
		box-sizing: border-box;
		}

	#gp_admin_html{
		position: relative;
		text-transform: none;
		box-sizing: border-box;
	}



	#simplepanel{
		position: absolute;
		width: 180px;
		top: 0;
		left: 0;
		bottom: 0;

		> div{
			border-radius: 0;
			border: 0 none;
			height: 100%;
			width: 180px;
			margin: 0;
			@include box-shadow( none );
		}

		> div:after{
			content: '';
			position: fixed;
			width: 180px;
			top: 0;
			left: 0;
			bottom: 0;
			border: 1px solid #000;
			background: $gp_panel_bg;
			@include box-shadow( 0 0 3px rgba(0,0,0,0.6) );
			z-index: -1;
			}

		.toggle_panel{
			display: none;
		}

	}
}

/* ckeditor & autocomplete conflict */
.cke_dialog_ui_input_text .ui-helper-hidden-accessible{
	display: none;
	}
#admincontent_inner .cke_reset *{
	@include box-sizing( content-box );
	}




/**
 * New section options
 *
 */
#new_section_links > div{
	display: inline-block;
	max-width: 100px;
	width: 50%;
	position: relative;
	overflow: hidden;
}

#new_section_links input{
	position: absolute;
	left: -30px;
	top: 0px;
}

#new_section_links label,
#new_section_links a{
	display: block;
	border: 1px solid #ddd;
	border-radius: 3px;
	padding: 0;
	background: #fff;
	margin: 0 3px 3px 0;
	color: #666 !important;
	box-sizing: border-box;
	text-align: center;
	height: 52px;
	vertical-align: top;
	overflow: hidden;
	outline: none;
	position: relative;
	cursor: pointer;
	}

#new_section_links a:hover
#new_section_links input:checked + label{
	border-color: #999;
	}

#new_section_links a:hover:after,
#new_section_links input:checked + label:after{
	position:absolute;
	top:1px;
	left:1px;
	right:1px;
	bottom:1px;
	z-index:1;
	background:rgba(0,0,0,0.1);
	content:' ';
	}


#new_section_links span{
	font-size: 12px;
	padding: 4px;
	position: relative;
	top:  50%;
	-webkit-transform:  translateY(-50%);
	-ms-transform:  translateY(-50%);
	transform:  translateY(-50%);
	display: inline-block;
	text-shadow: 0 1px 1px #fff;
	}


/**
 * Scroll list
 *
 */
#gp_admin_html .gp_scrolllist{
	transform:translateZ(1px);
	padding-left: 0;
	padding-right: 0;
	width: auto;
	display: block;
	overflow:hidden;
}

#gp_admin_html .gp_scrolllist > div{
	height: 300px;
	overflow: auto;
	overflow-x: hidden;
	margin-top:24px;
}


.gp_scrolllist > div > input.gpsearch{
	box-sizing: border-box !important;
	width: 100% !important;
	display: block;
	padding: 5px 10px;
	border: 0 none;
	border-bottom: 1px solid #ccc;
	margin-bottom: 3px;
	position:fixed;
	top:0;
	}

.gp_scrolllist label,
.gp_scrolllist span{
	display: block;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	margin:0;
	white-space:nowrap;
	text-overflow:ellipsis;
	}

.gp_scrolllist label input{
	position: absolute;
	left: -20px;
	z-index: -1;
	}

.gp_scrolllist label > span{
	border: 1px solid #fff;
	border-radius: 4px;
	padding: 3px 5px;
	color: #666;
	margin: 3px 6px;
	}

.gp_scrolllist label.filtered > span{
	display: none;
	}

.gp_scrolllist input:checked + span{
	display: block !important;
	border-color: #ddd;
	background-color: #eee;
	}

.gp_scrolllist label span.slug{
	color: #aaa;
	font-size:11px !important;
	}


/**
 * Fontawesome
 *
 */
#gp_admin_html .fa{
	font-family:FontAwesome;
}


/**
 * Layout Editor/Codemirror
 *
 */
.CodeMirror {
	font-family:"Consolas", "Menlo", "Andale Mono", "DejaVu Sans Mono", monospace!important;
	}