/* ------------------------------------------ /*
     - I AM LANDING PAGE STYLES - 
/* ------------------------------------------ */

/* @import url("ac-properties.css?v=1");
@import url("ac-refresh-styles.css");  */

#i-am-landing-page,
#clusters-explore {
margin-top: 50px;
}
header nav {
margin: 0 auto !important;
}
.section {
padding: 60px 0;
width: 100%;
}
.section.start {
padding: 60px 0 0 0;
}
#clusters-explore .section.start {
padding: 0px 0 0 0;
}
.section.last {
padding: 0 0 100px 0;
}
.iam-spotlight,
.iam-questions {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-direction: row;
width: 100%;
}
.iam-featured {
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: row;
width: 100%;
}
.intro-txt,
.prgm-categories,
.cluster-intro {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px 0px;
}
.prgm-categories {
padding: 10px 0 0 0;
}
.spotlight-txt,
.questions-txt {
display: flex;
flex-direction: column;
width: 33.333%;
padding-right: 100px;
padding-left: 0;
}
.featured-txt {
display: flex;
flex-direction: column;
width: 33.333%;
padding-right: 50px;
padding-left: 0px;
}
.spotlight-txt h1,
.questions-txt h1,
.featured-video h1,
.iam-heading h1,
.intro-txt h1,
.featured-txt h1 {
color: var(--primary-green);
font-size: 2.5rem;
font-weight: 700;
margin: 0;
position: relative;
line-height: 1.2em !important;
}
#clusters .intro-txt h1 {
color: var(--primary-green);
font-size: 2.35rem;
font-weight: 700;
margin: 15px 0;
position: relative;
line-height: 1.2em !important;
}
.cluster-intro h1 {
color: var(--primary-green);
font-size: 2.65rem;
font-weight: 700;
margin: 15px 0;
position: relative;
line-height: 1.2em !important;
}
.cluster-intro p {
color: var(--main-text-color);
font-size: 1.3rem !important;
font-weight: 300 !important;
line-height: 2.2rem !important;
margin: 10px 0 !important;
}
#clusters-degrees .intro-txt h1,
#clusters-gradcerts .intro-txt h1 {
font-size: 2.35rem !important;
}
.prgm-categories h2 {
color: var(--darker-green);
font-size: 1.8rem;
font-weight: 500;
margin: 0;
position: relative;
line-height: 1.1em !important;
}
.prgm-categories h3 {
color: var(--primary-dark);
font-size: 1.5rem;
font-weight: 500;
margin: 0 0 5px 0;
position: relative;
line-height: 1.1em !important;
}
.iam-heading h1 {
margin: 0 5px !important;
}
.featured-video h1 {
margin: 0 0 40px 0 !important;
}
.spotlight-txt p,
.questions-txt p,
.featured-txt p {
color: var(--main-text-color);
font-size: 1.4rem !important;
font-weight: 600;
/* line-height: 2rem !important; */
margin: 0 0 15px 0 !important;
}
.spotlight-txt hr,
.questions-txt hr,
.intro-txt hr,
.prgm-categories hr,
.featured-txt hr {
border-top: 1px solid #eaeaea;
display: flex;
width: 100%;
margin: 10px 0px 25px 0px;
}
.intro-txt p {
color: var(--main-text-color);
font-size: 1.25rem !important;
font-weight: 300;
line-height: 2rem !important;
margin: 0 0 10px 0 !important;
}
.featured-img {
display: flex;
width: 66.666%;
}
.spotlight-card {
display: flex;
justify-content: flex-end;
width: 66.666%;
}
.spotlight-card .mini-card,
.featured-img .mini-card  {
margin: 0px 13px;
}
.slick-stories .mini-card {
width: calc(100% - 20px) !important;
margin: 4px auto;
display: flex !important;
}
.slick-stories .mini-card.hide {
display: none !important;
}
.slick-stories .mini-card.hide:has(> .slick-slide) {
display: none !important;
}
.slick-slide:has(.mini-card.hide) {
display: none !important;
}
.slick-slide:has(> .mini-card.hide) {
display: none !important;
}
.slick-slide.hide {
display: none;
}
.mini-card {
width: 100%;
background-color: var(--card-bg-color);
box-shadow: var(--card-shadow);
transition: var(--transition-bounce);
border-radius: var(--card-radius);
border: 1px solid #dddddd;
overflow: hidden;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
margin: 4px 0 !important;
display: flex !important;
}
.mini-card:hover {
background-color: var(--card-bg-color-hover);
box-shadow: var(--card-shadow-hover);
}
.mini-card-img-wrap {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
display: flex;
justify-content: center;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.mini-card-img {
transition: var(--smooth-ease);
height: 368px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: none;
opacity: 1;
}
.cards-flex {
justify-content: space-between;
}
.cards-flex .mini-card-img {
height: 250px !important;
}
.cards-flex .mini-card {
margin: 15px 0 !important;
}
.featured-img .mini-card {
min-width: 100% !important;
max-width: 100% !important;
}
.spotlight-card .mini-card {
min-width: calc(100% - 20px) !important;
max-width: calc(100% - 20px) !important;
}
.cards-flex .mini-card {
min-width: calc(100% / 3 - 20px) !important;
max-width: calc(100% / 3 - 20px) !important;
}
.cards-flex.flex-four .mini-card {
min-width: calc(100% / 4 - 25px) !important;
max-width: calc(100% / 4 - 25px) !important;
}
.cards-flex.clusters .mini-card.thirds { 
min-width: calc(100% / 3 - 20px) !important;
max-width: calc(100% / 3 - 20px) !important;
margin: 13px 10px 29px 10px !important
}
.cards-flex.clusters .mini-card.quarters { 
min-width: calc(100% / 4 - 25px) !important;
max-width: calc(100% / 4 - 25px) !important;
margin: 13px 10px 29px 10px !important
}
.cards-flex.flex-four .mini-card .mini-card-text h2 {
font-size: 1.25rem !important;
}
.cards-flex.flex-four .mini-card-img {
height: 200px !important;
}
.mini-card:hover .mini-card-img {
transform: scale(1.15);
opacity: 1;
}

.header-slide-wrapper{
	background: #006341 !important;
	background-color: #006341 !important;
}

.i-am-img {
display: flex !important;
width: 100%;
max-width: 2600px;
height: 100%;
max-height: 600px;
object-fit: cover;
transition: var(--smooth-ease);
z-index: 1;
}
.i-am-img-overlay {
position: absolute;
width: 100%;
height: 100%;
transition: var(--smooth-ease);
z-index: 1;
}
.slider.slick-slider::before {
/*background-image: url('/wp-content/plugins/ac-templates/templates/img/i-am/i-am-banner-overlay.png');*/
background-size: 100%;
width: 100%;
height: 100%;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
opacity: 1;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
z-index: 3;
}
#i-am-cluster-banner .slider.slick-slider::before {
background-image: url('/wp-content/plugins/ac-templates/templates/img/i-am/cluster-banner-overlay.png') !important;
}
.i-am-slide-olay-desktop {
background-image: url('/wp-content/plugins/ac-templates/templates/img/i-am/i-am-banner-overlay.png');
background-size: 100%;
position: absolute;
background-repeat: no-repeat;
background-position: bottom;
width: 100%;
height: 100%;
transition: var(--smooth-ease);
z-index: 1;
}
.mini-card:hover .i-am-img {
transform: scale(1.15);
opacity: 1;
filter: brightness(107%);
}
.featured-img .mini-card {
border: none !important;
box-shadow: 0 2px 4px 0px rgba(24,21,21,0.25) !important;
}
.featured-img .mini-card .i-am-img {
transform: scale(1) !important;
opacity: 1;
filter: brightness(100%) !important;
}
.featured-img .mini-card:hover .i-am-img {
transform: scale(1) !important;
opacity: 1;
filter: brightness(100%) !important;
}
.mini-card-text {
text-align: left;
padding: 15px 20px 30px 20px;
}
.mini-card-text h2 {
color: var(--primary-green);
font-size: 1.25rem;
font-weight: 600;
margin: 5px 0 !important;
padding: 5px 0 !important;
line-height: 1.2em;
}
.mini-card-text p {
color: var(--main-text-color) !important;
font-size: 1.1rem !important;
font-weight: var(--main-text-weight);
line-height: 1.65em !important;
}
.mini-card a {
text-decoration: none !important;
}
.mini-card a:focus .learn-more-btn {
outline: var(--focus-outline);
}
.mini-card a:focus:not(:focus-visible) {
outline: none !important;
}
.cards-wrapper {
margin: 0 auto;
display: flex;
width: 100%;
padding-top: 25px;
}
.cards-wrapper.card-row-b,
.cards-wrapper.card-row-d {
padding-top: 0;
}
.mini-card-cta {
position: absolute;
bottom: 0;
right: 0;
padding: 20px 22px 10px 22px;
margin-top: 10px;
}
.mini-card-cta p.learn-more-btn::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-dark.png');
background-size: 12px;
width: 12px;
height: 12px;
display: inline-flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
margin-left: 9px;
}
.mini-card:hover p.learn-more-btn::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green-primary.png');
}
p.learn-more-btn {
margin: 0 !important;
display: flex;
align-items: center;
transition: var(--transition-bounce);
font-weight: var(--main-text-weight-strong) !important;
text-align: right;
font-size: 1.1em !important;
}
p.learn-more-btn img {
transition: var(--transition-bounce);
height: 14px !important;
width: 14px !important;
margin: 0 0 -1px 6px !important;
}
.mini-card .learn-more-btn {
color: var(--main-text-color);
}
.mini-card:hover p.learn-more-btn img {
height: 14px;
width: 14px;
content: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green-primary.png');
}
.mini-card:hover p.learn-more-btn {
color: var(--secondary-green);
}
.featured-video {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
padding: 0;
}
/* #clusters-explore .featured-video,
#clusters-degrees .featured-video,
#clusters-gradcerts .featured-video {
padding-top: 50px;
} */
#i-am-landing-stories-page {
margin-top: -5px;
}
#i-am-landing-stories-page .featured-video {
padding: 20px 0 30px 0;
}
.i-am-overlay {
display: flex;
height: 100%;
width: 100%;
background-image:url('/wp-content/plugins/ac-templates/templates/img/i-am/i-am-banner-overlay.png');
background-size: contain;
background-repeat: no-repeat;
}
/** card styles **/
.card-vid-embed { 
background-color: var(--card-bg-color);
box-shadow: var(--card-shadow);
transition: var(--quick-linear);
border-radius: 6px;
width: 100%;
height: 100%;
display: flex;
margin: 0 auto 0 auto;
padding: 0;
align-content: center;
align-items: center;
justify-content: center;
}
.card-vid-embed:hover {
background-color: var(--card-bg-color-hover);
box-shadow: var(--card-shadow-hover);
filter: brightness(104%);
}
.i-am-thumbnail {
width: 100%;
height: 100%;
transition: var(--smooth-ease);
z-index: 1;
border-radius: 6px;
filter: brightness(96%);
}
.i-am-thumbnail-overlay {
opacity: .7;
height: 90px;
width: 90px;
position: absolute;
transition: var(--smooth-ease);
z-index: 1;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.card-vid-embed:hover .i-am-thumbnail-overlay {
opacity: 1;
transform: scale(1.05);
}
.card-vid-embed-wrapper {
padding: 0 !important;
}
.vid-desc {
padding: 0px 15px 60px 15px;
}
.vid-desc h2 {
color: var(--primary-green);
font-size: 1.5rem;
font-weight: 600;
margin: 0 !important;
padding: 0 !important;
line-height: 1.2em;
}
.vid-desc p {
color: var(--main-text-color);
font-size: 1.15rem;
font-weight: 300;
line-height: 1.8rem !important;
margin: 0 0 10px 0 !important;
}
#i-am-landing-header .slider-mobile {
background: none !important;
padding-bottom: 0px !important;
margin-top: 0px !important;
}
.stories-card {
margin: 13px;
overflow: hidden;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.stories-card {
width: 100%;
background-color: var(--card-bg-color);
box-shadow: var(--card-shadow);
transition: var(--transition-bounce);
border-radius: var(--card-radius);
border: 1px solid #dddddd;
overflow: hidden;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.stories-card:hover {
background-color: var(--card-bg-color-hover);
box-shadow: var(--card-shadow-hover);
}
.mini-card-img-wrap {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
display: flex;
justify-content: center;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.mini-card-img {
transition: var(--smooth-ease);
height: 368px;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: none;
opacity: 1;
}
.stories-card .mini-card-img {
height: 200px !important;
}
.stories-card .mini-card {
margin: 13px 13px 29px 13px !important;
}
.stories-card:hover .mini-card-img {
transform: scale(1.15);
opacity: 1;
}
#i-am-landing-page .row#icn-cards{
padding: 60px 0px;
z-index: 0;
position:relative;
}
#i-am-landing-stories-page .row#icn-cards {
padding: 20px 0px 70px 0;
z-index: 0;
position:relative;
}
/* #i-am-landing-page .icn-cards-wrapper,
#i-am-landing-stories-page .icn-cards-wrapper {
width: 100%;
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-evenly;
padding: 0px 5px 0px 5px;
} */
/* div#icn-cards {
padding: 0 0 !important;
} */
/* #clusters .icn-cards-wrapper,
#clusters-explore .icn-cards-wrapper,
#clusters-degrees .icn-cards-wrapper,
#clusters-gradcerts .icn-cards-wrapper {
padding: 0px 10px 35px 10px !important;
} 
#clusters .icn-cards-wrapper a,
#clusters-explore .icn-cards-wrapper a,
#clusters-degrees .icn-cards-wrapper a,
#clusters-gradcerts .icn-cards-wrapper a {
width: calc(100%/2 - 10px) !important;
padding: 6px 0 !important;
}  */
.stories-slider-container {
max-width: 100vw;
width: 100%;
overflow: hidden;
margin: 0 auto;
display: block;
padding-top: 25px;
}
.slider-arrows {
display: flex;
justify-content: center;
flex-direction: row;
align-items: center;
margin: 0 auto;
width: 100%;
padding-bottom: 50px;
}
.slider-arrows div.left,
.slider-arrows div.right {
text-decoration: none !important;
width: 30px;
height: 30px;
border-radius: 50%;
}
.slider-arrows div.left {
padding: 25px 20px 25px 0px;
}
.slider-arrows div.right {
padding: 25px 0px 25px 20px;
}
.slider-arrows div.left span:hover,
.slider-arrows div.right span:hover {
cursor: pointer !important;
}
.slider-arrows div.left span::before,
.slider-arrows div.right span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-left-green.png');
background-size: 25px;
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
opacity: .45;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.slider-arrows div.left span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-left-green.png');
}
.slider-arrows div.right span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green.png');
}
.slider-arrows div.left span:hover::before,
.slider-arrows div.right span:hover::before {
opacity: 1;
}
div#slider-controls-wrapper .slider-toggle.pause,
div#mobile-slider-dots .slider-toggle-mobile.pause {
background-image: url("/wp-content/themes/algonquincollege2018/images/icns/icn-circle-btn-white-pause.png") !important;
background-position: center;
cursor:pointer;
}
div#slider-controls-wrapper .slider-toggle.play,
div#mobile-slider-dots .slider-toggle-mobile.play {
background-image: url("/wp-content/themes/algonquincollege2018/images/icns/icn-circle-btn-white-play.png") !important;
}
#i-am-landing-header .slider-controls div#slider-controls-wrapper {
margin-bottom: 0px !important;
position: relative;
z-index: 99;
display: flex;
width: 100%;
justify-content: flex-end;
align-items: center;
margin-top: 0;
/*height: 35px;*/
height: 50px;
width: 100%;
padding-right: 20px;
}
#i-am-landing-header .slider-controls {
justify-content: flex-end !important;
}
#i-am-landing-header .slider-controls div#mobile-slider-dots {
margin-bottom: 0px !important;
position: relative;
top: 0;
right: 0;
display: flex;
justify-content: flex-end;
align-items: center;
margin-top: -45px !important;
z-index: 2;
width: 100%;
height: 35px;
padding-right: 10px;
}
#i-am-landing-header .slider-toggle.pause,
#i-am-landing-header .slider-toggle.play {
margin: 0 !important;
/*height: 28px !important;
width: 28px !important;*/
height: 44px !important;
width: 44px !important;
background-size: 27px;
}
#i-am-landing-header .slider-toggle-mobile.pause,
#i-am-landing-header .slider-toggle-mobile.play {
margin: 0 !important;
height: 27px;
width: 27px;
background-size: 27px;
}
#i-am-landing-header .slider-toggle.pause,
#i-am-landing-header .slider-toggle-mobile.pause,
#i-am-landing-header .slider-toggle-mobile.pause,
#i-am-landing-header .slider-toggle-mobile.play {
opacity: .5 !important;
}
#i-am-landing-header .slider-toggle.pause:hover,
#i-am-landing-header .slider-toggle.play:hover,
#i-am-landing-header .slider-toggle-mobile.pause:hover,
#i-am-landing-header .slider-toggle-mobile.play:hover {
opacity: 1 !important;
}
button.slider-toggle,
button.slider-toggle-mobile {
display: none;
}
div.controls-wrapper#mobile-slider-dots {
display: none;
}
div.controls-wrapper.flex-mid#mobile-slider-dots {
display: flex;
}
/* header #campus-home-header .row {
height: 80px !important;
} */
div#home-nav-wrapper {
display: flex !important;
justify-content: flex-end;
align-items: center;
}
nav .custom-container {

}
/* header #campus-home-header #logo-wrapper {
margin-bottom: 0 !important;
padding-left: 10px !important;
padding-top: 10px;
} */
/* header #campus-home-header #logo-wrapper a:hover,
header #campus-home-header #logo-wrapper a:focus {
border-bottom: none !important;
} */
.i-am-nav-wrapper {
width: 100%;
height: 85px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 auto;
}
#website-local-menu {
min-height: 60px;
}
/* .custom-container#campus-home-header {
min-height: 90px;
} */
nav.i-am-local-nav ul li a {
font-size: .95rem !important;
font-weight: 200 !important;
padding: 0 20px !important;
min-height: 60px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
line-height: 1.2rem !important;
width: 100%;
}
nav.i-am-local-nav .menu#menu-local-nav {
display: flex !important;
flex-direction: row;
justify-content: center !important;
align-items: center;
}
header nav {
margin: 0 !important;
}
header #campus-links li {
margin-left: 3em;
}
header #campus-links li a {
font-size: 1.2rem;
font-weight: 300;
padding: 0 2px !important;
}
header #campus-links li:hover {
color: #1b1b1b !important;
border-bottom: 0.25em solid #75b545;
}
header #campus-links li:hover a,
header #campus-links li a:hover {
text-decoration: none !important;
}
header #campus-links li a:focus {
color: #1b1b1b !important;
}
header #campus-links {
display: flex;
justify-content: center;
width: 100%;
}




