/* CSS Document */
@font-face {
 font-family: leelawad;
 src: url("fonts/leelawad.eot") /* EOT file for IE */
}
@font-face {
 font-family: leelawad;
 src: url("fonts/leelawad.ttf") /* TTF file for CSS3 browsers */
}


/* Body and Background ----------------------------------------------------------- */
body {
	font-family: leelawad, verdana, arial;
	/*background-color:#9D968D;*/
	background-color:#5E514D;
	padding: 0px;
	/*font-size:large;*/
	font-size:12pt;
	min-width: 405px;
	color: #2D2926;
}


	/* Background Images */
	.bg1 {
		/*background-size:100px 312px;*/
		height: 500px;
		width: 160px;
		background-repeat: no-repeat;
		position:fixed;
		top: 10px;
		left: 0px;
		z-index: -100;
	}

	.bg2 {
	/*	background-size:100px 312px; */
		height: 500px;
		width: 160px;
		background-repeat: no-repeat;
		position:fixed;
		bottom: 10px;
		right: 0px;
		z-index: -100;
	   -webkit-transition: background-image 0.5s ease-in;
	   -moz-transition: background-image 0.5s ease;
	   -o-transition: background-image 0.5s ease;
	   -ms-transition: background-image 0.5s ease;
	   transition: background-image 0.5s ease;
	}

  .social {
  	position: absolute;
  	right:15%;
  	top: 20px;
  	font-size: 80%;
  	z-index:10;
  }

  .social-image {
  	width:40px;
  }

  .boccia {
  	position: relative;
  	left:0%;
  	top: 20px;
  	font-size: 80%;
  	z-index:100;
  }

  .boccia-image {
  	width:200px;
  }

	/* Responsive */
	@media (min-width: 900px) and (max-width: 1050px) {
    .social {
    	position: absolute;
    	right:5%;
    	top: 40px;
    	font-size: 80%;
    	z-index:10;
    }

    .social-image {
    	width:30px;
    }
    .boccia-image {
      width:150px;
    }

		/* Mittelgrosses Device */
		.bg1 {
			background-size:100px 312px;
			height: 500px;
			width: 160px;
		}

		.bg2 {
			background-size:100px 312px;
			height: 500px;
			width: 160px;
		}
	}
	@media (min-width: 0px) and (max-width: 899px) {
    .social {
    	position: absolute;
    	right:5%;
    	top: 40px;
    	font-size: 80%;
    	z-index:10;
    }

    .social-image {
    	width:25px;
    }
    .boccia-image {
    	width:100px;
    }
  	/* Kleines Device (nicht HD) */
		.bg1 {
			background-size:100px 312px;
			height: 312px;
			width: 100px;
		}

		.bg2 {
			background-size:100px 312px;
			height: 312px;
			width: 100px;
		}
	}
	@media (min-width: 0px) and (max-width: 450px) {
		/* Kleines Device (nicht HD) */
		.bg1 {
			background-size:50px 156px;
			height: 156px;
			width: 50px;
		}

		.bg2 {
			background-size:50px 156px;
			height: 156px;
			width: 50px;
		}
	}


/* Link Definitions ----------------------------------------------------------- */
a:link {
	color:#85704A;
	text-decoration:none;
}

a:visited {
	color: #85704A;
	text-decoration:underline;
}

a:focus {
	color:#848A8D;
	text-decoration:underline;
}

a:hover {
	color:#848A8D;
	text-decoration:underline;
}

a:active {
	color:#85704A;
	text-decoration:underline;
}
/* ---- Link Definitionen ENDE ---- */

