/********************************************************************************************************************/
/* Style - Gästebuch */

.gb-style{
	width:100%;
	padding:30px;
	margin: 0 0 20px 0 auto;
	background: #FFF;
	-webkit-box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.13);
	box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.13);
	border: 10px solid #333;
	background: url(../img/form-bck-pgm-smal.jpg) no-repeat center center fixed; 		/*Bild bedeckt immer, auch bei Zoom, den ganzen Bereich!*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.gb-style .inner-wrap{
     padding: 30px;
     background: #F8F8F8;
     border-radius: 6px;
     margin-bottom: 15px;
}
.gb-style h1{
	background:#000;
	padding: 20px 30px 15px 30px;
	margin: -30px -30px 30px -30px;
	font-size: 1.75em;
	font-weight: normal;
	font-family: 'Germania One', serif, Helvetica, Verdana, sans-serif;
	background: url(../img/form-bck-mrmr-blk.jpg) no-repeat center center fixed; 		/*Bild bedeckt immer, auch bei Zoom, den ganzen Bereich!*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;		
	color: #fff;															
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border:none;
}
.gb-style h1 > span{
     display: block;
     margin-top: 2px;
     font: 13px Arial, Helvetica, sans-serif;
     color:#CCC;
}
.gb-style label{
     display: block;
     font: 13px Arial, Helvetica, sans-serif;
     color:#888;
     margin-bottom: 15px;
}
.gb-style input[type="text"],
.gb-style input[type="date"],
.gb-style input[type="datetime"],
.gb-style input[type="email"],
.gb-style input[type="number"],
.gb-style input[type="search"],
.gb-style input[type="time"],
.gb-style input[type="url"],
.gb-style input[type="password"],
.gb-style textarea,
.gb-style select {
     display: block;
     box-sizing: border-box;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     width: 100%;
     padding: 8px;
     border-radius: 6px;
     -webkit-border-radius:6px;
     -moz-border-radius:6px;
     border: 2px solid #fff;
     box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
     -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
     -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
	font-family: Helvetica, Verdana, sans-serif;
}

.gb-style .section{
     font: normal 20px 'Bitter', serif;
     color:#000; 							/*Textfarbe neben Punkt...*/
     margin-bottom: 5px;
}
.gb-style .section span {
     background:#000;
     padding: 5px 10px 5px 10px;
     position: absolute;
     border-radius: 50%;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     border: 4px solid #fff;
     font-size: 14px;
     margin-left: -45px;
     color: #fff;
     margin-top: -3px;
}
.gb-style input[type="button"], 
.gb-style input[type="submit"],
.gb-style input[type="reset"]{
     background:#000;
     padding: 8px 20px 8px 20px;
     border-radius: 5px;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     color: #fff;
     text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
     font: normal 30px 'Bitter', serif;
     -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
     box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
     border: 1px solid #999;
     font-size: 15px;
}
.gb-style input[type="button"]:hover, 
.gb-style input[type="submit"]:hover,
.gb-style input[type="reset"]:hover{
     background:#333;
     -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
     box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
}

/********************************************************************************************************************/
/*Flexgrid - Gästebuch*/


#myGrid{
	display: -ms-grid;
	display: grid;
}

#item1 {
  background: maroon;
  border: orange solid 1px;
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-row: 1;
  grid-column: 1;
}
#item2 {
  background: lightgray;
  border: red solid 1px;
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-row: 2;
  grid-column: 2;
}

#item1 {grid-area: 1 / 1 / 2 / 2; -ms-grid-area: 1 / 1 / 2 / 2;}			/*Zeile Start, Spalte Start, Zeile Ende, Spalte Ende*/
#item2 {grid-area: 1 / 2 / 2 / 3; -ms-grid-area: 1 / 2 / 2 / 3;}

.grid_gbk {									/*Grid Wrapper*/
	display: -ms-grid;
	display: grid;
	margin: 0px auto;
	max-width: 100%;
	font-family: Helvetica, Verdana, sans-serif;
	grid-template-columns: auto;
	border-top: 1px solid;
	border-bottom: 1px solid;
/*	border: 1px solid;*/
	border-color: #600;
}

.grid_gbk .data{
	color:#FFF;
	font-size: 18px;
	font-weight:normal;
}

.grid_gbk .fat{					/*Fette Texte mit etwas Abstand oben und unten*/
	color:#999;
	font-size: 22px;
	font-weight:bold;
	padding:0.2em 0 0.4em 0;
}

.grid_gbk1{
	padding: 8px;
	margin: 2px;
}

.grid_gbk1 {grid-area: 1 / 1 / 2 / 2;}	/*Zeile Start, Spalte Start, Zeile Ende, Spalte Ende*/

/*--------------------------------------------------------------------------------------------------------------------------------------- */
/* CSS3 Stylesheet E N D E  */