/* * ---------------------------------------------------------------------------------------- 
Template Name: Elite Price Table
Version : 1.0
Author  :ElitePlay

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


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

// Table of contents
01.GENARAL STYLE
02.FLEX BOX AND GRID STYLE
03.PRICE TABLE STYLE ONE
04.PRICE TABLE STYLE TWO
05.PRICE TABLE STYLE THREE
06.PRICE TABLE STYLE FOUR
07.PRICE TABLE STYLE FIVE


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


/* * ---------------------------------------------------------------------------------------- 
01.GENARAL STYLE
* ---------------------------------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@300;400;500;600&display=swap');

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

::selection {
	background-color: #4EC6DE;
}

p {
	font-size: 15px;
	line-height: 28px;
}

.img {
	max-width: 100%;
	height: auto;
}

li {
	list-style: none;
}

a {
	text-decoration: none;
}


/*PORTFOLIO STYLE ONE*/

.ep_portfolio_sc_title h2 {
    font-weight: 600;
    font-size: 36px;
    position: relative;
    line-height: 36px;
    padding-bottom: 15px;
}

.ep_portfolio_sc_title h2:after {
    background: #a7d978;
    position: absolute;
    left: 50%;
    width: 60px;
    height: 4px;
    content: "";
    bottom: 0;
    margin-left: -50px;
    border-radius: 4px;
}
.ep_portfolio_sc_title {
    text-align: center;
    margin-bottom: 30px;
}

section.ep_mas_portfolio_style_one, section.ep_mas_portfolio_style_two, section.ep_mas_portfolio_style_three, .ep_mas_portfolio_style_four {
    margin-top: 40px;
    margin-bottom: 0;
}

.m_b_30{
	margin-bottom: 30px;
}

.ep_portfolio_content {
    left: 0;
    padding: 30px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    transition: .3s;
    visibility: hidden;
    opacity: 0;
    z-index: 9;

}
.ep_single_portfolio:hover .ep_portfolio_content
{   visibility: visible;
	opacity: 1;
}

.ep_portfolio_thumb {
    position: relative;
    overflow: hidden;
}
.ep_portfolio_thumb:before {
    background: #121212;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    transition:  all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;

}
.ep_single_portfolio:hover .ep_portfolio_thumb:before{
	opacity: .9;
	visibility: visible;
}


.ep_portfolio_thumb img {
    width: 100%;
    transition: .3s;
}

.ep_single_portfolio:hover .ep_portfolio_thumb img{

   transform: scale(1.2);
} 
.ep_portfolio_content h4 {
    margin-bottom: 6px;
}
.ep_portfolio_content h4 a {
    text-decoration: none;
    color: #fff;
    font-size: 26px;
    letter-spacing: 0;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 8px;
    display: block;
    line-height: 26px;
}

.ep_portfolio_content span {
    color: #ddd;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: capitalize;
    font-size: 16px;
}
.ep_portfolio_content a i.fa {
    display: block;
    color: #fff;
    font-size: 26px;
    margin-top: 12px;
}

.ep_portfolio_content a {
    text-decoration: none;
}

.ep_portfolio_content h4 span {
    margin-bottom: 0;
}

.portfolio-filter-style-one a {
    text-decoration: none;
    font-size: 16px;
    display: inline-block;
    padding-right: 15px;
    color: #333;
    margin-right: 10px;
    text-transform: uppercase;
    font-weight: 500;
}

.portfolio-filter-style-one {
    margin-bottom: 15px;
    text-align: left;
}

.portfolio-filter-style-one a {
    position: relative;
}


.portfolio-filter-style-one a:hover{
	color: #dc3545;
}
.portfolio-filter-style-one a.current {
    color: #dc3545;
}


/*PORTOFLIO STYLE TWO*/

.portfolio-filter-style-two {
    text-align: center;
    margin-bottom: 30px;
}

.portfolio-filter-style-two a {
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    color: #333;
    text-decoration: none;
    margin: 0 15px;
    position: relative;
    margin-left: 0;
    transition: all 0.3s ease 0s;
}

.portfolio-filter-style-two a:hover{
	color: #dc3545;
}

.portfolio-filter-style-two a:after {
    background: #dc3545;
    width: 20px;
    left: 0;
    bottom: -3px;
    height: 2px;
    content: "";
    position: absolute;
    right: 0;
    transition: all 0.3s ease 0s;
    opacity: 0;
}

.portfolio-filter-style-two a.current:after{
	opacity: 1;
}


