/*!
 *  Weather Icons 2.0.10
 *  Updated November 1, 2020
 *  Weather themed icons for Bootstrap
 *  Author - Erik Flowers - erik@helloerik.com
 *  Email: erik@helloerik.com
 *  Twitter: http://twitter.com/Erik_UX
 *  ------------------------------------------------------------------------------
 *  Maintained at http://erikflowers.github.io/weather-icons
 *
 *  License
 *  ------------------------------------------------------------------------------
 *  - Font licensed under SIL OFL 1.1 -
 *    http://scripts.sil.org/OFL
 *  - CSS, SCSS and LESS are licensed under MIT License -
 *    http://opensource.org/licenses/mit-license.html
 *  - Documentation licensed under CC BY 3.0 -
 *    http://creativecommons.org/licenses/by/3.0/
 *  - Inspired by and works great as a companion with Font Awesome
 *    "Font Awesome by Dave Gandy - http://fontawesome.io"
 */
 @font-face {
    font-family: 'weathericons';
    src: url('../font/weathericons-regular-webfont.woff') format('woff'),
      url('../font/weathericons-regular-webfont.woff2') format('woff2');

    font-weight: normal;
    font-style: normal;
  }
  .wi {
    display: inline-block;
    font-family: 'weathericons';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  .wi-fw {
    text-align: center;
    width: 1.4em;
  }
  .wi-rotate-90 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  .wi-rotate-180 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  .wi-rotate-270 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
  }
  .wi-flip-horizontal {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
    -webkit-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
  }
  .wi-flip-vertical {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
    -webkit-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1);
  }

