@charset "utf-8";
/* CSS Document */

header {
    background-image:url('../_images/bg.jpg');
    padding-bottom:10px;
    border-bottom:5px solid #333;
}

header > div {
    /*background:#333;*/
}

header > div > div {
	max-width:1040px;
	padding:0px 20px 0px 20px;
	margin:0px auto;
}


header > div > div > a {
	float:left;
	text-decoration:none;
	font-size:175%;
	padding:20px;
    color:#fff;
}

header > div > div > a > img {
    border:none;
}

header > div > div > a:hover {
    color:#f90
}

header > div > div > img {
	margin:20px 0px;
}

header span {
	line-height:28px;
	font-size:18px;
	font-weight:bold;
	display:block;
}

header > div > p {
	float:left;
	width:40%;
}

header span#slogan {
	
}

header span#header-bold {
	color:#81014c;
	font-style:italic;
	text-transform:capitalize;
}

header a#login-button {
	float:right;
}

header form input {
	width:35%;
	padding:5px;
	border:1px solid #000;
}

header form button {
	padding:6px 10px 6px 10px;
	background:#333;
	color:#fff;
	border:none;
	cursor:pointer;
}

header form button:hover {
	background:#a37;
}

div#mobile-grid {
	float:right;
	margin:10px 10px 0px 0px;
	width:40px;
	display:none;
}

div#mobile-grid a {
	text-decoration:none;
	display:block;
	border-bottom:6px solid #fff;
	line-height:8px;
}

@media (max-width:850px){
	div#mobile-grid {
		display:inline;
	}
	
	header {
		padding:20px 0px 0px 0px;
	}
	
	header p {
		display:none;
	}
	
	header img {
		max-width:100%;
		margin:0px;
	}
	
        header > a {
            float:none;
            display:block;
        }
        
	header a#login-button {
		float:none;
		display:block;
		margin:10px 0px 10px 0px;
		padding:20px;
		text-align:center;
		font-size:125%;
		border-radius:none;
	}
	
	header form {
		text-align:center;
		margin:10px 0px 10px 0px;
		display:block;
	}
	
	header form input {
		width:70%;
		padding:5px;
		border:1px solid #000;
	}
	
	header form button {
		
	}
	
	header form button:hover {
		background:#a37;
	}
}