.loading-modal {
    z-index: 9999999;
    padding-top: 100px;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: white;
    background-color: rgba(0,0,0,0.4);
    text-align: center;
}

.loading-content {
    margin: auto;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 50px;
    position: relative;
    padding: 0;
    outline: 0;
    width: 300px;
}

/*--------------- Spinner rectangulos ------------------*/
.spinner {
  margin: auto;
  width: 60px;
  height: 80px;
  text-align: center;
  font-size: 10px;
}

.spinner > div {
  background-color: #24135f;
  height: 100%;
  width: 8px;
  display: inline-block;
  
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect1 {
  -webkit-animation-delay: -1.2s;
  animation-delay: -1.2s;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}
/*------------------ Spinner 2 ------------------*/
.spinner2 {
  margin: auto;
  width: 100px;
  text-align: center;
}

.spinner2 > div {
  width: 28px;
  height: 28px;
  background-color: #24135f;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner2 .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner2 .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

/*********** Awesome Effect ************/
.awesome-effect {
            margin: 1em auto;
            max-width: 1106px;
            text-align: center;
        }
        .awesome-effect li {
            display: inline-block;
            width: 300px;
            margin: 50px;
        }
        .awesome-effect img {
            display: block;
            height: auto;
            max-width: 100%;
        }
        .awesome-effect figure {
            height: 300px;
            overflow: hidden;
            position: relative;
            width: 300px;
        }
        .awesome-effect figcaption {
            background: rgba(0,0,0,0.8);
            color: white;
            display: table;
            height: 100%;
            left: 0;
            opacity: 0;
            position: absolute;
            right: 0;
            top: 0;
            z-index: 100;
        }
        .awesome-effect figcaption p {
            display: table-cell;
            font-size: 1.5em;
            position: relative;
            top: -40px;
            width: 300px;
            vertical-align: middle;
        }
        .awesome-effect li:hover figcaption {
            opacity: 1;
            border-top-left-radius
        }
        .awesome-effect img {
            display: block;
            height: auto;
            -webkit-transition: all 300ms;
            -moz-transition: all 300ms;
            transition: all 300ms;
            max-width: 100%;
        }
        .awesome-effect li:hover img {
            -webkit-transform: scale(1.4);
            -moz-transform: scale(1.4);
            transform: scale(1.4);
        }
        .awesome-effect figcaption p {
            display: table-cell;
            font-size: 1.5em;
            position: relative;
            top: -40px;
            width: 300px;
            -webkit-transition: all 300ms ease-out;
            -moz-transition: all 300ms ease-out;
            transition: all 300ms ease-out;
            vertical-align: middle;
        }
        .awesome-effect li:hover figcaption p {
            -moz-transform: translateY(40px);
            -webkit-transform: translateY(40px);
            transform: translateY(40px);
        }
        .awesome-effect figcaption {
            background: rgba(0,0,0,0.8);
            color: white;
            display: table;
            height: 100%;
            left: 0;
            opacity: 0;
            position: absolute;
            right: 0;
            top: 0;
            -webkit-transition: all 300ms;
            -moz-transition: all 300ms;
            transition: all 300ms;
            -webkit-transition-delay: 100ms;
            -moz-transition-delay: 100ms;
            transition-delay: 100ms;
            z-index: 100;
        }

        .hover-img figure img {
            -webkit-transform: scale(1);
            transform: scale(1);
            -webkit-transition: .3s ease-in-out;
            transition: .3s ease-in-out;
        }
        .hover-img figure:hover img {
            -webkit-transform: scale(1.3);
            transform: scale(1.3);
        }

/**************** Bounce To Bottom ***************/
.hvr-bounce-to-bottom {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hvr-bounce-to-bottom:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2098d1;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-bounce-to-bottom:hover, .hvr-bounce-to-bottom:focus, .hvr-bounce-to-bottom:active {
  color: white;
}
.hvr-bounce-to-bottom:hover:before, .hvr-bounce-to-bottom:focus:before, .hvr-bounce-to-bottom:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

/************** Bounce To Top ****************/
.hvr-bounce-to-top {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hvr-bounce-to-top:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2098d1;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-bounce-to-top:hover, .hvr-bounce-to-top:focus, .hvr-bounce-to-top:active {
  color: white;
}
.hvr-bounce-to-top:hover:before, .hvr-bounce-to-top:focus:before, .hvr-bounce-to-top:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.btn-selector-right {
    float: right;
    color: white;
    margin-right: -20px;
    background-color: #2098d1;
    width: 400px;
    height: 200px;
    border-top-left-radius: 80px;
    border-bottom-left-radius: 80px;
    border: none;
}