﻿
/* iPad Portrait Wide (768px exactly)*/
@media screen and (width: 48rem) {
    #st-peters-logo {
        margin-top: 4rem;
    }
}



/*  Up to 987 px*/
@media screen and (max-width: 61.6875rem) {
    #home-header #home-menu .navigation li.crest-pedestal {
        display: none;
    }

    #st-peters-logo {
        margin-top: 4rem;
    }

        #st-peters-logo.today-active {
            margin-top: 4rem;
            top: -3.59rem;
        }

            #st-peters-logo.today-active img {
                height: 2.8rem !important;
            }


    #home-header {
        top: 3.5rem !important;
    }

    .st-peters-logo .st-peters-slogan {
        top: calc(100vh - 18rem) !important;
    }
}

/* Skinny Tablet Min 1024 wide max 682px high*/
@media screen and (min-width: 59.625rem) and (max-height: 41.875rem) {

    /* hide the high level menu even if the slider item is active */
    #home-menu .navigation li.hover-dropdown.slider-select div.dropdown-menu {
        height: 0;
        opacity: 0;
        transition: opacity 0.3s, height 0s 0.3s;
        overflow: hidden;
    }

    #st-peters-logo.today-active {
        margin-top: 0;
    }

    #header {
        height: 0rem;
    }

    #home-header {
        top: 0rem !important;
    }

        #home-header.today-active #home-menu .navigation li.crest-pedestal {
            width: 3.5rem;
        }

    #st-peters-logo {
        top: 5rem;
    }

    #header.today-active {
        height: 0rem;
        border-bottom: none;
    }

    #st-peters-logo.today-active {
        top: 0.4rem;
    }

        #st-peters-logo.today-active img {
            height: 2.8rem !important;
        }

    #home-header.today-active {
        top: 0rem !important;
    }

    #home-header.prefade {
        background: #253175;
    }

    .st-peters-today.today-active {
        margin-top: 3.5rem !important;
    }

    div.st-peters-logo {
        margin-top: 3rem;
    }

    .st-peters-logo .st-peters-slogan {
        top: calc(100vh - 20rem) !important;
    }

    #page-content, .st-peters-bg {
        height: calc(100vh - 7rem);
    }

    #home-menu li.underline {
        height: 0 !important;
        visibility: hidden !important;
    }

    #home-menu .navigation li.hover-dropdown.mousedover div.dropdown-menu {
        height: 0;
        opacity: 0;
        transition: opacity 0.3s, height 0s 0.3s;
        overflow: hidden;
    }

    #home-menu .navigation.drawer-open li.underline {
        height: 3.5rem !important;
        visibility: visible !important;
    }

    #home-menu .navigation.drawer-open li.hover-dropdown.slider-select.drawer-open div.dropdown-menu {
        height: 3.5rem !important;
        opacity: 1;
        transition: opacity 0.3s, height 0s 0.3s;
        overflow: visible;
    }

    #home-header.today-active #home-menu .navigation li.crest-pedestal {
        display: inline-block;
    }
}

@media screen and (max-height: 48rem) {

    #st-peters-logo.start-centred {
        top: 17%;
    }

        #st-peters-logo.start-centred h2 {
            /* was 2, 1.25, 0.625*/
            font-size: 1.6rem !important;
        }

        #st-peters-logo.start-centred h3 {
            /* was 1.6, 1.25, 0.625*/
            font-size: 1.3rem !important;
            margin-top: 0.625rem;
        }

        #st-peters-logo.start-centred img {
            height: 7rem !important;
        }
}
