@subiz/widget-v4 4.0.57 → 4.0.61

package/order.html

@@ -0,0 +1,784 @@
+<html>
+	<head>
+		<title>Subiz preview</title>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, intial-scale=1.0" />
+		<link
+			rel="stylesheet"
+			href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
+			integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
+			crossorigin="anonymous"
+		/>
+		<link
+			rel="stylesheet"
+			href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+			integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
+			crossorigin="anonymous"
+		/>
+		<style>
+			/* make the environment look like widget environment */
+			#sbz-pop * {
+				all: unset;
+			}
+		</style>
+		<style>
+			ul,
+			ol {
+				list-style: none;
+				list-style-image: none;
+				margin: 0;
+				padding: 0;
+				color: #858585;
+				font-size: 14px;
+				line-height: 24px;
+				margin-bottom: 20px;
+			}
+
+			ul li,
+			ol li {
+				font-size: 17px;
+				line-height: 28px;
+				font-family: 'Open Sans', sans-serif;
+				list-style-type: none;
+			}
+
+			ul li i {
+				vertical-align: middle;
+				padding-right: 5px;
+			}
+
+			p {
+				font-size: 17px;
+				line-height: 28px;
+				font-weight: 400;
+				color: #7c8595;
+				margin-bottom: 15px;
+				font-family: 'Open Sans', sans-serif;
+			}
+
+			a,
+			a:hover,
+			a:focus,
+			a:active,
+			a:visited {
+				text-decoration: none;
+				outline: 0;
+			}
+
+			a:hover {
+				color: #017df7;
+			}
+
+			h1,
+			h2,
+			h3,
+			h4,
+			h5,
+			h6 {
+				font-family: 'Dosis', sans-serif;
+				line-height: 1.2;
+				margin-top: 0;
+				margin-bottom: 20px;
+				color: #071e55;
+				font-weight: 600;
+			}
+
+			h1 {
+				font-size: 46px;
+			}
+
+			h2 {
+				font-size: 36px;
+			}
+
+			h3 {
+				font-size: 30px;
+			}
+
+			h2.section-title {
+				margin-bottom: 10px;
+			}
+
+			p.section-subtitle {
+				font-size: 18px;
+			}
+
+			p.section-subtitle.white {
+				color: #ffffff;
+			}
+
+			.white-text {
+				color: #fff;
+			}
+
+			.blue {
+				color: #017df7;
+			}
+
+			.section-top-border {
+				border-top: 1px solid #efefef;
+			}
+
+			.section-bottom-border {
+				border-bottom: 1px solid #efefef;
+			}
+
+			.section-white {
+				background: #fff;
+				padding: 90px 0 100px 0;
+			}
+
+			.section-grey {
+				background: #fafbfc;
+				padding: 90px 0 100px 0;
+			}
+
+			.section-blue {
+				background-color: #1e90ff;
+				padding: 90px 0;
+			}
+
+			.section-white.no-padding,
+			.section-grey.no-padding,
+			.section-blue.no-padding {
+				padding: 0;
+			}
+
+			.section-white.medium-paddings,
+			.section-grey.medium-paddings,
+			.section-blue.medium-paddings {
+				padding: 60px 0;
+			}
+
+			.section-white.small-paddings,
+			.section-grey.small-paddings,
+			.section-blue.small-paddings {
+				padding: 30px 0;
+			}
+
+			.section-white.xsmall-paddings,
+			.section-grey.xsmall-paddings,
+			.section-blue.xsmall-paddings {
+				padding: 10px 0;
+			}
+
+			.section-white.small-padding-top,
+			.section-grey.small-padding-top,
+			.section-blue.small-padding-top {
+				padding: 30px 0 90px 0;
+			}
+
+			.section-white.small-padding-bottom,
+			.section-grey.small-padding-bottom,
+			.section-blue.small-padding-bottom {
+				padding: 90px 0 70px 0;
+			}
+
+			.section-white.no-padding-bottom,
+			.section-grey.no-padding-bottom,
+			.section-blue.no-padding-bottom {
+				padding: 90px 0 0 0;
+			}
+
+			.width-100 {
+				width: 100%;
+			}
+
+			/* margin and padding classes */
+
+			.padding-top-80 {
+				padding-top: 80px !important;
+			}
+			/* ========================================================== */
+			/* 			               02. MENU-NAV                       */
+			/* ========================================================== */
+
+			.navbar-brand {
+				display: flex;
+				align-items: center;
+				font-family: 'Dosis', sans-serif;
+				font-size: 28px;
+				font-weight: 700;
+				color: #3b64d2 !important;
+			}
+
+			.navbar {
+				width: 100%;
+				z-index: 9999;
+				padding-top: 10px;
+				padding-bottom: 10px;
+				padding-left: 0;
+				padding-right: 0;
+			}
+
+			.navbar-toggler {
+				border: 1px solid #1089d4;
+			}
+
+			.navbar-toggler-icon {
+				width: 1.3em;
+				height: 1.3em;
+			}
+
+			.navbar-toggler-icon i {
+				color: #1089d4;
+				vertical-align: middle;
+			}
+
+			.navbar-fixed-top {
+				position: absolute !important;
+				background-color: rgba(0, 0, 0, 0) !important;
+				border-bottom: none;
+				transition: background-color 0.25s ease 0s;
+			}
+
+			.navbar-fixed-top.opaque {
+				position: fixed !important;
+				background-color: #fff !important;
+				border-bottom: 1px solid #efefef;
+				transition: all 0.25s ease-in-out 0s;
+			}
+
+			.navbar-fixed-top .navbar-nav > li > a,
+			.navbar-fixed-top .navbar-nav > li > a:hover {
+				color: #1089d4 !important;
+				-webkit-transition: all 0.5s ease;
+				-moz-transition: all 0.5s ease;
+				-o-transition: all 0.5s ease;
+				transition: all 0.5s ease;
+			}
+
+			.navbar-fixed-top .navbar-nav > li > a {
+				color: #405263 !important;
+				font-size: 18px !important;
+				line-height: 30px !important;
+				padding: 10px 20px !important;
+				font-family: 'Dosis', sans-serif;
+				font-weight: 600;
+			}
+
+			.navbar-fixed-top .navbar-nav .current a {
+				color: #1089d4 !important;
+				-webkit-transition: all 0.5s ease;
+				-moz-transition: all 0.5s ease;
+				-o-transition: all 0.5s ease;
+				transition: all 0.5s ease;
+			}
+
+			.navbar-fixed-top.opaque .navbar-nav .current a {
+				color: #1089d4 !important;
+				-webkit-transition: all 0.5s ease;
+				-moz-transition: all 0.5s ease;
+				-o-transition: all 0.5s ease;
+				transition: all 0.5s ease;
+			}
+
+			.navbar-fixed-top .navbar-nav > li > a.discover-btn {
+				color: #1089d4 !important;
+				background: transparent;
+				border: 1px solid #1e90ff;
+				border-radius: 8px 8px;
+				padding: 12px 18px !important;
+				margin-left: 10px;
+				margin-right: 15px;
+				font-family: 'Dosis', sans-serif;
+			}
+
+			.navbar-fixed-top .navbar-nav > li > a.discover-btn:hover {
+				border: 1px solid #1e90ff;
+				color: #fff !important;
+				background: #1e90ff;
+			}
+
+			/* ========================================================== */
+			/* 			                03. FOOTER                        */
+			/* ========================================================== */
+
+			.footer {
+				position: relative;
+				overflow: hidden;
+				display: block;
+				padding: 60px 0 55px 0;
+				background-color: #1e90ff;
+			}
+
+			.footer p {
+				color: #fff;
+			}
+
+			.footer p a {
+				font-size: 16px;
+				color: #fff;
+				text-decoration: underline;
+			}
+
+			/* Footer Social Icons */
+			ul.footer_social {
+				width: 100%;
+				max-width: 1140px;
+				display: block;
+				margin: 0 auto;
+				padding-top: 5px;
+				text-align: center;
+			}
+
+			ul.footer_social li {
+				display: inline-block;
+				margin: 0;
+				line-height: 100% !important;
+			}
+
+			ul.footer_social li a i {
+				display: inline-block;
+				margin: 0 8px;
+				padding: 0;
+				font-size: 26px !important;
+				line-height: 26px !important;
+				color: #fff;
+				transition: all 0.5s ease-in-out;
+				-moz-transition: all 0.25s ease-in-out;
+				-webkit-transition: all 0.25s ease-in-out;
+			}
+
+			ul.footer_social li a i:hover {
+				color: #b2d8fd;
+			}
+
+			/* ========================================================== */
+			/* 			               04. HOME                           */
+			/* ========================================================== */
+
+			.home-section {
+				position: relative;
+				z-index: 999;
+				overflow: hidden;
+				position: relative;
+				padding-top: 140px;
+				padding-bottom: 70px;
+				background-color: #fff;
+			}
+
+			.home-section h1 {
+				color: #071e55;
+			}
+
+			.home-section p {
+				margin-bottom: 30px;
+				max-width: 600px;
+				font-size: 18px;
+				line-height: 30px;
+				font-weight: 400;
+				color: #405263;
+			}
+
+			/* ========================================================== */
+			/* 			                06. FEATURES                      */
+			/* ========================================================== */
+
+			.main-services {
+				margin-top: 50px;
+				text-align: center;
+			}
+
+			.main-services img {
+				width: 210px;
+				margin-bottom: 25px;
+			}
+
+			.main-services h3 {
+				font-size: 26px;
+				color: #292929;
+				margin-bottom: 15px;
+			}
+
+			.main-services p {
+				padding: 0 10px;
+				margin-bottom: 25px;
+			}
+
+			blockquote {
+				font-size: 16px;
+				color: #4285f4;
+				border-left: 2px solid #4285f4;
+			}
+
+			/* ========================================================== */
+			/* 			               07. PRICING                        */
+			/* ========================================================== */
+
+			.price-box {
+				text-align: center;
+				background-color: #fff;
+				border-bottom: 3px solid #e0e0e0;
+				box-shadow: rgba(33, 33, 33, 0.06) 0 4px 24px 5px;
+				padding: 40px 0 30px 0;
+				margin-bottom: 20px;
+				border-radius: 8px 8px;
+				transition: all 0.3s ease-in-out;
+				-webkit-transition: all 0.3s ease-in-out;
+				-webkit-backface-visibility: hidden;
+				-moz-osx-font-smoothing: grayscale;
+			}
+
+			.price-box:hover {
+				border-bottom: 3px solid #1e90ff;
+				transition: all 1s;
+			}
+
+			.price-box .price-subtitle,
+			.price-box .price-text {
+				color: #6a6a6a;
+			}
+
+			ul.pricing-list {
+				padding: 0 55px;
+			}
+
+			ul.pricing-list li.price-title {
+				font-size: 20px;
+				line-height: 24px;
+				font-weight: 700;
+				letter-spacing: 1px;
+				color: #071e55;
+			}
+
+			ul.pricing-list li.price-value {
+				font-family: 'Dosis', sans-serif;
+				font-size: 70px;
+				line-height: 70px;
+				display: block;
+				margin-top: 20px;
+				margin-bottom: 10px;
+				color: #071e55;
+			}
+
+			ul.pricing-list li.price-subtitle {
+				font-family: 'Open Sans', sans-serif;
+				margin-bottom: 30px;
+				font-size: 16px;
+				line-height: 24px;
+				font-weight: 600;
+				color: #6a6a6a;
+			}
+
+			ul.pricing-list li.price-text {
+				display: block;
+				font-family: 'Open Sans', sans-serif;
+				text-align: left;
+				font-size: 16px;
+				line-height: 28px;
+				font-weight: 400;
+				margin-bottom: 5px;
+			}
+
+			ul.pricing-list li.price-tag a {
+				color: #fff;
+				background: #1e90ff;
+				border: 1px solid #1e90ff;
+				border-radius: 5px 5px;
+				padding: 15px 30px;
+				display: inline-block;
+				font-size: 15px;
+				line-height: 24px;
+				font-weight: 600;
+				margin: 30px 0 5px 0;
+				transition: all 0.3s ease-in-out;
+				-webkit-transition: all 0.3s ease-in-out;
+			}
+
+			ul.pricing-list li.price-tag a:hover {
+				background: #037aef;
+			}
+
+			ul.pricing-list li.price-tag-line a {
+				color: #1e90ff;
+				background: transparent;
+				border: 1px solid #1e90ff;
+				border-radius: 5px 5px;
+				padding: 15px 30px;
+				display: inline-block;
+				font-size: 15px;
+				line-height: 24px;
+				font-weight: 600;
+				margin: 30px 0 5px 0;
+				transition: all 0.3s ease-in-out;
+				-webkit-transition: all 0.3s ease-in-out;
+			}
+
+			ul.pricing-list li.price-tag-line a:hover {
+				color: #fff;
+				background: #037aef;
+				border: 1px solid #037aef;
+			}
+
+			.ribbon {
+				position: absolute;
+				right: 8px;
+				top: -5px;
+				z-index: 1;
+				overflow: hidden;
+				width: 75px;
+				height: 75px;
+				text-align: right;
+			}
+
+			.ribbon span {
+				font-size: 10px;
+				color: #fff;
+				text-transform: uppercase;
+				text-align: center;
+				font-weight: bold;
+				line-height: 20px;
+				transform: rotate(45deg);
+				width: 100px;
+				display: block;
+				box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
+				position: absolute;
+				top: 19px;
+				right: -21px;
+				background-color: #1e90ff;
+			}
+
+			.ribbon span::before {
+				content: '';
+				position: absolute;
+				left: 0px;
+				top: 100%;
+				z-index: -1;
+				border-left: 3px solid #79a70a;
+				border-right: 3px solid transparent;
+				border-bottom: 3px solid transparent;
+				border-top: 3px solid #79a70a;
+				border-left-color: #1e5799;
+				border-top-color: #1e5799;
+			}
+
+			.ribbon span::after {
+				content: '';
+				position: absolute;
+				right: 0%;
+				top: 100%;
+				z-index: -1;
+				border-right: 3px solid #79a70a;
+				border-left: 3px solid transparent;
+				border-bottom: 3px solid transparent;
+				border-top: 3px solid #79a70a;
+				border-right-color: #1e5799;
+				border-top-color: #1e5799;
+			}
+
+			/* ========================================================== */
+			/* 			               10. OTHER ELEMENTS                 */
+			/* ========================================================== */
+
+			/* b) Buttons */
+
+			.btn-white {
+				font-family: 'Dosis', sans-serif;
+				font-size: 18px;
+				line-height: 22px;
+				font-weight: 600;
+				color: #0883fb;
+				background-color: #ffffff;
+				border: 1px solid #fff;
+				box-shadow: 0px 8px 40px 0 rgba(0, 0, 0, 0.37);
+				border-radius: 5px 5px;
+				margin: 10px 10px 0 10px 0;
+				padding: 20px 30px;
+				display: inline-block;
+				transition: all 0.4s ease-in-out;
+				-webkit-transition: all 0.4s ease-in-out;
+			}
+
+			.btn-white:hover {
+				box-shadow: 0px 4px 10px 0 rgba(0, 0, 0, 0.5);
+				color: #0470ea !important;
+				background: #f9f9f9;
+			}
+
+			.btn-white-border {
+				color: #1089d4;
+				background: transparent;
+				font-family: 'Dosis', sans-serif;
+				font-size: 18px;
+				line-height: 22px;
+				font-weight: 600;
+				border: 1px solid #1089d4;
+				border-radius: 5px 5px;
+				margin: 10px 10px;
+				padding: 15px 30px;
+				display: inline-block;
+				transition: all 0.4s ease-in-out;
+				-webkit-transition: all 0.4s ease-in-out;
+			}
+
+			.btn-white-border:hover {
+				color: #0883fb;
+				background-color: #ffffff;
+				border: 1px solid #fff;
+			}
+
+			.btn-white i,
+			.btn-white-border i {
+				font-size: 22px;
+				line-height: 22px;
+				margin-right: 10px;
+				vertical-align: text-top;
+			}
+
+			.btn-blue {
+				font-family: 'Dosis', sans-serif;
+				font-size: 18px;
+				line-height: 22px;
+				font-weight: 600;
+				color: #fff;
+				background-color: #1089d4;
+				box-shadow: 0px 8px 40px 0 rgba(0, 0, 0, 0.37);
+				text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
+				letter-spacing: 1px;
+				border-radius: 5px 5px;
+				margin: 10px 10px 0 10px 0;
+				padding: 20px 30px;
+				display: inline-block;
+				transition: all 0.4s ease-in-out;
+				-webkit-transition: all 0.4s ease-in-out;
+			}
+
+			.btn-blue:hover {
+				box-shadow: 0px 4px 10px 0 rgba(0, 0, 0, 0.5);
+				color: #fff !important;
+				background: #3498db;
+			}
+
+			.btn-blue.small,
+			.btn-blue-line.small {
+				font-size: 16px;
+				padding: 14px 20px;
+			}
+
+			.btn-blue-line {
+				font-family: 'Dosis', sans-serif;
+				font-size: 18px;
+				line-height: 22px;
+				font-weight: 600;
+				color: #017df7;
+				background-color: transparent;
+				border: 1px solid #1089d4;
+				border-radius: 10px 10px;
+				margin: 20px 10px 0 10px 0;
+				padding: 20px 30px;
+				display: inline-block;
+				transition: all 0.4s ease-in-out;
+				-webkit-transition: all 0.4s ease-in-out;
+			}
+
+			.btn-blue-line:hover {
+				color: #fff !important;
+				background: #3498db;
+			}
+
+			a.btn-blue:visited,
+			a.btn-blue:focus {
+				color: #fff !important;
+			}
+
+			.partners-paddings {
+				padding: 50px 0 25px 0;
+			}
+
+			ul.partners-mentions li {
+				display: inline-block;
+				margin: 15px 30px;
+				-webkit-transition: all 0.25s ease-in-out;
+				-moz-transition: all 0.25s ease-in-out;
+				-ms-transition: all 0.25s ease-in-out;
+				-o-transition: all 0.25s ease-in-out;
+				transition: all 0.25s ease-in-out;
+			}
+
+			ul.partners-mentions li img {
+				max-height: 62px;
+				opacity: 0.4;
+			}
+
+			ul.partners-mentions li img:hover {
+				opacity: 0.8;
+				-webkit-transition: all 0.25s ease-in-out;
+				-moz-transition: all 0.25s ease-in-out;
+				-ms-transition: all 0.25s ease-in-out;
+				-o-transition: all 0.25s ease-in-out;
+				transition: all 0.25s ease-in-out;
+			}
+
+			/* ========================================================== */
+			/* 			             14. MEDIA QUERIES                    */
+			/* ========================================================== */
+
+			@media (max-width: 991px) {
+				.navbar-fixed-top {
+					background-color: #fff !important;
+				}
+
+				.navbar-fixed-top.opaque {
+					padding: 0;
+				}
+
+				.navbar-fixed-top {
+					border-bottom: 1px solid #efefef;
+				}
+
+				.navbar-fixed-top .navbar-nav > li.discover-link {
+					margin-top: 10px;
+				}
+
+				.navbar-fixed-top .navbar-nav > li > a.discover-btn {
+					padding: 8px 12px !important;
+					margin-left: 20px;
+					font-size: 17px !important;
+				}
+			}
+
+			@media (max-width: 768px) {
+				.home-section {
+					padding-top: 50px;
+					padding-bottom: 50px;
+				}
+
+				#newsletter-form #email_newsletter {
+					width: 80%;
+					max-width: 320px;
+				}
+
+				.hero-image {
+					margin-top: 70px;
+				}
+			}
+
+			@media (max-width: 375px) {
+				.navbar-toggle {
+					margin-bottom: 0;
+					border: 1px solid #9f9f9f !important;
+				}
+
+				.home-section h1 {
+					font-size: 38px;
+					line-height: 44px;
+				}
+
+				ul.partners-mentions li img {
+					max-height: 36px;
+				}
+
+				.section-white {
+					padding: 60px 0 70px 0 !important;
+				}
+
+				.section-white.small-padding-bottom,
+				.section-grey.small-padding-bottom {
+					padding: 60px 0 50px 0 !important;
+				}
+			}
+		</style>
+	</head>
+	<body></body>
+</html>