/* --------------------------------------------------------------- */
/* ----------------------------- BUTTON -------------------------- */
/* --------------------------------------------------------------- */

.btn-row {
	position:relative;
}
.btn-group {
	position:relative;
	display: flex;
	flex-wrap: wrap;
}

.btn-row.w-full,
.btn-group.full-width,
.btn-group.w-full {
	width:100% !important;
}
.btn-group > .default-btn + .default-btn {
	margin-top:10px;
}

/* btn inline */
.btn-group.inline {
	flex-wrap: wrap;
}
.btn-group.inline > .default-btn + .default-btn {
	margin-top:0;
	margin-left:15px;
}
.btn-group.inline > .default-btn.shadow + .default-btn.shadow {
	margin-left:15px;
}
.btn-group-connect.inline > .default-btn + .default-btn {
	margin-left:0 !important;
}

/* position btn */ 
.btn-group.center,
.btn-underline-group.center {
	justify-content: center;	
}
.btn-group.left,
.btn-underline-group.left {
	justify-content: flex-start;	
}
.btn-group.right,
.btn-underline-group.right {
    justify-content: flex-end;	
}

.btn-group.has-label {
	line-height:30px;
}



/* --- default btn --- */

.default-btn {
	position:relative;
	display:block;
	height:50px;
	width:auto;
	border-radius:5px;
	min-width:200px;
	max-width:100%;	
	font-size:15px;
	line-height:50px;
	font-weight:400;
	letter-spacing:0;
	text-align:center;
	margin:0;
	padding:0 30px;
	background:none;
	outline:none !important;
	cursor:pointer !important;
	/*overflow:hidden !important;*/
	box-shadow:none !important;
}
.default-btn.inline {
	display: inline-block;
}
.default-btn.disable {
	cursor: no-drop !important;
}
.default-btn.hiden {
	display: none !important;
	cursor: no-drop !important;
}
.default-btn.clear-btn {
	padding:0;
	line-height:inherit !important;
	height:auto !important;
	width:auto !important;
	min-height:0 !important;
	min-width:0 !important;
}
.zero-radius {
	border-radius:0 !important;
}

.default-btn.extra-min-radius {
	border-radius:5px !important;
}
.default-btn.left-extra-min-radius {
	border-top-left-radius:5px !important;
	border-bottom-left-radius:5px !important;
}
.default-btn.right-extra-min-radius {
	border-top-right-radius:5px !important;
	border-bottom-right-radius:5px !important;
}

.default-btn.min-radius {
	border-radius:10px !important;
}
.default-btn.left-min-radius {
	border-top-left-radius:10px !important;
	border-bottom-left-radius:10px !important;
}
.default-btn.right-min-radius {
	border-top-right-radius:10px !important;
	border-bottom-right-radius:10px !important;
}

.default-btn.full-radius {
	border-radius:25px !important;
}

.default-btn,
.default-btn:hover {
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}
.default-btn span {
	position:relative;
}
.default-btn .icon {
	font-size:85%;
}
.default-btn .icon[ class*="olaf-icon-" ] {
	/* font-size:130%; */
	line-height: 0;
    /* margin-top: 3px; */
}
.default-btn .icon[ class*="olaf-icon-" ].font-size-extra-small,
.btn-item .icon[ class*="olaf-icon-" ].font-size-extra-small {
	font-size:50% !important;
}
.default-btn .icon[ class*="olaf-icon-" ].font-size-small,
.btn-item .icon[ class*="olaf-icon-" ].font-size-small {
	font-size:75% !important;
}
.default-btn .icon[ class*="olaf-icon-" ].font-size-medium,
.btn-item .icon[ class*="olaf-icon-" ].font-size-medium {
	font-size:115% !important;
}
.default-btn .icon[ class*="olaf-icon-" ].font-size-large,
.btn-item .icon[ class*="olaf-icon-" ].font-size-large {
	font-size:130% !important;
}

.default-btn .icon[ class*="bi-" ].font-size-extra-small,
.btn-item .icon[ class*="bi-" ].font-size-extra-small {
	font-size:50% !important;
}
.default-btn .icon[ class*="bi-" ].font-size-small,
.btn-item .icon[ class*="bi-" ].font-size-small {
	font-size:75% !important;
}
.default-btn .icon[ class*="bi-" ].font-size-medium,
.btn-item .icon[ class*="bi-" ].font-size-medium {
	font-size:115% !important;
}
.default-btn .icon[ class*="bi-" ].font-size-large,
.btn-item .icon[ class*="bi-" ].font-size-large {
	font-size:130% !important;
}

.default-btn .icon + .text {
	margin-left:10px;
}
.default-btn .text + .icon {
	margin-left:10px;
}

/* clear */
.default-btn.clear {
	border: none !important;
	border-radius: 0 !important;
	background: none !important;
	margin: 0;
	padding: 0;
	min-width: 0 !important;
	width: auto !important;
	height: auto !important;
	font-size:  inherit !important;
	line-height: inherit !important;
}
.default-btn.clear .icon[ class*="olaf-icon-" ] {
	font-size: inherit;
}
.default-btn.clear .icon + .text,
.default-btn.clear .text + .icon {
	margin-left:5px;
}
/* .default-btn.clear .icon[ class*="olaf-icon-" ] {
    margin-top: 2px;
} */

.default-btn.w-full-flex {
	min-width: auto !important;
	flex: 1 0 0 !important;
}
.default-btn.w-full {
	flex: none;
	width: 100%;
	margin: 0;
}
/* .default-btn+.default-btn.w-full {
	margin-top: 20px;
} */

/* fix arrow small */

.default-btn.fix-arrow-small {
	display: flex;
	align-items: center;
}
.default-btn.fix-arrow-small .icon[class*="olaf-icon-chevron-"] {
    font-size: 10px !important;
    /* margin-top: 0 !important; */
}

/* icon size */
/* .default-btn .icon[ class*="olaf-icon-" ].small {
	font-size:50% !important;
}
.default-btn .icon[ class*="olaf-icon-" ].medium {
	font-size:70% !important;
}
.default-btn .icon[ class*="olaf-icon-" ].large {
	font-size:80% !important;
} */

/* btn width */
.default-btn.w-auto {
	width: auto !important;
	min-width: auto !important;
}
.btn-group.inline.w-full .default-btn {
	flex: 1 0 0%;
	min-width: 0 !important;
	padding: 0 15px;
}
.btn-group.w-full .default-btn,
.default-btn.w-full {
	width: 100%;
}
.default-btn.btn-square {
	width: 50px !important;
	padding: 0 !important;
	min-width: 0 !important;
	flex: none !important;
}

/* btn mini */
.default-btn.btn-small {
    height: 30px;
    line-height: 29px;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.5px;
    min-width: 0;
    width: auto;
    color: rgba(50,50,50,1);
    background-color: rgba(50,50,50,0);
    border-radius: 15px;
    padding: 1px 20px 0 20px; 
}
.default-btn.btn-small.extra-min-radius {
	border-radius:3px !important;
}
.default-btn.btn-small.min-radius {
	border-radius:5px !important;
}

/* opacity */
.default-btn.opacity,
.default-btn.opacity-icon .icon {
	opacity: 0.4;
}
.default-btn.opacity .icon {
	opacity: 0.7;
}
.default-btn.opacity:hover,
.default-btn.opacity-icon:hover .icon {
	opacity: 1;
}
.default-btn.opacity.disable,
.default-btn.opacity-icon.disable .icon {
	opacity: 0.4 !important;
}


