markup v 0.5

Open/bootstrap/css/bootstrap-theme.css

@@ -0,0 +1,587 @@
+/*!
+ * Bootstrap v3.3.7 (http://getbootstrap.com)
+ * Copyright 2011-2016 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+.btn-default,
+.btn-primary,
+.btn-success,
+.btn-info,
+.btn-warning,
+.btn-danger {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
+}
+.btn-default:active,
+.btn-primary:active,
+.btn-success:active,
+.btn-info:active,
+.btn-warning:active,
+.btn-danger:active,
+.btn-default.active,
+.btn-primary.active,
+.btn-success.active,
+.btn-info.active,
+.btn-warning.active,
+.btn-danger.active {
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+}
+.btn-default.disabled,
+.btn-primary.disabled,
+.btn-success.disabled,
+.btn-info.disabled,
+.btn-warning.disabled,
+.btn-danger.disabled,
+.btn-default[disabled],
+.btn-primary[disabled],
+.btn-success[disabled],
+.btn-info[disabled],
+.btn-warning[disabled],
+.btn-danger[disabled],
+fieldset[disabled] .btn-default,
+fieldset[disabled] .btn-primary,
+fieldset[disabled] .btn-success,
+fieldset[disabled] .btn-info,
+fieldset[disabled] .btn-warning,
+fieldset[disabled] .btn-danger {
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
+.btn-default .badge,
+.btn-primary .badge,
+.btn-success .badge,
+.btn-info .badge,
+.btn-warning .badge,
+.btn-danger .badge {
+  text-shadow: none;
+}
+.btn:active,
+.btn.active {
+  background-image: none;
+}
+.btn-default {
+  text-shadow: 0 1px 0 #fff;
+  background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
+  background-image:      -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
+  background-image:         linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #dbdbdb;
+  border-color: #ccc;
+}
+.btn-default:hover,
+.btn-default:focus {
+  background-color: #e0e0e0;
+  background-position: 0 -15px;
+}
+.btn-default:active,
+.btn-default.active {
+  background-color: #e0e0e0;
+  border-color: #dbdbdb;
+}
+.btn-default.disabled,
+.btn-default[disabled],
+fieldset[disabled] .btn-default,
+.btn-default.disabled:hover,
+.btn-default[disabled]:hover,
+fieldset[disabled] .btn-default:hover,
+.btn-default.disabled:focus,
+.btn-default[disabled]:focus,
+fieldset[disabled] .btn-default:focus,
+.btn-default.disabled.focus,
+.btn-default[disabled].focus,
+fieldset[disabled] .btn-default.focus,
+.btn-default.disabled:active,
+.btn-default[disabled]:active,
+fieldset[disabled] .btn-default:active,
+.btn-default.disabled.active,
+.btn-default[disabled].active,
+fieldset[disabled] .btn-default.active {
+  background-color: #e0e0e0;
+  background-image: none;
+}
+.btn-primary {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #265a88 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #265a88 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #245580;
+}
+.btn-primary:hover,
+.btn-primary:focus {
+  background-color: #265a88;
+  background-position: 0 -15px;
+}
+.btn-primary:active,
+.btn-primary.active {
+  background-color: #265a88;
+  border-color: #245580;
+}
+.btn-primary.disabled,
+.btn-primary[disabled],
+fieldset[disabled] .btn-primary,
+.btn-primary.disabled:hover,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary:hover,
+.btn-primary.disabled:focus,
+.btn-primary[disabled]:focus,
+fieldset[disabled] .btn-primary:focus,
+.btn-primary.disabled.focus,
+.btn-primary[disabled].focus,
+fieldset[disabled] .btn-primary.focus,
+.btn-primary.disabled:active,
+.btn-primary[disabled]:active,
+fieldset[disabled] .btn-primary:active,
+.btn-primary.disabled.active,
+.btn-primary[disabled].active,
+fieldset[disabled] .btn-primary.active {
+  background-color: #265a88;
+  background-image: none;
+}
+.btn-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image:      -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #3e8f3e;
+}
+.btn-success:hover,
+.btn-success:focus {
+  background-color: #419641;
+  background-position: 0 -15px;
+}
+.btn-success:active,
+.btn-success.active {
+  background-color: #419641;
+  border-color: #3e8f3e;
+}
+.btn-success.disabled,
+.btn-success[disabled],
+fieldset[disabled] .btn-success,
+.btn-success.disabled:hover,
+.btn-success[disabled]:hover,
+fieldset[disabled] .btn-success:hover,
+.btn-success.disabled:focus,
+.btn-success[disabled]:focus,
+fieldset[disabled] .btn-success:focus,
+.btn-success.disabled.focus,
+.btn-success[disabled].focus,
+fieldset[disabled] .btn-success.focus,
+.btn-success.disabled:active,
+.btn-success[disabled]:active,
+fieldset[disabled] .btn-success:active,
+.btn-success.disabled.active,
+.btn-success[disabled].active,
+fieldset[disabled] .btn-success.active {
+  background-color: #419641;
+  background-image: none;
+}
+.btn-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image:      -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #28a4c9;
+}
+.btn-info:hover,
+.btn-info:focus {
+  background-color: #2aabd2;
+  background-position: 0 -15px;
+}
+.btn-info:active,
+.btn-info.active {
+  background-color: #2aabd2;
+  border-color: #28a4c9;
+}
+.btn-info.disabled,
+.btn-info[disabled],
+fieldset[disabled] .btn-info,
+.btn-info.disabled:hover,
+.btn-info[disabled]:hover,
+fieldset[disabled] .btn-info:hover,
+.btn-info.disabled:focus,
+.btn-info[disabled]:focus,
+fieldset[disabled] .btn-info:focus,
+.btn-info.disabled.focus,
+.btn-info[disabled].focus,
+fieldset[disabled] .btn-info.focus,
+.btn-info.disabled:active,
+.btn-info[disabled]:active,
+fieldset[disabled] .btn-info:active,
+.btn-info.disabled.active,
+.btn-info[disabled].active,
+fieldset[disabled] .btn-info.active {
+  background-color: #2aabd2;
+  background-image: none;
+}
+.btn-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image:      -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #e38d13;
+}
+.btn-warning:hover,
+.btn-warning:focus {
+  background-color: #eb9316;
+  background-position: 0 -15px;
+}
+.btn-warning:active,
+.btn-warning.active {
+  background-color: #eb9316;
+  border-color: #e38d13;
+}
+.btn-warning.disabled,
+.btn-warning[disabled],
+fieldset[disabled] .btn-warning,
+.btn-warning.disabled:hover,
+.btn-warning[disabled]:hover,
+fieldset[disabled] .btn-warning:hover,
+.btn-warning.disabled:focus,
+.btn-warning[disabled]:focus,
+fieldset[disabled] .btn-warning:focus,
+.btn-warning.disabled.focus,
+.btn-warning[disabled].focus,
+fieldset[disabled] .btn-warning.focus,
+.btn-warning.disabled:active,
+.btn-warning[disabled]:active,
+fieldset[disabled] .btn-warning:active,
+.btn-warning.disabled.active,
+.btn-warning[disabled].active,
+fieldset[disabled] .btn-warning.active {
+  background-color: #eb9316;
+  background-image: none;
+}
+.btn-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image:      -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-color: #b92c28;
+}
+.btn-danger:hover,
+.btn-danger:focus {
+  background-color: #c12e2a;
+  background-position: 0 -15px;
+}
+.btn-danger:active,
+.btn-danger.active {
+  background-color: #c12e2a;
+  border-color: #b92c28;
+}
+.btn-danger.disabled,
+.btn-danger[disabled],
+fieldset[disabled] .btn-danger,
+.btn-danger.disabled:hover,
+.btn-danger[disabled]:hover,
+fieldset[disabled] .btn-danger:hover,
+.btn-danger.disabled:focus,
+.btn-danger[disabled]:focus,
+fieldset[disabled] .btn-danger:focus,
+.btn-danger.disabled.focus,
+.btn-danger[disabled].focus,
+fieldset[disabled] .btn-danger.focus,
+.btn-danger.disabled:active,
+.btn-danger[disabled]:active,
+fieldset[disabled] .btn-danger:active,
+.btn-danger.disabled.active,
+.btn-danger[disabled].active,
+fieldset[disabled] .btn-danger.active {
+  background-color: #c12e2a;
+  background-image: none;
+}
+.thumbnail,
+.img-thumbnail {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+  background-color: #e8e8e8;
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:      -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+  background-color: #2e6da4;
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+  background-repeat: repeat-x;
+}
+.navbar-default {
+  background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%);
+  background-image:      -o-linear-gradient(top, #fff 0%, #f8f8f8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8));
+  background-image:         linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
+}
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
+  background-image:      -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2));
+  background-image:         linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075);
+}
+.navbar-brand,
+.navbar-nav > li > a {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
+}
+.navbar-inverse {
+  background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
+  background-image:      -o-linear-gradient(top, #3c3c3c 0%, #222 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222));
+  background-image:         linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  background-repeat: repeat-x;
+  border-radius: 4px;
+}
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .active > a {
+  background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%);
+  background-image:      -o-linear-gradient(top, #080808 0%, #0f0f0f 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f));
+  background-image:         linear-gradient(to bottom, #080808 0%, #0f0f0f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0);
+  background-repeat: repeat-x;
+  -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+          box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25);
+}
+.navbar-inverse .navbar-brand,
+.navbar-inverse .navbar-nav > li > a {
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
+}
+.navbar-static-top,
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  border-radius: 0;
+}
+@media (max-width: 767px) {
+  .navbar .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #fff;
+    background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+    background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+    background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+    background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+    background-repeat: repeat-x;
+  }
+}
+.alert {
+  text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
+}
+.alert-success {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image:      -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #b2dba1;
+}
+.alert-info {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image:      -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #9acfea;
+}
+.alert-warning {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image:      -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #f5e79e;
+}
+.alert-danger {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image:      -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dca7a7;
+}
+.progress {
+  background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image:      -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
+  background-image:         linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #286090 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #286090 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-success {
+  background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image:      -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
+  background-image:         linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-info {
+  background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image:      -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
+  background-image:         linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-warning {
+  background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image:      -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
+  background-image:         linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-danger {
+  background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image:      -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
+  background-image:         linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
+  background-repeat: repeat-x;
+}
+.progress-bar-striped {
+  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+  background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+  background-image:         linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+}
+.list-group {
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .075);
+}
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+  text-shadow: 0 -1px 0 #286090;
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2b669a 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2b669a 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #2b669a;
+}
+.list-group-item.active .badge,
+.list-group-item.active:hover .badge,
+.list-group-item.active:focus .badge {
+  text-shadow: none;
+}
+.panel {
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+          box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
+}
+.panel-default > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image:      -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
+  background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-primary > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image:      -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4));
+  background-image:         linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-success > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image:      -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
+  background-image:         linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-info > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image:      -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
+  background-image:         linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-warning > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image:      -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
+  background-image:         linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.panel-danger > .panel-heading {
+  background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image:      -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
+  background-image:         linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
+  background-repeat: repeat-x;
+}
+.well {
+  background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image:      -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
+  background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
+  background-image:         linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
+  background-repeat: repeat-x;
+  border-color: #dcdcdc;
+  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+          box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+}
+/*# sourceMappingURL=bootstrap-theme.css.map */

