@charset "UTF-8";

a[href^="tel"]:link,
a[href^="tel"]:visited,
a[href^="tel"]:hover {
	border: 2px solid #fedd56;
}

h1 { 
    font-size: 1.7em;
    margin-top: 1em;
    font-weight: 100;
}

h2 { 
    font-size: 1.2em;
    margin-top: 1em;
    font-weight: lighter;
}

h3 { 
    font-size: 1em;
    font-weight: lighter;
}

img, object, embed, video {
	max-width: 100%;
	background-color: #f8f8f8;
}

/***** CONTENT ID *****/
#Head {
	width: 100%;
	padding-top: 0px;
	float: right;
}

#Aufmacherbild {
	width: 100%;
	padding-top: 0px;
	float: left;
}

#WorkIMG {
	width: 100%;
	padding-top: 40px;
	float: 15;
	padding-bottom: 30px;
}

#SocMed {
	width: 100%;
	padding-top: 20px;
	float: left;
}

#Einleitung {
	padding-top: 10px;
	float: left;
	padding-left: 5%;
	width: 90%;
}

#Dot {
	padding-top: 20px;
	padding-bottom: 80px;
	float: left;
	width: 100%;
}

#Arbeiten {
	width: 100%;
	padding-top: 10px;
	float: left;
}

#Formbox {
	width: 100%;
	padding-top: 15px;
	float: left;
	background-color: #FFF;
}

#Flyer {
	width: 100%;
	padding-top: 0px;
	float: left;
}

#Formbackground {
	width: 100%;
	padding-top: 0px;
	float: left;
	background-color:#ffeca3;
}

#TxtImgCont {
	width: 100%;
	padding-top: 20px;
	padding-bottom: 30px;
	float: left;
}

#Referenz {
	width: 100%;
	padding-top: 10px;
	float: left;
}


#aboutMe {
	width: 100%;
	padding-top: 10px;
	float: left;
}

#Abbinder {
	width: 100%;
	padding-top: 10px;
	float: left;
}

#Impr {
	width: 100%;
	padding-top: 10px;
	float: left;
}


/***** CONTENT Classes *****/
.ie6 img {
	width:100%;
}

.Headleft {
	width: 75%;
	float: left;
	padding-top: 0px;
	background-color: #fff;
}

.Headright {
	float: right;
	padding-top: 2px;
	background-color: #fff;
	padding-left: 0px;
}

.Headicons {
	max-width: 100%;
	vertical-align: middle;
}	

.AufmPic {
	width: 100%;
	max-width: auto;
	padding-top: 0px;
	float: left;
}

.socmed {
	width: 100%;
	padding-top: 0px;
	background-color: #fff;
}

.ab { 
	margin-right: 5px;
}

.Icon {
	max-width: 100%;
	float: right;
	weight: auto;
	height: 25px;
}

.Txt {
	width: 100%;
	max-width: auto;
	min-width: 300px;
	padding-top: 0px;
	padding-left: 20px;
	padding-right: 20px;
	margin: center;
	float: none;
	font: Arial, Helvetica, sans-serif;
	letter-spacing: 0.1em;
	font-size: 12px;
	font-weight: lighter;
	color: #000;
}

.Work  {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0%;
	padding-right: 0%;
	background-color: #fff;
	margin: center;	
	padding-top: 15px;
}

.WorkPic1 {
	width: 100%;
	max-width: auto;
	padding-top: 0px;
	padding-bottom: 20px;
	float: left;
}

.WorkPic2 {
	width: 100%;
	max-width: auto;
	padding-bottom: 20px;
	padding-top: 20px;
	float: left;
}

.Formcontli {
	width: 100%;
	padding-top: 80px;
	float: left;
	padding-top: 0px;
}

.Formpic {
	width: 100%;
	margin-right: 10px;
	max-width: auto;
	padding-top: 0px;
	padding-bottom: 20px;
}

.Img {
	width: 100%;
	max-width: auto;
	min-width: 300px;
	padding-top: 0px;
	margin: center;
	float: none;
	font: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: lighter;
	color: #000;
	background-image:url(IMG-basics/FiD-angebot-0717.jpg);
	background-size:cover;
}

.Imgfly {
	margin: center;
	max-width: 90%;
	color: #FFFFFF;
	padding-left: 5%;
	padding-right: 5%;
}

.Kunden {
	width: 100%;
	float:left;
	max-width: auto;
	min-width: 300px;
	padding-left: 0%;
	padding-right: 5%;
	border-top: 1px dotted #acacac;
	background-color: #fff;
	padding-top: 0px;
}

.links { 
	float:left;
	width:auto;
}

.rechts {
	width: auto;
	padding-left: 10px;
	padding-top: 20px;
	padding-right: 5%;
	font-weight: lighter;
	font-size: 12px;
	float: auto;
	color: #231f20;
}

.clear {
	clear:left;
}

