body, html {
    height: 100%;
}
body {
	padding-top: 70px;
}

/* NAV-BAR */
.nav-bar-avatar img {
	width: 40px;
	height: 40px;
}
.nav-bar-avatar > a {
	padding: 0 !important;
}

/* COMMENTS */
.col.avatar-col {
	max-width: 67px;
}
.col.settings-col {
	max-width: 35px;
}
.col.avatar-small-col {
	max-width: 42px;
}
.avatar {
	border-radius: 50%;
	width: 50px;
	height: 50px;
	padding: 8px 0 0 0;
	text-align: center;
	color: #fff;
	display: inline-block;
}
img.avatar {
	padding: 0 !important;
}
.avatar.small {
	width: 30px;
	height: 30px;
	padding-top: 3px;
	font-size: 1rem;
}
.speech-bubble {
    border-radius: 20px;
    position: relative;
}
.speech-bubble .form-control {
	background-color: transparent;
    border-radius: 20px;
    font-size: 0.9rem;
    resize: none;
    overflow: hidden;
    min-height: 35px;
}
.speech-bubble .form-control:focus {
    box-shadow: none;
    border: 1px solid #ced4da;
}
.speech-bubble .badge {
	position: absolute;
	right: -6px;
	bottom: -6px;
}
.inline-image {
	width: 40%;
	border-radius: 20px;
}
.comment-row {
    font-size: 0.8rem;
}

/* GENERAL */
.floating-button {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	padding: 0;
	text-align: center;
    padding-top: 3px;
	color: #fff;
	display: inline-block;
}
.floating-button-small {
	border-radius: 50%;
	width: 30px;
	height: 30px;
	padding: 0;
	text-align: center;
	padding-top: 3px;
	color: #fff;
}

@media (max-width: 991px) {
	.hide-tablet {
		display: none;
	}
	.hide-tablet.collapsing {
		display: block !important;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.fixed-box {
		position: fixed;
		width: calc(33.2vw - 30px);
	}
}

@media (min-width: 1200px) {
	.fixed-box {
		position: fixed;
		width: calc(29.1667vw - 30px);
	}
}

.to-top {
	position: fixed;
	bottom: 20px;
	right: 30px;
}

.file-hover {
	background-color: #cfd8dc;
	border: 2px dashed #78909c;
	opacity: 0.9;
}
.file {
	width: 50px;
	height: 50px;
	overflow: hidden;
	display: inline-block;
	position: relative;
}
.file img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.file .remove-item {
	position: absolute;
	color: #000;
	right: -3px;
	top: -3px;
	background-color: #fff;
	border-radius: 14px;
	width: 20px;
	height: 20px;
	line-height: 14px;
	padding: 2px 3px;
	display: none;
}
.file:hover .remove-item {
	display: block;
}

/* EDIT */
.inline-image-edit {
	width: 100%;
	border-radius: 20px;
}
.inline-image-remove {
	position: absolute;
	color: #000;
	right: -3px;
	top: -3px;
	background-color: #fff;
	border-radius: 14px;
	width: 20px;
	height: 20px;
	line-height: 14px;
	padding: 2px 3px;
}
/* TAGS */
.tag {
	display: inline-block;
	color: #424242;
	vertical-align: middle;
	font-size: 0.85rem;
}
.tag.small, .taginput.small {
	font-size: 0.8rem
}
.tag [data-role="remove"] {
	margin-left: 8px;
	cursor: pointer;
	transition: all .1s linear;
}
.tag [data-role="remove"]:hover {
	color: #000;
}
.taginput {
	width: 20px;
	border: none;
	background-color: transparent;
	font-size: 0.85rem;
	color: #424242;
	outline: none;
}
.tag-autocomplete-list {
	width: 180px;
	font-size: 12px;
	max-height: 300px;
	overflow-y: auto;
}

/* FILE ICONS */
.file-word::before {
	content: "\f1c2";
	font-family: FontAwesome;
	left: 12px;
	position: absolute;
	top: 4px;
	font-size: 30px;
	color: #1565c0;
}
.file-pdf::before {
	content: "\f1c1";
	font-family: FontAwesome;
	left: 12px;
	position: absolute;
	top: 4px;
	font-size: 30px;
	color: #d32f2f;
}
.file-excel::before {
	content: "\f1c3";
	font-family: FontAwesome;
	left: 12px;
	position: absolute;
	top: 4px;
	font-size: 30px;
	color: #2e7d32;
}
.file-powerpoint::before {
	content: "\f1c4";
	font-family: FontAwesome;
	left: 12px;
	position: absolute;
	top: 4px;
	font-size: 30px;
	color: #d32f2f;
}

/* Fix for FirebaseUI */
.mdl-shadow--2dp {
	box-shadow: none !important;
}