*{font-family:'open sans condensed';font-size:1em; box-sizing:border-box;}
	html{overflow-y:scroll;height:auto;}
	body{text-align:center; margin:0; padding:0;background-image:url(./../img/bgdark.jpg);background-size:cover;color:white;}
	input[type="text"]{
		font-family:'oswald';
		color:black;
		width: 100%;
		color:black;
		padding:10px;
		text-align:center;
	}
	input[type="submit"]{
		padding:10px;
		width: 100%;
		background:orange;
		color:black;
		border:0;
		font-family:'oswald';
	}

	a{
		color:white;
	}
	.grey{
		color:grey;
	}
	.wrapper{
		margin:5% auto 0;
		box-shadow:0 0 10px #000;
		position:relative;
		background-image:url(./../img/loginbg.jpg);
		background-repeat:no-repeat;
		background-size:cover;
		background-position:center;
	}
	.wrapperInner{
		width:40%;
		margin:0 auto;
	}
	.form {
		min-width: 200px;
		width: 60%;
		margin: 0 auto;
	}
	.form div{
		padding:5px;
	}
	label{
		width:150px;
		width:100%;
		display:block;
		text-align:left;
		padding:5px 0;
	}
	.logo{
		height:120px;
		background-image:url(./../img/logologinpage.png);
		background-repeat:no-repeat;
		background-size:contain;
		background-position:center;
	}
	.header{
		text-align:center;
		font-size:5em;
		font-family:'oswald';
		margin-top:0.5em;
	}
	.status{
		margin:30px 5px;
		padding:20px;
		background:red;
		color:white;
	}

	.status.ok{
		background:green;
		color:white;
	}
	.status.er{
		background:red;
		color:white;
	}
	
/* -- overlay -- */
	.topOverlay{
		display:none;
		position:fixed;
		width:100%;
		top:0;
		bottom:0;
		z-index:1001;
		background-color:rgba(51,51,51,0.9);
		background-image:url(./../img/bgdark.jpg);
		background-attachment:fixed;
		background-position:center top;
		background-size:cover;
		text-align:center;
		overflow:auto;
	}
	.topOverlay.newsflash h1{
		color:white;
	}
	.topOverlay.newsflash{
		background-color:rgba(0,0,0,.3);
	}
	.topOverlay .pageContent{
		position:relative;
		margin:0 auto;
		width:90%;
	}
	.toplayerNav span{
		display:none;
	}
	.toplayerNav.arLeft, 
	.toplayerNav.arRight{
		display:none;
	}
	.toplayerNav.arLeft{
		left:0;
	}
	.toplayerNav.arRight{
		right:0;
	}
	.toplayerNav.arLeft div, 
	.toplayerNav.arRight div, 
	.toplayerNav.close {
		position:fixed;
		top:0;
		bottom:0;
		width:41px;
		height:41px;
		cursor:pointer;
		border-radius:50%;
		border:2px solid red;
	}
	.toplayerNav.close{
		top: 30px;
		right: 30px;
		background-image: url(../img/x.svg);
		background-size: 80%;
		background-position: center;
		background-repeat: no-repeat;
	}
	.toplayerNav.arLeft div, 
	.toplayerNav.arRight div {
		top:50%;
	}
	.toplayerNav.arLeft div {
		left:30px;
		background:url(./../img/sprites.png) -90px 6px no-repeat;
	}
	.toplayerNav.arRight div {
		right:30px;
		background:url(./../img/sprites.png) -88px -29px no-repeat;
	}
	.placeholder{
		margin:0 auto;
		padding:50px 0;
		width:80%;
		text-align:left;
		font-family:'Open Sans Condensed';
		min-height:200px;
		max-height:400px;
	}
	.placeholder h1{
		margin:0;
		padding:0;
		font-size:3em;
		color:red;
	}
	.placeholder article{
		margin:0;
		padding:10px 2px;
		font-size:1em;
		color:white;
		font-family:'Open Sans Condensed';
	}
	#imageholder{
		position:fixed;
		top:0;
		left:0;
		bottom:0;
		width:100%;
		background-position:center center;
		background-size:contain;
		background-repeat:no-repeat;
		text-align:center;
	}
	#imageholder2{
		display:none;
	}
	.intr_photo {
		position:fixed;
		top:0;
		bottom:0;
		left:10%;
		background-size:contain;
		background-position:top center;
		background-repeat:no-repeat;
		width:30%;
	}
	.intr_descr {
		position:fixed;
		top:0;
		bottom:0;
		right:10%;
		width:48%;
		text-align:left;
	}
	.scalableImage{
		background-position:center top;
		background-size:contain;
		background-repeat:no-repeat;
	}
	
	
	
@media (max-width: 1200px) {
	.wrapperInner{
		width:60%;
		margin:0 auto;
	}
	.header{
		font-size:4em;
	}
	.placeholder h1{
		font-size:2em;
	}
}
@media (max-width: 900px) {
	.wrapperInner{
		width:70%;
		margin:0 auto;
	}
	.header{
		font-size:3.5em;
	}
}
@media (max-width : 760px) {
	.wrapper{
		margin:10 auto;
		width:100%;
	}
	.wrapperInner{
		width:80%;
	}
	.form {
		width:100%;
	}
	input[type="submit"]{
		padding: 10px 0;
		width:100%;
	}
	.header{
		font-size:3em;
	}
}
@media (max-width : 640px) {
	.wrapperInner{
		width:90%;
	}
.placeholder{
		padding:10px 0;
	}
	.placeholder h1 {
		font-size: 1em;
	}
}
@media (max-width : 320px) {
	.wrapper{
		margin:0 auto;
	}
	.header{
		font-size:2em;
	}
}