@charset "UTF-8";
/* Einfache fließende Medien
   Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 unterstützt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
	width:100%;
}
/*
	Dreamweaver-Eigenschaften für fließende Raster
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Idee durch den Artikel "Responsive Web Design" von Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	und "Golden Grid System" von Joni Korpi
	http://goldengridsystem.com/
*/

/* Layout für Mobilgeräte: 480 px oder weniger. */
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#headerback {
	margin-left: 0;
	width: 100%;
	height: 210px;
	margin: 0px;
	top: -500px;
	margin-top:-200px;
	padding-left: 0.00%;
	padding-right: 0.00%;
	display: block;
	position: relative;
	background-image: url(../../MGart-web-design/ba_he.jpg);
	background-repeat: repeat;
}
#body-header-time {
	clear: both;
	float: left;
	margin-left: 0;
	margin-right: auto;
	width: 100.00%;
	padding-left: 0.00%;
	padding-right:10.00%;
	display: block;
	margin: -15px auto;
	margin-bottom:0px;
	padding-bottom: 0px;
	letter-spacing: -0.5px;
	text-shadow: 1px 0px 0px black;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #a7a898;
	top:-320px;
	left:0px;
	z-index:2;
	position: relative;
}
#time {
	
}
#MG-headermenu {
	top: 60px;
	margin-left:0.00%;
}
#header {
	top: 50px;	
}
.search-container {
	top: 210px;
	position: relative;
	z-index:20;
}
.gif-design {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height: 5px;
	max-height:4px;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	position: relative;
	top:60px;
	z-index:1;
}
#webdesign {
	top:250px;
}
#mgart-contact-app {
	top:20px;
	margin-left:-11.00%;
}
#header-ranginart-icon {
	top:215px;
}
/*=====================================
  PRELOADER STYLES 
    ===================================*/
   #pre-div {
    background-color: #fff;
    bottom: 0;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10000;
}
#loader {
	background-image: url(../../loader/loader.gif);
	background-position: center center;
	background-repeat: no-repeat;
	height: 200px;
	left: 50%;
	margin: -100px 0 0 -100px;
	position: absolute;
	top: 50%;
	width: 200px;
}
/* ================================= */

/* ======================================= 
   " body-center-containter "  */
/* =============design_navi=============== */
#body-center-containter {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	top: 20px;
	position: relative;
}
/*  ================================== "footer-diaShow "  */
#dia-containter { 
	position: relative;
    margin: 0 auto;
    padding: 10px;
	margin-top:0px;
    top: 100px;
    left: 0px;
    width: 100%;
	max-width:105px;  
	height:auto;          
}
.dia-show-position {
	clear: both;
	float: none;	
	display: block;
	width: 100%;
	height: auto;
	margin-left: 0.00%;
	margin-right: 0.00%;
	position: relative;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
	margin-top: 100px;
	top: 110px;
	left: 0px;
}
/* =============bodybild */
#body-imag-container {
	clear: both;
	float: left;	
	display: block;
	z-index:1;
	width: 100%;
	height: auto;
	min-width:309px;
	min-height:222px;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	margin-top: 0px;
	left: -130px;
	top: -120px;
}
.body-big-bild {
	clear: both;
	float: none;	
	display: block;
	width: 100%;
	height: auto;
	min-width:320px;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
}
#Contact-soc-container{
	top:280px;
	left:0.00%;
	width: 88%;
}
.lauftext {
	top:70px;
}
.footer-back-position {
	top:-40px;
}
.footer-info {
	top:210px;
}
#foot_text {
	clear: both;
	float: none;
	display: block;
	text-align:center;
	padding-left:5.00%;
	padding-right:5.00%;
	margin-left:5.00%;
	margin-right:5.00%;
	width: 100%;
}
#footer-center-containter {
	clear: both;
	float: left;	
	display: block;
	width: 100%;
	margin-top:0px;
	position:relative;
}
.revolvermaps {
	clear: both;
	float: left;	
	display: block;
	margin-left:0.00%;
	margin-right:10.00%;
	width: 20%;
	top:45px;
	position:relative;
	left: -10.00%;
}

/* ======================================= 
   " footer-center-containter "  */
/* =============design_navi=============== */

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

