/*
Theme Name: hanspetter.info
Theme URI: https://hanspetter.info
Author: Martin Grønneberg
Author URI: https://martingronneberg.no
Description: Et nettsted utviklet for Hans-Petter Nygård-Hansen.
Version: 2.0
*/


/*--------------------------------------------------------------
Table of Contents
----------------------------------------------------------------
# Reset CSS
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Layout
	## Site Header
	## Site Search
	## Site Content
	## Site Footer
	## Posts and pages
# Media
	## Captions
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Reset CSS
--------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

html {
	font-size: 62.5%;
}

body,
button,
input,
select,
textarea {
	color: #565d5e;
	font-family: 'Roboto', sans-serif;
	font-size: 1.6rem;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	line-height: 1.6;
	text-rendering: optimizeLegibility;
}

@media screen and (max-width: 600px) {
	body,
	button,
	input,
	select,
	textarea {
		font-size: 1.4rem;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 400;
	line-height: 1.25;
	margin: 0 0 1rem;
}

h1 {
	font-size: 3.5rem;
}

h2 {
	font-size: 2.5rem;
}

h3 {
	font-size: 2.25rem;
}

h4 {
	font-size: 2.25rem;
}

h5 {
	font-size: 2rem;
}

h6 {
	font-size: 1.8rem;
}

@media screen and (max-width: 600px) {
	h1 {
		font-size: 3rem;
	}

	h2 {
		font-size: 2.5rem;
	}
}

@media screen and (max-width: 350px) {
	h1 {
		font-size: 2.5rem;
	}

	h2 {
		font-size: 2rem;
	}
}

p {
	margin: 0 0 2rem;
}

em,
i {
	font-style: italic;
}

b,
strong {
	font-weight: 700;
}

blockquote:before {
	color: #ce2a4b;
	content: '\f10e';
	float: left;
	font-family: FontAwesome;
	font-size: 3rem;
	line-height: 1;
	margin: -2rem 2rem 0 0;
}

blockquote {
	margin: 4rem 0 2rem;
}

cite {
	font-style: italic;
}

ins,
u {
	text-decoration: underline;
}


/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

*,
*:before,
*:after {
	box-sizing: inherit;
}

html,
body {
	overflow-x: hidden;
}

html {
	box-sizing: border-box;
}

body {
	background: #fafafa;
}

ul,
ol {
	margin: 0 0 2rem 2rem;
	padding: 0;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

button {
	background: #ce2a4b;
	border: 0;
	color: #fff;
	cursor: pointer;
	margin: 0;
	padding: 0;
}


/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/

input,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: #efefef;
	border: 0;
	border-radius: 0;
	margin: 0 0 1rem;
	outline: 0;
	padding: 1rem;
	width: 100%;
}

input[type="checkbox"] {
   -webkit-appearance: checkbox;
   -moz-appearance:    checkbox;
   appearance:         checkbox;
	width: auto;
}

input[type="radio"] {
   -webkit-appearance: radio;
   -moz-appearance:    radio;
   appearance:         radio;
	width: auto;
}


input[type="submit"] {
	background: #ce2a4b;
	color: #fff;
	cursor: pointer;
	margin: 0;
	padding: 1rem 2rem;
	transition: background .25s;
	width: auto;
}

input[type="submit"]:hover {
	background: #394959;
}

label {
	font-size: 1.4rem;
	font-weight: 700;
	text-transform: uppercase;
}


/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

a {
	color: #565d5e;
	cursor: pointer;
	text-decoration: none;
	transition: color .25s;
}

a:hover {
	color: #ce2a4b;
}

.button {
	background: #ce2a4b;
	color: #fff;
	display: inline-block;
	padding: .75rem 2rem;
	transition: background .25s, color .25s;
}

.button:hover {
	background: #394959;
	color: #fff;
}

.pagination {
	clear: both;
	padding: 2rem 0;
	text-align: center;
}

.page-numbers {
	cursor: pointer;
	padding: .75rem 1.5rem;
	transition: color .25s;
}

.page-numbers:hover {
	color: #ce2a4b;
}


/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
	float: right;
}

@media screen and (max-width: 800px) {
	.main-navigation {
		display: none;
		float: none;
	}
}

.main-navigation ul {
	list-style: none;
	margin: 0;
}

.main-navigation li {
	float: left;
}

.main-navigation li + li {
	margin: 0 0 0 1rem;
}


.footer-navigation {
	display: inline-block;
}

.footer-navigation ul {
	list-style: none;
	margin: 0;
}

.footer-navigation li {
	float: left;
}

@media screen and (max-width: 600px) {
	.footer-navigation li {
		float: none;
	}
}

.footer-navigation li + li {
	margin: 0 0 0 1rem;
}

.mobile-navigation {
	background: #efefef;
	display: none;
	font-size: 1.8rem;
	line-height: 2;
	padding: 2rem;
}

.mobile-navigation ul {
	list-style: none;
	margin: 0;
}

.menu-toggle {
	background: 0;
	color: #565d5e;
	display: none;
	float: right;
	font-size: 1.6rem;
	line-height: 8rem;
}

@media screen and (max-width: 800px) {
	.menu-toggle {
		display: block;
	}
}

.search-toggle {
	background: 0;
	color: #565d5e;
	float: right;
	font-size: 1.6rem;
	line-height: 8rem !important;
	margin: 0 0 0 2rem;
}

.search-toggle:hover {
	color: #ce2a4b;
}

@media screen and (max-width: 350px) {
	.search-toggle {
		margin: 0 0 0 1rem;
	}
}


/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/

.screen-reader-text {
	display: none;
}


/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/

.alignleft,
.alignright {
	display: inline;
	width: calc(50% - 2rem);
}

.alignleft {
	float: left;
	margin-right: 2rem;
}

.alignright {
	float: right;
	margin-left: 2rem;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}


/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/

.container:before,
.container:after,
.site-header:before,
.site-header:after,
.site-search:before,
.site-search:after,
.site-content:before,
.site-content:after,
.footer-newsletter:before,
.footer-newsletter:after,
.site-footer:before,
.site-footer:after,
.archive-content:before,
.archive-content:after,
.single-related:before,
.single-related:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.container:after,
.site-header:after,
.site-search:after,
.site-content:after,
.footer-newsletter:after,
.site-footer:after,
.archive-content:after,
.single-related:after {
	clear: both;
}


/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/

.row {
	padding: 2.5rem 0;
}

.container {
	margin: 0 auto;
	max-width: 100rem;
	padding: 0 2rem;
}

@media screen and (max-width: 350px) {
	.container {
		padding: 0 1rem;
	}
}

.column {
	float: left;
}

.one-half {
	float: left;
	margin: 0 0 2rem;
	width: calc(50% - 1rem);
}

.one-half:nth-child(2n + 3) {
	clear: left;
}

.one-half:nth-child(2n + 2) {
	margin: 0 0 2rem 2rem;
}

@media screen and (max-width: 800px) {
	.one-half {
		margin: 0;
		width: 100%;
	}

	.one-half:nth-child(2n +2) {
		margin: 0;
	}

	.one-half:nth-child(2n + 3) {
		clear: none;
	}

	.one-half + .one-half {
		margin: 2rem 0 0;
	}
}

.one-third {
	margin: 0 0 2rem;
	width: calc(33% - 1rem);
}

.one-third + .one-third {
	margin: 0 0 2rem 1.5rem;
}

@media screen and (max-width: 800px) {
	.one-third {
		margin: 0;
		width: 100%;
	}

	.one-third + .one-third {
		margin: 2rem 0 0;
	}
}


/*--------------------------------------------------------------
## Site Header
--------------------------------------------------------------*/

