node-paytmpg 5.3.0 → 5.3.2

package/public/css/style.css

@@ -1,269 +1,269 @@
-.visuallyhidden {
-  border: 0;
-  clip: rect(0 0 0 0);
-  height: 1px;
-  margin: -1px;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  width: 1px;
-}
-
-body {
-  font-family: 'Open Sans', sans-serif;
-  background-color: #f0f0f0;
-}
-
-h1, h2, h3, h4, h5 {
-  margin: 0;
-  font-weight: 600;
-}
-
-.button {
-  align-self: center;
-  color: #ffffff;
-  width: 100%;
-  max-height: 100px;
-  height: 7vh;
-  max-width: 80vh;
-  background-color: #24cf5f;
-  padding: 12px 25px;
-  font-size: 12px;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-  border: 0;
-  border-radius: 7px;
-  outline: 0;
-  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.2);
-  -webkit-transition: all .2s;
-  transition: all .2s;
-}
-
-.button:hover, .button:active, .button:focus {
-  -webkit-transform: scale(1.1);
-  transform: scale(1.1);
-}
-
-.button--transparent {
-  background: transparent;
-  border: 0;
-  outline: 0;
-}
-
-.button--close {
-  position: absolute;
-  top: 10px;
-  left: 10px;
-  display: -ms-flexbox;
-  display: -webkit-box;
-  display: flex;
-  -ms-flex-align: center;
-  -webkit-box-align: center;
-  align-items: center;
-  -ms-flex-pack: center;
-  -webkit-box-pack: center;
-  justify-content: center;
-  width: 30px;
-  height: 30px;
-  color: #ffffff;
-  border-radius: 50%;
-  -webkit-transition: all .25s;
-  transition: all .25s;
-  z-index: 10;
-}
-
-.button--close svg {
-  width: 20px;
-  height: 20px;
-}
-
-.button--close svg * {
-  fill: currentColor;
-}
-
-.button--close:hover, .button--close:active, .button--close:focus {
-  color: #fbcf34;
-  background-color: #ffffff;
-  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.1);
-}
-
-.button--info {
-  position: absolute;
-  top: 0;
-  right: 0;
-}
-
-input {
-  width: calc(100% - 10px);
-  max-width: 80vh;
-  min-height: 30px;
-  padding-left: 5px;
-  padding-right: 5px;
-  letter-spacing: .5px;
-  border: 0;
-  border-bottom: 2px solid #f0f0f0;
-}
-
-input:valid {
-  border-color: #24cf5f;
-}
-
-input:focus {
-  outline: none;
-  border-color: #fbcf34;
-}
-
-.form-list {
-  padding-left: 0;
-  list-style: none;
-}
-
-.form-list__row {
-  margin-bottom: 25px;
-}
-
-.form-list__row label {
-  position: relative;
-  display: block;
-  text-transform: uppercase;
-  font-weight: 600;
-  font-size: 11px;
-  letter-spacing: .5px;
-  color: #939393;
-}
-
-.form-list__row--inline {
-  display: -ms-flexbox;
-  display: -webkit-box;
-  display: flex;
-  -ms-flex-pack: justify;
-  -webkit-box-pack: justify;
-  justify-content: space-between;
-}
-
-.form-list__row--inline> :first-child {
-  -ms-flex: 2;
-  -webkit-box-flex: 2;
-  flex: 2;
-  padding-right: 20px;
-}
-
-.form-list__row--inline> :nth-child(2n) {
-  -ms-flex: 1;
-  -webkit-box-flex: 1;
-  flex: 1;
-}
-
-.form-list__input-inline {
-  display: -ms-flexbox;
-  display: -webkit-box;
-  display: flex;
-  -ms-flex-pack: justify;
-  -webkit-box-pack: justify;
-  justify-content: space-between;
-}
-
-.form-list__input-inline>* {
-  width: calc(50% - 10px - 10px);
-}
-
-.form-list__row--agree {
-  margin-top: 30px;
-  margin-bottom: 30px;
-  font-size: 12px;
-}
-
-.form-list__row--agree label {
-  font-weight: 400;
-  text-transform: none;
-  color: #676767;
-}
-
-.form-list__row--agree input {
-  width: auto;
-  margin-right: 5px;
-}
-
-#input--cc {
-  position: relative;
-  padding-top: 6px;
-}
-
-#input--cc input {
-  padding-left: 46px;
-  width: calc(100% - 46px);
-}
-
-.modal {
-  display: -ms-flexbox;
-  display: -webkit-box;
-  display: flex;
-  -ms-flex-pack: center;
-  -webkit-box-pack: center;
-  justify-content: center;
-  -ms-flex-align: center;
-  -webkit-box-align: center;
-  align-items: center;
-  height: 100vh;
-  width: 100vw;
-  z-index: 100;
-  overflow-y: auto;
-  background-color: #ffffff;
-}
-
-.modal__container {
-  padding-top: 10vh;
-
-  display: -ms-flexbox;
-  display: -webkit-box;
-  display: flex;
-  max-width: 675px;
-  min-height: 400px;
-  margin-bottom: 125px;
-  border-radius: 5px;
-  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.1);
-}
-
-.modal__featured {
-  position: relative;
-  -ms-flex: 1;
-  -webkit-box-flex: 1;
-  flex: 1;
-  min-width: 130px;
-  padding: 20px;
-  overflow: hidden;
-  border-top-left-radius: 5px;
-  border-bottom-left-radius: 5px;
-}
-
-.modal__circle {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 200%;
-  width: 200%;
-  background-color: #fbcf34;
-  border-radius: 50%;
-  -webkit-transform: translateX(-50%) translateY(-25%);
-  transform: translateX(-50%) translateY(-25%);
-}
-
-.modal__product {
-  margin-top: 120px;
-  position: absolute;
-  top: 0;
-  left: 50%;
-  max-width: 85%;
-  -webkit-transform: translateX(calc(-50% - 10px));
-  transform: translateX(calc(-50% - 10px));
-}
-
-.modal__content {
-  align-content: center;
-  justify-content: center;
-  min-width: 80vw;
-  -ms-flex: 3;
-  -webkit-box-flex: 3;
-  flex: 3;
-  padding: 40px 40px;
+.visuallyhidden {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+}
+
+body {
+  font-family: 'Open Sans', sans-serif;
+  background-color: #f0f0f0;
+}
+
+h1, h2, h3, h4, h5 {
+  margin: 0;
+  font-weight: 600;
+}
+
+.button {
+  align-self: center;
+  color: #ffffff;
+  width: 100%;
+  max-height: 100px;
+  height: 7vh;
+  max-width: 80vh;
+  background-color: #24cf5f;
+  padding: 12px 25px;
+  font-size: 12px;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  border: 0;
+  border-radius: 7px;
+  outline: 0;
+  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.2);
+  -webkit-transition: all .2s;
+  transition: all .2s;
+}
+
+.button:hover, .button:active, .button:focus {
+  -webkit-transform: scale(1.1);
+  transform: scale(1.1);
+}
+
+.button--transparent {
+  background: transparent;
+  border: 0;
+  outline: 0;
+}
+
+.button--close {
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  display: -ms-flexbox;
+  display: -webkit-box;
+  display: flex;
+  -ms-flex-align: center;
+  -webkit-box-align: center;
+  align-items: center;
+  -ms-flex-pack: center;
+  -webkit-box-pack: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  color: #ffffff;
+  border-radius: 50%;
+  -webkit-transition: all .25s;
+  transition: all .25s;
+  z-index: 10;
+}
+
+.button--close svg {
+  width: 20px;
+  height: 20px;
+}
+
+.button--close svg * {
+  fill: currentColor;
+}
+
+.button--close:hover, .button--close:active, .button--close:focus {
+  color: #fbcf34;
+  background-color: #ffffff;
+  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.1);
+}
+
+.button--info {
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+
+input {
+  width: calc(100% - 10px);
+  max-width: 80vh;
+  min-height: 30px;
+  padding-left: 5px;
+  padding-right: 5px;
+  letter-spacing: .5px;
+  border: 0;
+  border-bottom: 2px solid #f0f0f0;
+}
+
+input:valid {
+  border-color: #24cf5f;
+}
+
+input:focus {
+  outline: none;
+  border-color: #fbcf34;
+}
+
+.form-list {
+  padding-left: 0;
+  list-style: none;
+}
+
+.form-list__row {
+  margin-bottom: 25px;
+}
+
+.form-list__row label {
+  position: relative;
+  display: block;
+  text-transform: uppercase;
+  font-weight: 600;
+  font-size: 11px;
+  letter-spacing: .5px;
+  color: #939393;
+}
+
+.form-list__row--inline {
+  display: -ms-flexbox;
+  display: -webkit-box;
+  display: flex;
+  -ms-flex-pack: justify;
+  -webkit-box-pack: justify;
+  justify-content: space-between;
+}
+
+.form-list__row--inline> :first-child {
+  -ms-flex: 2;
+  -webkit-box-flex: 2;
+  flex: 2;
+  padding-right: 20px;
+}
+
+.form-list__row--inline> :nth-child(2n) {
+  -ms-flex: 1;
+  -webkit-box-flex: 1;
+  flex: 1;
+}
+
+.form-list__input-inline {
+  display: -ms-flexbox;
+  display: -webkit-box;
+  display: flex;
+  -ms-flex-pack: justify;
+  -webkit-box-pack: justify;
+  justify-content: space-between;
+}
+
+.form-list__input-inline>* {
+  width: calc(50% - 10px - 10px);
+}
+
+.form-list__row--agree {
+  margin-top: 30px;
+  margin-bottom: 30px;
+  font-size: 12px;
+}
+
+.form-list__row--agree label {
+  font-weight: 400;
+  text-transform: none;
+  color: #676767;
+}
+
+.form-list__row--agree input {
+  width: auto;
+  margin-right: 5px;
+}
+
+#input--cc {
+  position: relative;
+  padding-top: 6px;
+}
+
+#input--cc input {
+  padding-left: 46px;
+  width: calc(100% - 46px);
+}
+
+.modal {
+  display: -ms-flexbox;
+  display: -webkit-box;
+  display: flex;
+  -ms-flex-pack: center;
+  -webkit-box-pack: center;
+  justify-content: center;
+  -ms-flex-align: center;
+  -webkit-box-align: center;
+  align-items: center;
+  height: 100vh;
+  width: 100vw;
+  z-index: 100;
+  overflow-y: auto;
+  background-color: #ffffff;
+}
+
+.modal__container {
+  padding-top: 10vh;
+
+  display: -ms-flexbox;
+  display: -webkit-box;
+  display: flex;
+  max-width: 675px;
+  min-height: 400px;
+  margin-bottom: 125px;
+  border-radius: 5px;
+  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.1);
+}
+
+.modal__featured {
+  position: relative;
+  -ms-flex: 1;
+  -webkit-box-flex: 1;
+  flex: 1;
+  min-width: 130px;
+  padding: 20px;
+  overflow: hidden;
+  border-top-left-radius: 5px;
+  border-bottom-left-radius: 5px;
+}
+
+.modal__circle {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 200%;
+  width: 200%;
+  background-color: #fbcf34;
+  border-radius: 50%;
+  -webkit-transform: translateX(-50%) translateY(-25%);
+  transform: translateX(-50%) translateY(-25%);
+}
+
+.modal__product {
+  margin-top: 120px;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  max-width: 85%;
+  -webkit-transform: translateX(calc(-50% - 10px));
+  transform: translateX(calc(-50% - 10px));
+}
+
+.modal__content {
+  align-content: center;
+  justify-content: center;
+  min-width: 80vw;
+  -ms-flex: 3;
+  -webkit-box-flex: 3;
+  flex: 3;
+  padding: 40px 40px;
 }