@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');

* { box-sizing: border-box; }
p, body, form, ul, li { margin: 0; padding: 0; }
section, footer, aside, nav, main, article, figure { display: block; }

a { text-decoration: none; color: black; }
a:hover { text-decoration: underline; }

header { display: flex; flex-direction: column; align-items: center; margin-bottom: 1em; }
header div#idLogo { text-align: center; }
header div#hdMenu {}
header div#hdAccount {}

main { }

div#actMenu { display: flex; flex-wrap: wrap;  gap: 20px; flex-direction: column; }
div#actMenu div#actCols { flex:1; flex-wrap: wrap; margin: 3px 0; }

footer { font-size: 80%; text-align: center; padding: 1em 0; }

body { font-family: "Raleway", sans-serif; font-size: 16px; font-style: normal; max-width: 1200px; margin: 2em auto; color: #5A5A5A; }

p.title { font-weight: 700; font-size: 150%; margin: 2em 0 1em .6em; }
h1 { font-weight: 700; font-size: 130%; margin: 2em 0 1em .6em; }

input.txt { box-shadow: 0px 0px 12px -8px rgba(196,196,196,1); padding: .4em 1em; width: 100%; border-radius: .3em; border: 1px solid #f1f1f1; }
input.btn { box-shadow: 0px 0px 12px -8px rgba(196,196,196,1); padding: .4em 1em; border-radius: .3em; border: 1px solid #c1c1c1; }
select.sel { box-shadow: 0px 0px 12px -8px rgba(196,196,196,1); padding: .4em 1em; border-radius: .3em; border: 1px solid #f1f1f1; text-align: center; }

div#infoBox { display: flex; align-items: center; padding: .3em; border: 1px solid #5AA02C; margin: 1em auto; width: 95%; max-width: 650px; border-radius: .3em; }
div#errorBox { display: flex; align-items: center; padding: .3em; border: 1px solid red; margin: 1em auto; width: 95%; max-width: 650px; border-radius: .3em; }

div.table { display: table; width: 100%; border: 1px solid #DEDEDE; border-spacing: 2px; border-collapse: separate; border-radius: 5px; table-layout: fixed; overflow: hidden; margin: .5em auto 1em auto; -webkit-box-shadow: 1px 1px 5px -1px rgba(161,161,161,0.6); -moz-box-shadow: 1px 1px 5px -1px rgba(161,161,161,0.6); box-shadow: 1px 1px 5px -1px rgba(161,161,161,0.6); }
div.tr { display: table-row; }
div.th { display: table-cell; padding: .4em 1em; vertical-align: middle; font-weight: bolder; font-size: 105%; }
div.tr div.th:first-child { border-top-left-radius: .2em; }
div.tr div.th:last-child { border-top-right-radius: .2em; }
div.td0 { display: table-cell; padding: .3em .7em; vertical-align: middle; }
div.td1 { display: table-cell; padding: .3em .7em; vertical-align: middle; background-color: #F9F9F9; }

ul li {text-indent: -1em;  margin-left: 1em; }

@media screen and (min-width: 800px) {
    header { flex-direction: row; }
    header div#hdMenu { flex: 1; }
    
    div#actMenu { flex-direction: row; }
    div#actMenu div#actCols { margin: 2px 0; }
}