/* Website template by freewebsitetemplates.com */
html {
    font-family: Arial, Helvetica, sans-serif;
    background-color: lightgray;
}   

body {
    width: 90%;  /* 1782px */
    max-width: 1980px;
    margin: 1em auto;
    background-color: white;
    border-radius: 25px 25px 25px 25px;
    font-size: 100%;  /* 16 px */
}
header{
    background-color: #2B3856;
    border-radius: 25px 25px 0 0;
    text-align: center;
}

table {
    width: auto;
}

table#currentTable {
    text-align: left;
    width: 95%;
    height: auto;
    font-size: 95%;
    /*float: left;*/

}

table#currentTable td a{
    color: black;
}

table#resultsTable {
    text-align: center;
    width: 95%;
    height: auto;

}

table#resultsTable th, td {
    padding-bottom: 1%;

}

#deceased {
    display:inline-block;
    margin: 0 auto;
    width: 350px;
    height: auto;
    border: 0px;
}

#logo {
    display:inline-block;
    margin: 0 auto;
    width: 90%;  /* 532.8px */
    max-width: 592px;
}

#imgFH {
    width: 90%;  /* 1782px */
    max-width: 1980px;
    padding-top: .56117%;
    padding-bottom: .56117%;
    padding-left: 5%;
    text-align: center;
}

nav {
    margin-top: 1em;
    margin-bottom: 1em;
    width:90%;
    max-width: 767px;
    margin-left: auto;
    margin-right: auto;
    font-size: 110%;



}
/* The styles for the operation of the 2-tier navigation menu */
#nav_menu ul {
    list-style: none;
    position: relative;    /* So the first submenu can be positioned within the main menu */
    text-align: center;

}
#nav_menu ul li {
    float: left;
}
#nav_menu ul ul {
    display: none;         /* Don't display submenu until hover of the li element */
    position: absolute;
    top: 100%;             /* Position the submenu at the bottom of the main menu */
}
#nav_menu ul ul li {
    float: none;           /* Display the submenus vertically */
}
#nav_menu ul li:hover > ul {
    display: block;        /* Display the submenu on hover of the li element */
}
#nav_menu > ul::after {
    content: "";
    display: block;
    clear: both;
}

/* The styles for the formatting of the 2-tier navigation menu */
#nav_menu ul {
    margin: 0;
    padding: 0;
}

.test {
    border-radius: 10px 0 0 10px;
}

#nav_menu ul li a {
    text-align: center;
    display: block;
    width: 150px;
    padding: 1em 0;
    text-decoration: none;
    background-color: #2B3856;
    color: white;
    font-weight: bold;
    font-family: Arial Narrow, Arial, Helvetica, sans-serif;
    border-right: 2px solid white;   
}

#nav_menu ul li a .left {

}

#nav_menu ul li.lastitem a {
    width: 150px;               /* So the menu fills the 706px width of the page */
}


.space {
    border-top: 2px solid white;

}

#nav_menu ul li a:hover, #nav_menu ul li a:focus {
    background-color: lightgrey;
    color:#2B3856;
}

iframe {
    width: 512px;
    height: 330px;
    display: block;
    margin: auto;
}

#section_menu ul {
    list-style: none;         /* Don't display submenu until hover of the li element */

}

#section_menu ul li a {
    text-align: center;
    display: block;
    width: 150px;
    padding: 1em 0;
    text-decoration: none;
    background-color: #2B3856;
    color: white;
    font-weight: bold;
    border-top: 2px solid white;
}

#section_menu  ul li a:hover, #section_menu ul li a:focus {
    background-color: lightgrey;
    color:#2B3856;
}


/* The styles for the operation of the 2-tier navigation menu */
#admin_menu ul {
    list-style: none;
    position: relative;    /* So the first submenu can be positioned within the main menu */
    text-align: center;

}

/*#admin_menu ul li {
    float: left;
}*/

#admin_menu ul ul {
    display: none;         /* Don't display submenu until hover of the li element */
    position: absolute;
    top: 100%;             /* Position the submenu at the bottom of the main menu */
}
#admin_menu ul ul li {
    float: none;           /* Display the submenus vertically */
}
#admin_menu ul li:hover > ul {
    display: block;        /* Display the submenu on hover of the li element */
}
#admin_menu > ul::after {
    content: "";
    display: block;
    clear: both;
}

