@import "compass";
@import "vendor/normalize";
@import "provider/logo";
@import "compass/css3/box";
$width: 40em;
$padding: 1em;
$wrapper-padding: 3em;
$border-color: gray;

html,body {
  width: 100%;
  height: 100%;
}

.center {
  @include display-flex;
  @include flex-direction(row);
  @include justify-content(center);
  @include align-items(center);
}

body {
  @extend .center;
}

#wrapper {
  padding: $wrapper-padding;

  max-width: $width;

  //min-height: 35%;

  margin: 5em auto;

  border: 1px solid $border-color;
  @include border-radius(0.5em);

  position: relative;
}

#content {
  padding: $padding;
}

#footer {
  margin-top: 2em;

  padding: 1.5em $wrapper-padding 1.65em $wrapper-padding;
  margin-left: -$wrapper-padding;
  margin-bottom: -$wrapper-padding;

  border-top: 1px solid $border-color;
  width: 100%;

  & > ul {
    @include horizontal-list;

    a {
      @include inline-block;
    }
    img {
      vertical-align: middle;
    }

    .last {
      float: right;
    }
  }
}

.powered-by-3scale {
  font-size: 12px;
  text-decoration: none;
  line-height: 1.5;

  a {
    text-decoration: none;
    color: $border-color;
  }
}

.logo-3scale {
  float: none;
  padding: 0;
  margin: 0 0 0 0;
}
