@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap');

body {
	overflow-x: hidden;
	font-family: 'PT Sans', sans-serif;
}
#ssai-hero {
	min-height: 98vh;
	background: linear-gradient(180deg, rgba(255,255,255,1) 75%, rgb(255 10 120) 75%, rgb(255 35 49) 100%);
}

#ssai-logo {
	width: 120px;
}


.ssai-header{
	color: #FF0A78;
}

.ssai-button {
	/*width: 116px;*/
}

#ssai-video {
	min-height: 98vh;
}
.ssai-controls {
	width: clamp(45px,6vw,80px);
	margin: 0 5px 10px;
}

.ssai-controls-wide {
	width: 140px;
	
}

.scrubber {
	position: relative;
	width: 45.7%;
	height: 5px;
	background-color: #efefef;
}
	
.scrubber_right {
   left: 54.3%;
	 top: -5px;  
}
.progress {
	width: 0;
	height: 5px;
	background-color: rgb(255,10,120);
}

.ssai-volControl {
	color: #666;
	font-size: 1.6em;
}

input#vol-control {
    width: 70%;
}



.ssai-playernames {
	position: relative;
	width: 45.7%;
	height: 35px;
}
.ssai-playernames_right {
   left: 54.3%;
	 top: -35px;  
}

span.ssai-valuetags {
    background: #ff0a78;
    color: #fff;
    font-size: 12px;
    padding: 2px 10px 3px;
    border-radius: 12px;
    margin-right: 5px;
}

.ssai-playernames h4 {
	font-size: clamp(10px,2vw,24px);
	margin-bottom: 3px;
}

#ssai-footer-wrapper {
	background: rgb(51,51,51);
background: linear-gradient(180deg, rgba(51,51,51,1) 0%, rgba(0,0,0,1) 100%);
}

#ssai-footer {
	color: #bbb;
}
#ssai-footer a{
	color: #fff;
}