/* --- btn color --- */

/* btn outline */

.btn-outline {
	border-style:solid;
	border-width:1px;
	background:none;
	line-height:48px;
}

/* --- btn icon --- */

.default-btn.btn-icon {
	padding: 0 !important;
	display: flex!important;
	flex-wrap: nowrap!important;
	overflow: hidden;
}
.default-btn.btn-icon > [ class*="col-" ] {
	position:relative;
	height:100%;
	z-index:2;
}
.default-btn.btn-icon > .col-icon {
	width:45px;
}
.default-btn.btn-icon > .col-icon > .icon {
	position:relative;
	display:block;
	width:100%;
	height:100%;
	/*border-radius:4px;*/
	font-size:23px;
	line-height:45px;
	text-align:center;
	top:0;
	/*top:50%;
	margin-top:-22.5px;
	margin-left:6.5px;*/
	overflow:hidden !important;
}
.default-btn.btn-icon > .col-icon > .icon > i {
	display:block;
	line-height:20px;
	top:50%;
	margin-top:-10px;
}
.default-btn.btn-icon > .col-text {
	width:calc( 100% - 45px );
	padding:0 20px;
	line-height:0;	
}
.default-btn.btn-icon > .col-text > .title {
	display:none !important;
}
.default-btn.btn-icon > .col-text > .text {
	position:relative;
	font-size: 14px;
    line-height: 20px;
	font-weight:400;
	letter-spacing:0.3px;
	text-align:center;
	top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.default-btn.btn-icon.pd > .col-icon {
    padding: 5px !important;
}
.default-btn.btn-icon.pd > .col-icon > .icon {
    border-radius: 5px;
    width: 40px;
}
.default-btn.btn-icon.pd > .col-icon > .icon > i {
    font-size:18px !important;
}

.default-btn.btn-icon > .col-icon.border-right:before {
	position: absolute;
	content: '';
	height: 30px;
	top: 50%;
	right: 0;
	margin-top: -15px;
	border-right-width: 1px;
	border-right-style: solid;
	opacity: 0.1;
}
.default-btn.btn-icon > .col-icon.bg {
	background-color: rgba(0,0,0,0.05);
}

/* --- btn login --- */
.btn-login-with-facebook .col-icon,
.btn-login-with-google .col-icon,
.btn-login-with-line .col-icon {
	display: flex;
	align-items: center;
	justify-content: center;
}
.btn-login-with-facebook .col-icon,
.btn-login-with-line .col-icon {
	background-color: rgba(0,0,0,0.1);
}
.btn-login-with-google .col-text {
	background-color: rgba(0,0,0,0.03);
}
.btn-login-with-facebook .icon,
.btn-login-with-google .icon,
.btn-login-with-line .icon {
	position: relative;
	background: none !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
}
.btn-login-with-facebook .icon,
.btn-login-with-google .icon {
	width: 20px !important;
	height: 20px !important;
}
.btn-login-with-line .icon {
	width: 23px !important;
	height: 23px !important;
}

.btn-login-with-facebook .icon {
	background-image: url(../../images/sites/member/facebook.png) !important;
}
.btn-login-with-google .icon {
	background-image: url(../../images/sites/member/google.png) !important;
}
.btn-login-with-line .icon {
	background-image: url(../../images/sites/member/line.png) !important;
}

/* --- btn group connect --- */

.btn-group-connect > .default-btn:first-child {
	border-top-right-radius:0 !important;
	border-bottom-right-radius:0 !important;
}
.btn-group-connect > .default-btn:last-child {
	border-top-left-radius:0 !important;
	border-bottom-left-radius:0 !important;
}

/* --- btn underline --- */

.btn-underline-group {
	position:relative;
	display: flex;
	/* display:table;
	clear:both; */
}
.btn-underline-group.spacing-10 > .btn-underline + .btn-underline {
	margin-left:10px;
}
.btn-underline-group.spacing-15 > .btn-underline + .btn-underline {
	margin-left:15px;
}
.btn-underline-group.spacing-20 > .btn-underline + .btn-underline {
	margin-left:20px;
}
.btn-underline-group.spacing-25 > .btn-underline + .btn-underline {
	margin-left:25px;
}
.btn-underline-group.spacing-30 > .btn-underline + .btn-underline {
	margin-left:30px;
}
.btn-underline {
	position:relative;
	cursor:pointer;
}
.btn-underline.text-upper {
	font-size:90%;
	font-weight:400;
	letter-spacing:1px;
}
a.btn-underline {
	display:inline-block;
}
.btn-underline.font-bold {
	letter-spacing:-0.15px;
}
button.btn-underline {
	background: none !important;
	border:none !important;
	margin:0;
	padding:0;
}
.under-hover:before,
.multi-under-hover:before,
.multi-under-hover:after {
	position:absolute;
	content:"";
	bottom:1px;
	left:0;
	height:1px;
	overflow:hidden;
}
.under-hover:before,
.multi-under-hover:before {
	width:0;
}
.under-hover.show-underline:before,
.under-hover:hover:before,
.multi-under-hover:hover:before,
.multi-under-hover:after,
.under-hover.active:before {
	width:100%;
}
.under-hover:before,
.multi-under-hover:before,
.text-color-black .under-hover:before, .under-hover.text-color-black:before,
.text-color-black .multi-under-hover:before, .multi-under-hover.text-color-black:before {
	background-color:rgba(var(--custom-rgb-color-black),1);
}
.multi-under-hover:after,
.text-color-black .multi-under-hover:after, .multi-under-hover.text-color-black:after {
	background-color:rgba(var(--custom-rgb-color-black),0.1);
}
.text-color-red .multi-under-hover:before, .multi-under-hover.text-color-red:before {
	background-color:rgba(225,6,19,1);
}

.under-hover,
.text-color-black .under-hover, .under-hover.text-color-black,
.text-color-black .multi-under-hover, .multi-under-hover.text-color-black {
	color:rgba(12,12,12,1) !important;
}
.text-color-white .under-hover:before, .under-hover.text-color-white:before,
.text-color-white .multi-under-hover:before, .multi-under-hover.text-color-white:before {
	background-color:rgba(var(--custom-rgb-color-white),1);
}
.text-color-white .multi-under-hover:after, .multi-under-hover.text-color-white:after {
	background-color:rgba(var(--custom-rgb-color-white),0.3);
}
.text-color-white .under-hover, .under-hover.text-color-white,
.text-color-white .multi-under-hover, .multi-under-hover.text-color-white {
	color:rgba(var(--custom-rgb-color-white),1) !important;
}
.under-hover:before,
.under-hover:hover:before,
.multi-under-hover:before,
.multi-under-hover:hover:before,
.multi-under-hover:after {
	transition:width 0.5s ease;
	-webkit-transition:width 0.5s ease;
	-moz-transition:width 0.5s ease;
}

/* label btn */
.btn-underline-group.has-label {}
.btn-underline-group.has-label > .label-btn {
	position:relative;
	font-weight:700;
	display:inline-block;
	float:left;
}
.btn-underline-group.has-label > .label-btn.has-colon {
	padding-right:20px;
	margin-right:20px;
}
.btn-underline-group.has-label > .label-btn.has-colon:before {
	position:absolute;
	right:-2px;
	content:":";
}

/* --- btn view more --- */

.view-more-btn {
	position: relative;
	display: inline;
	cursor: pointer;
}
button.view-more-btn {
	padding: 0 !important;
	background: none !important;
}
.view-more-btn,
.view-more-btn i.animate-opacity {
	transition: color 0.3s ease;
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-ms-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
}
.view-more-btn .text+i {
	margin-left: 5px;
}
.view-more-btn i+.text {
	margin-left: 5px;
}
.view-more-btn i {
	font-size: 10px;
	line-height: 0;
}
.view-more-btn i.animate-opacity {
	font-size: 70%;
	opacity: 0.5;
}
.view-more-btn:hover i.animate-opacity {
	opacity: 1;
}
.view-more-btn.text-color-gray {
	color: rgba(128,128,128,1);
}
.view-more-btn.text-color-gray:hover {
    color: rgba(0,0,0,1);
}



/* --- btn items --- */

.btn-item-section,
.btn-item-row {
	position: relative;
}
.btn-item-group,
ul.btn-item-group,
ul.btn-item-group>li {
	position: relative;
	padding: 0;
	margin: 0;
}
ul.btn-item-group,
ul.btn-item-group>li {
	list-style: none !important;
}
.btn-item-group {
	display: flex;
	flex-wrap: wrap;
	margin-left: -3px !important;
	margin-right: -3px !important;
}
.btn-item-group.center {
	justify-content: center;
}
.btn-item-group.splide-list {
	flex-wrap: inherit;
}
.btn-item {
	position: relative;
	display: block;
	outline: none !important;
	height: 35px;
	border-radius: 5px;
	padding: 0 15px;
	margin: 3px;
	background: none;
	background: none;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
.btn-item.inline {
	display: inline-block;
}
.btn-item.clear {
	padding: 0 !important;
	margin: 0 !important;
	height:  auto !important;
	border-radius: 0 !important;
}
.btn-item.w-auto {
	display: inline-block;
	width: auto !important;
	min-width: auto !important;
}
.btn-item .text+.icon,
.btn-item .icon+.text {
	margin-left: 7px;
}
.btn-item .icon[class*="olaf-icon-chevron-"] {
	font-size: 10px;
}
.btn-item.animate-icon-opacity .icon {
	opacity: 0.2;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}
.btn-item.animate-icon-opacity:hover .icon,
.btn-item.animate-icon-opacity.active .icon {
	opacity: 1;
}

/* btn item - circle */
.btn-item.btn-icon-circle {
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 100%;
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
}
.btn-item.btn-icon-circle>.icon {}

/* dividing line */
ul.btn-item-group.dividing-line>li {
	position: relative;
}
ul.btn-item-group.dividing-line>li+li {
	margin-left:10px;
	padding-left: 10px;
}
ul.btn-item-group.dividing-line>li+li:before {
	position: absolute;
	content: "";
	height: 20px;
	left: 0;
	top: 50%;
	margin-top: -10px;
	border-left: 1px solid rgba(var(--custom-rgb-color-black),0.5);
}

/* btn item - outline */

.btn-item.outline,
.btn-item.outline-transparent,
.btn-item.fill {
	border-width: 1px;
	border-style: solid;
	line-height: 33px;
}

/* outline primary */
.btn-item.outline.color-primary,
.btn-item.outline.color-primary.none-hover,
.btn-item.outline.color-primary.none-hover:hover {
	border-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-primary),1);	
}
.btn-item.outline.color-primary:hover {
	border-color:rgba(var(--custom-rgb-color-primary),0.3);
}

