Test CSS

@keyframes float{
    0%,100%{
        box-shadow:0 5px 15px 0 rgba(0,0,0,.6);
        transform:translatey(0)
    }
    50%{
        box-shadow:0 25px 15px 0 rgba(0,0,0,.2);
        transform:translatey(-5px)
    }
}
.efeito-flutuante {
     animation: float 6s ease-in-out infinite;
}

progress[value] {
  appearance: none;
  border: none;
  width: 100%; height: 20px;
  background-color: transparent; //whiteSmoke
  border-radius: 3px;
  box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;
  color: royalblue;
  position: relative;
}

progress[value]::-webkit-progress-bar {
  background-color: transparent; //whiteSmoke
  border-radius: 3px;
  box-shadow: 0 2px 3px rgba(0,0,0,.5) inset;
}

@-webkit-keyframes animate-stripes {  100% { background-position: -100px 0px; } }
@keyframes animate-stripes { 100% { background-position: -100px 0px; } }

progress[value]::-webkit-progress-value {
  background-image:
  -webkit-linear-gradient( 135deg, transparent, transparent 33%, rgba(0,0,0,.1) 33%, rgba(0,0,0,.1) 66%, transparent 66%),
  -webkit-linear-gradient( top, rgba(255, 255, 255, .25), rgba(0,0,0,.2)),
  -webkit-linear-gradient( left, #0078D7, #0078D7);

  position: relative;

  background-size: 35px 20px, 100% 100%, 100% 100%;
  border-radius:3px;

  animation: animate-stripes 5s linear infinite;
  -webkit-animation: animate-stripes 5s linear infinite;
}

progress[value]::-webkit-progress-value::before {
  content: '10%';
  position: absolute;
  right: 0;
  top: -125%;
}

progress[value]::-webkit-progress-value::after {
  content: '';
  width: 6px;
  height: 6px;
  position: absolute;
  border-radius: 100%;
  right: 7px;
  top: 7px;
  background-color: transparent; //white
}

a[data-value] {
  position: relative;
}

/* The percentage will automatically fall in place as soon as we make the width fluid. Now making widths fluid. */

a[data-value]:after {
  content: attr(data-value) '%';
  right:0;
}

/*
.hide {
   position: absolute !important;
   top: -9999px !important;
   left: -9999px !important;
} */

#firstDiv {
    float:left;
    //background:red;
}
#secondDiv {
    float:left;
    //background:white;
}
#thirdDiv {
    float:left;
    //background:black;
}

.text-centered {
    text-align: center;
    font-weight: bold;
    color: #700606;
    size: large;
}

.toggle {
    margin-bottom: 20px;
}

.toggle > input {
    display: none;
}

.toggle > label {
    position: relative;
    display: inline-block;
    height: 15px;
    width: 32px;
    background-color: #ebebeb;
    border: 2px #700606 solid;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.toggle > label:after {
    position: absolute;
    display: block;
    width: 13px;
    height: 13px;
    border-radius: 50px;
    background: #fff;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.05);
    content: '';
    transition: all 0.3s ease;
}
.toggle > label:active:after {
    transform: scale(1.15, 0.85);
}
.toggle > input:checked ~ label {
    background-color: #700606;
    border-color: #700606;
}
.toggle > input:checked ~ label:after {
    left: 18px;
}
.toggle > input:disabled ~ label {
    background-color: #d5d5d5;
    pointer-events: none;
}
.toggle > input:disabled ~ label:after {
    background-color: rgba(255, 255, 255, 0.3);
}

.toggle_large {
    margin-bottom: 20px;
}

.toggle_large > input {
    display: none;
}

.toggle_large > label {
    position: relative;
    display: inline-block;
    height: 28px;
    width: 52px;
    background-color: #ebebeb;
    border: 3px #700606 solid;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.toggle_large > label:after {
    position: absolute;
    display: block;
    width: 26px;
    height: 26px;
    border-radius: 100px;
    background: #fff;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.05);
    content: '';
    transition: all 0.3s ease;
}
.toggle_large > label:active:after {
    transform: scale(1.15, 0.85);
}
.toggle_large > input:checked ~ label {
    background-color: #700606;
    border-color: #700606;
}
.toggle_large > input:checked ~ label:after {
    left: 26px;
}
.toggle_large > input:disabled ~ label {
    background-color: #d5d5d5;
    pointer-events: none;
}
.toggle_large > input:disabled ~ label:after {
    background-color: rgba(255, 255, 255, 0.3);
}