/*@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600');*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');
html, body {
	min-height: 100%;
	height: 100%;
}
body {
	position: relative;
	font-family: "Montserrat", sans-serif;
	background-color: transparent;
	height: 100%;
	padding: 50px 0 0 0;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-family: "Montserrat", sans-serif;
}
button, input, select, textarea {
	font-family: "Montserrat", sans-serif;
}

#sitelogo {
	padding: 15px 0;
}
#sitelogo h3 {
	letter-spacing: -1px;
	color: #fff;
	padding: 0;
	margin: 0;
}
#sitelogo img {
    display: inline-block;
    max-width: 100%;
    max-height: 70px;
    vertical-align: text-bottom;
}
#sitefooter {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	font-size: 13px;
	color: #fff;
	padding: 10px 0;
}
#sitefooter a {
	color: #fff;
}
#midwrap {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
	margin-top: -140px;
    overflow: hidden;
    z-index: 1;
}

/* ui */
header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 50px;
	color: #434a54;
	background-color: #E8E8E8;
	border-bottom: 1px solid #ddd;
	z-index: 2;
}
#openside {
	display: inline-block;
	line-height: 45px;
	height: 50px;
	padding: 0 10px;
	cursor: pointer;
}
header i {
	vertical-align: middle;
}
.topnav {
	padding: 0 5px 0 0;
	margin: 0;
}
.topnav>li {
	float: left;
}
.topnav>li>a {
	display: inline-block;
	line-height: 45px;
	text-decoration: none;
	color: #434a54;
	height: 50px;
	padding: 0 10px;
	margin: 0 0 0 4px;
}
.topnav>li>a>i {
	font-size: 24px;
}
.searchbox {
	display: none;
	position: absolute;
	top: 50px;
	left: 0;
	width: 100%;
	border-bottom: 1px solid #ddd;
	background-color: #E8E8E8;
}
.searchbox-in {
	position: relative;
	padding: 15px 10px;
}
.headerbtn {
	margin-top: 7px;
}

#main {
	min-height: 400px;
	padding: 0 15px 20px 15px;
}
.body-main #main {
	padding-bottom: 190px;
}
#sidebar {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	width: 200px;
	color: #ddd;
	background-color: #273541;
	margin: 0 0 0 -200px;
	z-index: 4;
	transition: margin 0.3s ease;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
#sidebar li>a {
	display: block;
	position: relative;
	font-size: 13px;
	line-height: 45px;
	color: #ddd;
	border-bottom: 1px solid #23303b;
	height: 45px;
	padding: 0 10px;
}
#sidebar li>a:hover {
	text-decoration: none;
	color: #fff;
	background-color: #33414E;
}
#sidebar li>a.active {
/*	color: #fff;
	background-color: #E34724;*/
}
#sidebar li>a.sys {
	color: #ffd559;
}
#sidebar .badge {
	position: absolute;
	top: 13px;
	right: 10px;
}
#sideunder {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
}
.sideopen #sidebar {
	margin: 0;
}
.sideopen #sideunder {
	display: block;
}
.brand {
	font-size: 19px;
	letter-spacing: -1px;
/*	text-transform: uppercase;*/
}
.brand span, .brand .fa {
	color: #3FBAE4; /* #1A8FBF */
}
.brand img {
	display: inline-block;
	max-height: 40px;
}
header .brand {
	display: none;
/*	text-decoration: none;*/
	color: #434a54;
	line-height: 50px;
	height: 50px;
	padding: 0 0 0 10px;
}
header .brand.always {
	display: inline-block;
}
#sidebar .brand {
	display: block;
	text-decoration: none;
	color: #434a54;
	background-color: #E8E8E8;
	border-right: 1px solid #23303b;
	line-height: 50px;
	height: 50px;
	padding: 0 0 0 10px;
}
#sidebar .brand:hover {
	text-decoration: none;
	color: #434a54;
}
.widelimit {
	max-width: 420px;
	margin: 0 auto;
}
footer {
	font-size: 13px;
	padding: 10px 0;
}

.loginbox {
	width: 280px;
	background-color: rgba(255, 255, 255, .7);
	border: 1px solid #ddd;
	padding: 20px 20px 30px 20px;
	margin: 0 auto;
}