.site-header {
	background: #fff;
	box-shadow: 1rem 0 1rem rgba(0,0,0,.1);
	line-height: 8rem;
	position: relative;
}

.site-title {
	float: left;
	font-size: 1rem;
	line-height: 1;
	margin: 0;
}

.site-title img {
	height: 5rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

@media screen and (max-width: 600px) {
	.site-title img {
		height: 4rem;
	}
}


/*--------------------------------------------------------------
## Site Search
--------------------------------------------------------------*/

.site-search {
	background: #efefef;
	display: none;
	padding: 1rem 2rem;
}

.search-form {
	margin: 0 auto;
	max-width: 100rem;
}

.search-form input {
	float: left;
}

.search-form input[type="search"] {
	background: 0;
	margin: 0;
	padding: 1rem 1rem 1rem 0;
	width: 85%;
}

.search-form input[type="submit"] {
	font-family: 'FontAwesome';
	width: 15%;
}


/*--------------------------------------------------------------
## Site Content
--------------------------------------------------------------*/

.site-content {
	max-width: 100rem;
	margin: 0 auto;
	padding: 2rem;
}

@media screen and (max-width: 350px) {
	.site-content {
		padding: 2rem 1rem;
	}
}

.page .site-content {
	max-width: none;
}


/*--------------------------------------------------------------
## Site Footer
--------------------------------------------------------------*/

.footer-widgets {
	background: #efefef;
	padding: 5rem 0;
}

.footer-widgets img {
	height: 4rem;
	margin: 0 0 1rem;
}

.widget {
	float: left;
	line-height: 1.25;
	width: calc(33.33% - 2rem);
}

.widget + .widget {
	margin: 0 0 0 3rem;
}

@media screen and (max-width: 800px) {
	.widget {
		float: none;
		width: 100%;
	}

	.widget + .widget {
		margin: 5rem 0 0;
	}
}

.widget ul {
	list-style: none;
	margin: 0;
}

.widget li + li {
	margin: .5rem 0 0;
}

.widget-title .rsswidget:first-of-type {
	display: none;
}

.footer-partners {
	background: #fff;
	padding: 5rem 0;
	text-align: center;
}

.partner {
	cursor: pointer;
	outline: 0;
	padding: .5rem;
}

.partner-title {
	font-size: 1.8rem;
	margin: 1rem 0;
}


/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

img {
	height: auto;
	max-width: 100%;
}

.wp-post-image {
	width: 100%;
}

embed,
iframe,
object {
	width: 100%;
}

.site-banner {
	margin: 0 auto;
	max-width: 100rem;
	padding: 2rem;
}


/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
	margin-bottom: 2rem;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption-text {
	font-size: 1.4rem;
	margin: .5rem 0 0;
}

.read-more {
	border-bottom: .2rem solid #ce2a4b;
}

.error-header {
	padding: 5rem 0;
}

.error-title {
	margin: 0 0 1rem;
}


/*--------------------------------------------------------------
# Social Media
--------------------------------------------------------------*/

.social-media {
	margin: 0 0 2rem;
}

.social-media a {
	border: 0;
}

.social-media a + a {
	margin: 0 0 0 .5rem;
}

.social-media .fa:before {
	display: inline-block;
	width: 1.6rem;
}

.social-media .fa {
	border: .1rem solid rgba(0,0,0,.2);
	border-radius: 50%;
	font-size: 1.6rem;
	padding: 1rem;
	text-align: center;
	transition: border .25s, color .25s;
}


/*--------------------------------------------------------------
## Page
--------------------------------------------------------------*/

.page-header {
	height: 60vh;
	margin: -2rem -2rem 0 -2rem;
	transition: height .25s;
	width: calc(100% + 4rem);
}

@media screen and (max-width: 1000px) {
	.page-header {
		height: 50vh;
	}
}

@media screen and (max-width: 600px) {
	.page-header {
		height: 40vh;
	}
}

@media screen and (max-width: 450px) {
	.page-header {
		height: 30vh;
	}
}

.page-content {
	margin: 0 auto;
	max-width: 80rem;
	padding: 2rem 0;
}

.page-content > p:first-child {
	font-size: 2rem;
}

@media screen and (max-width: 600px) {
	.page-content > p:first-child {
		font-size: 1.8rem;
	}
}

.page-content a {
	border-bottom: .2rem solid #ce2a4b;
}


/*--------------------------------------------------------------
## Post
--------------------------------------------------------------*/

.single-header {
	margin: 0 auto;
	max-width: 80rem;
}

.single-header img {
	margin: 0 0 1rem;
}

@media screen and (max-width: 800px) {
	.single-header img {
		margin: -2rem -2rem 1rem -2rem;
		max-width: none;
		width: calc(100% + 4rem);
	}
}

.single-header .wp-caption-text {
	margin: -1rem 0 1rem;
}

.single-title {
	font-weight: 700;
	margin: 0;
}

.single-meta {
	margin: 0 auto 1rem;
	max-width: 80rem;
}

.single-byline {
	margin: 0 0 1rem;
}

.single-content {
	margin: 0 auto;
	max-width: 80rem;
}

.single-content h2,
.single-content h3,
.single-content h4,
.single-content h5,
.single-content h6 {
	margin: 2rem 0 1rem;
}

.single-content a {
	border-bottom: .2rem solid #ce2a4b;
}

.single-tags {
	font-size: 1.4rem;
	font-weight: 700;
	margin: 0 auto 2rem;
	max-width: 80rem;
	text-transform: uppercase;
}

.single-tags a {
	background: #efefef;
	display: inline-block;
	margin: 0 0 .5rem;
	padding: .5rem 1rem;
}

.single-tags a + a {
	margin: 0 0 .5rem .5rem;
}

.single-related {
	background: #fff;
	margin: 0 -9999rem;
	padding: 5rem 9999rem;
}

.single-related h2 {
	font-size: 3rem;
	margin: 0 0 2rem;
}

.single-related p {
	font-weight: 700;
	line-height: 1.25;
}

@media screen and (max-width: 800px) {
	.single-related article img {
		float: left;
		width: calc(40% - .5rem);
	}

	.single-related article p {
		float: right;
		width: calc(60% - .5rem);
	}
}

.single-footer {
	margin: 0 auto;
	max-width: 80rem;
	padding: 5rem 0;
}

.footer-newsletter {
	background: #394959;
	color: #fff;
	box-shadow: .5rem .5rem 1rem rgba(0, 0, 0, .1);
	padding: 5rem 0;
	text-align: center;
}

@media screen and (max-width: 800px) {
	.footer-newsletter {
		padding: 2.5rem 0;
	}
}

.footer-newsletter form {
	display: inline-block;
	max-width: 50rem;
	width: 100%;
}

.footer-newsletter input {
	float: left;
}

.footer-newsletter input[type="email"] {
	width: 80%;
}

.footer-newsletter input[type="submit"] {
	font-family: 'FontAwesome';
	transition: background .25s, color .25s;
	width: 20%;
}

.footer-newsletter input[type="submit"]:hover {
	background: #fff;
	color: #ce2a4b;
}


/*--------------------------------------------------------------
## Archive
--------------------------------------------------------------*/

.archive-header {
	background: #394959;
	color: #fff;
	margin: -2rem -9999rem 2rem;
	padding: 5rem 9999rem;
}

@media screen and (max-width: 600px) {
	.archive-header {
		background: #394959;
		color: #fff;
		margin: -2rem -9999rem 2rem;
		padding: 2.5rem 9999rem;
	}
}

.archive-header p {
	margin: 1rem 0 0;
}

.archive-title {
	margin: 0;
}

.archive-footer {
	padding: 2rem 0;
}


/*--------------------------------------------------------------
## Entries
--------------------------------------------------------------*/

.entry-category {
	background: #394959;
	color: #fff;
	display: inline-block;
	font-size: 1.4rem;
	font-weight: 700;
	margin: 0 0 1rem;
	padding: .25rem 1rem;
	text-transform: uppercase;
	transition: background .25s;
}

a.entry-category:hover {
	background: #ce2a4b;
	color: #fff;
}

.entry-title {
	font-weight: 700;
	margin: 0 0 1rem;
}

.entry-meta {
	font-size: 1.4rem;
	margin: 0;
}

.entry-meta a {
	color: #ce2a4b;
}

.entry-meta a:hover {
	color: #565d5e;
}


/*--------------------------------------------------------------
## Entries
--------------------------------------------------------------*/

.single.annonse {
	background: #efefef;
}

article.category-annonse {
	background: #efefef;
	padding: 2rem;
}


/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

.wpcf7 p {
	margin: 0;
}