.media-frame-menu .media-menu #jao{
    width: 100%;
    padding: 10px 0px 10px 0px;
    border-left:0;
    border-right:0;
}

.upload-php #jao{
    width: 18%;
    margin:10px 0px 10px 10px;
}

.wp-customizer #jao{
    width: 220px;
    margin:10px 0px 10px 10px;
}

.wp-customizer #jao , .themes-php #jao{
    width: 220px;
    margin:10px 0px 10px 10px;
}

#jao {
	border: 1px solid #CCC;
	padding: 10px;
	background: #FAFAFA;
        float:left;
        min-height:98px;
        max-height: 250px;
        overflow: auto;
}

ul.jaofiletree {
	font-family: Verdana, sans-serif;
	font-size: 11px;
	line-height: 18px;
	padding: 0px;
	margin: 0px;
}

ul.jaofiletree li {
	list-style: none;
	padding: 0px;
	padding-left: 12px;
	margin: 0px;
	white-space: nowrap;
        background: #FAFAFA;
}
ul.jaofiletree li.drive {
	padding-left: 15px;
}

ul.jaofiletree a {
	color: #333;
	text-decoration: none;
	display: inline-block;
	padding: 0px 2px;
}

ul.jaofiletree a.title-folder {
	padding: 0px 0px 0px 5px;
        min-width: 80%;
}


ul.jaofiletree a:hover {
	font-weight: bold;
}

ul.jaofiletree li.selected > a {
        font-weight: bold;
}

