/* global vars */

:root {

  --cty-offscreen-bg: #eee; /* off page background color */
  --cty-default-bg: white; /* general background color */
  --cty-default-txt: #0d1635; /* general text color */

  --bs-heading-color: #192b68; /* bootstrap heading color */
  
  --cty-brand-pink: #d42561;
  --cty-brand-blue: #253a80; 
  --cty-brand-gold: #f1aa1d;
  --cty-brand-gold-dark: #e9a23b;
  --cty-brand-purple: #8c167d;
  --cty-brand-green: #218a55;

  --cty-brand-blue-fifa: #4991f0;

  --cty-brand-cream: #fefaee;
  --cty-bg-card: #fefaee; /* default lk and crd background */

  --cty-brand-blue-dark:#1c3073; /* utility nav */
  
  --cty-brand-green100: #41a773;
  --cty-brand-green200: #218754; /*ada*/
  --cty-brand-green300: #34845a;
  --cty-brand-green400: #195737;
  
  --cty-brand-gold200: #ffc758;

  --cty-brand-blue200: #0793b5;
  --cty-brand-blue300: #07677f;

  --cty-brand-pink500: #ef427f;
  --cty-brand-pink400: #f8508a;
  --cty-brand-pink300: #f681aa;

  --cty-brand-purple600: #8C167D;
  --cty-brand-purple500: #9E248A;
  --cty-brand-purple400: #B62A9F;
  --cty-brand-purple300: #C537AE;
  --cty-brand-purple200: #D243BA;     

  --cty-alink: #d42561; /* primary link color */
  --cty-ahover: #eb276b; /* primary hover color */
  --cty-asec-link: #222; /* secondary link color */
  --cty-asec-hover: #444; /* secondary hover color */
  --cty-asec-divider: #aaa; /* secondary divider color */
  
  --cty-alert-bg: #d42561; /* alert background color */
  --cty-alert-txt: white; /* alert text color */
 
  --cty-banner-wrap: #ffffff;

  --cty-transition-hover: all 150ms linear 0s; /* as on buttons */

}

.responsive-svg { width: 100%; height: auto; }



body,html {
  height:100%;
  background-color:var(--cty-offscreen-bg);
}

#page-wrap {
  position:relative;
  width:100%;
  background-color:var(--cty-default-bg);
  color:var(--cty-default-txt);
}

#page-header { color:inherit; }

#page-content { color:inherit; }

/* override Citylight 8 */
/* typical 2024 mobile user is 390px wide */
/* typical 2024 desktop user is 1473px wide */
/* 16" macbook is 1728px wide */

.container-fluid { padding:0 24px; margin:0 auto; }
.container-fluid-wide { padding:0 24px; margin:0 auto; }
.container-fluid-post { padding:0 24px; margin:0 auto; max-width:990px; }
@media screen and (min-width: 1200px) {
  .container-fluid { max-width:1340px; padding-left:5%; padding-right:5%; } /* 60px and higher */
  .container-fluid-wide { max-width:1580px; padding-left:5%; padding-right:5%; }
  .container-fluid-post { padding:0 24px; margin:0 auto; max-width:990px; }
}

.container-crowdriff { width:100%; min-height:300px; padding:20px 60px; }

.hold-width { max-width:50rem; margin:0 auto; }
.padding-top { padding-top:2.5rem; }
.padding-top-half { padding-top:1.25rem; }
.padding-bottom { padding-bottom:2.5rem; }
.padding-bottom-half { padding-bottom:1.25rem; }
.form-padding { margin:1.5rem 0; }
.form-boxed { border: 1px solid #ced4da; border-radius: .25rem; padding:0.5rem; }
@media all and (min-width: 992px) {
	.padding-top { padding-top:3rem; }
	.padding-top-half { padding-top:1.5rem; }
	.padding-bottom { padding-bottom:3rem; }
	.padding-bottom-half { padding-bottom:1.5rem; }
	.form-boxed { padding:1rem; }
}