@import "bootstrap/functions";
@import "bootstrap/variables";
@import "bootstrap/mixins";

$font-family-sans-serif-2: 'Poppins', sans-serif;
$font-family-serif: 'Source Serif Pro', serif;



body {
	font-family: $font-family-sans-serif;
	background-color: #efefef;
}
p {
	color: darken(#ccc, 10%);
	font-weight: 300;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: $font-family-sans-serif;
}
a {
	transition: .3s all ease;
	&, &:hover {
		text-decoration: none!important;
	}
}
.content {
	padding: 7rem 0;
}
h2 {
	font-size: 20px;
}


.ms-options {
	padding: 20px;
	// width: calc(100%-40px)!important;
	border: none;
}

.ms-options-wrap {
	& > button:focus, & > button {
		border-radius: 4px;
		transition: .3s all ease;
		box-shadow: 0 1px 1px 0 rgba($black, .1);
		border: none!important;
		height: 40px;
		padding-left: 10px;
		padding-right: 10px;
		z-index: 2;
		&:hover {
			box-shadow: 0 2px 10px 0 rgba($black, .1);
		}
		&:after {
			right: 10px;
		}
		&:active, &:focus {
			outline: none;
		}
	}
	&.ms-active {
		& > button:focus, & > button {
			box-shadow: 0 2px 10px 0 rgba($black, .1);	
		}
	}
	& > .ms-options {
		z-index: 1;
		left: 16px;
		min-width: 320px;
		border: none!important;
		box-shadow: 0 15px 30px 0 rgba($black, .1);
		border-radius: 4px;
		.ms-search input {
			border-bottom: 1px solid #efefef;
		}
		.ms-selectall {
			color: darken(#ddd, 20%);
			text-transform: uppercase;
			font-size: 11px;
			&:hover {
				color: $black;
			}
		}

		& > ul li.selected label {
			border-radius: 4px;
		}
		& > ul li label {
			border-radius: 4px;
			border: none;
			padding-top: 5px;
			padding-bottom: 5px;
		}
		& > ul li:hover label {
			border: none;
		}
	}
}


// .ms-options-wrap > .ms-options > ul li.selected label {

// }