first commit
This commit is contained in:
Vendored
+6
File diff suppressed because one or more lines are too long
Vendored
+6
File diff suppressed because one or more lines are too long
@@ -0,0 +1,259 @@
|
||||
/*
|
||||
Table of contents
|
||||
===========================================
|
||||
- General Style
|
||||
- Utility Classes
|
||||
- Button Style
|
||||
- Form Elements
|
||||
- Page Header
|
||||
- Breadcrumb
|
||||
- Tab
|
||||
- Pagination
|
||||
- Section Title
|
||||
===========================================
|
||||
*/
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- General Style
|
||||
------------------------------------
|
||||
*/
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
*:focus {
|
||||
outline: 0;
|
||||
}
|
||||
html {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
body {
|
||||
background: #fff;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
button, input, textarea {
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
/*
|
||||
------------------------------------
|
||||
- Utility Classes
|
||||
------------------------------------
|
||||
*/
|
||||
.bg-light {
|
||||
background: #f4f4f5;
|
||||
}
|
||||
.pn {
|
||||
padding: 0px !important;
|
||||
}
|
||||
.inner-padding {
|
||||
padding: 100px 0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.typed-cursor{
|
||||
opacity: 1;
|
||||
-webkit-animation: blink 0.7s infinite;
|
||||
-moz-animation: blink 0.7s infinite;
|
||||
animation: blink 0.7s infinite;
|
||||
display: none;
|
||||
}
|
||||
@keyframes blink{
|
||||
0% { opacity:1; }
|
||||
50% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
@-webkit-keyframes blink{
|
||||
0% { opacity:1; }
|
||||
50% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
@-moz-keyframes blink{
|
||||
0% { opacity:1; }
|
||||
50% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
/*
|
||||
------------------------------------
|
||||
- Button Style
|
||||
------------------------------------
|
||||
*/
|
||||
.btn {
|
||||
height: 40px;
|
||||
padding: 0px 55px;
|
||||
line-height: 35px;
|
||||
-webkit-border-radius: 30px;
|
||||
-moz-border-radius: 30px;
|
||||
-ms-border-radius: 30px;
|
||||
-o-border-radius: 30px;
|
||||
border-radius: 30px;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.btn-fill {
|
||||
background: #8cbdcf;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border-color: #8cbdcf;
|
||||
}
|
||||
.btn-fill:hover {
|
||||
background: #74a9bc;
|
||||
border-color: #74a9bc;
|
||||
color: #fff !important;
|
||||
}
|
||||
.btn-outline {
|
||||
background: transparent;
|
||||
color: #8cbdcf;
|
||||
font-weight: 400;
|
||||
border-color: #8cbdcf;
|
||||
}
|
||||
.btn-outline:hover {
|
||||
background: transparent;
|
||||
border-color: #74a9bc;
|
||||
}
|
||||
|
||||
/* Blue */
|
||||
.btn-fill-blue {
|
||||
background: #7d4ccc;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border-color: #7d4ccc;
|
||||
}
|
||||
.btn-fill-blue:hover {
|
||||
background: #7045b6;
|
||||
border-color: #7045b6;
|
||||
color: #fff !important;
|
||||
}
|
||||
.btn-outline-blue {
|
||||
background: transparent;
|
||||
color: #7d4ccc;
|
||||
font-weight: 400;
|
||||
border-color: #7d4ccc;
|
||||
}
|
||||
.btn-outline-blue:hover {
|
||||
background: transparent;
|
||||
border-color: #7045b6;
|
||||
}
|
||||
|
||||
/* Megento */
|
||||
.btn-fill-megento {
|
||||
background: #ed145b;
|
||||
color: #fff !important;
|
||||
font-weight: 400;
|
||||
border-color: #ed145b;
|
||||
}
|
||||
.btn-fill-megento:hover {
|
||||
background: #d31050;
|
||||
border-color: #d31050;
|
||||
color: #fff !important;
|
||||
}
|
||||
.btn-fill-megento:hover a {
|
||||
color: #fff !important;
|
||||
}
|
||||
.btn-outline-megento {
|
||||
background: transparent;
|
||||
color: #ed145b;
|
||||
font-weight: 400;
|
||||
border-color: #ed145b;
|
||||
}
|
||||
.btn-outline-megento:hover {
|
||||
background: transparent;
|
||||
border-color: #d31050;
|
||||
}
|
||||
/*
|
||||
------------------------------------
|
||||
- Form Elements
|
||||
------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- Page Header
|
||||
------------------------------------
|
||||
*/
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- Bread Crumb
|
||||
------------------------------------
|
||||
*/
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- Pagination
|
||||
------------------------------------
|
||||
*/
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- Tab
|
||||
------------------------------------
|
||||
*/
|
||||
|
||||
/*
|
||||
---------------------------------
|
||||
- Customize Owl Carousel
|
||||
---------------------------------
|
||||
*/
|
||||
.owl-carousel .owl-item img {
|
||||
width: auto !important;
|
||||
max-width: 100% !important;
|
||||
margin: auto !important;
|
||||
}
|
||||
.owl-dots {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 0px;
|
||||
}
|
||||
.owl-dot {
|
||||
background: #ededed;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
-o-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.owl-dot.active {
|
||||
background: #666;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
-o-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
Vendored
+4
File diff suppressed because one or more lines are too long
Vendored
+6
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
* Owl Carousel v2.1.1
|
||||
* Copyright 2013-2016 David Deutsch
|
||||
* Licensed under MIT (https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE)
|
||||
*/
|
||||
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{display:none}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:-webkit-transform .1s ease;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-webkit-transform:scale(1.3,1.3);-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
|
||||
Vendored
+5
@@ -0,0 +1,5 @@
|
||||
/**
|
||||
* Owl Carousel v2.1.1
|
||||
* Copyright 2013-2016 David Deutsch
|
||||
* Licensed under MIT (https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE)
|
||||
*/
|
||||
@@ -0,0 +1,256 @@
|
||||
/* Medium Layout: 1280px. */
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {}
|
||||
/* Tablet Layout: 768px. */
|
||||
|
||||
@media only screen and (min-width: 768px) and (max-width: 1024px) {
|
||||
/* Header Section */
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-collapse.collapse.in {
|
||||
display: block!important;
|
||||
border-top: 1px solid #fff;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.collapsing {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-right {
|
||||
float: left !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
float: left !important;
|
||||
width: 100%;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Hero Section */
|
||||
.tab-slide .owl-stage-outer,
|
||||
.tab-slide .owl-dots {
|
||||
display: none;
|
||||
}
|
||||
.tab-carousel-caption {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Feature Section */
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
/* Pricing Section */
|
||||
.pricing-pill {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
}
|
||||
/* Mobile Layout: 320px. */
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-nav {
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
/* Hero Section */
|
||||
|
||||
.tab-carousel-inner {
|
||||
position: relative;
|
||||
min-height: 200px !important;
|
||||
padding: 180px 10px 80px 10px;
|
||||
right: 0px;
|
||||
}
|
||||
.tab-carousel-caption {
|
||||
width: 100%;
|
||||
padding: 85px 15px 40px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.app-icon {
|
||||
left: 10px;
|
||||
}
|
||||
.tab-carousel-box {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
.tab-slide {
|
||||
right: 0px;
|
||||
display: none !important;
|
||||
}
|
||||
.hero-caption {
|
||||
display: none;
|
||||
}
|
||||
/* Feature Section */
|
||||
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
/* Pricing Section */
|
||||
|
||||
.pricing-table li {
|
||||
width: 100%;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
.pricing-table li:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
/* Download Section */
|
||||
|
||||
.store-icon a img {
|
||||
max-width: 40%;
|
||||
}
|
||||
/* Footer Section */
|
||||
|
||||
.footer-box h2 {
|
||||
font-size: 24px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/* Copyright Section */
|
||||
|
||||
.copyright-area {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 481px) and (max-width: 767px) {
|
||||
/* Hero Section */
|
||||
|
||||
.hero-area {
|
||||
min-height: 0px;
|
||||
height: auto;
|
||||
}
|
||||
.hero-caption {
|
||||
left: -120px;
|
||||
top: 350px;
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 240px) and (max-width: 480px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-default .navbar-brand {
|
||||
width: 50%;
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
/* Hero Section */
|
||||
/*.hero-caption {left: -110px;}
|
||||
.hero-caption .sublead {font-size:20px;margin-bottom: -10px;}
|
||||
.hero-caption .lead {font-size: 40px;margin-bottom: -10px;}
|
||||
.hero-caption .lead-text {font-size: 14px;}*/
|
||||
/* Pricing Section */
|
||||
|
||||
.pricing-pill li {
|
||||
padding: 10px 25px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,265 @@
|
||||
/* Medium Layout: 1280px. */
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {}
|
||||
|
||||
/* Tablet Layout: 768px. */
|
||||
@media only screen and (min-width: 768px) and (max-width: 1024px) {
|
||||
/* Header Section */
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-collapse.collapse.in {
|
||||
display: block!important;
|
||||
border-top: 1px solid #fff;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.collapsing {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-right {
|
||||
float: left !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
float: left !important;
|
||||
width: 100%;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Hero Section */
|
||||
.dark-mockup-slider-area {
|
||||
top: 40px;
|
||||
}
|
||||
.dark-mockup-slider,
|
||||
.dark-mockup-slider-area {
|
||||
display: none;
|
||||
}
|
||||
.hero-caption {
|
||||
height: 100vh;
|
||||
}
|
||||
.hero-caption-inner .lead {
|
||||
font-size: 120px;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.hero-caption-inner,
|
||||
.hero-caption-inner .lead-text {
|
||||
text-align: center;
|
||||
}
|
||||
.hero-caption-inner .sublead {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Feature Section */
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
/* Pricing Section */
|
||||
.pricing-pill {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table {
|
||||
margin-top: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mobile Layout: 320px. */
|
||||
@media only screen and (max-width: 767px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
background: rgba(1,1,1,0.8);
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-nav {
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
/* Hero Section */
|
||||
|
||||
.dark-mockup-slider-area {
|
||||
top: 40px;
|
||||
}
|
||||
.dark-mockup-slider,
|
||||
.dark-mockup-slider-area {
|
||||
display: none;
|
||||
}
|
||||
.hero-caption {
|
||||
height: 100vh;
|
||||
}
|
||||
.hero-caption-inner .lead {
|
||||
font-size: 60px;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.hero-caption-inner,
|
||||
.hero-caption-inner .lead-text {
|
||||
text-align: center;
|
||||
}
|
||||
.hero-caption-inner .sublead {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
/* Feature Section */
|
||||
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.feature-right .single-feature-item:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
/* Pricing Section */
|
||||
|
||||
.pricing-table li {
|
||||
width: 100%;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
.pricing-table li:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
/* Download Section */
|
||||
|
||||
.store-icon a img {
|
||||
max-width: 40%;
|
||||
}
|
||||
/* Footer Section */
|
||||
|
||||
.footer-box h2 {
|
||||
font-size: 24px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/* Copyright Section */
|
||||
|
||||
.copyright-area {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 481px) and (max-width: 767px) {
|
||||
/* Hero Section */
|
||||
|
||||
.hero-area {
|
||||
min-height: 0px;
|
||||
height: auto;
|
||||
}
|
||||
.hero-caption {
|
||||
left: -120px;
|
||||
top: 350px;
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 240px) and (max-width: 480px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-default .navbar-brand {
|
||||
width: 50%;
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
/* Pricing Section */
|
||||
.pricing-pill li {
|
||||
padding: 10px 25px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,276 @@
|
||||
/* Medium Layout: 1280px. */
|
||||
|
||||
@media only screen and (min-width: 992px) and (max-width: 1200px) {}
|
||||
|
||||
/* Tablet Layout: 768px. */
|
||||
@media only screen and (min-width: 768px) and (max-width: 1024px) {
|
||||
|
||||
/* Header Section */
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-header {
|
||||
float: none;
|
||||
}
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-collapse.collapse.in {
|
||||
display: block!important;
|
||||
border-top: 1px solid #fff;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.collapsing {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-right {
|
||||
float: left !important;
|
||||
/*margin-top: 5px !important;*/
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
float: left !important;
|
||||
width: 100%;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Hero Section */
|
||||
.ball,
|
||||
.paper,
|
||||
.coffee,
|
||||
.plant,
|
||||
.glass {
|
||||
display: none;
|
||||
}
|
||||
.hero-caption {
|
||||
left: 30px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
.hero-caption .lead {
|
||||
font-size: 84px;
|
||||
}
|
||||
|
||||
/* Feature Section */
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
/* Pricing Section */
|
||||
.pricing-pill {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table {
|
||||
margin-top: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mobile Layout: 320px. */
|
||||
@media only screen and (max-width: 767px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.navbar-default .navbar-nav {
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
.navbar-default .navbar-nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a::after {
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
}
|
||||
/* Hero Section */
|
||||
|
||||
.hero-area {
|
||||
min-height: 0px;
|
||||
height: 100vh;
|
||||
}
|
||||
.mockup-slider {
|
||||
top: 80px;
|
||||
bottom: 0px;
|
||||
}
|
||||
.hero-social-share {
|
||||
text-align: center;
|
||||
}
|
||||
.hero-caption {
|
||||
left: -120px;
|
||||
transform: rotateZ(-90deg);
|
||||
display: none;
|
||||
}
|
||||
.hero-caption .sublead {
|
||||
font-size: 24px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
.hero-caption .lead {
|
||||
font-size: 48px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
.hero-caption .lead-text {
|
||||
font-size: 16px;
|
||||
}
|
||||
/* Feature Section */
|
||||
|
||||
.single-feature-item {
|
||||
text-align: center;
|
||||
}
|
||||
.single-feature-slide {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
/* Pricing Section */
|
||||
|
||||
.pricing-table li {
|
||||
width: 100%;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
.pricing-table li:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
/* Download Section */
|
||||
|
||||
.store-icon a img {
|
||||
max-width: 40%;
|
||||
}
|
||||
/* Footer Section */
|
||||
|
||||
.footer-box h2 {
|
||||
font-size: 24px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/* Copyright Section */
|
||||
|
||||
.copyright-area {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 481px) and (max-width: 767px) {
|
||||
/* Hero Section */
|
||||
|
||||
.hero-area {
|
||||
min-height: 0px;
|
||||
height: auto;
|
||||
}
|
||||
.hero-caption {
|
||||
left: -120px;
|
||||
top: 350px;
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
}
|
||||
/* Wide Mobile Layout: 480px. */
|
||||
|
||||
@media only screen and (min-width: 240px) and (max-width: 480px) {
|
||||
/* Header Section */
|
||||
|
||||
.navbar-default {
|
||||
min-height: 75px;
|
||||
}
|
||||
.navbar-default .navbar-brand {
|
||||
width: 50%;
|
||||
}
|
||||
.navbar-brand > img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.navbar-toggle {
|
||||
margin-top: 20px;
|
||||
border: 0px;
|
||||
}
|
||||
.navbar-default .navbar-toggle .icon-bar {
|
||||
background-color: #fff;
|
||||
}
|
||||
.navbar-default .navbar-toggle:focus,
|
||||
.navbar-default .navbar-toggle:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
.navbar-default .navbar-collapse,
|
||||
.navbar-default .navbar-form {
|
||||
padding-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.nav > li {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
padding: 15px 25px;
|
||||
}
|
||||
/* Hero Section */
|
||||
|
||||
.hero-caption {
|
||||
left: -110px;
|
||||
}
|
||||
.hero-caption .sublead {
|
||||
font-size: 20px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
.hero-caption .lead {
|
||||
font-size: 40px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
.hero-caption .lead-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
/* Pricing Section */
|
||||
|
||||
.pricing-pill li {
|
||||
padding: 10px 25px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,700 @@
|
||||
/*
|
||||
======================================
|
||||
Table of Contents
|
||||
======================================
|
||||
- Basic Style
|
||||
- Links
|
||||
- Section Title Style
|
||||
- Home Page
|
||||
- Preloader
|
||||
- Header Section
|
||||
- Scroll Navigation Section
|
||||
- Hero Section
|
||||
- Feature Section
|
||||
- Pricing Section
|
||||
- Subscribe Section
|
||||
======================================
|
||||
*/
|
||||
/*
|
||||
------------------------------------
|
||||
- Basic Style
|
||||
------------------------------------
|
||||
*/
|
||||
body {
|
||||
background: #fffcf4;
|
||||
}
|
||||
/* Section Title Style */
|
||||
.section-title {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 90px;
|
||||
}
|
||||
.title-left {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.section-title h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 36px;
|
||||
color: #696969;
|
||||
letter-spacing: 0px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.section-title span {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
letter-spacing: 0px;
|
||||
color: #7d4ccc;
|
||||
}
|
||||
.section-title span.small {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
letter-spacing: 0px;
|
||||
color: #7d4ccc;
|
||||
}
|
||||
.section-title p {
|
||||
margin-top: 35px;
|
||||
color: #212121;
|
||||
}
|
||||
.section-title-2 {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.section-title-2 h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 36px;
|
||||
font-weight: 400;
|
||||
color: #212121;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Preloader
|
||||
----------------------------------
|
||||
*/
|
||||
.preloader-area {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
background: rgba(255,255,255,0.95);
|
||||
z-index: 1000000;
|
||||
}
|
||||
.preloader-inner {
|
||||
display: table;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.preloader {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
margin: auto;
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
}
|
||||
.preloader span {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 100%;
|
||||
background: #000000;
|
||||
-webkit-animation: preloader 1.6s linear infinite;
|
||||
animation: preloader 1.6s linear infinite;
|
||||
}
|
||||
.preloader span:last-child {
|
||||
animation-delay:-0.8s;
|
||||
-webkit-animation-delay:-0.8s;
|
||||
}
|
||||
@keyframes preloader {
|
||||
0% {transform: scale(0, 0);opacity:0.5;}
|
||||
100% {transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
@-webkit-keyframes preloader {
|
||||
0% {-webkit-transform: scale(0, 0);opacity:0.5;}
|
||||
100% {-webkit-transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Header Section
|
||||
----------------------------------
|
||||
*/
|
||||
.navbar-area {}
|
||||
.navbar-default {
|
||||
/*background: rgba(167,193,198,0.45);*/
|
||||
background: rgba(1,1,1,0.8);
|
||||
border-bottom: 1px solid rgba(255,255,255,0.3);
|
||||
min-height: 110px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
color: #fff;
|
||||
padding: 40px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a:hover,
|
||||
.navbar-default .navbar-nav > li > a:active,
|
||||
.navbar-default .navbar-nav > li > a:focus {
|
||||
color: #7d4ccc;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > .active > a,
|
||||
.navbar-default .navbar-nav > .active > a:focus,
|
||||
.navbar-default .navbar-nav > .active > a:hover {
|
||||
background: none;
|
||||
color: #7d4ccc;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #7d4ccc;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -1;
|
||||
}
|
||||
.navbar-right, .navbar-nav > li {
|
||||
margin: 0px;
|
||||
}
|
||||
.navbar-dark {
|
||||
background: rgba(1,1,1,0.9);}
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Hero Section
|
||||
----------------------------------
|
||||
*/
|
||||
.hero-area {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background: #F4F4F5;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tab-carousel-area {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.tab-carousel-inner {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: -30px;
|
||||
width: 100%;
|
||||
min-height: 700px;
|
||||
background: #FFFCF4;
|
||||
z-index: 10;
|
||||
padding: 250px 70px 190px 40px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tab-carousel-box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 310px;
|
||||
background: #fff;
|
||||
-moz-box-shadow: 1px 10px 72px -15px #ddd;
|
||||
-webkit-box-shadow: 1px 10px 72px -15px #ddd;
|
||||
-ms-box-shadow: 1px 10px 72px -15px #ddd;
|
||||
-o-box-shadow: 1px 10px 72px -15px #ddd;
|
||||
box-shadow: 1px 10px 72px -15px #ddd;
|
||||
}
|
||||
.tab-slide {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
top: -90px;
|
||||
right: -210px;
|
||||
z-index: 10;
|
||||
}
|
||||
.tab-slide .item {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: right !important;
|
||||
}
|
||||
.tab-carousel-caption {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
padding: 85px 20px 40px 50px;
|
||||
position: relative;
|
||||
}
|
||||
.tab-slide .owl-dot {
|
||||
background: #ededed;
|
||||
}
|
||||
.tab-slide .owl-dot.active {
|
||||
background: #662d91;
|
||||
}
|
||||
.caption-title {
|
||||
color: #7d4ccc;
|
||||
font-size: 38px;
|
||||
margin-bottom: 0px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.caption-subtitle {
|
||||
color: #7d4ccc;
|
||||
margin-bottom: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.app-icon {
|
||||
position: absolute;
|
||||
width: 73px;
|
||||
height: 73px;
|
||||
top: -20px;
|
||||
left: 45px;
|
||||
z-index: 10;
|
||||
}
|
||||
.hero-caption {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 740px;
|
||||
}
|
||||
.hero-caption-inner {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
bottom: 50px;
|
||||
right: -80px;
|
||||
z-index: 11;
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
.hero-caption-inner .lead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 120px;
|
||||
font-weight: 300;
|
||||
color: #212121;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.hero-caption-inner .sublead {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 48px;
|
||||
font-weight: 700;
|
||||
color: #662d91;
|
||||
margin-bottom: -20px;
|
||||
display: block;
|
||||
padding-left: 85px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Feature Section
|
||||
----------------------------------
|
||||
*/
|
||||
.feature-area,
|
||||
.single-feature-item {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.single-feature-item {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.single-feature-item h4 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.single-feature-item.active h4 {
|
||||
color: #7d4ccc;
|
||||
}
|
||||
.single-feature-item p {
|
||||
margin: 0;
|
||||
}
|
||||
.single-feature-slide {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.single-feature-slide .tab-img {
|
||||
display: none;
|
||||
margin: auto;
|
||||
}
|
||||
.single-feature-slide .tab-img.active {
|
||||
display: block;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Pricing Section
|
||||
----------------------------------
|
||||
*/
|
||||
.pricing-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.pricing-content p {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.pricing-content p.fade-text {
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-content p.fade-text a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.pill-title {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #26272d;
|
||||
}
|
||||
.pricing-pill {
|
||||
margin: 10px 0px 80px 0px;
|
||||
padding: 5px;
|
||||
list-style: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border: 1px solid #d5d6d7;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
}
|
||||
.pricing-pill li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
padding: 10px 30px;
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
.pricing-pill li.active {
|
||||
background: #fff;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
color: #26292c;
|
||||
-webkit-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-table,
|
||||
.pricing-list {
|
||||
margin: 30px 0px 0px 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.pricing-table li {
|
||||
display: inline-block;
|
||||
width: 49%;
|
||||
background: #ebebed;
|
||||
padding: 40px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.pricing-table li .lead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 32px;
|
||||
font-weight: 400;
|
||||
color: #26272d;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table li .price-tag {
|
||||
display: inline-block;
|
||||
border: 1px solid #d4d4d5;
|
||||
width: auto;
|
||||
height: 30px;
|
||||
border-radius: 30px;
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
padding: 0px 15px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.pricing-table li .sublead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-list {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin: 45px 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 5px 10px;
|
||||
text-align: center;
|
||||
background: transparent;
|
||||
}
|
||||
.pricing-list li p {
|
||||
margin: 0px;
|
||||
font-style: 16px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.pricing-list li p:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
background-image: url('../img/tic.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
top: 10px;
|
||||
left: -20px;
|
||||
}
|
||||
.pricing-table li.active {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.pricing-table li.active:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
top: -5%;
|
||||
left: -5%;
|
||||
background: #fff;
|
||||
z-index: -1;
|
||||
-webkit-border-radius: 15px;
|
||||
-moz-border-radius: 15px;
|
||||
-ms-border-radius: 15px;
|
||||
-o-border-radius: 15px;
|
||||
border-radius: 15px;
|
||||
-webkit-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-table li.active .btn-outline-blue {
|
||||
background: #7d4ccc;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border-color: #7d4ccc;
|
||||
}
|
||||
.pricing-table li.active .btn-outline-blue:hover {
|
||||
background: #7045b6;
|
||||
border-color: #7045b6;
|
||||
color: #fff !important;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Subscribe Section
|
||||
----------------------------------
|
||||
*/
|
||||
.subscribe-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/subscribe-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.subscribe-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.3;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.subscribe-area h4 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.form-subscribe {
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
border: 0px;
|
||||
border-bottom: 1px solid #f9f9f9;
|
||||
box-shadow: none !important;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Download Section
|
||||
----------------------------------
|
||||
*/
|
||||
.download-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/shape.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom center;
|
||||
background-size: contain;
|
||||
}
|
||||
.download-app {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Footer Section
|
||||
----------------------------------
|
||||
*/
|
||||
.footer-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 80px 0px;
|
||||
background-image: url('../img/footer-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
}
|
||||
.footer-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.9;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.footer-area h1,
|
||||
.footer-area h2,
|
||||
.footer-area h3,
|
||||
.footer-area h4,
|
||||
.footer-area p,
|
||||
.footer-area span,
|
||||
.footer-area a {
|
||||
color: #fff !important;
|
||||
}
|
||||
.footer-area a:hover {
|
||||
color: #7d4ccc !important;
|
||||
}
|
||||
.footer-logo h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.footer-logo h2 span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 30px;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
.footer-logo p {
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-box {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h2 {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h4 {
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.footer-menu {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
.contact-content {
|
||||
position: relative;
|
||||
}
|
||||
.contact-content h3,
|
||||
.contact-content span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.contact-content p {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.social-icon {
|
||||
padding: 0px;
|
||||
margin: 25px 0 0 0;
|
||||
}
|
||||
.social-icon li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
}
|
||||
.social-icon li a {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
border: 1px solid #fff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.vr-title-area {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: auto;
|
||||
top: 92px;
|
||||
left: -90px;
|
||||
-webkit-transform: rotateZ(-90deg);
|
||||
-moz-transform: rotateZ(-90deg);
|
||||
-ms-transform: rotateZ(-90deg);
|
||||
-o-transform: rotateZ(-90deg);
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
.download-link {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.download-link a {
|
||||
font-size: 14px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Copyright Section
|
||||
----------------------------------
|
||||
*/
|
||||
.copyright-area {
|
||||
width: 100%;
|
||||
min-height: 70px;
|
||||
padding: 25px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
.copyright-area span {
|
||||
color: #696969;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
-
|
||||
----------------------------------
|
||||
*/
|
||||
/* Your css code */
|
||||
@@ -0,0 +1,686 @@
|
||||
/*
|
||||
Template Name: Appsvision
|
||||
Template URI: http://craftytheme.com/demo/html/appsvision
|
||||
Author Name: Md.Rabiul Islam
|
||||
Author URI: http://craftytheme.com
|
||||
======================================
|
||||
Table of Contents
|
||||
======================================
|
||||
- Home Page
|
||||
- Preloader
|
||||
- Header Section
|
||||
- Hero Section
|
||||
- Feature Section
|
||||
- Pricing Section
|
||||
- Subscribe Section
|
||||
- Basic Style
|
||||
- Section Title
|
||||
======================================
|
||||
*/
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Preloader
|
||||
----------------------------------
|
||||
*/
|
||||
.preloader-area {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
background: rgba(255,255,255,0.95);
|
||||
z-index: 1000000;
|
||||
}
|
||||
.preloader-inner {
|
||||
display: table;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.preloader {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
margin: auto;
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
}
|
||||
.preloader span {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 100%;
|
||||
background: #000000;
|
||||
-webkit-animation: preloader 1.6s linear infinite;
|
||||
animation: preloader 1.6s linear infinite;
|
||||
}
|
||||
.preloader span:last-child {
|
||||
animation-delay:-0.8s;
|
||||
-webkit-animation-delay:-0.8s;
|
||||
}
|
||||
@keyframes preloader {
|
||||
0% {transform: scale(0, 0);opacity:0.5;}
|
||||
100% {transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
@-webkit-keyframes preloader {
|
||||
0% {-webkit-transform: scale(0, 0);opacity:0.5;}
|
||||
100% {-webkit-transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Header Section
|
||||
----------------------------------
|
||||
*/
|
||||
.navbar-area {}
|
||||
.navbar-default {
|
||||
background: rgba(167,193,198,0.45);
|
||||
border-bottom: 1px solid rgba(255,255,255,0.3);
|
||||
min-height: 110px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
color: #fff;
|
||||
padding: 40px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a:hover,
|
||||
.navbar-default .navbar-nav > li > a:active,
|
||||
.navbar-default .navbar-nav > li > a:focus {
|
||||
color: #74a9bc;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > .active > a,
|
||||
.navbar-default .navbar-nav > .active > a:focus,
|
||||
.navbar-default .navbar-nav > .active > a:hover {
|
||||
background: none;
|
||||
color: #74a9bc;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #74a9bc;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -1;
|
||||
}
|
||||
.navbar-right, .navbar-nav > li {
|
||||
margin: 0px;
|
||||
}
|
||||
.navbar-dark {
|
||||
background: rgba(1,1,1,0.8);
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Hero Section
|
||||
----------------------------------
|
||||
*/
|
||||
.hero-area {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
background-image: url('../img/bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ball, .paper, .coffee, .plant, .glass {
|
||||
position: absolute;
|
||||
}
|
||||
.ball {
|
||||
top: 100px;
|
||||
left: -30px;
|
||||
z-index: -1;
|
||||
}
|
||||
.paper {
|
||||
bottom: -65px;
|
||||
left: -150px;
|
||||
z-index: -2;
|
||||
}
|
||||
.coffee {
|
||||
bottom: -255px;
|
||||
left: -190px;
|
||||
z-index: -1;
|
||||
}
|
||||
.plant {
|
||||
right: 70px;
|
||||
top: 35px;
|
||||
z-index: -1;
|
||||
}
|
||||
.glass {
|
||||
right: 75px;
|
||||
bottom: 120px;
|
||||
z-index: -1;
|
||||
}
|
||||
.mockup-slider-area {
|
||||
min-height: 950px;
|
||||
position: relative;
|
||||
}
|
||||
.mockup-slider {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
left: 0px;
|
||||
bottom: 200px;
|
||||
z-index: 2;
|
||||
}
|
||||
.hero-social-share {
|
||||
text-align: right;
|
||||
}
|
||||
.hero-social-share span {
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.hero-social-share a {
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
.hero-caption {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
top: 200px;
|
||||
left: 100px;
|
||||
padding-right: 50px;
|
||||
z-index: 3;
|
||||
}
|
||||
.hero-caption .sublead {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 48px;
|
||||
color: #fff;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.hero-caption .lead {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 300;
|
||||
font-size: 98px;
|
||||
color: #fff;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.hero-caption .lead-text {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: normal;
|
||||
font-size: 24px;
|
||||
color: #fff;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Feature Section
|
||||
----------------------------------
|
||||
*/
|
||||
.feature-area,
|
||||
.single-feature-item {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.single-feature-item {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.single-feature-item h4 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.single-feature-item.active h4 {
|
||||
color: #8cbdcf;
|
||||
}
|
||||
.single-feature-item p {
|
||||
margin: 0;
|
||||
}
|
||||
.single-feature-slide {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.single-feature-slide .tab-img {
|
||||
display: none;
|
||||
margin: auto;
|
||||
}
|
||||
.single-feature-slide .tab-img.active {
|
||||
display: block;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Pricing Section
|
||||
----------------------------------
|
||||
*/
|
||||
.pricing-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.pricing-content p {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.pricing-content p.fade-text {
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-content p.fade-text a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.pill-title {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #26272d;
|
||||
}
|
||||
.pricing-pill {
|
||||
margin: 10px 0px 80px 0px;
|
||||
padding: 5px;
|
||||
list-style: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border: 1px solid #d5d6d7;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
}
|
||||
.pricing-pill li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
padding: 10px 30px;
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
.pricing-pill li.active {
|
||||
background: #fff;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
color: #26292c;
|
||||
-webkit-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-table,
|
||||
.pricing-list {
|
||||
margin: 30px 0px 0px 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.pricing-table li {
|
||||
display: inline-block;
|
||||
width: 49%;
|
||||
background: #ebebed;
|
||||
padding: 40px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.pricing-table li .lead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 32px;
|
||||
font-weight: 400;
|
||||
color: #26272d;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table li .price-tag {
|
||||
display: inline-block;
|
||||
border: 1px solid #d4d4d5;
|
||||
width: auto;
|
||||
height: 30px;
|
||||
border-radius: 30px;
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
padding: 0px 15px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.pricing-table li .sublead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-list {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin: 45px 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 5px 10px;
|
||||
text-align: center;
|
||||
background: transparent;
|
||||
}
|
||||
.pricing-list li p {
|
||||
margin: 0px;
|
||||
font-style: 16px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.pricing-list li p:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
background-image: url('../img/tic.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
top: 10px;
|
||||
left: -20px;
|
||||
}
|
||||
.pricing-table li.active {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.pricing-table li.active:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
top: -5%;
|
||||
left: -5%;
|
||||
background: #fff;
|
||||
z-index: -1;
|
||||
-webkit-border-radius: 15px;
|
||||
-moz-border-radius: 15px;
|
||||
-ms-border-radius: 15px;
|
||||
-o-border-radius: 15px;
|
||||
border-radius: 15px;
|
||||
-webkit-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 20px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-table li.active .btn-outline {
|
||||
background: #8cbdcf;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border-color: #8cbdcf;
|
||||
}
|
||||
.pricing-table li.active .btn-outline:hover {
|
||||
background: #74a9bc;
|
||||
border-color: #74a9bc;
|
||||
color: #fff !important;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Subscribe Section
|
||||
----------------------------------
|
||||
*/
|
||||
.subscribe-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/subscribe-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.subscribe-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.3;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.subscribe-area h4 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.form-subscribe {
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
border: 0px;
|
||||
border-bottom: 1px solid #f9f9f9;
|
||||
box-shadow: none !important;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Download Section
|
||||
----------------------------------
|
||||
*/
|
||||
.download-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/shape.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom center;
|
||||
background-size: contain;
|
||||
}
|
||||
.download-app {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Footer Section
|
||||
----------------------------------
|
||||
*/
|
||||
.footer-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 80px 0px;
|
||||
background-image: url('../img/footer-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
}
|
||||
.footer-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.9;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.footer-area h1,
|
||||
.footer-area h2,
|
||||
.footer-area h3,
|
||||
.footer-area h4,
|
||||
.footer-area p,
|
||||
.footer-area span,
|
||||
.footer-area a {
|
||||
color: #fff;
|
||||
}
|
||||
.footer-area a:hover,
|
||||
.footer-area a:active,
|
||||
.footer-area a:focus {
|
||||
color: #74a9bc;
|
||||
}
|
||||
.footer-logo h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.footer-logo h2 span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 30px;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
.footer-logo p {
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-box {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h2 {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h4 {
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.footer-menu {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
.contact-content {
|
||||
position: relative;
|
||||
}
|
||||
.contact-content h3,
|
||||
.contact-content span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.contact-content p {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.social-icon {
|
||||
padding: 0px;
|
||||
margin: 25px 0 0 0;
|
||||
}
|
||||
.social-icon li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
}
|
||||
.social-icon li a {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
border: 1px solid #fff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.vr-title-area {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: auto;
|
||||
top: 92px;
|
||||
left: -90px;
|
||||
-webkit-transform: rotateZ(-90deg);
|
||||
-moz-transform: rotateZ(-90deg);
|
||||
-ms-transform: rotateZ(-90deg);
|
||||
-o-transform: rotateZ(-90deg);
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
.download-link {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.download-link a {
|
||||
font-size: 14px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Copyright Section
|
||||
----------------------------------
|
||||
*/
|
||||
.copyright-area {
|
||||
width: 100%;
|
||||
min-height: 70px;
|
||||
padding: 25px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
.copyright-area span {
|
||||
color: #696969;
|
||||
}
|
||||
|
||||
/*
|
||||
------------------------------------
|
||||
- Section Title (Default)
|
||||
------------------------------------
|
||||
*/
|
||||
.section-title {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 90px;
|
||||
}
|
||||
.title-left {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.section-title h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 36px;
|
||||
color: #696969;
|
||||
letter-spacing: 0px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.section-title span {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
letter-spacing: 0px;
|
||||
color: #8cbdcf;
|
||||
}
|
||||
.section-title span.small {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
letter-spacing: 0px;
|
||||
color: #8cbdcf;
|
||||
}
|
||||
.section-title p {
|
||||
margin-top: 35px;
|
||||
color: #212121;
|
||||
}
|
||||
.section-title-2 {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.section-title-2 h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 36px;
|
||||
font-weight: 400;
|
||||
color: #212121;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
-
|
||||
----------------------------------
|
||||
*/
|
||||
/* Your css code */
|
||||
@@ -0,0 +1,736 @@
|
||||
/*
|
||||
======================================
|
||||
Table of Contents
|
||||
======================================
|
||||
- Home Page
|
||||
- Preloader
|
||||
- Header Section
|
||||
- Scroll Navigation Section
|
||||
- Hero Section
|
||||
- Feature Section
|
||||
- Pricing Section
|
||||
- Subscribe Section
|
||||
- Download Section
|
||||
- Footer Section
|
||||
======================================
|
||||
*/
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- General Style
|
||||
----------------------------------
|
||||
*/
|
||||
/*
|
||||
------------------------------------
|
||||
- Section Title
|
||||
------------------------------------
|
||||
*/
|
||||
.section-title {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 90px;
|
||||
}
|
||||
.title-left {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.section-title h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 36px;
|
||||
color: #fff;
|
||||
letter-spacing: 0px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.section-title span {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 24px;
|
||||
letter-spacing: 0px;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
.section-title span.small {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
letter-spacing: 0px;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
.section-title p {
|
||||
margin-top: 35px;
|
||||
color: #fff;
|
||||
}
|
||||
.section-title-2 {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.section-title-2 h2 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 36px;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Preloader
|
||||
----------------------------------
|
||||
*/
|
||||
.preloader-area {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
background: rgba(255,255,255,0.95);
|
||||
z-index: 1000000;
|
||||
}
|
||||
.preloader-inner {
|
||||
display: table;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.preloader {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
margin: auto;
|
||||
padding: 0px;
|
||||
text-align: center;
|
||||
}
|
||||
.preloader span {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 100%;
|
||||
background: #000000;
|
||||
-webkit-animation: preloader 1.6s linear infinite;
|
||||
animation: preloader 1.6s linear infinite;
|
||||
}
|
||||
.preloader span:last-child {
|
||||
animation-delay:-0.8s;
|
||||
-webkit-animation-delay:-0.8s;
|
||||
}
|
||||
@keyframes preloader {
|
||||
0% {transform: scale(0, 0);opacity:0.5;}
|
||||
100% {transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
@-webkit-keyframes preloader {
|
||||
0% {-webkit-transform: scale(0, 0);opacity:0.5;}
|
||||
100% {-webkit-transform: scale(1, 1);opacity:0;}
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Header Section
|
||||
----------------------------------
|
||||
*/
|
||||
.navbar-area {}
|
||||
.navbar-default {
|
||||
background: transparent;
|
||||
border-bottom: none;
|
||||
min-height: 110px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a {
|
||||
color: #fff;
|
||||
padding: 40px 25px;
|
||||
}
|
||||
.navbar-default .navbar-nav > li > a:hover,
|
||||
.navbar-default .navbar-nav > li > a:active,
|
||||
.navbar-default .navbar-nav > li > a:focus {
|
||||
color: #d31050;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.navbar-default .navbar-nav > .active > a,
|
||||
.navbar-default .navbar-nav > .active > a:focus,
|
||||
.navbar-default .navbar-nav > .active > a:hover {
|
||||
background: none;
|
||||
color: #d31050;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.navbar-default .navbar-nav > .active > a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #d31050;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -1;
|
||||
}
|
||||
.navbar-right, .navbar-nav > li {
|
||||
margin: 0px;
|
||||
}
|
||||
.navbar-dark {
|
||||
background: rgba(1,1,1,0.8);
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Hero Section
|
||||
----------------------------------
|
||||
*/
|
||||
.hero-area {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
background: #15181d;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
display: table;
|
||||
-webkit-transition: all 0.2s ease-in-out;
|
||||
-moz-transition: all 0.2s ease-in-out;
|
||||
-ms-transition: all 0.2s ease-in-out;
|
||||
-o-transition: all 0.2s ease-in-out;
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
.hero-area:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
background-image: url('../img/dark-hero-bg.jpg');
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
opacity: 0.11;
|
||||
z-index: -1;
|
||||
}
|
||||
.dark-mockup-slider-area {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
}
|
||||
.dark-mockup-slider {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
right: 0px;
|
||||
bottom: 0%;
|
||||
}
|
||||
.dark-mockup-slide .owl-item img {
|
||||
text-align: right !important;
|
||||
margin-right: -8px !important;
|
||||
}
|
||||
.hero-caption {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 750px;
|
||||
display: table;
|
||||
}
|
||||
.hero-caption-inner {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: right
|
||||
}
|
||||
.hero-caption-inner .lead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 120px;
|
||||
font-weight: 300;
|
||||
color: #fff;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.hero-caption-inner .sublead {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 48px;
|
||||
font-weight: 700;
|
||||
color: #FF2549;
|
||||
margin-bottom: -20px;
|
||||
display: block;
|
||||
padding-left: 85px;
|
||||
}
|
||||
.hero-caption-inner .lead-text {
|
||||
display: block;
|
||||
text-align: right;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: normal;
|
||||
font-size: 24px;
|
||||
color: #fff;
|
||||
}
|
||||
.dark-mockup-slide .owl-dots {
|
||||
position: absolute;
|
||||
bottom: 280px;
|
||||
left: -210px;
|
||||
transform: rotate(90deg);
|
||||
/*overflow: hidden;*/
|
||||
}
|
||||
.dark-mockup-slide .owl-dot {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-right: 20px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.dark-mockup-slide .owl-dot.active {
|
||||
background: #ff2549;
|
||||
position: relative;
|
||||
margin: 0px 30px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
.dark-mockup-slide .owl-dot.active:after {
|
||||
content: "";
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
background: #ff2549;
|
||||
position: absolute;
|
||||
opacity: 0.4;
|
||||
top: -13px;
|
||||
left: -13px;
|
||||
}
|
||||
.vr-line {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -28px;
|
||||
bottom: 30px;
|
||||
width: 1px;
|
||||
height: 90%;
|
||||
background: #f9f9f9;
|
||||
opacity: 0.2;
|
||||
z-index: -2;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Feature Section
|
||||
----------------------------------
|
||||
*/
|
||||
.feature-area {
|
||||
background-image: url('../img/dark-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center bottom;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.single-feature-item {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
.single-feature-item {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.single-feature-item h4 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.single-feature-item.active h4 {
|
||||
color: #ed145b;
|
||||
}
|
||||
.single-feature-item p {
|
||||
margin: 0;
|
||||
}
|
||||
.single-feature-slide {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.single-feature-slide .tab-img {
|
||||
display: none;
|
||||
margin: auto;
|
||||
}
|
||||
.single-feature-slide .tab-img.active {
|
||||
display: block;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Pricing Section
|
||||
----------------------------------
|
||||
*/
|
||||
.pricing-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/dark-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center bottom;
|
||||
background-size: cover;
|
||||
}
|
||||
.pricing-content p {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.pricing-content p.fade-text {
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-content p.fade-text a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.pill-title {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
.pricing-pill {
|
||||
margin: 10px 0px 80px 0px;
|
||||
padding: 5px;
|
||||
list-style: none;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
border: 1px solid #d5d6d7;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
}
|
||||
.pricing-pill li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
padding: 10px 30px;
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
.pricing-pill li.active {
|
||||
background: #fff;
|
||||
-webkit-border-radius: 35px;
|
||||
-moz-border-radius: 35px;
|
||||
-ms-border-radius: 35px;
|
||||
-o-border-radius: 35px;
|
||||
border-radius: 35px;
|
||||
-webkit-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-pill li.active span {
|
||||
color: #212121;
|
||||
}
|
||||
.pricing-table,
|
||||
.pricing-list {
|
||||
margin: 30px 0px 0px 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.pricing-table li {
|
||||
display: inline-block;
|
||||
width: 49%;
|
||||
background: #ebebed;
|
||||
padding: 40px 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.pricing-table li .lead-title {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 32px;
|
||||
font-weight: 400;
|
||||
color: #26272d;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.pricing-table li .price-tag {
|
||||
display: inline-block;
|
||||
border: 1px solid #d4d4d5;
|
||||
width: auto;
|
||||
height: 30px;
|
||||
border-radius: 30px;
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
color: #212121;
|
||||
padding: 0px 15px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.pricing-table li .sublead {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
color: #8c8f94;
|
||||
}
|
||||
.pricing-list {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin: 45px 0px;
|
||||
}
|
||||
.pricing-list li {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 5px 10px;
|
||||
text-align: center;
|
||||
background: transparent;
|
||||
}
|
||||
.pricing-list li p {
|
||||
margin: 0px;
|
||||
font-style: 16px;
|
||||
color: #212121;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.pricing-list li p:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
background-image: url('../img/tic.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
width: 14px;
|
||||
height: 10px;
|
||||
top: 10px;
|
||||
left: -20px;
|
||||
}
|
||||
.pricing-table li.active {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.pricing-table li.active:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
top: -5%;
|
||||
left: -5%;
|
||||
background: #fff;
|
||||
z-index: -1;
|
||||
-webkit-border-radius: 15px;
|
||||
-moz-border-radius: 15px;
|
||||
-ms-border-radius: 15px;
|
||||
-o-border-radius: 15px;
|
||||
border-radius: 15px;
|
||||
-webkit-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-moz-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-ms-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
-o-box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
box-shadow: 0px 0px 5px 0px #e7e7e8;
|
||||
}
|
||||
.pricing-table li.active .btn-outline-megento {
|
||||
background: #ed145b;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
border-color: #ed145b;
|
||||
}
|
||||
.pricing-table li.active .btn-outline-megento:hover {
|
||||
background: #d31050;
|
||||
border-color: #d31050;
|
||||
color: #fff !important;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Subscribe Section
|
||||
----------------------------------
|
||||
*/
|
||||
.subscribe-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/subscribe-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.subscribe-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.3;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.subscribe-area h4 {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.form-subscribe {
|
||||
background: transparent;
|
||||
text-align: center;
|
||||
border: 0px;
|
||||
border-bottom: 1px solid #f9f9f9;
|
||||
box-shadow: none !important;
|
||||
color: #f9f9f9;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Download Section
|
||||
----------------------------------
|
||||
*/
|
||||
.download-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
background-image: url('../img/dark-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center bottom;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
.download-app {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
- Footer Section
|
||||
----------------------------------
|
||||
*/
|
||||
.footer-area {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 80px 0px;
|
||||
background-image: url('../img/footer-bg.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: #fff;
|
||||
}
|
||||
.footer-area:after {
|
||||
position: absolute;
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
opacity: 0.9;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.footer-area h1,
|
||||
.footer-area h2,
|
||||
.footer-area h3,
|
||||
.footer-area h4,
|
||||
.footer-area p,
|
||||
.footer-area span,
|
||||
.footer-area a,
|
||||
.footer-area li a {
|
||||
color: #fff !important;
|
||||
}
|
||||
.footer-area li a:hover {
|
||||
color: #d31050 !important;
|
||||
}
|
||||
.footer-logo h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.footer-logo h2 span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 30px;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
.footer-logo p {
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-box {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h2 {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.footer-box h4 {
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.footer-menu {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
.contact-content {
|
||||
position: relative;
|
||||
}
|
||||
.contact-content h3,
|
||||
.contact-content span.thin {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
}
|
||||
.contact-content p {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.social-icon {
|
||||
padding: 0px;
|
||||
margin: 25px 0 0 0;
|
||||
}
|
||||
.social-icon li {
|
||||
display: inline-block;
|
||||
margin: 0px;
|
||||
}
|
||||
.social-icon li a {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
border: 1px solid #fff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.vr-title-area {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: auto;
|
||||
top: 92px;
|
||||
left: -90px;
|
||||
-webkit-transform: rotateZ(-90deg);
|
||||
-moz-transform: rotateZ(-90deg);
|
||||
-ms-transform: rotateZ(-90deg);
|
||||
-o-transform: rotateZ(-90deg);
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
.download-link {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.download-link a {
|
||||
font-size: 14px;
|
||||
}
|
||||
/*
|
||||
----------------------------------
|
||||
- Copyright Section
|
||||
----------------------------------
|
||||
*/
|
||||
.copyright-area {
|
||||
width: 100%;
|
||||
min-height: 70px;
|
||||
padding: 25px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
.copyright-area span {
|
||||
color: #696969;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
----------------------------------
|
||||
-
|
||||
----------------------------------
|
||||
*/
|
||||
/* Your css code */
|
||||
@@ -0,0 +1,261 @@
|
||||
/*
|
||||
Table Of Contents
|
||||
=========================
|
||||
- Default Typography
|
||||
=========================
|
||||
*/
|
||||
/*
|
||||
--------------------------
|
||||
- Default Typography
|
||||
--------------------------
|
||||
*/
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0;
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 700;
|
||||
color: #696969;
|
||||
letter-spacing: 0px;
|
||||
}
|
||||
.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
|
||||
margin: 0;
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
letter-spacing: 0px;
|
||||
}
|
||||
|
||||
|
||||
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
|
||||
font-weight: inherit;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
h1 {
|
||||
font-size: 36px;
|
||||
line-height: 70px;
|
||||
letter-spacing: -1px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
line-height: 40px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
line-height: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 18px;
|
||||
line-height: 27px;
|
||||
}
|
||||
h5 {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
h6 {
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 20px 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.dark p {
|
||||
margin: 0 0 20px 0;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #f9f9f9;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
}
|
||||
p img {
|
||||
margin: 0;
|
||||
}
|
||||
span {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.dark span {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #f9f9f9;
|
||||
letter-spacing: 0px;
|
||||
line-height: 28px;
|
||||
}
|
||||
/* em and strong */
|
||||
em {
|
||||
font: 15px/30px;
|
||||
}
|
||||
strong,
|
||||
b {
|
||||
font: 15px/30px;
|
||||
}
|
||||
small {
|
||||
font-size: 11px;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
|
||||
/* blockquotes */
|
||||
blockquote {
|
||||
margin: 10px 0px;
|
||||
padding-left: 40px;
|
||||
position: relative;
|
||||
border-left: 0px;
|
||||
}
|
||||
blockquote:before {
|
||||
content: "\201C";
|
||||
opacity: 0.5;
|
||||
font-size: 80px;
|
||||
line-height: 0px;
|
||||
margin: 0;
|
||||
font-family: arial, sans-serif;
|
||||
position: absolute;
|
||||
top: 30px;
|
||||
left: 0;
|
||||
}
|
||||
blockquote p {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-style: italic;
|
||||
padding: 0;
|
||||
font-size: 18px;
|
||||
line-height: 36px;
|
||||
}
|
||||
blockquote cite {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
line-height: 18px;
|
||||
}
|
||||
blockquote cite:before { content: "\2014 \0020"; }
|
||||
blockquote cite a,
|
||||
blockquote cite a:visited { color: #8B9798; border: none }
|
||||
|
||||
/* abbreviations */
|
||||
abbr {
|
||||
color: #444;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 700;
|
||||
font-variant: small-caps;
|
||||
text-transform: lowercase;
|
||||
letter-spacing: .6px;
|
||||
|
||||
}
|
||||
abbr:hover { cursor: help; }
|
||||
|
||||
/* links */
|
||||
a, a:visited {
|
||||
text-decoration: none;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #8cbdcf;
|
||||
letter-spacing: 0px;
|
||||
transition: all 0.3s ease-in-out;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
outline: 0;
|
||||
}
|
||||
a:hover, a:active, a:focus {
|
||||
color: #74a9bc;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
}
|
||||
/* Blue Version */
|
||||
.blue a, .blue a:visited {
|
||||
color: #7d4ccc;
|
||||
}
|
||||
.blue a:hover, .blue a:active, .blue a:focus {
|
||||
color: #7045b6;
|
||||
}
|
||||
/* Dark Version */
|
||||
.dark a, .dark a:visited {
|
||||
color: #ed145b;
|
||||
}
|
||||
.dark a:hover, .dark a:active, .dark a:focus {
|
||||
color: #d31050;
|
||||
}
|
||||
|
||||
p a,
|
||||
p a:visited {
|
||||
line-height: inherit;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
|
||||
/* list */
|
||||
ul,
|
||||
ol {
|
||||
margin-bottom: 24px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
ul {
|
||||
list-style: none outside;
|
||||
}
|
||||
ol {
|
||||
list-style: decimal;
|
||||
}
|
||||
ol,
|
||||
ul.square,
|
||||
ul.circle,
|
||||
ul.disc {
|
||||
margin-left: 30px;
|
||||
}
|
||||
ul.square {
|
||||
list-style: square outside;
|
||||
}
|
||||
ul.circle {
|
||||
list-style: circle outside;
|
||||
}
|
||||
ul.disc {
|
||||
list-style: disc outside;
|
||||
}
|
||||
ul ul,
|
||||
ul ol,
|
||||
ol ol,
|
||||
ol ul {
|
||||
margin: 6px 0 6px 30px;
|
||||
}
|
||||
ul ul li,
|
||||
ul ol li,
|
||||
ol ol li,
|
||||
ol ul li {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
li {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 18px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
ul.large li { }
|
||||
li p {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #3c3c3c;
|
||||
letter-spacing: 0px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
/* definition list */
|
||||
dl { margin: 12px 0; }
|
||||
dt { margin: 0; color:#11ABB0; }
|
||||
dd { margin: 0 0 0 20px; }
|
||||
Reference in New Issue
Block a user