@charset "utf-8";
/* CSS Document */

body {
	margin:0px;
	padding:0px;
	font-family:Open Sans, Verdana, Geneva, sans-serif;
	font-weight:300;
	background-image:url(../images/BG_linie.png);
	overflow-y: scroll;
}

hr {
	height:1px;
	background-color:#000000;
	text-decoration:none;
	border:0;
	margin:0px;
	margin-bottom:5px;
	padding:0px;
}

#header {
	width:100%;
	height:120px;
	background-color:#FFFFFF;
	position:absolute;
	display:block;
	z-index:2000;
	margin-top:0px;
	top:0px;
}

#scroll_header {
	width:100%;
	height:58px;
	overflow:hidden;
	background-color:#FFFFFF;
	position:fixed;
	display:block;
	z-index:3000;
	margin-top:0px;
	top:0px;
}

#mobile_header {
	display:none !important;
}

.headertable {
	width:1000px !important;
}

#topmenu_position {
	position:absolute;
	width:250px !important;
}

#topmenu {
	position:relative;
	float:right;
	height:48px !important;
	right:0px;
	margin-top:14px;
	overflow:hidden;	
}

#topmenu a {
	display:block;
	float:left;
	border:none;
}

#topmenu a img {
	margin-left:10px;
	border:none;
}

#basic_topmenu_position {
	position:absolute;
	width:250px;
}

#basic_topmenu {
	position:relative;
	float:right;
	height:48px !important;
	right:0px;
	margin-top:22px;
	overflow:hidden;	
}

#basic_topmenu a {
	display:block;
	float:left;
	border:none;
}

#basic_topmenu a img {
	margin-left:10px;
	border:none;
}

.contenttable, table.contenttable, td.contenttable_td {
	width:1000px !important;
	margin-top:150px;
}

.bildrahmen_standard {
	border: 10px solid #FFFFFF;
	float: left;
	overflow:visible;
	margin-bottom:20px;
	cursor:pointer;
}

.bildrahmen_standard img {
	display:block;
	width:100%;
	height:auto;
	float:none;
	z-index:100;
}

.bildrahmen_standard div.rollover {
	position: absolute;
	display: block;
	overflow: hidden !important;
	width: 0px;
	height: 90px;
	float: none;
	z-index: 1000;
	background-image: url(../images/Rollover01.png);
	background-position: top right;
	background-repeat: no-repeat;
}

.bildrahmen_standard div.rollover div.text h2 {
	margin-top: 30px;
	margin-left: 40px;
	margin-bottom: 5px;
	font-size: 24px;
	font-weight: 700;
	line-height: 111%;
}

.bildrahmen_standard div.rollover div.text p {
	margin-top:0px;
	margin-left:40px;
	margin-bottom:5px;
	font-size:18px;
	font-weight:300;
}

/* PORTFOLIO------------------------------------------------------------------PORTFOLIO------------------------------------------------------ */


@keyframes instantreveal1 {
    from {display:none; visibility:hidden; opacity:0; width: 380px; margin-left:45px; margin-top:26px; margin-bottom:46px;}
    to {display:block; visibility:visible; opacity:1; width: 470px; margin-left:0px; margin-top:0px; margin-bottom:20px;}
}

.instantrevealthis1 {
	animation-name: instantreveal1;
    animation-duration: 1.2s;
}

@keyframes instantreveal2 {
    from {display:none; visibility:hidden; opacity:0; width: 380px; margin-left:90px; margin-top:26px; margin-bottom:46px;}
    to {display:block; visibility:visible; opacity:1; width: 470px; margin-left:0px; margin-top:0px; margin-bottom:20px;}
}

.instantrevealthis2 {
	animation-name: instantreveal2;
    animation-duration: 1.2s;
}

div.text h2 {
	margin-top: 0px;
	margin-left: 0px;
	margin-bottom: 10px;
	font-size: 36px;
	line-height: 36px;
	font-weight: 300;
	display: inline-block;
	
}

.text h3 {
	margin-top:0px;
	margin-left: 0px;
	margin-bottom: 0px;
	font-size: 24px;
	font-weight: 500;
	display:inline-block;
}

.text h4 {
	margin-top:0px;
	margin-bottom: 0px;
	padding-top:4px;
	font-size: 18px;
	font-weight: 300;
	display:inline-block;

}
.text h5 {
	margin-top:0px;
	margin-bottom: 0px;
	padding-top:4px;
	font-size: 18px;
	font-weight: 300;
	font-style:italic;
	display:inline-block;
}

