/* CSS Document */
@charset "utf-8";

@media (max-width: 800px) {
    
  /* Structure */
  header { height: auto; min-height: 200px; padding-bottom: 0px; }
  header #menu { display: none; }
  header #menu-mobile { display: block; background: #D70808; color: #FFFFFF; text-align: left; width: 98%; padding: 3% 1%; text-align: center; }
  header #logo img { width: 87%; margin: 0px 2% 0px 5%; }
  header #entete { width: 95%; max-width: 95%; margin-top: 20px; }
  header #entete p { text-align: center; }
  #logiciel { display: none; }

  header.panel { width: 100%; padding: 0px; height: auto; min-height: 20px; background: #FFFFFF; border-bottom: solid 2px #f0f0f0; }
  header.panel #header { width: 94%; padding: 10px 3%; height: auto; background: #FFFFFF; font-family: Lato, sans-serif; font-size: 16px; text-align: center; }
  header.panel #header img { width: 200px; }
  header.panel #header #parametres { display: none; }
  header.panel #header #coordonnees { border-left: none; padding-left: 0px; width: 100%; }
  header.panel #header #coordonnees p:not(#select_gestion),   header.panel #header #coordonnees a.floatright { display: none; }
  header.panel #panel_menu { display: block; width: 100%; padding: 0px; height: 50px; background: #000000; }
  header.panel #panel_menu ul { margin: 0px; padding: 0px; list-style: none; }
  header.panel #panel_menu ul li a { display: inline-block; height: 50px; line-height: 45px; margin: 0px; padding: 0px 12px; font-size: 16px; color: #FFFFFF; transition: 0s; }
  header.panel #panel_menu ul li a:hover { background: #D70808; opacity: 1; }
  header.panel #panel_menu ul li select { display: inline-block; width: 100px; height: 30px; margin: 0px; padding: 0px; font-size: 16px; background: #000000 url(../../images/arrow-select.png) no-repeat 99% center; border: none; color: #FFFFFF; transition: 0s; -webkit-appearance: none; -moz-appearance: none; }
  
  footer { min-height: 200px; width: 96%; padding: 2%; font-size: 10px; }
  footer div.floatleft { clear: both; float: none; width: 100%; text-align: center; }
  footer div.floatleft ul li {display: inline; margin: 10px; }
  footer div.floatright { clear: both; float: none; width: 100%; padding-top: 30px; }
  footer div.floatright p { text-align: center; }
  footer div.clear    { padding-top: 30px; }

  #acces { height: auto; }
  #acces .btn-acces { height: auto; width: 99%; }
  #acces .texte-acces { height: auto; min-height: 150px; }

  #avantages .texte-avantages { width: 95%; }
  
  #nis .w50 { width: auto; }
  #nis .content-nis { max-width: unset; }

  #corps { width: 96%; min-height: 400px; height: auto; margin: 5% auto; padding: 2%; background: #FFFFFF; color:#282828; border: none; border-radius:0px; box-shadow: none; }
  #corps .accroche, #panel .accroche { width: 90%; margin: 0px auto; }

  #login-left  { width: 100%; height: 93vh; } /* TODO : Repasser height à 50vh quand on retirera le message de première connexion */
  #login-left #login, #login-left #mdpoublie { margin: 0vh auto; min-height: 30vh; }

  #login-left #premiere-connexion { width: 95%; max-width: 95%; font-size: 14px; }

  #login-right { width: 100%; height: 7h; } /* TODO : Repasser height à 50vh quand on retirera le message de première connexion */

  /* Tableaux */
  table.table-donnees caption { background: #DCDCDC; color: #626568; margin-top: 30px; }
  table.table-donnees caption div.floatleft { margin-left: 0px; width: 100%; padding: 2px; }
  table.table-donnees tr { clear: both; }
  table.table-donnees.floatleft.w49 { width: 100%; margin-bottom: 20px; }
  table.table-donnees.floatright.w49 { width: 100%; }
  table.table-donnees td.sans, table.table-donnees td .popup { display: none; }
  table.table-donnees td:nth-child(odd) { width: 33%; float: left; height: auto; font-size: 11px; }
  table.table-donnees td:nth-child(even) { width: 60%; float: left; height: auto; font-size: 11px; }
  table.table-donnees #photos { width: 95%; float: left; height:auto; }
  table.table-donnees td input[type="text"], table.table-donnees td textarea, table.table-donnees td textarea.large { width: 95%; } 
  table.table-donnees td input[name="fiche_kilometrage"], table.table-donnees td input[name="fiche_pieces"], table.table-donnees td input[name="fiche_mo"], table.table-donnees td input[name="fiche_vrade"], table.table-donnees td input[name="fiche_reparations"] { width: 45%; }
  table.table-donnees td select, table.table-donnees td textarea, table.table-donnees tr.choc td:first-child, table.table-donnees tr.choc td div:first-child { width: 100%; }
  table.table-donnees td.date input[type="text"] { width: 24%; }  
  table.table-donnees td.date_large input[type="text"] { width: 7%; }  
  table.table-donnees td.date_large input[type="text"]:nth-child(3n), table.table-donnees td.date_large input[type="text"]:last-child { width: 13%; }  
  table.table-donnees tr.choc div.w65 div.floatleft.w40:first-child { width: 95%; margin: 0px;  }
  table.table-donnees tr.choc div.w65 div.floatleft.w40:first-child table { margin: 0px auto; }
  table.table-donnees tr.choc div.w65 div.floatleft.w20 { width: 35%; margin: 10px 0px; }
  table.table-donnees tr.choc div.w65 div.floatleft.w40 { width: 60%; margin: 10px 0px;  } 

  table.table-responsive thead { display: none; }
  table.table-responsive { border-bottom: none; }
  table.table-responsive tr { display: block; margin-bottom: 20px; padding-bottom: 20px; /*border-bottom: solid 1px #D0D0D0;*/ }
  /*table.table-responsive tr:nth-child(even):not(.special), table.table-responsive tr:nth-child(odd):not(.special) { background: #FFFFFF; }*/
  table.table-responsive tr:last-child { margin-bottom: 0px; padding-bottom: 0px; border: none; }
  table.table-responsive tr.masque, table.table-responsive td.masque, table.table-responsive th.masque { display: none; }
  table.table-responsive td .m30 { margin-left: 0px; }
  table.table-responsive td { display: block; text-align: right; min-height: 16px; }
  table.table-responsive td:before { content: attr(data-label); float: left; color: #282828; }    
  table.table-responsive td:nth-child(odd) { width: 95%; float: none; }
  table.table-responsive td:nth-child(even) { width: 95%; float: none; }
  table.table-responsive td a.btn-voir, table.table-responsive td a.btn-update, table.table-responsive td input.btn-archivage, table.table-responsive td a.btn-demandephotos, table.table-responsive td a.btn-ddlphotos, table.table-responsive td a.btn-pdf, table.table-responsive td a.btn-euro, table.table-responsive td a.btn-siv { float: right; }
  table.table-responsive td.center { text-align: center; }
  table.table-responsive td .btn-bleu { margin-top: 10px; font-size: 12px; }

  #filtres table.table-responsive tr { margin-bottom: 0px; padding-bottom: 0px; border-bottom: none; }
  #filtres table.table-responsive tr:last-child { margin-bottom: 20px; padding-bottom: 20px; border-bottom: solid 1px #D0D0D0; }
 
  table.table-fiche td:nth-child(odd) { width: 95%; float: none; }
  table.table-fiche td:nth-child(even) { width: 95%; float: none; }
  table.table-fiche.table-responsive thead { display: block; }
  table.table-fiche.table-responsive thead th { display: block; line-height: 25px; }
  table.table-fiche.table-responsive { border-bottom: solid 2px #C72A3F; }
  table.table-fiche.table-bleu.table-responsive { border-bottom: solid 2px #05417D; }
  table.table-fiche.table-responsive tr { border: none; margin-bottom: 0px; padding-bottom: 0px; }
  table.table-fiche.table-responsive td.left { text-align: left; }
  table.table-fiche.table-responsive td.underline { text-decoration: underline; }
  table.table-fiche.table-responsive td.bold { font-weight: bold; }
  table.table-fiche.table-responsive div.table-choc .table { margin: 0px auto; }
  table.table-fiche.table-responsive td input.avecTaxe { width: 60%; }

  table.table-offres.table-responsive thead { display: block; }
  table.table-offres.table-responsive thead th { display: block; line-height: 25px; }
  table.table-offres.table-responsive thead th.masque { display: none; }
  table.table-offres.table-responsive { border-bottom: solid 2px #C72A3F; }
  table.table-offres.table-responsive td.left { text-align: left; }
  table.table-offres.table-responsive td input.btn-valideoff { float: right; display: inline; border-radius: 0%; background: #05417D; color: #FFFFFF; width: auto; height:auto; cursor: pointer; padding: 4px 8px; margin-bottom: 2px; font-size: 12px; }

  table.w49 tr.onlyresp td .btn-bleu { font-size: 12px; padding: 5px 8px; }
  table.table-bleu td p input { max-width: 75%; }  
  table.table-montants, table.table-bleu { width: 100%; }
  table.table-montants td { border: none; text-align: right; }
  .onlyresp { display: block; } 
  .masque { display: none;}
  p.floatright a.btn-bleu { font-size: 12px; padding: 5px 8px; }
  .titre { font-size: 17px; }

  div.white-popup-block, div.white-popup-block { padding: 10px 15px; }
  div.white-popup-block h2.titre { clear: both; font-size: 14px; }
  div.white-popup-block .btn-bleu {  padding: 5px; font-size: 12px; }

  /* Affichage Véhicule */
  .affichage_vehicule      { min-width: 100%; max-width: 100%; }
  .affichage_vehicule .box { width: 100%; margin: 10px 0px 30px 0px; }

  /* Photos */
  ul.galerie li   { width: 48%; }
  ul.galerie li img { width: 100%; }

  /* Tableau de bord */
  div.tableau-bord div { width: 93%; padding-top: 5%; }
  div.tableau-bord i { display: none; }
  
  /* Boutons */
  .btn-bleu { font-size: 12px; }
  .btn-rouge       { padding: 5px; width: 70%; max-width: 400px; font-size: 12px; }
  em.btn-beye      { margin-top: 27px; margin-left: 85%; }

}