customCSS.css

@font-face {
	font-family: "Brandon-Text";
	src: url(https://www.bu.edu/cdn/fonts/BrandonText-Regular/2BA300_7_0.eot);
	src: url(https://www.bu.edu/cdn/fonts/BrandonText-Regular/2BA300_7_0.eot?#iefix) format("embedded-opentype"), url(https://www.bu.edu/cdn/fonts/BrandonText-Regular/2BA300_7_0.woff) format("woff"), url(https://www.bu.edu/cdn/fonts/BrandonText-Regular/2BA300_7_0.ttf) format("truetype");
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: "Benton-Sans";
	src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Bold/d4a4a960-2cf2-430e-8b13-cbf6f261ddb9-2.eot");
	src: url("https://www.bu.edu/cdn/fonts/Benton-Sans-Bold/d4a4a960-2cf2-430e-8b13-cbf6f261ddb9-2.eot?") format("embedded-opentype"), url("https://www.bu.edu/cdn/fonts/Benton-Sans-Bold/d4a4a960-2cf2-430e-8b13-cbf6f261ddb9-3.woff") format("woff"), url("https://www.bu.edu/cdn/fonts/Benton-Sans-Bold/d4a4a960-2cf2-430e-8b13-cbf6f261ddb9-1.ttf") format("truetype");
	font-style: normal;
	font-weight: 700;
}

@font-face {
	font-family: 'FF-Clan-Web-Pro';
	src: url(https://www.bu.edu/cdn/fonts/FF-Clan-Web-Pro-Bold/2E6433_A_0.eot);
	src: url(https://www.bu.edu/cdn/fonts/FF-Clan-Web-Pro-Bold/2E6433_A_0.eot?#iefix) format("embedded-opentype"), url(https://www.bu.edu/cdn/fonts/FF-Clan-Web-Pro-Bold/2E6433_A_0.woff2) format("woff2"), url(https://www.bu.edu/cdn/fonts/FF-Clan-Web-Pro-Bold/2E6433_A_0.woff) format("woff"), url(https://www.bu.edu/cdn/fonts/FF-Clan-Web-Pro-Bold/2E6433_A_0.ttf) format("truetype");
	font-style: normal;
	font-weight: 700;
}

/*----------------- General Styling (Header + Footer + text styling)------------------*/
html,body {
/* Make top banner's bottom black space disappear (when responsive) */
	color: #2D2926;
	margin: 0 auto;
	padding: 0;
	border: 0;
	outline: 0;
	background-color: white;
}

.icon-toolbox::before, .icon-files::before, .icon-lightbulb::before, .icon-search::before, .icon-book::before, .icon-video::before {
/*takes out weird icon margin spacing that comes with the icon*/
	margin: 0;
}

/* General Text, container, p, headings Styling */
.top_container {
	margin-left: auto;
	margin-right: auto;
	margin-top: 4rem;
	margin-bottom: 4rem;
	max-width: 650px;
	padding: 0 20px;
}

.top_container a {
	color: #3B547C;
}

h3 {
	font-family: FF-Clan-Web-Pro;
	font-weight: 400;
	font-size: 1.5em;
	color: #3B547C;
}

h3, h6 {
	text-transform: uppercase;
}

/* USE CLASSES TO STYLE HEADINGS WITH COLORS, ETC. WHAT IF YOU WANT A RED H3? */
p, h5 {
	color: #2C2926;
}

section {
	margin: 0 auto;
}

p, ul {
	margin-top: 1em;
	margin-bottom: 1em;
	font-family: "Brandon-text";
	font-size: 1em;
}

.content-container {
	margin: 0 auto;
	justify-content: center;
/* THIS IS A RECORDING... */
	padding: 0;
	width: 100%;
}

/* Top Navigation Bar Styling */
.primaryNav-menu li a {
	font-size: .8rem;
}

.primary-nav, .primary-nav-menu li li:hover {
	background-color: #3B557C;
}

.is-open #primary-nav-menu {
	margin-left: 0;
	margin-right: 0;
}

.primary-nav-menu li li {
	padding: 0;
}

.primary-nav-menu li li a:hover, .primary-nav-menu li li a {
	color: white;
	padding: 1rem;
}

.masthead {
	border-bottom: 0;
}

.page-item-26 ul {
/*5 key practices dropdown */
	text-align: left;
	background-color: #7AA8BF;
}

a.level_1:hover {
	color: white;
	background-color: #3B557C;
}

.page h1 {
	display: none;
}

button:active {
	outline: 0;
	outline-offset: 0;
	background-image: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.primary-nav-menu a.active,
.primary-nav-menu a.active_section {
	background-color: #7AA8BF;
	color: white;
}

.primaryNav {
/*background: url(/setleaders/files/2020/04/bu_logo-636x285.png) left no-repeat #3b557c;*/
	background-position: 25px;
	background-size: 80px 35px;
	background-color: #7AA8BF;
}

.centered {
	position: absolute;
	width: inherit;
	height: inherit;
	justify-content: center;
	text-align: center;
	padding: 0 auto;
	color: white;
	font-size: 6rem;
}

/* Banner Styling */
.bu-banner-button {
	border-radius: 10px;
}

/* General changes for widget on 5 key practices page*/
.widget_bu_pages {
	margin-top: 5rem;
}

/* Collapsibles of 5 key practices pages */
.bu_collapsible {
	color: #3B557C;
}

.bu_collapsible_container h4:hover, .bu_collapsible:hover::before, .bu_collapsible:focus::before {
	color: #7AA8BF;
}

/* Sidebar of Key Practices */
.widget-title {
	color: #3B557C;
	border-bottom: 2px solid #3B557C;
}

.widget-title a::after {
	display: none;
}

.sidebar li {
	line-height: 1.4;
}

.content_nav_header {
	font-family: FF-Clan-Web-Pro;
	font-weight: 400;
	font-size: 1em;
}

.widget a:hover, .widget a:focus,
.widget_bu_pages li a,
.widget_nav_menu li a {
	color: #3B557C;
	text-decoration: none;
}

#contentnavlist .active {
	color: #7AA8BF;
}

.widget_bu_pages li a:hover, .widget_bu_pages li a:focus, .widget_nav_menu li a:hover, .widget_nav_menu li a:focus {
	color: #7AA8BF;
	text-decoration: none;
	background-color: white;
}

/* Share this Page */
.bu-sharing {
	margin-top: 3rem;
}

/*changes for widget of FOOTBAR for the support statement */
.footbar-container {
	display: block;
	text-align: center;
}

.footbar-container p {
	color: #3B557C;
	padding: 0 20px;
}

.footbar-container, .widget-count-1 {
	background: white;
	padding: 0;
}

.footbar {
	border: none;
}

.footbar a {
	color: #3B557C;
}

/* Site Footer */
.site-footer {
	background: #3B557C;
}

.site-footer a {
	color: white;
}

/*----------------- End of General Styling ------------------*/
/*----------------- Home Page ------------------*/
/*--- banner section ---*/
.headline {
	grid-area: headline;
}

.left-half {
	grid-area: left;
}

.right-half {
	grid-area: right;
}

.left-learn-more {
	grid-area: left-learn-more;
}

.right-learn-more {
	grid-area: right-learn-more;
}

.home_container {
	display: grid;
	grid-template-areas: 'headline headline' 'left right' 'left-learn-more right-learn-more';
	grid-gap: 20px;
	column-gap: 80px;
	text-align: center;
}

.home_container a {
	color: #3B547C;
}

.home_container h4 {
	text-transform: uppercase;
	color: #3B547C;
	line-height: 1.4;
}

.home_container h3 {
	line-height: 1.4;
}

.left-half h4, .left-half h6, .left-learn-more h6 {
	color: #7AA8BF;
}

.right-half h4, .right-half h6, .right-learn-more h6 {
	color: #E37373;
}

.icon-toolbox {
	font-family: "BU-Default-Icons";
	content: "\F030";
	color: #7AA8BF;
	display: block;
	font-size: 5rem;
}

.icon-files {
	font-family: "BU-Default-Icons";
	font-size: 5rem;
	display: block;
	color: #E37373;
}

.left-half p, .right-half p {
	text-align: left;
}

.icon-navigateright {
	font-family: "BU-Default-Icons";
	content: "\25BB";
}

.learn_more_right {
	background-color: #E37373;
	color: white;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: block;
	margin: 0 auto;
}

.learn_more_left {
	background-color: #7AA8BF;
	color: white;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: block;
	margin: 0 auto;
}

.icon-navigateright::before {
	margin: 0 auto;
	text-align: center;
	vertical-align: -webkit-baseline-middle;
	font-size: 1.7rem;
}

/*
.learn_more_left {
	filter: invert(72%) sepia(4%) saturate(2757%) hue-rotate(155deg) brightness(91%) contrast(78%);
}

.learn_more_right {
	filter: invert(68%) sepia(85%) saturate(1991%) hue-rotate(313deg) brightness(99%) contrast(79%);
}*/
/*----------------- end of home page ------------------*/
/*----------------- ----------ABOUT PAGE ------- ------------------*/
/* -- Who We Are -- */
.about_who_wrapper {
	display: flex;
	flex-direction: column;
}

.about_who_ppl {
	background-color: white;
	border: solid 2px #7AA8BF;
	margin: 1rem;
	display: grid;
	grid-template-columns: repeat(2,auto);
}

.about_p_text_container, .about_p_text_container h5 {
	display: flex;
	flex-direction: column;
	line-height: 1.5rem;
}

.about_headshots,.about_p_text_container {
	margin: 2rem;
	margin-right: 0;
}

.about_who_ppl img {
	max-width: 200px;
	max-height: 200px;
	min-width: 200px;
}

.name, .position {
/* name + job title (position) + introductions */
	color: #3B557C;
	font-size: 1em;
	padding: 0;
	margin: 0;
	line-height: 1.4;
}

.intros {
	color: #3B557C;
}

.about_who_ppl:hover > div > * {
/*color: black;*/
	color: #3B557C;
}

/* Get Involved - Get Involved in Conversation */
.about_involve_wrapper {
	margin: 0 auto;
	margin-bottom: 5rem;
	max-width: 650px;
}

.about_involve_wrapper > p {
	line-height: 2.2rem;
	margin: 0 auto;
	margin-top: 2rem;
}

.about_involve_wrapper,
.involve_content_wrapper {
	background-color: #F5F0E5;
}

.about_involve_wrapper > p, 
.involve_content_2 > p {
	font-size: 1em;
	font-style: italic;
	display: block;
	padding: 3rem;
	line-height: 2.2rem;
	text-align: left;
	max-width: 650px;
	margin: 0 auto;
}

.conversation_intro {
	margin-top: 3rem;
	margin-bottom: 3rem;
}

.involve_tabs {
	max-width: 700px;
}

.form {
	display: block;
	justify-content: center;
	margin: 0 auto;
	margin-top: 3rem;
}

.form_container {
	justify-content: center;
	margin: 0 auto;
}

/* --------- TABS on About Page ------- */
.tabs {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 100%;
	overflow: visible;
	padding-top: 10px;
	margin-bottom: 60px;
	margin: 0 auto;
	text-align: center;
}

.tabs input {
	opacity: 0;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	filter: alpha(opacity=0);
	z-index: 1000;
	position: absolute;
}

.tabs label {
	width: 170px;
	display: inline-block;
	margin: 0 2vw;
	text-align: center;
	padding: 20px 10px;
/*
	background-color: #7AA8BF;
	color: white;
	border: solid 3px #7AA8BF; */
	background-color: white;
	border: solid 3px #7AA8BF;
	color: #7AA8BF;
	cursor: pointer;
}

.about_content {
	margin-top: 50px;
	visibility: hidden;
	z-index: 1;
	text-align: left;
}

.about_tabs_container .tab-selector-1:checked ~ .tab-label-1,
.about_tabs_container .tab-selector-2:checked ~ .tab-label-2,
.about_tabs_container .tab-selector-3:checked ~ .tab-label-3,
.about_tabs_container .tab-selector-4:checked ~ .tab-label-4 {
/*background-color: white;
	border: solid 3px #7AA8BF;
	color: #7AA8BF;*/
	background-color: #7AA8BF;
	color: white;
	border: solid 3px #7AA8BF;
}

.tabs .tab-selector-1:checked ~ .about_content .about_content_1,
.tabs .tab-selector-2:checked ~ .about_content .about_content_2,
.tabs .tab-selector-3:checked ~ .about_content .about_content_3,
.tabs .tab-selector-4:checked ~ .about_content .about_content_4 {
	visibility: visible;
	width: 100%;
	height: auto;
	display: block;
}

.involve_tabs .tab-input-1:checked ~ .involve_content_wrapper .involve_content_1,
.involve_tabs .tab-input-2:checked ~ .involve_content_wrapper .involve_content_2 {
	visibility: visible;
	width: 100%;
	display: block;
	height: auto;
}

.about_content_1,
.about_content_2,
.about_content_3,
.about_content_4,
.involve_content_1,
.involve_content_2 {
	display: none;
}

.tab-input-1:checked + .involve-label-1,
.tab-input-2:checked + .involve-label-2 {
/*	background-color: white;
	border: solid 3px #E37373;
	color: #E37373;*/
	color: white;
	border: solid 3px #E37373;
	background-color: #E37373;
	cursor: pointer;
}

.involve_tabs label {
	margin: 0 1.5rem;
/*
	border: solid 3px #E37373;
	background-color: #E37373;
	cursor: pointer;*/
	background-color: white;
	border: solid 3px #E37373;
	color: #E37373;
	width: fit-content;
	cursor: pointer;
}

/* Contact Us Section on the end of About Page */
.about_who_ppl a {
	color: #3B547C;
}

.top_container h4 {
	text-align: center;
	text-transform: uppercase;
	color: #3B547C;
}

.general_inquiries {
	font-weight: 800;
}

.about_contact_note {
	color: #E37373;
}

/*----------------- end of about page ------------------*/
/*----------------- Start of Key Practices Landing Page ------------------*/
/* select box stuff */
.key_practices_container {
	margin-left: auto;
	margin-right: auto;
	margin-top: 4rem;
	margin-bottom: 4rem;
	max-width: 750px;
	padding: 0 20px;
}

/* don't display select box (html) at all for web version */
.select-box-container {
	display: none;
}

#hidden-prac1, #hidden-prac2, #hidden-prac3, #hidden-prac4, #hidden-prac5 {
	display: none;
}

/*Buttons for each practice */
.key_practice_btn {
	border: solid 3px #7AA8BF;
	color: #7AA8BF;
	padding: 1rem;
	text-align: center;
	text-decoration: none;
	display: flex;
	font-size: 16px;
	flex-direction: column;
	justify-content: center;
	cursor: pointer;
}

#btn1:checked ~ #key_practice_btn1, #btn2:checked ~ #key_practice_btn2, #btn3:checked ~ #key_practice_btn3, #btn4:checked ~ #key_practice_btn4, #btn5:checked ~ #key_practice_btn5, .key_practice_btn:active, .key_practice_btn:hover {
	background-color: #7AA8BF;
	border: solid 3px #7AA8BF;
	color: white;
}

#key_practice_btn1 {
	grid-area: btn1;
}

