.or-container {
	overflow: hidden;
	margin: 0;
	border-radius:10px;
	padding: 15px;
	background: linear-gradient(165deg, #202c4c, #111C38);
	color: #fff;
	margin:0 auto;
}
.or-left-column {
	float: left;
	width: 170px;
}
.or-logo {
	display: block;
	max-width: 150px;
	height: auto;
	border-radius:10px;
}
.or-right-column {
	margin-left: 190px;
}
.or-row1, .or-row2, .or-row3 {
	margin: 0px;
	overflow: hidden;
}

.or-station-name {
	float: left;
	font-size: 1.6rem;
	font-weight: bold;
}
.or-station-website {
	float: right;
	display: block;
}

.or-link-icon {
	display: block;
}
.or-city-freq {
	display: block;
	font-size: 1rem;
}

/* Hide any station list if present */
.or-station-list {
	display: none;
}
.or-error {
	color: red;
	font-weight: bold;
}

.or-row3 {
	display: flex;
	align-items: center;
	margin: 20px 0 0;
}

.or-play-button {
	background: #ffffff;
	border: none;
	cursor: pointer;
	width: 50px;
	height: 50px;
	border-radius:50px;
	margin-right:20px;
	padding:10px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.or-play-button:hover,
.or-play-button:focus,
.or-play-button:active {
	background-color: #f7f8f9;
}

.or-play-button svg {
	width: 100%;
	height: 100%;
	fill: #fff;
}

.or-play-svg,
.or-pause-svg {
	fill: #d877fe!important;
}

.or-volume-container {
	display: flex;
	align-items: center;
}

.or-speaker-icon {
	width: 24px;
	height: 24px;
	margin-right: 6px;
}

.or-volume-slider {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 100%;
	background: transparent;
	margin: 0; /* reset any user agent margins */
}

/* SLIDER*/

/* WebKit browsers (Chrome, Safari, Edge) */
.or-volume-slider::-webkit-slider-runnable-track {
	height: 6px;
	background: #ffffff;
	border-radius: 3px;
}
.or-volume-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	background: #d877fe;
	border: 2px solid #ffffff;
	border-radius: 50%;
	margin-top: -5px;
	cursor: pointer;
}

/* Firefox */
.or-volume-slider::-moz-range-track {
	height: 6px;
	background: #fffffff;
	border-radius: 3px;
}

/* IE 10+ */
.or-volume-slider::-ms-track {
	height: 6px;
	background: transparent;
	border-color: transparent;
	color: transparent;
}

.or-volume-slider::-ms-fill-lower,
.or-volume-slider::-ms-fill-upper {
	background: #fffffff;
	border-radius: 3px;
}

.or-volume-slider::-ms-fill-upper {
	background: #fffffff;
	border-radius: 3px;
}

/* Firefox */
.or-volume-slider::-moz-range-thumb {
	width: 16px;
	height: 16px;
	background: green;
	border: 2px solid #fffffff;
	border-radius: 50%;
	cursor: pointer;
}

.or-volume-slider::-ms-thumb {
	width: 16px;
	height: 16px;
	background: green;
	border: 2px solid #fffffff;
	border-radius: 50%;
	cursor: pointer;
	margin-top: 0; /* IE positions differently */
}