/*@media screen and (orientation:portrait) and (min-width: 361px)*/

input#search2 {
    margin: 0 0 8px 0;
    color: #383838;
    /* border: 1px dotted #9e9e9e; */
    box-shadow: none;
    font-size: 1rem;
    height: 2rem;
    padding-left: 5px;
}


#main {
	position:absolute;
	top:0;
	bottom:0;
	padding-left:3px;
	width:100%;
	overflow:auto;
	box-sizing:border-box;
	/*display:none*/
}

#login {
	position:absolute;
	background-color: #f0f0f0;
	top:30%;
	left:40%;
	/*height:200px;*/
	width:27rem;
    text-align: left;
    /*margin: 2px;*/
    padding: 0px;
    /*vertical-align: bottom;*/
    z-index: 15;
    border-radius: 3px;
    /*display:none;*/
}

#login_logo{
    background: #5D5B5B;
    margin-top: 2px;
    box-sizing: border-box;
    font-size: 1.5rem;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 1rem;
}

#login_logo img{
    height: 25px;
    float: right;
    position: relative;
    top: 15px;
    right: 5px;
}

#login_sep1 {
    background: #383838;
    width: 99%;
    margin: auto;
    margin-top: 2px;
    margin-bottom: 2px;
    box-sizing: border-box;
    height:2px;
}

#login_foot {
    background: rgb(93, 91, 91);
    width: 99%;
    margin: auto;
    margin-bottom: 2px;
    height: 0.7rem;
}

#login_identification {
	/*background-color: #f0f0f0;*/
    padding: 1.1rem;
    padding-bottom: 0.7rem;
}

/*#imageinfo_test input,*/
#login input[type="text"],
#login input[type="password"] {
	margin: 0 0 8px 0;
	color:#383838;
	border: 1px solid #9e9e9e;
	box-shadow:none;
	font-size: 1.2rem;
	height: 2.2rem;
	padding-left: 5px;
}

#login_connection {
    /* background-color: #f0f0f0; */
    padding-left: 1.5rem;
    /* border-top: rgba(239, 239, 239, 0.68) solid 1px; */
    margin-right: 2px;
    margin-left: 2px;
    padding-top: 10px;
}

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'),
  		local('MaterialIcons-Regular'),
  		url(MaterialIcons-Regular.woff2) format('woff2'),
  		url(MaterialIcons-Regular.woff) format('woff');
}


span.color-picker {
	margin:2px;
	padding:4px;
	border-style:solid;
	border-width:1px;
	border-color:rgb(212, 212, 212);
}



span.color-picker:hover {
	margin:2px;
	padding:10px;
	border-style:solid;
	border-width:2px;
	font-size: 3em;
	border-color:rgba(56, 56, 56, 0.47);
	-webkit-transition-delay: 1s;
	/*-webkit-transition: width 2s;*/
	/*-webkit-transition-timing-function: ease;*/

	-webkit-transition-timing-function: ease;
    -webkit-transition: width 2s;
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}


body {
	font-size: 80%
}

html {
	font-size:80%
}

div[data-viewid] .mainicon {
	user-select: none;
	padding: 2px;
	position: relative;
	top: 0.9rem;
	font-size: 2.3rem;
	/*color:#34495e;*/
	color:#26a69a;
}

/*
@media screen and (max-width: 480px) {

	div[data-viewid] .mainicon {
		user-select: none;
		padding: 2px;
		position: relative;
		top: 0.9rem;
		font-size: 1rem;
		color:#26a69a;
	}


}*/


.btn-small {
    font-size: 0.8rem;
    margin: 2px;
    padding: 2px;
    /*line-height: 1rem;*/
}

.btn-verysmall {
    margin: 0px;
    padding: 4px;
    font-size: 60%;
    height: 25px;
    line-height: inherit;
}


.folder_main {
	text-align:left;
	display:inline-block;
	min-width:2rem;
	font-weight: 400;
	font-size: 0.9rem;
	color: #fff;
	background-color: rgba(38, 166, 154, 0.53);
	/*background-color: rgb(152,152,152);*/
	border-radius: 1px;
	padding: 2px;
	padding-left: 3px;
	padding-right: 3px;
	margin:2px;
}



.folder {
	/*text-align:right;*/
	display:inline-block;
	min-width:3rem;
	font-weight: 300;
	font-size: 0.9rem;
	color: #fff;
	background-color: rgba(38, 166, 154, 0.53);
	/*background-color: rgb(152,152,152);*/
	border-radius: 1px;
	padding: 2px;
	padding-left: 3px;
	padding-right: 3px;
	margin:2px;
}