#key_practice_btn2 {
	grid-area: btn2;
}

#key_practice_btn3 {
	grid-area: btn3;
}

#key_practice_btn4 {
	grid-area: btn4;
}

#key_practice_btn5 {
	grid-area: btn5;
}

.key_practices_button_container {
	margin-top: 4rem;
	margin-bottom: 4rem;
	display: grid;
	grid-template-areas: 'btn1 btn2 btn3 btn4 btn5';
	grid-gap: 1rem;
}

/* video stuff */
.video-carousel {
	margin: 0 auto;
	padding: 0;
	align-items: center;
	justify-content: center;
	display: flex;
	max-width: 750px;
}

.video-card {
	margin: 0 auto;
	max-width: 650px;
	display: flex;
	display: none;
	align-items: center;
	justify-content: center;
}

.videos {
	width: 66%;
}

.video-caption {
	display: block;
	width: 30%;
	line-height: 1.4;
	padding-right: 1em;
	font-size: 16px;
}

input[type='radio'] {
	display: none;
}

#btn-next.icon-navigateright {
	content: "\25BB";
}

#btn-prev.icon-navigateleft {
	content: "\25C5";
}

#btn-next, #btn-prev {
	color: #7AA8BF;
	font-size: 30px;
	background-color: white;
}

#btn-next::before {
	font-size: 100%;
	vertical-align: unset;
}

