/*! themes/_colors.scss | Bulkit | CSS Ninja */
/* ==========================================================================
Bulkit general color variables 
========================================================================== */
/***
TABLE OF CONTENTS
=============================================================================
0. Bulkit colors
1. State colors
2. Social colors
3. Predefined gradients
4. Predefined box shadows
=============================================================================
***/
/* ==========================================================================
0. Bulkit colors
========================================================================== */
/* ==========================================================================
1. State colors
========================================================================== */
/* ==========================================================================
2. Social colors
========================================================================== */
/* ==========================================================================
3. Predefined gradients
========================================================================== */
/* Chrome 10-25, Safari 5.1-6 */
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
/* ==========================================================================
4. Predefined box shadows
========================================================================== */
/*! themes/_main.scss | Bulkit | CSS Ninja */
/* ==========================================================================
Main theme variables and styles (Main theme is used in "Startup Kit", in "Landing kit v1" and in all components pages)
========================================================================== */
/***
TABLE OF CONTENTS
=============================================================================
0. Theme color variables
1. Theme gradient
2. Box shadows
3. Pageloader
4. Theme specific Hero
=============================================================================
***/
/* ==========================================================================
0. Theme color variables
========================================================================== */
/* ==========================================================================
1. Theme gradient
========================================================================== */
/* ==========================================================================
2. Box shadows
========================================================================== */
/* ==========================================================================
3. Pageloader
========================================================================== */
.pageloader {
	background-color: #7F00FF;
	background: linear-gradient(to top, #7F00FF, #7F00FF) !important;
}

/* ==========================================================================
4. Theme specific Hero
========================================================================== */
.hero.is-theme-secondary, .section.is-theme-secondary {
	background-color: #7F00FF;
	background: linear-gradient(to right, #7F00FF, #7F00FF);
	background: linear-gradient(to top, #7F00FF, #7F00FF);
}

/*.hero.is-theme-secondary, .section.is-theme-secondary {
	background-color: #46f13a;
	background: linear-gradient(to right, #46f13a, #009a2f);
	background: linear-gradient(to top, #d4ec10, #1b9e0b);
}*/
.hero.is-theme-secondary, .section.is-theme-secondary {
	background-color: #46f13a;
	background: linear-gradient(to right, #54e808, #1cb113);
    background: linear-gradient(-15deg, #54e808, #1cb113);
	background: linear-gradient(-15deg, #54e808, #2fc30f);
	/*background: linear-gradient(-14deg, #2bc2ff, #0d7d06);*/
	background: linear-gradient(-14deg, #ff75e1, #46033d);
	background: -webkit-gradient(linear, right bottom, left top, from(#4556ac), to(#922c88));
	background: -webkit-linear-gradient(142deg, rgba(128,0,128,1) 0%, rgba(0,0,0,1) 100%); 
	/*background:  -webkit-linear-gradient(142deg, #4556ac 0%, #922c88 60%);*/ 

	background: #ad5389;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #3c1053, #ad5389);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #3c1053, #ad5389); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

	background: #3c1053;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #3c1053, #b718a4);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #3c1053, #b718a4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.hero.is-theme-secondary .title, .section.is-theme-secondary .title {
	color: #fff;
}

.hero.is-theme-secondary .subtitle, .section.is-theme-secondary .subtitle {
	color: #fff;
}

/*! _hero.scss | Bulkit | CSS Ninja */
/* ==========================================================================
Hero related styles
========================================================================== */
/***
TABLE OF CONTENTS
=============================================================================
0. Hero general styles
1. Hero body 
2. Hero footer
3. Parallax Overlay
=============================================================================
***/
/* ==========================================================================
0. Hero general styles
========================================================================== */
.hero.is-relative {
	position: relative;
}

.hero.is-cover {
	background-size: cover !important;
}

.hero.is-theme-primary {
	background-color: #4FC1EA;
}

.hero.is-theme-primary .title {
	color: #fff;
}

.hero.is-theme-primary .subtitle {
	color: #fff;
}

.hero.is-theme-secondary {
	background-color: #7F00FF;
}

.hero.is-theme-secondary .title {
	color: #fff;
}

.hero.is-theme-secondary .subtitle {
	color: #fff;
}

.hero.is-theme-accent {
	background-color: #7F00FF;
}

.hero.is-theme-accent .title {
	color: #fff;
}

.hero.is-theme-accent .subtitle {
	color: #fff;
}

.hero.is-theme-info {
	background-color: #039BE5;
}

.hero.is-theme-info .title {
	color: #fff;
}

.hero.is-theme-info .subtitle {
	color: #fff;
}

.hero.is-theme-success {
	background-color: #00b289;
}

.hero.is-theme-success .title {
	color: #fff;
}

.hero.is-theme-success .subtitle {
	color: #fff;
}

.hero.is-theme-warning {
	background-color: #eda514;
}

.hero.is-theme-warning .title {
	color: #fff;
}

.hero.is-theme-warning .subtitle {
	color: #fff;
}

.hero.is-theme-danger {
	background-color: #FF7273;
}

.hero.is-theme-danger .title {
	color: #fff;
}

.hero.is-theme-danger .subtitle {
	color: #fff;
}

.hero.is-feature-grey {
	background-color: #fbfbfb;
}

.hero.is-feature-grey .title {
	color: #444F60;
}

.hero.is-feature-grey .subtitle {
	color: #444F60;
}

.hero.is-light-grey {
	background-color: #EFF4F7;
	background-image: -webkit-linear-gradient(309deg, #d0e0ec 0%, #f5f7fa 71%, white 100%);
	background-image: linear-gradient(141deg, #d0e0ec 0%, #f5f7fa 71%, white 100%);
}

.hero.is-light-grey .title.dark {
	color: #444F60;
}

.hero.is-light-grey .title.theme {
	color: #4FC1EA;
}

.hero.is-light-grey .subtitle {
	margin-top: 0 !important;
	padding-right: 20%;
	line-height: 1.6 !important;
}

.hero.is-coal {
	background-color: #444444;
}

.hero.is-coal .title {
	color: #fff;
}

.hero.is-coal .subtitle {
	color: #fff;
}

/* ==========================================================================
1. Hero body 
========================================================================== */
.hero-body {
	background-size: cover !important;
	background-repeat: no-repeat !important;
}

.hero-body .title.main-title {
	color: #fff;
	z-index: 999;
	font-size: 3.5rem;
}

.hero-body .title.big-title {
	color: #444F60;
	z-index: 999;
	font-size: 4rem;
}

.hero-body .title.page-title {
	font-size: 3.5rem;
}

.hero-body .title.medium-title {
	font-size: 2.5rem;
}

.hero-body .title.small-title {
	font-size: 2rem;
}

.hero-body .subtitle.page-subtitle {
	font-size: 1.8rem;
}

.hero-body .clients-small {
	display: flex;
	justify-content: flex-start;
	align-content: center;
	align-items: center;
	padding: 15px 0;
}

.hero-body .clients-small img {
	height: 42px;
	margin: 0 5px;
}

.hero-body .clients-small.centered {
	justify-content: center !important;
}

.hero-body.is-relative {
	position: relative;
}

.hero-head,
.hero-foot {
	flex-grow: 0;
	flex-shrink: 0;
}

.hero-body {
	flex-grow: 1;
	flex-shrink: 0;
	padding: 3rem 1.5rem;
	padding-top: 0;
	padding-bottom:80px;
}


/* ==========================================================================
2. Hero footer
========================================================================== */
.hero-foot img.partner-logo {
	height: 70px !important;
}

/* ==========================================================================
3. Parallax Overlay
========================================================================== */
.parallax-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background-color: #333;
	opacity: 0.4;
}

/*! _landing.scss | Bulkit | CSS Ninja */
/* ==========================================================================
Landing kit v1 SCSS file
========================================================================== */
/***
TABLE OF CONTENTS
=============================================================================
0. Animated Hero background
1. Hero Header styles
2. Landing page styles
3. Video embed
4. Pricing page
5. Footer styles
6. Login and Sign up
7. Tablet media queries (portrait orientation)
=============================================================================
***/
/* ==========================================================================
0. Animated Hero background
========================================================================== */
#landing-hero {
	background: #7F00FF url(../images/bg/shapes/icon-bg.png) repeat 0 0;
	-webkit-animation: 18s linear 0s normal none infinite animate;
	-moz-animation: 18s linear 0s normal none infinite animate;
	-ms-animation: 18s linear 0s normal none infinite animate;
	-o-animation: 18s linear 0s normal none infinite animate;
	animation: 18s linear 0s normal none infinite animate;
}

@-webkit-keyframes animate {
	from {
		background-position: 0 0;
	}

	to {
		background-position: 0 -1450px;
	}
}

@-moz-keyframes animate {
	from {
		background-position: 0 0;
	}

	to {
		background-position: 0 -1450px;
	}
}

@-ms-keyframes animate {
	from {
		background-position: 0 0;
	}

	to {
		background-position: 0 -1450px;
	}
}

@-o-keyframes animate {
	from {
		background-position: 0 0;
	}

	to {
		background-position: 0 -1450px;
	}
}

@keyframes animate {
	from {
		background-position: 0 0;
	}

	to {
		background-position: 0 -1450px;
	}
}
/* ==========================================================================
1. Hero Header styles
========================================================================== */
.hero.hero-waves-gray:before {
	background: transparent url(../img/wavy-gray.png) no-repeat scroll 0 bottom/100% auto;
	content: "";
	height: 321px;
	width: 100%;
	z-index: 0 !important;
	position: absolute;
	bottom: -1px;
	left: 0;
}
.hero.hero-waves-white:before {
	background: transparent url(../img/wavy-white.png) no-repeat scroll 0 bottom/100% auto;
	content: "";
	height: 321px;
	width: 100%;
	z-index: 0 !important;
	position: absolute;
	bottom: -1px;
	left: 0;
}

@media (max-width: 768px) {
.hero figure{
text-align:center
}
	.hero figure img {
		height: 390px!important;

	}
}


.header-caption {
	margin-top: -80px;
	padding: 0 20px;
	text-align: left;
}

.header-caption .landing-title {
	font-family: "Nexa Bold", sans-serif;
	/*font-family:'Montserrat', sans-serif;*/
	font-size: 3.4rem;
	/*font-weight: 900 !important;*/
	font-weight: 900 !important;
	/*margin-bottom: 0 !important;*/
	color: #fff;
}
.header-caption .landing-title strong {
	/*font-weight: 700 !important;*/
}
.header-caption .landing-title.is-big {
	font-size: 4rem;
}

.header-caption .subtitle {
	font-size:1.3rem;
	line-height:1.7rem;
	margin-bottom: 0;
	padding: 10px 0;
}

.header-caption.is-centered {
	text-align: center !important;
}

@media (max-width: 767px) {
	.header-caption {
		text-align: center;
		padding: 40px 10px;
	}

	.header-caption .landing-title {
		font-size: 2.5rem;
		min-height: 240px;
	}
}

@media (max-width: 768px) {
	.header-caption {
		margin-top: 0 !important;
	}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
	.header-caption {
		/*text-align: center;*/
	}
}
/* ==========================================================================
2. Landing page styles
========================================================================== */
.section-title-wrapper .section-title-landing {
	font-family: "Nexa Bold", sans-serif;
	font-size: 2.6rem;
	color: #444F60;
	padding: 10px 0;
}

.section-title-wrapper h4 {
	padding: 20px 40px;
	font-family: "Nexa Light", sans-serif;
	font-weight: 300;
	font-size: 1.2rem;
	color: #999;
}

.half-mockup {
	position: absolute;
	bottom: 0;
	max-height: 550px;
}

.phone-slide {
	background-position: center left;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: 50% 50%;
	vertical-align: top;
	padding: 800px 30px 30px 30px;
}

.phone-slide.is-first {
	background-image: url(../images/illustrations/mockups/landing/phone-slide-1.png);
}

.phone-slide.is-second {
	background-image: url(../images/illustrations/mockups/landing/phone-slide-2.png);
}

.phone-slide.is-third {
	background-image: url(../images/illustrations/mockups/landing/phone-slide-3.png);
}

.phone-slide.is-fourth {
	background-image: url(../images/illustrations/mockups/landing/phone-slide-4.png);
}

.featured-svg-lg {
	max-width: 550px;
	max-height: 550px;
}

.wavy-icon-box i {
	font-size: 3.8rem;
	font-weight: normal;
	color: #7F00FF;
}

.wavy-icon-box .box-title {
	font-family: "Nexa Light", sans-serif;
	padding: 5px 0;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	color: #7F00FF;
}

.wavy-icon-box .box-content {
	color: #999;
}

.square-icon-box.is-landing .box-title {
	font-family: "Nexa Light", sans-serif;
	font-size: 1.2rem;
	font-weight: 700;
	color: #444F60;
}

.square-icon-box.is-landing .box-text {
	font-size: 14px;
}

.quick-feature.is-handwritten {
	font-size: 2.1rem !important;
	font-family: "Nexa Bold", sans-serif;
	font-weight: 400 !important;
	margin-bottom: 0.8rem !important;
}

.quick-feature.is-handwritten .bg-number {
	padding-right: 10px !important;
	font-family: "Roboto" !important;
}

.event-card.is-wavy h2.text-title {
	font-family: "Nexa Bold", sans-serif;
	text-transform: none;
	font-size: 1.35em;
}

.event-card.is-wavy p.text-subtitle {
	font-family: "Nexa Light", sans-serif;
	font-size: 0.9rem;
}

.testimonials.is-wavy .testimonial-name h3 {
	font-family: "Nexa Bold", sans-serif;
}

@media (max-width: 768px) {
	.testimonial-item {
		margin: 40px 15px !important;
	}

	.testimonial-item .testimonial-content p {
		padding: 20px !important;
	}
}

.bottom-spacer {
	margin-bottom: 80px;
	min-height: 100px;
}

.small-feature {
	padding: 5px 0;
	font-family: "Nexa Bold", sans-serif;
	font-size: 1.3rem;
}