@charset "utf-8";
/* penn_college */
.alert {z-index:100}
.card-deck .card { max-width: 75%; min-width: 290px }
.card-deck .slick-slide { max-width: 75%; min-width: 0 }

canvas{max-width:100%;}

@media (min-width: 576px) {
  .card-columns { column-count: 2; }
  .card-deck .card { /*width: calc(100% - 30px);*/ width:auto; /*min-width: 30%;*/ max-width:83%;}
  
  .card-deck .slick-slide { width:auto; min-width: 0 }
  .card-deck .card { margin-bottom: 15px !important; }
  .crumb { margin: 1rem 0 0; }
  }
  
  @media (min-width: 768px) {
  .card-columns { column-count: 3; }
  /*.card-deck .card { max-width: calc(50% - 30px); }*/
  }
  
  @media (min-width: 992px) {
  .card-columns { column-count: 4; }
  /*.card-deck .card { max-width: calc(33% - 30px); }
  footer .container { max-width: 960px; }
  }
  
  @media (min-width: 1200px) {
  .card-columns { column-count: 5; }
  footer .container { max-width: 1140px; }
  }*/
  }
/* 160 */
.card.wide-1 .text-content h4, .card.wide-2 .text-content h4{font-size:2.5rem; color:#101833;}
.card.wide-1 .text-content h5, .card.wide-2 .text-content h5{color:#101833;}
.card.wide-1 .text-content p, .card.wide-2 .text-content p{font-size:1rem; color:#5c5c5c;}
@media (min-width: 768px) {.slick-1  .text-content:after {content: ''; display:block; padding-bottom: 3rem;}}
.slick-1 .slick-prev, .slick-1 .slick-next {    right: auto !important;    background: rgba(0,255,4,0);    top: auto; bottom:4rem; left:6rem !important;	height: 3rem;transform: translate(0,0) rotate(180deg); z-index: 99 }
.slick-1 .slick-next { left:9rem !important; transform: translate(-3px,1px) rotate(0deg); }

.card-text h1 a, .paragraph--type--card-image h1 a,
.card-text h2 a, .paragraph--type--card-image h2 a,
.card-text h3 a, .paragraph--type--card-image h3 a,
.card-text h4 a, .paragraph--type--card-image h4 a,
.card-text h5 a, .paragraph--type--card-image h5 a,
.card-text h6 a, .paragraph--type--card-image h6 a{text-decoration:underline; text-decoration-color:var(--danger); color:var(--dark-blue);}
.text-light h1 a,.text-light h2 a,.text-light h3 a,.text-light h4 a,.text-light h5 a,.text-light h6 a{text-decoration:underline; text-decoration-color:var(--danger); color:var(--white);}
a u{text-decoration:underline; text-decoration-color:var(--danger);letter-spacing: 0.8px;}
/* Heading links that shouldn't look like anything other than a headline. */
.card-body h1 a.inherit,
.card-body h2 a.inherit,
.card-body h3 a.inherit,
.card-body h4 a.inherit,
.card-body h5 a.inherit,
.card-body h6 a.inherit{text-decoration:inherit;text-decoration-color:inherit;color:inherit;font-family:inherit;}
a.inherit:hover{text-decoration:underline!important;text-decoration-color:var(--danger)!important;}

.font-weight-bold{font-family: 'Roboto' !important; font-weight:700}
.card-deck .card {max-width: none !important;}/* TODO: remove */
/*.btn{border-radius:0;}*/
.btn-dark{background-color:var(--penn-college-blue); font-family:'Roboto Condensed'; font-size:.8rem; letter-spacing:.1em; font-weight:700;}
.text-light.btn{color:var(--white) !important;border-color:var(--white) !important;}
.bg-dark {background-color:var(--dark) !important;}
.bg-dark .text-card{color:var(--dark-blue);}

.paragraph--type--card-image .embiggen{position:absolute; bottom:0; right:0; padding:.5rem .5rem 0 .5rem; opacity:.25; text-shadow: 0 0 20px #000; cursor:pointer; font-size: 1.5em; z-index:1; transition:all 0.35s;}
.paragraph--type--card-image .embiggen i{transition:all 0.35s;}
.paragraph--type--card-image .embiggen:hover i{color:var(--success)!important;}
.paragraph--type--card-image .embiggen:hover{opacity:1!important;}
.paragraph--type--card-image .course{position:relative}
.paragraph--type--card-image .course:before{position:absolute;top: -2rem; left: -1rem; height: 8rem; width: 2rem; z-index: 103; content: ""; background-image: linear-gradient(45deg, rgba(0,0,0,0) 40%, rgba(0, 114, 206,1) 40.5%, rgba(0, 114, 206,1) 50%, rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 90%, rgba(0, 114, 206,1) 90.5%, rgba(0, 114, 206,1) 100%); background-size: 1.25rem 1.25rem; }

.landing-page-hero {
	background-color: var(--penn-college-blue);
	background-image:url('/files/img/halftone_50.png?'), linear-gradient(to top,var(--green) 10px, var(--penn-college-blue) 10.1px);; background-repeat: repeat-y;  background-position: -10% center; 
	overflow:hidden;
}
.landing-page-hero .container{
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' ><circle cx='50%' cy='50%' r='60%' fill='none' stroke='rgba(23,34,54,1)' stroke-width='1px' /></svg>") no-repeat center;
	position:relative; overflow: visible
}

 .landing-page-hero .container:before, .landing-page-hero .container:after{ 
	content:"";position:absolute; width:500px; height:10px; left:-500px; top:50%; transform:translate(5rem,-5px) rotate(180deg);   
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='500' height='10' stroke='rgba(23,34,54,1)' stroke-width='1px'><line x1='0' y1='5' x2='500' y2='5'/><line x1='0' y1='5' x2='7' y2='0'/><line x1='0' y1='5' x2='7' y2='10'/></svg>") no-repeat center;
}
 .landing-page-hero .container:after{ 
	left:auto; right:-500px; top:50%; transform:translate(-5rem,-5px) rotate(0deg);
}
.landing-page-hero .bg-primary{ transform:translateX(6.5rem); z-index: 100; position: relative}
.landing-page-hero .bg-primary:before {
    position: absolute;
    top: -1rem;
    left: -2rem;
    height: 2rem;
    width: 8rem;
    z-index: 103;
    content: "";
    background-image: linear-gradient(135deg, rgba(0,0,0,0) 40%, rgba(72, 184, 92,1) 40.5%, rgba(72,184,92,1) 50%, rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 90%, rgba(72,184,92,1) 90.5%, rgba(72,184,92,1) 100%);
    background-size: 1.5rem 1.5rem;
}
.landing-page-hero .col-sm-8:after {
    position: absolute;
    top: 50%;
    left: 0rem;
    height: 50%;
    width: 2rem;
    z-index: 99;
    content: "";
    background-image: linear-gradient(0deg, rgba(0,0,0,0) 45%, var(--light-gray) 45.5%, var(--light-gray) 50%, rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 95%, var(--light-gray) 95.5%, var(--light-gray) 100%);
    background-size: 3rem 3rem;
}


.program-page-hero{
  background-color: var(--penn-college-blue);
}

.border-wide{ border-width:10px !important;}
.border-2{ border-width:2px !important;}
.bg-light-gray { background: var(--light-gray);}
.text-dark-gray { color: var(--dark-gray);}
.text-dark-blue { color: var(--dark-blue);}
.text-underline {text-decoration: underline;}
.letter-spacing-1{letter-spacing: .25rem}
.btn-outline-corner { 
	background-image: linear-gradient(135deg,transparent 3rem, var(--danger) 3rem); 
	font-size: 80%; 
	/*padding: .8125rem 2rem; */
	text-transform: uppercase; 
	color: var(--dark-gray); 
	border: var(--gray) 1px solid; 
	border-radius: 0; 
	font-family: 'Roboto Condensed', sans-serif; 
	letter-spacing:.1rem;
	font-weight:700;
	background-position:calc(100% + .5rem) 50%; 
	background-repeat: no-repeat;
	transition: all .35s;
	background-size: 3rem 100%;
	transition-timing-function: ease-out;
}
.btn-outline-corner:active, .btn-outline-corner:hover { background-size:calc(100% + 3rem) 100%; color: var(--white); font-weight: 700; text-decoration: none; border: var(--gray) 1px solid;  }
.bg-dark > .btn-outline-corner{color:var(--white); border-color:var(--light-gray);}
.bg-dark .text-card .btn-outline-corner{color:var(--dark-gray);border-color:var(--gray);}
.card .bg-light .btn-outline-corner{color:var(--dark-gray);border-color:var(--gray);}


/*
* Event Card
* TODO: fix hard-coded w-100 defeat. Do 'odd' and add exceptions? e.g. 4?
*/
.paragraph--type--card-event img{position:relative;margin:0 auto -7.5rem -2.5rem;z-index:0;}
.card.slick-slide.paragraph--type--card-event img{position:relative;margin:0 auto -7.5rem -2.5rem;z-index:0;}
.paragraph--type--card-event:nth-child(1) img,
.paragraph--type--card-event:nth-child(4) img,
.paragraph--type--card-event:nth-child(7) img{position:relative;margin:0 -2.5rem -7.5rem auto;z-index:0;}
@media (min-width: 768px) {.card-deck .paragraph--type--card-event img{position:relative;margin:0 auto -7.5rem -2.5rem;z-index:0;}}
.paragraph--type--card-event .d-flex{position:relative;z-index:1;}

.white-textured {
	background-color: var(--white);
	background-image:url('/files/img/halftone_25.png?'); background-repeat: repeat-y;  background-position: left center; 
	overflow:hidden; position: relative;
}
.white-textured:before {
	position: absolute;top:0; bottom:0; left:0; right:0; content: '';
	background-color: rgba(255,0,0,0);
	background-image: url(/files/img/rwr.svg);
	background-repeat: repeat;  
	background-position: center top; 
}
/*#navbar-top, .navbar-top-mobile {background:var(--penn-college-blue) !important;}
#navbar-top ul.aud-nav{margin-left: 0; }
#navbar-top li.nav-item{font-size:62.5%; padding: .5rem 0; margin: 0;}
#navbar-top.navbar-dark .nav-link{color:var(--light)!important;}
#navbar-top li.nav-item a{letter-spacing:.05rem; padding: .3rem .5rem .2rem; font-weight:200; transition: padding .5s;}
#mobile_navbar{position: relative; z-index: 2;}
#block-topactions li.nav-btn:nth-child(1) a.nav-link{background: none !important; color:var(--light) !important; }
#block-topactions li.nav-btn a.nav-link:before { font-family: "Font Awesome 6 Pro"; margin-right: 0.5em; opacity: .9; font-weight: 900;}
#block-topactions li.nav-btn a.nav-link[id*='_apply']:before { content: "\f304";}
#block-topactions li.nav-btn a.nav-link[id*='_visit']:before { content: "\f124";}
#block-topactions li.nav-btn a.nav-link[id*='_give']:before { content: "\f004";}
#block-topactions li.nav-btn a.nav-link[id*='_get']:before { content: "\f05a";}
#block-topactions li.nav-btn a.nav-link[id*='_commit'] { background: var(--warning); color: var(--dark) !important; }
#navbar-top .btn-sm {font-size:82.5%; padding: .25rem .25rem .25rem 2.25rem; color:rgba(180, 220, 255, 1); background:none;}
@media (max-width: 1199.98px) {
  #navbar-top li.nav-item a{letter-spacing:.05rem; padding: .3rem 1.35rem .2rem; font-weight:200;}
  #navbar-top #block-topactions li.nav-item a{letter-spacing:.05rem; padding: .3rem 1.65rem .2rem; font-weight:200;}
}

#navbar-top li.nav-btn a{ margin-left: 0; background:none }
#navbar-top, .navbar-top-mobile {background:var(--penn-college-blue) !important;}
#navbar-top ul.aud-nav{margin-left: -2rem; }
#navbar-top li.nav-item{font-size:62.5%; padding: .5rem 0; margin: 0;}
#navbar-top.navbar-dark .nav-link{color:var(--white)!important;}
#navbar-top li.nav-item a{letter-spacing:.05rem; padding: .3rem 2rem .2rem; font-weight:200; transition: padding .5s;}
#block-topactions li.nav-btn:nth-child(1) a.nav-link{background: #fff !important; color:var(--penn-college-blue) !important; }
@media (max-width: 1199.98px) {
  #navbar-top li.nav-item a{letter-spacing:.05rem; padding: .3rem 1.35rem .2rem; font-weight:200;}
  #navbar-top #block-topactions li.nav-item a{letter-spacing:.05rem; padding: .3rem 1.65rem .2rem; font-weight:200;}
}

#navbar-top li.nav-btn a{ margin-left: .5rem; background:var(--medium-blue) }
.navbar-brand { position: relative; font-weight: 600; }
.navbar-brand:before { position: absolute; height:calc(100% + 1.25rem); width: 646px; content: ''; background: rgba(255,0,4,0); background-image:url(/themes/penn_college/img/halftone_25.png);background-size: auto; background-repeat: no-repeat; background-position: right bottom; top:-.65rem; right:-5rem;}*/
	#block-mastermenu > ul.navbar {margin-top:.5rem}
	#block-mastermenu .nav-item a{color:var(--dark-blue);font-weight: 600; transition: width 2s;}
	#block-mastermenu .nav-item a:after, #block-mastermenu .nav-item a.collapsed:hover::after{content: ''; background: var(--red); display: block; width:100%; height:4px; margin: 4px auto 0;transition: all .2s; transition-timing-function: ease-out;}
	#block-mastermenu .nav-item a.collapsed { font-weight: 400}
	#block-mastermenu .nav-item a.collapsed:after{ width:0px; }
.mega h4:before{ content: ''; background: var(--red); height: 5px; width:1rem; display: block; margin: 1rem 0;}

.site-footer { overflow: hidden;}
#footer{position:relative; background:url('/files/img/halftone_footer.jpg') right top no-repeat;}
#footer2{position:relative;}
#footer2:before{content:''; height:1rem; width:10rem; position:absolute; top:0; left:350px;
  background: linear-gradient(90deg,  
  rgba(0,0,0,0) 95%,
  rgba(72,184,92,1) 95.5%, 
  rgba(72,184,92,1) 100%);
  background-size:2rem 2rem;}
#footer:after{content:''; height:2rem; width:10rem; position:absolute; top:6.5rem; right:-4.5rem; 
  background: linear-gradient(135deg, 
  rgba(0,0,0,0) 40%, 
  rgba(255,255,255,.8) 40.5%, 
  rgba(255,255,255,.8) 50%,
  rgba(0,0,0,0) 50.5%, 
  rgba(0,0,0,0) 90%,
  rgba(255,255,255,.8) 90.5%, 
  rgba(255,255,255,.8) 100%);
  background-size:2rem 2rem;
  background-position:5% center;
  transform:rotate(90deg);}

@media (max-width: 575.98px) {
  #footer:before,#footer:after{display:none;}
}

.bg-penn-college-blue{background-color:var(--penn-college-blue)!important;}

h5{font-size:1rem;  line-height: 1.35em; letter-spacing: .2em; font-weight:bold;}
h5:before, text-center > h5:before{ content: ''; background: var(--green); height: 5px; width:1rem; display: block; margin: 1rem auto;}
.text-left h5:before{ margin: 1rem  0;}
.text-left .card-body>h5:before{ margin: 1rem  0;}
h6{font-size:14px; line-height: 1.9em; letter-spacing: .1em}

h2{font-size:3.5rem; }
h2{font-size:3rem; }
h3{font-size:2.5rem; }
h4{font-size:2rem; }
h1, h1 a, h2, h2 a, h3, h3 a, h4, h4 a, .display-4 {font-family: 'Roboto Condensed', sans-serif; font-weight: 700 !important; line-height: 1;}
.text-light{color: var(--white) !important;}
.text-light-blue{color:var(--light-blue)!important;}

/* 
affording-penn-college
*/
.affording-penn-college{background-color:var(--medium-blue); background-image:url(/themes/penn_college/img/halftone_50.png); background-position: right top; background-repeat: no-repeat; color:#fff; }
.affording-penn-college .btn-outline-corner{color: white; border-color:white; font-weight: normal;}
.affording-penn-college .number .fa-2x{color: white !important; font-size: 3rem; margin-bottom:1rem;}
.affording-penn-college .number p.text-danger{color:white !important; text-transform:uppercase; font-size:6rem; line-height:.85;}
.affording-penn-college .card.number .slantything{ overflow:visible;}
.affording-penn-college .card.number .slantything:after{
  content:'';
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><circle cx="50%" cy="50%" r="49%" fill="none" stroke="rgba(255,255,255,.25)" stroke-width="1px"/><circle cx="50%" cy="50%" r="40%" fill="none" stroke="rgba(255,255,255,.25)" stroke-width="5px"/></svg>') no-repeat center;
	background-color:rgba(20,55,69,0);
  position:absolute;
  top:-3rem;
  left:-3rem;
  bottom:-3rem; 
  right:-3rem;
  width:calc(100% + 6rem);
  height:calc(100% + 6rem);
	overflow: visible;
}
.affording-penn-college .card.number:before{
  content:'';
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><line x1="0%" y1="50%" x2="80%" y2="50%" stroke="rgba(255,255,255,.25)" stroke-width="1px"/></svg>') no-repeat center;
	background-color:rgba(20,55,69,0);
  position:absolute;
  top:50%;
	left:auto;
  right:50%;
  width:calc(200% + 12rem + 10px);
  height:2px;
	overflow: visible;
}
/*
landing-page-hero
*/
.landing-page-hero {
	background-color: var(--penn-college-blue);
	background-image:url('/files/img/halftone_50.png?'), linear-gradient(to top,var(--green) 10px, var(--penn-college-blue) 10.1px);; background-repeat: repeat-y;  background-position: -10% center; position:relative;
	overflow:visible;
}
.landing-page-hero .hero_bg{
background: no-repeat center;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%'  stroke='rgba(23,34,54,1)' stroke-width='1px' ><circle cx='50%' cy='50%' r='60%' fill='none'/><line x1='10%' y1='50%' x2='9.25%' y2='48%'/><line x1='10%' y1='50%' x2='9.25%' y2='52%'/><line x1='0%' y1='50%' x2='10%' y2='50%' /><line x1='90%' y1='50%' x2='90.75%' y2='52%' /><line x1='90%' y1='50%' x2='90.75%' y2='48%'/><line x1='100%' y1='50%' x2='90%' y2='50%'/></svg>") ;
	position:relative; overflow: visible; margin:0 -15px;
}
/*
bg-pre-footer
*/
.bg-pre-footer{	
background: no-repeat center var(--medium-blue);
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%'  ><rect x='0%' y='92%' width='100%' height='10%' fill='rgba(33,74,159,1)' /><circle cx='-10%' cy='50%' r='70%' fill='rgba(0,114,206,1)'  stroke='rgba(23,34,54,1)' stroke-width='1px'/></svg>") ;
position:relative; overflow: visible; margin:0 -15px;
}
.bg-pre-footer:before{	
background: no-repeat center right; content:''; position: absolute; top: 3rem; height:20px; width:1000px; right:15%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='20' stroke='rgba(23,34,54,1)' stroke-width='1px' ><g> <line x1='1000' y1='10' x2='992' y2='3'/> <line x1='1000' y1='10' x2='992' y2='17'/> <line x1='0' y1='10' x2='1000' y2='10' /></g></svg>") ;
}
.bg-pre-footer:after{	
background: no-repeat center right; content:''; position: absolute; top: calc(92% - 9px); height:20px; width:1000px; left:35%; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='20' stroke='rgba(23,34,54,1)' stroke-width='1px' ><g> <line x1='0' y1='10' x2='8' y2='3'/> <line x1='0' y1='10' x2='8' y2='17'/> <line x1='0' y1='10' x2='1000' y2='10' /></g></svg>") ;
}
.bg-pre-footer .container{ margin-top: -3rem;	padding-top:6rem; padding-bottom: 6rem}
.bg-pre-footer .container:before {
    position: absolute;
    top: 0;
    left: 60%;
    height: 2rem;
    right: -3rem;
    content: "";
    background-position: top left, right , bottom right;
    background-image: linear-gradient(135deg,#0072ce 50%, transparent 50% ),linear-gradient(135deg,transparent 50%, #0072ce 50% ), linear-gradient(135deg, transparent 0%, rgba(255,255,255,.6) 5%, transparent 5% , transparent 50%, rgba(255,255,255,.6) 50%, rgba(255,255,255,.6) 55%, transparent 55% );
    background-size: 2rem 2rem, 2rem 3rem, .75rem .75rem;
    background-repeat: no-repeat, no-repeat, repeat;
}
@media (min-width: 768px) {	
	.bg-pre-footer  .container:before {	right: 10%;}
	.bg-pre-footer:before	{ right: 75%	} 
	.bg-pre-footer:after	{ left: 75%; top:calc(90% - 9px)	} 
	.bg-pre-footer{	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%'  ><rect x='50%' y='90%' width='50%' height='10%' fill='rgba(33,74,159,1)' /><circle cx='50%' cy='50%' r='50%' fill='rgba(0,114,206,1)'  stroke='rgba(23,34,54,1)' stroke-width='1px'/></svg>") ;}
}
/*
paragraph--type--card-accordion
*/
.has_accordion .paragraph {height:100%;}
.paragraph--type--card-accordion>div{margin: 0 auto 0 0; }
.paragraph--type--card-accordion + .paragraph {flex-grow: .5; height:100%;}
.paragraph + .paragraph--type--card-accordion {flex-grow: 2; }
.paragraph + .paragraph--type--card-accordion>div{margin:0 0 0 auto;}

.card-accordion-section p,.card-accordion-section ul,.card-accordion-section ol{opacity:.8;font-size:90%;}

/*
admissions-types
*/
.admissions-types .card-deck > .card:last-child{background: transparent !important; margin-left: 2rem}
.admissions-types .card-deck > .card:last-child .row{ display: block !important}
.admissions-types .card-deck > .card:last-child .row .col-md{ display: block !important; flex:0 0 100%; max-width: 85%; background: var(--dark-blue); color:white}
.admissions-types .card-deck > .card:last-child .row .text-center{ padding:3rem 2rem 1rem; margin: 15px;}
.admissions-types .card-deck > .card:last-child .row .text-uppercase{ font-size:82.5%;}
.admissions-types .card-deck > .card:last-child .row .thing_to_get_slanty{ padding:0 !important; margin: 2rem 0 -5rem auto !important}
.admissions-types .card-deck > .card:last-child .row .thing_to_get_slanty:before{top:0 !important; right:0 !important; bottom:0 !important; left:auto !important; width:2rem !important; height: auto !important;background-color:var(--medium-blue); background-image:url(/themes/penn_college/img/halftone_50.png);background-size: auto; background-position: center}
.admissions-types .card-deck > .card:last-child .row .col-md .rounded-circle{border-radius:0 !important; padding: 0 !important}

/*
* HOMEPAGE
*/
.homepage-hero .mb-4vw{margin-bottom:8vw;}
.homepage-hero h1.display-1{font-size:8.25rem; line-height:.85; text-transform:uppercase; font-family: 'Roboto Condensed', sans-serif;}
.homepage-hero p.h3{font-size:2.75rem; margin: 1rem 0}
.homepage-hero h1.display-1:before{ content: ''; background: var(--red); height: .5rem; width:1.5rem; display: block; margin: 1rem 0 .5rem .5rem;}
.homepage-hero{ position:relative; overflow:hidden}
.homepage-hero video{position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: 0;transform: translateX(-50%) translateY(-50%);}


.homepage-hero .container-fluid {opacity: 1; background-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.52), rgba(0, 0, 0, 0.94)); z-index: 2;}

.homepage-hero p.h3{position: relative;}
.homepage-hero p.h3:before{  
		content:"";position:absolute; width:1000px; height:2px; top:50%; right:100%; transform:translate(-32px,-1px);   
		background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='2' stroke='rgba(255,255,255,1)' stroke-width='2px'><line x1='0' y1='1' x2='1000' y2='1'/></svg>") no-repeat center; }
	.your_op{			
	background-position: bottom left; 
	background-repeat:no-repeat;
	background-size:contain;
	background-color:var(--medium-blue);
	
  z-index:4;
	position:relative;
	margin:0 0 5rem 0;
	}
.your_future{			
	background-position: center right, bottom right; 
	background-repeat:no-repeat;
	background-size:contain ,auto;
	background-color:var(--medium-blue);
  z-index:1;
	position:relative;
	margin:0;
	padding:12.5rem 0 5rem;
	
	}
.your_future .number{z-index:11; border-radius:50%; background:var(--penn-college-blue);background-image: url(/sites/default/files/bg/halftone_border_dark_bg.jpg); background-size:contain; background-repeat:no-repeat; background-position:left center;   height:20rem; width:20rem; position:absolute; top:100%; left:50%;transform:translate(calc(-10rem + 12.5vw),-30%)}
.your_future .number h3 {position:absolute;bottom:8.5rem; width:100%; font-size:6rem}
.your_future .number p {position:absolute;top:11.5rem; left:50%; width:50%; transform:translate(-50%,0)}

 .your_future .number:after{ display:none }
.your_future .number:before{  
		content:"";position:absolute; width:100px; height:60px; top:10rem; left:0; transform:translate(-50%,-50%) rotate(180deg);   
		background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='60' stroke='rgba(255,255,255,.5)' fill='none' stroke-width='2px'><line x1='18' y1='12' x2='100' y2='12'/><rect width='7' height='7' x='10' y='0' transform='rotate(45)' /></svg>") no-repeat center; }
.your_future .nbg{z-index: 9; position: relative; overflow: visible; height:25vw;min-height: 15rem; width:75vw;  margin: 3rem 0 12rem -15px}
@media (min-width: 768px) {	
	.your_future .number{transform:translate(-50%,-30%)}
	.your_future .nbg{z-index: 9; position: relative; overflow: visible; height:25vw; margin: 18rem 0 15rem -15px;  background-position: 25% 75%; background-size:cover; width:100%}
	.your_future .nbg:before{z-index: 9; position: absolute;content: 'YOUR'; top:0; left:0; height:6rem; width: 32rem; background-position: center right; font-family:'Roboto Condensed', sans-serif; font-weight: 700; font-size: 200px; line-height: .7; color:rgb(33,74,159); transform: rotate(-90deg) translate(1rem,-14rem);background-image: linear-gradient(45deg, rgba(0,0,0,0) 40%, rgba(40, 167, 69,1) 40.5%, rgba(40, 167, 69,1) 50%, rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 90%, rgba(40, 167, 69,1) 90.5%, rgba(40, 167, 69,1) 100%);
			background-size:1.5rem 1.5rem; background-repeat: repeat-y  }
	.your_future .nudge-up {transform: translateY(-50%); margin-bottom: -50%	}
}
.your_future .circ-down-arrow:before{top:2rem}
@media (min-width: 768px) {	.your_future{background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" viewBox="0 0 200 1050"><text style="font-size: 220px; opacity: 0.125; fill: none; stroke:white; stroke-width:2px; font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(220 1050) rotate(-90)">FUTURE</text></svg>'),url(/sites/default/files/bg/halftone_circle_bg.jpg);}}
@media (min-width: 768px) {	.your_op{background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" viewBox="0 0 200 1050"><text style="font-size: 60px; opacity: 0.2; fill: white; font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(38 1050) rotate(-90)">REAL WORLD</text><text style="font-size: 300px; opacity: 0.125; fill: none; stroke:white; stroke-width:2px; font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(196 1050) rotate(-90)">READY</text></svg>');}}
	 .img_circ, .img_circ img{
	position:relative; margin-top:-12%;overflow:visible; }
.img_circ img {border-radius:50%;height:100%; width:100%; max-width: 500px}
.your_peeps .img_circ img{margin-top: 0;  width:15rem; overflow:hidden;}
.your_peeps .img_circ{margin:0; width:50%}
@media (min-width: 576px) {.your_peeps .img_circ{ width:10rem}}
@media (min-width: 768px) {.your_peeps .img_circ{ width:13rem}}
.your_peeps .img_circ:before {
    position: absolute;
    bottom: 50%;
    left: -5rem;
    height: 2rem;
    width: 8rem;
    z-index: 103;
    content: "";
    background-image: linear-gradient(135deg, rgba(0,0,0,0) 40%, rgba(0, 114, 206,1) 40.5%, rgba(0, 114, 206,1) 50%, rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 90%, rgba(0, 114, 206,1) 90.5%, rgba(0, 114, 206,1) 100%);
    background-size: 1.25rem 1.25rem; }
	.your_op .number{
		 height:20rem; padding:0 3rem; width:20rem; margin:0 auto; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' ><circle cx='50%' cy='50%' r='45%' fill='none' stroke='rgba(72,184,92,1)' stroke-width='2px' /></svg>") no-repeat center;
	position:relative; overflow: visible
		
	}	
	.your_op .number h3{
		font-family: 'Roboto Condensed', sans-serif; position:absolute; bottom:10rem;  line-height:.8; left:0; right:0; font-size:6rem}
	.your_op .number p{ position:absolute; top:10rem;  line-height:1.4; left:3rem; right:3rem}

	.your_op .number:before, .your_op .number:after{ 
		content:"";position:absolute; width:2px; height:52px; top:0; left:50%; transform:translate(-1px,-24px);   
		background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='2' height='52' stroke='rgba(72,184,92,1)' stroke-width='2px'><line x1='1' y1='0' x2='1' y2='52'/></svg>") no-repeat center; }
	.your_op .number:after{ 
		bottom:0; top:auto; left:50%; transform:translate(-1px,24px);
		
	}
	.your_op .container-fluid:after, .your_peeps .container-fluid:after{ 
		content:"";position:absolute; width:10rem; height:3rem; bottom:0; right:0; transform:translate(0,1.5rem);   
		background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' stroke='rgba(33,74,159,1)' stroke-width='2px'><line x1='1' y1='0' x2='1' y2='30'/></svg>") repeat left; }
.your_peeps .container-fluid:after{ 
		height:2rem; bottom:0; right:50%; transform:translate(4rem, 1rem); }
.circ-down-arrow:before{
	content:''; width:50px; height: 202px; position: absolute; 
	top:-25px; 
	right:-70px;

	background-repeat:  no-repeat; 
	background-position: top center; 
	background-size: cover;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='202' stroke='rgba(255,255,255,1)' stroke-width='2px' fill='none'><line x1='25' y1='35' x2='25' y2='200'/><line x1='15' y1='190' x2='25' y2='200'/><line x1='35' y1='190' x2='25' y2='200'/><circle cx='25' cy='25' r='24' fill='none' /><circle cx='25' cy='25' r='10'  /></svg>");
}
.your_peeps .circ-down-arrow:before{
	
	top:5rem; 	
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='202' stroke='rgba(216,59,24,1)' stroke-width='2px' fill='none'><line x1='25' y1='35' x2='25' y2='200'/><line x1='15' y1='190' x2='25' y2='200'/><line x1='35' y1='190' x2='25' y2='200'/><circle cx='25' cy='25' r='24' fill='none' /><circle cx='25' cy='25' r='10'  /></svg>");
}
@media (min-width: 768px) { .circ-down-arrow:before{right:-.9rem}}
@media (min-width: 992px) {.circ-down-arrow:before{right:1.8rem}}
@media (min-width: 1200px){ .circ-down-arrow:before{right:3.6rem}}

.your_peeps{			
	background-position: center right; 
	background-repeat:no-repeat;
	background-size:contain;
	background-color:var(--light-blue);
	
  z-index:3;
	position:relative;
	margin:-5rem 0 0;
	padding-top:10rem;
	}
@media (min-width: 768px) {	.your_peeps{background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" viewBox="0 0 200 1300"><text style="font-size: 40px; opacity: 0.2; fill: rgba(33,74,159,1); font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(140 1200) rotate(-90)">COMMUNITY</text><text style="font-size: 40px; opacity: 0.25; fill: rgba(33,74,159,1); font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(180 1200) rotate(-90)">OF</text><text style="font-size: 200px; opacity: 0.125; fill:rgba(33,74,159,1); font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(200 1150) rotate(-90)">CREATORS</text></svg>');}}
/*
* ACCORDION
*/
@keyframes fade_out {0% {transform:rotate(90deg)}100% {transform:rotate(0deg)}}
@keyframes fade_in {0% {transform:rotate(0deg)}100% {transform:rotate(90deg)}}
.card-accordion-section .card-header > .btn,
.card-accordion-section .card-header > .btn:focus,
.card-accordion-section .card-header > .btn:active,
.card-accordion-section .card-header > .btn:hover,
.card-accordion-section .card-header > .btn:hover{border-bottom:0 !important; text-decoration:none!important; box-shadow:none!important; outline:0 !important;}
.card-accordion-section  span.fa-stack {position:relative;}
.card-accordion-section  span.fa-stack i{position:absolute; left:50%;}
.card-accordion-section  .card-header > .btn:not(.collapsed) svg line:nth-child(2){transform-origin: 50% 50%; animation: .25s fade_in; transform:rotate(90deg);}
.card-accordion-section  .card-header > .btn.collapsed svg line:nth-child(2){transform-origin: 50% 50%; animation: .25s fade_out; transform:rotate(0deg)}
.card-accordion-section  .card-header{background-color:transparent;}
.card-accordion-section h6{color:var(--dark-blue);}
.card-accordion-section svg line{stroke:var(--danger);}

div[class*="divdark"] .accordion{color:var(--white);}
div[class*="dark"] .card-accordion-section .card-header{border-bottom:1px solid rgba(255,255,255,.125);}
div[class*="dark"] .card-accordion-section h6{color:var(--white);}
div[class*="dark"] .card-accordion-section svg line{stroke:var(--green);}

/*
* ARTICLES
*/
.verylarge:before{content: '';background: var(--green);height: 5px;width: 1rem;display: block;margin: 0 0 1rem 0;}
.stripes:after{position: absolute;bottom: -2.9rem;right: 0;height: 2rem;width: 8rem;z-index: 103;content: "";background-image: linear-gradient(135deg,rgba(0,0,0,0) 40%,rgba(0,114,206,1) 40.5%,rgba(0,114,206,1) 50%,rgba(0,0,0,0) 50.5%,rgba(0,0,0,0) 90%,rgba(0,114,206,1) 90.5%,rgba(0,114,206,1) 100%);background-size: 1.25rem 1.25rem;}

/*
* MODAL
*/
.modal-backdrop.show{opacity:.85;}
.modal{padding-top:100px;}/* allows close button to be visible */

/*
* FORMS (moved to webform.css)
*/
.


/*
* Reverse Form
*/
.bg-dark label {
  text-transform: uppercase;
  color: #fff;
  font-family: 'Roboto';
  font-weight: bold;
  letter-spacing: 2.8px;
  font-size: .9358em;
}

.bg-dark .input-group-text {
  background: transparent;
}
.bg-dark .form-control {
  background-color:transparent;
  color:#5C5C5C;
}

.bg-dark span.fieldset-legend {
  color: #fff;
}

.bg-dark .form-control:not(select):focus {
  color:#fff;
}

/*
* Card Styles

.card.translucent-blue-green-stitch:before{content: '';height: 12rem;width: 2rem;position: absolute;top: 2rem;left: -1rem;background: linear-gradient(0deg, rgba(0,0,0,0) 95%, rgba(72,184,92,1) 95.5%, rgba(72,184,92,1) 100%);background-size: 2rem 2rem;}
.card.translucent-blue-green-stitch{opacity:.85;background-color:var(--penn-college-blue)!important;color:var(--white);text-align:center!important;max-width:75%!important;}
.card.translucent-blue-green-stitch .card-title{display:block !important;}
.card.translucent-blue-green-stitch .card-body>h5:before{margin:1rem auto !important;}
.card.translucent-blue-green-stitch .card-body .text-dark-gray{color:#fff!important;}
.card.translucent-blue-green-stitch .btn{border-color:var(--white);color:var(--white);}
*/

.card.light-gray-corner .card-body:after{content: '';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><line x1="50%" y1="100%" x2="100%" y2="50%" stroke="rgba(216,59,24)" stroke-width="2px" /></svg>') no-repeat center;position: absolute;bottom: 0;right: 0;width: 10rem;height: 10rem;}
.card.light-gray-corner .card-body{color: var(--dark-blue); background-color:#f8f8f8!important;}
.card.light-gray-corner .card-body{padding-left:2rem !important; padding-right:2rem !important; position:relative;}
.card.light-gray-corner .card-footer{position:relative; border-bottom:1px solid var(--white) !important; opacity:.8;}
.card.light-gray-corner .card-footer .btn-outline-corner{color:var(--white)!important; padding:1rem 2rem 1rem 0; margin:0; border:0; white-space:normal; background:transparent; text-align:left;}
.card.light-gray-corner .card-footer:after{content:"\f061"; font-family:"Font Awesome 6 Pro"; position:absolute; top:50%; right:0; transform:translateY(-50%); color:var(--green) !important;}

.card.light-gray-blue-border{background-color:#f8f8f8!important;border-top:2px solid var(--penn-college-blue)!important;}

.card.light-gray-background-top-border-dark-blue{background-color:var(--light-gray)!important;border-top:2px solid var(--dark-blue)!important;}

.card.light-gray-background-top-border-red{background-color:var(--light-gray)!important;border-top:2px solid var(--red)!important;}
.card.light-gray-background-top-border-red .card-title{color:var(--dark-blue)!important;}
.card.light-gray-background-top-border-red .card-body{color:#5c5c5c!important;}

.card.penn-college-blue-white-text{color:var(--white)!important; /*padding:5rem;*/ background: var(--medium-blue)!important;}
.card.penn-college-blue-white-text .card-title{color:var(--white)!important;}
.card.penn-college-blue-white-text .card-text,.card.penn-college-blue-white-text .card-text p{color:var(--white)!important;}
.card.penn-college-blue-white-text .bg-white{background-color:var(--penn-college-blue)!important;}
.card.penn-college-blue-white-text .btn{border-color:var(--white);color:var(--white);}

.card.transparent-background-top-right-green-stitches{position:relative;}
.card.transparent-background-top-right-green-stitches:after{content: '';height: 10rem;width: 2rem;position: absolute;top: 2rem;right: -1rem;background: linear-gradient(0deg, rgba(0,0,0,0) 95%, rgba(72,184,92,1) 95.5%, rgba(72,184,92,1) 100%);background-size: 2rem 2rem;}

.card.transparent-background-top-left-green-stitches{position:relative;}
.card.transparent-background-top-left-green-stitches:after{content: '';height: 10rem;width: 2rem;position: absolute;top: 2rem;left: -1rem;background: linear-gradient(0deg, rgba(0,0,0,0) 95%, rgba(72,184,92,1) 95.5%, rgba(72,184,92,1) 100%);background-size: 2rem 2rem;}

.card.light-gray-background-top-border-dark-blue-crazy-link{background-color:var(--light-gray)!important;border-top:5px solid var(--medium-blue)!important;}
.card.light-gray-background-top-border-dark-blue-crazy-link .card-img-overlay{padding-left:4rem;}
.card.light-gray-background-top-border-dark-blue-crazy-link .black50{background:linear-gradient(to bottom, rgba(21, 21, 21, 0.3), #222222);}
.card.light-gray-background-top-border-dark-blue-crazy-link .btn.btn-outline-corner{position:relative; border:none; background:none; padding:0; margin:0; color:var(--white)!important; font-weight:700; text-decoration:underline; text-decoration-color:var(--danger);}
.card.light-gray-background-top-border-dark-blue-crazy-link .btn.btn-outline-corner:before{content: '';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><line x1="0" y1="14" x2="40" y2="14" stroke="rgba(216,59,24)" stroke-width="2px" /><rect x="45" y="-35" width="10" height="10" stroke="rgba(216,59,24)" stroke-width="2px" transform="rotate(45)" fill="none"/></svg>') no-repeat center;position: absolute;left: -75px;top: -3px;width: 70px;height: 28px;}

.card.card-quote .orange_slanty_lines{position:relative;}
.card.card-quote .orange_slanty_lines:before{position: absolute; top: 33%; right: -3.5rem;height: 2rem;width: 6rem; z-index: 3;content: "";background-image: linear-gradient(135deg, rgba(0,0,0,0) 40%, rgba(216,59,24,1) 40.5%, rgba(216,59,24,1) 50%,rgba(0,0,0,0) 50.5%, rgba(0,0,0,0) 90%, rgba(216,59,24,1) 90.5%, rgba(216,59,24,1) 100%);background-size: 1rem 1rem;}

/* TODO: Image cards all have a px-0 on them. Which looks off when using a gray card on a dark background. */
.dark-blue-background-middle-right-real-world .card.light-gray-background-top-border-red .card-body.px-0{padding-left:1.25rem!important;padding-right:1.25rem!important;}
.dark-blue-background-middle-right-real-world .card.light-gray-background-top-border-red .card-footer.px-0{padding-left:1.25rem!important;padding-right:1.25rem!important;}
.dark-blue-background-middle-right-real-world  .card.bg-transparent a.btn-outline-corner{color:var(--white); border-color:var(--light-gray);}
.dark-blue-background-middle-right-real-world  .card.bg-transparent .text-dark a.btn-outline-corner{color:var(--dark-gray); border-color:var(--dark-gray);}
/*
* Section/Deck Backgrounds
*/
.transparent-background-middle-left-green-stitches{position:relative;}
.transparent-background-middle-left-green-stitches:before{content: '';height: 12rem;width: 2rem;position: absolute;top: 2rem;left: 0;background: linear-gradient(0deg, rgba(0,0,0,0) 95%, rgba(72,184,92,1) 95.5%, rgba(72,184,92,1) 100%);background-size: 2rem 2rem;}

.bg-border-bottom-left{background:url('/files/img/bg_border-blue-green.png') bottom left no-repeat;background-size: 300px;}
.bg-halftone-bottom-right{background-image:url('/files/img/halftone_25.png'); background-position:100% 0; background-repeat:no-repeat;}

.bg-middle-left-circles{position:relative;}
.bg-middle-left-circles:before{content:'';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><circle cx="20%" cy="50%" r="29%" fill="none" stroke="rgba(92,92,92,.15)" stroke-width="8px" /><circle cx="20%" cy="50%" r="37%" fill="none" stroke="rgba(92,92,92,.15)" stroke-width="2px" /></svg>') no-repeat center;position:absolute;top:0;left:0;bottom:0; right:0;}

.light-blue-background-middle-right-circle{position:relative;background-color:var(--light-blue)!important;}
.light-blue-background-middle-right-circle:before{content:'';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%"><circle cx="80%" cy="40%" r="37%" fill="rgba(213,232,242,1)" /></svg>') no-repeat center;position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;}
.light-blue-background-middle-right-circle > div.container{position:relative; z-index:1;}
.light-blue-background-middle-right-halftone-circle{position:relative; background:url('/files/img/bg_border-blue-green.png') bottom left no-repeat var(--light-blue);background-size: 300px;}
.light-blue-background-middle-right-halftone-circle:before{content:'';background: url('/files/img/bg_halftone_circle.png') center center no-repeat;position:absolute;top:0;right:-250px;bottom:0;background-size:cover; width:600px; height:600px;}

.dark-blue-triangle-halftone-background-center-left-circle{position:relative;background:url('/files/img/bg_halftone_triangle.jpg') bottom left repeat-x var(--dark-blue);}
.dark-blue-triangle-halftone-background-center-left-circle .deck-btn,
.dark-blue-triangle-halftone-background-center-left-circle .card-quote .btn.btn-outline-corner{border-color:var(--white)!important; color:var(--white)!important;}
@media (min-width: 768px) {.dark-blue-triangle-halftone-background-center-left-circle:before{content:'';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><circle cx="25%" cy="50%" r="300" fill="none" stroke="rgba(92,92,92,.15)" stroke-width="8px" /><circle cx="25%" cy="50%" r="335" fill="none" stroke="rgba(92,92,92,.15)" stroke-width="2px" /></svg>') no-repeat center;position:absolute;top:0;right:0;bottom:0;left:0;}}

.light-blue-triangle-halftone-background-center-right-circle{position:relative;background:url('/files/img/bg_medium_halftone_triangle.jpg') bottom left repeat-x;background-color:var(--penn-college-blue)!important;}
.light-blue-triangle-halftone-background-center-right-circle .deck-btn{border-color:var(--white)!important; color:var(--white)!important;}

@media (min-width: 768px) {.light-blue-triangle-halftone-background-center-right-circle:before{content:'';background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><circle cx="66%" cy="50%" r="300" fill="none" stroke="rgba(255,255,255,.15)" stroke-width="8px" /><circle cx="66%" cy="50%" r="335" fill="none" stroke="rgba(255,255,255,.15)" stroke-width="2px" /></svg>') no-repeat center;position:absolute;top:0;right:0;bottom:0;left:0;}}

.transparent-blue-background-top-left-halftone, .transparent-blue-background-top-left-halftone > div.container{position:relative;}
.transparent-blue-background-top-left-halftone:before{content:'';position:absolute;top:0; right:0; bottom:0; left:0; z-index:0; background:url('/files/img/halftone_50.png?') left top no-repeat;}
.transparent-blue-background-top-left-halftone h2{color:var(--white);}
.transparent-blue-background-top-left-halftone  .deck-btn{border-color:var(--white)!important; color:var(--white)!important;}

.dark-blue-background-top-left-halftone-repeating-read-world-relevant{background:url('/files/img/bg-dark-blue-real-world-relevant.jpg') center center no-repeat; background-size:cover;}
.dark-blue-background-top-left-halftone-repeating-read-world-relevant  .deck-btn{border-color:var(--white)!important; color:var(--white)!important;}

.dark-blue-background-bottom-right-halftone{position:relative;}
.dark-blue-background-bottom-right-halftone:before{content:'';position:absolute;top:0; right:0; bottom:0; left:0;background:url('/files/img/halftone_50.png') bottom right no-repeat var(--penn-college-blue);}
.dark-blue-background-bottom-right-halftone div[class*="accordion_section"] a{color:var(--white)!important; font-weight:bold; border-bottom:1px solid #fff;}
.dark-blue-background-bottom-right-halftone  .deck-btn{color:var(--white); border-color:var(--light-gray);}

.dark-blue-background-middle-right-real-world{position:relative; background-color:var(--dark-blue);}
.dark-blue-background-middle-right-real-world:before{content: '';height: 12rem;width: 2rem;position: absolute;top: 2rem;left: -1rem;background: linear-gradient(0deg, rgba(0,0,0,0) 95%, rgba(72,184,92,1) 95.5%, rgba(72,184,92,1) 100%);background-size: 2rem 2rem;}
.dark-blue-background-middle-right-real-world  .deck-btn{border-color:var(--white)!important; color:var(--white)!important;}
@media (min-width: 768px) {.dark-blue-background-middle-right-real-world{background-repeat: no-repeat; background-position: top right; background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" viewBox="0 0 275 1050"><text style="font-size: 80px; opacity: 0.2; fill: white; font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(230 1050) rotate(-90)">REAL WORLD</text><text style="font-size: 400px; opacity: 0.125; fill: none; stroke:white; stroke-width:2px; font-weight: 700; font-family:\'Roboto Condensed\', sans-serif;" transform="translate(290 1050) rotate(-90)">READY</text></svg>');}}

.light-gray-background-bottom-left-border-blue{background:url('/files/img/bg_border-blue-blue.png') bottom left no-repeat var(--light-gray);background-size: 300px;}

.transparent-background-top-right-slants{position:relative;}
.transparent-background-top-right-slants:before{content:'';position:absolute;top:0;right:-500px;width:1000px;height:60px;background-position: top left;background-image: linear-gradient(135deg, rgb(250,250,250) 50%, transparent 50% ), linear-gradient(135deg, transparent 0%, #ccc 5%, transparent 5% , transparent 50%, #ccc 50%, #ccc 55%, transparent 55% );background-size: 60px 60px, 1rem 1rem;background-repeat: no-repeat, repeat;}

.light-gray-background-top-left-halftone{background-color:var(--light-gray); background-image:url('/files/img/halftone_25.png'); background-position:top left; background-repeat:no-repeat;}

.bg-dark .deck-btn{border-color:var(--white)!important; color:var(--white)!important;}

@media (min-width: 576px) {
  .bg-pre-footer_x{background:url(/files/img/bg-pre-footer.gif) center center no-repeat var(--medium-blue);background-size:cover;}
  .bg-pre-footer_x .btn-outline-corner{background-color:var(--dark-blue);border-color:var(--dark-blue);}
}

@media (min-width: 576px) {
  .light-blue-background-follow-your-path:before,.light-gray-background-follow-your-path:before{background-image:none;}
}
@media (min-width: 768px) {
  .light-blue-background-follow-your-path, .light-gray-background-follow-your-path{position:relative;}
  .light-blue-background-follow-your-path:before, .light-gray-background-follow-your-path:before{
    content:'';
    background-image:
		 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"  width="279" height="134" viewBox="0 0 279 134"><text style="font-size: 30px; fill: white; font-weight: 700; letter-spacing:.35em; font-family:\'Roboto Condensed\', sans-serif;" x="0" y="30">FOLLOW<tspan x="0" dy="60" style="font-size: 60px;">YOUR</tspan></text></svg>'),
		 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"  width="60" height="300" viewBox="0 0 60 300" ><text style="font-size: 90px; fill: none; stroke:white; stroke-width:1px; font-weight: 700; letter-spacing:.1em; font-family:\'Roboto Condensed\', sans-serif;" x="0" y="0" transform="translate(1,0) rotate(90)" >PATH</text></svg>');
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background-position:left 33%, right center;
    background-repeat:no-repeat;
		background-size: auto, contain;
  }
}
@media (min-width: 768px) {
  .light-gray-background-follow-your-path{position:relative;}
  .light-gray-background-follow-your-path:before{
     background-image:
		 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"  width="279" height="134" viewBox="0 0 279 134"><text style="font-size: 30px; fill: rgb(224,223,223); font-weight: 700; letter-spacing:.35em; font-family:\'Roboto Condensed\', sans-serif;" x="0" y="30">FOLLOW<tspan x="0" dy="60" style="font-size: 60px;">YOUR</tspan></text></svg>'),
		 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"  width="60" height="300" viewBox="0 0 60 300" ><text style="font-size: 90px; fill: none; stroke:rgb(224,223,223); stroke-width:1px; font-weight: 700; letter-spacing:.1em; font-family:\'Roboto Condensed\', sans-serif;" x="0" y="0" transform="translate(1,0) rotate(90)" >PATH</text></svg>');
  }
}
  /**
  * IMPACT REPORT 2019.
  */
  /**
	* LOGO
	*/
	.impact-report-logo svg{width:350px;}
	/**
	* PLAIN
	*/
	.impact-report-plain{background-image: url(/files/img/halftone_25.png);background-position: 100% 0;background-repeat: no-repeat;}
	.impact-report-plain path, .impact-report-plain line{stroke:var(--green);}
	.impact-report-plain .body-container{position:absolute; bottom:6rem; right:0; left:5rem; margin-right:15px; line-height:1.35em;}

	/**
	* WHITE
	*/
	.impact-report-white{background-image: url(/files/img/halftone_25.png);background-position: 100% 0;background-repeat: no-repeat;}
	.impact-report-white path, .impact-report-white line{stroke:var(--green);}
	.impact-report-white .body-container{position:absolute; bottom:6rem; right:0; left:5rem; margin-right:15px; line-height:1.35em;}

	/**
	* DARK BLUE
	*/
	.impact-report-dark-blue{background: url('/files/img/bg_halftone_triangle.jpg') bottom left repeat-x var(--dark-blue);}
	.impact-report-dark-blue path, .impact-report-dark-blue line{stroke:var(--red);}
	.impact-report-dark-blue .body-container{position:absolute; bottom:6rem; left:0; right:5rem; margin-left:15px; line-height:1.35em;}

	/**
	* GREEN
	*/
	.impact-report-green{background-image: url(/files/img/halftone_25.png); background-position: 100% 0; background-repeat: no-repeat; background-color:var(--green);}
	.impact-report-green path, .impact-report-green line{stroke:var(--dark-blue);}
	.impact-report-green .body-container{position:absolute; bottom:6rem; right:0; left:5rem; margin-right:15px; line-height:1.35em;}

	/**
	* MEDIUM BLUE
	*/
	.impact-report-medium-blue{background: url(/files/img/halftone_25.png) bottom left repeat-x var(--penn-college-blue);}
	.impact-report-medium-blue path, .impact-report-medium-blue line{stroke:var(--blue);}
	.impact-report-medium-blue .body-container{position:absolute; bottom:6rem; left:0; right:5rem; margin-left:15px; line-height:1.35em;}

  .bg-image-overlay-green .deck-btn{border-color:#fff;color:#fff;}
  .bg-image-overlay-gray{color:#fff;}
  .bg-image-overlay-gray .row:first-of-type{color:#fff;}
  .bg-image-overlay-gray .light-gray-background-top-border-dark-blue .card-body,
  .bg-image-overlay-gray .light-gray-background-top-border-dark-blue .card-footer{color:var(--dark);padding-left:1rem!important;padding-right:1rem!important;}
  .dark-blue-triangle-halftone-background-center-left-circle .card.standard .btn,
  .light-blue-triangle-halftone-background-center-right-circle .card.standard .btn{border-color:#fff;color:#fff;}

	/*
	* GLOBAL
	*/
	[class*='extrude']{
		animation-iteration-count:1;
	}
	.aos-animate .extrude-4300 {animation: dash 3s ease-in-out forwards; stroke-dasharray: 4300;stroke-dashoffset: 4300;}
	.aos-animate .extrude-3500 {animation: dash 3s ease-in-out forwards; stroke-dasharray: 3500;stroke-dashoffset: 3500;}
	.aos-animate .extrude-1000 {animation: dash 3s ease-in-out forwards; stroke-dasharray: 1000;stroke-dashoffset: 1000;}
	.aos-animate .extrude-250 {animation: dash 3s ease-in-out forwards; stroke-dasharray: 250;stroke-dashoffset: 250;}
	.down-left{
		animation: downleft 5s linear forwards;
	}

	@keyframes dash {
		to {
			stroke-dashoffset: 0;
		}
	}
	@keyframes downleft {
		0%{
			transform: translate(0);
		}
		100%{
			transform: translate(-150px, 150px);
		}
	}

	.text-medium-blue{color:var(--medium-blue)!important;}
	.text-green{color:var(--green)!important;}
	.text-dark-blue{color:var(--dark-blue)!important;}
	.text-blue{color:var(--blue)!important;}
  .text-condensed,.text-condensed p{font-family:'Roboto Condensed', sans-serif; font-weight: 700;}
  /**
  * END IMPACT REPORT
  */
/*
* Component design elements.
*/
.col-xl-5 #news_carousel {max-width: 30rem; margin:0;}
.card.news{position:relative;}
.card.news:after{
  content:'';
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><line x1="50%" y1="100%" x2="100%" y2="50%" stroke="rgba(216,59,24)" stroke-width="2px" /></svg>') no-repeat center;
  position:absolute;
  bottom:0; 
  right:0;
  width:5rem;
  height:5rem;

}
/*.card.number:before,.card.timer:before{
  content:'';
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" ><circle cx="50%" cy="50%" r="49%" fill="none" stroke="rgba(23,34,54,1)" stroke-width="1px" stroke-dasharray="270% 34%" stroke-dashoffset="94%" /></svg>') no-repeat center;
  position:absolute;
  top:0;
  left:0;
  bottom:0; 
  right:0;
  width:100%;
  height:100%;
}*/
.slantything{position:relative;}
.card.number .slantything:after,.card.timer .slantything:after{
  position: absolute; 
  top: 10%; 
  left: 0;
  height: 1.5rem;
  width: 5.5rem; 
  padding:1rem;
  z-index: 3;
  content: "";
  background-image: linear-gradient(135deg, 
  rgba(0,0,0,0) 40%, 
  rgba(216,59,24,1) 40.5%, 
  rgba(216,59,24,1) 50%,
  rgba(0,0,0,0) 50.5%, 
  rgba(0,0,0,0) 90%, 
  rgba(216,59,24,1) 90.5%, 
  rgba(216,59,24,1) 100%);
  background-size: 1rem 1rem;
}
.card.number .embed-responsive,.card.timer .embed-responsive{overflow:visible;}

@media (max-width: 575.98px) {
  .card-deck .card { max-width: none; min-width: none }
	/* HOMEPAGE */
	.homepage-hero h1.display-1{font-size:4.35rem;}
	.homepage-hero p.h3{font-size:1.75rem;}
	.your_op {background-image: none;}
}

@media (min-width: 576px) {
	/* HOMEPAGE */
	.homepage-hero h1.display-1{font-size:5.85rem; }
	.homepage-hero p.h3{font-size:2.125rem;}
}

@media (min-width: 768px) {
	/* HOMEPAGE */
	.homepage-hero h1.display-1{font-size:6.85rem;}
	.homepage-hero p.h3{font-size:2.375rem;}

}
@media (min-width: 992px) {
	/* HOMEPAGE */
	.homepage-hero h1.display-1{font-size:8.35rem;}
	.homepage-hero p.h3{font-size:2.75rem;}}
/* IE Stuff. TODO: remove */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  img.card-img-top{height:100%;}
  .bg-danger{background-color:#d83b18;}
  .bg-dark{background-color:#101833;}
}