/* MOBILE CSS - 2013 */


/* LESS THAN FULL SIZE */

@media (max-width: 1000px)
{
    .row
    {
        margin: 0 -10px;
    }


    .row .col
    {
        padding: 0 10px;
    }

    section#buttons div.attribute-title + .row div.link-button
    {
        margin-bottom: 10px;
    }

    section.campaign-section div.text
    {
        padding-top: 20px;
        padding-right: 10px;
    }

    section.campaign-section div.attribute-title h1
    {
        font-size: 3.2em;
    }
    
    section.campaign-section div.image
    {
        width: 33.333333%;
        left: auto;
    }
    
    section.campaign-section div.text, section.campaign-section div.image
    {
        width: auto;
        float: none;
    }
    
    section.campaign-section div.image
    {
        height: auto;
        background-image: none !important;
        margin: 20px -20px 10px -20px;
        position: static;
    }
    
    section.campaign-section  .col.image img
    {
        width: 100%;
        display: block;
    }
    
    section.campaign-section div.attribute-link
    {
        position: static;
        margin-bottom: 10px;
    }

    section.banner-exchange_opportunity div.text-position
    {
        padding-left: 500px; /* from 650 to 500. */
    }
    section.banner-exchange_opportunity div.overlay-text
    {
        width: 450px;
    }
    section.banner-exchange_opportunity h1 {
        font-size: 1.7em;
    }


    div.class-exchange_opportunity div.class-exchange_opportunity-data div.seating-meta p {
        font-size: 0.8em;
    }


    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .attribute-name {
        margin-bottom: 0;
    }

    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .attribute-name h2{
        font-size: 0.9em;
    }

    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .attribute-study_type h4{
        font-size: 0.65em;
        margin-bottom: 0px;
    }

    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .attribute-study h4{
        font-size: 0.6em;
    }

    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .attribute-linktext {
        font-size: 0.6em;
        margin-top: 0;
    }

    section#ambassador div.content-view-ambassador_block .class-person .person-info-panel .person-info-panel-content {
        bottom: 5px;
    }


}


/* MEDIUM SIZE */