/* overrides */
.btn-primary {
    background-color: #33414e;
    border-color: #33414e;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    background-color: #29343f;
    border-color: #29343f;
}
.btn-success {
    background-color: #95b75d;
    border-color: #95b75d;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open > .dropdown-toggle.btn-success {
    background-color: #89ad4d;
    border-color: #89ad4d;
}
.btn-info {
    background-color: #3fbae4;
    border-color: #3fbae4;
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info {
    background-color: #29b2e1;
    border-color: #29b2e1;
}
.btn-warning {
    background-color: #fea223;
    border-color: #fea223;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .open > .dropdown-toggle.btn-warning {
    background-color: #fe970a;
    border-color: #fe970a;
}
.btn-danger {
    background-color: #b64645;
    border-color: #b64645;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger {
    background-color: #a43f3e;
    border-color: #a43f3e;
}
.btn.btn-border {
	font-weight: 600;
	background-color: #fff;
	border-width: 1px;
}
.btn.btn-round {
	border-radius: 12px;
}
.btn.btn-circle {
	text-align: center;
	background-color: #fff;
	border-color: #ccc;
	border-radius: 50%;
	line-height: 30px;
	height: 32px;
	min-width: 32px;
	padding: 0;
}
.btn.btn-border.btn-primary, .btn.btn-circle.btn-primary {
	color: #33414e;
}
.btn.btn-border.btn-success, .btn.btn-circle.btn-success {
	color: #95b75d;
}
.btn.btn-border.btn-info, .btn.btn-circle.btn-info {
	color: #3fbae4;
}
.btn.btn-border.btn-warning, .btn.btn-circle.btn-warning {
	color: #fea223;
}
.btn.btn-border.btn-danger, .btn.btn-circle.btn-danger {
	color: #b64645;
}
b, strong, th {
	font-weight: 600;
}
.breadcrumb {
	padding: 10px 15px;
	margin: 0 -15px 20px -15px;
}
.badge {
	font-weight: 400;
	background-color: #E34724;
}
.input-phone {
	padding: 0 0 0 120px;
}
.input-phone select {
	float: left;
	width: 110px;
	margin: 0 0 0 -120px;
}

.modal-header, .modal-footer {
	padding: 10px 15px;
}
.modal-header h4 {
	font-size: 16px;
}
.modal-footer .btn {
	min-width: 80px;
}
.modal-footer a {
	display: inline-block;
	padding-top: 6px;
}
.form-control, .btn {
	border-radius: 3px;
	height: auto;
	padding: 6px 12px;
}
.form-control[readonly] {
	background-color: #fff;
}
.form-group.last-group {
	margin-bottom: 25px;
}
.pager {
	margin: 0;
}
.pager li>a, .pager li>span {
	display: inline-block;
	line-height: 30px;
	padding: 0 11px;
	color: #656d78;
	border-color: #E5E5E5;
	border-radius: 3px;
	margin: 0 1px;
}
.pager li>span {
	color: #fff;
	background-color: #33414e;
	border-color: #33414e;
}
.pager li>span.numeric {
	color: #656d78;
	background-color: transparent;
	border: none;
}
.pager li>span.disabled {
	color: #ddd;
	background-color: transparent;
	border-color: #fff;
}
.filterbar .pager li>a {
	position: relative;
	color: #333;
	border: none;
	padding: 0 8px;
	margin: -6px 0 0 2px;
}
.filterbar .pager .fa {
	font-size: 32px;
}
.dropdown-menu>li>a, .dropdown-menu>li>.a, .dropdown-menu>li>.l {
	display: block;
	font-size: 13px;
	line-height: 1.42857143;
	white-space: nowrap;
	color: #333;
	padding: 6px 15px;
	clear: both;
}
.dropdown-menu>li>.l {
	font-weight: normal;
	border-bottom: 1px solid #ddd;
}
.checkbox-inline>label, label.normal {
	font-weight: normal;
}
legend {
	font-size: 18px;
}

/* general */
.page-title {
	position: relative;
	color: #434a54;
	background-color: #F0EFEF;
	border-bottom: 1px solid #E5E5E5;
	height: 45px;
	padding: 0 15px;
	margin: 0 -15px 20px -15px;
}
.page-title>h4 {
	font-size: 18px;
	font-weight: normal;
	line-height: 40px;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding: 0;
	margin: 0;
	overflow: hidden;
}
.page-title>span {
	display: inline-block;
	font-size: 13px;
	line-height: 45px;
	margin: 0 5px 0 0;
}
.page-title.item-title {
	margin-bottom: 10px;
}
.page-title.item-title>h4 {
	font-size: 16px;
	text-align: center;
	margin: 0 20px;
}
.item-title .navlink {
	position: absolute;
	top: 0;
	min-width: 20px;
	height: 40px;
}
.navlink span {
	font-size: 13px;
}
.item-title .navlink.backlink {
	left: 15px;
}
.item-title .navlink.fwlink {
	right: 15px;
}
.item-title .navlink i {
	line-height: 40px;
	vertical-align: middle;
}
.item-title .navlink span {
	line-height: 40px;
	vertical-align: middle;
}
.light-bg {
	background-color: #f5f5f5;
}
.selall {
	display: inline-block;
	line-height: 20px;
	color: #eee;
	background-color: #fff;
	border: 1px solid #bbb;
	width: 22px;
	height: 22px;
	margin: 0 3px 0 0;
}
.all .selall {
	color: #E34724;
	border-color: #E34724;
}
.title-menu, a.title-menu {
	display: inline-block;
	font-size: 12px;
	text-transform: uppercase;
	line-height: 45px;
	white-space: nowrap;
	text-decoration: none;
	color: #434a54;
	margin: 0 0 0 5px;
}
.page-title>.btn {
	margin-top: 7px;
}

/* audio player */
#playingnow {
	display: none;
	position: fixed;
	left: 0;
	bottom: 0;
	right: 0;
	white-space: nowrap;
	color: #ddd;
	background-color: #273541;
	overflow: hidden;
	z-index: 1;
}
.songtitle {
	padding: 4px 44px 4px 4px;
	margin: 0 8px 0 0;
}
#playprogress {
	background-color: #ebebeb;
	border-radius: 4px;
	height: 4px;
	margin: 0 52px 0 4px;
	overflow: hidden;
}
#playprogress div {
	background-color: #E34724;
	width: 0;
	height: 100%;
}
.playing .songtitle {
	background-image: url("img/playing-small.gif");
	background-position: 100% -8px;
	background-repeat: no-repeat;
}
.songtitle h5 {
	font-size: 13px;
	text-overflow: ellipsis;
	color: #fff;
	background-color: #3D4E5D;
	line-height: 28px;
	padding: 0 6px;
	margin: 0;
	overflow: hidden;
}
.play-controls {
	overflow: hidden;
}
.play-controls .playbtn {
	display: inline-block;
	text-align: center;
	line-height: 32px;
	width: 36px;
	height: 36px;
	margin: 0 2px;
	cursor: pointer;
}
.play-controls .playit {
	color: #fff;
}
.play-controls .btnsep {
	display: inline-block;
	width: 10px;
}
.playtime {
	float: right;
	font-size: 13px;
	line-height: 32px;
	padding: 0 8px;
}

