﻿/* Generic page styles */
.v2-page-container {
    max-width: 1170px;
    margin: 35px auto;
}

    /* Typography */
    .v2-page-container p {
        font: normal 14px 'Open Sans', sans-serif;
        margin: 0 0 16px 0;
    }

    .v2-page-container .page-body a {
        color: #4e2672;
        font-size: 14px;
    }

    .v2-page-container h2,
    .v2-page-container h3 {
        font: bold 21px 'Open Sans', sans-serif;
        margin-bottom: 10px;
    }

    .v2-page-container h4 {
        font: bold 18px 'Open Sans', sans-serif;
        margin: 0 0 4px 0;
    }

    .v2-page-container h5 {
        font: bold 14px 'Open Sans', sans-serif;
        margin: 0 0 2px 0;
    }

    /* Lists */
    .v2-page-container ul,
    .v2-page-container ol {
        margin: 0 0 16px;
    }

    /* Images */
    .v2-page-container .mobile-image {
        display: none;
    }

/* Content */
.v2-page-content {
    display: block;
    float: left;
    width: 835px;
    margin-right: 35px;
}

    .v2-page-content.full-width {
        width: 100%;
    }

    .v2-page-content .page-main {
        margin-bottom: 45px;
    }

    /* Breadcrumb */
    .v2-page-content .v2-breadcrumb ul {
        margin: 0 0 10px;
    }

    /* Secondary nav */
    .v2-page-content .sec-nav {
        font-size: 14px;
        margin-bottom: 15px;
        padding: 0;
    }

    /* Main image */
    .v2-page-content .main-image {
        margin-bottom: 35px;
    }

/* Sidebar */
.v2-page-sidebar {
    display: block;
    float: left;
    width: 300px;
}


/* ================================================== */
/*                    RESPONSIVE                      */
/* ================================================== */

/* Large Desktop */
@media (max-width: 1200px) {

    .v2-page-content {
        width: 72%;
        margin-right: 3%;
    }

        .v2-page-content .page-main {
            margin-right: 2%;
            margin-left: 2%;
        }

    .v2-page-sidebar {
        width: 23%;
        margin-right: 2%;
    }
}

/* Tablet */
@media (max-width: 768px) {

    .v2-page-container {
        margin: 25px auto;
    }

        .v2-page-container .mobile-image {
            display: block;
        }

        .v2-page-container .desktop-image {
            display: none;
        }

    .v2-page-content {
        width: 100%;
        margin-right: 0;
    }

        .v2-page-content .page-main {
            margin: 0 4% 30px 4%;
        }

        .v2-page-content .main-image {
            margin-bottom: 30px;
        }

    .v2-page-sidebar {
        width: 92%;
        margin-left: 4%;
        margin-right: 4%;
    }
}
