/* :::::::::::::::::::::::::::::::::::::::::::::::::::
	
	ORIGINAL RESPONSIVE CSS
	* 160over90 Agency *

	* Replace with fixed.css to create a
	  fixed width website using pixel values *
	
:::::::::::::::::::::::::::::::::::::::::::::::::::*/


#mobile-top-bar {
    padding-right: 10px;
    text-align: right;
}

    #mobile-top-bar li {
        background: url(/MasterPages/blue-divider.gif) no-repeat right center;
        display: inline;
        margin-right: 5px;
        padding-right: 10px;
    }

        #mobile-top-bar li a {
            font-weight: 600;
            text-decoration: none;
            text-transform: uppercase;
        }

            #mobile-top-bar li a:hover {
                color: #fff;
            }

#mobile-landing-img {
    margin: 0 auto;
}

#mobile-landing-nav {
    margin: 0;
}

    #mobile-landing-nav li a {
        background: #fff100;
        color: #204e91;
        display: block;
        font-size: 1.846em;
        font-weight: 600;
        margin-bottom: 2px;
        padding: 10px;
        text-decoration: none;
        text-transform: uppercase;
    }

#mobile-landing-social-media {
    height: 50px;
    margin: 20px 0;
    overflow: hidden;
}

    #mobile-landing-social-media li {
        float: left;
        margin: 0 5px;
    }

@media screen and (max-width:1023px) {
    .offset-left, .offset-right {
        margin: 10px 0;
    }

    .callout-headline {
        margin-bottom: 20px;
    }

    .flex-caption {
        background: #fff100;
        height: auto !important;
        padding: 20px !important;
    }

    #caption-box {
        display: none !important;
    }

    .flex-control-nav {
        bottom: 75px !important;
        right: 10px !important;
    }

    #interior-split-page-header {
        float: none;
        width: auto;
    }

    .full-page .right-wide-column {
        width: 100%;
        margin: 0;
    }
}

@media screen and (max-width:959px) {
    /* #expand-menu { display:none!important; } */
    #main-nav li {
        background: none;
        margin-right: 0px;
        padding-right: 6px;
    }

        #main-nav li a {
            font-size: 0.923em;
            margin: 0;
            padding: 0;
        }

    #container {
        padding: 0 10px;
    }

    #callout-nav li a {
        font-size: 0.923em;
        height: 35px;
        line-height: 3;
        width: 55px;
    }

    #search {
        top: 23px;
    }

        #search #search-bar {
            width: 155px;
        }

    #home-events2 {
        display: none;
    }
}

@media screen and (max-width:900px) {
    #interior-split-hero-image {
        clear: both;
        max-width: 100%;
        width: auto;
    }

    #home-events2 {
        display: none;
    }
}

@media screen and (max-width:880px) {
    #callout-nav li a {
        border-top-width: 2px;
    }

    #home-events2 {
        display: none;
    }
}

@media screen and (max-width:768px) {
    #footer {
        height: auto;
    }

        #footer li {
            background: none;
            display: block;
            text-align: center;
        }

        #footer #contact-info {
            float: none;
            padding-right: 0;
            width: auto;
        }

        #footer #social-media {
            text-align: center;
            float: none;
            border: 0;
            margin: 0 auto;
        }

    .lt-ie8 #footer #social-media a {
        display: inline-block;
        float: none;
    }

    #content-emergency {
        float: none;
        width: 100%;
    }

    #emergency-information-container {
        float: none;
        width: 100%;
    }

    ;
}

