glittergallery/GlitterGallery

@media screen and (min-width: 60.063em){
  body{
    .wrapper{
      aside.widget{
        section{
          @include span(1);
          @include center;
          margin: 1em auto;
          @include border-radius(0.5em);
          box-shadow:inset 0 0 0.125em 0 $map_blue;
          background-color: white;
          width: 80%;
          height: 100%;
          padding: 0.75em;
          header{
            margin: 0;
            padding: 0.25em;
            background-color: $geometry_gray;
            color: $map_blue;
            font-weight:700;
            font-size:0.75em;
            h1{
              font-size: 1.5em;
            }
            h2{
              color: gray;
              font-size: 1em;
            }
          }
          article{
            min-height: initial;
            @include col(1);
            font-size: 0.85em;
            p{
              @include col(1/3);
              text-align: center;
              a{
                text-decoration: none;
                color: $map_blue;
              }
              a:hover{
                text-decoration: underline;
              }
            }

            ul{
              list-style-type: none;
              margin: 0;
              font-size: 0.8em;
              li{
                  margin: 0.25em auto;
                  font-size: 1.2em;
                a{
                  text-decoration:none;
                  color: $map_blue;
                }
                a:hover{
                  text-decoration: underline;
                }
              }
            }
          }
          footer{
            @include col(1);
            form{
              padding: 0;
              @include col(1/3);
              text-align: center;
              background-color: white;
              a{
                text-decoration: none;
                color: white;
              }
            }
          }
        }
      }
    }
  }
}


@media screen and (min-width: 60.063em){
  body{
    .wrapper{
      aside.widget{
        text-align: left;
        min-height: 100vh;
        div.asidewrapper{
          margin-top: 3em;
          header{
            h1{
              font-size: 1em;
            }
            h2{
              font-size: 1em;
              font-weight: 300;
              border-bottom: solid 0.1em $dark_geometry_gray;
              margin-bottom: 0.5em;
            }
          }
        }
      }
    }
  }
}

@media screen and (min-width: 64.063em){
  body{
    .wrapper{
      aside.widget{
        section{
          span.badge{
            display: initial;
          }
        }
      }
    }
  }
}