#btn-prev::before {
	margin: 0;
}

#item-1:checked ~ .cards #video1,
#item-2:checked ~ .cards #video2,
#item-3:checked ~ .cards #video3,
#item-4:checked ~ .cards #video4,
#item-5:checked ~ .cards #video5,
#item-6:checked ~ .cards #video6,
#item-7:checked ~ .cards #video7,
#item-8:checked ~ .cards #video8,
#item-9:checked ~ .cards #video9,
#item-10:checked ~ .cards #video10,
#item-11:checked ~ .cards #video11 {
	display: flex;
}

.video-card :nth-child(1) {
	order: 2;
}

.video-card :nth-child(2) {
	order: 1;
}

/*----------------- end of key practices landing page ------------------*/
/*------------------ Resources for Observers Page --------------*/
.top_container h3 {
	text-align: center;
}

.icon-lightbulb,.icon-book,.icon-search,.icon-video {
	font-family: "BU-Default-Icons";
	font-size: 4.2rem;
	color: #7AA8BF;
	display: block;
	text-align: center;
}

.icon-lightbulb {
	content: "\1F4A1";
}

.icon-book {
	content: "\1F4D5";
}

.icon-search {
	content: "\1F50E";
}

.icon-video {
	content: "\1F4F9";
}

/*------------------ End of Resources for Observers Page --------------*/
/*----------------- mobile ------------------*/
@media only screen and (max-width: 650px) {
	/** General Styling **/
	#primary-nav-menu {
		text-align: center;
	}
	
	.bu-banner-content {
		padding: 30px;
	}
	
	.bus-sharing {
		margin-left: 20px;
		margin-top: 3rem;
	}
	
	/** Home Styling **/
	.home_container {
		display: block;
		padding: 20px;
		text-align: center;
	}
	
	.left-learn-more, .right-learn-more {
		display: none;
	}
	
	/** About Styling **/
	.about_who_ppl {
		grid-template-columns: repeat(1,auto);
		grid-template-rows: repeat(2,auto);
		padding-top: 7%;
		margin: 0 auto;
		margin-bottom: 1rem;
		border: 0;
	}
	
	.about_who_ppl img {
		max-width: 150px;
		max-height: 150px;
		min-width: 150px;
		border-radius: 50%;
		margin: 0 auto;
		margin-bottom: 2rem;
	}
	
	.tabs label {
		margin-bottom: 3rem;
		margin: 0;
		display: inline;
		font-size: 2.7vw;
		padding: 3vw 1px;
		margin-left: 1vw;
		margin-right: 1vw;
	}
	
	.about_p_text_container {
		margin: 0 auto;
		padding: 20px;
	}
	
	/** Key Practices Landing and Practices Pages **/
	/* .key_practices_container {
																												padding: 0 20px;
																											} */
	.select-box select {
		width: 100%;
	}
	
	.key_practices_button_container {
		display: none;
	}
	
	/* make select box appear in the mobile version  */
	.select-box #change-display {
		font-size: .75em;
	}
	
	.select-box-container {
		display: block;
		text-align: center;
		margin-bottom: 60px;
	}
	
	.collapsible-container {
		padding: 10px 0 40px;
	}
	
	.select-box {
		text-align: center;
	}
	
	.select-box select {
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCA0LjkgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQuOSAxMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6I2ZmZmZmZjt9DQo8L3N0eWxlPg0KPHRpdGxlPmFycm93czwvdGl0bGU+DQo8cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9IjEuNCw0LjcgMi41LDMuMiAzLjUsNC43ICIvPg0KPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIzLjUsNS4zIDIuNSw2LjggMS40LDUuMyAiLz4NCjwvc3ZnPg==)no-repeat 95% 50%;
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background-color: #7AA8BF;
		color: #ffffff;
	/* font-family: "Benton-Sans"; */
		font-weight: 700;
		height: 60px;
		width: 100%;
		border: 0;
	}
	
	.video-caption {
		width: 80%;
		padding: 0;
	}
	
	.videos {
		width: 80%;
	}
	
	.sidebar {
		margin: 0 2rem 2rem;
	}
	
	#btn-prev, #btn-next {
		display: none;
	}
	
	.video-card :nth-child(1) {
		order: 1;
	}
	
	.video-card :nth-child(2) {
		order: 2;
	}
	
	.collapsible-container {
		padding: 0;
	}
	
	.video-card {
		margin-bottom: 1rem;
	}
}

