:root{
--wrapcorner: 5px;
--wrapside: 10px;
}

body {margin-left: auto; margin-right: auto;}

span.nw {white-space: nowrap;}

p.banner {
background-color: rgba(255,255,255,0.5);
box-sizing: border-box;
margin: .3em auto;
padding: 0.3em;
width: 95%;
border: 1px solid rgba(0,0,0,0.1);
border-radius: var(--wrapcorner);
text-align: center;
}


div.wrapper {display: table; background-color: #fff; width: 85%; padding: .5em; margin-left: auto; margin-right: auto;}

p.legal {margin-top: .5em; margin-bottom: .5em; width: 80%; font-size: 1.1em; margin-left: auto; margin-right: auto;}

p.intro {margin-top: .5em; margin-bottom: .5em; width: 90%; font-size: 1.1em; text-align: center; margin-left: auto; margin-right: auto;}
p.intro:first-of-type{margin-top: 0;}
p.intro:last-of-type{margin-bottom: 0;}

hr {border: 1px solid #000000; margin: .25em 0 .25em 10.5em;}
hr.newcat,hr:last-of-type {margin-left: 0;}

div.maintext {
padding: 0.5% 1%;
}

div.bar {padding: .25em .63em .63em .63em; display: table; width: 98%;}

div.bar div {display: table-cell; vertical-align: top;}

div.categ{
width: 9.4em;
}

h3 {margin-top:0; margin-bottom:0;}

div.contact {width: calc(100% - .63em); padding-left: 20px; padding-right: 1.25em; vertical-align: middle;}
div.contact p {margin: 0; margin-top: -1.3em; white-space: pre-wrap;}

div.net {float: right;}
div.net p {margin: -1.3em .5em 0 0; text-align: right; white-space: pre-wrap;}

p.copyright {text-align: center; color: #555555; font-style: italic;}

/*--------------------------------RESPONSIVE DESIGN-----------------------------*/
@media only screen and (max-width: 1000px) {
p#intro {width: 100%;}
div.wrapper {padding: 0 var(--wrapside);}

div.bar div {display: block; width: 100%;}
div.contact {padding: 1.25em 0px 1.25em 0px; vertical-align: middle;}

div.net {float: none;}
div.net p {text-align: left;}

hr {margin-left: 5.25em; margin-right: 5.25em;}
hr.newcat,hr:last-of-type {margin-left: 0; margin-right: 0;}

div.categ:empty {display: none;}
div.categ:empty + div.contact {padding-top: 0;}
}