/*------------------------------------------------------------------------------
FONT
------------------------------------------------------------------------------*/
@font-face{
    font-family:"dejavu";
    src:url("/font/dejavu.eot");
    src:local("?"),url("/font/dejavu.woff")
        format("woff"),url("/font/dejavu.ttf")
        format("truetype"),url("/font/dejavu.svg#filename")
        format("svg")
}
/*------------------------------------------------------------------------------
RESET
------------------------------------------------------------------------------*/
html,body{
    background:#f1f1f1;
    color:#222;
    margin:0;padding:0;
    font-family:"dejavu", Arial, sans-serif !important;
    font-size: 1em;
    overflow-y:scroll;
    overflow-x:hidden;
}
font{
    font-family:"dejavu", Arial, sans-serif !important;
}
a{
    color:#08c;
}
/*------------------------------------------------------------------------------
WRAPPER
------------------------------------------------------------------------------*/
#wrapper {
    position:absolute;
    top:0;left:0;right:0;
    min-width:240px;
    min-height:100%;
    background:#fff;
    line-height: 24px;
    overflow:hidden;
}
/*------------------------------------------------------------------------------
HEADER
------------------------------------------------------------------------------*/
#header{
    border-top:5px solid #222;
    background:#fff;
}
#header .container-fluid{
    position:relative;
    margin:0 auto;
    padding:20px 0px 20px 0px;
}
@media only screen
and (max-width: 1170px) {
    #header .container-fluid{
        margin:0px 20px auto;

    }
}
@media only screen
and (max-width: 1024px) {
    #header .container-fluid{
        padding:10px 0px 10px 0px;
        margin:0px 10px auto;
    }
}
@media only screen
and (max-width: 875px) {
    #header{
        padding:0px;
    }
}
#logo img{
    width:100%;
    max-width:600px;
    min-width:100px;
}
@media only screen
and (max-width: 1024px) {
    #logo img{
        width:100%;
        max-width:550px;
    }
}
@media only screen
and (max-width: 768px) {
    #logo img{
        width:100%;
        max-width:450px;
    }
}
@media only screen
and (max-width: 650px) {
    #logo img{
        width:100%;
        max-width:340px;
    }
}
@media only screen
and (max-width: 550px) {
    #logo img{
        margin:0 5% 0 5%;
        max-width:90%;
    }
}
/*------------------------------------------------------------------------------
BANNER
------------------------------------------------------------------------------*/
#banner{
    position:relative;
    background:rgba(34,34,34,1);
    text-align:center;
    max-height:300px;
    min-height:100px;
    overflow:hidden;
    border-top:2px solid #222;
    border-bottom:2px solid #222;
    -moz-box-shadow: 1px 2px 3px rgba(0,0,0,.5);
    -webkit-box-shadow: 1px 2px 3px rgba(0,0,0,.5);
    box-shadow: 1px 2px 3px rgba(0,0,0,.5);
}
@media only screen
and (max-width:550px) {
    #banner{
        display:none;
    }
}
#banner .title{
    z-index:3;
    position:absolute;
    left:0px; bottom:50%;
    background:rgba(34,34,34,.65);
    color:#fff;
    height:100px;
    margin-bottom:-50px;
    padding:0px 20px 0px 20px;
    border-top-right-radius:5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-top-right-radius: 5px;
    border-bottom-right-radius:5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-bottom-right-radius: 5px;
    line-height:100px;
    font-size:2.500em;

}
@media only screen
and (max-width: 980px) {
    #banner .title{
        height:70px;
        margin-bottom:-35px;
        font-size:1.8em;
        line-height:70px;
    }
}
@media only screen
and (max-width: 768px) {
    #banner .title{
        height:50px;
        margin-bottom:-25px;
        font-size:1.5em;
        line-height:50px;
    }
}
#banner img{
    z-index:2;
    position:relative;
    width:100%;
}