.mktoForm * {
font-family: 'Metropolis', sans-serif !important;
}
.mktoForm label {
color: #3d3d3d !important;
font-weight: 500 !important;
margin-bottom: 4px !important;
font-size: .95rem !important;
}
.mktoForm select.mktoField {
padding-left: 10px !important;
width: 100% !important;
height: 32px !important;
font-size: .85rem !important;
font-weight: 500;
color: var(--main-text-color) !important;
background-color: #fbfbfb !important;
border: 1px solid #cccccc !important;
border-radius: 4px !important;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-form-select-arrow.png');
background-position: right;
background-position-x: 97%;
background-size: 12px;
background-repeat: no-repeat;
display: inline-flex;
align-items: center;
justify-content: center;
appearance: none;
}
.mktoForm .mktoFormCol {
margin-bottom: 10px !important;
}
.mktoFormRow:nth-last-child(6) .mktoFormCol {
margin-bottom: 0px !important;
}

.mktoForm textarea,
.mktoForm select,
.mktoForm input {
height: 32px !important;
font-size: .95rem !important;
color: var(--main-text-color) !important;
background-color: #fbfbfb !important;
border: 1px solid #cccccc !important;
border-radius: 5px !important;
}
.mktoForm textarea:hover,
.mktoForm select:hover,
.mktoForm input:hover {
background-color: #fefefe !important;
border: 1px solid #999999 !important;
}
.ac-marketo-form-container form.mktoForm {
display: flex !important;
flex-wrap: wrap !important;
padding-top: 15px;
}
.mktoForm .mktoFormRow {
display: flex;
align-items: center;
}
.mktoForm .mktoFormRow,
.mktoForm .mktoButtonRow {
width: calc(100% / 2) !important;
}
.mktoFormRow:nth-child(3),
.mktoFormRow:nth-child(4) {
display: none !important;
}
.mktoFormRow:nth-last-child(6) .mktoFieldWrap {
display: flex !important;
align-items: center !important;
}
.mktoFormRow:nth-last-child(5) {
position: absolute;
right: 0;
display: flex;
width: 100% !important;
justify-content: flex-end;
}
.mktoFormRow:nth-last-child(5) .mktoHtmlText {
text-align: right !important;
padding: 0 20px 0 0;
margin-top: -10px;
}
.mktoFormRow:nth-last-child(6) .mktoLabel {
padding-top: 0 !important;
padding-left: 5px !important;
font-size: .85rem !important;
}
.mktoForm .mktoButtonRow button[type="submit"] {
/* background-color: var(--main-text-color) !important;
border-radius: 3px;
font-size: .95rem !important;
font-weight: 400;
letter-spacing: .02rem;
padding: 11px 10px 11px 15px !important;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 2px !important; */
background-color: var(--primary-green) !important;
border-radius: 6px !important;
font-size: .95rem !important;
font-weight: 600;
letter-spacing: .01rem;
padding: 13px 12px 13px 15px !important;
display: flex;
justify-content: space-between;
align-items: center;
/* min-width: 175px;
width: 175px; */
transition: .2s;
transition-timing-function: ease-in-out;
}
.mktoForm .mktoButtonRow button[type="submit"]:hover,
.mktoForm .mktoButtonRow button[type="submit"]:focus {
background-color: var(--primary-green) !important;
filter: brightness(125%);
}
.mktoForm .mktoButtonRow button[type="submit"]::before {
display: none;
border: none !important;
}
.mktoForm .mktoButtonRow button[type="submit"]::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-white.png');
background-size: 15px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
}


/* -- RESPONSIVE MEDIA QUERIES -- */

/* -- MIN 1240px -- */
@media screen and (min-width: 1240px) {
     .menu-local-nav-container {
     max-width: 1400px !important;
     margin-right: auto;
     margin-left: auto;
     padding-left: 20px;
     padding-right: 20px;
     }
}
/* -- MAX 1239px -- */
@media screen and (max-width: 1239px) {
     .menu-local-nav-container {
     width: 100%;   
     margin-right: auto;
     margin-left: auto;
     padding-left: 20px !important;
     padding-right: 20px !important;
     }
     nav.i-am-local-nav ul li a {
     font-size: .95rem !important;
     padding: 0 15px !important;
     }
}
/* -- MAX 1200px -- */
@media (max-width: 1200px) {
     .spotlight-txt h1,
     .questions-txt h1,
     .featured-video h1,
     .iam-heading h1 {
     font-size: 2.2rem !important;
     }
     .spotlight-txt,
     .questions-txt {
     padding-right: 50px !important;
     }
     .spotlight-txt p,
     .questions-txt p,
     .featured-txt p {
     font-size: 1.35rem !important;
     line-height: 1.7rem !important;
     }
}
/* -- MAX 1024px -- */
@media (max-width: 1024px) {
     .spotlight-txt p,
     .questions-txt p,
     .featured-txt p {
     font-size: 1.3rem !important;
     line-height: 1.7rem !important;
     }
     .col#card-lead-form {
     min-width: 10px !important;
     }
     .spotlight-txt,
     .questions-txt {
     padding-right: 25px !important;
     }
     .featured-txt {
     width: 40% !important;
     }
     .featured-img {
     width: 60%;
     }
     .spotlight-txt h1,
     .questions-txt h1,
     .featured-video h1,
     .iam-heading h1,
     .intro-txt h1,
     .featured-txt h1 {
     font-size: 2rem !important;
     }
     nav.i-am-local-nav ul li a {
     font-size: .8rem !important;
     padding: 0 12px !important;
     }
     header #campus-links li a {
     font-size: 1.1rem !important;
     }
     header #campus-links li {
     margin-left: 2em !important;
     }
     .mktoForm .mktoFormRow,
     .mktoForm .mktoButtonRow {
     width: 100% !important;
     }
}

/* -- MAX 991px -- */
@media (max-width: 991px) {   
     .mini-card-text h2 {
     font-size: 1.2rem !important;
     }
     .cards-flex.flex-four .mini-card .mini-card-text h2 {
     font-size: 1.2rem !important;
     }
     .cards-flex .mini-card,
     .cards-flex.flex-four .mini-card {
     flex: 1 1 50% !important;
     max-width: calc(100% / 2 - 20px) !important;
     }
     .cards-flex.clusters .mini-card {
     flex: 1 !important;
     min-width: calc(100% / 3 - 20px) !important;
     max-width: calc(100% / 3 - 20px) !important;
     }
     .cards-flex {
     padding: 0;
     }
     .mini-card-text p {
     font-size: 1.05rem !important;
     }
     .cards-flex.clusters .mini-card.quarters { 
     min-width: calc(100% / 2 - 20px) !important;
     max-width: calc(100% / 2 - 20px) !important;
     }
     .intro-txt p {
     font-size: 1.2rem !important;
     line-height: 1.9rem !important;
     }
}
/* -- MAX 880px -- */
@media (max-width: 880px) {
     .slider-controls#desktop-controls {
     display: none; 
     }
     .mini-card-text {
     padding: 10px 15px 30px 15px;
     }
     .row.iam-section:first-child {
     padding: 30px 0 0 0 !important;
     }
     .full-width-footer {
     padding: 30px 0 0 0 !important;
     }
     .iam-spotlight {
     padding-top: 40px;
     }
     .top-banner-wrapper {
     padding-top: 30px !important;
     }
     .i-am-img {
     max-height: 100% !important;
     }
     nav#smartMenu ul {
     display: flex;
     width: 100%;
     justify-content: flex-end;
     align-items: center;
     }
     nav#smartMenu ul li {
     display: flex;
     width: 100%;
     justify-content: center;
     align-items: center;
     }
     nav#smartMenu ul li:first-child {
     justify-content: flex-start;
     }
     nav#smartMenu ul li:last-child {
     justify-content: flex-end;
     }
     .iam-spotlight,
     .iam-questions,
     .iam-featured {
     align-items: flex-start;
     flex-direction: column;
     }
     .spotlight-txt,
     .questions-txt {
     padding-right: 15px;
     padding-left: 15px;
     padding-bottom: 25px;
     }
     .spotlight-txt,
     .questions-txt,
     .spotlight-card,
     .featured-txt,
     .featured-img {
     width: 100% !important;
     }
     .spotlight-txt p,
     .questions-txt p {
     font-size: 1.25rem !important;
     }
     .featured-txt {
     padding-right: 10px !important;
     }
     .intro-txt p {
     font-size: 1.15rem !important;
     line-height: 1.85rem !important;
     }
     .i-am-slide-olay-desktop {
     display: none;
     }
	 
    /* .slider.slick-slider::before {
     background-image: url('/wp-content/plugins/ac-templates/templates/img/i-am/i-am-banner-overlay-mobile.png') !important;
     }*/
	 
    /* .i-am-slide-olay-mobile {
		 display: flex;
		 background-image: url('/wp-content/plugins/ac-templates/templates/img/i-am/i-am-banner-overlay-mobile.png');
		 background-size: 100%;
		 position: absolute;
		 background-repeat: no-repeat;
		 width: 100%;
		 height: auto;
		 transition: var(--smooth-ease);
		 z-index: 1;
     }*/
     .col#card-lead-form {
     padding-top: 25px !important;
     min-width: 10px !important;
     width: 100% !important;
     }
     .i-am-thumbnail-overlay {
     opacity: .7;
     height: 70px;
     width: 70px;
     position: absolute;
     transition: var(--smooth-ease);
     z-index: 1;
     will-change: transform;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
     }
     .vid-desc p {
     font-size: 1.05rem !important;
     line-height: 1.9rem !important;
     }
     #i-am-landing-stories-page .featured-video {
     padding-bottom: 10px !important;
     }
     .vid-desc h2 {
     font-size: 1.45rem !important;
     }
     header #campus-home-header {
     display: none !important;
     }
     header {
     margin-top: 0px !important;
     min-height: 0px !important;
     }
     header #campus-links li {
     margin-left: 0em !important;
     }
     nav.i-am-local-nav .menu {
     flex-direction: column !important;
     }
     .mktoForm .mktoFormRow,
     .mktoForm .mktoButtonRow {
     width: calc(100% / 2) !important;
     }
}

