/* ###################################### */
/* 	  		Ilias / menu-blue.css 		   */
/* 	Styles der Wein- und Speisekarte    */
/* ###################################### */ 


.Page-container { display:flex; flex-flow:wrap; }

.Page  			 { flex:1 100%; position:relative; margin:5px 3px; padding-bottom:1em;  
						border:1px solid #555; box-shadow: 6px 6px 6px #aaa; }
				  
.Page ul  		 { float:left; width:100%; margin:0; padding:0 0 5px; }
.Page li  		 { letter-spacing:0; color:#231f20; }

.L, .M, .R		 { display:inline; }
.L, .R			 { text-align:right; vertical-align:top; font-weight:bold; }

.L 				 { float:left; width:13%; }
.M 				 { float:left; width:68%; text-align:left; padding:0 10px 4px 10px; }
.R 				 { float:right; width:15%;margin-right:4%; }
   
.Page .text     { width:90%; margin:auto; text-align:justify; padding-bottom:2em; }
.PageNr			 { color:#055eb0; }

.hoch 			 { font-size:60%; font-weight:normal; vertical-align:top; }	/*hochgestellter Text*/
.space			 { clear:both; padding-top:1em; }
										  		  
/* *********************** Weinkarte wein.htm *************** */

.WineType 		 { margin:15px; font-variant:small-caps; font-size:1.4em; 
						letter-spacing:0.2em; color:#888; }						
.WineImg			 { float:left; clear:left; padding:0 1.2em 1.5em 0; }
.WineText 		 { padding:0 1.8em; text-align:justify; }
.WineTitle 		 { clear:both; padding:10px;}
.WinePrice 		 { float:right; font-weight:bold; }

/* *********************** Ringheftung ********************** */																
.Ringordner 	 { position:absolute; top:15px; right:-22px; width:36px; height:96%; 
						background:transparent url('../img/ring.png') repeat-y; z-index:100; }		  	  
.Schatten 		 { position:absolute; top:0; right:0; width:80px; height:100%; opacity:0.7;
						background:linear-gradient(-90deg, #555, transparent); }					  	  
.Schatten_r 	 { position:absolute; top:0; left:0; width:110px; height:100%; opacity:0.7; 
						background:linear-gradient(-90deg, transparent, #555); }					  	  				  	  
/* *********************** Bildschirmgröße ********************** */

@media only screen and (max-width: 767px) {

    .Ringordner 	{ display:none; }
    .Schatten 		{ display:none; }
    .Schatten_r 	{ display:none; }
    #QR-code 		{ display:none; }	
}

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

	.Page				{ flex:1 auto; width:49%; }
	#QR-code 		{ width:100px; }
}

/* END */