

.btn{
background:#369;
color:#FFF;
text-decoration:none;
font-size:120%;
display:inline-block;
margin-top:3px;
margin-bottom:3px;
text-shadow:0px 0px 5px rgba(0,0,0,0.1);
background: #374A54;
border-radius:2px;
margin-right:8px;
padding:8px;
}

.btn.small{
font-size:80%;
padding:4px;
}

.plus{
display:inline-block;

text-decoration:none;
background:green;
color:#FFF;

margin:4px;
border-radius:2px;
background: linear-gradient(135deg, rgba(143,200,0,1) 0%,rgba(82,155,0,1) 100%);
color:#FFF;
text-shadow:0px 0px 5px rgba(0,0,0,0.7);
}

.btn:hover{
text-shadow:0px 0px 5px rgba(0,0,0,0.7);
box-shadow:0px 0px 5px rgba(0,0,0,0.7);
background: #173E51;
}

.smalltrash{
text-decoration:none;
padding:3px;
background:#6d0019;
color:#FFF;
margin-top:10px;
opacity:0.5;
display:inline-block;
}

.smalltrash:hover{
opacity:1;
}.element{
background-color:rgba(0,0,0,0.1);
padding:10px;
background: linear-gradient(135deg, rgba(0,0,0,0.1	5) 0%,rgba(0,0,0,0.2) 100%);
transition:0.3s all;
margin-bottom:6px;
border-radius:4px;
}

a.element:hover{
background: linear-gradient(135deg, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.3) 100%);
box-shadow:0px 0px 6px rgba(255,255,255,0.1);
background: linear-gradient(135deg, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.7) 100%);
}textarea, input, select{
padding:7px;
border:0px solid #000;
box-shadow:0px 0px 5px rgba(0,0,0,0.5);
width:100%;
background:rgba(255,255,255,0.5);
}

input:focus, textarea:focus{
border:0px;
background:rgba(255,255,255,0.8);
box-shadow:0px 0px 5px rgba(255,255,255,0.2);
}

form{
width:95%;
max-width:500px;
}

input[type=checkbox]{
width:auto;
}

label{
display:block;
margin-bottom:10px;
margin-top:10px;

}

label strong{
display:block;
}

input[type=submit]{
background:#374A54;
margin-top:20px;
color:#FFF;
}

textarea{
height:200px;
}.lapp{
display:inline-block;
width:calc(100%);
margin:4px;
margin-bottom:10px;
color:#CCC;
max-width:560px;
vertical-align:top;
}

.lappDate{
font-size:70%;
color:#666;
}

.lappMeta{
font-size:120%;
color:#369;
}


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

}
#frontpage{
display:block;
width:100%;
text-align:center;
padding-top:100px;
}

.systittel{
font-size:150%;
}

.systittel>span{
display:block;
width:100%;
color:#FFF;
font-size:150%;
text-shadow:0px 0px 5px rgba(255,255,255,0.7);
}

.systittel>div{
position:relative;
top:-20px;
font-size:80%;
color:#666;
}

.systittel>span>span{
border-bottom:2px solid #666;
}

#frontpage>form{
display:inline-block;
}

#frontpage input{
font-size:140%;
padding:20px;
border-radius:1000px;
margin-bottom:10px;

}

#frontpage input:autofill{
background-color:rgba(0,0,0,0.4);
}

html{
}

body,html{
	background-color:rgb(40,40,40);
	color:rgb(170,170,170);
}

body,textarea,input,select{
	font-family: 'Armata', sans-serif;
	font-size:14px;
}

body{
padding-top:50px;

}

@media only screen and (min-width: 900px) {
body{
padding-top:0px;
}
}

#logut{

color:#666;;
padding:7px;
text-decoration:none;
}

#modulcontent{
display:block;
padding:20px;
padding-top:140px;
}

div,span,form,input,strong{
box-sizing:border-box;
}