/* -- MAX 767px -- */
@media screen and (max-width: 767px) {
     .menu-local-nav-container {
     padding-left: 20px !important;
     padding-right: 20px !important;
     }
}
/* -- MAX 575px -- */
@media (max-width: 575px) {
     .spotlight-txt h1,
     .questions-txt h1,
     .featured-video h1,
     .iam-heading h1 {
     font-size: 1.75rem !important;
     }
     .spotlight-txt p,
     .questions-txt p {
     font-size: 1.2rem !important;
     line-height: 1.8rem !important;
     }
     .i-am-thumbnail-overlay {
     opacity: .7;
     height: 50px;
     width: 50px;
     position: absolute;
     transition: var(--smooth-ease);
     z-index: 1;
     will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
     }
     .vid-desc p {
     font-size: .95rem !important;
     line-height: 1.85em;
     }
     .intro-txt p {
     font-size: 1.05rem !important;
     line-height: 1.75rem !important;
     }
     #i-am-landing-stories-page .featured-video {
     padding-bottom: 0px;
     }
     .vid-desc h2 {
     font-size: 1.35rem !important;
     }
     .cards-flex.clusters .mini-card.thirds,
     .cards-flex.clusters .mini-card.quarters { 
     min-width: calc(100% - 100px) !important;
     max-width: calc(100% - 100px) !important;
     margin: 13px auto 29px auto !important
     }
     .menu-local-nav-container {
     padding-left: 25px !important;
     padding-right: 25px !important;
     }
     .mktoForm .mktoFormRow,
     .mktoForm .mktoButtonRow {
     width: 100% !important;
     }
}
/* -- MAX 480px -- */   
@media (max-width: 480px) {
     .cards-flex .mini-card,
     .cards-flex.one-third-width-cards .mini-card,
     .cards-flex .mini-card,
     .cards-flex.flex-four .mini-card,
     .cards-flex.clusters .mini-card.thirds,
     .cards-flex.clusters .mini-card.quarters {
     flex: 1 1 100%  !important;
     max-width: 100%  !important;
     }
     .menu-local-nav-container {
     padding-left: 20px !important;
     padding-right: 20px !important;
     }
}
.ac-stats {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-start;
padding: 0;
}
.ac-stats .stat-col {
width: calc(100% / 3 - 50px) !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
}
.stat-col span.stat {
display: flex;
justify-content: center;
align-items: center;
font-size: 5rem;
font-weight: 900;
color: var(--primary-green);
}
.stat-col span.info {
width: 100%;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
font-size: 1.2rem;
font-weight: 600;
line-height: 1.3em;
padding: 0px 5px;
color: var(--primary-dark);
}
.stat-col span.stat-icon {
font-weight: 500;
font-size: 4.4em;
margin-left: 2px;
color: var(--primary-green);
}
.stat-col div {
width: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 0 0 10px 0;
}
.prgm-categories-wrapper {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
padding-top: 25px;
}
.prgm-categories-wrapper::after {
content: "";
width: calc(100%/3 - 15px);
}
.prgm-categories-wrapper a {
width: calc(100%/3 - 10px);
min-height: 50px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 10px 12px;
background-color: #f2f2f2;
border-radius: 3px;
font-size: 1.05rem;
font-weight: 500;
line-height: 1.1em;
color: #1b3029;
margin: 6px 0;
text-decoration: none !important;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.prgm-categories-wrapper a:hover {
background-color: #cfe6dd !important;
color: #1b4a39;
}
.prgm-categories-wrapper a::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-dark.png');
background-size: 12px;
width: 12px;
height: 12px;
display: inline-flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
margin-left: 4px;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.prgm-categories-wrapper a:hover::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green.png');
}
.cta {
position: relative;
display: flex;
width: 100%;
justify-content: flex-end;
align-items: center;
}
.cta a {
display: flex;
align-items: center;
color: var(--primary-green);
text-decoration: underline;
font-size: 1.15rem !important;
line-height: 2.55rem !important;
margin: 5px -10px 0 0 !important;
padding: 2px;
font-weight: var(--main-text-weight-stronger) !important;
text-align: right;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.cta a::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green.png');
background-size: 12px;
width: 12px;
height: 12px;
display: inline-flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
margin-left: 9px;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.cta a:hover {
color: #0b7d56;
text-decoration: underline !important;
}
.cta a:hover::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-green.png');
}
.cluster-banner-wrapper.desktop {
display: flex;
padding: 0 !important;
margin-bottom: 0 !important;
}  
.cluster-banner-wrapper.mobile {
display: none !important;
}  
.cluster-banner-wrapper img {
display: flex !important;
width: 100%;
height: 100%;
transition: var(--smooth-ease);
z-index: 1;
}
div.results-wrapper {
display: flex;
align-items: center;
justify-content: flex-end;
}
.clstr-head {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: -15px;
z-index: 1;
}
.clstr-ctrls {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
}     
.clusters-wrapper {
display: flex;
width: 100%;
justify-content: space-between;
flex-direction: row;
flex-wrap: wrap;
padding-top: 5px;
}
.clusters-wrapper-inner{
	width:100%;
}
.cl-list-wrapper { 
width: 100%;
}
.clusters-accordion-wrapper {
margin: 0;
padding: 0px;
width: 100%;
}
.clusters-accordion-wrapper.noresults {
     display:none;
}

