/* The System Global Style Sheet - Symlinked from other web endpoints */
.vert1 {margin-top: 20vh;}
.vert2 {margin-top: 20vh;}
.vert {width: 14em;}

header { margin-top: 3vh;}
#header { margin-top: 3vh;}
a.class, button.class { margin: 1em 0; }

html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  line-height: 60px; /* Vertically center the text there */
}

.register { 
    margin: 1em 0; 
}


.back { margin-top:3em;}

.row {margin: 1em 0 1em 0;}

div#message {
    
position: fixed;
width: 500px;
/*height: 200px;*/
margin: 5% auto; /* Will not center vertically and won't work in IE6/7. */
left: 0;
right: 0;
top: 100px;
z-index: 1000;
    
}

select.kiosk_ti {font-size: 2em;}
input.kiosk_ti {font-size: 2em;}
.row {margin-top: 1em;}

.btn-kiosk {padding: 7%;}
.btn-kiosk strong {font-size: 2em;}

.kiosk, .input-kiosk, .label-kiosk
{
    
    font-size: 2em;
    
    
}
/*input[type=text],
input[type=password],
input[type=email], 
{
    
    font-size: 2em;
    
    
}*/

input[type=checkbox] {
 width:30px;
 height: 30px;
}

select.form-control {
    height: 2em;
    font-size: 2em;
    
 }

select.input-kiosk {

        height: 2em;
    
 }
 
 
select#InputReason {
    
    height:2em;
}

.autocomplete-suggestion, input#autocomplete.form-control {
    font-size: 2em;
    padding: 10px 20px;
   
}

.form-group label, .form-group div   { margin-left:0px; padding: 0px;}

header > h1 > a { color: #0275d8; text-decoration: none;} 
header > h1 > a:hover {  color: #0275d8; text-decoration: none;}  
header > h1 > a:active {  color: #0275d8; text-decoration: none;}
header > h1 > a:visited {  color: #0275d8; text-decoration: none;}

.input-group-addon {

    -webkit-appearance: none;
    -moz-appearance: none;    

}
.att-btn {opacity:0.5; 
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%); 
} 
.att-btn.active {opacity:1.0; 
    -webkit-filter: grayscale(0%); 
    filter: grayscale(0%); 
} 
.lunch-btn {opacity:0.5; 
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%); 
} 
.lunch-btn.active {opacity:1.0; 
    -webkit-filter: grayscale(0%); 
    filter: grayscale(0%); 
} 
 
label.lunch-btn input[type="radio"],label.att-btn input[type="radio"]{ 
    visibility:hidden; 
    } 
 
   label.h-75.lunch-btn.btn svg,  label.h-75.att-btn.btn.btn-success svg { 
 
  display-inline: block; 
  margin-right: 0.5em; 
  margin-top: 0.1em; 
  width: 50px; 
} 
 
.conceal {
  font-family: 'text-security-disc';
}

td span { display: block; }
td.pe-free span  { color: #5cb85c; }
td.pe-free  { padding: 0;background-color: #5cb85c; }
tr.alt td.pe-free span  {color: #acdbac; }
tr.alt td.pe-free {  background-color: #acdbac; }

td.pe-booked span { color: #eceeef; }
td.pe-booked  { padding: 0;background-color: #eceeef; }
tr.alt td.pe-booked { padding: 0;background-color: #f8f9fa; }
tr.alt td.pe-booked span  { color: #f8f9fa; }

td.pe-blocked span { color: #343a40; }
td.pe-blocked  { padding: 0;background-color: #343a40; }
tr.alt td.pe-blocked { background-color: #818a91; }
tr.alt td.pe-blocked span { color: #818a91; }

.text-responsive {
  font-size: calc(10% + 1vw + 1vh);
}

@media (min-width: 576px) {
  .btn-kiosk strong {
    font-size: 1.0em;
  }
}

@media (min-width: 768px){
  .btn-kiosk strong {
    font-size: 1.2em;
  }
}

@media (min-width: 992px){
  .btn-kiosk strong {
    font-size: 1.8em;
  }
}

@media (min-width: 992px){
  .btn-kiosk strong {
    font-size: 2.0em;
  }
}