@import url(https://fonts.googleapis.com/css?family=Roboto);

* {
  box-sizing: border-box;
}

html, body { 
	font-family: 'Roboto', sans-serif;
}


/* .jstree-default-large .jstree-icon:empty { width: 24px; }
.jstree-default-large .jstree-file { background-position-x: -106px; }

*/

.ui-tabs .ui-tabs-panel {padding:0;}

#adm_add, #adm_topic {display:none;}
#adm_topic {	
    position: absolute;
	top:0;
    bottom:0;
    right:0;
    left:0;
}
#adm_add_title,#adm_add_description {width:100%;}

#actions 	{position: absolute;right: 12px;top: 56px;}
#actions a {padding:0 4px 0 4px;}


.scrollbox{/*overflow:auto;width:200px;max-height:200px;margin:50px auto;*/ background:linear-gradient(white 30%,rgba(255,255,255,0)),linear-gradient(rgba(255,255,255,0),white 70%) 0 100%,radial-gradient(50% 0,farthest-side,rgba(0,0,0,.2),rgba(0,0,0,0)),radial-gradient(50% 100%,farthest-side,rgba(0,0,0,.2),rgba(0,0,0,0)) 0 100%;background:linear-gradient(white 30%,rgba(255,255,255,0)),linear-gradient(rgba(255,255,255,0),white 70%) 0 100%,radial-gradient(farthest-side at 50% 0,rgba(0,0,0,.2),rgba(0,0,0,0)),radial-gradient(farthest-side at 50% 100%,rgba(0,0,0,.2),rgba(0,0,0,0)) 0 100%;background-repeat:no-repeat;background-color:#fff;background-size:100% 40px,100% 40px,100% 14px,100% 14px;background-attachment:local,local,scroll,scroll;}
#menu-checkbox { display: none; }

.searchq { border:1px solid #A9A9A9; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; } 
.searchq input {height: 32px;width: calc(100% - 50px);margin-right: 7px;}
.searchq input,.searchq input:focus,.searchq input:active {outline: 0; border: 1px solid transparent;}
.searchq img {width:32px;height:32px;vertical-align: middle;}

.fd td {
	border-bottom: 1px solid lightgray;
	vertical-align:top;
}
.fd td:first-child{
	width:25%;
	max-width:180px;
	padding:4px;
	font-weight: 800;
}

@media screen and (min-width: 769px)  {
	html, body { 
		height:100%;
		overflow: hidden;
	}

	.searchq { top: 10px; position: fixed; right: 10px; }
	

	#head h1,#head  h2,#head  p  { margin: 0; }
	#head p { color: #CECECE; }
	#branding { float: left; }
	#branding>a>img {
		height:96px;
		padding: 0 10px 0 10px;
	}
	/* Pane rules */
	#header 			{ height:96px;width: 100% }
	#sidebar 			{ position:absolute; width:260px;  	top:96px;bottom:0px;overflow-y: auto;overflow-x: hidden; }
	#sidebar:hover  { width: 50%;background: rgba(255, 255, 255, 0.91); z-index: 99999;border-right: 2px dotted #d2d2d2; }
	#sidebar.nav 	{ 													/*height:48px;*/ display:none;  }
				#tree 	{ position:absolute; 						/*top:48px;*/ top:0; bottom:0px;overflow-y: auto;overflow-x: hidden;width:100% }
	#page 				{ position:absolute; left:260px;		top:96px;bottom:0px;overflow-y: auto;overflow-x: hidden; margin-left:10px; right: 10px;}
}

@media screen and (max-width: 768px)  { 
	html { overflow-x: hidden; }
	
	/* #menu-checkbox { display: none; } */
	#menu-btn{width:32px;cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
	#menu-checkbox:checked ~ #overlay{display:block}
	#menu-checkbox:checked ~ #sidebar{visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	#menu-checkbox:checked ~ #header #three-lines{left:0}
	#menu-checkbox ~ #header #three-lines{position:relative;width:100%;height:45px;display:block;background:url(../img/menu.png) no-repeat;background-position:right;float:left;left:-8px}
	#menu-checkbox ~ #header select{height:32px;width:100%}
	#menu-checkbox ~ #header #menu-nav{margin-left:45px;height:100%;padding:6px 45px 0 0}
	#menu-checkbox ~ #header #menu-nav input{display:none;height:32px;width:100%}
	
	#overlay { display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); position: fixed; top: 0; left: 0; z-index: 100; }
	#sidebar {
		position: fixed;
		top: 50px;
		left: 0;
		z-index: 101;
		visibility: hidden;
		min-width: 300px;
		width:80%;
		height: 100%;
		-webkit-transition: all 0.2s;
		transition: all 0.2s;
		-webkit-transform: translate3d(-100%, 0, 0);
		transform: translate3d(-100%, 0, 0);
  
		margin:0;padding:0px;
  
		top: 0px;
		/*margin-top:50px;
		
		color: #fff;
		
		*/
		background: #fff;
		padding-bottom:50px; 
		overflow-y:auto;
		
		font-size: 18px/17px;
		font-family: "SecondaryFont","Helvetica-Light","Helvetica Neue","Helvetica","Roboto",sans-serif;
		line-height: 150%;			
	}
	

	#header 			{ height:48px; top:0; position:fixed; overflow:hidden; background:white;width: 100%; }
	#header 	h1, #header p { display:none; }
	#header 	h2 	{ font-size: 16px; }
	#branding { float:left }
	#branding>a>img { height:48px; }
	#page			{ margin: 48px 10px 0 10px; }
}











.form-group {
  width: 100%;
  height: 58px;
  overflow: hidden;
  position: relative;
}

.form-group label {
  position: absolute;
  top: 18px;
  color: rgba(0, 0, 0, 0.5);
  font: 700 18px Roboto;
  cursor: text;
  transition: .25s ease;
}

.form-group input {
  display: block;
  width: 100%;
  padding-top: 18px;
  border: none;
  border-radius: 0;
  transition: .3s ease;
}
.form-group input:valid ~ label {
  top: 0;
  font: 400 14px Roboto;
}
.form-group input:focus {
  outline: none;
}
.form-group input:focus ~ label {
  top: 0;
  font: 700 16px Roboto;
  color: #2196f3;
}
.form-group input:focus ~ .bar:before {
  transform: translateX(0);
}
/*
.form-group input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #333 inset;
  -webkit-text-fill-color: white !important;
}
*/

.form-group .bar {
  background: rgba(0, 0, 0, 0.5);
  content: '';
  width: 100%;
  height: 1px;
  transition: .3s ease;
  position: relative;
}
.form-group .bar:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 150%;
  background: #2196f3;
  transform: translateX(-100%);
}

