:root {
    /*colors*/
  --o-white: #ffffff;
  --o-black: #000000;
  --hex-deep-navy: #000033;
  --o-royal-blue: #3366cc;/*cta*/
  --o-diamond: #cccccc;
  --o-emerald: #1cd366;
  --o-hotpink-color: #ff69b4; /*Pink Diamond*/
  --o-sunset-orange: #ff4d4d; /*Red Diamond*/
  --o-vivid-blue: #28a5df; /*WordPress*/
  --text-link-color: #0066cc;
  --black-button: #1d1d1f;
  --blue-button: #0071e3;
}

.cta {
    background-color: var(--o-royal-blue);
}

.cta:hover {
    background-color: var(--o-royal-blue-hover);
}


.background-white h1, .background-white h2, .background-white h3, .background-white h4, .background-white h5, .background-white h6, .background-white .h1, .background-white .h2, .background-white .h3, .background-white .h4, .background-white .h5, .background-white .h6, .primary-color-white .background-primary h1, .primary-color-white .background-primary h2, .primary-color-white .background-primary h3, .primary-color-white .background-primary h4, .primary-color-white .background-primary h5, .primary-color-white .background-primary h6, .primary-color-white .background-primary .h1, .primary-color-white .background-primary .h2, .primary-color-white .background-primary .h3, .primary-color-white .background-primary .h4, .primary-color-white .background-primary .h5, .primary-color-white .background-primary .h6, .background-yellow h1, .background-yellow h2, .background-yellow h3, .background-yellow h4, .background-yellow h5, .background-yellow h6, .background-yellow .h1, .background-yellow .h2, .background-yellow .h3, .background-yellow .h4, .background-yellow .h5, .background-yellow .h6, .primary-color-yellow .background-primary h1, .primary-color-yellow .background-primary h2, .primary-color-yellow .background-primary h3, .primary-color-yellow .background-primary h4, .primary-color-yellow .background-primary h5, .primary-color-yellow .background-primary h6, .primary-color-yellow .background-primary .h1, .primary-color-yellow .background-primary .h2, .primary-color-yellow .background-primary .h3, .primary-color-yellow .background-primary .h4, .primary-color-yellow .background-primary .h5, .primary-color-yellow .background-primary .h6, .background-yellow, .background-yellow p, a.background-yellow, a.background-yellow:visited, a.background-yellow:link, .background-yellow a, .background-yellow a:link, .background-yellow a:visited, .background-yellow a:hover, .background-yellow a:active, .primary-color-yellow .background-primary, .primary-color-yellow .background-primary p, .primary-color-yellow a.background-primary, .primary-color-yellow a.background-primary:visited, .primary-color-yellow a.background-primary:link, .primary-color-yellow .background-primary a, .primary-color-yellow .background-primary a:link, .primary-color-yellow .background-primary a:visited, .primary-color-yellow .background-primary a:hover, .primary-color-yellow .background-primary a:active {
    color: var(--hex-deep-navy);
}