.folder_small {
	/*text-align:right;*/
	display:inline-block;
	min-width:1rem;
	/*font-weight: 400;*/
	font-size: 1rem;
	color: #fff;
	background-color: rgba(38, 166, 154, 0.53);
	/*background-color: rgb(152,152,152);*/
	border-radius: 1px;
	padding: 2px;
	padding-left: 3px;
	padding-right: 3px;
	margin:2px;
}


.folder_small:hover {
	background-color: rgba(39, 60, 58, 0.53);
}


@media screen and (min-width: 520px) {
	#dirinfo,
	#imageinfo {
		border-radius: 4px;
		padding:5px;
		padding-top: 20px;
		width:38%;
		min-width:580px;
		position:absolute;
		top:2rem;
		right:100px;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem
	}
}



@media screen and (max-width: 520px) {
	#dirinfo,
	#imageinfo {
		border-radius: 4px;
		padding:5px;
		padding-top: 5px;
		width:95%;
		/*min-width:580px;*/
		position:absolute;
		top:1rem;
		right:0px;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem
	}
}

#dirinfo i,
#imageinfo i {
	color:#26a69a;
}

#dirinfo,
#imageinfo_main {
	overflow:auto;
}


#dirinfo tr td:first-child,
#imageinfo_main tr td:first-child {
	font-weight:bold;
}

#dirinfo tr td,
#imageinfo_main tr td {
	padding:4px;
}



#imageinfo_xmp tr td:first-child {
	font-weight:bold;
	padding:2px;
}

#imageinfo_xmp tr td {
	padding:2px;
}


#imageinfo_versions tr td {
	padding:2px;
}


#imageinfo_main tr td {
	padding:4px;
}

#imageinfo_links tr,
#imageinfo_links td {
	padding:7px;
	/*vertical-align: top;*/
	border-bottom: 1px solid #BFBFBF;
	border-right: 1px dotted #bfbfbf;
}

#imageinfo_links td:nth-child(3) {
	vertical-align: top;
}



#imageinfo_copies td,
#imageinfo_copies tr,
#imageinfo_versions td,
#imageinfo_versions tr
 {
	padding:4px;
}


#imageinfo_copies,#imageinfo_versions {
	overflow:auto;

}

@media screen and (min-width: 520px) {
	#configuration {
		border-radius: 4px;
		padding:5px;
		padding-top: 20px;
		width:38%;
		min-width:520px;
		/*visibility:hidden;*/
		position:absolute;
		top:3rem;
		right:100px;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem;
		/*height:400px;*/
	}
}

@media screen and (max-width: 520px) {
	#configuration {
		border-radius: 4px;
		padding:3px;
		padding-top: 5px;
		width:95%;
		/*min-width:480px;*/
		/*visibility:hidden;*/
		position:absolute;
		top:3rem;
		right:0px;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem;
		/*height:400px;*/
	}
}


#configuration i {
	color:#26a69a;
}

#configuration tr td {
	padding:7px;
}



@media screen and (min-width: 520px) {
	#zoom {
		border-radius: 4px;
		padding:5px;
		padding-top: 20px;
		width:50%;
		right:150px;
		/*visibility:hidden;*/
		position:absolute;
		top:4rem;
		left:10%;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem
	}
}

@media screen and (max-width: 520px) {
	#zoom {
		border-radius: 4px;
		padding:2px;
		padding-top: 5px;
		width:95%;
		/*right:150px;*/
		/*visibility:hidden;*/
		position:absolute;
		top:2rem;
		left:1rem;
		background-color:#eeeeee;
		border-style:solid;
		border-width:1px;
		border-color:rgb(212, 212, 212);
		font-size:0.9rem
	}
}

#zoom i {
	color:#26a69a;
}





/*--------------------------------Basket-------------------------------*/
#basket {
	border-radius: 4px;
	padding:5px;
	padding-top: 20px;
	width:38%;
	position:absolute;
	top:5rem;
	right:200px;
	background-color:#eeeeee;
	border-style:solid;
	border-width:1px;
	border-color:rgb(212, 212, 212);
	font-size:0.9rem
}

#basket i {
	color:#26a69a;
}





#basket div.full_diapo_file,
#basket div.full_diapo_folder{
	margin-left: auto;
	margin-right: auto;
	font-size: 0.9rem;
	display:inline-block;
}

#basket div.full_diapo_file img,
#basket div.full_diapo_folder img{
	max-height: 80px;
}



/*--------------------------------Upload progress-------------------------------*/
#upload {
	border-radius: 4px;
	padding:5px;
	padding-top: 20px;
	width:40%;
	/*height:30%;*/
	position:absolute;
	top:6rem;
	right:120px;
	background-color:#eeeeee;
	border-style:solid;
	border-width:1px;
	border-color:rgb(212, 212, 212);
	font-size:0.9rem
}

#upload i {
	color:#26a69a;
}



#upload tr td {
	padding:2px;
}


#upload tr td {
	padding:2px;
}



