/* genearl.css is used just for non-system pages, SEO and marketing */
main {margin: 0 auto; max-width: 800px;}
main > div {margin: 40px 0;}
h2 {background: url('/media/border.png') right bottom no-repeat; font: bold 1.4em Arial, sans-serif; padding: 4px 0px}

#id-login > div {display: flex; padding: 5px 0; font-size: 105%;}
#id-login > div > label {width: 150px;}
#id-login > div > input {width: 300px; font-size: 105%;}

.c-header-top {display: flex; padding: 1% 5%; width: 100%; box-sizing: border-box; justify-content: flex-end; align-items: center; gap: 2%; flex-wrap: wrap;}
.c-header-top > :first-child {margin-inline-end: auto;}
.c-header-top > a {border: 1px solid orange; border-radius: 4px; padding: 10px 40px; text-decoration: none; transition: all 0.3s ease; width: 100px; text-align: center;}
.c-header-top > a:hover {background-color: orange; color: white;}

@media (max-width: 400px) {
    #id-login > div {flex-direction: column;}
    .c-header-top {flex-direction: column; }
    .c-header-top > * {margin-bottom: 2%;}
    .c-header-top > :first-child {margin-inline-end: inherit;}
}