@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
@font-face {
	font-family: 'Berlin Sans FB';
	font-style: normal;font-weight: normal;
	src: local('Berlin Sans FB'), url('BRLNSR.woff') format('woff');
}
/*

@font-face {
font-family: 'Berlin Sans FB Bold';
font-style: normal;
font-weight: normal;
src: local('Berlin Sans FB Bold'), url('BRLNSB.woff') format('woff');
} */
body, input, select, textarea {font-family: 'Raleway', sans-serif;}
* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	box-sizing: border-box;
}
::-webkit-scrollbar {width: 14px;height: 14px;background-clip: padding-box;}
::-webkit-scrollbar-thumb {height: 6px;border: 4px solid rgba(0, 0, 0, 0);background-clip: padding-box;-webkit-border-radius: 7px;background-color: #433937;}
::-webkit-scrollbar-button {width: 0;height: 0;display: none;}
::-webkit-scrollbar-corner {background-color: transparent;}
::-webkit-input-placeholder {color: #aaa;}
body {
	background: #f9f9f9;
	font-size: 16px;
	height: 100%;
	margin: 0px;
	padding: 0px;
	width: 100%;
	text-align: center;
	margin-top: 69px;
	line-height: 1.5em;
}
small {display: inherit;	line-height: 1em;}
h1 small {font-size: .6em;letter-spacing: -.5px;color: #ffee95;}
H1 {font-size: 2.4em;font-weight:normal;}
H4 {font-size: 16px;margin:0;margin-top:.25em;}
H2 {font-size: 20px;margin-top: 0em;margin-bottom: .4em;color: #224565;}
h1, h2, h3, h4, .title {font-family: 'Berlin Sans FB', sans-serif;}
.right {float: right;}
.left {float: left;}
.clear {clear: both;}
#main .homepage h1 {
	background-position: center;
	background-size: cover;
	height: 42vw;
	max-height: 300px;
	background-repeat: no-repeat;
	text-align: center;
	color: #ffffff;
	font-weight: bold;
	padding-top: 0px;
	line-height: 2em;
	font-size: 2em;
	text-shadow: -2px -3px 1px #0089ff, 3px 0px 1px #f00;
	margin: 0;
	margin-bottom: 0;
	margin-top: -16px;
	transition: 1s;
}

@media screen and (min-width:450px) {
	#main .homepage h1 {
		font-size: 3em;
	}
}

@media screen and (min-width:600px) {
	#main .homepage h1 {
		font-size: 4em;
	}
}

#main .homepage h1 small {
	font-size: .6em;
	font-weight: normal;
}

A {
	text-decoration: none;
	color: #1f3e83;
}

A:hover {
	text-decoration: none;
	color: #000;
}

#main H1 {
	background: #272828;
	margin: 0em;
	padding: 1em 1em;
	color: #f0f0f0;
	clear: left;
	line-height: 1em;
	letter-spacing: .05em;
  text-shadow: 0 2px 0 #000, 2px 4px 3px #0008;
	box-shadow: 0 -10px 10px -10px #000a inset;
}

#main .homepage h1 {
	background-position: center;
	background-size: cover;
	height: 42vw;
	max-height: 300px;
	background-repeat: no-repeat;
	text-align: center;
	color: #ffffff;
	font-weight: bold;
	padding-top: 0px;
	line-height: 2em;
	font-size: 2em;
	text-shadow: -2px -3px 1px #0089ff, 3px 0px 1px #f00;
	margin: 0;
	margin-bottom: 0;
	margin-top: -16px;
	transition: 1s;
}

@media screen and (min-width:450px) {
	#main .homepage h1 {
		font-size: 3em;
	}
}

@media screen and (min-width:600px) {
	#main .homepage h1 {
		font-size: 4em;
	}
}

#main .homepage h1 small {
	font-size: .6em;
	font-weight: normal;
}

.ww {
	width: 100%;
	max-width: 1000px;
	margin: auto;
	text-align: left;
}

#top {
	text-align: left;
	background-color: #181919;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 70px;
	box-shadow: 0px 1px 12px #0006;
	border-bottom: 1px solid #fff3;
	z-index: 200;
	padding: .25em .5em;
	background-image: url("../img/bgtop.png");
	background-position:left;
	background-size: cover;
}

#top .ww {
	text-align: center;
}

#top .ww .title {
	text-align: left;
}

#top .ww .title span {
	font-size: 1em;
	display: inline-block;
	padding-top: 20px;
	vertical-align: top;
	color: #fff;
	letter-spacing: 1px;
}

@media screen AND (max-width:360px) {
	#top .ww .title span {
		font-size: 1.2em;
		padding-top: 19px;
	}
}

@media screen AND (max-width:325px) {
	#top .ww .title span {
		font-size: 1em;
		padding-top: 22px;
	}
}

@media screen AND (max-width:300px) {
	#top .ww .title span {
		display: none;
	}
}

#top .ww .title IMG {
	margin-top: 5px;
}

#main {
	min-height: 72vh;
	padding: 0;
}

#bottom1 {
	color: #666;
	background-color: #EAECF5;
}

#bottom1 .ww {
	padding: 1em 0;
	text-align: center;
}

#bottom1 .ww IMG {
	width: 600px;
	height: 341px;
}

@media screen AND (orientation:portrait) {
	#bottom1 .ww IMG {
		width: 60vw;
    height: 34vw;
	}
}

#bottom2 {
	background-color: #333333;
	color: #fff;
	padding: 2em;
	text-align: left;
}

#bottom2 .group {
	padding: 10px;
	text-align: left;
	display: inline-block;
	vertical-align: top;
	width: 152px;
}

#bottom2 .mn_tit {
	color: #FFF;
	text-transform: uppercase;
	font-size: .8em;
	padding-bottom: 10px;
}

#bottom2 A {
	display: block;
	font-size: .75em;
	color: #cecece;
}