@media only screen and (max-width: 900px) {
#modulcontent{
padding:10px;
position:absolute;
top:0px;
padding-top:60px;
width:95%;

}
}#sysmenu{
display:block;
top:0px;
left:0px;
z-index:100;
position:fixed;
width:100%;
text-align:center;
background-color:rgba(40,40,40,0.8);
min-height:43px;
z-index:50;

}


#bandTitle{
color:#CCC;
font-size:120%;
text-decoration:none;
background:#333;
padding:11px;
box-shadow:0px 0px 4px rgba(0,0,0,0.5);
right:0px;
position:fixed;
top:0px;
z-index:99;
}


#menuToggler{
display:block;
position:fixed;
left:0px;
top:0px;
border:0px solid #FFF;
font-size:120%;
padding:5px;
color:#FFF;
text-decoration:none;
z-index:99999;
width:70px;
height:70px;
}

#menuToggler>span{
display:block;
width:70%;
margin-left:10px;
height:3px;
border-radius:2px;
background-color:#CCC;
margin-top:10px;
position:relative;
top:0px;
transition:0.3s all;
}

.open #menuToggler>span:nth-child(1){
transform:rotate(45deg);
top:10px;
}

.open #menuToggler>span:nth-child(2){
transform:rotate(-45deg);
top:-0px;
}

#modulmenu{
display:block;
width:100%;
margin-top:43px;
}

#modulmenu a{
display:inline-block;
padding:20px;
max-width:130px;
text-decoration:none;
margin:0px;
vertical-align:top;

text-align:center;
width:49%;
border:1px solid rgba(0,0,0,0);

color:#FFF;
color:#999;
font-size:130%;
}

#modulmenu a:hover{
text-shadow:0px 0px 4px rgba(0,0,0,0.8);
}

#modulmenu a.current{
border-bottom:2px solid #374A54;
color:#CCC;
text-shadow:0px 0px 4px rgba(255,255,255,0.8);
}

#band.isband{
position:fixed;
top:100px;
width:80%;
position:absolute;
left:10%;
z-index:9999999;
}

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


#modulmenu{
width:100%;
padding:20px;
}

#modulmenu{
display:none
}

.open #modulmenu{
display:block;
background:rgba(40,40,40,1);
height:100vh;
overflow:auto;
position:fixed;
top:0px;
}

#modulmenu a{
width:100%;
max-width:100%;
font-size:180%;
}

#modulmenu a:hover{
color:rgba(255,255,255,0.9);
}

#modulmenu a.current{
background-color: #374A54;
}


}


@media only screen and (min-width: 900px) {
#modulmenu a{
border-bottom:2px solid #333;
margin-right:20px;
}
#modulmenu a:hover{
border-bottom:2px solid #FFF;
}

#menuToggler{
display:none;
}

#modulmenu a.current{
border-bottom:2px solid #374A54;
}

#bandTitle{
box-shadow:none;
}
}.note{
display:block;
width:100%;
padding:10px;
margin-bottom:15px;

box-shadow:0px 0px 5px rgba(255,255,255,0.8);
}

.note>span{
border-bottom:1px solid #333;
display:block;
text-align:right;
font-size:80%;
padding:5px;
}
.prompterZlist{
display:block;
width:100%;
}.sang{
display:block;
padding:15px;
color:#FFF;
margin-bottom:20px;
width:100%;
}
.sang>strong{
display:block;
margin-bottom:3px;
font-weight:normal;
color:#FFF;
font-size:130%;
padding:6px;
}

#songsearch{
font-size:150%;
background:rgba(255,255,255,0.1);
color:#FFF;
padding:10px;
}

#songsearch:focus{
outline:none;

}

.info{
padding:4px;
}


.info span{
border:1px solid #999;
padding:3px;
margin-right:5px;
display:inline-block;
vertical-align:top;
margin-bottom:5px;
color:#999;
font-size:90%;
}


