/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.bbb-room-selection {
	display: inline-block;
	min-width: 10em;
	margin-bottom: 2em;
	background: #fff;
}

.bbb-error {
	color: #f00;
}

.bbb-table-container,
.bbb-table-container>div {
	box-sizing: border-box;
}

.bbb-flex-table {
	display: flex;
	width: 100%;
	margin: auto 0;
	border-left: solid 1px #d9d9d9;
	transition: 0.5s;
}

.flex-row {
	padding: 0.5em 0.5em;
	border-right: solid 1px #d9d9d9;
	border-bottom: solid 1px #d9d9d9;
	text-align: center;
}

.bbb-flex-table:nth-child(even) .flex-row {
	background: #f4f2f180;
}

.bbb-flex-table:first-of-type .flex-row,
.bbb-flex-table:first-of-type a .flex-row {
	color: #4D5C6D;
	text-decoration: none;
	font-weight: bold;
	font-size: 15px;
}

.bbb-flex-table-3 {
	grid-template-columns: repeat(auto-fill, 33%);
}

.bbb-flex-table-4 {
	grid-template-columns: repeat(auto-fill, 25%);
}

.flex-row-5 {
	width: calc(100% / 5);
}

.flex-row-6 {
	width: calc(100% / 6);
}

@media all and (max-width: 1200px) {

	.bbb-flex-table {
		flex-flow: row wrap;
	}

	.flex-row {
		width: 100%;
	}

	.flex-row:first {
		width: 100%;
		border-bottom: solid 1px #d9d9d9;
	}

	.bbb-flex-table>.flex-row {
		border-bottom: solid 1px #d9d9d9;
	}

	.bbb-header>.flex-row {
		border-bottom: solid 1px;
	}
}

.bbb-recording-table-input {
	width: 100%;
}

.bbb-icon {
	color: #007CFF;
	cursor: pointer;
}

.bbb-icon:hover {
	color: #87cefa;
	cursor: pointer;
}

.bbb-header-icon {
	color: #fff;
	cursor: pointer;
}

.dashicon-disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.bbb-inline-block {
	display: inline-block;
	vertical-align: middle;
}

.bbb-recording-link {
	max-width: 7em;
	margin: 0.2em 0.1em;
	padding: 0.3em 0.5em;
	color: #fff;
	background-color: #006ddf;
	border-radius: 4px;
	font-size: 13px;
	white-space: nowrap;
}

.bbb-recording-link:hover {
	background: #bcddff;
}

/*.bbb-button {*/
/*	color: #fff !important;*/
/*	background-color: #007acc !important;*/
/*	padding: 0.8em 1.5em;*/
/*}*/

.bbb-recording-link:hover,
.bbb-recording-link:focus,
.bbb-recording-link:active,
	/*.bbb-button:hover,*/
	/*.bbb-button:focus,*/
	/*.bbb-button:active */
{
	border-color: #006799 !important;
	background-color: #0a9ed4 !important;
}

.bbb-recording-link>a {
	color: #fff;
	box-shadow: none !important;
	text-decoration: none !important;
}

.bbb-recording-link>a:hover,
.bbb-recording-link>a:focus,
.bbb-recording-link>a:active,
.bbb-recording-link>a:visited {
	color: #fff;
}

.bbb-column-header-highlight {
	background: #52a8fd !important;
}

.bbb-hidden {
	visibility: hidden;
}

.single-bbb-room .bbb-room .entry-content {
	float: none !important;
	width: auto !important;
}

.bbb-expandable-header {
	display: inline-block;
	margin-top: auto;
	margin-bottom: auto;
	font-size: 1.2em;
	font-weight: 400;
}

.bbb-recordings-display {
	cursor: pointer;
}

.bbb-recording-display-block {
	margin: 0.5em 0;
	border: 1px solid #e7e9ec;
	border-radius: 4px;
	font-size: 14px;
}

.bbb-join-room-label {
	display: inline-block;
	min-width: 20%;
}

.bbb-join-room-input {
	display: inline-block;
	min-width: 70%;
}

.bbb-join-form-block {
	margin-bottom: 0.2em;
}