/**
 * Базовые стили для всех копомпонентов Clearfy

 * @author Webcraftic <wordpress.webraftic@gmail.com> 
 * @copyright Webcraftic 06.10.2018
 * @sicne 2.0.5
 */

.button(@backgroundColor: #e8e8e8,@color:#353535, @boxShadow:rgba(0, 0, 0, 0.2)) {
  cursor: pointer;
  line-height: 16px;
  font-size: 13px;
  font-weight: 600;
  padding: 12px 20px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  color: @color;
  background: @backgroundColor;
  box-shadow: 0 1px 0 @boxShadow;
  -moz-box-shadow: 0 1px 0 @boxShadow;
  -webkit-box-shadow: 0 1px 0 @boxShadow;
  &:active {
    box-shadow: inset 0 1px 0 @boxShadow;
    -moz-box-shadow: inset 0 1px 0 @boxShadow;
    -webkit-box-shadow: inset 0 1px 0 @boxShadow;
  }
  &:focus {
    outline: none;
    border: 0;
  }
}

#WBCR {

  .wbcr-factory-pages-000-impressive-page-template {
    .wbcr-factory-clearfy-000-multisite-suggetion {
      padding: 30px 80px;

      h3 {
        margin: 0 0 20px;
      }

      .wbcr-factory-inner-contanier {
        border: 2px dashed #8bc34a;
        background: #fff;
        padding: 20px;
      }

      .wbcr-factory-activate-premium {
        display: inline-block;
        .button();
      }
      .wbcr-factory-purchase-premium {
        display: inline-block;
        .button(#fdd868, #755c0e, rgba(60, 45, 2, 0.31));
      }
    }

    .wbcr-factory-right-sidebar-section {
      .wbcr-factory-clearfy-000-pro-suggettion {
        background: #fff;
        color: #353535;
        font-weight: 600;
        border: 2px dashed #8bc34a;

        h3 {
          margin: 0 0 20px;
          padding: 10px 0;
          text-align: center;
          border-bottom: 2px solid #e6e6e6;
          color: #636363;
          font-size: 17px;
          font-weight: 600;
          vertical-align: middle;
          text-transform: uppercase;
        }

        ul {
          //list-style: circle;
          position: relative;
          margin-bottom: 20px;

          li {
            font-size: 15px;
            padding: 7px;
            padding-left: 20px;
            &:before {
            }

            &:before {
              content: " ";
              display: inline-block;
              width: 0.4em;
              height: 0.7em;
              border: solid #8bc34a;
              border-width: 0 0.2em 0.2em 0;
              left: 0;
              margin-right: 10px;
              -webkit-transform: rotate(45deg);
              -moz-transform: rotate(45deg);
              -o-transform: rotate(45deg);
              transform: rotate(45deg);
            }

          }
        }

        .wbcr-factory-purchase-premium {
          display: block;
          .button();
        }
      }
    }
  }
}

@media screen and (max-width: 1550px) {
  #WBCR {
    .wbcr-factory-pages-000-impressive-page-template {
      .wbcr-factory-clearfy-000-multisite-pro-suggetion {
        padding: 10px 80px;
      }

      .wbcr-factory-right-sidebar-section {
        .wbcr-factory-clearfy-000-pro-suggettion {
          padding: 10px;

          h3 {
            margin: 0 0 20px;
            padding: 10px 0;
            font-size: 13px;
            font-weight: 600;
          }

          ul {
            margin-bottom: 20px;

            li {
              font-size: 13px;
              padding: 2px;
              padding-left: 10px;

              &:before {
                width: 0.4em;
                height: 0.7em;
                border-width: 0 0.2em 0.2em 0;
                left: 0;
                margin-right: 10px;
              }
            }
          }

          .wbcr-factory-purchase-premium {
            font-weight: 700;
            line-height: 16px;
            font-size: 12px;
            padding: 8px 12px;
            border-radius: 2px;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
          }
        }
      }
    }
  }
}