.icon-open-close{width: 9px;height: 16px; float:left;}
.jaofiletree li.directory.expanded .icon-open-close{ background: url(../images/folder_open.png) left top no-repeat; }
.jaofiletree li.directory.collapsed .icon-open-close { background: url(../images/directory.png) left top no-repeat; }
.jaofiletree .zmdi-folder,.jaofiletree .zmdi-folder-outline { font-size: 15px ;   margin-top: 2px; margin-left: 3px;color: #888888;font-weight: bold}
.zmdi-long-arrow-return{font-size: 60px !important;margin: 25px auto;color: #888888}
.wpmf-attachments-browser .zmdi-folder{font-size: 60px !important;margin: 25px auto;color: #888888}
.jaofiletree li.wait { background: url(../images/spinner.gif) left top no-repeat; }

.title-folder.title-root{
    padding: 0 !important;
}

.directory a.ui-hoverClass{
    color: #1e8cbe;
    font-weight: bold;
}

.attachment.wpmf_dragsmall,body.smallview_open .attachment.wpmf_dragsmall{
    width: 30px !important;
}

.attachment.wpmf_dragsmall .draggableNumber{
    display: none;
}

.wpmf-attachmentdrag{
    margin: 8px;
    width: 115px;
    height: 115px;
    position: relative;
    float: left;
    padding: 0;
    margin: 0 10px 20px;
    color: #464646;
    list-style: none;
    text-align: center;
}

.wpmf-attachmentdrag .wpmf-attachment-preview{
    position: relative;
    width: 120px;
    height: 120px;
    box-shadow: inset 0 0 15px rgba( 0, 0, 0, 0.1 ), inset 0 0 0 1px rgba( 0, 0, 0, 0.05 );
    background: #eee;
    cursor: pointer;
}

.wpmf-attachmentdrag .wpmf-attachment-preview .zmdi-folder{
    font-size: 60px !important;
    margin: 25px auto;
    color: #888888;
}

.wpmf-attachmentdrag .wpmf-attachment-preview .filename{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    max-height: 100%;
    word-wrap: break-word;
    text-align: center;
    font-weight: bold;
    background: rgba( 255, 255, 255, 0.8 );
    -webkit-box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
    box-shadow: inset 0 0 0 1px rgba( 0, 0, 0, 0.15 );
}

.wpmf-attachmentdrag.wpmf_dragsmall{
    height: 18px;
    margin: 0;
    padding: 0;
}

.wpmf-attachmentdrag.wpmf_dragsmall .wpmf-attachment-preview{
    height: 18px;
    box-shadow: none;
    background: transparent;
}

.wpmf-attachmentdrag.wpmf_dragsmall .wpmf-attachment-preview .zmdi-folder{
    font-size: 15px !important;
    margin: 0;
    float: left;
}

.wpmf-attachmentdrag.wpmf_dragsmall .wpmf-attachment-preview .filename{
    position: relative;
    text-align: left;
    background: transparent;
    box-shadow: none;
}

.smallview_open .wpmf-attachmentdrag.wpmf_draglarge{
    width: 70px;
    height: 70px;
}

.smallview_open .wpmf-attachmentdrag.wpmf_draglarge .wpmf-attachment-preview{
    width: 70px;
    height: 70px;
}

.smallview_open .wpmf-attachmentdrag.wpmf_draglarge .wpmf-attachment-preview .zmdi-folder{
    font-size: 40px !important;
    margin: 10px auto;
}

.ui-draggable-dragging.wpmf_dragsmall:not(.upload-php .ui-draggable-dragging.wpmf_dragsmall){
    opacity: 0;
}

.ui-draggable-dragging.wpmf_draglarge:not(.upload-php .ui-draggable-dragging.wpmf_draglarge){
    opacity: 1;
}

@media only screen and (max-width: 1024px){    
    .media-frame .wpmf-attachments-wrapper{
        top:220px;
    }
    
    .media-toolbar-secondary{
        max-width: 100% !important;
        margin-top: 20px;
    }
    
    .attachments-browser .media-toolbar,.wp-filter{
        min-height: 25px;
    }
    
    .upload-php .wpmf-arrow-toolbar,.upload-php .wpmf-arrow-folder{
        margin-top: 1px;
    }
    
    .wp-filter.wpmf-hide > *{
        display: none;
    }

    .wp-filter.wpmf-show > *{
        display: block;
    }

    .attachments-browser .media-toolbar.wpmf-hide > *,.wp-filter.wpmf-hide > *{
        display: none;
    }

    .attachments-browser .media-toolbar.wpmf-show > *,.wp-filter.wpmf-show > *{
        display: block;
    }

    .attachments-browser .media-toolbar .wpmf-show-hide,.wp-filter .wpmf-show-hide{
        display: block;
    }
    
    .wpmf-show-hide{
        position:absolute;
        right:10px;
        top:0px;
        color:#21759b;
    }
    
    .wpmf_sh{
        float: left;
    }
    
    .wpmf_sh label{
        line-height: 20px;
    }
}

@media only screen and (max-width: 900px){    
    .media-frame .wpmf-attachments-wrapper{
        top:220px;
        right:265px;
    }
}

@media only screen and (max-width: 768px){    
    .media-frame .wpmf-attachments-wrapper{
        top:300px;
    }    
}

@media only screen and (max-width: 768px) and (min-width : 640px){    
    .mode-grid .addFolder{
        margin-top: 0 !important;
    }
}

@media only screen and (max-width: 640px){    
    .media-frame .wpmf-attachments-wrapper{
        top:185px;
        right:0;
    }
    
    .wpmf-attachments-browser .wpmf-attachment{
        width: 90px;
        height: 90px;
    }
    
    .wpmf-attachments-browser .wpmf-attachment-preview{
        width: 95px;
        height: 95px;
    }
    
    .wpmf-attachments-browser .wpmf-attachment-preview .zmdi-folder{
        font-size: 45px !important;
        margin: 20px !important;
    }
}

@media only screen and (max-width: 480px){    
    #jao{
        width: 95% !important;
        padding: 0;
    }
    .wpmf-attachments-browser{
        width: 100% !important;
    }
    .wpmf-attachments-browser .wpmf-attachment{
        width: 90px;
        height: 90px;
    }
    
    .media-toolbar-secondary{
        max-width: 100% !important;
        margin-top: 20px;
    }
    
    .upload-php .wp-filter .filter-items{
        margin-top: 20px;
    }
    
    .wpmf-attachments-browser .wpmf-attachment-preview{
        width: 95px;
        height: 95px;
    }
    
    .wpmf-attachments-browser .zmdi-folder,.wpmf-attachments-browser .zmdi-long-arrow-return{
        font-size: 40px !important;
        margin: 20px auto;
        color: #888888;
    }
    
    .media-frame .wpmf-attachments-wrapper{
        top:250px;
    }
    
    .media-frame .media-sidebar.visible{
        margin-top: 20px;
    }
    
    .media-frame .media-frame-toolbar .media-toolbar-primary .button{
        font-size: 12px;
    }
    
    .media-frame .wpmf-attachments-wrapper .wpmf-attachments-browser{
        padding: 0;
    }
}

@media only screen and (max-width: 320px){    
    .media-frame .wpmf-attachments-wrapper{
        top:330px;
    }
    
    .media-frame .media-frame-toolbar .media-toolbar-primary .button{
        font-size: 10px;
    }
}