/*------------------------------------------------------------------------------
MENU BUTTONS
------------------------------------------------------------------------------*/
#btn-container{
    z-index:1000;
    position:absolute;
    right:0px;top:50%;
    color:#222;
    height:88px;
    width:200px;
    margin-top:-44px;
    text-align:center;
    cursor:pointer;
    font-size:24px;
}
#btn-container img{
    height:88px;
}
@media only screen
and (max-width: 1024px) {
    #btn-container{
        height:80px;
        width:165px;
        margin-top:-40px;
    }
    #btn-container img{height:80px;}
}
@media only screen
and (max-width: 768px) {
    #btn-container{
        height:70px;
        width:165px;
        margin-top:-35px;
    }
    #btn-container img{height:70px;}

}
@media only screen
and (max-width: 650px) {
    #btn-container{
        height:66px;
        width:169px;
        margin-top:-33px;

    }
    #btn-container img{height:66px;}
}
@media only screen
and (max-width: 550px) {
    #btn-container{
        display:none;
    }
}
#btn-menu,#btn-search{
    color:#222;
}
#btn-menu{
    margin-right:35px;
}
#btn-menu:hover,#btn-search:hover{
    color:#08c;
}
/*------------------------------------------------------------------------------
Mobile Menu
------------------------------------------------------------------------------*/
#btn-mobile-container{
    width:100%;
    background:#222;
    display:none;
}
@media only screen
and (max-width: 550px) {
    #btn-mobile-container{
        display:block;
    }
}
#btn-mobile-container .btn-group{
    width:100%;
    margin:0;
}
#btn-mobile-container button{
    width:50%;
    border-radius:0;
}
/*------------------------------------------------------------------------------
NAV
------------------------------------------------------------------------------*/
#nav-container .container-fluid{
    position:relative;
    padding:0;
    background:#222;
    z-index:999999999;
}

#nav{
    z-index:999999999;
    position:absolute;
    right:0px;
    width:390px;
    height:500px;
    background:#222;
    margin:0 auto;
    margin-top:-30px;
    padding:10px;
    border-radius:10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    display:none;
}
#nav .masonry{
    background:transparent;
}
#nav .brick{
    display:inline-block;
}
/*1170 3x4*/
@media only screen
and (max-width: 1170px) {
    #nav{
        right:20px;
    }
}
/*1024 3x4 */
@media only screen
and (max-width: 1024px) {
    #nav{
        right:0;
        margin-top:-25px;
    }
}
/*875 6x2
@media only screen
and (max-width: 875px) {
    #nav{
        width:875px;
        height:252px;
        margin-top:0;
        padding:5px 0% 5px 0px;
        position:relative;
        top:0;right:0;
        border-radius:0;
    }
}
/*873 - 4x3*/
@media only screen
and (max-width: 768px) {
    #nav{
        width:521px;
        height:375px;
        margin-top:0;
        position:relative;
        top:0;right:0;
        border-radius:0;
    }
    #nav .arrow{
        display:none;
    }
}
/*543 - 3x4*/
@media only screen
and (max-width: 550px) {
    #nav{
        width:390px;
        height:500px;
    }
}
/*406 - 2x6*/
@media only screen
and (max-width: 390px) {
    #nav{
        width:259px;
        height:750px;
    }
}
/*270 - 1x12*/
@media only screen
and (max-width: 270px) {
    #nav{
        width:128px;
        height:1475px;
    }
}
/*875 - 6x2*/
@media only screen
and (max-height: 599px)
and (min-width:825px) {
    #nav{
        width:800px;
        height:250px;
    }
}
/*875 - 4x3*/
@media only screen
and (min-height: 600px)
and (max-height:725px)
and (min-width:768px){
    #nav{
        width:521px;
        height:380px;
    }
}
@media only screen
and (max-height: 599px)
and (min-width:768px)
and (max-width:824px){
    #nav{
        width:521px;
        height:375px;
        margin-top:0;
        position:relative;
        top:0;right:0;
        border-radius:0;
    }
    #nav .arrow{
        display:none;
    }
}

#nav .arrow{
    position:absolute;
    right:120px; top:-18px;
    font-size:50px;
}

