@font-face {
  font-family: 'Maven Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Maven Pro Regular'), local('MavenProRegular'), url(http://fonts.gstatic.com/s/mavenpro/v6/MG9KbUZFchDs94Tbv9U-pVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
*
{
margin:0px;
padding:0px;
}
  
body{
background:#222526;
position:relative;
padding:20px;
font-family:verdana;
} 
                                
#loginform
{
	position:relative;
	top:130px;
	width:550px;
	height:auto;
	position:relative;
	margin:0 auto;
}

input
{
display:block;
margin:0px auto 15px;
border-radius:5px;
background: #333333;
width:85%;
padding:12px 20px 12px 10px;
border:none;
color:#929999;                       
box-shadow:inset 0px 1px 5px #272727;
font-size:0.8em;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease; 
}

input:focus
{
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;  
box-shadow: 0px 0px 5px 1px #161718;
}

button
{
background: #ff5f32;
border-radius:50%;
border:10px solid #222526;
font-size:0.9em;
color:#fff;
font-weight:bold;
cursor:pointer;
width:85px;
height:85px;
position:absolute;
right: -42px;
top: 155px;
text-align:center;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

button:hover
{
background:#222526;
border-color:#ff5f32;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

button i
{
font-size:20px;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

button:hover i
{
color:#ff5f32;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}
  
*:focus{outline:none;}
::-webkit-input-placeholder {
color:#929999;
}

:-moz-placeholder { /* Firefox 18- */
color:#929999; 
}

::-moz-placeholder {  /* Firefox 19+ */
color:#929999;  
}

:-ms-input-placeholder {  
color:#929999; 
}

h1
{
	text-align:center;
	color:#fff;
	font-size:30px;
	padding:12px 0px;
	font-family: 'Maven Pro', sans-serif;
}

#note
{
color:#88887a;
font-size: 0.8em;
text-align:left;
padding-left:5px;
}

#facebook
{
text-align:center;
float:left;
background:#69F;
padding:35px 10px 20px 10px;
width:170px;
height:auto; 
border-radius:3px;
cursor:pointer;
box-shadow: 0px 0px 10px 2px #161718; 
margin-right:10px;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

#facebook:hover
{
box-shadow: 0px 0px 0px 0px #161718;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

.fa-facebook
{
color:#fff;
font-size:7em;
display:block;
}

a
{
color:#88887a;
text-decoration:none;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

a:hover
{
color:#fff;
margin-left:5px;
-webkit-transition:0.5s ease;
-moz-transition:0.5s ease;
-o-transition:0.5s ease;
-ms-transition:0.5s ease;
transition:0.5s ease;
}

#mainlogin
{
	position:relative;
	float:left;
	width:250px;
	height:205px;
	padding:80px 15px;
	position:relative;
	background:#555555;
	border-radius:3px;
}

#connect
{
	font-weight: bold;
	color: #fff;
	font-size: 13px;
	text-align: left;
	font-family: verdana;
	padding-top:10px;
}

#or
{
	position:absolute;
	left: -25px;
	top: 10px;
	background:#222222;
	text-shadow:0 2px 0px #121212;
	color:#999999;
	width:40px;
	height:40px;
	text-align:center;
	border-radius:50%;
	font-weight:bold;
	line-height:38px;
	font-size: 13px;
}
.intups
{
	position:relative;
	top:30px;
	height:30px;
	font-size:20px;
}