.upload-php{
	#wpbody{
		#wpbody-content{
			display: flex;
			flex-wrap: wrap;
            overflow: hidden; 
			#screen-meta-links{
				position: absolute;
				right: 0px;
			}
			#screen-meta,.update-nag{
				width: 100%;
			}
			.hmh_filebase_toolbar{ 
				position: relative;
				overflow: hidden;
				margin-right: 0px;
				margin-top:10px;
				width: 15%;
				max-width: 800px;		
				flex: 0 0 auto;
				i.hmh-manual{
					cursor: pointer;
					border-radius: 10px;
					position: absolute;
					top: 12px;
					right: 1px;
					z-index: 999;
					color: #8f8e8e;
					font-size: 22px;
				}
				div.hmh-function-button{
					position: relative;
					margin-bottom: 15px;
					height: auto;
					padding-left: 18px;
					button{
						height: 28px;
						margin: 12px 0px;
					&#delete-folder{
						margin-left:10px; 
					}
					}
					
					i.hmh_load_ajax{
						display: inline-block;
						width: 20px;
						height: 20px;
						position: absolute;
						top: 17px;
						left: 157px;
						&:before{
							display: inline-block;
							content: " ";
							background-image: url("../imgs/loadAjax.gif");
							width: 20px;
							height: 20px;
							background-size:cover;

						}
					}
					i.hmh_load_ajax_unable{
						opacity: 0;
						visibility: hidden;
					}
				}
				div.hmh_file.jstree{
					margin-top: 2px;
					ul.hmh-folder-ul{
						margin: 0px;
						li.new-folder-wrap{
							margin: 0 0 0 25px;
							i.hmh-icon-folder{	
								width: 24px;
								display: inline-block;
								height: 24px;
								position: relative;
								top:1px;
								margin-right: 5px;
								font-size: 16px;
								color: #8f8e8e;
								display: inline-block;
								align-items: center;
								justify-content: center;
							}
							input{
								width: 125px;
								margin-right: -25px;
							}
							.filebase-function-new{
								display: inline-block;
								margin-left: 30px;
								span{
									display: inline-block;
									i.hmh-function-x-v{
										box-shadow: 0.4px 0.5px 2px #888;
										border-radius: 10px;
										background: #fff;
										margin: 0 3px;
										width: 20px;
										height: 20px;
										display: flex;
										align-items: center;
										justify-content: center;
										&.add-new-folder-now{
											color: #4caf50;
											cursor: pointer;
											&:hover{
												background: #4caf50;
												color: #fff;
											}
										}
										&.add-new-folder-cancel{
											color: #8f8e8e;
											cursor: pointer;
											&:hover{
												background: #ff5757;
												color: #fff;
											}
										}
									}
								}
							}
						}
						li.edit-folder-wrap {
							margin: 0 0 0 24px;
							i.hmh-icon-folder{	
								width: 24px;
								display: inline-block;
								height: 24px;
								position: relative;
								top:1px;
								margin-right: 5px;
								font-size: 16px;
								color: #8f8e8e;
								display: inline-block;
								align-items: center;
								justify-content: center;
							}
							input{
								width: 125px;
								margin-right: -25px;
							}
							.filebase-function-edit{
								display: inline-block;
								margin-left: 30px;
								span{
									display: inline-block;
									i.hmh-function-x-v{
										box-shadow: 0.4px 0.5px 2px #888;
										border-radius: 10px;
										background: #fff;
										margin: 0 3px;
										width: 20px;
										height: 20px;
										display: flex;
										align-items: center;
										justify-content: center;
										&.edit-folder-now{
											color: #4caf50;
											cursor: pointer;
											&:hover{
												background: #4caf50;
												color: #fff;
											}
										}
										&.edit-folder-cancel{
											color: #8f8e8e;
											cursor: pointer;
											&:hover{
												background: #ff5757;
												color: #fff;
											}
										}
									}
								}
							}
						}
						li.hmh_base_file{
							cursor: pointer;
							line-height: 32px;
							min-height: 32px;
							border-radius: 4px;
							position: relative;
							margin: 0px;
							&.temporary_hidden{
								display: none !important;
							}
							&[aria-selected="true"]{
								&>a{
									background:#fff;
									box-shadow: 1px 1px 3px #d7d7d7;
								}		
							}
							a{
								&:hover{
									background-color: #fff;
								}
								display: flex;
								align-items: center;
								height: 30px;
								border-radius: 4px;
								width: 100%;
								color: black;
								i.hmh-open-folder{
									position: relative;
									top: -2px;
									width: 24px;
									display: flex;
									align-items: center;
									justify-content: center;
									height: 24px;
									font-size: 20px;
									color: #8f8e8e;
								}
								i.hmh-icon-folder{	
									width: 24px;
									display: inline-block;
									height: 24px;
									position: relative;
									top:1px;
									margin-right: 5px;
									font-size: 16px;
									color: #8f8e8e;
									display: flex;
									align-items: center;
									justify-content: center;
								}
								strong.hmh_number_of_attachment{
									box-shadow: 0px 0px 0px 1px #ccc inset;
									border-radius: 1px;
									height: 20px;
									display: flex;
									align-items: center;
									position: absolute;
									right: 22px;
									background: #fff;
									justify-content: center;
									padding: 0 5px;
									font-size: 12px;
									transition: 0.6s;
									&.hmh-unable{
										opacity: 0;
										visibility: hidden;
									}
								}
							}
							&.hmh-didnHasChild{
								a{
									i.hmh-open-folder{
										opacity: 0;
										visibility: hidden;
									}
								}
							}
							&.mjs-nestedSortable-collapsed{
								&>ul{
									display: none;
								}
							}
							&>ul{
								margin-top: 2px;
								&>li.hmh_base_file{
									margin-left: 25px;
								}
								li.new-folder-wrap,li.edit-folder-wrap{
									margin-left: 50px;
								}
							}
							&>ul{
								&>li.placeholder{
									margin-left: 54px;
								}
							}
							
						}
						li.hmh-HR{
							margin: 8px 0px;
							height: 0px;
							border-top: #c4c4c4 1px solid;
							border-bottom: #fff 1px solid;
						}
						li.placeholder{
							margin-left: 29px;
							border: dashed 1px #999999;
						}
						
					}
				}
			} 
			#wp-media-grid{
				ul#filebase_breadcrumb{
					margin: 0px 0px 11px 0px;
					padding: 0px 0px 0px 12px;
					background-color: #fff;
					box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
					border: 1px solid #e5e5e5;
					li{
						padding: 6px 7px 5.8px 7px;
						font-size: 13px;
						display: inline-block;
						margin: 0px;
						
						&.hmh-breadcrumb-li{
							a{
								box-shadow: none;
								text-decoration: none;
								&:hover{
									i{
										color: #0073c3;
									}
									.hmh-breadcrumb-name{
										color: #0073c3;
									}
								}
								i{
									font-size: 16px;
									color: #8f8e8e;
									
								}
								.hmh-breadcrumb-name{
									color: #000;
									
								}
							}
						}
						&.hmh-breadcrumb-icon{
							font-size: 8px;
							color: #8f8e8e;
							position: relative;
						i{
							position: absolute;
							top:3px;
						}
						}
					}
				}
				ul.attachments.ui-sortable.ui-sortable-disabled{
					&::after{
						content: "";
						clear: both;
						display: block;
					}
					li#hmh-children-folder{
						margin-bottom: 0px !important;
						li.hmh_folder_child{
							position: relative;
							width: 250px;
							height: 50px;
							border: solid 1px #ccc;
							margin: 7px;
							display: inline-block;
							a{
								box-shadow: none;
								text-decoration: none;
								color: black;
								div{
									height: 100%;
									width: 100%;
									display: flex;
									align-items: center;
									font-size: 13px;
									background: #fff;
									&:hover{
										background-color: #0073aa;
										color:#fff;
									}
									i{
										background: #fff;
										display: flex;
										align-items: center;
										justify-content: center;
										width: 30px;
										height: 30px;
										border-radius: 15px;
										font-size: 20px;
										color: #8f8e8e;
										margin: 0px 15px 0px 15px;
									}
									.hmh_number_of_attachment{
										position: absolute;
										border-radius: 100%;
										background: #fff;
										color: #000;
										right: 10px;
										text-align: center;
										box-shadow: 0px 0px 0px 1px #ccc inset;
										padding: 0px 0px 0px 0px;
										display: flex;
										align-items: center;
										justify-content: center;
										min-width: 30px;
										min-height: 28px;
										padding: 0 0 2px 0;
									}
								}
								
							}	
						}
					}
				}
			}
			.filebase-show-hidden{
				width: 10px;
				position: relative;
				&>i{
					cursor: pointer;
					box-shadow: 0.4px 0.5px 2px #888;
					border-radius: 10px;
					background: #fff;
					margin: 0 3px;
					width: 18px;
					height: 20px;
					display: flex;
					align-items: center;
					justify-content: center;
					position: absolute;
					top: 80px;
					left: -17px;
					z-index: 999;
					color: #0073aa;
					font-size: 11px;
					padding: 0 0 0 2px;
				}
				&.hidden{
					display: none;
				}
			}
			.splitter{
				position: relative;
				flex: 0 0 auto;
				width: 0%;
				border-right: #c4c4c4 1px solid;
				border-left: #ffffff 1px solid;
				cursor: w-resize;
				margin: 0 15px 0 17px;
				&.hidden{
					display: none;
				}
				span.splitter-span{
					display: block;
					position: absolute;
					height: 33px;
					top: 75px;
					width: 15px;
					right: -8px;
					background: #b8b8b8;
					a{
						width: 0px;
						height: 20px;
						border-right: solid 1px #000;
						margin: 6px 1px;
						top: 9px;
						display: inline-block;
						&:first-child{
							margin-left: 4px;
						}
					}
				}
			}
			.wrap:not(.hmh_filebase_toolbar){
				flex: 1 1 auto;
				width: 45%;
			}
		}
	}
}
.media-modal-content{
	.media-frame.mode-select.wp-core-ui{
		.media-frame-menu{
			width: 280px;
			.hmh_filebase_toolbar{
				margin-right: 0px;
				margin-top:10px;
				width: 15% ;
				min-width: 250px;
				max-width: 800px;		
				flex: 0 0 auto;
				i.hmh-manual{
					cursor: pointer;
					border-radius: 10px;
					position: absolute;
					top: 23px;
					left: 239px;
					z-index: 999;
					color: #8f8e8e;
					font-size: 22px;
				}
				div.hmh-function-button{
					position: relative;
					margin:15px 0;
					height: auto;
					padding-left: 18px;
					background: #fff;

					button{
						height: 28px;
						margin: 12px 0px;
					&#delete-folder{
						margin-left:10px; 
					}
					}
					
					i.hmh_load_ajax{
						display: inline-block;
						width: 20px;
						height: 20px;
						position: absolute;
						top: 17px;
						left: 157px;
						&:before{
							display: inline-block;
							content: " ";
							background-image: url("../imgs/loadAjax.gif");
							width: 20px;
							height: 20px;
							background-size:cover;

						}
					}
					i.hmh_load_ajax_unable{
						opacity: 0;
						visibility: hidden;
					}
				}
				div.hmh_file.jstree{
					margin-top: 25px;
					ul.hmh-folder-ul{
						li.new-folder-wrap{
							margin-left: 25px;
							i.hmh-icon-folder{	
								width: 24px;
								display: inline-block;
								height: 24px;
								position: relative;
								top:1px;
								margin-right: 5px;
								font-size: 16px;
								color: #8f8e8e;
								display: inline-block;
								align-items: center;
								justify-content: center;
							}
							input{
								width: 125px;
								margin-right: -25px;
							}
							.filebase-function-new{
								display: inline-block;
								margin-left: 30px;
								span{
									display: inline-block;
									i.hmh-function-x-v{
										box-shadow: 0.4px 0.5px 2px #888;
										border-radius: 10px;
										background: #fff;
										margin: 0 3px;
										width: 20px;
										height: 20px;
										display: flex;
										align-items: center;
										justify-content: center;
										&.add-new-folder-now{
											color: #4caf50;
											cursor: pointer;
											&:hover{
												background: #4caf50;
												color: #fff;
											}
										}
										&.add-new-folder-cancel{
											color: #8f8e8e;
											cursor: pointer;
											&:hover{
												background: #ff5757;
												color: #fff;
											}
										}
									}
								}
							}
						}
						li.edit-folder-wrap {
							margin-left: 24px;
							i.hmh-icon-folder{	
								width: 24px;
								display: inline-block;
								height: 24px;
								position: relative;
								top:1px;
								margin-right: 5px;
								font-size: 16px;
								color: #8f8e8e;
								display: inline-block;
								align-items: center;
								justify-content: center;
							}
							input{
								width: 125px;
								margin-right: -25px;
							}
							.filebase-function-edit{
								display: inline-block;
								margin-left: 30px;
								span{
									display: inline-block;
									i.hmh-function-x-v{
										box-shadow: 0.4px 0.5px 2px #888;
										border-radius: 10px;
										background: #fff;
										margin: 0 3px;
										width: 20px;
										height: 20px;
										display: flex;
										align-items: center;
										justify-content: center;
										&.edit-folder-now{
											color: #4caf50;
											cursor: pointer;
											&:hover{
												background: #4caf50;
												color: #fff;
											}
										}
										&.edit-folder-cancel{
											color: #8f8e8e;
											cursor: pointer;
											&:hover{
												background: #ff5757;
												color: #fff;
											}
										}
									}
								}
							}
						}
						li.hmh_base_file{
							cursor: pointer;
							line-height: 32px;
							min-height: 32px;
							border-radius: 4px;
							position: relative;
							margin: 0px;
							&.temporary_hidden{
								display: none !important;
							}
							&[aria-selected="true"]{
								&>a{
									background:#fff;
									box-shadow: 1px 1px 3px #d7d7d7;
								}		
							}
							a{
								&:hover{
									background-color: #fff;
								}
								display: flex;
								align-items: center;
								height: 30px;
								border-radius: 4px;
								width: 100%;
								color: black;
								i.hmh-open-folder{
									position: relative;
									top: -2px;
									width: 24px;
									display: flex;
									align-items: center;
									justify-content: center;
									height: 24px;
									font-size: 20px;
									color: #8f8e8e;
								}
								i.hmh-icon-folder{	
									width: 24px;
									display: inline-block;
									height: 24px;
									position: relative;
									top:1px;
									margin-right: 5px;
									font-size: 16px;
									color: #8f8e8e;
									display: flex;
									align-items: center;
									justify-content: center;
								}
								strong.hmh_number_of_attachment{
									box-shadow: 0px 0px 0px 1px #ccc inset;
									border-radius: 1px;
									height: 20px;
									display: flex;
									align-items: center;
									position: absolute;
									right: 22px;
									background: #fff;
									justify-content: center;
									padding: 0 5px;
									font-size: 12px;
									transition: 0.6s;
									&.hmh-unable{
										opacity: 0;
										visibility: hidden;
									}
								}
							}
							&.hmh-didnHasChild{
								a{
									i.hmh-open-folder{
										opacity: 0;
										visibility: hidden;
									}
								}
							}
							&.mjs-nestedSortable-collapsed{
								&>ul{
									display: none;
								}
							}
							&>ul{
								&>li.hmh_base_file{
									margin-left: 25px;
								}
								li.new-folder-wrap,li.edit-folder-wrap{
									margin-left: 50px;
								}
							}
							&>ul{
								&>li.placeholder{
									margin-left: 54px;
								}
							}
							
						}
						li.hmh-HR{
							margin: 8px 0px;
							height: 0px;
							border-top: #c4c4c4 1px solid;
							border-bottom: #fff 1px solid;
						}
						li.placeholder{
							margin-left: 29px;
							border: dashed 1px #999999;
						}
						
					}
				}
			}
		}
		ul#filebase_breadcrumb{
			margin: 0px;
			position: absolute;
			left: 489px;
			z-index: 201;
			top: 59px;
			width: 73%;
			background-color: #fcfcfc;
			li{
				padding: 0 7px;
				font-size: 13px;
				display: inline-block;
				&.hmh-breadcrumb-li{
					a{
						box-shadow: none;
						text-decoration: none;
						&:hover{
							i{
								color: #0073c3;
							}
							.hmh-breadcrumb-name{
								color: #0073c3;
							}
						}
						i{
							font-size: 16px;
							color: #8f8e8e;
						}
						.hmh-breadcrumb-name{
							color: #000;
						}
					}
				}
				&.hmh-breadcrumb-icon{
					font-size: 8px;
					color: #8f8e8e;
					position: relative;
					i{
						position: absolute;
						top:-8px;
					}
				}
			}
		}
		.media-frame-content{
			.attachments-browser{
				ul.attachments{
					li#hmh-children-folder{
						margin-bottom: 0px !important;
						li.hmh_folder_child{
							position: relative;
							width: 250px;
							height: 50px;
							border: solid 1px #ccc;
							margin: 7px;
							display: inline-block;
							a{
								box-shadow: none;
								text-decoration: none;
								color: black;
								div{
									height: 100%;
									width: 100%;
									display: flex;
									align-items: center;
									font-size: 13px;
									background: #fff;
									&:hover{
										background-color: #0073aa;
										color:#fff;
									}
									i{
										background: #fff;
										display: flex;
										align-items: center;
										justify-content: center;
										width: 30px;
										height: 30px;
										border-radius: 15px;
										font-size: 20px;
										color: #8f8e8e;
										margin: 0px 15px 0px 15px;
									}
									.hmh_number_of_attachment{
										position: absolute;
										border-radius: 100%;
										background: #fff;
										color: #000; 
										right: 10px;
										text-align: center;
										box-shadow: 0px 0px 0px 1px #ccc inset;
										padding: 0px 0px 0px 0px;
										display: flex;
										align-items: center;
										justify-content: center;
										min-width: 30px;
										min-height: 28px;
										padding: 0 0 2px 0;
									}
								}
								
							}	
						}
					}
				}
			}
		}
		.media-frame-title,.media-frame-router,.media-frame-content,.media-frame-toolbar{
			left: 280px;
		}
	}
}
.elementor-editor-active{
	h1.wp-heading-inline{
		margin: 0 10px 0 18px;
		display: inline-block;
	}
	#add-new-folder{
		margin-left: 4px;
		padding: 4px 8px;
		position: relative;
		top: -3px;
		text-decoration: none;
		border: none;
		border: 1px solid #ccc;
		border-top-color: rgb(204, 204, 204);
		border-right-color: rgb(204, 204, 204);
		border-bottom-color: rgb(204, 204, 204);
		border-left-color: rgb(204, 204, 204);
		border-radius: 2px;
		background: #f7f7f7;
		text-shadow: none;
		font-weight: 600;
		font-size: 13px;
		line-height: normal;
		color: #0073aa;
		cursor: pointer;
		&:hover{
			border-color: #008ec2;
			background: #00a0d2;
			color: #fff;
		}
	}
	.hmh-editcategory-filter{
		width: 135px;
	}
}
div.media-frame{
	
	overflow: unset;
	div.media-frame-content{
		overflow: unset;
		div.attachments-browser{
			overflow: unset;
			ul{
				overflow: unset;
			}
		}
	}

}
.hmh-move-file-grid-content{
	cursor: default;
	width: auto;
	height: auto;
	z-index:9999999;
	position: absolute;
	width: 110px;
	height:auto;
	.hmh-move-file-grid{
		border-radius: 4px;
		padding: 5px 0;
		font-size: 13px;
		font-weight: 400;
		width: 100%;
		border: solid 1px #999898;
		background: #ccc;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}
.hmh-move-file{
	cursor: default;
	padding: 4px 10px;
	border: solid 1px #999898;
	background: #ccc;
	border-radius: 4px;
	font-size: 13px;
}

.swal2-container.swal2-center.swal2-fade.swal2-shown{
	z-index: 999999 !important;
}
.upload-php{
	.filebaseMediacategory-filter-grid{
		display: none;
	}
	.hmh-editcategory-filter{
		display: none;
	}
}
.hmh-leart-content{
	padding: 15px 0px 0px 90px;
	text-align: left;
	.hmh-leart{
		padding: 5px 0px;
		.fa.fa-check{
			margin: 0 10px 0 0;
			width: 18px;
			height: 18px;
			display: inline-block;
			align-items: center;
			justify-content: center;
			border-radius: 100%;
			color: #fff;
			background: #3cff1a;
		}	
	}
}
.ui-selectable-helper {position: absolute; z-index: 100; border:1px dotted black;}