
html    { position:relative;min-height:100%; } 

/* only-loggedin; 4 user and menu */
           .only-loggedin {display:none;}
.logged-in .only-loggedin {display:block;}   

 /* --- Fixed navbar -------------------------------------------------------- */

 /* height:90px; logo + 'jboard'; (!!)min-width:300px */
body > .container { padding:90px 0 0; }   
#navbar { height:90px; min-width:250px; padding:0;margin:0; align-items:start;} 
 
/** 
 #navbar = #top-logo + .operatore-box + .navbar-toggler  
 #top-logo = #imgLogo + .title-jboard  
 .operatore-box a = .fa-user-alt + #operatore 
**/
/* logo: w=90px+p=14px --> top-log: w=90+14+14=118px */
#navbar #top-logo   {width:118px;height:100%;overflow:hidden;padding:0;margin:0;} 
#navbar #top-logo a > * {width:90px;float:left;text-align:center;}
#navbar #top-logo a > #imgLogo      {margin-bottom:5px;}
#navbar #top-logo a > .title-jboard {font-size:0.8rem; }
/**/
#navbar .navbar-toggler {margin-right:5px;margin-top:14px;background:#004573} 
#navbar #top-menu{background: #fff; border:10px solid #fff; border-top:0 }
/**/
.operatore-box a{ white-space:nowrap; max-width:140px;overflow: hidden !important;text-overflow: ellipsis;} 
@media only screen and (max-width:330px) { 
  .operatore-box a{ display: none !important;} 
}
#progress-bar {width:100%;}
#progress-bar .header-caption{ position:absolute;top:14px;left:0; width:auto; background:transparent;}
#progress-bar #sample_goal .goalProgress{height:35px !important; }
#progress-bar #sample_goal .goalProgress .progressBar {height: 100% !important;}
#progress-bar #sample_goal .goalProgress .left-text-number,
#progress-bar #sample_goal .goalProgress .remains-passengers{font-size:21px !important;}
#navbar .navbar-toggler-icon {height: 1em;}


/* --- Fixed footer --------------------------------------------------------- */
.footer { position:fixed;bottom:0;width:100%;}
/* footer (!!) height:60px */
body { margin-bottom:60px; }
.footer { height:60px; }
/**/
.footer > .container { padding-right:15px;padding-left:15px; }
/**/
#footer-span a { font-size:16px; font-weight: bold; } /*border:5px solid red !important*/
#footer-span a { border-width: 0 !important; }
#footer-span a i    {display:inline-block;width:2rem;margin:0;text-align:center;  } /*border:1px solid red*/
#footer-span a i.fa-arrow-alt-circle-left   {float:left;}
/**/
.footer .roundbutton{height:45px !important;width:45px !important;margin:10px !important;font-size:20px !important;padding:0 !important; padding-top:5px !important;padding-left:5px !important;}

