@charset "utf-8";
/* CSS Document */
input.resp-nav, label.resp-nav { display:none; cursor:pointer; }

#wrapper { min-width:320px; }
@media screen and (max-width: 980px), screen and (max-device-width: 980px), screen and (max-width: 980px) {
	label.resp-nav { display:inline-block; color:transparent; 
		line-height:0px; height:40px; font-size:0px; width:40px; 
		background:url(../images/menu.png) center center no-repeat #0086ca;
		position: absolute;
		border-radius:3px;
		top:0px;
		right:0px;
	}
	ul.menu > li { display:block; }
	ul.menu > li::before {
		display: none;
	}
	ul.menu > li+li {
		margin-left: 0px;
		margin-top: 10px;
	}
	ul.menu { 
		visibility:hidden; 
		position:absolute; 
		opacity:0; 
		background:#fff; 
		top:40px; 
		padding:10px 20px !important; 
		width:auto !important; right:0px; 
		box-shadow:3px 3px 10px rgba(0,0,0,.35); 
		text-align: left;
		margin-top: 0;
	}
	ul.menu li.rent {
		float:none;
	}
	ul.menu li a { white-space:nowrap; display: inline-block; }
	ul.menu li.lang {
		margin-top: 10px;
		float:none;
	}
	input[class="resp-nav"]:checked ~ ul { visibility:visible; opacity:1; transition:all .3s; -webkit-transition:all .3s; }

	div.menu {
		position: fixed;
		z-index: 10;
		top:2%;
		right:4%
	}

	#header {
		padding:2% 4%;
	}
	#header div.c {
		padding:0px;
	}
	#logo {
		width:80%;
	}
	div.account-panel {
		position: relative;
		right:auto;
		margin-top: 10px;
		text-align: center;
	}

	/* boardgames */

	#filter > label {
		display: block;
	}
	#filter div.filters {
		display: none;
	}
	#filter > input:checked ~ div.filters {
		display: block;
	}
	#filter > input:checked + label {
		margin-bottom: 10px;
	}

	#holder.filter #filter {
    	float: none !important;
    	width:100%;
	}
	
	#boardgames {
		float:none !important;
		width:100% !important;
		margin-top: 20px;
	}
	div.p-settings {
		height: auto !important;
		border: none;
		margin-bottom: 25px;
		padding:10px 0px;
	}
	div.p-settings div.views {
		display: none !important;
	}
	div.p-settings form {
		float:none;
		height:auto;
	}
	div.p-settings form > div {
    	border-left:none;
	}
	div.p-settings form > div:first-child {
		border-bottom:1px solid #ccc;
	}
	#form-perpage, #form-orderby {
		width:100% !important;
	}
	
	div.p-settings form > div {
		display: block;
	}
	div.p-settings form select {
		width:100% !important;
		height: 30px !important;
		padding:0px !important;
	}
	div.p-settings form div.select {
		line-height: 30px;
		height: 30px;
		text-align: left;
		width:100% !important;
		padding:0px !important;
		padding-right:20px !important;
	}
	div.p-settings form div.select span {
		line-height: 30px;
	}
}

@media screen and (max-width: 600px), screen and (max-device-width: 600px), screen and (max-width: 600px) {
	div.block, div.settings {
		padding:0;
	}
	div.c {
		padding: 0px;
	}

	h2.lead {
		font-size: 36px;
	}


	div.plist span.title * {
		font-size:16px;
	}

	div.plist > div div.l::after {
		display: none;
	}

	* {
		font-size:14px;
		line-height: 20px;
	}
	div.text ul li::before {
		top:6px;
	}

	div.plist > div + div {
		margin-top: 20px;
	}

	div.text *, div.plist div.more > p {
		word-break: break-word;
		-moz-hyphens: auto;
		-webkit-hyphens: auto;
		hyphens: auto;
	}

	div.boardgames div.thumb {
		width:20%;
	}
	div.text-prev h2 * {
		font-size: 18px;
	}

	div.big-buttons > a {
		font-size:1.5em;
	}
	#rented-list1, #rented-list2, #rented-list3, #debts-list {
		overflow: auto;
	}

	div.rented thead {
		display: none;
	}

	div.rented tr {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding:10px 0;
	}
	div.rented tr + tr {
		border-top: 1px solid #ccc;
	}
	div.rented tr td {
		display: block;
		width:100%;
		border:none;
		padding:0;
	}
	div.rented tr td:last-child {
		position: absolute;
		right:0;
		top:50%;
		transform: translateY(-50%);
	}

	#form-member_id {
		display: block !important;
		opacity:1 !important;
	}

	#form_member_id_chosen {
		display: none !important;
	}

}