@font-face{
    font-family:"Avenir";
    src:url("fonts/Avenir.eot?#iefix");
    src:url("fonts/Avenir.eot?#iefix") format("eot"),url("fonts/Avenir.woff2") format("woff2"),url("fonts/Avenir.woff") format("woff"),url("fonts/Avenir.ttf") format("truetype"),url("fonts/Avenir.svg#Avenir") format("svg");
    font-weight:300
}
@font-face{
    font-family:"Avenir";
    src:url("fonts/Avenir600.eot?#iefix");
    src:url("fonts/Avenir600.eot?#iefix") format("eot"),url("fonts/Avenir600.woff2") format("woff2"),url("fonts/Avenir600.woff") format("woff"),url("fonts/Avenir600.ttf") format("truetype"),url("fonts/Avenir.svg600#Avenir600") format("svg");
    font-weight:300
}
body {
	font-family: "Avenir";
}
p {
	font-size: 18px;
	line-height: 32px;
	color: #6d7a8c;
}

.main-header .logo {
	max-height: 33px;
}
.navbar.navbar-default {
	margin-bottom: 0px;
}
.navbar-brand {
	padding:15px 15px;
}
.navbar-nav li {
	text-transform: uppercase;
	font-size: 12px;
	left: 1.5px;
	font-weight: bold;
}
.theme-list {
	padding: 0px 15px;
}
.theme-list li {
	margin-bottom: 10px;
}
.theme-list li i {
	color: #63b76c;
	margin-right: 2px;
}
.page-header {
	margin-top: 66px;
	margin-bottom: 30px;
}
.buy-section {
	background: #111;
	margin-top: 30px;
	padding: 60px 0px 80px 0px;
}
.buy-section h1 {
	color: #fff;
	margin-bottom: 30px;
}
.btn {
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 13px;
	font-weight: bold;
}

.buy-section .btn {
	padding: 15px 30px;
}
.btn-group-lg>.btn, .btn-lg {
	font-size: 14px;
	padding: 16px 30px;
}
.intro-header {
	padding: 0px 0px; 
	text-align: left;
	position: relative;
	
	color: #fff;
	background: url('img/background.jpg');
	background-repeat: no-repeat;
	background-size: cover;
}
.intro-header .container {
	
}
@media only screen and (min-width: 768px) {
	.intro-header .container {
		display: flex;
	align-items: center;
	}
}
.intro-header h1 {
	color: #fff;
	font-size: 50px;
	margin-bottom: 25px;
	font-weight: 600;
}
.intro-header .content{
	display: flex;
	padding: 0px;
	-webkit-display:flex;
	align-items: center;
	height: 80vh;
}
.intro-text img {
	text-align: center;
	width: 50px;
	height: 50px;
	margin: auto;
	margin-bottom: 15px;
}
.intro-text {
	padding: 11vh 0px;
}
.intro-header p {
	color: #eaeaea;
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 34px;
}
.intro-header:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	z-index: 1;
	left: 0;
	background-color: rgba(0,0,0,0.34);
}
.intro-header .container {
	position: relative;
	z-index: 2;
}
.intro-header .logo {
	margin: 0 auto;
	max-width: 360px;
	margin-bottom: 30px;
}
.intro-header .btn {
	margin-right: 15px;
}
.btn-primary {
    background: #6f14f1;
}
.btn-secondary {
	background: #fff;

}
#demos {
	padding-top:40px;
	background: #f7f7f7;
	padding-bottom: 50px;
	margin-bottom: 10px;
}
#styles {
	margin-bottom: 50px;
}
#demos .demo {
	border: 1px solid #dadada;
}
#demos h2 {
	margin-bottom: 50px;
}
#features {
	background: #F7F7F7;
}
#other-features {
	margin-top: 60px;
}
.feature {
	overflow: hidden;
	display: flex;
}
.feature .content {
	display: flex;
	align-items: center;
	text-align: left;
	
	min-height: 600px;
}
.feature .content.right {
	text-align: right;
}
.feature .content.right .feature-title:after {
	left: unset;
	right: 0;
}

.inner {
	position: relative;
	padding: 30px 30px;
}
.feature .content h2, .feature .content p {
	flex-shrink: 0;
	flex-grow: 1;
}
.feature .feature-img {

	padding: 40px;
	display: flex;
	align-items: center;
}
.feature-box .wrpper {
	text-align: center;
	min-height: 290px;
	margin-bottom: 30px;
	border: 1px solid #eaeaea;
	padding: 20px 15px;
}
.feature-box h3 {
	font-size: 22px;
	position: relative;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.feature-box h3:after {
	content: "";
	width: 30px;
	height: 2px;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	position: absolute;
	background: #3f51b5;
}
.feature-box p {
	font-size: 14px;
	line-height: 24px;
}
.feature-box .thumb {
	text-align: center;
	display: table;
	margin: auto;
	padding: 16px;
	background: #eaeaea;
	border-radius: 50%;
}
.styles {
	margin-top: 30px;
}
.feature-title.text-center:after {
	left: 0;
	right: 0;
}
.feature-box img {
	width: 40px;
	height: 40px;
}
.feature .feature-img.light-blue {
	background: #f3f7f8;

}
.style {
	margin-bottom: 20px;
}
.style span {
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 1px;

}
.feature .feature-img.light-green {
	background: #f2f7f2;

}
.feature-title {
	position: relative;
	margin-top: 0px;
	padding-bottom: 30px;
	margin-bottom: 30px;
	font-size: 38px;
	line-height: 46px;
}
.feature-title:after {
	content: "";
	width: 60px;
	height: 2px;
	bottom: 0;
	left: 0;

	margin: auto;
	position: absolute;
	background: #3f51b5;
}
h1.feature-title {
	
	margin-bottom: 40px;
	text-align: center;

}
h1.feature-title:after {
	left: 0;
	right: 0;
}
#demos .panel-default>.panel-heading {
	font-size: 18px;
	font-weight: bold;
}
#demos .demo {
	position: relative;
	margin-bottom: 30px;
	overflow: hidden;
}
#demos .demo .thumbinal {
	max-height: 481px;
}
#demos .demo p {
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	width: 100%;
	height: 30px;
	line-height: 30px;
	color: #fff;
	font-size: 14px;
	background: rgba(0,0,0,0.8);
	transform: translateY(30px);
	-webkit-transform:translateY(30px);
	transition: transform 300ms;
	-webkit-transition: transform 300ms;
}
#demos .demo:hover p {
	transform: translateY(0);
	-webkit-transform:translateY(0);
}