.segment {
	border: 1px solid #3D4E5D;
	border-radius: 4px;
	max-width: 460px;
	margin: 0 auto 20px auto;
	overflow: hidden;
}
.segment li {
	display: block;
	float: left;
	font-size: 13px;
	white-space: nowrap;
	text-align: center;
	width: 25%;
	border-right: 1px solid #3D4E5D;
	padding: 6px 0;
	margin: 0;
	overflow: hidden;
}
.segment.segment2 {
	max-width: 360px;
}
.segment.segment2 li {
	width: 50%;
}
.segment.segment3 {
	max-width: 360px;
}
.segment.segment3 li {
	width: 33.3%;
}
.segment li:last-child {
	border-right: none;
}
.segment li.active {
	color: #fff;
	background-color: #33414E;
}
.segment li a {
	display: block;
	text-decoration: none;
	color: #33414E;
	width: 100%;
}
.card {
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 3px;
	box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
}
.card-title {
	font-size: 13px;
	font-weight: 600;
	line-height: 16px;
	height: 42px;
	background-color: #fafafa;
	padding: 5px 10px;
	overflow: hidden;
}
.card-title a {
	text-decoration: none;
	color: #333;
}
.card-section {
	line-height: 20px;
	padding: 5px 10px;
}
.card-preview {
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	background-color: #F0EFEF;
	padding: 20px 10px;
	overflow: hidden;
}
.card-preview h5 {
	font-size: 22px;
	line-height: 25px;
	height: 75px;
}

.links-bar {
	background-color: #3D4E5D;
	padding-top: 4px;
	padding-bottom: 4px;
}
.links-bar a {
	display: block;
	text-decoration: none;
	color: #fff;
	padding: 8px 0;
}

