/* ==================== btns ====================  */
.btn, .btn:active, .btn:visited, .btn:focus, .btn:link, .btn:hover,
button.btn, button.btn:active, button.btn:visited, button.btn:focus, button.btn:link, button.btn:hover{
	display: inline-block;
	cursor: pointer;
	color: var(--text-color-white);
	font-weight: bold;
	text-align: center;
	border-radius: 7px;
	background-clip: padding-box;
	-webkit-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	border: none;
	font-family: var(--font-family);
	font-size: inherit;
}
.btn:hover{
	-webkit-transform:scale(1.1);
	-ms-transform:scale(1.1);
	transform:scale(1.1);
}

.btn-small, .btn-small:hover {
    height: 30px;
    line-height: 30px;
    padding: 0 13px;
}
.btn-medium, .btn-medium:hover {
	height: 44px;
	line-height: 44px;
	padding: 0 30px;
}
.btn-medium2, .btn-medium2:hover {
	height: auto;
	line-height: 23px;
	padding: 11px 33px 10px 33px;
}
.btn-large, .btn-large:active, .btn-large:visited, .btn-large:focus, .btn-large:link, .btn-large:hover {
	height: 58px;
	line-height: 58px;
	padding: 0 42px;
}
.btn-large2, .btn-large2:active, .btn-large2:visited, .btn-large2:focus, .btn-large2:link, .btn-large2:hover {
	height: 50px;
	line-height: 50px;
	padding: 0 15px;
}
.btn-large3, .btn-large3:active, .btn-large3:visited, .btn-large3:focus, .btn-large3:link, .btn-large3:hover {
	height: 56px;
	line-height: 56px;
	padding: 0 40px;
}
@media only screen and (max-width: 610px) {
	.btn-large, .btn-large:active, .btn-large:visited, .btn-large:focus, .btn-large:link, .btn-large:hover {
		padding: 0 30px;
	}
	.btn-large2, .btn-large2:active, .btn-large2:visited, .btn-large2:focus, .btn-large2:link, .btn-large2:hover {
		height: auto;
		line-height: normal;
		padding-top: 13px;
		padding-bottom: 13px;
		}
	.btn-medium, .btn-medium:hover {
		height: auto;
		line-height: 23px;
		padding: 11px 25px 10px 25px;
		}
}

.btn-orange, .btn-orange:hover {
	background-color: var(--btn-orange);
	-webkit-box-shadow: 0 6px 0 var(--btn-orange-shadow);
	box-shadow: 0 6px 0 var(--btn-orange-shadow);
}
.btn-orange.btn-large-border, .btn-orange.btn-large-border:hover {
	border: 1px solid var(--btn-orange-border);
}
.btn-blue, .btn-blue:hover {
	background-color: var(--btn-blue);
	-webkit-box-shadow: 0 6px 0 var(--btn-blue-shadow);
	box-shadow: 0 6px 0 var(--btn-blue-shadow);
}
.btn-sky-blue, .btn-sky-blue:hover {
	background-color: var(--btn-sky-blue);
	-webkit-box-shadow: 0 6px 0 var(--btn-sky-blue-shadow);
	box-shadow: 0 6px 0 var(--btn-sky-blue-shadow);
}
.btn-light-blue, .btn-light-blue:hover {
	background-color: var(--btn-light-blue);
	-webkit-box-shadow: 0 6px 0 var(--btn-light-blue-shadow);
	box-shadow: 0 6px 0 var(--btn-light-blue-shadow);
	color: var(--text-color-black) !important;
}
.btn-white, .btn-white:active, .btn-white:visited, .btn-white:focus, .btn-white:link, .btn-white:hover {
	background-color: var(--btn-white);
	-webkit-box-shadow: 0 6px 0 var(--btn-white-shadow);
	box-shadow: 0 6px 0 var(--btn-white-shadow);
	color: var(--text-color-black) !important;
}
.btn-magenta, .btn-magenta:hover {
	background-color: var(--btn-magenta);
	-webkit-box-shadow: 0 6px 0 var(--btn-magenta-shadow);
	box-shadow: 0 6px 0 var(--btn-magenta-shadow);
}
.btn-turquoise, .btn-turquoise:hover {
	background-color: var(--btn-turquoise);
	-webkit-box-shadow: 0 6px 0 var(--btn-turquoise-shadow);
	box-shadow: 0 6px 0 var(--btn-turquoise-shadow);
}
.btn-yellow, .btn-yellow:hover {
	background-color: var(--btn-yellow-shadow);
	-webkit-box-shadow: 0 6px 0 var(--btn-yellow-shadow);
	box-shadow: 0 6px 0 var(--btn-yellow-shadow);
	color: var(--text-color-black) !important;
}
.btn-transparent-white,
.btn-transparent-white:active,
.btn-transparent-white:visited,
.btn-transparent-white:focus,
.btn-transparent-white:link,
.btn-transparent-white:hover {
	background-color: transparent;
	-webkit-box-shadow: 0 0 0 var(--common-white);
	box-shadow: 0 0 0 var(--common-white);
	border: solid 1px var(--common-white);
	color: var(--common-white);
	font-weight: normal;
}
.btn-transparent-purple,
.btn-transparent-purple:active,
.btn-transparent-purple:visited,
.btn-transparent-purple:focus,
.btn-transparent-purple:link,
.btn-transparent-purple:hover {
	background-color: transparent;
	-webkit-box-shadow: 0 0 0 var(--border-about-purple);
	box-shadow: 0 0 0 var(--border-about-purple);
	border: solid 1px var(--border-about-purple);
	color: var(--border-about-purple);
	font-weight: normal;
}


/* /==================== btns ====================  */