/** --- page ---------------------------------------------------------------- */ 
[data-role="page"]{ padding:1rem 0; background: #fff; } /*border:5px solid green*/
.page-dett [data-role="page"] {padding-top:0}

/**/
[data-role="page"] a {color:#333}

/* -- popup -- */
[data-role="page"] [data-role="popup"] {display:none;}

/* -- content -- */
/*[data-role="page"] [data-role="content"]{ }*/

/* -- ui-grid -- */
/*[data-role="page"] .ui-grid-a{  }*/
[data-role="page"] .ui-block-a{ margin-bottom:0.5rem} /*border: 5px solid coral;*/
/*[data-role="page"] .ui-block-b{ }*/

/* -- listview -- */
[data-role="page"] [data-role="listview"]{ list-style-type:none; margin:0;padding:0; }
/**/
[data-role="page"] [data-role="content"].rounded [data-role="listview"] li:first-child { border-radius: 0.25rem 0.25rem 0 0;}
[data-role="page"] [data-role="content"].rounded [data-role="listview"] li:last-child  { border-radius: 0 0 0.25rem 0.25rem; } 

/* -- list-divider -- */
[data-role="page"] [data-role="list-divider"]{ padding-left:0.25rem; padding-top:0.25rem; padding-bottom: 0.25rem; text-align:left; border:1px solid #333; background:#111;color:#fff;text-shadow:0 -1px 0 #000; font-weight:700; }
.page-dett         [data-role="list-divider"] {padding-top:0;padding-bottom:0}
/**/
[data-role="page"] [data-role="list-divider"] a {color:#fff}

/* -- list-sep -- */
[data-role="page"] [data-role="list-sep"]{ border-top:1px solid #333; }

/* -- input -- */
[data-role="page"] select,
[data-role="page"] input { border:1px solid #ced4da;  border-radius:0.25rem;} 
[data-role="page"] input { height:3rem; width:90%;padding:0.5rem;margin-left:5%;margin-right:5%; } 
[data-role="page"] select:focus,
[data-role="page"] input:focus{border-color: #111; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #111;outline: 0 none;}
/**/




/* --- loginp --------------------------------------------------------------- */
#loginp { } /*border:1px solid blue*/
#loginp  [data-role="content"]{ max-width:25rem;   background:#ced4da;}

#loginp select,
#loginp input,
#loginp li button {width:90%;margin:5%;}

#loginp select:focus,
#loginp input:focus,
#loginp button:hover {border-color: #111; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #111;outline: 0 none;}
#loginp input[type=submit]{display:none;}  
#loginp input:read-only {background: #e1e1e1;}

/* --- corse ---------------------------------------------------------------- */
#corse { color:#fff; text-align:left; } /* border:5px solid blue*/
/* Porto: <select>*/
#corse #curr-operatore {border-radius: 0.25rem;background: #000;}
#corse #curr-operatore  .fa-2x{float:right; font-size: 1.5rem;}
/* Corse <lisa> */
#corse #listacorse li[data-role='list-divider']{ border-radius: 0.25rem 0.25rem 0 0; margin-top:1rem}
#corse #listacorse li{ padding:0.3rem; border-bottom:1px solid #e1e1e1}    
#corse #listacorse li a    { font-size: 1.2rem; font-weight: bold;width:100%;display:inline-block; }
#corse #listacorse li a::after{ content:"\f111"; font-family:"Font Awesome 5 Free"; font-weight:900; position:relative;top:-0.8rem; float:right;  }
.company-SN #corse #listacorse li a {font-size:1.6rem;}
/**/
#corse #listacorse li[data-theme="b"] {background-image: linear-gradient(#5f9cc5,#396b9e);}
#corse #listacorse li[data-theme="b"] a{ color:#fff !important }
#corse #listacorse li                 a::after{ color:red !important; }
#corse #listacorse li[data-theme="b"] a::after{ color:green !important; }  
/**/
#corse #listacorse li:hover a::after{ content:"\f138"; color:#333; }    
#corse #listacorse li i    {display:inline-block;width:2em;text-align:center; }
/**/


/* --- imbarco -------------------------------------------------------------- */

#imbarco [data-role="list-divider"]  .t-or-b {display:block;width:100%;}
#imbarco [data-role="list-divider"]  .t-or-b .pull-right{float: right;margin-right: 0.5rem;}

#imbarco [data-role="list-divider"]  .fa-2x { font-size: 1.5em !important; }


#imbarco #sidecont {border-bottom:1px solid #e1e1e1}/*border:5px solid red*/
#imbarco #sidecont .form-input-biglietto{border-left:1px solid #e1e1e1; border-right:1px solid #e1e1e1 }
#imbarco #sidecont #codbigl_input{ margin:1rem;padding:1rem;height:5rem; }
#imbarco #paxvei { background: #f1f1f1; }
#imbarco #paxvei h1 { padding:0.5rem; font-size:1rem; font-weight: bold; }



/* --- dett ----------------------------------------------------------------- */
/**/
/*#dett .ticket-header   {} */
/*#dett .table-riepilogo {} */
/**/
#dett .row{ margin:0; padding:0.2rem; } /*border:2px solid coral*/
#dett .row .col-xs-12 { width:100%; } /*border:2px solid green*/
/**/
#dett .riepilogo-element-pax {text-align: left ;} /* contiene i passeggeri */
#dett .riepilogo-element-acc {text-align: right;} /* contiene i veicoli <br> accessori */
#dett .riepilogo-element font{text-align: right;}  
#dett .riepilogo-element font .badge{ display:inline-block; width:3em; margin:0.1em; padding:0.1em; color:#fff } 
/**/
#dett #confbtn {padding-top:5px !important;padding-bottom:5px !important;}
#dett .btn-bottom-text {font-size:3rem} 
#dett [data-role="list-divider"] {border:0; text-shadow:none; background:#5e87b0; background-image: -webkit-gradient(linear,left top,left bottom,from(#6facd5),to(#497bae));background-image: -moz-linear-gradient(#6facd5,#497bae);background-image: -ms-linear-gradient(#6facd5,#497bae);background-image: -o-linear-gradient(#6facd5,#497bae);}
#dett [data-role="fieldcontain"] {border-top: 1px solid #ccc;background: #eee;text-align: left; min-height: 2.5em ;}
#dett [data-role="fieldcontain"] .nooverflowdett{font-weight:bold; float: right !important;}
#dett [data-role="fieldcontain"] select{float:left;}
/**/
#dett .ticket-header .fa-user-alt {margin-left:0.5em}


/* --- jconfirm ------------------------------------------------------------- */
.jconfirm-content { text-align:left;}
.jconfirm-content .ticket-item-esito { padding: .0em 1px !important;display:block !important; } 
/**/
.jconfirm-content .ticket-item-esito.riepilogo-header .gui-icon      { width:1.5em; text-align:center; display:inline-block;}
.jconfirm-content .ticket-item-esito.riepilogo-header .gui-totale    b,
.jconfirm-content .ticket-item-esito.riepilogo-header .gui-imbarcato b{ width:3.0em; text-align:left ; display:inline-block; }
.jconfirm-content .ticket-item-esito.riepilogo-header .gui-non-imbarcato{float:right; }
.jconfirm-content .ticket-item-esito.riepilogo-header .gui-non-imbarcato .badge { width:3.0em; }
/**/
.jconfirm-content .ticket-item-esito.riepilogo-plus {background:#fff;color:#000;}
.jconfirm-content .ticket-item-esito.riepilogo-plus .porto-div{border:0;}
.jconfirm-content .ticket-item-esito.riepilogo-plus p {margin:0 !important;}

.jconfirm-content [data-role="list-divider"]
{  border: 1px solid #456f9a;
  background: #5e87b0;
  color: #fff;
  font-weight: 700;
  text-shadow: 0 1px 0 #3e6790;
  background-image: -webkit-gradient(linear,left top,left bottom,from(#6facd5),to(#497bae));
  background-image: -webkit-linear-gradient(#6facd5,#497bae);
  background-image: -moz-linear-gradient(#6facd5,#497bae);
  background-image: -ms-linear-gradient(#6facd5,#497bae);
  background-image: -o-linear-gradient(#6facd5,#497bae);
  background-image: linear-gradient(#6facd5,#497bae);}


/* modal-change-passwor */
.modal-change-password .modal-dialog{ max-width:25rem; }
.modal-change-password .modal-dialog .list-group{ list-style-type:none; }
.modal-change-password .modal-dialog .list-group .list-group-item {text-align: left; background:#337ab7; border: 0;}
.modal-change-password .modal-dialog .list-group input{width: 100%; }


.modal-change-password .modal-dialog .modal-footer {display:inline-block}
.modal-change-password .modal-dialog .pull-left {float: left;}
.modal-change-password .modal-dialog .pull-right {float: right;}


/* --- like-select-toggle --------------------------------------------------- */

input[type=checkbox].like-select-toggle { position:relative; cursor:pointer; margin:0 }
/* base    = before */
/* pallino = after  */
input[type=checkbox].like-select-toggle:before,
input[type=checkbox].like-select-toggle:after{ display:block; position:absolute; }
/* w + h + r */
input[type=checkbox].like-select-toggle       { width:   0; height:35px; }
input[type=checkbox].like-select-toggle:before{ width:60px; height:35px; border-radius:30px; }
input[type=checkbox].like-select-toggle:after { width:25px; height:25px; border-radius:30px;  }
/* t + l + p */
input[type=checkbox].like-select-toggle:before        { top:-5px; left: 0  ; padding:10px; padding-left:35px; }
input[type=checkbox].like-select-toggle:checked:before{                                    padding-left:10px; }
input[type=checkbox].like-select-toggle:after         { top: 0  ; left:05px; padding:1px ; padding-left:03px;}
input[type=checkbox].like-select-toggle:checked:after {           left:30px;                }
/* label */
input[type=checkbox].like-select-toggle:before         { content:"NO"   ; font-size:11px; }
input[type=checkbox].like-select-toggle:checked:before { content:"SI"   ; }
input[type=checkbox].like-select-toggle:after          { content:"\f62A"; font-size:17px; font-family:"bootstrap-icons"; font-weight: bold; }
input[type=checkbox].like-select-toggle:checked:after  { content:"\f26E"; }
/* color */
input[type=checkbox].like-select-toggle:before         { background-color:#e1e1e1;}
input[type=checkbox].like-select-toggle:checked:before { background-color:#5393c5; color:#fff}
input[type=checkbox].like-select-toggle:after          { background-color:#fff   ; color:red}
input[type=checkbox].like-select-toggle:checked:after  { background-color:#fff   ; color:rgb(24, 240, 67)}
/**/
input[type=checkbox].like-select-toggle:disabled:before         { color:#999 }
input[type=checkbox].like-select-toggle:disabled:checked:before { color:#e1e1e1;background-color:#5394c57c; }
input[type=checkbox].like-select-toggle:disabled:after          { color:#999}
input[type=checkbox].like-select-toggle:disabled:checked:after  { color:#999}

/* !! inciucio !! */
.like-select-toggle.hidden-select-toggle::before,
.like-select-toggle.hidden-select-toggle::after {width:0 !important;content:"" !important; padding:0 !important; border:0 !important)}






