v 1.0

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 */

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')

index.html

@@ -0,0 +1,453 @@
+<!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 src="https://js.cx/libs/animate.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()" id="hamburger">
+						<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 suntaspernatur modi unde perspiciatis inventore officia numquam quidem cupiditatevoluptates 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 suntaspernatur modi unde perspiciatis inventore officia numquam quidem cupiditatevoluptates 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 suntaspernatur modi unde perspiciatis inventore officia numquam quidem cupiditatevoluptates amet voluptas, cum provident?</p>
+						<button>book</button>
+					</div>
+				</div>
+			</section>
+		</section>
+
+		<section class="girl container" id="discount">
+			<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="850">
+						<defs>
+							<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" heigh="400"></image> 
+						    </pattern>
+						    <pattern id="anna" patternUnits="userSpaceOnUse" x="40" y="28" 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="28" 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="28" 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="28" 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="28" width="365" height="403"> 
+						    	<image xlink:href="images/main/slider/jane.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" data-author="alex"/>
+						<polygon class="desk" points="407,20 764,20 586,423"/>
+						<polygon class="den" points="769,20 591,423 948,423" data-author="den"/>
+						<polygon class="slider-chairs" points="774,20 1131,20 953,423"/>
+						
+
+						<polygon class="anna" points="219,428 40,831 397,831" data-author="anna"/>
+						<polygon class="unknown-man" points="224,428 581,428 402,831"/>
+						<polygon class="two-chairs" points="586,428 407,831 764,831"/>
+						<polygon class="elephant" points="591,428 948,428 769,831"/>
+						<polygon class="jane" points="953,428 774,831 1131,831" data-author="jane"/>
+
+						<polygon class="comment-alex" points="40,20 397,20 219,423"/>
+						<polygon class="comment-den" points="774,20 1131,20 953,423"/>
+						<polygon class="comment-anna" points="224,428 581,428 402,831"/>
+						<polygon class="comment-jane" points="591,428 948,428 769,831"/>
+
+						
+						<div class="alex-text">
+							<p>Сonsectetuer adipiscing elit. Aenean commodo ligula eget dolo</p>
+						</div>
+						<div class="den-text">
+							<p>Сonsectetuer adipiscing elit. Aenean commodo ligula eget dolo</p>
+						</div>
+						<div class="anna-text">
+							<p>Сonsectetuer adipiscing elit. Aenean commodo ligula eget dolo</p>
+						</div>
+						<div class="jane-text">
+							<p>Сonsectetuer adipiscing elit. Aenean commodo ligula eget dolo</p>
+						</div>
+						
+					</svg>
+				</div>
+			</div>
+				
+			<div class="slider_arrows slider_arrow_left" id="sliderBtn"><span></span></div>
+			<div class="slider_arrows 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" requiredautocomplete="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 thecommercial, retail and entertainment hubs.</p>
+				</div>	
+			</div>
+			<div class="park">
+				<div class="circle" id="location-point">
+					<div class="line" id="line"></div>
+					<span class="location-name" id="location-name">Park</span>
+				</div>
+			</div>
+			<div class="market">
+				<div class="circle" id="location-point">
+					<div class="line" id="line"></div>
+					<span class="location-name" id="location-name">Market</span>
+				</div>
+			</div>
+			<div class="mcdonalds">
+				<div class="circle" id="location-point">
+					<div class="line" id="line"></div>
+					<span class="location-name" id="location-name">Mcdonald's</span>
+				</div>
+			</div>
+			<div class="coffee_life">
+				<div class="circle" id="location-point">
+					<div class="line" id="line"></div>
+					<span class="location-name" id="location-name">Coffee life</span>
+				</div>
+			</div>
+			<div class="open">
+				<div class="circle" id="location-point">
+					<div class="line" id="line"></div>
+					<span class="location-name" id="location-name">Open</span>
+				</div>
+			</div>
+			</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 class="scrollbtn_arrow"></div>
+		<div class="scrollbtn_arrow"></div>
+	</div>
+
+	<div class="popup-form col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3" id="popup-form">
+		<div class="popup-form-close-btn" id="popupFormCloseButton">
+			<div class="popup-close-btn-bar1"></div>
+			<div class="popup-close-btn-bar2"></div>
+		</div>
+		<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>
+
+
+
+</body>
+</html>

js/script.js

