/* ----------- iPhone 5, 5S, 5C, 5SE, 6, 7, 8, 8 PLUS ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 767px) {

  .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    padding: .5em .5em;
  }

  .poulestand tr th, .periodestand tr th, .pouleuitslagen tr th, .poule-programma tr th, .programma tr th, .uitslagen tr th, .afgelastingen tr th, .team-indeling tr th {
    padding:0.125rem 0.125rem;
    font-size: 0.825rem;
  }
  .poulestand tr td, .periodestand tr td, .pouleuitslagen tr td, .poule-programma tr td,  .programma tr td,  .uitslagen tr td,  .afgelastingen tr td, .team-indeling tr td  {
    padding:0.125rem 0.125rem;
    font-size: 0.825rem;
  }
  .poulestand tr td span, .periodestand tr td span, .pouleuitslagen tr td span, .poule-programma tr td span,  .programma tr td span,  .uitslagen tr td span,  .afgelastingen tr td span, .team-indeling tr td span  {
    font-size: 0.825rem;
  }

  .clublogo {
      max-height: 15px;
      max-width: 15px;
  }

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 767px)
  and (orientation: portrait) {
  
  .programma .wedstrijddatum {
    width: 55px;
  }
  .programma .spwp_teamcode {
    width: 20px;
  }
  .programma .thuisteam,
  .programma .uitteam {
    width: 60px;
  }
  .programma .veld {
    display: none;
  }
  .programma .status {
    display: none;
  }
  .programma .kleedkamerthuisteam {
    display: none;
  }
  .programma .kleedkameruitteam {
    display: none;
  }


  .uitslagen .wedstrijddatum {
    width: 35px;
  }
  .uitslagen .spwp_teamcode {
    width: 20px;
  }
  .uitslagen .thuisteam,
  .uitslagen .uitteam {
    width: 75px;
  }
  .uitslagen .uitslag {
    width: 35px;
    text-align: center;
  }
  .uitslagen .competitiesoort {
    display: none;
  }


  .poule-programma .wedstrijddatum {
    width: 55px;
  }
  .poule-programma .spwp_teamcode {
    width: 20px;
  }
  .poule-programma .thuisteam,
  .poule-programma .uitteam {
    width: 60px;
  }
  .poule-programma .accommodatie {
    display: none;
  }


  .pouleuitslagen .wedstrijddatum {
    width: 55px;
  }
  .pouleuitslagen .spwp_teamcode {
    width: 20px;
  }
  .pouleuitslagen .thuisteam,
  .pouleuitslagen .uitteam {
    width: 60px;
  }
  .pouleuitslagen .uitslag {
    text-align: center;
    width: 35px;
  }

  .poulestand .positie {
    width: 20px;
  }
  .poulestand .spwp_teamcode {
    width: 20px;
  }
  .poulestand .gespeeldewedstrijden,
  .poulestand .punten {
    width: 40px;
  }
  
  .poulestand .gewonnen,
  .poulestand .gelijk,
  .poulestand .verloren,
  .poulestand .doelpuntenvoor,
  .poulestand .doelpuntentegen,
  .poulestand .doelsaldo,
  .poulestand .verliespunten {
    display: none;
  }
  
  .periodestand .positie {
    width: 20px;
  }
  .periodestand .spwp_teamcode {
    width: 20px;
  }

  .periodestand .aantalwedstrijden,
  .periodestand .totaalpunten {
    width: 40px;
  }

  .periodestand .gewonnen,
  .periodestand .gelijkspel,
  .periodestand .verloren,
  .periodestand .doelpuntenvoor,
  .periodestand .tegendoelpunten,
  .periodestand .doelsaldo,
  .periodestand .verliespunten {
    display: none;
  }
  

}

/*  Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 767px)
  and (orientation: landscape) {

  .programma .wedstrijddatum {
    width: 65px;
  }
  .programma .spwp_teamcode {
    width: 25px;
  }
  .programma .thuisteam,
  .programma .uitteam {
    width: 125px;
  }
  .programma .status {
    width: 60px;
    text-align: left;
  }
  .programma .kleedkamerthuisteam {
    width: 50px;
    text-align: center;
    display: none;
  }
  .programma .kleedkameruitteam {
    width: 50px;
    text-align: center;
    display: none;
  } 
  .programma .veld {
    width: 100px;
  }

  .uitslagen .wedstrijddatum {
    width: 65px;
  }
  .uitslagen .spwp_teamcode {
    width: 25px;
  }
  .uitslagen .thuisteam,
  .uitslagen .uitteam {
    width: 125px;
  }
  .uitslagen .uitslag {
    width: 50px;
      text-align: center;
  }
  .uitslagen .competitiesoort {
      text-align: center;
  }
    
  
  .poule-programma .wedstrijddatum {
    width: 65px;
  }
  .poule-programma .spwp_teamcode {
    width: 25px;
  }
  .poule-programma .thuisteam,
  .poule-programma .uitteam {
    width: 125px;
  }
  .poule-programma .accommodatie {
    width: 135px;
  }


  .pouleuitslagen .wedstrijddatum {
    width: 65px;
  }
  .pouleuitslagen .spwp_teamcode {
    width: 25px;
  }
  .pouleuitslagen .thuisteam,
  .pouleuitslagen .uitteam {
    width: 125px;
  }
  .pouleuitslagen .uitslag {
    width: 135px;
  }
  

  .poulestand .positie {
    width: 20px;
  }
  .poulestand .spwp_teamcode {
    width: 25px;
  }
  .poulestand .gespeeldewedstrijden,
  .poulestand .gewonnen,
  .poulestand .gelijk,
  .poulestand .verloren,
  .poulestand .doelpuntenvoor,
  .poulestand .doelpuntentegen,
  .poulestand .doelsaldo,
  .poulestand .verliespunten,
  .poulestand .punten {
    width: 35px;
  }

  .periodestand .positie {
    width: 20px;
  }
  .periodestand .spwp_teamcode {
    width: 25px;
  }
  .periodestand .aantalwedstrijden,
  .periodestand .gewonnen,
  .periodestand .gelijkspel,
  .periodestand .verloren,
  .periodestand .doelpuntenvoor,
  .periodestand .tegendoelpunten,
  .periodestand .doelsaldo,
  .periodestand .verliespunten,
  .periodestand .totaalpunten {
    width: 35px;
  }

}


@media only screen and (min-width: 768px) and (max-width: 1024px) {
  
  .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    padding: 1em .5em;
  }

  .poulestand tr th, .periodestand tr th, .pouleuitslagen tr th, .poule-programma tr th, .programma tr th, .uitslagen tr th, .afgelastingen tr th, .team-indeling tr th {
    padding:0.25rem 0.125rem;
    font-size: 1rem;
  }
  .poulestand tr td, .periodestand tr td, .pouleuitslagen tr td, .poule-programma tr td,  .programma tr td,  .uitslagen tr td,  .afgelastingen tr td, .team-indeling tr td  {
    padding:0.25rem 0.125rem;
    font-size: 1rem;
  }
  .poulestand tr td span, .periodestand tr td span, .pouleuitslagen tr td span, .poule-programma tr td span,  .programma tr td span,  .uitslagen tr td span,  .afgelastingen tr td span, .team-indeling tr td span  {
    font-size: 1rem;
  }

  /* Programma */
  /*-----------*/
  .programma .wedstrijddatum {
    width: 110px;
  }
  .programma .spwp_teamcode {
    width: 40px;
  }
  .programma .thuisteam,
  .programma .uitteam {
    width: 175px;
  }
  .programma .status {
    width: 100px;
  }
  .programma .kleedkamerthuisteam,
  .programma .kleedkameruitteam {
    width: 75px;
  }

  /* Poule Programma */
  /*-----------------*/
  .poule-programma .wedstrijddatum {
    width: 110px;
  }
  .poule-programma .spwp_teamcode {
    width: 40px;
  }
  .poule-programma .thuisteam,
  .poule-programma .uitteam {
    width: 175px;
  }

  /* Uitslagen */
  /*-----------*/
  .uitslagen .wedstrijddatum {
    width: 110px;
  }
  .uitslagen .spwp_teamcode {
    width: 40px;
  }
  .uitslagen .thuisteam,
  .uitslagen .uitteam {
    width: 175px;
  }

  /* Poule Uitslagen */
  /*-----------------*/
  .pouleuitslagen .wedstrijddatum {
    width: 110px;
  }
  .pouleuitslagen .spwp_teamcode {
    width: 40px;
  }
  .pouleuitslagen .thuisteam,
  .pouleuitslagen .uitteam {
    width: 175px;
  }


  /* Poulestand */
  /*------------*/
  .poulestand .spwp_teamcode {
    width: 40px;
  }
  .poulestand .gespeeldewedstrijden,
  .poulestand .gewonnen,
  .poulestand .gelijk,
  .poulestand .verloren,
  .poulestand .doelpuntenvoor,
  .poulestand .doelpuntentegen,
  .poulestand .doelsaldo,
  .poulestand .verliespunten,
  .poulestand .punten {
    width: 40px;
  }

  /* Periodestand */
  /*--------------*/
  .periodestand .spwp_teamcode {
    width: 40px;
  }

  .periodestand .aantalwedstrijden,
  .periodestand .gewonnen,
  .periodestand .gelijkspel,
  .periodestand .verloren,
  .periodestand .doelpuntenvoor,
  .periodestand .tegendoelpunten,
  .periodestand .doelsaldo,
  .periodestand .verliespunten,
  .periodestand .totaalpunten {
    width: 40px;
  } 
    
}

