/*
Theme Name: Top800
Author: SPH
Author URI: http://sph.com.sg/
Description: Theme for Top800
Version: 1.0
Text Domain: onefm
*/

body #outer-wrapper {
    background-color: #333;
}
.grid_12 {
    float: none;
}
.container {
    max-width: none;
}
#banner-wrapper img {

}
#inner-wrapper {
    background-color: #fff6e5;
}
#title-wrapper {
    text-align: center;
}
#title-wrapper h1 {
    color: #76a036;
}
#title-wrapper span {
    color: #aaa;
}
#title-wrapper .hidden-xs h1 {
    font-size: 48px;
    font-weight: bolder;
}
#title-wrapper .hidden-xs span {
	
}
#title-wrapper .visible-xs-block h1 {
    font-size: 24px;
}
#title-wrapper .visible-xs-block span {
    float: left;
    margin: 10px;
    text-align: left;
}
#sort-search-wrapper {
	padding-top: 1em;
}
#sort-search-wrapper .left a {
    display: block;
}
#search-form {
    /*float: right;*/
}
#search-form input {
    /*float: left;*/
    height: 40px;
    /*padding-left: 10px;
    width: 300px;*/
}
#search-form a {
    background: url("/wp-content/plugins/sphradio-voting-campaigns/kiss92-dec2018/imgs/search_btn.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
    display: block;
    /*float: left;*/
    height: 40px;
    text-indent: -9999px;
    width: 40px;
}
#content-wrapper {
    margin-top: 20px;
}
#content-wrapper .cb {
	width: 20px;
}

#content-wrapper .preview {
	width: 24px;
}
#content-wrapper a.btn-preview {
    display: block;
    text-indent: -9999px;
    width: 14px;
}
#content-wrapper a.play {
    background: url("/wp-content/plugins/sphradio-voting-campaigns/kiss92-dec2018/imgs/play.png") no-repeat scroll 0 3px rgba(0, 0, 0, 0);
}
#content-wrapper a.stop {
    background: url("/wp-content/plugins/sphradio-voting-campaigns/kiss92-dec2018/imgs/stop.png") no-repeat scroll 0 3px rgba(0, 0, 0, 0);
}

#form-wrapper {
    margin: 60px 0 0;
}


/* U1000 2016 */