Open/bootstrap/js/npm.js

@@ -0,0 +1,13 @@
+// This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.
+require('../../js/transition.js')
+require('../../js/alert.js')
+require('../../js/button.js')
+require('../../js/carousel.js')
+require('../../js/collapse.js')
+require('../../js/dropdown.js')
+require('../../js/modal.js')
+require('../../js/tooltip.js')
+require('../../js/popover.js')
+require('../../js/scrollspy.js')
+require('../../js/tab.js')
+require('../../js/affix.js')

Open/index.html

@@ -0,0 +1,473 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<!-- <meta charset="UTF-8"> -->
+	<meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, minimum-scale=1">
+	<title>OPEN</title>
+	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">
+	<link rel="stylesheet" type="text/css" href="css/style.css">
+	<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+	<script type="text/javascript" src="js/script.js"></script>
+</head>
+<body>
+	<header id="scrollDestination">
+		<div class="container">
+			<div class="row">
+				<nav class="col-md-3">
+					<div class="hamburger" onclick="hamburgerClickHandler()">
+						<div class="bar_1"></div>
+						<div class="bar_2"></div>
+						<div class="bar_3"></div>
+					</div>
+					<ul>
+						<li><a href="#advantages">Advantage</a></li>
+						<li><a href="#ouroffices">Our offices</a></li>
+						<li><a href="#discount">Discount</a></li>
+						<li><a href="#statistics">Statistics</a></li>
+						<li><a href="#reviews">Reviews</a></li>
+						<li><a href="#details">Details</a></li>
+						<li><a href="#gift">Gift</a></li>
+						<li><a href="#contacts">Contacts</a></li>
+					</ul>
+				</nav>
+		
+				<div class="col-md-3 hidden-xs hidden-sm address_mail">
+					<span>Kharkiv, 3, Sumskaya st.</span>
+					<span>info@open1969.com</span>
+				</div>
+				<div class="col-md-3 hidden-xs hidden-sm phone_numbers">
+				 	<span>+38 (068) 089-48-83</span>
+				 	<span>+38 (099) 554-93-65</span>
+				</div>
+				<div class="col-md-3 hidden-xs hidden-sm socials">
+				 	<a href=""><img src="images/twitter.png"></a>
+				 	<a href=""><img src="images/instagram.png"></a>
+				 	<a href=""><img src="images/facebook.png"></a>
+				</div>
+			</div>
+		</div>
+	</header>
+
+	<section class="banner">
+		<div class="container">
+			<div class="row">
+				<aside class="col-md-3 col-md-offset-0 col-sm-6 col-sm-offset-3 col-xs-12">
+					<div>Coworking space</div>
+					<a href="#"><img src="images/logo.png"></a>
+					<div>European office in the center</div>
+					<div class="form">
+						<div>book your place right now</div>
+						<form id="form">
+							<input type="text" name="userName" placeholder="Your name" required autocomplete="off">
+							<input type="number" name="userNumber" placeholder="Your phonenumber" required autocomplete="off">
+							<button type="submit">book</button>
+						</form>
+					</div>
+				</aside>
+			</div>
+			<div class="arrow" href="#advantages"></div>
+		</div>
+	</section>
+
+	<main>
+		
+		<section class="advantage_block container" id="advantages">
+			<div class="why_we col-sm-4 col-sm-offset-4">why <span>we</span></div>
+			<div class="row">
+				<section class="slogan col-lg-6 col-lg-offset-0 col-xs-8 col-xs-offset-2">Great companies<br> start in good company</section>
+				<section class="advantages col-lg-6 clearfix">
+					<div class="advantage_column_left">
+						<div class="modern_equipment clearfix">
+							<img src="images/main/modern_equipment.png">
+							<span>Modern equipment,<br>Powerful computers</span>
+						</div>
+						<div class="comfortable_rooms clearfix">
+							<img src="images/main/comfortable_rooms.png">
+							<span>Comfortable meeting<br>rooms, with the whole<br> set ofequipment</span>
+						</div>
+						<div class="access clearfix">
+							<img src="images/main/access.png">
+							<span>Access to the <br>office 24/7</span>
+						</div>
+					</div>
+					<div class="advantage_column_right">
+						<div class="various_events clearfix">
+							<img src="images/main/various_events.png">
+							<span>Various public<br>events</span>
+						</div>
+						<div class="discounts clearfix">
+							<img src="images/main/discounts.png">
+							<span>Discounts<br>for regular<br>customers</span>
+						</div>
+						<div class="quality_cleaning clearfix">
+							<img src="images/main/quality_cleaning.png">
+							<span>Quality daily<br>wet cleaning</span>
+						</div>
+					</div>
+				</section>
+			</div>
+		</section>
+
+			<section class="container office_seats" id="ouroffices">
+				<section class="_50_seats clearfix">
+					<div class="gradient_orange">
+						<div class="col-lg-5 col-lg-offset-7 col-sm-8 col-sm-offset-2">
+							<div class="office_seats_heading">office 50 seats</div>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus sunt aspernatur modi unde perspiciatis inventore officia numquam quidem cupiditate voluptates amet voluptas, cum provident?</p>
+							<button>book</button>
+						</div>
+					</div>
+				</section>
+				<section class="_20_seats clearfix">
+					<div class="gradient_red">
+						<div class="col-lg-5 col-lg-offset-0 col-sm-8 col-sm-offset-2">
+							<div class="office_seats_heading">office 20 seats</div>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus sunt aspernatur modi unde perspiciatis inventore officia numquam quidem cupiditate voluptates amet voluptas, cum provident?</p>
+							<button>book</button>
+						</div>
+					</div>
+				</section>
+				<section class="_6_seats clearfix">
+					<div class="gradient_blue">
+						<div class="col-lg-5 col-lg-offset-7 col-sm-8 col-sm-offset-2">
+							<div class="office_seats_heading">office 6 seats</div>
+							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus sunt aspernatur modi unde perspiciatis inventore officia numquam quidem cupiditate voluptates amet voluptas, cum provident?</p>
+							<button>book</button>
+						</div>
+					</div>
+				</section>
+			</section>
+
+			<section class="girl container" id="discount">
+				<!-- <div class="square">
+					<img src="images/main/girl.png">
+				</div> -->
+
+				<div class="girl_square">
+					<img src="images/main/girl.png">
+					<div class="row">
+						<div class="girl_form col-lg-5 col-lg-offset-7 col-md-offset-2 col-md-8">
+							<div class="form_heading">
+								<div>hurry up</div>
+								<div>and get</div>
+								<div>40% discount</div>
+							</div>
+							<form>
+								<input type="text" name="userName" placeholder="Your name" required autocomplete="off">
+								<input type="number" name="userNumber" placeholder="Your phone number" required autocomplete="off">
+								<button type="submit">book</button>
+							</form>
+						</div>
+					</div>
+				</div>
+			</section>
+
+			<div class="container">
+				<section class="statistics" id="statistics">
+					<div class="statistics_background">
+						<div class="row">
+							<div class="space col-lg-3 col-md-6">
+								<div class="number">1,051</div>
+								<div class="border">space</div>
+							</div>
+							<div class="offices col-lg-3 col-md-6">
+								<div class="number">15</div>
+								<div class="border">offices</div>
+							</div>
+							<div class="computers col-lg-3 col-md-6">
+								<div class="number">670</div>
+								<div class="border">computers</div>
+							</div>
+							<div class="customers col-lg-3 col-md-6">
+								<div class="number">5,780</div>
+								<div class="border">customers</div>
+							</div>
+						</div>
+					</div>
+					<div class="statistic_hidden">
+						<div class="row">
+							<div class="statistic_hidden_background  col-sm-4 col-sm-offset-1">
+								<div class="space">
+									<div class="number">1,051</div>
+									<div class="border">space</div>
+								</div>
+							</div>
+
+							<div class="statistic_hidden_background col-sm-4 col-sm-offset-2">
+								<div class="offices">
+									<div class="number">15</div>
+									<div class="border">offices</div>
+								</div>
+							</div>
+						</div>
+
+						<div class="row">
+							<div class="statistic_hidden_background  col-sm-4 col-sm-offset-1">
+								<div class="computers">
+									<div class="number">670</div>
+									<div class="border">computers</div>
+								</div>
+							</div>
+							<div class="statistic_hidden_background col-sm-4 col-sm-offset-2">
+								<div class="customers">
+									<div class="number">5,780</div>
+									<div class="border">customers</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</section>
+			</div>	
+
+			<section class="slider container" id="reviews">
+				
+				<div class="first-slide" id="first-slide">
+					<div class="top_row">
+						<svg width="100%" height="425">
+							<defs>
+								<!-- TOP ROW patterns -->
+								<pattern id="slider-chair" patternUnits="userSpaceOnUse" x="40" y="20" width="357" height="403" > 
+							    	<image xlink:href="images/main/slider/slider-chair.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="alex" patternUnits="userSpaceOnUse" x="224" y="20" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/alex.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="desk" patternUnits="userSpaceOnUse" x="407" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/desk.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="den" patternUnits="userSpaceOnUse" x="591" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/den.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="slider-chairs" patternUnits="userSpaceOnUse" x="774" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/slider-chairs.png" width="357" height="400"></image> 
+							    </pattern>
+							</defs>
+
+							<polygon class="slider-chair" points="40,20 397,20, 219,423"/>
+							<polygon class="alex" points="402,20 224,423 581,423"/>
+							<polygon class="desk" points="407,20 764,20, 586,423"/>
+							<polygon class="den" points="769,20 591,423, 948,423"/>
+							<polygon class="slider-chairs" points="774,20 1131,20, 953,423"/>
+						</svg>
+					</div>
+
+					<div class="bottom_row">
+						<svg width="100%" height="425">
+							<defs>
+								<pattern id="anna" patternUnits="userSpaceOnUse" x="40" y="2" width="357" height="403" > 
+							    	<image xlink:href="images/main/slider/anna.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="unknown-man" patternUnits="userSpaceOnUse" x="224" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/unknown-man.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="two-chairs" patternUnits="userSpaceOnUse" x="407" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/two-chairs.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="elephant" patternUnits="userSpaceOnUse" x="591" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/elephant.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="jane" patternUnits="userSpaceOnUse" x="774" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/jane.png" width="357" height="400"></image> 
+							    </pattern>
+							</defs>
+
+							<polygon class="anna" points="219,2 40,405 397,405"/>
+							<polygon class="unknown-man" points="224,2 581,2 402,405"/>
+							<polygon class="two-chairs" points="586,2 407,405, 764,405"/>
+							<polygon class="elephant" points="591,2 948,2, 769,405"/>
+							<polygon class="jane" points="953,2 774,405, 1131,405"/>
+						</svg>
+					</div>
+				</div>
+				<div class="second-slide" id="second-slide">
+					<div class="top_row">
+						<svg width="100%" height="425">
+							<defs>
+								<!-- TOP ROW patterns -->
+								<pattern id="slider-chair" patternUnits="userSpaceOnUse" x="40" y="20" width="357" height="403" > 
+							    	<image xlink:href="images/main/slider/slider-chair.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="anna" patternUnits="userSpaceOnUse" x="224" y="20" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/anna.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="desk" patternUnits="userSpaceOnUse" x="407" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/desk.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="den" patternUnits="userSpaceOnUse" x="591" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/jane.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="slider-chairs" patternUnits="userSpaceOnUse" x="774" y="23" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/slider-chairs.png" width="357" height="400"></image> 
+							    </pattern>
+							</defs>
+
+							<polygon class="slider-chair" points="40,20 397,20, 219,423"/>
+							<polygon class="anna" points="402,20 224,423 581,423"/>
+							<polygon class="desk" points="407,20 764,20, 586,423"/>
+							<polygon class="den" points="769,20 591,423, 948,423"/>
+							<polygon class="slider-chairs" points="774,20 1131,20, 953,423"/>
+						</svg>
+					</div>
+
+					<div class="bottom_row">
+						<svg width="100%" height="425">
+							<defs>
+								<pattern id="alex" patternUnits="userSpaceOnUse" x="40" y="2" width="357" height="403" > 
+							    	<image xlink:href="images/main/slider/alex.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="unknown-man" patternUnits="userSpaceOnUse" x="224" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/unknown-man.png" width="357" height="403"></image> 
+							    </pattern>
+							    <pattern id="two-chairs" patternUnits="userSpaceOnUse" x="407" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/two-chairs.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="elephant" patternUnits="userSpaceOnUse" x="591" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/elephant.png" width="357" height="400"></image> 
+							    </pattern>
+							    <pattern id="jane" patternUnits="userSpaceOnUse" x="774" y="2" width="365" height="403" > 
+							    	<image xlink:href="images/main/slider/den.png" width="357" height="400"></image> 
+							    </pattern>
+							</defs>
+
+							<polygon class="alex" points="219,2 40,405 397,405"/>
+							<polygon class="unknown-man" points="224,2 581,2 402,405"/>
+							<polygon class="two-chairs" points="586,2 407,405, 764,405"/>
+							<polygon class="elephant" points="591,2 948,2, 769,405"/>
+							<polygon class="jane" points="953,2 774,405, 1131,405"/>
+						</svg>
+					</div>
+				</div>
+
+				<div class="slider_arrow_left" id="sliderBtn"><span></span></div>
+				<div class="slider_arrow_right" id="sliderBtn"><span></span></div>
+			</section>
+
+			<section class="chair container" id="details">
+				<div class="chair_square">
+					<div class="row">
+						<div class="extra_slogan col-lg-8 col-xs-12">It's all in the details</div>
+						<div class="extra_advantages col-lg-4  col-xs-12">
+							<div class="aaa clearfix">
+								<div class="metro clearfix">
+									<img src="images/main/chair/metro.png">
+									<span>Great location,<br> 5 minutes to metro</span>
+								</div>
+								<div class="cup clearfix">
+									<img src="images/main/chair/cup.png">
+									<span>Free tea, coffee <br> and sweets</span>
+								</div>
+							</div>
+							<div class="bbb clearfix">
+								<div class="book clearfix">
+									<img src="images/main/chair/book.png">
+									<span>Our own little <br>library</span>
+								</div>
+								<div class="people clearfix">
+									<img src="images/main/chair/people.png">
+									<span>Always good <br>company</span>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</section>	
+
+			<section class="red_girl container" id="gift">
+				<div class="row">
+					<div class="red_girl_form col-lg-5 col-md-6">
+						<div class="red_girl_form_heading">
+							<div>get a month free</div>
+							<div>Take part in the action simply sybscribe to us</div>
+						</div>
+						<form>
+							<input type="text" name="userName" placeholder="Your name" required autocomplete="off">
+							<input type="number" name="userNumber" placeholder="Your phone number" required autocomplete="off">
+							<button type="submit">take part</button>
+						</form>
+					</div>
+				</div>
+
+				<div class="join">
+					<div>join the team</div>
+					<div>work with us</div>
+				</div>
+			</section>
+
+			<section class="location container" id="contacts">
+				<div class="location_square">
+					<div class="text">
+						<div>location</div>
+						<p>Central Kharkiv is the perfect location because of its close proximity to the commercial, retail and entertainment hubs.</p>
+					</div>	
+				</div>
+				<div class="park">
+					<span>Park</span>
+				</div>
+				<div class="market">
+					<span>Market</span>
+				</div>
+				<div class="mcdonalds">
+					<span>Mcdonald's</span>
+				</div>
+				<div class="coffee_life">
+					<span>Coffee life</span>
+				</div>
+				<div class="open">
+					<span>1969 OPEN</span>
+				</div>
+						
+			</section>
+	</main>	
+
+
+	<footer>
+		<div class="container">
+			<div class="row">
+				<section class="col-md-4 col-sm-12">
+					<div>coworking space</div>
+					<div>
+						<span>Kharkiv, 3, Sumskaya st.</span>
+						<span>info@open1916.com</span>
+					</div>
+				</section>
+				<section class="col-md-4 col-sm-12">
+					<div>follow us</div>
+					<div>
+						<a href=""><img src="images/twitter.png"></a>
+					 	<a href=""><img src="images/instagram.png"></a>
+					 	<a href=""><img src="images/facebook.png"></a>
+					</div>
+				</section>
+				<section class="col-md-4 col-sm-12">
+					<div>contact</div>
+					<div>
+						<span>+38 (068) 089-48-83</span>
+					 	<span>+38 (099) 554-93-65</span>
+					</div>
+				</section>
+			</div>
+			<div class="logo"><a href="#"><img src="images/logo.png"></a></div>
+		</div>
+	</footer>
+
+	<div class="popup col-md-6 col-md-offset-3 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1" id="popup">
+		<div>
+			<div class="close_btn" id="popupCloseButton">
+				<div class="close_btn_bar1"></div>
+				<div class="close_btn_bar2"></div>
+			</div>
+			<div>Thank you,</div>
+			<div>your request has been accepted!</div>
+		</div>
+		<div>We are glad that you joined us</div>
+		<div>Our manager will contact you shortly</div>
+	</div>
+
+	<!-- <div class="scrollbtn" href="#scrollDestination">
+		<div class="scrollbtn_arrow"></div>
+	</div> -->
+
+
+
+</body>
+</html>

