/*
	Theme Name: Nytta & Nöje 
	Theme URI: http://www.stampen.com/
	Version: 1.0.0
	Description: Tema för	Stampen Lokala Mediers kundklubb Nytta & Nöje
	Author: Johan Linnarsson
	Author URI: http://www.stampen.com/
	Tags: HTML5, CSS3
	Text Domain: nyttanoje

	License: GNU General Public License v2.0
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/*------------------------------------*\
	MAIN
\*------------------------------------*/

/* Google Fonts @import måste ligga överst i CSS-filen. */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500');

@font-face {
  font-family: 'GothiaGPSerif-Black';
  src:  url('fonts/GothiaGPSerif-Black.woff2') format('woff2'),
        url('fonts/GothiaGPSerif-Black.woff') format('woff');
}

@font-face {
  font-family: 'GothiaGPSans-Light';
  src:  url('fonts/GothiaGPSans-Light.woff2') format('woff2'),
        url('fonts/GothiaGPSans-Light.woff') format('woff');
}

.textwidget {
    font-family: 'GothiaGPSans-Light';
}

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
	font-size:62.5%;
}
body {
	font:300 16px/1.6 'Georgia', sans-serif;
	color: #0a324b;
	background-color: #f7f7f7;
}
/* clear */
.clear:before,
.clear:after {
	content:' ';
	display:table;
}

.clear:after {
	clear:both;
}
.clear {
	*zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
iframe, object, embed {
	max-width:100%;
}
a {
	color: #0a5582;
	text-decoration:none;
}
a:hover {
	color:#0a5582;
	text-decoration: underline;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}

.clearblock {
	clear: both;
}

b, strong {
    font-weight: 400;
}

h3 {
	font-weight: 400;
}

/*------------------------------------*\
	STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {
	max-width:1280px;
	width:95%;
	margin:0 auto;
	position:relative;
}

.content-wrapper {
	padding-top: 87px;
}

.wrapper-single {
    padding-top: 120px;
	padding-bottom: 20px;
}

.line {
	border-bottom: 1px solid #969696;
}

/*------------------------------------*\
	HEADER
\*------------------------------------*/
.header {
	/*background-color: red;*/
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex; 
	display: flex;	 
	flex-wrap: wrap;
	position: fixed;
	z-index: 8888;
	width: 100%;
	background-color: #ffffff;
	border-bottom: 1px solid #e5e5e5;
}

.wrapper-header {
	display: block;
}

/* logo */
.logo {
	padding-top: 10px; padding-top: 1rem;
	padding-bottom: 10px; padding-bottom: 1rem;
	float: left;
	/*background-color: green;*/
}
	.logo-img {
		width: 18rem; width: 180px;
	}

	.logo-img-mobile {
		width: 22rem; width: 220px;
		height: 7.3rem; height: 73px;
		margin-bottom: 4px;
	}

/* Login and search */
.login-search:before {
	content: '';
	display: inline-block;
	height: 50%;
	vertical-align: middle;
}
	.login-search {
		width: 50%;
		-webkit-box-flex: 1;
		-moz-box-flex: 1;
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1; 
		float: right;
		display: inline-block;
		vertical-align: middle;
		/*background-color: blue;*/
		display: block;
	}
	.login-search > ul {
	height: auto;
	margin: 0;
	padding: 0;
	}
	.login-search > ul li {
		float: right;
		padding-left: 30px; padding-left: 3rem;
		list-style-type: none;
		font-size: 20px; font-size: 2rem;
	}

		.tulo_login {
			background-color: #0a5582;
			border-radius: 0.4rem; border-radius: 4px;
			padding: 6px 12px 6px 212px; padding: 0.6rem 1.2rem 0.6rem 1.2rem;
			border: none;
			color: #fff;
/*border: 1px solid #a4c407;
    background-color: #fcfdf2;
    border-radius: 0.4rem;
    border-radius: 4px;
    padding: 6px 12px 6px 212px;
    padding: 0.6rem 1.2rem 0.6rem 1.2rem;*/
    /* border: none; */

		}
		.tulo_login2 {
			background-color: #373a3c;
			border-radius: 0.4rem; border-radius: 4px;
			padding: 6px 12px 6px 212px; padding: 0.6rem 1.2rem 0.6rem 1.2rem;
			border: none;
			color: #fff !important;
		}
		input.search-input-header {
			padding: 7px;
			border: 1px solid #dadada;
		}

/* Search form in header for desktop */
.search {
	margin-left: -5px !important;
}

.search-input {
	background-color: transparent;
	background-image: url(img/search-icon.svg);
	background-position: 5px center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	border: none;
	cursor: pointer;
	height: 29px;
	margin: 3px 0;
	padding: 0 0 0 34px;
	position: relative;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	width: 0;
}

.search-input:focus {
	background-color: #fff;
	border: 1px solid #ececec;
	border-radius: 4px;
	cursor: text;
	outline: 0;
	width: 230px;
}
.search
.search-submit { 
	display:none;
}

.search-submit { 
	display:none;
}

/* Search form in header for desktop */
ul.mobile-menu-search {
    height: 40px !important;
    height: 4rem !important;
}

.search-input-mobile {
	background-image: url(img/search-icon.svg);
	background-position: 14px center;
	background-repeat: no-repeat;
	background-size: 24px 24px;
	border: none;
	cursor: pointer;
	/*height: 35px;*/
	margin: 3px 0;
	padding: 10px 10px 10px 34px;
	position: relative;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	border: 1px solid #000;
}

input.search-input-mobile {
	padding-left: 50px;
}

/* Navigation menu */
.nav {
	/*width: 100%;
	clear: both;*/
	float: right;
}
	.nav ul {
		display: block;
		/*border-bottom: 1px solid #000000;*/
		height: 50px; height: 5rem;
		margin: 0;
		line-height: 50px; line-height: 5rem;
		padding: 0;
	}
	.nav > ul li {
		float: left;
		padding: 0 30px 0 0 !important; padding: 0 3rem 0 0 !important;
		list-style-type: none;
		font-size: 16px; font-size: 1.6rem;
		font-weight: 400 !important;
		line-height: 80px;
	}
		.nav > ul li a {
			color: #252525;
		}
			.nav > ul li a:hover {
				color: #0a5582;
				text-decoration: none;
			}

				.current-menu-item > a {
					color: #0a5582 !important;
				}
	.nav > ul {
		float: left;
	}

	nav > ul li.desktop-menu-last-li {
    	padding: 0rem !important;
    	padding: 0px !important;
	}

	nav > ul li.desktop-search-last-li {
    	padding: 0rem !important;
    	padding: 0px !important;
	}

	.mobile-menu {
		display: none !important;
		/*padding: 0 30px 0 0 !important;
		padding: 0 3rem 0 0 !important;*/
	}

ul.mobile-menu {
    line-height: 80px;
}

ul.mobile-menu-login > li {
    line-height: 6rem;
}

ul#menu-huvudmeny-1 {
    height: auto;
}