.aoi-prgms {
padding: 0;
width: 100%;
}
.aoi-prgms h2 {
font-size: 2rem;
font-weight: 500;
color: #0f4b3c;
margin: 0px 0 15px 0;
}
.aoi-prgms hr {
border-top: 1px solid #eaeaea;
display: flex;
width: 100%;
margin: 0;
}
.cl-prgm h4 {
color: var(--primary-dark);
font-weight: 500;
line-height: 1.3rem;
font-size: 1.05rem;
margin: 0;
}
.cl-prgm-name {
width: 100%;
max-width: 63%;
display: flex;
align-items: center;
justify-content: flex-start;
}
.cl-prgm-info-wrap {
display: flex;
width: 100%;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 0 5px;
height: 65px;
min-height: 65px;
}
.cl-prgm-info {
max-width: 46%;
display: flex;
align-items: center;
justify-content: flex-end;
flex-direction: row;
}
.cl-prgm-info div {
display: flex;
flex-direction: column;
margin: 3px auto;
position: relative;
align-items: flex-start;
justify-content: center;
border-right: 1px solid #cccccc;
}
.cl-prgm-info div:last-child {
border-right: none !important;
}
.cl-prgm-info span {
display: flex;
flex-direction: column;
position: relative;
align-items: center;
justify-content: center;
border-right: 1px solid #cccccc;
font-size: .95rem;
color: #404040;
font-weight: 300;
line-height: 1.25em;
height: 35px;
padding: 0 15px;
text-align: left;
}
.cl-prgm-info span:nth-child(1) {
width: 150px;
min-width: 150px;
max-width: 150px;
align-items: flex-start;
}
.cl-prgm-info span:nth-child(2) {
width: 115px;
min-width: 115px;
max-width: 115px;
text-align: center;
}
.cl-prgm-info span:nth-child(3) {
width: 185px;
min-width: 185px !important;
align-items: flex-start;
}
.cl-prgm-info span:last-child {
border-right: none !important;
}
.cl-prgm-info div span {
font-size: 1rem;
color: var(--primary-dark);
font-weight: 300;
line-height: 1;
}
.clusters-accordion {
display: flex;
justify-content: space-between;
align-items: center;
background-color: var(--white);
font-size: 1.25rem !important;
font-weight: 400;
color: var(--primary-dark);
/* cursor: pointer; */
padding: 0px 20px;
min-height: 55px !important;
width: 100%;
text-align: left;
border-left-style: none;
border-right-style: none;
border-top-style: none;
border-bottom: 1px solid #e8e8e8;
outline: none;
transition: 0.1s;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
margin: 0;
transition: .1s;
transition-timing-function: ease-in;
}
.clusters-accordion:hover,
.clusters-accordion:focus {
background-color: rgba(0, 99, 65, .1) !important;
border-bottom: 1px solid rgba(0, 99, 65, .02) !important;
color: var(--darker-green);
}
.clusters-accordion:focus {
outline: var(--focus-outline) !important;
}
.clusters-accordion:focus:not(:focus-visible) {
outline: none !important;
}
.clusters-accordion.active,
.clusters-accordion.active:hover,
.clusters-accordion:hover.active {
background-color: #45806b !important;
color: #fff !important;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
font-weight: 400 !important;
border-bottom: 1px solid rgba(0, 99, 65, .02) !important;
}
.clusters-accordion span.accordion-icn::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-dark.png');
background-size: 16px;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
margin-left: 3px;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
/* transform: rotate(270deg); */
}
.clusters-accordion:hover span.accordion-icn::after {
background-size: 16px;
width: 16px;
height: 16px;
transform: translateY(3px);
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-green.png');
}
.clusters-accordion.active span.accordion-icn::after {
background-size: 16px;
width: 16px;
height: 16px;
transition: var(--quick-linear);
transform: rotate(180deg);
transition-timing-function: ease-in-out;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-white.png');
}
.clusters-accordion.active:hover span.accordion-icn::after {
transform: rotate(180deg) translateY(3px);
}
.clusters-item-wrapper { 
max-height: 0px; 
overflow:auto;
}
.clusters-item-wrapper a,
a.cl-prgm {
text-decoration: none !important;
}
.cl-prgm {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding: 15px 10px;
border-top: 1px solid #ededed;
border-bottom: 1px solid #ededed;
}
#clusters .cl-prgm:first-child {
border-top: 2px solid #ededed !important;
}
#clusters .cl-prgm:last-child {
border-bottom: none !important;
}
.cl-prgm:last-of-type {
border-bottom: none !important;
margin: 0 0 -14px 0 !important;
}
.clusters-item-wrapper .cl-prgm.no-divider {
border-bottom: none !important;
}
.no-divider {
border-bottom: none !important;
}
.cl-prgm:hover .cl-prgm-name h4,
.cl-prgm:focus .cl-prgm-name h4 {
    text-decoration: 1px underline currentcolor;
    color: var(--anchor-color-hover);
    text-underline-offset: 4px;
}
.clusters-item-wrapper div a {
color: var(--anchor-color) !important;
font-weight: var(--main-text-weight-strong) !important;
text-decoration: none;
}
.clusters-item-wrapper div a:hover {
color: var(--anchor-color-hover) !important;
background-color: rgba(0, 99, 65, .1) !important;
}
.clusters-item-wrapper div a:hover .cl-prgm-name {
text-decoration: underline !important;
}
.clusters-item-wrapper div a:focus {
outline: var(--focus-outline);
}
.clusters-item-wrapper div span.clusters-item-title {
min-width: 240px;
color: var(--primary-dark) !important;
font-weight: 500;
font-size: 1rem;
line-height: 1.3rem;
}
.clusters-item-wrapper div span.clusters-item-info {
max-width: 100%;
color: var(--main-text-color) !important;
font-weight: 300;
font-size: 1rem;
line-height: 1.3rem;
}
.clusters-item-wrapper div.clusters-title {
padding: 14px 8px;
background-color: #efefef;
border-bottom: none;
border-radius: 1px;
align-items: center;
margin-bottom: 6px;
}
.clusters-item-wrapper div.clusters-title:hover,
.clusters-item-wrapper div.clusters-title:focus {
background-color: #efefef !important;
}
.clusters-item-wrapper div.clusters-title span.clusters-item-title {
color: #3e3e3e !important;
font-size: 1.05rem;
}
.clusters-item-wrapper div.clusters-title span.clusters-item-info {
font-weight: 500;
font-size: 1.05rem;
}
.expand-all,
.collapse-all,
.collapse-bottom,
.collapse-section {
font-size: .95rem;
font-weight: 400;
color: var(--primary-green);
padding: 5px 8px;
text-decoration: none;
border: none !important;
border-style: none !important;
margin: 4px 0px;
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
transition: var(--quick-linear);
}
.expand-all:hover,
.expand-all:focus,
.collapse-all:hover,
.collapse-all:focus,
.collapse-bottom:hover,
.collapse-bottom:focus,
.collapse-section:hover,
.collapse-section:focus {
text-decoration: underline;
/* cursor: pointer; */
}
.collapse-bottom.invisible {
display: none;
}
.collapse-bottom.visible {
display: flex;
}
.expand-collapse {
display: flex;
justify-content: flex-end;    
align-items: center;
}
.collapse-section-wrapper {
display: flex !important;
justify-content: center !important;     
align-items: center !important;    
padding-bottom: 0;
height: 40px;
margin-top: 15px;
}
/* .expand-collapse span {
font-size: 1.5rem;
font-weight: 100;
color: #4b4b4b;
} */
.clusters-item-wrapper div.collapse-section-wrapper:hover,
.clusters-item-wrapper div.collapse-section-wrapper:focus {
background-color: rgba(0, 99, 65, 0) !important;
}
/* .expand-collapse span::before {
content: "|";
} */
.collapse-section {
margin: -14px 0 0 0;
background-color: var(--main-text-color);
border-radius: 50%;
height: 28px;
width: 28px;
z-index: 99;
transition: var(--quick-linear);
}
.clusters-accordion-wrapper .collapse-section {
margin: 0 !important;
}
.collapse-section img {
height: 15px;
width: 15px;
}
.collapse-section span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-up-white.png');
background-size: 14px;
width: 14px;
height: 14px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
margin-left: 0;
}
.collapse-section:hover,
.collapse-section:focus {
background-color: var(--primary-green);
}
.clusters-accordion-controls {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
.clusters-item-wrapper.visible {
max-height: 100%;
}
.clusters-item-wrapper.invisible {
max-height: 0px;
}
.visible {
max-height: 100%;
}
.invisible {
max-height: 0px;
}
.btn-scroll-wrapper {
width:100%;
display:flex;
justify-content:center;
align-items:center;
margin-top: -62px;
}
.btn-scroll {
display: flex;
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #2d2d2d;
justify-content:center;
align-items:center;
transition: var(--smooth-ease);
transition-timing-function: ease-in-out;
}
.btn-scroll span {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
}
.btn-scroll span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-white.png');
background-size: 20px;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.btn-scroll:hover {
background-color: var(--primary-green);
}
#clusters .row#icn-cards,
#clusters-explore .row#icn-cards,
#clusters-degrees .row#icn-cards,
#clusters-gradcerts .row#icn-cards {
padding: 30px 0 !important;
}
.full-height-header {
max-width: 100vw;
height: 42vh;
min-height: 600px;
display: flex;
flex-direction: column;
object-position: center top;
background-repeat: no-repeat !important;
background-size: cover !important;
background-position: top;
justify-content: center;
align-items: center;
}
.full-width-banner {
display: flex;
flex-direction: column;
object-position: center top;
background-repeat: no-repeat !important;
background-size: cover !important;
background-position: top;
justify-content: center;
align-items: center;
}
.full-width-banner img {
display: flex !important;
width: 100%;
height: 100%;
transition: var(--smooth-ease);
z-index: 1;
}
.full-height-header.gradcerts {
background: url('/wp-content/plugins/ac-templates/templates/img/i-am/clusters-banner-gradcerts.jpg');
}
.fade-slder-fixed {
display: block;
width: 100%;
position: fixed;
z-index: 1;
margin: 0 0 0 0;
top: 85px;
}
.fade-slder-mobile {
display: none;
}
.cluster-content {
width: 100%;
height: 1600px;
margin: 0;
padding: 0 0 0 0;
top: 200px;
background-color: #fff;
z-index: 4;
position: relative;
outline: none;
}
.fade-slder-txt {
width: 100%;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
}
.fade-slder-txt h1 {
width: 100%;
display: flex;
font-size: 5.5em;
color: var(--white);
padding: 15px 0;
font-weight: 600;
margin: 0;
line-height: 1.2em;
}
.gradcerts .fade-slder-txt h1 {
font-size: 4.5em !important;
}
.fade-slder-txt h3 {
width: 60%;
display: flex;
font-size: 1.45rem;
color: #fdfdfd;
padding: 15px 0 0 0;
margin: 0 0 10px 0;
font-weight: 300;
line-height: 1.75rem;
border-top: 1px solid rgba(255,255,255,.35);
}
#header_placeholder {
display: none;
height: 80px;
width: 100%;
}
.sticky {
position: fixed !important;
width: 100% !important;
top: 0 !important;
z-index: 9999;
}
.cluster-sticky {
padding: 5px 0px;
background: #f4f4f4;
position: relative;
width: 100%;
border-bottom: 1px solid #dddddd;
height: 60px !important;
}
.cluster-sticky .header-logo {
max-width: 165px !important;
}
.cluster-sticky .page-title {
font-size: 1.4rem !important;
}
.sticky-wrapper {
display: flex;
width: 100%;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.sticky-wrapper h2 {
font-size: 1.75em;
font-weight: 600;
color: var(--primary-green);
margin: 0 !important;
}
.sticky-wrapper div a {
text-decoration: none !important;
}
@media (max-width: 800px){
     .cluster-sticky{
          padding: 10px;
     }
}
/* -- MIN 1240px -- */
@media screen and (min-width: 1240px) {
     .fade-slder-txt {
     max-width: 1400px !important;
     margin-right: auto !important;
     margin-left: auto !important;
     padding-left: 20px !important;
     padding-right: 20px !important;
     }
}
/* -- MAX 1239px -- */
@media screen and (max-width: 1239px) {
     .fade-slder-txt {
     width: 100% !important;
     margin-right: auto !important;
     margin-left: auto !important;
     padding-left: 20px !important;
     padding-right: 20px !important;
     }
}
/* -- MAX 1400px -- */
@media (max-width: 1400px) {
     .fade-slder-txt {
     padding-left: 30px !important;
     padding-right: 30px !important;
     }
     .fade-slder-txt h1 {
     font-size: 5em;
     }
     .gradcerts .fade-slder-txt h1 {
     font-size: 4em !important;
     }
     .fade-slder-txt h3 {
     font-size: 1.3rem;
     }
     .stat-col span.info {
     font-size: 1.25rem;
     }
}
/* -- MAX 1200px -- */
@media (max-width: 1200px) {
     .cl-prgm-name {
     max-width: 55%;
     }
     .cl-prgm-info span:nth-child(3) {
     width: 155px;
     min-width: 155px !important;
     }
}
/* -- MAX 1024px -- */
@media (max-width: 1024px) {
     .cl-prgm-name {
     max-width: 50%;
     }
     .ac-stats .stat-col {
     width: calc(100% / 3 - 30px) !important;
     }
     .stat-col span.stat {
     font-size: 4.5rem;
     }
     .prgm-categories-wrapper a {
     font-size: .97rem;
     }
     .prgm-categories-wrapper a::after {
     background-size: 12px;
     width: 12px;
     height: 12px;
     }
     .full-height-header { 
     height: 33vh;
     }
     .cl-prgm-info span:nth-child(3) {
     width: 135px;
     min-width: 135px !important;
     }

}
/* -- MAX 1024px -- */
@media (max-width: 1024px) {
     .ac-stats .stat-col {
     width: calc(100% / 3 - 20px) !important;     
     }
     .prgm-categories-wrapper a {
     font-size: 1rem;
     width: calc(100%/2 - 10px);
     }
     .prgm-categories-wrapper::after {
     content: "";
     width: calc(100%/2 - 10px);
     }
     .stat-col span.info {
     font-size: 1.15rem;
     }
     .fade-slder-txt h1 {
     font-size: 4.5em;
     }
     .fade-slder-txt h3 {
     width: 65%;
     font-size: 1.25rem;
     }
}
/* -- MAX 1023px -- */   
@media (max-width: 1023px) {
     header {
     min-height: 0px !important;
     }
}
/* -- MAX 991px -- */
@media (max-width: 991px) {   
     .cl-prgm-info-wrap {
     min-height: 75px;
     height: 75px;
     }
     .cl-prgm-info span {
     font-size: .9rem;
     }
}
/* -- MAX 880px -- */
@media (max-width: 880px) {
     #clusters-degrees .intro-txt h1,
     #clusters-gradcerts .intro-txt h1 {
     font-size: 2.25rem !important;
     }
     .cluster-banner-wrapper.desktop {
     display: none !important;
     }  
     .cluster-banner-wrapper.mobile {
     display: flex !important;
     padding: 0 !important;
     margin-bottom: 0 !important;
     }  
     .clusters-accordion {
     padding: 0px 10px !important;
     }
     .prgm-categories {
     padding: 0 !important;
     }
     .full-height-header.degrees {
     background: url('/wp-content/plugins/ac-templates/templates/img/i-am/clusters-banner-mobile-degrees.jpg')
     }
     .full-height-header.gradcerts {
     background: url('/wp-content/plugins/ac-templates/templates/img/i-am/clusters-banner-mobile-gradcerts.jpg')
     }
     .fade-slder-fixed {
     display: none;
     }
     .fade-slder-mobile {
     display: block;
     width: 100%;
     margin: 0;
     }
     .fade-slder-txt h1 {
     font-size: 4.2em;
     }
     .gradcerts .fade-slder-txt h1 {
     font-size: 3.5em !important;
     }
     .fade-slder-txt h3 {
     width: 70%;
     font-size: 1.2rem;
     }
     .cluster-content {
     top: 0 !important;
     height: 100% !important;
     padding: 0 !important;
     }
     .cl-prgm {
     padding: 15px 10px;
     }
     .cl-prgm-info-wrap {
     flex-direction: column;
     align-items: flex-start;
     min-height: 1px;
     height: 100%;
     }
     .cl-prgm-name {
     max-width: 100%;
     padding-bottom: 10px;
     }
     .cl-prgm-info {
     min-width: 100%;
     max-width: 100%;
     display: flex;
     align-items: center;
     justify-content: flex-start;
     flex-direction: row;
     }
     .clusters-item-wrapper h4 {
     font-size: 1rem;
     }
     .cl-prgm-info span {
     width: calc(100%/3) !important;
     min-width: calc(100%/3) !important;
     max-width: calc(100%/3) !important;
     height: 30px;
     font-size: 1rem;
     text-align: center;
     }    
     .cl-prgm-info span:nth-child(3) {
     align-items: center;
     }
     .cl-prgm-info span:nth-child(1) {
     align-items: center;
     }
     .cl-prgm-info span:nth-child(2) {
     margin-right: 0 !important;
     }
     .cl-prgm-info span:nth-child(3),
     .cl-prgm-info span:nth-child(1),
     .cl-prgm-info span:nth-child(2) {
     width: calc(100%/3) !important;
     min-width: calc(100%/3) !important;
     max-width: calc(100%/3) !important;
     }
     .prgm-categories h2 {
     font-size: 1.65rem;
     }
     .expand-collapse {
     padding-top: 0;
     }
     .cards-flex.clusters .mini-card {
     width: flex: 1 1 100% !important;
     min-width: calc(100% - 100px) !important;
     max-width: calc(100% - 100px) !important;    
     }
     .ac-stats .stat-col {
     width: calc(100% / 3 - 25px) !important;
     }
     .stat-col span.stat {
     font-size: 4rem;
     }
     .stat-col span.info {
     font-size: 1.2rem;
     line-height: 1.4em;
     }
}
/* -- MAX 767px -- */
@media screen and (max-width: 767px) {
     .prgm-categories-wrapper a {
     font-size: .9rem;
     }
}
/* -- MAX 667px -- */
@media (max-width: 667px) {
     .fade-slder-txt h1 {
     font-size: 4em;
     }
     .gradcerts .fade-slder-txt h1 {
     font-size: 3.3em !important;
     }
     .fade-slder-txt h3 {
     font-size: 1.15rem;
     width: 80%;
     }
     .ac-stats .stat-col {
     width: 100% !important;
     margin: 40px auto !important;
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
     }
     .stat-col div {
     width: 35%;
     min-width: 35%;
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
     padding: 0 10px !important;
     }
     .ac-stats {
     flex-direction: column;
     justify-content: center;
     align-items: center;
     }
     .stat-col span.stat {
     font-size: 5rem;
     }
     .stat-col span.info {
     justify-content: flex-start;
     align-items: flex-start;
     text-align: left;
     font-size: 1.15rem;
     padding: 0 10px 0 40px;
     }
     #clusters .row.iam-section#stats,
     #clusters-explore .row.iam-section#stats {
     padding: 60px 10px !important;
     }
     #clusters-degrees .row.iam-section#stats,
     #clusters-gradcerts .row.iam-section#stats {
     padding: 30px 10px 80px 10px !important;
     }
     #clusters-degrees .intro-txt h1,
     #clusters-gradcerts .intro-txt h1 {
     font-size: 2.15rem !important;
     }
     #clusters .icn-cards-wrapper a,
     #clusters-explore .icn-cards-wrapper a,
     #clusters-degrees .icn-cards-wrapper a,
     #clusters-gradcerts .icn-cards-wrapper a {
     width: calc(100% - 100px) !important;
     } 
}
/* -- MAX 575px -- */
@media (max-width: 575px) {
     .expand-collapse {
     padding-top: 0;
     }
     .prgm-categories h2 {
     font-size: 1.5rem;
     }
     .cl-prgm h4 {
     font-size: .95rem;
     }
     .cl-prgm-info {
     justify-content: center;
     }
     .cl-prgm-info-wrap {
     min-height: 1px;
     height: 100%;
     padding: 0px 0px;
     }
     .cl-prgm-name {
     padding-bottom: 15px;
     }
     .cl-prgm-info span {
     width: calc(100%/3) !important;
     min-width: calc(100%/3) !important;
     max-width: calc(100%/3) !important;
     font-size: .95rem;
     }    
     .cl-prgm-info span:nth-child(3) {
     align-items: center;
     }
     .cl-prgm-info span:nth-child(1) {
     align-items: center;
     }
     .cl-prgm-info span:nth-child(2) {
     margin-right: 0 !important;
     }
     .cl-prgm-info span:nth-child(3),
     .cl-prgm-info span:nth-child(1){
     width: 36% !important;
     min-width: 36% !important;
     max-width: 36% !important;
     padding: 0px 10px !important;
     }
     .cl-prgm-info span:nth-child(2) {
     width: 28% !important;
     min-width: 28% !important;
     max-width: 28% !important;
     padding: 0px 10px !important;
     }
     .fade-slder-txt h1 {
     font-size: 3.8em;
     }
     .gradcerts .fade-slder-txt h1 {
     font-size: 3em !important;
     }
     .fade-slder-txt h3 {
     font-size: 1.1rem;
     width: 85%;
     }
     .stat-col div {
     width: 100%;
     min-width: 100%;
     justify-content: center;
     }
     .ac-stats .stat-col {
     width: 100% !important;
     justify-content: center;
     align-items: center;
     flex-direction: column;
     }
     .stat-col span.stat {
     justify-content: center;
     align-items: center;
     font-size: 4rem;
     }
     .stat-col span.info {
     justify-content: center;
     font-size: 1.25rem;
     line-height: 1.4em;
     margin: 0 auto;
     text-align: center;
     padding: 40px 30px 0 30px;
     }
     .cl-prgm:hover,
     .cl-prgm:focus {
     background-color: rgba(0, 99, 65, .1) !important;
     }
}
/* -- MAX 480px -- */   
@media (max-width: 480px) {
     #clusters-degrees .intro-txt h1,
     #clusters-gradcerts .intro-txt h1 {
     font-size: 1.95rem !important;
     }
     .cards-flex.clusters .mini-card {
     width: flex: 1 1 100% !important;
     min-width: 100% !important;
     max-width: 100% !important;   
     }
     #clusters .icn-cards-wrapper a,
     #clusters-explore .icn-cards-wrapper a,
     #clusters-degrees .icn-cards-wrapper a,
     #clusters-gradcerts .icn-cards-wrapper a {
     width: calc(100% - 10px) !important;
     } 
     .fade-slder-txt h1 {
     font-size: 3.5em;
     }
     .fade-slder-txt h3 {
     font-size: 1.1rem;
     width: 90%;
     }
     .cl-prgm h4 {
     font-size: .9rem;
     }
     .cl-prgm-info span {
     font-size: .8rem;
     }  
     .clusters-item-wrapper div:hover,
     .clusters-item-wrapper div:focus {
     background-color: transparent !important;
     }
     .clusters-accordion:hover,
     .clusters-accordion:focus {
     background-color: transparent !important;
     color: var(--primary-dark) !important;
     border-bottom: 1px solid #e8e8e8 !important;
     }
     .clusters-accordion {
     padding: 5px 20px;
     font-size: 1rem !important;
     }  
}
/* fixes for card lead form to change the plugin styles for this page*/
.ac-marketo-form-success-message {
padding: 20px;
text-align: center;
width: 100%;
margin: 0 auto;
font-size: 1rem;
color: #4b4b4b;
}
#programsPopupForm .ac-marketo-form-container {
background-color: inherit !important;
}
#programsPopupForm .card-program-information .ac-marketo-form-container {
border-radius: 10px;
}
#programsPopupForm .ac-marketo-form label {
color: #3d3d3d;
font-weight: 500;
margin-bottom: 4px;
font-size: .95rem;
}
#programsPopupForm.ac-marketo-form select {
height: 32px;
border-radius: 2px;
background-position:
calc(100% - 10px) calc(1.5em - 2px),
calc(100% - 5px) calc(1.5em - 2px),
calc(100% - 2.5em) 0.5em;
}
#programsPopupForm .ac-marketo-form input,
#programsPopupForm .ac-marketo-form select {
height: 32px;
font-size: .95rem;
color: var(--main-text-color);
background-color: #fbfbfb;
border: 1px solid #cccccc;
border-radius: 3px;
}
#programsPopupForm .ac-marketo-form textarea {
min-height: 35px !important;
height: 35px;
font-size: .95rem;
color: var(--main-text-color);
background-color: #fbfbfb;
border: 1px solid #cccccc;
border-radius: 3px;
display: flex;
align-items: center;
resize: vertical;
}
#programsPopupForm .ac-marketo-form input[type="checkbox"] + label{
font-size: .85rem !important;
}
#programsPopupForm .ac-marketo-form-field-container {
margin-bottom: 13px;
width: 100%;
padding-left: 20px !important;
padding-right: 20px !important;
}
#programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
width: 30% !important;
}
#programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
width: 70% !important;
}    
.ac-marketo-form-field-container.privacy a:hover {
text-decoration: underline !important;
}
.ac-marketo-form-field-container.privacy a:focus {
text-decoration: underline !important;
outline: var(--focus-outline) !important;
}
.ac-marketo-form-field-container.privacy a:focus:not(:focus-visible) {
outline: none !important;
}
#programsPopupForm .ac-marketo-form-field-container.questionCapture {
width: 100% !important;
}
#programsPopupForm .ac-marketo-form .ac-marketo-form-field-container.htmltext {
width: 50% !important;
display: flex !important;
justify-content: flex-end !important;
margin-bottom: 8px !important;
font-size: 0.85rem !important;
color: var(--main-text-color) !important;
font-weight: 500 !important;
position: absolute !important;
right: 0px !important;
top: 80px !important;
}
#programsPopupForm .ac-marketo-form-field-container:nth-last-child(3) span:first-child {
font-size: 22px !important;
padding-right: 3px !important;
margin-bottom: -3px !important;
}
#programsPopupForm .ac-marketo-form-field-container:nth-last-child(4) {
width: 100%;
display: flex;
justify-content: flex-start;
margin-bottom: 8px !important;
}
#programsPopupForm .ac-marketo-form-field-container:nth-last-child(5) {
width: 100%;
display: flex;
justify-content: flex-start;
margin-bottom: 8px !important;
}
#programsPopupForm .ac-marketo-form-final-container {
width: 100% !important;
display: flex !important;
flex-direction: row !important;
justify-content: flex-start !important;
align-items: center !important;
}
#programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container {
width: 60% !important;
}
#programsPopupForm .ac-marketo-form-field-container.privacy {
width: 100% !important;
font-size: 0.8rem !important;
line-height: 0.95rem !important;
padding-bottom: 0 !important;
}
#programsPopupForm .ac-marketo-form input[type="checkbox"] + label::before {
background-color: #eaeaea !important;
border: 1px solid #6b6b6b !important;
border-radius: 25px !important;
}
#programsPopupForm .ac-marketo-form input[type="checkbox"] + label:hover::before {
background-color: #f0f0f0 !important;
border: 1px solid #1b1b1b !important;
}
.ac-marketo-form input[type="checkbox"]:checked + label::before {
content: '';
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-form-checkbox-circle.png');
background-size: 13px;
align-items: center;
justify-content: center;
background-repeat: no-repeat;
display: block;
position: absolute;
width: 15px !important;
height: 15px !important;
border-radius: 0px !important;
background-color: #eaeaea !important;
border: 1px solid #6b6b6b !important;
outline: none !important;
top: 0px !important;
left: 0px !important;    
}
#programsPopupForm .ac-marketo-form button[type="submit"] {
background-color: var(--main-text-color) !important;
border-radius: 4px;
font-size: .95rem !important;
font-weight: 400;
letter-spacing: .02rem;
padding: 11px 10px 11px 15px !important;
display: flex;
justify-content: space-between;
align-items: center;
}
#programsPopupForm .ac-marketo-form button[type="submit"]:hover {
background-color: var(--primary-green) !important;
}
#programsPopupForm .ac-marketo-form button[type="submit"]:focus {
outline: var(--focus-outline) !important;
}
#programsPopupForm .ac-marketo-form button[type="submit"]:focus:not(:focus-visible) {
outline: none !important;
}
#programsPopupForm .ac-marketo-form button[type="submit"]::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-white.png');
background-size: 15px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
}
#programsPopupForm .ac-marketo-form button[type="submit"]::before {
display: none !important;
margin: 0 !important;
border: none !important;
}
#programsPopupForm .ac-marketo-form select {
padding-left: 10px !important;
width: calc(100% - 12px) !important;
height: 32px !important;
font-size: .85rem !important;
font-weight: 500;
color: var(--main-text-color) !important;
background-color: #fbfbfb !important;
border: 1px solid #cccccc !important;
border-radius: 3px !important;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-form-select-arrow.png');
background-position: right;
background-position-x: 97%;
background-size: 12px;
background-repeat: no-repeat;
display: inline-flex;
align-items: center;
justify-content: center;
}
#programsPopupForm .ac-marketo-form select:hover,
#programsPopupForm .ac-marketo-form input:hover,
#programsPopupForm .ac-marketo-form textarea:hover {
background-color: #fefefe !important;
border: 1px solid #999999 !important;
}
#programsPopupForm .ac-marketo-form input:focus,
#programsPopupForm .ac-marketo-form select:focus,
#programsPopupForm .ac-marketo-form textarea:focus {
background-color: var(--white) !important;
box-shadow: 1px 1px 2px rgb(77, 144, 254, 100%) inset, 
-1px -1px 2px rgb(77, 144, 254, 100%) inset;
outline: 1px solid transparent;
}
#programsPopupForm .ac-marketo-form input[type="checkbox"]:focus + label::before {
outline: var(--focus-outline) !important;
}
#programsPopupForm .ac-marketo-form select:focus:not(:focus-visible),
#programsPopupForm .ac-marketo-form input:focus:not(:focus-visible),
#programsPopupForm .ac-marketo-form textarea:focus:not(:focus-visible),
#programsPopupForm .ac-marketo-form input[type="checkbox"]:focus:not(:focus-visible) + label::before {
outline: none !important;
}
#programsPopupForm .ac-marketo-form-container .ac-marketo-form-title {
padding: 25px 20px !important;
margin-bottom: 30px !important;
margin: 0 19px;
border-radius: 4px;
}
@media screen and (max-height: 800px) {
	#programsPopupForm .ac-marketo-form-container .ac-marketo-form-title {
		padding: 10px !important;
	}
}
#programsPopupForm .ac-marketo-form {
padding: 15px 0 0 0;
}
#programsPopupForm {
height: 100% !important;
/* addds space to prevent scroll bars when additional fields are added */
/*height: calc(100% + 50px) !important;*/