/* outline primary - hover to fill */
.btn-item.outline.color-primary.hover-fill {
	background-color:rgba(var(--custom-rgb-color-primary),0);
	border-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-primary),1);	
}
.btn-item.outline.color-primary.hover-fill:hover {
	background-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-white),1);	
}
.btn-item.outline.color-primary.hover-fill-transparent:hover,
.btn-item.outline.color-primary.hover-fill-transparent.active {
	background-color:rgba(var(--custom-rgb-color-primary),0.15);
	border-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-primary),1);	
}

/* outline transparent - primary */
.btn-item.outline-transparent.color-primary {
	border-color:rgba(var(--custom-rgb-color-primary),0.5);
	color:rgba(var(--custom-rgb-color-primary),1);	
}
.btn-item.outline-transparent.color-primary.hover-fill {
	background-color:rgba(var(--custom-rgb-color-primary),0);
	border-color:rgba(var(--custom-rgb-color-primary),0.5);
	color:rgba(var(--custom-rgb-color-primary),1);	
}
.btn-item.outline-transparent.color-primary.hover-fill:hover {
	background-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-white),1);	
}
.btn-item.outline-transparent.color-primary.hover-fill-transparent:hover,
.btn-item.outline-transparent.color-primary.hover-fill-transparent.active {
	background-color:rgba(var(--custom-rgb-color-primary),0.15);
	border-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-primary),1);	
}

/* outline black */
.btn-item.outline.color-black,
.btn-item.outline.color-black.none-hover,
.btn-item.outline.color-black.none-hover:hover {
	border-color:rgba(0,0,0,1);
	color:rgba(0,0,0,1);	
}
.btn-item.outline.color-black:hover {
	border-color:rgba(var(--custom-rgb-color-gray),1);
}

/* outline black - hover to fill */
.btn-item.outline.color-black.hover-fill {
	background-color:rgba(0,0,0,0);
	border-color:rgba(0,0,0,1);
	color:rgba(0,0,0,1);	
}
.btn-item.outline.color-black.hover-fill:hover {
	background-color:rgba(0,0,0,1);
	color:rgba(var(--custom-rgb-color-white),1);	
}

/* outline gray */
.btn-item.outline.color-gray,
.btn-item.outline.color-gray.none-hover,
.btn-item.outline.color-gray.none-hover:hover {
	border-color:var(--custom-color-dark-gray);
	color:var(--custom-text-color-black);	
}
.btn-item.outline.color-gray:hover {
	border-color:var(--custom-color-black);
}

/* outline light gray */
.btn-item.outline.color-gray-light,
.btn-item.outline.color-gray-light.none-hover,
.btn-item.outline.color-gray-light.none-hover:hover {
	border-color:var(--custom-color-gray);
	color:var(--custom-text-color-black);	
}
.btn-item.outline.color-gray-light:hover {
	border-color:var(--custom-color-black);
}

/* outline gray - hover to fill */
.btn-item.outline.color-gray.hover-fill {
	background-color:rgba(var(--custom-rgb-color-gray),0);
	border-color:rgba(var(--custom-rgb-color-gray),1);
	color:rgba(0,0,0,1);		
}
.btn-item.outline.color-gray.hover-fill:hover {
	background-color:rgba(var(--custom-rgb-color-gray),1);
}

/* outline white */
.btn-item.outline.color-white,
.btn-item.outline.color-white.none-hover,
.btn-item.outline.color-white.none-hover:hover {
	border-color:rgba(var(--custom-rgb-color-white),1);
	color:rgba(var(--custom-rgb-color-white),1);	
}
.btn-item.outline.color-white:hover {
	border-color:rgba(var(--custom-rgb-color-gray),1);
	color:rgba(0,0,0,1);
}

