html,body {
  height: 100%;
  overflow: hidden;
}
.small-text{
 font-size: small;
    color: #173753; 
}
.boxshadow{
  box-shadow: 4px 4px 10px 0px #888888;
}
.getmeup {
  margin-bottom: 10px;
}
.avatar-icon {
  background: -webkit-gradient(linear, left top, left bottom, from(#173753), to(#6DAEDB));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: initial; /* reset Font Awesome's display:inline-block */
}
.avatar {
  font-size: 15vw;
  background: -webkit-gradient(linear, left top, left bottom, from(#173753), to(#6DAEDB));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: initial; /* reset Font Awesome's display:inline-block */
}
.avatar-icons {
  font-size: 30px;
  background: -webkit-gradient(linear, left top, left bottom, from(#1d486e), to(#000000));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: initial; /* reset Font Awesome's display:inline-block */
}
.avatar-profile {
  border-radius: 50%;
  width: 15vw;
}
.fixed-col{
  padding: 5px;
}
.avatar-prof {
  /* border-radius: 50%; */
  width: 3vw;
}
h1 {
  color:#173753;
}
h2 {
  color: #4392F1;
}
h3 {
  color: #4392F1;
}
h4 {
  color:#4392F1;
}
p {
  color: 6DAEDB;
}
.container-fluid-fixes{
  padding-right: 25px;
    padding-left: 25px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 30px;
}
.container-fixes {
  //height: 550px;
  //display: flex;
  justify-content: center;
  align-items: end;
  bottom: 0;
  position: absolute;
  left: 0;
  right: 0;
  background-color: #F8F8F8;
  z-index: 9;
  top: 10%;
  overflow: auto;
}
.container-fixes-up {
  height:10%;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  position: absolute;
  left: 0;
  right: 0;

}
.aldrich-font {
  font-family: 'Aldrich';font-size: 22px;
}
.aldrich-font-small {
  font-family: 'Aldrich';font-size: 15px;
}
.area{
  background: #FFFFFF;
  background: -webkit-linear-gradient(to left, #ffffff, #f8f8f8);
  width: 100vh;
  height:100vh;


}

.circles{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.circles li{
  position: absolute;
  display: block;
  list-style: none;
  width: 20px;
  height: 20px;
  background: #4392F1;
  animation: animate 25s linear infinite;
  bottom: -150px;
}

.circles li:nth-child(1){
  left: 25%;
  width: 80px;
  height: 80px;
  animation-delay: 0s;
}

.circles li:nth-child(2){
  left: 10%;
  width: 20px;
  height: 20px;
  animation-delay: 2s;
  animation-duration: 3s;
}

.circles li:nth-child(3){
  left: 70%;
  width: 20px;
  height: 20px;
  animation-delay: 4s;
}

.circles li:nth-child(4){
  left: 40%;
  width: 60px;
  height: 60px;
  animation-delay: 0s;
  animation-duration: 2s;
}

.circles li:nth-child(5){
  left: 65%;
  width: 20px;
  height: 20px;
  animation-delay: 0s;
}

.circles li:nth-child(6){
  left: 75%;
  width: 110px;
  height: 110px;
  animation-delay: 3s;
}

.circles li:nth-child(7){
  left: 35%;
  width: 150px;
  height: 150px;
  animation-delay: 7s;
}

.circles li:nth-child(8){
  left: 50%;
  width: 25px;
  height: 25px;
  animation-delay: 3s;
  animation-duration: 10s;
}

.circles li:nth-child(9){
  left: 20%;
  width: 15px;
  height: 15px;
  animation-delay: 2s;
  animation-duration: 5s;
}

.circles li:nth-child(10){
  left: 85%;
  width: 150px;
  height: 150px;
  animation-delay: 2s;
  animation-duration: 5s;
}

.circles li:nth-child(11){
  left: 15%;
  width: 80px;
  height: 80px;
  animation-delay: 0s;
  animation-duration: 7s;
}
.circles li:nth-child(12){
  left: 25%;
  width: 40px;
  height: 40px;
  animation-delay: 1s;
  animation-duration: 4s;
}
.circles li:nth-child(13){
  left: 35%;
  width: 20px;
  height: 20px;
  animation-delay: 2s;
  animation-duration: 2s;
}
.circles li:nth-child(14){
  left: 45%;
  width: 50px;
  height: 50px;
  animation-delay: 3s;
  animation-duration: 2s;
}

@keyframes animate {

  0%{
      transform: translateY(0) rotate(0deg);
      opacity: 1;
      border-radius: 0;
  }

  100%{
      transform: translateY(-400px) rotate(720deg);
      opacity: 0;
      border-radius: 50%;
  }

}