#bottom2 A:hover {
	text-decoration: underline;
	color: #fff;
}
#bottom2 center {
	font-size:.8em;
}
FORM {
	margin: 0;
	padding: 1em;
	display: block;
}

#footer form {
	margin: -1em;
}

FORM H1 {
	background: #EAECF5;
	margin: -1em;
	padding: 1em;
}

INPUT, TEXTAREA, SELECT {
	width: 100%;
	padding: .7em;
	margin: .1em;
	border: 1px solid #ebebeb;
	border-bottom: 2px solid #ebebeb;
	outline: none;
	background: #fff;
}

INPUT:focus, TEXTAREA:focus, SELECT:focus {
	border-bottom: 2px solid #6ad70c;
}

INPUT, SELECT, TEXTAREA {
	font-size: 1em;
	border-radius: 5px;
	height: 3em;
	box-shadow: 1px 3px 7px #0001;
}

TEXTAREA {
	font-size: 1em;
	resize: none;
	height: 10em;
}

@media screen AND (max-width:500px) {
	INPUT, SELECT {
		font-size: 1em;
	}
}

DIV.btns {
	text-align: right;
	min-height: 3em;
	margin: 0 .5em;
}
DIV.center a{
	width:auto;
}

DIV.btns A {
	padding: .5em;
	display: inline-block;
}
FORM#coin DIV.btns {
	text-align: right;
	min-height: 0;
}

DIV.topbtns {
	margin: -1.5em -1em 1em 0;
}

A.btn {
	border: 1px solid #eee;
	background-color: #fff;
	font-size: 1em;
	padding: .8em;
	margin: 1em 2px;
	color: #f60;
	width: 46%;
	display: inline-block;
	transition: .2s;
}

button.new-sw {
	position: fixed;
  bottom: 0;
  left: 0px;
  padding: 1.5em;
  background: #006691;
  color: #fff;
  display: none;
  border: 1px solid #727272;
  z-index: 201;
  width: 100%;
  cursor: pointer;
  box-shadow: 0 0px 10px #0004;
	line-height: 1.5em;
}

button.new-sw:hover {
	background: #f30;
}
#top .menu {
	float: right;
}

#top .ww .menu A {
	background-repeat: no-repeat;
  background-position: 50% 40%;
  background-size: 40%;
  height: 60px;
  width: 60px;
  opacity: .9;
  transition: .1s;
  display: inline-block;
  margin-right: 2px;
  font-size: .7em;
  line-height: 10em;
  letter-spacing: .01em;
  color: #000;
  font-family: 'Berlin Sans FB', sans-serif;
  text-shadow: 0 -1px 0 #fff;
	filter:invert(1);
}

@media screen and (max-width:340px) {
	#top .ww .menu A {
		font-size: .6em;
		width: 42px;
	}
}

#top .ww .menu A:hover {
	opacity: 1;
	background-size: 60%;
}

#top A.scan {
	background-image: url(../qrcode/cam2.png);
}

#top A.create {
	background-image: url(../img/create.png);
}

#top A.ach {
	background-image: url(../img/profile.png);
}

#top A.competition {
	background-image: url(../img/gara.png);
}

#top A.news {
	background-image: url(../img/news.png);
}

#top A.events {
	background-image: url('../img/events.png?1');
}

#top A.config {
	background-image: url(../img/gear.png);
}

#top A.qr {
	background-image: url(../img/checked.png);
}

#top A.btnlog {
	background-image: url(../img/log.png);
}

#main .menu {
	background-color: #EAECF5;
	border-radius: 1em;
	display: inline-block;
	margin: 5px 0 -10px 0;
	float: right;
	height: 28px;
}

#main .menu .tool {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 1em;
	color: #666;
	height: 28px;
}

#main .menu .tool:hover {
	background-color: #666;
	color: #fff;
	text-decoration: none;
}

#main .menu .tool:active {
	background-color: #333;
	color: #fff;
}

#main .menu INPUT {
	display: inline-block;
	width: 150px;
	vertical-align: middle;
	padding: 0;
}
.sharebtns img {
	width: 30px;
	padding: 1px;
	border: 0;
	box-shadow: 0;
	display: inline;
}

.sharebtns {
	text-align: left;
	display: inline-block;
	margin: 11px 0 0 0;
	width: 100%;
}

.sharebtns A {
	display: inline-block;
	vertical-align: text-bottom;
	height: 30px;
	padding: 0 !important;
}

.sharebtns .copytoclipboard IMG {
	width: 14px;
	height: 14px;
	vertical-align: inherit;
}

.sharebtns .copytoclipboard {
	height: 30px;
	border-radius: 20px;
	background-color: #bcdcff;
	color: #000;
	line-height: 30px;
	padding: 0 10px !important;
	transition: .2s;
	float: right;
	font-size: .8em;
}

.sharebtns .copytoclipboard:hover {
	background-color: #ff0;
}

.sharebtns .copytoclipboard:active {
	background-color: #0073b2;
	color: #4c75a3;
}

.sharebtns .copytoclipboard.done {
	background-color: #3bdd5d;
}

.sharebtns .close {
	height: 30px;
	width: 30px;
	border-radius: 20px;
	float: right;
	text-align: center;
	line-height: 30px;
	font-size: 1.5em;
	font-family: monospace;
}
div.success {
	margin: 4em 1em;
	padding: 3em;
	background: #FFF;
	border: 1px solid #cecece;
	box-shadow: 0 0px 5px #0003;
}

FORM.streampost .dragover {
	background: #cce7ffe6;
	padding: 2em 0;
	margin: 1em;
	border: 5px dashed #3b8acd;
	text-align: center;
	font-size: 1.5em;
	color: #0a3c67;
	height: 6em;
	margin-bottom: -7em;
	z-index: 1;
	position: relative;
	display: none;
}

FORM.streampost.is-dragover .dragover {
	display: block;
}