/*------------------------------------------------------------------------------
NAV BUTTONS
------------------------------------------------------------------------------*/
#nav .btn-nav{
    width: 100px;
    height:100px;
    padding:8px;
    margin:5px;
    text-align:center;
    cursor: pointer;
    color:#f1f1f1;
}/*
@media only screen
and (max-width: 875px) {
    #nav .btn-nav{
        padding-left:15px;
        padding-right:15px;
    }
}
@media only screen
and (max-width: 560px) {
    #nav .btn-nav{
        margin:3px;
    }
}*/
#nav .btn-nav:hover{
    background-color:#08c;
    border-radius:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#nav .btn-nav.active{
    background-color:#08c;
    border-radius:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#nav .icon{
    width:50px;
    height:50px;
    margin-top:10px;
    font-size:2.500em;
    line-height:50px;
}
#nav .title-icon{
    font-size:1em;
}
#nav a:hover{
    text-decoration:none;
}

/*------------------------------------------------------------------------------
Filter
------------------------------------------------------------------------------*/
#filter{
    margin:1px 0px 0px 0px;
    padding-top:2px;
}
@media only screen
and (max-width: 768px) {
    #filter {
        width:100%;
    }
}
#filter-search{
    margin-top:-1px;
}
#filter-search input{
    color:#08c;
    width:300px;
}
@media only screen
and (max-width: 768px) {
    #filter-search input{
        text-align:center;
        width:100%;
    }
}

@media only screen
and (max-width: 768px) {
    #filter-search .input-append{
        width:100%;
    }
}
#filter-search i{
    font-size:18px;
    color:#08c;
    line-height:.5
}
@media only screen
and (max-width: 768px) {
    #filter-search .btn-filter{
        position:absolute;
        margin-left:-42px;
        z-index:99;
    }
}
.option{
    cursor:pointer;
}
.option.active{
    background-color: #0081c2;
    color: #fff;
    background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
    background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
    background-image: -o-linear-gradient(top, #0088cc, #0077b3);
    background-image: linear-gradient(to bottom, #0088cc, #0077b3);
    background-repeat: repeat-x;
}
.btn-dropdown .btn,.btn-dropdown .caret{
    color:#08c;
}
#filter i.icon-caret-down{
    font-size:12px;
    line-height:1;
}
@media only screen
and (max-width: 768px) {
    .btn-dropdown{
        margin-top:5px;
    }
    .btn-dropdown,.btn-dropdown .btn, #filter-category .dropdown-menu{
        width:100%;
    }
}
@media only screen
and (min-width: 768px) {
    #filter-category .dropdown-menu{
        left: -65px;
    }
}
#filter-language{
    margin-left:0;
    margin-top:2px;
}
#filter-category{
    margin-top:2px;
}
@media only screen
and (min-width: 768px) {
    #filter-language .dropdown-menu{
        left: -90px;
    }
}
/*------------------------------------------------------------------------------
PAGE
------------------------------------------------------------------------------*/
#page{
    z-index:0;
    background:#fff;
    padding-bottom:175px;
    /* This cannot be position: relative; as it messes up the album view */
}
@media only screen
and (max-width: 768px) {
    #page{
        padding-bottom:225px;
    }
    #page-info {
        margin: 0.5em 1em 0;
    }
    #page-info p {
        display: inline-block;
    }
}

@media only screen
and (min-width: 769px) {
    #page-info {
        position: absolute;
        right: 0;
        margin-top: 2em;
        max-width: 12em;
    }
}


/*------------------------------------------------------------------------------
CONTENT
------------------------------------------------------------------------------*/
#content{
    padding-top:35px;
}
@media only screen
and (max-width: 768px) {
    #content{
        padding-top:20px;
        padding-bottom:20px;
    }
}

#content p, #content li {
    line-height: 1.5em;
}

#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
    margin: 0.5em 0;
}