transform: scale(98%);
border-radius: 8px;
border: 10px solid #fff !important;
}
.fancybox-slide--html {
padding: 30px 5px !important;
}
.fancybox-content {
padding: 0px !important;
}
.fancybox-button {
height: 50px !important;
width: 50px !important;
}
.fancybox-slide--html .fancybox-close-small {
top: -15px !important;
right: -15px !important;
color: #4b4b4b;
opacity: .4;
}
.fancybox-slide--html .fancybox-close-small:hover {
opacity: 1;
}

/* -- RESPONSIVE MEDIA QUERIES -- */

/* -- MAX HEIGHT 800px -- */   
@media screen and (max-height: 800px) {
     #programsPopupForm {
     transform: scale(92%);
     }
     .fancybox-slide--html {
     padding: 20px 5px 60px 5px !important;
     }
}
/* -- MAX HEIGHT 700px -- */   
@media screen and (max-height: 700px) {
     #programsPopupForm {
     transform: scale(82%);
     }
     .fancybox-slide--html {
     padding: 0px 5px 80px 5px !important;
     }
}
/* -- MAX 1200px -- */   
@media screen and (max-width: 1200px) {
     #clusters .intro-txt h1 {
     font-size: 2.2rem;
     }
     #programsPopupForm .ac-marketo-form-field-container {
     width: 100%
     }
     #programsPopupForm .ac-marketo-form select {
     font-size: .8rem;
     }
}