FORM.streampost INPUT[type='submit'] {
	font-size: .8em;
	float: right;
}

FORM.streampost INPUT[type='submit'].loading {
	background-color: #eee;
	cursor: default;
}

INPUT[type='submit'].error {
	background: #f00;
}

.stream {
	background: #f4f4f4;
}

FORM.streampost .radiofield {
	display: inline-block;
	width: auto;
	margin: 0 5px;
}

FORM.streampost .radiofield INPUT {
	display: inline-block;
	width: auto;
	margin: 0 5px;
}

FORM.streampost .radiofield LABEL {
	padding: 0;
}

FORM.streampost .type {
	background: #f4f4f4;
	margin: -1em;
	padding: 1em;
}

DIV.post {
	margin: 0 10px;
	padding: 10px;
	margin-bottom: .5em;
	border-bottom: 1px solid #ddd;
	background: #fff;
	text-align: left;
}

DIV.post H2 {
	font-size: 1em;
	font-weight: bold;
}

DIV.post .timeago {
	font-size: .8em;
	float: right;
}

DIV.post .author, DIV.groupa .author {
	font-size: .8em;
	text-align: right;
	color: #b34a4a;
	display: inline-block;
}

DIV.logs .author {
	font-size: .8em;
	text-align: right;
	color: #b34a4a;
}

DIV.post .target {
	font-size: .8em;
	color: #666;
	display: inline-block;
	margin-right: 10px;
}


DIV.post .msg {
	overflow: auto;
	text-align: justify;
}

.hidemore {
	overflow: hidden !important;
}

.youtubepreview {
	margin: 10px -10px 0 -10px;
}

.post .youtubepreview.full {
	min-height: 315px;
	background: #000;
}

.youtubepreview IMG {
	width: 150px;
	margin-top: 10px;
}

.preview IMG {
	height: 178px;
	transition: .3s;
	margin: .5px;
	border-radius: 7px;
}

.preview IMG.uploading {
	opacity: .3;
}

.post .preview {
	max-height: 60vh;
	overflow: auto;
}

@media screen AND (orientation:portrait) {
	.post .preview {
		max-height: 210px;
		overflow: auto;
		white-space: nowrap;
	}
}

.post.maxw .preview {
	max-height: none;
}

.post .preview .th {
	padding: .5px;
	display: inline-block;
	text-align: center;
}

.post .preview .th.toload {
	width: 30%;
	height: 100px;
}

.post .preview .th IMG {
	cursor: pointer;
	transition: none;
	border-radius: 6px;
}

.post .preview .th:hover IMG {
	box-shadow: 0 0 0 1px #000;
}

.fullscreen-bg {
	position: fixed;
	top: 48px;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -100;
	text-align: center;
}

