html, body {
	height:100%;
	margin:0;
	padding:0;
	overflow:auto;
	}
	
body {
	font-family: 'Open Sans', Arial,'Helvetica', sans-serif;
	font-weight:100;
	font-size:calc(12px + 1.5vw);
	
	-webkit-background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position:center center;
	background-size: cover;
	background-image:url(../img/bg2_XL_lr.jpg);
	
	display:flex;
	align-items:center;
	flex-direction:column;
	}
	
	@media (hover: none) {
		body {
			background-attachment: scroll;
			}
		}
		
	@media screen and (max-width: 1200px){
		body {
			background-image:url(../img/bg2_L_lr.jpg);
			}
		}
		
	@media screen and (max-width: 800px){
		body {
			background-image:url(../img/bg2_M_lr.jpg);
			}
		}


header {
	flex: 1 1 150px;
	min-height:150px;
	width:100%;
	background:transparent url(../img/logo_white.svg) no-repeat bottom 1.5vh center;
	background-size: 5vh;
	-webkit-filter: drop-shadow(0px 0px 3px rgba(51, 102, 153, 0.8));
	filter: drop-shadow(0px 0px 3px rgba(51, 102, 153, 0.8));
	}		

#intro {
	flex:1 1 250px;
	min-height:250px;
	
	display:flex;
	flex-direction:column;
	align-items: center;

	}


	
	
footer {
	flex:0 1;
	padding:20px 0 30px 0;
	}
	
	footer a {
		display:inline-block;
		width:48px;
		height:48px;
		margin:0 calc(8px + 0.6vw);
		-webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.8));
		filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.8));
		background-repeat:no-repeat;
		background-position:0 0;
		background-size:48px;
		transition: opacity 0.2s ease-in;
		}
		
	footer a:hover {
		opacity:0.6;
		}
	
	footer a.tel {
		background-image: url(../img/tel.svg);
		}
		
	footer a.mail {
		background-image: url(../img/mail.svg);
		}
		
	footer a.pin {
		background-image: url(../img/pin.svg);
		}

	
.overlay {
	display:none;
	position:fixed;
	top:0;left:0;bottom:0;right:0;
	background-color:rgba(0,0,0,0.3);
	align-items:center;
	justify-content:center;
	}

#messenger, #login {
	display:flex;
	flex-direction:column;
	align-items:center;
	overflow:auto;
	position:relative;
	background:#FFF url(../img/logo_color.svg) no-repeat top calc(10px + 1vw) left calc(10px + 1vw);
	background-size:20px;
	border-radius:5px;
	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
	}
	
	#messenger {
		padding:calc(35px + 2vw);
		width:30%;
		min-width:280px;
		height:80%;
		max-width:500px;
		max-height:600px;
		}

	#login {
		padding: calc(35px + 2vw);
		width:20%;
		min-width:250px;
		height:350px;
		justify-content:center;
		}
	
	.close {
		position:absolute;
		top:calc(10px + 1vw);
		right:calc(10px + 1vw);
		width:20px;
		height:20px;
		background:transparent url(../img/close_thin.svg) center center;
		background-size:20px;
		opacity:0.6;
		}
		#message_body .close:hover {
			opacity:1.0;
			}

/* general input styling */		

H1 {
	/*font-family: 'Cinzel', 'Tinos', 'Merriweather', 'Volkhov', 'Comfortaa', 'Libre Baskerville', Times New Roman, sans-serif;*/
	font-family: 'Cinzel', Times New Roman, sans-serif;
	font-size: calc(18px + 3.5vw);
	font-weight:100;
	color:#FFF;
	border-bottom:#FFF 1px solid;
	margin:0;
	
	text-shadow:#336699 0 0 2px;
	-webkit-filter: drop-shadow(0px 0px 5px rgba(51, 102, 153, 0.8));
	filter: drop-shadow(0px 0px 5px rgba(51, 102, 153, 0.8));

	display:inline;
	padding:0 8vw;
	white-space:nowrap;
	
	}
	
H2 {
	font-size:18px;
	font-weight:800;
	color:#336699;
	margin-bottom:3.5vh;
	}

	
p {
	/*font-family: 'Tinos', 'Merriweather', 'Volkhov', 'Comfortaa','Libre Baskerville', Times New Roman, sans-serif;*/
	font-family: 'Tinos', Times New Roman, sans-serif;
	text-shadow:#336699 0 0 1px;
	-webkit-filter: drop-shadow(0px 0px 3px rgba(51, 102, 153, 0.8));
	filter: drop-shadow(0px 0px 3px rgba(51, 102, 153, 0.8));
	
	font-size:calc(12px + 1vw);
	font-weight:400;
	text-shadow:#000 0px 0 2px;
	letter-spacing:0.15vw;
	color:#FFF;
	display:inline-block;
	padding:0;
	}



button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	outline:none;
	background-color:rgba(0,0,0,0.15);
	color:#FFF;
	border:rgba(255,255,255,1) 1px solid;
	border-radius:100px;
	height:6.8vh;
	min-height:50px;
	max-height:65px;
	min-width:120px;
	padding: 0 2.5vw;
	font-size:calc(12px + 0.5vw);
	font-family: 'Open Sans', Arial,'Helvetica', sans-serif;
	font-weight:400;
	transition: background-color 0.3s ease-in;
	cursor:pointer;
	margin:6vh 0 8vh 0;
	box-shadow:rgba(0,0,0,0.5) 0 0 3px;
	}
	
	button:hover {
		background-color:rgba(0,0,0,0.25);
		}

input[type='text'], input[type='password'], textarea {	

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	outline:none;
	
	border:#CCC 1px solid;
	border-radius:2px;
	width:100%;
	display:block;
	margin:1vh 0;
	}
	input[type='text'], input[type='password'] {
		flex:0 0 50px;
		text-indent:1vw;
		}
	
	textarea {
		flex:1 1;
		line-height:calc(14px + 1vh);
		font-family:inherit;
		padding:1vw;
		min-height:50px;
		}
		
		textarea::placeholder {
			font-family: 'Open Sans', 'Helvetica', Arial, sans-serif;
			}

	input[type='text']:focus, input[type='password']:focus, textarea:focus {
		border-color:#999;
		box-shadow:rgba(0,0,0,0.15) 1px 1px 5px 2px;
		}
		
	input[type='text'].missing::placeholder, input[type='password'].missing::placeholder, textarea.missing::placeholder {
		color:#FF0000;
		}
		
	input[type='submit'] {
		flex:0 0 50px;
		margin-top:3vh;
		
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		outline:none;
		
		border-width:0;
		border-radius:30px;
		width:150px;
		background-color:#336699;
		color:#FFF;
		}
		input[type='submit']:hover {
			background-color:#0099CC;
			}
			
		input[type='submit']:disabled {
			background-image:url(../img/preloaders/preloader_s_white.svg);
			background-size:65%;
			background-position:center center;
			background-repeat:no-repeat;
			color:transparent;
			background-color:#CCC;
			}
	
input[type=text]::-ms-clear {	/*hide the IE10 clear button */
	display: none;
	}	

.status {
	flex:0 0 36px;
	font-size:16px;
	text-align:center;
	display:flex;
	align-items:center;
	}
	
.processor {
	position:absolute;
	width:0;
	height:0;
	border:0;
	}