@font-face {
  font-family: "MySourceSansPro";
  font-weight: 400;
  src: url("./myfonts/SourceSansPro-Regular.ttf");
  
}
@font-face {
  font-family: "MySourceSerifPro";
  font-weight: 400;
  src: url("./myfonts/SourceSerifPro-Regular.ttf");
  
}


html { font-size: 100.01%; }
body { font-size: 1em; line-height: 1.2em;}
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, address, code, strong, em, img, ol, ul, li, form, label, input, textarea, table, tr, td { margin: 0; padding: 0; vertical-align: baseline; }
:focus { outline: 0; }
table { border-collapse: collapse; border-spacing: 0; }
table td { padding: 0; }

.fleft { float: left; }
.cleft { clear: left; }
.fright { float: right; }
.cright { clear: right; }
.cboth { clear: both; height:0px;}
.blk { display: block; }
.inl { display: inline; }

IMG {border:0px;}
.spacer10{height:10px;}
.spacer20{height:20px;}

html, body { margin:0; padding:0;  font-family: 'MySourceSerifPro', serif; color:#EFEFEF; text-align: center;  font-size:18px; font-weight:normal; line-height:25px; height:100%; background-color:#000000; background-image: url("./../images/back.jpg"); background-repeat: repeat-y; background-position:50% 0%; background-size:100% auto}
#MURAMATSU-Header{position:fixed; width:100%; z-index:100; }
#MURAMATSU-Logo{position:absolute;float:left; width:96%; text-align:left; padding: 2%; top:40px; z-index:10}
#MURAMATSU-Logo IMG{width:100%; height:auto; max-width:250px;}
#MURAMATSU-Menue{position:absolute;float:right; width:100%; text-align:left; background-color:#000000; height:40px; top:0; z-index:9; border-bottom:1px solid #D50C2F; }
#MURAMATSU-Body{position:fixed; width:100%; z-index:1; height:100%; background-image: url("./../images/mamatsu-background.jpg"); background-repeat: no-repeat; background-position:50% 0%; }



#myImpressum, #myDatenschutz {
	position: relative; 
	width:90%;  
	max-width:800px; 
	text-align: left;  
	left: 50%;  -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%); 
	font-weight:normal; 
	font-size:16px; 
	line-height:22px;
	z-index:9999;
	padding: 20px 2%;
	max-height:600px;
	top:50px;
	color:#000000;
	border:1px solid #000000;
	overflow:auto;
	background-color:#FFFFFF;
}
#myImpressum a, #myDatenschutz a{color:#000000; text-decoration:none}
#myDatenschutz {display:none; background-color:#F0F0F0; border-radius:5px}
#myImpressum {display:none; background-color:#F0F0F0; border-radius:5px}
#myDatenschutz ul{margin: 5px 0px 5px 25px}
.myClose {float:right}
.myClose IMG{width:25px; height:auto; cursor:pointer}


H1{color:#000000;letter-spacing:2px; font-weight:bold; margin-bottom:25px; line-height:32px;}

#footer {z-index:3; display:none; width:96%; text-align: center; position:fixed; bottom:5px; left: 50%;  -webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%); padding: 0 2%;}
#footer .inner1{letter-spacing:2px; font-weight:400; text-align: center; padding: 0 2%; margin-bottom:25px;  position:relative}
#footer .inner2{font-weight:light;  text-align: center; padding: 0 2%; font-size:12px;  position:relative;  margin:0 auto; width:160px}
#footer a{color:#FFFFFF; text-decoration:none}

#imp, #datenschutz{float:left; cursor:pointer}
#spacer{float:left; padding:0 5px}



@media screen and (max-width: 1024px) {
	#MURAMATSU-Logo IMG{max-width:200px;}
}

@media screen and (max-width: 780px) {
	#MURAMATSU-Logo{top:0px; max-width:125px}
	#MURAMATSU-Menue{border:0}
	#MURAMATSU-Logo IMG{max-width:125px;}
	#MURAMATSU-Header{background-color:#000000; border-bottom:1px solid #D50C2F; height:105px;}
	#MURAMATSU-Body{margin-top:100px}
}

@media screen and (max-width: 580px) {
	#MURAMATSU-Logo IMG{max-width:90px;}
	#MURAMATSU-Header{background-color:#000000;height:75px}
	#MURAMATSU-Body{margin-top:70px}
}


#navigation{position:absolute;  right:2.7%; top:10px; }
#navigation IMG.nav{width:100%; height:auto; max-width: 34px; cursor:pointer;}
#navigation IMG.nav2{width:100%; height:auto; max-width: 34px; cursor:pointer; display:none}



@media screen and (max-width: 780px) {
#navigation{top:10px;}
#navigation IMG.nav{width:75%; height:auto; max-width: 25px }
#navigation IMG.nav2{width:75%; height:auto; max-width: 25px }
}

@media screen and (max-width: 480px) {
#navigation{top:18px;}
}

#back{display:none; width:100%; height:100%; position:fixed;  z-index:2; background-image: url('./../images/trans.png'); }



@media screen and (max-width: 600px) {
#wrapper {font-size:18px; line-height:24px;}
#myImpressum, #myDatenschutz {max-height:100%; top:0; border:0px; right:0}
}
	
@media screen and (max-width: 480px) {
#wrapper {font-size:16px; line-height:22px;}
#footer{font-size:14px; line-height:18px;}
}	
	
@media screen and (max-width: 380px) {
#wrapper {font-size:14px; line-height:20px;}
}