/*------- wide screen only ------*/
@media only screen and (min-width: 650px) {
	/**General Styling **/
	.masthead-container nav {
		text-align: right;
	}
	
	/** Home Styling **/
	.left-half .learn_more_left, .right-half .learn_more_right, .left-half h6, .right-half h6 {
		display: none;
	}
}

/* Ipad size / between mobile and widescreen */
@media screen and (max-width: 991px) and (min-width: 650px) {
	/* General Styling */
	.primary-nav-menu a {
		text-align: center;
	}
	
	.bus-sharing {
		margin-left: 20px;
	}
	
	/* Home Styling */
	.home_container {
		padding: 20px;
	}
	
	/*About Styling */
	.tabs label {
		margin-bottom: 3rem;
		font-size: 2vw;
		margin: 0 .5vw;
		width: fit-content;
	}
	
	.about_p_text_container {
		padding: 20px;
		margin: 0 auto;
		margin: 2rem;
	}
	
	/* Key Practices Styling */
	.key_practices_container, .sidebar {
		margin: 0 2rem;
	}
	
	/*make select box appear in ipad size and make button container disappear*/
	.key_practices_button_container {
		display: none;
	}
	
	.select-box #change-display {
		font-size: .75em;
	}
	
	.select-box-container {
		display: block;
		text-align: center;
		margin-bottom: 60px;
		margin-top: 4rem;
	}
	
	.collapsible-container {
		padding: 10px 0 40px;
	}
	
	.select-box {
		text-align: center;
	}
	
	.select-box select {
		background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCA0LjkgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQuOSAxMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6I2ZmZmZmZjt9DQo8L3N0eWxlPg0KPHRpdGxlPmFycm93czwvdGl0bGU+DQo8cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9IjEuNCw0LjcgMi41LDMuMiAzLjUsNC43ICIvPg0KPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIzLjUsNS4zIDIuNSw2LjggMS40LDUuMyAiLz4NCjwvc3ZnPg==)no-repeat 95% 50%;
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		appearance: none;
		background-color: #7AA8BF;
		color: #ffffff;
	/* font-family: "Benton-Sans"; */
		font-weight: 700;
		height: 60px;
		width: 100%;
		border: 0;
	}
}

@media screen and (max-width:714px) and (min-width:647px) {
	.select-box select {
		width: 100%;
	}
	
	.select-box #change-display {
		font-size: .75em;
	}
}

/*
@media screen and (max-width:1040px) and (min-width:992px) {
	.key_practices_container {
		margin-left: 1vw;
	}
	
	.sidebar {
		margin-right: 1vw;
	}
}

	
}
*/
/* 
@media screen and (max-width: 992px) {
	.key_practices_container {
		margin: 0 auto;
		margin-top: 2vh;
		max-width: 90%;
	}
	
	.widget {
		max-width: 80%;
		margin: 0 auto;
	}
} */