/* Colors
Dk Gray   #333
Lt Yellow #FE9
Dk Yellow #FD0
Lt Green  #8C9
Dk Green  #186
Lt Blue   #89C
Dk Blue   #039
End Colors */

body{
    background-color:#333;color:#ddd;
    padding:0;margin:0;
    text-align: center;
    font-family:sans-serif;
}
a {
    color:#fe9;
}
.wrapper {height:98vh;display:grid;grid-template-columns: 100%;grid-template-rows: auto 1fr auto;align-items:stretch;justify-items:stretch;}

/** Nav is flex box **/
.navigation {font-variant:small-caps;display: flex;list-style: none;background-color:#039;margin:0;padding:0;}
.navigation a {text-decoration:none;text-align:center;color:white;padding:0 1em;line-height:1.5em;}
.has-child-hide > a:after{color:#fff;content:' +';}
.has-child-show > a:after{color:#fff;content:' -';}
.hide-child{display:none;}
.show-child{display:block;}
.nav-li-ul {list-style:none;padding:0;font-style:italic;}
@media (orientation: landscape) {
    .navigation {font-size:75%;flex-direction:row;justify-content:flex-end;}
    .navigation a {display: block;}
}
@media (orientation: portrait) {
    .navigation {font-size:125%;flex-direction:column;justify-content:center;/*flex: 1; is actually equivalent to flex: 1 1 0; or flex-grow: 1; flex-shrink: 1; flex-basis: 0;*/}
    .navigation li {border-top:1px solid rgb(255,255,255);border-top:1px solid rgba(255, 255, 255,0.5);border-bottom:1px solid rgb(0,0,0);border-bottom:1px solid rgba(0, 0, 0, 0.5);}
    .navigation li:last-of-type {border-bottom: none;}
}
.nav-li-hov1 {background-color:#89C;}
.nav-li-hov2 {background-color:#9AD;}
/** End of Nav **/

/** Begin Login Form **/
#entry_form {width:100%;}
#entry_form input {padding:.25em .5em;margin:.75em;height:50px;width:300px;border-radius:3px;}
#entry_form input::-webkit-outer-spin-button, #entry_form input::-webkit-inner-spin-button {-webkit-appearance: none; -moz-appearance: textfield; margin: 0;}
#entry_form input[type=number] {-webkit-appearance: none;-moz-appearance: textfield;}
.entry_form_go_button {width:100px !important;}
.g-recaptcha{display:inline-block;}
/** End of Login Form **/

.logout_img{height:25px;margin:0 0 10px 0;background-color:#FE9;}
.logout_img:hover{background-color:#FD0;}

.container {
    display:flex;
    justify-content:center;
    align-items: stretch;
}
.item{padding:5px;display:none;}
.divA{display:block;}

.divB{flex:1;grid-template-columns: 1fr 1fr 1fr 1fr 2fr;
    grid-template-areas: 
    "one one two three four"
    "five six two three seven"
    "eight nine eleven eleven eleven"
    "ten ten eleven eleven eleven";}
.item-01B {grid-area: one;background:#333 url('../img/HS-01-GRY.png') no-repeat center;}
.item-02B {grid-area: two;background:#333 url('../img/HS-02-GRY.png') no-repeat center;}
.item-03B {grid-area: three;background:#333 url('../img/HS-03-GRY.png') no-repeat center;}
.item-04B {grid-area: four;background:#333 url('../img/HS-04-GRY.png') no-repeat center;}
.item-05B {grid-area: five;background:#333 url('../img/HS-05-GRY.png') no-repeat center;}
.item-06B {grid-area: six;background:#333 url('../img/HS-06-GRY.png') no-repeat center;}
.item-07B {grid-area: seven;background:#333 url('../img/HS-07-GRY.png') no-repeat center;}
.item-08B {grid-area: eight;background:#333 url('../img/HS-08-GRY.png') no-repeat center;}
.item-09B {grid-area: nine;background:#333 url('../img/HS-09-GRY.png') no-repeat center;}
.item-10B {grid-area: ten;background:#333 url('../img/HS-10-GRY.png') no-repeat center;}
.item-11B {grid-area: eleven;background-color:#999;}
.divB-sub{background-size:102% 102%;}

.divC{flex:1;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas: 
    "zero zero zero zero zero zero seven six"
    "ten nine eight five four three two one"
    "twelve eleven thirteen thirteen thirteen thirteen thirteen thirteen"
    "twelve eleven thirteen thirteen thirteen thirteen thirteen thirteen";}
.item-00C {grid-area: zero;background:#333;}
.item-01C {grid-area: one;background:#333 url('../img/DM-01-GRY.png') no-repeat center;}
.item-02C {grid-area: two;background:#333 url('../img/DM-02-GRY.png') no-repeat center;}
.item-03C {grid-area: three;background:#333 url('../img/DM-03-GRY.png') no-repeat center;}
.item-04C {grid-area: four;background:#333 url('../img/DM-04-GRY.png') no-repeat center;}
.item-05C {grid-area: five;background:#333 url('../img/DM-05-GRY.png') no-repeat center;}
.item-06C {grid-area: six;background:#333 url('../img/DM-06-GRY.png') no-repeat center;}
.item-07C {grid-area: seven;background:#333 url('../img/DM-07-GRY.png') no-repeat center;}
.item-08C {grid-area: eight;background:#333 url('../img/DM-08-GRY.png') no-repeat center;}
.item-09C {grid-area: nine;background:#333 url('../img/DM-09-GRY.png') no-repeat center;}
.item-10C {grid-area: ten;background:#333 url('../img/DM-10-GRY.png') no-repeat center;}
.item-11C {grid-area: eleven;background:#333 url('../img/DM-11-GRY.png') no-repeat center;}
.item-12C {grid-area: twelve;background:#333 url('../img/DM-12-GRY.png') no-repeat center;}
.item-13C {grid-area: thirteen;background-color:#999;}
.divC-sub{background-size:102% 102%;}

.divD{flex:1;grid-template-columns: 1fr 1fr 1fr 1fr 2fr;
    grid-template-areas: 
    "one two three four five"
    "six seven eight nine ten"
    "eleven eleven eleven eleven eleven"
    "eleven eleven eleven eleven eleven";}
.item-01D {grid-area: one;background:#333 url('../img/FC-01-GRY.png') no-repeat center;}
.item-02D {grid-area: two;background:#333 url('../img/FC-02-GRY.png') no-repeat center;}
.item-03D {grid-area: three;background:#333 url('../img/FC-03-GRY.png') no-repeat center;}
.item-04D {grid-area: four;background:#333 url('../img/FC-04-GRY.png') no-repeat center;}
.item-05D {grid-area: five;background:#333 url('../img/FC-05-GRY.png') no-repeat center;}
.item-06D {grid-area: six;background:#333 url('../img/FC-06-GRY.png') no-repeat center;}
.item-07D {grid-area: seven;background:#333 url('../img/FC-07-GRY.png') no-repeat center;}
.item-08D {grid-area: eight;background:#333 url('../img/FC-08-GRY.png') no-repeat center;}
.item-09D {grid-area: nine;background:#333 url('../img/FC-09-GRY.png') no-repeat center;}
.item-10D {grid-area: ten;background:#333 url('../img/FC-10-GRY.png') no-repeat center;}
.item-11D {grid-area: eleven;background-color:#999;}
.divD-sub{background-size:102% 102%;}

.bgGRY{background-color:#333;cursor:default;}
.bgYEL{background-color:#fd0;cursor:pointer;}
.divG{z-index:10000;}
.divGmatte{
    z-index:9000;
    width:100%;
    height:100%;
    background-color:#333;
    background-color:rgba(51, 51, 51,0.75);
    position:absolute;
    top:0;
    left:0;
    padding:0;
    margin:0;
}

@media (orientation: portrait) {
    .container{flex-direction:column;}
    .divB{grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
    .divC{grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
    .divD{grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
}
@media (orientation: landscape) {
    .container{flex-direction:row;}
    .divB{flex:0 1 700px;grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
    .divC{flex:0 1 700px;grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
    .divD{flex:0 1 700px;grid-template-rows: 16.666vw 16.666vw 16.666vw 16.666vw;}
}
@media screen and (min-width: 710px) {
    .divB{grid-template-rows: 116.666px 116.666px 116.666px 116.666px;}
    .divC{grid-template-rows: 116.666px 116.666px 116.666px 116.666px;}
    .divD{grid-template-rows: 116.666px 116.666px 116.666px 116.666px;}
}

.leftAlign{
    text-align: left;
}
.pointer{cursor:pointer;}
.visitors_subhead {
    padding:5px 0;
    margin:0;
}
.visitors_subhead li, .visitors_subhead li ul, .visitors_subhead li ul li {
    list-style:none;
}
.visitors_subhead li ul {
    padding:5px 0 2px 10px;
}
.visitors_subhead li ul li {
    font-style: italic;
    padding-left:10px;
}

.visitors_table {
    border: 3px outset #999;
    margin:0 auto;
    width:90vw;
}
.visitors_table th {
    padding: 15px 10px 10px 10px;
    background-color:#039;
    border: 1px outset #999;
    font-weight:normal;
    text-transform:uppercase;
}
.visitors_table td{
    padding:10px;
    border: 1px solid #999;
}
.td-note {
    font-style:italic;padding-left:5px;
}
.resEdit td{
	vertical-align:top;
}
.resEdit td.wrap {word-break:break-all;}
#searchRecBar{width:100%;}
.guest_table{width:100%;}
.guest_table, .guest_table th, .guest_table td {
    border:1px solid #999;
    word-break: break-all;
}
.stop_button{
    cursor:pointer;
    position:absolute;
    top:5px;
    right:5px;
}
.recFormImg{
    height:20px;
    cursor:pointer;
}
.search-box{
	position:relative;
	width:100%;
}
table.reservations,.guest_table{text-align:center;font-size:small;}
.reservations_flexible{word-break:break-word;}
.sub_res td{font-size:small;line-height:1.1;}
.xtra_tr{display:table-row;}
.xtra_td{display:table-cell;}
.hide_tr{display:none;}
.hide_td{display:none;}
.expiredRes{color:#777;}
.expiredRes td a{color:#EEB;}
.guest_table a,.res_small{font-size:x-small;text-decoration:none;}
.res_bg_left{
	background-image: url("../img/am.png");
	background-repeat: no-repeat;
	background-size:contain;
	background-position: top left;
}
.res_bg_right{
	background-image: url("../img/pm.png");
	background-repeat: no-repeat;
	background-size:contain;
	background-position: bottom right;
}
.img_reslist_add,.img_reslist_phone,.img_reslist_email{
	height:15px;
}
.img_reslist_phone,.img_reslist_email{
	height:1em;padding:0 3px;vertical-align:top;
}
.img_reslist_info{height:1em;}