Fellow email developers,

I've got a rather annoying problem with the Gmail App.
I have Android V7 on my phone with Gmail App version 7.9.10
My customer has Android V7.1+ on phone with Gmail App version 7.9.10.

In my mail I have some parts hidden on desktop version. They are only shown on mobile version through clickable checkbox. The email is forced on desktop view. On my Gmail App these parts are hidden. But on the Gmail App of my clients these parts are visible.

My question: Is it a special setting of Gmail App itself are is something changed since Android V7.1 that made this happen? And what can I do about it?

What I see:

What customer sees:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" 
 xmlns:v="urn:schemas-microsoft-com:vml"
 xmlns:o="urn:schemas-microsoft-com:office:office">
<head>  
<link rel="stylesheet" href="https://vicinity.picsrv.net/PxResources/UI/17.40/styles/styles.35f11dff9927b73d1eefc4292c6a351f.css" type="text/css"/> 


<!--[if gte mso 9]><xml>
 <o:OfficeDocumentSettings>
  <o:AllowPNG/>
  <o:PixelsPerInch>96</o:PixelsPerInch>
 </o:OfficeDocumentSettings>
</xml><![endif]-->  

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="initial-scale=1.0" />

        <title>Voetbalshop</title>

        <style type="text/css">

          /* General CSS */
            #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" button. */
            .ReadMsgBody { width: 100%; background-color: #bebebe;}
            .ExternalClass {width: 100%; background-color: #bebebe;}
            .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height:100%;}
            body {-webkit-text-size-adjust:100%; -ms-text-size-adjust:none; margin:0; padding:0; width:100% !important; min-width: 100% !important}
            .yshortcuts a {border-bottom: none !important;}
            table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;}  /* Force Hotmail to display emails at full width */  
            table td{border-collapse:collapse; margin: 0; padding: 0;}
            img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}

          /* Template specific CSS */

            body { 
                background-color: #ffffff; 
            }

           body { margin:0 !important; }
      div[style*="margin: 16px 0"] { margin:0 !important; }

             a, a:link, a:active {
             color: #464646; 
             text-decoration: underline;
            }

            .imageblockcontainer img,
       img
          { max-width: 100%; display: block }


       *[id]#mobile-checkbox:checked + table #menu-wrapper,  *[id]#klantenservice-checkbox:checked + table #menu-klantenservice, *[id]#bezorging-checkbox:checked + table #menu-bezorging
      {
       max-height: 600px !important;
      }



          /* GENERAL VIDEO SETTINGS */    

     @media screen and (-webkit-min-device-pixel-ratio: 0) {
       div[class="video-wrap"]{
       height: 200px;
       position: relative;
       overflow: hidden;
       padding:0;
       margin:0;}

        video[class="video"]{
        min-height: 100%;
        min-width: 580px;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        display:inline-block !important;
            }    

        div[class="overlay"]{     
        height: 100%;
        min-height: 100%;
        position: relative;
        margin: 0 auto;
        padding: 0 20px;
        z-index:3;
            }    

       }   

       /* iPAD MEDIA QUERY */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
video[class="video"]{display: none !important;z-index:-1;}
}

/* iPAD 1 & 2, iPAD MINI MEDIA QUERY */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
video[class="video"]{display: none !important;z-index:-1;}
}

/* RETINA iPAD MEDIA QUERY */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
video[class="video"]{display: none !important;z-index:-1;}
}

/* iPHONE 5 MEDIA QUERY */
@media screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 1){
video[class="video"]{display: none !important;z-index:-1;}
}

/* iPHONE 5S MEDIA QUERY */
@media screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2){
video[class="video"]{display: none !important;z-index:-1;}
}

/* iPHONE 2G/3G/3GS MEDIA QUERY */
@media screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 1){
video[class="video"]{display: none !important;z-index:-1;}
}

/* iPHONE 4/4S MEDIA QUERY */
@media screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
video[class="video"]{display: none !important;z-index:-1;}
}

/* WEBKIT, CHROME, SAFARI MEDIA QUERY @ 600px */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (max-width: 600px) {
div[class="video-wrap"]{
height: 200px !important;
min-width: 100% !important;}
}

/* WEBKIT, CHROME, SAFARI MEDIA QUERY @ 480px*/
@media screen and (-webkit-min-device-pixel-ratio: 0) and (max-width: 480px) {
div[class="video-wrap"]{
height: 200px !important;}
video[class="video"]{
top:-75px;
left:-200px;}
}          

          /* END GENERAL SETTING */

 /* SLIDER */



