h1,
.h1 {
  color: var(--br-color-ltgreen);
  font-size: var(--br-media-font-05);
  font-weight:700;

}
.h1-size {
    font-size: var(--br-media-font-05)!important;
  }

h2,
.h2 {
  font-size: var(--br-media-font-04);
  font-weight: 700;

  @media (max-width: 1023px) {
    margin-bottom: .5em;
  }

}
.h2-size {
    font-size: var(--br-media-font-04)!important;
  }

h3,
.h3 {
  font-size:var(--br-media-font-03)
}
.h3-size {
    font-size: var(--br-media-font-03);
  }
h4,
.h4 {
  font-size:var(--br-media-font-03)
}
p {
  font-size: var(--br-media-font-02)
}

#layout-builder-modal form,
#layout-builder-modal summary {
  color:gray;
}
.br-text-primary-dark {
  color:var(--br-text-dark);
}
.br-text-primary-light {
  color:var(--br-text-light);
}
.br-text-secondary-dark {
  color:var(--br-text-dark);
}
/* Classes to use for Background colors
** within Bootstrap Styles
*/
.br-bg-white {
  background-color: rgb(var(--br-color-white));
}
.br-bg-light-gray {
  background-color: rgb(var(--br-color-light-gray));
}
.br-bg-gray {
  background-color: rgb(var(--br-color-gray));
}
.br-bg-dark-blue {
  background-color: rgb(var(--br-color-dark-blue));
}
.br-bg-dark-purple {
  background-color:rgb(var(--br-color-dark-purple));
}
.br-bg-green {
  background-color: rgb(126 217 87);
}
/* Classes to use for text colors within
** Bootstrap Styles
*/
.br-text-white {
  color: rgb(var(--br-color-white));
}
.br-text-light-gray {
  color: rgb(var(--br-color-light-gray));
}
.br-text-gray {
  background-color: rgb(var(--br-color-gray));
}
.br-text-dark-blue {
  color:blue;
  /*color: rgb(var(--br-color-dark-blue)); */
}
.br-text-green {
  color: rgb(var(--br-color-green));
}
/* Classes to use for Border colors
** within Bootstrap Styles
*/

/* All four sides the same */
.br-bc-white {
  border-color: rgb(var(--br-color-white));
}
.br-bc-light-gray {
  border-color: rgb(var(--br-color-light-gray));
}
.br-bc-gray {
  border-color: rgb(var(--br-color-gray));
}
.br-bc-dark-blue {
  border-color: rgb(var(--br-color-dark-blue));
}
.br-bc-green {
  border-color: rgb(var(--br-color-green));
}
.br-bw-1 {
  border-width:.1rem;
}
.br-bw-2 {
  border-width:.2rem;
}
.br-bw-3 {
  border-width:.3rem;
}
.br-bw-4 {
  border-width:.4rem;
}
.br-bw-5 {
  border-width:.5rem;
}
.br-bw-6 {
  border-width:.6rem;
}
.br-bw-7 {
  border-width:.7rem;
}
.br-bw-8 {
  border-width:.8rem;
}
.br-bw-9 {
  border-width:.9rem;
}
.br-bw-10 {
  border-width:1rem;
}

/* Border Top */
.br-bt-white {
  border-top-color: rgb(var(--br-color-white));
}
.br-bt-light-gray {
  border-top-color: rgb(var(--br-color-light-gray));
}
.br-bt-gray {
  border-top-color: rgb(var(--br-color-gray));
}
.br-bt-dark-blue {
  border-top-color: rgb(var(--br-color-dark-blue));
}
.br-bt-green {
  border-top-color: rgb(var(--br-color-green));
}

/* Border Bottom */
.br-bb-white {
  border-bottom-color: rgb(var(--br-color-white));
}
.br-bb-light-gray {
  border-bottom-color: rgb(var(--br-color-light-gray));
}
.br-bb-gray {
  border-bottom-color: rgb(var(--br-color-gray));
}
.br-bb-dark-blue {
  border-bottom-color: rgb(var(--br-color-dark-blue));
}
.br-bb-green {
  border-bottom-color: rgb(var(--br-color-green));
}
.br-bw-b-1 {
  border-bottom-width:.1rem;
}
.br-bw-b-2 {
  border-bottom-width:.2rem;
}
.br-bw-b-3 {
  border-bottom-width:.3rem;
}
.br-bw-b-4 {
  border-bottom-width:.4rem;
}
.br-bw-b-5 {
  border-bottom-width:.5rem;
}
.br-bw-b-6 {
  border-bottom-width:.6rem;
}
.br-bw-b-7 {
  border-bottom-width:.7rem;
}
.br-bw-b-8 {
  border-bottom-width:.8rem;
}
.br-bw-b-9 {
  border-bottom-width:.9rem;
}
.br-bw-b-10 {
  border-bottom-width:1rem;
}

