.badm-standard footer,
.badm-standard #sub-floor,
.badm-standard #sub-floor .container,
.badmgroup #content {
	min-width: 922px;
	overflow: hidden;
}

.tab-content {
	display: none;
}

@media (min-width: 768px) {
	.container {
		min-width: 922px !important;
	}
}

@media (max-width: 1200px) {
	.container-fluid {
		padding-left: 0px;
		padding-right: 0px;
	}
	#customizer table .optionalvars {
		padding-left: 0px !important;
	}
}

.col-xs-6 {
	/* width: 33%; fixes one issue causes another */
}

.attribution {
	margin-left: 150px;
}

.badmgroup.container {
	padding: 0px;
}

.badmgroup header {
	margin-bottom: 20px;
}

.badmgroup .row {
	border: 0px solid #ccc;
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.disabled {
	pointer-events: none;
}

.appliestoall.disabled {
	background: #f1f1f1;
	opacity: .5;
}

.fa-check-square,
.fa-minus-square,
.fa-dot-circle {
	color: #4D90FE;
}

.row.table .fa-lightbulb-o,
.fa-angle-up,
.fa-angle-down {
	color: #487E90;
}

.square,
.circle,
.fa-angle-up,
.fa-angle-down,
a.vocab,
.row.table .fa-lightbulb-o {
	cursor: pointer;
}

.square {
	background-color: white;
}

.active {
	background-color: #ccdbe1 !important; /* this is the light teal fill color */
}

.grey {
	background-color: #f1f1f1;
}

.darkgrey {
	color: #555555;
}

/* examples, definitions, etc */
.tabs button {
	border: none;
	color: #333;
	outline: none;
	width: 150px;
	background-color: #f1f1f1;
	white-space: nowrap;
}

.tabs button.active {	
	border-bottom: #333 2px solid;
}

.tabs button:hover {	
	background-color: #dddddd;
}

/* top grid is the top of each panel and includes title, info text, buttons, and legends */
.topgrid {
  display: grid;
  grid-template-areas:
  	'title title title title title'
    'info info info info legend'
    'console console console console legend';
  grid-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  padding: 10px 0;
}

.topgrid > div {
  text-align: left;
  padding: 0px;
}

.topgrid p {
	margin-bottom: 10px;
}

.topgrid h2 {grid-area: title; margin-bottom: 0px; }
.topgrid .legend {grid-area: legend; 
	align-self: end; 
	background-color: #efefef; 
	padding: 10px; 
	width: 150px; 
	position: relative;
	left: calc(100% - 150px);
	font-size: 12px;
}
.topgrid .informative {grid-area: info; }
.topgrid .console {grid-area: console; }

.topgrid .console .intro {
	width: 85px;
	font-weight: bold;
	display: inline-block;
}

.topgrid .console button {
	margin-right: 15px;
	margin-bottom: 10px;
}

.star, .stars {
font-weight: bold;
}

.star::before {
content:'* ';
color: #cc4837;
}
.stars::before {
content:'** ';
color: #cc4837;
}

/* vars have different classes for each panel */
.ovm, .exm, .def, .cmzr {
	color: black;
}

/* selected var on customizer page, temporary */
/* .ccc { color: orange; } */

td {
	vertical-align: top; 
	padding: 2px 5px;
}

tr {padding: 2px 0px;}

.entry-content #overview td li,
.entry-content #examples .example-cluster li,
.entry-content #customizer li {
	padding-bottom: 0;
	list-style: none;
}

.table td {
	padding: 2px 5px;
}

.popover {
max-width: 600px !important;
}

.badm-standards-popover.narrow {
	max-width: 400px;
}

.badm-standards-popover.narrow table {
	min-width: 100%;
}

.group div.grey {
    min-width: 200px;
    width: max-content;
    max-width: 350px;
	padding: 5px 8px 4px 8px;
	margin-bottom: 10px;
	/* font-size: 12px; */
	font-weight: bold;
}

.group.single {
	margin-bottom: 20px;
}

.or.grey {
	font-variant: small-caps;
	padding: 0px 4px;
}

#overview th {
	padding-left: 10px;
	min-width: 200px;
}


#overview .group div.grey {
	width: auto;
}

/* wide table font size */
#overview th,
#overview table table td {
	font-size: 12px;
	font-family: "proxima-nova-condensed", sans-serif;
}

#overview td table:last-child {
	margin-bottom: 10px;
}