.sliderFallback:hover {opacity:0.85;filter:alpha(opacity=85);}

a#rotator img {
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out; 
-o-transition: all 1s ease-in-out; 
-ms-transition: all 1s ease-in-out; 
}

a#rotator img:hover { 
-webkit-transform: rotate(360deg); 
-moz-transform: rotate(360deg); 
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg); 
}

.sliderFallback { -webkit-animation: disapear 10s infinite; -moz-animation: disapear 10s infinite; -o-animation: disapear 10s infinite; animation: disapear 10s infinite; }

@-webkit-keyframes disapear {
    0% {opacity: 0;}
    100% {opacity: 0;}
    }

@-moz-keyframes disapear {
    0% {opacity: 0;}
    100% {opacity: 0;}
}

@keyframes disapear {
    0% {opacity: 0;}
    100% {opacity: 0;}
    }
@keyframes disapear {
    0% {opacity: 0;}
    100% {opacity: 0;}
    }

#slider_theme.activeSlider{
    position: relative;
    width: 100%;
    overflow: hidden;
    min-height: 100px;
    height: auto;
}

#slider_theme.activeSlider .control{
    position: relative;
    left: 0px;
    white-space:nowrap;
    animation: slider-navigate 10s infinite;
    -webkit-animation: slider-navigate 10s infinite;
    -moz-animation: slider-navigate 10s infinite;
    -o-animation: slider-navigate 10s infinite;
    animation: slider-navigate 10s infinite;
    font-size: 0px;
    width: 100%;
}

#slider_theme .control img{
    margin: 0px;
    padding: 0px;
    display: inline-block;
    vertical-align: middle;
}


#slider_theme .control img:first-child{
    width: 100%;
}

#slider_theme.activeSlider .control img{
    -moz-animation: show-width 10s infinite;
    -webkit-animation: show-width 10s infinite;
    -o-animation: show-width 10s infinite;
    animation: show-width 10s infinite;
}

@keyframes show-width {
    0%{ width: 25%; max-width: 25%; }
    100%{ width: 25%; max-width: 25%; }
}

@-moz-keyframes show-width {
    0%{ width: 25%; max-width: 25%; }
    100%{ width: 25%; max-width: 25%; }
}

@-webkit-keyframes show-width {
    0%{ width: 25%; max-width: 25%; }
    100%{ width: 25%; max-width: 25%; }
}

@-o-keyframes show-width {
    0%{ width: 25%; max-width: 25%; }
    100%{ width: 25%; max-width: 25%; }
}

@keyframes slider-navigate {
    0%{ left: 0%; display: block; width: 400%; }
    12%{ left: 0%; }
    34%{ left: -100%; }
    46%{ left: -100%; }
    68%{ left: -200%; }
    80%{ left: -200%; }
    100%{ left: 0%;  width: 400%; }
}

@-webkit-keyframes slider-navigate {
    0%{ left: 0%; display: block; width: 400%; }
    12%{ left: 0%; }
    34%{ left: -100%; }
    46%{ left: -100%; }
    68%{ left: -200%; }
    80%{ left: -200%; }
    100%{ left: 0%;  width: 400%; }
}

@-moz-keyframes slider-navigate {
    0%{ left: 0%; display: block; width: 400%; }
    12%{ left: 0%; }
    34%{ left: -100%; }
    46%{ left: -100%; }
    68%{ left: -200%; }
    80%{ left: -200%; }
    100%{ left: 0%;  width: 400%; }
}

@-o-keyframes slider-navigate {
    0%{ left: 0%; display: block; width: 400%; }
    12%{ left: 0%; }
    34%{ left: -100%; }
    46%{ left: -100%; }
    68%{ left: -200%; }
    80%{ left: -200%; }
    100%{ left: 0%;  width: 400%; }
}

body[yahoo] #slider_theme .control img{
    display: none;
}

