html, body {
	font-family: 'Montserrat', sans-serif;
	min-height: 100vh;
}

.mobile-nav {
	padding-left: 20px;
}

.uk-navbar-container:not(.uk-navbar-transparent) {
	background: #fff;
}

.sidebar {
	background: #fff;
	box-sizing: border-box;
	height:     100%;
	left:       0;
	padding:    45px 0 60px 0;
	position:   fixed;
	top:        0;
	width:      300px;
}

.uk-nav .uk-nav-header,
.uk-nav li a {
	padding-left:  40px;
	padding-right: 40px;
}

.uk-nav li a svg {
	max-width: 160px;
}

.logo {
	display:   block;
	margin:    auto;
	max-width: 150px;
}

.uk-navbar-container .logo {
	max-width: 80px;
}

main {
	padding-left: 300px;
}

.site-leaderboard {
	min-height: 35px;
}

.audio-player {
	background: #fff;
	box-shadow: 0 0 24px rgba(0,0,0,0.12);
	padding:    20px;
	position:   relative;
}

.player-more {
	cursor:   pointer;
	position: absolute;
	right:    20px;
}

.player-more .uk-dropdown {
	padding: 0;
}

.player-more .uk-dropdown ul li a {
	padding: 20px;
}

.player-more .uk-dropdown ul .uk-nav-divider {
	margin: 0;
}

.player-image {
	box-shadow: 0 12px 24px rgba(0,0,0,0.12);
	width:      100%;
}

.player-top {
	margin-bottom: 20px;
}

.player-center {
	padding: 0 40px;
}

.player-image-container {
	margin-left:  auto;
	margin-right: auto;
	max-height:   255px;
	max-width:    255px;
}

.player-meta span {
	display: block;
}

.player-controls {
	margin-top: 20px;
}

.player-tray {
	background:  #f6f6f6;
	padding-top: 20px;
}

.player-tray .uk-list {
	margin-top: 0;
}

.player-tray ul li {
	padding: 20px;
}

.uk-list-divider>li:nth-child(n+2) {
	margin-top:  0;
	padding-top: 20px;
}

.button-play,
.amplitude-stop {
	cursor: pointer;
}

.amplitude-stop {
	display: none;
}

.player-volume svg {
	margin-top: -18px;
}
.amplitude-volume-slider {
	width: calc( 100% - 30px );
}

.uk-modal-dialog {
	max-width:  640px;
	display:    flex;
	position:   relative;
	top:        20%;
	bottom:     20%;
	background: transparent;
}

.modal-video {
	background: rgba(0,0,0);
}

.modal-video-timer {
	left:           0;
	right:          0;
	height:         10px;
	padding:        10px;
	width:          103.4%;
	font-size:      10px;
	color:          #fff;
	margin-top:     -30px;
	z-index:        1;
	text-transform: uppercase;
	background:     rgba(0,0,0, 0.01);
}

#modal-video-container {
	height: 110%;
	max-height: 360px;
	max-width: 640px;
	width: 110%;
}

.section-title {
	color:       #fff;
	padding-top: 20px;
}

@media screen and (max-width: 1164px) {

	.sidebar {
		width: 200px;
	}
	main {
		padding-left: 200px;
	}
	.uk-nav .uk-nav-header,
	.uk-nav li a {
		padding-left:  20px;
		padding-right: 20px;
	}
}
/* Home - Station list styles */
#header {
	background-color: #1e1e1e;
	padding:          95px 20px 35px 20px;
	text-align:       left;
	font-weight:      400;
	font-family:     'Montserrat', 'sans-serif';
	color:            #fff;
}

#corporate-logo {
	width:         250px;
	height:        auto;
	margin-left:   20px;
	margin-bottom: 5px;
}

#station-table_wrapper {
	background-color: #f6f6f6;
	padding:          0;
	margin:           0;
}

#station-table thead {
	background-color: #f6f6f6;
}

#station-table th {
	background-color: #ffffff   !important;
	color:            #1e1e1e   !important;
	text-transform:   uppercase !important;
	font-weight:      700       !important;
	text-align:       left;
	font-size:        12px;
	padding:          10px 110px 15px 35px;
}

#station-table tr {
	border: 0 solid #fff;
}

.odd, .even {
	padding:   0 15px;
	font-size: 12px;
}

#station-table_length,
#station-table_filter {
	margin:         10px 0 15px 20px;
	font-family:    'Montserrat', 'sans-serif';
	font-weight:    400;
	font-size:      11px;
	text-transform: uppercase;
	color:          #777370 !important;
}

#station-table_length {
	margin-top: 10px;
}

