#appmenu, #qlmenu, #mlogo, #canadalogo
{
    display: none;
}

@media only screen and (max-width: 960px)
{

    *
    {
        box-sizing: border-box;
    }

    #s4-workspace
    {
        width: auto !important;
        height: 100% !important;
        padding: 0;
    }

    .toolbar *, .navigation *, #mainmenu *, .s4-wpcell-plain div:not([class]), 
    .s4-wpcell-plain table, .s4-wpcell-plain td, .s4-wpcell-plain, .ms-WPBody,
    .s4-wpcell-plain a, .s4-wpcell-plain p, .bottomContainer *, 
    .layoutFeaturedNewsStories, .layoutFeaturedNewsStories *, form, 
    .leftContainer, .rightContainer, .footerContainer, .footerContainer div, 
    #MSO_ContentTable, .sectionImage, .sectionSlogan, #Carousel, #Carousel *, 
    .layoutZoneLatestProjects, .layoutZoneLatestProjects *, 
    .layoutZoneNewsAndEvents, .layoutZoneNewsAndEvents *, 
    .srchctr_leftcell *, .srchctr_mainleftcell *, .srchctr_rightcell *
    {
        float: none !important;
        position: static !important;
        width: auto !important;
        overflow: visible !important;
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
    }

    #LatestContentCarousel {
        margin: 0 auto;
    }