@media only screen and (min-width: 481px) {
.gridContainer {
	width: 90.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#headerback {
	margin-left: 0;
	width: 100%;
	height: 210px;
	margin: 0px;
	top: -850px;
	margin-top:0px;
	padding-left: 0.00%;
	padding-right: 0.00%;
	display: block;
	position: relative;
	background-image: url(../../MGart-web-design/ba_he.jpg);
	background-repeat: repeat;
}
#body-header-time {
	clear: both;
	float: left;
	margin-left: 0;
	margin-right: auto;
	width: 100.00%;
	padding-left: 0.0000%;
	padding-right:0.0000%;
	display: block;
	margin: -15px auto;
	margin-bottom:0px;
	padding-bottom: 0px;
	letter-spacing: 0.4px;
	text-shadow: 1px 0px 0px black;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #a7a898;
	top:-395px;
	left:0px;
	z-index:1;
	position: relative;
}
#time {
	
}
#MG-headermenu {
	top: 20px;
	width:100%;
	margin-left:0.00%;
}
#mgart-contact-app {
	top: 10px;
	left:120px;
}
.gif-design {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	height: 4px;
	max-height:4px;
	padding-left:0.00%;
	padding-right:0.00%;
	display: block;
	position: relative;
	top:60px;
	z-index:5;
}
#header {
	top: 20px;	
}
.search-container {
	top: 210px;
	position: relative;
	z-index:20;
}
#webdesign {
	top:235px;
}
#mgart-contact-app {
	top:145px;
	margin-left:-10.00%;
}
#header-ranginart-icon {
	top:0px;
	left:-5px;
}
#SOC-Contact {
	max-width:440px;
	left:20px;
}
/*=====================================
  PRELOADER STYLES 
    ===================================*/
   #pre-div {
    background-color: #fff;
    bottom: 0;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10000;
}
#loader {
    background-image: url(../../loader/loader.gif);
    background-position: center center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
}
/* ================================= */
/* ======================================= 
   " body-center-containter "  */
/* =============design_navi=============== */
#body-center-containter {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	padding-left:10.00%;
	padding-right:10.00%;
	display: block;
	position: relative;
}
/*  ================================== "footer-diaShow "  */
#dia-containter { 
	position: relative;
    margin: 0 auto;
    padding: 10px;
	margin-top:50px;
    top: 140px;
    left: 0px;
    width: 100%;
	max-width:168px; /*  “ dia große“  */  
	height:auto;          
}
.dia-show-position {
	clear: both;
	float: none;	
	display: block;
	width: 100%;
	height: auto;
	margin-left: 15.00%;
	margin-right: 0.00%;
	position: relative;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
	margin-top: 100px;
	top: 100px;
	left: -7px; /*  “ big bild und Dia zusamen position“  */ 
}
/* =============bodybild */
#body-imag-container {
	clear: both;
	float: none;	
	display: block;
	z-index:1;
	width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	min-width:619px;
	min-height:444px;
	position: absolute;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	margin-top: 0px;
	left: -255px;/*  “ big bild  “  */ 
	top: -238px; /*  “ big bild  “  */ 
}
.body-big-bild {
	clear: both;
	float: none;	
	display: block;
	width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
}
#Contact-soc-container{
	top:365px;
	left:0.00%;
	width: 88%;
}
.lauftext {
	top:170px;
}
.footer-back-position {
	top:60px;
}
.footer-info {
	top:310px;
}
#foot_text {
	clear: both;
	float: none;
	display: block;
	text-align:center;
	padding-left:5.00%;
	padding-right:5.00%;
	margin-left:5.00%;
	margin-right:5.00%;
	width: 100%;
}
#footer-center-containter {
	clear: both;
	float: left;	
	display: block;
	width: 100%;
	margin-top:0px;
	position:relative;
}
.revolvermaps {
	clear: both;
	float: left;	
	display: block;
	margin-left:0.00%;
	margin-right:10.00%;
	width: 20%;
	top:45px;
	position:relative;
	left: -10.00%;
}

/* ======================================= 
   " footer-center-containter "  */
