@import "variables";

// Авторизация и регистрация

.panel-heading
{
  @include font(18, 26, bold);
  color         : #e27767;
  margin-bottom : 5px;
}

.panel-body
{
  background : #f7f7f7;
  padding    : 40px 30px 30px;

  & table
  {
    & td
    {
      padding : 0 0 10px;
      @include font(12, 35);
      color   : #7d7d7d;

      &:first-child
      {
        padding-right : 30px;
      }

      & input[type="password"],
      & input[type="number"],
      & input[type="email"],
      & input[type="text"]
      {
        width   : 230px;
        height  : 33px;
        border  : 1px solid #D7D7D7;
        @include font(12, 13);
        color   : #393939;
        padding : 0 10px;

        &.code
        {
          width      : 108px;
          margin-top : 10px;
        }
      }

      & span
      {
        line-height    : 12px;
        display        : inline-block;
        vertical-align : top;

        & a
        {
          color       : #3396D0;
          font-size   : 11px;
          line-height : 12px;
          padding     : 0;
        }
      }

      & input[type="radio"],
      & label
      {
        margin      : 0 7px 0 0;
        float       : left;
        line-height : 12px;
      }

      & input[type="checkbox"]
      {
        @extend & span;
        margin : 0 4px 0 0;
      }

      & a
      {
        @extend & td;
        padding        : 0 0 0 15px;
        display        : inline-block;
        vertical-align : top;
      }

      & button[type="submit"]
      {
        width      : 108px;
        height     : 30px;
        cursor     : pointer;
        @include font(12, 26);
        color      : #FFF;
        text-align : center;
        background : #41B682;
        border     : 1px solid #1581BF;
      }

      & .block_code
      {
        width      : 114px;
        float      : left;
        text-align : center;
        margin     : 0 6px 0 0;

        & img
        {
          width  : 114px;
          height : 57px;
        }
      }
    }
  }
}

// /Авторизация и регистрация

// Search

.search_out
{
  border : 1px solid #6bc1f2;
  height : 26px;
  //  margin-bottom : 20px;

  & > div
  {
    float : left;

    & input,
    & select
    {
      width      : 100%;
      @include font(12, 24);
      color      : #9c9c9c;
      border     : none;
      background : none;
      padding    : 0;
      margin     : 0;
    }

    &.input
    {
      width   : 540px;
      padding : 1px 6px;

      & input[type="text"]
      {
        border-right  : 1px solid #6bc1f2;
        padding-right : 10px;
      }
    }

    &.select
    {
      width   : 110px;
      padding : 1px 10px 0;

      & .select-outer
      {
        overflow : hidden;
        position : relative;

        & select
        {
          width    : 125px;
          height   : 24px;
          position : relative;
          z-index  : 100;
          cursor   : pointer;
        }
      }

      & .select-button
      {
        background : url($image_dir + "search_select.png") no-repeat 2px center;
        height     : 24px;
        width      : 10px;
        position   : absolute;
        right      : 0;
        bottom     : 0;
        z-index    : 50;
      }
    }

    &.submit
    {
      width  : 86px;
      height : 26px;

      & input[type="submit"]
      {
        height     : 26px;
        background : #e27767 url($image_dir + "search_icon.png") no-repeat center;
        cursor     : pointer;
      }
    }
  }
}

.search
{
  padding       : 20px;
  border        : 1px solid #e7e7e7;
  margin-bottom : 1px;

  & textarea
  {
    border : 1px solid #969696;
  }

  & input
  {
    border : 1px solid #969696;

    &[type="text"],
    &[type="number"]
    {
    }

    &[type="checkbox"],
    &[type="radio"]
    {
    }

    &[type="submit"]
    {
      border     : 0;
      background : #e27767;
      padding    : 10px;
      @include font(12, 14);
      color      : #fff;
    }
  }
}

.search_line
{
  height     : 9px;
  background : #e7e7e7;
  padding    : 5px 0 0;
  cursor     : pointer;

  & div
  {
    background : #fff;
    width      : 54px;
    height     : 5px;
    margin     : 0 auto;
  }
}

// /Search

// Category on Main