/* outline white  - hover to fill */
.btn-item.outline.color-white.hover-fill {
	background-color:rgba(var(--custom-rgb-color-white),0);
	border-color:rgba(var(--custom-rgb-color-white),1);
	color:rgba(var(--custom-rgb-color-white),1);	
}
.btn-item.outline.color-white.hover-fill:hover {
	background-color:rgba(var(--custom-rgb-color-white),1) !important;
	color:rgba(0,0,0,1) !important;
}

/* btn item - fill */
/* .btn-item.fill {	
	line-height: 35px;
} */

/* fill black */
.btn-item.fill.color-black,
.btn-item.fill.color-black.none-hover,
.btn-item.fill.color-black.none-hover:hover {
	border-color:rgba(var(--custom-rgb-color-black),1);
	background-color:rgba(var(--custom-rgb-color-black),1);
	color:rgba(var(--custom-rgb-color-white),1);	
}
.btn-item.fill.color-black:hover {
	border-color:rgba(var(--custom-rgb-color-black),1);
	background-color:rgba(var(--custom-rgb-color-black),1);
}

/* fill white */
.btn-item.fill.color-white,
.btn-item.fill.color-white.none-hover,
.btn-item.fill.color-white.none-hover:hover {
	border-color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(var(--custom-rgb-color-white),1);
	color:rgba(var(--custom-rgb-color-black),1);	
}
.btn-item.fill.color-white:hover {
	border-color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(var(--custom-rgb-color-white),1);
}

/* ============================================================================================== */
/* ============================================ COLOR FILL ====================================== */
/* ============================================================================================== */

/* --------------------------------------------------------------- */
/* --------------------------- primary --------------------------- */
/* --------------------------------------------------------------- */

/* fill primary */
.fill-color-primary,
.fill-color-primary.none-hover,
.fill-color-primary.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-primary),1);
	border-color: rgba(var(--custom-rgb-color-primary),1);
	color: rgba(var(--custom-rgb-color-base-on-primary),1);
}
.fill-color-primary:hover {
	background-color: rgba(var(--custom-rgb-color-hover-primary),1);
	border-color: rgba(var(--custom-rgb-color-hover-primary),1);
	color: rgba(var(--custom-rgb-color-base-on-primary),1);
}

/* fill primary - transparent */
.fill-color-primary.fill-transparent,
.fill-color-primary.fill-transparent.none-hover,
.fill-color-primary.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-primary),0.15);
	border-color: rgba(var(--custom-rgb-color-primary),0);
	color: rgba(var(--custom-rgb-color-primary),1);
}
.fill-color-primary.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-primary),0.3);
	border-color: rgba(var(--custom-rgb-color-base-on-primary),0);
	color: rgba(var(--custom-rgb-color-primary),1);
}

/* --------------------------------------------------------------- */
/* ------------------------- secondary 1 ------------------------- */
/* --------------------------------------------------------------- */

/* fill secondary 1 */
.fill-color-secondary-1,
.fill-color-secondary-1.none-hover,
.fill-color-secondary-1.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-1),1);
	border-color: rgba(var(--custom-rgb-color-secondary-1),0);
	color: rgba(var(--custom-rgb-color-white),1);
}
.fill-color-secondary-1:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-1),1);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-1),0);
	color: rgba(var(--custom-rgb-color-white),1);
}

/* fill secondary 1 - transparent*/
.fill-color-secondary-1.fill-transparent,
.fill-color-secondary-1.fill-transparent.none-hover,
.fill-color-secondary-1.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-1),0.1);
	border-color: rgba(var(--custom-rgb-color-secondary-1),0);
	color: rgba(var(--custom-rgb-color-secondary-1),1);
}
.fill-color-secondary-1.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-1),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-1),0);
	color: rgba(var(--custom-rgb-color-secondary-1),1);
}

/* --------------------------------------------------------------- */
/* ------------------------- secondary 2 ------------------------- */
/* --------------------------------------------------------------- */

/* fill secondary 2 */

.fill-color-secondary-2,
.fill-color-secondary-2.none-hover,
.fill-color-secondary-2.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-2),1);
	border-color: rgba(var(--custom-rgb-color-secondary-2),0);
	color: rgba(var(--custom-rgb-color-white),1);
}
.fill-color-secondary-2:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-2),1);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-2),0);
	color: rgba(var(--custom-rgb-color-white),1);
}

/* fill secondary 2 - transparent*/

.fill-color-secondary-2.fill-transparent,
.fill-color-secondary-2.fill-transparent.none-hover,
.fill-color-secondary-2.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-2),0.1);
	border-color: rgba(var(--custom-rgb-color-secondary-2),0);
	color: rgba(var(--custom-rgb-color-secondary-2),1);
}
.fill-color-secondary-2.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-2),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-2),0);
	color: rgba(var(--custom-rgb-color-secondary-2),1);
}

[class*="outline-"].hover-fill-color-secondary-2:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-2),0.1);
	border-color: rgba(var(--custom-rgb-color-secondary-2),1);
	color: rgba(var(--custom-rgb-color-secondary-2),1);
}

/* --------------------------------------------------------------- */
/* ------------------------- secondary 3 ------------------------- */
/* --------------------------------------------------------------- */

/* fill secondary 3 */
.fill-color-secondary-3,
.fill-color-secondary-3.none-hover,
.fill-color-secondary-3.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-3),1);
	border-color: rgba(var(--custom-rgb-color-secondary-3),0);
	color: rgba(var(--custom-rgb-color-white),1);
}
.fill-color-secondary-3:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-3),1);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-3),0);
	color: rgba(var(--custom-rgb-color-white),1);
}

/* fill secondary 3 - transparent*/
.fill-color-secondary-3.fill-transparent,
.fill-color-secondary-3.fill-transparent.none-hover,
.fill-color-secondary-3.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-secondary-3),0.1);
	border-color: rgba(var(--custom-rgb-color-secondary-3),0);
	color: rgba(var(--custom-rgb-color-secondary-3),1);
}
.fill-color-secondary-3.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-secondary-3),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-secondary-3),0);
	color: rgba(var(--custom-rgb-color-secondary-3),1);
}

/* --------------------------------------------------------------- */
/* ---------------------------- black ---------------------------- */
/* --------------------------------------------------------------- */

/* fill black */
.fill-color-black,
.fill-color-black.none-hover,
.fill-color-black.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-black),1);
	border-color: rgba(var(--custom-rgb-color-black),1);
	color: rgba(var(--custom-rgb-color-base-on-black),1);
}
.fill-color-black:hover {
	background-color: rgba(var(--custom-rgb-color-hover-black),1);
	border-color: rgba(var(--custom-rgb-color-hover-black),1);
	color: rgba(var(--custom-rgb-color-base-on-black),1);
}

/* fill black - transparent */
.fill-color-black.fill-transparent,
.fill-color-black.fill-transparent.none-hover,
.fill-color-black.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-black),0.1);
	border-color: rgba(var(--custom-rgb-color-black),0);
	color: rgba(var(--custom-rgb-color-black),1);
}
.fill-color-black.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-black),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-black),0);
	color: rgba(var(--custom-rgb-color-black),1);
}

/* --------------------------------------------------------------- */
/* ----------------------------- gray ---------------------------- */
/* --------------------------------------------------------------- */