/* Text Elements ----------------------------------------------------------- */
p {
	font-size: 100%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

h1 {
	font-size: 180%;
	font-weight: bold;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
}

h2 {
	font-size: 150%;
	font-weight: bold;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
}

h3 {
	font-size: 130%;
	font-weight: bold;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
}

hr {
	border: none;
	border-bottom: 1px dotted #999;
}

.font_patonegrey {
	color: #D7D2CB;
}

.pointer {
	cursor:pointer;
}

img {
	border:none;
}

/* Form Fields ----------------------------------------------------------- */
input {
	width: 200px;
	height: 25px;
	font-size: 11pt;
}

input[type="submit"] {
	border: 1px solid #999;
	border-collapse: separate;
	-webkit-background-origin: border !important;
	-moz-background-origin: border !important;
	background-origin: border-box !important;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 4px;
	width: auto;
	height: auto;
}

input[type="submit"]:hover {
	border: 1px solid #999;
	border-collapse: separate;
	background-color:#2e75ff;
	-webkit-background-origin: border !important;
	-moz-background-origin: border !important;
	background-origin: border-box !important;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 4px;
	-webkit-box-shadow: 0px 0px 2px 2px rgba(255, 255, 255, 0.2);
	-moz-box-shadow: 0px 0px 2px 2px rgba(255, 255, 255, 0.2);
	box-shadow: 0px 0px 2px 2px rgba(255, 255, 255, 0.2);
}

input[type="text"] {
	border: 1px solid #999;
	border-collapse: separate;
	-webkit-background-origin: border !important;
	-moz-background-origin: border !important;
	background-origin: border-box !important;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 2px;
}

input[type="password"] {
	border: 1px solid #999;
	border-collapse: separate;
	-webkit-background-origin: border !important;
	-moz-background-origin: border !important;
	background-origin: border-box !important;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 2px;
}

input[type="checkbox"] {
	width:auto;
}

input[type="radio"] {
	width:auto;
}

button {
	border: 1px solid #999;
	background-color:rgba(133, 112, 74, 1);
	height: 25px;
	padding: 2px;
}

textarea {
	width: 300px;
	height: 100px;
}

select {
	height: 25px;
	font-size: 11pt;
	min-width:205px;
	border: 1px solid #999;
	border-collapse: separate;
	-webkit-background-origin: border !important;
	-moz-background-origin: border !important;
	background-origin: border-box !important;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 2px;
}

.input_short {
	width:180px;
}


/* Inhalt DIVs ----------------------------------------------------------- */
.page_wrapper {
	margin: auto;
	width: 1050px;
	max-width:1050px;
	min-width: 405px;
}
	/* Responsive */
	@media (max-width: 1050px) {
		/* Mittelgrosses Device */
		.page_wrapper {
			width: 100%;
		}
	}

	/*@media (min-width: 0px) and (max-width: 899px) {*/
		/* Kleines Device (nicht HD) */
/*		.page_wrapper {
			width: 600px;
		}
	}
	@media (min-width: 0px) and (max-width: 450px) {*/
		/* Kleines Device (nicht HD) */
		/*.page_wrapper {
			width: 400px;
		}
	}*/



.header {
	margin: auto;
	background-repeat: no-repeat;
	background-position:center center;
	height: 205px;
	background-size: Auto 90%;
}

		@media (min-width: 0px) and (max-width: 899px) {
			.header {
				background-size: Auto 60%;
			}
		}

.footer_contact {
	width: 50%;
	float:left;
	margin: auto;
	color: #FFFFFF;
	font-size: 60%;
}

.footer_sitemap {
	width: 50%;
	float:left;
	margin: auto;
	color: #FFFFFF;
	font-size: 60%;
}


.footer_copyright {
	width: inherit;
	margin: auto;
	color: #D7D2CB;
	font-size: 60%;
	text-align: center;
}

.maincontent_wrapper {
	margin: 5px;
}

.content_wrapper {
	margin: auto;
	padding: 20px;
	width: inherit;
	min-height: 200px;
	height: auto;
	background-color: #EBEAE6;
	-webkit-box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	-moz-box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}


.cur_pointer {
	cursor:pointer;
}



/* APPS Wrapper */
.bottom_apps {
	margin: 5px;
}

.app_wrapper {
	padding: 5px;
	margin-bottom: 5px;
	width: inherit;
	height: auto;
	background-color: #EBEAE6;
	-webkit-box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	-moz-box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	box-shadow: 0px 0px 2px 2px rgba(0, 132, 212, 0.2);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.app_wrapper_inner {
	padding: 2px;
	width: 49%;
	float:left;
}

.app_title {
	font-weight: bold;
}

.app_content {
	font-size: 80%;
}

.fieldgroup {
	width: 100%;
}

.label_attrib {
	width: 240px;
	float:left;
}

/* Import the Mobile CSS */
@import(style_mobile.css)
