@import "vars";
@import "mixins";

.wrapper  {
  position: relative;
  margin: auto;
  max-width: 1160px;
  min-height: 100%;
  height: 100%;
}

.main {
  background-color: $light;
  color: $medium;
  height: auto;
  top: 80px !important;
  bottom: 0;
  position: absolute;

  > .overflow-y-scroll {
    background-color: $light;
    height: 100%;
  }

  .header {
    @include clearfix();
    position: relative;
    z-index: 500;
    min-height: 60px;
    margin: 40px;

    .header-main {
      height: 60px;
      @include clearfix();
    }

    .header-center {
      text-align: center;
      pointer-events: none;
      z-index: 5000;
      position: absolute;
      width: 100%;
      top: 0;
      * {pointer-events: auto; }
      ul {
        margin: auto;
        display: block;
        vertical-align: middle;
        list-style: none;
        padding-left: 0px;
      }
      .profile-avatar {
        margin: auto;
        display: block;
        margin-top: -80px;
        img {
          border-radius: 100%;
        }
      }
    }

    .header-center  > ul li span { padding-left: 5px; padding-right: 5px;}
    .header-left  > ul li span { padding-right: 10px;}
    .header-right > ul li span { padding-left: 10px;}

    .header-center,
    .header-right,
    .header-left {
      height: 60px;
      line-height: 60px;
    }

    .header-right {
      float: right;
      @include transition( all 0.25s ease-in-out);
      @include translateX (0px);
    }

    .header-left {
      float: left;

      > h4 {
        vertical-align: middle;
        display: inline-block;
      }
    }
  }
  
  .content {
    margin: 40px;
    //@include transition( all 0.25s ease-in-out);
    .section {
      border-bottom: 2px solid rgba(0,0,0,0.04);
      margin-bottom: 80px;
      padding-bottom: 80px;
      @include clearfix();
      &:last-child {
        border-bottom: none;
      }

      form {
        // border-radius: $radius;
        //   background-color: white;
        // display: block;
        // padding: 40px;
      }
    }
    .img {
      img {
        border-radius: $radius;
      }
      margin-right: 20px;
      position: relative;
      .btn {
        position: absolute;
        top: 0px;
        right: 0px;
      }
    }
  }
}