/* -- MAX 1100px -- */   
@media screen and (max-width: 1100px) {
     #programsPopupForm .ac-marketo-form-field-container {
     width: 100%
     }
     #programsPopupForm .ac-marketo-form select {
     font-size: .8rem;
     }
}
/* -- MIN 992px -- */   
@media (min-width: 992px) { /* Virtual Tour lead form css fixes */
     #aclf-virtual-tour-wrapper .ac-marketo-form {
     display: block !important;
     flex-flow: none !important;
     }
     #aclf-virtual-tour-wrapper  .ac-marketo-form .ac-marketo-form-field-container {
     width: auto !important;
     }
     #aclf-virtual-tour-wrapper  .ac-marketo-form-final-container {
     display: block !important;
     }
}
/* -- MAX 991px -- */   
@media screen and (max-width: 991px) {
     #clusters .intro-txt h1 {
     font-size: 2.1rem;
     }
     #programsPopupForm .ac-marketo-form-field-container {
     width: 100%;
     } 
}
/* -- MAX 880px -- */   
@media screen and (max-width: 880px) {
     #clusters .intro-txt h1 {
     font-size: 2rem;
     }
     #programsPopupForm .ac-marketo-form-field-container:nth-child(3) {
     width: 100% !important;
     }
     #programsPopupForm .ac-marketo-form select {
     background-position-x: 98%;
     }
     #programsPopupForm .ac-marketo-form-field-container {
     margin-bottom: 13px;
     }
     #programsPopupForm .ac-marketo-form .ac-marketo-form-field-container.htmltext {
     width: 100% !important;
     font-size: 0.9rem !important;
     }
     .col#programsPopupForm {
     min-width: 100%;
     }
}
/* -- MAX 575px -- */   
@media screen and (max-width: 575px) {
     #clusters .intro-txt h1 {
     font-size: 1.8rem;
     }
     #programsPopupForm .ac-marketo-form-final-container {
     flex-direction: column !important;
     }
     #programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
     width: 100% !important;
     }
     #programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
     width: 100% !important;
     }    
     #programsPopupForm .ac-marketo-form-field-container {
     margin-bottom: 13px;
     width: 100%
     }
     #programsPopupForm .ac-marketo-form-field-container:nth-last-child(4) {
     width: 100%;
     margin-bottom: 5px !important;
     }
     #programsPopupForm .ac-marketo-form label {
     margin-top: 5px !important;
     }
     #programsPopupForm .ac-marketo-form label:first-child {
     margin-top: 5px !important;
     }
     #programsPopupForm .ac-marketo-form-field-container:nth-last-child(3) {
     width: 100%;
     margin: 0 !important;
     justify-content: flex-end !important;
     position: absolute;
     right: 20px;
     font-size: .85rem !important;
     }
     #programsPopupForm .ac-marketo-form input[type="checkbox"] + label {
     font-size: .95rem;
     }
     .ac-marketo-form input[type="checkbox"] + label::before {
     margin-top: 2px;
     }
}
/* -- MAX 480px -- */   
@media screen and (max-width: 480px) {
     #programsPopupForm .ac-marketo-form-final-container .ac-marketo-form-field-container {
     width: 100% !important;
     }
     #programsPopupForm .ac-marketo-form-field-container:nth-last-child(3) {
     font-size: .85rem !important;
     }
     #programsPopupForm .ac-marketo-form label:first-child {
     margin-top: 5px !important;
     }
}

.prgm-categories h3 {
color: var(--primary-dark);
font-size: 1.15em;
font-weight: 400;
margin: 0;
position: relative;
line-height: 1.1em !important;
padding: 10px 10px 10px 0;
display: flex;
align-items: center;
}
.cluster-2022-prgm-filters {
display: flex;
padding: 0;
flex-direction: column;
width: 100%;
}
.prgm-filters-wrapper {
display: flex;
padding: 0;
flex-direction: column;
width: 100%;
justify-content: space-between;
}
.cluster-2022-prgm-filters .select-wrapper {
position: relative;
display: flex !important;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
width: 100%;
padding: 10px 0;
}
.cluster-2022-prgm-filters .select-wrapper:first-child {
padding: 0 0 10px 0;
}
.filter-checkboxes {
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
padding: 5px 0;
}
.filter-checkboxes.certification-filter-checkboxes {
flex-direction: column;
width: 100%;
}
.select-wrapper .filter-checkboxes label {
font-size: 1rem;
font-weight: 200;
color: var(--main-text-color);
padding: 2px 0 !important;
display: inline-block;
width: 100%;
margin: 0;
line-height: 24px;
}
.select-wrapper .filter-checkboxes label input {
height: 16px;
width: 16px;
margin-right: 9px;
margin-left: 0px;
text-indent: 30px;
padding: 0;
display: flex;
float: left;
justify-content: center;
align-items: center;
background: #fcfcfc;
border-radius: 2px;
border: 1px solid #bbb;
-webkit-appearance: none;
color: var(--main-text-color);
box-shadow:  inset 0px 0px 1px 0px #c8c8c8,
             inset 0px 0px 1px 0px #f4f4f4;
}
.select-wrapper .filter-checkboxes label input:checked {
background: #338267;
border: 1px solid #338267;
box-shadow: none;
-webkit-appearance: none;
content: url('/wp-content/themes/algonquincollege2018/images/icns/icn-checkmark-white.png');
}
.select-wrapper .filter-checkboxes label input:checked::after {
background-size: 14px;
background: url(../../../../themes/algonquincollege2018/images/icons/long-arrow-right.svg) no-repeat;
}
.select-wrapper .filter-checkboxes label:hover input {
background: #338267;
border: 1px solid #338267;
box-shadow: inset 0px 0px 0px 1px var(--white);     
}
.select-wrapper .filter-checkboxes label:hover input:checked {
background: #338267;
border: 1px solid #338267;
box-shadow: none;
}
#slide-out :checked:hover {
color: var(--primary-green);
font-weight: 400;
}
.select-wrapper h4 {
font-size: 1.05rem;
font-weight: 500;
color: #505050;
margin: 0 3px 10px 3px;
display: flex;
align-items: center;
}
.select-wrapper h4 span,
.select-wrapper a span {
display: flex;
align-items: center;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
transition: .2s;
}
.select-wrapper h4 span::before,
.select-wrapper a span:first-child::before {
background-size: 25px;
width: 25px;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
background-repeat: no-repeat;
transition: .2s;
margin-right: 7px;
margin-left: -2px;
margin-bottom: 2px;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.select-wrapper.fltr-certification h4 span::before,
.select-wrapper.fltr-certification a span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-credential-green.png');
}
.select-wrapper.fltr-certification h4:hover span::before,
.select-wrapper.fltr-certification a:hover span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-credentiales-green-fill.png');
}
.select-wrapper.fltr-campus h4 span::before,
.select-wrapper.fltr-campus a span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-campus-green.png');
}
.select-wrapper.fltr-campus h4:hover span::before,
.select-wrapper.fltr-campus a:hover span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-campus-green-fill.png');
}
.select-wrapper.fltr-delivery h4 span::before,
.select-wrapper.fltr-delivery a span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-deliverymode-green.png');
}
.select-wrapper.fltr-delivery h4:hover span::before,
.select-wrapper.fltr-delivery a:hover span:first-child::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-delivery-mode-green-fill.png');
}
.cluster-2022-prgm-filters .hideProgramFilter {
display:none !important;
}
#filter-btn span::before,
#filter-btn-mobile span::before,
.reset-button span::before, 
.close-button span::before {
background-size: 14px;
width: 14px;
height: 14px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
background-repeat: no-repeat;
transition: .2s;
transition-timing-function: ease-in-out;
margin-right: 9px;
}
#filter-btn:hover span::before, #filter-btn-mobile:hover span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-filter-white.png');
}
#filter-btn span::before, #filter-btn-mobile span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-filter-dark.png');
}
/* The Close Button */
.close {
color: #ddd;
float: right;
font-size: 35px;
font-weight: 500;
}
.close:hover,
.close:focus {
color: #fff;
text-decoration: none;
/* cursor: pointer; */
}
.modal-footer {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 7px 5px 7px 15px;
flex-direction: row;
}
.modal-results-wrapper {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
width: 50%;
}
.filter-controls {
display: flex;
align-items: center; 
}
.filter-btn-wrapper,
.reset-button-wrapper {
display: flex;
align-items: center;
}
.filter-btn-wrapper {
padding: 15px 0;
}
.filter-wrapper {
display: flex;
flex-direction: column;
align-items: flex-end;
padding: 0;
margin: -5px 0px 10px 0px;
}
.slideout-wrapper {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
height: 100%;
padding: 20px 0 60px 0;
}
.filter-wrapper.opened {
border: 1px solid #e8e8e8;
border-radius: var(--card-radius);
box-shadow: 0px 1px 1px 0px #eaeaea, 0px -1px 1px 0px #fafafa;
}
.filter-controls button {
display: flex;
align-items: center;
justify-content: center;
font-weight: 400;
color: var(--main-text-color);
background-color: #fcfcfc;
box-shadow: 0 1px 2px 0px rgba(24,21,21,0.3);
border-radius: var(--card-radius);
border: 1px solid #dddddd !important;
transition: .1s;
transition-timing-function: ease-in-out;
font-size: .85rem;
padding: 0;
margin: 0px 3px;
width: 28px;
height: 28px;
}
.filter-controls button:last-child {
margin: 0px 0px 0px 3px;
}
.filter-controls button:hover {
background: #fefefe;
box-shadow:  inset 1px 1px 2px #c8c8c8,
             inset -1px -1px 2px #e9e9e9;
color: var(--main-text-color);
/* cursor: pointer; */
}
#filter-btn,
#filter-btn-mobile {
display: flex;
align-items: center;
justify-content: center;
font-weight: 400;
color: #fefefe;
font-size: .9rem;
padding: 5px 10px;
border: none;
height: 34px;
width: 85px;
margin: 0;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
border-radius: 8px;
background-color: var(--darker-green);
transition: .1s;
}
#filter-btn {
height: 36px;
font-size: 1rem;
width: 95px;
margin: 0 5px 0 0;
}
.program-count {
display: flex;
align-items: center;
justify-content: flex-start;
margin-right: 15px;
padding: 0 10px;
font-size: 1.05rem;
font-weight: 400;
color: #505050;
height: 36px;
}
.program-count span {
color: var(--primary-dark);
margin: 0px 4px;
font-weight: 600;
}
#filter-btn:hover,
#filter-btn-mobile:hover {
/* cursor: pointer; */
background-color: var(--darkest-green);
}
#filter-btn span::before,
#filter-btn-mobile span::before {
background-size: 18px;
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
transition: .1s;
background-repeat: no-repeat;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
margin-right: 8px;
}
.filter-controls button span::before {
background-size: 16px;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
background-repeat: no-repeat;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
margin-right: 0px;
}
#filter-btn span::before,
#filter-btn-mobile span::before {
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-filter-white.png');
}
#filter-btn:hover span::before,
#filter-btn-mobile:hover span::before {
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-filter-white-reverse.png');
}
#filter-btn.expand span::before,
#filter-btn.expand:hover span::before {
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-filter-dark.png');
}
.exp-coll-button span::before,
.exp-coll-button:hover span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-exp-coll-dark.png');
}
.reset-button span::before,
.reset-button:hover span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-reset-dark.png');
}
.close-button span::before,
.close-button:hover span::before {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-close-dark.png');
}
.acc-ctrls {
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
padding: 5px 0 0 0;
margin-bottom: -5px;
}
.total-results-notice,
.no-results-notice {
width: 100%;
display: flex;
justify-content: flex-start;
align-items: center;
}
#slide-out :checked + span {
font-weight: 400;
}
.total-results-notice p {
font-size: 1rem;
font-weight: 300;
color: var(--secondary-green);
margin: 0;
}
.no-results-notice p {
font-size: 1rem;
font-weight: 400;
color: #a63521;
}
.total-results-notice p span {
font-weight: bold;
}
#sticky-campus-nav {
width: 100%;
background: var(--white);
position: fixed;
z-index: 3;
}
/* -- MAX 880px -- */   
@media screen and (max-width: 880px) {
     #sticky-campus-nav {
     display: none;
     }
}
/* -- MAX 880px -- */   
@media screen and (min-width: 881px) {
     #sticky-campus-nav {
     display: block;
     }
}
#slideout {
display:none;
background: #fcfcfc;
padding: 30px 20px 20px 20px;
color: #333;
position: fixed;
top: 0;
border-right: 1px solid #e8e8e8;
right: -400px;
width: 400px;
height: 100%;
z-index: 4;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
overflow-y: scroll;
overflow-x: hidden;
}
#v-mobile {
display: none;
}
.slideout-header {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding-bottom: 15px;
margin-bottom: 15px;
}
.slideout-header h3 {
color: var(--primary-green);
font-size: 18px;
font-weight: 500;
margin: 0;
position: relative;
line-height: 1.1em !important;
padding: 0 0 0 5px;
}
#slideout.on {
right: 0;
display:block;
}
.checkboxes {
padding: 5px 0;
width: 100%;
}
.checkbox-wrapper {
display: flex;
flex-direction: column;
width: 100%;
flex-wrap: nowrap;
}      
.checkbox {
width: 100%;
padding: 3px 10px;
}
.checkbox,
.fltr-certification .checkbox,
.fltr-campus .checkbox,
.fltr-delivery .checkbox {
width: 100%;
}
.checkbox-input {
clip: rect(0 0 0 0);
clip-path: inset(100%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}
.checkbox-input:checked + .checkbox-tile,
.checkbox-input:checked + .checkbox-tile:hover {
background-color: var(--primary-green);
box-shadow: inset 0 0 0 1px var(--primary-green);
}
.checkbox-input:checked + .checkbox-tile::before {
display: none;
}
.checkbox-input:checked + .checkbox-tile .checkbox-icon,
.checkbox-input:checked + .checkbox-tile .checkbox-label {
color: var(--white);
font-weight: 400;
}
.checkbox-input:focus + .checkbox-tile {
outline: var(--focus-outline);
}
.checkbox-tile {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
width: 100%;
padding: 8px 20px 8px 20px;
min-height: 38px;
border-radius: 5px;
border: none;
background-image: none;
background-color: #fefefe;
box-shadow: inset 0 0 0 1px #e4e4e4;
transition: 0.1s ease;
/* cursor: pointer; */
position: relative;
}
.checkbox-tile::before {
display: none;
}
.checkbox-tile:hover {
box-shadow: inset 0 0 0 1px rgba(0, 99, 65, .05);
background-position: none;
background-color: rgba(0, 99, 65, .15);
}
.checkbox-icon {
transition: 0.375s ease;
color: #494949;
}
.slideout-header h3 {
font-size: 20px;
}
.checkbox-label {
color: var(--main-text-color);
font-weight: 400;
line-height: 1.2em;
font-size: .9rem;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
display: flex;
width: 100%;
align-items: center;
justify-content: space-between;
}
.checkbox-input:checked + .checkbox-tile .checkbox-label::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-checkmark-white.png');
background-size: 12px;
width: 12px;
height: 12px;
display: flex;
align-items: center;
justify-content: flex-end;
content: "";
padding: 0;
background-repeat: no-repeat;
transition: .2s;
margin-right: 0;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
content: "";
}
.checkbox-tile:hover .checkbox-label {
color: var(--darkest-green);
}
.filters-accordion {
display: flex;
justify-content: space-between;
align-items: center;
background-color: transparent;
font-size: 15.5px;
font-weight: 500;
color: #2b2b2b;
margin: 0;
/* cursor: pointer; */
padding: 0 5px 0 0;
min-height: 40px !important;
width: 100%;
text-align: left;
border-style: none;
outline: none;
transition: 0.1s;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
text-decoration: none;
text-decoration-line: none;
transition: .1s;
transition-timing-function: ease-in;
}
.filters-accordion:focus,
.filters-accordion.active:focus {
outline: var(--focus-outline) !important;
}
.filters-accordion:focus:not(:focus-visible) {
outline: none !important;
}
.filters-accordion.active {
outline: none !important;
}
.filters-accordion span.accordion-icn::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-green.png');
background-size: 12px;
width: 12px;
height: 12px;
display: flex;
align-items: center;
justify-content: center;
content: "";
opacity: .6;
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
margin-left: 3px;
transition: var(--quick-linear);
}
.filters-accordion:hover {
text-decoration: none;
}
.filters-accordion:hover span.accordion-icn::after {
opacity: 1;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-green.png');
}
.filters-accordion.active span.accordion-icn::after {
transform: rotate(180deg);
}
.filters-accordion.active:hover span.accordion-icn::after {
transform: rotate(180deg);
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-down-green.png');
}
.filters-item-wrapper {
max-height: 0px; 
overflow:auto;
width: 100%;
}
span.filters-item-icn {
max-width: 100%;
color: var(--main-text-color) !important;
font-weight: 300;
font-size: 1rem;
line-height: 1.3rem;
}
.filters-item-wrapper.visible {
max-height: 100%;
}
.filters-item-wrapper.invisible {
max-height: 0px;
}