.sectionImage  {
    margin: 0;
}
    .sectionImage > img {
        width: 100%;
    }

    .s4-bodyContainer
    {
        padding-top: 80px;
    }

    #mlogo {
        display: block;
        position: absolute !important;
        width: 240px !important;
        height: 40px !important;
        top: 20px;
        left: 20px;
        background: transparent url(../../images/IDRC_WebSite/mlogo.png) no-repeat scroll left center !important;
        background-size: contain !important;
    }
        
    #canadalogo {
        display: block;
        width: 100% !important;
        height: 30px !important;
        margin: 40px 0;
        background: transparent url(../../images/IDRC_WebSite/canada-logo.png) no-repeat scroll center center !important;
        background-size: contain !important;
    }

    .IDRClogo, #s4-ribbonrow, .IDRCSectionlogoEng, .IDRCSectionlogoFr
    {
        display: none;
    }

    .IDRCbreadcrumbsGradient
    {
        padding: 10px;
        position: relative !important;
        border-top: 2px #0069B5 solid;
        background: -moz-linear-gradient(top, rgba(207,227,238,1) 0%, rgba(207,227,238,0.99) 1%, rgba(255,255,255,0) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(207,227,238,1)), color-stop(1%,rgba(207,227,238,0.99)), color-stop(100%,rgba(255,255,255,0)));
        background: -webkit-linear-gradient(top, rgba(207,227,238,1) 0%,rgba(207,227,238,0.99) 1%,rgba(255,255,255,0) 100%);
        background: -o-linear-gradient(top, rgba(207,227,238,1) 0%,rgba(207,227,238,0.99) 1%,rgba(255,255,255,0) 100%);
        background: -ms-linear-gradient(top, rgba(207,227,238,1) 0%,rgba(207,227,238,0.99) 1%,rgba(255,255,255,0) 100%);
        background: linear-gradient(to bottom, rgba(207,227,238,1) 0%,rgba(207,227,238,0.99) 1%,rgba(255,255,255,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfe3ee', endColorstr='#00ffffff',GradientType=0 );
    }

    .IDRCPageTitle
    {
        font-size: 36px;
    }

    .IDRCPageTitle, #ctl00_ctl00_ChildMaster_IDRCBreadcrumb1
    {
        padding-left: 0;
    }

    .IDRCbreadcrumbsGradient:before
    {
        left: -10px;
    }

    .IDRCbreadcrumbsGradient:after
    {
        right: -10px;
    }

    .navigation, .toolbar, #mainmenu
    {
        display: none;
        padding: 0;
    }

    .s4-bodyContainer
    {
        position: relative !important;
    }

    #appmenu
    {
        display: block;
        position: absolute;
        right: 30px;
        top: 25px;
        width: 40px;
        height: 30px;
        background: red;
        content: " ";
        cursor: pointer;
        background: linear-gradient(to bottom, black, black 20%, white 20%, white 40%, black 40%, black 60%, white 60%, white 80%, black 80%, black 100%);
    }
    
    #qlmenu
    {
        display: block;
        position: absolute !important;
        right: 90px;
        top: 25px;
        width: 40px !important;
        height: 30px !important;
        -moz-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
        -webkit-transform: rotate(150deg);
        transform: rotate(30deg);
    }

    #qlmenu:before, #qlmenu:after
    {
        content: "";
        height: 0px;
        position: absolute;
        border-right: 5px solid transparent;
        border-left: 5px solid transparent;
        width: 0px;
    }

    #qlmenu:before
    {
        border-top: 20px solid #000;
        top: 12px;
        right: 12px;
    }

    #qlmenu:after
    {
        border-bottom: 20px solid #000;
        left: 12px;
        top: 0px;
    }
    
    #appmenu, .ql-open .toolbar, .menu-open .navigation, .menu-open #mainmenu
    {
        display: block;
    }

    .navigation li.dynamic-children .additional-background
    {
        background-image: none !important;
    }

    #mainmenu
    {
        height: auto !important;
        margin-top: 20px;
    }

    #mainmenu .drop .c, #mainmenu .drop
    {
        width: auto !important;
        max-height: inherit !important;
        box-shadow: none;
        border: 0 !important;
    }

    .navigation ul.dynamic, #mainmenu .drop, #mainmenu .mdd-heading, #mainmenu .content-area ul, a.quickLinks, .quickLinksitemHeading, .quickLinksitem
    {
        display: block !important;
        border: 0;
        background: transparent;
        margin-bottom: 20px !important;
        width: 100% !important;
        font: normal 14px/14px Arial,sans-serif;
    }

    #mainmenu .drop, #mainmenu .mdd-heading, #mainmenu .content-area ul, a.quickLinks, .quickLinksitemHeading, .quickLinksitem
    {
        margin-bottom: 0 !important;
    }

    #mainmenu *, .toolbar div, .toolbar ul, .toolbar li
    {
        padding: 0 !important;
        display: block !important;
    }


    #mainmenu .drop, #mainmenu .drop > .t, #mainmenu .drop > .b
    {
        display: none !important;
    }

    #mainmenu .mdd-topmenu-item, #mainmenu .mdd-heading a, #mainmenu .mdd-heading > h3, a.quickLinks, .quickLinksitemHeading, .quickLinksitem, a.langSelectionLinks, .searchBox
    {
        border-bottom: 1px #ddd solid !important;
        display: block !important;
    }

    #mainmenu .mdd-topmenu-item:hover
    {
        border-bottom: 0 !important;
    }

    #mainmenu .mdd-heading h3
    {
        font-weight: bold;
        color: #0066B3;
    }

    #mainmenu .mdd-heading a br, .quickLinksSeparator
    {
        display: none !important;
    }

    #mainmenu .tab-content, #mainmenu .mdd-heading li
    {
        padding: 0 !important;
    }

    #mainmenu .tab-content .mdd-topmenu-label, #mainmenu .mdd-heading > a, #mainmenu .mdd-heading > h3, .quickLinks, .toolbar li.quickLinksitemHeading, a.langSelectionLinks, .toolbar .searchBox
    {
        padding: 10px !important;
        display: block !important;
    }

    a.langSelectionLinks
    {
        text-transform: capitalize;
    }

    #mainmenu .mdd-heading li > a, .quickLinksitem > a
    {
        padding: 10px 10px 10px 20px !important;
        display: block !important;
    }

    #mainmenu .mdd-topmenu-label > a
    {
        display: inline-block !important;
    }

    #mainmenu .tab-content.open ~ .drop
    {
        display: block !important;
    }

    #mainmenu .tab-content.open .mdd-topmenu-label a
    {
        color: #fff !important;
    }

    .toolbar li.quickLinksitemHeading
    {
        font-weight: bold;
        position: relative;
    }

    .toolbar li.quickLinksitemHeading::before
    {
        position: absolute;
        content: "";
        width: 20px;
        height: 20px;
        background: #fff;
        left: 92px;
    }

    html[lang=fr-fr] .toolbar li.quickLinksitemHeading::before
    {
        left: 108px;
    }

    .navigation ul.dynamic a
    {
        display: inline-block;
        min-width: 0;
    }

    .toolbar .searchBox table
    {
        width: 100% !important;
    }

    .toolbar .searchBox input
    {
        background: transparent none;
        padding: 5px 5px 6px 5px;
        font-size: 14px;
        width: 100% !important;
        border: 0 !important;
    }

    .toolbar .searchBox img
    {
        border: 0 !important;
    }

    .toolbar .searchBox .ms-sbcell
    {
        border: 1px #AAA solid;
        text-align: center;
    }

    .toolbar .searchBox .ms-sbgo
    {
        border-left: 0;
    }

    #MSO_ContentTable {
        padding: 10px;
    }

    #MSO_ContentTable *
    {
        line-height: 1.6em;
    }

    #MSO_ContentTable > div > table, #MSO_ContentTable table.s4-wpTopTable
    {
        width: 100% !important;
    }


    #Carousel .Navigation1 > table > tbody > tr > td {
        text-align: right;
        width: auto !important;
    }

    #Carousel table {
        width: auto !important;
    }
    
    #Carousel .Navigation1 table table > tbody > tr > td, #Carousel .Navigation1 table table > tbody > tr > td > a > img, #Carousel .Navigation1 table table > tbody > tr > td > img {
        width: 20px !important;
        height: 20px !important;
    }

    #Carousel .Navigation1 table table > tbody > tr > td > img {
        position: relative !important;
        top: 9px;
    }
        
    #Carousel > div > div > img {
        width: 100% !important;
    }

    .layoutZoneFeaturedStories table, .layoutZoneFeaturedStories img, .layoutZoneFeaturedNews table, .layoutZoneFeaturedNews img
    {
        width: 100% !important;
    }

    .menu ul,.menu li
    {
        margin: 0 !important;
        padding: 0 !important;
    }

    .menu ul.dynamic
    {
        left: 0 !important;
        top: 0 !important;
        display: none;
    }

    .menu li.dynamic-children:hover ul.dynamic
    {
        position: static !important;
        display: block !important;
    }


    .layoutZoneMostPopularContent
    {
        margin-top: 20px;
        padding-left: 0;
    }

    .layoutZoneFeaturedNews
    {
        width: 50% !important;
        display: table-cell;
    }

    .layoutZoneFeaturedStories
    {
        width: 50% !important;
        display: table-cell;
    }

    .layoutZoneFeaturedNewsStories
    {
        display: table;
        width: 100% !important;
    }

    .bookmarks
    {
        margin: 0 0 40px 0;
        text-align: center;
    }

    .bookmarksTitle
    {
        font-size: 18px;
        margin-bottom: 20px;
    }

    .bookmarks a
    {
        display: inline-block;
        border: 1px #ddd solid;
        padding: 10px;
        border-radius: 10px;
        margin: 10px !important;
    }

    .bookmarks a > img
    {
        width: 32px !important;
        height: 32px !important;
    }

    .footerLinksColumn1, .footerLinksColumn2, .footerLinksColumn3
    {
        margin-top: 20px !important;
        display: block;
    }

    .footerContainer .footerLinksTitle, .footerContainer .footerLinksHeading
    {
        font-weight: normal;
        font-size: 17px !important;
    }

    .footerContainer .footerLinksHeading
    {
        font-weight: bold;
        font-size: 18px !important;
    }

    .footerRightContainer
    {
        display: table;
        width: 80% !important;
        margin: 0 auto;
    }

    .footerRightContainer > div
    {
        display: table-cell;
        width: 33% !important;
        text-align: center;
    }

    .rightContainer
    {
        margin: 0 auto;
        width: 70% !important;
    }

    .rightContainer table
    {
        margin: 0 auto;
    }

    .rightContainer p
    {
        margin: 0;
        text-align: center;
    }

    .rightContainer p a img, .rightContainer div a img
    {
        margin: 5px auto !important; 
        display: block; 
        width: 100% !important;
        height: auto !important;
    }

    .latestContentNavContainer img {
        width: 20px !important;
        height: 20px;
    }

    .rightContainer p > br
    {
        display: none;
    }

    .ms-WPBody embed
    {
        margin: 20px auto 0 auto;
        display: block !important;
        width: 100% !important;
    }

    .wpText, .ms-WPBody a, .ms-WPBody li
    {
        font-size: 14px;
    }

    h3.wpHeading
    {
        margin-top: 20px;
    }

    .bottomContainer
    {
        padding-top: 0;
    }

    td.wpFeaturedPubImage
    {
        width: 35% !important;
        padding-right: 10px !important;
    }

    .wpTitle
    {
        margin-top: 20px;
    }

    #macSharePointPlugin
    {
        display: none;
    }

    .ql-open .toolbar, .menu-open .navigation, .menu-open #mainmenu
    {
        width: 293px !important;
        position: absolute !important;
        z-index: 100;
        background: #fff;
        right: -300px;
        top: 90px;
    }

    .s4-bodyContainer.menu-open, .s4-bodyContainer.ql-open
    {
        right: 300px;
        transition: all 0.3s ease-out;
        border-right: 1px #ddd solid;
    }

    .ql-open #appmenu, .menu-open #appmenu
    {
        right: -270px;
        background-color: #eee;
    }

    .ql-open #qlmenu, .menu-open #qlmenu
    {
        right: -210px;
    }

    .ql-open #qlmenu:before
    {
        border-top-color: #0072BC;
    }

    .ql-open #qlmenu:after
    {
        border-bottom-color: #0072BC;
    }

    .menu-open #appmenu
    {
        background: linear-gradient(to bottom, #0072BC, #0072BC 20%, white 20%, white 40%, #0072BC 40%, #0072BC 60%, white 60%, white 80%, #0072BC 80%, #0072BC 100%);
    }

    .footerContainer {
        margin: 0 10px;
    }

    .rightContainer > table {
        width: 100% !important;
    }

    #LatestContentCarousel {
        margin: 0 auto;
        width: 100%;
    }

    .latestContentContainer { 
        width: 100%;
    }

    .latestContentImageConatiner {
        text-align: center;
    }

    .filter {
        float: none;
    }

    .filterPanel {
        width: auto;
        margin: 0 auto;
    }

    .resultsPanel  {
        width: auto;
    }

    .ContentListItemWrapper {
        height: auto;
    }

    .ContentListItemBodyText {
        max-height: 100%;
    }

    .srch-sb-results {
        display: none;
    }

    .srch-Page > * {
        display: inline-block !important;
    }

    .srch-results {
        padding-left: 0;
    }

    .srch-Icon {
        float: left !important;
        position: relative !important;
        top: 7px;
    }

    #SAL {
        position: absolute !important;
        right: 0;
        top: 105px;
    }

    .srch-maintop {
        padding-bottom: 10px;
    }

    .srchctr_rightcell {
        display: none;
    }
    
    #qlmenu.noappmenu 
    {
        margin-right: -70px;
    }
 
    .ql-open #MSO_ContentTable {
        overflow: hidden !important;
    }
    
    .srch-Metadata1 {
        word-break: break-all;
    }
    
    .srch-sb-results ~ table > tbody > tr:first-child {
        display: none;
    }
}

@media only screen and (max-width: 480px)
{

    #appmenu
    {
        right: 20px;
        top: 15px;
        width: 30px;
        height: 20px;
    }

    #qlmenu {
        right: 60px;
        top: 10px
    }

    .ql-open #qlmenu, .menu-open #qlmenu
    {
        right: -240px;
    }
    
    .ql-open #appmenu, .menu-open #appmenu
    {
        right: -280px;
    }

    #mlogo {
        height: 30px !important;
        top: 10px;
        left: 10px;
    }

    .layoutZoneFeaturedNews, .layoutZoneFeaturedStories, .layoutZoneFeaturedNewsStories
    {
        display: block;
        width: 100% !important;
    }

    .s4-bodyContainer
    {
        padding-top: 50px;
    }

    .rightContainer img, .ms-WPBody embed
    {
        width: 100% !important;
    }

    .footerRightContainer > div {
        display: block;
        width: 100% !important;
        padding-right: 0;
    }

    .srchctr_leftcell{
        display: none !important;
    }

     #SAL {
        position: absolute !important;
        right: 0;
        top: 75px;
    }
    
    #qlmenu.noappmenu 
    {
        margin-right: -60px;
    }
}