/*------------------------------------------------------------------------
# mod_mx_services Extension
# ------------------------------------------------------------------------
# author    mixwebtemplates
# Copyright (C) 2020 mixwebtemplates.com. All Rights Reserved.
# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
# Websites: http://www.mixwebtemplates.com
-------------------------------------------------------------------------*/

:root {
  --mxtx36-color: rgb(42,35,115);
	--color-thsix-rgb:42,35,115;
  --white-color:rgb(255,255,255);
  --white-color-rgb:255,255,255;
  --main-color: rgb(234,27,41);
}

.service-block_thsix{
	position: relative;
	z-index: 1;
	margin-bottom: 30px;
}

.service-block_thsix-inner{
	position: relative;
	overflow: hidden;
	padding: 35px 35px 0px;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	border-radius: 25px 25px 250px 250px;
	background-color: var(--white-color);
	box-shadow: 0px 0px 15px rgba(0,0,0,0.06);
	min-height: 260px;
}

.service-block_thsix:hover::before{
	opacity: 1; 
	transform: translateY(-45px);
	background-color: var(--main-color);
}

.service-block_thsix::before{
	position: absolute;
	content: '';
	left: 40px;
	top: -15px;
	right: 40px;
	height: 15px;
	opacity: 0.40;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	border-radius: 10px 10px 0px 0px;
	background-color: var(--mxtx36-color);
}

.service-block_thsix-inner:hover .service-block_thsix-image{
	opacity: 1;
	transform: scale(1,1);
}

.service-block_thsix-image{
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	opacity: 0;
	overflow: hidden;
	border-radius: 25px 25px 250px 250px;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	background-size: cover;
	transform: scale(0.3,1);
}

.service-block_thsix-image::before{
	position: absolute;
	content: '';
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	opacity: 0.70;	
	background: #000;
}

.service-block_thsix-icon{
	position: relative;
	line-height: 1em;
	font-size: 66px;
	display: inline-block;
	color: rgb(209, 209, 222);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.service-block_thsix-inner:hover .service-block_thsix-icon{
	transform: rotateY(180deg);
}

.service-block_thsix-heading{
	position: relative;
	font-weight: 400;
	margin-top: 25px;
	z-index: 1;
	padding-bottom: 15px;
	text-transform: capitalize;
	color: var(--mxtx36-color);
	font-size: 24px !important;
}

.service-block_thsix-heading a{
	position: relative;
	color: var(--mxtx36-color);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	font-size: 24px;
}

.service-block_thsix-inner:hover .service-block_thsix-heading a, .service-block_thsix-inner:hover .service-block_thsix-heading{
	color: var(--white-color);
}

.service-block_thsix-heading::before{
	position: absolute;
	content: '';
	left: 0px;
	bottom: 0px;
	width: 50px;
	height: 4px;
	background: var(--main-color);
	background: linear-gradient(to right, var(--main-color) 0%, var(--mxtx36-color) 100%);
}

.service-block_thsix-text{
	position: relative;
	font-size:18px;
	opacity: 0;
	height: 0px;
	line-height: 30px;
	margin-top: 20px;
	padding-right: 15px;
	color: var(--white-color);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	transform: scale(1,0);
}

.service-block_thsix-inner:hover{
	transform: translateY(-45px);
}

.service-block_thsix-inner:hover .service-block_thsix-text{
	opacity: 1;
	height: 85px;
	transform: scale(1,1);
}

.service-block_thsix-arrow{
	position: relative;
	text-align: center;
	margin-top: 35px;
	display: block;
	padding-top: 25px;
	overflow: hidden;
	padding-bottom: 25px;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.service-block_thsix-arrow i{
	position: relative;
	width: 44px;
	height: 44px;
	margin: 0 auto;
	line-height: 42px;
	font-size: 18px;
	border-radius: 50px;
	display: block;
	color: var(--mxtx36-color);
	border: 1px solid var(--mxtx36-color);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.service-block_thsix-arrow::before{
	position: absolute;
	content: '';
	left: 50%;
	top: 0px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	transform: translateX(-50%);
	background-color: rgb(238, 238, 246);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.service-block_thsix-inner:hover .service-block_thsix-icon{
	opacity: 0.50;
	color: var(--white-color);
}

.service-block_thsix-inner:hover .service-block_thsix-arrow::before{
	background-color: rgba(var(--white-color-rgb), 0.15);
}

.service-block_thsix-inner:hover .service-block_thsix-arrow i{
	color: var(--white-color);
	border-color: var(--main-color);
	background-color: var(--main-color);
}

.service-block_thsix-content{
	position: relative;
	overflow: hidden;
	border-radius: 25px 25px 250px 250px;
}

.service-block_thsix-number{
	position: absolute;
	right: 0px;
	top: -10px;
	opacity: 0.08;
	z-index: 10;
	font-weight: 800;
	line-height: 1em;
	font-size: 90px;
	color: var(--mxtx36-color);
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}
.service-block_thsix-inner .card-footer {
  background-color: transparent;
  border-top: 0px solid transparent;
}

.service-block_thsix-inner:hover .service-block_thsix-number{
	color: var(--white-color);
}