/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* RESET */

* { box-sizing:border-box; }
html { position:relative; display:block; }

body { position:relative; display:block; width:100%; margin:0; padding:0; font-family:Montserrat, sans-serif; font-size:0.8rem; font-weight:300; line-height:1.4; background-color:rgba(255,255,255,1); color:rgba(0,0,0,1); text-align:left; overflow-x:hidden; overflow-y:scroll; }
body.noscrollbar { overflow-y:hidden; }

header, main, footer { position:relative; display:block; width:100%; margin:0; padding:0; overflow-x:hidden; }

h1, h2, h3, h4, h5, h6 { position:relative; margin:0; padding:0; font-family:Montserrat, sans-serif; font-size:1.5rem; font-weight:400; color:inherit; }

div { position:relative; margin:0; padding:0; }

a, a:link, a:active, a:visited, a:focus { font-size:inherit; color:inherit; text-decoration:inherit; outline-color:transparent; }
body.desktop a:hover { color:inherit; text-decoration:underline; outline-color:transparent; }

img { margin:0; padding:0; border:0; }
svg { position:relative; display:inline-block; vertical-align:top; height:100%; width:100%; margin:0; padding:0; }

p { font-size:inherit; word-wrap:break-word; text-align:left; margin:0; padding:1em 0 0 0; }
p:first-of-type, h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p { padding-top:0; }
span { position:relative; display:inline; font-size:inherit; margin:0; padding:0; }

ul { position:relative; margin:0; padding:0; }
li { position:relative; font-size:inherit; word-wrap:break-word; text-align:left; margin:0; padding:0; }
.fromrte ul { margin-left:1em; }

.wrap { display:block; position:absolute; overflow:hidden; left:0; top:0; width:100%; height:100%; }
.cover { position:absolute; top:50%; left:50%; width:auto; height:auto; transform:translate(-50%, -50%); display:block; margin:0; padding:0; background-color:transparent; }
.cover.top { top:0; transform:translate(-50%,0); }
.cover.bottom { top:100%; transform:translate(-50%,-100%); }
.cover.left { left:0; transform:translate(0,-50%); }
.cover.topleft { left:0; top:0; transform:translate(0,0); }
.cover.bottomleft { left:0; top:100%; transform:translate(0,-100%); }
.cover.right { left:100%; transform:translate(-100%,-50%); }
.cover.topright { left:100%; top:0; transform:translate(-100%,0); }
.cover.bottomright { left:100%; top:100%; transform:translate(-100%,-100%); }
.cover > img, .cover > video, .cover > div, .cover > span { position:absolute; display:inline-block; width:100%; height:100%; left:0; top:0; }

.clear { clear:both; }
.blochref { cursor:pointer; }