.th.fullscreen {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	background: #000000f0;
	padding-top: 2.5vw !important;
	overflow: auto;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.th.fullscreen>IMG {
	opacity: 0;
	/* width:95%;
  height:auto;
  border-radius:0!important; */
}

/* .th.fullscreen.portrait {
  padding-top: 2.5vh!important;
} */
/*.post .preview .th:-webkit-full-screen, .post .preview .th:-moz-full-screen, .post .preview .th:-ms-fullscreen, */
/* .post .preview .th:fullscreen {
  background-color: #000C;
  overflow:auto;
} */
/* :-webkit-full-screen, :-moz-full-screen, :-ms-fullscreen, :fullscreen
.post .preview .th:-webkit-full-screen IMG, .post .preview .th:-moz-full-screen IMG, .post .preview .th:-ms-fullscreen IMG,  */
/* .post .preview .th:fullscreen IMG {
  height:90vh;
  width:auto;
  border-radius: 0;
  box-shadow:none;
  margin-top:5vh;
  cursor:default;
} */
/* .post .preview .th.fullscreen.fullwidth IMG{
  margin-top:6vh;
  width:96vw;
  height: auto;
} */
.post .preview .th A {
	display: none;
}

/* .post .preview .th:fullscreen A {
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  padding: .4em 0;
  font-size: 4vh;
  font-weight: bold;
  z-index: 1000;
  font-family: monospace;
  color: #000;
  background: #fff3;
  height: 4vh;
  line-height: 1vh;
  width: 5vh;
  text-align: center;
  margin: 0.5vh;
  width: 5vh;
}
.post .preview .th:fullscreen A:hover {
  background: #fff;
}
.post .preview .th:fullscreen A.btnleft {
  top:50%;
  right:auto;
  left:0%;
}*/
.post .preview .th:first-child A.btnleft {
	display: none;
}

.post .preview .th:last-child A.btnright {
	display: none;
}

/* .post .preview .th:fullscreen A.btnright {
  top:50%;
  right:0%;
} */
.btnattachimg {
	text-align: left;
	float: left;
	padding: .1em .5em;
	border: 5px solid #fff0;
	color: #5c97c2;
	font-size: .8em;
	min-height: 3em;
}

.btnattachimg.is-dragover {
	border: 5px dashed #3b8acd;
	box-shadow: 0px 0px 0px 1em #ffffffdb;
}

FORM.streampost .dragover {
	background: #cce7ffe6;
	padding: 2em 0;
	margin: 1em;
	border: 5px dashed #3b8acd;
	text-align: center;
	font-size: 1.5em;
	color: #0a3c67;
	height: 6em;
	margin-bottom: -7em;
	z-index: 1;
	position: relative;
	display: none;
}

FORM.streampost.is-dragover .dragover {
	display: block;
}

FORM.streampost INPUT[type='submit'] {
	font-size: .8em;
	float: right;
}

FORM.streampost INPUT[type='submit'].loading {
	background-color: #eee;
	cursor: default;
}

.preview {
	white-space: nowrap;
	overflow: auto;
	text-align: left;
}
.preview.full {
	white-space: inherit;
}
.preview A.btndelete {
	position: relative;
	width: 25px;
	height: 25px;
	text-align: center;
	border-radius: 50%;
	border: 2px solid #fff;
	line-height: 19px;
	font-size: 17px;
	font-weight: bold;
	font-family: monospace;
	margin: 1px;
	margin-left: -25px;
	background: #fffa;
	color: #a00;
	transition: .3s;
	text-shadow: 0 -1px 0px #0008;
	padding-left: 1px;
	display: inline-block;
	box-shadow: 0px 0px 3px #000;
	vertical-align: top;
}

.preview A.btndelete:hover {
	border-radius: 10%;
	background: #fff;
}

.preview .uploadingbar {
	position: relative;
	height: 2px;
	background: #666;
	box-shadow: 0px 0px 0px 1px #fff;
	transition: .3s;
	top: 95px;
}

.preview .imgpreview {
	display: inline-block;
}

.post .preview .th.fullscreen A {
	display: block;
	position: fixed;
	top: 90%;
	right: 0;
	font-size: 2.4em;
	font-weight: bold;
	z-index: 1000;
	font-family: monospace;
	color: #000;
	background: #fff8;
	line-height: 1em;
	text-align: center;
	margin: 0.5vh;
	height: 1em;
	width: 1em;
	border-radius: 50%;
}

.post .preview .th.fullscreen A:hover {
	background: #fff;
}

.post .preview .th.fullscreen A.btnclose {
	display: none;
	right: auto;
	left: 50%;
	margin-left: -.5em;
}

.post .preview .th.fullscreen A.btnleft {
	top: 85%;
	right: auto;
	left: 5%;
}

.post .preview .th.first-child A.btnleft {
	display: none;
}

.post .preview .th.last-child A.btnright {
	display: none;
}

.post .preview .th.fullscreen A.btnright {
	top: 85%;
	right: 5%;
}
.pagewallet {
	text-align: center;
}

.pagewallet H3 {
	margin-top: 0em;
	text-align: right;
	padding: 0 1em;
}

a.role {
	text-align: center;
}

a.el {
	text-align: left;
	display: block;
	transition: background .3s;
}
a.el:hover {
	background-color: #ffffba;
}
a.el:active {
	background-color: #2a3d57;
	color:#fff;
}

.el .roles .group {
	display: inline-block;
	margin: 0;
}

.el .name {
	padding: .25em 1em;
	display: inline-block;
	margin-right: 3em;
}

.el .roles {
	display: inline-block;
	text-align: center;
	float: right;
}

.el .roles h2 {
	display: none;
}

.el .roles .role {
	width: 4em;
	margin: 0 3px;
	font-size: .6em;
	padding-top: 1em;
	margin-bottom: -.5em;
}

.el .roles .role img {
	height: 15px;
}

a.role.disabled {
	background: transparent !important;
	color: #666;
}

.roles h2 {
	margin-top: 1em;
}

.roles .role {
	display: inline-block;
	font-size: .8em;
	width: 5.5em;
	vertical-align: top;
}

.roles .role label {
	min-height: 3em;
	line-height: 1em;
	white-space: break-spaces;
}

.roles .role img {
	height: 2em;
	display: block;
	margin: auto;
	filter: opacity(0.3) grayscale(1);
}

.roles .role.active img {
	filter: none;
}


.post .innerlink {
	border-left: 6px solid #fb672e;
	width: auto;
	display: inline-block;
	padding: 1em;
	background: #f4f4f4;
	border-radius: 6px;
	color: #666;
}

.err, .error {
	text-align: center;
	font-weight: bold;
	color: #800;
	padding: 1em;
}

.post .msg p {
	padding: 0;
	margin: .5em 0;
	line-height: 1.5em;
}

.post.maxw h2 {
	font-size: 2em;
}

.banner {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	height: 30em;
}
@media screen and (max-width:1000px) {.banner {height: 46vw;}}

.intro {
	text-align: center;
}

.intro div {
	text-align: justify;
}

.boxes {
	text-align: center;
}

.boxes p {
	margin: 0;
	padding: 0;
}

.boxes .box {
	margin: 1px;
	padding: 1em;
	background-color: #fff;
	min-height: 18em;
}
.box img.map {
	max-width: 10em;
	float: left;
	margin-right: 1em;
	margin-top: .5em;
}
@media screen and (min-width:900px) {
	.boxes .box {
		display: inline-block;
		vertical-align: top;
		width: 50%;
		margin:0px -2px;
		min-height: 16em;
	}
}

.intro h2 {
	margin: 0 0 .2em;
}
.pagewallet {
	text-align: center;
}

.pagewallet H3 {
	margin-top: 0em;
	text-align: right;
	padding: 0 1em;
}
#footer .user {
	text-align:center;
	padding-bottom:2em;
}
.roles a.btn {
	width: auto;
	margin: 1px;
}

A.btn.back {
	background-color: #cecece;
	color: #000;
}

A.btn.active {
	background-color: #71bf44;
	color: #fff;
}

A.btn:hover {
	border: 1px solid #fff;
	color: #fff;
	background-color: #338a02;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, .2);
}

A.btn:hover SPAN {
	color: #fff;
}

A.btn:active {
	border: 1px solid #003;
	background-color: #005196;
	color: #fff;
}

INPUT[type='submit'], INPUT[type='reset'], .btns .btn {
	background: #2976ba;
	color: #fff;
	border: 1px solid #ddd;
	cursor: pointer;
	width: auto;
	display: inline-block;
	padding: .5em 1.5em;
	transition: background-color .2s;
}
#toasts .btns .btn {
	background: #fff;
	color: #f60;
}
INPUT[type='reset'] {
	background: #ddd;
}

INPUT[type='submit'], A.submit {
	background: #3179b4;
	color: #fff;
	float: right;
	margin-top: .5em;
	padding: 9px 2em !important;
}

INPUT[type='submit']:hover, INPUT[type='reset']:hover {
	background: #ffffd0;
	color: #000;
}