ul#menu-huvudmeny-1 li:first-child {
	margin-top: 40px;
}

ul#menu-huvudmeny-1 li {
    /* display: none; */
    line-height: 42px;
}



/*------------------------------------*\
	SIDEBAR
\*------------------------------------*/
.sidebar {
	/* If we would have a sidebar, we would add CSS here. */
}



/*------------------------------------*\
	WIDGETS
\*------------------------------------*/
.widget-area-header {
	text-align: center;
}
	.widget-area-header h1 {
		font-size: 4rem; font-size: 40px;
		/*margin-bottom: 0px;
		padding-bottom: 0px;*/
		line-height: 46px;
	}
	.widget-area-header > .textwidget {
		font-size: 2rem; font-size: 20px;
		margin-bottom: 40px;
	}


/*------------------------------------*\
	FOOTER
\*------------------------------------*/
.footer {
	/*display: block;*/
	margin-top: 30px; margin-top: 3rem;
	/*margin-bottom: 40px; margin-bottom: 4rem;*/
	/*border-top: 1px solid #7b7b7b;*/
}
	.sidebar-widget {	
		/*float: left;*/
		width: 100%;
		margin-bottom: 20px; margin-bottom: 2rem;
	}
	.copyright {
		width: 100%;
		clear: both;
	}

	.footer-area-1 {
		text-align: center;
		font-size: 1.4rem; font-size: 14px;
	}

	.footer-area-1 > .textwidget ul {
		display: inline-block;
    		padding: 0;
		margin-top: 0px;
	}

		.footer-area-1 > .textwidget li {
    		list-style-type: none !important;
    		padding: 0 5px 0 5px;
    	}

img.img-stampenmedia {
	float: left;
	margin-top: 4px;
	margin-right: 30px;
	margin-bottom: 10px;
}

.wrapper-stampenmedia {
	padding: 20px 0 8px 0;
    background-color: #e5e5e5;
	font-size: 1.4rem; font-size: 14px;
}

