/* ##### BTN ##### */
.btn, .html-editor .btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 10px 30px;
	height: 45px;
	min-height: 45px;
	font-size: 25px;
	line-height: normal;
	text-align: center;
	font-weight: 500;
	color: var(--color-black);
	background-color: var(--color-primary);
	background-size: 200%;
	background-position: 100% 0;
	border: 2px solid var(--color-primary);
	border-radius: 40px;
	transition: all 0.4s;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	outline:0 !important;
	text-decoration: none !important;
	max-width: 100%;
}

.btn:hover, .btn:focus{
    background:var(--color-white)
}
/* ##### BTN V2 ##### */
.btn.v2 {box-shadow: none !important; border-radius: 0 !important;}
.btn.v2:hover {background-image: none !important;}

/* ##### BTN BTN-PRIMARY ##### */
.btn.btn-primary {background-color: var(--color-primary); color:var(--color-default); border-color:var(--color-primary);}
.btn.btn-primary:not(.not-hover):not(.bx-tag):hover, .btn.active.btn-primary, .btn.btn-primary:focus{color: var(--color-default);}


/* ##### BTN BTN-DEFAULT ##### */
.btn.btn-default {background-color: var(--color-gray); background-image: linear-gradient(90deg, var(--color-white) 45%, var(--color-gray) 50%); color:var(--color-white); border-color:var(--color-gray);}
.btn.btn-default:not(.not-hover):hover, .btn.active.btn-default, .btn.btn-default:focus{color: var(--color-gray);}

/* ##### BTN BTN-WHITE ##### */
.btn.btn-white {background-color: var(--color-white); color:var(--color-default); border-color:var(--color-white);}
.btn.btn-white:hover, .btn.active.btn-white, .btn.btn-white:focus {background-color: var(--color-white);  border-color:var(--color-primary);}


/* ##### BTN BTN-GREEN ##### */
.btn.btn-green {background-color:var(--color-green); color: var(--color-black); border-color:var(--color-green);}
.btn.btn-green:not(.not-hover):hover, .btn.active.btn-green, .btn.btn-green:focus {border-color:var(--color-primary); color:var(--color-black); background: var(--color-white)}

/* ##### BTN BTN-OUTLINE ##### */
.btn.btn-outline {background-color:transparent; color:var(--color-default); border-color:var(--color-primary);}
.btn.btn-outline:hover:not(.bx-tag), .btn.active.btn-outline:not(.bx-tag), .btn.btn-outline:focus:not(.bx-tag) { color:var(--color-default); background:var(--color-white); border-color:var(--color-primary);}

/* ##### BTN BTN-OUTLINE2 ##### */
.btn.btn-outline2 {background-color:transparent; color:var(--color-default); border-color:var(--color-default);}
.btn.btn-outline2:hover:not(.bx-tag), .btn.active.btn-outline2:not(.bx-tag), .btn.btn-outline2:focus:not(.bx-tag) { color:var(--color-default); background:var(--color-white); border-color:var(--color-primary)}

/* ##### BTN BTN-LINK ##### */
.btn.btn-link {background-color:transparent; background-image: none; border-color: transparent; box-shadow: none; color:var(--color-default);}
.btn.btn-link:hover, .btn.active.btn-link, .btn.btn-link:focus {color: var(--color-primary);}

.bx-tag:hover, .bx-tag:focus{opacity:.6 !important;}
/* ##### BTN BR-3X ##### */
.btn.br-3x {
	border-width: 3px;
	line-height: 36px;
}

/* ##### BTN BR-5X ##### */
.btn.br-5x {
	border-width: 5px;
	line-height: 32px;
}

/* ##### BTN SMALL & BTN-SM ##### */
.btn.small, .btn.btn-sm {
	height:35px;
	min-height:35px;
	font-size: 16px;
	padding: 5px 15px;
}

/* ##### BTN SMALL2 & BTN-XS ##### */
.btn.small2, .btn.btn-xs {
	height:30px;
	min-height:30px;
	font-size: 12px;
	padding: 5px 5px;
}

/* ##### BTN BIG & BTN-LG ##### */
.btn.big, .btn.btn-lg {
	height:50px;
	min-height:50px;
	font-size: 20px;
}

/* ##### BTN BIG2 & BTN-LG ##### */
.btn.big2, .btn.btn-xl {
	height:70px;
	min-height:70px;
	font-size:25px;
	border-radius:60px
}

/* ##### BTN DISABLED ##### */
.btn.btn-disabled, .btn[disabled] {
	opacity: 0.4 !important;
}

/* ##### BTN BTN-MULTI-LINED ##### */
.btn.btn-multi-lined {
	white-space: normal;
	line-height: normal;
	height: auto;
}

.blog-tags-filter .btn.active:hover{
	opacity: .7 !important;
	background-color: var(--color-primary) !important;
	color:var(--color-default) !important;
}

@media all and (max-width: 991px) {
    .btn, .html-editor .btn {font-size:16px; padding-left:15px; padding-right: 15px; height: 32px; min-height: 32px;}
	.btn.big2, .btn.btn-xl, .btn-md {font-size:16px; height: 32px; min-height: 32px}
}

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
	.btn {
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		-o-user-select: none;
		user-select: none;
	}
}