/* fill gray */
.fill-color-gray,
.fill-color-gray.none-hover,
.fill-color-gray.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray),1);
	border-color: rgba(var(--custom-rgb-color-gray),1);
	color: rgba(var(--custom-rgb-color-base-on-gray),1);
}
.fill-color-gray:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray),1);
	border-color: rgba(var(--custom-rgb-color-hover-gray),1);
	color: rgba(var(--custom-rgb-color-base-on-gray),1);
}

/* fill gray - transparent */
.fill-color-gray.fill-transparent,
.fill-color-gray.fill-transparent.none-hover,
.fill-color-gray.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray),0.1);
	border-color: rgba(var(--custom-rgb-color-gray),0);
	color: rgba(var(--custom-rgb-color-gray),1);
}
.fill-color-gray.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-gray),0);
	color: rgba(var(--custom-rgb-color-gray),1);
}

/* --------------------------------------------------------------- */
/* -------------------------- gray dark -------------------------- */
/* --------------------------------------------------------------- */

/* fill gray dark */
.fill-color-gray-dark,
.fill-color-gray-dark.none-hover,
.fill-color-gray-dark.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray-dark),1);
	border-color: rgba(var(--custom-rgb-color-gray-dark),1);
	color: rgba(var(--custom-rgb-color-base-on-gray-dark),1);
}
.fill-color-gray-dark:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray-dark),1);
	border-color: rgba(var(--custom-rgb-color-hover-gray-dark),1);
	color: rgba(var(--custom-rgb-color-base-on-gray-dark),1);
}

/* fill gray dark - transparent */
.fill-color-gray-dark.fill-transparent,
.fill-color-gray-dark.fill-transparent.none-hover,
.fill-color-gray-dark.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray-dark),0.1);
	border-color: rgba(var(--custom-rgb-color-gray-dark),0);
	color: rgba(var(--custom-rgb-color-gray-dark),1);
}
.fill-color-gray-dark.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray-dark),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-gray-dark),0);
	color: rgba(var(--custom-rgb-color-gray-dark),1);
}

/* --------------------------------------------------------------- */
/* -------------------------- gray light -------------------------- */
/* --------------------------------------------------------------- */

/* fill gray light */
.fill-color-gray-light,
.fill-color-gray-light.none-hover,
.fill-color-gray-light.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray-light),1);
	border-color: rgba(var(--custom-rgb-color-gray-light),1);
	color: rgba(var(--custom-rgb-color-base-on-gray-light),1);
}
.fill-color-gray-light:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray-light),1);
	border-color: rgba(var(--custom-rgb-color-hover-gray-light),1);
	color: rgba(var(--custom-rgb-color-base-on-gray-light),1);
}

/* fill gray light - transparent */
.fill-color-gray-light.fill-transparent,
.fill-color-gray-light.fill-transparent.none-hover,
.fill-color-gray-light.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-gray-light),0.1);
	border-color: rgba(var(--custom-rgb-color-gray-light),0);
	color: rgba(var(--custom-rgb-color-gray-light),1);
}
.fill-color-gray-light.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-gray-light),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-gray-light),0);
	color: rgba(var(--custom-rgb-color-gray-light),1);
}

/* --------------------------------------------------------------- */
/* ----------------------------- white ---------------------------- */
/* --------------------------------------------------------------- */

/* fill white */
.fill-color-white,
.fill-color-white.none-hover,
.fill-color-white.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-white),1);
	border-color: rgba(var(--custom-rgb-color-white),1);
	color: rgba(var(--custom-rgb-color-base-on-white),1);
}
.fill-color-white:hover {
	background-color: rgba(var(--custom-rgb-color-hover-white),1);
	border-color: rgba(var(--custom-rgb-color-hover-white),1);
	color: rgba(var(--custom-rgb-color-base-on-white),1);
}

/* fill white - transparent */
.fill-color-white.fill-transparent,
.fill-color-white.fill-transparent.none-hover,
.fill-color-white.fill-transparent.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-white),0.1);
	border-color: rgba(var(--custom-rgb-color-white),0);
	color: rgba(var(--custom-rgb-color-white),1);
}
.fill-color-white.fill-transparent:hover {
	background-color: rgba(var(--custom-rgb-color-hover-white),0.2);
	border-color: rgba(var(--custom-rgb-color-base-on-white),0);
	color: rgba(var(--custom-rgb-color-white),1);
}


/* --------------------------------------------------------------- */
/* ---------------------------- red ---------------------------- */
/* --------------------------------------------------------------- */

/* fill red */
.fill-color-red,
.fill-color-red.none-hover,
.fill-color-red.none-hover:hover {
	background-color: rgba(var(--custom-rgb-color-red),1);
	border-color: rgba(var(--custom-rgb-color-red),1);
	color: rgba(var(--custom-rgb-color-base-on-red),1);
}
.fill-color-red:hover {
	background-color: rgba(var(--custom-rgb-color-hover-red),1);
	border-color: rgba(var(--custom-rgb-color-hover-red),1);
	color: rgba(var(--custom-rgb-color-base-on-red),1);
}

/* ============================================================================================== */
/* ========================================== COLOR OUTLINE ===================================== */
/* ============================================================================================== */

/* --------------------------------------------------------------- */
/* ---------------------------- primary ---------------------------- */
/* --------------------------------------------------------------- */

.outline-color-primary,
.outline-color-primary.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-primary),0);
	border-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-primary),1);
}
.outline-color-primary:hover {
	background-color:rgba(var(--custom-rgb-color-primary),1);
	color:rgba(var(--custom-rgb-color-base-on-primary),1);
}
.outline-color-primary.outline-transparent,
.outline-color-primary.outline-transparent.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-primary),0);
	border-color:rgba(var(--custom-rgb-color-primary),0.3);
	color:rgba(var(--custom-rgb-color-primary),1);
}
.outline-color-primary.outline-transparent.hover-fill-transparent:hover {
	background-color:rgba(var(--custom-rgb-color-primary),0.1);
	border-color:rgba(var(--custom-rgb-color-primary),1);
}

/* --------------------------------------------------------------- */
/* ---------------------------- black ---------------------------- */
/* --------------------------------------------------------------- */

.outline-color-black,
.outline-color-black.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-black),0);
	border-color:rgba(var(--custom-rgb-color-black),1);
	color:rgba(var(--custom-rgb-color-black),1);
}
.outline-color-black:hover {
	background-color:rgba(var(--custom-rgb-color-black),1);
	color:rgba(var(--custom-rgb-color-base-on-black),1);
}

/* --------------------------------------------------------------- */
/* -------------------------- gray dark -------------------------- */
/* --------------------------------------------------------------- */

.outline-color-gray-dark,
.outline-color-gray-dark.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-gray-dark),0);
	border-color:rgba(var(--custom-rgb-color-gray-dark),1);
	color:rgba(var(--custom-rgb-color-gray-black),1);
}
.outline-color-gray-dark:hover {
	background-color:rgba(var(--custom-rgb-color-gray-dark),1);
	color:rgba(var(--custom-rgb-color-base-on-gray-dark),1);
}

/* --------------------------------------------------------------- */
/* ---------------------------- gray ----------------------------- */
/* --------------------------------------------------------------- */

