html { /* https://css-tricks.com/perfect-full-page-background-image/ */
	background-color: white;
	background: url('../img/bg0.jpg') no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

body {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #3F5770;
}

/* #header {
	padding-top: 150px;
} */

#header, #footer, #content {
	display: block;
	/* width: 70%; */
	text-align: center;
	/* margin: 30px auto; */
}

/* #content {
    margin-top: -10px;
} */

/* Vertical Centering using flexbox - START */
html {
	display: flex;
	width: 100%;
	height: 100%;
}
body {
	display: flex;
	width: 75%;
	margin: auto;
	flex-wrap: wrap;
}
#header, #footer, #content {
	width: 100%;
}
#header {
	padding-top: 2em;
	margin-top: -80px;
	position: relative;
	top: 78px;
	margin-bottom: 78px;
}
/* Vertical Centering using flexbox - END */

/* Hide google ads */
.gsc-adBlock { display: none !important; }

#logo {
	max-width: 517px;
	margin: auto;
}
#logo img {
	max-width: 100%;
}

#tagline {
	margin: 6px;
}

#logo-link {
	width: 100%;
	max-width: 517px;
	display: block;
	margin: auto;
}

#searchbar2 {
	margin: 0px;
	text-align:center;
	max-width: 400px;
	width:100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#resultsbox2 {
    width: 80%;
    margin: auto;
}

#resultsbox2 .gsc-control-cse,
#resultsbox2 .control-cse {
	background: none;
	border: none;
}

#search {
	margin: 15px;
}
#search .wrapper {
	border:1px solid #000;
	display:inline-block;
	padding: 0;
	height: 21px;
	background-color: white;
	border-radius: 3px;
	overflow: hidden;
}
#search-txt {
	border: none !important;
	background-color: transparent;
	margin: 0 0 0 3px;
	width: 300px;
	max-width: 85%;
}
#search-btn {
	border-left: 1px solid black;
	border-right: none;
	border-top: none;
	border-bottom: none;
	margin: 0;
	height: 22px;
	width: 54px;
	background-color: #F5F5F5;
	color: black;
}
#search-btn:active {
	background-color: #3F5770;
	color: #F5F5F5;
}

#social img {
	width: 16px;
	height: 16px;
}

.icon-paper {
	background-image: url('/assets/bootstrap/fonts/paper.png');
	background-size: 32px 32px;
	height: 32px;
	width: 32px;
	display: inline-block;
}

.item {
	text-align: center;
	width: 100px;
	display: inline-block;
	border: 1px solid #3F5770;
	padding: 5px;
	border-radius: 4px;
	background-color: #F5F5F5;
	margin: 2px 1px;
}
.item p {
	padding-top: 2px;
	margin: 0px;
}

a {
	position: relative;
	top: 0;
	color: #3F5770;
	text-decoration: none;
}
a:hover {
	color: red;
}
a:active {
	position: relative;
	top: 1px;
}

/*mobile fixes*/
@media screen and (max-width: 980px){
	html {
		/*background-size: auto;*/
	}
	#header {
		padding-top: 10em;
		width: 100%;
	}
	#logo {
		max-width: 240px;
	}
	#logo img {
		display: none;
	}
	#logo {
		background: url('../img/logo_m.png') no-repeat center center;
		height: 78px;
	}
	#search .wrapper {
		width: 100%;
	}
	#search-txt {
		width: 78%;
		height: 20px;
		float: left;
	}
	#search-btn {
		width: 18%;
		float: right;
	}
	.item {
		width: 95px;
	}
	body {
		width: 95%;
		overflow-x: hidden;
	}
	#resultsbox2 {
		width: 100%;
	}
}
@media screen and (max-width: 480px) {
	.item {
		width: 90px;
	}
	/*#search-txt {
		width: 72%;
		height: 20px;
		float: left;
	}
	#search-btn {
		width: 20%;
		float: none;
	}*/
}	