@media (max-width: 800px)
{

    h1, div.content-view-full div.attribute-title h1
    {
        font-size: 2.1em;
    }
    
    .row
    {
        margin: 0 -10px;
    }

    .row .col
    {
        padding: 0 10px;
    }    
    
    .row .m-1
    {
        width: 8.3333%;
    }

    .row .m-2
    {
        width: 16.6667%;
    }

    .row .m-3
    {
        width: 25%;
    }

    .row .m-4
    {
        width: 33.3333%;
    }

    .row .m-5
    {
        width: 41.6667%;
    }

    .row .m-6
    {
        width: 50%;
    }

    .row .m-7
    {
        width: 58.3333%;
    }

    .row .m-8
    {
        width: 66.6667%;
    }

    .row .m-9
    {
        width: 75%;
    }

    .row .m-10
    {
        width: 83.3333%;
    }

    .row .m-11
    {
        width: 91.67%;
    }

    .row .m-12
    {
        width: 100%;
    }

    .row .l-br
    {
        clear: none;
    }

    .row .m-br
    {
        clear: both;
    }
    
    .row .l-hide
    {
        display: block;
    }
    
    .row .m-hide
    {
        display: none;
    }

    .show-tablet
    {
        display: block;
    }

    div.crop-tablet
    {
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
    }
    
    div.crop-tablet img
    {
        width: 150% !important;
        position: relative;
        left: -25%;
    }

    div.m-12 > div.infobox, div.m-12 > div.infobox.fill-right
    {
        margin-right: -20px !important;
        margin-left: -20px !important;
        padding: 20px 20px;
    }

    section#content-middle section
    {
    }
    
    section#events div.attribute-title, section#events div.attribute-date
    {
        width: auto;
        text-align: left;
        float: none;
    }

    div.infobox:first-child, div.bannerbox:first-child
    {
        margin-top: 15px;
    }

    .fill-left:before, .fill-right:after
    {
        left: 0;
        right: 0;
    }
    
    nav#path
    {
        display: none;
    }
    
    div#social-icons
    {
        margin: 20px 0 0 0;
        text-align: left;
    }

    div.button-embedded
    {
        width: 48.1%;
    }

    div.col.l-labelmargin div.link-button
    {
        margin-top: 10px !important;
    }

    div.col.m-labelmargin div.link-button
    {
        margin-top: 40px !important;
    }

    
    /* Sections */

    section#banner.banner-frontpage h1
    {
        font-size: 2.2em !important;
        margin-top: 13px;
    }

    section#banner.banner-frontpage div.overlay-text
    {
        padding-bottom: 20px;
        position: static;
    }

    section#title-image
    {
        max-height: none;
        overflow: visible;
    }
    
    section#title-image div.overlay-text
    {
        color: #ffffff;
        background-color: #a6bcc6;
        padding-bottom: 10px;
        position: static;
    }

    section#title-image div.overlay-text div.search
    {
        margin-top: 20px;
    }
    
    section#title-image div.overlay-text h1, section#title-image div.overlay-text label.label-heading
    {
        color: #ffffff;
        margin: 0;
    }
        
    section#study-details .col
    {
        padding-left: 50px;
    }
    
    section#study-details div.study-icon
    {
        margin: 8px 0 0 -38px;
        float: left;
    }

    div.sidebar-pull div.infobox
    {
    }

    div.sidebar-pull div.infobox:first-child
    {
        margin-top: 20px;
    }
    
    section.banner-study
    {
        max-height: none !important;
        background-color: transparent;
        overflow: visible;
    }
    
    section.banner-study div.text-position, section.banner-study div.overlay-text
    {
        max-height: none !important;
        margin: 0;
        padding: 0;
        position: static;
    }
    
    section.banner-study div.text-position
    {
        margin: 0 !important;
        background-color: #c60c30;
    }

    section.banner-study.grey div.text-position
    {
        background-color: #818a8f;
    }
    
    section.banner-study div.overlay-text
    {
        width: auto;
        padding: 20px !important;
    }    
    
    section.banner-study h1
    {
        font-size: 1.7em !important;
    }


    /* researchgroup*/
    section.banner-researchgroup
    {
        max-height: none !important;
        background-color: transparent;
        overflow: visible;
    }

    section.banner-researchgroup div.text-position, section.banner-researchgroup div.overlay-text
    {
        max-height: none !important;
        margin: 0;
        padding: 0;
        position: static;
    }

    section.banner-researchgroup div.text-position
    {
        margin: 0 !important;
        background-color: #9DB8B2;
    }

    section.banner-researchgroup.grey div.text-position
    {
        background-color: #818a8f;
    }

    section.banner-researchgroup div.overlay-text
    {
        width: auto;
        padding: 20px !important;
    }

    section.banner-researchgroup h1
    {
        font-size: 1.7em !important;
    }

    /* exchange_opportunity */
    section.banner-exchange_opportunity
    {
        max-height: none !important;
        background-color: transparent;
        overflow: visible;
    }

    section.banner-exchange_opportunity div.text-position, section.banner-exchange_opportunity div.overlay-text
    {
        max-height: none !important;
        margin: 0;
        padding: 0;
        position: static;
    }

    section.banner-exchange_opportunity div.text-position
    {
        margin: 0 !important;
        background-color: #c60c30;
    }

    section.banner-exchange_opportunity.grey div.text-position
    {
        background-color: #818a8f;
    }

    section.banner-exchange_opportunity div.overlay-text
    {
        width: auto;
        padding: 20px !important;
    }

    section.banner-exchange_opportunity h1
    {
        font-size: 1.7em;
    }


    div.class-exchange_opportunity div.class-exchange_opportunity-data div.seating-meta p {
        font-size: 0.9em;
    }


    /*nav*/

    nav#content-menu span.marker
    {
        margin-right: 5px;
        margin-left: 5px;
    }

    nav#content-menu a
    {
        padding-right: 10px;
        padding-left: 10px;
    }
    
    section#buttons div.link-button.button-white
    {
        margin-top: 0;
    }

    section#about-uia div.figure-map img
    {
        margin-top: 0;
    }
    
    div.content-view-full div.class-event div.link-button
    {
        margin-bottom: 20px;
    }
    
    div.employee-top
    {
        margin: 0 -20px;
        border-left: none;
    }

    section#employee div.attribute-image img
    {
        margin-left: 0;
    }
    
    section#employee p.language-link
    {
        margin-top: 0;
    }

    section#employee div.infobox:first-child
    {
        margin-top: 0;
    }
    
    div#employee-options-bg select
    {
        font-size: 0.9em;
    }

}