@media only screen and (min-width: 1024px) {
  
  .poulestand tr th, .periodestand tr th, .pouleuitslagen tr th, .poule-programma tr th, .programma tr th, .uitslagen tr th, .afgelastingen tr th, .team-indeling tr th {
    padding:0.25rem 0.125rem;
  }
  .poulestand tr td, .periodestand tr td, .pouleuitslagen tr td, .poule-programma tr td,  .programma tr td,  .uitslagen tr td,  .afgelastingen tr td, .team-indeling tr td  {
    padding:0.25rem 0.125rem;
  }
  
  .poulestand .gespeeldewedstrijden,
  .poulestand .gewonnen,
  .poulestand .gelijk,
  .poulestand .verloren,
  .poulestand .doelpuntenvoor,
  .poulestand .doelpuntentegen,
  .poulestand .doelsaldo,
  .poulestand .verliespunten,
  .poulestand .punten {
    width: 50px;
  }

  .periodestand .aantalwedstrijden,
  .periodestand .gewonnen,
  .periodestand .gelijkspel,
  .periodestand .verloren,
  .periodestand .doelpuntenvoor,
  .periodestand .tegendoelpunten,
  .periodestand .doelsaldo,
  .periodestand .verliespunten,
  .periodestand .totaalpunten {
    width: 50px;
  }
    
}