.taglist {
	border: 1px solid #ddd;
	height: 220px;
	padding: 10px 0;
	margin-bottom: 15px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
.taglist label {
	font-weight: normal;
}
.taglist .dir {
	margin: 0 5px;
}
.form-control-number {
	width: 120px;
}
.text-xs {
	font-size: 13px;
}
.sep {
	height: 2px;
	border-top: 1px solid #eee;
}
.btn-mid {
	min-width: 80px;
}
.btn-wide {
	min-width: 100px;
}
.table.table-bottom-border>tbody>tr>td {
	border-top: none;
	border-bottom: 1px solid #ddd;
}

/* upload */
#dropzone {
	position: relative;
	text-align: center;
	color: #1A8FBF;
	border: 1px dashed #1A8FBF;
	border-radius: 3px;
	padding: 20px 15px;
	margin: 20px 0 0 0;
	cursor: pointer;
}
#dropzone input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
}
.uploadlist {
	margin: 20px 0 0 0;
}
.uploadlist>.item {
	position: relative;
	border: 1px solid #ddd;
	border-radius: 3px;
	min-height: 65px;
	padding: 0 0 0 75px;
	margin-bottom: 10px;
	overflow: hidden;
}
.img {
	float: left;
	width: 65px;
	height: 65px;
	margin: 0 0 0 -75px;
	overflow: hidden;
}
.img img {
	max-width: 140%;
	max-height: 140%;
	width: auto;
	height: auto;
}
.img.nopreview:before {
	display: inline-block;
	font-family: FontAwesome;
	font-size: 32px;
	text-align: center;
	line-height: 64px;
	content: "\f016";
	color: #999;
	width: 100%;
}
.nopreview.pdf:before, .nopreview.t6:before {
	content: "\f1c1";
}
.nopreview.video:before, .nopreview.t5:before {
	content: "\f01d";
}
.nopreview.audio:before, .nopreview.t4:before {
	content: "\f001";
}
.nopreview.word:before, .nopreview.t7:before {
	content: "\f1c2";
}
.nopreview.t14:before {
	content: "\f006";
}
.nopreview.t13:before {
	content: "\f167";
}
.nopreview.t15:before {
	content: "\f27d";
}
.uploadlist>.item h5 {
	font-weight: bold;
	line-height: 20px;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #000;
	padding: 8px 0 2px 0;
	margin: 0;
	overflow: hidden;
}
.uploadlist>.item .p {
	font-size: 13px;
	padding: 0 10px 0 0;
	margin: 0;
	overflow: hidden;
}
.uploadlist>.item .size {
	display: inline-block;
	margin-top: 2px;
}
.uploadlist>.item .percent {
	display: inline-block;
	color: #1A8FBF;
	padding: 0 6px;
	margin-top: 2px;
}
.uploadlist>.item .percent.fa {
	color: #999;
}
.progressbar {
	position: absolute;
	top: 0;
	left: 65px;
	bottom: 0;
	right: 0;
	opacity: .6;
	z-index: -1;
}
.progressbar>div {
	width: 0;
	height: 100%;
	background-color: #d9edf7;
}
.uploadlist>.item.success {
	border-color: #bbb;
}
.uploadlist>.item.danger h5 {
	color: #999;
}
.uploadlist>.item.danger .p {
	color: #a94442;
}
.uploadlist>.item .options {
	display: none;
	padding-bottom: 8px;
}
.uploadlist>.item .options .btn-sm {
	padding-top: 3px;
	padding-bottom: 3px;
	margin: 0 5px 0 0;
}
#donebuttons {
	display: none;
	margin: 20px 0;
}
#donebuttons a {
	white-space: nowrap;
}

.video-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 48px;
	height: 48px;
	font-family: FontAwesome;
	font-size: 22px;
    line-height: 48px;
    text-align: center;
    text-indent: 5px;
	color: rgba(255, 255, 255, .8);
	background-color: rgba(0, 0, 0, .7);
/*	border: 1px solid rgba(255, 255, 255, .3);*/
    border-radius: 50%;
	margin: -24px 0 0 -24px;
	z-index: 1;
}
.video-icon:before {
	content: "\f04b";
}
.video-icon-small {
	position: absolute;
	top: 7px;
	left: 15px;
	width: 30px;
	height: 30px;
	font-family: FontAwesome;
	font-size: 15px;
    line-height: 30px;
    text-align: center;
    text-indent: 4px;
	color: rgba(255, 255, 255, .8);
	background-color: rgba(0, 0, 0, .7);
/*	border: 1px solid rgba(255, 255, 255, .4);*/
    border-radius: 50%;
	z-index: 1;
}
.video-icon-small:before {
	content: "\f04b";
}


/* item list */
.floatmenu {
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	font-size: 11px;
	color: #fff;
	background-color: #33414E;
	z-index: 2;
}
.floatmenu ul {
	padding: 0;
	margin: 0;
}
.floatmenu li {
	float: left;
	width: 33.3%;
}
.floatmenu li.sep {
	width: 100%;
	clear: both;
}
.floatmenu a {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #fff;
	padding: 6px 0;
}
.floatmenu a.text-sys {
	padding-bottom: 12px;
}
.floatmenu .fa {
	display: block;
	font-size: 22px;
	margin: 0 auto;
}
.floatmenu .checkbox {
	font-size: 12px;
	margin: 5px 0 5px 10px;
}
.floatmenu .act {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	color: #ffd559;
	border-radius: 12px;
	padding: 2px 10px 3px 10px;
	margin: 0 10px 5px 10px;
}
.filterbar {
	font-size: 13px;
	min-height: 40px;
	clear: both;
}
.filterico {
	float: left;
	line-height: 24px;
	min-height: 24px;
	color: #656d78;
	padding: 0 4px;
	margin: 0 3px 0 0;
	cursor: pointer;
}
.filterico.inverse {
	color: #fff;
	background-color: #656d78;
}


