{% load static %}

html,
body {
	height: 100% ;
	margin: 0px 0px 0px 0px ;
	padding: 0px 0px 0px 0px ;
	}

.card {
	color: #262626 ;
	font-family: verdana ;
	font-size: 62.5% ;
	}

div#fileframe {
	background-color: #F5F5F5 ;
	float: left ;
	/* height: 78% ;*/
	overflow: auto ;
	width: 25% ;
	}

div#contentframe {
	background-color: #FFFFFF ;
	background-image: url( "/static/jsTree/themes/default/content_background.gif" ) ;
	background-position: left top ;
	background-repeat: repeat-y ;
	float: left ;
	height: 99% ;
	overflow: auto ;
	width: 75% ;
	}

h1 {
	margin: 0px 0px 0px 0px ;
	font-size: 2.0em ;
	font-weight: 400 ;
	line-height: 1.0em ;
	padding: 0px 0px 0px 0px ;
	}

div#filetree {
	font-size: 1.1em ;
	line-height: 1.1em ;
	padding: 10px 5px 10px 5px ;
	overflow-y: auto;
    max-height: 800px;
}


div#content {
	padding: 10px 20px 10px 20px ;
	}

h2 {
	margin: 0px 0px 1.0em 0px ;
	font-size: 1.6em ;
	line-height: 1.0em ;
	padding: 0px 0px 0px 0px ;
	}

pre {
	font-family: monospace, verdana ;
	font-size: 1.1em ;
	line-height: 1.4em ;
	}

div.clear {
	background-color: #CAC193 ;
	clear: both ;
	height: 2px ;
	line-height: 2px ;
	overflow: hidden ;
	}

.search-container{
    display: flex;
    width: 100%;
    padding: 10px 0px 10px 0px;
    font-size: 12px;
}

.search-box{
    width: 50%;
    padding-left: 5px;
}

#clear-button{
    margin-top: 18px;
}

.fa-folder,.fa-file{
    color: #6666;
}

#loading-div {
    padding-top: 15px;
    position: absolute;
    left: 12%;
}
#no-results{
    display: none;
    padding-top: 15px;
    position: absolute;
    left: 10%;
    font-size: 12px;
}
#loading-div img{
    width: 25px;
}
.transparent-effect{
    opacity: 30%;
}