.outline-color-gray,
.outline-color-gray.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-gray),0);
	border-color:rgba(var(--custom-rgb-color-gray),1);
	color:rgba(var(--custom-rgb-color-black),1);
}
.outline-color-gray:hover {
	background-color:rgba(var(--custom-rgb-color-gray),1);
	color:rgba(var(--custom-rgb-color-base-on-gray),1);
}

/* --------------------------------------------------------------- */
/* -------------------------- gray light -------------------------- */
/* --------------------------------------------------------------- */

.outline-color-gray-light,
.outline-color-gray-light.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-gray-light),0);
	border-color:rgba(var(--custom-rgb-color-gray-light),1);
	color:rgba(var(--custom-rgb-color-gray-black),1);
}
.outline-color-gray-light:hover {
	background-color:rgba(var(--custom-rgb-color-gray-light),1);
	color:rgba(var(--custom-rgb-color-base-on-gray-light),1);
}


/* --------------------------------------------------------------- */
/* ---------------------------- white ---------------------------- */
/* --------------------------------------------------------------- */

.outline-color-white,
.outline-color-white.none-hover:hover {
	background-color:rgba(var(--custom-rgb-color-white),0);
	border-color:rgba(var(--custom-rgb-color-white),1);
	color:rgba(var(--custom-rgb-color-white),1);
}
.outline-color-white:hover {
	background-color:rgba(var(--custom-rgb-color-white),1);
	color:rgba(var(--custom-rgb-color-base-on-white),1);
}

/* ----------------------------- */

/* gray to primary */
.outline-color-mix.gray-to-primary {
	background-color:rgba(0,0,0,0);
	border-color:rgba(210,210,210,1);
	color:rgba(0,0,0,1);
}
.outline-color-mix.gray-to-primary:hover,
.outline-color-mix.gray-to-primary.active,
.outline-color-mix.gray-to-primary.active:hover:active {
	background-color:rgba(0,0,0,1) !important;
	border-color:rgba(0,0,0,1) !important;
	color:rgba(var(--custom-rgb-color-white),1) !important;
}
.outline-color-mix.gray-to-primary:hover:active,
.outline-color-mix.gray-to-primary.active:hover {
	background-color:rgba(32,32,32,1) !important;
	border-color:rgba(32,32,32,1) !important;
}

/* primary to gray */
.outline-color-mix.primary-to-gray {
	background-color:rgba(var(--custom-rgb-color-gray),0);
	border-color:rgba(0,0,0,1);
	color:rgba(0,0,0,1);
}
.outline-color-mix.primary-to-gray:hover,
.outline-color-mix.primary-to-gray.active,
.outline-color-mix.primary-to-gray.active:hover:active {
	background-color:rgba(var(--custom-rgb-color-gray),1) !important;
	border-color:rgba(var(--custom-rgb-color-gray),1) !important;
}
.outline-color-mix.primary-to-gray:hover:active,
.outline-color-mix.primary-to-gray.active:hover {
	background-color:rgba(200,200,200,1) !important;
	border-color:rgba(200,200,200,1) !important;
}

.outline-color-installments,
.outline-color-installments.none-hover:hover {
	background-color:rgba(0,123,255,0) !important;
	border-color:rgba(0,123,255,1) !important;
	color:rgba(0,123,255,1) !important;
}
.outline-color-installments:hover {
	background-color:rgba(0,123,255,1) !important;
	color:rgba(var(--custom-rgb-color-white),1) !important;
}




/* ----- share ----- */

.share-btn {
	position: relative;
	display: block;
	width: 30px !important;
	height: 30px !important;
	line-height: 30px;
	min-width: auto !important;
	padding: 0 !important;
	border-radius: 100%;
	cursor: pointer;
}

/* ----- social ----- */

ul.social-group,
ul.social-group > li.social-item {
	position:relative;
	list-style:none !important;
	margin:0;
	padding:0;
}
ul.social-group {
	display:table;
	width:auto;
}
ul.social-group > li.social-item {
	display:inline-block;
	float:left;
}
.social-btn > i {
    position: relative;
}
ul.social-group > li.social-item + li {
	margin-left:5px;
}
.social-btn {
	position:relative;
	display:block;
	width:40px;
	height:40px;
	font-size:18px;
	line-height:40px;
	text-align:center;
	color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(16,16,16,0);
	border:1px solid rgba(16,16,16,0.2);
	/* border-radius:100%; */
	border-radius: 5px;
}
.social-btn:hover {
	color:rgba(0,0,0,1);
	background-color:rgba(var(--custom-rgb-color-white),1);
	border-color:rgba(var(--custom-rgb-color-white),1);	
}
.social-btn,
.social-btn:hover {
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
}
.social-btn .icon {
	line-height: 0 !important;
	height: 0 !important;
}

/* --- social bg white --- */

/* ul.social-group.theme-bg-white .social-btn {
	color:rgba(var(--custom-rgb-color-black),1) !important;
	background-color:rgba(var(--custom-rgb-color-white),1) !important;
	border-color:rgba(var(--custom-rgb-color-white),0) !important;
}
ul.social-group.theme-bg-white .social-btn:hover {
	color:rgba(var(--custom-rgb-color-black),1) !important;
	background-color:rgba(var(--custom-rgb-color-white),0.8) !important;
} */

/* --- social bg color --- */

ul.social-group.theme-bg {}
ul.social-group.theme-bg,
ul.social-group.theme-bg .social-btn {
	color:#fff !important;
	border:none !important;
}

/* facebook */
ul.social-group.theme-bg .facebook {
    background-color: rgba(14,77,202,1) !important;
}
ul.social-group.theme-bg .facebook:hover {
    background-color: rgba(20,87,220,1) !important;
}

/* youtube */
ul.social-group.theme-bg .youtube {
    background-color: rgba(204,47,47,1) !important;
}
ul.social-group.theme-bg .youtube:hover {
    background-color:rgba(230,50,50,1) !important;
}

/* instagram */
ul.social-group.theme-bg .instagram {
    background-color: rgba(216,43,115,1) !important;
}
ul.social-group.theme-bg .instagram:hover {
    background-color: rgba(184,46,151,1) !important;
}

/* line */
ul.social-group.theme-bg .line {
    background-color: rgba(37,175,0,1) !important;
}
ul.social-group.theme-bg .line:hover {
    background-color: rgba(45,200,4,1) !important;
}

/* messenger */
ul.social-group.theme-bg .messenger {
    background-color: rgba(0,132,255,1) !important;
}
ul.social-group.theme-bg .messenger:hover { 
    background-color: rgba(0,162,255,1) !important;
}

/* tel */
ul.social-group.theme-bg .tel {
	background-color:rgba(210,151,59,1) !important;
}
ul.social-group .tel { font-size:13px !important; }
ul.social-group.theme-bg .tel:hover {background-color:rgba(255,145,20,1); }

/* email */
ul.social-group.theme-bg .email {
	background-color: rgba(210,151,59,1);
}
ul.social-group .email { font-size:15px !important; }
ul.social-group .email > i { top:2px !important; }
ul.social-group.theme-bg .email:hover { background-color: rgba(255,145,20,1); }

/* --- social bg color - transparent --- */

ul.social-group.theme-bg-transparent .social-btn {
	border: none !important;
}

