* {
    box-sizing:border-box;
}

:root {
    --rgb-navyblue:#011751;
    --rgb-powderblue:#2569f8;
}


html {
   font-size:.53vw;
}

@media only screen and (min-width: 1081px) {

.ss-hero {
    box-sizing:border-box;
    display:block;
    padding:0;
    background-color:white;
    height:100rem;
}


.carousel {
    position:relative;
    top:0rem;
    left:0rem;
    width:100%;
    background-color: #ddd;
    background-image:url(../img/main-campus-quad.jpg);
    background-size:cover;
    height:90rem;
    overflow:hidden;
    transition:all .5s;
}

.carousel-img {
    display:inline-block;
    position:absolute;
    top:0rem;
    left:0rem;
    width:100vw;
    height:90rem;
    background-color: #pink;
    background-image:url(../img/main-campus-quad.jpg);
    background-size:cover;
    display:none;
}

.carousel-img-1, .carousel-img-4, { background-image:url(../img/home-hero-ijam.jpg); }
.carousel-img-2 { background-image:url(../img/home-hero-45th.jpg); left:1920px;}
.carousel-img-3 { background-image:url(../img/home-hero-xmas.jpg); left:3840px;}




.cta-dark {
    box-sizing:border-box;
    position:absolute;
    top:35.5rem;
    left:9.8vw;
    z-index:10;
    width:74rem;
    height:auto;
   padding:0 3.5rem 4rem 3.5rem;
   color:white;
}

.cta-dark .bg {
    position:absolute;
    background-color:#011751;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1;
    opacity:0.7;
}

.cta-dark h2 {
    position:relative;
    font-family:"DM Serif Display", serif;
    font-weight:300;
    font-size:5.2rem;
    color:white;
    z-index:10;
}
.cta-dark h4 {
    position:relative;
    margin-top:-2rem;
    font-family:"Raleway", sans-serif;
    font-weight:400;
    font-size:3.2rem;
    color:white;
    z-index:12;
}

.cta-dark .cta-btn {
   display:inline-block;
   position:relative;
   background-color:#5e85fa;
   color:white;
   font-family:"Raleway", sans-serif;
   font-size:1.9rem;
   padding:1.5rem;
   z-index:1000;
   cursor:pointer;
}


.ss-feature {
    box-sizing:border-box;
    display:block;
    padding-top:5rem;
    background-color:white;
    height:85rem;
    margin:0;
}

.ss-feature h2 {
    font-family:"DM Serif Display", serif;
    font-weight:600;
    font-size:4rem;
    color:#011751;
    text-align:center;
    vertical-align:top;
    text-transform:uppercase;
    font-stretch:semi-condensed;
}

.ss-feature h2 span{
    color:#999;
}

.ss-feature h4 {
    font-family:"Open Sans", sans-serif;
    font-weight:600;
    font-size:2.4rem;
    color:#011751;
    text-align:center;
    width:90rem;
    margin:auto;
}


.ss-feature h1 {
    font-family:"DM Serif Display", serif;
    font-size:3.5rem;
    color:#011751;
    color:white;
    margin-bottom:0;
    width:49rem;
}


.ss-feature h3 {
    font-family:"Open Sans", sans-serif;
    font-weight:bold;
    font-size:2rem;
    color:white;
    width:49rem;
    margin-bottom:0rem;
}

.ss-feature h5 {
    font-family:"Open Sans", sans-serif;
    font-weight:600;
    font-size:2.2rem;
    color:white;
    width:49rem;
    height:14rem;
    white-space: pre-line;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ss-feature span {
    display:none;
    font-size:2.2rem;
}

.ss-feature .top-dots {
    position:absolute;
    top:127.5rem;
    left:104rem;
    width:53rem;
    height:4rem;
    background:url(../img/blue-dot.png);
    z-index:10;
}

.ss-feature .photo {
    position:absolute;
    top:137rem;
    left:34rem;
    width:66.5rem;
    height:38rem;
    background:url(../img/repeat-gray.png);
    background-size:100%;
    background-size:cover;
    z-index:29;
}


.ss-feature .text-card {
    box-sizing:border-box;
    position:absolute;
    top:131rem;
    left:78rem;
    width:80rem;
    height:38.5rem;
    background-color:#011751;
    padding:2rem 2rem 2rem 26rem;
    z-index:20;
}

.ss-feature .bot-dots {
    position:absolute;
    top:166rem;
    left:102rem;
    width:8rem;
    height:7rem;
    background:url(../img/blue-dot.png);
    z-index:10;
}

.ss-admissions {
    box-sizing:border-box;
    display:block;
    padding:0 0 5rem 9.8vw;
    background-color:#011751;
    width:100%;
    height:70rem;
    margin:0;
}


.ss-admissions .text-card {
    width:70rem;
    position:absolute;
    top:185rem;
    left:9.8vw;
}

.ss-admissions h2 {
    font-family:"Raleway", sans-serif;
    font-weight:600;
    font-size:4.5rem;
    color:#5f85fb;
    text-transform:uppercase;
    width:100%;
    margin-top:10rem;
}

.ss-admissions h2 b{
    font-size:5.8rem;
    font-weight:500;
}


.ss-admissions h4 {
    font-family:"Open Sans", sans-serif;
    font-size:2.5rem;
    color:white;
    width:100%;
    margin-bottom:6rem;
}

.ss-admissions span {
    font-weight:bold;
}


.ss-admissions .admissions-btn {
   box-sizing:border-box;
   display:inline-block;
   position:relative;
   background-color:#5e85fa;
   color:white;
   width:24rem;
   height:5rem;
   font-family:"Raleway", sans-serif;
   font-size:2.1rem;
   padding:1.1rem;
   z-index:1;
   cursor:pointer;
   text-align:center;
}

.ss-admissions .contact-btn {
    background:none;
    border:.3rem solid #5e85fa;
    color:#5e85fa;
    margin-left:1rem;
    
}


.ss-admissions .photo{
    position:absolute;
    top:185rem;
    right:0;
    width:90rem;
    height:70rem;
    background-color:black;
    background:url(../img/hp-admissions-photo.jpg);
    background-size:cover;
}

.ss-stories{
    box-sizing:border-box;
    display:block;
    padding:0 9.8vw 5rem 9.8vw;
    background-color:white;
    width:100%;
    height:70rem;
    margin:0;
    float:left;
}

.ss-stories .cta-box {
    display:block;
    text-align:center;
    width:100%;
    height:6rem;
    margin:10rem 0 5rem 0;
}


.ss-stories .stories-btn {
   box-sizing:border-box;
   display:inline-block;
   position:relative;
   background-color:#2569f8;
   color:white;
   width:32rem;
   height:5.5rem;
   font-family:"Raleway", sans-serif;
   font-size:2.4rem;
   font-weight:bold;
   padding:1.2rem;
   z-index:1;
   cursor:pointer;
   text-align:center;
}

.ss-stories .events-btn {
    background:none;
    margin-left:1rem;
    color:#2569f8;
    border:.3rem solid #2569f8;
}


.ss-stories .story-deck {
    display:block;
    width:100%;
    text-align:center;
}

.ss-stories .story-card {
    width:24.4vw;
    height:17.42vw;
    display:inline-block;
    overflow:hidden;
    text-align:center;
    margin-right:2rem;
    position:relative;
}

.ss-stories .story-card-3 { margin-right:0;}

.ss-stories .story-card .photo {
    width:100%;
    height:17.42vw;
    background-color:grey;
    background-size:cover;
}

.ss-stories .story-card .caption {
    box-sizing:border-box;
    font-family:"Raleway", sans-serif;
    font-weight:600;
    font-size:2.1rem;
    color:white;
    margin-top:1rem;
    text-align:center;
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    background-color: rgba(35, 35, 35, 0.5);
    padding:.5rem;
}


.ss-admissions .contact-btn:hover {
    border:.3rem solid white;
}

.ss-stories .stories-btn:hover:before {
    background-color:#011751;
}

.ss-stories .events-btn:hover:before {
    background-color:#011751;
}

.ss-stories .stories-btn:hover {
    color:white;
}

.ss-stories .events-btn:hover {
    border:.3rem solid #011751;
    color:white;
}

.info-links a {
    position:relative;
}


} /* Media Query */

.powder-blue {
    color:var(--rgb-powderblue);
}

.light-gray {
    color:lightgray;
}

.sans {
    font-family:Raleway;
}

.status-btn {
    width:100%;
    height:100%;
    background:#28adff;
    color:black;
    font-family:"Open Sans";
    font-size:1.8rem;
    font-weight:bold;
    text-align:center;
    padding-top:.2rem;
    cursor:pointer;
    transition:all .2s;
}

.status-btn:hover {
    background:white;
    
}

.debug {transition:all .2s;}