
/*** 

====================================================================
	Case Section
====================================================================

***/

.case-section{
	position: relative;
	padding-top: 110px;
	padding-bottom: 100px;
}

.case-section .owl-nav,
.case-section .owl-dots{
	display:none;
}

.case-block{
	position: relative;
}

.case-block .inner-box{
	position: relative;
	display:block;
	overflow: hidden;
}

.case-block .inner-box .image{
	position: relative;
}

.case-block .inner-box .image:before{
	position:absolute;
	content:'';
	left:0px;
	bottom:0px;
	width:100%;
	height:80%;
	display:block;
	z-index:1;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
	background:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.4));
	background:-moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.4));
	background:-o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.4));
	background:-ms-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.4));
}

.case-block .inner-box:hover .image:before{
	opacity: 0;
}

.case-block .inner-box .image img{
	position: relative;
	width:100%;
	display: block;
}

.case-block .inner-box .image .overlay-box{
	position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
	z-index: 2;
    color: #ffffff;
	visibility: hidden;
    -webkit-transition: all 700ms ease;
    -ms-transition: all 700ms ease;
    -o-transition: all 700ms ease;
    transition: all 700ms ease;
	-webkit-transform-origin:left top;
	-ms-transform-origin:left top;
	-moz-transform-origin:left top;
	transform-origin:left top;
	-moz-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
	transform: translateX(-100%);
}

.case-block .inner-box .image .overlay-box:before{
	position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    right:0px;
	bottom:0px;
    opacity: 0;
	display: block;
    visibility: hidden;
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
    background-color:rgba(238,48,80,0.95);
}

.case-block .inner-box:hover .image .overlay-box:before{
    opacity: 1;
    visibility: visible;
}

.case-block .inner-box .image .overlay-box .overlay-inner{
	position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: table;
    vertical-align: middle;
    padding: 10px 40px;
}

.case-block .inner-box .image .overlay-box .overlay-inner .content{
    position: relative;
    display: table-cell;
    vertical-align: middle;
}

.case-block .inner-box .image .overlay-box .text{
	position: relative;
	color:#ffffff;
	font-size: 16px;
	line-height: 1.7em;
	margin-bottom: 40px;
}

.case-block .inner-box .image .overlay-box .read-more{
	position:relative;
	font-size: 13px;
	font-weight: 700;
	color:#ffffff;
	padding-right: 22px;
	text-transform: uppercase;
	font-family: 'Hind', sans-serif;
}

.case-block .inner-box .image .overlay-box .read-more:after{
	position: absolute;
    content: '';
    left: 100%;
    top: 10px;
    width: 300%;
    height: 1px;
    background-color: rgba(255,255,255,0.20);
}

.case-block .inner-box .image .overlay-box .read-more .fa{
	position:relative;
	margin-right: 4px;
}

.case-block .inner-box:hover .image .overlay-box{
    opacity: 1;
	visibility: visible;
	-moz-transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
}

.case-block .inner-box .lower-box{
	position:relative;
	padding: 40px 40px;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}

.case-block .inner-box:hover .lower-box{
	background-color: #f9f8fc;
}

.case-block .inner-box .lower-box .category{
	position: relative;
	color:#443986;
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 5px;
	text-transform: uppercase;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}

.case-block .inner-box:hover .lower-box .category{
	color:var(--theme-color);
}

.case-block .inner-box .lower-box h3{
	position: relative;
	color:#222222;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.4em;
}

.case-block .inner-box .lower-box h3 a{
	position: relative;
	color:#222222;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}

.case-block .inner-box .lower-box h3 a:hover{
	color:var(--theme-color);
}