.bildrahmen_voll {
	width: 980px;
	height: auto;
}

.bildrahmen_voll div.rollover div.text h2 {
	margin-top: 80px;
	margin-left: 90px;
	margin-bottom: 5px;
	font-size: 50px;
	font-weight: 700;
}

.bildrahmen_voll div.rollover div.text p {
	margin-top:0px;
	margin-left:90px;
	margin-bottom:5px;
	font-size:38px;
	font-weight:300;
}

.bildrahmen_halb1 {
	width: 470px;
	height: auto;
	margin-right:20px;
	}

.bildrahmen_halb2 {
	width: 470px;
	height: auto;
	}

.bildrahmen_drittel1 {
	width: 300px;
	height: auto;
	margin-right:20px;
}

.bildrahmen_drittel2 {
	width: 300px;
	height: auto;
	margin-right:20px;
}

.bildrahmen_drittel3 {
	width: 300px;
	height: auto;
}

.closedetail {
	display:block;
	float:right;
}
.closedetail2 {
	display:none;
	float:right;
}
.subhead1 {
	float:left;
}

.subhead2 {
	float:right;
}
#Stift_Icon {
	width:27px;
	height:auto;
}
#Feder_Icon {
	width:23px;
	height:auto;
}
#Copic_Icon {
	width:28px;
	height:auto;
}



.portfoliotext h2.h2_desktop {
	display:inline-block;
}
.portfoliotext h2.h2_mobile {
	display:none;
}
/* KONTAKT------------------------------------------------------------------KONTAKT------------------------------------------------------ */

.kontakttable {
	margin-top:20px;
	margin-bottom:40px;
	width:1000px;
}
	
.nachricht {
	width:640px;
	padding-right:20px;
	float:left;
	min-height: 400px;
}

#kontakt_adresse, #kontakt_mobile, #kontakt_mail {
	display:block;
	width:340px;
	text-align:left;
	vertical-align:top;
	float:left;
}

#Button_Home {
	width:60px;
	height:auto;
	margin-top:36px;
}
#Phone_Icon2 {
	width:60px;
	height:auto;
}
#Mail_Icon2 {
	width:60px;
	height:auto;
}		

.adresse h5 {
	font-size: 18px;
	line-height: 9px;
	font-weight: 300;
	margin-left: 5px;
	margin-top: 6px;
	letter-spacing: 0.2px;
}
.adresse h6 {
	font-size: 24px;
	font-weight: 500;
	display:inline-block;
	margin-left:5px;
	margin-top:0px;
	margin-bottom:0px;
}	
.mobile h5 {
	font-size:18px;
	line-height:9px;
	font-weight: 300;
	margin-left: 5px;
	margin-top: 6px;
}	
.mobile h6 {
	font-size: 24px;
	font-weight: 500;
	display:inline-block;
	margin-left:5px;
	margin-top:0px;
	margin-bottom:0px;
}
.mail h5 {
	font-size: 18px;
	line-height:9px;
	font-weight: 300;
	margin-left: 5px;
	margin-top: 6px;
	letter-spacing: 0.2px;
}
.mail h6 {
	font-size: 24px;
	font-weight: 500;
	margin-left:5px;
	margin-top:0px;
	margin-bottom:0px;
}
.nachrichten {
    margin-bottom: 20px;
    background: #E4E4E4 none repeat scroll 0% 0%;
    overflow: visible;
}
h7, .h7 {
    font-size: 29px;
    line-height: 24px;
    margin-top:0px;
    padding:0px 0px 13px;
    border-bottom: 1px solid #F1F1F1;
    font-weight: 500;
}
input[type="submit"] {
    font-weight: bold;
    text-align: left;
    font-size: 16px;
    background: #E4E4E4 none repeat scroll 0% 0%;
    padding: 20px 24px 20px;
	border-radius: 0;
	-webkit-appearance: none;
	cursor: pointer;
}
input[type="email"] {
	background-color:#d3d3d3;
    padding: 20px 24px 20px;
	border-radius: 0;
	-webkit-appearance: none;
}
textarea {
   height: 346px;
  	border-radius: 0;
	-webkit-appearance: none;
	resize:none !important;
}
input, textarea {
    width: 100%;
    box-sizing: border-box;
    font-family: Arial,sans-serif;
    font-size: 100%;
    font-weight: 300;
    background: #e8e8e8 none repeat scroll 0% 0%;
    border-width: medium medium 1px;
    border-style: none none none;
    border-color: -moz-use-text-color -moz-use-text-color #F1F1F1;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    margin: 10px 0px 0px;
}	

