/* CSS Document 
Brummett landing main style sheet
*/
@charset "UTF-8";

html { 	background: url('../images/bg.jpg') no-repeat center center fixed; 
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		min-width:20px;
	}
		
body{
        height:100%;
		font-size:16px;
		letter-spacing:.3px;
		color:#ffffff;
		font-weight:400;
		}

#content{
		width:578px;
		height:150px;
		position:absolute; top:0;bottom:0;left:0;right:0;
		margin:auto 2.5%;
		}

#content .left{
			width:134px;
			float:left
			}

#content .avatar{
				margin:0px 0;
				width:134px;
				height:134px;
				border-radius:67px;
				border:5px solid #fff;
				box-sizing:border-box;
				-moz-box-sizing:border-box;
				background:url(../images/profile.png) 
				no-repeat;
				background-size:102%;background-position:center;
				background-color:RGBA(255,255,255,.5)
				}
				
#content .avatar{
				background-color: #cccccc;
				}
	
#content .right{	
				width:421px;
				height:100%;
				float:right
				}
#content .right h1{
				font-size:30px;
				font-weight:500;
				margin:0;
				padding:0
				}
#content .right p {	
					margin:5px 0;
					color:#cccccc; 
					line-height:1.5
					}
#content .right p a{
					text-decoration:none;
					color:#fff;
					font-weight:500;
					}
#content .right p a:hover{
						color:rgba(255,255,255,.75);
						text-decoration:underline;
						}

						form {
    margin:0;
    width:380px;
	}

input, textarea, file {
	width:380px;
	height:27px;
	background-color:#e0ffff;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:5px solid #216182;
	padding:10px;
	margin-top:10px;
	font-size:0.9em;
	color:#33333;

}
input:focus, textarea:focus {
			border:5px solid #3a99c9;
		}
textarea {
	height:213px;
	}
#submit,#cancel {
	/* background:url(images/cancel.png); */
	width:127px;
	height:48px;
	text-align:center;
	/* text-indent:-9999px; */
	border:5px solid #216182;
	margin-top:10px;
	cursor:pointer;
}
#submit:hover, #cancel:hover {
	color:#fff;
	background-color: #216182;
}
						
						
@media only screen and (max-width: 768px) {
				#content { 
						margin-left:5px;
						}
				#content .right p {	
								width:80%;
								}
@media only screen and (max-width: 480px) {
				#content { 
						width: 360px;					
						margin:30px auto;
						}
				#content .left{
								width:100%;
			  						}			
								
						#content .avatar{
							margin:0 auto;
							clear;
						}
						#content .right{	
									width:100%;
									margin:0 auto;
									clear; 
									}
						#content .right h1{
								margin:0 auto;
								text-align:center;
						}
						#content .right p {	
						        width:80%;
								margin: 0 auto;
								text-align:center;
							}
				} 
 
@media screen and (max-width:380px){
						#content{
								width: 360px;					
								margin:30px auto;
								}
							
						#content .left{
								width:100%;
			  						}			
								
						#content .avatar{
							margin:0 auto;
							clear;
						}
						#content .right{	
									width:100%;
									margin:0 auto;
									clear; 
									}
						#content .right h1{
								font-size:26px;
								margin:0 auto;
								text-align:center;
						}
						#content .right p {	
						        width:80%;
								margin: 0 auto;
								text-align:center;
							}
	}