@import "variables";

// Right Sidebar

#side
{

  .add_resume
  {
    display         : block;
    background      : #4fa6d8;
    height          : 26px;
    @include font(12, 26, bold);
    color           : #fff;
    text-align      : center;
    margin-bottom   : 1px;
    text-decoration : none;
  }

  .block
  {
    background : #eaf7ff;
    padding    : 0 3px;

    & a
    {
      display         : block;
      font-size       : 11px;
      color           : #3d4143;
      line-height     : 25px;
      text-decoration : none;

      &:first-child
      {
        border-bottom : 1px solid #cbe7f7;
      }

      & span
      {
        display    : block;
        padding    : 0 22px 0 30px;
        background : url($image_dir + "attention.png") no-repeat 171px center;
      }

      &.side_form
      {
        background : url($image_dir + "side_form.png") no-repeat 6px center;
      }

      &.side_video
      {
        background : url($image_dir + "side_video.png") no-repeat 6px center;
      }
    }
  }

  .recl_block
  {
    margin-top : 17px;
    border     : 1px solid #34a7ea;

    & > a
    {
      display         : block;
      background      : #4fa6d8;
      @include font(11, 21);
      color           : #fff;
      text-decoration : none;
      text-align      : center;
    }

    & img
    {
      max-width : 193px;
    }

    & .zag
    {
      display        : table-cell;
      vertical-align : middle;
      background     : #4fa6d8;
      @include font(12, 14, bold);
      color          : #fff;
      text-align     : center;
    }

    & .scroll
    {
      padding-left : 7px;
      overflow     : auto;

      & div.pop_block
      {
        padding      : 12px 0;
        margin-right : 6px;
        border-top   : 3px solid #e7e7e7;

        &:first-child
        {
          border-top : 0;
        }

        & a
        {
          @include font(11, 14, bold);
          color : #005e94;

          &.more
          {
            font-weight : normal;
            color       : #1581bf;
          }
        }

        & div
        {
          @include font(11, 13);
          color   : #3d4143;
          padding : 2px 0 0;
        }
      }
    }
  }

  .button_red
  {
    display         : block;
    text-decoration : none;
    text-align      : center;
    background      : #e27767;
    height          : 40px;
    @include font(11, 40);
    color           : #fff;
    margin          : 12px 0 7px;
  }

  .block_percent
  {
    background : #f4f4f4;
    color      : #2d2d2d;
    @include font(11, 14);
    padding    : 10px 10px;
    overflow   : hidden;

    & b
    {
      font-size : 12px;
    }

    & > div
    {
      margin     : 10px 0 20px;
      border     : 1px solid #7abcf1;
      background : #ff9f54;
      height     : 14px;
      text-align : center;
      position   : relative;

      & div
      {
        width      : 0;
        height     : 14px;
        background : #7abcf1;
      }

      & span
      {
        position : absolute;
        left     : 0;
        top      : 0;
        width    : 100%;
        @include font(13, 14, bold);
        color    : #fff;
        z-index  : 100;
      }
    }
  }

  .vsp_cat
  {
    display         : block;
    padding         : 9px;
    text-align      : center;
    border          : 1px solid #d6d6d6;
    border-radius   : 5px;
    color           : #585858;
    @include font(12, 14);
    margin          : 15px 0;
    position        : relative;
    text-decoration : none;

    & span
    {
      display    : block;
      position   : absolute;
      bottom     : -15px;
      left       : 25px;
      z-index    : 100;
      width      : 29px;
      height     : 15px;
      background : url($image_dir + "vsp_cat.png") no-repeat 0 0;
    }
  }

  .predl_komp
  {
    border : 1px solid #6dc1f2;

    & .zag
    {
      text-align : center;
      color      : #fff;
      @include font(12, 33);
      background : #4fa6d8;
    }

    & .bottom
    {
      text-align : center;
      color      : #fff;
      @include font(12, 22);
      background : #4fa6d8;

      & a
      {
        color           : #fff;
        text-decoration : none;
        display         : block;
      }
    }

    & .content
    {
      padding    : 5px;
      overflow-y : scroll;

      & a
      {
        display         : block;
        color           : #1581bf;
        @include font(11, 24);
        padding         : 0 10px;
        text-decoration : none;

        &.active,
        &:hover
        {
          background      : #ebf7fe;
          text-decoration : none;
          font-weight     : bold;
        }

        & span
        {
          color : #6e6e6e;
        }

        &.premium
        {
          padding-bottom : 5px;
          border-bottom  : 3px solid #999;
          position       : relative;
          margin         : 10px 0;

          & span
          {

            &.top_line
            {
              display    : block;
              position   : absolute;
              width      : 132px;
              top        : 0;
              left       : 10px;
              padding    : 0 5px 0 10px;
              @include font(11, 20);
              color      : #fff;
              background : #f00;

              & .ic_foto
              {
                float        : right;
                padding-left : 13px;
                color        : #fff;
                background   : url($image_dir + "ic_foto.png") no-repeat 0 center;
              }
            }

            &.a
            {
              text-decoration : underline;
              color           : #006290;
              @include font(12, 18, bold);
            }
          }

          & > img
          {
            max-width     : 148px;
            border-bottom : 3px solid #e57768;
          }
        }
      }
    }
  }
}

// /Right Sidebar