pre, code { position:relative; font-size:13px; text-align:left; color:#c7254e; background-color: #f9f2f4; border-radius:0.5em; padding:0.8em; display:block; margin:0 0 1em 0; border:0; }

.ajaxloader { z-index:999999; position:fixed; left:0; top:0; width:100vw; height:100vh; background-color:rgba(0,0,0,0.4); }
.ajaxloader svg { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:8%; height:auto; color:rgba(0,0,0,1); }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/*    Mise en forme spécifique des formulaires   */
/*----------------------------------------------------------------------------------------------------------------------------------------------*/

input, textarea, select { position:relative; display:inline-block; vertical-align:top; width:100%; font-size:inherit; display:inline-block; background-color:rgba(221,221,221,1); color:rgba(0,0,0,1); line-height:2; height:2em; vertical-align:middle; margin:0; padding:0.1em 0.3em 0 0.3em; width:100%; border:0; border-radius:0; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; }
textarea { height:6em; }
select { background-image:url(https://planning.pavillondessensations.com/_chartes_/pavillon-planning/ressources/images/contribution/dropdown.svg) !important; background-size:1.5em; background-position: right center !important; background-repeat: no-repeat !important; padding-right:30px !important; }
select::-ms-expand { display: none; }
select option { color:rgba(0,0,0,1); }
select.placeholder { color:rgba(54,54,54,0.55) !important; }

/* Mise en forme des boutons radio et des checkboxes */
input[type="radio"] + span:before, input[type="checkbox"] + span:before, input[type="radio"] + span:after, input[type="checkbox"] + span:after {
	content:'' !important; position:absolute !important;
	left:0 !important; top:0 !important; /* on décale la case de 10% de sa taille pour bien la centrer en hauteur */
	width:1em !important; height:1em !important; /* on définit la taille de référence de la case à la même taille que la font du span */
	transform-origin: 50% 50% !important; /* pour être certain du point d'origine du scale pour la case et la coche */
	transition:all .2s !important; /* on prévoit une animation */
}
input[type="radio"], input[type="checkbox"] { position:absolute !important; left:0 !important; top:1em !important; opacity:0 !important; transform: scale(0) !important; height:1em !important; width:1em !important; } /* On masque le champ input (opacité 0) */
input[type="radio"] + span, input[type="checkbox"] + span { position:relative !important; cursor:pointer !important; padding-top:0 !important; padding-bottom:0 !important; padding-left:1.6em !important; } /* on prépare le label (balise span située à côté du champ input) */
input[type="radio"] + span:before, input[type="checkbox"] + span:before { border:1px solid rgba(221,221,221,1) !important; background-color:transparent !important; } /* Aspect général de la case */
input[type="radio"] + span:after, input[type="checkbox"] + span:after { border:1px solid transparent !important; background-color:rgba(0,0,0,1) !important; } /* Aspect général de la coche */
input[type="checkbox"] + span:before, input[type="checkbox"] + span:after { border-radius: 5% !important; } /* angles arrondis */
input[type="radio"] + span:before, input[type="radio"] + span:after { border-radius: 50% !important; } /* cases circulaires */
input[type="radio"]:not(:checked) + span:after, input[type="checkbox"]:not(:checked) + span:after { opacity: 0 !important; transform: scale(0) !important; } /* Aspect si "pas cochée" */
input[type="radio"]:checked + span:after, input[type="checkbox"]:checked + span:after { opacity: 1 !important; transform: scale(0.5) !important; } /* Aspect si "cochée" */

label { position:relative; display:inline-block; vertical-align:top; font-weight:300; }

button, a.button { position:relative; display:inline-block; vertical-align:top; font-family:Montserrat, sans-serif; font-size:inherit; font-weight:300; text-align:center; background-color:rgba(22,22,22,1); border:1px solid rgba(22,22,22,1); color:rgba(255,255,255,1); margin:0; padding:0.5em 1em; width:auto; outline:0; }
body.desktop button:hover, body.desktop a.button:hover { color:rgba(22,22,22,1); background-color:rgba(255,255,255,1); border-color:rgba(22,22,22,1); text-decoration:none; outline:0; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* HEADER */

header { z-index:1000; position:fixed; left:0; top:0; display:block; width:100%; height:auto; background-color:rgba(255,255,255,1); color:rgba(0,0,0,1); overflow-y:hidden; }

a#logo { font-size:1.2rem; height:5rem; position:relative; display:inline-block; vertical-align:top; margin:0; padding:1em 5%; }
body.desktop a#logo:hover { text-decoration:none; }
a#logo span { position:relative; display:block; }
a#logo span:nth-of-type(1) { text-transform:uppercase; font-weight:400; }
a#logo span:nth-of-type(2) { font-weight:100; }

header nav { position:relative; font-size:1rem; display:block; width:100%; padding:0; overflow-x:hidden; background-color:rgb(38,39,43); color:rgba(255,255,255,1); }
header nav > ul { position:relative; margin:0; padding:0 5%; display:block; width:100%; border-bottom: 0.4rem solid rgba(255,255,255,1); }
header nav > ul > li { position:relative; display:inline-block; width:auto; padding:0 0 0 3em; }
header nav > ul > li:first-of-type { padding-left:0; }
header nav button { font-size:0.8em; background-color:transparent; border:0; color:rgba(255,255,255,1); margin:0; padding:1em 0 1em 0; text-transform:uppercase; }
body.desktop header nav button:hover { background-color:transparent; border:0; color:#3f979b; }

a.welcome { display:block; z-index:100; position:fixed; top:1.9rem; right:9rem; font-size:0.9rem; max-width:30rem; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; }
body.desktop a.welcome:hover { text-decoration:none; }

a.conn { display:block; opacity:1; z-index:3333; position:fixed; top:0; right:0; width:5.2rem; height:5rem; padding:1rem 1.4rem; background-color:#3f979b; font-weight:200; font-size:2rem;  transition:background-color 300ms linear; }
a.conn img, a.conn svg { position:absolute; display:block; margin:0; padding:0; width:45%; height:45%; left:50%; top:50%; transform: translate(-50%, -50%); }
a.conn path { fill:rgba(255,255,255,1); transition:fill 300ms linear; }
body.desktop a.conn:hover { text-decoration:none; color:#3f979b; background-color:rgba(255,255,255,1); }
body.desktop a.conn:hover path { fill:#3f979b; transition:fill 500ms linear; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* MAIN */
main { position:relative; font-size:1rem; display:block; width:100%; overflow-x:hidden; background-color:rgb(38,39,43); color:rgba(255,255,255,1); }

section > div.fromrte { padding:0 5%; }

section { position:relative; font-size:1rem; display:block; width:100%; margin:0 auto;; padding:3rem 0; }
section h1 { z-index:1; width:100%; margin:0 auto; padding:0 5% 2em 5%; display:block; text-transform:uppercase; font-size:1.4rem; font-weight:200; }
section h2 { z-index:1; width:100%; margin:2em auto 0 auto; padding:2em 5% 2em 5%; display:block; text-transform:uppercase; font-size:1.2rem; font-weight:200; border-top: 0.4rem solid rgba(255,255,255,1); }

section nav { z-index:10; position:absolute; display:inline-block; right:5%; top:3rem; }
section nav .btn { font-size:1rem; padding:0.4em 0.8em; }
section nav .btn > span { padding-top:0.2em; }

section > div { z-index:1; width:100%; margin:0 auto; padding:0 5%; display:block; font-size:0.9rem; font-weight:200; }
section > div.complement { margin-top:2em; }
section > div > span.libelle { position:relative; display:inline-block; width:15em; text-transform:uppercase; padding:0.5em 0; }

section > table { width:90%; margin:0 auto; padding:0; text-align:center; border-collapse: collapse; font-size:1rem; table-layout:fixed; }
section > table tr { width:100%; padding:0; margin:0;}
section > table th, section > table td { margin:0; border-left:2px solid rgba(255,255,255,1); position:relative; padding:0.4rem 1rem; text-align:center; vertical-align:middle; overflow:hidden; }
section > table th { font-size:1.2em; color:rgba(255,255,255,1); text-transform:uppercase; font-weight:400; }
section > table th > div { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
section > table td { font-size:1em; color:rgba(0,0,0,1); font-weight:400; }
section > table th:first-of-type, section > table td:first-of-type { border-left:0; }
section > table tr:first-of-type { background-color:#3f979b; }
section > table tr:nth-of-type(2n) { background-color:rgba(242,242,242,1); }
section > table tr:nth-of-type(2n+3) { background-color:rgba(255,255,255,1); }

section > table td a, section > table td a:link, section > table td a:active, section > table td a:visited, section > table td a:focus { color:rgba(0,0,0,1); }
body.desktop section > table td a:hover { text-decoration:none; color:rgba(0,0,0,1); }

td.am, td.pm { vertical-align:top; padding-bottom:2em; }

th.dateaff, td.dateaff { width:10%; }
th.am, td.am, th.pm, td.pm { width:45%; }
th.paiement, th.transport, th.actif, td.check { width:8rem; }
th.commercial, td.commercial { width:15rem; }
th.prestataire, td.prestataire { width:15rem; }
th.pictos, td.pictos { width:8rem; padding:0.4rem 0; }

div.pictos, th.pictos, td.pictos, td.check { font-size:1.2em; }
div.pictos { width:100%; display:block; text-align:right; padding-right:5%; margin-top:2em; }
div.pictos form, td.pictos form { font-size:1em; position:relative; display:inline-block; margin:0; padding:0; }
div.pictos a, th.pictos a, td.pictos a, div.pictos button, td.pictos button { font-size:1em; position:relative; display:inline-block; border:0; background-color:transparent; margin:0; padding:0 0.3rem; }
body.desktop div.pictos a, div.pictos a:hover, div.pictos button, body.desktop div.pictos button:hover { color:rgba(255,255,255,1); }
th.pictos a, body.desktop th.pictos a:hover { color:rgba(255,255,255,1); }
td.pictos a, body.desktop td.pictos a:hover, td.pictos button, body.desktop td.pictos button:hover { color:rgba(0,0,0,1); }


td div.sortie { display:block; background-color:#f0e6c9; color:rgba(0,0,0,1); padding:1em; margin:0.3em 0; border-radius:0.5em; text-align:left; }
td div.sortie span { display:inline-block; margin-left:2em; }
td div.sortie span:first-of-type { margin-left:0; }
td div.sortie span.complement { display:block; margin-top:0.5em; margin-left:0; }

span.resas { display:inline-block; width:auto; background-color:rgba(58,135,173,1); color:rgba(255,255,255,1); font-weight:400; padding:0.5em; margin:0 0.5em 0 0; border-radius:0.5em; }
span.resas.infini { background-color:rgba(70,136,71,1); }
span.resas.complet { background-color:rgba(248,148,6,1); }
span.resas.surbooking { background-color:rgba(185,74,72,1); }


td a.create { position:absolute; display:inline-block; bottom:0.5em; left:50%; transform:translateX(-50%); font-size:1em; opacity:0.3; }
body.desktop td a.create:hover { opacity:0.8; }

td div a.action { position:absolute; display:inline-block; bottom:0.5em; right:0.5em; font-size:1em; opacity:0; }
body.desktop td div:hover a.action { opacity:0.3; }
body.desktop td div:hover a.action:hover { opacity:0.8; }
td div a.newresa { right:0.5em; }
td div a.edit { right:2.2em; }
td div a.duplicate { right:4.2em; }


.btn { border-radius:4px; }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* FOOTER */
footer { position:relative; font-size:0.8rem; display:block; width:100%; margin:0; padding:0.5em 5%; background-color:rgba(255,255,255,1); color:rgba(0,0,0,1); }

.credits { padding-left:4em; }
.credits:before { content:""; position:absolute; left:2em; top:50%; width:1px; height:0.8em; transform:translateY(-50%); background-color:rgba(0,0,0,1); opacity:0.3; } 




/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* FORM */

.main-form { width:60%; margin:0 auto; color:rgba(22,22,22,1); }

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
}

fieldset > legend > span.fa { display:none !important; }
fieldset .row { display:block !important; }

#fieldset_versions { display:none; }
#fieldset_destination { display:none; }
#fieldset_properties { display:none; }
#fieldset_acces { display:none; }
#fieldset_referencement { display:none; }
#fieldset_redirection { display:none; }

.jconfirm { font-size:1rem; }
.jconfirm-buttons  .btn-primary {
    color: rgba(255,255,255,1);
    background-color: #3f979b;
    border-color: #3f979b;
}
.jconfirm-buttons  .btn-secondary {
    color: rgba(255,255,255,1);
    background-color: rgba(221,221,221,1);
    border-color: rgba(221,221,221,1);
}

section nav .btn-primary, body.desktop section nav .btn-primary:hover{
    color: rgba(255,255,255,1);
    background-color: #3f979b;
    border-color: #3f979b;
}

form.main-form  .btn-primary, body.desktop form.main-form  .btn-primary:hover {
    color: rgba(255,255,255,1);
    background-color: #3f979b;
    border-color: #3f979b;
}
form.main-form  .btn-secondary, body.desktop form.main-form  .btn-secondary:hover {
    color: rgba(255,255,255,1);
    background-color: #666;
    border-color: #666;
}

legend { font-size:1.2rem; }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* AUTHENTIFICATION */
/*----------------------------------------------------------------------------------------------------------------------------------------------*/

#page-authentification h1,
#page-inscription h1,
#page-compte h1,
#page-oublipassword h1,
#page-changepassword h1,
#page-gestionutilisateurs h1 { padding: 0 33% 2em 33%; }


form.formauth { font-size:0; width:34%; position:relative; margin:0 auto; text-align:left; display:block; padding:0; }
form.formauth > div { font-size:1.1rem; position:relative; width:100%; border:0; margin:1.5em 0 0.5em 0; padding:0; }
form.formauth > div.connected { font-size:1.2rem; padding:1rem 0 2rem 0; }
form.formauth label { position:relative; display:block; width:100%; font-size:0; margin-bottom:0.5rem; text-align:left; }
form.formauth span { display:inline-block; position:relative; vertical-align:baseline; width:100%; text-transform:uppercase; font-size:0.9rem; padding-top:0.2rem; padding-bottom:0.4em; }
form.formauth span > span { text-transform:none; width:auto; }
form.formauth input { display:inline-block; position:relative; vertical-align:baseline; width:100%; text-transform:none; font-size:1.1rem; padding: 0.1em 0.5em 0 0.5em }
form.formauth textarea { display:inline-block; position:relative; vertical-align:baseline; width:100%; height:15em; text-transform:none; font-size:0.7rem; line-height:1.4em; font-family:Arial; padding: 0.1em 0.5em 0 0.5em }
form.formauth button { font-size:1.1rem; position:relative; width:100%; border:0; border-radius:0; background-color:#3f979b !important; color:#fff !important; margin:1em 0 0.5em 0; padding:0.5em 0.5em; transition:all 300ms ease; font-weight:300; }
body.desktop form.formauth button:hover { background-color:#fff !important; color:#3f979b !important; }
form.formauth > div.required { font-size:0.6rem; margin:0.2em 0 0.2em 0; text-align:right; font-style:italic; }
form.formauth > div.regles { font-size:0.8rem; text-align:left; margin:0.5em 0 2em 0; }

form.formauth .radio-inline { width:auto !important; display:inline-block !important; margin-top:0; margin-bottom:1rem; }
form.formauth .groupname { padding-left:20px !important; }

form.formauth  input[type="radio"] + span:before, form.formauth  input[type="checkbox"] + span:before { border-color:#fff !important; }
form.formauth  input[type="radio"] + span:after, form.formauth  input[type="checkbox"] + span:after { background-color:#fff !important; }

form.formauth label.consentementrgpd { font-size:0.6rem !important; margin-bottom:2em !important; position:relative; text-align:left; }
form.formauth label.consentementrgpd input[type="checkbox"] { font-size:1em !important; position:absolute !important; padding-top:0 !important; padding-bottom:0 !important; position:relative !important; left:0 !important; top:2em !important; transform:scale(1) !important; }
form.formauth label.consentementrgpd input[type="checkbox"] + span { font-size:1em !important; padding-left:3em !important; text-align:left !important; display:inline-block; width:auto !important; text-transform:none !important; }
form.formauth label.consentementrgpd input[type="checkbox"] + span:before { top:0.4em !important; left:0.25em !important; width:1.8em !important; height:1.8em !important;  border:1px solid #999999 !important; border-radius:15% !important; }
form.formauth label.consentementrgpd input[type="checkbox"] + span:after { top:0.5em !important; left:0.35em !important; width:1.6em !important; height:1.6em !important; border:1px solid #999999 !important; border-radius:15% !important; background-color:#999999 !important; }


form.formauth a { text-decoration:none; }
body.desktop form.formauth a:hover { text-decoration:none; color:#bb2a00; }

form.formauth strong { font-weight:400; }


#page-authentification form.formauth span { width:30%; }
#page-authentification form.formauth input { width:70%; }
#page-authentification form.formauth button { width:70%; margin-left:30%; }

#page-oublipassword form.formauth span { text-transform:none; padding-bottom:0.5em; }
#page-changepassword form.formauth span { text-transform:none; padding-bottom:0.5em; }


#ul-auth { font-size:0.9rem; clear:both; display:block; width:34%; margin:1rem auto 4rem auto; padding:0; }
#ul-auth li { clear:both; display:block; width:auto; list-style-type:none; margin:0; padding:0; text-align:right; }
#ul-auth li a { position:relative; padding-top:0.5em; font-size:0.8em; opacity:0.9; text-transform:uppercase; }
#ul-auth li a.inscription { display:block; width:100%; opacity:1; text-align:center; background-color:#bb2a00; color:#fff; font-size:1.2em; margin:4em 0 0.5em 0; padding:0.5em 0.5em; }
body.desktop #ul-auth li a:hover { text-decoration:none; opacity:1; }

input#majuser-username { background-color:rgba(255,255,255,0.2); color:rgba(255,255,255,1); }

div.retour { font-size:1rem; position:relative; text-align:center; display:block; width:34%; border:0; margin:1em auto 1em auto; padding:0; }
div.saisie { font-size:1rem; position:relative; text-align:center; display:block; width:34%; border:0; margin:1em auto 1em auto; padding:0; }

div.erreur { font-size:1.2rem; position:relative; text-align:center; text-transform:uppercase; display:block; width:34%; border:0; margin:1em auto 1em auto; padding:0; }

div.retour a { text-decoration:none; }
body.desktop div.retour a:hover { text-decoration:none; color:#bb2a00; }
div.retour strong { font-weight:400; }
div.saisie a { text-decoration:none; }
body.desktop div.saisie a:hover { text-decoration:none; color:#bb2a00; }
div.saisie strong { font-weight:400; }
div.erreur a { text-decoration:none; }
body.desktop div.erreur a:hover { text-decoration:none; color:#bb2a00; }
div.erreur strong { font-weight:400; }



.fullwidth { width:100%; height:auto; margin-left:auto; margin-right:auto; overflow:hidden; }
.masquer { height:0 !important; margin:0 !important; padding:0 !important; overflow:hidden !important; }


/* ------------------------------------------------------------------------------------------------------------- */
/* RESPONSIVE */

html { font-size:10px; font-size:1vw; }

#en2mots { background-color:rgba(255,255,255,1); width:100%; max-width:2560px; margin:0 auto; position:relative; }

/* AFFICHAGE PANORAMIC */

/* Attention, le style panoramic n'est pas ajouté sur body mais sur html
html.panoramic { left:calc( ( 100% - 2.5 * 100vh ) / 2); width:calc(2.5 * 100vh); font-size:2vh; text-align:center; }
*/


/* AFFICHAGE FONT MAXI */
@media (min-width:2000px) { 

	html { font-size:20px; }

}

/* AFFICHAGE MAXI */
@media (min-width:2560px) { 

	.litebox-overlay .litebox-container { margin-left:auto; margin-right:auto; }
	.litebox-overlay .litebox-inline-html { width:960px; }

}
/* AFFICHAGE NORMAL */
@media (orientation:portrait) and (min-width:951px), (orientation:landscape) and (min-width:501px) {

}
/* AFFICHAGE TABLETTE et PETIT ECRAN */
@media (orientation:portrait) and (min-width:951px) and (max-width:1600px), (orientation:landscape) and (min-width:501px) and (max-width:1200px) {

	html { font-size:11px; font-size:1.1vw; }


}
/* AFFICHAGE MOBILE */
@media (orientation:portrait) and (max-width:950px), (orientation:landscape) and (max-width:500px) {

	html { font-size:24px; font-size:3vw; }

	div.nosmartphone br { display: none; content: ' '; clear:none; }

	header nav button { font-size:1em; }
	a.welcome { display:none; }

header nav > ul > li:nth-of-type(4) { display:none; }

	section nav { position:relative; left:5%; top:auto; right:auto; margin-bottom:2rem; }
	section nav .btn { font-size:1.2rem; margin-left:0.5em; }

	section h1 { font-size:1.5rem; }

	#page-authentification h1,
	#page-inscription h1,
	#page-compte h1,
	#page-oublipassword h1,
	#page-changepassword h1,
	#page-gestionutilisateurs h1 { padding: 0 5% 2em 5%; }

	form.formauth, #ul-auth, div.retour, div.saisie, div.erreur { width:90%; }

	.main-form { width:90%; }

	legend { font-size:1.6rem; }

	section > div { font-size:1.2rem; }

	section > table { font-size:1.1rem; }

	section.sortie td.am, section.sortie td.pm { padding-bottom:3em; }

	td div.sortie { text-align:center; margin:0.3em 0 1em 0; }
	td div.sortie:last-of-type { margin:0.3em 0; }
	td div.sortie span.resas { width:auto; display:inline-block; margin:0 auto 0 auto; }
	td div.sortie span, td div.sortie a:first-of-type { display:block; margin:1em auto 1em auto; }
	td div.sortie span:last-of-type { margin-bottom:0; }

	td div a.action { left:50%; transform:translateX(-50%); font-size:1em; }
	td div a.newresa { right:auto; opacity:0.3; }
	td div a.edit { display:none; }
	td div a.duplicate { display:none; }

	th.commercial, td.commercial,
	th.username, td.username,
	th.groupes, td.groupes	{ width:0; padding:0; border:0; }

	th.dateaff, td.dateaff { width:20%; }
	th.am, td.am, th.pm, td.pm { width:40%; }
	table th.paiement, table th.transport, table th.actif, table td.check { width:5rem; }
	th.pictos, td.pictos { width:5rem; }
	th.prestataire, td.prestataire { width:10rem; }

	td.pictos { padding:1.2em 0; }
	td.pictos a, td.pictos button { display:block; padding:0; margin-top:1em; }
	td.pictos a:first-of-type { margin-top:0; }

	table#sortieslist td div.sortie { padding-bottom:3em; }


	footer { font-size:1rem; }
	footer > span { display:block; }
	footer > span.credits { padding-left:0; }
	footer > span.credits:before { background-color:transparent; }
	
	/* Pour éviter un zoom sur l'iphone qd on clique sur un champ de saisie */
	@media screen and (-webkit-min-device-pixel-ratio:0) { 
		textarea,input,select { font-size: 16px !important; padding:0 5px !important; line-height:20px !important; }
		input,select { height:28px !important; }
	}

}

/* AFFICHAGE MINI */
@media (max-width:300px) { 
	body { overflow-x:scroll; }
	html { font-size:9px; }
	#en2mots { width:300px; }
	header { width:300px; position:relative; }
	main { width:300px; margin-top:0 !important; }
	footer { width:300px; }
}
