/*

Bill's CSS Playground

You can treat this as a sandbox area to try things out. When you are happy with your css you can copy it to themes/sundialsoc/library/less/bss-theme.less. But bare in mind, if you add to this file, you'll need to re-compile themes/sundialsoc/library/less/style.less which will gernerate and minify the main stylesheet themes/sundialsoc/library/css/style.css.

If possibile, try to make use of the bootstrap classes before you create anything new.
You may find they have already solved your problem.

*/

#map {width: 100%; height: 500px;float:left;}

/* see http://stackoverflow.com/questions/8511436/zoom-control-and-streetview-not-showing-on-my-google-map */
.gmnoprint img {
    max-width: none;
}
/*

Popup on the combo map, make it float on top.

*/
#comboMap-canvas {
	position: relative;
	padding-bottom: 50%;
	height: 0;
	overflow: hidden
}
/*
#comboMap-canvas iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important
}
 */
/*
.popup-open #comboMap-popup {
	position: absolute;
	top: 36px;
	right: 36px;
	left: 36px;
	overflow-y: auto;
	height: 50%
}
 */
@media screen and (max-width:768px) and (orientation:portrait) {
	#comboMap-canvas {
		padding-bottom: 150%
	}
	.popup-open #comboMap-popup {
		height: inherit
	}
}
@media screen and (min-width:769px) {
	#comboMap-canvas {
		padding-bottom: 75%
	}
	.popup-open #comboMap-popup {
		height: inherit;
		left: inherit;
		width: 50%
	}
}
/*
Updates for formatting facet search widgets
*/

.facetwp-facet {
  margin-bottom: 2px !important;
}

.modal-backdrop {
  display: none;
}

.modal {
  background: rgba(0,0,0,0.5);
}
.modal-body {
 padding-top: 0px;
 padding-bottom: 0px;
}

.modal-footer {
 padding-top: 0px;
 height: 23.5px;
}

.fade.in {
    opacity: 1;
}

/* Element | http://localhost:8888/BSS_200520/dials-filter/ */

#gallery {
  margin-bottom: 0px;
}

.empty, .full {
  height: 19px;
  width: 19px;
  border-width: 1px;
  border-style: solid;
  border-color: black;
  margin: 1px 1.5px;
  border-radius: 50%;
  cursor: pointer;
  display: inline-block;
}

.empty:hover, .full:hover {
  background-color: #d5e9f9;
}
.empty:active, .full:active {
  background-color: #355e99;
}
.empty {
  background-color: white;
}
.full {
  background-color: #355e99;
}

#accordions-72662:hover .accordions-head:hover{
  background-color: #2e75b3;
}