/*------------------------------------------------------------------------------
SUBMENU
------------------------------------------------------------------------------*/
#subnav{
    margin-bottom:25px;
}
.well {
    background:#f1f1f1;
    border:1px solid #e3e3e3;
    border-radius:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.well .nav-list >li >a{
    padding:10px;
    text-shadow:none;
}
.well .nav-list >li >a:hover{
    background-color:#222;
    color:#f1f1f1
}
.well.affix{
    width: auto;
    top: 20px;
}
@media only screen
and (max-width: 768px) {
    .well.affix{
        position: static;
        width: auto;
        top: 0;
    }
}

/*------------------------------------------------------------------------------
BACK-TO-TOP
------------------------------------------------------------------------------*/
.backtotop{
    color:#999;
    cursor:pointer;
    width:100%;
    padding-top:15px;
}
.backtotop.phone{
    display:none;
}
@media only screen
and (max-width: 768px) {
    .backtotop.phone{
        display:block;
    }
}
.backtotop:hover{
    color:#08c;
}
.backtotop i{
    font-size:1.2em;
}

/*------------------------------------------------------------------------------
BUTTONS
------------------------------------------------------------------------------*/
.btn-group{
    margin-bottom:2px;
}
.btn-request i{
    color:orange;
}
.btn-pdf i{
    color:red;
}
.btn-epub i{
    color:green;
}
.btn-mobi i{
    color:#08c;
}
.btn-group-media{
    margin:2px;
    float:right;
}
@media only screen
and (max-width: 768px) {
    .btn-group-media{
        float:left;
    }
}
/*------------------------------------------------------------------------------
Icon
------------------------------------------------------------------------------*/

.icon-cloud-download{
    color:green;
}
.icon-play,.icon-pause,.icon-plus{
    color:#08c;
}
.icon-share-alt{
    color:#555;
}

/*------------------------------------------------------------------------------
TYPOGRAPHY
------------------------------------------------------------------------------*/
.title{
    color:#08c;
    font-size:1.250em;
    cursor:pointer;
}
.title-black{
    font-size:1.8em;
    padding-bottom:20px;
}
.title-event{
    font-size:1.15em;
    color:#08c;
    cursor:pointer;
}
.bold{
    font-size:1.250em;
}

/*------------------------------------------------------------------------
MISC
------------------------------------------------------------------------------*/
.border {
    margin-top:25px;
    margin-bottom:25px;
    width:100%;
}
.border-home{
    display:none;
}
@media only screen
and (max-width: 768px) {
    .border-home{
        display:block;
    }
}
.noscroll{
    overflow-y:hidden;
    margin-right:30px;
}
#loading{
    position:absolute;
    z-index:999999;
    background:rgba(241,241,241,.7);
    width:100%;height:100%;
    padding-top:10%;
    border-top:2px solid #222;
    text-align:center;
    font-size:50px;
    color:gray;
    display:none;
}
.center{
    text-align:center;
}

#link-language {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000000;
    color: #222;
    background-color: #f2f2f2;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom-right-radius: 0.5em;
    text-decoration: none;
    transition: background-color 0.5s ease;
    display: block;
    padding: 0.25em 0.5em;
    color: inherit;
}

#link-language:hover {
    background-color: #ddd;
}

@media only screen and (min-width : 576px) {
    #link-language {
        padding: 0.5em 1em
    }
}

