/***************************************

Additional Style sheet for the file manager. 
	
	Author: Kyle Thompson 
			kthompson@desystems.com
	Version: 1.0
	Date: 21.08.13
	Updated:

***************************************/

body{
	margin:0px; 
	padding:0px;
}

#header {
	background:url(/image/css/Logo-DE.gif) no-repeat 5px 8px #efefef;
    border-spacing: 2px;
    color: #6699CC;
    display: table;
    height: 126px;
    margin-bottom: 0;
    margin-top: 0;
    text-indent: 0;
	width:100%;
	-webkit-box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
	box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
	position:relative;
}

#header h1, #header h2 {
	margin-bottom: 0;
    margin-left: 320px;
    margin-top: 0;
	line-height:29px;
}

#header h1{
	margin-top:36px;
}

p.logout{
    margin-right: 20px;
    position: absolute;
    right: 0;
    top: 0;
}

a.menu{float:none;}

#content div.infoCol {
    font-size: 85%;
    width: 38em;
	border-right:1px solid #efefef;
}

#content div.column ul{
	padding-left:15px; 
	max-width:100%;
}

#content div.column ul li{
	margin:5px 0px;
}

h4.panel-title{
	padding:0px !important;
}

h4.panel-title a{
	color:#1A5186; 
	text-decoration:none; 
	padding: 10px 22px 10px 35px; 
	display:block;
	font-size:12px;
}

.panel-heading{
	padding:0px !important;
}

#content div.infoCol a:hover{
	text-decoration:underline;
}

.folderTree{
	width:100%;
}

#content div.fileCol {
    max-width: 100%;
	width:60%;
}

.folderTree ul{
	max-width:97% !important;
	width:100%;
}

li.file {
	width:100% !important;
    padding-left: 22px !important;
}

.folderTree ul#rootFolder {
    border: medium none;
    margin-bottom: 10px;
    margin-left: 0;
    padding-left: 0;
	
}

#footer{
	background:url(../../filedrop/template/images/debut_dark.jpg) repeat 0px 0px #333333;
	color:#efefef;
	border-bottom:none;
	border-top:2px solid #000;
	padding-bottom:10px;
	-webkit-box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
	box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
}

#footer p.support{
	float:none;
}

#footer a{
    color:#efefef;
    font-weight: normal;
    margin-right: 0px;
}

a.ersLogo{
	background:url(/image/css/footer-logo-white.jpg) no-repeat 0px 0px;
}

h3{
	font-size: 24px;
    margin-bottom: 10px;
    margin-top: 0;
}

.pc{
	background-image:url(../../filedrop/template/images/windows.png);
	background-repeat:no-repeat;
	background-position:5px 5px;
}

.apple{
	background-image:url(../../filedrop/template/images/apple.png);
	background-repeat:no-repeat;
	background-position:5px 5px;
}

/*********************
	Login Page
*********************/
body.login{
	background:#BFCFBF;
}

#loginForm {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #AAAAAA;
    border-radius: 6px 6px 6px 6px;
    margin: 76px auto 260px;
    padding: 30px;
    width: 500px;
	-webkit-box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
	box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .5);
	height:auto;
}

#loginForm h1 {
    color: #357ebd;
    font-size: 125%;
    margin-left: 1em;
}

#loginForm table{
	position:relative; 
	top:0px; 
	width:100%;
}

#loginForm table tbody th {
    padding: 3px;
    text-align: right;
	width:20%;
}
#loginForm table tbody td{
	padding:3px;	
}

#loginForm table tbody td.last{
	padding-left:106px;
}

.white{
	position:relative !important; 
	height:auto !important;
}

.white p{
	font-size:14px;
}

div.systemMsg ul {
    background: none !important;
    min-height: 0;
    padding-left: 0px !important;
}

div.systemMsg ul li {
    font-family: verdana;
    font-size: 15px;
    line-height: 18px;
    padding-left: 10px;
}

div.systemMsg ul.error {
    background: none repeat scroll 0 0 #C0392B !important;
    border: 1px solid #C0392B;
    border-radius: 3px 3px 3px 3px;
    color: #FFFFFF;
    padding: 5px 0;
}

div.systemMsg ul.success { 
    background: none repeat scroll 0 0 #2ecc71 !important;
    border: 1px solid #C0392B;
    border-radius: 3px 3px 3px 3px;
    color: #FFFFFF;
    padding: 5px 0;
}

table.basicInfoTable{
	width:100%;
}

table.basicInfoTable th{
	padding:3px;
}

table.basicInfoTable td{
	padding:3px;
}

table.basicInfoTable th.odd{
	background:#f6f5f5;
}

table.basicInfoTable td.odd{
	background:#f6f5f5;
}