/* =============design_navi=============== */

}
/* 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) {
.gridContainer {
	width: 88.2%;
	max-width: 1232px;
	padding-left: 0.9%;
	padding-right: 0.9%;
	margin: auto;
}
#LayoutDiv1 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	top: 30px;
	margin-top:10px;
}
#headerback {
	margin-left: 0;
	width: 100%;
	height: 210px;
	margin: 0px;
	top: -1035px;
	padding-left: 0.00%;
	padding-right: 0.00%;
	display: block;
	position: relative;
	background-image: url(../../MGart-web-design/ba_he.jpg);
	background-repeat: repeat;
}
#body-header-time {
	clear: both;
	float: left;
	margin-left: 12.00%;
	margin-right: auto;
	width: 65.00%;
	padding-left: 0.0000%;
	padding-right:25.0000%;
	display: block;
	margin: 0px auto;
	margin-bottom:0px;
	padding-bottom: 0px;
	letter-spacing: 1.7px;
	text-shadow: 1px 0px 0px black;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #a7a898;
	top:-635px;
	left:4.00%;
	z-index:2;
	position: relative;
	margin-top: -305px;
}
#time {
	width: 65.00%;
	margin-top: -10px;
	margin-left:3.00%;	
}
#bodyback {
	margin-top: -55px;
}
#header-center-containter {
	top: 70px;	
}
.gif-design {
	top:255px;	
}
#webdesign {
	top:110px;	
}
#MG-headermenu {
	margin-top: 215px;
	margin-left:-10.00%;
}
.search-container {
	top: 270px;
	position: relative;
	z-index:20;
}
#mgart-contact-app {
	top: -20px;
	left:120px;
}
.imeg-header {
	top: -20px;	
}
#header {
	top: 35px;	
}
#header-ranginart-icon {
	top:20px;
}
#SOC-Contact {
	max-width:880px;
	left:0px;
	top:-5px;
}
/*
=====================================
  PRELOADER STYLES 
    ===================================*/
   #pre-div {
    background-color: #fff;
    bottom: 0;
    height: 100%;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10000;
}
#loader {
	background-image: url(../../loader/loader.gif);
	background-position: center center;
	background-repeat: no-repeat;
	height: 200px;
	left: 50%;
	margin: -100px 0 0 -100px;
	position: absolute;
	top: 50%;
	width: 200px;
}
/* ================================= */
/* ======================================= 
   " body-center-containter "  */
/* =============design_navi=============== */
#body-center-containter {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	padding-left:10.00%;
	padding-right:10.00%;
	display: block;
	top: 30px;
	position: relative;
}
#dia-containter { 
	position: relative;
    margin: 0 auto;
    padding: 10px;
	margin-top:0px;
    top: 265px;
    left: 0px;
    width: 100%;
	max-width:285px;  
	height:auto;          
}
.dia-show-position {
	clear: both;
	float: none;	
	display: block;
	width: 100%;
	height: auto;
	margin-left: 10.00%;
	margin-right: 0.00%;
	position: relative;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
	margin-top: 100px;
	top: 235px;
	left: 0px;
}
/* =============bodybild */
#body-imag-container {
	clear: both;
	float: left;	
	display: block;
	z-index:1;
	width: 98%;
	height: auto;
	min-width:1239px;
	min-height:889px;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	margin-top: 0px;
	left: -520px;
	top: -475px;
}
.body-big-bild {
	clear: both;
	float: left;	
	display: block;
	width: 100%;
	height: auto;
	margin-left: 0px;
	margin-right: auto;
	padding-left:0.00%;
	padding-right:0.00%;
	text-align:center;
	position: relative;
}
.fixierer5 {
	background-image: url(../../MGart-web-design/gallery_orginal_r.png);
	background-repeat: repeat;
	background-position: 100% 100%;
	clear: none;
	float: none;
	width: 1200px;
	height: 100%;
	margin-left:0px;
	margin-right:100px;
	padding-left:0px;
	padding-right:200px;
	padding-top:100px;
	display: block;
	top: 200px;
	position: fixed;
	text-align:center;
	z-index: 1;
}
.footer-info {
	top:444px;
}
#foot_text {
	clear: both;
	float: none;
	display: block;
	width: 100%;
}
.lauftext {
	top:310px;
}
.footer-back-position {
	top:200px;
}
#Contact-soc-container{
	top:545px;
	left:0.00%;
	width: 90%;
}
.revolvermaps {
	clear: both;
	float: left;	
	display: block;
	width: 15%;
	top:35px;
	position:relative;
	left: 6.00%;
}
#footer-center-containter {
	clear: both;
	float: left;	
	display: block;
	width: 100%;
	top:0px;
	position:relative;
}
/* ======================================= 
   " footer-center-containter "  */
/* =============design_navi=============== */

}