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

body {
    font-family: Arial, Helvetica, sans-serif;
    background-image: linear-gradient(to right, #ffd700, #fffbe6, #ffd700);
    margin-bottom: 80px;
}

.announce {
    border: 3px ridge #a6a6a6; 
    padding: 1%; 
    background: #f2f2f2; 
    margin: 2% 2% 2% 2%;
    width: auto;
    height: auto;
}

.footer{
    position: absolute;
    height: 60px;
    width: 100%;
    bottom: 0px;
    left: 0px;
    /* right: 0px;
    margin-bottom: 0px;
    width: auto; */
    background-color: #000000;
    font-size: small;
    color: white;
    text-align: center;
}

/* some additions to Bootstrap CSS modals */

.modal-dialog {
    max-width: max-content !important;
  }
  

.modal-content-size {
    resize: both;
    overflow: auto;
}

.modal-body {
    display: flex;
  }

.modal-body img {
    object-fit: contain;
}

.grid-head {
    display: grid;
    /* grid-template-columns: 5% 15% 65% 15%; */
    grid-template-columns: 20% 80%;
    grid-auto-rows: 100px;
}

/* narrow the modal dialog for the guests lists */
.guests {
    max-width: 70% !important;
}

/* div.btn-group { margin-top: 30%; } */

/*
.butn-group button {
    background-color: #000000;
    border: 1px solid #ffffff;
    color: white;
    padding: 5px 5px; 
    cursor: pointer; 
    width: 30%; 
    display: block; 
    top: 0;
    left: 0;
  }
  
.butn-group button:not(:last-child) {
    border-bottom: none; 
  }


.butn-group button:hover {
    background-color: #3e8e41;
}
*/

h1, h2, h3 { font-family: "Montagu Slab";}

h1.title { text-align: center; font-family: "Life Savers", Arial, Helvetica, sans-serif; font-weight: 800; font-size: 3vw; text-shadow: 5px 5px #b3b3b3;}
img.title { display: block; height: auto; max-width: 100%;  box-sizing: border-box;  }

.center { text-align: center; }

a:link { color: blue; text-decoration: none; }
a:visited { color: blue; text-decoration: none; }

a.butn, a.butn:visited { color: #ffffff;}

/* table components for the images and headline - grid this */
td.head_left { text-align: right; width: 15%; }
td.head_right { text-align: left; width: 15%; }

/* google map for hotels */
iframe.hotel {width: 100%; height: 480px;}

img.event { float: left; margin-right: 1em; margin-bottom: 1em; height: 160px; width: 240px; }
img.venmo { padding: 4px; border: .2em groove #abab9f; }
img.current { width: 50%; height: auto; }
img.school { display: block; height: auto; max-width: 100%; border: 3px ridge #a6a6a6; box-sizing: border-box; }

/* sizing for senior images */
.senior, .senior_mem { width: 154px; height: 227px; }
.senior:hover { filter: sepia(50%); }
/* .caption { text-align: center; font-size: 14pt;} */
.caption { text-align: center; font-size: medium; padding-top: 10px;}


/* main div holding boxes on page */
.float-div {
    padding: 20px;
    width: auto;
    height: 100%;
    display: flex;
    justify-content: center;
}

.float-child {
    float: left;
    border: 3px ridge #a6a6a6; 
    padding: 1%; 
    background: #f2f2f2; 
    margin: 2% 2% 2% 2%;
    width: 40%;
    height: auto;
    text-align: left;
}

.center-child {
    /* float: left; */
    border: 3px ridge #a6a6a6; 
    padding: 1%; 
    background: #f2f2f2; 
    margin: 2% auto 2% auto;
    width: 40%;
    text-align: left;
}

.in_float { float: left; margin: 2% 2% 2% 2%; padding-bottom: 6px; width: 45%; background-color: #FFFFCC; border: 2px ridge #a6a6a6;}

.content_left {
    border: solid 1px; 
    padding: 1%; 
    background: #FFFFCC; 
    margin: 5% 2% 5% 2%;
    width: 40%;
    text-align: left;
}

.grid-main { 
    display:grid;
    grid-template-columns: auto auto auto auto auto auto auto;
    column-gap: 10px;
    row-gap: 10px;
    /* grid-template-columns: 160px 160px 160px 160px 160px ; */
    background-color: #d9d9d9;
    padding: 10px;
    text-align:center;
    margin-top: 1em;
}

.grid-item {
    background-color: #FFFFFF;
    border: 3px ridge #a6a6a6;
    padding-top: 20px;
    padding-bottom: 10px;
}

.grid-mem { 
    display: grid;
    grid-template-columns: auto auto auto auto auto auto auto;
    column-gap: 10px;
    row-gap: 10px;
    /* grid-template-columns: 160px 160px 160px 160px 160px ; */
    background-color: #000000;
    padding: 10px;
    text-align:center;
    margin-top: 1em;
}

.grid-mem-item {
    background-color: #FFFFFF;
    border: 3px ridge gold;
    padding-top: 20px;
    padding-bottom: 10px;
}

/* menu */
.menu { width: 35%; margin: auto; border: 3px ridge #a6a6a6; border-collapse: collapse; background: #ace7a8; font-family: "Montagu Slab", Arial, Helvetica, sans-serif; font-weight: 700; }
.menu a:link, .menu a:visited { display: block; text-decoration: none; color: #1C1C1C; }
.menu a:hover { font-style: italic; }
.menu_box { border: 3px ridge #a6a6a6; text-align: center; padding-top: 2px; padding-bottom: 2px; font-size: 14pt; font-weight: 600;}


/* old menus 
.menu1 { width: 35%; margin: auto; border: 3px inset #a6a6a6; border-collapse: collapse; background: #ace7a8; font-family: "Montagu Slab", Arial, Helvetica, sans-serif; font-weight: 700; }
.menu1 a:link, .menu1 a:visited { display: block; text-decoration: none; color: #1C1C1C; }
.menu1box { border: gray solid 1px; text-align: center; padding-top: 2px; padding-bottom: 2px; font-size: 14pt; font-weight: 600;}
.menu1head { border: gray solid 1px; width: 33%; text-align: center; padding-top: 2px; padding-bottom: 2px;}
.menu1boxbld { border: gray solid 1px; text-align: center; padding-top: 2px; padding-bottom: 2px; font-weight: bold; font-size: 10pt;}
*/ 

/* tables */
table.hotel { margin: auto; border: 3px inset #a6a6a6; border-collapse: collapse; font-family: Arial, Times; font-size: 12pt; background-color: #FFFFFF; }
tr.hotel {border: 3px inset #a6a6a6; border-collapse: collapse; text-align: center; padding: 6px; background-color: #FFFFFF;}
td.hotel {border: 3px inset #a6a6a6; border-collapse: collapse; text-align: center; padding: 6px; background-color: #FFFFFF;}
th.hotel {border: 3px inset #a6a6a6; border-collapse: collapse; text-align: center; padding: 6px; background-color: #eee8aa; font-weight: 700; font-size: 16pt;}

.dropdown-item {
    text-align: center;
    padding: 0;

}

a.drop:link, a.drop:visited {
    color: #ffffff;
    text-decoration: none;    
}

a.drop:hover {
    color:#000000;
}
/*
.dropdown-item a:link, a:visited {
    color: #ffffff;
    text-decoration: none;
}
*/