img{max-width:100%;}

body {
   font-family: Tahoma, Helvetica, sans-serif;
	background-color:#fff;
    
}
.logo {
    text-align: center; 
}
.title {
	margin-top:15px;
    font-size: 34px;
    text-align: center;
    color: #FF9800;
}

.container {
    padding: 2em 0 0;
}
.formm {
    width: 35%;
    margin: 2em auto;
    background: #9a2109;
}
.desc {
    padding: 20px 10px 0px;	
	text-align:center;
	color:white;
	font-size: 20px;
}

.leftt {
    float: left;
    width: 50px;   
    padding: 15px 10px 0;	
	font-size: 12px;
	color:white;
	text-align: right;
}


.rightt {     
    padding: 15px 1px 0;
    overflow: hidden;	
	font-size: 12px;
	color:white; 
}
.topp {
    padding: 0.5em 3em 0;

}
.info{
	width:100%;
	margin: 1em 0 1em;
	position: relative;
	border-bottom:1px solid #fff;
} 
.labell{
	padding: 5px 8px 0; 
	color: #FF9800;
}
.labell2{
	padding: 5px 8px 6px; 
	color: #fff;
	text-align:center;
}
.contentt{
	padding: 0.8em .5em;
	color: #FFF;
}
.formm input[type="text"]{
    font-size: 1em;
    color: #fff;
    padding: 0.8em .5em;
    border: 0;
    width: 96%;
    border-bottom: 1px solid #fff;
    background: none;
    -webkit-appearance: none;
}

.styled-input input:focus ~ label, .styled-input input:valid ~ label {
    font-size: 1em;
    color: #FF9800;
    top: -1.5em;
    -webkit-transition: all 0.125s ease;
	-moz-transition: all 0.125s ease;
	-o-transition: all 0.125s ease;
	-ms-transition: all 0.125s ease;
    transition: all 0.125s ease;
}
.styled-input {
	width:100%;
	margin: 2em 0 1em;
	position: relative;
	//border:1px solid yellow;
} 
.styled-input label {
    color: #fff;
    padding: 0.8em .5em;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    pointer-events: none;
    font-weight: 400;
    font-size: 1em;
    display: block;
    line-height: 1em;
}
.styled-input input ~ span {
	display: block;
	width: 0;
	height:2px;
	background:#FF9800;
	position: absolute;
	bottom: 0;
	left: 0;
	-webkit-transition: all 0.125s ease;
	-moz-transition: all 0.125s ease; 
	-o-transition: all 0.125s ease; 
	-ms-transition: all 0.125s ease; 
	transition: all 0.125s ease; 
}
 
.styled-input input:focus { outline: 0; }

.styled-input input:focus ~ span {
	width: 100%;
	-webkit-transition: all 0.075s ease;
	-moz-transition: all 0.075s ease;
	-o-transition: all 0.075s ease;
	-ms-transition: all 0.075s ease;
	transition: all 0.075s ease;
	//font-family: 'Open Sans', sans-serif;
} 

.buttonn input[type="submit"] {
	font-size: 1.5em;
	color: #9a2109;
	background: #FF9800;
	outline: none;
	cursor: pointer;
	padding: 0.6em 0;
	-webkit-appearance: none;
	border: none;
	width: 100%; 
	//margin-left: -0.7em;  
}
.buttonn input[type="submit"]:hover {
    color: #FFF;
    background: #FF9800;
	-webkit-transition:.5s all;
	-moz-transition:.5s all;
	-o-transition:.5s all;
	-ms-transition:.5s all;
	transition:.5s all;
}
.buttonn:hover:before {
    border-right-color:#FF9800;
}
.buttonn:hover:after {
	border-left-color:#FF9800;
}
.bottomm {
    padding: 10px 0;
    text-align: center;
}

.bottommm {
    padding-bottom: 10px;
}
.bottommm-leftt {
    float: left;
    width: 10px;   
    padding: 15px 10px 0;	
	font-size: 12px;
	color:white;
	text-align: right;
}

.bottommm-rightt {     
    padding: 15px 1px 0;
    overflow: hidden;	
	font-size: 12px;
	color:white; 
}

.copyright {
    margin: 1em 0;
    text-align: center;
	color: #9a2109;	
}

.copyright  a{
    color: #9a2109; 
	text-decoration:none;
}
.copyright a:hover{
    color: red;	
}