.wrapper-stampenmedia a {
	color: #373a3c;
}

.wrapper-kontakt {
	/*border-top: 1px solid #969696;*/
	padding: 20px 0 1px 0;
	background-color: #ffffff;
}



/*------------------------------------*\
	LIST CATEGORIS
\*------------------------------------*/

.list-categories {
    width: 100%;
	text-align: center;
	padding: 0 10px 0 10px;
}


.list-categories ul {
    /*margin: 0px 0px 20px 0px;
margin-bottom: 40px;*/
	display: inline-block;
	/*padding: 0px 0px 0px 0px;*/
	margin-top: 0px;
}

.list-categories ul > li {
    display: block;
    float: left;
	padding-right: 20px;
	padding-bottom: 20px;
}

.list-categories ul > li a {
    background-color: #0a5582;
    padding: 5px 10px;
    border-radius: 4px;
    color: #fff;
}
	li.current-cat a {
		background-color: #77b4dc !important;
	}

.list-categories ul > li a:hover {
    background-color: #77b4dc;
    padding: 5px 10px;
    border-radius: 4px;
    color: #fff;
	text-decoration: none;
}


/*------------------------------------*\
	PAGES
\*------------------------------------*/

.linkbutton {
    background-color: #0a5582;
    border-radius: 0.4rem;
    border-radius: 4px;
    padding: 6px 12px 6px 212px;
    padding: 0.6rem 1.2rem 0.6rem 1.2rem;
    border: none;
    color: #fff;
    font-weight: 400;
}
	a:hover.linkbutton {
	    color: #ffffff !important;
		text-decoration: none;
	}


/*------------------------------------*\
	POSTS
\*------------------------------------*/

.nyttanoje-single h1 {
	padding-top: inherit;
	margin-top: 18px;
}

.nyttanoje-posts {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-flow: row wrap;
  align-content: space-between;
  justify-content: space-between;
  overflow: hidden;
  width: 100%;
}



.nyttanoje-valkommen {
	font-size: 3rem;
	padding: 40px 0 20px 0;
}

h1 {
	font-size: 30px; font-size: 3rem;
	font-weight: 400;
	padding-top: 10px; padding-top: 1rem;
	color: #0a5582;
	font-family: 'GothiaGPSerif-Black', sans-serif;
}

.nyttanoje-h1 {
	padding: 10px 0 10px 0; padding: 1rem 0 1rem 0;
}

/* Nytta & Nöje startpage. Displays all offers. */
.nyttanoje-posts .nyttanoje-erbjudande {
       	/*background-color: red;*/

}
.nyttanoje-erbjudande {
 	width: 23%;
	margin-right: 2%;
	margin-bottom: 3%;
	border: 1px solid #ececec;
	background-color: #ffffff;
}

		.nyttanoje-erbjudande:nth-child(4n+4) {
			margin-right: 0%;
			page-break-after: always !important;
  			break-after: always !important;
		}
	
		.nyttanoje-erbjudande:last-child {
			margin-right: auto;
		}

	.nyttanoje-erbjudande-content {

		padding: 20px;

	}
		.nyttanoje-erbjudande-content h2 {
			font-size: 16px; font-size: 1.6rem;
			font-weight: 400;
		}
			.nyttanoje-erbjudande-content a {
				color: #000;
			}
				.nyttanoje-erbjudande-content a:hover {
					color: #0a5582;
					text-decoration: none;
			}

	.nyttanoje-erbjudande-content-thumbnail {
		position: relative;
	}
		.nyttanoje-erbjudande-content-infotext {
			position: absolute;
			top: -1px;
			left: 0;
			background-color: #0a5582;
			padding: 5px 12px; padding: 0.5rem 1.2rem;
			font-weight: 500;
			font-size: 14px;
			color: #fff;
			text-transform: uppercase;
			border-right: 2px solid #fff;
			border-bottom: 2px solid #fff;
			-webkit-border-bottom-right-radius: 10px;
			-moz-border-bottom-right-radius: 10px;
			border-bottom-right-radius: 10px;
		}


.article-erbjudande {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
}