.flag {
    height: 16px;
    display:inline-block;
    vertical-align:middle;
}
.flag.flag-th {
    width:24px;
    margin-top:-2px;
    background-image:url(data:image/gif;base64,R0lGODlhGAAQALMAAB4XSvj4+uwVHYuHovBES/3s7SMcTu0cJI6KoiAYTQAAAAAAAAAAAAAAAAAAAAAAACH5BAAHAP8ALAAAAAAYABAAAARA8MhJq50i6827JmAojmRYnGiqrmjgvnAsv0Nt33huA3zv/8CeYUgsGo/IpJIYbDp10OhsSmVZr6Ws1sPtXr7gCAA7);
}
.flag.flag-us {
    width:30px;
    margin-top:-3px;
    background-image:url(data:image/gif;base64,R0lGODlhHgAQAOYAACknX9SDjb0/T68XKvjs7YmHp+KrssVWY1dWg+SrscKaqUpLe4OCo76QocVUYqQ8U6dSZspga9DL2D8+cOWzulpciLRwhDo5bFRTfzo4bWFgipocNUdGdeGvtpGTsapPY7pmdWVljVBPfI6Mq1tahdWFj8libVZWgV9eiUA/cfnt785kbVpYgzw7bmhnj0ZIechXY4mMq4aGpl5dh+OyuOW1u7MWKE1Mejs9cFpbh8E/Tj5AclFQfVhYhcVWYpSTsEJBcVVUgWBfiIWEpMtgaj48b+Gxt1ZWg+OxuU5NfFJRf4+PrGJiikhKeFxbhl5ciUhHd5OSrmppj+Wrsee0uteDjVpYhVxah+Wzu1RSgVxbhVhYg05MekJBclBPfuOzueGxuVBOfj9Cc2FgiQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAHAP8ALAAAAAAeABAAAAfXgC0TF0AXEy0pGUWLGzYDj5CRkgMXLCwzCCQkKCeaShZVAaKjpKUBLVZWMyxOTiiZJEoNCQa1tre4Bhc8YzchGE5KGlsVYg86AsnKy8wCLRoYUklMCC4iKJYSBNvc3d7bFxgzGEKZCKssLx8wB+3u7/AHLSeYQpaXMzNNClQU/v8AA1IAkIRDkC5eoBxMkqQJhBUmIkqcSNHEkCUyfjBYUiDKkBEjPICIULGkxH8dKBhZydJIjZcwY8qEGa+mzZvfcurc2aynz5+5ggodaqqo0aOTkipdGggAOw==);
}

/*------------------------------------------------------------------------------
MEDIA OBJECTS
------------------------------------------------------------------------------*/
.media-object{
    border:1px solid #ddd;
    -moz-box-shadow: 0px 1px 4px 1px #e3e3e3;
    -webkit-box-shadow: 0px 1px 4px 1px #e3e3e3;
    box-shadow: 0px 1px 4px 1px #e3e3e3;
}
@media (max-width: 367px){
    .media.books .pull-left, .media.residents .pull-left {
        float:none;
    }
}
.body{
    padding-top:10px;
}
.img-speakers{
    max-height:60px;
}
.img-books{
    max-height:150px;
    margin-right:10px;
}
.img-residents{
    margin-right:10px;
}
/*------------------------------------------------------------------------------
GALLERY
------------------------------------------------------------------------------*/
.gallery{
    border:1px solid #ddd;
    -moz-box-shadow: 0px 1px 4px 1px #e3e3e3;
    -webkit-box-shadow: 0px 1px 4px 1px #e3e3e3;
    box-shadow: 0px 1px 4px 1px #e3e3e3;
    margin-right:10px;
    margin-bottom:10px;
    width:216px;
    overflow:hidden;
    padding:0;
}
.gallery h3{
    font-size:1.125em
}
.gallery img{
    width:100%;
}
.gallery .caption{
    padding:10px;
    text-align:center;
    font-size:0.8em;
}
.gallery .caption p:hover{
    text-decoration:none;
}
.gallery .date{
    font-size:0.875em;
    color:#222;
}
/*------------------------------------------------------------------------------
ALBUM
------------------------------------------------------------------------------*/
.album{
    width:100%;
    max-width:174px;
    margin-right:5px;
    margin-bottom:5px;
}
.album .image{
    width:100%;
    max-width:174px;
}
.album .image img{
    width:100%;
}
/*------------------------------------------------------------------------------
SLIDESHOW
------------------------------------------------------------------------------*/
/*slideshow*/
#slideshow{
    position:absolute;
    z-index:555555;
    top:0;
    left:0;
    width:100vw;
    height:100vh;
}
#slideshow .carousel-inner{
    text-align:center;
    background:#222;
    width:100%;
    height:100%;
}
#slideshow .carousel-inner .item {
    width:100%;
    height:100%;
}
#slide {
    width:100%;
    height:100%;
}
#slide img{
    display: block;
    max-width: 100%;
    height: auto;
    margin:0 auto;
    max-height:100%;
}
#slide-caption{
    position:absolute;
    bottom:0;
    text-align:center;
    padding-left:75px;
    padding-right:75px;
}
@media only screen
and (max-width: 800px) {
    #slide-caption h4{
        font-size:14px;
    }
}
@media only screen
and (max-width: 400px) {
    #slide-caption{
        display:none;
    }
}
#slideshow .carousel-indicators{
    margin-right: 3%;
    margin-top: 2%;
}
#slideshow .carousel-indicators i{
    padding-left:4px;
    padding-right:4px;
    background:#222;
    border-radius:100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border:0px;
}
@media only screen
and (max-width: 400px) {
    #slideshow .carousel-indicators i{
        font-size:30px;
        padding-left:2px;
        padding-right:2px;
    }
}
#slideshow .carousel-indicators a{
    color:#f1f1f1;
    font-size:50px;
    cursor:pointer;
}
#slideshow .carousel-indicators a:hover{
    color:rgba(241,241,241,.8);
    text-decoration:none;
}
#slideshow .carousel-control{
    top:50%;
    color:#f1f1f1;
    font-size:50px;
    opacity:1;
    cursor:pointer;
    border:none;
    background:none;
}
@media only screen
and (max-width: 1400px) {
    #slideshow .carousel-control{
        bottom:12px;
        top:initial;
    }
}
@media only screen
and (max-width: 400px) {
    #slideshow .carousel-control{
        font-size:30px;
    }
}
#slideshow .carousel-control:hover{
    color:rgba(241,241,241,.8);
}
#slideshow #next{
    margin-right:3%;
}
#slideshow #prev{
    margin-left:3%;
}


