.radio .inner {
	position: relative;
}

.radio .radio-controls {
	background-image: url("../assets/imgs/radio.png");
	background-size: 100%;
	background-position: 50%;
	background-repeat: no-repeat;
	height: 100%;
	aspect-ratio: 1612/1088;
	position: relative;
}

.radio .presets {
	display: flex;
    position: absolute;
    z-index: 100;
    width: 39.9%;
    right: 2%;
    top: 48%;
}

.radio .presets .preset {
	background: none;
	border: none;
	width: 25%;
	aspect-ratio: 163/92;
}

.radio .frequency {
	color: white;
	/* font-size: 1.3rem; */
	font-size: 6.5vh;
	position: absolute;
	font-family: "mono45-headline", monospace;
	right: 12%;
	top: 20%;
}

.radio .presets .preset {
	width: 25%;
}

.radio .morse-output {
	background: url("../assets/imgs/note-paper.svg");
	background-size: contain;
	background-repeat: no-repeat;
	max-width: 100%;
	height: 100%;
	aspect-ratio: 1/1.48;
	z-index: 100;
	position: absolute;
	left: 0;
	transform: rotate(-16deg);
	padding: 5%;
	font-family: monospace;
	color: #0c1a75;
}

.radio .morse-output p {
	margin: 1rem 1rem 1rem 0;
	line-height: 1;
	letter-spacing: 0;
	font-size: 3vh;
}

.radio .preset[data-value="1"] { background-image: url("../assets/imgs/radio-preset-1.png"); background-size: 100%; background-repeat: no-repeat;}
.radio .preset[data-value="2"] { background-image: url("../assets/imgs/radio-preset-2.png"); background-size: 100%; background-repeat: no-repeat;}
.radio .preset[data-value="3"] { background-image: url("../assets/imgs/radio-preset-3.png"); background-size: 100%; background-repeat: no-repeat;}
.radio .preset[data-value="4"] { background-image: url("../assets/imgs/radio-preset-4.png"); background-size: 100%; background-repeat: no-repeat;}

.radio .preset[data-value="off"] {
	position: absolute;
    width: 50%;
    background: transparent;
    border-radius: 100%;
    left: 24%;
	top: 130%;
	aspect-ratio: 1/1;
	background-image: url("../assets/imgs/power.svg");
	background-repeat: no-repeat;
	background-size: 20%;
	background-position: center;
}


@media only screen and (min-width: 1200px) {

	.radio .frequency {
		/* font-size: 3rem; */
	}

	.radio .morse-output p {
		/* font-size: 2rem; */
	}
	
}