/*-- responsive-design --*/
@media(max-width:1440px){
.buttonn input[type="submit"] { 
    width: 100%; 
}
}
@media(max-width:1366px){
.formm {
    width: 36%; 
	margin: 3em auto;
}
.title {	
    color: #9a2109;	
}
}
@media(max-width:1280px){
.formm {
    width: 38%; 
}

}
@media(max-width:1200px){
.formm {
    width: 40%; 
}

}
@media(max-width:1120px){
.formm {
    width: 42%; 
}

}
@media(max-width:1080px){ 
.formm {
    width: 45%;
}

}
@media(max-width:1024px){

.formm {
    width: 47%;
    margin: 2em auto;
}
}
@media(max-width:991px){

.formm {
    width: 49%; 
}

}
@media(max-width:900px){ 
.formm { 
	width: 53%; 
}


}
@media(max-width:800px){ 
.formm {
    width: 60%; 
}

.title {
	font-size: 30px;
}

.buttonn input[type="submit"] {
    font-size: 1.3em; 
}

}
@media(max-width:768px){

.buttonn input[type="submit"] {
    width: 100%;
} 
.formm {
    width: 62%; 
}

} 
@media (max-width: 736px){
.buttonn input[type="submit"] {
    width: 100%;
} 
.formm {
    width: 65%; 
}

} 
@media(max-width:667px){
.buttonn input[type="submit"] {
    width: 100%;
    font-size: 1.1em;
}
.formm input[type="text"], .formm input[type="password"] { 
    width: 95%; 
}

.formm {
    width: 70%; 
}

} 
@media(max-width:640px){
.formm {
    width: 72%;
}

.buttonn input[type="submit"] {
    width: 100%;
}
}
@media(max-width:600px){
.buttonn input[type="submit"] {
    width: 100%;
}
.copyright  {
    padding:0 1em;
}
.formm {
    width: 76%;
}

}
@media(max-width:480px){
.container {
    padding: 1.5em 0 0;
}

.formm input[type="text"], .formm input[type="password"] {
    font-size: 0.9em; 
    padding: 0.6em .5em;  
}
.styled-input label { 
    padding: 0.6em .5em; 
    font-size: 0.9em; 
}
.styled-input input:focus ~ label, .styled-input input:valid ~ label {
    font-size: .8em;  
}


.buttonn input[type="submit"] {
    font-size: 1em;
    width: 100%;
    padding: 0.8em 0;
} 
.bottomm {
    padding: 1.5em 0; 
}
.formm {
    width: 80%;
}

.copyright p {
    font-size: 0.9em; 
}
.formm p {
    font-size: 0.9em; 
}
.buttonn:before {
    border-top: 11px solid transparent;
    border-right: 11px solid #FF9800;
}
.buttonn:after { 
    border-left: 11px solid #FF9800;
    border-top: 11px solid transparent; 
}
.desc { 
   
	font-size: 18px;
}
.labell{
	font-size: 0.9em; 
}
.contentt{
	font-size: 0.9em; 
}
}
@media(max-width:414px){ 
.styled-input { 
    margin: 1.5em 0 1em; 
}
.copyright p { 
    padding: 0 1em;
}
.buttonn:before {
    border-top: 10px solid transparent;
    border-right: 10px solid #FF9800;
}
.buttonn:after { 
    border-left: 10px solid #FF9800;
    border-top: 10px solid transparent; 
}
.buttonn input[type="submit"] { 
    width: 100%; 
}
.title {	
    font-size: 28px; 
}

.desc {
   
	font-size: 17px;
}
.labell{
	font-size: 0.8em; 
}
.contentt{
	font-size: 0.8em; 
}
}
@media(max-width:384px){
.buttonn input[type="submit"] {
    width: 100%;
    font-size: 0.9em;
}

.formm { 
    margin: 1.5em auto;
}
.title {	
    font-size: 26px; 
}

}
@media(max-width:375px){
.buttonn input[type="submit"] {
    width: 100%;
}
h1 {
    font-size: 1.6em;
} 

.title {	
    font-size: 24px; 
}

.copyright {
    
	font-size:15px;
}
.desc {
   
	font-size: 15px;
}
}
@media(max-width:320px){
.container {
    padding: 1em 0 0;
}
.formm {
    width: 85%;
} 
.formm input[type="text"], .formm input[type="password"] {
    font-size: 0.8em;
    padding: 0.6em;
    width: 92%;
}
.styled-input label {
    padding: 0.6em;
    font-size: 0.8em;
}
.styled-input input:focus ~ label, .styled-input input:valid ~ label {
	font-size: 0.8em;
    top: -1em;
} 
.styled-input input ~ span { 
    bottom: -1px; 
}
.buttonn input[type="submit"] {
    width: 100%;
}

.title {	
    font-size: 23px; 
}

.copyright {
    
	font-size:14px;
}
}
/*-- //responsive-design --*/