/* ci */
ul.social-group.theme-bg-transparent.ci .social-btn {
	color: rgba(var(--custom-rgb-color-primary),1) !important;
    background-color: rgba(var(--custom-rgb-color-primary),0.2) !important;
}
ul.social-group.theme-bg-transparent.ci .social-btn:hover {
    background-color: rgba(var(--custom-rgb-color-primary),0.3) !important;
}


/* --- social outline white --- */

ul.social-group.theme-outline-white .social-btn {
	border-width:1px;
	border-color:rgba(var(--custom-rgb-color-white),0.2) !important;
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(var(--custom-rgb-color-white),0) !important;
	line-height: 38px;
}
ul.social-group.theme-outline-white .social-btn:hover {
	border-color:rgba(var(--custom-rgb-color-white),1) !important;
	color:rgba(var(--custom-rgb-color-black),1) !important;
	background-color:rgba(var(--custom-rgb-color-white),1) !important;
}

/* --- social outline ci --- */

ul.social-group.theme-outline-ci .social-btn {
	border-width:1px;
	border-color:rgba(var(--custom-rgb-color-primary),0.2) !important;
	color:rgba(var(--custom-rgb-color-primary),1) !important;
	background-color:rgba(var(--custom-rgb-color-primary),0) !important;
	line-height: 38px;
}
ul.social-group.theme-outline-ci .social-btn:hover {
	border-color:rgba(var(--custom-rgb-color-primary),1) !important;
	color:rgba(var(--custom-rgb-color-black),1) !important;
	background-color:rgba(var(--custom-rgb-color-primary),1) !important;
}

/* --- social outline color --- */

ul.social-group.theme-outline .social-btn {
	border-width:2px;
	line-height: 36px;
}

/* facebook */
ul.social-group.theme-outline .facebook {
	border-color: rgba(56,100,191,1) !important;
	background-color: rgba(56,100,191,0);
	color: rgba(56,100,191,1) !important;
}
ul.social-group.theme-outline .facebook:hover {
	background-color: rgba(56,100,191,1);
	color: rgba(var(--custom-rgb-color-white),1) !important;
}

/* youtube */
ul.social-group.theme-outline .youtube {
	border-color: rgba(204,47,47,1) !important;
	background-color: rgba(204,47,47,0);
	color: rgba(204,47,47,1) !important;
}
ul.social-group.theme-outline .youtube:hover {
	background-color: rgba(204,47,47,1);
	color: rgba(var(--custom-rgb-color-white),1) !important;
}

/* instagram */
ul.social-group.theme-outline .instagram {
	border-color: rgba(216,43,115,1) !important;
	background-color: rgba(216,43,115,0);
	color: rgba(216,43,115,1) !important;
}
ul.social-group.theme-outline .instagram:hover {
	background-color: rgba(216,43,115,1);
	color: rgba(var(--custom-rgb-color-white),1) !important;
}

/* messenger */
ul.social-group.theme-outline .messenger {
	border-color: rgba(0,132,255,1) !important;
	background-color: rgba(0,132,255,0);
	color: rgba(0,132,255,1) !important;
}
ul.social-group.theme-outline .messenger:hover {
	background-color: rgba(0,132,255,1);
	color: rgba(var(--custom-rgb-color-white),1) !important;
}

/* line */
ul.social-group.theme-outline .line {
	border-color: rgba(37,175,0,1) !important;
	background-color: rgba(37,175,0,0);
	color: rgba(37,175,0,1) !important;
}
ul.social-group.theme-outline .line:hover {
	background-color: rgba(37,175,0,1);
	color: rgba(var(--custom-rgb-color-white),1) !important;
}


/* facebook */
/* .default-btn.btn-facebook,
.default-btn.btn-icon.btn-facebook {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(14,77,202,1) !important;
}
.default-btn.btn-facebook:hover,
.default-btn.btn-icon.btn-facebook:hover {
	background-color:rgba(20,87,220,1) !important;
}
.default-btn.btn-icon.btn-facebook > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
} */

/* google */
.btn-google,
.btn-icon.btn-google {
	color:rgba(0,0,0,1) !important;
	/* background-color:rgba(var(--custom-rgb-color-white),1) !important; */
	background-color:rgba(242,242,242,1) !important;
	/* background-color:rgba(235,235,235,1) !important; */
}
.btn-google:hover,
.btn-icon.btn-google:hover {
	/* background-color:rgba(242,242,242,1) !important; */
	background-color:rgba(250,250,250,1) !important;
}
.btn-icon.btn-google > .col-icon > .icon {
    color:rgba(0,0,0,1);
}

/* facebook */
.btn-facebook,
.btn-icon.btn-facebook,
.bg-social-facebook {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(14,77,202,1) !important;
}
.btn-icon.btn-facebook > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	/* background-color:rgba(0,0,0,0.2);	 */
}
.btn-icon.bg-gradient.btn-facebook {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(14,40,152,1), rgba(14,77,202,1) ) !important;
}
.bg-transparent.btn-facebook,
.btn-icon.bg-transparent.btn-facebook {
    color:rgba(14,77,202,1) !important;
	background-color:rgba(0,123,255,0.1) !important;
}
.bg-transparent.btn-facebook:hover,
.btn-icon.bg-transparent.btn-facebook:hover {
	background-color:rgba(0,123,255,0.15) !important;
}
.btn-icon.bg-transparent.btn-facebook > .col-icon > .icon {
    color:rgba(14,77,202,0.7);
	background-color:rgba(0,123,255,0.2);	
}

/* messenger */
.btn-messenger,
.btn-icon.btn-messenger,
.bg-social-messenger {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(0,127,248,1) !important;
}
.btn-icon.btn-messenger > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-messenger {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(0,95,209,1), rgba(0,127,248,1) ) !important;
}
.bg-transparent.btn-messenger,
.btn-icon.bg-transparent.btn-messenger {
    color:rgba(0,127,248,1) !important;
	background-color:rgba(0,123,255,0.1) !important;
}
.bg-transparent.btn-messenger:hover,
.btn-icon.bg-transparent.btn-messenger:hover {
	background-color:rgba(0,123,255,0.15) !important;
}
.btn-icon.bg-transparent.btn-messenger > .col-icon > .icon {
    color:rgba(0,127,248,0.7);
	background-color:rgba(0,123,255,0.2);	
}

/* line */
.btn-line,
.btn-icon.btn-line,
.bg-social-line {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(48,160,16,1) !important;
}
.btn-icon.btn-line > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-line {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(48,131,16,1), rgba(48,160,16,1) ) !important;
}
.bg-transparent.btn-line,
.btn-icon.bg-transparent.btn-line {
    color:rgba(48,131,16,1) !important;
	background-color:rgba(48,160,16,0.15) !important;
}
.bg-transparent.btn-line:hover,
.btn-icon.bg-transparent.btn-line:hover {
	background-color:rgba(48,160,16,0.2) !important;
}
.btn-icon.bg-transparent.btn-line > .col-icon > .icon {
    color:rgba(48,131,16,0.7);
	background-color:rgba(48,160,16,0.2);	
}

