* 
{
}

body
{
	background-size			: 100% auto;
}

h1 {
	font-size			: 1.5em;
	text-align			: left;
	margin-top			: .5em;
	margin-left			: 1.1em;
}

h2 {
	font-size			: 1.5em;
}

p {
	font-size			: .9em;
}

td {
	padding				: .25em;
}

#main {
	width 				: 100%;
	height				: 100%;
}

#header {
	position			: fixed;
	justify-content		: space-between;
	display				: flex;
	padding 			: .5em 0;
	width				: 100%;
	height				: 4em;
}

#header p{
	display				: none;
	margin				: auto 1em 0
}

#infotable {
	display 			: inline-flex;
	/*align-items			: stretch;*/
	/*align-content		: stretch;*/
	gap					: 1em 0em;
	justify-content		: center;
	flex-grow			: 0;
	/*flex-flow			: row wrap;*/
	margin 				: 8em 0 0 0;
}

#infotable table.infotable {
	width				: 100%;
}

#infotable table.infotable > tbody > tr > td {
	padding 			: .5em;
}

#infotable th, #infotable td{
	vertical-align		: middle;
}

.box {
	width				: 49%;
	margin				: .5em 1em 1em 1em;
	background-color	: rgba(150,0,0,0.5);

}

p.in_img
{
	display 			: inline;
}

.image_graph {

}

.cam-image 
{
	width				: 100%;
	height				: auto;
	
}

input, .button {
	font-size			: 1em;
}

.symbol {
	height				: 3em;
}

/* NAVIGATION */

#navi
{
	position			: absolute;
	width				: 100%;
	display				: block;
	/*position			: fixed;*/
	top					: 2em;
}

#navi-index
{
	display				: flex;
	justify-content		: space-around;
	flex-grow			: 1;
	align-items			: stretch;
	align-content		: stretch;
	border-top			: 2px solid #300;
	border-bottom		: 2px solid #300;
	box-shadow			: 0 0 .5em #900;
}

.nav-point
{
	height				: 2.5em;
	width				: 100%;
	padding-top			: .5em;
	padding-bottom		: .5em;
	font-weight			: 700;
	text-align			: center;
	font-size			: 1em;
	text-transform		: uppercase;

	color				: #FFF;
	vertical-align		: top;
	border-left			: 1px solid #900;
	border-right		: 1px solid #900;
	
}
/*
.nav-point:active,
.nav-point:hover,
.nav-point:focus,
.nav-point-active
{
	z-index				: +1;
	background			: radial-gradient(farthest-side at 200% -100%, rgba(0,0,0,0.9), rgba(0,200,0,0.9));	color				: #050;
	text-shadow			: 0 0 .125em #0F0;
	border				: 1px solid #090;
	transition			: .5s background;
}*/

/* SYMBOLE NAVIGATION */

.sym-cam,
.sym-log,
.sym-files,
.sym-user,
.sym-notify,
.sym-about,
.sym-logout
{
	opacity				: .45;
	background-size		: auto 60%;
	background-repeat	: no-repeat;
	background-position	: 1em;
	transition			: .25s opacity ease-out;
}

.nav-point:active,
.nav-point:hover,
.nav-point-active
{
	z-index				: +1;
	opacity				: .9;
	transition			: .25s opacity ease-in;
}


/* FILES */

	#infotable td.galery
	{
		width				: 100%;
	}

	div.files 
	{
		display				: flex;
		flex-wrap			: wrap;
		justify-content		: space-between;
		width				: 100%;
		border				: 1px solid #F00;
		padding				: .5em .5em 0 .5em;
		border-radius		: .25em;
		background-color	: rgba(0,0,0,.5);
	}
	
	div.file
	{
		width				: calc(100% - .25em);
		border-radius		: .25em;
	}
	
	div.current_folder p
	{
		
	}		
	
	div.file a 
	{
	
	}

	p.pic_desc {
		width				: 100%;
		text-align			: left;
		font-size			: .75em;
		color				: #0F0;
		margin-left			:.5em;
		margin-top 			: -1.75em;
		margin-bottom		: .6em;
	}

	
	div.files div.file
	{
		margin				: auto 0;
	}

	img.files-image
	{
		width				: calc(100%);
		height				: auto;
	}	

	img.files-image:active
	{
		z-index				: 100;
		position			: fixed;
		top					: 5%;
		bottom				: 5%;
		left				: 5%;
		right				: 5%;
		height				: 90%;
		width				: auto;
		max-height			: 90%;
		max-width			: 90%;
		outline				: 2px solid #F00;
		box-shadow			: 0px 0px 3em 1em #000;
		border-radius		: .5em;
	}	
	
	video.files-video
	{
		width				: calc(100%);
		height				: auto;
	}	


/* FORMULAR */
	input[type="checkbox"]
	{
		width				: 1em;
		height				: 1em;
		text-height			: 1em;
	}