nizongfeng
/
zzcx_line
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
2 Commits
1 Branch
17 MiB
 
 
 
 
Tree: aa52171df8
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'aa52171df8'
${ noResults }
zzcx_line/coding/css/sweetalert2.css

727 lines
19 KiB
Raw Blame History 

  1. body.swal2-in {

  2.   overflow-y: hidden; }

  3. 

  4. body.swal2-iosfix {

  5.   position: fixed;

  6.   left: 0;

  7.   right: 0; }

  8. 

  9. .swal2-container {

  10.   display: -webkit-box;

  11.   display: -ms-flexbox;

  12.   display: flex;

  13.   -webkit-box-align: center;

  14.       -ms-flex-align: center;

  15.           align-items: center;

  16.   position: fixed;

  17.   top: 0;

  18.   left: 0;

  19.   bottom: 0;

  20.   right: 0;

  21.   padding: 10px;

  22.   background-color: transparent;

  23.   z-index: 1060; }

  24.   .swal2-container:not(.swal2-in) {

  25.     pointer-events: none; }

  26.   .swal2-container.swal2-fade {

  27.     -webkit-transition: background-color .1s;

  28.     transition: background-color .1s; }

  29.   .swal2-container.swal2-in {

  30.     background-color: rgba(0, 0, 0, 0.4); }

  31. 

  32. .swal2-modal {

  33.   background-color: #fff;

  34.   font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  35.   border-radius: 5px;

  36.   box-sizing: border-box;

  37.   text-align: center;

  38.   margin: auto;

  39.   overflow-x: hidden;

  40.   overflow-y: auto;

  41.   display: none;

  42.   position: relative; }

  43.   .swal2-modal:focus {

  44.     outline: none; }

  45.   .swal2-modal.swal2-loading {

  46.     overflow-y: hidden; }

  47.   .swal2-modal .swal2-title {

  48.     color: #595959;

  49.     font-size: 30px;

  50.     text-align: center;

  51.     font-weight: 600;

  52.     text-transform: none;

  53.     position: relative;

  54.     margin: 0;

  55.     padding: 0;

  56.     line-height: 60px;

  57.     display: block; }

  58.   .swal2-modal .swal2-spacer {

  59.     height: 10px;

  60.     color: transparent;

  61.     border: 0; }

  62.   .swal2-modal .swal2-styled {

  63.     border: 0;

  64.     border-radius: 3px;

  65.     box-shadow: none;

  66.     color: #fff;

  67.     cursor: pointer;

  68.     font-size: 17px;

  69.     font-weight: 500;

  70.     margin: 0 5px;

  71.     padding: 10px 32px; }

  72.     .swal2-modal .swal2-styled:not(.swal2-loading)[disabled] {

  73.       opacity: .4;

  74.       cursor: no-drop; }

  75.     .swal2-modal .swal2-styled.swal2-loading {

  76.       box-sizing: border-box;

  77.       border: 4px solid transparent;

  78.       border-color: transparent;

  79.       width: 40px;

  80.       height: 40px;

  81.       padding: 0;

  82.       margin: -2px 30px;

  83.       vertical-align: top;

  84.       background-color: transparent !important;

  85.       color: transparent;

  86.       cursor: default;

  87.       border-radius: 100%;

  88.       -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;

  89.               animation: rotate-loading 1.5s linear 0s infinite normal;

  90.       -webkit-user-select: none;

  91.          -moz-user-select: none;

  92.           -ms-user-select: none;

  93.               user-select: none; }

  94.   .swal2-modal :not(.swal2-styled).swal2-loading::after {

  95.     display: inline-block;

  96.     content: '';

  97.     margin-left: 5px;

  98.     vertical-align: -1px;

  99.     height: 6px;

  100.     width: 6px;

  101.     border: 3px solid #999999;

  102.     border-right-color: transparent;

  103.     border-radius: 50%;

  104.     -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;

  105.             animation: rotate-loading 1.5s linear 0s infinite normal; }

  106.   .swal2-modal .swal2-image {

  107.     margin: 20px auto;

  108.     max-width: 100%; }

  109.   .swal2-modal .swal2-close {

  110.     font-size: 36px;

  111.     line-height: 36px;

  112.     font-family: serif;

  113.     position: absolute;

  114.     top: 5px;

  115.     right: 13px;

  116.     cursor: pointer;

  117.     color: #cccccc;

  118.     -webkit-transition: color .1s ease;

  119.     transition: color .1s ease; }

  120.     .swal2-modal .swal2-close:hover {

  121.       color: #d55; }

  122.   .swal2-modal > .swal2-input,

  123.   .swal2-modal > .swal2-file,

  124.   .swal2-modal > .swal2-textarea,

  125.   .swal2-modal > .swal2-select,

  126.   .swal2-modal > .swal2-radio,

  127.   .swal2-modal > .swal2-checkbox {

  128.     display: none; }

  129.   .swal2-modal .swal2-content {

  130.     font-size: 18px;

  131.     text-align: center;

  132.     font-weight: 300;

  133.     position: relative;

  134.     float: none;

  135.     margin: 0;

  136.     padding: 0;

  137.     line-height: normal;

  138.     color: #545454; }

  139.   .swal2-modal .swal2-input,

  140.   .swal2-modal .swal2-file,

  141.   .swal2-modal .swal2-textarea,

  142.   .swal2-modal .swal2-select,

  143.   .swal2-modal .swal2-radio,

  144.   .swal2-modal .swal2-checkbox {

  145.     margin: 20px auto; }

  146.   .swal2-modal .swal2-input,

  147.   .swal2-modal .swal2-file,

  148.   .swal2-modal .swal2-textarea {

  149.     width: 100%;

  150.     box-sizing: border-box;

  151.     border-radius: 3px;

  152.     border: 1px solid #d9d9d9;

  153.     font-size: 18px;

  154.     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06);

  155.     -webkit-transition: border-color box-shadow .3s;

  156.     transition: border-color box-shadow .3s; }

  157.     .swal2-modal .swal2-input.swal2-inputerror,

  158.     .swal2-modal .swal2-file.swal2-inputerror,

  159.     .swal2-modal .swal2-textarea.swal2-inputerror {

  160.       border-color: #f06e57; }

  161.     .swal2-modal .swal2-input:focus,

  162.     .swal2-modal .swal2-file:focus,

  163.     .swal2-modal .swal2-textarea:focus {

  164.       outline: none;

  165.       box-shadow: 0 0 3px #c4e6f5;

  166.       border: 1px solid #b4dbed; }

  167.       .swal2-modal .swal2-input:focus::-webkit-input-placeholder,

  168.       .swal2-modal .swal2-file:focus::-webkit-input-placeholder,

  169.       .swal2-modal .swal2-textarea:focus::-webkit-input-placeholder {

  170.         -webkit-transition: opacity .3s .03s ease;

  171.         transition: opacity .3s .03s ease;

  172.         opacity: .8; }

  173.       .swal2-modal .swal2-input:focus::-moz-placeholder,

  174.       .swal2-modal .swal2-file:focus::-moz-placeholder,

  175.       .swal2-modal .swal2-textarea:focus::-moz-placeholder {

  176.         -webkit-transition: opacity .3s .03s ease;

  177.         transition: opacity .3s .03s ease;

  178.         opacity: .8; }

  179.       .swal2-modal .swal2-input:focus:-ms-input-placeholder,

  180.       .swal2-modal .swal2-file:focus:-ms-input-placeholder,

  181.       .swal2-modal .swal2-textarea:focus:-ms-input-placeholder {

  182.         -webkit-transition: opacity .3s .03s ease;

  183.         transition: opacity .3s .03s ease;

  184.         opacity: .8; }

  185.       .swal2-modal .swal2-input:focus::placeholder,

  186.       .swal2-modal .swal2-file:focus::placeholder,

  187.       .swal2-modal .swal2-textarea:focus::placeholder {

  188.         -webkit-transition: opacity .3s .03s ease;

  189.         transition: opacity .3s .03s ease;

  190.         opacity: .8; }

  191.     .swal2-modal .swal2-input::-webkit-input-placeholder,

  192.     .swal2-modal .swal2-file::-webkit-input-placeholder,

  193.     .swal2-modal .swal2-textarea::-webkit-input-placeholder {

  194.       color: #e6e6e6; }

  195.     .swal2-modal .swal2-input::-moz-placeholder,

  196.     .swal2-modal .swal2-file::-moz-placeholder,

  197.     .swal2-modal .swal2-textarea::-moz-placeholder {

  198.       color: #e6e6e6; }

  199.     .swal2-modal .swal2-input:-ms-input-placeholder,

  200.     .swal2-modal .swal2-file:-ms-input-placeholder,

  201.     .swal2-modal .swal2-textarea:-ms-input-placeholder {

  202.       color: #e6e6e6; }

  203.     .swal2-modal .swal2-input::placeholder,

  204.     .swal2-modal .swal2-file::placeholder,

  205.     .swal2-modal .swal2-textarea::placeholder {

  206.       color: #e6e6e6; }

  207.   .swal2-modal .swal2-range input {

  208.     float: left;

  209.     width: 80%; }

  210.   .swal2-modal .swal2-range output {

  211.     float: right;

  212.     width: 20%;

  213.     font-size: 20px;

  214.     font-weight: 600;

  215.     text-align: center; }

  216.   .swal2-modal .swal2-range input,

  217.   .swal2-modal .swal2-range output {

  218.     height: 43px;

  219.     line-height: 43px;

  220.     vertical-align: middle;

  221.     margin: 20px auto;

  222.     padding: 0; }

  223.   .swal2-modal .swal2-input {

  224.     height: 43px;

  225.     padding: 0 12px; }

  226.     .swal2-modal .swal2-input[type='number'] {

  227.       max-width: 150px; }

  228.   .swal2-modal .swal2-file {

  229.     font-size: 20px; }

  230.   .swal2-modal .swal2-textarea {

  231.     height: 108px;

  232.     padding: 12px; }

  233.   .swal2-modal .swal2-select {

  234.     color: #545454;

  235.     font-size: inherit;

  236.     padding: 5px 10px;

  237.     min-width: 40%;

  238.     max-width: 100%; }

  239.   .swal2-modal .swal2-radio {

  240.     border: 0; }

  241.     .swal2-modal .swal2-radio label:not(:first-child) {

  242.       margin-left: 20px; }

  243.     .swal2-modal .swal2-radio input,

  244.     .swal2-modal .swal2-radio span {

  245.       vertical-align: middle; }

  246.     .swal2-modal .swal2-radio input {

  247.       margin: 0 3px 0 0; }

  248.   .swal2-modal .swal2-checkbox {

  249.     color: #545454; }

  250.     .swal2-modal .swal2-checkbox input,

  251.     .swal2-modal .swal2-checkbox span {

  252.       vertical-align: middle; }

  253.   .swal2-modal .swal2-validationerror {

  254.     background-color: #f0f0f0;

  255.     margin: 0 -20px;

  256.     overflow: hidden;

  257.     padding: 10px;

  258.     color: gray;

  259.     font-size: 16px;

  260.     font-weight: 300;

  261.     display: none; }

  262.     .swal2-modal .swal2-validationerror::before {

  263.       content: '!';

  264.       display: inline-block;

  265.       width: 24px;

  266.       height: 24px;

  267.       border-radius: 50%;

  268.       background-color: #ea7d7d;

  269.       color: #fff;

  270.       line-height: 24px;

  271.       text-align: center;

  272.       margin-right: 10px; }

  273. 

  274. @supports (-ms-accelerator: true) {

  275.   .swal2-range input {

  276.     width: 100% !important; }

  277.   .swal2-range output {

  278.     display: none; } }

  279. 

  280. @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

  281.   .swal2-range input {

  282.     width: 100% !important; }

  283.   .swal2-range output {

  284.     display: none; } }

  285. 

  286. .swal2-icon {

  287.   width: 80px;

  288.   height: 80px;

  289.   border: 4px solid transparent;

  290.   border-radius: 50%;

  291.   margin: 20px auto 30px;

  292.   padding: 0;

  293.   position: relative;

  294.   box-sizing: content-box;

  295.   cursor: default;

  296.   -webkit-user-select: none;

  297.      -moz-user-select: none;

  298.       -ms-user-select: none;

  299.           user-select: none; }

  300.   .swal2-icon.swal2-error {

  301.     border-color: #f27474; }

  302.     .swal2-icon.swal2-error .x-mark {

  303.       position: relative;

  304.       display: block; }

  305.     .swal2-icon.swal2-error .line {

  306.       position: absolute;

  307.       height: 5px;

  308.       width: 47px;

  309.       background-color: #f27474;

  310.       display: block;

  311.       top: 37px;

  312.       border-radius: 2px; }

  313.       .swal2-icon.swal2-error .line.left {

  314.         -webkit-transform: rotate(45deg);

  315.                 transform: rotate(45deg);

  316.         left: 17px; }

  317.       .swal2-icon.swal2-error .line.right {

  318.         -webkit-transform: rotate(-45deg);

  319.                 transform: rotate(-45deg);

  320.         right: 16px; }

  321.   .swal2-icon.swal2-warning {

  322.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  323.     color: #f8bb86;

  324.     border-color: #facea8;

  325.     font-size: 60px;

  326.     line-height: 80px;

  327.     text-align: center; }

  328.   .swal2-icon.swal2-info {

  329.     font-family: 'Open Sans', sans-serif;

  330.     color: #3fc3ee;

  331.     border-color: #9de0f6;

  332.     font-size: 60px;

  333.     line-height: 80px;

  334.     text-align: center; }

  335.   .swal2-icon.swal2-question {

  336.     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  337.     color: #87adbd;

  338.     border-color: #c9dae1;

  339.     font-size: 60px;

  340.     line-height: 80px;

  341.     text-align: center; }

  342.   .swal2-icon.swal2-success {

  343.     border-color: #a5dc86; }

  344.     .swal2-icon.swal2-success::before, .swal2-icon.swal2-success::after {

  345.       content: '';

  346.       border-radius: 50%;

  347.       position: absolute;

  348.       width: 60px;

  349.       height: 120px;

  350.       background: #fff;

  351.       -webkit-transform: rotate(45deg);

  352.               transform: rotate(45deg); }

  353.     .swal2-icon.swal2-success::before {

  354.       border-radius: 120px 0 0 120px;

  355.       top: -7px;

  356.       left: -33px;

  357.       -webkit-transform: rotate(-45deg);

  358.               transform: rotate(-45deg);

  359.       -webkit-transform-origin: 60px 60px;

  360.               transform-origin: 60px 60px; }

  361.     .swal2-icon.swal2-success::after {

  362.       border-radius: 0 120px 120px 0;

  363.       top: -11px;

  364.       left: 30px;

  365.       -webkit-transform: rotate(-45deg);

  366.               transform: rotate(-45deg);

  367.       -webkit-transform-origin: 0 60px;

  368.               transform-origin: 0 60px; }

  369.     .swal2-icon.swal2-success .placeholder {

  370.       width: 80px;

  371.       height: 80px;

  372.       border: 4px solid rgba(165, 220, 134, 0.2);

  373.       border-radius: 50%;

  374.       box-sizing: content-box;

  375.       position: absolute;

  376.       left: -4px;

  377.       top: -4px;

  378.       z-index: 2; }

  379.     .swal2-icon.swal2-success .fix {

  380.       width: 7px;

  381.       height: 90px;

  382.       background-color: #fff;

  383.       position: absolute;

  384.       left: 28px;

  385.       top: 8px;

  386.       z-index: 1;

  387.       -webkit-transform: rotate(-45deg);

  388.               transform: rotate(-45deg); }

  389.     .swal2-icon.swal2-success .line {

  390.       height: 5px;

  391.       background-color: #a5dc86;

  392.       display: block;

  393.       border-radius: 2px;

  394.       position: absolute;

  395.       z-index: 2; }

  396.       .swal2-icon.swal2-success .line.tip {

  397.         width: 25px;

  398.         left: 14px;

  399.         top: 46px;

  400.         -webkit-transform: rotate(45deg);

  401.                 transform: rotate(45deg); }

  402.       .swal2-icon.swal2-success .line.long {

  403.         width: 47px;

  404.         right: 8px;

  405.         top: 38px;

  406.         -webkit-transform: rotate(-45deg);

  407.                 transform: rotate(-45deg); }

  408. 

  409. .swal2-progresssteps {

  410.   font-weight: 600;

  411.   margin: 0 0 20px;

  412.   padding: 0; }

  413.   .swal2-progresssteps li {

  414.     display: inline-block;

  415.     position: relative; }

  416.   .swal2-progresssteps .swal2-progresscircle {

  417.     background: #ff6600;

  418.     border-radius: 2em;

  419.     color: #fff;

  420.     height: 2em;

  421.     line-height: 2em;

  422.     text-align: center;

  423.     width: 2em;

  424.     z-index: 20; }

  425.     .swal2-progresssteps .swal2-progresscircle:first-child {

  426.       margin-left: 0; }

  427.     .swal2-progresssteps .swal2-progresscircle:last-child {

  428.       margin-right: 0; }

  429.     .swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep {

  430.       background: #ff6600; }

  431.       .swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep ~ .swal2-progresscircle {

  432.         background: #add8e6; }

  433.       .swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep ~ .swal2-progressline {

  434.         background: #add8e6; }

  435.   .swal2-progresssteps .swal2-progressline {

  436.     background: #ff6600;

  437.     height: .4em;

  438.     margin: 0 -1px;

  439.     z-index: 10; }

  440. 

  441. [class^='swal2'] {

  442.   -webkit-tap-highlight-color: transparent; }

  443. 

  444. @-webkit-keyframes showSweetAlert {

  445.   0% {

  446.     -webkit-transform: scale(0.7);

  447.             transform: scale(0.7); }

  448.   45% {

  449.     -webkit-transform: scale(1.05);

  450.             transform: scale(1.05); }

  451.   80% {

  452.     -webkit-transform: scale(0.95);

  453.             transform: scale(0.95); }

  454.   100% {

  455.     -webkit-transform: scale(1);

  456.             transform: scale(1); } }

  457. 

  458. @keyframes showSweetAlert {

  459.   0% {

  460.     -webkit-transform: scale(0.7);

  461.             transform: scale(0.7); }

  462.   45% {

  463.     -webkit-transform: scale(1.05);

  464.             transform: scale(1.05); }

  465.   80% {

  466.     -webkit-transform: scale(0.95);

  467.             transform: scale(0.95); }

  468.   100% {

  469.     -webkit-transform: scale(1);

  470.             transform: scale(1); } }

  471. 

  472. @-webkit-keyframes hideSweetAlert {

  473.   0% {

  474.     -webkit-transform: scale(1);

  475.             transform: scale(1);

  476.     opacity: 1; }

  477.   100% {

  478.     -webkit-transform: scale(0.5);

  479.             transform: scale(0.5);

  480.     opacity: 0; } }

  481. 

  482. @keyframes hideSweetAlert {

  483.   0% {

  484.     -webkit-transform: scale(1);

  485.             transform: scale(1);

  486.     opacity: 1; }

  487.   100% {

  488.     -webkit-transform: scale(0.5);

  489.             transform: scale(0.5);

  490.     opacity: 0; } }

  491. 

  492. .swal2-show {

  493.   -webkit-animation: showSweetAlert 0.3s;

  494.           animation: showSweetAlert 0.3s; }

  495.   .swal2-show.swal2-noanimation {

  496.     -webkit-animation: none;

  497.             animation: none; }

  498. 

  499. .swal2-hide {

  500.   -webkit-animation: hideSweetAlert 0.15s forwards;

  501.           animation: hideSweetAlert 0.15s forwards; }

  502.   .swal2-hide.swal2-noanimation {

  503.     -webkit-animation: none;

  504.             animation: none; }

  505. 

  506. @-webkit-keyframes animate-success-tip {

  507.   0% {

  508.     width: 0;

  509.     left: 1px;

  510.     top: 19px; }

  511.   54% {

  512.     width: 0;

  513.     left: 1px;

  514.     top: 19px; }

  515.   70% {

  516.     width: 50px;

  517.     left: -8px;

  518.     top: 37px; }

  519.   84% {

  520.     width: 17px;

  521.     left: 21px;

  522.     top: 48px; }

  523.   100% {

  524.     width: 25px;

  525.     left: 14px;

  526.     top: 45px; } }

  527. 

  528. @keyframes animate-success-tip {

  529.   0% {

  530.     width: 0;

  531.     left: 1px;

  532.     top: 19px; }

  533.   54% {

  534.     width: 0;

  535.     left: 1px;

  536.     top: 19px; }

  537.   70% {

  538.     width: 50px;

  539.     left: -8px;

  540.     top: 37px; }

  541.   84% {

  542.     width: 17px;

  543.     left: 21px;

  544.     top: 48px; }

  545.   100% {

  546.     width: 25px;

  547.     left: 14px;

  548.     top: 45px; } }

  549. 

  550. @-webkit-keyframes animate-success-long {

  551.   0% {

  552.     width: 0;

  553.     right: 46px;

  554.     top: 54px; }

  555.   65% {

  556.     width: 0;

  557.     right: 46px;

  558.     top: 54px; }

  559.   84% {

  560.     width: 55px;

  561.     right: 0;

  562.     top: 35px; }

  563.   100% {

  564.     width: 47px;

  565.     right: 8px;

  566.     top: 38px; } }

  567. 

  568. @keyframes animate-success-long {

  569.   0% {

  570.     width: 0;

  571.     right: 46px;

  572.     top: 54px; }

  573.   65% {

  574.     width: 0;

  575.     right: 46px;

  576.     top: 54px; }

  577.   84% {

  578.     width: 55px;

  579.     right: 0;

  580.     top: 35px; }

  581.   100% {

  582.     width: 47px;

  583.     right: 8px;

  584.     top: 38px; } }

  585. 

  586. @-webkit-keyframes rotatePlaceholder {

  587.   0% {

  588.     -webkit-transform: rotate(-45deg);

  589.             transform: rotate(-45deg); }

  590.   5% {

  591.     -webkit-transform: rotate(-45deg);

  592.             transform: rotate(-45deg); }

  593.   12% {

  594.     -webkit-transform: rotate(-405deg);

  595.             transform: rotate(-405deg); }

  596.   100% {

  597.     -webkit-transform: rotate(-405deg);

  598.             transform: rotate(-405deg); } }

  599. 

  600. @keyframes rotatePlaceholder {

  601.   0% {

  602.     -webkit-transform: rotate(-45deg);

  603.             transform: rotate(-45deg); }

  604.   5% {

  605.     -webkit-transform: rotate(-45deg);

  606.             transform: rotate(-45deg); }

  607.   12% {

  608.     -webkit-transform: rotate(-405deg);

  609.             transform: rotate(-405deg); }

  610.   100% {

  611.     -webkit-transform: rotate(-405deg);

  612.             transform: rotate(-405deg); } }

  613. 

  614. .animate-success-tip {

  615.   -webkit-animation: animate-success-tip 0.75s;

  616.           animation: animate-success-tip 0.75s; }

  617. 

  618. .animate-success-long {

  619.   -webkit-animation: animate-success-long 0.75s;

  620.           animation: animate-success-long 0.75s; }

  621. 

  622. .swal2-success.animate::after {

  623.   -webkit-animation: rotatePlaceholder 4.25s ease-in;

  624.           animation: rotatePlaceholder 4.25s ease-in; }

  625. 

  626. @-webkit-keyframes animate-error-icon {

  627.   0% {

  628.     -webkit-transform: rotateX(100deg);

  629.             transform: rotateX(100deg);

  630.     opacity: 0; }

  631.   100% {

  632.     -webkit-transform: rotateX(0deg);

  633.             transform: rotateX(0deg);

  634.     opacity: 1; } }

  635. 

  636. @keyframes animate-error-icon {

  637.   0% {

  638.     -webkit-transform: rotateX(100deg);

  639.             transform: rotateX(100deg);

  640.     opacity: 0; }

  641.   100% {

  642.     -webkit-transform: rotateX(0deg);

  643.             transform: rotateX(0deg);

  644.     opacity: 1; } }

  645. 

  646. .animate-error-icon {

  647.   -webkit-animation: animate-error-icon 0.5s;

  648.           animation: animate-error-icon 0.5s; }

  649. 

  650. @-webkit-keyframes animate-x-mark {

  651.   0% {

  652.     -webkit-transform: scale(0.4);

  653.             transform: scale(0.4);

  654.     margin-top: 26px;

  655.     opacity: 0; }

  656.   50% {

  657.     -webkit-transform: scale(0.4);

  658.             transform: scale(0.4);

  659.     margin-top: 26px;

  660.     opacity: 0; }

  661.   80% {

  662.     -webkit-transform: scale(1.15);

  663.             transform: scale(1.15);

  664.     margin-top: -6px; }

  665.   100% {

  666.     -webkit-transform: scale(1);

  667.             transform: scale(1);

  668.     margin-top: 0;

  669.     opacity: 1; } }

  670. 

  671. @keyframes animate-x-mark {

  672.   0% {

  673.     -webkit-transform: scale(0.4);

  674.             transform: scale(0.4);

  675.     margin-top: 26px;

  676.     opacity: 0; }

  677.   50% {

  678.     -webkit-transform: scale(0.4);

  679.             transform: scale(0.4);

  680.     margin-top: 26px;

  681.     opacity: 0; }

  682.   80% {

  683.     -webkit-transform: scale(1.15);

  684.             transform: scale(1.15);

  685.     margin-top: -6px; }

  686.   100% {

  687.     -webkit-transform: scale(1);

  688.             transform: scale(1);

  689.     margin-top: 0;

  690.     opacity: 1; } }

  691. 

  692. .animate-x-mark {

  693.   -webkit-animation: animate-x-mark 0.5s;

  694.           animation: animate-x-mark 0.5s; }

  695. 

  696. @-webkit-keyframes pulse-warning {

  697.   0% {

  698.     border-color: #f8d486; }

  699.   100% {

  700.     border-color: #f8bb86; } }

  701. 

  702. @keyframes pulse-warning {

  703.   0% {

  704.     border-color: #f8d486; }

  705.   100% {

  706.     border-color: #f8bb86; } }

  707. 

  708. .pulse-warning {

  709.   -webkit-animation: pulse-warning 0.75s infinite alternate;

  710.           animation: pulse-warning 0.75s infinite alternate; }

  711. 

  712. @-webkit-keyframes rotate-loading {

  713.   0% {

  714.     -webkit-transform: rotate(0deg);

  715.             transform: rotate(0deg); }

  716.   100% {

  717.     -webkit-transform: rotate(360deg);

  718.             transform: rotate(360deg); } }

  719. 

  720. @keyframes rotate-loading {

  721.   0% {

  722.     -webkit-transform: rotate(0deg);

  723.             transform: rotate(0deg); }

  724.   100% {

  725.     -webkit-transform: rotate(360deg);

  726.             transform: rotate(360deg); } }