@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i');

body,
html {
    height: 100%;
    margin: 0;
    font-family: 'PT Sans', 'Calibri', sans-serif;
    font-size: 16px;

    overflow: hidden;
}

#logo-header {
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(0, 0, 0, .6) 10%, rgba(0, 0, 0, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

header {
    background-color: #fff;
    height: 4.5em;
}

.lauLogo {
    display: block;
    float: left;
    width: 180px;
    padding-top: 1em
}

.lauLogo img {
    width: 100%;
    height: auto
}


header .wrap,
main {
    width: 975px;
    margin: 0 auto
}

main {
    display: block;
    margin-top: 210px;
    margin-bottom: 0
}

body {
    margin: 0;
    padding: 0;
    color: #3a3e42;
    background-image: url(commencement-banner1-2025.jpg);
    background-repeat: no-repeat;
    background-color: #1a1e2a;
    background-position: 50% 0;
    background-size: 100% auto;
}

iframe {
    margin: 0 auto;
    margin-top: 8rem !important;
    display: block;
}

@media only screen and (min-width:1600px) {
    body {
        background-size: 1600px auto
    }
}

@media only screen and (max-width:1080px) {

    header .wrap,
    main {
        width: 92%
    }
}

@media only screen and (max-width:720px) {
    header {
        height: 6.5em;
    }

    body {
        background-position: 50% 6.5em
    }

}

@media only screen and (max-width:440px) {

    .lauLogo {

        width: 160px;

    }

    main {
        margin-top: 140px
    }
}

@media only screen and (max-width:360px) {
    .lauLogo {
        width: 120px
    }

    body {
        background-position: 50% 5.5em
    }

    header {
        height: 5.5em
    }
}