@media (max-width: 575.98px) {

	.img-circle2 {
		width: 80% !important;
		max-width: 170px !important;
		display: block;
		margin: auto;
	}
	
	.img-circle2 {
		float: none !important;
		margin: auto !important;
	}
	
	.padding-30 {
		padding: 10px !important;
	}
	
	.no-inner-mobile {
		padding: 20px !important;
	}
	
	.mr-lister-pic {
		width: 80% !important;
		max-width: 170px !important;
	}
	
}

@media (min-width: 576px) {

	.img-circle2 {
		width: 120px !important;
	}
	
	.mr-lister-pic {
		width: 250px !important;
	}
	
}

@media (min-width: 768px) { 

	.img-circle2 {
		width: 145px !important;
	}
	
	.mr-lister-pic {
		width: 250px;
	}
	
}

@media (min-width: 992px) { 

	.img-circle2 {
		width: 150px !important;
	}
	
	.mr-lister-pic {
		width: 100%;
		max-width: 230px;
	}

}

@media (min-width: 1200px) { 

	.img-circle2 {
		width: 170px !important;
	}
	
	.mr-lister-pic {
		width: 100%;
		max-width: 270px;
	}

}

.material-icons {
	font-size: 28px !important;
	line-height: 35px !important;
	text-align: center !important;
	font-weight: 900 !important;
}

.strike-rate div {
	display: inline-block;
}

html,
body {
	height: 100% !important;
}

/*===================================================================================*/
/*	PAYMENT TABLE
/*===================================================================================*/

.response-message .red strong {
	
	color: #E43A45 !important;
	
}

.response-message .blue strong {
	
	color: #3598dc !important;
	
}

.payment .plan {
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	overflow: hidden;
}
.payment .plan header {
	background: #2F4052;
	text-align: center;
	padding: 50px;
}
.payment .plan h2 {
	font-size: 20px;
	font-weight: 400;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: #FFF;
}
.payment .plan .btn {
	margin-bottom: 0;
}
.payment .plan .price {
	margin-bottom: 15px;
}
.payment .plan .price * {
	font-family: 'Lato', sans-serif;
	line-height: 100%;
}
.payment .plan .price .amount {
	font-size: 120px;
	font-weight: 900;
	color: #FFF;
}
.payment .plan .price .currency {
	position: relative;
	top: 16px;
	font-size: 24px;
	vertical-align: top;
	margin-right: 5px;
}
.payment .plan .price .period {
	font-size: 16px;
	text-transform: uppercase;
}
.payment .plan .features {
    background: #F5F7FA;
    padding: 25px 35px;
    border: 1px solid #E6E9ED;
    border-top: none;
	border-bottom-width: 2px;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	margin-top: 0 !important;
}
.payment .plan .features li {
    padding: 15px 0;
	/*border-top: 1px solid #CED7E0;*/
	border-top: 1px solid #BCC7D1;
}
.payment .plan .features li:first-child {
	border: none;
}
.payment .plan .features li i {
	margin-right: 10px;
}
.payment.col-4 .plan header {
	padding: 40px;
}
.payment.col-4 .plan h2 {
	font-size: 18px;
}
.payment.col-4 .plan .price .amount {
	font-size: 90px;
}
.payment.col-4 .plan .features {
    padding: 20px 30px;
}

/*===================================================================================*/
/*	CUSTOM CSS STYLES
/*===================================================================================*/

/* Insert your own styles in here! */

.divider {
	width: 100%;
	height: 1px;
	margin: 7px 0 7px 0;
	background: linear-gradient(to right, #f27a24 , #212121);
}

.divider2 {
	width: 100%;
	height: 1px;
	margin: 7px 0 7px 0;
	background: linear-gradient(to right, #212121 , #f27a24);
}

strong {
	color: #ea904f;
}

.confirmation-message {
	background-color: #24d4f2;
	color: #FFF;
	font-size: 16px;
	padding: 15px;
	margin-bottom: 10px;
}









#mr-overlay {

	position: fixed; /* Sit on top of the page content */
	display: none;
	width: 100%; /* Full width (cover the whole page) */
	height: 100%; /* Full height (cover the whole page) */
	top: 0; 
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.85); /* Black background with opacity */
	z-index: 9996; /* Specify a stack order in case you're using a different order for other elements */

}

.mr-overlay-container {

	width: 100%;
	height: 100%; 
	
	display: flex;
    vertical-align: middle;

}

.mr-overlay-content {

	position: relative;
	z-index: 9998; /* Specify a stack order in case you're using a different order for other elements */
	
	max-height: calc(100% - 40px);
	overflow-y: auto;
	margin: auto; 
	border: 1px solid #212121; 
	background-color: #FFF; 
	padding: 20px; 
}

.main-image {
	background-image: url(../images/art/slider02.jpg); 
	border-bottom: 1px solid #3a3a3a; 
	background-size: cover; 
	background-position: right;
}

.logo {
	height: 90px;
}

.logo-heading {
	color: #757575 !important; 
	font-weight: 400; 
	font-size: 33px;
	padding-top: 7px;
}

@media screen and (max-width: 400px) {
	
	.mr-overlay-content {
		max-width: 100%; 
	}	
	
}

@media screen and (min-width: 401px) and (max-width: 720px) {
	
	.mr-overlay-content {
		min-width: 500px;
		max-width: 600px; 
	}	
	
	.main-image {
		padding: 20px 0 0 35px; 
	}
	
	.logo {
		height: 40px;
	}
	
	.logo-heading {
		font-size: 20px;
	}
				
}

@media screen and (min-width: 721px) and (max-width: 1280px) {
	
	.mr-overlay-content {
		min-width: 500px;
		max-width: 650px; 
	}	
				
}

@media screen and (min-width: 1281px) and (max-width: 1440px) {
	
	.mr-overlay-content {
		min-width: 500px;
		max-width: 700px; 
	}	
				
}

@media screen and (min-width: 1441px) and (max-width: 1920px) {
	
	.mr-overlay-content {
		min-width: 550px;
		max-width: 750px; 
	}	
	
	.main-image {
		padding: 150px 0 0 100px; 
	}
	
}

@media screen and (min-width: 1921px) {
	
	.mr-overlay-content {
		min-width: 500px;
		max-width: 800px; 
	}				
}