
/**
  ** Send Section
  **/
.send {
  max-width: 800px;
  width: 100%;
  margin: 50px auto;
  border-collapse: collapse;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  position: relative;
  top: -180px;
}

.send__header {
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  background-color: #000;
  border-bottom: 4px solid #9ea7af;
  font-size: 38px;
  font-weight: 100;
  color: #fff;
  padding: 24px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  vertical-align:middle;
  text-align: center;
}

.send__body {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  padding: 24px;
}

.send__body-title {
  font-size: 32px;
  font-weight: 100;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  margin: 20px 0 40px;
  vertical-align:middle;
  text-align: center;
}

.send__logo {
  width: 35px;
  height: 35px;
}

.send__button {
  text-align: center;
  margin: 20px 0;
}

#send__waiting {
  display: none;
}

.send__waiting-title {
  font-size: 32px;
  font-weight: 100;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  margin: 20px 0;
  vertical-align:middle;
  text-align: center;
  border-bottom: 4px solid #ccc;
}

/** Loading Circle **/

#send__waiting .bokeh {
    font-size: 100px;
    width: 1em;
    height: 1em;
    position: relative;
    margin: 70px auto;
    border-radius: 50%;
    border: 1px solid #dae0e5;
    list-style: none;
}

#send__waiting .bokeh li {
    position: absolute;
    width: .2em;
    height: .2em;
    border-radius: 50%;
}

#send__waiting .bokeh li:nth-child(1) {
    left: 50%;
    top: 0;
    margin: 0 0 0 -.1em;
    background: #2ecc71;
    -webkit-transform-origin: 50% 250%;
    transform-origin: 50% 250%;
    -webkit-animation:
        rota 1.13s linear infinite,
        opa 3.67s ease-in-out infinite alternate;
    animation:
        rota 1.13s linear infinite,
        opa 3.67s ease-in-out infinite alternate;
}

#send__waiting .bokeh li:nth-child(2) {
    top: 50%;
    right: 0;
    margin: -.1em 0 0 0;
    background: #3498db;
    -webkit-transform-origin: -150% 50%;
    transform-origin: -150% 50%;
    -webkit-animation:
        rota 1.86s linear infinite,
        opa 4.29s ease-in-out infinite alternate;
    animation:
        rota 1.86s linear infinite,
        opa 4.29s ease-in-out infinite alternate;
}

#send__waiting .bokeh li:nth-child(4) {
    top: 50%;
    left: 0;
    margin: -.1em 0 0 0;
    background: #e74c3c;
    -webkit-transform-origin: 250% 50%;
    transform-origin: 250% 50%;
    -webkit-animation:
        rota 1.72s linear infinite,
        opa 5.25s ease-in-out infinite alternate;
    animation:
        rota 1.72s linear infinite,
        opa 5.25s ease-in-out infinite alternate;
}

@-webkit-keyframes rota {
    from { }
    to { -webkit-transform: rotate(360deg); }
}

@keyframes rota {
    from { }
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@-webkit-keyframes opa {
    0% { }
    12.0% { opacity: 0.80; }
    19.5% { opacity: 0.88; }
    37.2% { opacity: 0.64; }
    40.5% { opacity: 0.52; }
    52.7% { opacity: 0.69; }
    60.2% { opacity: 0.60; }
    66.6% { opacity: 0.52; }
    70.0% { opacity: 0.63; }
    79.9% { opacity: 0.60; }
    84.2% { opacity: 0.75; }
    91.0% { opacity: 0.87; }
}

@keyframes opa {
    0% { }
    12.0% { opacity: 0.80; }
    19.5% { opacity: 0.88; }
    37.2% { opacity: 0.64; }
    40.5% { opacity: 0.52; }
    52.7% { opacity: 0.69; }
    60.2% { opacity: 0.60; }
    66.6% { opacity: 0.52; }
    70.0% { opacity: 0.63; }
    79.9% { opacity: 0.60; }
    84.2% { opacity: 0.75; }
    91.0% { opacity: 0.87; }
}