@media screen and (max-width:767px) {
    #header {
        height: auto;
        min-height: inherit;
    }

    #main-nav {
        display: none;
        text-align: left;
    }

        #main-nav li, #main-nav li a {
            display: block;
        }

        #main-nav li {
            border-top: 1px solid #fff;
        }

            #main-nav li a {
                padding: 5px;
            }

    #nav-control {
        display: inline-block;
    }

    #main-content {
        margin-left: 0;
    }

    .full-page #main-content {
        margin-top: 0;
    }

    .department-page #main-content {
        margin-top: 0;
    }

    #hero-image {
        margin: 0;
    }

    #featured-stories {
        display: none;
    }

    #home-news, #home-events, #home-social-media {
        float: none;
        margin-bottom: 40px;
        width: auto;
    }

    #home-events2 {
        display: none;
    }

    #main-slideshow {
        margin: 0 !important;
    }

    #secondary-nav {
        position: static;
        width: auto;
    }

    .left-column {
        float: none;
        width: auto;
    }

    .right-column {
        margin-left: 0;
        width: auto;
    }

    .left-wide-column {
        float: none;
        width: auto;
    }

    .right-wide-column {
        margin: 0;
        width: auto;
    }

    .right-sidebar {
        margin-left: 0;
    }

    .callout-facts, .callout-stats {
        display: none;
    }

    .link-column, .more-info.link-list, #landing-content .link-column, .left-column .link-column, .right-column .link-column {
        float: none;
        width: auto;
    }

    .link-category h3,
    .content-category h3 {
        float: none;
        width: auto;
    }

    .link-category .link-list {
        margin: 0;
    }

    #audience-nav, #edu-link, #callout-nav {
        display: none;
    }

    #search {
        display: none;
    }

    #featured-stories, #supporting-content {
        margin: 0 !important;
    }

    .flex-caption {
        background: #fff100;
        min-height: 55px !important;
        position: static !important;
        width: auto !important;
    }

    #caption-box {
        display: none !important;
    }

    .flex-control-nav {
        bottom: 0 !important;
    }
}

@media screen and (max-width:479px) {
    .bio-img {
        float: none;
    }

    .bio-copy {
        margin: 10px 0;
    }

    .full-page #secondary-nav {
        float: none;
        margin-right: 0;
        width: auto;
    }
}

@media screen and (max-width:320px) {
    #audience-nav li {
        background: none;
        margin: 0 10px 0 0;
        padding: 0;
    }
}



