@import url("menu.css") screen and (max-width : 1024px) and (orientation : portrait);
@import url("menu.css") screen and (max-width: 770px);
@import url("menu.css") screen and (max-width: 480px);
@import url("menu.css") screen and (max-width: 330px);

@font-face {
	font-family: 'Libre Franklin';
	font-style: normal;
	font-weight: 200;
	src: local(''),	url('../fonts/libre-franklin-v7-latin-200.woff2') format('woff2'), url('../fonts/libre-franklin-v7-latin-200.woff') format('woff');
	font-display: fallback;
}

@font-face {
	font-family: 'Libre Franklin';
	font-style: normal;
	font-weight: 300;
	src: local(''), url('../fonts/libre-franklin-v7-latin-300.woff2') format('woff2'), url('../fonts/libre-franklin-v7-latin-300.woff') format('woff');
	font-display: fallback;
}

@font-face {
	font-family: 'Libre Franklin';
	font-style: normal;
	font-weight: 400;
	src: local(''), url('../fonts/libre-franklin-v7-latin-regular.woff2') format('woff2'), url('../fonts/libre-franklin-v7-latin-regular.woff') format('woff'); 
	font-display: fallback;
}

@font-face {
	font-family: 'Rock Salt';
	font-style: normal;
	font-weight: 400;
	src: local(''), url('../fonts/rock-salt-v11-latin-regular.woff2') format('woff2'), url('../fonts/rock-salt-v11-latin-regular.woff') format('woff');
	font-display: fallback;
}

html,body,form,fieldset,p,div,h1,h6,.farbe,li,nav,#p1,ues,ueb { -webkit-text-size-adjust:none; }

body { margin:0px; background-color:#FFFFFF; text-align: left; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; 
	   background-image: url('https://www.schwaebisch-schwaetza.de/bilder/hg.jpg'); background-repeat: repeat; background-attachment: fixed; background-position: center 50%;} 