@font-face {
	font-family: 'fzzhengheis';
	src: url('/wp-content/plugins/sphradio-voting-framework/fonts/fzzhengheis.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}


body, div, p, th, td { font: 18px/1.5 "Oswald" !important; text-transform: uppercase !important; }
html, body, #outer-wrapper {/* min-height: 100vh; */}
::placeholder { font-family: "Oswald"; }

img { max-width: 100%; max-height: 100%; width: auto; height: auto; }

h1 { font-family: fzzhengheis; font-size: 30px; color: #76a036; margin-bottom: 1em; }
h1 .alt { font-family: "Oswald"; }

p { margin-bottom: 1em; color: #333 !important; }

a,
a:active,
  a:focus { text-decoration: none; color: #b62080; }

hr { border-color: #ddd; }

.gradient-green-1,
	#main-nav .menu a1 {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a9db80+0,96c56f+100;Green+3D+%232 */
background: #a9db80; /* Old browsers */
background: -moz-linear-gradient(top,  #a9db80 0%, #96c56f 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #a9db80 0%,#96c56f 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #a9db80 0%,#96c56f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=0 ); /* IE6-9 */
}

.gradient-green-2,
	#main-nav .menu a1:hover,
	#main-nav .menu .current-menu-item > a1 {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d2ff52+0,91e842+100;Neon */
background: #d2ff52; /* Old browsers */
background: -moz-linear-gradient(top,  #d2ff52 0%, #91e842 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #d2ff52 0%,#91e842 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #d2ff52 0%,#91e842 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=0 ); /* IE6-9 */
}

.gradient-black-1,
	.gallery-1 .text {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+30,000000+100&0+0,0.5+30,0.75+100 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 30%, rgba(0,0,0,0.75) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.75) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 30%,rgba(0,0,0,0.75) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#bf000000',GradientType=0 ); /* IE6-9 */
}

.gradient-turqoise-1,
	.online-player {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1fbed6+0,08373d+100 */
background: rgb(31,190,214); /* Old browsers */
background: -moz-linear-gradient(top, rgba(31,190,214,1) 0%, rgba(8,55,61,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(31,190,214,1) 0%,rgba(8,55,61,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(31,190,214,1) 0%,rgba(8,55,61,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1fbed6', endColorstr='#08373d',GradientType=0 ); /* IE6-9 */	
}

	
.list-1,
	.menu,
	.gallery-1,
	.news-list-1,
	.coverage-nav,
	.jcarousel ul,
	.leader-banner ul { margin: 0; padding: 0; list-style: none; }


.text-small { font-size: .9em; }
.text-small-2 { font-size: .8em; }
.text-zh,
	.coverage-label,
	.coverage-content .heading { font-family: fzzhengheis !important; font-weight: normal; font-size: 18px; color: inherit; text-transform: inherit; }

.box-text { width: 70%; margin: 1em auto 3em; text-align: justify; }
.box-text .article-image { width: 70%; display: block; margin: 1em auto; }

img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
	
.break { display: block; }

.form-group label { font-size: .9em; margin-top: .2em; }
.form-reset { margin-top: 1em; }

.table-1 { border-spacing: 1px; border-collapse: separate; margin: 2em 0; }
.table-1 th,
	.table-1 td { background: #f5f5f5; padding: 0.7em; text-align: left; }
th { font-weight: bold !important; }
.result-table { border-spacing: 1px; border-collapse: separate; margin: 1em auto; }
.result-table th,
	.result-table td { background: #fff !important; text-align: center; padding: 4px 40px; }

.result-table .up,
	.result-table .down,
	.result-table .new,
	.result-table .last-year-rank { padding: 4px; }

.result-table .up span,
  .result-table .down span { display: inline-block; width: 3em; }
.result-table .up:after,
  .result-table .down:after { font-family: FontAwesome; }
.result-table .up:after { content: "\f077"; color: green; }
.result-table .down:after { content: "\f078"; color: red; }
.result-table td:hover { background-color: #f5f5f5 !important; }

.result-table .new:before { content: 'NEW'; font-size: .8em; border-radius: .8em; background: #acc939; color: #fff; padding: .2em .5em; font-weight: bold; }
.result-table .neutral:before { content: 'æŒ�å¹³'; font-size: .8em; border-radius: .8em; background: #acc939; color: #fff; padding: .2em .5em; font-weight: bold; }
.result-table .relisting:before { content: 'é‡�æ–°ç™»æ¦œ'; font-size: .8em; border-radius: .8em; background: #acc939; color: #fff; padding: .2em .5em; font-weight: bold; }

.share-on-facebook { display: inline-block; color: #ffffff; border: none; padding: 0.5em 1em; box-shadow: 0 2px 0 0 rgba(0,0,0,0.2); outline: none; text-align: center; font-size: .8em; }
.share-on-facebook { background: #3B5998; }
.share-on-facebook:focus { color: #fff; }
.share-on-facebook:hover { color: #eeeeee; text-decoration: none; }
.share-on-facebook:active { position: relative; top: 2px; box-shadow: none; color: #e2e2e2; outline: none; }

.gallery-1 { text-align: center; }
.gallery-1 > li { display: inline-block; width: 23%; padding: .5%; }
.gallery-1 > li > a { display: block; position: relative; }
.gallery-1 .text { font-size: .8em; padding: 1em .5em .2em; position: absolute; left: 0; bottom: 0; width: 100%; color: #fff; }

.gallery-1.image-list-1 > li { width: 15%; }

.image-list-1 > li { margin: 5px; min-width: 200px; }
.image-list-1 a { display: block; padding-bottom: 66.66%; background: no-repeat center center / cover}

.jcarousel { position: relative; overflow: hidden; margin: 0 1em; }
.jcarousel ul { width: 20000em; position: relative; }
.jcarousel li { float: left; }

.jcarousel-outer { position: relative; margin-bottom: 2em; }
.jcarousel-outer .jcarousel-control { font-size: 1.5em; position: absolute; top: 50%; margin-top: -.5em; width: 1em; height: 1em; overflow: hidden; }
.jcarousel-outer .jcarousel-control:hover { text-decoration: none; }
.jcarousel-outer .jcarousel-control:before { line-height: 1; width: 1em; height: 1em; display: block; font-family: FontAwesome; }
.jcarousel-outer .jcarousel-prev { left: 0; }
.jcarousel-outer .jcarousel-prev:before { content: "\f053"; }
.jcarousel-outer .jcarousel-next { right: 0; }
.jcarousel-outer .jcarousel-next:before { content: "\f054"; }

.video-list-1 > li { margin: 5px; min-width: 100px; }
.video-list-1 .text { padding: 0 .5em; font-size: .7em !important; }
.video-list-1 a:hover { text-decoration: none; }
 
.coverage-label { display: inline-block; min-width: 10em; text-transform: uppercase; }
.coverage-nav { margin-bottom: 1em; display: inline-block; }
.coverage-nav li { display: inline-block; padding: .15em 1em .1em; border: 2px solid #000; border-radius: 1em; margin: .2em; cursor: pointer; font-weight: bold; }
.coverage-nav li:not(.selected):hover { color: #acc939; }
.coverage-nav .selected { background: #f4c0d6; color: #fff; }

.coverage-content { margin-bottom: 1em; }

.coverage-content .heading { margin: 3em 0 1em; }

.display-1 { }
.display-1:after { content: ''; display: block; clear: both; }
.display-1 > .main-screen { width: 60%; padding-bottom: 34%; position: relative; margin: 0 auto 1em; }
.display-1 > .main-screen > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.display-1 .thumb-container { text-align: center; }
.display-1 .thumb-container .thumb { padding-bottom: 66.66%; background-size: cover; background-position: center; cursor: pointer; }
.display-1 .thumb-container .text { display: block; font-size: .7em; line-height: 1.5; color: #f4c0d6; padding: .5em; }
.display-1 .thumb-container li:hover .text { color: #9a191a; }

.news-list-1 { text-align: left; display: flex; flex-wrap: wrap; }
.news-list-1 > li { text-align: center; width: 25%; padding: .3em; box-sizing: border-box; }
.news-list-1 .thumb { padding-bottom: 60%; background: center center / cover; }
.news-list-1 a { font-size: .8em; }
.news-list-1 a:hover { text-decoration: none; }

.header { padding: 1em .5em; }
.header:after { content: ''; display: block; clear: both; }
.header .logo { float: left; width: 105px; margin-right: 1em; }

.online-player {}
.online-player { display: inline-block; color: #fff; box-shadow: 0 0 3px #000; padding: .1em .8em; border-radius: .3em; }
.online-player:hover { text-decoration: none; color: #fff; box-shadow: 0 0 6px #000; text-shadow: 0 0 3px #fff; }

.social { float: left; }
.social .fa-facebook,
	.social .fa-instagram,
	.social .fa-twitter { font-size: 1.2em; }
.social .links { margin-top: 1em; display: flex; justify-content: center; }
.social .links a { margin-right: 1px; width: 1.7em; height: 1.7em; text-align: center; line-height: 1.9em; background: #00afcc; color: #fff; }
.social .links a:hover { background: #94c120; }
	
.leader-banner { margin-left: 290px; text-align: right; position: relative; }
.leader-banner .jcarousel { margin: 0; }
.leader-banner .jcarousel-pagination { position: absolute; bottom: .4em; right: .5em; }
.leader-banner .jcarousel-pagination a { float: left; margin-left: .3em; width: .5em; height: .5em; border-radius: 1em; background: rgba(0,0,0,.4); line-height: 2em; overflow: hidden; }
.leader-banner .jcarousel-pagination a.active { background: rgba(0,0,0,.7); }

.block-2-images { margin: 1em 0; }
.block-2-images:after { content: ''; display: block; clear: both; }
.block-2-images > * { width: 49%; }
.block-2-images > :first-child { float: left; }
.block-2-images > :last-child { float: right; }

.text-center { text-align: center; }

.table { background: transparent; border: none; box-shadow: none; }
.table > tbody > tr > td { font-size: 16px !important; text-align: left; }
.table > thead > tr > th { font-size: 14px !important; }
.table>tbody>tr>td { border-top-color: #aaa; }
.table>thead>tr>th { border-bottom-color: #aaa; }
.table td:hover { background: none; }
.table tr:nth-child(even) { background: inherit; }
table th { background: transparent; border-right: none; }
input[type="checkbox"] { width: 13px; height: 13px; margin: 0; line-height: normal; }

.btn-success.disabled, .btn-success.disabled.active, .btn-success.disabled.focus, .btn-success.disabled:active, .btn-success.disabled:focus, .btn-success.disabled:hover, .btn-success[disabled], .btn-success[disabled].active, .btn-success[disabled].focus, .btn-success[disabled]:active, .btn-success[disabled]:focus, .btn-success[disabled]:hover, fieldset[disabled] .btn-success, fieldset[disabled] .btn-success.active, fieldset[disabled] .btn-success.focus, fieldset[disabled] .btn-success:active, fieldset[disabled] .btn-success:focus, fieldset[disabled] .btn-success:hover,

.btn-success.active, .btn-success.focus, .btn-success:active, .btn-success:focus, .btn-success:hover, .open>.dropdown-toggle.btn-success,

.btn-success { background-color: #b62080; border-color: #b62080; }

.sort-selector { margin-bottom: 1em; }
.sort-selector > div { float: left; margin-right: 2em; text-align: center; line-height: 1 !important; }
.sort-selector a { color: #999; }
.sort-selector a:hover,
	.sort-selector a.selected { text-decoration: none; color: #b62080; }
.sort-selector span { display: block; font-size: 1.2em; font-weight: bold; }

.form-horizontal .form-group { margin: 1em 0; }

.margin-bottom-2x { margin-bottom: 1em; }
.margin-vertical-3x { margin-top: 3em; margin-bottom: 3em; }

#banner-wrapper { position: relative; }
#banner-wrapper .ufm { display: block; position: absolute; width: 14%; height: 34%; top: 9%; right: 3%; }
#banner-wrapper .sponsor { display: block; position: absolute; width: 9%; height: 18%; bottom: 1%; right: 27%; }

#main-nav {margin-left: -15px;margin-right: -15px; background: #f4c0d6; }
#main-nav .menu { text-align: center; }
#main-nav .menu li {margin: 0px 2%;padding-top: 15px;display: inline-block; }
#main-nav .menu li:nth-child(3){padding-bottom:15px;}
#main-nav .menu a { width: 10em; padding: 0.5em 0 0.5em; background: url(/wp-content/plugins/sphradio-voting-campaigns/kiss92-dec2018/imgs/bg-nav-button.png) no-repeat center center / 90% 80%; display: block; font: 700 2.9rem/1.5 "Oswald"; text-transform: uppercase; color: #000; display: flex; justify-content: center; align-items: center; }
#main-nav .menu a:hover,
	#main-nav .menu .current_page_item a { text-decoration: none; background-image: url(/wp-content/plugins/sphradio-voting-campaigns/kiss92-dec2018/imgs/bg-nav-button-hover.png); color: #fff; }

#main-nav .menu a div { margin-left: 0.5em; font-size: .35em !important; line-height: 1.1 !important; font-weight: 700 !important; }
#main-nav .menu a span { display: block; }
#main-nav .menu a span:first-child { margin-bottom: 0.5em; position: relative; }
#main-nav .menu a span:first-child:after { content: ''; display: block; position: absolute; left: 50%; bottom: -0.3em; margin-left: -.25em; width: .5em; height: .1em; background: #000; }
#main-nav .menu a:hover span:first-child:after,
  #main-nav .menu .current_page_item a span:first-child:after { background: #fff; }

	
#footer { margin-top: 3em; background-color: transparent; }
#footer-background { margin: 0 -15px; }
#footer-background img { display: block; }
#footer-text { margin: 0 -15px; padding: 1em; background: #f4c0d6; }
#footer-text p { margin: 0 0 10px; font: 700 1em/1.2 "Oswald" !important; text-transform: uppercase; text-align: center; color: #000 !important; }
#footer::before { background: none; }

#sponsor-box > h3 { margin-top: 0; }
#sponsor-box .logo { max-width: 130px; }

#form-field-container .btn { margin-top: 1em; }

#successful-message { display: none; text-align: center; margin: 60px 0; }

#pagination a { margin-bottom: .5em; }

.voting-tc { text-align: left !important; }
.voting-tc ol { padding-left: 40px; }
.voting-tc li { padding: 0; }

.mfp-counter { font-size: 12px !important; }

#voting-form {
    display: block;
}
#voting-form #submitform {
    background-color: #b62080;
    border-color: #b62080;
    color: #fff;
    display: inline-block;
    padding: 6px 12px;
    margin: 0 auto;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    height: auto;
    width: auto;
    right: auto;
    position: static;
    font-family: 'Oswald';
}
#voting-form input[type='submit']:hover {
    background-color: #b62080;
    border-color: #b62080;
}
.sph_submit_btn_con { text-align: center; margin-bottom: 60px;}

.tnc-msg input { margin: 0 5px 5px 0; }

.row { margin: auto; }

@media ( max-width: 1200px ) {
	.display-1 { width: 100%; }
	
	#main-nav .menu a { font-size: 2.2em !important; }
}

@media ( max-width: 1000px ) {
	.box-text { width: 80%; }
	
	#main-nav .menu a { font-size: 2.4rem !important; }
}

@media ( max-width: 960px ) {
	.news-list-1 > li { width: 32%; }
}

@media ( max-width: 768px ) {
	.sort-selector { text-align: center; }
	.sort-selector > div { float: none; display: inline-block; }
	
	.table { font-size: 15px !important; }
	.table .artist { width: 40%; }
        #form-left, #form-right, #pagination {padding: 0}
}

@media ( max-width: 700px ) {
	.box-text { width: 90%; }
	
	.news-list-1 > li { width: 49%; }

	.leader-banner { float: none; clear: both; margin: 0; padding-top: 1em; }
}

@media ( max-width: 650px ) {
	.display-1 > .main-screen { width: auto; padding-bottom: 56%; }
        #voting-form { margin: auto; }
        #footer { margin-bottom: 0 }
}

@media ( max-width: 600px ) {
	iframe { max-width: 100%; width: auto; height: auto; }
	
	.box-text { width: 100%; }
	
	#sponsor-box { text-align: center; margin-bottom: 2em; }
}

@media ( max-width: 550px ) {
	.result-table th,
        .result-table td { padding: 4px 10px; }

}


@media ( max-width: 500px ) {
	body, div, p, th, td { font-size: 16px !important; }
	
	#form-field-container { padding-left: 0; padding-right: 0; }
	#form-field-container .form-horizontal { padding-left: 0; padding-right: 0; }
	#form-field-container label { padding-right: 0; }
}

@media ( max-width: 450px ) {
	#main-nav .menu a { font-size: 2rem !important; }
}

@media ( max-width: 400px ) {
	.table > tbody > tr > td { font-size: 14px !important; }

	.result-table th,
		.result-table td { padding: 4px; }
	
	.news-list-1 > li { width: 100%; }
	
	#main-nav .menu li { display: block; }
	#main-nav .menu li a { margin: 0 auto; }

	#outer-wrapper { padding-left: 0; padding-right: 0; }
	
	#search-form a { background-size: 100% 100%; }
}

@media ( max-width: 360px ) {
	body, div, p, th, td { font-size: 14px !important; }
	
	#main-nav .menu a { font-size: 1.8rem !important; }
}

@media ( max-width: 320px ) {
	body, div, p, th, td { font-size: 13px !important; }
}
.intl-tel-input .country-list{
	max-width:300px;
	font-size:12px;	
}
img.playbtn{margin-top: 5px;}
input[type="checkbox"]{
	width:14px;
	height:14px;
	outline: none;
	outline-offset:0px;
}
input[type="checkbox"]:focus{
	width:14px;
	height:14px;
	outline: none;
	outline-offset:0px;
}