/* HERO - MAIN */

.hero {
    height: 65vh; 
    position: relative; 
    align-items: center; 
    box-sizing: border-box; 
    padding-top: 10vh; 
    box-shadow: inset 0 0 20px 10px rgba(0,0,0,0.7);
}

.hero-confetti {
    position: absolute; 
    opacity: 0.4;
}

.home-box {
    padding: 40px; 
    margin-left: 15vw; 
    background: rgba(255,255,255,1); 
    max-width: 38vw; 
    
    position: relative; 
    box-sizing: border-box;
}

.hero-border {
    position: absolute; 
    top: -10px; 
    right: -10px; 
    bottom: -10px; 
    left: -10px; 
    
    border: 3px solid rgba(255,255,255,0.2); 
    box-shadow: 20px 20px 20px 0 rgba(0,0,0,0.5); 
    pointer-events: none;
}

/* BOOKS */

.home-book {
    position: absolute;
    bottom: 0;
    background-size: 100% 100%;
    pointer-events: none; width:240px;
    box-shadow: -5px 10px 10px 5px rgba(0,0,0,0.5);
}

.home-book--left {
    top: 125px; 
    right: 500px;  
    background-image: url(img/lb-book-effect-portrait.png), 
        url(img/yearly/green-swish.png);   
    height: 320px; 
    transform: rotate(-15deg); 
    transform-origin: 50% 50%;
}

.home-book--centre {
    top: 115px;
    right: 350px;  
    background-image: url(img/lb-book-effect-portrait.png), 
        url(img/yearly/varsity.png);  
    width: 260px; 
    height: 340px;  
    transform-origin: 50% 50%; 
}

.home-book--right {
    top: 125px; 
    right: 200px;  
    background-image: url(img/lb-book-effect-portrait.png), 
        url(img/yearly/stationery.png);  
    width: 240px; 
    height: 320px;  
    transform: rotate(15deg); 
    transform-origin: 50% 50%; 
}