/*------------------------------------------------------------------------------
FOLD
------------------------------------------------------------------------------*/
#fold{
    z-index:1;
    bottom:0;
    width:100%;
}
#fold .row-fluid [class*="span"]{
    height:58px;
}
#fold .btn i{
    color:#08c;
}
.tab{
    width:2em;
    margin-top: -69px;
    padding:10px 5px 10px 5px;
    border-top-right-radius:5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-top-left-radius: 5px;
    cursor:pointer;
    text-align:center;
    font-size:25px;
}
.tab:hover{
    color:#08c;
}
#footer{
    position:absolute;
    z-index:99999;
    bottom:0;
    width:100%;
    background:#f1f1f1;
    color:#222;
    padding-top:21px;
    padding-bottom:16px;
    border-top:2px solid #e3e3e3;
    border-bottom:5px solid #222;
}
#footer .tab{
    background: #f1f1f1;
    border:2px solid #e3e3e3;
    border-bottom:2px solid #f1f1f1;
}
#footer .link{
    display:inline-block;
}
#copyright{
    margin-top:-8px;
    font-size:0.875em;
}

/*------------------------------------------------------------------------------
AUDIOPLAYER
------------------------------------------------------------------------------*/
#audioplayer{
    z-index:999;
    bottom:-2px;
    background:#222;
    border-top:2px solid #08c;
    color:#f1f1f1;
    font-size:14px;
}
@media only screen
and (max-width: 979px) {
    #audioplayer{
        position:fixed;
    }
}
@media only screen
and (max-width: 480px) {
    #audioplayer{
        position:absolute;
    }
}
#audioplayer .audioplayer-inner{
    display:none;
}
.audioplayer-inner .container-fluid{
    padding-top:21px;
    padding-bottom:21px;
}
#audioplayer #text{
    height:58px;
    overflow:hidden;
    line-height:1.3;
}
#audioplayer #speaker{
    max-width:56px;
    border:1px solid #f1f1f1;
    box-shadow:none;
}
#audioplayer #time-container .row-fluid{
    margin-top:5px;
}
@media only screen
and (max-width: 768px) {
    #audioplayer #time-container .row-fluid .media{
        margin-top:15px;
    }
}
#audioplayer #time{
    border-radius:0px;
    position:relative;
    margin-bottom:2px;
    margin-top:5px;
    height:10px;
    cursor:pointer;
}
#buffer{
    background:#b1b1b1;
    background-image:none;
}
#audioplayer .btn.play{
    font-size: 18px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    padding: 8px 10px 8px 10px;
    margin-top:0px;
    height:38px;
    width:38px;
}
#audioplayer .btn.play i{
    margin-left:2px;
}
#audioplayer .btn.play .icon-pause{
    margin-left:0px;
}
#audioplayer #volume{
    height:6px;
    margin-top:7px;
    cursor:pointer;
    border-radius:0px;
}
#audioplayer #volume-container{
    max-width:110px;
}
#audioplayer #volume-container .media-body{
    margin-top:5px;
}
@media (max-width: 1024px){
    #volume-container{
        display:none;
    }
}
#audioplayer #volume-container i{
    margin-left:5px;
    font-size:18px;
    line-height:1.15;
}

