/* below are general styles that change throughout each page to be more responsive across various devices and browsers */

@media (orientation: portrait) {
    main {
        padding: 10% 10%;
        margin: 0%;
    }

    header {
        min-height: 30vh;
    }

    /* docPages */
    object {
        background-color: #FFFFFF;
        border: 3px solid #1C110A;
    }
}

@media (max-width: 700px) {
    nav ul li {
        padding: 2em 1em;
        font-size: smaller;
    }

    main ul {
        padding-top: 5%;
        padding-left: 10%;
    }
}

@media (max-width: 800px) {
    nav {
        top: 0;
        left: 0;
        width: 100%;
        position: fixed;
    }

    header h1 {
        padding-top: 10vh;
    }

    footer {
        display: block;
        text-align: center;
    }

    .footerContent {
        margin: 5% 0%;
    }

    .footerContent > * {
        margin: 1% 0%;
        padding: 0%;
    }

    .footerContent p:first-of-type{
        padding-bottom: 0%;
    }

    .footerContentSpacing {
        margin-top: 3%;
    }

    footer div ul {
        margin-left: 0%;
    }

    footer div ul li {
        margin: 1% 0%;
    }

    /* index.html */
    #mapOfCommunity img {
        padding: 0% 5%;
    }

    /* docPages */
    p.backToDocs {
        margin-bottom: 5%;
    }
    
    object {
        margin: 7% 0%;
    }
}

@media (max-width: 1200px) {
    header {
        min-height: 40vh;
    }
}

@media (min-width: 1400px) {
    main, footer {
        font-size: 1.3em;
    }

    header {
        min-height: 50vh;
    }
}