/* :::::::::::::::::::::::::::::::::::::::::::::::::::
	
	RESPONSIVE CSS MODIFICATIONS
	* UCLA Communicatons *
	
:::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (max-width:1059px) {
    .full-page #interior-split-container {
    }

    .full-page #interior-split-hero-image {
    }
}

@media screen and (max-width:1023px) {
    .full-page #interior-split-container {
    }

    .full-page #interior-split-hero-image {
        left: 215px;
        max-width: 685px;
        width: 100%;
    }

    body {
        -webkit-text-size-adjust: none;
    }

    .flex-caption {
        padding: 2% 2% 2.5% !important;
    }

    .flex-control-nav {
        bottom: 80px !important;
        right: 10px !important;
    }
}

@media screen and (max-width:996px) {
    .full-page #interior-split-container {
    }

    .full-page #interior-split-hero-image {
        left: 215px;
        width: 100%;
    }

    #footer-nav {
        margin-left: 20px !important;
    }
}

@media screen and (max-width:974px) {
    #featured-stories {
        display: none;
    }

        #featured-stories .carousel-nav {
            display: none;
        }

    #featured-stories-mobile {
        display: block;
        position: relative;
        height: auto;
        overflow: auto;
    }

        #featured-stories-mobile h3 {
            border-bottom: 1px solid #E4E4E4;
            padding-bottom: 5px;
        }

        #featured-stories-mobile .viewport {
            overflow: hidden;
        }

        #featured-stories-mobile .overview li {
            width: 45%;
            float: left;
            padding-right: 5%;
        }

        #featured-stories-mobile .story {
            color: #333333;
        }

            #featured-stories-mobile .story h4 {
                margin-bottom: 5px;
            }

        #featured-stories-mobile .photo {
            width: 45%;
            float: left;
        }

        #featured-stories-mobile img {
            margin-bottom: 45px;
        }

        #featured-stories-mobile .text {
            margin-left: 51%;
        }
}

@media screen and (max-width:959px) {
    .full-page #interior-split-container {
    }

    .full-page #interior-split-hero-image {
        max-width: 664px;
        width: 70%;
    }

    #top-bar-nav {
        margin: 0 15% 0 0;
    }

    .lt-ie8 #top-bar-nav {
        margin: 0 14.5% 0 0;
    }

    #callout-nav {
        font-size: 0.923em;
        height: 33px;
        width: 113px;
    }

        #callout-nav li a {
            font-size: 0.98em;
            height: auto;
            line-height: 3;
            width: 55px;
        }

    #main-nav li {
        background: url(/MasterPages/lai/img/white-divider.gif) no-repeat left center;
        margin: 0;
        padding: 0 0 0 5px;
    }

        #main-nav li a {
            font-size: 0.923em;
            margin: 0;
            padding: 5px;
        }

    .lt-ie9 #main-nav li a {
        font-size: .88em;
    }

    #home-news ul, #home-events ul {
        height: auto;
        min-height: 100px;
    }

    #footer li {
        margin-left: 8px;
        padding-left: 8px;
    }
}

@media screen and (max-width:900px) {
    .lt-ie8 #weather a {
        font-size: .846em;
    }

    .lt-ie8 #audience-nav a {
        font-size: .846em;
    }

    #audience-nav li {
        margin: 0 0 0 4px;
        padding: 0 0 0 4px;
    }

    #main-nav li {
        margin: 0 0 0 1px;
        padding: 0 0 0 4px;
    }

        #main-nav li a {
            padding: 4px;
        }

    #featured-stories-mobile .overview li {
        width: 95%;
    }

    #featured-stories-mobile .photo {
        width: 25%;
    }

    #featured-stories-mobile img {
        margin-bottom: 20px;
    }

    #featured-stories-mobile .text {
        margin-left: 26%;
    }

    #footer li {
        margin-left: 6px;
        padding-left: 6px;
    }
}

@media screen and (max-width:870px) {
    #top-bar-nav {
        margin: 0 16% 0 0;
    }

    .lt-ie9 #audience-nav li {
        margin: 0;
        padding: 0;
    }

    #weather {
        width: 165px;
    }

        #weather a {
            font-size: .846em;
        }

    #audience-nav li {
        margin: 0 0 0 3px;
        padding: 0 0 0 3px;
    }

    #audience-nav a {
        font-size: .846em;
    }

    #main-nav li a {
        font-size: .9em;
    }

    .lt-ie9 #main-nav li a {
        font-size: .8em;
    }

    .left-column .link-column,
    .right-column .link-column {
        float: none;
        width: auto;
        margin: 0 0 20px;
    }
}

@media screen and (max-width:840px) {
    #main-nav li {
        margin: 0;
        padding: 0 0 0 3px;
    }

        #main-nav li a {
            font-size: .86em;
        }

    #footer li {
        margin-left: 7px;
        padding-left: 7px;
    }

    #footer a {
        font-size: .85em;
    }
}

@media screen and (max-width:803px) {
    #page-wrap {
        padding-bottom: 0;
    }

    .full-page #interior-split-hero-image {
        left: 0;
        max-width: 745px;
        width: 100%;
    }

    td {
        word-wrap: break-word;
    }

    #edu-link {
        display: none;
    }

    #top-bar {
        padding: 0;
        display: block;
    }
    /*******/
    .lt-ie8 #top-bar-nav {
        margin: 0;
    }

    #weather {
        display: none;
    }

    #top-bar-nav {
        margin: 0;
        padding: 1% 0 0 1%;
    }

    #audience-nav {
        display: block;
        float: none;
        height: auto;
        top: 0;
        margin: 0;
        padding: 0;
        overflow: auto;
    }

        #audience-nav li {
            width: 32.33%;
            margin: 0 1% 1% 0 !important;
            padding: 0 !important;
            float: left;
            display: inline;
            background: url(/MasterPages/audience-nav-opac.png) !important;
        }

    .lt-ie8 #audience-nav li {
        margin: 0 1% 1% 0 !important;
    }

    #audience-nav li a {
        padding: 7px 0;
        display: block;
        text-align: center;
    }

        #audience-nav li a.active {
            margin: 0;
            padding: 7px 0;
        }

            #audience-nav li a.active:hover {
                color: #fff100;
            }

    #header {
        height: auto;
        min-height: inherit;
    }

    #header-content {
        min-height: 50px;
    }

    #mobile-buttons {
        display: block;
    }

    #header-nav {
        display: block;
    }
    /*******/
    #searchbox {
        position: relative;
        top: auto;
        left: auto;
        padding: 35px 0 0;
    }
        /*******/
        #searchbox form {
            width: auto;
        }

        #searchbox #searchbox-input {
            width: 90%;
        }

    #callout-nav {
        display: block;
        width: auto;
        height: auto;
        position: relative;
        top: auto;
        margin: 0;
    }

        #callout-nav li {
            width: auto;
            border-top: 1px solid #FFFFFF;
            display: block;
            float: none;
            height: auto;
        }

            #callout-nav li a {
                width: auto;
                background: none;
                border: none;
                font-size: 13px;
                text-align: left;
                padding: 5px;
                height: auto;
                line-height: 1.5em;
                text-shadow: none;
                box-shadow: none;
                color: #fff100;
                letter-spacing: normal;
            }

                #callout-nav li a:hover {
                    color: #fff100;
                }

    #mobile {
        display: block;
        top: 15px;
        right: 0;
        width: 75px;
        padding: 5px 5px 5px 10px;
        background: #033B6E;
        border: 1px solid #183969;
        border-radius: 2px;
        color: #fff;
        font-weight: 600;
        letter-spacing: 1px;
        position: absolute;
        text-decoration: none;
        text-transform: uppercase;
    }

        #mobile span {
            float: right;
            width: 13px;
            height: 18px;
            background: url("/MasterPages/sprites.png") no-repeat -176px 0;
        }

    #nav-control {
        display: none;
        top: 50px;
        width: 75px;
        padding: 5px 5px 5px 10px;
        background: #033B6E;
    }
        /*******/
        #nav-control span {
            float: right;
            width: 13px;
            height: 18px;
            background: url("/MasterPages/lai/img/sprites.png") no-repeat -149px 0;
        }

        #nav-control.open span {
            background-position: -162px 0;
        }

    #main-nav {
        display: block;
        text-align: left;
        margin: 25px 0 0;
    }

        #main-nav li {
            display: block;
            border-top: 1px solid #fff;
            background: none;
            margin: 0;
            padding: 0;
        }

            #main-nav li a {
                display: block;
                font-size: 1em;
                padding: 5px;
            }

    .lt-ie9 #main-nav li a {
        font-size: 1em;
        padding: 5px;
    }

    #expand-menu {
        display: none !important;
    }

    #main-content {
        margin-left: 0;
        padding: 35px 10px;
    }

    .full-page #main-content {
        margin-top: 0;
        padding: 20px 10px 35px;
    }

    .department-page #main-content {
        margin-top: 0;
        padding: 0px 10px 35px;
    }

    #hero-image {
        margin: 0;
    }

    #home-news, #home-events, #home-social-media {
        float: none;
        margin-bottom: 40px;
        width: auto;
    }

    a.bullet {
        width: auto;
        display: block;
    }

    #main-slideshow {
        margin: 0 !important;
    }

    #caption-box {
        display: none !important;
    }

    .flex-caption {
        background: #fff100;
        position: static !important;
        width: auto !important;
    }

    .flex-control-nav {
        bottom: 0 !important;
    }

    .lt-ie8 .flex-control-nav {
        bottom: 5px !important;
    }

    .flex-control-nav li {
        margin: 0 0 0 5px;
    }

    #secondary-nav {
        position: static;
        width: auto;
    }

    .left-column {
        float: none;
        width: auto;
    }

    .right-column {
        margin-left: 0;
        width: auto;
    }

    .left-wide-column {
        float: none;
        width: auto;
    }

    .right-wide-column {
        margin: 0 !important;
        width: auto !important;
    }

    .right-sidebar {
        margin-left: 0;
    }

    .callout-facts, .callout-stats {
        display: none;
    }

    .link-column {
        margin: 0;
        width: auto !important;
    }

    .link-column, .more-info.link-list, #landing-content .link-column, .left-column .link-column, .right-column .link-column {
        float: none;
        width: auto;
    }

    .link-category h3,
    .content-category h3 {
        float: none;
        width: auto;
    }

    .link-category .link-list {
        margin: 0;
    }

    .dept-list-group {
        width: 12%;
    }

    .dept-list .link-column {
        width: 88%;
        margin-left: 12%;
    }

    .letter .link-column {
        clear: both;
    }

    .letter .link-column {
        clear: none;
        width: auto;
        margin-left: 50px;
    }

    #featured-stories-mobile .viewport {
        margin-bottom: 25px;
    }

    #featured-stories-mobile .overview-mobile .photo {
        width: 25%;
    }

    #featured-stories-mobile .overview-mobile img {
        margin-bottom: 30px;
    }

    #featured-stories-mobile .overview-mobile .text {
        margin-left: 26%;
    }

    #featured-stories-mobile, #supporting-content {
        margin: 0 !important;
    }

    #home-news, #home-events, #home-social-media {
        padding-right: 0;
    }

    .full-page #secondary-nav {
        float: none;
        width: auto;
        margin-right: 0;
    }

    .full-page #interior-split-page-header-full {
    }

    #footer {
        height: auto;
        position: relative;
        padding: 0 0 10px;
    }

    #footer-content {
        padding: 7px 0 0 0;
    }

    #footer li {
        background: none;
        float: none;
        display: inline;
        text-align: center;
        margin: 0;
        padding: 0;
    }

    #footer-nav {
        float: none;
        margin-left: 0 !important;
    }

    #footer #contact-info {
        float: none;
        padding-right: 0;
        width: auto;
    }

    #footer #social-media {
        border: 0;
        margin: 10px auto;
        float: none;
        text-align: center;
    }

        #footer #social-media a {
            float: none;
            margin: 0 2px 0;
        }
}

@media screen and (max-width:680px) {
    #google-map {
        display: none;
    }

    #google-map-480 {
        display: block;
    }

    #google-map-320 {
        display: none;
    }

    #bottom-search-box {
        display: none;
    }
    /* #bottom-search-box table form table table td { display:block; margin:0 0 10px; text-align:center; } */
}

@media screen and (max-width:600px) {
    #top-bar-nav {
        padding: 1% 0 0 1%;
    }

    #audience-nav li {
        width: 49%;
        margin: 0 1% 1% 0 !important;
    }

    .flex-caption {
        min-height: 85px !important;
    }

    #featured-stories-mobile .viewport {
        margin-bottom: 20px;
    }

    #featured-stories-mobile .story {
        margin: 5px 0;
    }

    #featured-stories-mobile img {
        width: 25%;
    }

    #featured-stories-mobile .text {
        margin-left: 27%;
    }

    form#contactForm {
        width: 100%;
    }

        form#contactForm input[type="text"],
        form#contactForm textarea {
            width: 96%;
            padding: 2%;
        }
}

@media screen and (max-width:480px) {
    #google-map {
        display: none;
    }

    #google-map-480 {
        display: none;
    }

    #google-map-320 {
        display: block;
    }
}