@media only screen and (min-width: 900px) {
.sang>strong, .sang>div, .sang>span{
display:inline-block;
vertical-align:top;
width:30%;
margin-right:2%;
}
}.settlist{
display:inline-block;
padding:15px;
vertical-align:top;
margin:10px;
width:100%;
max-width:300px;
text-align:center;
}

.settlist>strong{
font-size:180%;
font-weight:normal;
display:block;
width:100%;
color:#FFF;
}

.settlist .btn{
min-width:28%;
text-align:center;
}

.addsong{
font-size:120%;
display:block;
padding:10px;
text-decoration:none;
color:#FFF;
background:rgba(255,255,255,0.1);
margin-bottom:10px;
transition:0.2s all;
padding-left:10px;
border-left:1px solid #CCC;
}

.addsong:hover{
box-shadow:0px 0px 5px rgba(255,255,255,0.7);
padding-left:15px;
border-left:8px solid #CCC;
}

.addsong.highlight{
background:#FFC700;
color:#000;
box-shadow:0px 0px 5px rgba(255,199,0,0.7);
}

.transferInfo{
display:inline-block;
padding:4px;
}

.transferInfo{
border:2px solid #666;
color:#666;
margin-right:4px;
}

.transferInfo1{
border:2px solid #C90407;
color:#C90407;
}

@media only screen and (max-width: 900px) {
.settlist{
width:calc(100% - 20px);
display:block;
max-width:100%;
}
}


.transferTrash{
background:#6D0019;
color:#FFF;
text-decoration:none;
padding:3px;
font-size:80%
display:inline-block;
}#slider{
display:block;
position:fixed;
top:0px;
right:0px;
max-width:600px;
width:100%;
z-index:9999;
background:rgba(0,0,0,0.98);
box-shadow:0px 0px 5px rgba(255,255,255,0.8);
padding:20px;
height:100vh;
overflow:auto;
z-index:10000000;
}a,div,span,select,input,textarea{
box-sizing:border-box;
}


#band.first{
font-size:200%;
width:90%;
max-width:90%;
margin-left:5%;
padding:10px;
margin-top:30vh;
}
#sysName{
width:100%;
text-align:center;
position:fixed;
top:0px;
left:0px;
pointer-events: none;
color:#FFF;
text-shadow:0px 0px 5px rgba(255,255,255,0.8);
font-size:180%;
z-index:999;
padding:6px;
display:block;
background-color:rgba(40,40,40,0);
box-shadow:0px 0px 10px rgba(0,0,0,0.2);
color:#666;
text-shadow:none;
}

#sysName>span:nth-child(1){
color:#374A54;
text-shadow:0px 0px 5px rgba(0,0,0,0.4);

}

#sysName>span:nth-child(2){
background-color:#374A54;
text-shadow:none;
position:relative;
display:inline-block;
padding-left:5px;
padding-right:5px;
margin-left:5px;
border-radius:2px;
color:#FFF;
}

@media only screen and (min-width: 900px) {
#sysName{
box-shadow:none;
}
}#zlcont{
list-style:none;
padding:0px;
margin:0px;
}

.zlistTitle>strong{
color:#FFF;
font-size:120%;
font-weight:normal;
margin-right:10px;
}

.zlistTitle{
display:block;
}

.instrIndi, .trxIndi{
color:#000;
padding:3px;
margin-right:3px;
display:inline-block;
font-size:100%;
min-width:20px;
text-align:center;

}

.trxIndi{
background:#a90329;
color:#FFF;
}

.songOnZ{
margin-top:4px;
margin-bottom:4px;
}

.zlistItemNr{
background:#333;
color:#999;
display:inline-block;
width:30px;
position:relative;
left:-7px;

padding:5px;
text-align:center;
}

.kolon{
display:none;
}

@media only screen and (min-width: 900px) {
.zlistTitle{
display:inline-block;
vertical-align:top;
width:400px;
padding-top:8px;
font-size:120%;
}


