@CHARSET "UTF-8";
/*
over-ride "Weak" message, show font in dark grey
*/


/*
Reference:
http://www.bootstrapzen.com/item/135/simple-login-form-logo/
*/

* {
    -webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	outline: none;
}


body 
{
	
	
	/*background: url(http://i.imgur.com/GHr12sH.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;*/
}


.card 
{
	background:none;
   /*  background-color: #F7F7FF;
    just in case there no content*/
   padding: 20px 25px 30px;
    margin: 0 auto 25px;
    margin-top: 50px;
   /*-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);*/
   	 width:800px;
   	 max-width: 800px;
   	 	 min-width: 400px;
}

.card-container.card 
{
/*	background-color: #FF0000;
	 width:800px;
max-width: 700px;*/
/*width:800px;*/
    /* min-width: 650px;
    
    padding: 10px 10px;
    text-align: center;*/
}
.login-form {
	margin-t2p: 60px;
	 background-color: #F7F7FF;
	text-align:center;
	width:100%;
	padding-bottom:30px;
	padding-left:30px;
	padding-right:30px;
	padding-top:30px;
    
	/*
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	*/
    border-radius: 20px;
    -moz-box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);
    box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.3);
}


@media screen and (max-width: 820px) {
		.card 
		{
		background:none;
		/*  background-color: #F7F7FF;
		just in case there no content*/
		padding: 20px 25px 30px;
		margin: 0 auto 25px;
		margin-top: 50px;
		/*-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
		-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
		box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);*/
		width:90%;
		 min-width: 400px;
		}
}



.card2 {
    background-color: #F7F7FF;
    /* just in case there no content*/
  /* padding: 20px 25px 30px;*/
    margin: 0 auto 25px;
    margin-top: 50px;
    /*   shadows and rounded borders */
/*    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);*/
}

.card-container.card2 {
/*max-width: 550px;*/
width:300px;
       /*    min-width: 650px;
    
    padding: 10px 10px;*/
    text-align: center;
}

.login-form2 {
	/*margin-t2p: 60px;*/
	margin: 0 auto;
	 margin-top: 20px;
	 margin-bottom:20px;
	 
	text-align:center;
	width:100%;
}


form[role=login] {

	/*padding: 26px;*/
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
	form[role=login] img {
		display: block;
		margin: 0 auto;
		margin-bottom: 35px;
	}

	form[role=login] > div {
		text-align: center;
	}
	
.form-links {
	text-align: center;
	margin-top: 1em;
	
}
	.form-links a {
		color: #fff;
	}