/* Border Left */
.br-bl-white {
  border-left-color: rgb(var(--br-color-white));
}
.br-bl-light-gray {
  border-left-color: rgb(var(--br-color-light-gray));
}
.br-bl-gray {
  border-left-color: rgb(var(--br-color-gray));
}
.br-bl-dark-blue {
  border-left-color: rgb(var(--br-color-dark-blue));
}
.br-bl-green {
  border-left-color: rgb(var(--br-color-green));
}
.br-bw-l-1 {
  border-left-width:.1rem;
}
.br-bw-l-2 {
  border-left-width:.2rem;
}
.br-bw-l-3 {
  border-left-width:.3rem;
}
.br-bw-l-4 {
  border-left-width:.4rem;
}
.br-bw-l-5 {
  border-left-width:.5rem;
}
.br-bw-l-6 {
  border-left-width:.6rem;
}
.br-bw-l-7 {
  border-left-width:.7rem;
}
.br-bw-l-8 {
  border-left-width:.8rem;
}
.br-bw-l-9 {
  border-left-width:.9rem;
}
.br-bw-l-10 {
  border-left-width:1rem;
}
/* Border Right */
.br-br-white {
  border-right-color: rgb(var(--br-color-white));
}
.br-br-light-gray {
  border-right-color: rgb(var(--br-color-light-gray));
}
.br-br-gray {
  border-right-color: rgb(var(--br-color-gray));
}
.br-br-dark-blue {
  border-right-color: rgb(var(--br-color-dark-blue));
}
.br-br-green {
  border-right-color: rgb(var(--br-color-green));
}
.br-bw-r-1 {
  border-right-width:.1rem;
}
.br-bw-r-2 {
  border-right-width:.2rem;
}
.br-bw-r-3 {
  border-right-width:.3rem;
}
.br-bw-r-4 {
  border-right-width:.4rem;
}
.br-bw-r-5 {
  border-right-width:.5rem;
}
.br-bw-r-6 {
  border-right-width:.6rem;
}
.br-bw-r-7 {
  border-right-width:.7rem;
}
.br-bw-r-8 {
  border-right-width:.8rem;
}
.br-bw-r-9 {
  border-right-width:.9rem;
}
.br-bw-r-10 {
  border-right-width:1rem;
}

/* Classes to use for Spacing
** within Bootstrap Styles
*/

/* All four sides the same */

.br-m-1 {
  margin:.25rem;
}
.br-m-2 {
  margin:.5rem;
}
.br-m-3 {
  margin:1rem;
}
.br-m-4 {
  margin:1.5rem;
}
.br-m-5 {
  margin:3rem;
}
.br-m-6 {
  margin:4rem;
}
.br-m-7 {
  margin:5rem;
}
.br-p-1 {
  padding:.25rem;
}
.br-p-2 {
  padding:.5rem;
}
.br-p-3 {
  padding:1rem;
}
.br-p-4 {
  padding:1.5rem;
}
.br-p-5 {
  padding:3rem;
}
.br-p-6 {
  padding:4rem;
}
.br-p-7 {
  padding:5rem;
}

/* Left side */
.br-ml-1 {
  margin-left:.25rem;
}
.br-ml-2 {
  margin-left:.5rem;
}
.br-ml-3 {
  margin-left:1rem;
}
.br-ml-4 {
  margin-left:1.5rem;
}
.br-ml-5 {
  margin-left:3rem;
}
.br-ml-6 {
  margin-left:4rem;
}
.br-ml-7 {
  margin-left:5rem;
}

.br-pl-1 {
  padding-left:.25rem;
}
.br-pl-2 {
  padding-left:.5rem;
}
.br-pl-3 {
  padding-left:1rem;
}
.br-pl-4 {
  padding-left:1.5rem;
}
.br-pl-5 {
  padding-left:3rem;
}
.br-pl-6 {
  padding-left:4rem;
}
.br-pl-7 {
  padding-left:5rem;
}

/* Right Side */
.br-mr-1 {
  margin-right:.25rem;
}
.br-mr-2 {
  margin-right:.5rem;
}
.br-mr-3 {
  margin-right:1rem;
}
.br-mr-4 {
  margin-right:1.5rem;
}
.br-mr-5 {
  margin-right:3rem;
}
.br-mr-6 {
  margin-right:4rem;
}
.br-mr-7 {
  margin-right:5rem;
}