/* TOOLTIP STYLES */
[tooltip] {
position: relative; 
}
[tooltip]::before,
[tooltip]::after {
text-transform: none; 
font-size: .85rem;
line-height: 1;
user-select: none;
pointer-events: none;
position: absolute;
display: none;
opacity: 0;
}
[tooltip]::before {
content: '';
border: 6px solid transparent; 
z-index: 1001; 
}
[tooltip]::after {
content: attr(tooltip);
text-align: center;
min-width: 3em;
max-width: 21em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 6px 10px;
border-radius: 4px;
background: #1b1b1b;
color: #fff;
z-index: 1000; 
}
[tooltip]:hover::before,
[tooltip]:hover::after,
[tooltip]:focus::before,
[tooltip]:focus::after {
display: block;
}
[tooltip='']::before,
[tooltip='']::after {
display: none !important;
}
/* APPEAR TOP */
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
bottom: 100%;
border-bottom-width: 0;
border-top-color: #333;
}
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
bottom: calc(100% + 3px);
}
[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
[tooltip][flow^="up"]::after {
left: 50%;
transform: translate(-50%, -.5em);
margin-bottom: 5px;
}

/* KEYFRAMES */
@keyframes tooltips-vert {
     to {
     opacity: .9;
     transform: translate(-50%, 0);
     }
}
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):focus::before,
[tooltip]:not([flow]):hover::after,
[tooltip]:not([flow]):focus::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:focus::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="up"]:focus::after {
animation: tooltips-vert 100ms ease-in-out forwards;
}
.dim-overlay {
display: none;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
background-color: rgba(0,0,0,0.75);
}
.dim-overlay.enabled {
display: initial;
}
.results-button-wrapper {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
margin-top: 10px;
padding: 20px 5px;
}
.results-button-wrapper button {
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
border-radius: var(--card-radius);
font-size: .85rem;
padding: 8px 12px;
margin: 0 4px;
width: calc(100%/2);
}
.results-button-wrapper button.results-button {
background-color: var(--primary-green);
border: 1px solid var(--primary-green) !important;
color: var(--white);
}
.results-button-wrapper button.results-button:hover {
background-color: var(--darker-green) !important;
border: 1px solid var(--darker-green) !important;
/* cursor: pointer; */
}
.results-button-wrapper button.clear-all {
background-color: #fcfcfc;
border: 1px solid #dddddd !important;
color: var(--main-text-color);
}
.results-button-wrapper button.clear-all:hover {
background: var(--white);
box-shadow:  inset 1px 1px 2px #c8c8c8,
             inset -1px -1px 2px #e9e9e9;
/* cursor: pointer; */
}
.results-button-wrapper button span {
display: flex;
align-items: center;
}
.results-button-wrapper button span::after {
display: inline-flex;
align-items: center;
justify-content: center;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
transition: var(--quick-linear);
transition-timing-function: ease-in-out;
}
.results-button-wrapper button.results-button span::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-white.png');
background-size: 11px;
width: 11px;
height: 11px;
margin-left: 7px;
}
.results-button-wrapper button.clear-all span::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-reset-dark.png');
background-size: 13px;
width: 13px;
height: 13px;
margin-left: 8px;
}
.cluster-fltr-content#credential {
display: block;
}
.cluster-fltr-content {
display: none;
}
#slideout-mobile .slideout-header {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 15px;
}
#slideout-mobile .slideout-header div {
display: flex;
align-items: center;
justify-content: flex-end;
}
#slideout-mobile .slideout-header button {
display: flex;
align-items: center;
justify-content: center;
font-weight: 400;
color: var(--main-text-color);
background-color: #fcfcfc;
box-shadow: 0 1px 2px 0px rgba(24,21,21,0.3);
border-radius: var(--card-radius);
border: 1px solid #dddddd !important;
transition: .1s;
transition-timing-function: ease-in-out;
font-size: .85rem;
padding: 0;
margin: 0px 4px;
width: 32px;
height: 32px;
}
#slideout-mobile .slideout-header button:hover {
background: #fefefe;
box-shadow:  inset 1px 1px 2px #c8c8c8,
             inset -1px -1px 2px #e9e9e9;
color: var(--main-text-color);
/* cursor: pointer; */
}
#slideout-mobile .slideout-header button span::before {
background-size: 18px;
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
content: "";
padding: 0;
background-repeat: no-repeat;
will-change: transform;
-webkit-transform: translateZ(0);
transform: translateZ(0);
margin-right: 0px;
}

/* -- MAX 767px -- */   
@media (max-width: 767px) {
     .checkbox,
     .fltr-certification .checkbox,
     .fltr-campus .checkbox,
     .fltr-delivery .checkbox {
     width: 100%;
     }
     .checkbox-tile {
     align-items: flex-start;
     min-height: 50px;
     padding: 8px 20px 8px 45px !important;
     background-color: #fefefe;
     box-shadow: inset 0 0 0 1px #e4e4e4;
     color: var(--secondary-dark);
     }
     .checkbox-tile:hover {
     padding: 8px 20px 8px 45px !important;
     background-color: #fefefe;
     box-shadow: inset 0 0 0 1px #e4e4e4;
     color: var(--secondary-dark);
     }
     .cluster-2022-prgm-filters {
     display: flex;
     padding: 0;
     flex-direction: column;
     width: 100%;
     height: 100%;
     justify-content: space-between;
     }
     .checkbox-input:checked + .checkbox-tile,
     .checkbox-input:checked + .checkbox-tile:hover {
     padding: 8px 20px 8px 45px !important;
     background-color: var(--primary-green);
     box-shadow: inset 0 0 0 1px var(--primary-green);
     color: var(--white);
     }
     .checkbox-tile:hover .checkbox-label {
     color: var(--secondary-dark);
     }
     .checkbox-tile:hover::before,
     .checkbox-input:checked + .checkbox-tile::before {
     display: block;
     transform: translateX(0);
     }
     .checkbox-tile::before {
     top: unset;
     left: 0.75rem;
     width: 1.2rem;
     height: 1.2rem;
     }
     .slideout-wrapper {
     padding: 0 0 30px 0;
     }
     #slideout-desktop {
     display: none;
     }
     #v-mobile {
     display: block;
     }
     .v-mobile-wrap {
     display: flex;
     justify-content: center;
     }
     #slideout-mobile {
     background: #fcfcfc;
     padding: 0 0 10px 0;
     box-shadow: 0px -1px 5px 1px rgba(24,21,21,0.35);
     position: fixed;
     top: 100vh;
     width: 100%;
     left: unset;
     height: calc(100% - 45px);
     z-index: 20;
     margin: 0 auto;
     opacity: 0;
     border-top-left-radius: 12px;
     border-top-right-radius: 12px;
     -webkit-transition-duration: 0.2s;
     -moz-transition-duration: 0.2s;
     -o-transition-duration: 0.2s;
     transition-duration: 0.2s;
     transition-timing-function: ease-in;
     overflow-y: scroll;
     overflow-x: hidden;
     }
     #slideout-mobile.on  {
     top: unset;
     bottom: 0;
     opacity: 1;
     }

     /* TAB FILTERS (mobile clusters filter) */
     .tab-fltr {
     width: 100%;
     border-radius: 0;
     margin-bottom: 25px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     position: relative;
     }
     .tab-fltr input {
     display: none;
     }
     .tab-fltr > input:checked + label {
     transition: all 0.5s ease;
     color: #6d5dfc;
     }
     .cluster-fltr-tab {
     width: calc(100% / 3) !important;
     height: 5rem;
     font-size: .9rem;
     font-weight: 500;
     color: var(--secondary-dark);
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     /* cursor: pointer; */
     padding: 0 !important;
     margin: 0;
     border-style: none;
     border-bottom: 1px solid #dddddd;
     border-top: 1px solid #dddddd;
     background-color: #fefefe;
     }
     .filter-wrapper {
     flex-direction: row;
     align-items: center;
     justify-content: space-between;
     margin: 20px 0px 8px 0px;
     }
     div.results-wrapper {
     flex-direction: row-reverse;
     justify-content: space-between;
     width: 100%;
     }
     .program-count {
     padding: 0 0 0 10px;
     margin-right: 0;
     }
     .expand-collapse {
     min-width: 250px;
     }
     .cluster-fltr-tab.active {
     background-color: var(--secondary-green);
     color: var(--white);
     border-bottom: 1px solid var(--secondary-green);
     border-top: 1px solid var(--secondary-green);
     }
     .cluster-fltr-tab.active::after {
     content: '';
     width: 0;
     height: 0;
     border-left: 11px solid transparent;
     border-top: 11px solid var(--secondary-green);
     border-right: 11px solid transparent;
     display: flex;
     justify-content: center;
     margin: 0 auto 0 auto;
     position: absolute;
     bottom: -9px;
     }
     .cluster-fltr-tab.tab-fltr-credential {
     border-right: 1px solid #ddd;
     }
     .cluster-fltr-tab.tab-fltr-credential.active {
     border-right: 1px solid var(--secondary-green);
     }
     .cluster-fltr-tab.tab-fltr-delivery {
     border-left: 1px solid #ddd;
     }
     .cluster-fltr-tab.tab-fltr-delivery.active {
     border-left: 1px solid var(--secondary-green);
     }
     .cluster-fltr-tab:hover {
     /* cursor: pointer; */
     }
     .cluster-fltr-tab span {
     z-index: 1;
     will-change: transform;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
     transition: .2s;
     }
     .checkbox-input:checked + .checkbox-tile::before {
     transform: scale(1.05);
     opacity: 1;
     background-color: var(--primary-green);
     border-color: var(--primary-green);
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-checkmark-white.png');
     }
     .checkbox-tile::before {
     content: "";
     position: absolute;
     display: block;
     border: .1rem solid #d8d8d8;
     background-color: #fefefe;
     border-radius: 3px;
     top: unset;
     left: 0.85rem;
     width: 1.05rem;
     height: 1.05rem;
     opacity: 0;
     background-image: none;
     background-size: 12px;
     background-repeat: no-repeat;
     background-position: 50% 50%;
     }
     .checkbox-input:checked + .checkbox-tile .checkbox-label::after {
     display: none;
     }
     .cluster-fltr-tab span::before {
     background-size: 28px;
     width: 28px;
     height: 28px;
     display: flex;
     align-items: center;
     justify-content: center;
     content: "";
     padding: 0;
     background-repeat: no-repeat;
     margin-right: 0;
     margin-bottom: 6px;
     will-change: transform;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
     }
     .cluster-fltr-tab.tab-fltr-credential span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-credential-green.png');
     }
     .cluster-fltr-tab.tab-fltr-credential.active span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-credential-white.png');
     }
     .cluster-fltr-tab.tab-fltr-campus span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-campus-green.png');
     }
     .cluster-fltr-tab.tab-fltr-campus.active span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-campus-white.png');
     }
     .cluster-fltr-tab.tab-fltr-delivery span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-deliverymode-green.png');
     }
     .cluster-fltr-tab.tab-fltr-delivery.active span::before {
     background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-fltr-deliverymode-white.png');
     }
     .prgm-filters-wrapper {
     padding: 5px;
     }
     #slideout-mobile .prgm-filters-wrapper h4 {
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: transparent;
     font-size: 1.05rem;
     font-weight: 500;
     color: #505050;
     margin: 0;
     padding: 10px;
     width: 100%;
     text-align: center;
     border-style: none;
     outline: none;
     }
     .slideout-header {
     border-bottom: none;
     margin-bottom: 5px;
     }
     [tooltip]:not([flow])::before,
     [tooltip]:not([flow])::after,
     [tooltip][flow^="up"]::before,
     [tooltip][flow^="up"]::after {
     margin-bottom: 1px;
     }
     .v-mobile h4 {
     font-size: 1.1rem;
     color: #505050;
     }
     .checkbox-tile::before {
     opacity: .65;
     transform: scale(1);
     }
     .checkbox-tile {
     padding: 8px 20px 8px 45px;
     }
     .results-button-wrapper {
     display: flex;
     width: 100%;
     justify-content: center;
     align-items: center;
     margin-top: 10px;
     padding: 30px 10px 10px 10px;
     }
     .results-button-wrapper button {
     height: 45px;
     }
     .results-button-wrapper button.clear-all:hover {
     background-color: #fcfcfc !important;
     border: 1px solid #dddddd !important;
     color: var(--main-text-color) !important;
     box-shadow: none;
     }
     .results-button-wrapper button.results-button:hover {
     background-color: var(--primary-green) !important;
     border: 1px solid var(--primary-green) !important;
     color: var(--white) !important;
     }
}