/* SMALL SIZE */

@media (max-width: 600px)
{

    body
    {
        background-color: #818a8f;
    }
    
    div#footer-bg
    {
        position: relative !important;
    }

    .row
    {
        margin: 0 -5px;
    }

    .row .col
    {
        padding: 0 5px;
    }    
    
    .row .s-1
    {
        width: 8.3333%;
    }

    .row .s-2
    {
        width: 16.6667%;
    }

    .row .s-3
    {
        width: 25%;
    }

    .row .s-4
    {
        width: 33.3333%;
    }

    .row .s-5
    {
        width: 41.6667%;
    }

    .row .s-6
    {
        width: 50%;
    }

    .row .s-7
    {
        width: 58.3333%;
    }

    .row .s-8
    {
        width: 66.6667%;
    }

    .row .s-9
    {
        width: 75%;
    }

    .row .s-10
    {
        width: 83.3333%;
    }

    .row .s-11
    {
        width: 91.67%;
    }

    .row .s-12
    {
        width: 100%;
    }

    .row .l-br, .row .m-br
    {
        clear: none;
    }

    .row .s-br
    {
        clear: both;
    }

    .row .m-hide
    {
        display: block;
    }

    .row .s-hide
    {
        display: none;
    }
    
    a.s-br, span.s-br
    {
        display: block;
        clear: both;
    }
    
    header
    {
        height: auto;
        padding: 20px;
    }
    
    div#searchbox, nav#extramenu, nav#topmenu, nav#path
    {
        display: none;
    }
    
    div#logo
    {
        position: relative;
        top: 1px;
    }

    div#logo span.image
    {
        width: 180px;
        height: 25px;
    }
    
    div#mobile-navigation
    {
        width: 100px;
        float: right;
    }
    
    div#mobile-navigation a, div#mobile-navigation span.image
    {
        display: block;
    }
    
    div#mobile-navigation span.image
    {
        background: 0 50% no-repeat;
        background-size: contain;
    }
    
    div#mobile-navigation div#click-menu span.image
    {
        width: 24px;
        height: 18px;
        background-image: url(../images/icon-menu-grey.svg);
        margin: 2px 0 0 20px;
    }
    
    div#mobile-navigation div#click-search span.image
    {
        width: 22px;
        height: 22px;
        background-image: url(../images/icon-search-grey.svg);
    }
    
    div#mobile-navigation span.text
    {
        display: none;
    }
    
    div#click-search, div#click-menu
    {
        margin-top: 2px;
        float: right;
    }
 
    .page-width
    {
/*        padding-right: 10px;
        padding-left: 10px;*/
    }

    div.infobox, div.infobox.fill-right
    {
        margin-right: -20px !important;
        margin-left: -20px !important;
        padding: 20px;
    }
    
    section#banner div.overlay-text
    {
        padding: 0 20px;
    }
    
    .show-mobile
    {
        display: block;
    }

    .hide-mobile
    {
        display: none;
    }

    div.crop-mobile
    {
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
    }
    
    div.crop-mobile img
    {
        width: 200% !important;
        position: relative;
        left: -50%;
    }

    div#searchbox 
    {
        width: 100%;
        margin: 20px 0 0 0;
    }

    body.show-mobilesearch div#searchbox
    {
        display: block;
    }
        
    section#banner div.overlay-text div.width-4
    {
        width: 50%;
    }
    
    footer div#social-icons
    {
    }

    div.infobox
    {
        margin-right: -20px !important;
        margin-left: -20px !important;
        padding: 10px 20px;
    }

    table.calendar
    {
        margin: 30px 0 0 0;
    }

    section#events table.calendar
    {
        display: none;
    }

    div.calendar-link a
    {
        font-size: 1.2em;
    }
    
    div.calendar-link a:hover
    {
        text-decoration: underline;
    }

    div.button-embedded
    {
        width: 100%;
    }

    div.col.m-labelmargin div.link-button
    {
        margin-top: 10px !important;
    }

    
    /* Sections */
    
    section#banner.banner-frontpage h1
    {
        font-size: 1.7em !important;
        margin-top: 13px;
    }
    
    section#other-info .col
    {
        text-align: center;
    }
    
    section#other-info div.figure, section#other-info div.figure img
    {
        margin: 0 auto;
    }
    
    section#student-quote
    {
        text-align: center;
    }
    
    section#student-quote div.attribute-image img
    {
        margin: 0 auto;
    }
    
    section#student-quote div.more-items
    {
        float: none;
    }

    section#student-quote div.more-items span.image
    {
        margin: 0 auto;
    }
    
    section#studies-searchresults div.search
    {
        margin: -10px 0 20px 0;
        float: left;
        clear: left;
    }

    div.searchresult-line span.attribute-type, div.searchresult-line span.attribute-location
    {
        font-size: 0.6em;
        line-height: 1em;
        margin: 5px 0 5px 0;
    }
    
    section#buttons div.attribute-title + .row div.link-button
    {
        margin-top: 5px;
        margin-bottom: 0;
    }

    section#study-details .col
    {
        padding-left: 45px;
    }
    
    section#student-statistics .col, section#about-uia .col
    {
        text-align: center;
    }
    
    section#student-statistics .col > div, section#about-uia .col > div
    {
        margin: 0 auto;
    }

    div.content-chapter
    {
        margin: 15px -20px 0 -20px;
        padding-top: 16px;
        padding-right: 20px;
    }

    div.content-chapter:first-child
    {
        margin-top: -9px;
    }
    
    div.content-chapter > h2
    {
        padding: 0 20px;
        background: 100% 50% no-repeat;
        background-size: 24px 24px;
    }
    
    div.content-chapter.open > h2
    {
        background-image: url(../images/icon-minus.svg);
    }

    div.content-chapter.closed > h2
    {
        background-image: url(../images/icon-plus.svg);
    }

    div.content-chapter-body
    {
        padding: 0 20px 10px 20px;
    }
    
    section#employee div.employee-top
    {
    }

    section#employee div.attribute-title h1
    {
        font-size: 1.4em;
        margin: 0 0 10px 0;
    }

    section#employee div.attribute-academictitle h2
    {
        font-size: 1em;
        font-weight: 500;
    }

    section#employee p.language-link
    {
        background-color: #ffffff;
        padding: 20px 20px 0 20px;
    }
    
    section.campaign-section div.attribute-title h1
    {
        font-size: 2.7em;
    }
    
    div#employee-options-bg select
    {
        font-size: 0.8em;
    }

    div.class-researchgroup div.researchgroup-content-left{
        padding-right: 0px;
        margin-right: 0px;
    }

    section.banner-researchgroup div.overlay-text {
        width: 340px;
    }


    .class-exchange_opportunity .content-chapter-multi h2 {
        font-size: 1.2em;
    }




}

/* GREATER THEN MEDIUM SIZE */

@media (min-width: 800px) {

    section#title-image div.overlay-text {
        background: transparent !important;
    }

}

/* GREATER THEN SMALL SIZE */

@media (min-width: 600px) {

    .content-chapter-multi.open-large-screen h2 {
        cursor: default !important;
        background-image: none !important;
        background: transparent !important;
        color: #404040 !important;
        padding: 0 !important;
    }
}