@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800|Poppins:100,200,300,400,500,600,700,800,900|Roboto:100,300,400,500,700,900|Source+Sans+Pro:200,300,400,600,700,900");

* {
	outline: 0;
}
html,
body {
	margin: 0;
	padding: 0;
}

body {
	width: 100%;
	height: 100vh;
	background-image: url(/img/backcallcc4.jpg);
	background-position: center;
}

#outer {
	display: table;
	position: absolute;
	height: 100%;
	width: 100%;
	background-size: cover;
	background-position: center;
	opacity:0.96;
}

#middle {
	display: table-cell;
	vertical-align: middle;
}

#container {
	width: 90%;
	max-width: 250px;
	margin: auto;
	padding: 10px 0;
}

#container .logo {
	width: 100%;
	text-align: center;
}

#container .logo img {
	width: 90%;
}

#container .logincont {
	width: 100%;
	height: 100px;
	margin-top: 20px;
	text-align: center;
}

#container .logincont .loginbox {
	width: 100%;
	max-width: 300px;
	height: 100%;
	margin: auto;
	text-align: center;
	background-color: #f7f7f7;
	border-radius: 6px;
	-webkit-box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	-moz-box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	transition:0.2s;
}

hr {
	width: calc(100% - 40px);
	margin: 0;
	border: 0;
	height: 1px;
	background: #ddd;
}

#container .logincont .loginbox .username {
	width: 100%;
	height: 50%;
}
#container .logincont .loginbox .username input {
	width: calc(100%);
	height: calc(100%);
	border: 0;
	padding: 20px;
	background-color: #f7f7f7;
	border-top-right-radius: 7px;
	border-top-left-radius: 7px;
	font-family: "Poppins", sans-serif;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.7px;
}
#container .logincont .loginbox .password {
	width: 100%;
	height: 50%;
}
#container .logincont .loginbox .password input {
	width: calc(100%);
	height: calc(100%);
	border: 0;
	padding: 20px;
	background-color: #f7f7f7;
	border-bottom-right-radius: 7px;
	border-bottom-left-radius: 7px;
	font-family: "Poppins", sans-serif;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.7px;
}

#container .loginbt {
	position: relative;
	width: 100%;
	max-width: 300px;
	height: 40px;
	margin: auto;
	margin-top: 20px;
	text-align: center;
	border-radius: 6px;
}
#container .loginbt button {
	width: 100%;
	height: 40px;
	text-align: center;
	border: 0;
	border-radius: 6px;
	font-family: "Poppins", sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 0.7px;
	-webkit-box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	-moz-box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	box-shadow: 0px 3px 14px -1px rgba(112, 112, 112, 1);
	background: rgba(255,255,255,0.4);
	transition:0.2s;
}

#container .loginbt button:hover{
	cursor:pointer;
	background: rgba(255,255,255,0.6);
	-webkit-box-shadow: 0px 3px 5px -1px rgba(112, 112, 112, 1);
	-moz-box-shadow: 0px 3px 5px -1px rgba(112, 112, 112, 1);
	box-shadow: 0px 3px 5px -1px rgba(112, 112, 112, 1);
	transition:0.2s;
}

#container .loginbt button:focus{
	cursor:pointer;
	background: rgba(255,255,255,0.4);
	-webkit-box-shadow: initial;
	-moz-box-shadow: initial;
	box-shadow: initial;
	transition:0.2s;
}
.extra_msg{
    font-family: "Poppins", sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.7px;
    margin-top: 20px;
    background: #ecf2f0;
    padding: 7px;
    border-radius: 5px;
}