#upload table tr:nth-child(odd) {
  background-color:rgb(221, 221, 221);

}

#upload table tr:nth-child(even) {
  background-color:rgb(236, 236, 236);

}


/*--------------------------------Image & Folder Views -------------------------------*/
div[data-viewid] div.diapo_file,
div[data-viewid] div.diapo_folder{
	background-color:#f0f0f0;
	text-align: center;
	margin:2px;
	padding:2px;
	padding-top:7px;
	position:relative;
	display:inline-block;
	vertical-align: bottom;
}


div[data-viewid] div.diapo_file img,
div[data-viewid] div.diapo_folder img {
	margin-left: auto;
	margin-right: auto;
}


div[data-viewid] div.full_diapo_file,
div[data-viewid] div.full_diapo_folder{
	background-color:#f0f0f0;
	text-align: center;
	margin:2px;
	padding:2px;
	padding-top:7px;
	position:relative;
	display:inline-block;
	vertical-align: bottom;
}

div[data-viewid] div.full_diapo_file img,
div[data-viewid]  div.full_diapo_folder img {
	margin-left: auto;
	margin-right: auto;
}


div[data-viewid] tr.list_file,
div[data-viewid] tr.list_folder{
	background-color:#f0f0f0;
	font-size:1.0rem
}




div[data-viewid] div[data-zoom] div i {
	font-size:1.2rem;
	color:#ffce00;
}

div[data-viewid] div[data-zoom] p {
	margin:2px;
	text-align:center;
}

/*Zoom 1 folder*/
div[data-viewid] div[data-zoom="1"] div.diapo_folder img,
div[data-viewid] div[data-zoom="1"] tr.list_folder img,
div[data-viewid] div[data-zoom="1"] div.full_diapo_folder img {
	max-height: 110px;
	font-size: 0.9rem;
}


/*Zoom 1 file*/
div[data-viewid] div[data-zoom="1"] div.diapo_file img,
div[data-viewid] div[data-zoom="1"] tr.list_file img,
div[data-viewid] div[data-zoom="1"] div.full_diapo_file img{
	max-height: 120px;
	font-size: 0.9rem;
}




/*Zoom 2 folder*/
div[data-viewid]  div[data-zoom="2"] div.diapo_folder img,
div[data-viewid]  div[data-zoom="2"] tr.list_folder img,
div[data-viewid]  div[data-zoom="2"] div.full_diapo_folder img {
	max-height: 170px;
}

/*Zoom 2 file*/
div[data-viewid] div[data-zoom="2"] div.diapo_file img,
div[data-viewid] div[data-zoom="2"] tr.list_file img,
div[data-viewid] div[data-zoom="2"] div.full_diapo_file img {
	max-height: 220px;
}



/*Zoom 3 folder*/
div[data-viewid] div[data-zoom="3"] div.diapo_folder img,
div[data-viewid] div[data-zoom="3"] tr.list_folder img,
div[data-viewid] div[data-zoom="3"] div.full_diapo_folder img {
	max-height: 200px;
}

/*Zoom 3 file*/
div[data-viewid] div[data-zoom="3"] div.diapo_file img,
div[data-viewid] div[data-zoom="3"] tr.list_file img,
div[data-viewid] div[data-zoom="3"] div.full_diapo_file img {
	max-height: 300px;
}




div[data-viewid] div[data-zoom="1"] {
	font-size: 1rem;
}

div[data-viewid] div[data-zoom="2"]  {
	font-size: 1.1rem;
}

div[data-viewid] div[data-zoom="3"]  {
	font-size: 1.1rem;
}

.outdated {
	position: absolute;
    top: 5px;
    left: 5px;
    /* margin: auto; */
    /* width: 95%; */
}


@keyframes example {
    10%   {background-color: rgba(228, 221, 221, 0.92);top:80px; }
    90%  {background-color: rgba(228, 221, 221, 0.92);transform: rotate(360deg);left:-400px;}
}


#________________logo{
    float: right;
    max-height: 40px;
    position: relative;
    top: 10px;
    left: -30px;
    padding-right: 15px;
    padding-left: 15px;
    padding-top: 7px;
    /*border-radius: 2px;*/
    opacity: 0.8;
    /* z-index: 999; */
    /* background-color: rgba(43, 43, 43, 0.96); */
}


#logo{
    float: right;
    position: relative;
    top: 10px;
    left: -15px;
    padding-right: 10px;
    padding-left: 15px;
    padding-top: 7px;
    opacity: 0.8;
}

#logo img {
	max-height: 30px;
}

@media screen and (max-width: 800px) {
#logo img{
    display: none;
}



#________logo:hover {
	/*transform: rotate(90deg);*/
	/*background-color: rgba(228, 221, 221, 0.0);*/
	animation-name: example;
    animation-duration: 4s;



}