/* jssor slider arrow navigator skin 05 css */
/*
.jssora05l              (normal)
.jssora05r              (normal)
.jssora05l:hover        (normal mouseover)
.jssora05r:hover        (normal mouseover)
.jssora05ldn            (mousedown)
.jssora05rdn            (mousedown)
*/
@font-face {
    font-family: 'Open-Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open-Sans'), url(/news/fonts/opensans.woff) format('woff');
}
#sona_slider1_container{
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 468px;
    background: #191919;
    overflow: hidden;
}
.jssora05l, .jssora05r, .jssora05ldn, .jssora05rdn
{
    position: absolute;
    cursor: pointer;
    display: block;
    background: url("https://images.gmanews.tv/res/img/gallery/a17.png") no-repeat;
    overflow:hidden;
    z-index: 1 !important;
}
.jssora05l { background-position: -10px -35px; }
.jssora05r { background-position: -60px -35px; }
.jssora05l:hover { background-position: -130px -35px; }
.jssora05r:hover { background-position: -180px -35px; }
.jssora05ldn { background-position: -250px -35px; }
.jssora05rdn { background-position: -300px -35px; }
/* jssor slider thumbnail navigator skin 01 css */
/*
.jssort01 .p           (normal)
.jssort01 .p:hover     (normal mouseover)
.jssort01 .pav           (active)
.jssort01 .pav:hover     (active mouseover)
.jssort01 .pdn           (mousedown)
*/
.jssort01{
    position: absolute;
    width: 1024px;
    height: 100px;
    left:0px;
    bottom: 0px;
}
.jssort01 .w {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.jssort01 .p {
    position: absolute;
    width: 72px;
    height: 72px;
    top: 0;
    left: 0;
}

.jssort01 .c {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 72px;
    height:72px;
    border: #000 3px solid;
}

.jssort01 .p:hover .c, .jssort01 .pav:hover .c, .jssort01 .pav .c {
    border-width: 0px;
    top: 2px;
    left: 2px;
    width: 68px;
    height: 68px;
}

.jssort01 .p:hover .c, .jssort01 .pav:hover .c {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    border: #fff 3px solid;
}

/* jssor slider thumbnail navigator skin 02 css */
/*
.jssort02 .p            (normal)
.jssort02 .p:hover      (normal mouseover)
.jssort02 .pav          (active)
.jssort02 .pav:hover    (active mouseover)
.jssort02 .pdn          (mousedown)
*/
.jssort02{
    position: absolute;
    width: 240px;
    left: 0px;
    height: 480px;
    bottom: 0px;
}
.jssort02 .w
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.jssort02 .p, .jssort02 .pav {
    position: absolute;
    width: 99px;
    height: 66px;
    top: 0;
    left: 0;
}
.jssort02 .c
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 92px;
    height: 59px;
    border: #000 4px solid;
}
.jssort02 .p:hover .c, .jssort02 .pav:hover .c, .jssort02 .pav .c
{
    border-width: 0px;
    top: 2px;
    left: 2px;
    width: 95px;
    height: 62px;
}
.jssort02 .p:hover .c, .jssort02 .pav:hover .c
{
    top: 0px;
    left: 0px;
    width: 97px;
    height: 64px;
    border: #fff 1px solid;
}

/* jssor slider thumbnail navigator skin 02 css */
/*
.jssort03 .p            (normal)
.jssort03 .p:hover      (normal mouseover)
.jssort03 .pav          (active)
.jssort03 .pav:hover    (active mouseover)
.jssort03 .pdn          (mousedown)
*/
.jssort03{
    position: absolute;
    width: 240px;
    right: 0px;
    height: 480px;
    bottom: 0px;
}
.jssort03 .w
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.jssort03 .p, .jssort03 .pav {
    position: absolute;
    width: 99px;
    height: 66px;
    top: 0;
    left: 0;
}
.jssort03 .c
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 92px;
    height: 59px;
    border: #000 4px solid;
}
.jssort03 .p:hover .c, .jssort03 .pav:hover .c, .jssort03 .pav .c
{
    border-width: 0px;
    top: 2px;
    left: 2px;
    width: 95px;
    height: 62px;
}
.jssort03 .p:hover .c, .jssort03 .pav:hover .c
{
    top: 0px;
    left: 0px;
    width: 97px;
    height: 64px;
    border: #fff 1px solid;
}
#content .text_body div {
    max-width: 950px !important;
}
@media handheld, screen and (max-width: 660px){
    #content .text_body div {
        max-width: 1024px !important;
    }
    .text_body .w img {
        height: 100% !important;
    }
    #row1 {
        margin: 0px !important;
    }
}
@media handheld, screen and (max-width: 900px){
    .text_body .w img {
        height: 100% !important;
    }
    .jssort01{
        width: 100%;
    }
}
.sona_caption{
    line-height: 100%;
    position: absolute;
    bottom: 0px;
    text-align: left;
    width: 100%;
    background-color: rgba(255,255,255,0.8);
    font-size: 22px;
    padding: 5px 25px;
    color: #000000;
    line-height: 1em;
    display:none;
}
#outer-caption{
    line-height: 100%;
    text-align: left;
    width: 100%;
    font-size: 22px;
    color: #ffffff;
    line-height: 1em;
}
#image_gallery img {
    position: relative !important;
}
#image_gallery {
    position: relative !important;
}
.slider_caption {
  padding: 25px 2px;
  bottom: 0px;
  background-color: #1B1B1B;
  color: #ffffff;
}