/* Button Styling (buttons appear in callouts) */

/* Button - base */
.hca_button, .button-link {
	display: inline-block;
	font-family: 'VarelaRound', sans-serif;
	line-height: 1.47;
	color: #ffffff;
	background-color: #333333;
	border: 1px solid #c6c7c9;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	padding: .8em 1em; /* padding is less top and bottom to allow the extra vertical space from line-height  */
}
.hca_button a ,
.button-link a,
.hca_button a:active,
.button-link:active,
.hca_button a:hover,
.button-link:hover {
	color: #ffffff;
}

.hca_button:after, .button-link:after {
	content: '';
	background: #fde17c url(../images/chevron-right.svg) no-repeat 50% 50%;
	background-size: 20px 20px;
    width: 25px;
    height: 25px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
	display: inline-block;
	margin-left: 15px;
	margin-bottom: -0.4em;
}

/* buttons in main content div (should probably change to be more specific when we have callout block info) */
.button-body-alpha {
	font-family: 'VarelaRound', sans-serif;
	line-height: 1.47;
	color: #ffffff;
	background-color: #333333;
	border: 1px solid #c6c7c9;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	padding: .8em 1em; /* padding is less top and bottom to allow the extra vertical space from line-height  */
	margin: 20px 0;
	display: inline-block;
}
.button-body-alpha:after {
	content: '';
	background: #fde17c url(../images/chevron-right.svg) no-repeat 50% 50%;
	background-size: 20px 20px;
    width: 25px;
    height: 25px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
	display: inline-block;
	margin-left: 15px;
	margin-bottom: -0.4em;
}

.button-body-beta {
	font-family: 'VarelaRound', sans-serif;
	line-height: 1.47;
	color: #ffffff;
	background-color: #8cc63f;
	text-shadow: 0 1px 5px rgba(0,0,0,0.5);
	box-shadow: inset 0 -3px 0 #77a835;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	padding: .8em 1em; /* padding is less top and bottom to allow the extra vertical space from line-height  */
	margin: 20px 0;
	display: inline-block;
}
.button-body-beta:after {
	content: '';
	background: #ffffff url(../images/chevron-right-green.svg) no-repeat 50% 50%;
	background-size: 20px 20px;
    width: 25px;
    height: 25px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
	display: inline-block;
	margin-left: 15px;
	margin-bottom: -0.4em;
}

/* used for expanding menus */
button.expand {
	background: url(../images/minus.svg) no-repeat;
	background-size: 15px 15px;
	background-position: center;
	width: 50px;
	height: 50px!important;
	background-color: transparent!important;
	border: 0;
}
button.expand.collapsed {
	background: url(../images/plus.svg) no-repeat;
	background-size: 15px 15px;
	background-position: center;
}
button.expand:focus {
	outline: none;
}