.Txtfly {
	width: 100%;
	max-width: auto;
	min-width: 300px;
	padding-top: 0px;
	margin: center;
	float: none;
	font: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: lighter;
	color: #231f20;
	border-bottom: 8px solid #ffdd57;
}

.Personal {
	width: 100%;
	background-color: #fff;
	border-top: 1px dotted #acacac;
}

.dotline {
	width: 100%;
	background-color: #fff;
	border-top: 2px dotted #acacac;
}

.perstxt { 
	width:auto;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 20px;
	padding-right: 10px;
	font-weight: lighter;
	font-size: 12px;
	float: auto;
	color: #231f20;
}

.persimg {
	width: auto;
	padding-top: 0px;
	padding-left: 30%;
}

.abbinder {
	width: 100%;
	max-width: auto;
	padding-top: 0px;
}	

.Impressum {
	width: 100%;
	max-width: auto;
	padding-top: 0px;	
}

.Abb {
	width: 100%;
	max-width: auto;
	min-width: 300px;
	padding-left: 0px;
	padding-right: 0px;
	background-image:url(IMG-basics/FiD-abbPix-repeat-0116.jpg);
	background-position:right;
	background-repeat:repeat;
}

.Abbtxt {
	padding: center;
	padding-top: 10px;
	font-weight: lighter;
	font-size: 12px;
	color: #231f20;
}


/***** VALIDATION & ERROR MESSAGES *****/

#validation{
	display:none;
	background:url('../img/loading.gif') no-repeat 0 1px;
	padding-left:20px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
}

.errormessage, .validationmessage{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	-moz-border-radius:4px;
	-khtml-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}

.errormessage{
	display:none;
	margin:4px 0;
	width:260px;
}

.validationmessage{
	width:360px;
	margin-bottom:16px;
	padding:10px 6px;
}

.validationmessage{background-color:#231f20; color:#fff;}

.errormessage{background-color:#231f20; color:#fff; padding:4px 6px;}

/***** KONTAKTFORMULAR *****/







/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 481px) 
{
	
a[href^="tel"]:link,
a[href^="tel"]:visited,
a[href^="tel"]:hover {
	border: 0px;
}

.Headright {
	padding-top: 48px;
	padding-left: 40px;
}

.Headicons {
	padding-right: 20px;
}

.Icon {
	weight: auto;
	height: 32px;
}

.ab { 
	margin-right: 10px;
}

.Txt {
	font-size: 13px;
	background-position: top;
	padding-left: 15 px;
	padding-right: 15 px;
}

.TxtImpr {
	padding-top: 30px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 13px;
}

.Work  {
	padding-top: 20px;
}

.Formcontli {
	width: 100%;
	padding-top: 0px;
	text-align: center;
	font-size: 13px;
}

.rechts {
	padding-left: 330px;
	padding-right: 30px;
	font-size: 14px;
}

.Img {
	font-size: 13px;
}

.Personal {
	width: 100%;
	background-color: #fff;
}

.perstxt { 
	float:left;
	width:65%;
	padding-left: 10px;
	padding-top: 20px;
	padding-right: 10px;
	font-weight: lighter;
	font-size: 14px;
	float: auto;
	color: #231f20;
}

.persimg {
	width: auto;
	float: right;
	padding-right: 30px;
	padding-top: 20px;
	padding-left: 00%;
	
}

.Abbtxt {
	font-size: 13px;
}


}

/* Desktoplayout: 769 bis maximal 1232 px.  Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 769px) 
{

.Headright {
	padding-top: 80px;
	padding-left: 60px;
}

.Icon {
	weight: auto;
	height: 40px;
}

.Txt {
	font-size: 16px;
	background-size: 85%;
	background-position: top;
	color: 000;
}

.TxtImpr {
	padding-top: 30px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 15px;
}

.ab { 
	margin-right: 20px;
}

.Work  {
	padding-top: 25px;
}

.Formcontli {
	width: 100%;
	text-align: center;
	padding-top: 0px;
	font-size: 15px;
}

.Img {
	font-size: 16px;
	background-image: url(IMG-basics/FiD-angebot-0717.jpg);
}

.Kunden {
	padding-left: auto;
	padding-right: 5%;
	float: left;
	width: 100%;
	border-top: 1px dotted #acacac;
}

.Personal {
	padding-top: 15px;
	font-size: 15px;
}

.perstxt { 
	float:left;
	width:75%;
	padding-left: 5%;
	padding-top: 20px;
	padding-right: 10px;
	font-weight: lighter;
	font-size: 15px;
	float: auto;
	color: #231f20;
}

.persimg {
	width: auto;
	float: right;
	padding-right: 5%;
	padding-top: 0px;
	padding-left: 0%;
	
}

.rechts {
	padding-left: 330px;
	padding-top: 50px;
	padding-right: 30px;
	font-size: 15px;
}

.Abbtxt {
	font-size: 14px;
}


}