body[yahoo] #slider_theme .control img:first-child{
    display: block !important;
}  

                      /* END SLIDER */          

   @media screen and (max-width: 600px) {
       span[class="Resize"]{
       width: 100% !important; 
    }    
  }        

  @media (min-width: 414px) and (max-width: 480px){

   /* BACKGROUND IMAGE */       

   table[class="BGIMAGE"]        
    {         
    background: url('BGIMAGE_394.jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 394px !important;      
    height: auto !important;         
    }    

     /* BACKGROUND VIDEO */       


    table[class="BGVIDEO"]        
    {         
    background: url('BGVIDEO_394jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 394px !important;      
    height: auto !important;         
    } 

        }

  @media (min-width: 375px) and (max-width: 413px){

  /* BACKGROUND IMAGE */       

   table[class="BGIMAGE"]        
    {         
    background: url('BGIMAGE_355.jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 355px !important;      
    height: auto !important;         
    }    

     /* BACKGROUND VIDEO */       

    table[class="BGVIDEO"]        
    {         
    background: url('BGVIDEO_355.jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 355px !important;      
    height: auto !important;         
    }       

        }

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

   /* BACKGROUND IMAGE */       

   table[class="BGIMAGE"]        
    {         
    background: url('BGIMAGE_300.jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 300px !important;      
    height: auto !important;         
    }    

     /* BACKGROUND VIDEO */       


    table[class="BGVIDEO"]        
    {         
    background: url('BGVIDEO_300.jpg') no-repeat !important;  
    min-width: 0 !important;          
    width: 300px !important;      
    height: auto !important;         
    } 

    td[class="ImageMob"]{
     width: 100% !important;
      height: auto !important;
    }

          }

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


   /* GENERAL */        


    table[class="Wrapper"],
    table[class="Resize"],
    td[class="Image"] img,
    td[class="Image2"] img
    {
    min-width: 0px !important;          
    width: 100% !important;      
    height: auto !important;         
    }


    table[class="Resize2"]        
    {
    min-width: 0px !important;          
    width: 48% !important;      
    height: auto !important;         
    }        

   table[class="Hide"], td[class="Hide"], span[class="Hide"]{
      display: none;
      visibility: hidden;
   }

   table[class="Whatsapp"], td[class="Whatsapp"]{
       display: block !important;
   }              

   td[class="Alignright"]{
     text-align: right !important;
   }      


   td[class="padding"]{
     padding-left: 20px !important;
     padding-right: 20px !important;
   }

    span[class="Resize"]{
       width: 276px !important; 
    }

            *[class].container{
               min-width: 0 !important;

       -moz-text-size-adjust: none;
       -ms-text-size-adjust: none;
       -webkit-text-size-adjust: none;

       width: 100% !important;
            }

            label[class="mobile-label"], div[class="mobile-label"]{
              display: block !important; 
            }     


    table[class="mobile-label"]{
              display: inline-table !important;
            }     

    td[class="mobile-label"]{
              display: table-cell !important;
            }     

          }


</style>  


  <!--[if mso]>
   <style type="text/css">
    /* mso adjustment for tamed superscripts */
    sup
    {
     font-size: 100% !important;
    }
   </style>
  <![endif]-->




</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">


<!-- SPIPPET + WEBVERSION -->  

<table width="100%" style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f0f0f0">
 <tr>
  <td align="center">

    <table style="width:660px" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f0f0f0" class="Wrapper">
     <tr>
        <td height="2" style="mso-line-height-rule: exactly; line-height: 2px; font-size: 1px">
              &nbsp;
        </td>
     </tr>
      <tr>
      <td class="Hide" width="20">&nbsp;</td>
      <td>

        <table style="width:620px; min-width: 620px" width="620" border="0" cellpadding="0" cellspacing="0" bgcolor="#f0f0f0" class="Hide">
          <tr>
          <td align="center" style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size:9px; color:#000000; ">Voor 23:00 uur besteld = morgen in huis | Achteraf betalen | Gratis verzend- en retourservice&nbsp;|&nbsp;<a href="#" style="text-decoration: none; color:#000000"><font color="#000000">webversie</font></a></td>
            <td class="Hide" width="20">&nbsp;</td>
          </tr>
          </table>

         </td>
       <td class="Hide" width="20">&nbsp;</td>
      </tr>
      <tr>
        <td height="2" style="mso-line-height-rule: exactly; line-height: 2px; font-size: 1px">
              &nbsp;
        </td>
     </tr>
    </table>

   </td>
  </tr>
 </table>

<!-- END SPIPPET + WEBVERSION -->


<!-- HEADER -->


   <table bgcolor="#f0f0f0" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-spacing: 0; table-layout: fixed;" width="100%">
    <tr>
     <td>

       <table bgcolor="#f0f0f0" align="center" border="0" cellpadding="0" cellspacing="0" class="container" style="border-collapse: collapse; border-spacing: 0; margin: auto; width: 660px" width="660">
        <tr>
          <td class="Hide" width="20">&nbsp;</td>
          <td align="center">

            <table bgcolor="#ff6600" align="center" border="0" cellpadding="0" cellspacing="0" class="Resize" style="border-collapse: collapse; border-spacing: 0; margin: auto; width: 620px; min-width: 620px" width="620">
        <tr>
            <td style="min-width: 76px">


             <!--[if ! mso]>--> 

         <label for="mobile-checkbox" class="mobile-label" style="background-color: #ff6600; cursor: pointer; display: none; float: left; padding: 25px; -webkit-tap-highlight-color: transparent; width: 26px;">
          <b style="background-color: #ffffff; display: block; height: 3px;"></b>
          <b style="margin-top: 5px; background-color: #ffffff; display: block; height: 3px;"></b>
          <b style="margin-top: 5px; background-color: #ffffff; display: block; height: 3px;"></b>
         </label>


            <!-- <![endif]--> 


         </td>
        <td>
         <table align="center" width="100%" class="logo" border="0" cellpadding="10" cellspacing="0" style="border-collapse: collapse; border-spacing: 0;">
          <tr>
            <td align="center">
              <table align="left" width="100%" class="logo-center" border="0" cellpadding="10" cellspacing="0" style="border-collapse: collapse; border-spacing: 0;">
                <tr>
                  <td align="center" style="padding-top: 10px; padding-bottom: 10px">
                  <a href="" style="text-decoration: none">
                    <img src="https://pic.vicinity.nl/4212/0/18916/vs-logo.png" alt="voetbalshop" width="100" height="20" border="0" style="display: block; border: 0" />
                   </a>
                 </td>
                </tr>
              </table>
            </td>
          </tr>
         </table>

       </td> 
          <td style="min-width: 76px">

              <!--[if ! mso]>--> 

          <div class="mobile-label" style="display: none; float: right; padding: 25px; -webkit-tap-highlight-color: transparent; width: 26px;">

              <a href="" style="text-decoration: none">
                    <img src="https://pic.vicinity.nl/4212/0/18415/searchbutton.png" alt="sirhotels logo" width="24" height="26" border="0" style="display: block; border: 0" />
                   </a>

            </div>

            <!-- <![endif]--> 

          </td>
      </tr>
    </table>



   <!--[if ! mso]>--> 

       <table align="right" width="620" border="0" class="container" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
         <tr>
           <td align="center">

         <input id="mobile-checkbox" style="display: none !important; max-height: 0" type="checkbox">


             <table align="center" border="0" cellpadding="0" cellspacing="0" class="container" style="border-collapse: collapse; border-spacing: 0; margin: auto;" width="620">
               <tr>
                 <td align="center">


         <table align="center" width="100%" border="0" cellpadding="0" cellspacing="0" class="menu" bgcolor="#ffffff">
           <tr>
           <td align="center">
             <div id="menu-wrapper" style="max-height: 0; overflow: hidden; -moz-transition: max-height .25s linear;-o-transition: max-height .25s linear; -webkit-transition: max-height .25s linear; transition: max-height .25s linear;">

               <table align="center" width="100%" border="0" cellpadding="10" cellspacing="0" class="menu" style="border-collapse: collapse; border-spacing: 0;">
                 <tr>
                  <td height="15" style="mso-line-height-rule: exactly; line-height: 15px; font-size: 1px;">&nbsp;</td>
                 </tr>
                 <tr>
                   <td align="center" style="padding: 5px" nowrap>
                    <span style="border-bottom: 1px solid #ff6600; padding: 5px">
                      <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 13px; line-height: 18px; color: #000000; font-weight: bold">
                        MENU
                      </font>
                    </span>
                  </td>
                 </tr>
                </table>

               <table align="center" width="100%" border="0" cellpadding="10" cellspacing="0" class="menu" style="border-collapse: collapse; border-spacing: 0;">
                 <tr>
                  <td align="center" nowrap>
                    <a href="" style="text-decoration: none; text-align: center; display: block; padding: 5px;" class="menu-item">
                      <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 18px; color: #000000;">
                        VOETBALSCHOENEN
                      </font>
                    </a>
                  </td>
                 </tr>
                </table>

    <table align="center" width="100%" border="0" cellpadding="10" cellspacing="0" class="menu" style="border-collapse: collapse; border-spacing: 0;">
                 <tr>
                  <td align="center" nowrap>
                    <a href="" style="text-decoration: none; text-align: center; display: block; padding: 5px;" class="menu-item">
                      <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 18px; color: #000000;">
                        KLEDING
                      </font>
                    </a>
                  </td>
                 </tr>
                </table>


                <table align="center" width="100%" border="0" cellpadding="10" cellspacing="0" class="menu" style="border-collapse: collapse; border-spacing: 0;">
                 <tr>
                  <td align="center" nowrap>
                    <a href="" style="text-decoration: none; text-align: center; display: block; padding: 5px;" class="menu-item">
                     <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 18px; color: #000000;">
                        ACCESSOIRES
                      </font>
                    </a>
                  </td>
                 </tr>
                </table>

               <table align="center" width="100%" border="0" cellpadding="10" cellspacing="0" class="menu" style="border-collapse: collapse; border-spacing: 0;">
                 <tr>
                  <td align="center" nowrap>
                    <a href="" style="text-decoration: none; text-align: center; display: block; padding: 5px;" class="menu-item">
                      <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 18px; color: #000000;">
                        SALE
                      </font>
                    </a>
                  </td>
                 </tr>
                 <tr>
                  <td height="10" style="mso-line-height-rule: exactly; line-height: 10px; font-size: 1px;">&nbsp;</td>
                 </tr>
                </table>

            </div>

           </td>
          </tr>
         </table>

            </td>
          </tr>
         </table>

        </td>
       </tr>
      </table>

             <!-- <![endif]--> 



        </td>
          <td class="Hide" width="20">&nbsp;</td>
    </tr> 
</table>   
     </td>
    </tr> 
</table>     

  <!-- END HEADER -->   


      <!-- FOOTER -->

<table width="100%" style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f0f0f0">
 <tr>
  <td align="center">

    <table style="width:660px" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f0f0f0" class="Wrapper">
      <tr>
      <td class="Hide" width="20">&nbsp;</td>
      <td>

        <table  style="width:620px; min-width: 620px" width="620" class="Resize" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f0f0f0">
          <tr>
            <td align="center">

              <!-- SOCIALS -->

               <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff">
                <tr>
                  <td align="center" bgcolor="#3b5998">
                    <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center">
                  <tr>
                         <td height="10" style="mso-line-height-rule: exactly; line-height: 10px; font-size: 1px">&nbsp;</td>
                      </tr> 
                      <tr>
                          <td align="center">
                            <a href="" style="text-decoration: none">
                            <img src="https://pic.vicinity.nl/4212/0/18410/facebook.png" alt="sirhotels logo" width="50" height="50" border="0" style="display: block; border: 0" />
                           </a>
                          </td>
                      </tr>
                      <tr>
                         <td height="10" style="mso-line-height-rule: exactly; line-height: 10px; font-size: 1px">&nbsp;</td>
                      </tr> 
                    </table>
                  </td>
                  <td align="center" bgcolor="#417199">
                    <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center">
                  <tr>
                         <td height="10" style="mso-line-height-rule: exactly; line-height: 10px; font-size: 1px">&nbsp;</td>
                      </tr> 
                      <tr>
                          <td align="center">
                            <a href="" style="text-decoration: none">
                            <img src="https://pic.vicinity.nl/4212/0/18411/instagram.png" alt="sirhotels logo" width="50" height="50" border="0" style="display: block; border: 0" />
                           </a>
                          </td>
                      </tr>
                      <tr>
                         <td height="10" style="mso-line-height-rule: exactly; line-height: 10px; font-size: 1px">&nbsp;</td>
                      </tr> 
                    </table>
                  </td>
                 </tr>

              </table>

              <!-- END SOCIALS -->

              <!-- FOOTERMENU -->

               <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                 <tr>
                  <td>


                    <table style="width:100%; border-bottom: 1px solid #e5e5e5" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                      <tr>
                         <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                      </tr> 
                      <tr>
                        <td width="30">&nbsp;</td>
                        <td align="left">
                          <a href="" style="text-decoration: none">
                           <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000000; letter-spacing: -0.00em">
                           Klantenservice
                          </font>
                          </a>
                        </td>
                        <td align="right">

                          <a href="" style="text-decoration: none">
                          <span class="Hide">
                            <img src="https://pic.vicinity.nl/4212/0/18524/orange-arrow-2.png" alt="" width="20" height="20" border="0" style="display: block; border: 0" />
                          </span>
                           </a> 
                            <!--[if ! mso]>--> 

                            <label for="klantenservice-checkbox" class="mobile-label" style="cursor: pointer; display: none">
                              <img src="https://pic.vicinity.nl/4212/0/18414/orange-arrow.png" alt="" width="20" height="20" border="0" style="border: 0" />
                            </label>

                           <!-- <![endif]--> 
                        </td>
                        <td width="30">&nbsp;</td>
                      </tr>
                       <tr>
                         <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                      </tr> 
                    </table>



                      <!--[if ! mso]>--> 



                   <input id="klantenservice-checkbox" style="display: none !important; max-height: 0" type="checkbox">


                       <table align="center" border="0" cellpadding="0" cellspacing="0" class="mobile-label" style="display: none; border-collapse: collapse; border-spacing: 0; margin: auto;" width="100%">
                         <tr>
                           <td align="center" class="mobile-label" style="display: none;">

                             <!-- menu item 1 -->


                                 <div id="menu-klantenservice" class="mobile-label" style="display: none; max-height: 0; overflow: hidden; -moz-transition: max-height .25s linear;-o-transition: max-height .25s linear; -webkit-transition: max-height .25s linear; transition: max-height .25s linear;">

                                   <table class="mobile-label" style="display: none; width:100%; border-bottom: 1px solid #e5e5e5" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                                          <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                          <tr>
                                            <td width="30">&nbsp;</td>
                                            <td align="left">
                                              <a href="" style="text-decoration: none">
                                               <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000000; letter-spacing: -0.00em">
                                               Veelgestelde vragen
                                              </font>
                                              </a>
                                            </td>
                                            <td align="right">
                                             <a href="" style="text-decoration: none">
                                                <img src="https://pic.vicinity.nl/4212/0/18524/orange-arrow-2.png" alt="" width="20" height="20" border="0" style="display: block; border: 0" />
                                              </a>

                                            </td>
                                            <td width="30">&nbsp;</td>
                                          </tr>
                                           <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                        </table>

                                </div>



                             <!-- menu item1 -->

                              <!-- menu item 2 -->

                                 <div id="menu-klantenservice" class="mobile-label" style="display: none; max-height: 0; overflow: hidden; -moz-transition: max-height .25s linear;-o-transition: max-height .25s linear; -webkit-transition: max-height .25s linear; transition: max-height .25s linear;">

                                   <table class="mobile-label" style="display: none; width:100%; border-bottom: 1px solid #e5e5e5" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                                          <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                          <tr>
                                            <td width="30">&nbsp;</td>
                                            <td align="left">
                                              <a href="" style="text-decoration: none">
                                               <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000000; letter-spacing: -0.00em">
                                               Betalen
                                              </font>
                                              </a>
                                            </td>
                                            <td align="right">
                                             <a href="" style="text-decoration: none">
                                                <img src="https://pic.vicinity.nl/4212/0/18524/orange-arrow-2.png" alt="" width="20" height="20" border="0" style="display: block; border: 0" />
                                              </a>

                                            </td>
                                            <td width="30">&nbsp;</td>
                                          </tr>
                                           <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                        </table>

                                </div>



                             <!-- menu item 2 -->

                             <!-- menu item 3 -->

                                 <div id="menu-klantenservice" class="mobile-label" style="display: none; max-height: 0; overflow: hidden; -moz-transition: max-height .25s linear;-o-transition: max-height .25s linear; -webkit-transition: max-height .25s linear; transition: max-height .25s linear;">

                                   <table class="mobile-label" style="display: none; width:100%; border-bottom: 1px solid #e5e5e5" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                                          <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                          <tr>
                                            <td width="30">&nbsp;</td>
                                            <td align="left">
                                              <a href="" style="text-decoration: none">
                                               <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000000; letter-spacing: -0.00em">
                                               Verzendinformatie
                                              </font>
                                              </a>
                                            </td>
                                            <td align="right">
                                             <a href="" style="text-decoration: none">
                                                <img src="https://pic.vicinity.nl/4212/0/18524/orange-arrow-2.png" alt="" width="20" height="20" border="0" style="display: block; border: 0" />
                                              </a>

                                            </td>
                                            <td width="30">&nbsp;</td>
                                          </tr>
                                           <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                        </table>

                                </div>



                             <!-- menu item 3 -->

                             <!-- menu item 4 -->

                                 <div id="menu-klantenservice" class="mobile-label" style="display: none; max-height: 0; overflow: hidden; -moz-transition: max-height .25s linear;-o-transition: max-height .25s linear; -webkit-transition: max-height .25s linear; transition: max-height .25s linear;">

                                   <table class="mobile-label" style="display: none; width:100%; border-bottom: 1px solid #e5e5e5" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                                          <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                          <tr>
                                            <td width="30">&nbsp;</td>
                                            <td align="left">
                                              <a href="" style="text-decoration: none">
                                               <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000000; letter-spacing: -0.00em">
                                               Retourneren
                                              </font>
                                              </a>
                                            </td>
                                            <td align="right">
                                             <a href="" style="text-decoration: none">
                                                <img src="https://pic.vicinity.nl/4212/0/18524/orange-arrow-2.png" alt="" width="20" height="20" border="0" style="display: block; border: 0" />
                                              </a>

                                            </td>
                                            <td width="30">&nbsp;</td>
                                          </tr>
                                           <tr>
                                             <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                                          </tr> 
                                        </table>

                                </div>


                             <!-- menu item 4 -->


                  </td>
                 </tr>
                </table>

             <!-- <![endif]--> 

                     </td>
                 </tr>
              </table> 


              <!-- END FOOTERMENU -->

              <!-- LOGOS -->

               <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff">
                <tr>
                 <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px; border-top: 1px solid #e5e5e5">&nbsp;</td>
              </tr> 
                 <tr>
                  <td align="center">

                   <table style="width:377px" width="377" class="Resize" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff">
                        <tr>
                          <td align="center" class="ImageMob">
                              <img src="https://pic.vicinity.nl/4212/0/21339/footer-logos.jpg" alt="thuiswinkel logo" width="377" height="54" border="0" style="display: block; border: 0" />
                          </td>
                        </tr>
                      </table>

                  </td>
                 </tr>
                 <tr>
                 <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
              </tr> 
              </table>

              <!-- END LOGOS -->

               <!-- UNSUBSCRIBE -->

               <table style="width:100%" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                <tr>
                 <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
              </tr> 
                 <tr>
                  <td align="center">

                   <table style="width:620px" width="620" class="Resize" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#f7f7f7">
                       <tr>
                          <td align="center">
                            <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 10px; line-height: 14px; color: #000000; letter-spacing: -0.00em">
                              Eventuele prijswijzigingen en/of typefouten onder voorbehoud.<br />
                              Je ontvangt deze e-mail van Voetbalshop.nl op: niels@zjam.nl.</font>
                              </td>
                        </tr>
                             <tr>
                 <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
              </tr>  
                     <tr>
                  <td align="center">
                              <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 10px; line-height: 14px; color: #000000; letter-spacing: -0.00em">
                                <a href="" style="text-decoration: underline">Voeg ons toe aan jouw adressenboek</a> | <a href="" style="text-decoration: underline">
                                Afmelden van de nieuwsbrief</a>
                              </font>
                          </td>
                        </tr>
                     <tr>
                       <td height="20" style="mso-line-height-rule: exactly; line-height: 20px; font-size: 1px">&nbsp;</td>
                    </tr>
                      <tr>
                          <td align="center">
                            <font style="font-family: 'Verdana', Geneva, Arial, sans-serif; font-size: 10px; line-height: 14px; color: #000000; letter-spacing: -0.00em">
             Copyright &copy; 2017 Voetbalshop.nl, alle rechten voorbehouden
                            </font>
                          </td>
                        </tr>
                      </table>

                  </td>
                 </tr>
                 <tr>
                  <td height="30" style="mso-line-height-rule: exactly; line-height: 30px; font-size: 1px;">&nbsp;</td>
                 </tr>
              </table>

              <!-- END UNSUBSCRIBE -->


            </td>
          </tr>

         </table>

         </td>
       <td class="Hide" width="20">&nbsp;</td>
      </tr>
    </table>

   </td>
  </tr>
 </table>  

  <!-- END FOOTER -->         

</body>
</html>