/*PORTOFLIO STYLE THREE*/

.portfolio-filter-style-three {
    text-align: center;
}

.portfolio-filter-style-three a {
    text-decoration: none;
    text-transform: uppercase;
    color: #28a745;
    font-weight: 500;
    background: transparent;
    display: inline-block;
    text-align: center;
    padding: 10px 15px;
    border: 2px solid #28a745;
    margin: 0 5px;
    transition: .3s;
    border-radius: 4px;
}

.portfolio-filter-style-three a.current, .portfolio-filter-style-three a:hover{

	background: #28a745;
	color: #fff;
}


.portfolio-filter-style-three {
    margin-bottom: 30px;
}





/*PORTOFLIO STYLE FOUR*/

.portfolio-filter-style-four {
    text-align: center;
}

.portfolio-filter-style-four a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 500;
    color: #222;
    border: 2px solid #444;
    padding: 10px 20px;
    display: inline-block;
    background: transparent;
    transition: .3s;
    margin:0 5px;
}

.portfolio-filter-style-four {
    margin-bottom: 25px;
}

.portfolio-filter-style-four a.current, .portfolio-filter-style-four a:hover{
	background: #444;
	color: #fff;
}

.ep_portfolio_thumb_f_one{
	position: relative;
	overflow: hidden;
}

.overley_flat {
    background: #111111;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height:100%;
    content: "";
    transition:  all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
}


.ep_portfolio_flat_style_one:hover .overley_flat{
	transform: scale(1.2);
	opacity: .9;
	visibility: visible;
}
.ep_portfolio_thumb_f_one img{
	transition:  all 0.3s ease 0s;
	transform: scale(1);
}
.ep_portfolio_flat_style_one:hover .ep_portfolio_thumb_f_one img{
	transform: scale(1.2);
}

.ep_flat_portfolio_details {
    position: absolute;
    right: -100px;
    bottom: 40px;
    text-align: left;
    transition:  all 0.3s ease 0s;
    opacity: 0;
    z-index: 9;
}

.ep_portfolio_flat_style_one:hover .ep_flat_portfolio_details
{   
	transition:  all 0.3s ease 0s;
    right: 40px;
	visibility: visible;
	opacity: 1;
}

.ep_flat_portfolio_details h3 {
    color: #fff;
    text-transform: capitalize;
    font-weight: 500;
    font-size: 26px;
    margin-bottom: 8px;
}

.ep_flat_portfolio_details span {
    color: #ddd;
    text-transform: capitalize;
    font-size: 16px;
    font-weight: 500;
}


/*PRELOADER CSS*/
.page-loader {

	background: #fff;

	position: fixed;

	top: 0;

	bottom: 0;

	right: 0;

	left: 0;

	z-index: 999;

}



.loader {

	background: #666;

	position: absolute;

	display: inline-block;

	height: 40px;

	width: 40px;

	left: 50%;

	top: 50%;

	margin: -20px 0 0 -20px;

	text-indent: -9999em;

	-webkit-border-radius: 100%;

	   -moz-border-radius: 100%;

	        border-radius: 100%;

	-webkit-animation-fill-mode: both;

	        animation-fill-mode: both;

	-webkit-animation: ball-scale 1s 0s ease-in-out infinite;

	        animation: ball-scale 1s 0s ease-in-out infinite;

}



@-webkit-keyframes ball-scale {



	0% {

		-webkit-transform: scale(0);

		   -moz-transform: scale(0);

		    -ms-transform: scale(0);

		     -o-transform: scale(0);

		        transform: scale(0);

	}



	100% {

		opacity: 0;

		-webkit-transform: scale(1);

		   -moz-transform: scale(1);

		    -ms-transform: scale(1);

		     -o-transform: scale(1);

		        transform: scale(1);

	}



}


@keyframes ball-scale {



	0% {

		-webkit-transform: scale(0);

		   -moz-transform: scale(0);

		    -ms-transform: scale(0);

		     -o-transform: scale(0);

		        transform: scale(0);

	}



	100% {

		opacity: 0;

		-webkit-transform: scale(1);

		   -moz-transform: scale(1);

		    -ms-transform: scale(1);

		     -o-transform: scale(1);

		        transform: scale(1);

	}



}




/*RESPONSIVE CSS*/
@media (min-width: 540px) {
	
}

@media (min-width: 768px) {
	
}

@media (min-width: 992px) {
	
}

@media (min-width: 1200px) {
	
}