tungsten 0.1.16 → 0.1.17

Sign up to get free protection for your applications and to get access to all the features.
@@ -658,7 +658,7 @@ dfn[title]:after, abbr[title]:after {
658
658
  text-align: center;
659
659
  white-space: nowrap;
660
660
  padding: 10px;
661
- border-radius: 2px;
661
+ border-radius: 3px;
662
662
  background: black; }
663
663
  dfn[title]:before, abbr[title]:before {
664
664
  content: '';
@@ -715,7 +715,7 @@ pre, code, kbd, samp {
715
715
  pre {
716
716
  overflow: auto;
717
717
  padding: 2px 6px;
718
- border-radius: 2px;
718
+ border-radius: 3px;
719
719
  background: white;
720
720
  word-wrap: break-word;
721
721
  white-space: pre-wrap; }
@@ -724,7 +724,7 @@ pre {
724
724
  line-height: 0;
725
725
  word-wrap: break-word;
726
726
  white-space: pre-wrap;
727
- border-radius: 2px;
727
+ border-radius: 3px;
728
728
  padding: 1px 4px;
729
729
  box-shadow: 0 0 0 1px silver inset; }
730
730
 
@@ -740,251 +740,6 @@ pre {
740
740
  .text-right {
741
741
  text-align: right; }
742
742
 
743
- /* ========================================================================== *
744
- * Tables module
745
- * -------------------------------------------------------------------------- */
746
- /* ===================================== *
747
- * Common
748
- * ------------------------------------- */
749
- table {
750
- vertical-align: top;
751
- border-spacing: 0; }
752
-
753
- th, td {
754
- padding: 8px;
755
- text-align: left;
756
- background: #fff; }
757
- th.action-panel, td.action-panel {
758
- min-width: 120px;
759
- text-align: right;
760
- white-space: nowrap; }
761
-
762
- caption {
763
- display: none; }
764
-
765
- table.ruled tfoot th, table.ruled tbody tr:nth-child(n+2) th, table.ruled tbody tr:nth-child(n+2) td {
766
- border-top: 1px solid #dfe3e6; }
767
- table.ruled thead th {
768
- border-bottom: 1px solid #dfe3e6; }
769
-
770
- table.outlined, table.doc-table {
771
- border-collapse: collapse; }
772
- table.outlined td, table.outlined th, table.doc-table td, table.doc-table th {
773
- border: 1px solid #dfe3e6; }
774
-
775
- table.striped tbody tr:nth-child(2n+1) th, table.striped tbody tr:nth-child(2n+1) td {
776
- background: #f0f3f6; }
777
-
778
- table.stretched, table.doc-table {
779
- table-layout: fixed;
780
- min-width: 100%; }
781
-
782
- table.filled {
783
- width: 100%; }
784
- table.filled th:not(:last-child), table.filled td:not(:last-child) {
785
- white-space: nowrap; }
786
- table.filled th:last-child, table.filled td:last-child {
787
- width: 99%; }
788
-
789
- /* ========================================================================== *
790
- * Buttons module
791
- * -------------------------------------------------------------------------- */
792
- /* ===================================== *
793
- * Common
794
- * ------------------------------------- */
795
- .button {
796
- display: -webkit-inline-box;
797
- display: -ms-inline-flexbox;
798
- display: inline-flex;
799
- -webkit-box-align: center;
800
- -ms-flex-align: center;
801
- align-items: center;
802
- -webkit-box-pack: center;
803
- -ms-flex-pack: center;
804
- justify-content: center;
805
- width: auto;
806
- line-height: 1;
807
- font-size: 14px;
808
- font-weight: 500;
809
- text-align: center;
810
- text-decoration: none;
811
- border: 0;
812
- padding: 8px 12px;
813
- background: #fff;
814
- border-radius: 2px;
815
- -webkit-transition: color 0.25s, background 0.25s, box-shadow 0.25s;
816
- transition: color 0.25s, background 0.25s, box-shadow 0.25s; }
817
- .button.large {
818
- padding: 12px 15px; }
819
- .button, .button:visited {
820
- color: inherit;
821
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1), 0 1px 3px rgba(15, 33, 46, 0.15); }
822
- .button:hover, .button:focus, .button:active {
823
- color: #0094fd;
824
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2), 0 1px 3px rgba(15, 33, 46, 0.25); }
825
- .button.destructive, .button.destructive:visited {
826
- color: #dd2f41; }
827
- .button.destructive:hover, .button.destructive:focus, .button.destructive:active {
828
- color: #A81C27; }
829
- .button.primary, .button.primary:visited {
830
- color: #fff;
831
- background: #0094fd;
832
- box-shadow: 0 0 0 1px #0085e4, 0 1px 3px rgba(15, 33, 46, 0.15); }
833
- .button.primary:hover, .button.primary:focus, .button.primary:active {
834
- color: #fff;
835
- background: #006dff;
836
- box-shadow: 0 0 0 1px #006dff, 0 1px 3px rgba(15, 33, 46, 0.15); }
837
- .button.primary.destructive, .button.primary.destructive:visited {
838
- color: #fff;
839
- background: #dd2f41;
840
- box-shadow: 0 0 0 1px #d02234, 0 1px 3px rgba(15, 33, 46, 0.15); }
841
- .button.primary.destructive:hover, .button.primary.destructive:focus, .button.primary.destructive:active {
842
- color: #fff;
843
- background: #A81C27;
844
- box-shadow: 0 0 0 1px #A81C27, 0 1px 3px rgba(15, 33, 46, 0.15); }
845
- .button[disabled] {
846
- color: #d6dde7 !important;
847
- background: #f7fafb !important;
848
- cursor: not-allowed !important;
849
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1), 0 1px 3px rgba(15, 33, 46, 0.15) !important; }
850
-
851
- .button-group {
852
- display: -webkit-box;
853
- display: -ms-flexbox;
854
- display: flex;
855
- -webkit-box-align: start;
856
- -ms-flex-align: start;
857
- align-items: flex-start; }
858
- .button-group .button + .button {
859
- margin: 0; }
860
- .button-group .button:not(:first-child):not(:last-child) {
861
- border-radius: 0; }
862
- .button-group .button:first-child {
863
- border-radius: 2px 0 0 2px; }
864
- .button-group .button:last-child {
865
- border-radius: 0 2px 2px 0; }
866
-
867
- /* ========================================================================== *
868
- * Badges module
869
- * -------------------------------------------------------------------------- */
870
- /* ===================================== *
871
- * Common
872
- * ------------------------------------- */
873
- .badge {
874
- display: -webkit-inline-box;
875
- display: -ms-inline-flexbox;
876
- display: inline-flex;
877
- -webkit-box-align: center;
878
- -ms-flex-align: center;
879
- align-items: center;
880
- border-radius: 50%;
881
- width: 26px;
882
- height: 26px;
883
- text-align: center;
884
- -webkit-box-pack: center;
885
- -ms-flex-pack: center;
886
- justify-content: center;
887
- color: #fff;
888
- background: #2ac84f;
889
- font-weight: 700;
890
- margin: 0 2px; }
891
-
892
- /* ========================================================================== *
893
- * Card module
894
- * -------------------------------------------------------------------------- */
895
- .card {
896
- background: #fff;
897
- display: -webkit-box;
898
- display: -ms-flexbox;
899
- display: flex;
900
- -webkit-box-orient: vertical;
901
- -webkit-box-direction: normal;
902
- -ms-flex-direction: column;
903
- flex-direction: column;
904
- position: relative;
905
- padding: 20px; }
906
- .card > *:last-child, .card > *:last-child > *:last-child, .card > *:last-child > *:last-child > *:last-child {
907
- margin-bottom: 0; }
908
- .card-actions {
909
- display: -webkit-box;
910
- display: -ms-flexbox;
911
- display: flex;
912
- -webkit-box-align: baseline;
913
- -ms-flex-align: baseline;
914
- align-items: baseline;
915
- margin-bottom: 20px;
916
- -webkit-box-orient: horizontal;
917
- -webkit-box-direction: reverse;
918
- -ms-flex-direction: row-reverse;
919
- flex-direction: row-reverse; }
920
- .card-actions.centered {
921
- -webkit-box-pack: center;
922
- -ms-flex-pack: center;
923
- justify-content: center; }
924
- .card-actions a, .card-actions .button {
925
- margin-left: 10px; }
926
- .card p, .card ul, .card ol, .card h1, .card h2, .card h3, .card h4, .card h5, .card h6, .card pre, .card table, .card .card {
927
- margin-bottom: 20px; }
928
- .card:not([class*='columns']) {
929
- border-radius: 2px;
930
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.05), 0 1px 3px rgba(15, 33, 46, 0.15); }
931
- .card[class*='columns'] {
932
- position: relative;
933
- z-index: 1;
934
- -webkit-box-orient: horizontal;
935
- -webkit-box-direction: normal;
936
- -ms-flex-direction: row;
937
- flex-direction: row; }
938
- .card[class*='columns']:before {
939
- content: '';
940
- border-radius: 2px;
941
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.05), 0 1px 3px rgba(15, 33, 46, 0.15);
942
- position: absolute;
943
- z-index: -1;
944
- left: 0;
945
- top: 0;
946
- right: 0;
947
- bottom: 0; }
948
- .card-heading {
949
- font-size: 16px;
950
- -webkit-box-align: top;
951
- -ms-flex-align: top;
952
- align-items: top; }
953
- .card-header, .card-footer {
954
- display: -webkit-box;
955
- display: -ms-flexbox;
956
- display: flex; }
957
- .card-header .card-actions, .card-footer .card-actions {
958
- margin-bottom: 0;
959
- margin-left: auto; }
960
- .card-description {
961
- font-size: 12px; }
962
- .card-well {
963
- padding: 20px;
964
- margin: 10px 0; }
965
- .card-footer {
966
- display: -webkit-box;
967
- display: -ms-flexbox;
968
- display: flex;
969
- -webkit-box-align: baseline;
970
- -ms-flex-align: baseline;
971
- align-items: baseline;
972
- font-size: 12px;
973
- padding: 20px;
974
- background: #f7fafb;
975
- border-radius: 0 0 2px 2px;
976
- box-shadow: 0 1px rgba(15, 33, 46, 0.1) inset;
977
- background-clip: padding-box; }
978
- .card-footer > *:last-child, .card-footer > *:last-child > *:last-child, .card-footer > *:last-child > *:last-child > *:last-child {
979
- margin-bottom: 0; }
980
- .card-footer p, .card-footer ul, .card-footer ol, .card-footer h1, .card-footer h2, .card-footer h3, .card-footer h4, .card-footer h5, .card-footer h6, .card-footer pre, .card-footer table, .card-footer .card {
981
- margin-bottom: 0; }
982
- .card > .card-footer:last-child, .card > *:last-child > .card-footer:last-child, .card > *:last-child > *:last-child > .card-footer:last-child {
983
- margin: auto -20px -20px -20px; }
984
-
985
- table.card {
986
- display: table; }
987
-
988
743
  /* ========================================================================== *
989
744
  * Sections module
990
745
  * -------------------------------------------------------------------------- */
@@ -1038,6 +793,17 @@ table.card {
1038
793
  color: #0094fd;
1039
794
  background: rgba(0, 148, 253, 0.1); }
1040
795
 
796
+ @-webkit-keyframes fade-in {
797
+ 0% {
798
+ opacity: 0; }
799
+ 100% {
800
+ opacity: 1; } }
801
+
802
+ @keyframes fade-in {
803
+ 0% {
804
+ opacity: 0; }
805
+ 100% {
806
+ opacity: 1; } }
1041
807
  .cm-s-default .cm-keyword {
1042
808
  color: #268bd2; }
1043
809
  .cm-s-default .cm-atom {
@@ -1215,1063 +981,284 @@ pre.box-content {
1215
981
  .highlighted-code:before, .highlighted-code:after {
1216
982
  content: none; }
1217
983
 
1218
- .switch-label, .tick-label {
1219
- pointer-events: none; }
1220
- .switch-label *, .tick-label * {
1221
- pointer-events: all; }
1222
-
1223
- label [type=checkbox], label [type=radio] {
1224
- position: absolute;
1225
- border: none;
1226
- cursor: pointer;
984
+ .error-page {
985
+ background: #5a6872;
986
+ background: -webkit-linear-gradient(top, #444e56, #5a6872, #5a6872, #5a6872);
987
+ background: linear-gradient(to bottom, #444e56, #5a6872, #5a6872, #5a6872); }
988
+ .error-page h1 {
989
+ font-size: 50px;
990
+ font-weight: 600;
991
+ color: #fff;
992
+ text-shadow: 0 1px 0 #0f212e; }
993
+ .error-page p {
994
+ color: #fff;
995
+ font-size: 1.2em; }
996
+ .error-page footer {
997
+ position: fixed;
998
+ bottom: 0;
999
+ left: 0;
1000
+ right: 0;
1001
+ line-height: 2.5em;
1002
+ padding: .5em; }
1003
+
1004
+ .error-page body {
1005
+ text-align: center;
1006
+ display: -ms-grid;
1007
+ display: grid;
1008
+ -ms-flex-line-pack: center;
1009
+ align-content: center; }
1010
+
1011
+ .error-svgs {
1012
+ padding-bottom: 114px;
1013
+ margin: 2em auto;
1014
+ width: 394px;
1015
+ -webkit-animation: slide-error-code 0.6s 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1016
+ animation: slide-error-code 0.6s 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1017
+ -webkit-transform: translate3d(0, 15px, 0);
1018
+ transform: translate3d(0, 15px, 0); }
1019
+ .error-svgs .error-number {
1020
+ -webkit-transform: translate3d(0, 0, 0);
1021
+ transform: translate3d(0, 0, 0);
1022
+ overflow: visible;
1023
+ width: 200px;
1024
+ position: relative; }
1025
+ .error-svgs .error-number .error-box {
1227
1026
  opacity: 0;
1228
- z-index: -1; }
1027
+ -webkit-animation-fill-mode: forwards;
1028
+ animation-fill-mode: forwards; }
1029
+ .error-svgs .error-number .error-box-side, .error-svgs .error-number .error-box-bg {
1030
+ fill: #5a6872; }
1031
+ .error-svgs .error-number .error-box-side {
1032
+ fill-opacity: .5; }
1033
+ .error-svgs .error-number:nth-of-type(1) {
1034
+ top: 114px;
1035
+ margin-right: -103px;
1036
+ z-index: 2; }
1037
+ .error-svgs .error-number:nth-of-type(1) .error-box {
1038
+ -webkit-animation-delay: .1s;
1039
+ animation-delay: .1s; }
1040
+ .error-svgs .error-number:nth-of-type(2) {
1041
+ margin-right: -103px;
1042
+ top: 57px;
1043
+ z-index: 1; }
1044
+ .error-svgs .error-number:nth-of-type(2) .error-box {
1045
+ -webkit-animation-delay: .2s;
1046
+ animation-delay: .2s; }
1047
+ .error-svgs .error-number:nth-of-type(3) {
1048
+ z-index: 0; }
1049
+ .error-svgs .error-number:nth-of-type(3) .error-box {
1050
+ -webkit-animation-delay: .3s;
1051
+ animation-delay: .3s; }
1229
1052
 
1230
- fieldset {
1231
- border: 0;
1232
- padding: 0;
1233
- margin-left: 0;
1234
- margin-right: 0; }
1053
+ .error-box:nth-child(1) {
1054
+ -webkit-animation: drop-cube-1 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1055
+ animation: drop-cube-1 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1056
+ .error-box:nth-child(1) .error-box-bg {
1057
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1058
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1059
+ -webkit-animation-delay: .5s;
1060
+ animation-delay: .5s; }
1235
1061
 
1236
- select, textarea, textarea, input[type=url], input[type=tel], input[type=text], input[type=email], input[type=number], input[type=password], input[type=search] {
1237
- -webkit-appearance: none;
1238
- -moz-appearance: none;
1239
- appearance: none;
1240
- border: none;
1241
- width: 100%;
1242
- padding: 9px 12px;
1243
- border-radius: 2px;
1244
- -webkit-transition: box-shadow 0.25s;
1245
- transition: box-shadow 0.25s;
1246
- line-height: 2em;
1247
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2) inset, 0 0 0 transparent; }
1248
- select:hover, select:focus, select:active, textarea:hover, textarea:focus, textarea:active, textarea:hover, textarea:focus, textarea:active, input[type=url]:hover, input[type=url]:focus, input[type=url]:active, input[type=tel]:hover, input[type=tel]:focus, input[type=tel]:active, input[type=text]:hover, input[type=text]:focus, input[type=text]:active, input[type=email]:hover, input[type=email]:focus, input[type=email]:active, input[type=number]:hover, input[type=number]:focus, input[type=number]:active, input[type=password]:hover, input[type=password]:focus, input[type=password]:active, input[type=search]:hover, input[type=search]:focus, input[type=search]:active {
1249
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.3) inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
1250
- select:disabled:not([type="submit"]), textarea:disabled:not([type="submit"]), textarea:disabled:not([type="submit"]), input[type=url]:disabled:not([type="submit"]), input[type=tel]:disabled:not([type="submit"]), input[type=text]:disabled:not([type="submit"]), input[type=email]:disabled:not([type="submit"]), input[type=number]:disabled:not([type="submit"]), input[type=password]:disabled:not([type="submit"]), input[type=search]:disabled:not([type="submit"]) {
1251
- color: #d6dde7;
1252
- cursor: default; }
1253
- select::-moz-focus-inner, textarea::-moz-focus-inner, textarea::-moz-focus-inner, input[type=url]::-moz-focus-inner, input[type=tel]::-moz-focus-inner, input[type=text]::-moz-focus-inner, input[type=email]::-moz-focus-inner, input[type=number]::-moz-focus-inner, input[type=password]::-moz-focus-inner, input[type=search]::-moz-focus-inner {
1254
- border: none;
1255
- padding: 0; }
1062
+ .error-box:nth-child(2) {
1063
+ -webkit-animation: drop-cube-2 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1064
+ animation: drop-cube-2 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1065
+ .error-box:nth-child(2) .error-box-bg {
1066
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1067
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1068
+ -webkit-animation-delay: .5s;
1069
+ animation-delay: .5s; }
1256
1070
 
1257
- .input-wrapper {
1258
- position: relative; }
1071
+ .error-box:nth-child(3) {
1072
+ -webkit-animation: drop-cube-3 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1073
+ animation: drop-cube-3 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1074
+ .error-box:nth-child(3) .error-box-bg {
1075
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1076
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1077
+ -webkit-animation-delay: .5s;
1078
+ animation-delay: .5s; }
1259
1079
 
1260
- input[type=search], input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button {
1261
- -webkit-appearance: none; }
1080
+ .error-box:nth-child(4) {
1081
+ -webkit-animation: drop-cube-4 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1082
+ animation: drop-cube-4 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1083
+ .error-box:nth-child(4) .error-box-bg {
1084
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1085
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1086
+ -webkit-animation-delay: .5s;
1087
+ animation-delay: .5s; }
1262
1088
 
1263
- select {
1264
- min-height: 40px;
1265
- cursor: pointer;
1266
- background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 14'%3E%3Cpolygon fill='%237A7B7C' points='3.5,0 0,6 7,6'/%3E%3Cpolygon fill='%237A7B7C' points='3.5,14 0,8 7,8'/%3E%3C/svg%3E") calc(100% - 14px) 50%/7px 14px no-repeat; }
1089
+ .error-box:nth-child(5) {
1090
+ -webkit-animation: drop-cube-5 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1091
+ animation: drop-cube-5 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1092
+ .error-box:nth-child(5) .error-box-bg {
1093
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1094
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1095
+ -webkit-animation-delay: .5s;
1096
+ animation-delay: .5s; }
1267
1097
 
1268
- textarea {
1269
- display: block;
1270
- resize: vertical;
1271
- min-height: 75px; }
1098
+ .error-box:nth-child(6) {
1099
+ -webkit-animation: drop-cube-6 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1100
+ animation: drop-cube-6 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1101
+ .error-box:nth-child(6) .error-box-bg {
1102
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1103
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1104
+ -webkit-animation-delay: .5s;
1105
+ animation-delay: .5s; }
1272
1106
 
1273
- ::-webkit-input-placeholder {
1274
- opacity: 1;
1275
- color: #c3cdda; }
1107
+ .error-box:nth-child(7) {
1108
+ -webkit-animation: drop-cube-7 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1109
+ animation: drop-cube-7 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1110
+ .error-box:nth-child(7) .error-box-bg {
1111
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1112
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1113
+ -webkit-animation-delay: .5s;
1114
+ animation-delay: .5s; }
1276
1115
 
1277
- :-ms-input-placeholder {
1278
- opacity: 1;
1279
- color: #c3cdda; }
1116
+ .error-box:nth-child(8) {
1117
+ -webkit-animation: drop-cube-8 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1118
+ animation: drop-cube-8 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1119
+ .error-box:nth-child(8) .error-box-bg {
1120
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1121
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1122
+ -webkit-animation-delay: .5s;
1123
+ animation-delay: .5s; }
1280
1124
 
1281
- ::placeholder {
1282
- opacity: 1;
1283
- color: #c3cdda; }
1125
+ .error-box:nth-child(9) {
1126
+ -webkit-animation: drop-cube-9 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1127
+ animation: drop-cube-9 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1128
+ .error-box:nth-child(9) .error-box-bg {
1129
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1130
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1131
+ -webkit-animation-delay: .5s;
1132
+ animation-delay: .5s; }
1284
1133
 
1285
- input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {
1286
- -webkit-appearance: none;
1287
- margin: 0; }
1134
+ .error-box:nth-child(10) {
1135
+ -webkit-animation: drop-cube-10 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1136
+ animation: drop-cube-10 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1137
+ .error-box:nth-child(10) .error-box-bg {
1138
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1139
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1140
+ -webkit-animation-delay: .5s;
1141
+ animation-delay: .5s; }
1288
1142
 
1289
- label {
1290
- display: -webkit-box;
1291
- display: -ms-flexbox;
1292
- display: flex;
1293
- -webkit-box-orient: vertical;
1294
- -webkit-box-direction: normal;
1295
- -ms-flex-direction: column;
1296
- flex-direction: column;
1297
- position: relative;
1298
- -webkit-box-flex: 1;
1299
- -ms-flex: 1 0 auto;
1300
- flex: 1 0 auto; }
1301
- label .label-text {
1302
- -webkit-transition-property: box-shadow, color;
1303
- transition-property: box-shadow, color;
1304
- padding-bottom: .2em; }
1143
+ .error-box:nth-child(11) {
1144
+ -webkit-animation: drop-cube-11 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1145
+ animation: drop-cube-11 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1146
+ .error-box:nth-child(11) .error-box-bg {
1147
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1148
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1149
+ -webkit-animation-delay: .5s;
1150
+ animation-delay: .5s; }
1305
1151
 
1306
- label *, label *:before, label *:after {
1307
- -webkit-transition-duration: 0.25s;
1308
- transition-duration: 0.25s;
1309
- -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1310
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
1152
+ .error-box:nth-child(12) {
1153
+ -webkit-animation: drop-cube-12 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1154
+ animation: drop-cube-12 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1155
+ .error-box:nth-child(12) .error-box-bg {
1156
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1157
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1158
+ -webkit-animation-delay: .5s;
1159
+ animation-delay: .5s; }
1311
1160
 
1312
- form.button_to {
1313
- width: auto;
1314
- display: -webkit-inline-box;
1315
- display: -ms-inline-flexbox;
1316
- display: inline-flex; }
1161
+ .error-box:nth-child(13) {
1162
+ -webkit-animation: drop-cube-13 0.8s cubic-bezier(0.4, 0, 0.2, 1);
1163
+ animation: drop-cube-13 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
1164
+ .error-box:nth-child(13) .error-box-bg {
1165
+ -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1166
+ animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
1167
+ -webkit-animation-delay: .5s;
1168
+ animation-delay: .5s; }
1317
1169
 
1318
- .placeholder-label {
1319
- padding: 0;
1320
- font-size: 1em; }
1321
- .placeholder-label ::-webkit-input-placeholder {
1322
- opacity: 0;
1323
- color: transparent; }
1324
- .placeholder-label :-ms-input-placeholder {
1325
- opacity: 0;
1326
- color: transparent; }
1327
- .placeholder-label ::placeholder {
1328
- opacity: 0;
1329
- color: transparent; }
1330
- .placeholder-label label:not(.valid):not(.invalid) textarea:focus + span, .placeholder-label label:not(.valid):not(.invalid) textarea:active + span, .placeholder-label label:not(.valid):not(.invalid) input:focus + span, .placeholder-label label:not(.valid):not(.invalid) input:active + span {
1331
- color: #8c9ba5; }
1332
- .placeholder-label textarea, .placeholder-label input {
1333
- z-index: 1;
1334
- margin: 0;
1335
- font-size: inherit;
1336
- padding: 0.9em 0.8em; }
1337
- .placeholder-label textarea:focus, .placeholder-label textarea:not(.empty), .placeholder-label input:focus, .placeholder-label input:not(.empty) {
1338
- padding-top: 1.4em;
1339
- padding-bottom: 0.4em; }
1340
- .placeholder-label textarea:focus + .placeholder-label-text, .placeholder-label textarea:not(.empty) + .placeholder-label-text, .placeholder-label input:focus + .placeholder-label-text, .placeholder-label input:not(.empty) + .placeholder-label-text {
1341
- z-index: 2;
1342
- -webkit-transform: translate3d(0, -0.6em, 0) scale(0.8);
1343
- transform: translate3d(0, -0.6em, 0) scale(0.8);
1344
- color: #8c9ba5; }
1345
- .placeholder-label.valid textarea + .placeholder-label-text, .placeholder-label.valid input + .placeholder-label-text, .placeholder-label.invalid textarea + .placeholder-label-text, .placeholder-label.invalid input + .placeholder-label-text {
1346
- color: inherit; }
1347
- .placeholder-label input {
1348
- line-height: inherit; }
1349
- .placeholder-label textarea {
1350
- padding-top: 4.9em; }
1351
-
1352
- .placeholder-label-text {
1353
- pointer-events: none;
1354
- font-size: inherit;
1355
- position: absolute;
1356
- top: 0.8em;
1357
- left: 0.8em;
1358
- padding: 1px 0 0 1px;
1359
- -webkit-transform-origin: left top 0;
1360
- transform-origin: left top 0;
1361
- will-change: transform;
1362
- -webkit-filter: blur(0);
1363
- -webkit-backface-visibility: hidden;
1364
- backface-visibility: hidden;
1365
- -webkit-font-smoothing: subpixel-antialiased;
1366
- color: #c3cdda;
1367
- -webkit-transform: translate3d(0, 0, 0) scale(1);
1368
- transform: translate3d(0, 0, 0) scale(1);
1369
- -webkit-transition-property: color, -webkit-transform;
1370
- transition-property: color, -webkit-transform;
1371
- transition-property: color, transform;
1372
- transition-property: color, transform, -webkit-transform; }
1373
- .label-text ~ .placeholder-label-text {
1374
- top: 2.3em; }
1375
-
1376
- label.tick-box {
1377
- -webkit-box-orient: horizontal;
1378
- -webkit-box-direction: normal;
1379
- -ms-flex-direction: row;
1380
- flex-direction: row;
1381
- -webkit-box-align: center;
1382
- -ms-flex-align: center;
1383
- align-items: center;
1384
- cursor: pointer; }
1385
- label.tick-box *, label.tick-box *:after, label.tick-box *:before {
1386
- -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
1387
- transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275); }
1388
- label.tick-box input + .tick {
1389
- width: 20px;
1390
- height: 20px;
1391
- margin: 0 8px 0 0;
1392
- background: #fff;
1393
- -webkit-transition-property: box-shadow;
1394
- transition-property: box-shadow;
1395
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2) inset, 0 0 0 transparent, 0 0 0 transparent inset; }
1396
- label.tick-box input:focus, label.tick-box input:hover:not([disabled]), label.tick-box input:active {
1397
- border: none; }
1398
- label.tick-box input:focus + .tick, label.tick-box input:hover:not([disabled]) + .tick, label.tick-box input:active + .tick {
1399
- box-shadow: 0 0 0 1px #8c9ba5 inset, 0 0 0 transparent, 0 0 0 transparent inset; }
1400
- label.tick-box input:disabled {
1401
- pointer-events: none;
1402
- cursor: default;
1403
- color: #d6dde7; }
1404
- label.tick-box input:disabled + .tick {
1405
- box-shadow: 0 0 0 1px #c3cdda inset; }
1406
- label.tick-box input[type=radio] + .tick {
1407
- border-radius: 50%;
1408
- position: relative; }
1409
- label.tick-box input[type=radio] + .tick:before, label.tick-box input[type=radio] + .tick:after {
1410
- content: '';
1411
- background-color: white;
1412
- position: absolute;
1413
- left: 0;
1414
- top: 0;
1415
- height: 100%;
1416
- width: 100%;
1417
- border-radius: 50%;
1418
- box-shadow: 0 0 0 transparent;
1419
- -webkit-transform: scale(0);
1420
- transform: scale(0);
1421
- -webkit-transition-property: box-shadow, -webkit-transform;
1422
- transition-property: box-shadow, -webkit-transform;
1423
- transition-property: box-shadow, transform;
1424
- transition-property: box-shadow, transform, -webkit-transform; }
1425
- label.tick-box input[type=radio] + .tick:before {
1426
- background-color: #c3cdda; }
1427
- label.tick-box input[type=radio]:checked + .tick {
1428
- box-shadow: 0 0 0 1px #008bee inset, 0 0 0 transparent, 0 0 0 8px #0094fd inset; }
1429
- label.tick-box input[type=radio]:checked + .tick:after {
1430
- box-shadow: 0 1px 0 2px #0067b1;
1431
- -webkit-transform: scale(0.35);
1432
- transform: scale(0.35); }
1433
- label.tick-box input[type=radio]:focus + .tick:before, label.tick-box input[type=radio]:hover:not([disabled]) + .tick:before, label.tick-box input[type=radio]:active + .tick:before {
1434
- -webkit-transform: scale(0.35);
1435
- transform: scale(0.35); }
1436
- label.tick-box input[type=radio]:focus + .tick:after, label.tick-box input[type=radio]:hover:not([disabled]) + .tick:after, label.tick-box input[type=radio]:active + .tick:after {
1437
- -webkit-transform: scale(0);
1438
- transform: scale(0); }
1439
- label.tick-box input[type=radio]:focus:checked + .tick, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick, label.tick-box input[type=radio]:active:checked + .tick {
1440
- box-shadow: 0 0 0 1px #0067b1 inset, 0 0 0 transparent, 0 0 0 8px #0085e4 inset; }
1441
- label.tick-box input[type=radio]:focus:checked + .tick:before, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick:before, label.tick-box input[type=radio]:active:checked + .tick:before {
1442
- -webkit-transform: scale(0);
1443
- transform: scale(0); }
1444
- label.tick-box input[type=radio]:focus:checked + .tick:after, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick:after, label.tick-box input[type=radio]:active:checked + .tick:after {
1445
- -webkit-transform: scale(0.35);
1446
- transform: scale(0.35); }
1447
- label.tick-box input[type=checkbox] + .tick {
1448
- border-radius: 2px;
1449
- position: relative; }
1450
- label.tick-box input[type=checkbox] + .tick:before, label.tick-box input[type=checkbox] + .tick:after {
1451
- content: '';
1452
- position: absolute;
1453
- left: -4px;
1454
- top: 0px;
1455
- width: 140%;
1456
- height: 70%;
1457
- margin: 10% 0 0 0;
1458
- border: solid #fff;
1459
- border-width: 0 0 6px 6px;
1460
- -webkit-transition-property: border-color, -webkit-transform;
1461
- transition-property: border-color, -webkit-transform;
1462
- transition-property: transform, border-color;
1463
- transition-property: transform, border-color, -webkit-transform;
1464
- -webkit-transform: scale(0) rotate(-50deg);
1465
- transform: scale(0) rotate(-50deg); }
1466
- label.tick-box input[type=checkbox]:checked + .tick {
1467
- box-shadow: 0 0 0 1px #008bee inset, 0 0 0 transparent, 0 0 0 10px #0094fd inset; }
1468
- label.tick-box input[type=checkbox]:checked + .tick:after, label.tick-box input[type=checkbox]:checked + .tick:before {
1469
- -webkit-transform: scale(0.5) rotate(-50deg);
1470
- transform: scale(0.5) rotate(-50deg); }
1471
- label.tick-box input[type=checkbox]:checked + .tick:before {
1472
- top: 1px;
1473
- opacity: 1;
1474
- border-color: #0076ca; }
1475
- label.tick-box input[type=checkbox]:focus + .tick:before, label.tick-box input[type=checkbox]:hover:not([disabled]) + .tick:before, label.tick-box input[type=checkbox]:active + .tick:before {
1476
- border-color: #c3cdda;
1477
- -webkit-transform: scale(0.4) rotate(-50deg);
1478
- transform: scale(0.4) rotate(-50deg); }
1479
- label.tick-box input[type=checkbox]:focus:checked + .tick, label.tick-box input[type=checkbox]:hover:not([disabled]):checked + .tick, label.tick-box input[type=checkbox]:active:checked + .tick {
1480
- box-shadow: 0 0 0 1px #0067b1 inset, 0 0 0 transparent, 0 0 0 10px #0085e4 inset; }
1481
- label.tick-box input[type=checkbox]:focus:checked + .tick:before, label.tick-box input[type=checkbox]:hover:not([disabled]):checked + .tick:before, label.tick-box input[type=checkbox]:active:checked + .tick:before {
1482
- top: 1px;
1483
- opacity: 1;
1484
- -webkit-transform: scale(0.5) rotate(-50deg);
1485
- transform: scale(0.5) rotate(-50deg);
1486
- border-color: #0076ca; }
1487
-
1488
- .check-switch {
1489
- cursor: pointer;
1490
- -webkit-box-orient: horizontal;
1491
- -webkit-box-direction: normal;
1492
- -ms-flex-direction: row;
1493
- flex-direction: row;
1494
- -webkit-box-align: center;
1495
- -ms-flex-align: center;
1496
- align-items: center; }
1497
- .check-switch .label-text {
1498
- margin-right: 10px;
1499
- padding-bottom: 0;
1500
- line-height: 1.5em; }
1501
- .check-switch-label {
1502
- position: absolute;
1503
- color: transparent;
1504
- font-size: 0; }
1505
- .check-switch-panel {
1506
- width: 40px;
1507
- height: 22px;
1508
- background: rgba(15, 33, 46, 0.1);
1509
- position: relative;
1510
- border-radius: 22px;
1511
- -webkit-transition-property: background, box-shadow, border-color;
1512
- transition-property: background, box-shadow, border-color;
1513
- box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1) inset, 0 0 0 transparent; }
1514
- .check-switch-tick {
1515
- width: 18px;
1516
- height: 18px;
1517
- background: #fff;
1518
- position: absolute;
1519
- bottom: 2px;
1520
- left: 2px;
1521
- border-radius: 22px;
1522
- -webkit-transition-property: -webkit-transform;
1523
- transition-property: -webkit-transform;
1524
- transition-property: transform;
1525
- transition-property: transform, -webkit-transform;
1526
- -webkit-transform: translate3d(0, 0, 0);
1527
- transform: translate3d(0, 0, 0);
1528
- box-shadow: 0 1px 4px rgba(15, 33, 46, 0.4);
1529
- font-weight: 500; }
1530
- .check-switch input {
1531
- opacity: 0;
1532
- position: absolute; }
1533
- .check-switch input:focus ~ .check-switch-panel, .check-switch input:hover:not([disabled]) ~ .check-switch-panel, .check-switch input:active ~ .check-switch-panel {
1534
- background: rgba(15, 33, 46, 0.2); }
1535
- .check-switch input:focus ~ .check-switch-panel .check-switch-tick, .check-switch input:hover:not([disabled]) ~ .check-switch-panel .check-switch-tick, .check-switch input:active ~ .check-switch-panel .check-switch-tick {
1536
- -webkit-transform: scale(1.1);
1537
- transform: scale(1.1); }
1538
- input:checked + .check-switch-panel .check-switch-tick {
1539
- -webkit-transform: translate3d(18px, 0, 0);
1540
- transform: translate3d(18px, 0, 0); }
1541
- input:checked + .check-switch-panel {
1542
- background: #0094fd; }
1543
- .check-switch input:checked:focus ~ .check-switch-panel, .check-switch input:checked:hover:not([disabled]) ~ .check-switch-panel, .check-switch input:checked:active ~ .check-switch-panel {
1544
- background: #008ef3;
1545
- box-shadow: 0 0 0 1px #006dff inset, 0 0 0 transparent; }
1546
- .check-switch input:checked:focus ~ .check-switch-panel .check-switch-tick, .check-switch input:checked:hover:not([disabled]) ~ .check-switch-panel .check-switch-tick, .check-switch input:checked:active ~ .check-switch-panel .check-switch-tick {
1547
- -webkit-transform: scale(1.1) translate3d(16px, 0, 0);
1548
- transform: scale(1.1) translate3d(16px, 0, 0); }
1549
-
1550
- label.valid {
1551
- color: #2ac84f; }
1552
- label.valid input, label.valid select, label.valid textarea {
1553
- -webkit-text-fill-color: currentColor;
1554
- box-shadow: 0 0 0 1px #2ac84f inset, 0 0 0 transparent; }
1555
- label.valid input:focus, label.valid input:hover:not([disabled]), label.valid input:active, label.valid select:focus, label.valid select:hover:not([disabled]), label.valid select:active, label.valid textarea:focus, label.valid textarea:hover:not([disabled]), label.valid textarea:active {
1556
- box-shadow: 0 0 0 1px #2ac84f inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
1557
-
1558
- label.invalid {
1559
- color: #dd2f41; }
1560
- label.invalid input, label.invalid select, label.invalid textarea {
1561
- -webkit-text-fill-color: currentColor;
1562
- box-shadow: 0 0 0 1px #dd2f41 inset, 0 0 0 transparent; }
1563
- label.invalid input:focus, label.invalid input:hover:not([disabled]), label.invalid input:active, label.invalid select:focus, label.invalid select:hover:not([disabled]), label.invalid select:active, label.invalid textarea:focus, label.invalid textarea:hover:not([disabled]), label.invalid textarea:active {
1564
- box-shadow: 0 0 0 1px #dd2f41 inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
1565
-
1566
- @-webkit-keyframes expand-validation {
1170
+ @-webkit-keyframes slide-error-code {
1567
1171
  0% {
1568
- max-height: 0em; }
1172
+ -webkit-transform: translate3d(0, 15px, 0);
1173
+ transform: translate3d(0, 15px, 0); }
1569
1174
  100% {
1570
- max-height: 2.5em; } }
1175
+ -webkit-transform: translate3d(0, 0, 0);
1176
+ transform: translate3d(0, 0, 0); } }
1571
1177
 
1572
- @keyframes expand-validation {
1178
+ @keyframes slide-error-code {
1573
1179
  0% {
1574
- max-height: 0em; }
1180
+ -webkit-transform: translate3d(0, 15px, 0);
1181
+ transform: translate3d(0, 15px, 0); }
1575
1182
  100% {
1576
- max-height: 2.5em; } }
1577
- @-webkit-keyframes scale-fade-in {
1183
+ -webkit-transform: translate3d(0, 0, 0);
1184
+ transform: translate3d(0, 0, 0); } }
1185
+ @-webkit-keyframes drop-cube-1 {
1578
1186
  0% {
1579
1187
  opacity: 0;
1580
- -webkit-transform: translate(-50%, -6px) scale(0.5);
1581
- transform: translate(-50%, -6px) scale(0.5); }
1188
+ -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
1189
+ transform: translate3d(20px, -40px, 0) scale(0.4); }
1190
+ 4%, 100% {
1191
+ opacity: 1;
1192
+ -webkit-transform: translate3d(0, 0, 0) scale(1);
1193
+ transform: translate3d(0, 0, 0) scale(1); } }
1194
+ @keyframes drop-cube-1 {
1195
+ 0% {
1196
+ opacity: 0;
1197
+ -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
1198
+ transform: translate3d(20px, -40px, 0) scale(0.4); }
1199
+ 4%, 100% {
1200
+ opacity: 1;
1201
+ -webkit-transform: translate3d(0, 0, 0) scale(1);
1202
+ transform: translate3d(0, 0, 0) scale(1); } }
1203
+ @-webkit-keyframes darken-cube {
1204
+ 0% {
1205
+ fill: #5a6872; }
1206
+ 100% {
1207
+ fill: #2d3439; } }
1208
+ @keyframes darken-cube {
1209
+ 0% {
1210
+ fill: #5a6872; }
1211
+ 100% {
1212
+ fill: #2d3439; } }
1213
+ @-webkit-keyframes fade-cube-1 {
1214
+ 0%, 6% {
1215
+ opacity: 0; }
1216
+ 100% {
1217
+ opacity: 1; } }
1218
+ @keyframes fade-cube-1 {
1219
+ 0%, 6% {
1220
+ opacity: 0; }
1582
1221
  100% {
1222
+ opacity: 1; } }
1223
+ @-webkit-keyframes drop-cube-2 {
1224
+ 0% {
1225
+ opacity: 0;
1226
+ -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
1227
+ transform: translate3d(20px, -40px, 0) scale(0.4); }
1228
+ 8%, 100% {
1583
1229
  opacity: 1;
1584
- -webkit-transform: translate(-50%, 6px) scale(1);
1585
- transform: translate(-50%, 6px) scale(1); } }
1586
- @keyframes scale-fade-in {
1230
+ -webkit-transform: translate3d(0, 0, 0) scale(1);
1231
+ transform: translate3d(0, 0, 0) scale(1); } }
1232
+ @keyframes drop-cube-2 {
1587
1233
  0% {
1588
1234
  opacity: 0;
1589
- -webkit-transform: translate(-50%, -6px) scale(0.5);
1590
- transform: translate(-50%, -6px) scale(0.5); }
1235
+ -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
1236
+ transform: translate3d(20px, -40px, 0) scale(0.4); }
1237
+ 8%, 100% {
1238
+ opacity: 1;
1239
+ -webkit-transform: translate3d(0, 0, 0) scale(1);
1240
+ transform: translate3d(0, 0, 0) scale(1); } }
1241
+ @keyframes darken-cube {
1242
+ 0% {
1243
+ fill: #5a6872; }
1244
+ 100% {
1245
+ fill: #2d3439; } }
1246
+ @-webkit-keyframes fade-cube-2 {
1247
+ 0%, 12% {
1248
+ opacity: 0; }
1249
+ 100% {
1250
+ opacity: 1; } }
1251
+ @keyframes fade-cube-2 {
1252
+ 0%, 12% {
1253
+ opacity: 0; }
1591
1254
  100% {
1592
- opacity: 1;
1593
- -webkit-transform: translate(-50%, 6px) scale(1);
1594
- transform: translate(-50%, 6px) scale(1); } }
1595
- .validation-message {
1596
- overflow: hidden;
1597
- display: block;
1598
- z-index: 3;
1599
- -webkit-animation: expand-validation 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1600
- animation: expand-validation 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1601
- position: relative;
1602
- top: -1px; }
1603
- .validation-message .validation-message-text {
1604
- margin: 0;
1605
- display: block;
1606
- padding: .8em .8em;
1607
- border-radius: 0 0 2px 2px;
1608
- color: #fff;
1609
- font-size: 12px;
1610
- line-height: 1em;
1611
- background: #8c9ba5; }
1612
- .invalid .validation-message .validation-message-text {
1613
- background: #dd2f41; }
1614
-
1615
- .empty-label[data-slider-label] {
1616
- display: none; }
1617
-
1618
- input[type=range] {
1619
- -webkit-appearance: none;
1620
- -moz-appearance: none;
1621
- width: 100%;
1622
- margin: 0;
1623
- cursor: pointer;
1624
- position: relative;
1625
- z-index: 4;
1626
- height: 16px;
1627
- background: transparent; }
1628
- input[type=range]:focus {
1629
- outline: none; }
1630
- input[type=range]::-webkit-slider-thumb {
1631
- -webkit-appearance: none; }
1632
- input[type=range]::-moz-slider-thumb {
1633
- -moz-appearance: none; }
1634
- input[type=range]::-ms-track {
1635
- width: 100%;
1636
- cursor: pointer;
1637
- background: transparent;
1638
- border-color: transparent;
1639
- color: transparent; }
1640
- input[type=range]::-moz-focus-outer {
1641
- border: 0; }
1642
- input[type=range]::-moz-range-track {
1643
- border: inherit;
1644
- background: transparent; }
1645
- input[type=range]::-moz-range-thumb {
1646
- box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
1647
- border: 6px solid #fff;
1648
- background: rgba(15, 33, 46, 0.2);
1649
- box-sizing: border-box;
1650
- height: 19px;
1651
- width: 19px;
1652
- border-radius: 100%;
1653
- position: relative;
1654
- top: 3px;
1655
- -webkit-transition: all .15s ease-in;
1656
- transition: all .15s ease-in; }
1657
- input[type=range]::-moz-range-thumb:after {
1658
- box-sizing: border-box;
1659
- content: "";
1660
- position: absolute;
1661
- left: -15px;
1662
- right: -15px;
1663
- top: -15px;
1664
- bottom: -15px; }
1665
- input[type=range]::-moz-range-thumb:active {
1666
- background: #5aaafa;
1667
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1668
- input[type=range]::-webkit-slider-thumb {
1669
- box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
1670
- border: 6px solid #fff;
1671
- background: rgba(15, 33, 46, 0.2);
1672
- box-sizing: border-box;
1673
- height: 19px;
1674
- width: 19px;
1675
- border-radius: 100%;
1676
- position: relative;
1677
- top: 3px;
1678
- -webkit-transition: all .15s ease-in;
1679
- transition: all .15s ease-in; }
1680
- input[type=range]::-webkit-slider-thumb:after {
1681
- box-sizing: border-box;
1682
- content: "";
1683
- position: absolute;
1684
- left: -15px;
1685
- right: -15px;
1686
- top: -15px;
1687
- bottom: -15px; }
1688
- input[type=range]::-webkit-slider-thumb:active {
1689
- background: #5aaafa;
1690
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1691
- input[type=range]::-ms-thumb {
1692
- box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
1693
- border: 6px solid #fff;
1694
- background: rgba(15, 33, 46, 0.2);
1695
- box-sizing: border-box;
1696
- height: 19px;
1697
- width: 19px;
1698
- border-radius: 100%;
1699
- position: relative;
1700
- top: 3px;
1701
- -webkit-transition: all .15s ease-in;
1702
- transition: all .15s ease-in; }
1703
- input[type=range]::-ms-thumb:after {
1704
- box-sizing: border-box;
1705
- content: "";
1706
- position: absolute;
1707
- left: -15px;
1708
- right: -15px;
1709
- top: -15px;
1710
- bottom: -15px; }
1711
- input[type=range]::-ms-thumb:active {
1712
- background: #5aaafa;
1713
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1714
- input[type=range]:focus::-moz-range-thumb {
1715
- background: #5aaafa;
1716
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1717
- input[type=range]:focus::-webkit-slider-thumb {
1718
- background: #5aaafa;
1719
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1720
- input[type=range]:focus::-ms-thumb {
1721
- background: #5aaafa;
1722
- box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
1723
- input[type=range]:after {
1724
- position: absolute;
1725
- content: "";
1726
- left: 0px;
1727
- right: 0px;
1728
- top: 6px;
1729
- height: 5px;
1730
- background: #f5f7fa;
1731
- z-index: -1;
1732
- border-radius: 4px;
1733
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
1734
- input[type=range]::-moz-slider-track {
1735
- height: 16px;
1736
- background: transparent; }
1737
- input[type=range]::-moz-slider-track:after {
1738
- position: absolute;
1739
- content: "";
1740
- left: 0px;
1741
- right: 0px;
1742
- top: 6px;
1743
- height: 5px;
1744
- background: #f5f7fa;
1745
- z-index: -1;
1746
- border-radius: 4px;
1747
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
1748
- input[type=range]::-ms-track {
1749
- height: 16px;
1750
- background: transparent; }
1751
- input[type=range]::-ms-track:after {
1752
- position: absolute;
1753
- content: "";
1754
- left: 0px;
1755
- right: 0px;
1756
- top: 6px;
1757
- height: 5px;
1758
- background: #f5f7fa;
1759
- z-index: -1;
1760
- border-radius: 4px;
1761
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
1762
- input[type=range].slider-input {
1763
- margin: 0; }
1764
- input[type=range].slider-input:after {
1765
- display: none; }
1766
- input[type=range].slider-input::-moz-slider-track:after {
1767
- display: none; }
1768
- input[type=range].slider-input::-ms-track:after {
1769
- display: none; }
1770
-
1771
- input::-moz-focus-inner {
1772
- border: 0; }
1773
-
1774
- .slider-container {
1775
- position: relative;
1776
- padding: .5em 0; }
1777
- @media all and (min-width: 400px) {
1778
- .slider-container {
1779
- display: -webkit-box;
1780
- display: -ms-flexbox;
1781
- display: flex;
1782
- -webkit-box-orient: horizontal;
1783
- -webkit-box-direction: normal;
1784
- -ms-flex-flow: row nowrap;
1785
- flex-flow: row nowrap;
1786
- -webkit-box-align: center;
1787
- -ms-flex-align: center;
1788
- align-items: center; }
1789
- .slider-container.with-label {
1790
- max-width: 320px; } }
1791
- .slider-container.line-labels {
1792
- padding: vr(1) 0 0; }
1793
-
1794
- .slider-input-container {
1795
- position: relative;
1796
- -webkit-box-flex: 1;
1797
- -ms-flex: 1 0 auto;
1798
- flex: 1 0 auto;
1799
- /*margin: .6em 0;*/ }
1800
-
1801
- .slider-track {
1802
- height: 0px;
1803
- display: -webkit-box;
1804
- display: -ms-flexbox;
1805
- display: flex;
1806
- -webkit-box-align: center;
1807
- -ms-flex-align: center;
1808
- align-items: center;
1809
- -webkit-box-orient: horizontal;
1810
- -webkit-box-direction: normal;
1811
- -ms-flex-flow: row wrap;
1812
- flex-flow: row wrap;
1813
- -webkit-box-pack: justify;
1814
- -ms-flex-pack: justify;
1815
- justify-content: space-between;
1816
- margin: 0 10px 0 9px;
1817
- position: relative;
1818
- top: -12px; }
1819
-
1820
- .slider-segment {
1821
- position: relative; }
1822
-
1823
- .slider-segment-mark:before, .slider-segment-mark:after {
1824
- position: absolute;
1825
- content: "";
1826
- width: 13px;
1827
- height: 13px;
1828
- top: -4px;
1829
- left: -6px;
1830
- box-sizing: border-box;
1831
- border-radius: 100%; }
1832
- .slider-segment-mark:before {
1833
- background: #fff;
1834
- border: #f5f7fa 3px solid;
1835
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px inset;
1836
- z-index: 3; }
1837
- .slider-segment-mark:after {
1838
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
1839
- z-index: 0; }
1840
-
1841
- .slider-fills {
1842
- position: absolute;
1843
- left: 10px;
1844
- right: 10px;
1845
- top: 9px;
1846
- height: 5px;
1847
- z-index: 1;
1848
- display: -webkit-box;
1849
- display: -ms-flexbox;
1850
- display: flex;
1851
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
1852
- border-radius: 5px; }
1853
-
1854
- .slider-fill {
1855
- -webkit-box-flex: 1;
1856
- -ms-flex-positive: 1;
1857
- flex-grow: 1;
1858
- height: 5px;
1859
- position: relative;
1860
- box-sizing: border-box;
1861
- background: #f5f7fa;
1862
- border-left: 1px solid transparent;
1863
- border-right: 1px solid rgba(15, 33, 46, 0.2); }
1864
- .slider-fill:before {
1865
- content: "";
1866
- position: absolute;
1867
- top: 0px;
1868
- left: 0px;
1869
- right: 0px;
1870
- bottom: 0px;
1871
- z-index: -1; }
1872
- .slider-fill:first-child, .slider-fill:first-child:before {
1873
- border-top-left-radius: 5px;
1874
- border-bottom-left-radius: 5px; }
1875
- .slider-fill:first-child:before {
1876
- left: 0px; }
1877
- .slider-fill:last-child, .slider-fill:last-child:before {
1878
- border-top-right-radius: 5px;
1879
- border-bottom-right-radius: 5px; }
1880
- .slider-fill:last-child:before {
1881
- right: 0px; }
1882
-
1883
- .slider-input.no-segments ~ .slider-fills .slider-fill, .slider-input[max='100'] ~ .slider-fills .slider-fill {
1884
- border-right: 0; }
1885
-
1886
- .slider-line-label {
1887
- position: absolute;
1888
- white-space: nowrap;
1889
- font-size: 12px;
1890
- z-index: 3;
1891
- height: 1.25;
1892
- top: -28px;
1893
- right: -30px;
1894
- left: -28px;
1895
- text-align: center; }
1896
-
1897
- .slider-segment:first-child .slider-line-label {
1898
- left: -9px;
1899
- right: auto;
1900
- text-align: left; }
1901
- .slider-segment:first-child .slider-line-label:before {
1902
- left: 8px; }
1903
-
1904
- .slider-segment:last-child .slider-line-label {
1905
- right: -11px;
1906
- left: auto;
1907
- text-align: right; }
1908
- .slider-segment:last-child .slider-line-label:before {
1909
- right: 9px; }
1910
-
1911
- .slider-label {
1912
- background: #fff;
1913
- border-radius: 3px;
1914
- box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
1915
- font-size: 14px;
1916
- padding: 4px 8px;
1917
- position: relative;
1918
- text-align: center; }
1919
- @media all and (min-width: 400px) {
1920
- .slider-label {
1921
- white-space: nowrap;
1922
- position: absolute;
1923
- top: 50%;
1924
- -webkit-transform: translatey(-50%);
1925
- transform: translatey(-50%);
1926
- -webkit-transform-style: preserve-3d;
1927
- transform-style: preserve-3d; }
1928
- .slider-label:after, .slider-label:before {
1929
- content: ""; } }
1930
- .slider-label:after, .slider-label:before {
1931
- position: absolute;
1932
- width: 0;
1933
- height: 0;
1934
- top: 50%;
1935
- -webkit-transform: translatey(-50%);
1936
- transform: translatey(-50%);
1937
- -webkit-transform-style: preserve-3d;
1938
- transform-style: preserve-3d;
1939
- border-top: 7px solid transparent;
1940
- border-bottom: 7px solid transparent; }
1941
- .slider-label > * + *:before {
1942
- content: " — "; }
1943
- @media all and (min-width: 400px) {
1944
- .slider-label > * + * {
1945
- display: block; }
1946
- .slider-label > * + *:before {
1947
- content: ""; } }
1948
- .slider-label [class*=big] {
1949
- font-size: 1.15em; }
1950
- .slider-label [class*=small] {
1951
- font-size: .8em; }
1952
-
1953
- [data-slider-label]:after {
1954
- content: attr(data-after); }
1955
- [data-slider-label]:before {
1956
- content: attr(data-before); }
1957
-
1958
- @media all and (min-width: 400px) {
1959
- .slider-label.align-right {
1960
- margin-left: 10px;
1961
- left: 100%;
1962
- text-align: left; } }
1963
- .slider-label.align-right:before, .slider-label.align-right:after {
1964
- left: -7px;
1965
- border-right: 7px solid rgba(15, 33, 46, 0.2); }
1966
- .slider-label.align-right:after {
1967
- border-right-color: #fff;
1968
- left: -6px; }
1969
-
1970
- @media all and (min-width: 400px) {
1971
- .slider-label.align-left {
1972
- margin-right: 10px;
1973
- right: 100%;
1974
- text-align: right; } }
1975
- .slider-label.align-left:before, .slider-label.align-left:after {
1976
- right: -7px;
1977
- border-top: 7px solid transparent;
1978
- border-left: 7px solid rgba(15, 33, 46, 0.2);
1979
- border-bottom: 7px solid transparent; }
1980
- .slider-label.align-left:after {
1981
- border-left-color: #fff;
1982
- right: -6px; }
1983
-
1984
- .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled {
1985
- background: #5aaafa;
1986
- border-right-color: #1f8bf8; }
1987
- .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled:first-child {
1988
- border-left-color: #1f8bf8; }
1989
- .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled:before {
1990
- box-shadow: #1f8bf8 0 0 0 1px; }
1991
- .slider-input.fill ~ .slider-track .filled .slider-segment-mark[data-index]:before {
1992
- border-color: #5aaafa;
1993
- box-shadow: #1f8bf8 0 0 0 1px inset; }
1994
- .slider-input.fill ~ .slider-track .filled .slider-segment-mark[data-index]:after {
1995
- box-shadow: #1f8bf8 0 0 0 1px; }
1996
-
1997
- .error-page {
1998
- background: #5a6872;
1999
- background: -webkit-linear-gradient(top, #444e56, #5a6872, #5a6872, #5a6872);
2000
- background: linear-gradient(to bottom, #444e56, #5a6872, #5a6872, #5a6872); }
2001
- .error-page h1 {
2002
- font-size: 50px;
2003
- font-weight: 600;
2004
- color: #fff;
2005
- text-shadow: 0 1px 0 #0f212e; }
2006
- .error-page p {
2007
- color: #fff;
2008
- font-size: 1.2em; }
2009
- .error-page footer {
2010
- position: fixed;
2011
- bottom: 0;
2012
- left: 0;
2013
- right: 0;
2014
- line-height: 2.5em;
2015
- padding: .5em; }
2016
-
2017
- .error-page body {
2018
- text-align: center;
2019
- display: -ms-grid;
2020
- display: grid;
2021
- -ms-flex-line-pack: center;
2022
- align-content: center; }
2023
-
2024
- .error-svgs {
2025
- padding-bottom: 114px;
2026
- margin: 2em auto;
2027
- width: 394px;
2028
- -webkit-animation: slide-error-code 0.6s 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2029
- animation: slide-error-code 0.6s 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2030
- -webkit-transform: translate3d(0, 15px, 0);
2031
- transform: translate3d(0, 15px, 0); }
2032
- .error-svgs .error-number {
2033
- -webkit-transform: translate3d(0, 0, 0);
2034
- transform: translate3d(0, 0, 0);
2035
- overflow: visible;
2036
- width: 200px;
2037
- position: relative; }
2038
- .error-svgs .error-number .error-box {
2039
- opacity: 0;
2040
- -webkit-animation-fill-mode: forwards;
2041
- animation-fill-mode: forwards; }
2042
- .error-svgs .error-number .error-box-side, .error-svgs .error-number .error-box-bg {
2043
- fill: #5a6872; }
2044
- .error-svgs .error-number .error-box-side {
2045
- fill-opacity: .5; }
2046
- .error-svgs .error-number:nth-of-type(1) {
2047
- top: 114px;
2048
- margin-right: -103px;
2049
- z-index: 2; }
2050
- .error-svgs .error-number:nth-of-type(1) .error-box {
2051
- -webkit-animation-delay: .1s;
2052
- animation-delay: .1s; }
2053
- .error-svgs .error-number:nth-of-type(2) {
2054
- margin-right: -103px;
2055
- top: 57px;
2056
- z-index: 1; }
2057
- .error-svgs .error-number:nth-of-type(2) .error-box {
2058
- -webkit-animation-delay: .2s;
2059
- animation-delay: .2s; }
2060
- .error-svgs .error-number:nth-of-type(3) {
2061
- z-index: 0; }
2062
- .error-svgs .error-number:nth-of-type(3) .error-box {
2063
- -webkit-animation-delay: .3s;
2064
- animation-delay: .3s; }
2065
-
2066
- .error-box:nth-child(1) {
2067
- -webkit-animation: drop-cube-1 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2068
- animation: drop-cube-1 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2069
- .error-box:nth-child(1) .error-box-bg {
2070
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2071
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2072
- -webkit-animation-delay: .5s;
2073
- animation-delay: .5s; }
2074
-
2075
- .error-box:nth-child(2) {
2076
- -webkit-animation: drop-cube-2 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2077
- animation: drop-cube-2 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2078
- .error-box:nth-child(2) .error-box-bg {
2079
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2080
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2081
- -webkit-animation-delay: .5s;
2082
- animation-delay: .5s; }
2083
-
2084
- .error-box:nth-child(3) {
2085
- -webkit-animation: drop-cube-3 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2086
- animation: drop-cube-3 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2087
- .error-box:nth-child(3) .error-box-bg {
2088
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2089
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2090
- -webkit-animation-delay: .5s;
2091
- animation-delay: .5s; }
2092
-
2093
- .error-box:nth-child(4) {
2094
- -webkit-animation: drop-cube-4 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2095
- animation: drop-cube-4 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2096
- .error-box:nth-child(4) .error-box-bg {
2097
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2098
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2099
- -webkit-animation-delay: .5s;
2100
- animation-delay: .5s; }
2101
-
2102
- .error-box:nth-child(5) {
2103
- -webkit-animation: drop-cube-5 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2104
- animation: drop-cube-5 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2105
- .error-box:nth-child(5) .error-box-bg {
2106
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2107
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2108
- -webkit-animation-delay: .5s;
2109
- animation-delay: .5s; }
2110
-
2111
- .error-box:nth-child(6) {
2112
- -webkit-animation: drop-cube-6 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2113
- animation: drop-cube-6 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2114
- .error-box:nth-child(6) .error-box-bg {
2115
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2116
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2117
- -webkit-animation-delay: .5s;
2118
- animation-delay: .5s; }
2119
-
2120
- .error-box:nth-child(7) {
2121
- -webkit-animation: drop-cube-7 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2122
- animation: drop-cube-7 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2123
- .error-box:nth-child(7) .error-box-bg {
2124
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2125
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2126
- -webkit-animation-delay: .5s;
2127
- animation-delay: .5s; }
2128
-
2129
- .error-box:nth-child(8) {
2130
- -webkit-animation: drop-cube-8 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2131
- animation: drop-cube-8 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2132
- .error-box:nth-child(8) .error-box-bg {
2133
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2134
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2135
- -webkit-animation-delay: .5s;
2136
- animation-delay: .5s; }
2137
-
2138
- .error-box:nth-child(9) {
2139
- -webkit-animation: drop-cube-9 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2140
- animation: drop-cube-9 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2141
- .error-box:nth-child(9) .error-box-bg {
2142
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2143
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2144
- -webkit-animation-delay: .5s;
2145
- animation-delay: .5s; }
2146
-
2147
- .error-box:nth-child(10) {
2148
- -webkit-animation: drop-cube-10 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2149
- animation: drop-cube-10 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2150
- .error-box:nth-child(10) .error-box-bg {
2151
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2152
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2153
- -webkit-animation-delay: .5s;
2154
- animation-delay: .5s; }
2155
-
2156
- .error-box:nth-child(11) {
2157
- -webkit-animation: drop-cube-11 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2158
- animation: drop-cube-11 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2159
- .error-box:nth-child(11) .error-box-bg {
2160
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2161
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2162
- -webkit-animation-delay: .5s;
2163
- animation-delay: .5s; }
2164
-
2165
- .error-box:nth-child(12) {
2166
- -webkit-animation: drop-cube-12 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2167
- animation: drop-cube-12 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2168
- .error-box:nth-child(12) .error-box-bg {
2169
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2170
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2171
- -webkit-animation-delay: .5s;
2172
- animation-delay: .5s; }
2173
-
2174
- .error-box:nth-child(13) {
2175
- -webkit-animation: drop-cube-13 0.8s cubic-bezier(0.4, 0, 0.2, 1);
2176
- animation: drop-cube-13 0.8s cubic-bezier(0.4, 0, 0.2, 1); }
2177
- .error-box:nth-child(13) .error-box-bg {
2178
- -webkit-animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2179
- animation: darken-cube 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
2180
- -webkit-animation-delay: .5s;
2181
- animation-delay: .5s; }
2182
-
2183
- @-webkit-keyframes slide-error-code {
2184
- 0% {
2185
- -webkit-transform: translate3d(0, 15px, 0);
2186
- transform: translate3d(0, 15px, 0); }
2187
- 100% {
2188
- -webkit-transform: translate3d(0, 0, 0);
2189
- transform: translate3d(0, 0, 0); } }
2190
-
2191
- @keyframes slide-error-code {
2192
- 0% {
2193
- -webkit-transform: translate3d(0, 15px, 0);
2194
- transform: translate3d(0, 15px, 0); }
2195
- 100% {
2196
- -webkit-transform: translate3d(0, 0, 0);
2197
- transform: translate3d(0, 0, 0); } }
2198
- @-webkit-keyframes drop-cube-1 {
2199
- 0% {
2200
- opacity: 0;
2201
- -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
2202
- transform: translate3d(20px, -40px, 0) scale(0.4); }
2203
- 4%, 100% {
2204
- opacity: 1;
2205
- -webkit-transform: translate3d(0, 0, 0) scale(1);
2206
- transform: translate3d(0, 0, 0) scale(1); } }
2207
- @keyframes drop-cube-1 {
2208
- 0% {
2209
- opacity: 0;
2210
- -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
2211
- transform: translate3d(20px, -40px, 0) scale(0.4); }
2212
- 4%, 100% {
2213
- opacity: 1;
2214
- -webkit-transform: translate3d(0, 0, 0) scale(1);
2215
- transform: translate3d(0, 0, 0) scale(1); } }
2216
- @-webkit-keyframes darken-cube {
2217
- 0% {
2218
- fill: #5a6872; }
2219
- 100% {
2220
- fill: #2d3439; } }
2221
- @keyframes darken-cube {
2222
- 0% {
2223
- fill: #5a6872; }
2224
- 100% {
2225
- fill: #2d3439; } }
2226
- @-webkit-keyframes fade-cube-1 {
2227
- 0%, 6% {
2228
- opacity: 0; }
2229
- 100% {
2230
- opacity: 1; } }
2231
- @keyframes fade-cube-1 {
2232
- 0%, 6% {
2233
- opacity: 0; }
2234
- 100% {
2235
- opacity: 1; } }
2236
- @-webkit-keyframes drop-cube-2 {
2237
- 0% {
2238
- opacity: 0;
2239
- -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
2240
- transform: translate3d(20px, -40px, 0) scale(0.4); }
2241
- 8%, 100% {
2242
- opacity: 1;
2243
- -webkit-transform: translate3d(0, 0, 0) scale(1);
2244
- transform: translate3d(0, 0, 0) scale(1); } }
2245
- @keyframes drop-cube-2 {
2246
- 0% {
2247
- opacity: 0;
2248
- -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
2249
- transform: translate3d(20px, -40px, 0) scale(0.4); }
2250
- 8%, 100% {
2251
- opacity: 1;
2252
- -webkit-transform: translate3d(0, 0, 0) scale(1);
2253
- transform: translate3d(0, 0, 0) scale(1); } }
2254
- @keyframes darken-cube {
2255
- 0% {
2256
- fill: #5a6872; }
2257
- 100% {
2258
- fill: #2d3439; } }
2259
- @-webkit-keyframes fade-cube-2 {
2260
- 0%, 12% {
2261
- opacity: 0; }
2262
- 100% {
2263
- opacity: 1; } }
2264
- @keyframes fade-cube-2 {
2265
- 0%, 12% {
2266
- opacity: 0; }
2267
- 100% {
2268
- opacity: 1; } }
2269
- @-webkit-keyframes drop-cube-3 {
2270
- 0% {
2271
- opacity: 0;
2272
- -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
2273
- transform: translate3d(20px, -40px, 0) scale(0.4); }
2274
- 12%, 100% {
1255
+ opacity: 1; } }
1256
+ @-webkit-keyframes drop-cube-3 {
1257
+ 0% {
1258
+ opacity: 0;
1259
+ -webkit-transform: translate3d(20px, -40px, 0) scale(0.4);
1260
+ transform: translate3d(20px, -40px, 0) scale(0.4); }
1261
+ 12%, 100% {
2275
1262
  opacity: 1;
2276
1263
  -webkit-transform: translate3d(0, 0, 0) scale(1);
2277
1264
  transform: translate3d(0, 0, 0) scale(1); } }
@@ -2631,55 +1618,1121 @@ input::-moz-focus-inner {
2631
1618
  opacity: 1; } }
2632
1619
  @-webkit-keyframes error-party {
2633
1620
  0% {
2634
- color: #8e55dd; }
2635
- 20% {
2636
- color: #967adc; }
2637
- 40% {
2638
- color: #fef0bd; }
2639
- 60% {
2640
- color: #d4eef7; }
2641
- 80% {
2642
- color: #82c1ed; }
1621
+ color: #8e55dd; }
1622
+ 20% {
1623
+ color: #967adc; }
1624
+ 40% {
1625
+ color: #fef0bd; }
1626
+ 60% {
1627
+ color: #d4eef7; }
1628
+ 80% {
1629
+ color: #82c1ed; }
1630
+ 100% {
1631
+ color: #5d9cec; } }
1632
+ @keyframes error-party {
1633
+ 0% {
1634
+ color: #8e55dd; }
1635
+ 20% {
1636
+ color: #967adc; }
1637
+ 40% {
1638
+ color: #fef0bd; }
1639
+ 60% {
1640
+ color: #d4eef7; }
1641
+ 80% {
1642
+ color: #82c1ed; }
1643
+ 100% {
1644
+ color: #5d9cec; } }
1645
+ @-webkit-keyframes fade-in-slowly {
1646
+ 0% {
1647
+ opacity: 0; }
1648
+ 80% {
1649
+ opacity: 0; }
1650
+ 100% {
1651
+ opacity: 1; } }
1652
+ @keyframes fade-in-slowly {
1653
+ 0% {
1654
+ opacity: 0; }
1655
+ 80% {
1656
+ opacity: 0; }
1657
+ 100% {
1658
+ opacity: 1; } }
1659
+ @-webkit-keyframes zbounce {
1660
+ 0%, 100% {
1661
+ -webkit-transform: scale(0.95, 0.95);
1662
+ transform: scale(0.95, 0.95); }
1663
+ 50% {
1664
+ -webkit-transform: scale(1, 1);
1665
+ transform: scale(1, 1); } }
1666
+ @keyframes zbounce {
1667
+ 0%, 100% {
1668
+ -webkit-transform: scale(0.95, 0.95);
1669
+ transform: scale(0.95, 0.95); }
1670
+ 50% {
1671
+ -webkit-transform: scale(1, 1);
1672
+ transform: scale(1, 1); } }
1673
+ .switch-label, .tick-label {
1674
+ pointer-events: none; }
1675
+ .switch-label *, .tick-label * {
1676
+ pointer-events: all; }
1677
+
1678
+ label [type=checkbox], label [type=radio] {
1679
+ position: absolute;
1680
+ border: none;
1681
+ cursor: pointer;
1682
+ opacity: 0;
1683
+ z-index: -1; }
1684
+
1685
+ fieldset {
1686
+ border: 0;
1687
+ padding: 0;
1688
+ margin-left: 0;
1689
+ margin-right: 0; }
1690
+
1691
+ select, textarea, textarea, input[type=url], input[type=tel], input[type=text], input[type=email], input[type=number], input[type=password], input[type=search] {
1692
+ -webkit-appearance: none;
1693
+ -moz-appearance: none;
1694
+ appearance: none;
1695
+ border: none;
1696
+ width: 100%;
1697
+ padding: 9px 12px;
1698
+ border-radius: 3px;
1699
+ -webkit-transition: box-shadow 0.25s;
1700
+ transition: box-shadow 0.25s;
1701
+ line-height: 2em;
1702
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2) inset, 0 0 0 transparent; }
1703
+ select:hover, select:focus, select:active, textarea:hover, textarea:focus, textarea:active, textarea:hover, textarea:focus, textarea:active, input[type=url]:hover, input[type=url]:focus, input[type=url]:active, input[type=tel]:hover, input[type=tel]:focus, input[type=tel]:active, input[type=text]:hover, input[type=text]:focus, input[type=text]:active, input[type=email]:hover, input[type=email]:focus, input[type=email]:active, input[type=number]:hover, input[type=number]:focus, input[type=number]:active, input[type=password]:hover, input[type=password]:focus, input[type=password]:active, input[type=search]:hover, input[type=search]:focus, input[type=search]:active {
1704
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.3) inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
1705
+ select:disabled:not([type="submit"]), textarea:disabled:not([type="submit"]), textarea:disabled:not([type="submit"]), input[type=url]:disabled:not([type="submit"]), input[type=tel]:disabled:not([type="submit"]), input[type=text]:disabled:not([type="submit"]), input[type=email]:disabled:not([type="submit"]), input[type=number]:disabled:not([type="submit"]), input[type=password]:disabled:not([type="submit"]), input[type=search]:disabled:not([type="submit"]) {
1706
+ color: #d6dde7;
1707
+ cursor: default; }
1708
+ select::-moz-focus-inner, textarea::-moz-focus-inner, textarea::-moz-focus-inner, input[type=url]::-moz-focus-inner, input[type=tel]::-moz-focus-inner, input[type=text]::-moz-focus-inner, input[type=email]::-moz-focus-inner, input[type=number]::-moz-focus-inner, input[type=password]::-moz-focus-inner, input[type=search]::-moz-focus-inner {
1709
+ border: none;
1710
+ padding: 0; }
1711
+
1712
+ .input-wrapper {
1713
+ position: relative; }
1714
+
1715
+ input[type=search], input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button {
1716
+ -webkit-appearance: none; }
1717
+
1718
+ select {
1719
+ min-height: 40px;
1720
+ cursor: pointer;
1721
+ background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 14'%3E%3Cpolygon fill='%237A7B7C' points='3.5,0 0,6 7,6'/%3E%3Cpolygon fill='%237A7B7C' points='3.5,14 0,8 7,8'/%3E%3C/svg%3E") calc(100% - 14px) 50%/7px 14px no-repeat; }
1722
+
1723
+ textarea {
1724
+ display: block;
1725
+ resize: vertical;
1726
+ min-height: 75px; }
1727
+
1728
+ ::-webkit-input-placeholder {
1729
+ opacity: 1;
1730
+ color: #c3cdda; }
1731
+
1732
+ :-ms-input-placeholder {
1733
+ opacity: 1;
1734
+ color: #c3cdda; }
1735
+
1736
+ ::placeholder {
1737
+ opacity: 1;
1738
+ color: #c3cdda; }
1739
+
1740
+ input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button {
1741
+ -webkit-appearance: none;
1742
+ margin: 0; }
1743
+
1744
+ label {
1745
+ display: -webkit-box;
1746
+ display: -ms-flexbox;
1747
+ display: flex;
1748
+ -webkit-box-orient: vertical;
1749
+ -webkit-box-direction: normal;
1750
+ -ms-flex-direction: column;
1751
+ flex-direction: column;
1752
+ position: relative;
1753
+ -webkit-box-flex: 1;
1754
+ -ms-flex: 1 0 auto;
1755
+ flex: 1 0 auto; }
1756
+ label .label-text {
1757
+ -webkit-transition-property: box-shadow, color;
1758
+ transition-property: box-shadow, color;
1759
+ padding-bottom: .2em; }
1760
+
1761
+ label *, label *:before, label *:after {
1762
+ -webkit-transition-duration: 0.25s;
1763
+ transition-duration: 0.25s;
1764
+ -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1765
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
1766
+
1767
+ form.button_to {
1768
+ width: auto;
1769
+ display: -webkit-inline-box;
1770
+ display: -ms-inline-flexbox;
1771
+ display: inline-flex; }
1772
+
1773
+ .placeholder-label {
1774
+ padding: 0;
1775
+ font-size: 1em; }
1776
+ .placeholder-label ::-webkit-input-placeholder {
1777
+ opacity: 0;
1778
+ color: transparent; }
1779
+ .placeholder-label :-ms-input-placeholder {
1780
+ opacity: 0;
1781
+ color: transparent; }
1782
+ .placeholder-label ::placeholder {
1783
+ opacity: 0;
1784
+ color: transparent; }
1785
+ .placeholder-label label:not(.valid):not(.invalid) textarea:focus + span, .placeholder-label label:not(.valid):not(.invalid) textarea:active + span, .placeholder-label label:not(.valid):not(.invalid) input:focus + span, .placeholder-label label:not(.valid):not(.invalid) input:active + span {
1786
+ color: #8c9ba5; }
1787
+ .placeholder-label textarea, .placeholder-label input {
1788
+ z-index: 1;
1789
+ margin: 0;
1790
+ font-size: inherit;
1791
+ padding: 0.9em 0.8em; }
1792
+ .placeholder-label textarea:focus, .placeholder-label textarea:not(.empty), .placeholder-label input:focus, .placeholder-label input:not(.empty) {
1793
+ padding-top: 1.4em;
1794
+ padding-bottom: 0.4em; }
1795
+ .placeholder-label textarea:focus + .placeholder-label-text, .placeholder-label textarea:not(.empty) + .placeholder-label-text, .placeholder-label input:focus + .placeholder-label-text, .placeholder-label input:not(.empty) + .placeholder-label-text {
1796
+ z-index: 2;
1797
+ -webkit-transform: translate3d(0, -0.6em, 0) scale(0.8);
1798
+ transform: translate3d(0, -0.6em, 0) scale(0.8);
1799
+ color: #8c9ba5; }
1800
+ .placeholder-label.valid textarea + .placeholder-label-text, .placeholder-label.valid input + .placeholder-label-text, .placeholder-label.invalid textarea + .placeholder-label-text, .placeholder-label.invalid input + .placeholder-label-text {
1801
+ color: inherit; }
1802
+ .placeholder-label input {
1803
+ line-height: inherit; }
1804
+ .placeholder-label textarea {
1805
+ padding-top: 4.9em; }
1806
+
1807
+ .placeholder-label-text {
1808
+ pointer-events: none;
1809
+ font-size: inherit;
1810
+ position: absolute;
1811
+ top: 0.8em;
1812
+ left: 0.8em;
1813
+ padding: 1px 0 0 1px;
1814
+ -webkit-transform-origin: left top 0;
1815
+ transform-origin: left top 0;
1816
+ will-change: transform;
1817
+ -webkit-filter: blur(0);
1818
+ -webkit-backface-visibility: hidden;
1819
+ backface-visibility: hidden;
1820
+ -webkit-font-smoothing: subpixel-antialiased;
1821
+ color: #c3cdda;
1822
+ -webkit-transform: translate3d(0, 0, 0) scale(1);
1823
+ transform: translate3d(0, 0, 0) scale(1);
1824
+ -webkit-transition-property: color, -webkit-transform;
1825
+ transition-property: color, -webkit-transform;
1826
+ transition-property: color, transform;
1827
+ transition-property: color, transform, -webkit-transform; }
1828
+ .label-text ~ .placeholder-label-text {
1829
+ top: 2.3em; }
1830
+
1831
+ label.tick-box {
1832
+ -webkit-box-orient: horizontal;
1833
+ -webkit-box-direction: normal;
1834
+ -ms-flex-direction: row;
1835
+ flex-direction: row;
1836
+ -webkit-box-align: center;
1837
+ -ms-flex-align: center;
1838
+ align-items: center;
1839
+ cursor: pointer; }
1840
+ label.tick-box *, label.tick-box *:after, label.tick-box *:before {
1841
+ -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
1842
+ transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275); }
1843
+ label.tick-box input + .tick {
1844
+ width: 20px;
1845
+ height: 20px;
1846
+ margin: 0 8px 0 0;
1847
+ background: #fff;
1848
+ -webkit-transition-property: box-shadow;
1849
+ transition-property: box-shadow;
1850
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2) inset, 0 0 0 transparent, 0 0 0 transparent inset; }
1851
+ label.tick-box input:focus, label.tick-box input:hover:not([disabled]), label.tick-box input:active {
1852
+ border: none; }
1853
+ label.tick-box input:focus + .tick, label.tick-box input:hover:not([disabled]) + .tick, label.tick-box input:active + .tick {
1854
+ box-shadow: 0 0 0 1px #8c9ba5 inset, 0 0 0 transparent, 0 0 0 transparent inset; }
1855
+ label.tick-box input:disabled {
1856
+ pointer-events: none;
1857
+ cursor: default;
1858
+ color: #d6dde7; }
1859
+ label.tick-box input:disabled + .tick {
1860
+ box-shadow: 0 0 0 1px #c3cdda inset; }
1861
+ label.tick-box input[type=radio] + .tick {
1862
+ border-radius: 50%;
1863
+ position: relative; }
1864
+ label.tick-box input[type=radio] + .tick:before, label.tick-box input[type=radio] + .tick:after {
1865
+ content: '';
1866
+ background-color: white;
1867
+ position: absolute;
1868
+ left: 0;
1869
+ top: 0;
1870
+ height: 100%;
1871
+ width: 100%;
1872
+ border-radius: 50%;
1873
+ box-shadow: 0 0 0 transparent;
1874
+ -webkit-transform: scale(0);
1875
+ transform: scale(0);
1876
+ -webkit-transition-property: box-shadow, -webkit-transform;
1877
+ transition-property: box-shadow, -webkit-transform;
1878
+ transition-property: box-shadow, transform;
1879
+ transition-property: box-shadow, transform, -webkit-transform; }
1880
+ label.tick-box input[type=radio] + .tick:before {
1881
+ background-color: #c3cdda; }
1882
+ label.tick-box input[type=radio]:checked + .tick {
1883
+ box-shadow: 0 0 0 1px #008bee inset, 0 0 0 transparent, 0 0 0 8px #0094fd inset; }
1884
+ label.tick-box input[type=radio]:checked + .tick:after {
1885
+ box-shadow: 0 1px 0 2px #0067b1;
1886
+ -webkit-transform: scale(0.35);
1887
+ transform: scale(0.35); }
1888
+ label.tick-box input[type=radio]:focus + .tick:before, label.tick-box input[type=radio]:hover:not([disabled]) + .tick:before, label.tick-box input[type=radio]:active + .tick:before {
1889
+ -webkit-transform: scale(0.35);
1890
+ transform: scale(0.35); }
1891
+ label.tick-box input[type=radio]:focus + .tick:after, label.tick-box input[type=radio]:hover:not([disabled]) + .tick:after, label.tick-box input[type=radio]:active + .tick:after {
1892
+ -webkit-transform: scale(0);
1893
+ transform: scale(0); }
1894
+ label.tick-box input[type=radio]:focus:checked + .tick, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick, label.tick-box input[type=radio]:active:checked + .tick {
1895
+ box-shadow: 0 0 0 1px #0067b1 inset, 0 0 0 transparent, 0 0 0 8px #0085e4 inset; }
1896
+ label.tick-box input[type=radio]:focus:checked + .tick:before, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick:before, label.tick-box input[type=radio]:active:checked + .tick:before {
1897
+ -webkit-transform: scale(0);
1898
+ transform: scale(0); }
1899
+ label.tick-box input[type=radio]:focus:checked + .tick:after, label.tick-box input[type=radio]:hover:not([disabled]):checked + .tick:after, label.tick-box input[type=radio]:active:checked + .tick:after {
1900
+ -webkit-transform: scale(0.35);
1901
+ transform: scale(0.35); }
1902
+ label.tick-box input[type=checkbox] + .tick {
1903
+ border-radius: 3px;
1904
+ position: relative; }
1905
+ label.tick-box input[type=checkbox] + .tick:before, label.tick-box input[type=checkbox] + .tick:after {
1906
+ content: '';
1907
+ position: absolute;
1908
+ left: -4px;
1909
+ top: 0px;
1910
+ width: 140%;
1911
+ height: 70%;
1912
+ margin: 10% 0 0 0;
1913
+ border: solid #fff;
1914
+ border-width: 0 0 6px 6px;
1915
+ -webkit-transition-property: border-color, -webkit-transform;
1916
+ transition-property: border-color, -webkit-transform;
1917
+ transition-property: transform, border-color;
1918
+ transition-property: transform, border-color, -webkit-transform;
1919
+ -webkit-transform: scale(0) rotate(-50deg);
1920
+ transform: scale(0) rotate(-50deg); }
1921
+ label.tick-box input[type=checkbox]:checked + .tick {
1922
+ box-shadow: 0 0 0 1px #008bee inset, 0 0 0 transparent, 0 0 0 10px #0094fd inset; }
1923
+ label.tick-box input[type=checkbox]:checked + .tick:after, label.tick-box input[type=checkbox]:checked + .tick:before {
1924
+ -webkit-transform: scale(0.5) rotate(-50deg);
1925
+ transform: scale(0.5) rotate(-50deg); }
1926
+ label.tick-box input[type=checkbox]:checked + .tick:before {
1927
+ top: 1px;
1928
+ opacity: 1;
1929
+ border-color: #0076ca; }
1930
+ label.tick-box input[type=checkbox]:focus + .tick:before, label.tick-box input[type=checkbox]:hover:not([disabled]) + .tick:before, label.tick-box input[type=checkbox]:active + .tick:before {
1931
+ border-color: #c3cdda;
1932
+ -webkit-transform: scale(0.4) rotate(-50deg);
1933
+ transform: scale(0.4) rotate(-50deg); }
1934
+ label.tick-box input[type=checkbox]:focus:checked + .tick, label.tick-box input[type=checkbox]:hover:not([disabled]):checked + .tick, label.tick-box input[type=checkbox]:active:checked + .tick {
1935
+ box-shadow: 0 0 0 1px #0067b1 inset, 0 0 0 transparent, 0 0 0 10px #0085e4 inset; }
1936
+ label.tick-box input[type=checkbox]:focus:checked + .tick:before, label.tick-box input[type=checkbox]:hover:not([disabled]):checked + .tick:before, label.tick-box input[type=checkbox]:active:checked + .tick:before {
1937
+ top: 1px;
1938
+ opacity: 1;
1939
+ -webkit-transform: scale(0.5) rotate(-50deg);
1940
+ transform: scale(0.5) rotate(-50deg);
1941
+ border-color: #0076ca; }
1942
+
1943
+ .check-switch {
1944
+ cursor: pointer;
1945
+ -webkit-box-orient: horizontal;
1946
+ -webkit-box-direction: normal;
1947
+ -ms-flex-direction: row;
1948
+ flex-direction: row;
1949
+ -webkit-box-align: center;
1950
+ -ms-flex-align: center;
1951
+ align-items: center; }
1952
+ .check-switch .label-text {
1953
+ margin-right: 10px;
1954
+ padding-bottom: 0;
1955
+ line-height: 1.5em; }
1956
+ .check-switch-label {
1957
+ position: absolute;
1958
+ color: transparent;
1959
+ font-size: 0; }
1960
+ .check-switch-panel {
1961
+ width: 40px;
1962
+ height: 22px;
1963
+ background: rgba(15, 33, 46, 0.1);
1964
+ position: relative;
1965
+ border-radius: 22px;
1966
+ -webkit-transition-property: background, box-shadow, border-color;
1967
+ transition-property: background, box-shadow, border-color;
1968
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1) inset, 0 0 0 transparent; }
1969
+ .check-switch-tick {
1970
+ width: 18px;
1971
+ height: 18px;
1972
+ background: #fff;
1973
+ position: absolute;
1974
+ bottom: 2px;
1975
+ left: 2px;
1976
+ border-radius: 22px;
1977
+ -webkit-transition-property: -webkit-transform;
1978
+ transition-property: -webkit-transform;
1979
+ transition-property: transform;
1980
+ transition-property: transform, -webkit-transform;
1981
+ -webkit-transform: translate3d(0, 0, 0);
1982
+ transform: translate3d(0, 0, 0);
1983
+ box-shadow: 0 1px 4px rgba(15, 33, 46, 0.4);
1984
+ font-weight: 500; }
1985
+ .check-switch input {
1986
+ opacity: 0;
1987
+ position: absolute; }
1988
+ .check-switch input:focus ~ .check-switch-panel, .check-switch input:hover:not([disabled]) ~ .check-switch-panel, .check-switch input:active ~ .check-switch-panel {
1989
+ background: rgba(15, 33, 46, 0.2); }
1990
+ .check-switch input:focus ~ .check-switch-panel .check-switch-tick, .check-switch input:hover:not([disabled]) ~ .check-switch-panel .check-switch-tick, .check-switch input:active ~ .check-switch-panel .check-switch-tick {
1991
+ -webkit-transform: scale(1.1);
1992
+ transform: scale(1.1); }
1993
+ input:checked + .check-switch-panel .check-switch-tick {
1994
+ -webkit-transform: translate3d(18px, 0, 0);
1995
+ transform: translate3d(18px, 0, 0); }
1996
+ input:checked + .check-switch-panel {
1997
+ background: #0094fd; }
1998
+ .check-switch input:checked:focus ~ .check-switch-panel, .check-switch input:checked:hover:not([disabled]) ~ .check-switch-panel, .check-switch input:checked:active ~ .check-switch-panel {
1999
+ background: #008ef3;
2000
+ box-shadow: 0 0 0 1px #006dff inset, 0 0 0 transparent; }
2001
+ .check-switch input:checked:focus ~ .check-switch-panel .check-switch-tick, .check-switch input:checked:hover:not([disabled]) ~ .check-switch-panel .check-switch-tick, .check-switch input:checked:active ~ .check-switch-panel .check-switch-tick {
2002
+ -webkit-transform: scale(1.1) translate3d(16px, 0, 0);
2003
+ transform: scale(1.1) translate3d(16px, 0, 0); }
2004
+
2005
+ label.valid {
2006
+ color: #2ac84f; }
2007
+ label.valid input, label.valid select, label.valid textarea {
2008
+ -webkit-text-fill-color: currentColor;
2009
+ box-shadow: 0 0 0 1px #2ac84f inset, 0 0 0 transparent; }
2010
+ label.valid input:focus, label.valid input:hover:not([disabled]), label.valid input:active, label.valid select:focus, label.valid select:hover:not([disabled]), label.valid select:active, label.valid textarea:focus, label.valid textarea:hover:not([disabled]), label.valid textarea:active {
2011
+ box-shadow: 0 0 0 1px #2ac84f inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
2012
+
2013
+ label.invalid {
2014
+ color: #dd2f41; }
2015
+ label.invalid input, label.invalid select, label.invalid textarea {
2016
+ -webkit-text-fill-color: currentColor;
2017
+ box-shadow: 0 0 0 1px #dd2f41 inset, 0 0 0 transparent; }
2018
+ label.invalid input:focus, label.invalid input:hover:not([disabled]), label.invalid input:active, label.invalid select:focus, label.invalid select:hover:not([disabled]), label.invalid select:active, label.invalid textarea:focus, label.invalid textarea:hover:not([disabled]), label.invalid textarea:active {
2019
+ box-shadow: 0 0 0 1px #dd2f41 inset, 0 1px 3px rgba(15, 33, 46, 0.3); }
2020
+
2021
+ @-webkit-keyframes expand-validation {
2022
+ 0% {
2023
+ max-height: 0em; }
2643
2024
  100% {
2644
- color: #5d9cec; } }
2645
- @keyframes error-party {
2025
+ max-height: 2.5em; } }
2026
+
2027
+ @keyframes expand-validation {
2646
2028
  0% {
2647
- color: #8e55dd; }
2648
- 20% {
2649
- color: #967adc; }
2650
- 40% {
2651
- color: #fef0bd; }
2652
- 60% {
2653
- color: #d4eef7; }
2654
- 80% {
2655
- color: #82c1ed; }
2029
+ max-height: 0em; }
2656
2030
  100% {
2657
- color: #5d9cec; } }
2658
- @-webkit-keyframes fade-in-slowly {
2031
+ max-height: 2.5em; } }
2032
+ @-webkit-keyframes scale-fade-in {
2659
2033
  0% {
2660
- opacity: 0; }
2661
- 80% {
2662
- opacity: 0; }
2034
+ opacity: 0;
2035
+ -webkit-transform: translate(-50%, -6px) scale(0.5);
2036
+ transform: translate(-50%, -6px) scale(0.5); }
2663
2037
  100% {
2664
- opacity: 1; } }
2665
- @keyframes fade-in-slowly {
2038
+ opacity: 1;
2039
+ -webkit-transform: translate(-50%, 6px) scale(1);
2040
+ transform: translate(-50%, 6px) scale(1); } }
2041
+ @keyframes scale-fade-in {
2666
2042
  0% {
2667
- opacity: 0; }
2668
- 80% {
2669
- opacity: 0; }
2043
+ opacity: 0;
2044
+ -webkit-transform: translate(-50%, -6px) scale(0.5);
2045
+ transform: translate(-50%, -6px) scale(0.5); }
2670
2046
  100% {
2671
- opacity: 1; } }
2672
- @-webkit-keyframes zbounce {
2673
- 0%, 100% {
2674
- -webkit-transform: scale(0.95, 0.95);
2675
- transform: scale(0.95, 0.95); }
2676
- 50% {
2677
- -webkit-transform: scale(1, 1);
2678
- transform: scale(1, 1); } }
2679
- @keyframes zbounce {
2680
- 0%, 100% {
2681
- -webkit-transform: scale(0.95, 0.95);
2682
- transform: scale(0.95, 0.95); }
2683
- 50% {
2684
- -webkit-transform: scale(1, 1);
2685
- transform: scale(1, 1); } }
2047
+ opacity: 1;
2048
+ -webkit-transform: translate(-50%, 6px) scale(1);
2049
+ transform: translate(-50%, 6px) scale(1); } }
2050
+ .validation-message {
2051
+ overflow: hidden;
2052
+ display: block;
2053
+ z-index: 3;
2054
+ -webkit-animation: expand-validation 0.25s cubic-bezier(0.4, 0, 0.2, 1);
2055
+ animation: expand-validation 0.25s cubic-bezier(0.4, 0, 0.2, 1);
2056
+ position: relative;
2057
+ top: -1px; }
2058
+ .validation-message .validation-message-text {
2059
+ margin: 0;
2060
+ display: block;
2061
+ padding: .8em .8em;
2062
+ border-radius: 0 0 3px 3px;
2063
+ color: #fff;
2064
+ font-size: 12px;
2065
+ line-height: 1em;
2066
+ background: #8c9ba5; }
2067
+ .invalid .validation-message .validation-message-text {
2068
+ background: #dd2f41; }
2069
+
2070
+ .empty-label[data-slider-label] {
2071
+ display: none; }
2072
+
2073
+ input[type=range] {
2074
+ -webkit-appearance: none;
2075
+ -moz-appearance: none;
2076
+ width: 100%;
2077
+ margin: 0;
2078
+ cursor: pointer;
2079
+ position: relative;
2080
+ z-index: 4;
2081
+ height: 16px;
2082
+ background: transparent; }
2083
+ input[type=range]:focus {
2084
+ outline: none; }
2085
+ input[type=range]::-webkit-slider-thumb {
2086
+ -webkit-appearance: none; }
2087
+ input[type=range]::-moz-slider-thumb {
2088
+ -moz-appearance: none; }
2089
+ input[type=range]::-ms-track {
2090
+ width: 100%;
2091
+ cursor: pointer;
2092
+ background: transparent;
2093
+ border-color: transparent;
2094
+ color: transparent; }
2095
+ input[type=range]::-moz-focus-outer {
2096
+ border: 0; }
2097
+ input[type=range]::-moz-range-track {
2098
+ border: inherit;
2099
+ background: transparent; }
2100
+ input[type=range]::-moz-range-thumb {
2101
+ box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
2102
+ border: 6px solid #fff;
2103
+ background: rgba(15, 33, 46, 0.2);
2104
+ box-sizing: border-box;
2105
+ height: 19px;
2106
+ width: 19px;
2107
+ border-radius: 100%;
2108
+ position: relative;
2109
+ top: 3px;
2110
+ -webkit-transition: all .15s ease-in;
2111
+ transition: all .15s ease-in; }
2112
+ input[type=range]::-moz-range-thumb:after {
2113
+ box-sizing: border-box;
2114
+ content: "";
2115
+ position: absolute;
2116
+ left: -15px;
2117
+ right: -15px;
2118
+ top: -15px;
2119
+ bottom: -15px; }
2120
+ input[type=range]::-moz-range-thumb:active {
2121
+ background: #5aaafa;
2122
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2123
+ input[type=range]::-webkit-slider-thumb {
2124
+ box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
2125
+ border: 6px solid #fff;
2126
+ background: rgba(15, 33, 46, 0.2);
2127
+ box-sizing: border-box;
2128
+ height: 19px;
2129
+ width: 19px;
2130
+ border-radius: 100%;
2131
+ position: relative;
2132
+ top: 3px;
2133
+ -webkit-transition: all .15s ease-in;
2134
+ transition: all .15s ease-in; }
2135
+ input[type=range]::-webkit-slider-thumb:after {
2136
+ box-sizing: border-box;
2137
+ content: "";
2138
+ position: absolute;
2139
+ left: -15px;
2140
+ right: -15px;
2141
+ top: -15px;
2142
+ bottom: -15px; }
2143
+ input[type=range]::-webkit-slider-thumb:active {
2144
+ background: #5aaafa;
2145
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2146
+ input[type=range]::-ms-thumb {
2147
+ box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.4) 0 1px 1px inset;
2148
+ border: 6px solid #fff;
2149
+ background: rgba(15, 33, 46, 0.2);
2150
+ box-sizing: border-box;
2151
+ height: 19px;
2152
+ width: 19px;
2153
+ border-radius: 100%;
2154
+ position: relative;
2155
+ top: 3px;
2156
+ -webkit-transition: all .15s ease-in;
2157
+ transition: all .15s ease-in; }
2158
+ input[type=range]::-ms-thumb:after {
2159
+ box-sizing: border-box;
2160
+ content: "";
2161
+ position: absolute;
2162
+ left: -15px;
2163
+ right: -15px;
2164
+ top: -15px;
2165
+ bottom: -15px; }
2166
+ input[type=range]::-ms-thumb:active {
2167
+ background: #5aaafa;
2168
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2169
+ input[type=range]:focus::-moz-range-thumb {
2170
+ background: #5aaafa;
2171
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2172
+ input[type=range]:focus::-webkit-slider-thumb {
2173
+ background: #5aaafa;
2174
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2175
+ input[type=range]:focus::-ms-thumb {
2176
+ background: #5aaafa;
2177
+ box-shadow: 0 0 2px 2px #5aaafa, rgba(0, 0, 0, 0.4) 0 1px 1px inset; }
2178
+ input[type=range]:after {
2179
+ position: absolute;
2180
+ content: "";
2181
+ left: 0px;
2182
+ right: 0px;
2183
+ top: 6px;
2184
+ height: 5px;
2185
+ background: #f5f7fa;
2186
+ z-index: -1;
2187
+ border-radius: 4px;
2188
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
2189
+ input[type=range]::-moz-slider-track {
2190
+ height: 16px;
2191
+ background: transparent; }
2192
+ input[type=range]::-moz-slider-track:after {
2193
+ position: absolute;
2194
+ content: "";
2195
+ left: 0px;
2196
+ right: 0px;
2197
+ top: 6px;
2198
+ height: 5px;
2199
+ background: #f5f7fa;
2200
+ z-index: -1;
2201
+ border-radius: 4px;
2202
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
2203
+ input[type=range]::-ms-track {
2204
+ height: 16px;
2205
+ background: transparent; }
2206
+ input[type=range]::-ms-track:after {
2207
+ position: absolute;
2208
+ content: "";
2209
+ left: 0px;
2210
+ right: 0px;
2211
+ top: 6px;
2212
+ height: 5px;
2213
+ background: #f5f7fa;
2214
+ z-index: -1;
2215
+ border-radius: 4px;
2216
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px; }
2217
+ input[type=range].slider-input {
2218
+ margin: 0; }
2219
+ input[type=range].slider-input:after {
2220
+ display: none; }
2221
+ input[type=range].slider-input::-moz-slider-track:after {
2222
+ display: none; }
2223
+ input[type=range].slider-input::-ms-track:after {
2224
+ display: none; }
2225
+
2226
+ input::-moz-focus-inner {
2227
+ border: 0; }
2228
+
2229
+ .slider-container {
2230
+ position: relative;
2231
+ padding: .5em 0; }
2232
+ @media all and (min-width: 400px) {
2233
+ .slider-container {
2234
+ display: -webkit-box;
2235
+ display: -ms-flexbox;
2236
+ display: flex;
2237
+ -webkit-box-orient: horizontal;
2238
+ -webkit-box-direction: normal;
2239
+ -ms-flex-flow: row nowrap;
2240
+ flex-flow: row nowrap;
2241
+ -webkit-box-align: center;
2242
+ -ms-flex-align: center;
2243
+ align-items: center; }
2244
+ .slider-container.with-label {
2245
+ max-width: 320px; } }
2246
+ .slider-container.line-labels {
2247
+ padding: vr(1) 0 0; }
2248
+
2249
+ .slider-input-container {
2250
+ position: relative;
2251
+ -webkit-box-flex: 1;
2252
+ -ms-flex: 1 0 auto;
2253
+ flex: 1 0 auto;
2254
+ /*margin: .6em 0;*/ }
2255
+
2256
+ .slider-track {
2257
+ height: 0px;
2258
+ display: -webkit-box;
2259
+ display: -ms-flexbox;
2260
+ display: flex;
2261
+ -webkit-box-align: center;
2262
+ -ms-flex-align: center;
2263
+ align-items: center;
2264
+ -webkit-box-orient: horizontal;
2265
+ -webkit-box-direction: normal;
2266
+ -ms-flex-flow: row wrap;
2267
+ flex-flow: row wrap;
2268
+ -webkit-box-pack: justify;
2269
+ -ms-flex-pack: justify;
2270
+ justify-content: space-between;
2271
+ margin: 0 10px 0 9px;
2272
+ position: relative;
2273
+ top: -12px; }
2274
+
2275
+ .slider-segment {
2276
+ position: relative; }
2277
+
2278
+ .slider-segment-mark:before, .slider-segment-mark:after {
2279
+ position: absolute;
2280
+ content: "";
2281
+ width: 13px;
2282
+ height: 13px;
2283
+ top: -4px;
2284
+ left: -6px;
2285
+ box-sizing: border-box;
2286
+ border-radius: 100%; }
2287
+ .slider-segment-mark:before {
2288
+ background: #fff;
2289
+ border: #f5f7fa 3px solid;
2290
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px inset;
2291
+ z-index: 3; }
2292
+ .slider-segment-mark:after {
2293
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
2294
+ z-index: 0; }
2295
+
2296
+ .slider-fills {
2297
+ position: absolute;
2298
+ left: 10px;
2299
+ right: 10px;
2300
+ top: 9px;
2301
+ height: 5px;
2302
+ z-index: 1;
2303
+ display: -webkit-box;
2304
+ display: -ms-flexbox;
2305
+ display: flex;
2306
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
2307
+ border-radius: 5px; }
2308
+
2309
+ .slider-fill {
2310
+ -webkit-box-flex: 1;
2311
+ -ms-flex-positive: 1;
2312
+ flex-grow: 1;
2313
+ height: 5px;
2314
+ position: relative;
2315
+ box-sizing: border-box;
2316
+ background: #f5f7fa;
2317
+ border-left: 1px solid transparent;
2318
+ border-right: 1px solid rgba(15, 33, 46, 0.2); }
2319
+ .slider-fill:before {
2320
+ content: "";
2321
+ position: absolute;
2322
+ top: 0px;
2323
+ left: 0px;
2324
+ right: 0px;
2325
+ bottom: 0px;
2326
+ z-index: -1; }
2327
+ .slider-fill:first-child, .slider-fill:first-child:before {
2328
+ border-top-left-radius: 5px;
2329
+ border-bottom-left-radius: 5px; }
2330
+ .slider-fill:first-child:before {
2331
+ left: 0px; }
2332
+ .slider-fill:last-child, .slider-fill:last-child:before {
2333
+ border-top-right-radius: 5px;
2334
+ border-bottom-right-radius: 5px; }
2335
+ .slider-fill:last-child:before {
2336
+ right: 0px; }
2337
+
2338
+ .slider-input.no-segments ~ .slider-fills .slider-fill, .slider-input[max='100'] ~ .slider-fills .slider-fill {
2339
+ border-right: 0; }
2340
+
2341
+ .slider-line-label {
2342
+ position: absolute;
2343
+ white-space: nowrap;
2344
+ font-size: 12px;
2345
+ z-index: 3;
2346
+ height: 1.25;
2347
+ top: -28px;
2348
+ right: -30px;
2349
+ left: -28px;
2350
+ text-align: center; }
2351
+
2352
+ .slider-segment:first-child .slider-line-label {
2353
+ left: -9px;
2354
+ right: auto;
2355
+ text-align: left; }
2356
+ .slider-segment:first-child .slider-line-label:before {
2357
+ left: 8px; }
2358
+
2359
+ .slider-segment:last-child .slider-line-label {
2360
+ right: -11px;
2361
+ left: auto;
2362
+ text-align: right; }
2363
+ .slider-segment:last-child .slider-line-label:before {
2364
+ right: 9px; }
2365
+
2366
+ .slider-label {
2367
+ background: #fff;
2368
+ border-radius: 3px;
2369
+ box-shadow: rgba(15, 33, 46, 0.2) 0 0 0 1px;
2370
+ font-size: 14px;
2371
+ padding: 4px 8px;
2372
+ position: relative;
2373
+ text-align: center; }
2374
+ @media all and (min-width: 400px) {
2375
+ .slider-label {
2376
+ white-space: nowrap;
2377
+ position: absolute;
2378
+ top: 50%;
2379
+ -webkit-transform: translatey(-50%);
2380
+ transform: translatey(-50%);
2381
+ -webkit-transform-style: preserve-3d;
2382
+ transform-style: preserve-3d; }
2383
+ .slider-label:after, .slider-label:before {
2384
+ content: ""; } }
2385
+ .slider-label:after, .slider-label:before {
2386
+ position: absolute;
2387
+ width: 0;
2388
+ height: 0;
2389
+ top: 50%;
2390
+ -webkit-transform: translatey(-50%);
2391
+ transform: translatey(-50%);
2392
+ -webkit-transform-style: preserve-3d;
2393
+ transform-style: preserve-3d;
2394
+ border-top: 7px solid transparent;
2395
+ border-bottom: 7px solid transparent; }
2396
+ .slider-label > * + *:before {
2397
+ content: " — "; }
2398
+ @media all and (min-width: 400px) {
2399
+ .slider-label > * + * {
2400
+ display: block; }
2401
+ .slider-label > * + *:before {
2402
+ content: ""; } }
2403
+ .slider-label [class*=big] {
2404
+ font-size: 1.15em; }
2405
+ .slider-label [class*=small] {
2406
+ font-size: .8em; }
2407
+
2408
+ [data-slider-label]:after {
2409
+ content: attr(data-after); }
2410
+ [data-slider-label]:before {
2411
+ content: attr(data-before); }
2412
+
2413
+ @media all and (min-width: 400px) {
2414
+ .slider-label.align-right {
2415
+ margin-left: 10px;
2416
+ left: 100%;
2417
+ text-align: left; } }
2418
+ .slider-label.align-right:before, .slider-label.align-right:after {
2419
+ left: -7px;
2420
+ border-right: 7px solid rgba(15, 33, 46, 0.2); }
2421
+ .slider-label.align-right:after {
2422
+ border-right-color: #fff;
2423
+ left: -6px; }
2424
+
2425
+ @media all and (min-width: 400px) {
2426
+ .slider-label.align-left {
2427
+ margin-right: 10px;
2428
+ right: 100%;
2429
+ text-align: right; } }
2430
+ .slider-label.align-left:before, .slider-label.align-left:after {
2431
+ right: -7px;
2432
+ border-top: 7px solid transparent;
2433
+ border-left: 7px solid rgba(15, 33, 46, 0.2);
2434
+ border-bottom: 7px solid transparent; }
2435
+ .slider-label.align-left:after {
2436
+ border-left-color: #fff;
2437
+ right: -6px; }
2438
+
2439
+ .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled {
2440
+ background: #5aaafa;
2441
+ border-right-color: #1f8bf8; }
2442
+ .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled:first-child {
2443
+ border-left-color: #1f8bf8; }
2444
+ .slider-input.fill ~ .slider-fills .slider-fill[data-index].filled:before {
2445
+ box-shadow: #1f8bf8 0 0 0 1px; }
2446
+ .slider-input.fill ~ .slider-track .filled .slider-segment-mark[data-index]:before {
2447
+ border-color: #5aaafa;
2448
+ box-shadow: #1f8bf8 0 0 0 1px inset; }
2449
+ .slider-input.fill ~ .slider-track .filled .slider-segment-mark[data-index]:after {
2450
+ box-shadow: #1f8bf8 0 0 0 1px; }
2451
+
2452
+ /* ========================================================================== *
2453
+ * Tables module
2454
+ * -------------------------------------------------------------------------- */
2455
+ /* ===================================== *
2456
+ * Common
2457
+ * ------------------------------------- */
2458
+ table {
2459
+ vertical-align: top;
2460
+ border-spacing: 0; }
2461
+
2462
+ th, td {
2463
+ padding: 8px;
2464
+ text-align: left;
2465
+ background: #fff; }
2466
+ th.action-panel, td.action-panel {
2467
+ min-width: 120px;
2468
+ text-align: right;
2469
+ white-space: nowrap; }
2470
+
2471
+ caption {
2472
+ display: none; }
2473
+
2474
+ table.ruled tfoot th, table.ruled tbody tr:nth-child(n+2) th, table.ruled tbody tr:nth-child(n+2) td {
2475
+ border-top: 1px solid #dfe3e6; }
2476
+ table.ruled thead th {
2477
+ border-bottom: 1px solid #dfe3e6; }
2478
+
2479
+ table.outlined, table.doc-table {
2480
+ border-collapse: collapse; }
2481
+ table.outlined td, table.outlined th, table.doc-table td, table.doc-table th {
2482
+ border: 1px solid #dfe3e6; }
2483
+
2484
+ table.striped tbody tr:nth-child(2n+1) th, table.striped tbody tr:nth-child(2n+1) td {
2485
+ background: #f0f3f6; }
2486
+
2487
+ table.stretched, table.doc-table {
2488
+ table-layout: fixed;
2489
+ min-width: 100%; }
2490
+
2491
+ table.filled {
2492
+ width: 100%; }
2493
+ table.filled th:not(:last-child), table.filled td:not(:last-child) {
2494
+ white-space: nowrap; }
2495
+ table.filled th:last-child, table.filled td:last-child {
2496
+ width: 99%; }
2497
+
2498
+ /* ========================================================================== *
2499
+ * Buttons module
2500
+ * -------------------------------------------------------------------------- */
2501
+ /* ===================================== *
2502
+ * Common
2503
+ * ------------------------------------- */
2504
+ .button {
2505
+ display: -webkit-inline-box;
2506
+ display: -ms-inline-flexbox;
2507
+ display: inline-flex;
2508
+ -webkit-box-align: center;
2509
+ -ms-flex-align: center;
2510
+ align-items: center;
2511
+ -webkit-box-pack: center;
2512
+ -ms-flex-pack: center;
2513
+ justify-content: center;
2514
+ width: auto;
2515
+ line-height: 1;
2516
+ font-size: 14px;
2517
+ white-space: nowrap;
2518
+ font-weight: 500;
2519
+ text-align: center;
2520
+ text-decoration: none;
2521
+ border: 0;
2522
+ padding: 8px 12px;
2523
+ background: #fff;
2524
+ border-radius: 3px;
2525
+ -webkit-transition: color 0.25s, background 0.25s, box-shadow 0.25s;
2526
+ transition: color 0.25s, background 0.25s, box-shadow 0.25s; }
2527
+ .button.large {
2528
+ padding: 12px 15px; }
2529
+ .button, .button:visited {
2530
+ color: inherit;
2531
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1), 0 1px 3px rgba(15, 33, 46, 0.15); }
2532
+ .button:hover, .button:focus, .button:active {
2533
+ color: #0094fd;
2534
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.2), 0 1px 3px rgba(15, 33, 46, 0.25); }
2535
+ .button.destructive, .button.destructive:visited {
2536
+ color: #dd2f41; }
2537
+ .button.destructive:hover, .button.destructive:focus, .button.destructive:active {
2538
+ color: #A81C27; }
2539
+ .button.primary, .button.primary:visited {
2540
+ color: #fff;
2541
+ background: #0094fd;
2542
+ box-shadow: 0 0 0 1px #0085e4, 0 1px 3px rgba(15, 33, 46, 0.15); }
2543
+ .button.primary:hover, .button.primary:focus, .button.primary:active {
2544
+ color: #fff;
2545
+ background: #006dff;
2546
+ box-shadow: 0 0 0 1px #006dff, 0 1px 3px rgba(15, 33, 46, 0.15); }
2547
+ .button.primary.destructive, .button.primary.destructive:visited {
2548
+ color: #fff;
2549
+ background: #dd2f41;
2550
+ box-shadow: 0 0 0 1px #d02234, 0 1px 3px rgba(15, 33, 46, 0.15); }
2551
+ .button.primary.destructive:hover, .button.primary.destructive:focus, .button.primary.destructive:active {
2552
+ color: #fff;
2553
+ background: #A81C27;
2554
+ box-shadow: 0 0 0 1px #A81C27, 0 1px 3px rgba(15, 33, 46, 0.15); }
2555
+ .button[disabled] {
2556
+ color: #d6dde7 !important;
2557
+ background: #f7fafb !important;
2558
+ cursor: not-allowed !important;
2559
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.1), 0 1px 3px rgba(15, 33, 46, 0.15) !important; }
2560
+
2561
+ .button-group {
2562
+ display: -webkit-box;
2563
+ display: -ms-flexbox;
2564
+ display: flex;
2565
+ -webkit-box-align: start;
2566
+ -ms-flex-align: start;
2567
+ align-items: flex-start; }
2568
+ .button-group .button + .button {
2569
+ margin: 0; }
2570
+ .button-group .button:not(:first-child):not(:last-child) {
2571
+ border-radius: 0; }
2572
+ .button-group .button:first-child {
2573
+ border-radius: 3px 0 0 3px; }
2574
+ .button-group .button:last-child {
2575
+ border-radius: 0 3px 3px 0; }
2576
+
2577
+ /* ========================================================================== *
2578
+ * Badges module
2579
+ * -------------------------------------------------------------------------- */
2580
+ /* ===================================== *
2581
+ * Common
2582
+ * ------------------------------------- */
2583
+ .badge {
2584
+ display: -webkit-inline-box;
2585
+ display: -ms-inline-flexbox;
2586
+ display: inline-flex;
2587
+ -webkit-box-align: center;
2588
+ -ms-flex-align: center;
2589
+ align-items: center;
2590
+ border-radius: 50%;
2591
+ width: 26px;
2592
+ height: 26px;
2593
+ text-align: center;
2594
+ -webkit-box-pack: center;
2595
+ -ms-flex-pack: center;
2596
+ justify-content: center;
2597
+ color: #fff;
2598
+ background: #2ac84f;
2599
+ font-weight: 700;
2600
+ margin: 0 2px; }
2601
+
2602
+ /* ========================================================================== *
2603
+ * Card module
2604
+ * -------------------------------------------------------------------------- */
2605
+ .card {
2606
+ background: #fff;
2607
+ display: -webkit-box;
2608
+ display: -ms-flexbox;
2609
+ display: flex;
2610
+ -webkit-box-orient: vertical;
2611
+ -webkit-box-direction: normal;
2612
+ -ms-flex-direction: column;
2613
+ flex-direction: column;
2614
+ position: relative;
2615
+ padding: 20px; }
2616
+ .card > *:last-child, .card > *:last-child > *:last-child, .card > *:last-child > *:last-child > *:last-child {
2617
+ margin-bottom: 0; }
2618
+ .card-actions {
2619
+ display: -webkit-box;
2620
+ display: -ms-flexbox;
2621
+ display: flex;
2622
+ -webkit-box-align: baseline;
2623
+ -ms-flex-align: baseline;
2624
+ align-items: baseline;
2625
+ margin-bottom: 20px;
2626
+ -webkit-box-orient: horizontal;
2627
+ -webkit-box-direction: reverse;
2628
+ -ms-flex-direction: row-reverse;
2629
+ flex-direction: row-reverse; }
2630
+ .card-actions.centered {
2631
+ -webkit-box-pack: center;
2632
+ -ms-flex-pack: center;
2633
+ justify-content: center; }
2634
+ .card-actions a, .card-actions .button {
2635
+ margin-left: 10px; }
2636
+ .card p, .card ul, .card ol, .card h1, .card h2, .card h3, .card h4, .card h5, .card h6, .card pre, .card table, .card .card {
2637
+ margin-bottom: 20px; }
2638
+ .card:not([class*='columns']) {
2639
+ border-radius: 3px;
2640
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.05), 0 1px 3px rgba(15, 33, 46, 0.15); }
2641
+ .card[class*='columns'] {
2642
+ position: relative;
2643
+ z-index: 1;
2644
+ -webkit-box-orient: horizontal;
2645
+ -webkit-box-direction: normal;
2646
+ -ms-flex-direction: row;
2647
+ flex-direction: row; }
2648
+ .card[class*='columns']:before {
2649
+ content: '';
2650
+ border-radius: 3px;
2651
+ box-shadow: 0 0 0 1px rgba(15, 33, 46, 0.05), 0 1px 3px rgba(15, 33, 46, 0.15);
2652
+ position: absolute;
2653
+ z-index: -1;
2654
+ left: 0;
2655
+ top: 0;
2656
+ right: 0;
2657
+ bottom: 0; }
2658
+ .card-heading {
2659
+ font-size: 16px;
2660
+ -webkit-box-align: top;
2661
+ -ms-flex-align: top;
2662
+ align-items: top; }
2663
+ .card-header, .card-footer {
2664
+ display: -webkit-box;
2665
+ display: -ms-flexbox;
2666
+ display: flex; }
2667
+ .card-header .card-actions, .card-footer .card-actions {
2668
+ margin-bottom: 0;
2669
+ margin-left: auto; }
2670
+ .card-description {
2671
+ font-size: 12px; }
2672
+ .card-well {
2673
+ padding: 20px;
2674
+ margin: 10px 0; }
2675
+ .card-footer {
2676
+ display: -webkit-box;
2677
+ display: -ms-flexbox;
2678
+ display: flex;
2679
+ -webkit-box-align: baseline;
2680
+ -ms-flex-align: baseline;
2681
+ align-items: baseline;
2682
+ font-size: 12px;
2683
+ padding: 20px;
2684
+ background: #f7fafb;
2685
+ border-radius: 0 0 3px 3px;
2686
+ box-shadow: 0 1px rgba(15, 33, 46, 0.1) inset;
2687
+ background-clip: padding-box; }
2688
+ .card-footer > *:last-child, .card-footer > *:last-child > *:last-child, .card-footer > *:last-child > *:last-child > *:last-child {
2689
+ margin-bottom: 0; }
2690
+ .card-footer p, .card-footer ul, .card-footer ol, .card-footer h1, .card-footer h2, .card-footer h3, .card-footer h4, .card-footer h5, .card-footer h6, .card-footer pre, .card-footer table, .card-footer .card {
2691
+ margin-bottom: 0; }
2692
+ .card > .card-footer:last-child, .card > *:last-child > .card-footer:last-child, .card > *:last-child > *:last-child > .card-footer:last-child {
2693
+ margin: auto -20px -20px -20px; }
2694
+
2695
+ table.card {
2696
+ display: table; }
2697
+
2698
+ .has-tooltip:hover {
2699
+ position: relative; }
2700
+ .has-tooltip:hover:before, .has-tooltip:hover:after {
2701
+ opacity: 0;
2702
+ position: absolute;
2703
+ left: 50%;
2704
+ -webkit-transform: translate3d(-50%, 0, 0);
2705
+ transform: translate3d(-50%, 0, 0);
2706
+ z-index: 100000;
2707
+ pointer-events: none; }
2708
+ .has-tooltip:hover:after {
2709
+ -webkit-font-smoothing: subpixel-antialiased;
2710
+ top: calc(100% + 6px);
2711
+ -webkit-transform: translateX(-50%);
2712
+ transform: translateX(-50%);
2713
+ background: rgba(0, 0, 0, 0.8);
2714
+ display: inline-block;
2715
+ color: #fff;
2716
+ white-space: nowrap;
2717
+ font-size: 11px;
2718
+ line-height: 1.5em;
2719
+ padding: 5px 8px;
2720
+ border-radius: 3px; }
2721
+ .has-tooltip:hover:before {
2722
+ top: 100%;
2723
+ border-bottom: 6px solid rgba(0, 0, 0, 0.8);
2724
+ border-left: 6px solid transparent;
2725
+ border-right: 6px solid transparent;
2726
+ height: 0;
2727
+ width: 0; }
2728
+ .has-tooltip:hover:hover:after, .has-tooltip:hover:focus:after {
2729
+ content: attr(aria-label); }
2730
+ .has-tooltip:hover:hover:before, .has-tooltip:hover:focus:before {
2731
+ content: ""; }
2732
+ .has-tooltip:hover:hover:before, .has-tooltip:hover:hover:after, .has-tooltip:hover:focus:before, .has-tooltip:hover:focus:after {
2733
+ -webkit-animation: fade-in .1s ease-in;
2734
+ animation: fade-in .1s ease-in;
2735
+ -webkit-animation-fill-mode: forwards;
2736
+ animation-fill-mode: forwards;
2737
+ -webkit-animation-delay: .4s;
2738
+ animation-delay: .4s; }