.panel-body-user{
	padding:15px 0px !important;
}

h4.panel-title a.userInfo{
	padding-left:5px;
}

.folderTree a{
	word-wrap:break-word;
}

div.changePassword {
	position:relative;
	z-index:999999;
	left: 0px;
	top: 0px;
	width:925px;
	margin:0px auto;
	background:none;
	border:none;
	padding:10px 20px 20px;
}

#passwordForm {
	position:relative;
	top:0px;
	right:0px;
	background:url(../../filedrop/template/images/debut_dark.jpg) repeat 0px 0px #333333;
	border:1px solid #999999;
	width:100% ;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(00, 00, 00, .7);
	box-shadow: inset 0px 0px 5px 0px rgba(00, 00, 00, .7);
	z-index:999999;
}

.passWrap{
	background:url(../../filedrop/template/images/debut_dark.jpg) repeat 0px 0px #333333;
	position:relative;
	z-index:999999;
}

#passwordForm form{
	border:none;
	left:0px !important;
	margin:0;
	padding:0;
	position:relative;
	top:0;
	width:100%;
	z-index:999999;
	
}
#passwordForm form label{display:none;}

#passwordForm form input{
	display:inline;
	-webkit-box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .7);
	box-shadow:  0px 0px 5px 0px rgba(00, 00, 00, .7);
}

#passwordForm form input.form-control{
	width:240px;
}

.changePassword h2{
	font-size:22px;
	color:#FFF; 
	margin:0px; 
	padding:5px 0px;
	text-shadow: 0px 2px 3px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=2);
}

#corpHeader{
	width:100%; 
	height:50px; 
	background:#efefef;
}

#corpHeader h2 {
  font-size:25px;
  margin:0;
  padding:10px;
  text-align:right;
  color:#428bca;
}

#header h3 {
  font-size:24px;
  line-height:34px;
  margin-top:106px;
  text-indent:10px;
}

/*1 Column for Narrow Browser Windows (between 0 and 679 pixels) and Smartphones in both orientations. In this query we linearize all of the columns so that they stack vertically by setting float to none and width to auto. We also use this query to move the menu to the top of the layout and stack its links neatly in a vertical orientation. */
@media only screen and (min-width: 0px) and (max-width: 679px) {
	#header{background:url(../../filedrop/template/images/mobileheader.jpg) no-repeat 0px 0px #efefef;}
	#header h1, #header h2{display:none;}
	#content div.infoCol{display:block; width:100%; padding-top:0px;}
	#content div.infoCol h2{font-size:22px; margin-top:0px; padding-top:10px;}
	#content div.fileCol{width:100%; min-width:100%;}
	#content{width:100%; min-width:100%;}
	h4.alert-info{font-size:14px;}
	p.alert-info{display:none;}
	#loginForm{width:90%;}
	#loginForm table tbody th{display:block; text-align:left;}
	#loginForm table tbody td{display:block;}
	#content div.folderTree ul{padding-left:0px !important;}
	
	.folderTree a{word-wrap:break-word;}
}

/*Exception rules for Smartphones in Landscape orientation only. When a smartphone is turned sideways, the text will appear larger so this query contains a single rule that reduces the font-size.*/
@media only screen and (max-device-width: 480px) and (orientation : landscape) {

}

/*2 Column with top spanning menu for Medium Browser Windows and Portrait Tablets. In this query we move the navigation to the top and stack the links. The sidebar and main content areas remain as columns. The interior 3-column structure inside the main content column is reflowed so that the third column drops below the first 2 and spans their width.*/
@media only screen and (min-width: 680px) and (max-width: 979px) and (orientation : portrait) {

}

/*Portrait Tablet Exceptions to adjust padding in content areas. In this query we include a simple exception rule to adjust the padding in all content areas to a value less than the default.*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

}

/*Additional Rules for Medium Desktop Browser Windows and Landscape Tablets to reflow the inner 3-column structure. When a tablet is turned sideways there is ample room to display the menu as a column so all we want to do here is reflow the inner 3-column structure that is inside the main content column so that the third column drops below the first 2 and spans full width. This query also creates a breakpoint for desktop browsers when the window is between 680 and 979 pixels.*/
@media only screen and (min-width: 680px) and (max-width: 979px) and (orientation : landscape) {

}

/*Landscape Tablet Exceptions to adjust padding and reduce font size. When a tablet is turned sideways, the text will appear larger so this query contains rules that reduces the font-size and padding.*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

}

/*3 Column for Medium-Wide Browser Windows. This query sets a breakpoint for medium wide windows (between 980 and 1420 pixels) and reflows the inner 3-column structure inside the main content column to drop the third column below the first 2.*/
@media only screen and (min-width: 980px) and (max-width: 1420px) {

}