#definitions tr {
	border: 1px solid #ddd;
}

#definitions th,
#definitions td  {
	border: 1px solid #ddd;
	padding: 5px;
}

#definitions th {
	vertical-align: top;
}

#definitions th:nth-child(1) {
	min-width: 200px;
}

#definitions th:nth-child(2) {
	min-width: 200px;
}

#definitions th:nth-child(3) {
	width: 100%;
}

#definitions td:nth-child(1) {
	white-space: nowrap;
}

#definitions .vocab.hideable {
	background:#f1f1f1;
	display:none;
}

#definitions .vocab.hideable .scroll {
	overflow-y: auto;
	max-height: 150px;
	clear: both;
	background:white;
	margin: 0px 15px 10px ;
}


#definitions .vocab.hideable .control {
	margin: 5px 0px ;
}

#definitions .vocab.hideable .control .closer {
	float: right;
	font-size: 25px;
	margin-top: -15px;
	cursor: pointer;
} 

#definitions .vocab.hideable .control .closer:hover {
	opacity: .5;
} 
#definitions .vocab.hideable table {
	min-width: 100%;
}

#definitions .vocab.hideable table th:nth-child(1) {
	width: 178px;
	min-width: 178px;
}

#definitions .vocab.hideable table th:nth-child(2) {
	width: calc(100% - 178px);
}

#definitions, #examples, #customizer {
	clear:both;
}

#examples .table {
	height: 75vh;
}
section#examples .texts table {
	border-bottom: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
}

#examples .texts table th, #examples .texts table td {
    padding: 8px;
    border-top: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    vertical-align: top;
    text-align: left;
    line-height: 18px;
    border-collapse: collapse;
}

#examples #arrow-boundary {
	position: relative;
	height: 100%;
	float: left;
}

#examples .index,
#examples .texts {
	height: 100%;
	overflow: auto;
}

#examples .index {
	margin-right: 10px;
}

#examples .index table {
	width: 250px;
}

#examples table td {
	padding:5px 0px;
}

#examples table div {
	border: 1px solid #ddd;
	border-bottom: 0px;
}

#examples table td div:last-child {
	border-bottom:1px solid #ddd;
}

#examples .texts {
	border: 5px solid #e6673d;
	padding: 0px 10px;
}

#examples .example-cluster li {
	padding: 1px 5px;
}

#triangle {
	color: #e6673d;
	font-size: 36px;
	z-index: 1000;
	position: absolute;
	right: -1%;
	display: none;
}

#examples .example-cluster {
	cursor: pointer;
}

#examples .index li {
	white-space: nowrap;
}

#customizer li > table {
	margin-left: 22px;
}

#customizer .title.single {
	margin-left: 390px;
	font-weight: bold;
}

#customizer li.group {
	padding-top: 10px;
	border-top: 1px solid #ddd;
	padding-bottom: 10px;
}

#customizer li.group.appliestoall {
	margin-top: 5px;
}

#customizer .group.single div {
	float:left;
	margin-right: 10px;
}

#customizer .group.single div>span {
	position:relative;
	top:5px;
}
/* wide table font size */
#customizer table td,
#customizer table th,
#customizer li.group.single {
	font-size: 12px;
	font-family: "proxima-nova-condensed", sans-serif;
}

#customizer table th.requiredvars {
	min-width: 230px;
}

#customizer table td {
	padding-left: 0px;
	padding-bottom: 5px;
	white-space:nowrap;
}

#customizer table .optionalvars {
	padding-left: 20px;
}

/* stacked variables with one square/circle */
#customizer div.stack {
	display: inline-block;
	float: right;
	margin-left: 4px;
}

#customizer .group.single > span {
	position: relative;
	top: 5px;
}

#customizer .fa-exclamation-circle.disabled,
#customizer .fa-check {
	opacity: 0;
	pointer-events: none;
}

#customizer .both {
	padding-left: .5em;
}

#customizer .fa-exclamation-circle,
#customizer .both .fa-dot-circle + span {
	color: #cc4837;
}

#customizer .both i.fa-info-circle {
	border: 1px solid transparent;
	border-radius: 50%;
	box-shadow: inset 0 0 0 2px;
}	

#customizer .both .fa-dot-circle + span + i.fa-info-circle {
	border-color: #cc4837;
}	

#customizer .creator p {
	margin: 10px 0 0 0;
}