.wp-block-guten-post-layout-post-grid {
  *, ::after, ::before {
	box-sizing: border-box;
  }
}
.components-panel__body>.components-panel__body>.components-panel__body-title>.components-panel__body-toggle {
  padding: 10px 10px 10px 30px;
}
.gpl-free-icon{
  .cls-1{opacity:0.8;}.cls-2{fill:#ff5600;}.cls-3{opacity:0.5;}
}
.gpl-pro-icon{
  .cls-1{fill:#ce3f00;}.cls-2,.cls-6{fill:#ff5600;}.cls-3{fill:#c4c4c4;}.cls-4{fill:#b20000;}.cls-5{fill:#fff;}.cls-6{opacity:0.6;}.cls-7{fill:red;}
}
.grid_skin1_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.grid_skin2_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.grid_skin3_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.grid_skin4_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.slider_skin1_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.slider_skin2_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;opacity:0.5;}.cls-3{fill:none;stroke:#a81b1b;stroke-miterlimit:10;stroke-width:4px;}
}
.slider_skin3_layout_icon{
  .cls-1{fill:#bfbfbf;}
}
.slider_skin4_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.slider_skin5_layout_icon{
  .cls-1{fill:#bfbfbf;fill-rule:#bfbfbf;}
}
.slider_skin6_layout_icon{
  .cls-1{fill:#bfbfbf;fill-rule:#bfbfbf;}
}
.masonry_grid1_layout_icon{
  .cls-1{fill:#bfbfbf;}.cls-2{fill:#bfbfbf;}
}
.gpl-select-panel{
  span{
    display: block;
  }
}
.gpl-pro-feature-list{
  ul{
    display: block;
    padding: 30px 30px;
    margin: 0;
    list-style: disc;
    li{
      font-size: 14px;
      &:last-child{
        list-style: none;
      }
      span{

      }
      a{
        padding: 10px;
        background-color: #099E30;
        display: block;
        text-align: center;
        width: 40%;
        margin-right: auto;
        margin-top: 15px;
        border-radius: 6px;
        color: #fff;
        text-decoration: none;
        font-weight: 700;
      }
    }
  }
}

.layout-tab-style-two{
  margin-bottom: 15px;
  margin-top: 15px;
  .title{
    padding-bottom: 10px;
    font-weight: 700;
  }
  .tab-btn{
    background: transparent;
    border-color: transparent;
    text-shadow: none;
    height: 30px;
    width: 30px;
    margin-right: 7px;
    margin-left: 7px;
    padding: 0;
    &:first-child{
      margin-left: 0;
    }
    &:last-child{
      margin-right: 0;
      width: 50px;
    }
    &:hover,
    &:focus{
      background: transparent;
      border-color: transparent;
      text-shadow: none;
    }
    &.is-primary{
      svg{
        .cls-1{fill:#a81b1b;}.cls-2{fill:#ff5600;}
      }
      &:focus{
        background: transparent;
        border-color: transparent;
        text-shadow: none;
      }
    }
    svg{
      height: 30px;
    }
  }
}

// InspectorControls
.guten-post-layout-inspector-controls {
  // Submenu Items
  .sub-title {

    h2 {
      padding-left: 10px;
      button:focus:not(:disabled):not([aria-disabled="true"]) {
        border: none;
        box-shadow: none;
        outline-offset: -2px;
        outline: none;
      }
      &:hover {
        background: none;
      }
    }
  }
  .guten-post-layout-border-property {
    .guten-post-layout-border {
      display: flex;
      margin-bottom: 10px;
      label {
        flex: 1;
        align-self: center;
        margin-top: -7px;
      }
      div {
        flex: 1;
        align-self: center;
        margin: 0;
      }
    }
  }
  //Global horizontal Box , Border-> width,radius..
  .guten-post-layout-horizontal-box {
    margin-bottom: 20px;
    .horizontal-box {
      display: flex;
      margin-top: 5px;
      input:disabled {
        background: #dddddd;
        cursor: not-allowed;
      }
      .components-base-control {
        .components-base-control__field {
          margin-bottom: 0;
        }
      }
      input {
        border-radius: 0;
        font-size: 13px;
        border: 2px solid #a7376f;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        height: 35px;
        &:focus {
          box-shadow: none;
        }
      }
      .box-top,
      .box-right,
      .box-left,
      .box-bottom{
        position: relative;
        padding-top: 4px;
        color: #a7376f;
      }
      .box-top:after,
      .box-right:after,
      .box-left:after,
      .box-bottom:after {
        position: absolute;
        left: 0;
        right: 0;
        font-family: 'guten-post-layout';
        text-align: center;
        font-size: 11px;

      }
      .box-top {
        &:after{
          content: "\6d";
        }
        margin: 0;
        input {
          border-top-left-radius: 4px;
          border-bottom-left-radius: 4px;
          border-right: none;
        }
      }
      .box-right{
        &:after{
          content: "\63";
        }
      }
      .box-bottom{
        &:after{
          content: "\6f";
        }
      }
      .box-right, .box-bottom {
        margin: 0;
        input {
          border-right: none;
        }
      }
      .box-left {
        &:after{
          content: "\6e";
        }
        margin: 0;
        input {
          border-top-right-radius: 4px;
          border-bottom-right-radius: 4px;
        }
      }
      .link-values-together {
        margin-top: 5px;
        border: 2px solid #a7376f;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-left: 1px solid #a7376f;
        position: relative;
        height: 35px;
        width: 30px;
        display: block;
        &.components-button.is-default:focus:enabled{
          box-shadow: none;
        }
        &:focus,
        &:outline{
          &:enabled{
            box-shadow: none;
          }

          border: none;
        }
        i {
          font-size: 18px;
          position: absolute;
          right: 0;
          left: 0;
          top: 50%;
          transform: translateY(-9px);
          margin: 0 auto;
        }
        .tooltiptext {
          visibility: hidden;
          background-color: black;
          color: #fff;
          text-align: center;
          padding: 3px 4px 2px 6px;
          border-radius: 6px;
          top: 110%;
          left: 0%;
          position: absolute;
          z-index: 1;
          margin-left: -84px;
          font-size: 12px;
        }
      }
      .link-values-together:hover .tooltiptext {
        visibility: visible;
      }
      .active {
        background-color: #a7376f;
        border-color: #a7376f;
        color: #ffffff;
        box-shadow: none;
      }
    }
  }
  // box-shadow
  .guten-post-layout-box-shadow {
    margin-top: 25px;
    margin-bottom: 10px;
    .box-shadow {
      display: flex;
      // margin-top: 15px;
      justify-content: space-between;
      align-items: center;
      .shadow-toggle {
        border: solid 2px #ddd;
        width: 30px;
        height: 30px;
        position: relative;
        cursor: pointer;
        &:hover {
          color: #565E67;
          opacity: 0.7;
        }
        svg {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          height: 100%;
        }
      }
    }
    .shadow-position {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 15px;
      margin-bottom: 15px;
      .position {
        margin: 0;
        div {
          margin: 0;
        }
      }
    }
  }
  // Global Color Box;
  .guten-post-layout-color-box {
    display: flex;
    // justify-content: space-between;
    margin-bottom: 10px;
    align-items: center;
    justify-content: space-between;
    .color-box{
      display: flex;
      .guten-post-layout-color-indicator {
        .component-color-indicator {
          width: 28px;
          height: 26px;
          border: 1px solid #dadada;
          display: inline-block;
          margin-right: 10px;
        }
      }
      .color-picker{
        button{
          margin-right: 14px;
        }
        .components-color-palette__custom-color{
          margin: 0 10px 0 0;
        }
      }
    }
  }

  .guten-post-layout-column-layout{
    margin-top: 10px;
  }

  // column Id & Class
  .guten-post-layout-css-id {
    margin-bottom: 15px;
    .components-base-control {
      margin: 0;
      .components-base-control__field {
        margin-bottom: 0;
      }
    }
  }
  .guten-post-layout-css-classes {
    // margin-bottom: 15px;
    .components-base-control {
      margin: 0;
      .components-base-control__field {
        margin-bottom: 0;
      }
    }
  }

  // Range Row layout content width
  .guten-post-layout-range{
    input[type=number] {
      width: auto;
    }
  }

  .guten-post-layout-gradient-position {
    margin-top: 13px;
    margin-bottom: 13px;
    .components-base-control {
      margin: 0 !important;
      .components-base-control__field {
        margin-bottom: 0 !important;
      }
    }
  }
}

.gpl-inspector-panel,
.guten-post-layout-inspector-controls{
  .components-base-control__field{
    select:focus,
    input:focus{
      border-color: #a7376f;
      border-width: 1px;
    }
  }

}

//Tab Start
.gpl-tab-panels {
  margin-top: 20px;
  .guten-post-layout-tab-panel.gpl-mb-20{
    .components-base-control .components-base-control__label{
      margin-bottom: 10px;
    }
  }
  .components-tab-panel__tab-content {
    .rfip {
      width: 100%;
      margin: 0;
      .rfipbtn {
        width: 100%;
        min-height: 30px;
        &.rfipbtn--default{
          .rfipbtn__icon{
            height: 35px;
            .rfipbtn__elm{
              height: 25px;
            }
          }
        }
        .rfipbtn__button--close,
        .rfipbtn__button--open{
          i{
            font-size: 30px !important;
            margin: 0 !important;
            padding-top: 6px !important;
            align-self: center;
            color: #a7376f;
          }
        }
      }
    }
    form {
      .editor-url-input {
        width: 100%;
        input {
          width: 100%;
        }
      }
    }
  }
  .guten-post-layout-tab-panel{
    &.tab-style-one{
      .components-tab-panel__tabs{
        button{
          width: 50%;
          padding: 8px 20px;
          font-size: 14px;
          background: #ffffff;
          color: #000;
          border: 2px solid #a7376f;
          justify-content: center;
          &:active,
          &:focus {
            outline: none;
            box-shadow: none;
          }
          &.active-tab{
            border: 2px solid #a7376f;
            background: #a7376f;
            color: #fff;
          }
        }
      }

    }
  }
  > .components-tab-panel__tabs{
    margin-left: -16px;
    margin-right: -16px;
    display: block;
    background: #fff;
    overflow: hidden;
    position: relative;
    border: 1px solid #dbdbdb;
    border-left: none;
    border-right: none;
    .tab-panel {
      height: 40px;
      cursor: pointer;
      border: none;
      font-weight: bold;
      padding: 0 !important;
      font-size: 12px;
      background: none;
      color: #191d22;
      width: 33.33%;
      display: inline-block;
      &:focus {
        outline: none;
        border: none;
        box-shadow: none;
      }
      &.active-tab {
        background: #eff0f0;
        position: relative;
        transition: all .3s;
        &:after {
          position: absolute;
          content: '';
          bottom: 0;
          width: 100%;
          left: 0;
          right: 0;
          height: 5px;
          background-color: #a73770;
        }
      }
    }
    .tab-panel:nth-last-child(2) {
      padding-right: 21px;
    }
    .tab-panel:last-child {
      border-right: none;
    }

  }

  .components-panel__body:first-child {
    //border-top: 10px solid #eeedf5;
    margin-top: 0;
  }
  .components-panel__body {
    //border: 7px solid #eeedf5;
    //border-bottom: none;
    .components-panel__body-toggle.components-button:focus:not(:disabled):not([aria-disabled=true]){
      outline: none;
    }
  }
  .guten-post-layout-inspector-controls.mn-16{
    .components-panel__body {
      margin: 0 -16px;
    }
  }


  .components-button.is-default{
    color: #a7376f;
    border-color: #a7376f;
    background: none;
    box-shadow: none;
    vertical-align: none;
    border-radius: 0;
  }
  .components-button-group .components-button.is-button:first-child{
    border-radius: 0;
  }
  .components-button-group .components-button.is-button:last-child{
    border-radius: 0;
  }

  .components-button:focus:enabled{
    box-shadow: none
  }
}
//Tab End

// Tab panel
.guten-post-layout-tab-panel {
  &.responsive-panel{
    position: relative;
    .components-tab-panel__tabs{
      margin-bottom: 15px;
      position: absolute;
      right: 0;
      top: 0;
      button{
        padding: 0 5px;
        margin: 0;
        margin-bottom: -1px;
        color: #555d66;
        cursor: pointer;
        background: none;
        border: none;
        border-bottom: none;
        border-radius: 0;
        outline-offset: -1px;
        &:last-child{
          padding-right: 0;
        }
        &:focus {
          outline: none;
        }
        svg{
          width: 15px;
          opacity: 0.6;
        }
        &.active-tab {
          svg{
            fill: #a7376f;
            opacity: 1;
          }
        }
      }
    }
    .guten-post-layout-horizontal-box{
      padding-top: 0;
      padding-bottom: 0;
    }

  }

  &.tab-style-one{
    .components-tab-panel__tabs{
      button{
        width: 50%;
        padding: 8px 20px;
        font-size: 14px;
        background: #ffffff;
        color: #000;
        border: 2px solid #a7376f;
        justify-content: center;
        &:active,
        &:focus {
          outline: none;
        }
        &.active-tab{
          border: 2px solid #a7376f;
          background: #a7376f;
          color: #fff;
        }
      }
    }

  }
  .guten-post-layout-column-layout{
    margin-top: 10px;
    .components-base-control .components-base-control__label{
      margin-bottom: 10px;
    }
  }

  .components-tab-panel__tabs{
    margin-bottom: 15px;
  }
  > button {
    padding: 9px 11px;
    padding-bottom: 11px;
    margin: 0;
    margin-bottom: -1px;
    color: #555d66;
    cursor: pointer;
    background: none;
    border: none;
    border-bottom: none;
    border-radius: 0;
    outline-offset: -1px;
    &:active,
    &:focus {
      outline: none;
    }
  }
  .active-tab {
    position: relative;
    border-bottom: 2px solid #00a0d2;
    z-index: 1;
    &:active,
    &:focus {
      outline: none;
    }
  }
}

// color field css
.gpl-block-color-field{
  display: flex;
  justify-content: space-between;
  align-items: center;
  span{
    display: block;
    margin-bottom: 5px;
  }
  margin-bottom: 10px;
  .components-button.is-link{
    height: 28px;
    width: 60px;
    background-image: url(../src/assets/img/social-bg.png);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.45);
    border-radius: 4px;
    border: 2px solid #fff;
  }
  .components-button{
    &:focus:enabled{
      box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.45);
    }
  }
}
.gpl-custom-color-palette{
  padding: 0 10px 15px 10px;
  button{
    height: 31px;
    width: 31px;
    border-radius: 50%;
    margin-right: 10px;
    border: none;
    cursor: pointer;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.16);
    transform: scale(1);
    transition: 0.3s;
    border-style: solid;
    border-width: 1px;
    border-color: transparent;
    &.gpl-btn-clear{
      margin-right: 0;
    }
    &.gpl-btn-clear:after {
      position: absolute;
      content: "\70";
      font-family: "guten-post-layout";
      font-weight: 900;
      font-size: 35px;
      top: -4px;
      left: -4px;
      right: 0;
      bottom: 0;
      color: #e61b1b;
    }
    &:focus{
      outline: none;
      border: 1px solid #a7376f;
    }
    &:hover{
      transform: scale(1.1);
    }
  }
}
.gpl-block-color-preview-box{
  border-radius: 4px;
  display: block;
  height: 30px;
  cursor: pointer;
  width: 60px;
}


.gpl-inspector-panel{
  .components-panel__body{

    // toggle control
    .components-toggle-control .components-base-control__field .components-form-toggle {
      margin-right: 0;
      order: 2;
      margin-left: auto;
      input[type=radio]:focus{
        border-color: #a7376f;
      }
    }
    .components-toggle-control .components-base-control__field .components-toggle-control__label {
      order: 1;
      margin-right: 16px;
    }
    .components-form-toggle .components-form-toggle__thumb{
      border-color: #a7376f;
    }
    .components-form-toggle.is-checked .components-form-toggle__track {
      background-color: #a7376f;
    }

    .components-form-toggle .components-form-toggle__track {
      border: 2px solid #a7376f;
    }



    // font family
    .gpl-fontFamily{
      margin-top: 20px;
      .typography-family-select-form-row{
        margin-bottom: 10px;
      }
      .components-base-control{
        margin-bottom: 10px;
      }
      .fontFamily-label{
        display: flex;
        justify-content: space-between;
        .gpl-font-clearBtn{
          position: relative;
          top: -7px;
          background-color: #fff;
          color: #191e23;
          outline: 0;
          box-shadow: inset 0 0 0 1px #ccd0d4, inset 0 0 0 2px #fff;
        }
      }
    }

    // range control css
    .components-range-control{
      margin-bottom: 10px;
    }

    // range control css
    .gpl-input-panel {
      margin-bottom: 10px;
      input{
        margin-top: 5px;
        width: 100%;
	      border: 1px solid #757575 !important;
      }
      ::-webkit-input-placeholder { /* WebKit browsers */
        color:    #fff;
      }
      :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
        color:    #fff;
        opacity:  1;
      }
      ::-moz-placeholder { /* Mozilla Firefox 19+ */
        color:    #fff;
        opacity:  1;
      }
      :-ms-input-placeholder { /* Internet Explorer 10+ */
        color:    #fff;
      }

    }

    // toggle control css
    .components-toggle-control{
      margin-bottom: 10px;
    }

    // tab button css
    .guten-post-layout-tab-button{
      &.text-transform{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 0;
        .tab-btn{
          height: 30px;
          width: 30px;
          background-color: #fff;
          border: 1px solid #a7376f;
          margin-right: 10px;
          &:last-child{
            margin-right: 0;
          }
          svg{
            height: 16px;
            padding-top: 2px;
            fill: #a7376f !important;
          }
          &.is-primary:enabled{
            box-shadow: none;
            background-color: #a7376f;
            border: 1px solid #a7376f;
            border-radius: 0;
            padding: 0 7px 1px;
            svg{
              fill: #fff !important;
            }
          }
        }
      }
      &.layout-tab{
        margin-bottom: 15px;
        .title{
          padding-bottom: 5px;
        }

        .tab-btn{
          background: transparent;
          border-color: transparent;
          text-shadow: none;
          height: 70px;
          width: 70px;
          margin-right: 5px;
          margin-left: 5px;
          padding: 0;
          &.is-primary{
            svg{
              .cls-1{fill:#a81b1b;}.cls-2{fill:#ff5600;}
            }
          }
          svg{
            height: 70px;
          }
        }
      }
    }

    // text alignment
    .alignment{
      display: flex;
      justify-content: space-between;
      .title{
        align-items: center;
        margin-bottom: 0 !important;
      }
      .components-toolbar{
        align-items: center;
        margin: 0 !important;
        border: 0;
        div{
          margin-left: -1px;
          .components-toolbar__control.components-button,
          .components-toolbar__control.components-button:not(:disabled){
            &:hover{
              >svg{
                box-shadow: none;
              }
            }
            &.is-active>svg{
              background: #a7376f;
              border: 0;
              box-shadow: none;
            }
            border-radius: 0;
            border: 1px solid #a7376f;
            height: 30px;
            width: 30px;
            margin: 0;
            padding: 0;
            svg{
              border-radius: 0;
              height: 30px;
              width: 30px;
            }
          }

        }
      }
    }


    .multiple-input-field .guten-post-layout-tab-panel.responsive-panel .components-tab-panel__tabs{
      top: -25px;
    }

  }
}
.guten-post-layout-gradients{
  .guten-post-layout-gradient-location{
    padding-bottom: 10px;
  }
  .guten-post-layout-gradient-types{
    padding-bottom: 10px;
    label{
      padding-bottom: 10px;
      display: block;
    }
    .components-base-control{
      margin-bottom: 15px;
    }
  }
}

.gpl-slick-slider,
.wp-block-guten-post-layout-post-grid{
  .gpl-post-heading-wrapper{
    margin: 0 15px 30px;
    width: 100%;
    .gpl-post-heading-center{
      p{
        max-width: 820px;
        margin-left: auto;
        margin-right: auto;
      }
    }
    &.gpl-post-heading-style1{
      h3{
        a{
          position: relative;
          padding-left: 15px;
          &:before{
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            background-color: #111;
            width: 4px;
          }
        }
      }
    }
    &.gpl-post-heading-style2{
      padding-bottom: 5px;
      border-bottom: 4px solid #111;
    }

    &.gpl-post-heading-style3{
      border-bottom: 4px solid #111;
      h3{
        font-size: 20px;
        a{
          color: #fff;
          background: #111;
          padding: 10px 15px;
          display: inline-block;
          box-shadow: none;
          text-decoration: none;
          &:focus{
            box-shadow: none;
            outline: none;
          }
        }
      }
    }

    &.gpl-post-heading-center{
      text-align: center;
    }
    &.gpl-post-heading-right{
      text-align: right;
      //p{
      //  margin-right: inherit;
      //}
    }
    &.gpl-post-heading-left{
      //p{
      //  margin-left: inherit;
      //}
    }
    h3{
      font-size: 22px;
      line-height: 1.2;
      font-weight: 700;
      margin-top: 0;
      margin-bottom: 0;
      padding: 0;
      a{
        box-shadow: none;
        text-decoration: none;
        color: #111;
        &:focus{
          box-shadow: none;
          outline: none;
        }
      }
    }
    p{
      font-size: 14px;
      line-height: 1.4;
      font-weight: 500;
      margin-top: 10px;
      margin-bottom: 10px;
      padding: 0;
      width: 100%;
      max-width: 100%;
      //margin-left: auto;
      //margin-right: auto;
    }
  }
}

.wp-block-guten-post-layout-post-grid{
  margin-left: var(--item-minus-padding-left-right);
  margin-right: var(--item-minus-padding-left-right);
  .post-item{
    padding-left: var(--item-padding-left-right);
    padding-right: var(--item-padding-left-right);
    margin-bottom: var(--item-margin-bottom);
    .active-post-link{
      position: absolute;
      left: 0;
      right: 0;
      height: 100%;
      width: 100%;
      z-index: 2;
      box-shadow: none;
      display: block;
    }

    &:focus,
    &:hover{
      outline: none;
    }
    .post-image{
      line-height: 0;
      a{
        box-shadow: none;
        &:hover{
          box-shadow: none;
        }
        img{
          width: 100%;
          height: auto;
          object-fit: cover;
        }
      }
    }
    .post-content-area{
      overflow: hidden;
      .post-title{
        line-height: 1.2;
        font-size: 21px;
        a{
          text-decoration: none;
          color: #222;
          box-shadow: none;
        }
        margin-top: 15px;
        margin-bottom: 0;
      }
      .post-meta{
        padding-top: 25px;
        time,
        a{
          font-weight: 400;
          text-decoration: none;
          font-size: 14px;
          color: #000000;
          text-transform: capitalize;
          padding-right: 20px;
          box-shadow: none;
          &:last-child{
            padding-right: 0;
          }
        }
      }
      .post-excerpt{
        margin-top: 15px;
        p{
          font-size: 16px;
          color: #666666;
          margin: 0;
          line-height: 1.9;
        }
      }
      .post-read-moore{
        font-weight: 700;
        margin-top: 15px;
        display: inline-block;
        font-size: 16px;
        border-bottom: 1px solid #47b475;
        box-shadow: none;
        color: #47b475;
        text-decoration: none;
      }
    }
  }

  .slick-prev{
    @media screen and (max-width: 991px) {
      left: -15px;
    }

    @media screen and (max-width: 767px) {
      left: 0;
    }
  }
  .slick-next{
    @media screen and (max-width: 991px) {
      right: -15px;
    }
    @media screen and (max-width: 767px) {
      right: 0;
    }
  }
  .slick-dots{
	  margin: inherit;
	  bottom: 0 !important;
	  padding: 0 !important;
	  li{
		  margin: 0 1px !important;
	  }
    li button{
      height: 15px;
      width: 15px;
      cursor: pointer;
      color: transparent;
      background: #47b475;
      border-radius: 50%;
	    padding: 0;
      &:before{
        display: none;
      }
    }
    li.slick-active button{
      background: #000;
    }
  }

  .wp-block[data-align=full]{
    .slick-next:before,
    .slick-prev:before{
      color: #47b475;
      font-size: 30px;
    }
    .slick-next:focus,
    .slick-prev:focus{
      background-color: transparent;
      border: none;
    }
    .slick-prev{
      left: 25px;
    }
    .slick-next{
      right: 25px;
    }

  }
  .gpl-inner-post-content{
    padding: 40px;
    background-color: #F8F8FA;
  }

  &.post-grid-view.g_skin1{

    .post-item:nth-child(1){
      width: 50%;
      @media screen and (max-width: 767px) {
        width: 100%;
      }
    }
    .post-item:nth-child(2){
      width: 50%;
      @media screen and (max-width: 767px) {
        width: 100%;
      }
    }

    &.list-layout{
      .post-item{
        width: 100%;
      }
    }

    .post-item{
      padding-left: var(--item-padding-left-right);
      padding-right: var(--item-padding-left-right);
      margin-bottom: var(--item-margin-bottom);
    }
    .post-content-area{
      position: relative;
      height: 500px;
      width: 100%;
      object-fit: cover;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      &:hover{
        .post-image{
          a{
            img{
              transform: scale3d(1.1,1.1,1);
            }
          }
        }
      }
      .gpl-inner-post-content{
        position: absolute;
        padding: 30px 20px;
        background-color: transparent;
        width: 100%;
      }
      .post-image{
        width: 100%;
        a{
          img{
            height: 500px;
            width: 100%;
            object-fit: cover;
            transition: 0.5s;
            transform: scale3d(1,1,1);
          }
        }
      }

      .post-meta{
        padding-top: 0;
      }
      .post-meta,
      h2.post-title,
      .post-excerpt,
      .post-read-moore{
        position: relative;
        z-index: 2;
        opacity: 1;
        color: #fff;
        time,
        a{
          color: #fff;
        }
      }


      .gpl-overlay-effect{
        position: absolute;
        content: '';
        height: 100%;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        top: 0;
        z-index: 1;
      }
    }




  }

  &.post-grid-view.g_skin2{
    .gpl-column-4{
      width: 40%;
      @media screen and (max-width: 767px) {
        width: 100%;
      }
      .post-item{
        width: auto;
        padding-left: var(--item-padding-left-right);
        padding-right: var(--item-padding-left-right);
        margin-bottom: var(--item-margin-bottom);
        .post-content-area{
          position: relative;
          height: 600px;
          width: 100%;
          object-fit: cover;
          display: flex;
          flex-direction: column;
          justify-content: flex-end;
          &:hover{
            .post-image{
              a{
                img{
                  transform: scale3d(1.1,1.1,1);
                }
              }
            }
          }
          .gpl-inner-post-content{
            padding: 20px;
          }
          .post-image{
            width: 100%;
            a{
              img{
                height: 600px;
                width: auto;
                object-fit: cover;
                transition: 0.5s;
                transform: scale3d(1,1,1);
              }
            }
            position: absolute;
            overflow: hidden;
            z-index: 1;
          }

          .post-meta{
            padding-top: 0;
          }
          h2.post-title{
            font-size: 18px;
          }
          .post-meta,
          h2.post-title,
          .post-excerpt,
          .post-read-moore{
            position: relative;
            z-index: 2;
            opacity: 1;
            color: #fff;
            time,
            a{
              color: #fff;
            }
          }

          .post-meta{
            time{
              background: #e53935;
              padding: 5px 10px;
              font-weight: 700;
            }
          }

          .gpl-overlay-effect{
            position: absolute;
            content: '';
            height: 100%;
            width: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            top: 0;
            z-index: 1;
          }
        }
      }
    }
    .gpl-column-8{
      width: 60%;
      @media screen and (max-width: 767px) {
        width: 100%;
      }
      .post-item{
		width: 100%;
        padding-left: var(--item-padding-left-right);
        padding-right: var(--item-padding-left-right);
        margin-bottom: var(--item-margin-bottom);
        .post-content-area{
          position: relative;
          height: calc( var(--item-height) );
          width: 100%;
          object-fit: cover;
          display: flex;
          flex-direction: column;
          justify-content: flex-end;
          &:hover{
            .post-image{
              a{
                img{
                  transform: scale3d(1.1,1.1,1);
                }
              }
            }
          }
          .gpl-inner-post-content{
            padding: 20px;
            background-color: transparent;
            width: 100%;
            position: absolute;
          }
          .post-image{
            width: 100%;
            a{
              img{
                height: 500px;
                width: 100%;
                object-fit: cover;
                transition: 0.5s;
                transform: scale3d(1,1,1);
              }
            }
          }

          .post-meta{
            padding-top: 0;
          }
          h2.post-title{
            font-size: 18px;
          }
          .post-meta,
          h2.post-title,
          .post-excerpt,
          .post-read-moore{
            position: relative;
            z-index: 2;
            opacity: 1;
            color: #fff;
            time,
            a{
              color: #fff;
            }
          }
          .post-meta{
            time{
              background: #e53935;
              padding: 5px 10px;
              font-weight: 700;
            }
          }


          .gpl-overlay-effect{
            position: absolute;
            content: '';
            height: 100%;
            width: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            top: 0;
            z-index: 1;
          }
        }
      }
    }


  }


  &.post-grid-view.g_skin3{
    &.list-layout{
      .post-item{
		width: 100%;
        margin-bottom: 30px;
        .post-content-area{
          display: flex;
          align-items: center;
          background-color: #F8F8FA;
          .post-image{
            flex: 2;
          }
          .gpl-inner-post-content{
            background-color: transparent;
            flex: 2;
          }
        }
      }
    }
    .post-item{
      padding-left: var(--item-padding-left-right);
      padding-right: var(--item-padding-left-right);
      margin-bottom: var(--item-margin-bottom);
      .post-content-area{
        .post-meta{
          padding-top: 0;
        }
      }
    }
  }


  &.slick-slider {
    .skin1{
      .post-content-area{
        &:not(.has-image){
          height: 500px;
          width: 100%;
        }
        position: relative;
        height: auto;
        width: auto;
        object-fit: cover;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        &:hover{
          .post-excerpt,
          .post-read-moore{
            opacity: 1;
            transform: translateX(0) translateY(0);
          }
          h2.post-title{
            transform: translateY(0);
          }
        }
        .gpl-inner-post-content{
          padding: 40px 35px;
          background-color: transparent;
          position: absolute;
          width: 100%;
        }
        .post-image{
          width: 100%;
          a{
            img{
              height: auto;
              width: 100%;
              object-fit: cover;
            }
          }
        }

        .post-meta{
          padding-top: 0;
          display: none;
        }
        .post-excerpt,
        .post-read-moore{
          position: relative;
          z-index: 2;
          opacity: 0;
          color: #fff;
          transform: translateY(100%);
          transition: 0.3s ease-out;
          transition-property: opacity, transform;
          p{
            color: #fff;
          }
        }

        h2.post-title {
          position: relative;
          z-index: 2;
          transform: translateY(80px);
          transition: 0.3s ease-out;
          transition-property: transform;
          a{
            color: #fff;
          }
        }


        .gpl-overlay-effect{
          position: absolute;
          content: '';
          height: 100%;
          width: 100%;
          background-color: rgba(0, 0, 0, 0.5);
          top: 0;
          z-index: 1;
        }
      }
    }}

  &.slick-slider {
    .skin2 {
      .post-content-area {
        display: flex;
        background-color: #F8F8FA;
        .post-image {
          width: 60%;
          @media screen and (max-width: 767px) {
            width: 100%;
          }
          a {
            img {
              height: 100%;
              width: 100%;
              object-fit: cover;
            }
          }
        }
        .gpl-inner-post-content {
          &:not(.content-has-image){
            width: 100%;
          }
          .post-meta{
            padding-top: 0;
          }
          margin-top: auto;
          margin-bottom: auto;
          width: 40%;
          @media screen and (max-width: 767px) {
            width: 100%;
          }
          padding: 40px 30px;
        }
      }
    }
  }
  &.slick-slider {
    .skin3 {
      .post-content-area {
        padding-left: var(--item-padding-left-right);
        padding-right: var(--item-padding-left-right);
        margin-bottom: var(--item-margin-bottom);
        margin-left: 0;
        margin-right: 0;
        .gpl-inner-post-content {
          .post-meta {
            padding-top: 0;
          }
        }
      }
    }
  }
}