@CHARSET "UTF-8";
/* © eckblick GbR  */

#bg 			{width:100%; width:100vw; height:100%; height:100vh; position:fixed; z-index:1; top:30px; padding:0; overflow:hidden; display:block; text-align:center;}
#bg img 		{display:none; position:absolute; top:0; left:0; max-width:none !important;}
#bg img.start 	{display:block;}
img#bgimg 		{position:absolute; display:block; z-index:1;}
#bg { opacity:1 !important; }
div.loginLogo {
position:fixed;
height:180px; width:180px; 
background-image:url(pic/logo-ryago.svg);
background-size:contain; 
background-repeat: no-repeat !important; 
left:4%; top:80px; 
z-index:5; }




/* ////// CUSTOM ///// */
.login button		{ background: #076033; }
div.login   		{	border-bottom:4px solid #076033;	background-image: url("pic/logo-ryago.svg"); }
	




/*////////////////////////////LOGINBOX//////////////////////////////////////*/
.loginpage  {margin:auto;display:block;width:100%; padding: 0px 200px 100px 0px;}

div.login   {
	
	height:auto; 
	width:360px; 
	padding-top:86px; 
	box-sizing: border-box;
	background-color:rgba(252,252,252,1.00);
	position:relative; 
	float: right;
	margin-top:20vh;
	z-index:10; 
	background-size:150px;
	background-repeat: no-repeat;
	background-position: center 8px;
	-webkit-box-shadow: 0 1px 10px 0 rgba(0,0,0,0.6);
box-shadow: 0 1px 10px 0 rgba(0,0,0,0.6);


}
			 
.login input  		{ 	-webkit-border-radius: 7px;
						border-radius: 7px;
						background: none;
						background-color: #fafafa;
						box-shadow:inset 1px 1px 3px 0 rgba(0,0,0,0.35);
						width:240px;
						height:48px;
						text-align: center;
						outline: 0px;
						border:0.33px solid rgba(90,90,90,0.30);
						letter-spacing: normal;
						color: #767676; 
						font-size:133%;font-weight: 100;
						margin-top: 18px;
						margin-left: 60px;
						padding:4px 0;
						-webkit-transition: all 200ms ease-in-out;
						-moz-transition: all 200ms ease-in-out;
						-ms-transition: all 200ms ease-in-out;
						-o-transition: all 200ms ease-in-out;
						transition: all 200ms ease-in-out;
					 }


.login input:active, .login input:focus		  	{
	
						-webkit-border-radius: 12px; outline: 0px;
						border-radius: 12px;
						background-color: #ececec;
						box-shadow:inset 1px 1px 3px 0 rgba(0,0,0,0.76);
						border:0.33px solid rgba(90,90,90,0.30); 

}


.login button		  	{ 

					-webkit-border-radius: 7px;
					border-radius: 7px;
					-webkit-box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.35);
					box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.35);

					text-align: center;
					letter-spacing: normal;

					margin-left: 60px;
					
					-webkit-transition: all 200ms ease-in-out;
					-moz-transition: all 200ms ease-in-out;
					-ms-transition: all 200ms ease-in-out;
					-o-transition: all 200ms ease-in-out;
					transition: all 200ms ease-in-out;



					margin-top: 24px;
	margin-bottom: 32px;
					
					width:240px;
					height:53px;
					
					color: #fff; 
					font-size:167%;
					font-weight: 400;
					text-shadow: inset 1px 1px 0px #000000;
					
					outline: 0px;
					border: medium rgba(0,0,0,1.00) !important;
					
				 }
				 
.login button:hover {
	
					cursor:pointer; color: #ffffff; 
					background: #222222; }



/*////////////////////////////////////////////////////////////////////////////////////// */
/*////////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////// */
/* //////   Responsive Design: Media Queries  | AUSSCHIESSLICHE VERAENDERUNGEN   /////// */
/* ///////////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////////// */
/*////////////////////////////////////////////////////////////////////////////////////// */
/*////////////////////////////////////////////////////////////////////////////////////// */


@media only screen  
	and (max-width: 1440px) {
		div.login 			{right:10px; top:50px;}  }

@media only screen  
	and (max-width: 1290px) {
		div.login 			{right:10px; top:-20px;}  }
		


@media only screen
	and (max-width: 940px) {
		
		
		#page { margin-top: 0px; }
			
		header {
			
			margin-top:0px;
    width: 100%;
			box-sizing: border-box;
			padding-right: 0px;

			
			text-align: center;		
    height: 72px;
    background-image: none;
    background-color: rgba(255,255,255,1.00);
}

		
		
		div#clock {
    width: auto;
    margin-right: auto;
    margin-top: 50px;
    float: none;
    text-align: center;
    color: rgb(45,45,45);
}

		
		
		
		
		
		
		
		#bg 				{top:0px; }
		div.login 			{position:absolute; 
							 left:50%; 
							 margin-left:-180px; 
							 top:0px;}
		div.loginLogo 		{position:fixed !important;
							 top: 8px;
							 left: 0px !important;
							 height:40px; 
							 width:100%;
							 width:100vw; 
							 background-size: contain; 
							 background-position:center;	
							 background-color:rgba(255,255,255,0.00); opacity:0.5; }

		}

@media only screen
	and (max-width: 780px),
only screen and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
		/* //////////////   Responsive Design: Smartphone //////////////// */
		
			div#bg				{ display:none !important; }	
		
			div.login 			{ top:120px; }
							 
			section#footer,.brfoo,.restaurants,
			.restcent,.restpopup,.restpopup:hover,
			.restinfo,.restaurant,
			.restaurant:hover,.footerpart,
			a.resta,a.resta:hover, 
			a.resta:active, 
			a.resta:focus {display:none !important; visibility:hidden !important;}	}