#background {
    min-height:600px;
    height:100%;
    width:100%;
    background-color:#FAFAFA;
    background-image:url('background.webp');
    background-size:auto 100%;
    background-position:center;
    background-repeat:no-repeat;
    overflow:hidden;
    animation: scaleIn 3s;
}


#background::after {
    content:"";
    border-bottom: 100vh solid rgba(230,98,0,0.8);
    border-left: 10vw solid transparent;
    border-right: 0px solid transparent;
    right:45%;
    top:0;
    position:absolute;
    transition: right 1s;
}

#background-texture {
    width:45%;
    height:100%;
    position:absolute;
    right:0;
    transition: all 1s;
    background: linear-gradient(90deg, rgba(230,98,0,0.8) 0%, rgba(234,119,30,1) 10%, rgba(234,119,30,1) 70%, rgba(230,104,8,1) 90%);
}

#background-texture::after {
    content:"";
    height:100%;
    width:100%;
    position:absolute;
    background-size: 500px;
    background-position:bottom 20px right -160px;
    background-image: url('texture.png');
    background-repeat: no-repeat;
}

#students-image {
    width:100%;
    height:500px;
    background-size:auto 500px;
    background-repeat:no-repeat;
    background-position:bottom -90px center;
    background-image: url('students.webp');
    animation: slideUp 1.5s;
    margin-bottom:15px;
    bottom:0;
}

#tagline {
    color:#003777;
}

@media screen and (max-width: 1024px) {
    #background-texture {
        width:100%;
        opacity:0.85;
    }

    #background::after {
        right:100%;
    }

    #students-image {
        background-size:calc(100% - 50px);
        background-position:bottom 50px center;
    }
    #tagline {
        color:white;
    }
}


/* html,body {
    background: rgb(237,134,56);
    background: linear-gradient(90deg, rgba(237,134,56,1) 50%, rgba(230,98,0,1) 100%);
}

main {
    position:relative;
    overflow:hidden;
    background-color:#FCFBFC;
    background-size:auto 100%;
    background-position:center;
    background-repeat:no-repeat;
    background-image:url('background.webp');
    display:flex;
    justify-content: end;
    min-width:500px;
}

#content {
    min-height: calc(100vh - 80px);
    width: 45vw;
    padding-top:130px;
    position:relative;
    background: url('texture.png') no-repeat bottom -80px right -260px, linear-gradient(90deg, rgba(230,98,0,0.7) 0%, rgba(234,119,30,1) 60%, rgba(234,119,30,1) 70%, rgba(230,104,8,1) 90%);
    padding-bottom:350px;
}

#content::before {
    content:"";
    border-bottom: 200vh solid rgba(230,98,0,0.7);
    border-left: 26vw solid transparent;
    border-right: 0px solid transparent;
    left:calc(-26vw + .2px);
    top:0;
    position:absolute;
}

#content::after {
    content:"";
    position:absolute;
    left:calc(-5vw);
    height:100vh;
    width:5vw;
    top:0;
}

footer {
    height:70px;
    background: rgb(237,134,56);
    background: linear-gradient(90deg, rgba(237,134,56,1) 50%, rgba(230,98,0,1) 100%);
}

.logos img {
    height: 35px;
}

#bottom-section {
    position:absolute;
    bottom:0;
    background-size:auto 500px;
    background-repeat:no-repeat;
    background-position:bottom -150px center;
    background-image: url('students.webp');
    width:100%;
    height:350px;
}

#social {
    position:absolute;
    bottom:0;
    right:0;
}

.social-icon {
    color: rgba(230,98,0,1);
    background-color:white;
    transition: box-shadow 0.5s;
}
.social-icon:hover, .social-icon:focus {
    color: rgba(230,98,0,1);
    background-color:white;
    box-shadow: 0px 0px 20px white;
}


#subtitle {
    position:absolute;
    left:0;
    top:150px;
    color:#003777;
    width:50vw;
}


@media screen and (max-width: 1024px) {
    main {
        min-width:0;
        display:block;
        background-size:cover;
        background-position:center;
    }
    main::before {
        content:none;
    }
    #content {
        position:relative;
        width: 100%;
        background: url('texture.png') no-repeat bottom -80px right -260px, linear-gradient(90deg, rgba(230,98,0,0.8) 0%, rgba(234,119,30,1) 75%, rgba(230,104,8,1) 90%);
    }
    .logos img {
        height: 25px;
    }
    #subtitle {
        top:auto;
        bottom:180px;
        width:100%;
        text-align:center;
        color:white;
    }
    #bottom-section {
        position:absolute;
        bottom:0;
        background-size:calc(100% - 28vw);
        background-position:bottom center;
    }
} */