.br-pr-1 {
  padding-right:.25rem;
}
.br-pr-2 {
  padding-right:.5rem;
}
.br-pr-3 {
  padding-right:1rem;
}
.br-pr-4 {
  padding-right:1.5rem;
}
.br-pr-5 {
  padding-right:3rem;
}
.br-pr-6 {
  padding-right:4rem;
}
.br-pr-7 {
  padding-right:5rem;
}

/* Top */
.br-mt-1 {
  margin-top:.25rem;
}
.br-mt-2 {
  margin-top:.5rem;
}
.br-mt-3 {
  margin-top:1rem;
}
.br-mt-4 {
  margin-top:1.5rem;
}
.br-mt-5 {
  margin-top:3rem;
}
.br-mt-6 {
  margin-top:4rem;
}
.br-mt-7 {
  margin-top:5rem;
}

.br-pt-1 {
  padding-top:.25rem;
}
.br-pt-2 {
  padding-top:.5rem;
}
.br-pt-3 {
  padding-top:1rem;
}
.br-pt-4 {
  padding-top:1.5rem;
}
.br-pt-5 {
  padding-top:3rem;
}
.br-pt-6 {
  padding-top:4rem;
}
.br-pt-7 {
  padding-top:5rem;
}

/* Bottom */
.br-mb-1 {
  margin-bottom:.25rem;
}
.br-mb-2 {
  margin-bottom:.5rem;
}
.br-mb-3 {
  margin-bottom:1rem;
}
.br-mb-4 {
  margin-bottom:1.5rem;
}
.br-mb-5 {
  margin-bottom:3rem;
}
.br-mb-6 {
  margin-bottom:4rem;
}
.br-mb-7 {
  margin-bottom:5rem;
}

.br-pb-1 {
  padding-bottom:.25rem;
}
.br-pb-2 {
  padding-bottom:.5rem;
}
.br-pb-3 {
  padding-bottom:1rem;
}
.br-pb-4 {
  padding-bottom:1.5rem;
}
.br-pb-5 {
  padding-bottom:3rem;
}
.br-pb-6 {
  padding-bottom:4rem;
}
.br-pb-7 {
  padding-bottom:5rem;
}
/* Increase font size relatively
  Using em 
*/
.increase-11 {
  font-size: 1.1em;
}
.increase-12 {
  font-size: 1.2em;
}
.increase-13 {
  font-size: 1.3em;
}
.increase-14 {
  font-size: 1.4em;
}
.increase-15 {
  font-size: 1.5em;
}
.increase-16 {
  font-size: 1.6em;
}
.increase-17 {
  font-size: 1.7em;
}
.increase-18 {
  font-size: 1.8em;
}
.increase-19 {
  font-size: 1.9em;
}
.increase-20 {
  font-size: 2.0em;
}.increase-22 {
  font-size: 2.2em;
}
.increase-25 {
  font-size: 2.5em;
}
.increase-27 {
  font-size: 2.7em;
}
.increase-30 {
  font-size: 3.0em;
}

.white-bold {
  font-size: var(--br-media-font-05);
  font-weight: 700;
  color:white;
  margin-bottom: 1em;
  
  @media (max-width: 1023px) {
    margin-bottom: 1em;
  }
}
.h2-light {
  font-size: var(--br-media-font-04);
  font-weight: 700;
  color:white;
  margin-bottom: 1em;
  
  @media (max-width: 1023px) {
    margin-bottom: 1em;
  }
  
  &-h1-size {
    font-size: var(--br-media-font-05);
  }
}
.h2-dark-01 {
  font-size: var(--br-media-font-04);
  font-weight: 700;
  color:rgb(var(--br-color-space-cadet));
  margin-bottom: 1em;
  
  @media (max-width: 1023px) {
    margin-bottom: 1em;
  }

}
.h2-dark-02 {
  font-size: var(--br-media-font-04);
  font-weight: 700;
  color:rgb(var(--br-color-rasberry-rose));
  margin-bottom: 1em;
  
  @media (max-width: 1023px) {
    margin-bottom: 1em;
  }
  
}

.green-bold {
  font-size: var(--br-media-font-04);
  font-weight: 700;
  color: rgb(var(--br-color-green));
  margin-bottom: 1em;

  @media (max-width: 1023px) {
    font-size: 1.5em;
    margin-bottom: .5em;
  }
}