﻿.frontTopCol { width:100%; }
.frontLeftCol { float:left; width:640px; }
.frontRightCol { float:right; width:300px; }

.gbox { margin: 0 20px 20px; }

.frontLeftCol .gbox { max-width:600px; }

/*.gbox.gbNews { background: #881e1e; width:910px; padding:5px 0; }*/

.gbVideos .boxhead { background-color: #194150; background-position:0 -202px; }
.gbVideos iframe, .gbVideos > div + div { width:600px; height:338px; }

.gbDefTrack .boxhead { background-position:0 -402px !important; }

.topRotator { width:600px; height:380px; margin:10px 20px 20px; position:relative; }

.LinkBig { font-size:11pt; }
.LinkBig:hover { color:#4c7bfc; text-decoration:none; }

/* --- What's New Rotator --- */
.swiper-container {
    height: 380px; background-color:#000;
}   
.swiper-slide {
        background-position:50%; background-size:cover;
}
.topRotator .swiper-pagination-bullet { width:10px; height:10px; margin:0 7px !important; }
.topRotator .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) { background-color:#ccc; }

.newImage { width:100%; }
.overnewsbox {
    display:block;position:absolute; top:0; height:380px; width:100%;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+75,0.5+84,0.6+100 */
}
.overnewsbox p {
    color:#fff; text-align:center; position:absolute; bottom:0; padding:5px 0 32px; 
    text-shadow:2px 2px 10px #000; font-weight:bold;
    width:100%; margin:0 auto; font-size:9.5pt; background-color:rgba(0,0,0,0.7);
}
.newdesc { font-weight:bold; display:block; padding-top:3px; font-size:11pt; }

.swiper-button-next, .swiper-button-prev { 
    padding:10px 5px; 
    margin-top: -27px !important; 
    background-color:rgba(0,0,0,0.4); 
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left:0 !important; padding-left:10px; }
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right:0 !important; padding-right:10px; }

.topRotator .swiper-button-next, .topRotator .swiper-button-prev { opacity:0; transition: opacity 500ms; }
.topRotator:hover .swiper-button-next, .topRotator:hover .swiper-button-prev { opacity:1; }

/* --- More What's New --- */

.newsMoreSect { margin:-3px 15px 18px; width:610px; }
.newsItem {
    width: 50%;
    float: left;
    box-sizing: border-box;
    /*padding: 4px;*/
    border: 5px solid transparent;
    position:relative;
    text-align:left;
}
.newsItemImg {
    background-position:50%; background-size:cover;
}
.overNewsItem, .newsItemImg { height:160px; display:block; }
.newsItemImg:hover { filter:brightness(120%); }
.newsItemTitle { 
    margin:0; padding:1rem 0.5rem; opacity:0.9;
    color:#fff; position:absolute; bottom:0px;
}
.newsItemTitle span, .newsItemTitle p.newsItemCat { 
    background-color: #000; display:inline; 
    -webkit-box-decoration-break:clone; box-decoration-break: clone; 
    padding:3px 11px;
}
.newsItemTitle p { font-size:10.5pt; margin:0; color:#fff; }
p.newsItemCat { font-size:9pt; }


.gbox.gbEvents { width:auto; }

.topTracksHorz a:link, .topTracksHorz a:visited { color: #d0e0f5; }
.topTracksHorz a:hover { color: #5c8bf5; }

table.toptracks { width:263px; }
div.toptracks { padding:2px 0; }
.toptracks p { margin: 0 2px 2px; }
.toptracks td { vertical-align:middle; font-size:9pt; }
.ttimage { text-align:center; width:40px; }
.ttimage img { width:38px; height:38px; }
.ttName { padding:0 10px 0 2px; }
.ttName, .dtArtist { color:#d0e0f5; }
.ttTitle { font-size: 8.5pt; font-weight:normal; color:#fff; }


.frontRightCol .gbox.gbInterview { margin-left:0; }
.gbListen p { margin: 5px 0 0; text-align:center; color:#fff; }

.listenContent { padding:1px 5px 5px; min-height:72px; }
.listenText { font-size:10pt; padding:0 5px; }
.listenStuff { text-align:center; }
.listenStuff p { margin:0.5em 0 0; line-height:32px; }

.listenPlayer { height:165px; padding:0px; background: transparent url('../pic/loading10.gif') no-repeat scroll center center; }

.tListenLink { margin-top:10px; height:55px; }
.tListenLink a.playLink { margin-top:12px; }
.tListenLink audio { width:100%; margin-top:12px; }
.showPlaya { width:100%; max-width:260px; }

.interviewPlayer { padding:8px 7px 3px; } 
.interviewPlayer iframe, .listenPlayer2 > div { height:20px; }
.interviewPlayer > div { overflow:hidden; margin:0 0 12px; }  
.interviewPlayer .playBtn { display:block; height:20px; width:20px; float:left; }
.interviewPlayer p { margin:0; line-height:20px; }
.interviewPlayer div p { text-align:left; padding-left:30px; }
.interviewPlayer > div a { color:#fff; }
     
#divEventsBox { position:relative; }
.eventWords { height:auto; }
.gbox div.boxfoot { padding:5px 0; }
    
.frontRightCol .gbox { margin-left:0; }

.frontRightCol .gbox:first-child { margin-top:10px; /*height:273px;*/ }
.frontRightCol .gbox.gbTopTracks { width:auto; }

.gbDefTrack { position:relative; }
.gbDefTrack h3 { color:#a9a36C; float:right; margin:2px 2px 0; font-size:9pt; font-weight:normal; }
.deftrack { max-height:58px; padding:3px 2px; overflow-y:hidden; text-overflow:ellipsis; }
.deftrack img { width:58px; height:58px; float:left; margin:0 8px 0 0; }
.dtArtist { margin:2px 0; font-size:8.5pt; }
.dtTitle { margin:0; font-size:9pt; max-height: 39px; overflow: hidden; }
#aDefVote { position:absolute; bottom:0; right:4px; background:#2A2C38; padding:1px 0 1px 4px; }


.topTracksHorz { margin: 0; padding: 0 0 4px 4px; }
.topTracksHorz > div { float:left; width:100%; text-align:left; color: #dcebf5; }
.topTracksHorz > div > div { 
    margin:5px 4px 0 0; height:64px; overflow:hidden; position:relative; padding:0;
    font-size:10pt;
}
.topTracksHorz img { width:64px; height:64px; float:left; margin:0 10px 0 0; }
.ttNumBox { height:64px; float:left; width:30px; }
.ttNum { 
    background-repeat: no-repeat; background-attachment: scroll; 
    background-image: url(../pic/numbers-blue2.png); 
    width:32px; height:32px; margin-left:-3px;
}
.topTracksHorz > div, .topTracksHorz .ttTitle { font-size:10pt; }
.topTracksHorz .ttTitle { display:block; padding:1px 0 0; }
.topTracksHorz p { padding: 0; margin:0; height:59px; overflow-y:hidden; }
.ttSub { font-size:0.9em; }


#divSocial { text-align:center; margin: 0 20px -8px; }
#divSocial div { margin-bottom: 28px; }
#divSocial a { margin:0 15px; display:inline-block; }
#divSocial img { width:40px; height:40px; }

_:-webkit-full-screen:not(:root:root), .safariStupid { width:2px; height:380px; background-color:#232531; position:absolute; 
                left:-1px; top:0px; z-index:2; }


@media only screen and (max-width: 768px) 
{
    .supergorilla { min-width:768px; }
    .frontLeftCol { width:460px !important; }
    .frontRightCol { margin-top:0; }
    .gbVideos iframe, .gbVideos > div + div { width:450px !important; height:253px !important; }
    .newsLeft, .newsMonkey, .newsImage, .newsImage span { width:420px; }
    a.newsLink { font-size:8.3pt; }

    .frontLeftCol .gbox, .topRotator { 
        width:450px !important; 
        margin: 0 10px 15px;
    }

    .newsMoreSect { margin: 0 7px 15px; width:456px; }

    .frontRightCol .gbox { margin: 0 10px 15px 0; }

    .topRotator { margin-top:10px; }
    .topRotator, .swiper-container, .overnewsbox { height:340px; }

    .topTracksHorz > div > div { height: 58px; }
    .topTracksHorz img { width:58px; height:58px; float:left; }
    .topTracksHorz > div, .topTracksHorz .ttTitle { font-size:8.5pt; }
}