h1,#head1,#head2 { font-family: 'Rock Salt',Verdana,Helvetica,sans-serif; }
h1				 { font-weight:300; font-size:calc(18px + (24 - 18) * ((100vw - 320px) / (1600 - 320))); color:#3468A3; padding:0px;  margin: 0px 0px 5px 0px }

p,prot,small,smalldetail,.farbe,ul,li,nav,#p1,menu,ues,ueb,#verblinks,#verbrechts { font-family: 'Libre Franklin',Verdana,Helvetica,sans-serif; }
p,#verblinks,#verbrechts,li  { font-weight:300; font-size:calc(15px + (16 - 15) * ((100vw - 320px) / (1600 - 320))); color:#383838; line-height:150%; margin-top:0px; margin-bottom:0px; }
prot  { display:block; font-weight:400; font-size:16px; margin-bottom:10px; color:#4F4F4F; line-height:150%; margin-top:0px; }
small,smalldetail { font-weight:200; font-size:calc(13px + (15 - 13) * ((100vw - 320px) / (1600 - 320))); color:#383838; line-height:130%; margin-top:0px; margin-bottom:0px; }
ueb   { font-weight:300; font-size:calc(15px + (18 - 15) * ((100vw - 320px) / (1600 - 320))); color:#3468A3; display:block; padding-bottom:10px; } 
ues   { font-weight:300; font-size:calc(15px + (18 - 15) * ((100vw - 320px) / (1600 - 320))); color:#3468A3; }
b     { font-weight:500; }

a:link    { color:#4F4F4F; text-decoration:none; }
a:hover   { color:#3468A3; text-decoration:none; background-color:#E0E0E0; }
a:active  { color:#3468A3; text-decoration:underline; }
a:visited { color:#4F4F4F; text-decoration:none; }

smalldetail       { font-size:0.9em; border-bottom: 1px dotted #3468A3; }
smalldetail:hover { color:#3468A3; text-decoration:none; background-color:#E0E0E0; }

nav ul,li { list-style:none; padding-left:0px; }
nav ul li ul li a { padding-left: 0px; }
li { line-height:155%; list-style-type: none; }
td { vertical-align: top; }

.barhoriz  { text-align:left; margin: 2px; width: 70%; height:24px; border: 1px solid #ddd; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; overflow: hidden; background: #fff; }
.hprogress { text-align:left; height: 22px; -webkit-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-family: Verdana, Arial, sans-serif; font-size: 14px; font-weight: bold; padding: 1px 0 0 4px; color: #fff; }
.bargreen  { background:#5fd35f; }

input,textarea,select,option
{
	font-family: 'Libre Franklin',Verdana,Helvetica,sans-serif; 
	font-weight:300; font-size: 15px; border: 1px solid #3468A3; padding: 4px; margin:0px;
	-moz-border-radius:7x; /* Firefox */
	-webkit-border-radius:7px; /* Chrome, Safari */
	-khtml-border-radius:7px; /* Konqueror */
	 border-radius:7px; /* CSS3 */
	 behavior:url(border-radius.htc); /* Internet Explorer */
}

input[type=checkbox],input[type=radio]
{
	 z-index:0;
	-ms-transform: scale(1.1); /* IE */
	-moz-transform: scale(1.1); /* FF */
	-webkit-transform: scale(1.1); /* Safari and Chrome */
	-o-transform: scale(1.1); /* Opera */
}
 
textarea,input[type=text],input[type=tel],input[type=email],input[type=number],input[type=submit],input[type=search]  
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}

.infobox
{ 
	padding: 10px; border: 1px dotted #3468A3; font-weight:200; margin-top:0; margin-bottom:0; background-color:#E0E0E0;
	-moz-border-radius:10x; /* Firefox */
	-webkit-border-radius:10px; /* Chrome, Safari */
	-khtml-border-radius:10px; /* Konqueror */
	border-radius:10px; /* CSS3 */
	behavior:url(border-radius.htc); /* Internet Explorer */
}

#kopfbutt,#kopfbutt1,#kopfbutt3,#kopfbutt4
{ 
	margin-left:5px;
	font-size:calc(14px + (16 - 14) * ((100vw - 320px) / (1600 - 320))); 
	padding:4px 7px 4px 7px; 
	cursor:pointer; 
	color:#FFFFFF; 
	background:#4987C6;
    border-radius:5px;
    box-shadow: 1px 1px 3px #999999;
}

#kopfbutt:hover  { background:gray; }
#kopfbutt1:hover { background:gray; }
#kopfbutt2:hover { background:gray; }
#kopfbutt3:hover { background:gray; }
#kopfbutt4:hover { background:gray; }
#kopfbutt3       { display:none; padding:4px 10px 4px 10px; }

#texte
{
	 width:90%;
	 margin-top:15px;
	 margin-bottom:15px;
	 padding:30px;
	-moz-border-radius: 5px; /* Firefox */
	-webkit-border-radius:5px; /* Chrome, Safari */
	-khtml-border-radius:5px; /* Konqueror */
	 border-radius:5px; /* CSS3 */
	 behavior:url(border-radius.htc); /* Internet Explorer */
	 box-shadow: 3px 3px 3px #999999;
	 background-color:#FAFAFA;
}

#lextreffer
{
	 white-space: nowrap;
	 line-height:300%;
	 text-align:left; 
	 margin-top:0px;
	 margin-right:3px;
	 margin-bottom:0px;
	 padding:5px;
	-moz-border-radius: 3px; /* Firefox */
	-webkit-border-radius:3px; /* Chrome, Safari */
	-khtml-border-radius:3px; /* Konqueror */
	 border-radius:3px; /* CSS3 */
	 behavior:url(border-radius.htc); /* Internet Explorer */
	 box-shadow: 1px 1px 1px #999999;
	 background-color:#FAFAFA;
}

.farbe   		{ font-weight:300; color:#4F4F4F; padding: 8px; background-color:#F2F2F2; margin-top:0; margin-bottom:0; }
.rand td 		{ border-bottom-style: dotted; border-bottom-color: #E0E0E0; border-bottom-width: 1px; border-left-width: 0px; border-top-width: 0px; border-right-width: 0px; }
.rahmen  		{ padding: 5px; border: 1px solid #E0E0E0; }

.tabrahmen     { background-color:#FFFFFF; padding: 2px; border: 1px dotted #E0E0E0; margin-left:2; margin-bottom:2; }
.buttonrahmen  { white-space: nowrap; line-height:50px; margin-right:5px; padding:10px; background:#EEEEEE; border:1px solid #3468A3; border-radius:0px; } 
.buttonrahmen1 { white-space: nowrap; line-height:50px; margin-right:5px; padding:10px; background:#FFFFFF; border:1px solid #E0E0E0; border-radius:0px; } 
.binokel       { float:left; text-align:center; width:calc((100% - 85px) / 3); line-height:15px; margin-bottom:10px; margin-right:10px; padding:8px; background:#FFFFFF; border:1px solid #3468A3; border-radius:5px; } 

.linie         { border:none; border-top: 1px dotted #6E0027; background-color:#FFFFFF; height: 1px; width: 50%; } 
.strich        { clear:both; border:none; padding-top:15px; border-bottom: 1px dotted #3468A3; background-color:#FFFFFF; height: 1px; width: 100%; } 
.gestrn,.gestr { font-weight:300; border-bottom: 1px dotted #3468A3; }

.player        { color:#3468A3; margin: auto; width:180px; padding:3px; background: #F2F2F2; border: 1px dotted #3468A3; } 
.richtig       { font-size:17px; color:#009933; } 
.falsch        { font-size:17px; color:#FF3300; } 

#pagewrap      { width:1050px; margin: 0px auto; }

#head1         { font-size:calc(22px + (34 - 22) * ((100vw - 320px) / (1600 - 320))); font-weight:600; color:#F2F2F2; margin-top:10px; padding: 0px 0px 0px 15px; background: none repeat scroll 0 0 #4987C6; text-shadow: 0 1px 1px #000000; border-radius:5px; box-shadow: 4px 4px 3px #999999; }
#head2         { font-size:calc(12px + (18 - 12) * ((100vw - 320px) / (1600 - 320))); margin-top:-55px; text-align:right; margin-bottom:15px; padding-right:10px; color:#F2F2F2; text-shadow: 0 1px 1px #000000; }

#schlies       { display:none; } 
#kopf          { margin-top:25px; margin-bottom:10px; } 
#kopf1         { display:inline; width:100%; }

#inhalt_lex    { width:calc(100% - 330px); float:right; padding-top:5px; }
#inhalt_breit  { width: 96%; float:left; }

#flex-container { clear:both; justify-content: space-around; width:100%; display: -webkit-flex; display: -ms-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.panel2 		{ 
				display: -webkit-flex; display: -ms-flexbox; display: flex; width:44%; padding:10px; margin-bottom:10px; 
				background: #F5F5F5;
				border: 1px solid #DDD;
				background: -moz-linear-gradient(top, #F5F5F5, #FFFFFF);    
				background: -webkit-linear-gradient(top, #F5F5F5, #FFFFFF);
				background: -ms-linear-gradient(top, #F5F5F5, #FFFFFF);
				background: -o-linear-gradient(top, #F5F5F5, #FFFFFF);
				box-shadow: 1px 2px 4px rgba(0,0,0, .2);
				}
.panel2:hover   { color:#3468A3; text-decoration:none; background:#FFFFFF; }

#verblinks    { float:left;  font-size:0.9em; width:46%; padding:5px; margin-bottom:5px; background-color:#F2F2F2; clear:both; }
#verbrechts   { float:right; font-size:0.9em; width:46%; padding:5px; margin-bottom:5px; background-color:#F2F2F2; }

#lexikonw { clear:both; float:left; width:100%; background-color:#FFFFFF; margin-bottom:10px; padding-bottom:10px; }
#lexikonf { clear:both; float:left; width:100%; background-color:#F6F6F6; margin-bottom:10px; padding-bottom:10px; }

#lexikon0 { float:left; padding:7px 5px 13px 50px; width:80%; }
#lexikon1 { float:left; padding:7px 5px 3px 0px; width:36px; }
#lexikon2 { float:left; padding:7px 7px 3px 0px; width:43%; }
#lexikon3 { float:left; padding:7px 7px 3px 0px; width:43%; }
#lexikon5 { clear:both; float:left; width:90%; margin-left:43px; margin-bottom:0px; margin-top:5px; }
#lexikon6 { clear:both; float:left; width:90%; margin-left:10px; margin-bottom:0px; margin-top:5px; }

#viertel { float:left; width:22%; margin-bottom: 5px; }
#halb    { float:left; width:46%; margin: 2px; }

#menu    { margin-top:5px; float:left; width:300px; margin-right:30px; font-color:#000000; background:#FFFFFF; } 
#p0 	 { display:block; }
#p1 	 { width:100%; font-size:18px; color:#FFFFFF; font-weight:200; padding-top:3px; margin-top:0px; margin-bottom:0px; margin-left:20px; padding-left: 10px; }
#p2 	 { display:none; } 

#fuss 	 { clear:both; display:block; width:100%; padding-top:20px; }
#fuss1	 { background-color:#3468A3; height:40px; text-align:center; padding-top:13px; }
#fuss2	 { background-color:#FFFFFF; height:40px; text-align:center; padding-top:25px; }


@media only screen and (max-width:1024px)
{
	#pagewrap    { width: 95%; }
	#inhalt_lex  { display:block; width: calc(100% - 330px); float:right; }
	#kopfbutt2   { display: none; }	
	#head2       { margin-top:-45px; }
}

@media only screen and (max-width: 1024px) and (orientation: portrait)
{
	select { font-size:16px; }
	input  { font-size:16px; }
	li     { line-height:135%; }
	nav ul li ul li a { padding-left:35px; }

	#pagewrap     { width: 95%; }
	#inhalt_lex   { width: 98%; float:left; padding-top:0px; }
	#schlies      { display:inline; } 
	nav li        { padding-left:10px; font-size:15px; }
	#kopfbutt3    { display:inline; } 
	#menu 		  { display:block; width:500px; float:left; }
	#p0           { display:none; margin-top:-130px;}
	#p1           { padding-left:0px; }
	#p2           { display:inline; } 
}

@media only screen and (max-width:770px)
{
	#inhalt_lex  { width: 98%; margin-left:5px; float:left; padding-top:0px; }

	#head1       { margin-top:5px; }
	#head2       { margin-top:-45px; }

	#schlies     { display:inline; } 
	nav li       { padding-left:10px; font-size:15px; }

	#kopfbutt1   { display:none; }
	#kopfbutt3   { display:inline; } 

	#p0          { display:none; margin-top:-130px;}
	#p1          { padding-left:0px; }
	#p2          { display:inline; } 

	#lexikon0   { float:left; padding:7px 5px 15px 15px; width:85%; }
	#lexikon1   { float:left;  padding-right:0px; padding-top:2px; width:50px; }
	#lexikon2   { float:right; padding-right:0px; padding-top:2px; padding-left:0px; padding-bottom:2px; width:calc(100% - 50px); }
	#lexikon3   { display:block; margin-left:0px; margin-bottom:5px; padding-right:0px; padding-top:2px; padding-left:0px; padding-bottom:2px; float:right; width:calc(100% - 50px); }
	#lexikon5   { display:block; margin-left:0px; margin-bottom:5px; padding-right:0px; padding-top:2px; padding-left:0px; padding-bottom:2px; float:right; width:calc(100% - 50px); }
	#lexikon6   { display:block; margin-left:0px; margin-bottom:5px; padding-right:0px; padding-top:2px; padding-left:0px; padding-bottom:2px; float:right; width:calc(100% - 50px); }
	#lextreffer { line-height:210%; padding:3px; }
}

@media only screen and (max-width: 480px)
{
	.panel2 	{ width: 100%; }
	#head2      { display: none; }
	#kopf       { margin-top:18px; margin-bottom:10px; } 
	#kopfbutt4  { display:none; }
	#formular   { display:none; } 
	#fuss1      { height:60px; }
	#p0         { display:none; }
	#p2         { display:inline; } 
	#texte      { width:82%; }

@media only screen and (max-width: 330px)
{
	.buttonrahmen  { line-height:40px; margin-right:3px; padding-top:4px; padding-bottom:4px; } 
	.buttonrahmen1 { line-height:40px; margin-right:3px; padding:4px; } 
}