.allitems {
	margin-bottom: 20px;
}
.allitems.bordered {
	border-top: 1px solid #ddd;
}
.allitems .item {
	display: block;
	position: relative;
	border-bottom: 1px solid #ddd;
	overflow: hidden;
}
.allitems .item-in {
	padding: 6px 0 6px 68px;
	overflow: hidden;
}
.allitems .item-ico {
	position: relative;
	display: block;
	float: left;
	width: 60px;
	height: 45px;
	margin: 0 0 0 -68px;
	overflow: hidden;
}
.allitems .music-item .item-ico {
	width: 40px;
	margin: 0 0 0 -48px;
}
.allitems .item-ico img {
	width: 100%;
	height: auto;
}
.item-ico .fa {
	display: block;
	font-size: 32px;
	text-align: center;
	line-height: 40px;
	color: #888;
}
.item-ico.ico-folder .fa, .fa.ico-folder {
	color: #FEA223; /* #337ab7 */
}
.item-ico.item-ico-4 .fa {
	color: #B64645;
}
.item-ico.item-ico-6 .fa {
	color: #FF3500;
}
.item-ico.item-ico-7 .fa {
	color: #2B579A;
}
.item-ico.item-ico-8 .fa {
	color: #95B75D;
}
.item-ico.item-ico-14 .fa, .item-ico-14 .fa {
	color: #FEA223;
}
.item-ico-play .fa {
	color: #333;
	border: 1px solid #ddd;
	border-radius: 3px;
}
.allitems .item h5 {
	line-height: 18px;
	max-height: 36px;
	overflow: hidden;
	margin: 0;
}
.allitems .item p {
	font-size: 13px;
	white-space: nowrap;
	text-overflow: ellipsis;
	line-height: 16px;
	height: 20px;
	padding: 2px 0 0 0;
	margin: 0;
	overflow: hidden;
}
.allitems h5 a, .allitems a.item-ico, .allitems a.item {
	text-decoration: none;
	color: #222;
}
.item-select {
	display: inline-block;
	text-align: center;
	line-height: 20px;
	color: #eee;
	background-color: #fff;
	border: 1px solid #bbb;
	width: 22px;
	height: 22px;
}
.allitems .item-select {
	position: absolute;
	bottom: 4px;
	right: 6px;
}
.allitems .item-select.item-select-photo {
	bottom: 20px;
}
.allitems .item-select.item-select-video {
	bottom: 20px;
}
.allitems.photo-thumbs .item-select.item-select-photo {
	right: 4px;
	bottom: 4px;
	z-index: 2;
}
.allitems .selected .item-select, .item-select.selected {
	color: #fff;
	border-color: #FE9F1D;
	background-color: #FE9F1D;
}
.editor .allitems .item.selected {
	background-color: #f5f5f5;
	border-color: #33414e;
}
.allitems .item-act {
	border-top: 1px solid #eee;
	padding: 6px;
	clear: both;
}
.allitems .item-act.noborder {
	border-top: none;
	min-height: 32px;
}
.item-act a, .item-act span {
	display: inline-block;
	color: #656d78;
	margin: 0 10px 0 0;
}
.item-act a.shared, .item-act span.shared, .shared {
	color: #337AB7!important;
}
.item-act a.public, .item-act span.public, .public {
	color: #95B75D!important;
}

.allitems.photo-items, .allitems.photo-thumbs {
	overflow: hidden;
}
.allitems.photo-items .item {
	border: none;
	padding: 0;
	margin: 0;
	overflow: hidden;
}
.allitems.photo-items .card {
	margin: 10px 0;
}
.allitems.photo-items .item-in {
	border: 1px solid #eee;
	border-radius: 3px;
	box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
	margin: 0 10px;
}

.small-folders {
	overflow: hidden;
}
.small-folders .item {
	margin-bottom: 10px!important;
}
.small-folders .item-in {
	position: relative;
	border: 1px solid #eee;
	border-radius: 3px;
	box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
	padding: 10px 0;
	margin: 0 5px 10px 5px;
}
.small-folders .item-ico {
	position: absolute;
	bottom: -9px;
	right: -9px;
	display: block;
	float: left;
	width: 60px;
	height: 45px;
	margin: 0;
	overflow: hidden;
	z-index: -1;
	opacity: .3;
}
.small-folders h5 {
	font-size: 13px;
	font-weight: 600;
	line-height: 16px;
	height: 48px;
	text-align: center;
	padding: 0 6px;
	overflow: hidden;
}

.allitems .item.music-item {
	padding: 6px;
}
.music-item .music-item-in {
	padding: 0 6px 6px 48px;
	overflow: hidden;
}

.allitems.photo-thumbs .item {
	float: left;
	width: 33.3%;
	border: none;
	padding: 0;
	margin: 0;
	overflow: hidden;
}
.allitems.photo-thumbs .card {
	margin: 4px;
}
.photo-item-img {
	position: relative;
	background-color: #fff;
	width: 100%;
	height: 0;
	padding-bottom: 80%;
	overflow: hidden;
}
.photo-item-img.video {
	border-radius: 0;
	padding-bottom: 75%;
}
.photo-item-img>.a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.photo-item-img img {
	width: 100%;
	height: auto;
}
.allitems.photo-items h5 {
	line-height: 18px;
	height: 36px;
	overflow: hidden;
}