Open/js/script.js

@@ -0,0 +1,101 @@
+function hamburgerClickHandler() {
+
+	$("header nav div.hamburger").toggleClass("change");
+	$("header nav ul").toggleClass("active");
+}
+
+
+
+
+$(document).ready(function() {
+
+	var popup = document.getElementById("popup");
+	// popup.style.display = "none";
+
+	var firstSlide = document.getElementById("first-slide");
+	var secondSlide = document.getElementById("second-slide");
+	firstSlide.style.display = "block";
+	firstSlide.setAttribute("data-class", "active");
+	secondSlide.style.display = "none";
+	firstSlide.setAttribute("data-class", "not-active");
+
+	$("#sliderBtn").on("click", function() {
+		$("[data-class=active]").fadeOut();
+	});
+
+   	/* Show POP UP after submit the form */
+	var form = $("form");
+	form.on("submit", function(event) {
+
+			event.preventDefault();
+
+			// $.ajax({
+			// 	type: "POST",
+			// 	url: "mail.php",
+			// 	data: $(this).serialize()
+			// });
+
+			var popup = document.getElementById("popup");
+			popup.style.display = "inline-block";
+			
+			this.reset();
+	});
+
+	/* ----------------------- */
+
+
+	/* POP UP close script */
+	var popupBtnClose = $("#popupCloseButton");
+
+	popupBtnClose.on("click", function(){
+
+		var popup = document.getElementById("popup");
+		popup.style.display = "none";
+
+	});	
+	/* ----------------------- */
+
+	/* Скролл из главного меню */
+	$("header nav").on("click", "a", function(event) {
+
+		event.preventDefault();
+
+	    var id = $(this).attr("href"),
+	    	dest = $(id).offset().top;
+
+	    $("body,html").animate({
+	      scrollTop: dest
+	    }, 800);
+
+	    $("header nav div.hamburger").toggleClass("change");
+		$("header nav ul").toggleClass("active");
+	});
+	/* ----------------------- */
+
+
+	/* banner ARROW  scroll */
+	$(".arrow").on("click", function(){
+		var id = $(this).attr("href");
+		console.log(id);
+		var	dest = $(id).offset().top;
+
+		$("body,html").animate({
+	      scrollTop: dest
+	    }, 400);
+	});
+	/* ----------------------- */
+
+
+	/* scrollbtn ARROW  scroll */
+
+	$(".scrollbtn").on("click", function() {
+		var id = $(this).attr("href");
+		console.log(id);
+				var dest = $(id).offset().top;
+
+
+		$("body,html").animate({
+			scrollTop: dest
+		}, 400)
+	});
+});

Open/php/mail.php

@@ -0,0 +1,13 @@
+<?php
+
+$recepient = "okriuchkov@gmail.com";
+$sitename = "www.open.com";
+
+$name = trim($_POST["userName"]);
+$number = trim($_POST["userNumber"]);
+// $message = trim($_POST["message"]);
+
+$pagetitle = "Свяжитесь с нами";
+mail($recepient, $pagetitle, $name);
+
+?>