/* Theme default */
/* ======= Widgets Page ========= */
.widget-wrapper {
  margin-bottom: 30px;
}
.widget .widget-inner {
  background: #fff;
  border-radius: 4px;
  background-clip: padding-box;
}
.widget-sm .chart-container {
  background: #b1e3e5;
  height: 90px;
  position: relative;
}
.widget-sm .chart-container svg {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.widget-sm .info-container {
  background: #fff;
  padding: 15px;
}
.widget-sm .info-container .intro {
  color: #a2a6af;
  margin-bottom: 10px;
}
.widget-sm .info-container .title {
  margin-top: 0;
  margin-bottom: 0;
}
.widget-sm .info-container .title span {
  display: inline-block;
}
.widget-sm .info-container .title .figure {
  color: #40babd;
  font-size: 32px;
  margin-top: 0;
  margin-bottom: 0;
  margin-bottom: 5px;
  margin-right: 5px;
}
.widget-sm .info-container .title .note {
  color: #a2a6af;
  font-size: 14px;
}
.widget-sm-a .chart-container {
  background: #dff0e1;
}
.widget-sm-a .info-container .title .figure {
  color: #75c181;
}
.widget-sm-b .chart-container {
  background: #e3f4fc;
}
.widget-sm-b .info-container .title .figure {
  color: #58bbee;
}
.widget-sm-c .chart-container {
  background: #fef5eb;
  text-align: center;
}
.widget-sm-c .chart-container svg {
  position: static;
}
.widget-sm-c .info-container .title .figure {
  color: #F8A13F;
}
.widget-sm-d .chart-container {
  background: #d7f1f2;
  text-align: center;
  min-height: 100%;
}
.widget-sm-d .chart-container svg {
  position: static;
}
.widget-sm-d .info-container .title .figure {
  color: #40babd;
}
.widget-xs .widget-inner {
  overflow: hidden;
  background: #339597;
}
.widget-xs .chart-container {
  float: left;
  display: inline-block;
  width: 30%;
  padding: 15px;
  padding-top: 35px;
  text-align: center;
}
.widget-xs .chart-container .sparkline {
  display: inline-block;
}
.widget-xs .icon-container {
  float: left;
  display: inline-block;
  width: 30%;
  padding: 15px;
  padding-top: 20px;
  text-align: center;
}
.widget-xs .icon-container .icon {
  font-size: 46px;
  color: #fff;
}
.widget-xs .info-container {
  background: #40babd;
  padding: 1px;
  float: left;
  display: inline-block;
  width: 70%;
}
.widget-xs .info-container .title {
  margin-top: 0;
  margin-bottom: 0;
}
.widget-xs .info-container .title span {
  display: block;
}
.widget-xs .info-container .title .figure {
  color: #fff;
  font-size: 32px;
  margin-top: 0;
  margin-bottom: 0;
  margin-bottom: 5px;
  margin-right: 5px;
}
.widget-xs .info-container .title .note {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
}
.widget-xs-a .widget-inner {
  background: #e27c08;
}
.widget-xs-a .info-container {
  background: #F8A13F;
}
.widget-xs-b .widget-inner {
  background: #179de2;
}
.widget-xs-b .info-container {
  background: #58bbee;
}
.widget-xs-c .widget-inner {
  background: #d61a6c;
}
.widget-xs-c .info-container {
  background: #EA5395;
}
.widget-xs-d .widget-inner {
  background: #5c2b70;
}
.widget-xs-d .info-container {
  background: #8A40A7;
}
.widget-event .figure-container {
  position: relative;
}
.widget-event .figure-container .mask {
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 30px;
  color: #fff;
}
.widget-event .figure-container .mask:hover {
  background: rgba(0, 0, 0, 0.7);
}
.widget-event .figure-container .mask a {
  color: #fff;
}
.widget-event .figure-container .mask .title {
  color: #fff;
  font-size: 18px;
  padding-bottom: 5px;
  font-weight: bold;
  max-width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.widget-event .figure-container .mask .date {
  font-size: 14px;
}
.widget-event .figure-container .mask .likes {
  color: rgba(255, 255, 255, 0.8);
}
.widget-event .figure-container .mask .members {
  position: absolute;
  bottom: 30px;
}
.widget-event .figure-container .mask .members ul {
  margin-bottom: 0;
}
.widget-event .figure-container .mask .members .note {
  margin-bottom: 10px;
  color: rgba(255, 255, 255, 0.8);
  font-weight: bold;
}
.widget-event .figure-container .mask .members img {
  width: 36px;
  height: 36px;
}
.widget-profile .banner-container {
  position: relative;
}
.widget-profile .banner-container .mask {
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 15px;
  color: #fff;
}
.widget-profile .banner-container .mask .name {
  float: left;
  display: inline-block;
  font-weight: bold;
  margin-top: 0;
}
.widget-profile .banner-container .mask .name a {
  color: rgba(255, 255, 255, 0.8);
}
.widget-profile .banner-container .mask .name a:hover {
  color: #fff;
}
.widget-profile .banner-container .mask .btn {
  float: right;
}
.widget-profile .banner-container .mask a {
  color: #fff;
}
.widget-profile .banner-container .mask .profile-image {
  position: absolute;
  left: 50%;
  margin-left: -40px;
  bottom: -30px;
}
.widget-profile .info-container {
  padding: 15px;
  padding-top: 45px;
}
.widget-profile .info-list {
  display: inline-block;
}
.widget-profile .info-list li {
  margin-bottom: 5px;
}
.widget-profile .footer ul {
  /* OLD - iOS 6-, Safari 3.1-6 */
  /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  text-align: center;
  position: relative;
}
.widget-profile .footer ul li {
  -webkit-box-flex: 1;
  /* OLD - iOS 6-, Safari 3.1-6 */
  -moz-box-flex: 1;
  /* OLD - Firefox 19- */
  width: 20%;
  /* For old syntax, otherwise collapses. */
  /* Chrome */
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  display: inline-block;
  padding: 15px;
}
.widget-profile .footer ul li.item-1 {
  background: #75c181;
}
.widget-profile .footer ul li.item-2 {
  background: #EA5395;
}
.widget-profile .footer ul li.item-3 {
  background: #F8A13F;
}
.widget-profile .footer ul li a {
  color: rgba(0, 0, 0, 0.5);
  font-weight: bold;
}
.widget-profile .footer ul li a:hover {
  color: #fff;
  text-decoration: none;
}
.widget-profile .footer ul li a .icon {
  font-size: 28px;
  display: inline-block;
  margin-right: 5px;
}
.widget-weather .banner-container {
  position: relative;
}
.widget-weather .banner-container .mask {
  background: rgba(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 15px;
  padding-top: 20%;
  color: #fff;
}
.widget-weather .banner-container .mask .name {
  font-weight: bold;
  margin-top: 0;
  margin-bottom: 10px;
  text-align: center;
}
.widget-weather .banner-container .mask .name a {
  color: rgba(255, 255, 255, 0.8);
}
.widget-weather .banner-container .mask .name a:hover {
  color: #fff;
  text-decoration: none;
}
.widget-weather .banner-container .mask .figure {
  font-size: 48px;
  text-align: center;
  margin-top: 0;
  font-weight: 300;
}
.widget-weather .banner-container .mask .figure .unit {
  font-size: 26px;
  vertical-align: super;
}
.widget-weather .info-panel {
  padding: 15px;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 30%;
  padding: 30px;
  text-align: center;
}
.widget-weather .info-panel .wi {
  font-size: 36px;
  margin-bottom: 10px;
}
.widget-weather .info-panel p {
  color: rgba(255, 255, 255, 0.8);
}
.widget-weather .info-panel p:last-child {
  margin-bottom: 0;
}
/* Extra small devices (phones, less than 768px) */
@media (max-width: 767px) {
  .widget-weather .info-panel .wi {
    font-size: 18px;
  }
}
/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
/* Large devices (large desktops, 1200px and up) */