aside.rot-weather-wrapper{
    position: fixed;
    right: 0;
    max-height: 80vh;
    bottom: 0;
    z-index: 200;
    pointer-events:none;
}
.weather-content {
  position: relative;
  background: var(--primary-light);
  padding: 1.5rem 1.5rem 2.5rem;
  font-size: 0.8rem;
  text-align: right;
  transform: translateX(100%);
  transition: transform 0.5s;
}
.weatherforecast .weather-content>label i{
    font-size: 2rem!important;
}
.weatherforecast .weather-content>label {
  padding: 0.45rem 0.7rem 0.45rem 0.7rem;
  position: absolute;
  left: -3.7rem;
  pointer-events: auto;
  background: var(--primary);
  bottom: 0;
  margin-bottom: 0;
  width: 3.7rem;
}
.weatherforecast #weather-check{
    display:none;
}
.current-temp{
  color:white;
  display:inline-block;
}
.weatherforecast #weather-check:checked ~.weather-content{
    transform:translateX(0);
}
.weather-content h3{
    font-size:1.2rem;
    margin-bottom:.1em;
    color:white;
}
.weather-content h4 {
  font-size: 1.25rem;
  display: inline-block;
  margin-right: 2px;
  padding-bottom: 0px;
  margin-bottom: 2px;
  padding-top: 2px;
  color: white;
  font-weight: 300;
  padding-bottom: 3px;
}
.weather-content [class*="wi-owm-"] {
  font-size: 3.2rem;
  color: white;
  display: block;
  margin-right: 0.5rem;
}
label[for="weather-check"]:after,
label[for="weather-check"]:before{
  /* content: ''; */
    position: absolute;
    width: 100%;
    height: 0.9rem;
    background: white;
    border-radius: 0 10px 10px 0;
    left: -4px;
    bottom: -8px;
}
label[for="weather-check"]:before{
  bottom:auto;
  top:-8px;
}
.wi-owm-200:before {
    content: "\f01e";
  }
  .wi-owm-201:before {
    content: "\f01e";
  }
  .wi-owm-202:before {
    content: "\f01e";
  }
  .wi-owm-210:before {
    content: "\f016";
  }
  .wi-owm-211:before {
    content: "\f016";
  }
  .wi-owm-212:before {
    content: "\f016";
  }
  .wi-owm-221:before {
    content: "\f016";
  }
  .wi-owm-230:before {
    content: "\f01e";
  }
  .wi-owm-231:before {
    content: "\f01e";
  }
  .wi-owm-232:before {
    content: "\f01e";
  }
  .wi-owm-300:before {
    content: "\f01c";
  }
  .wi-owm-301:before {
    content: "\f01c";
  }
  .wi-owm-302:before {
    content: "\f019";
  }
  .wi-owm-310:before {
    content: "\f017";
  }
  .wi-owm-311:before {
    content: "\f019";
  }
  .wi-owm-312:before {
    content: "\f019";
  }
  .wi-owm-313:before {
    content: "\f01a";
  }
  .wi-owm-314:before {
    content: "\f019";
  }
  .wi-owm-321:before {
    content: "\f01c";
  }
  .wi-owm-500:before {
    content: "\f01c";
  }
  .wi-owm-501:before {
    content: "\f019";
  }
  .wi-owm-502:before {
    content: "\f019";
  }
  .wi-owm-503:before {
    content: "\f019";
  }
  .wi-owm-504:before {
    content: "\f019";
  }
  .wi-owm-511:before {
    content: "\f017";
  }
  .wi-owm-520:before {
    content: "\f01a";
  }
  .wi-owm-521:before {
    content: "\f01a";
  }
  .wi-owm-522:before {
    content: "\f01a";
  }
  .wi-owm-531:before {
    content: "\f01d";
  }
  .wi-owm-600:before {
    content: "\f01b";
  }
  .wi-owm-601:before {
    content: "\f01b";
  }
  .wi-owm-602:before {
    content: "\f0b5";
  }
  .wi-owm-611:before {
    content: "\f017";
  }
  .wi-owm-612:before {
    content: "\f017";
  }
  .wi-owm-615:before {
    content: "\f017";
  }
  .wi-owm-616:before {
    content: "\f017";
  }
  .wi-owm-620:before {
    content: "\f017";
  }
  .wi-owm-621:before {
    content: "\f01b";
  }
  .wi-owm-622:before {
    content: "\f01b";
  }
  .wi-owm-701:before {
    content: "\f014";
  }
  .wi-owm-711:before {
    content: "\f062";
  }
  .wi-owm-721:before {
    content: "\f0b6";
  }
  .wi-owm-731:before {
    content: "\f063";
  }
  .wi-owm-741:before {
    content: "\f014";
  }
  .wi-owm-761:before {
    content: "\f063";
  }
  .wi-owm-762:before {
    content: "\f063";
  }
  .wi-owm-771:before {
    content: "\f011";
  }
  .wi-owm-781:before {
    content: "\f056";
  }
  .wi-owm-800:before {
    content: "\f00d";
  }
  .wi-owm-801:before {
    content: "\f041";
  }
  .wi-owm-802:before {
    content: "\f041";
  }
  .wi-owm-803:before {
    content: "\f013";
  }
  .wi-owm-804:before {
    content: "\f013";
  }
  .wi-owm-900:before {
    content: "\f056";
  }
  .wi-owm-901:before {
    content: "\f01d";
  }
  .wi-owm-902:before {
    content: "\f073";
  }
  .wi-owm-903:before {
    content: "\f076";
  }
  .wi-owm-904:before {
    content: "\f072";
  }
  .wi-owm-905:before {
    content: "\f021";
  }
  .wi-owm-906:before {
    content: "\f015";
  }
  .wi-owm-957:before {
    content: "\f050";
  }
  .wi-owm-day-200:before {
    content: "\f010";
  }
  .wi-owm-day-201:before {
    content: "\f010";
  }
  .wi-owm-day-202:before {
    content: "\f010";
  }
  .wi-owm-day-210:before {
    content: "\f005";
  }
  .wi-owm-day-211:before {
    content: "\f005";
  }
  .wi-owm-day-212:before {
    content: "\f005";
  }
  .wi-owm-day-221:before {
    content: "\f005";
  }
  .wi-owm-day-230:before {
    content: "\f010";
  }
  .wi-owm-day-231:before {
    content: "\f010";
  }
  .wi-owm-day-232:before {
    content: "\f010";
  }
  .wi-owm-day-300:before {
    content: "\f00b";
  }
  .wi-owm-day-301:before {
    content: "\f00b";
  }
  .wi-owm-day-302:before {
    content: "\f008";
  }
  .wi-owm-day-310:before {
    content: "\f008";
  }
  .wi-owm-day-311:before {
    content: "\f008";
  }
  .wi-owm-day-312:before {
    content: "\f008";
  }
  .wi-owm-day-313:before {
    content: "\f008";
  }
  .wi-owm-day-314:before {
    content: "\f008";
  }
  .wi-owm-day-321:before {
    content: "\f00b";
  }
  .wi-owm-day-500:before {
    content: "\f00b";
  }
  .wi-owm-day-501:before {
    content: "\f008";
  }
  .wi-owm-day-502:before {
    content: "\f008";
  }
  .wi-owm-day-503:before {
    content: "\f008";
  }
  .wi-owm-day-504:before {
    content: "\f008";
  }
  .wi-owm-day-511:before {
    content: "\f006";
  }
  .wi-owm-day-520:before {
    content: "\f009";
  }
  .wi-owm-day-521:before {
    content: "\f009";
  }
  .wi-owm-day-522:before {
    content: "\f009";
  }
  .wi-owm-day-531:before {
    content: "\f00e";
  }
  .wi-owm-day-600:before {
    content: "\f00a";
  }
  .wi-owm-day-601:before {
    content: "\f0b2";
  }
  .wi-owm-day-602:before {
    content: "\f00a";
  }
  .wi-owm-day-611:before {
    content: "\f006";
  }
  .wi-owm-day-612:before {
    content: "\f006";
  }
  .wi-owm-day-615:before {
    content: "\f006";
  }
  .wi-owm-day-616:before {
    content: "\f006";
  }
  .wi-owm-day-620:before {
    content: "\f006";
  }
  .wi-owm-day-621:before {
    content: "\f00a";
  }
  .wi-owm-day-622:before {
    content: "\f00a";
  }
  .wi-owm-day-701:before {
    content: "\f003";
  }
  .wi-owm-day-711:before {
    content: "\f062";
  }
  .wi-owm-day-721:before {
    content: "\f0b6";
  }
  .wi-owm-day-731:before {
    content: "\f063";
  }
  .wi-owm-day-741:before {
    content: "\f003";
  }
  .wi-owm-day-761:before {
    content: "\f063";
  }
  .wi-owm-day-762:before {
    content: "\f063";
  }
  .wi-owm-day-781:before {
    content: "\f056";
  }
  .wi-owm-day-800:before {
    content: "\f00d";
  }
  .wi-owm-day-801:before {
    content: "\f002";
  }
  .wi-owm-day-802:before {
    content: "\f002";
  }
  .wi-owm-day-803:before {
    content: "\f013";
  }
  .wi-owm-day-804:before {
    content: "\f013";
  }
  .wi-owm-day-900:before {
    content: "\f056";
  }
  .wi-owm-day-902:before {
    content: "\f073";
  }
  .wi-owm-day-903:before {
    content: "\f076";
  }
  .wi-owm-day-904:before {
    content: "\f072";
  }
  .wi-owm-day-906:before {
    content: "\f004";
  }
  .wi-owm-day-957:before {
    content: "\f050";
  }
  .wi-owm-night-200:before {
    content: "\f02d";
  }
  .wi-owm-night-201:before {
    content: "\f02d";
  }
  .wi-owm-night-202:before {
    content: "\f02d";
  }
  .wi-owm-night-210:before {
    content: "\f025";
  }
  .wi-owm-night-211:before {
    content: "\f025";
  }
  .wi-owm-night-212:before {
    content: "\f025";
  }
  .wi-owm-night-221:before {
    content: "\f025";
  }
  .wi-owm-night-230:before {
    content: "\f02d";
  }
  .wi-owm-night-231:before {
    content: "\f02d";
  }
  .wi-owm-night-232:before {
    content: "\f02d";
  }
  .wi-owm-night-300:before {
    content: "\f02b";
  }
  .wi-owm-night-301:before {
    content: "\f02b";
  }
  .wi-owm-night-302:before {
    content: "\f028";
  }
  .wi-owm-night-310:before {
    content: "\f028";
  }
  .wi-owm-night-311:before {
    content: "\f028";
  }
  .wi-owm-night-312:before {
    content: "\f028";
  }
  .wi-owm-night-313:before {
    content: "\f028";
  }
  .wi-owm-night-314:before {
    content: "\f028";
  }
  .wi-owm-night-321:before {
    content: "\f02b";
  }
  .wi-owm-night-500:before {
    content: "\f02b";
  }
  .wi-owm-night-501:before {
    content: "\f028";
  }
  .wi-owm-night-502:before {
    content: "\f028";
  }
  .wi-owm-night-503:before {
    content: "\f028";
  }
  .wi-owm-night-504:before {
    content: "\f028";
  }
  .wi-owm-night-511:before {
    content: "\f026";
  }
  .wi-owm-night-520:before {
    content: "\f029";
  }
  .wi-owm-night-521:before {
    content: "\f029";
  }
  .wi-owm-night-522:before {
    content: "\f029";
  }
  .wi-owm-night-531:before {
    content: "\f02c";
  }
  .wi-owm-night-600:before {
    content: "\f02a";
  }
  .wi-owm-night-601:before {
    content: "\f0b4";
  }
  .wi-owm-night-602:before {
    content: "\f02a";
  }
  .wi-owm-night-611:before {
    content: "\f026";
  }
  .wi-owm-night-612:before {
    content: "\f026";
  }
  .wi-owm-night-615:before {
    content: "\f026";
  }
  .wi-owm-night-616:before {
    content: "\f026";
  }
  .wi-owm-night-620:before {
    content: "\f026";
  }
  .wi-owm-night-621:before {
    content: "\f02a";
  }
  .wi-owm-night-622:before {
    content: "\f02a";
  }
  .wi-owm-night-701:before {
    content: "\f04a";
  }
  .wi-owm-night-711:before {
    content: "\f062";
  }
  .wi-owm-night-721:before {
    content: "\f0b6";
  }
  .wi-owm-night-731:before {
    content: "\f063";
  }
  .wi-owm-night-741:before {
    content: "\f04a";
  }
  .wi-owm-night-761:before {
    content: "\f063";
  }
  .wi-owm-night-762:before {
    content: "\f063";
  }
  .wi-owm-night-781:before {
    content: "\f056";
  }
  .wi-owm-night-800:before {
    content: "\f02e";
  }
  .wi-owm-night-801:before {
    content: "\f081";
  }
  .wi-owm-night-802:before {
    content: "\f086";
  }
  .wi-owm-night-803:before {
    content: "\f013";
  }
  .wi-owm-night-804:before {
    content: "\f013";
  }
  .wi-owm-night-900:before {
    content: "\f056";
  }
  .wi-owm-night-902:before {
    content: "\f073";
  }
  .wi-owm-night-903:before {
    content: "\f076";
  }
  .wi-owm-night-904:before {
    content: "\f072";
  }
  .wi-owm-night-906:before {
    content: "\f024";
  }
  .wi-owm-night-957:before {
    content: "\f050";
  }

.weather-content .manana{
  display: inline-block;
  width: calc(100% - 4px);
  margin-right: 4px;
}