INPUT[type='submit']:active {
	background: #58b0f9;
	color: #fff;
}

input[type="checkbox"] {
	display: none;
}

input[type="checkbox"]+label {
	cursor: pointer;
	margin: 1em 0;
	padding: .5em .75em;
	display: inline-block;
	background-color: #eee;
	border-radius: 4px;
	border: 2px solid #FFF;
	color: #999;
	transition: .5s;
}

input[type="checkbox"]:hover+label {
	background-color: #FFF;
	color: #000;
}

input[type="checkbox"]:checked+label {
	color: #000;
	background-color: #bff5b9;
}

input[type="checkbox"]+label span {
	display: inline-block;
	width: 19px;
	height: 19px;
	margin: -2px 10px 0 0;
	vertical-align: middle;
	background: url(../img/check_radio_sheet.png) left top no-repeat;
	transition: background .3s;
}

input[type="checkbox"]:checked+label span {
	background: url(../img/check_radio_sheet.png) -19px top no-repeat;
}

LABEL {
	padding-top: 0.3em;
	display: inline-block;
	line-height: 1em;
	font-size: .8em;
}

.chklist LABEL {
	display: block !important;
	margin: 0 !important;
}

DIV.result {
	padding: 1em;
}

FORM H2 {
	margin-left: .7em;
}

DIV.loading {
	margin: 1em;
	padding: 1em;
	text-align: center;
	font-size: 1.2em;
	color: #AAA;
}

DIV.toast {
	position: fixed;
	top: 3em;
	margin: auto;
	left: 10%;
	background-color: #b65555;
	padding: 1em;
	right: 10%;
	color: #fff;
}

DIV.evid {
	font-size: 1.6em;
	padding: 1em;
	text-align: center;
}

DIV.evid2 {
	font-size: 1.3em;
	padding: 1em;
	text-align: center;
	color: #666;
}

SPAN.evid {
	color: #c09d20;
}

#toasts {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 400;
}

#toasts>DIV {
	background: #404348;
	padding: 1em 2em;
	color: #fdfdfd;
	box-shadow: 0px 0px 0px 6px #fff;
}

#toasts>DIV H4 {
	font-size: 1.3em;
	margin-bottom:1em;
}

#toasts>DIV H4 SMALL {
	font-weight: normal;
}

.disabled {
	pointer-events: none;
	background: #eeeeee !important;
}

.break {
	word-break: break-all;
}

