/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
    .col {  margin: 1% 0 1% 0%; }
    .span_1_of_2, .span_2_of_2 { width: 100%; }
    .main .span_1_of_2, .main .span_2_of_2, .main .extra .span_1_of_2, .main .extra .span_2_of_2 { width: 100%; }
    .span_1_of_5, .span_2_of_5, .span_3_of_5, .span_4_of_5, .span_5_of_5, .single .span_4_of_5, .single .span_1_of_5{ width: 100%; }
}

/* rest */
@media only screen and (max-width: 768px) {
/* ipads */
    .mobilehide {
        display: none;
    }    
    .desktophide {
        display: block;
    }
    .inline.desktophide {
        display: inline;
    }
    header {
        border-bottom: none;
    }
    a.textlogo {
        position: relative;
    }
    a.textlogo img {
        width: 100%;
        vertical-align: top; /* get rid of padding */
    }
    
    .donatie {
        font-family: Avenir, Helvetica, Arial, sans-serif;
        color: #0e4166;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 600;
        line-height: 24px;
        display: block;
        background: #f4c52d;
    }
    
    .donatie span {
        width: 100%;
    }
    
    li a.rsswidget {
        font-size: 14px;
    }  
    
    .footerMenu {
        width: 90%;  
    }    

    .mainContent h6 {
        width: calc(100% - 40px);
        margin: 1em 0 1em 0;
    }
}    

/* iphone is 414, zelfs */
@media only screen and (max-width: 480px) {
    body {
        background-color: rgba(255, 197, 44, 0.1)
    }
    
    .home article, .home article p, .archive article, .archive article p, .home .broodContent, .home .broodContent p {
        font-size: 1.1em;
        line-height: 1.1em !important;
        margin-top: 5px !important;
    }
    
    .home article.image .articleContent, .archive article.image .articleContent {
        height: 90px;    
    }   
    
    .home h2, .home a h2, .archive h2, .archive a h2 {
        font-size: 18px;
    } 
    
    .home .snap {
        background: #fff;
    }
    
    .home .snap .sidebar.leeg {
        padding: 0 7% !important;
        width: 86% !important;
        background-color: #fffcf4 !important;
        background-color: rgba(255,197,44,.1) !important;
    }
    
    .home .col.snap {
        position: relative !important;
    }
    
    /* articles */
   
    .home article {
        padding: 1em;
        width: 100%;
        box-sizing: border-box;
    }
    .single article, .page article {
        padding: 0;
    }   
    
    .mainContent {
        padding: 0 1em 0 1em;
    }
    
    .caption {
        padding: 0 1.4em;
    }
    
    .first .articleContent, .first h3 {
        display: none;
    }
    
    .first .metaBox, .home article.image .metaBox, .home article.text .metaBox {
        order: -1;
    }
    
    .home article.image .metaBox, .home article.image .articleContent {
        width: 100%;
    }
    
    .first article, .home article.image, .home article.text {
        display:flex;
        flex-direction: column;
    }
    
    .home article.image, .home article.text, .video article {
        margin-bottom: 1em;
        border-bottom: none; 
    }
    
    .home .broodContent {
        border-bottom: none;
    }
     
    .home .farticle {
        margin-bottom: 1em;
    }
        
    .home article.image h2, .home article.text h2 {
        margin: 0.2em 0;
    }
    
    .home article.image figure, .home article.image h3 {
        display: none;
    }
       
    .video .left article, .video .left   {
        position: unset; /* cancel positioning */ 
    } 
    
    .video {
        flex-wrap: wrap;
    } 
    
    .main .video .col, .main .extra .col {
        margin: 0;
    }
    
    .videohead {
        background: #fff;
    }
    
    .extra .aanbevolen {
        padding: 0;
    }
    
    .home .extra  article {
        float: none;
    }
    
    .home .kolom article p {
        font-size: 14px;
    }
    
    .kolom article .auteur p {
        font-size: 0.43em;
    }
    
    .kolom .aanbevolen .textFloat, .home .kolom article h2 {
        font-size: 17px;
    } 
    
    .home .kolom article.aanbevolen h2 {
        font-size: 22px;
    }
    
    .titleframe {
        background: #fff;
        padding: 1em;
        margin-bottom: -4px;
        text-align: center;
    }
        
    .home h3, .home a h3 {
    margin-top: 0;
    }
    
    .home .rb:after {
        border: none;
    }  
    
    .single .mainContent .BolPartner_SelectedProducts_PlaceHolder {
    max-width: 95%;
    }  
    
    .single .postLabel, .page .postLabel {
        text-transform: uppercase;
        color: #4975a3;
        font-size: 10px;
        margin: 0.5em 0.5em 1em 0.5em;
        font-style: normal;
        font-weight: bold;
    }
    
    .single h1, .page h1 {
        font-size: 1.6em;
        text-align: left;
    }
    
    .single h2, .page h2 {
        font-size: 1.2em;
        text-align: left;
        padding: 0.6em 1em;
    }
    
    .single .metaBox, .page .metaBox {
        line-height: 9px;
        margin-bottom: -0.4%;
    }
    
    .home .broodContent {
        padding: 1em; 
    }    
    
    .snap .sidebar {
        background: none;
    }
    
    .gform_wrapper {
        margin: 0 0 -8px 0 !important;;
    }
    
    footer span {
        font-size: 6px;
    }    
    
    footer h4 {
        font-size: 8px;
        font-weight: 400;
    }
    
    footer img {
        height: 35px;
    }
    
    .footerMenu {
        padding: 0 0 2em 0;
    }
    
    /* author */
    
    .authorDescription figure {
        width: 17%;
        margin-right: 5px;
    }    
    
    .authorDescriptionBody span.text {
        font-size: 11px;
        line-height: 16px;
        font-style: italic;
    }
    
    .authorDescription h3 {
        margin: 0;
        font-size: 10px;
        line-height: 10px;
        text-transform: uppercase;
    }
    
    .single .authorBlock {
        border-top: 1px solid #84a4c5;
        border-bottom: 1px solid #84a4c5; 
        padding: .5em 0;
    }
    
    .authorDescription .authorSocial {
        font-size: 12px;
    }
    
    .authorDescription, .donatieForm {
        padding: .5em 0;
    }
    
    .donatieForm {
        font-size: 11px;
        line-height: 16px;
        color: #4975a3;
        padding: 0 0 .5em 0;
    }  
    
    .donatieForm .knoppenBlock {
        border-bottom: 1px solid #84a4c5;
        padding-bottom: 1em;
        margin-bottom: 1em
    }
    
    .donatieForm .subtextbig, .donatieForm .subtextbig a {
        font-size: 10px;
     }  
     
     .donatieForm h3 {
         font-size: 14px;
         margin: 0;
     }
     
     .donatieForm .subtext, .donatieForm .subtext a { 
        font-size: 8px;
        font-style: italic;
     }    
     
     .page-template-page-dossiers article.image .articleContent p {
         padding: 0 1em 0 1em;
     }   
     
     .page-template-page-dossiers article.image .articleContent {
         padding-bottom: 0.1em;
     }  

     .mainContent h6 {
        width: calc(100% - 40px);
        margin: 1em 0 1em 0;
     }  
}