IcaliaLabs/sabisu-rails

.main-content {
  border-left: 1px solid darken(#F5F5F5, 5%);
  background: #FFF;
  padding: 30px;
}

.navigation {
  &.side {
    height: 100%;
    padding: 0;
    .header {
      background: #EA5D5F;
      border: 1px solid darken(#EA5D5F, 4%);
      padding-left: 20px;
      padding-top: 50px;
      padding-bottom: 10px;

      &:hover {
        background: #EA5D5F;
        border: 1px solid darken(#EA5D5F, 4%);
      }
    }

    li {
      padding-left: 20px;
      cursor: pointer;
      &:hover {
        background: #7BD5D3; 
      }
    }

    li.active {
      position: relative;
      background: #7BD5D3; 
      border: 1px solid darken(#7BD5D3, 4%);

      &:after {
        content: '';
        position: absolute;
        right: -2px;
        top: 12px;
        width: 0; 
        height: 0; 
        border-top: 12px solid transparent;
        border-bottom: 12px solid transparent; 

        border-right:12px solid #FFF;
      }
    }
  }
}

.nomargin {
  margin: 0;
}

fieldset {
  border: none;
  padding: 0 0 8px 0;
  margin-top: 15px;
  color: #555;
  text-transform: uppercase;

  legend {
    border-bottom: 1px solid rgba(#b3b3b3, 0.5);
    display: block;
    width: 100%;
    padding-bottom: 8px;
  }
}

.button {
  &.danger {
    color: #777; 
  }
}

.navigation {
  &.inline {
    border-top: 1px solid #CCC;
    padding: 0;
    li {
        border-right: 1px solid #CCC;
        padding: 6px 10px;
        border-bottom: 1px solid #CCC;

      &:first-child {
        border-left: 1px solid #CCC;
      }
      a {
        padding: 6px 10px;
        font-weight: bold;
        font-size: px-to-rems(14);
      }

      &.active {
        border-bottom: 1px solid #FFF;
      }
    }
  }
}

.response-details {
  float: right;
  padding-right: 25px;
  .navigation {
    &.inline {
      li {
        border-right: none;
        border-bottom: none;
        color: #777;

        &:first-child {
          border-left: none;
        }
      }
    }
  }
}

.response-wrapper {
  padding-right: 10px;
  margin-top: 20px;
}

.text-strong {
  font-weight: bold;
}

.headers {
  span {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 13px;
  }

  i.fa {
    margin: 0 8px;
  }
}