.preview {
	background-color: #fff;
	border: 1px solid #eee;
	padding: 5px;
}
.preview img {
	margin: 0 auto;
}
.preview .audio {
	text-align: center;
	padding: 40px 0;
}
.preview .audio>div {
	color: #ddd;
	padding-bottom: 30px;
}
.preview h5 {
	padding: 20px 10px;
}
.info {
	background-color: #fff;
	border: 1px solid #eee;
	padding: 5px;
}
.info table {
	border-bottom: 1px solid #ddd;
}


.blocked {
	text-decoration: line-through;
}
.authbox {
	max-width: 240px;
	margin: 60px auto;
}
.sharepanel {
	min-height: 120px;
	padding: 20px 0;
}
.plainlist>div {
	border-bottom: 1px solid #ddd;
	padding: 10px 0;
}
.ftplist {
	border-top: 1px solid #ebebeb;
}
.ftplist>div {
	position: relative;
	white-space: nowrap;
	line-height: 36px;
	height: 36px;
	border-bottom: 1px solid #ebebeb;
	padding-right: 36px;
	overflow: hidden;
}
.ftplist>div:nth-child(odd) {
	background-color: #fafafa;
}
.ftpact {
	position: absolute;
	top: 0;
	right: 0;
	text-align: center;
	color: #337AB7;
	width: 36px;
	height: 36px;
	cursor: pointer;
}
.foldercrumbs {
	border-left: 1px solid #ddd;
	overflow: hidden;
}
.foldercrumbs li {
	position: relative;
	float: left;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	line-height: 32px;
	height: 32px;
	padding: 0 8px;
}
.foldercrumbs a:before {
	content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid #ddd;
    position: absolute;
    top: 50%;
    margin-top: -17px;
    margin-left: 1px;
    left: 100%;
    z-index: 3;
}
.foldercrumbs a:after {
	content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-bottom: 17px solid transparent;
    border-left: 10px solid white;
    position: absolute;
    top: 50%;
    margin-top: -17px;
    left: 100%;
    z-index: 3;
}
.foldercrumbs a, .foldercrumbs span {
	display: block;
	text-decoration: none;
	color: #333;
	padding-left: 8px;
}
.foldercrumbs li:first-child a {
	padding-left: 0;
}
.foldercrumbs li:last-child {
	border-right: 1px solid #ddd;
}

#fileview {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	color: #fff;
	background-color: rgba(0, 0, 0, .9);
	z-index: 5;
}
#fileview .next, #fileview .prev {
	position: absolute;
	top: -50%;
	font-size: 36px;
	line-height: 60px;
	text-align: center;
	height: 64px;
	width: 32px;
	margin: -32px 0 0 0;
	cursor: pointer;
	z-index: 7;
}
#fileview .prev {
	left: 0;
}
#fileview .next {
	right: 0;
}
#fileview .cls {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 32px;
	line-height: 42px;
	text-align: center;
	height: 48px;
	width: 48px;
	cursor: pointer;
}
#dropsingle {
	position: absolute;
	top: 0;
	left: 10px;
	font-size: 22px;
	line-height: 42px;
	height: 48px;
	cursor: pointer;
}
#dropmulti {
	position: absolute;
	top: 0;
	left: 100px;
	font-size: 22px;
	line-height: 42px;
	height: 48px;
	cursor: pointer;
}
#fileview .fname {
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	white-space: nowrap;
	width: 100%;
	padding: 8px 0;
	overflow: hidden;
}
#fileviewmain {
	position: absolute;
	top: 36px;
	left: 10px;
	bottom: 36px;
	width: calc(100% - 20px);
}
#fileviewmain.loading {
	background-image: url("img/loading.gif");
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
#fileviewmain .views {
	display: none;
}
#fileviewmain .snd {
	position: absolute;
	bottom: 60px;
	width: 100%;
	text-align: center;
}
#fileviewmain .vdo, #fileviewmain .emb {
	max-width: 100%;
	margin: 10px auto 0 auto;
}
#fileviewmain .vdo div {
	background-color: #000;
}
#fileviewmain .prv {
	position: relative;
	background-color: #fff;
	width: 100%;
	height: 100%;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
  	overflow-y: scroll;
}
#fileviewmain .prv iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}
#fileviewmain.loading .prv iframe {
	display: none;
}
#fileviewmain .pic {
	position: relative;
	width: 100%;
	height: 100%;
}
#fileviewmain img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
#fileviewmain .fle {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 280px;
	height: 240px;
	background-color: #000;
	margin: -120px 0 0 -140px;
}
#fileviewmain .ico {
	color: #ccc;
	padding: 30px 0 10px 0;
}
#fileviewmain .ico:before {
	font-family: FontAwesome;
	font-size: 52px;
	text-align: center;
	line-height: 52px;
	width: 52px;
	height: 52px;
	content: "\f016";
}
#fileviewmain .fle .fac {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 10px 0;
}
#fileviewmain .fle a {
	display: inline-block;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 20px;
	color: #ccc;
	padding: 2px 10px;
}