/* fixes for card lead form to change the plugin styles for this page*/
.ac-marketo-form-success-message {
padding: 20px;
text-align: center;
width: 100%;
margin: 0 auto;
font-size: 1rem;
color: #4b4b4b;
}
#card-lead-form .card-program-information .ac-marketo-form-title {
display: none !important;
}
#card-lead-form .card-program-information .ac-marketo-form {
margin-top: 20px;
display: flex;
flex-wrap: wrap;
}
#card-lead-form .card-program-information .ac-marketo-form-container {
background-color: inherit !important;
}
#card-lead-form .card-program-information .ac-marketo-form-container {
border-radius: 10px;
}
#card-lead-form .ac-marketo-form label {
color: #3d3d3d;
font-weight: 500;
margin-bottom: 4px;
font-size: .95rem;
}
#card-lead-form.ac-marketo-form select {
height: 32px;
border-radius: 2px;
background-position:
calc(100% - 10px) calc(1.5em - 2px),
calc(100% - 5px) calc(1.5em - 2px),
calc(100% - 2.5em) 0.5em;
}
#card-lead-form .ac-marketo-form input,
#card-lead-form .ac-marketo-form select {
height: 32px;
font-size: .95rem;
color: #3b3b3b;
background-color: #fbfbfb;
border: 1px solid #cccccc;
border-radius: 4px;
}
#card-lead-form .ac-marketo-form textarea {
min-height: 35px !important;
height: 35px;
font-size: .95rem;
color: #3b3b3b;
background-color: #fbfbfb;
border: 1px solid #cccccc;
border-radius: 4px;
display: flex;
align-items: center;
resize: vertical;
}
#card-lead-form .ac-marketo-form input[type="checkbox"] + label{
font-size: .85rem !important;
}
#card-lead-form .ac-marketo-form-field-container {
margin-bottom: 13px;
width: calc(100% / 2);
}
#card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
width: 30% !important;
}
#card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
width: 70% !important;
}    
.ac-marketo-form-field-container.privacy a:hover {
text-decoration: underline !important;
}
.ac-marketo-form-field-container.privacy a:focus {
text-decoration: underline !important;
outline: var(--focus-outline) !important;
}
.ac-marketo-form-field-container.privacy a:focus:not(:focus-visible) {
outline: none !important;
}
#card-lead-form .ac-marketo-form-field-container.questionCapture {
width: 100% !important;
}
#card-lead-form .ac-marketo-form .ac-marketo-form-field-container.htmltext {
width: 50% !important;
display: flex !important;
justify-content: flex-end !important;
margin-bottom: 8px !important;
font-size: 0.85rem !important;
color: #3b3b3b !important;
font-weight: 500 !important;
position: absolute !important;
right: 19px !important;
top: 15px !important;
}
#card-lead-form .ac-marketo-form-field-container:nth-last-child(3) span:first-child {
font-size: 22px !important;
padding-right: 3px !important;
margin-bottom: -3px !important;
}
#card-lead-form .ac-marketo-form-field-container:nth-last-child(4) {
width: 100%;
display: flex;
justify-content: flex-start;
margin-bottom: 8px !important;
}
#card-lead-form .ac-marketo-form-field-container:nth-last-child(5) {
width: 50%;
display: flex;
justify-content: flex-start;
margin-bottom: 8px !important;
}
#card-lead-form .ac-marketo-form-final-container {
width: 100% !important;
display: flex !important;
flex-direction: row !important;
justify-content: flex-start !important;
align-items: center !important;
}
#card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container {
width: 60% !important;
}
#card-lead-form .ac-marketo-form-field-container.privacy {
width: 100% !important;
font-size: 0.8rem !important;
line-height: 0.95rem !important;
padding-bottom: 0 !important;
}
#card-lead-form .ac-marketo-form input[type="checkbox"] + label::before {
background-color: #eaeaea !important;
border: 1px solid #6b6b6b !important;
border-radius: 25px !important;
}
#card-lead-form .ac-marketo-form input[type="checkbox"] + label:hover::before {
background-color: #f0f0f0 !important;
border: 1px solid #1b1b1b !important;
}
.ac-marketo-form input[type="checkbox"]:checked + label::before {
content: '';
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-form-checkbox-circle.png');
background-size: 13px;
align-items: center;
justify-content: center;
background-repeat: no-repeat;
display: block;
position: absolute;
width: 15px !important;
height: 15px !important;
border-radius: 0px !important;
background-color: #eaeaea !important;
border: 1px solid #6b6b6b !important;
outline: none !important;
top: 0px !important;
left: 0px !important;    
}
#card-lead-form .ac-marketo-form button[type="submit"] {
background-color: #3b3b3b !important;
border-radius: 3px;
font-size: .95rem !important;
font-weight: 400;
letter-spacing: .02rem;
padding: 11px 10px 11px 15px !important;
display: flex;
justify-content: space-between;
align-items: center;
}
#card-lead-form .ac-marketo-form button[type="submit"]:hover {
background-color: #006341 !important;
}
#card-lead-form .ac-marketo-form button[type="submit"]:focus {
outline: var(--focus-outline) !important;
}
#card-lead-form .ac-marketo-form button[type="submit"]:focus:not(:focus-visible) {
outline: none !important;
}
#card-lead-form .ac-marketo-form button[type="submit"]::after {
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-chevron-right-white.png');
background-size: 15px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
content: "";
padding: 0px 0px 0px 0px;
background-repeat: no-repeat;
}
#card-lead-form .ac-marketo-form button[type="submit"]::before {
display: none !important;
margin: 0 !important;
border: none !important;
}
#card-lead-form .ac-marketo-form select {
padding-left: 10px !important;
width: calc(100% - 12px) !important;
height: 32px !important;
font-size: .85rem !important;
font-weight: 500;
color: #3b3b3b !important;
background-color: #fbfbfb !important;
border: 1px solid #cccccc !important;
border-radius: 4px !important;
background-image: url('/wp-content/themes/algonquincollege2018/images/icns/icn-form-select-arrow.png');
background-position: right;
background-position-x: 97%;
background-size: 12px;
background-repeat: no-repeat;
display: inline-flex;
align-items: center;
justify-content: center;
}
#card-lead-form .ac-marketo-form select:hover,
#card-lead-form .ac-marketo-form input:hover,
#card-lead-form .ac-marketo-form textarea:hover {
background-color: #fefefe !important;
border: 1px solid #999999 !important;
}
#card-lead-form .ac-marketo-form input:focus,
#card-lead-form .ac-marketo-form select:focus,
#card-lead-form .ac-marketo-form textarea:focus {
background-color: var(--white) !important;
box-shadow: 1px 1px 2px rgb(77, 144, 254, 100%) inset, 
-1px -1px 2px rgb(77, 144, 254, 100%) inset;
outline: 1px solid transparent;
}
#card-lead-form .ac-marketo-form input[type="checkbox"]:focus + label::before {
outline: var(--focus-outline) !important;
}
#card-lead-form .ac-marketo-form select:focus:not(:focus-visible),
#card-lead-form .ac-marketo-form input:focus:not(:focus-visible),
#card-lead-form .ac-marketo-form textarea:focus:not(:focus-visible),
#card-lead-form .ac-marketo-form input[type="checkbox"]:focus:not(:focus-visible) + label::before {
outline: none !important;
}

/* -- RESPONSIVE MEDIA QUERIES -- */

/* -- MAX 1100px -- */   
@media screen and (max-width: 1100px) {
     #card-lead-form .ac-marketo-form-field-container {
     width: calc(100% / 2);
     }
     #card-lead-form .ac-marketo-form select {
     font-size: .8rem;
     }
}
/* -- MIN 1024px -- */   
@media (max-width: 1024px) { 
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
     width: 30% !important;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
     width: 70% !important;
     }    
}

/* -- MIN 992px -- */   
@media (min-width: 992px) { /* Virtual Tour lead form css fixes */
     #aclf-virtual-tour-wrapper .ac-marketo-form {
     display: block !important;
     flex-flow: none !important;
     }
     #aclf-virtual-tour-wrapper  .ac-marketo-form .ac-marketo-form-field-container {
     width: auto !important;
     }
     #aclf-virtual-tour-wrapper  .ac-marketo-form-final-container {
     display: block !important;
     }
}
/* -- MAX 991px -- */   
@media screen and (max-width: 991px) {
     #card-lead-form .ac-marketo-form-field-container {
     width: calc(100% / 2);
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
     width: 30% !important;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
     width: 70% !important;
     }    
}
/* -- MAX 880px -- */   
@media screen and (max-width: 880px) {
     #card-lead-form .ac-marketo-form-field-container:nth-child(3) {
     width: 100% !important;
     }
     #card-lead-form .ac-marketo-form select {
     background-position-x: 98%;
     }
     #card-lead-form .ac-marketo-form-field-container {
     margin-bottom: 13px;
     width: calc(100% / 2);
     }
     #card-lead-form .ac-marketo-form .ac-marketo-form-field-container.htmltext {
     width: 100% !important;
     font-size: 0.9rem !important;
     top: 45px !important;
     }
     .col#card-lead-form {
     min-width: 100%;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
     width: 35% !important;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
     width: 65% !important;
     }    
}
/* -- MAX 575px -- */   
@media screen and (max-width: 575px) {
     #card-lead-form .ac-marketo-form-final-container {
     flex-direction: column !important;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.submit-button {
     width: 100% !important;
     }
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container.privacy {
     width: 100% !important;
     }    
     #card-lead-form .ac-marketo-form-field-container {
     margin-bottom: 13px;
     width: 100%
     }
     #card-lead-form .ac-marketo-form-field-container:nth-last-child(4) {
     width: 100%;
     margin-bottom: 5px !important;
     }
     #card-lead-form .ac-marketo-form label {
     margin-top: 5px !important;
     }
     #card-lead-form .ac-marketo-form label:first-child {
     margin-top: 5px !important;
     }
     #card-lead-form .ac-marketo-form-field-container:nth-last-child(3) {
     width: 100%;
     margin: 0 !important;
     justify-content: flex-end !important;
     position: absolute;
     right: 20px;
     font-size: .85rem !important;
     }
     #card-lead-form .ac-marketo-form input[type="checkbox"] + label {
     font-size: .95rem;
     }
     .ac-marketo-form input[type="checkbox"] + label::before {
     margin-top: 2px;
     }
     #card-lead-form .ac-marketo-form .ac-marketo-form-field-container.htmltext {
     top: 45px !important;
     }
}
/* -- MAX 480px -- */   
@media screen and (max-width: 480px) {
     #card-lead-form .ac-marketo-form-final-container .ac-marketo-form-field-container {
     width: 100% !important;
     }
     #card-lead-form .ac-marketo-form-field-container:nth-last-child(3) {
    font-size: .85rem !important;
     }
     #card-lead-form .ac-marketo-form label:first-child {
     margin-top: 5px !important;
     }
}
#card-lead-form .card-program-information {
 border: 1px solid #c2c2c2;
}
#i-am-landing-page .spotlight-card .card-img {
height: 360px !important;
}
.spotlight-card .card {
height: calc(100% + 25px);
}
.spotlight-card a {
text-decoration: none !important;
}
#i-am-landing-page .cards-wrapper.thirds .card .card-img,
#i-am-landing-stories-page .cards-wrapper.thirds .card .card-img {
height: 360px !important;
}
#i-am-landing-page .cards-wrapper.quarters .card .card-img,
#i-am-landing-stories-page .cards-wrapper.quarters .card .card-img {
height: 260px !important;
}
.card-vid-embed-wrapper .card-img {
height: 600px;
background-size: 100px, cover;
background-repeat: no-repeat;
}
.stories-slider-container .slick-slide a {
padding: 12.5px 8px !important;
}

@media screen and (max-width: 991px) {
  #i-am-landing-stories-page .cards-wrapper a, #i-am-landing-stories-page .cards-wrapper.thirds a {
    width: calc(100%) !important;
  }
}

#i-am-landing-stories-page .stories-slider-container .card-img{
  	background-position: left bottom, center;
  }