html, body { width:100%;min-width:500px;height:100%;font-family: 'Open Sans', sans-serif; }
body { background: #000 url('../img/bg.png');color:#fff;min-height:720px;position:relative; }

#content { margin:0 0 0 200px;width:500px;z-index:10;position:relative;float:left; }
#content img { margin:50px 0 25px;width:500px;height:561px; }

#copyright { width:100%;text-align:center;padding-bottom:50px;font-size:15px;position:absolute;bottom:0;z-index:10; }
#copyright a, #copyright a:hover { padding:0 3px;color:#fff;text-decoration:none; }
#copyright a:hover { border-bottom:1px solid #fff; }

.container { position: absolute;height: 100%;width: 100%; z-index:5; }
.overlay { pointer-events: none;position: absolute;height: 100%;width: 100%;left: 0;top: 0; }

#title { margin: 0 auto; padding-top:25%;font-size:30px;font-weight:400;position:relative;z-index:10;text-align:center; }

/***** Input *****/
	.form-control { display: block;width: 100%; padding: .5rem .75rem;margin-bottom: 1rem;  font-size: 1rem; line-height: 1.25; color: #464a4c; background-color: #fff; background-image: none; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: .25rem; -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;box-sizing: border-box;-webkit-box-sizing: border-box;text-align:center; }
	.form-control:focus {color:#464a4c;background-color:#fff;border-color:#5cb3fd;outline:0}
	.form-control::-webkit-input-placeholder { color: #9ca9b1; }
	.form-control:-moz-placeholder { color: #9ca9b1; }
	.form-control::-moz-placeholder { color: #9ca9b1; }
	.form-control:-ms-input-placeholder { color: #9ca9b1; }
	.form-control::-ms-expand{background-color:transparent;border:0 }

.btn { background-color: #0083b9; font-size: 12px; cursor: pointer; text-transform: uppercase; font-size: 16px; outline: 0 !important; min-width: 120px; color: #fff; font-size: 14px; text-transform: none; color: #fff; background-color: #0275d8; border-color: #0275d8; display: inline-block; font-weight: 400; line-height: 1.25; text-align: center; white-space: nowrap; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 1px solid transparent; padding: .5rem 1rem; font-size: 1rem; border-radius: .25rem; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; text-decoration:none; }
.alert { position: relative; text-align:center;color: #fff; padding-left: 80px; background-color: #f2dede; border-color: #ebcccc; color: #a94442; padding: .75rem 1.25rem; padding-left: 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-radius: .25rem;font-size:13px; }

@media (max-width: 1250px) { 
	#content { width:400px;margin-left:80px; }
	#content img { width:400px;height:449px; }
	#login { margin-top:140px;margin-left:100px; }
}

@media (max-width: 950px) { 
	#content { width:300px;margin-left:30px; }
	#content img { width:300px;height:337px; }
	#login { margin-top:100px;margin-left:50px; }
}

@media (max-width: 740px) { 
	body { min-height:480px; }
	#content { margin:0 auto;float:none; }
	#login { margin:0 auto 50px;float:none; }
	#copyright { position:relative; margin:0 auto;float:none; }
	.container { display:none; }
}