.homepage-hero-slideshow{ --bg-overlay-color: var(--true-black); --callout-bg-color: var(--true-black); --aside-color-1: 97,190,110; --aside-color-2: var(--purple); --aside-color-3: var(--blue-green);
}
body.front #homepage-hero-slideshow figure.video figcaption .figure-inner{ position: absolute; max-width:none; width: 100vw;
}
figure.video figcaption .figure-inner video { position: absolute; top: 0; left: 0; width: 100vw; vertical-align: middle; display: block; height: 65vh; min-height: 28rem; -o-object-fit: cover; object-fit: cover;
}
body.front #homepage-hero-slideshow figure.video figcaption .figure-inner .section-inset{ display: block; position: relative; height: 100%;
}
body.front #homepage-hero-slideshow .view-content .views-row.views-row-first{ overflow: hidden;
}
.overlay.custom-overlay{ background-image: linear-gradient(120deg, rgba(var(--bg-overlay-color),0.2), rgba(var(--bg-overlay-color),0.6)); width: 100vw;
}
body.front #homepage-hero-slideshow figure.focus-right .hero-slide-image img { -o-object-position: 100%; object-position: 100%;
} /* Custom Grid Layout Alterations */ body.front #homepage-hero-slideshow .view-content{ height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow .view-content .views-row{ height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow figure .hero-slide-image img{ height: 41vh; min-height: 20rem; } body.front #homepage-hero-slideshow figure figcaption .figure-inner{ max-width: 100%; width: 100vw !important; } .similar-articles{ bottom: -60%; display: flex; flex-direction: column; position: absolute; height: 60%; right: 0; width: 100%; } .similar-articles .article-aside{ display: flex; position: relative; height: 33.33%; overflow: hidden; width: 100%; border-top: 1px solid #D1D3D5; background-image: linear-gradient(to right, #fafafa, #f1f3f5); -webkit-transition: background-color 300ms ease; -moz-transition: background-color 300ms ease; -ms-transition: background-color 300ms ease; -o-transition: background-color 300ms ease; transition: background-color 300ms ease; } .similar-articles .article-aside .article-overlay{ display: block; height: 100%; width: 100%; z-index: 1; background-color: transparent; -webkit-transition: height 300ms ease, background-color 300ms ease; -moz-transition: height 300ms ease, background-color 300ms ease; -ms-transition: height 300ms ease, background-color 300ms ease; -o-transition: height 300ms ease, background-color 300ms ease; transition: height 300ms ease, background-color 300ms ease; } .similar-articles .article-aside img{ max-width: 3.25rem; } /* Article Content and Image Positioning */ .similar-articles .article-content { align-self: center; display: flex; position: absolute; width: 100%; z-index: 2; position: absolute; } .similar-articles .article-content div{ -webkit-transition: opacity 220ms ease, color 300ms ease; -moz-transition: opacity 220ms ease, color 300ms ease; -ms-transition: opacity 220ms ease, color 300ms ease; -o-transition: opacity 220ms ease, color 300ms ease; transition: opacity 220ms ease, color 300ms ease; } .similar-articles .article-content .content-reveal{ display: none; } /* Hover and Focus Effects */ .similar-articles .article-aside:nth-of-type(1):hover .article-overlay, .similar-articles .article-aside:nth-of-type(1):focus .article-overlay{ background-color:rgba(var(--aside-color-1),1); } .similar-articles .article-aside:nth-of-type(2):hover .article-overlay, .similar-articles .article-aside:nth-of-type(2):focus .article-overlay{ background-color:rgba(var(--aside-color-2),1); } .similar-articles .article-aside:nth-of-type(3):hover .article-overlay, .similar-articles .article-aside:nth-of-type(3):focus .article-overlay{ background-color:rgba(var(--aside-color-3),1); } .similar-articles .article-aside:hover span, .similar-articles .article-aside:focus span, .similar-articles .article-aside:hover p, .similar-articles .article-aside:focus p{ color: #ffffff; } /* Hero Callout Alterations */ body.front #homepage-hero-slideshow .hero-huge-callout{ top: 50% !important; width: 100%; height: 100%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } body.front #homepage-hero-slideshow .callout-container{ margin: 0 auto; max-width: 31rem; position: relative; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } @-webkit-keyframes animDown{ from { -webkit-transform: translate3d(0,-1rem,0); opacity: 0; transform: translate3d(0,-1rem,0); opacity: 0;} } @keyframes animDown{ from { -webkit-transform: translate3d(0,-1rem,0); transform: translate3d(0,-1rem,0); opacity: 0;} } @-webkit-keyframes animRight{ from { -webkit-transform: translate3d(1rem,0,0); opacity: 0; transform: translate3d(1rem,0,0); opacity: 0;} } @keyframes animRight{ from { -webkit-transform: translate3d(1rem,0,0); transform: translate3d(1rem,0,0); opacity: 0;} } @-webkit-keyframes animLeft{ from { -webkit-transform: translate3d(-2rem,0,0); opacity: 0; transform: translate3d(-2rem,0,0); opacity: 0;} } @keyframes animLeft{ from { -webkit-transform: translate3d(-2rem,0,0); transform: translate3d(-2rem,0,0); opacity: 0;} } /* Media Queries - Responsive Behavior */ @media screen and (min-width: 30em){ div.hero-huge-callout div.font-size-xxl{ font-size: 2.75rem; } body.front #homepage-hero-slideshow .view-content{ height: 52vh; min-height: 32rem; } body.front #homepage-hero-slideshow .view-content .views-row{ height: 52vh; min-height: 32rem; } body.front #homepage-hero-slideshow figure .hero-slide-image img{ min-height: 25rem; } body.front #homepage-hero-slideshow .similar-articles{ width: 100%; height: 30%; bottom: -30%; flex-direction: row; } .similar-articles .article-aside{ width: 33.33%; height: 100%; border-left: 1px solid #D1D3D5; } .similar-articles .article-aside:nth-of-type(1){ border-left: none; } } @media screen and (min-width: 54em){ figure.video figcaption .figure-inner video { position: absolute; height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow .callout-container{ margin: 0; max-width: none; background-image: radial-gradient(rgba(var(--callout-bg-color),0.5),rgba(var(--callout-bg-color),0.3),rgba(var(--callout-bg-color),0),rgba(var(--callout-bg-color),0)); } body.front #homepage-hero-slideshow div.ctas a{ padding: 1.2rem 1.6rem; } .overlay.custom-overlay{ background-image: none; } .similar-articles .article-overlay:nth-of-type(1), .similar-articles .article-overlay:nth-of-type(2), .similar-articles .article-overlay:nth-of-type(3) { background-color: none; } body.front #homepage-hero-slideshow figure .hero-slide-image img{ height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow .view-content{ height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow .view-content .views-row{ height: 65vh; min-height: 32rem; } body.front #homepage-hero-slideshow .callout-container{ width: 51rem; padding: 10rem; left:-10rem; } body.front #homepage-hero-slideshow .similar-articles{ width: 16rem; height: 100%; padding: 3rem 0 5rem 0; margin-right: 5vw; flex-direction: column; bottom: 0; align-items: stretch; justify-content: space-around; } .similar-articles .article-aside{ width: 100%; height: 20%; min-height: 7rem; border-radius: 5px; border: 0; box-shadow: 0 0 4px rgba(218,85,48,.15); } .similar-articles .article-aside img{ max-width: 5rem; position: relative; right: 5px; } .similar-articles .article-content { justify-content: flex-start; } .similar-articles .article-content div{ top: 0.25rem; position: relative; } .similar-articles .article-aside .article-overlay{ height: 10%; } .similar-articles .article-aside:hover .article-overlay, .similar-articles .article-aside:focus .article-overlay{ height: 100%; } .similar-articles .article-aside:nth-of-type(1) .article-overlay{ background-image:linear-gradient(45deg, rgba(var(--aside-color-1),1), rgba(var(--aside-color-1),1)); } .similar-articles .article-aside:nth-of-type(2) .article-overlay{ background-image:linear-gradient(45deg, rgba(var(--aside-color-2),1), rgba(var(--aside-color-2),1)); } .similar-articles .article-aside:nth-of-type(3) .article-overlay{ background-image:linear-gradient(45deg, rgba(var(--aside-color-3),1), rgba(var(--aside-color-3),1)); } .similar-articles .article-aside:hover .article-content div, .similar-articles .article-aside:focus .article-content div{ opacity: 0; } .similar-articles .article-aside .article-content .content-reveal{ text-align: center; width: 100%; left: 0; } .similar-articles .article-aside:hover .article-content .content-reveal, .similar-articles .article-aside:focus .article-content .content-reveal{ align-self: center; display: flex; position: absolute; max-width: 27rem; animation: animDown 0.5s cubic-bezier(0.25,0.1,0.25,1) both; -webkit-animation: animDown 0.5s cubic-bezier(0.25,0.1,0.25,1) both; } #homepage-hero-slideshow .similar-articles a.article-aside, #homepage-hero-slideshow .similar-articles p{ animation: animRight 1s cubic-bezier(0.25,0.1,0.25,1) both; -webkit-animation: animRight 1s cubic-bezier(0.25,0.1,0.25,1) both; } #homepage-hero-slideshow .similar-articles a.article-aside:nth-of-type(1), #homepage-hero-slideshow .similar-articles p{ -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } #homepage-hero-slideshow .similar-articles a.article-aside:nth-of-type(2){ -webkit-animation-delay: 1.75s; animation-delay: 1.75s; } #homepage-hero-slideshow .similar-articles a.article-aside:nth-of-type(3){ -webkit-animation-delay: 2s; animation-delay: 2s; } @media screen and (min-height: 62em){ body.front #homepage-hero-slideshow .similar-articles{ padding: 7rem 0 9rem 0; } } @media screen and (min-height: 72em){ body.front #homepage-hero-slideshow .similar-articles{ padding: 10rem 0 12rem 0; } } } @media screen and (min-width: 68em){ div.hero-huge-callout div.font-size-xxl{ font-size: 3.25rem; } body.front #homepage-hero-slideshow .cta.font-size-sm{ font-size: 1rem; } } @media screen and (min-width: 72em){ body.front #homepage-hero-slideshow .similar-articles{ margin-right: 8vw; width: 18rem; } } @media screen and (min-width: 85.5em){ body.front #homepage-hero-slideshow .similar-articles{ margin-right: calc((100vw - 72rem) / 2); } } @media screen and (min-width: 90em){ body.front #homepage-hero-slideshow .img-container{ width: 33vw; } div.hero-huge-callout div.font-size-xxl{ font-size: 3.5rem; } body.front #homepage-hero-slideshow .similar-articles{ width: 20rem; } }
var heroVideoWrapper = document.querySelector ("#hero-video-wrapper");
if (heroVideoWrapper) { var v = document.createElement ("video"); v.setAttribute ("width", "100%"); v.setAttribute ("height", "auto"); v.setAttribute ("preload", "auto"); v.setAttribute ("autoplay", "autoplay"); v.setAttribute ("playsinline", ""); v.setAttribute ("id", "hero-video"); v.loop = true; v.muted = true; v.setAttribute ("poster", "/sites/default/files/public/img/home/01-hero/digipen-campus-aerial-footage.webp"); var s = document.createElement ("source"); s.setAttribute ("src", "/sites/default/files/public/img/home/01-hero/digipen-campus-aerial-footage.mp4"); s.setAttribute ("type", "video/mp4"); v.appendChild (s); heroVideoWrapper.appendChild (v); window.setTimeout( function() { v.play ();}, "100");
}
New on Campus
Alumni
Alex Williams Takes the Reins as Studio Wildcard CTO
DigiPen alum Alex Williams talks about his new role as chief technology officer at Studio Wildcard, makers of the dinosaur-infused ARK: Survival Ascended.
Alumni
Rendering Aid: How DigiPen Alum Eduardo Righi Chaves is Taking Adobe into 3D
As a lead computer graphics engineer, Chaves is pushing Adobe Creative Suite’s growing list of 3D capabilities into the future.
Ranked Top 50
Ranked as one of the Top 50 Creative Schools in the Rookies Global School Rankings for 2023.
514 Selections
Student films from DigiPen's three global campuses have earned 514 awards and festival selections.
2,000+ Games
DigiPen alumni have helped ship more than 2,000 commercial game titles, including some of the most popular video games of all time.
313 Awards
Students from DigiPen's three global campuses have won 313 awards for game projects and academic papers.
Do What You Love. Love What You Do.
We prepare students for a wide range of careers — doing the kind of work that challenges the mind and excites the imagination. Check out some examples of what our alumni have gone on to do after DigiPen.
Alumni Success