.article-image {
	position: relative;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1; 
	float: left;
	width: 36%;
	padding-right: 4%
	/*background-color: green;*/
}
	.article-image-single {
		border: 1px solid #e5e5e5;
		padding: 1rem; padding: 10px;
	}

	.article-image-infotext {
		position: absolute;
		top: 10px;
		left: 10px;
		z-index: 99;
		background-color: #0a5582;
		padding: 5px 12px; padding: 0.5rem 1.2rem;
		font-weight: 500;
		text-transform: uppercase;
		color: #fff;
		font-size: 20px; font-size: 2rem;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		-webkit-border-bottom-right-radius: 10px;
		-moz-border-bottom-right-radius: 10px;
		border-bottom-right-radius: 10px;
	}

.article-content {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1; 
	float: right;
	width: 60%;
	/*background-color: red;*/
}

	.article-content h2 {
		font-weight: 400;
    		font-size: 2.4rem; font-size: 24px;
		color: #373a3c;
	}

	.article-content h3 {
		font-size: 2rem; font-size: 20px;
		font-weight: 400;
		color: #373a3c;
	}

.social {
	    margin-top: 24px; margin-top: 2.4rem;
}

	.social > a {
		margin-right: 14px;
	}
	.social > span {
		font-size: 20px;
		margin-right: 14px;
	}


.goback {
    margin-top: 14px; margin-top: 1.4rem;
	padding-top: 10px; padding-top: 1rem;
    font-size: 20px; font-size: 2rem;
}



/*------------------------------------*\
	TULO PAYGATE
\*------------------------------------*/

.tulologinout {
	display: none;
}

.tulo_no_access .paygate {
background-color: inherit !important;
	padding: 10px 0 10px 0 !important;
    padding: 1rem 0 1rem 0 !important;
}

.tulo_no_access .paygate .info-box {
	margin-top: 0px !important;
	padding: inherit !important;
}
	.permission_required {
		/*font-size: 18px; font-size: 1.8rem;
		font-weight: 500;*/
		width: 46% !important;
		margin-right: 2%;
		/*margin-bottom: 10px; margin-bottom: 1rem;*/
		border-right: 1px solid #e5e5e5;
	}
	.tulo-product-wrapper {
		width: 46% !important;
		margin-left: 2%;
	}

	h2.paywall-plus-h2 {
		margin-top: 4px;
	}

	span.tulologinbutton {
		margin-bottom: 12px;
	}

.tulo_no_access .paygate button {
	display: inherit !important;
	padding: 8px 0;
	border-radius: inherit !important;
	background: #a8c611;
	min-width: 24%;
	margin: inherit !important;
	color: #FFF !important;
	box-shadow: inherit !important;
    font-weight: 500;
}

.article-content-paywall {
	margin-top: 40px; margin-top: 4rem;
	border: 1px solid #e5e5e5;
	padding: 10px 28px 14px 28px !important;
	background-color: rgba(255, 255, 255, 0.8);
}

.article-content-paywall p {
	margin-bottom: 30px;
}

.article-content-paywall a {
	background-color: #0a5582;
	padding: 8px 20px 8px 20px; padding: 0.8rem 2rem 0.8rem 2rem;
	border: none;
	color: #fff;
	cursor: pointer;
	font-weight: 400;
}
	.article-content-paywall a:hover {
		background-color: #77b4dc;
		color: #fff;
		text-decoration: none;
	}

/* Prevent loggedin button on top of page to display when not logged in. */
.tulologinout2 {
	display: none;
}

	.tulologinout2 a:hover {
		color: #fff;
		text-decoration: none;
	}



/*------------------------------------*\
	BACK TO TOP NAVIGATION
\*------------------------------------*/

#to-top-container {
	position: fixed;
	bottom: 0;
	right: 0;
	font-family: 'FontAwesome';
}
	#toTop {
		background-color: #333;
		border-radius: 4px 4px 0 0;
		bottom: 0;
		color: #fff;
		display: none;
		height: 35px;
		position: fixed;
		right: 30px;
		text-align: center;
		text-transform: uppercase;
		width: 48px;
		opacity: .9;
		z-index: 10000;
		-webkit-transition: all .2s ease-in-out 0s;
		transition: all .2s ease-in-out 0s;
	}
	#toTop img {
		width: 16px;
    	margin-top: 10px;
	}


/*------------------------------------*\
	IMAGES
\*------------------------------------*/



/*------------------------------------*\
	RESPONSIVE
\*------------------------------------*/





@media only screen and (max-width:1280px) {
}

@media only screen and (max-width:1140px) {
}

@media only screen and (-webkit-min-device-pixel-ratio:1.5),
		only screen and (min-resolution:144dpi) {
}