textarea {
    padding: 20px 24px 20px;
}

input[type="submit"]:hover {
	background-color:#CCCCCC;
	color:#FFFF00 !important;
}

/* PROFIL------------------------------------------------------------------PROFIL------------------------------------------------------ */ 
.profiltable {
	margin-top:20px;
	margin-bottom:40px;
	
}
.portrait {
	width:490px;
	display:block;
	float:left;
}
.vita {
	display:inline-block;
	text-align:left;
	vertical-align:top;
	margin-left:20px;
	width:490px;
	height:auto;
}	
	
.vita h5 {
	font-size: 17px;
	line-height:25px;
	font-weight: 300;
	margin-top:0px;
	margin-bottom:0px;
	color:#6E6E6E;
}
.vita a:link, a:visited {
  font-size: 17px;
  font-style:italic;
	line-height:25px;
	font-weight: 300;
	margin-top:0px;
	margin-bottom:0px;
	color:#363636;
  text-decoration: none;
}
.vita a:hover {
	color:#A2A2A2;
	text-decoration: none;
}	
.vita h8 {
	font-size: 18px;
	font-weight: 500;
	line-height:18px;
	margin-top:0px;
	vertical-align:5px;
	color:#000000;
}
.vita h9 {
	font-size: 25px;
	font-weight: 500;
	line-height:18px;
	margin-top:0px;
	vertical-align:5px;
	color:#000000;
}

/* IMPRESSUM---------------------------------------------------------------IMPRESSUM------------------------------------------------------ */

.impressum_text1 {
	width:480px;
	display:inline-block;
	margin-right:28px;
	margin-top:10px;
}
.impressum_text2 {
	width:480px;
	display:inline-block;
	
}		

/* FOOTER------------------------------------------------------------------FOOTER------------------------------------------------------ */

#footer {
	width:100%;
	height:90px;
	background-color:#3d3d3d;
	position: relative; 
	display:block;
	z-index:2000; 
	margin-bottom:0px; 
	bottom:0px; 
}	
.footer h1 {
	font-size:16px;
	font-weight: 400;
	padding-top:10px;
	margin-bottom:0px;
	color:#777777;	
}

a:link, a:visited, a:active, a:focus {
	color:#777777;
	text-decoration: none;
	outline:none !important;
}
a:hover {
	color:#ffff47;
	text-decoration: none;
	outline:none !important;
}

/* @media (max-width: 1000px) ------------------------------------------------------------------@media (max-width: 1000px)------------------------------------------------------ */
@media (max-width: 1000px) {

body {
	
	background-image:url(../images/BG_linie_mobile.png);
	
}
	
#header {
	display:none !important;
}

#scroll_header {
	display:none !important;
}

#mobile_header {
	width:100%;
	height:68px !important;
/*	overflow:hidden; */
	background-color:#FFFFFF;
	position:fixed;
	display:block !important;
	z-index:3000;
	margin-top:0px;
	top:0px;
}

.mobile_headertable {
	width:320px !important;
}
.text h8 {
	font-size: 30px;
	font-weight: 300;
	letter-spacing: 18px;
	display: block;
	width:300px;
	padding-left:9px;
	
}

.contenttable, table.contenttable {
	width:320px !important;
	margin-top:80px;
}
td.contenttable_td {
	width:320px !important;
	padding-left:10px !important;
	padding-right:10px !important;
}


.bildrahmen_standard {
	border: 10px solid #FFFFFF;
	float: left;
	overflow:visible;
	margin-bottom:10px;
	cursor:pointer;
}

.bildrahmen_standard img {
	display:block;
	width:100%;
	height:auto;
	float:none;
	z-index:100;
}

.bildrahmen_standard div.rollover {
	position: absolute;
	display: block;
	overflow: hidden !important;
	width: 0px;
	height: 90px;
	float: none;
	z-index: 1000;
	background-image: url(../images/Rollover01.png);
	background-position: top right;
	background-repeat: no-repeat;
}


