@import url(/fonts.css);

body{
  font-family: "Montserrat", sans-serif;
  font-style: normal;
  font-size:16px;
  margin: 0 auto;
  color: #444;
}

img {max-width:100%; height:auto;}

header img {text-align: left; margin: 0 auto;}

/* ----- typography ----- */
h1, h2, h3, h4, h5, h6 {color:#434343 ; font-weight: 400;}

h1 {font-size:3.0em !Important; text-align:center; color: #97c21e}

h2 {font-size:1.7em}

h3 {font-size:1.5em; color: #222}

h4 {font-size:1.25em; font-weight:bold}

h5 {font-size:1em}

h6 {font-size:0.9em}

p {
	/*text-align:justify;*/
	color:#666  ;
	font-size: 1.15em;
	line-height:1.5em;
	letter-spacing: 0.025em;
	margin:0 0 0.8em 0;
	-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
}

a {color: #808080; text-decoration: none; line-height: inherit; font-weight: bold; }
a:hover {color: #000099; text-decoration: underline; }
a:focus {color: #000099; outline: none; }

hr{
	border:solid #666 1px; height:1px;
	clear:both;
}

li {
	font-size: 1.15em;
    line-height: 1.0em;
    letter-spacing: 0.025em;
    color: #666;
    margin: 0 0 0.8em 0;
    -moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

ul {
	margin-top: 0;
	margin-bottom: 10px;
	margin-left: 0.9em;
	padding-left: 0.9em;
	list-style-type: square
}

ol {
	margin-top: 0;
	margin-bottom: 10px;
	margin-left: 0.9em;
	padding-left: 0.9em;
}

article a {color: #808080 !Important; text-decoration: none; line-height: inherit; font-weight: bold; }
article a:hover {color: #97c21e !Important; text-decoration: underline; }
article a:focus {color: #97c21e !Important; outline: none; }

address {
	line-height:120%;
	margin: 10px 0 20px 0;
	padding-left: 10px;
	border-left: 6px solid #ccc;
	font-style: normal;
	font-weight: bold;
	}

blockquote {
	padding: 10px;
	margin: 0 0 20px 0;
}

.price {
	padding:10px 5px 25px;
	margin-bottom:25px;
	border-style: none;
    --border-style: none;
    border-radius: 15px 15px 15px 15px;
    box-shadow: 0 0 6px 0 rgb(0 0 0 / .5);
}

.price a:link {
	font-weight: normal;
	text-transform: uppercase; 
	background-color:rgba(148, 193, 31, 1.0); 
	color:#ffffff !important;
	text-decoration: none;
	padding:5px 15px;
	border-radius: 5px 5px 5px  5px; 
-webkit-border-radius: 5px 5px 5px  5px; 
-moz-border-radius: 5px 5px 5px  5px; 
}
.price a:hover {
    background-color:rgba(148, 193, 31, 0.1);
	-webkit-transition: all 1s ease;
    transition: all 1s ease;	
	border: solid 1px #97c21e;
	color: #97c21e;
}

.price a:active, a:visited, a:focus, a:after {
	background-color:rgba(148, 193, 31, 1.0); 
}

pre, code {
	padding: 5px 0 10px 6px;
	margin: 3px 0 20px 0;
	font-size:1em;
	overflow:auto;
	line-height:1.5em;
	color:#eee;
}

input , textarea, pre, code, blockquote, select {
	border: 1px solid #ccc;  color: #000;
}

.imgl {
float:left;
margin:0 15px 10px 0
}

.imgr {
float:right;
margin:0 0 10px 15px
}

.imgicon {width:50%;}

.picfull {width:100%; height:auto;}
.pic2left {float:left; max-width:49%; margin: 3px 1% 2px 0; height:auto;}
.pic2right {float:right; max-width:49%; margin: 3px 0 2px 0.5%; height:auto;}

.pic3left {float:left; max-width:32%; margin: 3px 1.5% 2px 0; height:auto;}
.pic3right {float:right; max-width:32%; margin: 3px 0 2px 0.3%; height:auto;}

.pic4left {float:left; max-width:24%; margin: 3px 1% 2px 0; height:auto;}
.pic4right {float:right; max-width:24%; margin: 3px 0 2px 0.5%; height:auto;}

/*Tabelle*/
* {
	box-sizing:border-box;
}

table {
	width:100%;
}

table, td, tr, th {
	border-bottom:1px solid #666;
	border-collapse: collapse;
	text-align: left;
}

td, tr, th {
	padding:0.5em;
}

th {
	background:#eee;
	font-weight: normal;
}


/*Show and Hide Responsive*/
.hideOnDesktops {display: none;}

/* Small devices (tablets, up to 768px) */
@media (max-width: 600px) {
	.pic2left, .pic2right {max-width: 100%;  margin: 3px 0 2px 0;}
	.pic3left, .pic3right, .pic4left, .pic4right  {max-width: 49%;}

	/*Show and Hide Responsive*/
	body .hideOnTablets {display: none;}
	.hideOnDesktops {display: block;}
}

/* Small devices (Smartphone, up to <480px) */
@media (max-width: 479px) {
    h1 {font-size:2.25em !Important;}
	.pic2left, .pic2right {max-width: 100%;  margin: 3px 0 2px 0;}
	.pic3left, .pic3right, .pic4left, .pic4right  {max-width: 49%;}
	.phone-one .inner h2 {font-size: 1.0em !important;}
    .phone-one .inner .fa-fw {margin-top:2px !important}
    .phone-one .inner .content::after {height: 0% !important;}

	/*Show and Hide Responsive*/
	.hideOnMobiles {display: none;}
	body .hideOnTablets {display: block;}
	body .hideOnDesktops {display: block;}
}

/*table*/
@media screen and (max-width:700px) {
	
	table, tr, td {
		padding:0;
		border-bottom: none;
	}

	table {
		border:none;
	}

	thead {
		display:none;
	}

	tr {
		float: left;
		width: 100%;
		margin-bottom: 2em;
	}

	td {
		/*float: left;*/
		width: 100%;
		padding:0.1em;
	}

	/*td::before {
		content:attr(data-label);
		word-wrap: break-word;
		background: rgba(148, 193, 31, 1.0);
		color: #fff;
		border-right:1px solid #666;
		width: 20%;
		float:left;
		padding:1em;
		font-weight: normalM;
		margin:-1em 1em -1em -1em;
	}*/
}
