
/* global vars */

:root {

  /* south park */

  --ccbrand-sky:#68d7df; 
  --ccbrand-sun:#f4d639; 
  --ccbrand-thistle:#ef95f9; 
  --ccbrand-cloud:#e7f0f3; 
  --ccbrand-pacific:#283c45; 
  --ccbrand-pine:#3f4014; 
  --ccbrand-brick:#862215; 
  --ccbrand-sand:#cfc69e; 

}

.color-white { color:white; }
.color-black { color:black; }
.color-sky { color:var(--ccbrand-sky); }
.color-sun { color:var(--ccbrand-sun); }
.color-thistle { color:var(--ccbrand-thistle); }
.color-cloud { color:var(--ccbrand-cloud); }
.color-pacific { color:var(--ccbrand-pacific); }
.color-pine { color:var(--ccbrand-pine); }
.color-brick { color:var(--ccbrand-brick); }
.color-sand { color:var(--ccbrand-sand); }

.bg-white { background-color:white; }
.bg-black { background-color:black; }
.bg-sky { background-color:var(--ccbrand-sky); }
.bg-sun { background-color:var(--ccbrand-sun); }
.bg-thistle { background-color:var(--ccbrand-thistle); }
.bg-cloud { background-color:var(--ccbrand-cloud); }
.bg-pacific { background-color:var(--ccbrand-pacific); }
.bg-pine { background-color:var(--ccbrand-pine); }
.bg-brick { background-color:var(--ccbrand-brick); }
.bg-sand { background-color:var(--ccbrand-sand); }


/* buttons */

.btn-brand { background-color:var(--cty-alink); border:1px solid var(--cty-alink); color:white; text-transform:uppercase;
  margin:4px 2px 4px 0px; padding: .375rem .75rem; transition: all 0.15s linear 0s; text-decoration:none; }
.btn-brand:hover { background-color:var(--cty-ahover); border-color:var(--cty-ahover); color:white; text-decoration:none; }

.btn-brand { border-radius:0; font-size:0.9rem; font-weight:700; letter-spacing:0rem; margin-top:14px; }

.bg-sand .btn-brand { color:var(--ccbrand-sand); background-color:var(--ccbrand-pine); border-color:var(--ccbrand-pine); }
.bg-brick .btn-brand { color:var(--ccbrand-brick); background-color:var(--ccbrand-thistle); border-color:var(--ccbrand-thistle); }
.bg-pacific .btn-brand { color:var(--ccbrand-pacific); background-color:var(--ccbrand-sky); border-color:var(--ccbrand-sky); }
.bg-cloud .btn-brand { color:var(--ccbrand-cloud); background-color:var(--ccbrand-pine); border-color:var(--ccbrand-pine); }
.bg-sun .btn-brand { color:var(--ccbrand-sun); background-color:var(--ccbrand-brick); border-color:var(--ccbrand-brick); }

.btn-brand-red .btn-brand  { background-color:var(--ccbrand-brick)!important;color:white; }

.webform .btn-brand { color:var(--ccbrand-cloud); background-color:var(--ccbrand-pacific); border-color:var(--ccbrand-pacific); }

.btn-outline-brand { background-color:white; border:1px solid var(--cty-alink); color:var(--cty-alink); font-size:14px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; 
 margin:4px 2px 4px 0px; padding: .375rem .75rem; transition: all 0.15s linear 0s; }
.btn-outline-brand:hover { background-color:var(--cty-ahover); border-color:var(--cty-ahover); color:white; }

.btn-brand-pill { background-color:var(--cty-alink); border:1px solid var(--cty-alink);  color:white; font-size:12px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; border-radius:20px; 
  margin:4px 2px 4px 0px; padding: .275rem 1rem; transition: all 0.15s linear 0s; }
.btn-brand-pill:hover {  background-color:var(--cty-ahover); border-color:var(--cty-ahover); color:white; }

.btn-outline-brand-pill { background-color:white; border:1px solid var(--cty-alink); color:var(--cty-alink); font-size:12px; font-weight:400; text-transform:uppercase; letter-spacing:0.100rem; border-radius:20px; 
  margin:4px 2px 4px 0px; padding: .275rem 1rem; transition: all 0.15s linear 0s; }
.btn-outline-brand-pill:hover { background-color:var(--cty-ahover); border-color:var(--cty-ahover); color:white; }

.btn-naked { color:var(--cty-alink); text-transform:uppercase; letter-spacing:0.050rem; margin:4px 2px 4px 0px; padding: .375rem 0rem; transition: all 0.15s linear 0s; }
.btn-naked:hover { color:var(--cty-ahover); }


/* social buttons */

.splash-social { text-align:left; margin:1.5rem 0; }
.splash-social a { display:inline-block; width:40px; height:40px; font-size:18px; line-height:40px; border-radius:50%; text-align:center; margin:0 8px; }
.splash-social a { text-decoration:none; color:var(--ccbrand-sand); background-color:var(--ccbrand-pine); border:none; transition: all 0.15s linear 0s; }
.splash-social a:hover { color:var(--ccbrand-sand); background-color:var(--ccbrand-pine); }




/* corner logos */

.corner-logo-top { position:absolute; top:0px; right:0px; width:262px; height:auto; }
.corner-logo-bottom { position:absolute; bottom:0px; left:0px; width:262px; height:auto; }

.corner-logo-top a { display:block; }
.corner-logo-bottom a { display:block; } 

.bg-sun .svg-text { fill:var(--ccbrand-sun); }
.color-brick .svg-bg { fill:var(--ccbrand-brick); }

.bg-cloud .svg-text { fill:var(--ccbrand-cloud); }
.color-pine .svg-bg { fill:var(--ccbrand-pine); }

.bg-brick .svg-text { fill:var(--ccbrand-brick); }
.color-thistle .svg-bg { fill:var(--ccbrand-thistle); }

.bg-pine .svg-text { fill:var(--ccbrand-pine); }
.color-sun .svg-bg { fill:var(--ccbrand-sun); }

.bg-sand .svg-text { fill:var(--ccbrand-sand); }
.color-pine .svg-bg { fill:var(--ccbrand-pine); }

.bg-pacific .svg-text { fill:var(--ccbrand-pacific); }
.color-sky .svg-bg { fill:var(--ccbrand-sky); }

.splash-fixed .svg-text { fill:var(--ccbrand-cloud); }
.splash-fixed .svg-bg { fill:var(--ccbrand-pine); }

.flodesk-subscribe { border:1px solid var(--ccbrand-thistle); margin-top:1.5rem; margin-bottom:1rem;  }