.bildrahmen_standard div.rollover div.text h2 {
	margin-top: 15px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 5px;
	font-size: 24px;
	font-weight: 700;
	line-height: 111%;
}

.bildrahmen_standard div.rollover div.text p {
	margin-top:0px;
	margin-left:20px;
	margin-right: 20px;
	margin-bottom:5px;
	font-size:18px;
	font-weight:300;
}

/* PORTFOLIO ------------------------------------------------------------------@media PORTFOLIO------------------------------------------------------ */


@keyframes instantreveal1m {
    from {display:none; visibility:hidden; opacity:0; width: 240px; margin-left:30px; margin-top:17px; margin-bottom:27px;}
    to {display:block; visibility:visible; opacity:1; width: 300px; margin-left:0px; margin-top:0px; margin-bottom:10px;}
}

.instantrevealthis1 {
	animation-name: instantreveal1m;
    animation-duration: 1.2s;
}

@keyframes instantreveal2m {
    from {display:none; visibility:hidden; opacity:0; width: 240px; margin-left:30px; margin-top:17px; margin-bottom:27px;}
    to {display:block; visibility:visible; opacity:1; width: 300px; margin-left:0px; margin-top:0px; margin-bottom:10px;}
}

.instantrevealthis2 {
	animation-name: instantreveal2m;
    animation-duration: 1.2s;
}

div.text h2 {
	margin-top: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
	font-size: 24px;
	line-height: 26px;
	font-weight: 300;
	display: inline-block;
	
}
.text h3 {
	margin-top:0px;
	margin-left: 0px;
	margin-bottom: 0px;
	font-size: 20px;
	line-height:20px;
	font-weight: 500;
	
}

.text h4 {
	margin-top:0px;
	margin-left: 0px;
	margin-bottom: 0px;
	padding-top:4px;
	display:block;
	font-size: 16px;
	font-weight: 300;

	
}
.text h5 {
	font-size: 16px;
	font-weight: 300;
}


.bildrahmen_voll {
	margin-top:0px;
	width: 300px;
	height: auto;
}

.bildrahmen_voll div.rollover div.text h2 {
	margin-top: 15px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 5px;
	font-size: 24px;
	font-weight: 700;
	line-height: 111%;
}

.bildrahmen_voll div.rollover div.text p {
	margin-top:0px;
	margin-left:20px;
	margin-right: 20px;
	margin-bottom:5px;
	font-size:18px;
	font-weight:300;
}

.bildrahmen_halb1 {
	width: 300px;
	height: auto;
	margin-right:0px;
	}

.bildrahmen_halb2 {
	width: 300px;
	height: auto;
	}

.bildrahmen_drittel1 {
	width: 300px;
	height: auto;
	margin-right:0px;
}

.bildrahmen_drittel2 {
	width: 300px;
	height: auto;
	margin-right:0px;
}

.bildrahmen_drittel3 {
	width: 300px;
	height: auto;
}

.closedetail {
	display:none;
	float:right;
}
.closedetail2 {
	display:block;	
}
.subhead1 {
	float:left;
}

.subhead2 {
	float:left;
}
#Stift_Icon {
	width:22px;
	height:auto;
}
#Feder_Icon {
	width:20px;
	height:auto;
}
#Copic_Icon {
	width:20px;
	height:auto;
}
.portfoliotext h2.h2_desktop {
	display:none;
}

.portfoliotext h2.h2_mobile {
	display:inline-block;
	margin-left:10px;
	margin-top:0px;
}

.portfoliotext {
	width:300px;
	height:auto;
	display:inline-block;
	position:absolute;
	z-index:2900;
	top:110px;
}

.text h2.h2_mobile span {
	background-color:#000000;
	color:#FFFFFF;
}
.desktopsliderimage {
	display:none;
}
.mobilesliderimage {
	display:block;
}			

/* KONTAKT ------------------------------------------------------------------@media KONTAKT------------------------------------------------------ */

.kontakttable {
	width:100%;
}	

.nachricht {
	width:100%;
	padding-right:0px;
	float:none;
	display:block;
	min-height: 0px;
}
textarea {
   height: 146px;
}
.closedetail2 {
	display:block;
	padding-top:0px;	
}	
#kontakt_mobile {
	display:block;
	width:105px;
	vertical-align:top;
}
#kontakt_mail {
	display:block;
	width:10px;
	vertical-align:top;
}
#kontakt_adresse {
	display:block;
	width:105px;
	padding-left:20px;
	vertical-align:top;
}
	
