/*=====================================================================*/
.input-sounds
	{
	cursor:       pointer;
	display: inline-block;
	margin:          10px;
	width:           20px;
	height:          20px;
	vertical-align:   sub;
	outline: solid 3px hsl(110, 100%, 30%); outline:  solid 3px var(--textinternalnavigationlinkcolour);
	accent-color: green;                   accent-color: var(--textinternalnavigationlinkactivecolour);
	}

.input-sounds:visited
	{
	outline: solid 3px hsl(110, 100%, 30%); outline: solid 3px var(--textinternalnavigationlinkcolour);
	}

.input-sounds:hover,
.input-sounds:focus
	{
	outline: solid 5px green; outline: solid 5px var(--textinternalnavigationlinkactivecolour);
	}

.input-sounds:active
	{
	outline: 5px solid green; outline: 5px solid var(--textinternalnavigationlinkactivecolour);
	}

.label-forsoundscheckbox
	{
	cursor:       pointer;
	text-decoration: none;      text-decoration:     var(--textlinkdecoration);
	color: hsl(110, 100%, 30%); color: var(--textinternalnavigationlinkcolour);
	}

.label-forsoundscheckbox:hover
	{
	text-decoration: underline;
	}

.label-forsoundscheckbox:active
	{
	color: green; color: var(--textinternalnavigationlinkactivecolour);
	}

/*=====================================================================*/
.button-volume
	{
	cursor:          pointer;
	margin-left:         0px;
	margin-top:         10px;
	margin-right:        0px;
	margin-bottom:      10px;
	padding-left:       10px;
	padding-top:         5px;
	padding-right:      10px;
	padding-bottom:      5px;
	display:    inline-block;
	color: hsl(110, 100%, 30%);            color:   var(--textinternalnavigationlinkcolour);
	font-weight:        bold;
	border-radius:      20px;
	border: 5px outset linen;             border: 5px outset var(--foregroundsoundscolour);
	background-color: hsl(120, 93%, 90%); background-color:    var(--backgroundiconcolour);
	}

.button-volume:visited
	{
	color: hsl(110, 100%, 30%);            color: var(--textinternalnavigationlinkcolour);
	background-color: hsl(120, 93%, 90%); background-color:  var(--backgroundiconcolour);
	}

.button-volume:hover,
.button-volume:focus
	{
	color:                     green;      color:       var(--textinternalnavigationlinkactivecolour);
	border:   5px outset transparent;
	background:                 none;
	background-color: hsl(120, 93%, 85%);  background-color:         var(--backgroundiconfocuscolour);
	outline-offset:              2px;
	outline: solid 3px hsl(110, 100%, 30%); outline: solid 3px var(--textinternalnavigationlinkcolour);
	}

.button-volume:active
	{
	color:                         green; color: var(--textinternalnavigationlinkactivecolour);
	background-color: hsl(120, 93%, 40%); background-color:  var(--backgroundiconactivecolour);
	}

/*=====================================================================*/
.img-art
	{
	max-width:  calc( 100%   + 10px );
	max-height: calc( 100vh  - 40px );
	max-height: calc( 100svh - 40px );
	float:          none;
	clear:          left;
	margin-left:   -10px;
	padding-bottom: 30px;
	}

/* 850px */
@media (max-width: 53.125rem)
{
.img-art
	{
	max-width:  calc( 100%   - 10px );
	max-height: calc( 100vh  - 20px );
	max-height: calc( 100svh - 20px );
	margin-left: -15px;
	}
}

/*=====================================================================*/
/* 24px 16px */
.p-modaltextstartreksounddescription
	{
	width:    fit-content;
	margin-top:      40px;
	margin-bottom:   20px;
	padding-left:  1.5rem;
	padding-right:   10px;
	text-indent:    -1rem;
	font-weight:     bold;
	}

.p-modaltextstartreksoundfilenamelink
	{
	width:    fit-content;
	margin-left:     30px;
	margin-bottom:    5px;
	padding-left:    10px;
	padding-right:   10px;
	color: hsl(110, 100%, 30%); color: var(--textinternalnavigationlinkcolour);
	font-weight:     bold;
	cursor:       pointer;
	text-decoration: none;      text-decoration:     var(--textlinkdecoration);
	}

.p-modaltextstartreksoundfilenamelink:visited
	{
	color: hsl(110, 100%, 30%); color: var(--textinternalnavigationlinkcolour);
	}

.p-modaltextstartreksoundfilenamelink:hover
	{
	text-decoration: underline;
	}

.p-modaltextstartreksoundfilenamelink:active
	{
	color: green; color: var(--textinternalnavigationlinkactivecolour);
	}

.p-modaltextstartreksoundurl
	{
	width:     fit-content;
	max-width:        100%;
	padding-left:     40px;
	padding-right:    10px;
	font-size:       small;
	word-break: break-word;
	}

.img-singledotstartreksound
{
	width:          1px;
	height:         1px;
	filter: opacity(0%);
}
/*=====================================================================*/