/* CSS Stylesheet by dialog im netz http://dialog-im-netz.de
*/
@font-face {
    font-family: 'Canter';
    src: url('/fonts/CanterBold.woff2') format('woff2'),
        url('/fonts/CanterBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

html,blockquote,body,div,dl,dt,dd,fieldset,form,
h1,h2,h3,h4,h5,h6,ol,p,ul,li,center,hr,pre,img,
table,tr,td,th,thead,tbody,tfoot,caption  {
margin:0;
padding:0;
border:0 none;
font-size: 1em;
}
body {
color: black;
background-color: #fefefe;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
overflow: scroll;
hyphens: auto;
 -moz-hyphens: auto;
 -webkit-hyphens: auto;
-ms-hyphens: auto;
}
a {
color: black;
border:none;
outline: none;
}
a:hover,
a:focus {
outline: none;
}
td,th {
vertical-align:top;
padding: 1px 4px;
min-width: 60px
}
h1{
padding: 20px 0 0 20px ;
font-size:26px;
color: #de3f28;
}
p,ul,h2,form {
margin: 0 0 1em 0
}
#head h2 {
display: none
}
h3 {
margin-top: 1em;
margin-bottom: .5em
}

table {
border-collapse: collapse;
margin-bottom: 1em
}
.border tr {
 transition: .2s
}

.border td,
.noborder td {

}
.border td,
.border th {
border: 1px solid #c0c0c0
}
.border tr:hover,
.border tr.ac{
 background-color: #eee
}

#content .border img,
#content .noborder img {
width: auto
}
.tc {
text-align: center
}
.tr {
text-align: right;
font-weight: bold
}
.nullwert td {
color: #a0a0a0
}
ul {
padding-left: 16px
}
li {
vertical-align:middle
}
.hide, .h0 {
display:none
}
img{
border: none;
height: auto;
 -ms-interpolation-mode: bicubic; 
}
.druck {
display: none;
}
sub {
position: relative; 
font-size: 9px; 
bottom: -4px;
font-weight: normal;
}
sup {
position: relative; 
font-size: 9px; 
top: -2px;
font-weight: normal;
}
.clear {
clear: both
}
.bildlinks,
.floatleft {
float: left;
margin: 0 10px 5px 0
}
.bildrechts,
.floatright {
float: right;
margin: 0 0 5px 10px
}
.klein{
font-size:11px;
}
.rot,
.red {
color: red
}
.noprint {
border: none;
background-color: #e0e0e0;
}
div,
header,
nav,
main,
footer {
display: block;
position: relative;
box-sizing: border-box;
-moz-box-sizing: border-box;
}

/* DIVS */ 
#wrapper {
margin: 20px auto 0;
padding: 10px;
max-width:1300px;
height:auto;
border: 1px solid #f3904d;
border-radius: 10px
}
#head {
background: transparent url(/img/logo.png) top right no-repeat;
min-height: 120px;
}
#left {
width: 100%;
min-height: 30px;
padding-left:10px;
margin-bottom: 20px;
}
#content {
float: left;
width: calc(100% - 580px);
min-width: 470px;
margin-left: 20px;
padding: 20px 0
}
#content img {
width: 100%;
max-width:770px;
height: auto;
margin-bottom: .5em
}
#content2 {
width: 100%;
clear: both;
padding: 10px 10px 20px 10px
}
#right,
#right2 {
float:left;
padding: 78px 0 20px;
width: 300px;
margin-left: 20px
}
#right2  {
width: 220px;
	
}

#footer {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
clear:both;
padding: 10px 10px 10px 110px;
background-color: #f3904d;
margin: 0 0 5px
} 
#footer a {
 background-color: transparent;
 text-decoration: none
}
#footer a:hover, 
#footer input:hover {
color: white;
background-color: transparent
} 
/* FORMULAR */
#loginform {
display: block;
margin: 20px;
opacity: 0;
background-color: white;
box-shadow: none;
border: none;
outline: none;
transition: 1s
}
#loginform  label {
	clear: left; 
	float:left;
	width: 80px;
}
#loginform  input {
	width: 200px;
}
form.simple,
form.simple input {
	display: inline;
	width: auto;
	margin:0;
	padding: 0;
	background-color: transparent;
}
form.simple input {
	font-weight: bold;
	border: none;
	cursor: pointer;
}

nav form.simple{
	display: inline-block;
	float:right;
	width: 80px;
	
}
nav form.simple input {
	width: 100%
	}
form,
nav {
background-color: #e0e0e0;
padding: 10px;
border-radius: 10px;
box-shadow: 1px 2px 8px #606060;
}

label, input, textarea, select,button {
box-sizing: border-box;
margin:0 0 10px 0  ;
}
label span {
font-size: 12px
}
input, textarea,select {
border-width: 1px; 
padding: 2px 4px;
width: 300px;
}
button {
	display: inline-block;
	clear: both;
	padding: 6px 12px;
}
#right input, #right textarea,#right select, #right label{
width: 90%
}
input[type="checkbox"] {
width: 20px; 
background-color: transparent
}
select {

}
.disabled {
 color: #909090
}
.small {
width: 60px
}
label {
float: left;
width: 120px;
display: block;
clear: left;
padding-top: 3px
}
form div {
clear: both;
}

input.short {
width: 80px;
}
input:hover,
textarea:hover,
select:hover {
background-color: #ffffff;
}
input.button {
width: 310px;
}
select:disabled {
 color: #c0c0c0
}
.meldung,
.meldungok {
font-weight: bold;
font-size: 1.3em;
text-align:left
}
.meldungok {
-webkit-animation: fadeOut 5s linear forwards;
-moz-animation: fadeOut 5s linear forwards;
-o-animation: fadeOut 5s linear forwards;
-ms-animation: fadeOut 5s linear forwards;
animation: fadeOut 5s linear forwards;
}
form.simple{
width: 100px;
border: none;
border-radius: 0;
box-shadow: 0 0 0;
background-color: transparent;
}

#changecats {
 position: absolute;
right: 30px;
width: 160x;
bottom: 65px; 
border: 0 none;
box-shadow: none;
background-color: transparent
}



/* NAVI */
nav {
padding: 6px 10px;
border-radius: 3px;
height: 30px;
margin-bottom: 20px;
}
nav a {
display: inline-block;
font-weight: bold;
padding: 2px 5px;
text-decoration: none;
float:left;

}
nav a:hover,
nav a.active,
form.simple input:hover {
background-color: #a0a0a0;
color: white
}
@media screen and (max-width: 1100px) {
#wrapper {
margin: 10px
}
}
@media screen and (max-width: 550px) {
#wrapper {
margin: 10px
}
#content,
#head,
#right,
#left {
width:100%;
float: none;
margin: 0 0 20px 
}
#content2 {
padding-left: 0
}

h1 {
padding-top: 110px;
padding-left: 0
}
#footer {
padding: 10px
}
input,textarea,select, label {
width: 100%
}
}
@media print {
 body {
  background-color: white;
 }
h1,#left,#content,#right,form,td img,.noprint,#right2 {
display: none !important
}
td {font-size: .9em}
.druck {
display: block;
}
#wrapper {
border: none;
padding: 0;
margin:0
}
#head {
padding: 0;
margin:0

	
}
#head h2 {
display: block;
width:50%;
float:left;
margin-top: 0.563cm;
font-size: 2em
}

#content1,
#content2 {
padding-left:1cm
}
}