#dashhero {
	position: relative;
	height: 180px;
	background: url(img/cloudsocial.jpg) no-repeat 50% 10%; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	margin: 0 -15px;
}
#info {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	text-decoration: none;
	color: #fff;
	background-color: rgba(51, 65, 78, .7);
	padding: 10px 15px;
}
a#info:hover {
	text-decoration: none;
	color: #fff;
}
#info h4 {
	padding: 0;
	margin: 0;
}
.dash {
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
}
.dash.inverse {
	color: #000;
/*	background-color: #5A2E2E;*/
}
.dash a {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #33414E;
	padding: 15px 0;
}
.dash a:hover {
	text-decoration: none;
	color: #33414E;
}
.dash.inverse a, .dash.inverse a:hover {
	color: #000;
}
.dash i {
	font-size: 32px;
	color: #3D4E5D;
	margin-bottom: 5px;
}
.dash div {
	font-size: 13px;
	line-height: 15px;
	height: 45px;
	overflow: hidden;
}
.dash .badge {
	position: absolute;
	top: 5px;
	left: calc(50% + 5px);
}

.sub-menu {
	position: relative;
	background-color: #3D4E5D;
}
.sub-menu:after {
	position: absolute;
	top: 12px;
	right: 10px;
	font-family: FontAwesome;
	content: "\f107";
}
.tree-view {
	color: #434a54;
	background-color: #fff;
	padding: 5px 0 10px 0;
}
.tree-view a {
	display: block;
	font-size: 13px;
	white-space: nowrap;
	color: #434a54;
}
.tree-view .active>a {
	color: #E34724;
}
.tree-view .dir {
	padding: 2px 0 2px 22px;
}
.tree-view .dir>.fa {
	float: left;
	margin: 2px 0 0 -20px;
}

.dirlist .dir>.dir {
	white-space: nowrap;
	margin-left: 30px;
}
.dirlist .dir-in {
	border-bottom: 1px solid #eee;
	padding: 5px 0 5px 35px;
	margin-bottom: 4px;
}
.dirlist .dir .fa {
	float: left;
	font-size: 24px;
	margin: 2px 0 0 -35px;
}
.dirlist .dir-opt {
	font-size: 13px;
	color: #999;
	padding: 2px 0;
}

.fileselect {
	height: 320px;
	border: 1px solid #ddd;
	padding: 10px 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.fileselect>div {
	display: block;
	white-space: nowrap;
	padding: 6px 10px;
	cursor: pointer;
}

#imgeditor {
	max-width: 700px;
	margin: 70px auto 0 auto;
}
#imgeditorcmd {
	position: relative;
}
#imgeditorcmd>div {
	position: absolute;
	top: 0;
	left: 50%;
	background-color: rgba(0, 0, 0, .7);
	border-radius: 0 0 4px 4px;
	width: 270px;
	margin: 0 0 0 -135px;
	overflow: hidden;
}
#imgeditorcmd a {
	display: block;
	float: left;
	text-align: center;
	line-height: 45px;
	color: #fff;
	width: 45px;
	height: 45px;
	border-right: 1px solid #444;
}

#cropcmd {
	display: none;
	position: relative;
}
#cropcmd>div {
	position: absolute;
	top: 0;
	left: 50%;
	background-color: rgba(0, 0, 0, .7);
	border-radius: 0 0 4px 4px;
	width: 200px;
	margin: 0 0 0 -100px;
	overflow: hidden;
}
#cropcmd a {
	display: block;
	float: left;
	text-align: center;
	line-height: 45px;
	color: #fff;
	width: 100px;
	height: 45px;
	border-right: 1px solid #444;
}

.inbox {
	border-bottom: 1px solid #ddd;
	padding: 10px 0;
	overflow: hidden;
}
.inbox div {
	line-height: 20px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.inbox .from {
	float: left;
	width: 190px;
}
.inbox .date {
	float: right;
	color: #888;
	width: 90px;
}
.inbox .subject {
	clear: both;
}
.mail-label {
	width: 100px;
	color: #656d78;
}

.check-addon {
	padding-left: 20px;
}

.row#sortable {
	margin-right: -5px;
	margin-left: -5px;
}
.col-xs-4.order-item, .col-sm-2.order-item, .col-lg-1.order-item {
	padding-right: 5px;
	padding-left: 5px;
}
.order-item {
	font-size: 13px;
	background-color: #fff;
	margin-bottom: 15px;
	cursor: move;
}
.order-item>div {
	text-align: center;
	border: 1px solid #ddd;
	overflow: hidden;
}

/* page load */
#loader {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(39, 53, 65, .6);
	z-index: 19999;
}
body.loading #loader {
	display: block;
}
.spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	width: 70px;
	margin: -20px 0 0 -35px;
}
.spinner > div {
	width: 18px;
	height: 18px;
	background-color: #DDE0E3;
	border-radius: 100%;
	display: inline-block;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}
