
@font-face { font-family: 'poppins-bold' ; src: url('fonts/Poppins-Bold.ttf'); }
@font-face { font-family: 'poppins-regular' ; src: url('fonts/Poppins-Regular.ttf'); }
@font-face { font-family: 'poppins-semibold' ; src: url('fonts/Poppins-SemiBold.ttf'); }

body	{ font-family: poppins-regular; background-color: rgb(240,240,240); }
.text	{ font-family: poppins-regular; font-size: 90%; color: rgb(120,120,120); }

.logo_div		{ text-align: center; border-bottom: 1px solid rgb(220,220,220); }
.logo_img	{ width: 150px;  padding-top: 20px; padding-bottom:20px; }

.title		{ font-size: 16pt; text-align: center ; color: rgb(0,80,160); font-family: poppins-semibold; margin-bottom:0px;}
.footer1	{ font-size: 10pt; text-align: center ; color: rgb(120,120,120); margin: 10px 0px 0px 0px; }
.footer2	{ font-size: 10pt; text-align: center ; color: rgb(120,120,120); margin: 0px 0px 50px 0px; }

.main_div {
		font-family: poppins-regular;
		border: 1px solid rgb(220,220,220);
		background-color: white;
		border-radius: 3px;
		width: 100%;
		max-width: 320px;
		margin: 50px auto auto auto;
		}

.inner_div { padding: 20px; }

input[type=text], input[type=password] {
		width: 100%;
		display: inline-block;
		border: 1px solid rgb(200,200,200);
		-webkit-transition: 0.5s;
		transition: 0.5s;
		outline: none;
		border-radius:3px;
		box-sizing: border-box;
		padding: 8px 12px;
		margin: 5px 0px 15px 0px;
		}

input[type=text]:focus, input[type=password]:focus 
		{ border: 1px solid rgb(200,200,200); box-shadow: 0px 0px 5px rgb(0,180,220); }

.button {
		font-family: poppins-semibold;
		font-size: 100%;
		background-color: rgb(0, 180, 220);
		color: white;
		height:45px;
		padding: 0px 20px;
		margin: 10px 0px ;
		border: none;
		cursor: pointer;
		width: 100%;
		border-radius: 3px;
		}

.button:hover { background-color: rgb(0, 80, 160); }

/* Responsive ! */
.cancelbtn { width: auto; padding: 10px 18px; background-color: #f44336; }
span.psw { float: right; padding-top: 16px; }
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) { span.psw { display: block; float: none; } .cancelbtn {width: 100%;} }