/* twitter */
.btn-twitter,
.btn-icon.btn-twitter,
.bg-social-twitter {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(123,197,248,1) !important;
}
.btn-icon.btn-twitter > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-twitter {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(0,95,209,1), rgba(123,197,248,1) ) !important;
}
.bg-transparent.btn-twitter,
.btn-icon.bg-transparent.btn-twitter {
    color:rgba(123,197,248,1) !important;
	background-color:rgba(0,123,255,0.1) !important;
}
.bg-transparent.btn-twitter:hover,
.btn-icon.bg-transparent.btn-twitter:hover {
	background-color:rgba(0,123,255,0.15) !important;
}
.btn-icon.bg-transparent.btn-twitter > .col-icon > .icon {
    color:rgba(123,197,248,0.7);
	background-color:rgba(0,123,255,0.2);	
}
/* instagram */
.btn-icon.btn-instagram > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-instagram,
.btn-icon.bg-gradient.btn-instagram,
.bg-social-instagram {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(242,0,12,1), rgba(188,1,170,1) ) !important;
}
.bg-transparent.btn-instagram,
.btn-icon.bg-transparent.btn-instagram {
    color:rgba(217,1,85,1) !important;
    background: none !important;
    background-color:rgba(217,1,85,0.15) !important;    
}
.bg-transparent.btn-instagram:hover,
.btn-icon.bg-transparent.btn-instagram:hover {
    background-color:rgba(217,1,85,0.2) !important;   
}
.btn-icon.bg-transparent.btn-instagram > .col-icon > .icon {
    color:rgba(217,1,85,0.7);
	background-color:rgba(217,1,85,0.15);	
}

/* youtube */
.btn-youtube,
.btn-icon.btn-youtube,
.bg-social-youtube {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(204,0,0,1) !important;
}
.btn-icon.btn-youtube > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-youtube {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(161,0,0,1), rgba(204,0,0,1) ) !important;
}
.bg-transparent.btn-youtube,
.btn-icon.bg-transparent.btn-youtube {
    color:rgba(161,0,0,1) !important;
	background-color:rgba(204,0,0,0.15) !important;
}
.bg-transparent.btn-youtube:hover,
.btn-icon.bg-transparent.btn-youtube:hover {
	background-color:rgba(204,0,0,0.2) !important;
}
.btn-icon.bg-transparent.btn-youtube > .col-icon > .icon {
    color:rgba(161,0,0,0.7);
	background-color:rgba(204,0,0,0.2);	
}

/* tel */
.btn-tel,
.btn-icon.btn-tel {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(0,0,0,1) !important;
}
.btn-icon.btn-tel > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
}
.btn-icon.bg-gradient.btn-tel {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(14,40,152,1), rgba(0,0,0,1) ) !important;
}
.bg-transparent.btn-tel,
.btn-icon.bg-transparent.btn-tel {
	color:rgba(0,0,0,1) !important;
	background-color: rgba(var(--custom-rgb-color-gray),1) !important;
}
.bg-transparent.btn-tel:hover,
.btn-icon.bg-transparent.btn-tel:hover {
	background-color:rgba(220,220,220,1) !important;
}
.btn-icon.bg-transparent.btn-tel > .col-icon > .icon {
    color:rgba(0,0,0,0.7);
	background-color:rgba(0,123,255,0.2);	
}

/* tiktok */
.btn-tiktok,
.btn-icon.btn-tiktok,
.bg-social-tiktok {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(35,35,35,1) !important;
}
.btn-icon.btn-tiktok > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-tiktok {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(0,0,0,1), rgba(35,35,35,1) ) !important;
}
.bg-transparent.btn-tiktok,
.btn-icon.bg-transparent.btn-tiktok {
    color:rgba(255,255,255,1) !important;
	background-color:rgba(35,35,35,0.15) !important;
}
.bg-transparent.btn-tiktok:hover,
.btn-icon.bg-transparent.btn-tiktok:hover {
	background-color:rgba(35,35,35,0.2) !important;
}
.btn-icon.bg-transparent.btn-tiktok > .col-icon > .icon {
    color:rgba(255,255,255,0.7);
	background-color:rgba(35,35,35,0.2);	
}


/* wechat */
.btn-wechat,
.btn-icon.btn-wechat,
.bg-social-wechat {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(37,191,88,1) !important;
}
.btn-icon.btn-wechat > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-wechat {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(0,0,0,1), rgba(37,191,88,1) ) !important;
}
.bg-transparent.btn-wechat,
.btn-icon.bg-transparent.btn-wechat {
    color:rgba(255,255,255,1) !important;
	background-color:rgba(37,191,88,0.15) !important;
}
.bg-transparent.btn-wechat:hover,
.btn-icon.bg-transparent.btn-wechat:hover {
	background-color:rgba(37,191,88,0.2) !important;
}
.btn-icon.bg-transparent.btn-wechat > .col-icon > .icon {
    color:rgba(12,11948,0.7);
	background-color:rgba(37,191,88,0.2);	
}


/* whatsapp */
.btn-whatsapp,
.btn-icon.btn-whatsapp,
.bg-social-whatsapp {
	color:rgba(var(--custom-rgb-color-white),1) !important;
	background-color:rgba(37,191,88,1) !important;
}
.btn-icon.btn-whatsapp > .col-icon > .icon {
    color:rgba(var(--custom-rgb-color-white),1);
	background-color:rgba(0,0,0,0.2);	
}
.btn-icon.bg-gradient.btn-whatsapp {
    color:rgba(var(--custom-rgb-color-white),1) !important;
    background: linear-gradient( 45deg, rgba(0,0,0,1), rgba(37,191,88,1) ) !important;
}
.bg-transparent.btn-whatsapp,
.btn-icon.bg-transparent.btn-whatsapp {
    color:rgba(255,255,255,1) !important;
	background-color:rgba(37,191,88,0.15) !important;
}
.bg-transparent.btn-whatsapp:hover,
.btn-icon.bg-transparent.btn-whatsapp:hover {
	background-color:rgba(37,191,88,0.2) !important;
}
.btn-icon.bg-transparent.btn-whatsapp > .col-icon > .icon {
    color:rgba(12,11948,0.7);
	background-color:rgba(37,191,88,0.2);	
}


.btn-click-action {
	cursor: pointer !important;
}


/* xxl */
@media (min-width: 1400px) {}

/* xxl - 1 */
@media (min-width:1500px) and (max-width: 1599.98px) {}

/* xxl - 2 */
@media (min-width: 1400px) and (max-width: 1499.98px) {}

/* xl */
@media (min-width: 1200px) and (max-width: 1399.98px) {

.default-btn {
	height:45px;
	line-height:45px;
	font-size:14px;
	/* font-size: 19px; */
	padding-left: 10px;
	padding-right: 10px;	
}

}

/* lg */
@media (min-width: 992px) and (max-width: 1199.98px) {

.default-btn {
	/* font-size: 20px; */
}

}

/* md */
@media (min-width: 768px) and (max-width: 991.98px) {

.default-btn {
	/* font-size: 20px; */
}

}

/* sm - xs */
@media (max-width: 767.98px) {}

/* sm */
@media (min-width: 576px) and (max-width: 767.98px) {

.default-btn {
	/* font-size: 20px; */
}

}

/* xs */
@media (max-width: 575.98px) {
	
.default-btn {
	height:45px;
	line-height:45px;
	font-size:14px;
	/* font-size: 19px; */
	padding-left: 10px;
	padding-right: 10px;	
}

.default-btn.w-xs-flex {
	flex: 1 0 0;
	width: auto !important;
	min-width: auto !important;
}

}

/* xs custom */
@media (max-width: 399.98px) {}