@import "back_funciones";
@import "back_colors";
@import "back_base";
@import "back_bloqueo.scss";
@import "toggle_check.scss";

.post-type-tarokkina_free {
  @media (max-width: 1024px) {
    #poststuff #post-body.columns-2 {
      margin-right: 0;
    }
    #wpbody-content #post-body.columns-2 #postbox-container-1 {
      margin-right: 0;
      width: 100%;
    }
  }

  #freeinstall {
    font-size: 18px !important;
    padding: 8px 50px !important;
    line-height: 1 !important;
  }

  .btnAdd {
    max-width: 200px;
    button {
      background: $primary-color;
      border: $primary-color;
      position: relative;
      bottom: 4px;
    }
  }

  #instFree {
    background-color: #4da69b;
    padding: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    img.chiFree {
      max-width: 180px;
      height: 100%;
    }

    p {
      text-align: left;
      color: #fff;
    }
    h2 {
      color: #fff;
      font-size: 22px;
      font-weight: bold;
      position: relative;
      top: 15px;
      padding-left: 0;
    }
  }

  .freeinstall_1 {
    display: none;
  }

  .imgPortada {
    text-align: center;
    margin-top: 45px;
    img {
      width: 100%;
      max-width: 270px;
      border-radius: 5px;
    }
  }

  .theme-options-container {
    .cf-container__fields {
      background-color: #f8f8f8;
      padding: 15px 2% 37px;

      @media (max-width: 768px) {
        padding: 5px;
      }
    }
  }

  .container-carbon_fields_container_my_tarot {
    .cf-container__fields {
      padding: 37px;
    }
  }

  p {
    font-size: 14px;
  }

  #major-publishing-actions {
    background-color: #f0f0f1;
    padding: 3px 0;
    border: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 0;

    #publishing-action {
      width: 100%;

      .spinner {
        display: none;
      }

      #publish {
        $color: $color_wordpress; //#46b450
        width: 100%;
        background: $color;
        border-color: $color;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
        height: 45px;
        position: relative;
        bottom: 14px;
        @media (max-width: 1024px) {
          width: 140px;
          float: left;
        }

        &:hover {
          background-color: darken($color, 5%);
        }

        &:focus {
          -webkit-box-shadow: 0 0 0 1px #fff, 0 0 0 3px darken($color, 5%);
          box-shadow: 0 0 0 1px #fff, 0 0 0 3px darken($color, 5%);
        }
      }
    }
  }

  .spinnerClass {
    background: #fff;
    border-radius: 50%;
    margin-left: 8px;
    width: 28px;
  }

  .postbox {
    border: none;
    background-color: #f8f8f8;
    color: $color_text;
  }

  #submitdiv {
    h3 {
      display: none;
    }

    margin-bottom: 3px;
    background: none;
  }

  #carbon_fields_container_my_tarots {
    .cf-container__tabs {
      padding: 3px 0 0 0;
      border: 0;
    }

    .cf-container__fields {
      padding: $pad_ext;
    }
  }

  .cf-color__picker {
    bottom: 70px;
  }

  .cf-complex__group-index {
    background: $primary-color;
    color: #fff;
    padding: 0 20px;
  }

  .del_tarots {
    bottom: 12px;
  }

  .cf-complex__placeholder {
    button {
      background: $primary-color;
      color: #fff;
      border: none;
      //sombra

      &:hover {
        background: darken($primary-color, 4%);
        color: #fff;
      }
    }
  }

  .bloq_del_tarots {
    .cf-complex__placeholder-label {
      border: 4px dashed #e1e1e1;
      padding: 25px;
      color: #bebebe;
      font-size: 16px;
      margin-bottom: 30px;
    }

    .cf-complex__inserter-button,
    .cf-complex__toggler {
      display: none !important;
    }

    .cf-complex__actions {
      margin-top: 30px;
    }

    .dashicons-admin-page:before {
      content: "";
      background-color: transparent;
    }

    // .cf-field__body{
    //     max-width: 1100px;
    //     margin: 0 auto;
    // }
  }

  //Boton de borrar tarots
  .del_tarots,
  .del_tarots:focus {
    position: relative;
    background: #f8f8f8;
    color: #adb2b7;
    border-color: transparent;
  }

  .del_tarots:focus {
    background: #f1f1f1;
    color: $color_rojo;
    border-color: transparent;
    -webkit-box-shadow: 0 0 0 1px $color_rojo;
    box-shadow: 0 0 0 1px $color_rojo;
  }

  .del_tarots:hover {
    background: $color_rojo;
    color: #fff;
    border-color: transparent;
  }

  .bloq_short .shortcode {
    margin: 0 29px;
  }

  .short_strong {
    background: #fff;
    border-radius: 5px;
    padding: 8px;
  }

  .title_short {
    font-size: 13px;
    font-weight: 600;
    color: #782c7a;
    margin-bottom: 15px;
  }

  // .cf-container .cf-field+.cf-field {
  //     border-top: none;
  // }

  .cf-complex__group--collapsed .cf-complex__group-head {
    border: none;
    background: #fff;
    color: $fondo_wordpress_cla;
    border: 3px double #ccc;
    pointer-events: none !important;
    cursor: default !important;
  }

  .cf-complex__group-head {
    direction: ltr;
    font-size: 16px;
    background: $primary-color;
    color: #fff;
    pointer-events: none !important;
    cursor: default !important;
  }

  .cf-container__tabs {
    background-color: #f0f0f1;
  }

  .cf-container__tabs-item--current {
    border-top: 6px solid $primary-color;
    //background: #fff !important;
    color: #23282d !important;
  }

  .cf-container__tabs-item:hover {
    background: #f8f8f8 !important;
    color: #23282d !important;
  }

  .cf-container__tabs-item {
    border-radius: 5px 5px 0 0;
    font-size: 17px;
    padding: 8px 40px;
    background: $fondo_gris;
    color: rgba(#23282d, 0.76);
    font-weight: 600;
    border-left: none;
    border-bottom: none;
  }

  .cf-complex__group-action {
    color: #fff;

    .dashicons-trash,
    .dashicons-admin-page {
      display: none;
    }
  }

  .btnTarot {
    .btnInTarot {
      display: inline-block;
      font-size: 13px;
      line-height: 2.15384615;
      padding: 0 10px;
      height: 28px;
      margin-left: 8px;
      cursor: default;
      border: 1px solid $primary-color;
      background: #f5f5f5;
      -webkit-appearance: none;
      border-radius: 3px;
      white-space: nowrap;
    }

    // .free {
    //   &::before {
    //     vertical-align: text-top;
    //   }
    // }

    // .free.blockTab_Inact {
    //   color: rgba(#000, 0.2);
    //   pointer-events: none;
    //   cursor: default;
    //   border-color: #dcdcdc;

    //   &::before {
    //     content: "\f160";
    //     font-family: dashicons;
    //     font-size: 18px;
    //     vertical-align: text-bottom;
    //     line-height: 1;
    //     margin-right: 5px;
    //     text-transform: none;
    //     text-rendering: auto;
    //     -webkit-font-smoothing: antialiased;
    //     -moz-osx-font-smoothing: grayscale;
    //   }
    // }
  }

  .cf-complex__group-body {
    background: #f8f8f8;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border: none;
    //sombra
    -webkit-box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
            box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
  }

  .cf-container .cf-field__label {
    color: $fondo_wordpress_cla;
    font-weight: bold;
    font-size: 18px;
  }

  .cf-field__help {
    color: #afafaf;
    font-size: 13px;
  }

  .cf-container .cf-field {
    color: #32373c;
    border: none;
  }

  .dashicons-trash {
    &::before {
      content: "\f158";
      background: $color_rojo;
      border-radius: 50%;
      color: #fff;
    }
  }

  .dashicons-arrow-down {
    background: #f1f1f1;
    width: 40px;
    //sombra
    -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
            box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
    -webkit-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;

    &:before {
      color: #333333;
    }

    &:hover {
      -webkit-box-shadow: none;
      box-shadow: none;
    }
  }

  .dashicons-arrow-up {
    background: #f1f1f1;
    width: 40px;
    //sombra

    &:before {
      color: #333333;
    }

    &:hover {
      -webkit-box-shadow: none;
      box-shadow: none;
    }
  }

  .cf-field__body {
    input[type="color"],
    input[type="date"],
    input[type="datetime-local"],
    input[type="datetime"],
    input[type="email"],
    input[type="month"],
    input[type="number"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="text"],
    input[type="time"],
    input[type="url"],
    input[type="week"],
    select,
    textarea {
      border: none;
      background: #f9f9f9;
      //color: $color_campos;
      //font-weight: bold;
      font-size: 16px;
    }

    input[type="radio"]:checked::before {
      background-color: $primary-color;
    }
  }

  .cf-field__error,
  .cf-field__asterisk {
    color: red;
  }

  $color_place: #bdbdbd;

  ::-webkit-input-placeholder {
    /* Edge */
    color: $color_place;
  }

  :-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: $color_place;
  }

  ::-moz-placeholder {
    color: $color_place;
  }

  ::-ms-input-placeholder {
    color: $color_place;
  }

  ::placeholder {
    color: $color_place;
  }

  .inside .cf-radio__input:checked ~ .cf-radio__label .cf-radio-image__image,
  .inside .cf-radio__input:focus ~ .cf-radio__label .cf-radio-image__image {
    outline: 4px solid $primary-color;
  }

  .cf-container .cf-field + .cf-field.cf-radio-image img {
    min-width: 90px;
    opacity: 0.5;
  }

  .cf-association {
    .cf-association__option-type,
    .cf-association__option-action--edit {
      display: none;
    }
  }

  .postbox .cf-media-gallery__inner {
    border: none;
  }

  .backface .cf-media-gallery__actions {
    & button {
      color: $primary-color;
      border-color: $primary-color;
    }
  }

  .text_unistall {
    color: $arnelio_color;
    margin-bottom: 5px;
    display: inline-block;
  }

  .som {
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    &:hover {
      //box-shadow: 0px 15px 30px -17px rgba(#000, 0.75);
      -webkit-box-shadow: rgb(204, 219, 232) 3px 3px 6px 0px inset,
        rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset;
      box-shadow: rgb(204, 219, 232) 3px 3px 6px 0px inset,
        rgba(255, 255, 255, 0.5) -3px -3px 6px 1px inset;
    }
  }

  /////////////Sidebar
  #postbox-container-1 {
    top: 0 !important;
    ul {
      list-style: disc;
      margin-left: 20px;
      color: #32373c;
    }

    $ribbonColor: $color_wordpress;
    .ribbon {
      width: 150px;
      height: 150px;
      overflow: hidden;
      position: absolute;
    }
    .ribbon::before,
    .ribbon::after {
      position: absolute;
      z-index: -1;
      content: "";
      display: block;
      border: 5px solid darken($ribbonColor, 8%);
    }
    .ribbon span {
      position: absolute;
      display: block;
      width: 255px;
      padding: 9px 0;
      background-image: -o-linear-gradient(left, #ff6d6f, #742c7a);
      background-image: -webkit-gradient(linear, left top, right top, from(#ff6d6f), to(#742c7a));
      background-image: linear-gradient(90deg, #ff6d6f, #742c7a);
      -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
      color: #fff;
      font: 600 14px/1 "Lato", sans-serif;
      text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
      text-transform: uppercase;
      text-align: center;
    }

    /* top left*/
    .ribbon-top-left {
      top: -10px;
      left: -10px;
    }
    .ribbon-top-left::before,
    .ribbon-top-left::after {
      border-top-color: transparent;
      border-left-color: transparent;
    }
    .ribbon-top-left::before {
      top: 0;
      right: 0;
    }
    .ribbon-top-left::after {
      bottom: 0;
      left: 0;
    }
    .ribbon-top-left span {
      right: -22px;
      top: 22px;
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }

    .textDeck {
      color: #675172;
      padding: 8px;
    }

    .logo_sidebar {
      position: relative;
      text-align: center;
      background: #f3f0f5;
      img {
        max-width: 180px;
      }
    }

    a:hover,
    a:focus {
      color: $arnelio_color;
    }

    .btn_sidebar {
      width: 100%;
      display: inline-block;
      text-decoration: none !important;
      color: #ffffff;
      text-align: center;
      padding: 13px 0;
      margin-top: 30px;
      -webkit-transition: 0.3s;
      -o-transition: 0.3s;
      transition: 0.3s;
      &:hover {
        -webkit-box-shadow: 0px 15px 30px -17px rgba(#000, 0.75);
        box-shadow: 0px 15px 30px -17px rgba(#000, 0.75);
      }

      &:hover,
      &:focus {
        color: #ffffff !important;
      }

      svg {
        width: 25px;
        vertical-align: text-bottom;
        margin-right: 8px;
      }
    }

    /////////////////////
  }

  .cf-field__body .tarotWidth {
    $color: #d2d2d2;
    .cf-field__body {
      @media (min-width: 601px) {
        width: 82px !important;
      }
      position: relative;
      &::after {
        content: "px";
        font-size: 16px;
        font-weight: bold;
        color: $primary-color;
        float: right;
        position: absolute;
        right: -27px;
        top: 5px;
      }
    }
    input[type="number"] {
      background: #fff;
      border: 1px solid #ededed;
    }
  }
}

.freeCab {
  .titleFormsBloq {
    text-align: center;
    position: relative;
    top: 18px;
    .titleForms,
    .dashicons {
      color: $color-lila;
      font-size: 24px;
      font-weight: bold;
    }
  }
  p {
    text-align: center;
    font-weight: 100;
    margin-bottom: 0;
  }
}

$radius: 15px;
$padding: 37px;
.lisoEstilos {
  position: relative;
  $color1: #fff;
  $color2: darken(#fff, 0%);
  background-color: #fff;
  margin: 0 29px;
  padding-left: 30px !important;
  padding-right: 30px !important;
  -webkit-transition: 0.8s;
  -o-transition: 0.8s;
  transition: 0.8s;
  border-left: 3px solid #e7e7e7 !important;

  .cf-color__reset {
    .dashicons {
      &::before {
        background: #d1d1d1;
        border-radius: 50%;
        color: #fff;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
      }
      &:hover::before {
        background: #ad2d41;
      }
    }
  }

  &.colorA {
    background-color: $color1;
  }
  &.colorB {
    background-color: $color2;
  }
  &.colorC {
    background-color: $color1;
  }
  &.colorD {
    background-color: $color2;
  }
  &.colorE {
    background-color: $color1;
  }

  & button {
    color: $color_estilos !important;
    border-color: $color_estilos !important;
  }

  & .cf-field__body .cf-color__preview {
    background-color: #000000;
  }

  & .cf-field__head .cf-field__label {
    color: #b5bcc1 !important;
  }

  &.lisoEstilos_a {
    border-radius: $radius $radius 0 0;
    padding-top: $padding !important;
  }

  &.lisoEstilos_b {
    border-radius: 0 0 $radius $radius;
    padding-bottom: $padding !important;
  }

  &.lisoEstilos_ab {
    border-radius: $radius;
    padding-top: $padding !important;
    padding-bottom: $padding !important;
  }
}

.title_inside {
  margin: 65px 0 0;
  text-align: center;
  font-size: 28px;
  color: $form_titles;
  text-transform: uppercase;
  font-weight: bold;

  &.stile {
    color: $form_titles;
    span.dashicons {
      font-size: 30px;
      margin-right: 10px;
      vertical-align: sub;
    }
  }

  img {
    vertical-align: bottom;
    width: 54px;
  }
}

.range {
  .cf-text__input {
    width: 25% !important;
  }
}

// shrtcodes
.titleShort {
  color: $fondo_wordpress_cla;
  font-size: 17px;
  font-weight: bold;
  margin-bottom: 6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

input.short {
  padding: 8px;
  border-radius: 3px;
  width: 100%;
  border: none;
  background: #e8fffc !important;
  font-weight: normal;
  font-size: 16px;

  &::-moz-selection {
    background: $color-verde;
    color: #fff;
  }

  &::selection {
    background: $color-verde;
    color: #fff;
  }
}

div.titleShort > span.button.copyP {
  margin-left: 15px;
}

.copyM {
  display: none;
  color: $color-verde;
  padding: 3px;
  border-radius: 3px;
  line-height: 1.8;
}

// lista de tarots instalados
.list_radio {
  .cf-radio__list {
    .cf-radio__list-item:first-child {
      display: none;
    }
  }
}

#postbox-container-1 {
  .postbox {
    h2 {
      font-size: 17px;
      width: 100%;
      text-align: center;
      text-transform: uppercase;
    }

    .inside {
      padding: 16px;
    }
  }
}

// bloquear sidebar
body.post-type-tarokkina_free {
  .carbon-theme-options #post-body.columns-2 #postbox-container-1.fixed {
    position: relative !important;
    margin-right: -300px;
  }
}

///  Modal Install
.modalContainer {
  position: fixed;
  z-index: 99999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.85);
}

.modal_save {
  z-index: 9999;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  color: $color_text;
  width: 320px;
  //height: 320px;
  text-align: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;

  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 20px;

  &.modal_free {
    background: #00d084;
  }

  &.modal_update {
    background: transparent;
  }

  .imgPortada {
    width: 100%;
  }

  .modal_content {
    background: #fff;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 20px 0 20px 0;
  }

  .modalTitle {
    margin: 15px 0;
    font-size: 17px;
    color: #2c3338;
    padding: 13px;
    font-weight: 700;
  }
  .checkOk {
    margin: 25px 0 50px;
  }

  .btn_install {
    background: $color-verde;
    border-color: $color-verde;
    &:hover,
    &:focus {
      background: darken($color-verde, 5%);
      color: #fff;
      border-color: $color-verde;
    }
    width: 80%;
    font-size: 15px;
    text-transform: uppercase;
    margin: 10px 0;
  }
  .btn_close {
    width: 80%;
    line-height: 2.30769231;
    font-size: 15px;
    text-transform: uppercase;
    background: $arnelio_color;
    color: #fff;
    border-color: $arnelio_color;
    &:hover,
    &:focus {
      background: darken($arnelio_color, 8%);
      color: #fff;
      border-color: $arnelio_color;
    }
  }
  #textClose {
    display: none;
  }
}

body .cf-container .cf-field.colorTitle {
  padding-bottom: 30px;
}

// Grid
.grid_bloq {
  margin-top: 55px;
}
.addons_bloq {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  a {
    text-decoration: none;
  }
  .item {
    min-height: 200px;
    max-width: 190px;
    font-size: 13px;
    background-color: $color-lila;
    color: #fff;
    padding: 20px;
    border-top: 2px solid #f0f0f1;
    border-right: 2px solid #f0f0f1;

    .name {
      margin-top: 10px;
    }

    &.itRev {
      background-color: $color-verde;
    }
    &.itEma {
      background-color: #181c2a;
    }
    h3 {
      color: #fff;
    }
    .arnelog {
      img {
        width: 190px;
      }
    }
    p {
      color: rgba(#fff, 0.7);
      min-height: 42px;
      font-size: 13px;
    }
    .stars {
      font-size: 18px;
      color: $oro;
      height: 34px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
    }
    .email {
      img {
        width: 60px;
      }
    }
    .btnRew {
      min-width: 90px;
      text-align: center;
    }
    @media (max-width: 680px) {
      max-width: 100%;
    }
  }
}

//flecha
.bloqFlec {
  position: relative;
  top: 19px;
  left: 184px;
  svg.h-5.w-5 {

    color: #93e1d7;
    bottom: 21px;
    position: absolute;

    animation-name: arrow;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-play-state: running;
    -webkit-animation-name: arrow;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-play-state: running;
  }
}

@keyframes arrow {
  0% {
    left: 0;
  }
  75% {
    left: 60px;
  }
  100% {
    left: 0;
  }
}
@-webkit-keyframes arrow {
  0% {
    left: 0;
  }
  75% {
    left: 60px;
  }
  100% {
    left: 0;
  }
}


///////////////////////////////////////////////////////////////////
[dir="rtl"]{

  .post-type-tarokkina_free .cf-complex__group--collapsed .cf-complex__group-head{ 
    direction: ltr;
  }

  .post-type-tarokkina_free #postbox-container-1 ul {
    margin-right: 20px;
  }

  .cf-field.cf-checkbox.tabs_color label.cf-checkbox__label {
    margin-right: 17px;
  }

  .freeField::before, .blo::before {
    right: -25px;
    max-width: 24px;
    text-align: center;
  }

  .blo .cf-field__head label::before {
    display: none;
  }

  .blo .cf-field__head label::after {
    content: "\f160";
    vertical-align: sub;
    margin: 0 5px 0 -3px;
    font-family: dashicons;
    font-size: 21px;
    color: #767676;
    margin: 0 0 0 10px;
  }

  .title_inside.stile span.dashicons {
    margin-left: 10px;
  }


}


