:root{
	--hue:			200deg;
}


body{
	background: hsl(var(--hue), 100%, 4.71%);
	color: white;
	text-align: center;
	font-family: arial;
	margin: 0;
	padding: 0;
}
#header{
	width:100%;
	font-size: 20px;
	border-bottom: 2px solid hsl(var(--hue), 81.25%, 18.82%);
	background: hsl(var(--hue), 77.05%, 11.96%);
	margin-bottom: 10px;
	height: 32px;
	line-height: 32px;
	position: fixed;
	top: 0;
	z-index: 1;
}
#main{
	width:100%;
	margin-top: 32px;
	height: calc(100vh - 32px);
    overflow-y: scroll;
	scrollbar-color: hsl(var(--hue), 77.05%, 11.96%) transparent;
}
.podcast{
	width:296px;
	height:484px;
	display: inline-block;
	overflow: hidden;
	margin: 10px;
	border-radius: 10px;
	border: 2px solid hsl(var(--hue), 81.25%, 18.82%);
	background: hsl(var(--hue), 77.05%, 11.96%);
	transition: background 0.2s;
	position: relative;
	&:hover{
		background: hsl(var(--show_hue), 79.44%, 20.98%);
		border: 2px solid hsl(var(--show_hue), 81.25%, 18.82%);
	}
}
.podcast .image{
	display: grid;
	place-items: center;
	width: 282px;
	height: 282px;
	background: hsl(var(--hue), 82.98%, 9.22%);
	border-radius: 10px;
	margin:5px;
	border: 2px solid hsl(var(--hue), 81.25%, 18.82%);
	overflow: hidden;
	transition: transform 0.2s, background 0.2s;
}
.podcast:hover .image{
	transform: scale(1.02);
	background: hsl(var(--show_hue), 77.05%, 11.96%);
	border: 2px solid hsl(var(--show_hue), 81.25%, 18.82%);
}
.podcast .image img{
	width: 100%;
}
.podcast .title{
	font-size:24px;
	margin: 10px;
}
.podcast .description{
	font-size:14px;
	margin: 10px;
}
a {
	color: white;
}
hr{
	border: 2px solid hsl(var(--hue), 81.25%, 18.82%);
}
s {
	color: gray;ssssss
}
a:has(s) {
	text-decoration: none;
	cursor: default;
}
#myname{
	width:150px;
}
.flag{
	display: inline-block;
	height: 11px;
	width: 16px;
	margin-right: 7px;
}
#myflag {
  margin: 0 0 0 27px;
}
.flag-AU{
	background: url('flags/AU.png');
	&:hover::after{content:'Australia';}
}
.flag-NSN{
	background: url('flags/NSN.png');
	&:hover::after{content:'National Socialist';}
}
.flag-EST{
	background: url('flags/EST.png');
	&:hover::after{content:'Eureka Stockade';}
}
.flag-LFT{
	background: url('flags/LFT.png');
	&:hover::after{content:'Lambing Flats';}
}
.flag-SC{
	background: url('flags/SC.png');
	&:hover::after{content:'Free Man';}
}
.flag-ABO{
	background: url('flags/ABO.png');
	&:hover::after{content:'Abbo';}
}
.flag-TSI{
	background: url('flags/TSI.png');
	&:hover::after{content:'Sea Abbo';}
}
.flag-NSW{
	background: url('flags/NSW.png');
	&:hover::after{content:'New South Wales';}
}
.flag-QLD{
	background: url('flags/QLD.png');
	&:hover::after{content:'Queelsnald';}
}
.flag-SA{
	background: url('flags/SA.png');
	&:hover::after{content:'South Australia';}
}
.flag-TAS{
	background: url('flags/TAS.png');
	&:hover::after{content:'Tasmania';}
}
.flag-VIC{
	background: url('flags/VIC.png');
	&:hover::after{content:'Victoria';}
}
.flag-WA{
	background: url('flags/WA.png');
	&:hover::after{content:'Western Australia';}
}
.flag-NT{
	background: url('flags/NT.png');
	&:hover::after{content:'Northern Territory';}
}
.flag-ACT{
	background: url('flags/ACT.png');
	&:hover::after{content:'Australian Capital Territory';}
}
.flag-JBT{
	background: url('flags/JBT.png');
	&:hover::after{content:'Jervic Bay Territory';}
}
.flag-MRT{
	background: url('flags/MRT.png');
	&:hover::after{content:'Murray River Territory';}
}
.flag-ACI{
	background: url('flags/ACI.png');
	&:hover::after{content:'Ashmore and Carter Islands';}
}
.flag-CSI{
	background: url('flags/CSI.png');
	&:hover::after{content:'Coral Sea Islands';}
}
.flag-NFI{
	background: url('flags/NFI.png');
	&:hover::after{content:'Norfolk Island';}
}
.flag-XMS{
	background: url('flags/XMS.png');
	&:hover::after{content:'Christmas Island';}
}
.flag-COC{
	background: url('flags/COC.png');
	&:hover::after{content:'Cocos (Keeling) Islands';}
}
.flag-NZ{
	background: url('flags/NZ.png');
	&:hover::after{content:'Australian State of New Zealand';}
}
.flag-NAR{
	background: url('flags/NAR.png');
	&:hover::after{content:'Nauru Offshore Detention Centre';}
}
.flag-PNG{
	background: url('flags/PNG.png');
	&:hover::after{content:'PNG Offshore Detention Centre';}
}
.flag-D53{
	background: url('flags/D53.png');
	&:hover::after{content:"Digger's Flag";}
}
.flag-D51{
	background: url('flags/D51.png');
	&:hover::after{content:'Diggers Flag (1851)';}
}
.flag-FED{
	background: url('flags/FED.png');
	&:hover::after{content:'Federation Flag (1831)';}
}
.flag-COL{
	background: url('flags/COL.png');
	&:hover::after{content:'Colonial Flag (1821)';}
}
.flag-MAW{
	background: url('flags/MAW.png');
	&:hover::after{content:'Australian Antarctic Territory';}
}
.flag-AFP{
	background: url('flags/AFP.png');
	&:hover::after{content:'Australian Federal Police';}
}
#flag-select{
	display: inline-block;
	width: 150px;
}
#mypost{
	width: 350px;
	height: 106px;
	font-family: arial;
}
#posts {
  width: 935px;
  display: inline-block;
  text-align: left;
}
.post {
	border: 2px solid hsl(var(--hue), 81.25%, 18.82%);
	text-align: left;
	display: inline-block;
	margin-bottom: 10px;
	padding: 10px;
	background: hsl(var(--hue), 77.05%, 11.96%);
	border-radius: 10px;
}
.postheader {
	position: relative;
}
.flag:hover::after {
	position: absolute;
	display: block;
	background: hsl(var(--hue), 79.44%, 20.98%);
	bottom: 20px;
	border-radius: 5px;
	padding: 2px 10px;
	transform: translate(calc(-50% + 8px));
}
input, textarea, select{
	border: 2px solid hsl(var(--hue), 81.25%, 18.82%);
	background: hsl(var(--hue), 77.05%, 11.96%);
	color: white;
}
textarea{
	margin:5px 0;
}
.tag {
/*border: 2px solid hsl(var(--hue), 81.25%, 18.82%); */
/*border-radius: 5px; */
	padding: 3px;
	display: inline-block;
	margin: 3px;
}
.tag_bind {
	position: absolute;
	bottom: 4px;
	width: 100%;
}
#myflag:hover::after {
	display: none;
}
.admin {
	color: #57f770;
}
.admin::after {
	content: ' ## Admin';
}
#southerncross {
	background: url("southerncross.svg");
	background-repeat: no-repeat;
	background-position: bottom right;
	background-size: 50vh;
	opacity: 0.06;
	position: fixed;
	top: 0;
	left: 0;
	height: calc(100vh - 40px);
	width: calc(100vw - 40px);
	z-index: -1;
}
.postbody p{
	margin: 5px 0 0 0;
}
.greentext {
  color: #9cd782;
}