/* The styles for the formatting of the 2-tier navigation menu */
#admin_menu ul {
    margin: 0;
    padding: 0;
}
#admin_menu ul li a {
    text-align: center;
    display: block;
    /*width: 250px;*/
    padding: 1em 0;
    text-decoration: none;
    background-color: #2B3856;
    color: white;
    font-weight: bold;
    border-bottom: 3px solid white;
}
#admin_menu ul li.lastitem a {
    /*width: 250px;*/               /* So the menu fills the 706px width of the page */
}
.space {
    border-top: 2px solid white;
}

#admin_menu ul li a:hover, #admin_menu ul li a:focus {
    background-color: lightgrey;
    color:#2B3856;
}

img {
    border: 0;
}

main {
    /* width: 53%;
     padding-left: 5%;*/

}



#NFDA {
    width: 32%;  
    max-width: 523px;
    padding-left: 4%;
    padding-right: 1%;
}

#GFDA{
    width: 32%;  
    max-width: 383px;
    padding-right: 1%;
}

#IFDG {
    width: 25%;
    max-width: 451px;
    padding-right: 1%;

}
section {
    background-color: white;
    float: left;
    width: 53%;
    padding-left: 5%;

}

section h1 {
    font-family: Monotype Corsiva, Arial, Helvetica, sans-serif;
}

aside {
    width: 34%;
    height: auto;
    float: right;
    padding-left: 1%;
    margin-right: 5%;

}

aside #deceased {
    display: block;
    margin-left: auto;
    margin-right: auto;

}

#deceased {
    width: 300px;
    max-width: 90%;

}

aside h3 {
    color: white;
    background-color: #2B3856;
    padding-top: 2%;
    padding-bottom: 2%;
    text-align: center;
    border-radius: 5px;
    font-family: Arial Narrow, Arial, Helvetica, sans-serif;
    font-size: 135%;

}

aside script {
    border-collapse: collapse; 

}


section #contact{
    background-color: #2B3856;
    color: white;
}

footer{
    clear: both;
    padding: 1%;
    background-color: #2B3856;
    color: white;
    font-size: 1em;
    border-radius: 0 0 25px 25px;
}

#footer {
    /*line-height: .56117%;*/
    line-height: 20px;
    margin: 0 auto;
}

#footer ul.contacts {
    float: left;
    list-style: none;
    width: 40%;
    margin-left: 10%;
    padding: 0 0 10px;
}
#footer ul.contacts h3 {
    font-size: 1.25em;
    margin: 0 0 .2806%;
}


#footer .admin {
    float: right;
    padding-left: 20%;
    width: 30%;
    height: auto;
}
#footer .p {
    font-size: 1em;
    margin: 0;
}
#footer .h3 {
    font-size: 1.25em;
    margin: 0 0 .2806%;

}
#footer .admin p b {
    display: block;
    font-weight: bold;
    margin: 0 0 .2806%;
}
#footer .admin form {
    margin: 4px 0 1.25em;

}
#footer label {
    width: 45%;
    margin-left: 5%;
    text-align: right;
}

#footer input {
    margin-left: 1em;
    margin-bottom: .5em;
}
.admin #button {
    margin-left: 2em;;
}

#footer span.footnote {
    clear: both;
    display: block;
    font-size: .75em;
    text-align: center;
    /*padding-top: 20px;*/
}

.bold {
    font-size: 1em;
    font-weight: bold;
}

#space {
    margin-left:1em;
}

/* hide the mobile menu initially */
#mobile_menu {
    display: none;
}

/* table portrait to standard 1980 */
@media only screen and (max-width: 1980px) {
    #nav_menu ul li a {font-size: .875em; }
    section h1, artilce h1 { font-size: 1.5em;}
    section h2, aside h2, aside h3{ font-size: 1.125em; }
}

/* table portrait to 1024 */
@media only screen and (max-width: 1024px) {
    #nav_menu ul li a {font-size: .875em; }
    section h1, artilce h1 { font-size: 1.5em;}
    section h2, aside h2, aside h3 { font-size: 1.125em; }

    #nav_menu {
        border: 0;
    }

    #footer ul.contacts {
        width: 75%;

    }

    table#currentTable {
        font-size: .750em;
    }

    iframe {
        height: 280.5px;
        width: 435.2px;
        display: block;
        margin: auto;
    }
}


