wbase 0.0.1 → 0.0.2

data/app/assets/stylesheets/wbase/landing/icon-font.scss

@@ -0,0 +1,343 @@
+@font-face {
+  font-family: 'et-line';
+  src: font-url('et-line.eot');
+  src: font-url('et-line.eot?#iefix') format('embedded-opentype'),
+  font-url('et-line.woff') format('woff'),
+  font-url('et-line.ttf') format('truetype'),
+  font-url('et-line.svg#et-line') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* Use the following CSS code if you want to use data attributes for inserting your icons */
+[data-icon]:before {
+  font-family: 'et-line';
+  content: attr(data-icon);
+  speak: none;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  display:inline-block;
+}
+
+/* Use the following CSS code if you want to have a class per icon */
+/*
+Instead of a list of all class selectors,
+you can use the generic selector below, but it's slower:
+[class*="icon-"] {
+ */
+  .icon-mobile, .icon-laptop, .icon-desktop, .icon-tablet, .icon-phone, .icon-document, .icon-documents, .icon-search, .icon-clipboard, .icon-newspaper, .icon-notebook, .icon-book-open, .icon-browser, .icon-calendar, .icon-presentation, .icon-picture, .icon-pictures, .icon-video, .icon-camera, .icon-printer, .icon-toolbox, .icon-briefcase, .icon-wallet, .icon-gift, .icon-bargraph, .icon-grid, .icon-expand, .icon-focus, .icon-edit, .icon-adjustments, .icon-ribbon, .icon-hourglass, .icon-lock, .icon-megaphone, .icon-shield, .icon-trophy, .icon-flag, .icon-map, .icon-puzzle, .icon-basket, .icon-envelope, .icon-streetsign, .icon-telescope, .icon-gears, .icon-key, .icon-paperclip, .icon-attachment, .icon-pricetags, .icon-lightbulb, .icon-layers, .icon-pencil, .icon-tools, .icon-tools-2, .icon-scissors, .icon-paintbrush, .icon-magnifying-glass, .icon-circle-compass, .icon-linegraph, .icon-mic, .icon-strategy, .icon-beaker, .icon-caution, .icon-recycle, .icon-anchor, .icon-profile-male, .icon-profile-female, .icon-bike, .icon-wine, .icon-hotairballoon, .icon-globe, .icon-genius, .icon-map-pin, .icon-dial, .icon-chat, .icon-heart, .icon-cloud, .icon-upload, .icon-download, .icon-target, .icon-hazardous, .icon-piechart, .icon-speedometer, .icon-global, .icon-compass, .icon-lifesaver, .icon-clock, .icon-aperture, .icon-quote, .icon-scope, .icon-alarmclock, .icon-refresh, .icon-happy, .icon-sad, .icon-facebook, .icon-twitter, .icon-googleplus, .icon-rss, .icon-tumblr, .icon-linkedin, .icon-dribbble {
+    font-family: 'et-line';
+    speak: none;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    display:inline-block;
+  }
+  .icon-mobile:before {
+    content: "\e000";
+  }
+  .icon-laptop:before {
+    content: "\e001";
+  }
+  .icon-desktop:before {
+    content: "\e002";
+  }
+  .icon-tablet:before {
+    content: "\e003";
+  }
+  .icon-phone:before {
+    content: "\e004";
+  }
+  .icon-document:before {
+    content: "\e005";
+  }
+  .icon-documents:before {
+    content: "\e006";
+  }
+  .icon-search:before {
+    content: "\e007";
+  }
+  .icon-clipboard:before {
+    content: "\e008";
+  }
+  .icon-newspaper:before {
+    content: "\e009";
+  }
+  .icon-notebook:before {
+    content: "\e00a";
+  }
+  .icon-book-open:before {
+    content: "\e00b";
+  }
+  .icon-browser:before {
+    content: "\e00c";
+  }
+  .icon-calendar:before {
+    content: "\e00d";
+  }
+  .icon-presentation:before {
+    content: "\e00e";
+  }
+  .icon-picture:before {
+    content: "\e00f";
+  }
+  .icon-pictures:before {
+    content: "\e010";
+  }
+  .icon-video:before {
+    content: "\e011";
+  }
+  .icon-camera:before {
+    content: "\e012";
+  }
+  .icon-printer:before {
+    content: "\e013";
+  }
+  .icon-toolbox:before {
+    content: "\e014";
+  }
+  .icon-briefcase:before {
+    content: "\e015";
+  }
+  .icon-wallet:before {
+    content: "\e016";
+  }
+  .icon-gift:before {
+    content: "\e017";
+  }
+  .icon-bargraph:before {
+    content: "\e018";
+  }
+  .icon-grid:before {
+    content: "\e019";
+  }
+  .icon-expand:before {
+    content: "\e01a";
+  }
+  .icon-focus:before {
+    content: "\e01b";
+  }
+  .icon-edit:before {
+    content: "\e01c";
+  }
+  .icon-adjustments:before {
+    content: "\e01d";
+  }
+  .icon-ribbon:before {
+    content: "\e01e";
+  }
+  .icon-hourglass:before {
+    content: "\e01f";
+  }
+  .icon-lock:before {
+    content: "\e020";
+  }
+  .icon-megaphone:before {
+    content: "\e021";
+  }
+  .icon-shield:before {
+    content: "\e022";
+  }
+  .icon-trophy:before {
+    content: "\e023";
+  }
+  .icon-flag:before {
+    content: "\e024";
+  }
+  .icon-map:before {
+    content: "\e025";
+  }
+  .icon-puzzle:before {
+    content: "\e026";
+  }
+  .icon-basket:before {
+    content: "\e027";
+  }
+  .icon-envelope:before {
+    content: "\e028";
+  }
+  .icon-streetsign:before {
+    content: "\e029";
+  }
+  .icon-telescope:before {
+    content: "\e02a";
+  }
+  .icon-gears:before {
+    content: "\e02b";
+  }
+  .icon-key:before {
+    content: "\e02c";
+  }
+  .icon-paperclip:before {
+    content: "\e02d";
+  }
+  .icon-attachment:before {
+    content: "\e02e";
+  }
+  .icon-pricetags:before {
+    content: "\e02f";
+  }
+  .icon-lightbulb:before {
+    content: "\e030";
+  }
+  .icon-layers:before {
+    content: "\e031";
+  }
+  .icon-pencil:before {
+    content: "\e032";
+  }
+  .icon-tools:before {
+    content: "\e033";
+  }
+  .icon-tools-2:before {
+    content: "\e034";
+  }
+  .icon-scissors:before {
+    content: "\e035";
+  }
+  .icon-paintbrush:before {
+    content: "\e036";
+  }
+  .icon-magnifying-glass:before {
+    content: "\e037";
+  }
+  .icon-circle-compass:before {
+    content: "\e038";
+  }
+  .icon-linegraph:before {
+    content: "\e039";
+  }
+  .icon-mic:before {
+    content: "\e03a";
+  }
+  .icon-strategy:before {
+    content: "\e03b";
+  }
+  .icon-beaker:before {
+    content: "\e03c";
+  }
+  .icon-caution:before {
+    content: "\e03d";
+  }
+  .icon-recycle:before {
+    content: "\e03e";
+  }
+  .icon-anchor:before {
+    content: "\e03f";
+  }
+  .icon-profile-male:before {
+    content: "\e040";
+  }
+  .icon-profile-female:before {
+    content: "\e041";
+  }
+  .icon-bike:before {
+    content: "\e042";
+  }
+  .icon-wine:before {
+    content: "\e043";
+  }
+  .icon-hotairballoon:before {
+    content: "\e044";
+  }
+  .icon-globe:before {
+    content: "\e045";
+  }
+  .icon-genius:before {
+    content: "\e046";
+  }
+  .icon-map-pin:before {
+    content: "\e047";
+  }
+  .icon-dial:before {
+    content: "\e048";
+  }
+  .icon-chat:before {
+    content: "\e049";
+  }
+  .icon-heart:before {
+    content: "\e04a";
+  }
+  .icon-cloud:before {
+    content: "\e04b";
+  }
+  .icon-upload:before {
+    content: "\e04c";
+  }
+  .icon-download:before {
+    content: "\e04d";
+  }
+  .icon-target:before {
+    content: "\e04e";
+  }
+  .icon-hazardous:before {
+    content: "\e04f";
+  }
+  .icon-piechart:before {
+    content: "\e050";
+  }
+  .icon-speedometer:before {
+    content: "\e051";
+  }
+  .icon-global:before {
+    content: "\e052";
+  }
+  .icon-compass:before {
+    content: "\e053";
+  }
+  .icon-lifesaver:before {
+    content: "\e054";
+  }
+  .icon-clock:before {
+    content: "\e055";
+  }
+  .icon-aperture:before {
+    content: "\e056";
+  }
+  .icon-quote:before {
+    content: "\e057";
+  }
+  .icon-scope:before {
+    content: "\e058";
+  }
+  .icon-alarmclock:before {
+    content: "\e059";
+  }
+  .icon-refresh:before {
+    content: "\e05a";
+  }
+  .icon-happy:before {
+    content: "\e05b";
+  }
+  .icon-sad:before {
+    content: "\e05c";
+  }
+  .icon-facebook:before {
+    content: "\e05d";
+  }
+  .icon-twitter:before {
+    content: "\e05e";
+  }
+  .icon-googleplus:before {
+    content: "\e05f";
+  }
+  .icon-rss:before {
+    content: "\e060";
+  }
+  .icon-tumblr:before {
+    content: "\e061";
+  }
+  .icon-linkedin:before {
+    content: "\e062";
+  }
+  .icon-dribbble:before {
+    content: "\e063";
+  }

data/app/assets/stylesheets/wbase/landing/styles.scss

@@ -0,0 +1,1358 @@
+/* Template: Zigo Software Landing Page Template
+   Author: InovatikThemes
+   Version: 1.0.0
+   Created: October 2016
+   Description: Master CSS file
+*/
+
+/**********************************
+	TABLE OF CONTENTS
+
+01. Sass Variables
+02. General Styles
+03. Navigation
+04. Header
+05. Features Section
+06. Description Section
+07. Video Section
+08. Customers Section
+09. Pricing Section
+10. Free Trial Section
+11. About Us Section
+12. Newsletter Section
+13. Our Team Section
+14. Social Media Section
+15. Contact Section
+16.	Footer
+17. Back To Top Button
+18. Media Queries
+**********************************/
+
+/***** 01. Sass Variables *****/
+$default-color: #444b43; /* dark gray */
+$primary-color: $brand-primary; /* green */
+$primary-color-lighter: #3be382; /* lighter green */
+$light-gray: #eee; /* light gray */
+
+/* Fonts */
+$poppins: 'Poppins', sans-serif;
+
+
+/***** 02. General Styles *****/
+html,
+body {
+    width: 100%;
+    height: 100%;
+}
+
+body {
+	font: 300 16px/26px $poppins;
+	color: $default-color;
+}
+
+h1 {
+	font: 300 36px/46px $poppins;
+}
+
+h2 {
+	font: 500 25px/34px $poppins;
+}
+
+h3 {
+	font: 500 21px/30px $poppins;
+}
+
+p {
+	font: 300 16px/26px $poppins;
+}
+
+a {
+	color: $default-color;
+	text-decoration: underline;
+}
+
+a:hover {
+	color: #000;
+}
+
+/* Buttons */
+.button-large-transparent,
+.button-large-transparent:focus {
+	font: 300 18px/32px $poppins;
+	background: transparent;
+	color: $primary-color;
+	border: 2px solid $primary-color;
+	border-radius: 25px;
+	padding: 9px 40px 9px 40px;
+	text-decoration: none;
+}
+
+.button-large-transparent:hover {
+	background-color: $primary-color-lighter;
+	color: $default-color;
+	border: 2px solid $primary-color-lighter;
+	text-decoration: none;
+	cursor: pointer;
+}
+
+.button-large-solid,
+.button-large-solid:focus {
+	font: 300 18px/32px $poppins;
+	background-color: $brand-success;
+	color: white;
+	border: none;
+	border-radius: 25px;
+	padding: 11px 40px 11px 40px;
+	text-decoration: none;
+}
+
+.button-large-solid:hover {
+	background-color: lighten($brand-success, 15%);
+	color: white;
+	text-decoration: none;
+}
+
+.button-small-solid,
+.button-small-solid:focus {
+	font: 300 16px/26px $poppins;
+	background-color: $primary-color;
+	color: #fff;
+	border-radius: 25px;
+	padding: 10px 40px 10px 40px;
+	text-decoration: none;
+	border: none;
+}
+
+.button-small-solid:hover {
+	background-color: lighten($brand-success, 15%);
+	color: #fff;
+	text-decoration: none;
+	cursor: pointer;
+}
+
+.button-small-transparent,
+.button-small-transparent:focus {
+	font: 300 16px/26px $poppins;
+	background: transparent;
+	color: $primary-color;
+	border: 2px solid $primary-color;
+	border-radius: 25px;
+	padding: 8px 40px 8px 40px;
+	text-decoration: none;
+}
+
+.button-small-transparent:hover {
+	background-color: $primary-color-lighter;
+	color: $default-color;
+	border: 2px solid $primary-color-lighter;
+	text-decoration: none;
+	cursor: pointer;
+}
+
+/* Carousel */
+.carousel-control .glyphicon-menu-right,
+.carousel-control .glyphicon-menu-left {
+  position: absolute;
+  top: 50%;
+  z-index: 5;
+  display: inline-block;
+  margin-top: -10px;
+  font-size: 30px
+}
+
+.carousel-control .glyphicon-menu-left {
+  left: 50%;
+  margin-left: -10px;
+}
+
+.carousel-control .glyphicon-menu-right {
+  right: 50%;
+  margin-right: -10px;
+}
+
+a.left.carousel-control, a.right.carousel-control {
+	opacity: 1;
+}
+
+.right.carousel-control {
+	background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .5) 100%);
+}
+
+.left.carousel-control {
+	background-image: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .5) 100%);
+}
+
+/* Heading Text Underline */
+.underline, .underline-yellow {
+	display: inline-block;
+}
+
+.underline:after {
+	display: block;
+	content: "";
+	width: 80%;
+	margin: 7px  auto 0 auto;
+	border-bottom: solid 2px $primary-color;
+}
+
+.underline-yellow:after {
+	display: block;
+	content: "";
+	width: 80%;
+	margin: 7px  auto 0 auto;
+	border-bottom: solid 2px #ffdc48;
+}
+
+/* Forms succes and error alerts formatting */
+#dmsgSubmit.h3.text-center.tada.animated.text-success {
+	font: 300 20px/32px $poppins;
+	color: #fff;
+}
+
+#dmsgSubmit.h3.text-center.text-danger {
+	font: 300 20px/32px $poppins;
+	color: #fff;
+}
+
+#nmsgSubmit.h3.text-center.tada.animated.text-success,
+#cmsgSubmit.h3.text-center.tada.animated.text-success {
+	font: 300 20px/32px $poppins;
+	color: $default-color;
+}
+
+#nmsgSubmit.h3.text-center.text-danger,
+#cmsgSubmit.h3.text-center.text-danger {
+	font: 300 20px/32px $poppins;
+	color: $default-color;
+}
+
+
+/***** 03. Navigation *****/
+/* Image Logo */
+.navbar-brand.img-logo {
+	width: 101px;
+	height: 35px;
+	padding: 4px 0 0 0;
+}
+
+/* Navbar */
+.navbar-custom {
+	background-color: #2ac46b;
+	border-color: transparent;
+	font: 300 14px/22px $poppins;
+}
+
+.navbar-custom .navbar-brand {
+	color: #fff;
+}
+
+a.navbar-brand.img-logo {
+	margin-left: 10px;
+	margin-top: 60px;
+}
+
+a.navbar-brand.img-logo.scrolling {
+	margin-top: 6px;
+	margin-left: 15px;
+}
+
+.navbar-custom .navbar-brand:hover,
+.navbar-custom .navbar-brand:focus,
+.navbar-custom .navbar-brand:active,
+.navbar-custom .navbar-brand.active {
+	color: #fff;
+	opacity: 1;
+}
+
+.navbar-custom .navbar-collapse {
+	border-color: rgba(255, 255, 255, 0.02);
+}
+
+.navbar-custom .navbar-toggle,
+.navbar-custom .navbar-toggle:focus {
+	background-color: $default-color;
+	border-color: $default-color;
+	color: #fff;
+	font: 300 14px/19px $poppins;
+}
+
+.navbar-custom .navbar-toggle:hover {
+	background-color: #585f58;
+	color: #fff;
+	border-color: #585f58;
+}
+
+.navbar-custom .nav li a.scrolling {
+	color: #fff;
+	opacity: 0.7;
+	text-decoration: none;
+}
+
+.navbar-custom .nav li a:hover {
+	color: #fff;
+	outline: none;
+	opacity: 1;
+}
+
+.navbar-custom .navbar-nav > .active > a.scrolling {
+	border-radius: 0;
+	color: #fff;
+	background-color: transparent;
+	opacity: 1;
+}
+
+.navbar-custom .navbar-nav > .active > a:hover,
+.navbar-custom .navbar-nav > .active > a:focus {
+	color: #fff;
+	background-color: transparent;
+}
+
+
+a.navbar-brand.scrolling {
+	text-decoration: none;
+	font: 300 26px/20px $poppins;
+	color: #fff;
+	margin-top: 4px;
+}
+
+.navbar-custom.affix .navbar-brand {
+	font: 300 26px/20px $poppins;
+}
+
+
+/***** 04. Header *****/
+header {
+    position: relative;
+    min-height: auto;
+    text-align: center;
+    width: 100%;
+    background-color: $primary-color;
+	// background: url('http://placehold.it/1920x1080/F67599') no-repeat center;
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+   	background-size: cover;
+    min-height: 100%;
+
+	.flex-container-wrapper { /* IE fix for vertical alignment in flex box */
+	  display: flex;
+	  flex-direction: column;
+	  height: 100%;
+	}
+
+	.header-content {
+		position: relative;
+		width: 100%;
+		padding: 100px 15px;
+		z-index: 2;
+		margin-top: 25px;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		min-height: 100vh;
+		h1 {
+			font: 300 56px/66px $poppins;
+			color: #fff;
+			margin-top: 40px;
+		}
+		p {
+			font: 300 18px/32px $poppins;
+			color: #fff;
+			margin-top: 40px;
+			margin-bottom: 50px;
+			margin-left: 0%;
+			margin-right: 0%;
+		}
+		a {
+			margin-top: 30px;
+		}
+		a:hover {
+			text-decoration: none;
+		}
+		.glyphicon-menu-down {
+			display: inline-block;
+			margin-top: 60px;
+			font-size: 30px;
+			color: #ffdc48;
+			opacity: 0.7;
+			transition: all 200ms;
+		}
+		.glyphicon-menu-down:hover {
+			transform: translate(0px, 5px);
+			-webkit-transform: translate(0px, 5px);
+			-moz-transform: translate(0px, 5px);
+			-o-transform: translate(0px, 5px);
+			-ms-transform: translate(0px, 5px);
+			transition: all 200ms;
+		}
+	}
+}
+
+
+/***** 05. Features Section *****/
+#features-section {
+	padding-top: 70px;
+	padding-bottom: 20px;
+	background-color: $light-gray;
+
+	h1 {
+		margin-bottom: 50px;
+	}
+
+	h2 {
+		margin-bottom: 15px;
+	}
+
+	.features-icons {
+		font-size: 60px;
+		margin-bottom: 10px;
+	}
+
+	h3 {
+		font: 500 25px/30px $poppins;
+	}
+
+	p {
+		margin-bottom: 80px;
+	}
+}
+
+/***** 06. Description Section *****/
+#description-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+
+	h1 {
+		margin-bottom: 50px;
+	}
+
+	.first-row {
+		h2 {
+			margin-bottom: 20px;
+			margin-top: 35px;
+		}
+		.button-small-solid {
+			display: inline-block;
+			margin-top: 15px;
+		}
+	}
+
+	.second-row {
+		margin-top: 90px;
+		#myCarousel {
+			margin-bottom: 40px;
+		}
+		.nav-pills {
+			margin-top: 0px;
+			margin-bottom: 30px;
+			li {
+				text-align: center;
+				width: 100%;
+				text-decoration: none;
+				a {
+					font: 300 18px/26px $poppins;
+					background-color: none;
+					color: #6a6a6a;
+					border: 1px solid #aaa;
+					border-radius: 25px;
+					margin-right: 4px;
+					margin-top: 10px;
+					padding: 10px 30px 10px 30px;
+					text-decoration: none;
+				}
+			}
+			li {
+				a:hover {
+					background-color: #ffdc48;
+					color: $default-color;
+					border: 1px solid #ffdc48;
+				}
+			}
+			li.active {
+				a {
+					background-color: #ffdc48;
+					color: $default-color;
+					border: 1px solid #ffdc48;
+				}
+			}
+		}
+		#tab_a {
+			ul {
+				list-style: none;
+			}
+			.button-small-solid {
+				display: inline-block;
+				margin-top: 15px;
+			}
+		}
+		#tab_b {
+			margin-top: 20px;
+			.progress {
+				height: 30px;
+				border-radius: 4px;
+				margin-top: 20px;
+			}
+			.progress-bar {
+				text-align: left;
+				font: 300 14px/22px $poppins;
+				background-color: $primary-color;
+				color: white;
+				padding-left: 20px;
+				padding-top: 5px;
+			}
+		}
+		#tab_c {
+			.button-small-solid {
+				display: inline-block;
+				margin-top: 15px;
+			}
+		}
+		.tab-content {
+			ul {
+				padding-left: 20px;
+				.checkmark {
+					margin-right: 10px;
+				}
+			}
+		}
+	}
+}
+
+/***** 07. Video Section *****/
+#video-section {
+	padding-top: 110px;
+	padding-bottom: 120px;
+	background: $primary-color;
+	background-size: cover;
+	background-attachment: fixed;
+}
+
+
+/***** 08. Customers Section *****/
+#customers-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+	background-color: $light-gray;
+
+	h1 {
+		margin-bottom: 30px;
+	}
+
+	.logo-container {
+		width: 195px;
+		height: 130px;
+		display: inline-block;
+		margin: 30px 14px 30px 14px;
+		img {
+			width: 100%;
+			height: 100%;
+			opacity: 0.7;
+		}
+		img:hover {
+			opacity: 1;
+		}
+	}
+
+	#carousel-example-generic {
+		text-align: center;
+		margin-top: 40px;
+		margin-left: 0%;
+		margin-right: 0%;
+		img {
+			width: 105px;
+			height: 105px;
+			margin-bottom: 20px;
+		}
+		p {
+			padding-top: 15px;
+			width: 100%;
+		}
+		h2 {
+			font: 300 21px/30px $poppins;
+		}
+		a.left.carousel-control, a.right.carousel-control {
+			background: none;
+		}
+		.carousel-indicators {
+			position: static;
+			margin-top: 10px;
+		}
+		.carousel-indicators .active {
+			background-color: $default-color;
+			border: 2px solid $default-color;
+			width: 12px;
+			height: 12px;
+			margin-right: 4px;
+		}
+		.carousel-indicators li {
+			border: 1px solid $default-color;
+			width: 12px;
+			height: 12px;
+			margin: 0px;
+			margin-right: 4px;
+		}
+		.carousel-indicators li:hover {
+			background-color: $default-color;
+			border: 2px solid $default-color;
+			width: 12px;
+			height: 12px;
+			margin-right: 4px;
+		}
+		.carousel-content {
+			color: $default-color;
+			display: flex;
+			align-items: center;
+		}
+	}
+}
+
+/***** 09. Pricing Section *****/
+#pricing-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+
+	h1 {
+		margin-bottom: 40px;
+	}
+	h2 {
+		text-align: center;
+		padding-top: 10px;
+		color: $default-color;
+		margin-bottom: 20px;
+		font-weight: 300;
+	}
+	.pricing-column {
+		border: 2px solid #e5e5e5;
+		border-radius: 4px;
+		margin-top: 50px;
+		text-align: center;
+		max-width: 280px;
+		h3 {
+			font: 500 26px/30px $poppins;
+			text-align: center;
+			margin: 18px 15px 0px 15px;
+		}
+		.separator-pricing {
+			margin-top: 14px;
+		}
+		.price {
+			font: 300 72px/100px $poppins;
+			margin-top: 4px;
+		}
+		.pricing-first-p {
+			margin: 25px 15px 0px 15px;
+			color: $default-color;
+		}
+		p {
+			color: $default-color;
+			text-align: center;
+			margin-top: 15px;
+			margin-bottom: -6px;
+		}
+		.checkmark {
+			margin-right: 8px;
+			color: $primary-color;
+			font-size: 18px;
+			font-weight: bold;
+		}
+		.button {
+			display: inline-block;
+			padding-top: 13px;
+			padding-bottom: 8px;
+			margin-top: 30px;
+			width: 100%;
+			max-width: 100%;
+			background-color: #e5e5e5;
+			border-style: none;
+			border-radius: 2px;
+			color: $default-color;
+			font-size: 20px;
+			line-height: 32px;
+			text-decoration: none;
+		}
+
+	}
+
+	.pricing-column:hover {
+		border: 2px solid $primary-color;
+		.separator-pricing {
+			border-color: $primary-color;
+		}
+		.button {
+			background-color: $primary-color;
+			border-style: none;
+			color: #fff;
+		}
+	}
+
+}
+
+/***** 10. Free Trial Section *****/
+#free-trial-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+	background: $primary-color;
+	background-size: cover;
+	background-attachment: fixed;
+
+	h1 {
+		margin-bottom: 50px;
+		color: #fff;
+	}
+
+	p {
+		margin-bottom: 60px;
+		color: #fff;
+	}
+
+	form {
+		input {
+			height: 42px;
+			background: transparent;
+			font: 300 16px/26px $poppins;
+			color: #fff;
+			border: none;
+			box-shadow: none;
+			border-radius: 0px;
+			border-bottom: 1px solid rgba(255, 255, 255, 0.8);
+			text-align: center;
+			margin-top: 20px;
+		}
+		input:focus {
+			box-shadow: 0 4px 2px -2px rgba(81, 203, 238, 1);
+		}
+		::-webkit-input-placeholder { color: #fff; opacity: 0.8;}
+		::-moz-placeholder { color: #fff; opacity: 0.8;} /* firefox 19+ */
+		:-ms-input-placeholder { color: #fff; opacity: 0.8; } /* ie */
+		input:-moz-placeholder { color: #fff; opacity: 0.8;}
+		button {
+			margin-top: 20px;
+		}
+	}
+}
+
+/***** 11. About Us Section *****/
+#about-us-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+
+	h1 {
+		margin-bottom: 50px;
+	}
+
+	p {
+		margin-bottom: 60px;
+	}
+
+	h2 {
+		font-weight: 300;
+		margin-top: 60px;
+		margin-bottom: 40px;
+	}
+
+	img {
+		width: 90%;
+		border-radius: 10px;
+	}
+
+	.development-process {
+		text-align: left;
+		.process-container {
+			margin-top: 40px;
+		}
+		p {
+			margin-left: 0%;
+			margin-right: 0%;
+		}
+		.about-us-icons {
+			font-size: 38px;
+			color: $primary-color;
+			float: left;
+			margin-top: 3px;
+		}
+		.text-div {
+			margin-left: 55px;
+			margin-top: 10px;
+			h3 {
+				display: inline;
+			}
+			p {
+				margin-bottom: 5px;
+			}
+		}
+	}
+}
+
+
+/***** 12. Newsletter Section *****/
+#newsletter-section {
+	padding-top: 70px;
+	padding-bottom: 80px;
+	background-color: $light-gray;
+
+	p {
+		margin-bottom: 60px;
+		margin-left: 5%;
+		margin-right: 5%;
+	}
+
+	form {
+		margin-top: 15px;
+		::-webkit-input-placeholder { color: $default-color; opacity: 0.8;}
+		::-moz-placeholder { color: $default-color; opacity: 0.8;} /* firefox 19+ */
+		:-ms-input-placeholder { color: $default-color; opacity: 0.8; } /* ie */
+		input:-moz-placeholder { color: $default-color; opacity: 0.8;}
+		input {
+			height: 42px;
+			width: 280px;
+			margin-right: 0px;
+			background: transparent;
+			font: 300 16px/26px $poppins;
+			color: $default-color;
+			border: none;
+			box-shadow: none;
+			border-radius: 0px;
+			border-bottom: 1px solid rgba(0, 0, 0, 1);
+			text-align: center;
+		}
+		input:focus, textarea:focus {
+			box-shadow: 0 5px 2px -2px rgba(190, 190, 190, 1);
+		}
+		.form-group {
+			display: inline-block;
+		}
+		button {
+			display: inline-block;
+			border: none;
+			margin-top: 10px;
+		}
+	}
+}
+
+
+/***** 13. Our Team Section *****/
+#our-team-section {
+	padding-top: 70px;
+	padding-bottom: 90px;
+	background:$primary-color;
+	background-size: cover;
+	background-attachment: fixed;
+
+	h1 {
+		margin-bottom: 30px;
+		color: #fff;
+	}
+
+	.team-members {
+		display: inline-block;
+		img {
+			width: 81%;
+			margin-left: 7px;
+			margin-right: 7px;
+			margin-top: 40px;
+		}
+		p {
+			.job-title {
+				font-weight: 500;
+			}
+			margin-top: 15px;
+			color: #fff;
+		}
+	}
+}
+
+
+/***** 14. Social Media Section *****/
+#social-media-section {
+	padding-top: 19px;
+	padding-bottom: 18px;
+	background-color: $brand-primary;
+
+	span {
+		font-size: 40px;
+		color: #fff;
+		margin: 7px 5px 7px 5px;
+	}
+
+	a {
+		opacity: 0.7;
+	}
+
+	a:hover {
+		opacity: 1;
+	}
+}
+
+
+/***** 15. Contact Section *****/
+#contact-section {
+	padding-top: 40px;
+	padding-bottom: 60px;
+	background-color: #fff;
+
+	h1 {
+		margin-bottom: 50px;
+	}
+
+	p {
+		margin-left: 5%;
+		margin-right: 5%;
+	}
+	form {
+		margin-top: 40px;
+		::-webkit-input-placeholder { /* Chrome/Opera/Safari */
+		  color: $default-color;
+		  opacity: 0.8;
+		}
+		::-moz-placeholder { /* Firefox 19+ */
+		  color: $default-color;
+		  opacity: 0.8;
+		}
+		:-ms-input-placeholder { /* IE 10+ */
+		 color: $default-color;
+		  opacity: 0.8;
+		}
+		:-moz-placeholder { /* Firefox 18- */
+		  color: $default-color;
+		  opacity: 0.8;
+		}
+		input {
+			height: 42px;
+			background: transparent;
+			font: 300 16px/26px $poppins;
+			color: $default-color;
+			border: none;
+			box-shadow: none;
+			border-radius: 0px;
+			border-bottom: 1px solid rgba(0, 0, 0, 1);
+			text-align: center;
+			margin-top: 20px;
+		}
+		input:focus, textarea:focus {
+			box-shadow: 0 5px 2px -2px rgba(190, 190, 190, 1);
+		}
+		textarea {
+			background-color: transparent;
+			color: $default-color;
+			font: 300 16px/26px $poppins;
+			border: 1px solid rgba(0, 0, 0, 0.8);
+			border-radius: 10px;
+			margin-top: 50px;
+		}
+		textarea[placeholder] {
+			text-align: left;
+		}
+		button {
+			margin-top: 20px;
+			border: none;
+		}
+	}
+
+	.map-responsive {
+		overflow: hidden;
+		padding-bottom: 56.25%;
+		position: relative;
+		height: 0;
+		border: 4px solid $light-gray;
+		border-radius: 4px;
+		margin-top: 0px;
+	}
+
+	.map-responsive iframe {
+		left: 0;
+		top: 0;
+		height: 100%;
+		width: 100%;
+		position: absolute;
+		border: none;
+	}
+
+	.location-information {
+		margin-top: 60px;
+
+		ul {
+			margin-top: 30px;
+			list-style-type: none;
+			padding-left: 0px;
+		}
+
+		.location-item {
+			margin-right: 14px;
+		}
+		.location-icons {
+			font-size: 15px;
+			margin-right: 5px;
+			width: 20px;
+		}
+		.icon-phone {
+			margin-right: 1px;
+		}
+		.icon-envelope {
+			margin-right: 7px;
+		}
+	}
+}
+
+
+/***** 16. Footer *****/
+footer {
+	padding-top: 22px;
+	padding-bottom: 18px;
+	background-color: #e5e5e5;
+
+	p {
+		font: 300 14px/22px $poppins;
+		color: $default-color;
+		text-align: center;
+		opacity: 0.8;
+		width: 90%;
+		margin: 0 auto;
+	}
+}
+
+
+/***** 17. Back To Top Button *****/
+a.back-to-top {
+	display: none;
+	width: 40px;
+	height: 40px;
+	// text-indent: -9999px;
+	position: fixed;
+	z-index: 999;
+	right: 10px;
+	bottom: 10px;
+	background: $brand-success no-repeat center 47%;
+	-webkit-border-radius: 30px;
+	-moz-border-radius: 30px;
+	border-radius: 30px;
+	background-size: 18px 18px;
+  text-align: center;
+  color: white;
+  font-size: 2em;
+}
+
+a:hover.back-to-top {
+	background-color: #193e52;
+}
+
+/***** 18. Media Queries *****/
+/*Min-width width 768*/
+@media (min-width: 768px) {
+	.navbar-brand.img-logo {
+		padding: 2px 0 0 0;
+	}
+
+	.navbar-custom.affix .navbar-brand.img-logo {
+		width: 101px;
+		height: 35px;
+		margin-top: 6px;
+	}
+
+	.navbar-custom {
+		background-color: transparent;
+		padding: 25px 0;
+		-webkit-transition: padding 0.3s;
+		-moz-transition: padding 0.3s;
+		transition: padding 0.3s;
+		border: none;
+	}
+
+	.navbar-custom .navbar-brand {
+		font-size: 2em;
+		-webkit-transition: all 0.3s;
+		-moz-transition: all 0.3s;
+		transition: all 0.3s;
+	}
+
+	.navbar-custom .navbar-nav > .active > a {
+		border-radius: 3px;
+	}
+
+	.navbar-custom.affix {
+		background-color: $primary-color;
+		padding: 5px 0;
+	}
+
+	a.navbar-brand.scrolling {
+		font: 300 28px/16px $poppins;
+		margin-top: 0px;
+	}
+
+	.navbar-custom.affix .navbar-brand {
+		font: 300 25px/20px $poppins;
+	}
+
+	.navbar-custom .nav li a.scrolling {
+		padding-left: 12px;
+		padding-right: 12px;
+	}
+
+	a.navbar-brand.img-logo.scrolling {
+		margin-left: 0px;
+	}
+
+	header {
+		min-height: 100%;
+		.header-content {
+			position: relative;
+			width: 100%;
+			padding: 100px 15px;
+			z-index: 2;
+			margin-top: 0px;
+			h1 {
+				font: 300 62px/76px $poppins;
+				margin-top: 150px;
+			}
+			p {
+				font: 300 20px/32px $poppins;
+				margin-left: 5%;
+				margin-right: 5%;
+			}
+		}
+	}
+
+	#features-section {
+		padding-top: 110px;
+		padding-bottom: 50px;
+		h1 {
+			margin-bottom: 80px;
+		}
+		.sub-heading {
+			margin-left: 5%;
+			margin-right: 5%;
+		}
+	}
+
+	#description-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 80px;
+		}
+		.first-row {
+			.text-center {
+				text-align: left;
+			}
+		}
+		.second-row {
+			margin-top: 120px;
+			.nav-pills {
+				li {
+					width: auto;
+					text-align: initial;
+				}
+			}
+			.text-center {
+				text-align: left;
+			}
+		}
+	}
+
+	#customers-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 80px;
+		}
+		#carousel-example-generic {
+			margin-top: 90px;
+			margin-left: 5%;
+			margin-right: 5%;
+		}
+	}
+
+	#pricing-section {
+		padding-top: 110px;
+		padding-bottom: 130px;
+		h1 {
+			margin-bottom: 70px;
+		}
+		h2 {
+			margin-bottom: -10px;
+		}
+	}
+
+	#free-trial-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 80px;
+		}
+		p {
+			margin-left: 5%;
+			margin-right: 5%;
+		}
+	}
+
+	#about-us-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 80px;
+		}
+		p {
+			margin-left: 5%;
+			margin-right: 5%;
+		}
+	}
+
+	#newsletter-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		p {
+			margin-bottom: 20px;
+			margin-left: 5%;
+			margin-right: 5%;
+		}
+		form {
+			input {
+				margin-right: 20px;
+			}
+		}
+	}
+
+	#our-team-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 60px;
+		}
+	}
+
+	#contact-section {
+		padding-top: 110px;
+		padding-bottom: 120px;
+		h1 {
+			margin-bottom: 90px;
+		}
+		form {
+			button {
+				margin-top: 15px;
+			}
+		}
+		.location-information {
+			ul {
+				margin-top: 5px;
+				li {
+					display: inline;
+				}
+			}
+		}
+	}
+}
+
+/*Min-width 992*/
+@media (min-width: 992px) {
+	.navbar-brand.img-logo {
+		width: 129px;
+		height: 45px;
+		padding: 0;
+		margin-top: 3px;
+	}
+
+	.navbar-custom.affix .navbar-brand.img-logo {
+		margin-top: 8px;
+	}
+
+	header {
+		.header-content {
+			h1 {
+				margin-top: 150px;
+			}
+		}
+	}
+
+	#description-section {
+		.first-row {
+			img {
+				width: 95%;
+			}
+			h2 {
+				margin-top: 0px;
+			}
+		}
+		.second-row {
+			margin-top: 130px;
+			.nav-pills {
+				margin-top: -10px;
+			}
+			.carousel {
+				width: 95%;
+				float: right;
+			}
+		}
+	}
+
+	#free-trial-section {
+		form {
+			input {
+				margin-top: 0px;
+			}
+		}
+	}
+
+	#about-us-section {
+		.development-process {
+			.process-container {
+				margin-top: 0px;
+			}
+			.about-us-icons {
+				margin-top: 11px;
+			}
+		}
+	}
+
+	#contact-section {
+		.map-responsive {
+			width: 97%;
+		}
+		form {
+			margin-top: 0px;
+			width: 97%;
+			float: right;
+			textarea {
+				margin-top: 15px;
+			}
+			input {
+				margin-top: 0px;
+			}
+			button {
+				margin-top: 5px;
+			}
+		}
+	}
+}
+
+/*Min-width 1200*/
+@media (min-width: 1200px) {
+	#description-section {
+		.first-row {
+			h2 {
+				margin-top: 65px;
+			}
+		}
+		.second-row {
+			.nav-pills {
+				margin-top: 0px;
+			}
+
+		}
+	}
+
+	#contact-section {
+		form {
+			margin-top: 15px;
+			textarea {
+				margin-top: 20px;
+			}
+			button {
+				margin-top: 15px;
+			}
+		}
+		.location-information {
+			p {
+				margin-bottom: 0px;
+			}
+		}
+	}
+}