.list .el {
	padding: .5em 1em;
	margin: 1px -1em;
	background: #EAECF5;
}
.list .el:hover {background: #224565;color:#fff;}
.list .el .location {
	color: #224565;
	font-weight: bold;
}

.list .el .descr {
	color: #444;
	font-size: .9em;
}

.title A {
	display: inline-block;
	transition: .3s;
  padding: 0 8px;
}

.title A:hover {
	background-color: #ffffff38;
}
.bigbtns {
	padding:1em;
}
.bigbtns A {
	display: inline-block;
	padding: 0;
	border-radius: 10px;
	width: 8em;
	margin: 1em;
	background: #f1f1f1;
	color: #404348;
	text-decoration: none;
	vertical-align: top;
	padding:1em;
	min-width: 33%;
}
@media screen and (max-width:500px) {
	.bigbtns A {
		width:90%;
		display: block;
	}
}
@media screen and (max-width:800px) {
	.bigbtns {
		text-align:center;
	}
	.bigbtns A {
		text-align:left;
		width:44%;
	}
}

.bigbtns A.btn:hover * {
	background-color: ##2a3d57;
	color: #FFF;
}

.bigbtns A:active {
	background-color: #71bf44;
}

.bigbtns A .label {
	font-size: 1em;
	margin-top: -.4em;
}
.dog .group {
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	line-height: .8em;
}

.dog .group .ach {
	white-space: normal;
}

A.user small.dogs {
	white-space: nowrap;
	max-width: 100px;
	overflow: hidden;
	vertical-align: text-top;
	font-size: .7em;
	color: #b60050;
}

.btn.profile {
	width: 18em;
	height: 15em;
	padding-top: 5.5em;
	border-radius: 0 0 30% 30%;
	font-size: 1.2em;
	margin: -5em;
	background: #bea267;
	color: #272828;
	background-image: url("../img/bgtop.png?1");
	background-position: 90% 100%;
	background-size: 150% 40%;
	background-repeat: no-repeat;
}
.floatingleft .qr img {
	max-width: 42%;
	box-shadow: #e7cd95 0px 0px 0px 4px;
	border-radius: 3px;
}
.btn.profile label {
	font-size: .6em;
	pointer-events: none;
}
.btn.profile small {
	line-height: 1.8em;
	background: #f4f4f4;
	color: #666;
	padding: .25em 1em;
	border-radius: 4px;
	margin-top: 1em;
}

.searchresult {
	text-align: center;
}

.searchresult a.el {
	background: #fff;
	display: block;
	margin-bottom: 2px;
}

.fieldbtnuser {
	display: inline-block;
	background-image: url(../img/profile.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40%;
	height: 3em;
	width: 3em;
	float: right;
	transition: .1s;
	margin-top: -3em;
	z-index: 1;
	position: relative;
}
.divcurrency, .divprofile, .divrole, .divprojects {
    padding: 1em 0;
}
.btn.profile {pointer-events: none;}
@media screen AND (orientation:landscape) and (min-width:600px) {
	.floatingleft {
		vertical-align: top;
		display: inline-block;
		width: 30%;
	}

	.floatingright {
		vertical-align: top;
		display: inline-block;
		width: 70%;
	}

	.floatingleft .qr IMG {
		max-width: 90%;
	}
}
@media screen AND (orientation:landscape) and (min-width:1000px) {
	.floatingleft {
		position: relative;
		left: -40px;
	}
}
@media screen AND (orientation:landscape) and (min-width:1300px) {
	.floatingleft {
		left: -120px;
	}
}

.menuconfig .btns {
	min-height: auto;
	margin: 0;
}

.menuconfig .btns a {
	margin-bottom: 0;
	display: inline-block;
	border: 1px solid #f4f4f4;
	border-radius: 3px;
	background: #0077cb;
	color: #fff;
	min-width: 6em;
	font-size: .8em;
	text-align: center;
  padding: .25em .5em;
}

.menuconfig .btns a:hover {
	background: #31aaff;
}

.menuconfig {
	text-align: center;
}

.menuconfig h1 {
	text-align: left;
}

.menuconfig p {
	height: 3em;
	overflow: auto;
	padding: 0;
}

.menuconfig .el {
	text-align: left;
	vertical-align: top;
	background: #fff;
	border-radius: 4px;
	margin: 1px;
	padding: .5em;
}
@media screen and (min-width:600px) {
	.menuconfig .el {
		width:330px;
		display: inline-block;
	}
}
DIV.divoptions {
	margin: .3em;
	max-height: 260px;
	overflow-y: auto;
	text-align: center;
	min-height: 50px;
}

DIV.divoptions>A {
	margin: .5%;
	height: 100px;
	padding: 1em 0;
	display: inline-block;
	font-size: .6em;
	width: 49%;
	text-align: center;
	vertical-align: top;
	word-break: break-word;
	white-space: initial;
	background-color: #FFF;
	background-size: auto 78%;
	background-repeat: no-repeat;
	background-position: bottom;
	color: #444;
}

DIV.dog, .btndog {
	padding: 1em;
	background: #fff;
	margin:.2em;
	display:block;
}

DIV.dog.genre_M, .btndog.genre_M {
	border-left: 10px solid #149ff8;
}

DIV.dog.genre_F, .btndog.genre_F {
	border-left: 10px solid #fc7ae9;
}
.btndog .age {
	font-size: .75em;
	line-height: 1em;
}
DIV.dog .descr {
	font-size: .8em;
	color: #666;
}

#main .dog h1 {
	margin: -2em -.5em;
}

.maxw.dog .descr {
	color: #fff;
}
.adminbtnsinvite {
	text-align: center;
}

.adminbtnsinvite a {
	width: 14.5em;
	font-size: .7em;
	margin: 0;
	margin-top: 1em;
	background: transparent;
	border: 1px solid transparent;
}

.adminbtnsinvite a img {
	display: block;
	margin: auto;
}
A.remove {
	background-color: #800;
	color:#fff;
	width: auto;
}
.newdog form h1 {

}
.result .field {
	padding:.25em 0;
}
.result .field label{
	display:block;
	color:#666;
}
.dogs .dog h2, .dogs .btndog h2 {
	font-size:1.2em;
	text-align: left;
}
.dogs {text-align:left;}
.btndog:hover {
	background: #2976ba;
	color: #fff;
}
.btndog:hover * {
	color: #fff;
}
.patina {
	background: #0003;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 299;
}

#footer, #modal {
	z-index: 300;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #fff;
	color: #000;
	box-shadow: 0px 1px 10px #00000075, 0px 8px 0px -3px inset #1b1b1c;
	padding: 1em;
	padding-bottom: 0;
	max-height: 94vh;
	overflow: auto;
}
#modal {
	max-height:inherit;
	top:0;
	box-shadow: none;
	padding:0;
	overflow: hidden;
}
#footer .content {
	max-height: 65vh;
	overflow: auto;
	margin: 0 -1em;
	padding: 0 1em;
	min-height: 20vh;
}
#footer .content h2 {
	margin-top:1em;
}


