body {
	
	//group Information (optional) gray
	h2 small, h3 small { 
		color: #aaa;
		font-size: inherit;
		&:before { content: " ("; }
		&:after { content: ")"; }
	}
		
	//import & settings
	&.tsml_meeting_page_import {
	
		ol.notice-error {
			padding: 10px 10px 8px 45px;
			li { margin: 0 0 2px; }
		}
				
		.progress {
			height: 20px;
			background-color: white;
			-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
			box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
			overflow: hidden;
			margin: 5px 0 15px;
			
			.progress-bar {
				background-color: #bbb;
				color: white;
				text-align: center;
				overflow: hidden;
				width: 0;
				height: 100%;
				float: left;
				line-height: 20px;
				font-size: 12px;
				-webkit-transition: width .6s ease;
				-o-transition: width .6s ease;
				transition: width .6s ease;
			}
		}
		
		//meeting types legend
		.postbox, .notice-warning {
			
			a.button-large {
				padding-top: 4px;
				line-height: 1.6;
				span { margin-right: 1px; }
			}
			
			ul.types {
				margin-top: 10px; overflow: auto;
				-webkit-columns: 3 auto; -moz-columns: 3 auto; columns: 3 auto;
				li { margin-bottom: 0; }
			}
			
			details {
				summary {
					margin: 25px 0 5px;
					cursor: pointer;
					outline: none;
				}
			}
			
			select {
				width: 100%;
				margin: 0;
				&:last-child { margin-bottom: 4px; }
			}
			
			//radio distance units
			label.radio { display: block; margin-top: 5px; }

			//get feedback & get notified
			table {
				margin: 0 0 10px; 
				width: 100%; 
				border: 0; 
				border-spacing: 0; 
				border-collapse: collapse;
				tr {
					th, td {
						text-align: left;
						margin: 0;
						padding: 4px 0;
						border: 0;
						input.button {
							margin-right: 10px;
						}
						&.align-center {
							text-align: center;
						}
						&.align-right {
							text-align: right;
						}
						&.small {
							width: 1%;
						}
						&:first-child {
							font-family: Consolas,Monaco,monospace;
						}
						&:last-child {
							text-align: right;
							span { cursor: pointer; }
						}
					}
					td {
						border-top: 1px solid #ddd;						
					}
					&:last-child td {
						padding-bottom: 0;
					}
				}
				form {
					.button.button-small {
						height: 18px;
						line-height: 16px;
					}
				}
			}
			
			//add email forms
			form.columns {
				overflow: auto;
				margin: 0 -5px;
				box-sizing: border-box;
				& > div { 
					box-sizing: border-box;
					padding: 0 5px; 
					display: inline-block;
					float: left;
					input {
						box-shadow: none;
						width: 100%;
						&[type=text], &[type=email] {
							border: 1px solid #ccc;
							border-radius: 3px;
							font-family: Consolas, Monaco, monospace;
							height: 28px;
							line-height: 26px;
							font-size: 13px;
							margin: 0;
						}
					}
					&.input {
						width: 70%;
					}
					&.input-half {
						width: 35%;
					}
					&.btn {
						width: 30%;
					}
				}
			}
			
			//where's my info list margins
			&#wheres_my_info {
				ul {
					margin-top: -10px;
					li { margin: 0 0 2px; }
				}
			}
			
			//try the apps app store buttons
			&#try_the_apps {
				p.buttons {
					margin-left: -5px; margin-right: -5px; overflow: auto;
					a {
						padding: 0 5px; width: 50%; float: left; display: block; box-sizing: border-box;
						img { width: 100%; height: auto; display: block; }
					}
				}
			}
	
		}
		
	}
	
	//region list page
	&.taxonomy-tsml_region {
		.row-actions { display: none; }
	}

	//meeting add/edit
	&.post-type-tsml_meeting {

		//remove these because it can confuse people to hide it
		.postbox {
			.handlediv { display: none; }
			.hndle { background-color: #fafafa; }
			&.closed .inside { display: block; }
		}

		.meta_form_row {
			padding: 10px 0 0; overflow: auto; clear: left;
			label, input, div.checkboxes, #map { float: left; line-height: 100%; } 
			label { width: 13%; margin-right: 2%; text-align: right; font-size: 15px; line-height: 1.4; margin-top: 9px; white-space: nowrap; }
			input[type=text], input[type=date], select, textarea, div.checkboxes, #map { 
				width: 85%; 
				margin: 0; 
				font-size: 18px;
				padding: 6px;
				height: 40px;
				line-height: normal;
				float: left;
				box-sizing: border-box;				
			}
			input[type=text], input[type=date], select, textarea, 	#map { 
				border: 1px solid #ddd !important;
				border-radius: 4px !important;
			}			
			input.time {
				width: 42%; 
				&:last-child { margin-left: 1%; }
			}
			input, select { 
				border: 1px solid #ccc; 
			}
			input[type=radio], input[type=checkbox] { 
				box-shadow: none;
				&:checked:before { display: none; }
			}
			//wordpress is doing something fancy with checkboxes and it's not working
			input[type=checkbox] {
				-webkit-appearance: checkbox;
			}
			
			input[type=radio] {
				-webkit-appearance: radio;
			}
			
			input[disabled] { opacity: .5; cursor: not-allowed; }
		
			&.typeahead {
				overflow: visible;
	            @import 'typeahead-bootstrap.scss';
				.twitter-typeahead{
					 width: 85%;
					 input { width: 100%; }
				}
				.tt-hint { color: #999; }
			}
			
			&.checkbox, &.radio {
				padding-left: 15%;
				line-height: 1;
				label { 
					width: auto;
					margin: 0; 
					font-size: 13px;
					display: block;
					float: none;
					text-align: left;
					position: relative;
					padding: 0 0 0 20px;
					input {
						position: absolute;
						left: 0;
						top: 5px;
					}
					&:first-child { margin-bottom: 5px; }
				}
			}
		
			textarea { height: 140px; }
			&:last-child { margin-bottom: 0; }
			div.checkboxes { 
				overflow-x: hidden;
				overflow-y: auto;
				padding: 0;
				height: auto; 
				-webkit-columns: 3 auto;
				-moz-columns: 3 auto;
				columns: 3 auto;
				position: relative;
				
				label { 
					float: none; 
					display: block;
					margin: 0;
					line-height: 16px;
					width: 100%;
					text-align: left;
					font-size: 13px;
					-webkit-column-break-inside: avoid;
					padding: 5px 0 5px 20px;
					position: relative;
					box-sizing: border-box;
					input { 
						position: absolute;
						top: 10px;
						left: 0;
					}

					&.not_in_use { display: none; }
				}
				.toggle_more { 
					display: none; 
					position: absolute;
					font-size: 13px;
					.less { display: none; }
				}
				&.has_more {
					padding-bottom: 30px;
					.toggle_more { 
						position: absolute;
						bottom: 0;
						display: block;
						left: 0;
					}
				}
				&.showing_more {
					label.not_in_use { display: block; }
					.more { display: none; }
					.less { display: block; }
				}
				
			}
			&.city {
				input { width: 60%; margin-right: 1%; }
				select { width: 24%; }
			}
		
			::-webkit-input-placeholder	{ color: #ccc }
			:-moz-placeholder			{ color: #ccc; }
			::-moz-placeholder			{ color: #ccc; }
			:-ms-input-placeholder		{ color: #ccc; }
		
			#map { 
				background-color: #f6f6f6;
				height: 300px;
				padding: 0;
				*:focus { outline: none; }
				.mapboxgl-ctrl-logo, .mapboxgl-ctrl-attrib { display: none; }
				p { 
					font-style: italic;
					font-size: 15px;
					margin: 8px 10px;
					color: #999;
				}
			}
			
			//meetings at a location
			ol {
				overflow: auto;
				font-size: 15px;
				margin: 0;
				padding: 10px 0 0 0;
				-webkit-columns: 2 auto;
				-webkit-column-gap: 60px;
				li {
					break-inside: avoid-column;
					-webkit-column-break-inside: avoid;
					padding: 0 0 10px 110px;
					position: relative;
					margin: 0 0 0 25px;
					span { color: #999; display: inline-block; position: absolute; left: 0; }
					&:last-child { margin-bottom: 0; }
				}
			}
			
			.container {
				width: 85%;
				float: left; 
				display: table;
				.row {
					display: table-row;
					&:first-child div { border-top: 0;	}
					div {
						border-left: 10px solid transparent;
						border-top: 10px solid transparent;
						display: table-cell;
						&:first-child { border-left: 0;	}
						input { width: 100%; }
					}
				}
			}
		}
		
		#contact-type {
			&[data-type="meeting"] .group-visible { display: none; }
			&[data-type="group"] .group-visible { display: block; }
		}
	}
}