/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */


/* ========================================================
=============== MOBILE FIRST ==============================
=========================================================== */
:root {
  --accentColor: #FFA100;
  --accentDarkColor: #D69D00;
  --accentLightColor: #FFA100;
  --accentText: #753200;
  --accentTextHover: #333333;
  --text: #333333;
  --aficionado: #EDF6F1;
  --profesional: #FFEFD1;
}

   .button-ra { color:var(--accentText); background: var(--accentColor); border-radius: 4px; padding: 2px 12px; }
   .button-ra:hover { background: var(--accentLightColor); color: var(--accentText); }

   a[target="_blank"]:after {content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==); margin: 0 3px 0 5px;}
   a { color: var(--accentText) }
   a:hover, a:focus { color: var(--accentTextHover) }

   /* Container general */
   .fl-full-width .fl-page-content { box-shadow: none;}


   /* Loop view: Buscar Anuncios
   ------------------------------------------------------ */
   /* Busqueda y filtrado */
   .search-bar-ra { padding: 30px 30px; border-radius: 500px; }
   .filter-form-wrapper label { margin-bottom: 10px; }
   a.search-more:after { content: "▲"; }
   a.search-more.collapsed:after { content: "▼"; }
  input[type="submit"] { border:none !important; }

   /*Checkboxes styles*/
     .form-check-label { font-weight: normal; }
    input[type="checkbox"] { display: none; }
    input[type="checkbox"] + label { display: block; position: relative; padding-top: 2px; padding-left: 28px; margin-bottom: 30px; color: var(--accentText); cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
    input[type="checkbox"] + label:last-child { margin-bottom: 10px; }
    input[type="checkbox"] + label:before { content: ''; display: block; width: 20px; height: 20px; border: 1px solid #515151; position: absolute; left: 0; top: 0; opacity: .6; -webkit-transition: all .12s, border-color .08s; transition: all .12s, border-color .08s; }
    input[type="checkbox"]#profesional-aficionado-anuncio-profesional + label:before { background-color:var(--profesional) !important; }
    input[type="checkbox"]#profesional-aficionado-anuncio-aficionado + label:before { background-color:var(--aficionado) !important; }
    input[type="checkbox"]:checked + label:before { width: 10px; top: -5px; left: 5px; border-radius: 0; opacity: 1; border-top-color: transparent; border-left-color: transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg); }


   /* Loop */
   .view-loop-anuncios ul { padding: 0; margin-top: 20px; }
   .view-loop-anuncios ul li.anuncio-loop { list-style-type: none;  }
   a.load-more-button-ra { margin-left: 30px; margin-top: 10px; background-color:var(--accentColor);}
   a.load-more-button-ra:hover {text-decoration: none;}
   span.load-more-button-ra {visibility: hidden; }
   span.load-more-button-ra:before { content: ''; visibility: visible; color: #515151; }
   span.load-more-button-ra:before:hover { color: #515151; }

   /*  anuncio */
   .anuncio { list-style-type: none; margin-bottom: 30px; border-radius: 5px;}
   .anuncio-profesional { background-color:var(--profesional); }
   .anuncio-aficionado { background-color:var(--aficionado); }

   /* .anuncio-profesional header a h3:before{ content:"PRO";margin: 10px; font-family: 'courier'; font-weight: bold; font-size: .8em; border:1px solid black; padding: 4px 8px; border-radius: 3px;} */

   .anuncio header    { padding: 15 30px;}
   .anuncio header a h3 { display: inline-block; padding: 0 56px 0 30px;}
   .anuncio header a { display: block; position: relative; }
   .anuncio header a:after { position: absolute; top: 20px; right: 15px; color: var(--text); background: rgba(0,0,0, .04) ; border-radius: 50px; height: 30px; width: 30px; text-align: center; line-height: 32px;}

   .anuncio .box { background: rgba(0,0,0, .04); padding: 20px 20px 10px 31px; border-radius: 5px; }
   .anuncio .box .box-text { border-left: 10px solid var(--profesional); padding: 0px 15px 0px 15px; max-height: 40vh; overflow-y: scroll;}
   .anuncio .box .box-text ul { padding-left: 0px; }
   .anuncio .box .box-text ul li { list-style-type: none; }
   .anuncio .box .box-text ul li:before { content:"-"; margin-left: 15px; margin: 15px; }
   .anuncio-profesional .box .box-text { border-left-color:var(--profesional);}
   .anuncio-aficionado .box .box-text { border-left-color:var(--aficionado); }
   .anuncio .box .button-ra { display: inline-block; padding:2px 6px; margin-left: 5px;}
   .anuncio .taxonomy-block { margin-bottom: 10px; line-height: 2.2em; margin-top: 20px;}
   .anuncio .taxonomy-block .taxonomy { background: rgba(255,255,255, .7); padding: 7px 10px 6px 10px; border-radius: 40px; margin: 6px 2px;  white-space: nowrap;}
   .anuncio .taxonomy-block .taxonomy span { white-space: initial;}


   .anuncio footer { padding:12px 30px; border-top: 2px solid rgba(0,0,0, .04); }



/* ========================================================
======== S AND UP (576px  — not on BEAVER THEME) =========
=========================================================== */ @media (min-width:576px) {

      /* GENERAL
      ------------------------------------------------------ */





} /* ========================================================
=============== TABLET AND UP (768px) =====================
=========================================================== */ @media (min-width:768px) {




} /* ========================================================
=============== DESKTOP AND UP (992px) ====================
=========================================================== */ @media (min-width:992px) {




} /* ========================================================
=============== BIG DESKTOP AND UP (1100px) =====================
=========================================================== */ @media (min-width:1100px) {

      /* GENERAL
      ------------------------------------------------------ */

} /* ============== END ============== */