#footer .btnclose {
  padding: .5em 1em;
  margin-top: -1em;
  display: inline-block;
  z-index: 9999;
}
.center {text-align: center;}
a.user {
	padding: .5em 0;
	display: block;
	border-bottom: 1px solid #ddd;
	border-left:3px solid #666;
	padding-left:.75em;
}
a.user h2 {font-size:1em;margin:0;}
.dogs h3 {padding-left:1em;}
.user > .roles, .user > .creation, .user > .asd {padding:0 1em;}
.roles h2 {font-size:1em;}
.qrcontainer {
	display: block;
}
.qrcontainer.mini {
	padding:5px;
	width: 50px;
	float:left;
	font-size:.5em;
	font-weight:bold;
	background-color: #f4f4f4;
	border-radius:4px;
	margin-right:1em;
}
.tre.btns a {

}
.btn.mini {
	font-size: .8em;
	margin: 1px;
	padding: .2em 1em;
	line-height: 1.25em;
}
.dogs .btndog .ach {font-size:.8em;font-weight:bold;}
.el {color:#5f5f5f;border-bottom:1px solid #ddd;padding:.25em 0;}
.el.active {color:#0067c3;}
@media screen and (min-width:950px) {
	.tre .el {
		vertical-align: top;
		display: inline-block;
		width: 33.333%;
		min-height: 118px;
		padding: 1em;
	}
	.tre .el .btns {margin:0;min-height: 0;}
}
div.info {
	padding:2em;
}
.pagewallet .asd, .user > .asd {
	background: #efe9e9;
	padding: 1em;
	border-radius: 10px;
	margin: 0 1em;
	text-align: center;
}
.user > .asd {
	margin-top:1em;
}
.user > .asd h3 {
	margin:0;
}
A.asd {display:block;color:#000;}
.users .el {
	background: #fff;
	display: block;
	margin-bottom: 2px;
	padding:.5em;
}
.users .el .orderid{
	font-size: 1.5em;
  color: #2976ba;
  display: inline-block;
  width: 1.2em;
}
.timer {
	text-align: center;
	font-size: 3.5em;
	line-height: 1em;
	color: #6a0000;
	font-family: monospace;
}
.timer.disabled {
	color: #555;
}
.action {display:inline-block;width:100%;}
.action small {line-height: .9em;font-size:.8em;}
.action .c1, .action .c2 {display: inline-block;width:35%;vertical-align: top;}
.action .c2 {width:65%;padding-left:.2em;padding-top: 0.2em;max-height: 2.3em;overflow: hidden;transition:.2s;}
.action .c2.full {max-height: none;overflow: hidden;font-size:1.2em;}
.action .btns {min-height: auto;}
.action .c1 .btn {
	font-family: 'Berlin Sans FB', sans-serif;
	width: auto;margin:0;text-align:center;
	padding: .4em .5em;
	width:100%;
	font-size: 1em;
  text-align: left;
	white-space: nowrap;
	box-shadow: inset 3px 0;
}
.allactions.mini .action {
	width:33%;
}
.allactions.mini .action .c1 {
	width:100%;
}
.allactions.mini .action .c2 {
	display:none;
}
.action .btn .val{font-size: .7em;float: right;color:#888;}
.exclusion .action .btn {color: #f00;}
.abort .action .btn {color: #800;}
.zero .action .btn {color: #cc6b00;}
.malus .action .btn {color: #9f0082;height: 3em;font-size: 1.2em;}
.bonus .action .btn {color: #080;}
.users .el .events {
	margin-top:.5em;
}
.minimenu {
	padding: 0 0.6em;
	background: #f4f4f4;
	border-radius: 50%;
	margin: 3px;
	margin-bottom: -1em;
	background: #5b5b5b;
	color: #fff!important;
}
.users .el .events .event {
	padding:.1em .5em;
	border-radius:4px;
	background: #f4f4f4;
	font-size:.8em;
	font-weight:bold;
	display:inline-block;
	border-left: 6px solid #9f0082;
  margin-right: 0.5em;
  padding-left: 4px;
}
.event.zero {border-left-color:#cc6b00!important;}
.event.abort {border-left-color:#800!important;}
.event.exclusion {border-left-color:#f00!important;}
.allactions h4 {font-size:.8em;}
#modal .eventscont, #modal .allactions, #modal .result {
	overflow:auto;
	height: 100%;
	padding-bottom: 32px;
}
#modal h1 {
	background: #eee;
}
#modal h1, #modal h2, #modal .timer {
	height: 1.6em;
	font-size: 1em;
	margin: 0;
	overflow: hidden;
	padding: .2em;
}
#modal .timer {
	height: 2em;
	font-size: 2em;
	height:1.5em;
	text-align:left;
	background: #ffffaa;
}
#modal .timer .time .ms{
	display: inline-block;
	font-size:.5em;
	color:#888;
}
#modal .btns .btn {
	font-size: 1em;
	margin: .5em .25em;
	overflow: hidden;
	padding: .5em;
}
#modal .btns {
	height: 2.5em;
	min-height:auto;
	margin: 0;
	padding: 0;
}
#modal .content {
	position: fixed;
	top: 2.5em;
	bottom: 49px;
  width: 100%;
}
#modal hr {
	 margin: 0.5vh;
}
#modal .tabs {
	margin-top: 35px;
	margin-bottom: 0.1em;
  background: #eee;
}
#modal .tabs .btn {
	background: #eeeeee;
	color:#999;
	border:1px solid #0000;
	box-shadow:0;
	width:33.333%;
	margin:0;
	margin-bottom: 0vh;
	border-bottom: 1px solid #888;
	padding: 1vh 0;
	transition:0;
}
#modal .tabs .btn:hover {
	box-shadow: none;
	color:#2976ba;
}
#modal .tabs .btn.active {
	background: #fff;
	color: #000;
	box-shadow: none;
	border: 1px solid #888;
	border-bottom: 0;
	border-radius: 6px 6px 0 0;
}
#modal .events > div {
	padding:.75em 1em;
	border-bottom:1px solid #eee;
}
#modal .allactions .actions {
	padding:.25em;
	padding-right:0;
}
#modal .allactions h3 {
	text-align: center;
	margin: 0;
	font-size:1em;
	color:#891a1a;
}
/* #modal .actions .btns {
	height:auto;
} */