@media only screen and (max-width:1024px) {
.menu-login-desktop {
	display: none !important;
}

	.mobile-menu {
		display: inherit !important;
	}

	.nav > .mobile-menu ul li {
    	padding: 0 0 0 0 !important;
	}

	.desktop-menu, .desktop-search {
		display: none !important;
	}

	/* sökresultatet på mobil */
	.tt-dropdown-menu {
		top: inherit !important;
	}
		span.tt-suggestions a {
    		font-size: 14px;
    		text-align: left;
		}

a.tulo_login2.tulo_logout {
    border-radius: 0.4rem;
    border-radius: 4px;
    padding: 6px 12px 6px 212px;
    padding: 0.6rem 1.2rem 0.6rem 1.2rem;
    border: none;
    color: #fff;
    width: fit-content;
    font-size: 1.6rem; font-size: 16px;
    line-height: 2rem;
    margin: 1rem auto; margin: 10px auto;
	display: inline-block;
}

.permission_required {
	width: 100% !important;
    margin-right: 0% !important;
	border-right: inherit !important;
margin-top: 20px !important;
	margin-bottom: 20px !important;
	border-bottom: 1px solid #ececec;
}
.tulo-product-wrapper {
	width: 100% !important;
    margin-left: 0% !important;
}

.paywall-plus-h2 {
	font-size: 2rem !important;
	font-size: 20px !important;
	line-height: 10px !important;
}

.article-content-paywall p {
    margin-bottom: 14px;
}

span.tulologinbutton:first-child {
    margin-bottom: 22px;
}

}

@media only screen and (max-width:768px) {

/* startpage */
.nyttanoje-erbjudande {
 	width: 46%;
	margin-right: 2%;
	margin-left: 2%;
	margin-bottom: 4%;
	border: 1px solid #ececec;
}

	.nyttanoje-erbjudande:nth-child(4n+4) {
		margin-right: 2%;
	}


/* Erbjudande */
.article-erbjudande {
	display: inherit;
}

.article-image {
	width: 100%;
	padding-right: 0%;
	/*background-color: green;*/
}
	.article-image-infotext {
		position: absolute;
		top: 0;
		left: 0;
		background-color: #a4c407;
		padding: 5px 12px; padding: 0.5rem 1.2rem;
		font-weight: 500;
		color: #fff;
		font-size: 20px; font-size: 2rem;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		-webkit-border-bottom-right-radius: 10px;
		-moz-border-bottom-right-radius: 10px;
		border-bottom-right-radius: 10px;
	}

.article-content {
	width: 100%;
	/*background-color: red;*/
}

ul.footer-area-1-bullet {
    display: none !important;
}



}


@media only screen and (max-width:480px) {

.alignleft {
    float: inherit !important;
    margin: 0px 0px 0px 0px !important;
}

.nyttanoje-single h1 {
    font-size: 2.8rem; font-size: 28px;
}

	.widget-area-header h1 {
		font-size: 3rem; font-size: 30px;
		/*margin-bottom: 0px;
		padding-bottom: 0px;*/
		line-height: 36px;
	}
	.widget-area-header > .textwidget {
		font-size: 1.6rem; font-size: 16px;
		margin-bottom: 40px;
	}

/* startpage */
.nyttanoje-erbjudande {
 	width: 100%;
	margin-right: 2%;
	margin-left: 2%;
	margin-bottom: 6%;
	border: 1px solid #ececec;
}

ul.footer-area-1-bullet {
    display: none !important;
}

}


@media only screen and (max-width:320px) {

.alignleft {
    float: inherit;
    margin: 0px 0px 0px 0px;
}

ul.footer-area-1-bullet {
    display: none !important;
}
.list-categories ul {
	padding: inherit;
}
}


/*------------------------------------*\
	MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}



/*------------------------------------*\
	WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}



/*------------------------------------*\
	PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}



/*------------------------------------*\
	MOBILE MENU
\*------------------------------------*/

/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100%;
    width: 0;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(255,255,255); /* Black fallback color */
    /*background-color: rgba(25,255,255, 0.9);*/ /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 4%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
    padding: 0 8px 0 8px;
    text-decoration: none;
    font-size: 26px;
    /*color: #ffffff !important;*/
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
    /*color: #a4c407 !important;*/
}

/* Position the close button (top right corner) */
.overlay .closebtn {
    position: absolute;
    top: 0px;
    right: 15px;
    font-size: 60px;
}

.overlay-content > ul > li {
    float: inherit;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
        font-size: 40px;
        top: 0px;
        right: 15px;
    }
}