/**
 * Filex
 *
 * @package    Filex
 * @author     (Sourcegeek) SGLancer - http://sglancer.com
 * @copyright  Copyright (c) 2015 SGLancer - All rights reserved.
 * @license    Commercial
 * @link       http://sglancer.com
 *  
 * All rights reserved to SGLancer.
 *
**/


/*========================
  Sections
	
	1.	Body
	2.	General Styles
	3.	General Transitions
	4.	Tooltip for the graphs
	5.	Navigation Bar (Top)
	6.	Left Sidebar
	7.	General Wrapper and Right Container
	8.	Page title
	9.	Rows and cols
	10.	Stats widget
	11.	Graphs
	12.	Tables
	13.	Pagination
	14. Forms
	15.	Responsive Queries
==========================*/


/*========================
  Body
==========================*/
body {
	background-color:#f5f5f5;
	color:#333;
}

body , html {
	height: 100%;
}

#container {
	width: 100%;
	position: relative;
	height: auto !important;
	height: 100%;
	min-height: 100%;
}

#contents {
	padding-bottom: 100px;
}

#footer {
	position: fixed;
	bottom: 0;
	width: 100%;
}

/*========================
  General Styles
==========================*/
span.bold, label.bold { font-weight:600; }
span.light, label.light { font-weight:300; }
a.btn-small {
	font-size:0.8em;
	font-weight:600;
	font-family:Montserrat;
	padding:4px 8px;
	vertical-align:middle;
}
span.one-line {
	display:block;
	width:100%;
	height:20px;
	overflow:hidden;
	word-break:break-all;
}
.margin-top { margin-top:10px; }
.margin-bottom{ margin-bottom:10px; }
.col#head-buttons button i { margin-right:6px; }
.btn { border:none; }
.btn-normal { height:35px; }
.btn-default { background-color:#FFF; border:1px solid #ddd; color:#777 !important; }
.btn-default:hover { background-color:#eee; border-color:#d0d0d0; }
.btn-default.nohover:hover { background-color:#FFF; }
.btn-primary { background-color:#001E5E; }
.btn-primary:hover { background-color:#001E5E; }
.btn-primary.nohover:hover { background-color:#001E5E; }
.btn-primary:focus { background-color: #18345e; }
.btn-primary:active { background-color:#18345e; }
.btn-success { background-color:#3fd734; }
.btn-success:hover { background-color:#3cd032; }
.btn-success.nohover:hover { background-color:#3fd734; }
.btn-info { background-color:#32bcd0; }
.btn-info:hover { background-color:#2fb3c6; }
.btn-info.nohover:hover { background-color:#32bcd0; }
.btn-warning { background-color:#f0ad4e; }
.btn-warning:hover { background-color:#e9a84c; }
.btn-warning.nohover:hover { background-color:#f0ad4e; }
.btn-danger-light { background-color:#e46b6b; }
.btn-danger-light:hover { background-color:#df6363; }
.btn-danger-light.nohover:hover { background-color:#e46b6b; }
.btn-danger { background-color:#d83838; }
.btn-danger:hover { background-color:#d03333; }
.btn-danger.nohover:hover { background-color:#d83838; }
p.bg-danger, p.bg-success {
	padding:10px 15px;
	color:#FFF;
	text-align:center;
}
p.bg-success { background-color:#58C440;}
p.bg-danger { background-color:#e78282; }


.btn-azure-login { background-color: #4996ed; width: 300px; height: 50px; font-size: 1.8em; color: white;}
.btn-azure-login:hover { background-color: #3f82ce; color: white;}
.btn-azure-login.nohover:hover { background-color:#3f82ce;color: white; }
.btn-azure-login:focus { background-color: #3f82ce;color: white; }
.btn-azure-login:active { background-color:#3f82ce;color: white; }

/*========================
  General Transitions
==========================*/
.sidebar-left ul.navigation li a {
	transition:0.1s all linear;
	-webkit-transition:0.1s all linear;
	-moz-transition:0.1s all linear;
	-o-transition:0.1s all linear;
}



/*========================
  Tooltip for the graphs
==========================*/
#tooltip{
    position:absolute;
    display:none;
    padding:5px 10px;
	opacity:0.7;
	z-index:9999;
	font-family:Roboto;
	font-size:0.8em;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	background-color:#000;
	color:#eee;
}



/*========================
  Navigation Bar
==========================*/
.navbar-header:after { display:none !important; }
.navbar {
	padding:0;
	height:55px;
}
.navbar-inverse {
	background-color: #46285A;
	border:none;
}
.navbar-brand { padding:10px 0 10px 30px; }
.navbar ul.navbar-nav li {
	height:55px;
	padding:19px 30px 17px 0;
}
.navbar ul.navbar-nav li a {
	color:#ddd;
	font-weight:400;
	padding:0;
	font-family:Montserrat;
	font-size:1.05em;
}
.navbar-collapse { border:none; }
button.navbar-toggle {
	margin:0;
	margin-left:10px;
	border:none !important;
	background-color:#396485;
	height:55px;
	padding:0 20px;
	border-radius:0px;
	-moz-border-radius:0x;
	webkit-border-radius:0px;
	transition:0.1s all linear;
	-webkit-transition:0.1s all linear;
	-moz-transition:0.1s all linear;
	-o-transition:0.1s all linear;
}
button.navbar-toggle span.icon-bar { background-color:#e9eef2 !important; }
button.navbar-toggle:hover { background-color:#2c4c65 !important; }



/*========================
  Left Sidebar
==========================*/
.sidebar-left {
	background-color:#17222b;
	position:fixed;
	top:55px;
	left:0;
	bottom:0;
	width:280px;
	z-index:999999;
	overflow-y:auto;
	overflow-x:hidden;
}
.sidebar-left span.top {
	font-family:Open Sans;
	color:#c0c0c0;
	font-size:0.8em;
	font-weight:300;
	padding:15px 0 15px 20px;
	display:block;
}
.sidebar-left ul.navigation {
	list-style:none;
	margin:0;
	padding:0;
	width:100%;
}
.sidebar-left ul.navigation li {
	width:100%;
	display:block;
	box-sizing:border-box;
}
.sidebar-left ul.navigation li a {
	margin:0 0 1px 0;
	padding:0;
	text-decoration:none;
	color:#ddd;
	background-color:#1f2e3b;
	display:block !important;
	padding:12px 0px 12px 20px;
	font-family:Quicksand;
	font-weight:400;
	font-size:1.15em;
	letter-spacing:-0.03em;
}
.sidebar-left ul.navigation li a:hover { background-color:#283b4c; }
.sidebar-left ul.navigation li.active a {
	background-color:#3d627e !important;
	color:#FFF;
}
.sidebar-left ul.navigation li a img.active { display:none; }
.sidebar-left ul.navigation li.active a img.active {
	margin:-7px -1px auto auto;
	display:block;
}
.sidebar-left ul.navigation li a i { width:22px; text-align:center; margin-right:6px; }



/*========================
  General Wrapper
  Right Container
==========================*/
.general-wrapper {
	padding-top:55px;
	padding-bottom:30px;
	min-height:100vh;
	width:100%;
}
.content {
	background-color:#f5f5f5;
	margin-left:280px;
	padding:10px 20px;
}



/*========================
  Page Title
==========================*/
.content h2.page-title {
	padding:0;
	margin:5px 0 0 0;
	font-family:Open Sans,sans-serif;
	font-weight:400;
	color:#000;
}
.content h2.page-title:after {
	display:block;
	content:" ";
	width:100%;
	height:1px;
	background-color:#ddd;
	margin:5px 0;
}
.content span.page-desc {
	display:block;
	font-family:Montserrat;
	font-size:0.75em;
	color:#aaa;
	margin:0;
}



/*========================
  Rows and cols
==========================*/
.content .row {
	margin-top:15px;
	padding:0 8px;
}
.content .row .col {
	padding:0 8px;
	margin-bottom:10px;
}
.content .row .col-lessp { /*** Row less padding ***/
	padding:0 4px;
}
.content .row .col .cont {
	padding:15px;
	background-color:#FFF;

	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.col .cont.multigraph-height { height:395px; }
.col#site-visitors .cont {overflow:hidden; }
.col#all-time-stats span.one-line { margin:6px auto; }
.content .row .col .cont .top {
	padding:4px 0 12px 0;
	margin-bottom:10px;
	border-bottom:1px solid #eee;
}
.content .row .col .cont span.title {
	padding:0;
	margin:0;
	font-family:Montserrat;
	font-size:1.3em;
}
.content .row .col .cont span.title-small { font-size:1.15em; }
.content .row .col .cont .dropdown { margin:-1px 0 6px 0; }
.content .row .col .cont .dropdown button {
	width:130px;
	height:30px;
	margin:0;
	background-color:#9aa8ad;
	color:#FFF !important;
	font-family:Montserrat;
	font-size:0.85em;
	border:none;
}
.content .row .col .cont .dropdown-small button { width:110px; }
.content .row .col .cont .dropdown button:hover { background-color:#a0aeb3; }
.content .row .col .cont .dropdown button span.caret { margin:-1px auto auto 5px; }



/*========================
  Stats widget
==========================*/
.content .row.main-stats .col .cont {
	padding:20px;
	border-radius:6px;
	moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-bottom:6px solid #ddd;
	margin-bottom:20px;
	height:135px;
	overflow:hidden;
}
.content .row.main-stats .col .cont.border-blue { border-bottom:6px solid #7dabcc; }
.content .row.main-stats .col .cont.border-blue .widget .left-icon i { color:#518fbb; }
.content .row.main-stats .col .cont.border-cyan { border-bottom:6px solid #5fd8d1; }
.content .row.main-stats .col .cont.border-cyan .widget .left-icon i { color:#29cbc2; }
.content .row.main-stats .col .cont.border-purple { border-bottom:6px solid #c592e6; }
.content .row.main-stats .col .cont.border-purple .widget .left-icon i { color:#b26ede; }
.content .row.main-stats .col .cont.border-red { border-bottom:6px solid #e69292; }
.content .row.main-stats .col .cont.border-red .widget .left-icon i { color:#de6e6e; }
.content .row.main-stats .widget {
	display:table;
	width:100%;
}
.content .row.main-stats .widget .left-icon {
	display:table-cell;
	vertical-align:middle;
}
.content .row.main-stats .widget .left-icon i {
	font-size:6.5em;
	margin:0 18px 0 0;
}
.content .row.main-stats .widget .info {
	display:table-cell;
	vertical-align:middle;
	width:100%;
	text-align:right;
	line-height:0.8em;
}
.content .row.main-stats .widget .info span.num {
	font-family:Open Sans;
	font-weight:400;
	font-size:2.8em;
	display:block;
	width:100%;
	overflow:hidden;
	word-break:break-all;
	line-height:0.9em;
}
.content .row.main-stats .widget .info span.desc {
	font-family:Montserrat;
	font-weight:400;
	font-size:0.8em;
	color:#aaa;
}



/*========================
  Graphs
==========================*/
.graph-container, .graph-container > .graph-lines {
	width:100%;
	height:300px;
	overflow:hidden;
}
.graph-container .graph-lines span.normal-label {
	font-size:0.85em;
	color:#888;
	font-family:Open Sans;
}
.graph-container .graph-lines span.responsive-label {
	display:none;
}
.graph-container .graph-lines span.normal-ylabel {
	font-size:1.05em;
	color:#555;
	font-family:Open Sans;
}
.graph-container .graph-lines span.responsive-ylabel{ display:none; }
.graph-container .graph-lines .axisLabel.xaxisLabel {
	margin-top:-25px;
	text-align:center;
	background-color:#fafafa;
	padding:1px 0 3px 0;
	color:#555;
	font-size:0.8em;
	font-family:Open Sans;
}
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit {
	display:inline-block;
	margin:3px 30px;
}
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit i {
	font-size:0.6em;
	margin:4px 6px 0 0;
	vertical-align:top;
	display:inline-block;
}
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit i.blue { color:#518eba; }
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit i.cyan { color:#29cbc2; }
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit i.purple { color:#af6cda; }
.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit i.red{ color:#dd6e6e; }



/*========================
  Tables
==========================*/
table.table thead tr th {
	font-family:Open Sans;
	font-size:0.85em;
	color:#7f7f7f;
}
table.table tbody tr td {
	font-family:Open Sans;
	font-size:0.9em;
	vertical-align:middle;
	padding:12px 8px;
	color:#777;
	word-break:break-all !important;
}
table.table tbody tr td:hover { cursor:pointer; }
table.table tbody tr td a.btn-small i { display:none; }
table.table tbody tr td i.fa-close {
	color:#FF0000;
	font-size:1.2em;
	margin-left:4px;
	vertical-align:middle;
}
table.table tbody tr td i.fa-close:hover {
	cursor:pointer;
	color:#ff3737;
}



/*========================
  Pagination
==========================*/
#pagination { max-width:250px; }
#pagination .element {
	display:inline-block;
	background-color:#FFF;
	border:1px solid #ddd;
	margin-left:-5px;
	min-width:27px;
	padding:4px 10px 4px 5px;
	text-align:center;
	font-family:Open Sans;
	font-size:0.85em;
	color:#82b6c9;
	font-weight:600;
}
#pagination .element.select {
	background-color:#50a6d8;
	color:#FFF;
	border-color:#50a6d8;
}
#pagination .element.disable {
	color:#bbb;
	background-color:#f5f5f5;
}
#pagination .element:hover {
	background-color:#dcf6ff;
	cursor:pointer;
}
#pagination .element.select:hover { background-color:#50a6d8; }
#pagination .element.disable:hover { background-color:#f5f5f5; }
.col#head-buttons button { /* Buttons container at the top of page */
	font-family:Montserrat;
	font-size:0.75em;
	padding:5px 12px;
	color:#FFF;
	margin:0 3px;
}



/*========================
  Forms
==========================*/
.form-group { margin-bottom:30px; }
.form-group label {
	color:#555;
	margin-bottom:2px;
}
.form-group .radio, .form-group .checkbox {
	margin-top:0;
	margin-left:10px;
	line-height:17px;
}
.form-group .radio label, .form-group .checkbox label {
	margin-bottom:-10px;
	line-height:20px;
}
#site-color .row { text-align:center; }
#site-color .col { text-align:center; }
#site-color .container-box {
	margin:auto;
	width:85%;
	max-width:150px;
	background-color:#ddd;
}
#site-color .col img { opacity:0.6; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px; }
#site-color .col img:hover {
	opacity:0.8;
	cursor:pointer;	
}
#site-color .col.selected img { opacity:1; }
#site-color .col.selected img:hover { opacity:1; }
#site-color .container-box img{ width:100%; }



/*========================
  Responsive Queries
==========================*/
@media(min-width:970px) {
	.col-md-20 { width:20%; }
}

@media(max-width:969px) {
	.col-md-20fix {
		margin-top:15px;
		margin-left:9.33333%;
		padding:9.333333%;
	}
}

@media(max-width:767px) {
	#site-color .container-box {
		width:122px;
		margin-bottom:10px;
	}
	.col-md-20fix {
		margin-left:0;
		padding:0;
		margin-top:0;
	}
}

@media(max-width: 1550px) {
	.content .row.main-stats .widget .left-icon i { font-size:5.5em; margin-right:10px;}
	.content .row.main-stats .col .cont { height:125px; }
}

@media(max-width: 1300px) {
	.col#uploaded-files table thead tr th:nth-child(4) { display:none; }
	.col#uploaded-files table tbody tr td:nth-child(4) { display:none; }
	.col#uploaded-files table thead tr th:nth-child(1) { width:6% }
	.col#uploaded-files table thead tr th:nth-child(2) { width:25% }
	.col#uploaded-files table thead tr th:nth-child(3) { width:12% }
	.col#uploaded-files table thead tr th:nth-child(5) { width:10% }
	.col#uploaded-files table thead tr th:nth-child(6) { width:10% }
	.col#uploaded-files table thead tr th:nth-child(7) { width:10% }
	.col#uploaded-files table thead tr th:nth-child(8) { width:10% }
	.col#uploaded-files table thead tr th:nth-child(9) { width:17% }
}

@media(max-width: 1380px) {
	.content .row.main-stats .widget .left-icon i { font-size:4.8em; }
	.content .row.main-stats .col .cont { height:110px; }
	.content .row.main-stats .widget .info span.num { font-size:2.2em; }
	.content .row.main-stats .widget .info span.desc { font-size:0.7em; }
}

@media(min-width: 1200px) {
	.col#file-details .row  .first-col:nth-child(1) { width:14%; }
	.col#file-details .row  .second-col:nth-child(2) { width:24%; }
	.col#file-details .row  .first-col:nth-child(3) { width:20%; }
	.col#file-details .row  .second-col:nth-child(4) { width:14%; }
	.col#file-details .row  .first-col:nth-child(5) { width:20%; }
	.col#file-details .row  .second-col:nth-child(6) { width:8%; }
}

@media(max-width:1120px) {
	.col#uploaded-files table thead tr th:nth-child(6) { display:none; }
	.col#uploaded-files table tbody tr td:nth-child(6) { display:none; }
	.col#uploaded-files table thead tr th:nth-child(7) { display:none; }
	.col#uploaded-files table tbody tr td:nth-child(7) { display:none; }
	.col#uploaded-files table thead tr th:nth-child(8) { display:none; }
	.col#uploaded-files table tbody tr td:nth-child(8) { display:none; }
	.col#uploaded-files table thead tr th:nth-child(1) { width:9% }
	.col#uploaded-files table thead tr th:nth-child(2) { width:36% }
	.col#uploaded-files table thead tr th:nth-child(3) { width:19% }
	.col#uploaded-files table thead tr th:nth-child(5) { width:16% }
	.col#uploaded-files table thead tr th:nth-child(9) { width:20% }
}

@media screen and (max-width: 900px) {
	.col#uploaded-files table thead tr th:nth-child(1) { width:9% }
	.col#uploaded-files table thead tr th:nth-child(2) { width:20% !important; }
	.col#uploaded-files table thead tr th:nth-child(3) { width:19% }
	.col#uploaded-files table thead tr th:nth-child(5) { width:16% }
	.col#uploaded-files table thead tr th:nth-child(9) { width:20% }
}

@media screen and (max-width: 767px) {
	.col#uploaded-files table thead tr th:nth-child(1) { width:7% }
	.col#uploaded-files table thead tr th:nth-child(2) { width:41% !important; }
	.col#uploaded-files table thead tr th:nth-child(3) { width:20% }
	.col#uploaded-files table thead tr th:nth-child(5) { width:14% }
	.col#uploaded-files table thead tr th:nth-child(9) { width:16% }
	table.table tbody tr td a.btn-small span { display:none; }
	table.table tbody tr td a.btn-small i { display:block; }
	table.table tbody { font-size:0.9em; }
	.col#uploaded-files table tbody tr td { padding:12px 5px; }
}

@media(max-width: 767px) {
	.col#head-buttons button { margin:0px; padding:6px 8px; font-size:0.65em; margin:4px 0; }
	.col#file-details .row { font-size:0.8em; }
}

@media(max-width: 767px) {
	.col#all-time-stats .row { font-size:13px; }
	.col#all-time-stats .row .second-col span { font-size:0.9em; letter-spacing:-0.07em; }
	.col#all-time-stats .row .first-col.col-xs-6 { width:60%; margin-left:4%; text-align:left;}
	.col#all-time-stats .row .second-col.col-xs-6 { width:36%; }
}

@media(max-width:767px) {
	.sidebar-left { left:-300px; transition:0.1s all linear; -webkit-transition:0.1s all linear; -moz-transition:0.1s all linear; -o-transition:0.1s all linear; }
	.content { margin-left:0; }
	.sidebar-left.shown { left:0px; }
	.navbar ul.navbar-nav li { padding:12px 25px 10px 0; }
	.content .row { padding:0; }
	.graph-container .graph-lines span.normal-label { display:none; }
	.graph-container .graph-lines span.responsive-label {
		display:block;
		font-size:0.8em;
		transform: rotate(45deg) translateX(8px) translateY(-3px);
		-webkit-transform: rotate(45deg) translateX(8px) translateY(-3px);
		-ms-transform: rotate(45deg) translateX(8px) translateY(-3px);
		-moz-transform: rotate(45deg) translateX(8px) translateY(-3px);
		-o-transform: rotate(45deg) translateX(8px) translateY(-3px);
	}
	.graph-container .graph-lines .axisLabel.xaxisLabel span.labelit {margin:3px 10px; }
	.sidebar-left ul.navigation li.active a img.active { display:none; }
}

@media screen and (max-width:480px) {
	.col#uploaded-files table thead tr th:nth-child(5) { display:none; }
	.col#uploaded-files table tbody tr td:nth-child(5) { display:none; }
	.col#uploaded-files table thead tr th:nth-child(1) { width:11% }
	.col#uploaded-files table thead tr th:nth-child(2) { width:43% !important; }
	.col#uploaded-files table thead tr th:nth-child(3) { width:25% }
	.col#uploaded-files table thead tr th:nth-child(9) { width:21% }
	#pagination .element {
		display:inline-block;
		background-color:#FFF;
		border:1px solid #ddd;
		margin-left:-5px;
		width:25px;
		padding:4px 0;
		font-size:0.7em;
	}
}