#modal .actions .btns .btn {
	font-size: .8em;
  margin: .1em;
  overflow: hidden;
  padding: .5em 1em;
	min-width: 9.5em;
}
.totals .points {
	font-size: 3em;
	text-align: center;
}
.btn.undo {
	background: #777;
}
.users .el .right {
	line-height: .7em;
  text-align: right;
}
#toasts a{color:#f60;}
span.dt {
	font-size:.8em;
}
a.elbtn {
	margin-right: 0.25em;
  width: 1.5em;
  display: inline-block;
  background: #c10000;
  text-align: center;
  aspect-ratio: 1;
  border-radius: 50%;
  color: #fff;
  font-weight: bold;
}
.preview .field {
	display:inline-block;
	padding-right:1em;
	vertical-align: top;
}
.preview .field label{
	color:#959595;
	font-size:.8em;
}
.preview .field .val{
	margin-top: -0.5em;
}
A.more:before {
	content:'▶ ';
}
A.more.active:before {
	content:'▼ ';
}
a.btn.remove {
	background: #800;
}
h1 a.btndir {
	color: #FFF;
  margin: 0 0.5em;
  padding: 1em 0;
}
.list a.el {display:block;padding:.75em;}
.testinfo {
	padding: 0.5em;
	background: #f0f0f0;
	border-radius: 7px;
}
.calendar {
	padding:1em;
}
.half {
	display: inline-block;
	width:50%;
	vertical-align: top;
}
.eventslevels label{
	padding: 1em!important;
	margin: 0!important;
	width: 100%;
	font-size:1.2em;
	white-space: nowrap;
	overflow:hidden;
}
#form_dog .eventslevels label {
	padding:1em .5em!important;
	font-size:.9em;
}
.btn.confirm {
	background-color: #080;
}
a.delete {
	color:#f00;
}
form.human form.dog {
	padding:0;
}
.errs ul li {
	color:#800;
	font-weight:bold;
}
.preview.subs .field{
	width: 10em;
	overflow: hidden;
	border-left: 1px solid #aaa;
	padding-left: 4px;
}
span.rotate {
	transform:rotate(90deg);
}
a.expand {
	padding:.5em;
	display:block;
}
.transition {transition: .35s;}
.preview.subs input {
	display: inline-block;
	width: 1.7em;
	height: 1.7em;
	margin: 0.6em 0.5em 0 0;
}
.calendar .list .el .mine {
	color:#0073cb;
	font-size:.8em;
}
.half label {
	overflow: hidden;
	height: 1.3em;
	line-height: 1.1em;
	white-space: nowrap;
	padding: 0;
	margin-bottom: -0.7em;
}
.preview.subs {
  margin-left: -0.5em;
}
.preview.subs > div {
	padding-left:.5em;
}
.preview.subs .approved, .preview.subs .approved > div {
	background-color: #bcdebc;
}
.preview.subs .approved img {
	height: 1.5em;
	border-radius: 0;
	margin: 0.5em 6px;
}
.btn.type {
	padding: 0.5em 10px;
	margin: 0;
	text-transform: lowercase;
	text-align: left;
	overflow: hidden;
}
#footer .users .btns {
	margin:1em -1em 2em;
}
.users .el .club {
	margin-left: 2em;
  color: #3c52c0;
  font-size: .9em;
}
a.movehere {
	display: block;
  line-height: 1px;
  margin: 0;
  padding: 1.3em 5px 10px;
}
a.movehere:hover {
	color:#f00;
}
a.movehere:hover hr{
	border-color:#f00;
}
a.movehere:before {
	content: '▶ ';
}
a.movehere hr {
	margin-top: -1px;
	margin-left: 15px;
  border-color: #800;
  border-style: dashed;
}
.reorder .name {
	padding-left: 4em;
	margin: -0.75em 0 -0.95em;
}
.list.reorder {
  font-size: .9em;
	border-top: 1px solid #aaa;
  margin-top: 1em;
  padding-top: 11px;
}
.actions.bonus h3 {margin:0;}
#modal .result .totals {
	position: fixed;
  bottom: 0;
  z-index: 99;
  background: #000;
  left: 0;
  right: 0;
  color: #fff;
}
.totals .points {
	font-size: 1.8em;
	text-align: left;
	padding: 0.6em 0.2em;
}
#modal .save {
	position: fixed;
	bottom: 0;
	z-index: 100;
	right: 0;
	margin: .25em;
}
#modal .save a{
	display: block;
	background: #005c00;
	color: #fff;
	margin: 0.5em;
	padding: 0.5em;
	border-radius: 5px;
}
#modal .save a:hover{background: #080;}
#modal .save a:active{background: #0a0;}
input:disabled {
	background:#eee;
	color:#555;
}
.clf .el.qualificato_01 {background:#eee;display:none1;}
.clf .el.p_0 {box-shadow: 8px 0 0 0 inset #d1d100, -8px 0 0 0 inset #d1d100;}
.clf .el.p_1 {box-shadow: 8px 0 0 0 inset #9e9e9e, -8px 0 0 0 inset #9e9e9e;}
.clf .el.p_2 {box-shadow: 8px 0 0 0 inset #d17100, -8px 0 0 0 inset #d17100;}
.clf .px {
	margin:0 0 0 .5em;float:right;
}
.clf .pos {
	font-weight:bold;color:#639be7;display:inline-block;float:left;vertical-align: top;
}
.clf .label {
	line-height: 1em;	margin-bottom: .25em;
}
.clf .notq {
	font-size:.8em;color:#f70;
}
.clf .name {
	margin:0 1em;display:inline-block;padding:0;max-width: 71%;
}
.clf .name .asd {
	font-weight:bold;
	font-size:.7em;
	margin-top: -0.8em;
	margin-bottom: -1em;
}
a.choice {
	margin: 1px 0.5em;
  padding: 0.2em 0.5em;
  display: inline-block;
}
a.choice.active {
	box-shadow: 0 -2px 0 0 inset #d17100;
}
#footer label {
	color: #82b6bc;
	margin-bottom: .5em;
	display: block;
	margin-top: -.5em;
	font-size: .75em;
}
.booklet {
	cursor:pointer;width:270px;height: 22em;box-shadow:3px 3px 5px #0007, 10px 0px 0 0px inset #dfce9c66, 2px 2px 0 0px inset #fff5, -2px -2px 0 0px inset #000;display: inline-block;border-radius:10px;background:#272828;margin:1em;color:#eee;padding:1em;
}
.booklet:hover {
	background: #111;
}
#footer .booklet_page {
	text-align:center;
}
#footer .booklet_page .field{
	min-width: 160px;
	display: inline-block;
	vertical-align: top;
}
#footer .booklet_page label {
	margin:1em 0 0;
}
#footer .booklet_page table {
	text-align:left;
}
#footer .booklet_page table tr:nth-child(even){
	background: #f4f4f4;
}
#footer .booklet_page table td {
	padding:6px;
	white-space: nowrap
}
#footer .booklet_page .campionato {
	overflow:hidden;white-space:nowrap;width:120px;
}
.human input:disabled, .human select:disabled {
	background: transparent;
	border:none;
	box-shadow: none;
	font-weight: bold;
	padding:0;
	padding-bottom:.7em;
	color:#023b6f;
	appearance: none;
}
.human .divdog > div {
	margin: 1em -1em;
	padding: 1em;
	padding-top:.5em;
	border: 1px solid #ccc;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 3px 5px #0003;
}
.boxtre {
	display:inline-block;text-align:center;padding:.2em .5em;background: #dfce9c;color: #000000;font-size: .8em;line-height: 1.2em;border-radius: 5px;margin:1px;
}