/* Table of Contents - ToC
  - main class of the widget
  - row of the post
    - image of the post
    - text of the post
    - clearfix
*/

.wfpw{
  .wfpw-row{
    // row
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin-bottom: 1rem;
    // end

    // img
      .wfpw-img{
        // img basic
          -ms-flex: 0 0 25%;
          flex: 0 0 25%;
          max-width: 25%;
          margin-right: 1rem;
          position: relative;
          overflow: hidden;
        // end

        // sizes
          &.full{
            -ms-flex: 0 0 100%;
            flex: 0 0 100%;
            max-width: 100%;
            margin-right: 0rem;
            margin-bottom: 1rem;
            .wfpw-img-file{ padding-top: 56.5% !important }
          }
          &.no{ display: none }
        // end

        // file
          .wfpw-img-file{
            padding-top: 100%;
            width: 100%;
            background-size: cover;
            background-position: center;
          }
        // end

        // num
          .wfpw-num{
            display: block;
            min-width: 1rem;
            padding: 2.5px 6px;
            font-size: 75%;
            text-align: center;
            position: absolute;
            top: 0; left: 0; z-index: 1;
            background: #000 !important;
            color: #fff !important;
          }//.wfpw-num
        // end

      }//.wfpw-img
    // end

    // text
      .wfpw-text{
        // basic
          -ms-flex-preferred-size: 0;
          flex-basis: 0;
          -ms-flex-positive: 1;
          flex-grow: 1;
          max-width: 100%;
          *{ margin: 0; padding: 0; }
        // end

        // date
          .wfpw-date{
            display: block;
            font-size: 75%;
            margin-top: .25rem;
          }
        // end

        // title
          .wfpw-title{
            font-size: initial;
          }
        // end
      }//.wfpw-text
    // end

    // clearfix
      &::after{
        content: "";
        clear: both;
        display: table;
      }
    //end
  }//.wfpw-row
}//.wfpw