.text-light-grey{color:#ccc;}
.text-dark-grey{color:#666;}
.bg-green{background: var(--green);}

div.card.impact-report-2020{}

/* GREEN STYLE wide card */
div.card.impact-report-2020-green .text-content{background-image: url('https://www.pct.edu/files/impact-report-2020/halftone_25.png');background-color:var(--green)!important; color:white!important; padding-left:8rem!important;}
div.impact-report-2020-green.card.wide-1 .text-content *, 
div.impact-report-2020-green.card.wide-2 .text-content *{color:white; overflow:visible;}
div.impact-report-2020-green.card.wide-1 .text-content h4, 
div.impact-report-2020-green.card.wide-2 .text-content h4{text-transform:uppercase;}
div.impact-report-2020-green h5:before, text-center > h5:before{background:white;}


/* BLUE STYLE wide card */
div.card.impact-report-2020-dark-blue .text-content{background-image: url('https://www.pct.edu/files/impact-report-2020/halftone_25.png');background-color:var(--dark-blue)!important; color:white!important; padding-left:8rem!important;}
div.impact-report-2020-dark-blue.card.wide-1 .text-content *, 
div.impact-report-2020-dark-blue.card.wide-2 .text-content *{color:white!important; overflow:visible;}
div.impact-report-2020-dark-blue.card.wide-1 .text-content h4, 
div.impact-report-2020-dark-blue.card.wide-2 .text-content h4{text-transform:uppercase;}
div.impact-report-2020-dark-blue h5:before, text-center > h5:before{background:white;}

/* LIGHT BLUE STYLE wide card */
div.card.impact-report-2020-light-blue .text-content{background-image: url('https://www.pct.edu/files/impact-report-2020/halftone_25.png');background-color:var(--light-blue)!important; color:white!important; padding-left:8rem!important;}
div.impact-report-2020-light-blue.card.wide-1 .text-content *, 
div.impact-report-2020-light-blue.card.wide-2 .text-content *{color:var(--dark)!important; overflow:visible;}
div.impact-report-2020-light-blue.card.wide-1 .text-content h4, 
div.impact-report-2020-light-blue.card.wide-2 .text-content h4{text-transform:uppercase;}
div.impact-report-2020-light-blue .btn-outline-corner{color:#101833!important;}

/* GRAY STYLE wide card */
div.card.impact-report-2020-gray .text-content{background-image: url('https://www.pct.edu/files/impact-report-2020/halftone_25.png');background-color:var(--medium-gray)!important; color:white!important; padding-left:8rem!important;}
div.impact-report-2020-gray.card.wide-1 .text-content *, 
div.impact-report-2020-gray.card.wide-2 .text-content *{color:var(--dark)!important; overflow:visible;}
div.impact-report-2020-gray.card.wide-1 .text-content h4, 
div.impact-report-2020-gray.card.wide-2 .text-content h4{text-transform:uppercase;}
div.impact-report-2020-gray .btn-outline-corner{color:#101833!important;}

/* Candlesticks */
.impact-report-2020-candlesticks{background: url('https://www.pct.edu/files/impact-report-2020/halftone-diagonal-new.jpg') top  center no-repeat; background-size:80%}
canvas.candlestick{position:absolute; top:0; right:0; bottom:0; left:50px; height:100%; width:50px;}
canvas.candlestick-quote{position:absolute; top:0; right:0; bottom:0; left:50px; height:100%; width:50px;}
canvas.candlestick-skinny{position:absolute; top:-100px; right:0; bottom:-100px; left:calc(50% - 25px); height:calc(100% + 200px); width:50px; z-index:-1;}
.hero-chart{border-right:10px var(--green) solid;}

/* Quote */
.impact-report-2020-quote div[class*="col-"]{padding-left:8rem;}

/*
div.impact-report-2020-green.card.wide-1 .text-content{overflow:visible; background-position:2rem 3.5rem; background-size:contain; background-repeat: no-repeat; background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 93.8 600"><polygon fill="white" points="93.8 19 93.8 0 0.1 0 0.1 19 37.5 19 37.5 417 0 417 0 436 37.5 436 56.5 436 93.6 436 93.6 417 56.5 417 56.5 19 93.8 19"/></svg>')}
*/

/* BUTTONS */
div.impact-report-2020-green .btn-outline-corner,
div.impact-report-2020-dark-blue .btn-outline-corner,
div.impact-report-2020-light-blue .btn-outline-corner,
div.impact-report-2020-gray .btn-outline-corner{color:#fff; border:none; background:none; font-size:100%; padding: 0 .25rem;}