@@ -0,0 +1,226 @@
+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";                          // Hide Poppup message
+
+	var popupForm = document.getElementById("popup-form");
+	popupForm.style.display = "none";                      // Hide Poppup Form
+
+
+	/*  SLIDER  */
+
+	var clickCounter = 0;
+
+	$(".slider_arrows").on("click", function () {
+
+		var alex = $("#first-slide polygon.alex"),
+			alexComment = $("#first-slide polygon.comment-alex"),
+			alexText = $("#first-slide div.alex-text p"),
+			anna = $("#first-slide polygon.anna"),
+			annaComment = $("#first-slide polygon.comment-anna"),
+			annaText = $("#first-slide div.anna-text p"),
+			den = $("#first-slide polygon.den"),
+			denComment = $("#first-slide polygon.comment-den"),
+			denText = $("#first-slide div.den-text p"),
+			jane = $("#first-slide polygon.jane"),
+			janeComment = $("#first-slide polygon.comment-jane"),
+			janeText = $("#first-slide div.jane-text p");
+
+		clickCounter++;
+		if (clickCounter%2) {
+			alex.css({"transform": "translate(-184px, 409px)"});
+			anna.css({"transform": "translate(184px, -409px)"});
+			den.css({"transform": "translate(183px, 409px)"});
+			jane.css({"transform": "translate(-183px, -407px)"});
+
+			alexComment.css({"transform": "translate(184px, 413px)"});
+			annaComment.css({"transform": "translate(-183px, -405px)"});
+			denComment.css({"transform": "translate(-183px, 411px)"});
+			janeComment.css({"transform": "translate(184px, -405px)"});
+
+			alexText.css({"transform": "translate(184px, 413px)"});
+			annaText.css({"transform": "translate(-183px, -405px)"});
+			denText.css({"transform": "translate(-183px, 411px)"});
+			janeText.css({"transform": "translate(184px, -405px)"});
+
+		} else {
+			alex.css({"transform": "translate(0px, 0px)"});
+			anna.css({"transform": "translate(0px, 0px)"});
+			den.css({"transform": "translate(0px, 0px)"});
+			jane.css({"transform": "translate(0px, 0px)"});
+
+			alexComment.css({"transform": "translate(0px, 0px)"});
+			annaComment.css({"transform": "translate(0px, 0px)"});
+			denComment.css({"transform": "translate(0px, 0px)"});
+			janeComment.css({"transform": "translate(0px, 0px)"});
+
+			alexText.css({"transform": "translate(0px, 0px)"});
+			annaText.css({"transform": "translate(0px, 0px)"});
+			denText.css({"transform": "translate(0px, 0px)"});
+			janeText.css({"transform": "translate(0px, 0px)"});
+		}
+});
+	
+
+
+	/* ----------------------- */
+
+
+	/* BOOK button in the Office seats  */
+	var officeSeatsBtn = $(".office_seats button");
+	officeSeatsBtn.on("click", function() {
+		popupForm.style.display = "block";
+	});
+	/* ----------------------- */
+
+
+	/* Show Comments  */
+	var author = $("[data-author]");
+	$("polygon").hover(
+		function() {
+			if ($(this).attr("data-author")) {
+				$(".comment-"+$(this).attr("data-author")).fadeIn(150);
+				$("."+$(this).attr("data-author")+"-text p").fadeIn(200);
+			}
+		},
+		function() {
+			$(".comment-"+$(this).attr("data-author")).fadeOut(150);
+			$("."+$(this).attr("data-author")+"-text p").fadeOut(200);
+		}
+	)
+	/* ----------------------- */
+
+
+   	/* 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()
+			});
+
+			if ($(this).parent().attr("id") == "popup-form") {
+				$(this).parent().css("display", "none");
+				popup.style.display = "inline-block";
+			} else {
+				popup.style.display = "inline-block";
+			}
+			
+			this.reset();
+	});
+
+	/* ----------------------- */
+
+
+	/* POP UP close script */
+	var popupBtnClose = $("#popupCloseButton");
+
+	popupBtnClose.on("click", function(){
+
+		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");
+		var	dest = $(id).offset().top;
+
+		$("body,html").animate({
+	      scrollTop: dest
+	    }, 400);
+	});
+	/* ----------------------- */
+
+
+	/* scrollbtn ARROW  scroll */
+
+	var scrollBtn = $(".scrollbtn");
+	scrollBtn.css("display", "none");
+
+	$(document).scroll( function() {
+
+		if ($(window).width() >= '768') {
+			if ($(document).scrollTop() > 0) {
+				scrollBtn.fadeIn(400);
+			} else {
+				scrollBtn.fadeOut(200);
+			}
+		} else return;
+
+	});
+
+	$(".scrollbtn").on("click", function() {
+		var id = $(this).attr("href"),
+			dest = $(id).offset().top;
+
+		$("body,html").animate({
+			scrollTop: dest
+		}, 400)
+	});
+	/* ----------------------- */
+
+
+	/* POP UP close script */
+	var popupFormBtnClose = $("#popupFormCloseButton");
+
+	popupFormBtnClose.on("click", function(){
+
+		popupForm.style.display = "none";
+
+	});	
+	/* ----------------------- */
+
+
+	/* LOCATION animation */
+	var loc = document.getElementsByClassName("circle");
+	
+	[].forEach.call(loc, function(item) {
+
+		$(item).hover(
+			function() {
+				$("#line", item).slideToggle(200, function() {
+					$("#location-name", item).slideToggle();
+				});
+			},
+			function() {
+				$("#location-name", item).slideToggle(200, function() {
+					$("#line", item).slideToggle();
+				});
+			}
+		);
+	});
+	/* ----------------------- */
+});

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);
+
+?>