#top-container {
	padding:    30px 40px 0 40px;
	background: #dd252b !important;
}

#middle-container {
	background: #dd252b !important;
	margin:     0;
	padding:    0 40px;
	height:     100%;
}

#bottom-container {
	background: #eaeaea !important;
	padding:    0 40px;
}

#station_table-filter {
	background: #1e1e1e !important;
	padding:    10px 25px 5px 15px;
	height:     100%;
	border:     1px solid #3a3737;
}

#station-table_length select {
	background:        #3a3838 !important;
	color:             #999 !important;
	border:            0 solid #ccc !important;
	outline:           0 !important;;
	outline-bottom:    1px solid #ccc !important;
	border-bottom:     1px solid #999 !important;
	-webkit-highlight: none !important;
	margin:            -10px 5px !important;
}

.dataTables_wrapper .dataTables_filter {
	float: none;
}

table.dataTable tbody td {
	padding:        15px 25px !important;
	text-transform: uppercase;
}

table.dataTable tbody td:first-child {
	color:      #000   !important;
	font-size:  13.5px !important;
}

table.dataTable tbody td:last-child {
	color: #ccc !important;
}

a:hover {
	color: #ccc !important;
}

.listen-icon a {
	color: #ccc !important;
}

.listen-icon img {
	width:      20px;
	height:     20px;
	margin-top: -2px;
}

table .uk-button-primary {
	border-radius: 5px;
	background:    transparent;
	border:        1px solid #e1e1e1;
	color:         #999;
	font-size:     11px;
	margin-bottom: 7px !important;
}

.uk-button-primary svg {
	color:  #fff;
	height: 10px;
	width:  auto;
	fill:   #fff;
	stroke: #fff;
}

.uk-button-secondary {
	background-color: #ddd !important;
	height:           20px;
	width:            60px;
	border-radius:    20px;
}

#station_table-footer {
	padding:          10px 20px 75px 20px;
	margin:           0;
	background:       #eaeaea;
	height:           50px;
	font-size:        11px;
	text-transform:   uppercase;
	color:            #ccc !important;
}

#station-table_info,
#station-table_paginate a {
	color:      #999 !important;
	font-style: italic;
}

.paginate_button.current {
	background: transparent !important;
	border:     1px solid #dcdbdb !important;
}

table.dataTable.no-footer,
table.dataTable thead th,
table.dataTable thead td {
	border: 0 solid #fff;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
	cursor:              pointer;
	*cursor:             hand;
	background-repeat:   no-repeat;
	background-position: 10px 10px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background: #ccc       !important;
	border:     1px solid  #ccc !important;
}

#station-table_previous:hover,
#station-table_next:hover {
	background:      transparent  !important;
	border:          0 solid #ccc !important;
	text-decoration: underline    !important;
}

#station_table-filter input {
	border:          0 solid #6b6767;
	color:           #ccc;
	width:           160px;
	height:          20px;
	background:      #3c3939;
	border-radius:   0;
	margin-left:     10px !important;
}

.uk-link, a {
	color: #999;
}

.uk-link, a:hover {
	text-decoration: none;
	color:           #dd252b;
	outline:         none !important;
	box-shadow:      none !important;
}

.text-clamp {
	display:            block;
	line-height:        1.5em;
	max-height:         3em;
	overflow:           hidden;
	display:            -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

@media only screen and (max-width: 768px) {
	.uk-offcanvas,
	.uk-open > .uk-offcanvas-bar {
		width: 100% !important;
	}

	.player-more .uk-dropdown {
		left: -170px !important;
	}

	.player-controls {
		padding-bottom: 25px;
	}

	.player-volume {
		display: none;
	}

	#corporate-logo {
		margin-top: 0;
	}

	#header {
		padding-top:    40px;
		padding-bottom: 20px;
		text-align:     center;
	}

	#modal-video-container iframe {
		width: 100% !important;
	}

	#bottom-container table.dataTable tbody td:first-child {
		padding-top: 10px;
	}

	#bottom-container table.dataTable tbody td:last-child {
		margin-bottom: 10px;
	}

	.modal-video-timer {
		display: none;
	}

	#modal-video-container div {
		width: 100% !important;
	}
}

@media screen and (max-width: 960px) {
	main {
		padding-left: 0;
	}

	.site-leaderboard {
		min-height: 0;
	}

	td .uk-button-primary:focus,
	.uk-button-primary:hover,
	.uk-button-primary:hover svg {
		background:   #ededed !important;
		border-color: #ededed !important;
		fill:         #fff    !important;
		stroke:       #fff    !important;
		color:        #9e9e9e !important;
	}
}