.category_on_main
{
  & .main_category
  {
    background : #9bdaff;
    height     : 107px;
    position   : relative;

    & > div
    {
      float         : left;
      width         : 106px;
      height        : 100px;
      border-bottom : 7px solid;
      text-align    : center;
      background    : no-repeat 0 0;

      $i : 0;

      @each $col in c1, c2, c3, c4, c5, c6, c7
      {
        $i : $i + 1;
        $ii : $i - 1;

        &.#{$col}
        {
          border-bottom-color : nth($colors, $i);

          & .subcats
          {
            border : 3px solid nth($colors, $i);

            & table td a.cc
            {
              color   : nth($colors, $i);
              outline : 1px dashed nth($colors, $i);
            }

            & table td a:hover
            {
              color : nth($colors, $i);
            }
          }
        }

      }

      & + div
      {
        margin-left : 4.6px;

        &.adding
        {
          margin-left : 1.3px;
        }
      }

      &:hover div.subcats
      {
        display : block;
      }

      & > a
      {
        display         : block;
        height          : 30px;
        padding-top     : 70px;
        position        : relative;
        color           : #fff;
        @include font(11, 12);
        text-decoration : none;
        text-shadow     : 1px 1px 0 #000;

        & span
        {
          display     : block;
          width       : 22px;
          height      : 22px;
          position    : absolute;
          top         : 0;
          right       : 0;
          background  : #4fa6d9;
          text-align  : center;
          @include font(9, 22);
          text-shadow : none;
        }
      }

      & div.subcats
      {
        display    : none;
        padding    : 0 6px;
        background : #fff;
        position   : absolute;
        top        : 107px;
        left       : 0;
        z-index    : 1000;
        width      : 752px;
        overflow   : hidden;
        text-align : left;

        & table
        {
          width : 32%;
          float : left;

          & + table
          {
            margin-left : 14px;
          }

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

          & td
          {
            border-top : 1px solid #e7e7e7;

            & a
            {
              display         : block;
              @include font(12, 29);
              color           : #3f3f3f;
              padding-left    : 5px;
              text-decoration : none;

              & span
              {
                color        : #9c9c9c;
                padding-left : 4px;
              }
            }
          }
        }
      }
    }
  }

  & .sub_main
  {
    padding       : 25px 10px 15px;
    border-left   : 1px solid #6bc1f2;
    border-right  : 1px solid #6bc1f2;
    border-bottom : 1px solid #6bc1f2;
    margin-bottom : 20px;

    & > div
    {
      display        : inline-block;
      vertical-align : top;
      width          : 290px;
      padding        : 11px 11px 11px 54px;
      border         : 1px dashed transparent;
      background     : no-repeat 10px -190px;
      margin         : 0 7px;

      &:hover
      {
        border              : 1px dashed #e8e8e8;
        background-position : 10px -290px;

        & > a
        {
          color : #e27767;
        }
      }

      & > a
      {
        @include font(12, 14, bold);
        color           : #1581bf;
        margin-bottom   : 3px;
        text-decoration : none;
      }

      & .subss
      {
        max-height : 54px;
        overflow   : hidden;

        & a
        {
          color           : #3f3f3f;
          @include font(12, 14);
          text-decoration : none;

          &:hover
          {
            text-decoration : underline;
          }
        }
      }
    }
  }
}

// /Category on Main

// News on Main

.news_on_main
{
  border-top    : 6px solid #55b6ee;
  border-bottom : 6px solid #cce0ff;
  padding       : 1px 0;
  height        : 183px;
  position      : relative;
  overflow      : hidden;

  & .str
  {
    background : rgba(85, 182, 238, 0.8) url($image_dir + "news_str.png") no-repeat center;
    width      : 18px;
    height     : 183px;
    position   : absolute;
    top        : 1px;
    z-index    : 100;
    cursor     : pointer;

    &.str_l
    {
      left                : 0;
      background-position : 0 center;
    }

    &.str_r
    {
      right               : 0;
      background-position : -18px center;
    }
  }

  & .news_block
  {
    float  : left;
    margin : 0 0 1px 1px;

    & .image
    {
      border-bottom : #b3cfdf;
    }

    &.type-small
    {
      & .image
      {
        width  : 192px;
        height : 72px;
      }
    }

    &.type-middle
    {
      & .image
      {
        width  : 305px;
        height : 72px;
      }
    }

    &.type-big
    {
      & .image
      {
        width  : 273px;
        height : 164px;
      }
    }

    & .line
    {
      height     : 18px;
      background : #005e94 url($image_dir + "news_more.png") no-repeat top right;
      @include font(9, 18);
      color      : #fff;

      & .more
      {
        @include font(9, 18);
        color          : #fff;
        text-transform : uppercase;
        padding-right  : 5px;
        float          : right;
      }
    }
  }
}

// /News on Main