@charset "UTF-8";

@media (max-width: 480px) {

    style,
    script {
        display: none !important;
    }

    #wrapper {
        width: 100%;
    }

    #ctga_wga_minilogo {
        top: 0px;
    }

    .small-1 {
        /* verwijder marges! */
        width: 0;
    }

    div.columns,
    div.column {
        width: 100%;
        display:block;
        float: none;
    }

    

    div.columns > *,
    div.column > * {
        width: 100%;
        display:block;
        float: none;
        margin-top:unset;
        /*margin-bottom:unset;*/
    }
 
    div.logoheader div.columns > *,
    div.logoheader div.columns > a img,
    a.drop_lang,
    ul#drop_lang {
        width: 100%;
        display:block;
        float: none;
        margin-top:unset;
        margin-bottom:unset;
    }

    div.logoheader div {
        padding:0;
        position: absolute;
    }

    div.logoheader div:nth-of-type(1) {
        width: 40%;
        top: 1rem;
        right: 2rem;
    }
    div.logoheader div:nth-of-type(2) {
        width: 40%;
        top: 4.7rem;
    }
    div.logoheader div:nth-of-type(3) {
        width: 40%;
        top: 3.5rem;
        right: 2rem;
    }



    div.logoheader div a.button {
        height: 2.4rem;
        margin: 6px;
        line-height: 9px;
    }

    a.drop_lang img {
        display:inline-block !important;
        width: 24px !important;
        height: 16px !important;
    }

    div.logo_header div a[href*="/"] img {
        width:40% !important;
        height:auto;
    }

    

    .column.small-centered,
    .columns.small-centered {
        margin-left: 0;
        margin-right: 0;
        text-align: left;
        float: none;
    }

    div.columns h1,
    div.columns h2,
    div.columns h3,
    div.columns h4,
    div.columns h5,
    div.columns h6,
    div.column h1,
    div.column h2,
    div.column h3,
    div.column h4,
    div.column h5,
    div.column h6 {
        width:100%;
    }

    h1.resource_title
    {
        line-height: unset !important;
    }


    .ctga_downloadbutton {

        font-size: 13px;

    }



    /* MAIN MENU / "EXTRA" al uitgeklapt maken */

    ul#menu_main {
        margin-top: 4rem;
        padding-bottom: 1.4rem;
    }

    ul#menu_main,
    ul#menu_main li,
    ul#menu_main li#menu_item,
    ul#menu_main li#menu_item ul#drop,
    ul#menu_footer,
    ul#menu_footer li,
    ul#menu_footer li a {
        display: block;
        width: 100% !important;
    }

    ul#menu_main li {
        min-height: unset;
        height: 2.4rem;
    }

    ul#drop {
        width:100%;
    }
    
    /* SECOND MENU */

    ul#menu_second {
        width:100%;
        display:block;
        text-align: center;
        padding-bottom: 2rem;
    }

    ul#menu_second li {
        width:100%;
        height: 2.8rem;
        text-align: center !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    /* FOOTER */

    div#footer div:last-of-type {
        margin-top:2rem;
        margin-bottom:2rem;
        display: inline-block;
     }

    ul#menu_footer li {
        position: relative;
        margin:0;
    }

    ul#menu_footer li {
        width:55% !important;
        float:right;
        right: 0px;
        top:0px;
        padding-left: 1rem;
    }

    ul#menu_footer li.footer_logo {
        width:40% !important;
        float:left;
        background-size: cover;
        background-position: center top;
        left:0px;
        top:-26px;
    }

    ul#menu_footer li a {
        width:100%;
        display:block;
        white-space: nowrap;
    }

    ul#menu_footer li a:not([href~='changethegameacademy.org']) {
        /* externe links */
        width: 32px !important;
    }
    
    ul#menu_footer li a[href*='twitter'],
    ul#menu_footer li a[href*='linkedin'],
    ul#menu_footer li a[href*='facebook'] {
        float:left;
    }

    

    /* HOMEPAGE */

    .homepage_course li {
        width: 47% !important;
        margin:1% !important;
    }

    .homepage_course li.course_title {
        width: 100% !important;
        height: 144px !important;
        background-position:center right;
    }

    ul.homepage_course.course_lfr li.course_title {
        background-color: #e43220;
    }

    ul.homepage_course.course_ms li.course_title {
        background-color: #029ce2;
    }


    /* CONTENT */

    section#content h1,
    section#content h2 {
        font-size:32px;
        margin-top:0;
        margin-bottom:0 !important;
    }

    section#content > * > p {
        width: 100% !important;
        margin-bottom: 1.2rem;
    }

    div.childmenu {
        width: 100% !important;
    }

    .blokje_ {
        width: 93% !important;
    }

    article section#content > * > div,
    article section#content > * > ul {
        width: 100% !important;
        float:none;
    }

    #content li {
        margin-left: 0;
    }

    /* SEARCH */

    .shortmodule_search {
        width:100%;
    }

    .shortmodule_search form div.row,
    #searchbutton,
    #resetbutton,
    #ajaxresult {
        margin-top:1.0rem;
        margin-left:0 !important;
        margin-right:0 !important;
    }

    /* SHORTMODULES METRO */

    div#ctga_el_nav_container,
    div.ctga_el_nav {
        width:100% !important;
        margin: 0;
    }

    /* EXAMPLES */

    [class*="column"] + [class*="column"]:last-child {
        float:none;
    }

    div.ic_searchpanel {
        padding:0;
    }

    div.ic_searchpanel form span {
        margin-left: 1rem;
    }

    table.ic_table, 
    table.ic_table tbody, 
    table.ic_table tr, 
    table.ic_table tr td,
    div#ic_photo_slider_container {
        width:100% !important;
    }

    table.ic_table tr td {
        display:inline-block;
    }

    div#ic_photo_slider_container {
        height: 260px !important;
    }

    div.slick-track div {
        background-size: contain !important;
        height: 260px !important;
    }

    section#content h1.resource_title
    {
        font-family:"SyntaxLTStd-Roman";
        font-size:16px;
        line-height:18px !important;
        margin-bottom:4px;
    }

    p.resource_desc
    {
        font-style:italic;
        line-height:16px;
        font-size:14px;
        margin-bottom:4px;
    }
    
}
    


    /*





    nav {
        position: relative;
    }

    .logohome {
        position:absolute;
        top: 14px;
    }

    nav ul {
        margin-left: 260px;
    }

    .small-3,
    .small-4,
    .small-block-grid-3 > li,
    #news div ul li a img {
        width: 100%;
    }

    .text {
        min-height: fit-content;
    }

    #news a.button {
        float:none !important;
        position: relative;
        text-align:center;
        width: 100% !important;
        right:0px;
    }

}

@media (max-width: 640px) {

    nav ul {
        margin-left: 0px;
    }

    .logohome {
        position:relative;
        top: 0px;
    }

    #ctga_wga_minilogo {
        display: none;
    }

    .homepage_course li.course_title 
    {
        width:188px;
        height:68px;
    }


    #menu_main li {
        display: inline-block;
        list-style: none;
        margin: 0;
        max-height: 40px;
        line-height:40px;
        min-height:40px;
    }
    
    #menu_second li {
    text-align: center;
    font-size: 18px;
    vertical-align: middle;
    line-height: 36px;
    color:#4A4A4A;
    list-style:none;
    font-family:"SyntaxLTStd-Roman";
}


#menu_second li {
    display: inline-block;
    list-style: none;
    margin: 0;
    height:36px;
}

article section#content > * > h4,
article section#content > * > h5,
article section#content > * > h6 {
    float:left;
    width:100% !important;
    font-family: "SyntaxLTStd-Roman";
    font-size: 28px;
    color: #4A4A4A;
    letter-spacing: 1px;
    line-height: 32px;
    clear:both;
}


}


@media (max-width: 480px) {

    #ctga_wga_minilogo {
        top: 0px;
    }
}

@media (max-width: 320px) {
    #wrapper {
        width: 320px;
    }

    #header div.orbit-container {
        display: none;
    }
}

*/