@media (max-width: 768px){
    #time-container,#info-container {
        width:75%;
        margin-left:15%;
    }
}
@media (max-width: 480px){
    #time-container,#info-container {
        width:100%;
        margin-left:0;
    }
}
#audioplayer .tab{
    background: #222;
    margin-top:-49px;
    border:2px solid #08c;
    border-bottom:2px solid #222;
}
@media (min-width: 768px){
    #audioplayer .container-fluid{
        padding-right:30px;
    }
}
@media (min-width: 769px){
    #audioplayer .container-fluid{
        padding-right:20px;
    }
}

/*------------------------------------------------------------------------------
Search
------------------------------------------------------------------------------*/
#search{
    display:none;
}
@media only screen
and (max-width: 768px) {
    #search{
        padding:0px
    }
}
#search .container-fluid{
    padding:0px 20px 20px 20px;
}
@media only screen
and (max-width: 550px) {
    #search #search-input{
        background:#222;
    }
}
@media only screen
and (max-width: 768px) {
    #search .container-fluid{
        padding:10px 10px 10px 10px;
    }
}
#search .input-append{
    width:100%;
}
/*#search input{
    width:100%;
    height:40px;
    padding:0px;
    text-align:center;
}*/
@media only screen
and (max-width: 768px) {
   /* #search input{
        width:100%;
        height:42px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
    }*/
}
#search .btn{
    z-index:999999;
    position:absolute;
    height:42px;
    width:70px;
    margin-left:-70px;
    font-size:18px;
    background-color: #0088cc;
    background-image: none;
}
@media only screen
and (max-width: 550px) {
    #search .btn{
        margin-top:-1px;
        height:43px;
        width:55px;
        margin-left:-55px;
    }
}
#search-results_wrapper{
    display:none;
}
#search-results .url{
    color:#093;
}
#search-results .desc{
    font-size:14px;
}
#search-results .match{
    color:orange;
}
#search-results .title{
    text-decoration:underline;
}

/*google custom search*/
.gsc-input{
    vertical-align: top !important;
    box-shadow:none !important;
    -webkit-box-shadow:none !important;
    -moz-box-shadow: none !important;
    background:none !important;
    text-align:center;
}
table.gsc-search-box td {
vertical-align: top  !important;
}
.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 {
margin-top:0px !important;
}
.gs-title{
    line-height:20px !important;
}

/*Audio Subscriptions*/
.audio-subscriptions{
    padding: 5px 20px;
    background:#d9edf7;
    color:#31708f;
    border-bottom:1px solid #bcdff1;
    text-align:center;
}

/* Center images on subpages */
#subpage img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#subpage h1 { font-size: 1.6em; }
#subpage h2 { font-size: 1.4em; }
#subpage h3 { font-size: 1.3em; }
#subpage h4 { font-size: 1.2em; }
#subpage h5 { font-size: 1.1em; }
#subpage h6 { font-size: 1.05em; }