/* table portrait to standard  */
@media only screen and (max-width: 1023px) {
    #nav_menu ul li a {font-size: .750em; }

    nav#admin_menu ul li {
        font-size: .875em;
    }


    table#currentTable {
        font-size: .600em;
    }

    #nav_menu ul li a {
        width: 118px;
    }
    #nav_menu ul li.lastitem a {
        width: 118px;               /* So the menu fills the 706px width of the page */
    }

    #deceased {
        max-width: 275px;
        width: 90%;
    }

    iframe {
        height: 225.59px;
        width: 350px;
        display: block;
        margin: auto;
    }
}

/*mobile landscape to table portrati */
@media only screen and (max-width: 767px) {
    #nav_menu {display: none; }
    #mobile_menu { display: block; }
    .slicknav_menu { 
        background-color: #2B3856 !important;

    }
    .sli   .space {
        border-top: 2px solid #2B3856;
    }
    body {
        width: 100%;
        margin: 0;
        border: none;

    }
    main {
        width: 90%;
        padding-left: 5%;
        padding-right: 5%;

    }
    table#currentTable {
        font-size: .700em;
    }
    header, footer p {
        text-align: center; 
        border-radius:0 0 0 0;
    }

    footer {
        border-radius:0 0 0 0;
    }
    footer p { 
        margin-right: 0;
        border-radius:0;
    }
    header h2 {
        font-size: 1.625em;
        margin: .4em 0 .25em 0;
    }
    header h3 {
        font-size: 1em;
        margin-left: 0;
    }
    header img { float: none; }

    section {
        width: 95.9596%;
        float: none;
        margin-right: 2.0202%;
        padding-right: 0;
    }

    aside {
        width: 91.9192%;
        float: none;
        margin: 0 2.0202% 2.0220% 2.0202%;
    }

    #footer .contacts {
        padding: 0;
        font-size: .75em;

    }

    #footer .admin {
        padding: 0;
        font-size: .75em;
        float: left;
        width: 30%;
        height: auto;
        padding-left: 10%;
    }
    #footer .admin form {
        margin: 0;

    }


    #footer input {
        margin-left: 1em;
        margin-bottom: .5em;
    }

    .admin p{
        text-align: left;
        margin-left: 1em;
    }
    .admin #button {
        margin-left: 1em;
    }

    #footer span.footnote {
        clear: both;
        display: block;
        font-size: .65em;
        text-align: center;
        padding-top: 2em;
    }

}

/*mobile landscape to table portrati */
@media only screen and (max-width: 736px) {
    table#currentTable {
        font-size: .875em;
    }

}

/* mobile portrait to mobile lanscape */
@media only screen and (max-width: 479px){


    header h2 { font-size: 1.375em; }
    header h3 { font-size: .8125em; }
    p { font-size: .875em; }
    ul { font-size: .875em; }
    section h1, aside h2 {
        font-size: 1em; }
    aside li {font-size: .875em; }

    table#currentTable {
        font-size: .750em;
    }

    table p {
        font-size: .700em;
    }

    section img {
        float: none; 
        width: 100%;
        margin-right: 0;
    }
    aside h3 { font-size: .9375em; }
    footer p {
        font-size: .6875em;
        float: none;
    }
    #footer .contacts {
        float: none;
        margin-left: 5%;
        padding: 0;
        font-size: .750em;


    }

    #footer ul.contacts {
        float: none;
        margin-left: 5%;
        padding: 0;
        width: 75%;

    }
    #footer ul.contacts h3 {
        font-size: 1.25em;
        margin: 0 0 .2806%;
    }

    #footer .admin {
        float: none;
        padding: 0;
        font-size: 1em;
        margin-left: 2%;
    }
    #footer label {
        margin-left: 1em;
    }
    .admin #button {
        margin-left: 1em;
    }

    #footer span.footnote {
        clear: both;
        display: block;
        font-size: .60em;
        text-align: center;
        /*padding-top: 20px;*/
    }

    iframe {
        height: 193.36px;
        width: 300px;
        display: block;
        margin: auto;
    }

}

/* mobile portrait to mobile lanscape */
@media only screen and (max-width: 320px){

    iframe {
        height: 177.25px;
        width: 275px;
    }

}