#Button_Home {
	width:50px;
	height:auto;
	margin-top:0px;
}
#Phone_Icon2 {
	width:50px;
	height:auto;
}
#Mail_Icon2 {
	width:50px;
	height:auto;
}			

.adresse h5 {
	display:none;
}
.adresse h6 {
	display:none;
}	
.mobile h5 {
	display:none;
}	
.mobile h6 {
	display:none;
}
.mail h5 {
	display:none;
}
.mail h6 {
	display:none;
}
.nachrichten {
	margin-bottom: 10px;
    background: #E4E4E4 none repeat scroll 0% 0%;
    overflow: visible;
	display:block;
}
h7, .h7 {
    font-size: 22px;
    border-bottom: 1px solid #F1F1F1;
    font-weight: 500;
}
input[type="submit"] {
    font-weight: bold;
    text-align: left;
    font-size: 14px;
    background: #E4E4E4 none repeat scroll 0% 0%;
    padding: 10px 20px 10px;
}
input[type="email"] {
	background-color:#d3d3d3;
    padding: 10px 20px 10px;
}

input, textarea {
    width: 100%;
    box-sizing: border-box;
    font-family: Arial,sans-serif;
    font-size: 100%;
    font-weight: 300;
    background: #e8e8e8 none repeat scroll 0% 0%;
    border-width: medium medium 1px;
    border-style: none none none;
    border-color: -moz-use-text-color -moz-use-text-color #F1F1F1;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    margin: 10px 0px 0px;
}	

textarea {
    padding: 10px 20px 20px;
}
/* PROFIL ------------------------------------------------------------------@media PROFIL------------------------------------------------------ */
.profiltable {
	width:300px !important;
	margin-top:15px;
	
}	
.portrait {
	width:300px !important;
	margin-bottom:10px;
}
.vita {
	display:block;
	margin-left:0px;
	text-align:left;
	vertical-align:top;
	width:300px;
	height:auto;
}	
	
.vita h5 {
	font-size: 17px;
	line-height:25px;
	font-weight: 300;
	margin-top:0px;
	margin-bottom:0px;
	color:#6E6E6E;
}
.vita a:link, a:visited {
  font-size: 15px;
  font-style:italic;
	line-height:25px;
	font-weight: 300;
	margin-top:0px;
	margin-bottom:0px;
	color:#363636;
  text-decoration: none;
}
.vita a:hover {
	color:#000000;
	text-decoration: none;
}	
.vita h8 {
	font-size: 15px;
	font-weight: 500;
	line-height:18px;
	margin-top:0px;
	vertical-align:5px;
	color:#000000;
}
.vita h9 {
	font-size: 21px;
	font-weight: 500;
	line-height:18px;
	margin-top:0px;
	vertical-align:5px;
	color:#000000;
}

/* IMPRESSUM---------------------------------------------------------------@media IMPRESSUM------------------------------------------------------ */

#impressum {
	width: 300px;
}	
	
.impressum_text1 {
	width:300px;
	display:block;
	margin-top:10px;
	
}
.impressum_text2 {
	width:300px;
	display:block;
}		
/* FOOTER ------------------------------------------------------------------@media FOOTER------------------------------------------------------ */
		
}
/*.footer h1 {
	font-size:24px;
	font-weight: 400;
	padding-top:10px;
	margin-bottom:0px;
	color:#777777;	
}*/
a:link, a:visited  {
	color:#777777;
  text-decoration: none;
}
a:hover {
	color:#ffff47;
	text-decoration: none;
}

@media (min-width: 1001px) {	
.desktopsliderimage {
	display:block !important;
	visibility:visible !important;
}
.mobilesliderimage {
	display:none !important;
	visibility:hidden !important;
	width:300px !important;
	height:auto !important;
}
.slidervideo {
	width:980px;
	height:633px;
}
}

@media (max-width: 1000px) {
.desktopsliderimage {
	display:none !important;
	visibility:hidden !important;
}
.mobilesliderimage {
	display:block !important;
	visibility:visible !important;
	width:280px !important;
	height:auto !important;
}
.slidervideo {
	width:280px;
	height:277px;
}
}

	
