yavsc/web/App_Themes/style.css

body {
	background-color: black;
	color: #D0FFD0;
	font-family: 'Arial', cursive;
	padding: 0em;
	margin: 0;
}

.iconsmall { max-height: 1.3em; max-width: 1.3em; } 

input, textarea, checkbox { 
    color: #FFFFA0;
	background-color: black;
   }

header {
	border-radius:10px;
	margin: .5em;
	padding: 3em;
	padding-top: 5em;
	display: block;
	min-height: 10em;
	text-align: center;
	background: url("/images/totemprod.png") 0 0 no-repeat fixed;
	}
header h1, header a {
background-color: rgba(0,0,0,.5); 
}

nav {
	border-radius:1em;
	margin: 1em;
	padding: 1em;
	display: block;
	background: url("/images/live-concert-388160_1280.s.jpg") 50% 10em repeat fixed ;
	min-height: 10em;
}

main {
	border-radius:1em;
	margin: 1em;
	padding: 1em;
	display: block;
	background: url("/images/musician-923526_1280.s.jpg") 50% 20em repeat fixed ;
	min-height: 10em;
	}

footer {
	background: url("/images/drummer-652345_1280.s.jpg") 50% 30em repeat fixed ;
	border-radius:1em;
	margin: 1em;
	padding: 1em;
	display: block;
	min-height: 10em;
	clear: both;
	font-size: smaller;
	justify-content: center;
}
footer a {
	border-radius:5px;
	margin:.5em;
	padding:1em;
  }

#copyr { text-align: center; display: block; background-color: rgba(20,20,20,.5); }
footer p { display:inline-block; } 

footer img { max-height: 2em; vertical-align: middle; }
a.actionlink img, h1 img, .menuitem img  { vertical-align: middle; }

#gspacer { 
	background-color: rgba(0,0,40,.8); 
	border-radius:5px;
	margin:.5em; padding:1em; display: inline-block }
fieldset {
	background-color: rgba(32,16,16,0.8);
	border-radius:5px; border: solid 1px #000060;
} 

video, img {
	max-width:100%;
	max-height:75%;
	padding: .5em;
	}

aside { 
	display: inline-block;
	float: right;
	max-width: 40em;
}

.postpreview {
	display: inline-block;
	max-width: 40em;
	padding: .5em;
	margin: .5em;
	background-color: rgba(32,32,32,0.8);
	border-radius:10px;
}
.postpreview video, .postpreview img {
	max-width:100%;
	max-height:5em;
	}
.post { 
	display:block;
	margin:1em;
	padding:1em;
	background-color: rgba(32,32,32,0.8);
	color: #aaa;
	border-radius:10px;
	}
.hiddenpost { background-color: rgba(16,16,16,0.5); }
.fullwidth { width: 100%;  }

textarea.fullwidth { min-height:10em; }

.thanks  { 
	max-width: 10%;
	text-align: center;
	font-size:smaller;
	display:inline;
	bottom:0;
}

.panel,.bshpanel, aside {
	background-color: rgba(32,32,16,0.8);
		border-radius:5px; 
		margin:.5em;
		padding: .5em;
}

.hint {
	display: inline;
	font-style: italic;
	font-size: smaller;
}
.hint::before { 
content: "(";
}
.hint::after { 
content: ")";
}


a {
	text-decoration: none;
	color: #B0B080;
   background-color:rgba(20,20,20,0.5);
   text-decoration: none;
}
.usertitleref {
	color: #B0B080;
	border-radius: 5px;
   background-color:rgba(0,0,32,0.6);
   font-family: 'Arial', cursive;
	padding: 1em;
}
a:hover  {
	text-decoration: underline;
}
a:visited {
	color: #90B090;
}
label {
	font-size: medium;
}

.message, #message {
	font-size: large;
	background-color: rgba(64,64,0,0.5);
	}
.dirty { 
	background-color: rgba(128,128,0,0.5);
}
.error, #error {
	color: #f88;
	font-size: large;
	background-color: rgba(256,0,0,0.5);
}
.validation-summary-errors{
	color: #f88;
	background-color: rgba(256,0,0,0.5);
}


.hidden { display:none; }

ul.preview li:nth-child(-n+10) {
   display:inline;
	font-size:xx-small;
}

ul.preview li:nth-child(n) {
	display:none;
}

.validation-summary-errors{
	color: #f88;
}

.actionlink {
	color: #B0B080;
	border-radius: 5px;
   background-color:rgba(0,0,32,0.5);
   cursor: pointer;
   font-family: 'Arial', cursive;
	padding: .2em;
}

input, select { 
	color: #B0B080;
	border: solid 1px rgb(128,128,128);
	border-radius:5px;
   background-color:rgba(0,0,32,0.8);
   font-family: 'Arial', cursive;
}


.actionlink:hover {
	background-color:rgba(30,0,124,0.9);
    text-decoration: underline;
}

.code {
	font-family: "monospace";
	background-color: rgba(0,0,256,0.1);
	border-radius:25px;
	white-space: pre-wrap;
}

.avatar {
	max-width: 64px;
	max-height: 64px;
}

.comment {
	border-radius:25px;
	font-size: smaller;
	}


.menuitem {
	background-color: rgba(0,0,40,.8); 
	border-radius:5px;
	margin:.5em;
	padding:.5em;
	display: inline-block; 
}

.onhover {
	display:none; 
	position: absolute;
}

.ohafter:hover + .onhover, .ohinside:hover > .onhover {
   display:block; 
   z-index:2; 
	 padding:5px; margin:5px;
   background-color: rgba(0,0,40,.8); 
}

.input-validation-error { border: solid 1px red; }
.field-validation-error { color: red; }

.c2 { font-size: small; font-style: italic; }
.c3 { font-size: x-small; font-style: italic; }
@media print {
		body {background-color:white;color:black;}
		header,footer,.postcomment,.actionlink,nav
		{ display:none;} 
	}

@media all and (min-width: 640px) {
	.bshpanel { display:block; }
  .bsh { display: none; }
  .c3 { display:initial; }
  .c3-alt { display:none; }
	}

@media all and (max-width: 640px) {
	header {
		margin: .5em;
		padding: .5em;
		min-height: 3em;
	    padding-top: 5em;
	}
	nav {
		margin: .5em;
		padding: .5em;
		min-height: 3em;
		background:    url("/images/live-concert-388160_1280.xxs.jpg") 50% 10% repeat fixed ; 
	}
	main { 
		margin: .5em;
		padding: .5em;
		min-height: 7em;
		background:   url("/images/musician-923526_1280.xxs.jpg")  50% 20em repeat fixed ; 
	} 
	footer { 
		margin: .5em;
		padding: .5em;
		min-height: 3em;
		background: url("/images/drummer-652345_1280.xxs.jpg") 50% 90% repeat fixed ; 
	} 
	.menuitem {
		display: block; 
	}
	.post { 
	margin:.3em;
	padding:.3em;
	}
	.usertitleref{ 
	padding:.3em;
	}
  .bshpanel { cursor:zoom-in; }
  footer { clear:both; }

	.c2 { display:initial; }
	.c2-alt { display:none; }
	.c3 { display:none; }
	.c3-alt { display:initial; }
}

@media all and (max-width: 350px) {
  .c2 { display:none; }
  .c2-alt { display:initial; }
}