#Brightness-Slider-Section {
  position         : absolute;
  right            : 0;
  left             : 0;
  margin           : auto;
  top              : -5cm;
  width            : 16cm;
  height           : 1cm;
  max-width        : 100%;
  background-color : white;
  transition       : top 0.3s 4s, visibility 0s 4.3s;
  visibility       : hidden;
  box-sizing       : border-box;
  border           : 1px solid grey;
  border-top       : none;
  padding          : 5mm;
  padding-top      : 2.5mm;
  padding-bottom   : 2.5mm;
}

#Brightness-Slider-Section[shown], #Brightness-Slider-Section:hover {
  top        : 1cm;
  transition : top 0.3s 0s, visibility 0s 0s;
  visibility : visible;
}

#Brightness-Slider-Section::before, #Brightness-Slider-Section::after {
  position                      : absolute;
  content                       : "wb_sunny";
  font-family                   : 'Material Icons';
  font-weight                   : 400;
  font-style                    : normal;
  font-size                     : 24px;
  line-height                   : 1;
  letter-spacing                : normal;
  text-transform                : none;
  display                       : inline-block;
  word-wrap                     : normal;
  -moz-font-feature-settings    : 'liga';
  font-feature-settings         : 'liga';
  -webkit-font-feature-settings : 'liga';
  -webkit-font-smoothing        : antialiased;
  top                           : 2mm;
  height                        : 24px;
  line-height                   : 24px;
  vertical-align                : middle;
}

#Brightness-Slider-Section::before {
  font-size: 16px;
  left     : 2mm;
}

#Brightness-Slider-Section::after {
  right : 2mm;
}

/* Extra for ie... */
.mdl-slider__ie-container input {
  position : relative;
  top      : -5px;
  width    : 100%;
}