.spinner .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0) }
	40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
	0%, 80%, 100% {
	  -webkit-transform: scale(0);
	  transform: scale(0);
	} 40% { 
	  -webkit-transform: scale(1.0);
	  transform: scale(1.0);
	}
}

/* ac */
.autocomplete-suggestions {
	text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,.1);
	position: absolute; display: none; z-index: 9999; max-height: 254px; overflow: hidden; overflow-y: auto; box-sizing: border-box;
}
.autocomplete-suggestion { position: relative; padding: 8px 12px; line-height: 24px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333; }
.autocomplete-suggestion b { font-weight: normal; color: #000; }
.autocomplete-suggestion.selected { background: #F0EFEF; }


/* site */
.siteheading {
	font-family: "Gentium Basic", serif;
	color: #454545;
}
.sitedown {
	line-height: 50px;
	height: 50px;
}

/* misc */
.strong {
	font-weight: bold;
}
.contain {
	overflow: hidden;
}
.hidebox {
	display: none;
}
.clear {
	clear: both;
}
.divider {
	height: 30px;
	clear: both;
}
.middle {
	vertical-align: middle!important;
}
.icosize {
	font-size: 26px;
	line-height: 18px;
}
.text-small {
	font-size: 13px!important;
}
.text-big {
	font-size: 15px!important;
}
.text-normal {
	font-weight: 400;
}
.text-sys {
	color: #ffd559!important;
}
.text-xmuted {
	color: #bbb!important;
}
.text-folder {
	color: #FEA223;
}
.text-tag {
	color: #B64645;
}
.tdico {
	width: 60px;
}
#ifs {
	display: none;
	width: 0;
	height: 0;
	border: 0;
}
.must:after {
	font-family: monospace;
	content: "*";
	color: #e02222;
	margin: 0 0 0 2px;
}
.wait {
/*	background-color: #fff;*/
	background-image: url("img/wait.gif");
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.wait * {
	visibility: hidden;
}

@media (min-width: 768px) {
	
	.topnav>li>a>i {
		font-size: 20px;
	}
	.topnav span.hidden-xs {
		font-size: 13px;
	}
	.searchbox {
		display: block;
		position: static;
		border-bottom: none;
		width: 220px;
		margin: 0 10px 0 0;
	}
	.searchbox-in {
		padding: 6px 0 0 0;
	}
	.itemlist .item {
		width: 25%;
	}
	.page-title.item-title>h4 {
		margin: 0 60px;
	}
	
	#fileview .next, #fileview .prev {
		top: 50%;
	}
	#fileviewmain {
		left: 36px;
		width: calc(100% - 72px);
	}
	#fileviewmain .vdo, #fileviewmain .emb {
		max-width: 70%;
		margin: 0 auto;
	}
	
	
	.allitems {
		margin-left: -10px;
		margin-right: -10px;
	}
	.allitems.photo-items .item {
		float: left;
		width: 33.3%;
	}
	.allitems.photo-items .card {
		margin: 10px;
	}
	.allitems .item-select.item-select-photo {
		right: 16px;
	}
	.allitems .item-select.item-select-video {
		right: 16px;
	}
	.allitems.photo-thumbs .item {
		width: 20%;
	}
	
	.inbox .subject {
		padding: 0 8px;
		clear: none;
	}
}

@media (min-width: 1024px) {
	body.editor {
		padding: 50px 0 0 200px;
	}
	#openside {
		display: none;
	}
	#sidebar {
		top: 50px;
		margin: 0;
	}
	#sidebar .brand {
		display: none;
	}
	header .brand {
		display: inline-block;
	}
	.itemlist .item {
		width: 20%;
	}
	.floatmenu {
		left: 200px;
	}
	#playingnow {
		left: 200px;
	}
	.songtitle {
		position: absolute;
		top: 0;
		left: 210px;
		right: 110px;
	}
	#playprogress {
		position: absolute;
		bottom: 2px;
		left: 210px;
		right: 110px;
	}
	
	.allitems.photo-items .item {
		float: left;
		width: 25%;
	}
	.allitems.photo-thumbs .item {
		width: 16.6%;
	}
	.card-preview h5 {
		height: 75px;
		overflow: hidden;
	}
}
@media (min-width: 1200px) {
	.itemlist .item {
		width: 16.6%;
	}
	.allitems.photo-items .item {
		width: 20%;
	}
	.allitems.photo-thumbs .item {
		width: 12.5%;
	}
}

@media screen and (orientation:portrait) {
	#fileviewmain .vdo, #fileviewmain .emb {
		max-width: 100%;
		margin-top: 50%;
	}
}

@media (min-height: 700px) {
	#main {
		min-height: 620px;
	}
}
@media (min-height: 1024px) {
	#main {
		min-height: 940px;
	}
}
