/*
==============
CSS for - TEMPO.CO New Site
Muhammad Adam Firdaus 2017
http://www.muhammadadamfirdaus.com/
==============
 */

 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,
 del, dfn, em, img, ins, kbd, q, s, samp,
 small, strike, strong, sub, sup, tt, var,
 b, u, i, center,
 dl, dt, dd, ol, ul, li,
 fieldset, form, label, legend,
 table, caption, tbody, tfoot, thead, tr, th, td,
 article, aside, canvas, details, embed,
 figure, figcaption, footer, header, hgroup,
 menu, nav, output, ruby, section, summary,
 time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
 }

 /* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure,
 footer, header, hgroup, section {
   display: block;
 }

 html, body {
   margin: 0;
   padding: 0;
   height: 100%;
 }

 body, p, span {
   font-family: 'Roboto', 'HelveticaNeueW01-45Light', Helvetica, Arial;
   font-weight: 400;
   letter-spacing: 0.01em;
   text-rendering: optimizeSpeed;
   -webkit-font-smoothing: subpixel-antialiased;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }

 a {
   text-decoration: none;
 }

 img {
   display:block;
   width: 100%;
 }

 blockquote, q {
   quotes: none;
 }

 blockquote:before, blockquote:after,
 q:before, q:after {
   content: '';
   content: none;
 }

 h1, h2, h3, h4, h5, h6 {
   font-family: 'Roboto', 'HelveticaNeueW01-55Roman', Helvetica, Arial;
   font-weight: 500;
   letter-spacing: 0.01em;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: subpixel-antialiased;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }

 h1 {
   font-size:32px;
 }

 h2 {
   font-size: 28px;
 }

 h3 {
   font-size:24px;
 }

 h4 {
   font-size:20px;
 }

 h5 {
   font-size:16px;
 }

 h6 {
   font-size:14px;
 }

 table {
   border-collapse: collapse;
   border-spacing: 0;
 }

 .clearfix:after {
   content: "";
   display: table;
   clear: both;
 }

 .container {
   min-height:100%;
   margin: 0 auto;
   position:relative;
 }

 .col {
   float: left;
 }

 .w-20 {
   width: 20%;
 }

 .w-30 {
   width: 33.3%;
 }

 .w-40 {
   width: 40%;
 }

 .w-50 {
   width: 50%;
 }

 .w-60 {
   width: 60%;
 }

 .w-70 {
   width: 70%;
 }

 .w-80 {
   width: 80%;
 }

 .h-50 {
   height: 50px;
 }

 .desktop.active,
 .mobile.active,
 .newsflash {
   display: block;
 }

 .desktop,
 .mobile,
 .logo-tempo span {
   display: none;
 }

 footer {
   position:absolute;
   bottom:0;
   left:0;
   width:100%;
 }

 .preload {
   width:100%;
   height:100%;
   position:absolute;
   background:rgba(0,0,0,0.8);
   z-index: 10;
   display: flex;
   display: -webkit-flex;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;
 }

 .swiper-container.tempo-2017-tutorial {
   width: 100%;
   height: 400px;
   position: relative;
 }

 .swiper-container.tempo-2017-tutorial .swiper-pagination {
   position: absolute;
   bottom: 0;
 }

 /* fonts */
@font-face{font-family:Roboto;font-style:normal;font-weight:100;src:local('Roboto Light'),local('Roboto-Light'),url(https://fonts.gstatic.com/s/roboto/v18/Hgo13k-tfSpn0qi1SFdUfT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'),url(https://fonts.gstatic.com/s/roboto/v18/Hgo13k-tfSpn0qi1SFdUfVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}
@font-face{font-family:Roboto;font-style:normal;font-weight:300;src:local('Roboto Light'),local('Roboto-Light'),url(https://fonts.gstatic.com/s/roboto/v18/Hgo13k-tfSpn0qi1SFdUfT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'),url(https://fonts.gstatic.com/s/roboto/v18/Hgo13k-tfSpn0qi1SFdUfVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}
@font-face{font-family:Roboto;font-style:normal;font-weight:400;src:local('Roboto'),local('Roboto-Regular'),url(https://fonts.gstatic.com/s/roboto/v18/2UX7WLTfW3W8TclTUvlFyQ.woff) format('woff'),url(https://fonts.gstatic.com/s/roboto/v18/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}
@font-face{font-family:Roboto;font-style:normal;font-weight:500;src:local('Roboto Medium'),local('Roboto-Medium'),url(https://fonts.gstatic.com/s/roboto/v18/RxZJdnzeo3R5zSexge8UUT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'),url(https://fonts.gstatic.com/s/roboto/v18/RxZJdnzeo3R5zSexge8UUVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}
@font-face{font-family:Roboto;font-style:normal;font-weight:700;src:local('Roboto Bold'),local('Roboto-Bold'),url(https://fonts.gstatic.com/s/roboto/v18/d-6IYplOFocCacKzxwXSOD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'),url(https://font.gstatic.com/s/roboto/v18/d-6IYplOFocCacKzxwXSOFtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215}

 /* colors */
 .red-500 {
   /* background-color: rgba(244,67,54,1); */
   /* background-color: rgba(225,37,24,1); */
   background: rgba(225,37,24,1);
   color: #fff;
 }

 .amber-700 {
   /* background-color: #ffa000; */
   background: rgba(225,37,24,1);
   color: #fff;
 }

 .white {
   background: #fff;
 }

 .red-sky {
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d32f2f+0,5674b9+100 */
   /* background: rgba(225,37,24,1); Old browsers */
   /* background: -moz-linear-gradient(45deg,  rgba(211,47,47,1) 0%, rgba(86,116,185,1) 100%); FF3.6-15 */
   /* background: -webkit-linear-gradient(45deg,  rgba(211,47,47,1) 0%,rgba(86,116,185,1) 100%); Chrome10-25,Safari5.1-6 */
   /* background: linear-gradient(45deg,  rgba(211,47,47,1) 0%,rgba(86,116,185,1) 100%); W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d32f2f', endColorstr='#5674b9',GradientType=1 ); IE6-9 fallback on horizontal gradient */
   background: rgba(225,37,24,1);
   color: #fff;
 }

 .green-diagonal-75 {
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#004d40+0,26a69a+100 */
   /* background: rgb(0,77,64); Old browsers */
   /* background: -moz-linear-gradient(45deg,  rgba(0,77,64,1) 0%, rgba(38,166,154,1) 100%); FF3.6-15 */
   /* background: -webkit-linear-gradient(45deg,  rgba(0,77,64,1) 0%,rgba(38,166,154,1) 100%); Chrome10-25,Safari5.1-6 */
   /* background: linear-gradient(45deg,  rgba(0,77,64,1) 0%,rgba(38,166,154,1) 100%); W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004d40', endColorstr='#26a69a',GradientType=1 ); IE6-9 fallback on horizontal gradient */
   background: rgba(225,37,24,1);
   color: #fff;
 }

 .blue-diagonal-75 {
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,1e88e5+50 */
   /* background: rgb(30,87,153); Old browsers */
   /* background: -moz-linear-gradient(45deg, rgba(30,87,153,1) 0%, rgba(30,136,229,1) 50%); FF3.6-15 */
   /* background: -webkit-linear-gradient(45deg, rgba(30,87,153,1) 0%,rgba(30,136,229,1) 50%); Chrome10-25,Safari5.1-6 */
   /* background: linear-gradient(45deg, rgba(30,87,153,1) 0%,rgba(30,136,229,1) 50%); W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#1e88e5',GradientType=1 ); IE6-9 fallback on horizontal gradient */
   background: rgba(225,37,24,1);
   color: #fff;
 }

 hr {
   border: 0;
   height: 1px;
   background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
 }

 .right {
   float: right;
 }

 /* mulai dari bawah ini */
 .container-desktop {
   width: 1064px;
   margin: 0 auto;
   position: relative;
 }

 .wrapper {
   padding: 0 20px;
 }

 header {
   -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
   -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
   box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
   position: relative;
   /* background: #e53935; */
   /* background: rgba(225,37,24,1); */
 }

 .header-top {
   display: block;
   color: #ffffff;
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7e57c2+0,42a5f5+50,1de9b6+100 */
   /* background: rgb(126,87,194); Old browsers */
   /* background: -moz-linear-gradient(left,  rgba(126,87,194,1) 0%, rgba(66,165,245,1) 50%, rgba(29,233,182,1) 100%); FF3.6-15 */
   /* background: -webkit-linear-gradient(left,  rgba(126,87,194,1) 0%,rgba(66,165,245,1) 50%,rgba(29,233,182,1) 100%); Chrome10-25,Safari5.1-6 */
   /* background: linear-gradient(to right,  rgba(126,87,194,1) 0%,rgba(66,165,245,1) 50%,rgba(29,233,182,1) 100%); W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7e57c2', endColorstr='#1de9b6',GradientType=1 ); IE6-9 */
   /* width: 1064px; */
   margin: 0 auto;
   /* border-bottom: 0.1px solid #ddd; */

 }

 .header-top span.date {
   line-height: 30px;
   color: #333;
 }

 .header-top-new {
  background: rgba(225,37,24,1);
  height: 25px;
 }

 span.date,
 span.time {
   font-family: 'Roboto-Light', Helvetica, Arial;
   font-size: 12px;
   font-weight: 300;
   line-height: 12px;
   letter-spacing: 0.01em;
 }

 .header-main {
   display: table;
   height: 100px;
   padding-top: 0px; /* default 15px */
   position: relative;
 }

 .header-main > div {
   display: table-cell;
   vertical-align: middle;
 }

 .logo-tempo {
  display: inline-block;
  vertical-align: middle;
  width: 55%;
  height: 70px;
  line-height: 30px;
  /* background-image: url(../images/sprites.png); */
  background-repeat: no-repeat;
  background-size: 235%;
  margin-left: 5px;
  position: relative;
  background-position-x: 0;
 }

 .logo-tempo:after {
   /* content: 'beta'; */
   color: rgba(255,255,255,1);
   position: absolute;
   right: -3px;
   top: -25px;
   font-size: 12px;
   letter-spacing: 0.6em;
   text-transform: uppercase;
 }

 .newsflash h2.col {
   display: inline-block;
   text-transform: uppercase;
   color: #e53935;
   border: 1px solid #e53935;
   padding: 6px 12px;
   margin-right: 20px;
   font-size: 10px;
   letter-spacing: 1.3px;
   font-family: "Roboto", Helvetica, Arial;
   font-weight: 300;
 }

 .swiper-container.head-focus {
   height: 20px;
 }

 .head-focus .swiper-slide a {
   text-decoration: none;
   color: #000;
   display: block;
 }

 .head-focus .swiper-slide h2 {
   font-size: 12px;
   font-weight: 400;
   line-height: 22px;
 }

 .header-bottom {
  /* background: rgba(196, 22, 28, 1); */
  background: #f9f8f7;
 }

 .header-main > .w-50:nth-of-type(1) {
  width: 60%;
 }

 .header-main > .w-50:nth-of-type(2) {
  width: 40%;
 }

 /* newsflash */
 .head-newsflash {
   width: 400px;
   height: 75px;
   font-size: 0;
   position: relative;
   /* border: 0.2px solid #ddd; */
 }

 .head-newsflash h1 {
   font-size: 18px;
   margin: 0 0 0 4px;
   /* padding: 4px 0; */
   display: inline-block;
   text-transform: uppercase;
 }

 .head-newsflash a {
   display: inline-block;
 }

 .head-newsflash a:nth-of-type(1),
 .head-newsflash span {
   display: block;
 }

 .head-newsflash a.thumbnail {
   width: 48px;
   height: 48px;
   overflow: hidden;
   position: relative;
   /* display: none; */
 }

 .head-newsflash a:nth-of-type(1) {
   /* background: #f44336; */
   color: #555;
   margin-bottom: 5px;
 }

 .head-newsflash .swiper-slide > .w-50 {
  width: 100%;
  margin-bottom: 50px;
 }

 .head-newsflash a:nth-of-type(1).live > h1:nth-of-type(1),
 .head-newsflash a:nth-of-type(1).event > h1:nth-of-type(1) {
   padding-left: 20px;
 }

 .head-newsflash a:nth-of-type(1).live > h1:nth-of-type(1) {
   color: #e53935;
 }

 .head-newsflash a:nth-of-type(1).event > h1:nth-of-type(1) {
   color: rgba(144, 53, 229, 1);
 }

 .head-newsflash .col a:nth-of-type(1) {
   margin-left: 5px;
 }

 .head-newsflash .col a:nth-of-type(2) {
   width: 75%;
 }

 .head-newsflash .col a:nth-of-type(2),
 .head-newsflash .col a:nth-of-type(3) {
   margin-left: 10px;
 }

 .head-newsflash .col a:nth-of-type(3) {
   color: #666;
 }


 .head-focus .swiper-slide {
  background: #e53935;
}

 .head-newsflash a h2 {
   color: #555;
   font-size: 16px;
   font-weight: 400;
   line-height: 23px;
   height: 48px;
   overflow: hidden;
 }

 .head-newsflash a span.date {
   font-size: 9px;
   color: #ddd;
 }

 .head-newsflash a:nth-of-type(1).live:before,
 .head-newsflash a:nth-of-type(1).event:before {
   content: '';
   width: 8px;
   height: 8px;
   border-radius: 50%;
   position: absolute;
   left: 10px;
   top: 8px;
 }

 .head-newsflash a:nth-of-type(1).live:before {
   -webkit-animation: live-red 1s ease infinite;
   animation: live-red 1s ease infinite;
 }

 .head-newsflash a:nth-of-type(1).event:before {
   -webkit-animation: live-purple 1s ease infinite;
   animation: live-purple 1s ease infinite;
 }
 /* end newsflash */

 /* SEARCH */

 /*#search {
   display:table-cell;
 }*/

 .search {
   float:right;
   position:relative;
 }

 .search a {
   content:'';
   background: url(../images/sprites.png) no-repeat;
   background-position: -16px -45px;
   background-size: 195px;
   display: inline-block;
   width: 16px;
   height: 16px;
   position:absolute;
   left: 5%;
   top: 5px;
 }

 .search input {
   background: none;
   border: 0;
   border-bottom: 1px solid #ccc;
   color:#333;
   height: 25px;
   line-height: 25px;
   padding: 10px 0 10px 40px;
   /*transition: padding-right 1s cubic-bezier(0.000, 0.795, 0.000, 1.000);*/
 }

 .search input::-webkit-input-placeholder {
    color: #ccc;
 }

 .search input::-moz-placeholder { /* Firefox 18- */
    color: #ccc;
 }

 .search input::-moz-placeholder {  /* Firefox 19+ */
    color: #ccc;
 }

 .search input::-ms-input-placeholder {
    color: #ccc;
 }

 .search input::-webkit-search-cancel-button /* ngilangin close button */ {
   display:none;
 }

 .search input[type="search"] {
   outline: none;
 }

 .search input[type="search"]:focus {
   padding-right: 10%;
   transition: padding-right 1s cubic-bezier(0.000, 0.795, 0.000, 1.000);
   /*box-shadow: 0px 0px 6px 3px rgba(255,255,255,0.3);*/
 }
 /* end SEARCH */

 /* begin MENU */
 nav {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   list-style: none;
 }

 .menu div:before {
   content:'';
   /*border-top:1px solid #fff;*/
   display: block;
 }

 .menu li {
   float:left;
   position:relative;
   height: 40px;
   margin: 0 0.25%;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 .menu li:last-child {
   display: block;
 }

 .menu li.sub {
   margin-right: 12px;
   z-index: 10;
 }

 .menu li:last-child {
   padding-right: 0;
 }

 .menu li:nth-of-type(1),
 .menu li:nth-of-type(1) a {
   padding-left: 0;
 }

 .menu li.addon {
   display: none;
 }

 .menu li a {
   color: #555;
   font-family: 'Roboto', Helvetica, Arial;
   font-size: 11px;
   font-weight: 400;
   letter-spacing: 0.1em;
   line-height: 40px;
   text-decoration:none;
   text-transform:uppercase;
 }

 .menu li a {
   padding:10px 2.5px;
 }

 .menu li:nth-child(2) {
   padding-left:0;
 }

 .menu li a:hover {
   color:#ccc;
   -moz-transition: background-color 1.5s ease-out;
   -webkit-transition: background-color 1.5s ease-out;
   -o-transition: background-color 1.5s ease-out;
   transition: background-color 1.5s ease-out;
 }

 .menu li ul {
   visibility: hidden;
   position: absolute;
   opacity: 0;
   -webkit-transform: translate3d(0, -5px, 0);
   transform: translate3d(0, -5px, 0);
   transition: all 0.5s ease;
 }

 .menu li.sub-menu-active ul {
   visibility: visible;
   position: absolute;
   opacity: 1;
   -webkit-transform: translate3d(0, 0px, 0);
   transform: translate3d(0, 0px, 0);
   transition: all 0.5s ease;
 }

 .menu li.sub:before {
   top: 8px;
   right: -6px;
 }

 .menu ul li {
   display:block;
   z-index: 5;
   width: 165px;
   padding: 0;
   line-height: 40px;
   color: #fff;
   background: rgba(0,0,0,0.85);
 }

 .menu ul li a {
   display:block;
   padding:0 15px;
   color: #fff;
 }

 .menu li ul li:first-child a {
   display:block;
   padding:0 15px;
 }

 .menu li ul li a:hover {
   color:rgba(255,255,255,0.75);
 }

 .menu-mobile {
   display:none;
 }
 /* end MENU */

 .header-bottom li a#search {
   background: url(../images/sprites.png) no-repeat;
   background-position: -15px -52px;
   background-size: 220px;
   display: none;
   width: 20px;
   height: 20px;
   line-height: 20px;
   padding: 0;
   position: absolute;
   top: 10px;
 }

 .header-bottom.sticky-search-active li {
   animation: menu-fade-out 0.2s ease forwards;
 }

 .sticky-header .header-bottom li a#search {
   display: block;
 }

 .header-bottom li,
 #extension #sticky-search #trending li {
   animation: menu-fade-in 0.2s ease-out forwards;
 }

 .header-bottom .wrapper {
   padding: 0 10%;
 }

 .header-bottom.sticky-search-active li:last-child {
   animation: none;
 }

 .header-bottom .search a.col {
   background-position: -15px -46px;
   width: 16px;
   z-index: 1;
   top: 12px;
   position: absolute;
 }

 .header-bottom p {
   font-size: 14px;
   color: #777;
 }

 .header-bottom #sticky-search .search {
   float: left;
   width: 100%;
   height: 40px;
   padding: 8px 0;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 .header-bottom #sticky-search .search input,
 .header-bottom #datepicker input {
   background: #fff;
   border: 1px solid #777;
   border-radius: 20px;
   color: #777;
 }

 .header-bottom #sticky-search .search input {
   width: 350px;
   line-height: 40px;
   position: absolute;
   left: 0;
 }

 .header-bottom #datepicker input {
   line-height: 40px;
   width: 130px;
   height: 25px;
   margin: 8px 0;
   padding-left: 10px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 .header-bottom .col {
   width: 42%;
 }

 .header-bottom .col:nth-child(2) {
   width: 25%;
 }

 .header-bottom .col:nth-child(3) {
   width: 20%;
 }

 .header-bottom .col:last-child {
   width: auto;
 }

 /*.header-bottom #datepicker p.col,
 .header-bottom #datepicker input#tanggal {
   width: 50%;
 }*/

 .header-bottom p.col:nth-child(2) {
   line-height: 40px;
   text-align: center;
 }

 .header-bottom .col:first-child form {
   padding-right: 10px;
 }

 .header-bottom  a.button {
   color: #fff;
   cursor: pointer;
   display: inline-block;
   font-size: 10px;
   line-height: 15px;
   height: 25px;
   margin: 8px 0;
   padding: 4px 12px;
   box-sizing: border-box;
 }

 #extension.sticky-search {
   display: none;
   opacity: 0;
   transform: translate3d(100px, 0, 0);
   width: 100%;
   height: 40px;
   position: absolute;
 }

 #extension.sticky-search.active {
   display: block;
   opacity: 1;
   transform: translate3d(0, 0, 0);
 }

 #extension #sticky-search #trending {
   width: 350px;
   background: #fff;
   box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
   position: absolute;
   top: 38px;
 }

 #extension #sticky-search #trending li:nth-of-type(1):before {
   content: '';
   background-color: initial;
 }

 #extension #sticky-search #trending li {
   background: none;
   width: 100%;
   height: auto;
   margin-bottom: 10px;
   padding: 0;
 }

 #extension #sticky-search #trending li:last-child {
   margin-bottom: 20px;
 }

 #extension #sticky-search #trending li:before {
   content: '';
   width: 13px;
   height: 20px;
   background-image: url(../images/sprites.png);
   background-position: -55px -160px;
   background-size: 224px;
   position: absolute;
   top: 0;
 }

 #extension #sticky-search #trending a {
   line-height: 11px;
   padding: 0;
   margin-left: 20px;
   text-transform: none;
 }

 #extension #sticky-search #trending span {
   font-size: 11px;
   color: #aaa;
   margin: 20px 0;
 }

 #extension #sticky-search #trending {
   opacity: 0;
   visibility: hidden;
   transform: translate3d(0, 100px, 0);
 }

 #extension #sticky-search #trending.active {
   opacity: 1;
   visibility: visible;
   transform: translate3d(0, 0, 0);
   transition: opacity 0.2s ease-in;
 }

 #extension #sticky-search #trending input:-webkit-autofill {
     -webkit-box-shadow: 0 0 0 30px white inset;
 }

 /*.sticky.comments {
   top: 44px;
   width: 728px;
   height: 400;
   overflow-y: auto;
   background: #fff;
   padding-top: 20px;
   margin-bottom: 1em;
 }*/

 @keyframes menu-fade-out {
   0% {
     opacity: 1;
     transform: translate3d(0, 0, 0);
   }

   100% {
     opacity: 0;
     visibility: hidden;
     transform: translate3d(-100px, 0, 0);
   }
 }

 @keyframes menu-fade-in {
   0% {
     display: none;
   }

   50% {
     opacity: 0;
     transform: translate3d(-100px, 0, 0);
   }

   100% {
     opacity: 1;
     transform: translate3d(0, 0, 0);
   }
 }

 @keyframes sticky-search-active {
   0% {
     transform: translate3d(0, 0, 0);
   }

   100% {
     transform: translate3d(-500px, 0, 0);
   }
 }

 /* tooltip */
 .tooltip,
 .tooltip .arrow-up {
   position: absolute;
 }

 .tooltip {
   width: 160px;
   opacity: 0;
   transform: translate3d(45px, 15px, 0);
   transition: all 0.5s ease-in;
   z-index: 10;
 }

 .tooltip .arrow-up {
   width: 0;
   height: 0;
   transform: translate3d(50px, -20px, 0);
   z-index: 1;
   border-left: 15px solid transparent;
   border-right: 15px solid transparent;
   border-bottom: 10px solid #e53935;
 }

.tooltip.active {
   opacity: 1;
   transform: translate3d(45px, 30px, 0);
   transition: all 0.5s ease-in;
 }

 .tooltip > .wrapper {
   position: relative;
   padding: 0 10px !important;
 }

 .tooltip .wrapper .wrapper {
   padding: 0 25px !important;
 }

 .tooltip.red-500 p {
   color: #fff;
   font-size: 10px;
   line-height: 14px;
   margin: 10px auto 0;
   text-transform: none;
 }

 .tooltip a.white {
   background: #fff;
   border-radius: 10px;
   color: #e53935;
   display: block;
   font-size: 8px;
   line-height: 16px;
   margin: 10px auto;
   padding: 0px 8px;
   text-align: center;
 }

 .pika-single {
   z-index: 9999;
   display: block;
   position: relative;
   color: #333;
   background: #fff;
   border: 1px solid #ccc;
   border-bottom-color: #bbb;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 }

 /*
 clear child float (pika-lendar), using the famous micro clearfix hack
 http://nicolasgallagher.com/micro-clearfix-hack/
 */
 .pika-single:before,
 .pika-single:after {
   content: " ";
   display: table;
 }
 .pika-single:after { clear: both }
 .pika-single { *zoom: 1 }

 .pika-single.is-hidden {
   visibility: hidden;
 }

 .pika-single.is-bound {
   position: absolute;
   box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
   width: 256px;
   margin-top: -2px;
 }

 .pika-lendar {
   float: left;
   width: 240px;
   margin: 8px;
 }

 .pika-title {
   position: relative;
   text-align: center;
 }

 .pika-label {
   display: inline-block;
   *display: inline;
   position: relative;
   z-index: 9999;
   overflow: hidden;
   margin: 0;
   padding: 5px 3px;
   font-size: 14px;
   line-height: 20px;
   font-weight: bold;
   background-color: #fff;
 }

 .pika-title select {
   cursor: pointer;
   position: absolute;
   z-index: 9998;
   margin: 0;
   left: 0;
   top: 5px;
   filter: alpha(opacity=0);
   opacity: 0;
 }

 .pika-prev,
 .pika-next {
   display: block;
   cursor: pointer;
   position: relative;
   outline: none;
   border: 0;
   padding: 0;
   width: 20px;
   height: 30px;
   /* hide text using text-indent trick, using width value (it's enough) */
   text-indent: 20px;
   white-space: nowrap;
   overflow: hidden;
   background-color: transparent;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 75% 75%;
   opacity: .5;
   *position: absolute;
   *top: 0;
 }

 .pika-prev:hover,
 .pika-next:hover {
     opacity: 1;
 }

 .pika-prev,
 .is-rtl .pika-next {
     float: left;
     background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
     *left: 0;
 }

 .pika-next,
 .is-rtl .pika-prev {
     float: right;
     background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
     *right: 0;
 }

 .pika-prev.is-disabled,
 .pika-next.is-disabled {
     cursor: default;
     opacity: .2;
 }

 .pika-select {
     display: inline-block;
     *display: inline;
 }

 .pika-table {
     width: 100%;
     border-collapse: collapse;
     border-spacing: 0;
     border: 0;
 }

 .pika-table th,
 .pika-table td {
     width: 14.285714285714286%;
     padding: 0;
 }

 .pika-table th {
     color: #999;
     font-size: 12px;
     line-height: 25px;
     font-weight: bold;
     text-align: center;
 }

 .pika-button {
   cursor: pointer;
   display: block;
   box-sizing: border-box;
   -moz-box-sizing: border-box;
   outline: none;
   border: 0;
   margin: 0;
   width: 100%;
   padding: 5px;
   color: #666;
   font-size: 12px;
   line-height: 15px;
   text-align: center;
   background: #f5f5f5;
 }

 .pika-week {
   font-size: 11px;
   color: #999;
 }

 .is-today .pika-button {
   color: #fff;
   background: #00b0ff;
   font-weight: bold;
 }

 .is-selected .pika-button,
 .has-event .pika-button {
   color: #fff;
   font-weight: bold;
   background: #33aaff;
   box-shadow: inset 0 1px 3px #178fe5;
   border-radius: 3px;
 }

 .has-event .pika-button {
   background: #005da9;
   box-shadow: inset 0 1px 3px #0076c9;
 }

 .is-disabled .pika-button,
 .is-inrange .pika-button {
   background: #D5E9F7;
 }

 .is-startrange .pika-button {
   color: #fff;
   background: #6CB31D;
   box-shadow: none;
   border-radius: 3px;
 }

 .is-endrange .pika-button {
   color: #fff;
   background: #33aaff;
   box-shadow: none;
   border-radius: 3px;
 }

 .is-disabled .pika-button {
   pointer-events: none;
   cursor: default;
   color: #999;
   opacity: .3;
 }

 .is-outside-current-month .pika-button {
   color: #999;
   opacity: .3;
 }

 .is-selection-disabled {
   pointer-events: none;
   cursor: default;
 }

 .pika-button:hover,
 .pika-row.pick-whole-week:hover .pika-button {
   color: #fff;
   background: #e53935;
   box-shadow: none;
   border-radius: 3px;
 }

 /* styling for abbr */
 .pika-table abbr {
   border-bottom: none;
   cursor: help;
 }


 /* sticky */
 .sticky {
   position: fixed;
 }

 .sticky.sticky-header,
 .sticky.sticky-r3,
 .sticky.lepas,
 .sticky.tab-pagination {
   top: 0;
 }

 .sticky-header {
   width: 100%;
   height: 44px;
   z-index: 9;
   -webkit-animation: bounce-down 0.5s forwards;
   animation: bounce-down 0.5s forwards;
 }

 .sticky-header .header-top {
   height: 5px;
   -webkit-transition: all 0.1s ease;
   transition: all 0.1s ease;
 }

 .sticky-header .header-main {
   position: relative;
   height: auto;
 }


 .sticky-header .header-top .w-50,
 .sticky-header .header-main .w-50 {
   opacity: 0;
   display: none;
   -webkit-transition: all 0.1s ease;
   transition: all 0.1s ease;
 }

 .sticky-header .header-bottom .menu {
   background: #fff;
 }

 #skin-ad.sticky {
   -webkit-transform: translate3d(0, 55px, 0);
   transform: translate3d(0, 55px, 0);
 }

 /*.sticky-header .search {
   display: none;
 }*/

 .sticky.sub-head {
	 background: #fff;
	 margin: 0;
	 padding: 10px 0 8px;
   top: 44px;
   width: 728px;
	 height: 28px;
	 border-bottom: 0.5px solid #ddd;
	 z-index: 1;
	 -webkit-animation: bounce-down 0.5s forwards;
   animation: bounce-down 0.5s forwards;
 }


 .r3.sticky {
   width: 300px;
   opacity: 1;
   top: 60px;
   -webkit-animation: bounce-down 0.5s forwards;
   animation: bounce-down 0.5s forwards;
 }

 .r3.lepas {
   opacity: 0;
   -webkit-animation: bounce-up 0.5s forwards;
   animation: bounce-up 0.5s forwards;
 }

 .sticky.tab-pagination {
   background: #ffffff;
   margin-top: 45px;
   margin-bottom: 45px;
   width: 558px;
   z-index: 1;
   -webkit-animation: bounce-down 0.5s forwards;
   animation: bounce-down 0.5s forwards;
 }

 .sticky #search.w-50 {
   width: 7%;
 }

 .sticky .search a {
   background-position: -15px -30px;
   position: relative;
 }

 .sticky #search form {
   line-height: 35px;
 }

 /*.sticky .search input {
   border-bottom: 1px solid #ddd;
   color: #555;
   opacity: 0;
   width: 0;
   transition: translate3d(-50px, 0, 0);
 }*/

 .sticky-search #search.w-50 {
   width: 200px;
 }

 .sticky-search .search input {
   opacity: 1;
   width: 80%;
 }

 .sticky-search .menu li {
   padding: 0 5px;
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
 }

 .sticky-search .menu li a {
   font-size: 10px;
 }

 .sticky.survey-front {
   bottom: 50%;
   left: 0;
 }

 .sticky.survey-front.active {
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
   -webkit-transition: all 0.3s ease;
   transition: all 0.3s ease;
 }

 .sticky.data-hasil {
   display: block;
   width: 688px;
   top: 44px;
   z-index: 2;
   -webkit-animation: bounce-down 0.5s forwards;
   animation: bounce-down 0.5s forwards;
 }

 .sticky.data-hasil h1 {
   padding-top: 10px;
   font-size: 14px;
 }

 .data-hasil.lepas {
   -webkit-animation: bounce-up 0.5s forwards;
   animation: bounce-up 0.5s forwards;
 }

 /* survey front container */
 .survey-front {
   background: #fff;
   box-shadow: 0px 0 20px rgba(0,0,0,0.35);
   width: 280px;
   height: 160px;
   z-index: 2;
   -webkit-transform: translate3d(-300px, 0, 0);
   transform: translate3d(-300px, 0, 0);
   -webkit-transition: all 0.3s ease;
   transition: all 0.3s ease;
 }

 .survey-front * {
   display: block;
 }

 .survey-front a {
   padding: 10px 0;
 }

 .survey-front a.close {
   line-height: 28px;
   padding: inherit;
 }

 .survey-front a * {
   color: #000;
   padding: 0 10px;
 }

 .survey-front h4 {
   font-size: 16px;
   margin-bottom: 10px;
 }

 .survey-front p {
   font-size: 12px;
 }

 .survey-front span {
   font-size: 10px;
   font-style: italic;
   color: #555;
   text-align: center;
 }

 /* end survey front container */

 @-webkit-keyframes bounce-down {
   0% {
     -webkit-transform: translate3d(0, -100px, 0);
     transform: translate3d(0, -100px, 0);
   }

   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 @keyframes bounce-down {
   0% {
     -webkit-transform: translate3d(0, -100px, 0);
     transform: translate3d(0, -100px, 0);
   }

   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 @-webkit-keyframes bounce-up {
   0% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }

   100% {
     -webkit-transform: translate3d(0, -100px, 0);
     transform: translate3d(0, -100px, 0);
   }
 }

 @keyframes bounce-up {
   0% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }

   100% {
     -webkit-transform: translate3d(0, -100px, 0);
     transform: translate3d(0, -100px, 0);
   }
 }

 /* ads */
 .ads {
   margin: 0 auto;
   position: relative;
   /*background-color: #ccc;*/
 }

 .ads .wrapper {
   padding: 0;
 }

 /* premium head */
 .ads.premium-head {
   width: 970px;
   margin: 10px auto;
 }

 .ads.premium-head .premium-head-small {
   height: 90px;
   opacity: 1;
   visibility: visible;
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
   -webkit-transition: -webkit-transform 0.8s ease;
   transition: transform 0.8s ease;
 }

 .ads.premium-head .premium-head-big {
   height: 0;
   opacity: 0;
   visibility: hidden;
   -webkit-transform: translate3d(0, 50px, 0);
   transform: translate3d(0, 50px, 0);
   -webkit-transition: all 0.8s ease;
   transition: all 0.8s ease;
 }

 .ads.premium-head .premium-head-small.deactive {
   height: 0;
   opacity: 0;
   visibility: hidden;
   -webkit-transform: translate3d(0, -25px, 0);
   transform: translate3d(0, -25px, 0);
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
 }

 .ads.premium-head .premium-head-big.active {
   height: 250px;
   opacity: 1;
   visibility: visible;
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
 }

 .ads.premium-head .wrapper {
   padding: 0;
 }

 /* billboard */
 .ads.billboard {
   width: 728px;
 }

 .ads.rectangle.r3 {
   background: none;
 }

 /* rectangle ads */
 .rectangle:first-child .rectangle-ads {
   margin-bottom: 15px;
 }

 /* curl ads */
 #curl-ads.sticky {
   z-index: 11;
 }

 .curl-ads {
   position: absolute;
   top: 0;
   left: 0;
 }

 .ads.curl-ads .wrapper {
   width: 100%;
   height: 100%;
   position: relative;
 }

 .curl-ads a {
   display: block;
 }

 .curl-ads .curl {
   background: url(../images/curl.png) no-repeat;
   background-size: 150px 150px;
   width: 150px;
   height: 150px;
 }

 .curl-ads.expanded .curl {
   animation: curl-ads-expanding 0.5s ease forwards;
 }

 .curl-ads.collapsed .curl {
   animation: curl-ads-collapsing 0.5s ease;
 }

 @keyframes curl-ads-expanding {
   0% {
     background-size: 150px 150px;
     width: 150px;
     height: 150px;
   }

   100% {
     background-size: 366px 366px;
     width: 366px;
     height: 366px;
   }
 }

 @keyframes curl-ads-collapsing {
   0% {
     background-size: 366px 366px;
     width: 366px;
     height: 366px;
   }

   100% {
     background-size: 150px 150px;
     width: 150px;
     height: 150px;
   }
 }

 /* skin ad */
 #skin-ad {
   width: 100%;
   position:fixed;
   top: 0;
   -webkit-transform: translate3d(0, 200px, 0);
   transform: translate3d(0, 200px, 0);
   z-index: 5;
 }

 .skin-ad .skin-l,
 .skin-ad .skin-r {
   display: inline-block;
   height: auto;
   width: 100px;
   position: absolute;
 }

 .skin-ad .skin-l {
   left: -110px;
 }

 .skin-ad .skin-r {
   right: -110px;
 }

 /* ads full width */
 .ads-full-width {
   background: url(../images/meikarta.jpg) no-repeat;
   width: 100%;
   height: 100%;
   position: fixed;
   top: 40px;
   z-index: -10;
 }

 /* bottom ads desktop */
 .bottom-banner {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   z-index: 9;
 }

 .bottom-banner .container-desktop,
 .tab,
 .tab .tab-content,
 #category .features figure,
 .list-type-3 li:nth-of-type(1) {
   position: relative;
 }

 .bottom-banner .container-desktop button,
 a.close,
 .survey-front a.close {
   width: 28px;
   height: 28px;
   background: #e53935;
   color: #fff;
   font-size: 16px;
   line-height: 28px;
   position: absolute;
   right: 0;
   top: -28px;
   text-align: center;
   -webkit-border-radius: 50%;
   border-radius: 50%;
   border: 0;
 }

 .bottom-banner .h-50 {
   height: 50px;
 }

 .bottom-banner a {
   display: block;
   width: 1064px;
   margin: 0 auto;
   -webkit-transform: -webkit-translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
 }

 .bottom-banner-closed {
   -webkit-transform: -webkit-translate3d(0, 100px, 0);
   transform: translate3d(0, 100px, 0);
   transition: transform 0.5s ease-out;
 }

 /* popup ads */
 .popup-ads {
   opacity: 0;
   visibility: hidden;
   position: relative;
 }

 .popup-ads.active {
   opacity: 1;
   visibility: visible;
   -webkit-transition: opacity 0.5s ease;
   transition: opacity 0.5s ease;
 }

 .popup-ads button {
   position: absolute;
   right: 0;
   top: -30px;
   font-size: 20px;
   width: 30px;
   height: 30px;
   padding-bottom: 10px;
   border: 0;
   background: #e53935;
   color: #fff;
   border-radius: 50%;
 }

 .popup-ads button::before {
   right: 10px;
 }

 .popup-ads {
   width: 640px;
   height: 480px;
   z-index: 9999;
   position:fixed;
   left: 50%;
   top: 50%;
   -ms-transform: translate(-50%,-50%);
   -moz-transform:translate(-50%,-50%);
   -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
   /*background: rgba(255, 255, 255, 0.5);*/
 }

 .popup-ads a {
   display: block;
   width: 100%;
   height: 100%;
   opacity: 1;
 }

 .popup-ads.popup-ads-closed {
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.5s ease-out;
 }

 /* sponsor headline */
 #headline.headline-mobile-terbaru .swiper-slide .sponsor-headline h3 {
   background: #e53935;
   border: 1px solid #e53935;
 }

 /* ads zoom */
 figure#ads-zoom a {
   width: auto;
   height: auto;
 }

 .ads.r-600 {
   margin-bottom: 30px;
   height: 600px;
 }

 .ads.r-600 a {
   display: block;
 }

 .ads.r-600 #ads-zoom {
   background: url(../images/ads-zoom/bg-oppo.jpg) no-repeat;
   display: table;
   width: 100%;
   height: 600px;
 }

 #zoom-area.zoom-area {
   background: url(../images/ads-zoom/oppo.png) no-repeat;
   background-position: center;
   display: table-cell;
   vertical-align: middle;
   height: 100%;
 }

 #ads-screen {
   width: 166px;
   height: 284px;
   margin: 0 auto;
   overflow: hidden;
 }

 /* end ads */

 /* features */
 #headline.headline-mobile-terbaru .swiper-slide .live:before {
   content: '';
   width: 8px;
   height: 8px;
   border-radius: 50%;
   position: absolute;
   left: 20px;
   top: 8px;
   -webkit-animation: live-white 1s ease infinite;
   animation: live-white 1s ease infinite;
 }

 @-webkit-keyframes live-white {
   0% {
     /*background-color: rgba(229, 57, 53, 1);*/
     background-color: rgba(255, 255, 255, 1);
   }

   100% {
     background-color: rgba(255, 255, 255, 0);
   }
 }

 @keyframes live-white {
   0% {
     background-color: rgba(255, 255, 255, 1);
   }

   100% {
     background-color: rgba(255, 255, 255, 0);
   }
 }

 @-webkit-keyframes live-red {
   0% {
     /*background-color: rgba(229, 57, 53, 1);*/
     background-color: rgba(229, 57, 53, 1);
   }

   100% {
     background-color: rgba(229, 57, 53, 0);
   }
 }

 @keyframes live-red {
   0% {
     background-color: rgba(229, 57, 53, 1);
   }

   100% {
     background-color: rgba(229, 57, 53, 0);
   }
 }

 @-webkit-keyframes live-purple {
   0% {
     /*background-color: rgba(229, 57, 53, 1);*/
     background-color: rgba(144, 53, 229, 1);
   }

   100% {
     background-color: rgba(144, 53, 229, 0);
   }
 }

 @keyframes live-purple {
   0% {
     background-color: rgba(144, 53, 229, 1);
   }

   100% {
     background-color: rgba(144, 53, 229, 0);
   }
 }

 #headline.headline-mobile-terbaru .swiper-slide a.live h3 {
   padding-left: 20px;
   border: 1px solid rgb(229, 57, 53);
   color: #fff;
   background: #e53935;
 }

 /* end features */

 section li {
   list-style: none;
 }

 /* title-box */
 .box-title {
   width: 140px; /* default 160px */
   height: 32px;
   line-height: 32px;
   letter-spacing: 0.12em;
   display: block;
   font-size: 11px;
   text-align: center;
   text-transform: uppercase;
 }

 .selengkapnya {
   border: 1px solid rgba(244,67,54,1);
   color: rgba(244,67,54,1);
   margin: 0 auto;
 }

 /* title box */
 .bbc-indonesia .box-title {
   background: url(../images/logo-bbc-indonesia-new.png) no-repeat;
 }

 .tab .tab-pagination,
 .tab.video .tab-pagination {
   border-bottom: 1px solid #e53935;
 }

 .tab.tab-type-2 .tab-pagination {
  border-bottom: 1px solid #e53935;
  /* border-bottom: 1px solid #006064; */
 }

 .tab .tab-pagination.pagination {
   border-bottom: none;
 }

 #majalah.extra li:nth-of-type(1) {
   border-top: 1px solid #e53935;
 }

 .list.list-type-1.bbc-indonesia li:nth-of-type(1) {
   border-top: 1px solid #9a0000;
 }

 .australia-plus .box-title {
   background: url(../images/logo-australia-plus.png) no-repeat;
 }

 .list.list-type-1.australia-plus li:nth-of-type(1) {
   border-top: 1px solid #269218;
 }

 .list .card-type-1 a:nth-of-type(1) img,
 .tab .tab-content-slide a:nth-of-type(1) img,
 .card-type-3 a:nth-of-type(1) img,
 /*.widget-article img,*/
 #section-3 .col li img,
 #article #section-3 .col li img,
 #section-4 .foto.swiper-container .card-type-5 img,
 .video.tab-type-2 .tab-content-slide li:nth-of-type(2) img,
 #category .tab-type-3 .tab-content-slide li img,
 .head-newsflash a.thumbnail img {
   width: auto;
   height: 100%;
   display: block;
   position: absolute;
   top: -9999px;
   bottom: -9999px;
   left: -9999px;
   right: -9999px;
   margin: auto;
 }

 /* headline */
 #headline.headline-mobile-terbaru {
   background: #fefefe;
 }

 #headline.headline-mobile-terbaru .swiper-slide h2 {
   letter-spacing: 0.03em;
   padding: 10px 0;
 }

 #headline.headline-mobile-terbaru .swiper-slide h3 {
   display: inline-block;
   text-transform: uppercase;
   border: 1px solid #ffffff;
   padding: 6px 12px;
 }

 #headline.headline-mobile-terbaru .swiper-slide a.live h3,
 #headline.headline-mobile-terbaru .swiper-slide a.sponsor-headline h3 {
   display: inline-block;
 }

 #headline.headline-mobile-terbaru .swiper-slide figcaption,
 #section-4 .foto.swiper-container .swiper-slide figcaption {
   position: absolute;
   bottom: 0;
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
   background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, 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.75) 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.75) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
   width: 100%;
 }

 #headline.headline-mobile-terbaru .swiper-slide figcaption {
   padding-top: 10%;
 }

 #section-4 .foto.swiper-container .swiper-slide figcaption {
   height: 40%;
   z-index: 2;
 }

 #headline figcaption a {
   display: block;
   color: #fff;
   text-decoration: none;
   padding: 0 13px;
 }
 /* end headline */

 .card .wrapper {
   background: none;
 }

 #headline,
 .tab .tab-content,
 #update,
 .billboard,
 #section-2,
 #berita-pilihan,
 .w-30 .terpopuler,
 #article #section-3,
 .rectangle-ads,
 main#home #section-3 {
   margin-bottom: 30px;
 }

 main {
   padding-bottom: 30%;
 }

 main section > .w-70,
 main article,
 main#category .main-container > .w-70 {
   width: 728px;
 }

 main section > .w-30,
 main#category section .w-30,
 main#gallery section div > .w-30 {
   width: 300px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 main section > .col.w-30,
 main#category section .w-30,
 main#gallery section div > .w-30 {
   float:right;
 }

 main .container-desktop > .wrapper,
 main section .w-30 .wrapper,
 main#gallery .w-70 > .wrapper {
   padding: 0;
 }

 main section .sub-head .w-30 {
   margin: 0;
   width: 200px;
 }

 main section .sub-head .w-70 {
   margin: 0 ;
   width: auto;
 }

 /*main section .w-30 .wrapper {
   padding: 0 0 0 34px;
 }*/

 main section > .w-30 .wrapper .wrapper {
   padding: initial;
 }

 main > .container-desktop:first-child {
   /* padding-bottom: 40px; */
   /* padding-top: 10px; */
 }

 /* tab */
 /* core tab */
 .tab .wrapper {
   padding: 0;
   position: relative;
 }

 .tab .tab-pagination {
   height: 32px;
   border-bottom: 1px solid;
   margin-bottom: 10px;
 }

 .video .tab-pagination,
 .tab.tab-type-2.video .tab-pagination {
   /* border-color: #5674B9; */
   border-color: rgba(225,37,24,1);
 }

 .tab-type-1 .tab-pagination,
 .terpopuler .tab-pagination,
 .bola .tab-pagination {
  border-color: rgba(225,37,24,1);
 }

 .tab.tab-type-2.travel .tab-pagination {
   border-bottom: 1px solid #1e88e5;
 }

 /*.tekno .tab-pagination {
   border-color: #004d40;
 }*/

 /*#category .tab .tab-pagination {
   background: #f3f3f3;
 }

 #category .tab .tab-pagination .col:last-child {
   float: none;
   text-align: left;
 }

 #category .tab .tab-pagination a {
   font-size: 10px;
   letter-spacing: 0.1em;
   padding: 0 15px;
   text-transform: uppercase;
 }

 #category .tab .tab-pagination a:hover {
   background: #ccc;
   height: 31px;
 }

 #category .tab .tab-pagination a.red-500 {
   color: #ffffff;
 }*/

 .tab .tab-pagination .col:last-child {
   float: right;
   text-align: right;
 }

 .tab .tab-pagination .col:last-child a:last-child {
   margin: 0;
 }

 .tab .tab-pagination .col a {
   color: #333;
   display: inline-block;
   font-family: 'Roboto-Light', Helvetica, Arial;
   font-size: 12px;
   font-weight: 400;
   letter-spacing: 0.01em;
   line-height: 32px;
   padding: 0 10px;
   text-align: center;
   text-decoration: none;
 }

 .tab .tab-pagination a:first-child {
   margin: 0;
 }

 .tab .tab-pagination .col:last-child > li {
   display: inline-block;
   position: relative;
   text-align: right;
 }

 /*#category .tab .tab-pagination .col:last-child > li {
   display: block;
   float: left;
 }

 #category .tab .tab-pagination .col:last-child > li  {
   margin: 0;
 }

 #category .tab .tab-pagination .col:last-child > li:nth-of-type(1) {
   padding: 0;
 }

 .tab-type-3.category .w-70 {
   width: auto;
 }*/

 .tab .tab-pagination .sub-tab {
   z-index: 2;
 }

 .tab .tab-pagination .sub-tab:before,
 .menu li.sub:before {
   content: '';
   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
   -webkit-transform: rotate(90deg);
   transform: rotate(90deg);
   background-size: 4px 23px;
   width: 4px;
   height: 23px;
   position: absolute;
 }

 .tab .tab-pagination .sub-tab:before {
   top: 5px;
   right: -3px;
 }

 /*#category .tab .tab-pagination .sub-tab:before {
   right: 5px;
 }*/

 .tab .tab-pagination .sub-tab ul {
   background: rgba(0,0,0,0.9);
   position: absolute;
   width: 160px;
   opacity: 0;
   visibility: hidden;
   -webkit-transform: translate3d(0, -10px, 0);
   transform: translate3d(0, -10px, 0);
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
   text-align: left;
 }

 .tab .tab-pagination .sub-tab ul li {
   padding: 2px 0;
   display: block;
 }

 .tab .tab-pagination .sub-tab ul li a {
   color: #fff;
   padding-left: 12px;
 }

 .tab .tab-pagination .sub-tab.sub-tab-active ul {
   opacity: 1;
   visibility: visible;
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
 }

 .tab .tab-content-slide > li,
 .video.tab-type-2 .tab-content-slide li:nth-of-type(2),
 #category .video.tab-type-2 .tab-content-slide li:nth-of-type(1) {
   float: left;
   margin-bottom: 10px;
   width: 50%;
 }

 .tab-type-3 .tab-content-slide > li {
   float: none;
   width: 100%;
 }

 .headline-terbaru #headline,
 .tab .tab-content-slide li:last-child {
   margin-bottom: 0;
 }

 .tab .tab-content-slide li:nth-of-type(1) p {
   letter-spacing: 0.01em;
   margin: 0 0 10px 0;
 }

 .tab .tab-content-slide li:nth-of-type(1) a:nth-of-type(1) img,
 .tab.tab-type-2 .tab-content-slide li:nth-of-type(2) a:nth-of-type(1) img,
 #section-3 .col li:nth-of-type(1) a:nth-of-type(1) img,
 .video.tab-type-2 .tab-content-slide li:nth-of-type(2) img,
 .list.list-type-2 .card-type-1 a:nth-of-type(1) img {
   width: 100%;
   position: static;
   height: auto;
 }

 .tab .tab-content li a,
 .list li a,
 #section-3 li a:nth-of-type(2),
 #section-3 li span {
   margin-left: 10px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 #home #section-3.kanal-pilihan li:nth-of-type(1) a:nth-of-type(2) {
   margin-top: 20px;
 }

 .tab .tab-content li a:nth-of-type(1),
 .tab .tab-content li:first-child a,
 .tab.tab-type-2 .tab-content li:first-child a,
 .tab.tab-type-2 .tab-content li:nth-of-type(2) a,
 .list li a:nth-of-type(1),
 .list.list-type-2 li a,
 #section-3 li:nth-of-type(1) a,
 .tab.video .tab-content li a {
   margin-left: 0;
 }

 .tab.video .tab-content li:first-child a:nth-of-type(2) {
   padding: 0 10px;
 }

 .tab.video .tab-content li a span,
 .tab.video .tab-content li:nth-of-type(2) a span {
   margin: 10px;
 }

 .tab.video .tab-content li a:first-child {
   margin: 0;
 }

 .video.tab .tab-content-slide li a:nth-of-type(2),
 #category .video.tab-type-2 .tab-content-slide li a:nth-of-type(2),
 #category li figcaption a {
   padding: 10px;
 }

 /*#category .tab-content li a:nth-of-type(2) * {
   margin: 0 10px 10px 10px;
 }*/

 .tab-content li:nth-of-type(1) span {
   margin-left: 0;
   font-size: 12px;
 }

 .tab .tab-content-slide li h2,
 .tab .tab-content-slide li p,
 #section-3 .card p {
   color: #333;
 }

 .tab .tab-content-slide li h2 {
   font-size: 12px;
   line-height: 16px;
   letter-spacing: 0.01em;
 }

 .tab .tab-content-slide li p,
 #section-3 .card p,
 .video.tab-type-2 .tab-content-slide li:nth-of-type(2) p {
   font-size: 13px;
   line-height: 18px;
   font-weight: 300;
 }

 .tab .tab-content-slide li a:nth-of-type(1),
 #section-3 .col li a:nth-of-type(1),
 #article #section-3 .col li a:nth-of-type(1) {
   width: 90px;
   height: 90px;
   overflow: hidden;
   position: relative;
 }

 .tab.tab-type-3 .tab-content-slide li a:nth-of-type(1),
 .tab.tab-type-3 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1) {
   width: 140px;
   height: 140px;
 }

 .tab.tab-type-3 .tab-content-slide li a:nth-of-type(2),
 .tab.tab-type-3 .tab-content-slide li:nth-of-type(1) a:nth-of-type(2) {
   width: 590px;
 }

 .tab .tab-content-slide li a:nth-of-type(2),
 #section-3 .col li a:nth-of-type(2),
 #article #section-3 .col li a:nth-of-type(2) {
   width: 65%;
 }

 .tab .tab-content-slide li:nth-of-type(1) a:nth-of-type(2),
 .tab.tab-type-2 .tab-content-slide li:nth-of-type(2) a:nth-of-type(2),
 #section-3 li:nth-of-type(1) .card a:nth-of-type(2) {
   width: 100%;
 }

 .tab-content-slide {
   opacity: 0;
   visibility: hidden;
   -webkit-transition: opacity 0.8s ease;
   transition: opacity 0.8s ease;
   position: absolute;
   top: 0;
   left: 0;
 }

 .tab .tab-content-slide.selected {
   opacity: 1;
   visibility: visible;
   -webkit-transition: opacity 0.8s ease;
   transition: opacity 0.8s ease;
 }

 /* tab type 1 */
 .tab-type-1 li:nth-of-type(1) .wrapper,
 .tab-type-2 li:nth-of-type(1) .wrapper {
   padding:0 10px 0 0;
 }

 .tab-type-1 .tab-content,
 #section-3 li:nth-of-type(1) {
   min-height: 400px;
 }

 #section-3.kanal-pilihan li:nth-of-type(1) {
   min-height: 340px;
 }

 #article #section-3 li:nth-of-type(1) {
   min-height: auto;
 }

 .tab-type-1 .tab-content-slide li:first-child {
   float: left;
   min-height: 400px;
 }

 .tab-type-2 .tab-content-slide li:nth-of-type(1),
 .tab-type-2 .tab-content-slide li:nth-of-type(2) {
   float: left;
   min-height: 365px;
 }

 #category .tab-type-2 .tab-content-slide li:nth-of-type(1) {
   min-height: auto;
 }

 .tab-type-1 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1),
 .video.tab-type-2 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1),
 #section-3 .col li:nth-of-type(1) a:nth-of-type(1),
 .tab.video > .wrapper {
   width: 100%;
   height: 100%;
 }

 .tab-type-1 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1) {
   height: 180px;
 }

 .tab .tab-content-slide li:nth-of-type(1) h2.title,
 .tab-type-2 .tab-content-slide li:nth-of-type(2) h2.title {
   padding: 5% 0;
 }

 /* tab type 2 */
 .tab-type-2 .tab-content {
   min-height: 750px;
 }

 .video.tab-type-2 .tab-content {
   min-height: 1550px;
 }

 #category .video.tab-type-2 .tab-content {
   min-height: 640px;
 }

 .category.tab-type-3 .tab-content {
   min-height: 1500px;
 }

 #section-3 li:nth-of-type(1) .card a:nth-of-type(2) *,
 .video.tab-type-2 .tab-content-slide li:nth-of-type(1) a:nth-of-type(2) h2 {
   margin-left: 0;
 }

 .video.tab-type-2 .tab-content-slide li:nth-of-type(1) {
   width: 100%;
 }

 .video.tab-type-2 .tab-content-slide li:nth-of-type(2) {
   /*height: 90px;*/
   min-height: auto;
   float: left;
 }

 .video.tab-type-2 .tab-content-slide li {
   float: left;
 }

 .video.tab-type-2 li:nth-of-type(2n+1) .wrapper,
 #category .video.tab-type-2 li:nth-of-type(2n+2) .wrapper {
   padding-left: 10px;
 }

 /* padding: 0 */
 .video.tab-type-2 li:nth-of-type(1) .wrapper,
 .video.tab-type-2 li:nth-of-type(2n) .wrapper,
 #category .video.tab-type-2 li:nth-of-type(2n+1) .wrapper,
 .tab.tab-type-3 .wrapper,
 .tab-type-2.video .tab-content-slide li:nth-of-type(2) h2.title,
 .list.list-type-1.indikator .wrapper {
   padding: 0;
 }

 #category .video.tab-type-2 li:nth-of-type(2n+1) .wrapper {
   position: relative;
 }

 /* end tab */

 .tab .tab-content-slide li:nth-of-type(1) h2.title,
 .tab.tab-type-2 .tab-content-slide li:nth-of-type(2) h2.title,
 #section-3 li:nth-of-type(1) a:nth-of-type(2) h2.title,
 .video.tab-type-2 .tab-content-slide li h2.title {
   font-size: 22px;
   line-height: 26px;
   height: auto;
   color: #333;
   font-weight: 500;
 }

 .tab.tab-type-3 .tab-content-slide li:nth-of-type(1) a:nth-of-type(2) h2.title,
 .tab.tab-type-3 .tab-content-slide li a h2.title,
 .video.tab-type-2 .tab-content-slide li:first-child h2.title {
   font-size: 20px;
   line-height: 26px;
 }

 .tab .tab-content-slide a,
 .card-type-4 h2 {
   color: #333;
   text-decoration: none;
 }

 .card-type-4 h2 {
   font-size: 15px;
   line-height: 20px;
   height: auto;
   margin: 3% 0;
 }

 /* indikator */
 #indikator {
   margin-bottom: 30px;
 }

 #indikator h2.title {
   font-size: 18px;
   font-weight: 400;
   line-height: 22px;
 }

 .indikator ul {
   display: block;
   margin: 0 auto;
   text-align: left;
 }

 .indikator ul li{
   color: #AAAAAA;
   position: relative;
   float: left;
   width: 33.3%;
 }

 .indikator ul li:last-child {
   margin-right: 0;
 }

 .indikator ul li input[type=radio]{
   position: absolute;
   visibility: hidden;
 }

 .indikator ul li label{
   display: inline-block;
   position: relative;
   font-weight: 300;
   font-size: 1.35em;
   padding-left: 25px;
   height: 30px;
   z-index: 0;
   cursor: pointer;
   -webkit-transition: all 0.25s linear;
 }

 .indikator ul li:hover label{
   color: #000;
 }

 .indikator ul li .check{
   display: block;
   position: absolute;
   border: 2px solid #e53935;
   border-radius: 50%;
   height: 16px;
   width: 16px;
   top: 5px;
   left: 0;
   z-index: -1;
   transition: border 0.25s linear;
   -webkit-transition: border 0.25s linear;
 }

 .indikator ul li:hover .check {
   border: 2px solid #e53935;
   box-shadow: 0px 0px 16px #e53935;
   transition: all 0.25s linear;
   -webkit-transition: all 0.25s linear;
 }

 .indikator ul li .check::before {
   display: block;
   position: absolute;
   content: '';
   border-radius: 100%;
   height: 16px;
   width: 16px;
   top: 0;
   left: 0;
   margin: auto;
   transition: background 0.25s linear;
   -webkit-transition: background 0.25s linear;
 }

 .indikator p.jawab-indikator {
   font-size: 13px;
   line-height: 30px;
   margin: 0;
 }

 .indikator input[type=radio]:checked ~ .check {
   border: 2px solid #e53935;
   background: #e53935;
 }

 .indikator input[type=radio]:checked ~ .check::before{
   background: #e53935;
 }

 .indikator input[type=radio]:checked ~ label{
   color: #e53935;
 }

 .indikator  div.clearfix {
   display: block;
   margin: 10px auto 0;
   width: 40%;
 }

 .indikator  button {
   outline: 0;
   border: 0;
   padding: 6px 12px;
   line-height: 12px;
   color: #555;
 }

 .indikator button:hover {
   background: rgba(244,67,54,1);
   color: #fff;
   cursor: pointer;
   transition: all 0.5s ease;
 }

 .list.list-type-1.indikator h2 {
   display: block;
   font-size: 18px;
   line-height: 22px;
 }

 .list.list-type-1.indikator li {
   margin: 1em 0;
 }

 .list.list-type-1.indikator li:nth-of-type(1) {
   margin-top: 0;
   border: 0;
 }

 #indikator .data-hasil {
   background: #fff;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 #indikator .data-hasil .white {
   border-bottom: 1px solid #e53935;
 }

 #hasil-survey {
   width: 100%;
   height: 250px;
 }

 .list.list-type-1.indikator > .wrapper:last-child {
   text-align: center;
 }

 /* berita pilihan */
 #berita-pilihan .row {
   margin-bottom: 15px;
 }

 #berita-pilihan .row:last-child {
   margin-bottom: 0;
 }

 #berita-pilihan .col .wrapper {
   padding: 0;
 }

 #berita-pilihan li {
   margin-bottom: 10px;
 }

 #berita-pilihan li .card-type-4 {
   padding-right: 10px;
 }

 #berita-pilihan li:nth-of-type(3n+0) .card-type-4 {
   padding-right: 0;
 }

 #berita-pilihan li a:nth-of-type(1) {
   height: 128px;
   overflow: hidden;
 }
 /* berita pilihan */

 .center {
   display: flex;
 }

 /* button */
 a.button {
   cursor: pointer;
   display: inline-block;
   text-decoration: none;
   text-transform: uppercase;
   padding: 10px 20px;
   border: 1px solid #e53935;
   color: #e53935;
   font-size: 12px;
   margin: 10px auto;
 }

 .swiper-container.content {
   width: 1064px;
 }

 .pic-zoom img{
   -webkit-transform: scale3d(1, 1, 1);
   transform: scale3d(1, 1, 1);
   transition: all 1s ease-out;
 }

 .pic-zoom img:hover {
   -webkit-transform: scale3d(1.2, 1.2, 1.2);
   transform: scale3d(1.2, 1.2, 1.2);
   -webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
   backface-visibility: hidden;
   transition: all 0.8s ease;
 }

 .pic-zoom .swiper-slide:nth-of-type(1) img,
 .tab .tab-content-slide li:nth-of-type(1) a:nth-of-type(1) img {
   transition: all 2.5s ease-out;
 }

 .pic-zoom .swiper-slide:nth-of-type(1) img:hover,
 .tab .tab-content-slide li:nth-of-type(1) a:nth-of-type(1) img:hover,
 .tab.tab-type-2 .tab-content-slide li:nth-of-type(2) a:nth-of-type(1) img:hover {
   transition: all 5.5s linear;
 }

 .swiper-container.content > .swiper-wrapper,
 #headline.swiper-container .swiper-wrapper {
   display: block;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-of-type(1) {
   width: 50%;
   height: 280px;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-of-type(1) .wrapper {
   /*padding: 0 5px 0 0;*/
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide {
   width: 25%;
   height: 140px;
   border-right: 5px solid #fff;
   border-bottom: 5px solid #fff;
   box-sizing: border-box;
   float: left;
   overflow: hidden;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-child(2n+1) {
   border-right: 0;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-child(1) {
   border-right: 5px solid #fff;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide h2 {
   font-size: 16px;
   font-weight: 400;
   letter-spacing: 0.01em;
   line-height: 20px;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide h3 {
   font-size: 11px;
   font-weight: 400;
   padding: 4px 10px;
   display: none;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-of-type(1) h2 {
   font-size: 24px;
   line-height: 28px;
 }

 #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-of-type(1) h3 {
   font-size: 13px;
 }

 #headline .swiper-pagination {
   display: none;
 }

 #headline .swiper-slide a:nth-of-type(1) {
   overflow: hidden;
   display: block;
   position: relative;
 }

 .terpopuler.col {
   float: left;
 }

 /* update terbaru desktop */
 .list li {
   margin-bottom: 10px;
 }

 .list.list-type-1 li:nth-of-type(1),
 .list.list-type-2 li:nth-of-type(-n+2) {
   border-top: 1px solid #e53935;
   padding-top: 10px;
 }

 .list.list-type-1.terpopuler li:nth-of-type(1) {
   padding-top: 20px;
 }

 .list.list-type-2.tempo-channel li:nth-of-type(-n+2) {
   border-top: 1px solid #ffa000;
 }

 .list li:last-child {
   margin-bottom: 0;
 }

 .list li a {
   display: inline-block;
   position: relative;
 }

 .list.list-type-1 li a:nth-of-type(1) {
   width: 90px;
   height: 90px;
   overflow: hidden;
 }

 .list.list-type-2 li a:nth-of-type(1) {
   width: 100%;
   height: 80px;
   overflow: hidden;
 }

 .list.list-type-2 li {
   width: 50%;
   float: left;
 }

 .list.list-type-2 li:nth-child(2n+1) .wrapper {
   padding-left: 5px;
 }

 .list.list-type-2 li:nth-child(2n+2) .wrapper {
   padding-right: 5px;
 }

 .list li.wrapper {
   padding: 0;
 }

 .list.list-type-1 li a:nth-of-type(2) {
   width: 65%;
 }

 .list.list-type-1.indikator li a:nth-of-type(1) {
   width: 100%;
   height: auto;
 }

 .list.list-type-1.indikator li a {
   color: #000;
   height: auto;
 }

 /*.list.list-type-1 li a:nth-of-type(2) *,
 #section-3 li .card a:nth-of-type(2) *,
 #article #section-3 li .card a:nth-of-type(2) * {
   margin-left: 10px;
 }*/

 #article #section-3 li:nth-of-type(1) .card h2.title {
   margin: 0 0 0 10px;
 }

 .list li a:nth-of-type(2) h2.title,
 .tab .tab-content-slide li h2.title,
 .list.list-type-2 li a:nth-of-type(2) h2.title,
 #section-3 li .card h2.title,
 .terpopuler.list li a:nth-of-type(2) h2.title,
 .tab.tab-type-3 .tab-content .tab-content-slide li h2.title,
 .video.tab-type-2 .tab-content-slide li a:nth-of-type(2) h2.title {
   display: inline-block;
   color: #333;
   width: 100%;
   height: 75px;
   overflow: hidden;
 }

 .list.bbc-indonesia li a:nth-of-type(2) h2.title {
   height: 80px;
 }

 .terpopuler.list li a:nth-of-type(2) h2.title,
 .terpopuler.list li .info-tempo {
   margin-bottom: 0;
 }

 .tab.tab-type-3 .tab-content-slide li:nth-of-type(1) h2.title,
 .tab.tab-type-3 .tab-content-slide li h2.title {
   margin: 0 0 5px 18px;
 }

 .list.list-type-2 li a:nth-of-type(2) h2.title {
   height: auto;
 }

 .list li a:nth-of-type(2) h2.title,
 .list.list-type-2 li a:nth-of-type(2) h2.title,
 #section-3 li .card h2.title,
 #article #section-3 li .card h2.title {
   font-size: 15px; /* default 13px */
   line-height: 19px;
 }

 .list.terpopuler li a:nth-of-type(2) h2.title {
   font-size: 16px;
   line-height: 22px;
 }

 .tab .tab-content-slide li h2.title {
   font-size: 16px;
   line-height: 20px;
 }

 .list.list-type-2 li a:nth-of-type(2) h2.title {
   margin: 5% 0;
   height: 55px;
   overflow: hidden;
 }

 .tab-content-slide li span,
 .list li a span,
 .tab-content li span {
   font-size: 10px;
   color: #666;
 }
 /* end update terbaru desktop */

 .list-type-3 li:nth-of-type(1):before {
   content: '';
   background-color: #e53935;
   width: 100%;
   height: 1px;
   position: absolute;
   top: -10px;
 }

 .list-type-3 li {
   margin: 5px 0;
   padding: 10px 0;
   background: #eee;
 }

 .list-type-3 li:nth-of-type(1) {
   margin-top: 10px;
 }

 .list-type-3 li a {
   color: #333;
   padding-left: 10px;
 }

 #indikator .row:nth-of-type(1),
 #berita-pilihan .row:nth-of-type(1),
 #section-3 li:nth-of-type(1),
 #article #section-3 li:nth-of-type(1),
 .list li:nth-of-type(1).wrapper {
   border-top: 1px solid #f44336;
   padding-top: 10px;
 }

 #section-3 .wrapper {
   padding: 0;
 }

 #section-3 .col > .wrapper {
   padding: 0 7.5px;
 }

 #article #section-3 .col:last-child > .wrapper:nth-of-type(1),
 #section-3 .col:first-child .wrapper {
   padding: 0 15px 0 0;
 }

 #section-3 .col:last-child > .wrapper:nth-of-type(1) {
   padding: 0 0 0 15px;
 }

 #section-3 .col:first-child .wrapper .wrapper {
   padding: 0;
 }

 #section-3 li {
   margin-bottom: 10px;
 }

 #section-3 li:last-child {
   margin-bottom: 0;
 }

 #section-3 .card span {
   color: #333;
   font-size: 10px;
 }

 #section-4 .foto.swiper-container {
   width: 100%;
 }

 #section-4 .video.swiper-container,
 #section-4 .foto.swiper-container,
 .gallery-title {
   background: #000;
   padding: 30px 0;
 }

 #section-4 .foto.swiper-container .container-desktop > a:nth-of-type(1) h2 {
   color: #fff;
   font-family: 'Poppins-Light', Helvetica, Arial;
   font-size: 12px;
   letter-spacing: 4.6px;
   text-transform: uppercase;
   margin: 15px 0 25px 25px;
   position: relative;
 }

 #section-4 .foto.swiper-container .container-desktop > a:nth-of-type(1) h2:after {
   border: 0;
   content: '';
   position: absolute;
   left: -50px;
   top: 22px;
   width: 20%;
   height: 1px;
   background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.75), rgba(0, 0, 0, 0));
 }

 #category #section-4 .foto.swiper-container .container-desktop > h2:nth-of-type(1):after {
   content: '';
   background-image: none;
 }

 #section-4 .foto-home.swiper-container .swiper-slide {
   background-position: center;
   background-size: cover;
   width: 300px;
   height: 300px;
 }

 #section-4 .foto-detail.swiper-container .swiper-slide {
   background-position: center;
   background-size: cover;
   width: 720px;
 }

 #section-4 .foto.swiper-container .swiper-button-next,
 #section-4 .foto.swiper-container .swiper-button-prev {
   color: #ff0000;
   background-color: rgba(0,0,0,0.75);
 }

 #section-4 .foto.swiper-container .card-type-5 .wrapper {
   padding: 0;
   position: relative;
 }

 #section-4 .foto-home.swiper-container .card-type-5 a:nth-of-type(1).col {
   display: block;
   width: 300px;
   height: 300px;
   overflow: hidden;
   color: #fff;
   position: relative;
 }

#section-4 .foto-detail.swiper-container .card-type-5 a:nth-of-type(1).col {
  width: 720px;
  height: 405px;
 }

#section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:before,
#gallery #section-4 .foto-detail.swiper-container .card-type-5 a:nth-of-type(1).col:before {
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background-color: rgba(0,0,0,0.5);
   z-index: 1;
 }


 #gallery #section-4 .foto-detail.swiper-container .swiper-slide figcaption {
   content: '';
   position: static;
   background-color: none;
 }

.foto-home.swiper-container .card-type-5 a:nth-of-type(1).col:hover:before,
.foto-home.swiper-container .card-type-5 a:nth-of-type(1).col:hover:after,
#gallery #section-4 .foto-detail.swiper-container .swiper-slide-active .card-type-5 a:nth-of-type(1).col:before {
   content: '';
   background-color: rgba(0,0,0,0);
   background-position: -80px -238px;
   transition: background-color 0.5s ease;
 }

 #gallery #section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:hover:before,
 #gallery #section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:hover:after {
   z-index: -1;
 }

 /*@keyframes appear {
   0% {
     background-color: rgba(0,0,0,0.5);
     background-position: -8px -238px;
     z-index: 1;
   }

   100% {
     background-color: rgba(0,0,0,0);
     background-position: -80px -238px;
     z-index: 0;
   }
 }*/

 #section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:after {
   content: '';
   position: absolute;
   margin: 25% auto;
   left: 0;
   right: 0;
   width: 64px;
   height: 64px;
   overflow: hidden;
   background-image: url(../images/sprites.png);
   background-repeat: no-repeat;
   background-position: -8px -238px;
   z-index: 2;
 }

 #gallery #section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:after {
   content: '';
   background-image: none;
 }

 #gallery #section-4 .foto.swiper-container .card-type-5 a:nth-of-type(1).col:after {
   margin: 40% auto;
 }

 #section-4 .foto.swiper-container .card-type-5 figcaption a * {
   display: block;
   padding: 0 10px;
 }

 #section-4 .foto.swiper-container .card-type-5 figcaption h2.title {
   color: #fff;
   font-size: 16px;
   position: absolute;
   bottom: 30px;
 }

 #section-4 .foto.swiper-container .card-type-5 figcaption span {
   font-size: 10px;
   /*margin: 10% 0;*/
   color: #fff;
   position: absolute;
   bottom: 10px;
 }

 #section-5.clearfix {
   padding-top: 30px;
 }

 .pswp h2.title {
   color: #fff;
   display: block;
   font-size: 16px;
   line-height: 22px;
   padding-bottom: 2%;
 }

 .pswp span.time {
   color: #fff;
   padding-bottom: 10%;
 }

 #gallery > .container-desktop:last-child {
   margin-top: 30px;
 }

 #gallery .pswp__caption__center {
   max-width: 728px;
 }

 #gallery .foto .container-desktop {
   margin-bottom: 5%;
 }

 .gallery-title h1,
 .gallery-title h4,
 .gallery-title p,
 .gallery-title span.date {
   color: #fff;
 }

 .gallery-title {
   margin-top: 1em;
 }
 /* video */

 .container-desktop .wrapper #section-5 {
   padding-top: 10px;
 }

 #category h1,
 #home h1 {
   margin-bottom: 15px;
 }

 #category .features{
   box-sizing: border-box;
   list-style: none;
 }

 #category section.features,
 #trending.list-type-3 {
   margin-bottom: 30px;
 }

 .tab-type-2 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1),
 .tab-type-2 .tab-content-slide li:nth-of-type(2) a:nth-of-type(1),
 .video.tab .tab-content-slide li a,
 #category .card-type-5 figcaption a {
   width: 100%;
 }

 .tab-type-2 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1),
 .tab-type-2 .tab-content-slide li:nth-of-type(2) a:nth-of-type(1),
 .video.tab .tab-content-slide li a:nth-of-type(1),
 #category .video.tab-type-2 .tab-content-slide li:nth-of-type(1) a:nth-of-type(1),
 #category .card-type-5 a:nth-of-type(1),
 #section-3.kanal-pilihan .col li:nth-of-type(1) a:nth-of-type(1) {
   background: #ddd;
   height: 180px;
   overflow: hidden;
 }

 #category .features .card-type-5 a:nth-of-type(1) {
   height: 260px;
 }

 #category .card-type-5 figcaption a {
   height: auto !important;
 }

 .video.tab .tab-content-slide li a:nth-of-type(1) img {
   display: block;
   width: 100%;
 }

 .video.tab .tab-content-slide li a {
   border-right: 1px solid #ddd;
   border-left: 1px solid #ddd;
   box-sizing: border-box;
 }

 .video.tab .tab-content-slide li a:first-child {
   border: 0;
 }

 .video.tab .tab-content-slide li a:last-child {
   border-bottom: 1px solid #ddd;
 }

 .video.tab .tab-content-slide li figcaption {
   position: relative;
   bottom: 0;
 }

 .video.tab .tab-content-slide li figcaption * {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   padding: 0 10px;
 }


 .video.tab .tab-content-slide li:nth-of-type(1) h2 {
   padding: 2.5% 0;
 }


 #category .video.tab .tab-content-slide li:nth-of-type(1) figcaption a * {
   margin: 0;
 }

 .video .card a.play {
   position: relative;
   height: 200px;
   overflow: hidden;
 }

 .video .card a.play:before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5);
   z-index: 1;
 }

 .video .card a.play:after,
 #category .w-70 li a.play:after {
   content: '';
   display: block;
   position: absolute;
   top: 30%;
   left: 50%;
   margin-left: -11.5%;
   /*transform: translate3d(-50%, -50%, 0);*/
   width: 64px;
   height: 64px;
   background: url(../images/sprites.png) no-repeat;
   background-size: 970px 470px;
   background-position: -5px -85px;
   z-index: 2;
 }

 .video li:nth-of-type(1) a.play:after {
   width: 125px;
   height: 125px;
   background-size: 1640px;
   background-position: 0px -135px;
   top: 35%;
   margin-left: -9.5%;
 }

 .video .card.card-type-1 a.play:after,
 #category .w-30 .video li:nth-of-type(1) a.play:after {
   width: 32px;
   height: 32px;
   background-size: 485px;
   background-position: -2.5px -43px;
 }

 .video .features li:nth-of-type(1) .card-type-5 a.play:after {
   width: 120px;
   height: 120px;
   background-size: 1550px; /* default 1940px */
   background-position: -5px -135px;
 }

 /* slide category */
 #category .card-type-6 .wrapper a:nth-of-type(2) {
   padding: 10px;
   box-sizing: border-box;
 }

 #category .card-type-6 .wrapper a:nth-of-type(2) {
   width: 100%;
 }

 .card-type-5 figcaption * {
   color: #333;
 }

 #category > h1 {
   font-size: 36px;
   margin: 1.5% 0;
 }

 #category .tags h1 {
   margin: 0 0 1.5%;
 }

 #category .tags h3 {
   font-size: 12px;
 }

 #category .w-50:nth-of-type(1) .wrapper {
   padding-left: 0;
 }

 #category .w-50:nth-of-type(2) .wrapper {
   padding-right: 0;
 }

 #category .w-50:nth-of-type(1) .wrapper,
 #category .w-70 .w-50:nth-of-type(1) .wrapper {
   padding-right: 0;
 }

 #category .w-50:nth-of-type(2) .wrapper {
   padding-left: 10px;
 }

 #category .card-type-5 h2,
 #category .card-type-6 h2.title {
   font-size: 16px;
   line-height: 22px;
   height: 70px;
   overflow: hidden;
   color: #333;
   padding: 0 10px;
 }

 #category section:nth-of-type(1) .card-type-5 h2 {
   font-size: 20px;
   line-height: 26px;
   height: 82px;
 }

 #category section .row {
   margin-bottom: 10px;
 }

 .tab#category .features figcaption a h2.title {
   margin: 2% 0;
 }

 #category section#section-4 {
   margin: 10px 0 20px;
   background: #f7f8f9;
 }

 #category section .foto h1,
 #gallery section .foto h1 {
   color: #fff;
 }

 #category article.swiper-slide {
   background: #fff;
 }

 #category .category-headline .swiper-wrapper {
   padding-top: 2.5%;
   /*-webkit-transform: translate3d(165.375px, 0px, 0px) !important;
   transform: translate3d(165.375px, 0px, 0px) !important;*/
 }

 #category .card-type-6 .wrapper {
   padding: 0;
 }

 #category .card-type-6 span.time {
   color: #555;
 }

 #category section .foto .container-desktop {
   margin-bottom: 30px;
 }

 #category .swiper-button-white {
   background-color: rgba(0,0,0,0.5);
   padding: 1.5% 0;
 }

 #category .swiper-button-next.swiper-button-white {
   padding-left: 3em;
   right: 2%;
 }

 #category .swiper-button-prev.swiper-button-white {
   padding-right: 3em;
   left: 2%;
 }

 #category.index h1 {
   margin: 0.5em 0 1em;
 }

 #category.tags h1 {
   margin-bottom: 1em;
 }

 #gallery .gallery-title .brightcove.wrapper {
   padding: 0;
   margin-top: 30px;
   width: 728px;
   height: 405px;
   position: relative;
 }

 /* index */

 #index section {
   margin-top: 20px;
 }

 #index section .w-70 > .wrapper *,
 #index section .w-70 li .wrapper > a {
   display: inline-block;
 }

 #index a#tanggal-index {
   display: block;
 }

 #index .tooltip {
  transform: translate3d(-30px, 13px, 0);
 }

 #index .tooltip .wrapper {
   padding: 0 10px !important;
   text-align: center;
 }

#index .tooltip.active {
  transform: translate3d(-30px, 3px, 0);
}

 #index .tooltip .arrow-up,
 #index .tooltip.active .arrow-up {
  transform: translate3d(45px, -8px, 0);
 }

 #index section .w-70 > .wrapper input {
   border: 1px solid #ccc;
   margin-left: 5%;
 }

 #index section .w-70 li {
   padding: 20px 0;
   margin: 0;
   display: block;
   border-bottom: 0.5px solid #ccc;
 }

 #index section .w-70 li .wrapper > a.col:nth-of-type(1) {
   background: #000;
   width: 190px;
   height: 115px;
   margin-right: 5px;
 }

 #index section .w-70 li .wrapper > a.col:nth-of-type(2) {
   width: 70%;
 }

 #index section .w-70 li .wrapper > a.col:nth-of-type(2) h2 {
   font-size: 20px;
   line-height: normal;
   letter-spacing: 0.16px;
   height: 50px;
   overflow: hidden;
 }

 #index section .w-70 li .wrapper > a.col:nth-of-type(2) p {
   color: #777;
   font-size: 13px;
   line-height: normal;
   height: 45px;
   overflow: hidden;
   margin-bottom: 5px;
 }

 #index #pilih-kanal select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #e53935;
  border-radius: 0;
  background: #fff;
  color: #e53935;
  font-size: 12px;
  margin: 10px auto;
  padding: 10px 20px;
  width: 125px;
 }

 #index #pilih-kanal select::-ms-expand {
  display: none; /* hide the default arrow in ie10 and ie11 */
}

#index.tags h5 {
  font-size: 150%;
  color: #777;
}

#index.tags h3 {
  font-size: 220%;
  margin: 2% 0 5%;
}

#index.tags section {
  margin-top: 0;
}

#index nav.navigation a {
  display: inline-block;
  color: #e53935;
  margin: 0 6px;
  padding: 8px 16px;
}

#index nav.navigation a:first-child {
  margin-left: 0;
}

#index nav.navigation a.active {
  background: #e53935;
  color: #fff;
  padding: 8px 16px;
}

 .bc-player-HJWXWi5XxW_default,
 .brightcove iframe {
   width: 728px;
   height: 405px;
 }

 .r3 .rectangle,
 .widget .wrapper {
   border-top: 1px solid #e53935;
 }

 /* terpopuler */
 .terpopuler.list .card-type-1 a:nth-of-type(2) {
   width: 75%;
 }

 .terpopuler.list .card-type-1 a:nth-of-type(2) * {
   padding-left: 5%;
 }

 .terpopuler.list .card-type-1 a:nth-of-type(1) {
   -webkit-border-radius: 50%;
   border-radius: 50%;
   width: 40px;
   height: 40px;
   border: 1px solid #e53935;
   color: #e53935;
   font-size: 22px;
   text-align: center;
   line-height: 40px;
   margin-top: 5px;
 }

 .terpopuler .card-type-1 a:nth-of-type(2) h2.title {
   color: #555;
 }

 .terpopuler.list .card-type-1 a:nth-of-type(2) span {
   color: #aaa;
   margin-top: 2%;
 }
 /* end terpopuler */

 /* widget */
 .widget-article .wrapper a:nth-of-type(1) {
   display: block;
   height: 210px; /* default 250px */
   overflow: hidden;
   margin-top: 10px;
   position: relative;
 }

 .widget-article h2 {
   color: #333;
   display: inline-block;
   font-size: 16px;
   margin: 5px 0 10px;
 }

 .widget-article p {
   font-size: 12px;
   font-weight: 300;
   line-height: 18px;
   margin: 10px 0;
 }

 .swiper-container.majalah .swiper-slide {
   height: 300px;
 }

 .swiper-container.majalah .swiper-slide img {
   width: 65%;
   margin: 10% auto;
 }

 .swiper-container.kolom-navigation .swiper-button-next,
 .swiper-container.kolom-navigation .swiper-button-prev {
   top: 80%;
   background-color: #ccc;
   padding: 5px 0px;
   height: 12px;
   width: 18px;
   background-size: 18px 12px;
 }

 .extra {
   margin-bottom: 30px;
 }

 .kolom-konten {
   height: auto;
   width: 100%;
 }

 .kolom-navigation {
   height: 40px;
   box-sizing: border-box;
   background: #eee;
 }

 .kolom-navigation .swiper-slide {
   width: 35%;
   height: 100%;
   opacity: 0.4;
   background: #ccc;
 }

 .kolom-navigation .swiper-slide-active {
   opacity: 1;
 }

 .kolom-navigation .swiper-slide h4 {
   font-size: 12px;
   text-align: center;
   line-height: 40px;
 }

 .kolom-navigation .swiper-slide h4 a {
  color: #333;
 }

 .kolom-konten .swiper-slide li {
   margin: 15px 0;
 }

 .kolom-konten .swiper-slide li a {
   font-size: 16px;
   color: #000;
   text-decoration: none;
 }

 /* article */

 #article .w-70 .wrapper {
   padding: 0;
 }

 nav.breadcrumbs {
   padding: 10px 0;
 }

 nav.breadcrumbs li {
   display: inline-block;
   margin: 0 10px;
   position: relative;
 }

 nav.breadcrumbs li:first-child {
   margin-left: 0;
 }

 nav.breadcrumbs li a:after {
   content: '';
   background-size: 8px 8px;
   width: 8px;
   height: 8px;
   position: absolute;
   right: -5px;
   top: 5px;
 }

 nav.breadcrumbs li:last-child a:after {
   content: none;
 }

 nav.breadcrumbs li a {
   color: #000;
   display: block;
   font-family: 'Roboto', Helvetica, Arial;
   font-size: 12px;
   line-height: 17px;
   position: relative;
   padding-right: 20px;
   text-transform: uppercase;
 }

 section hr {
   margin: 5% auto;
 }

 article h1 {
   display: inline-block;
   font-weight: 500;
   margin: 2% 0 1%;
 }

 .sub-head {
   margin: 10px 0;
 }

 .sub-head .w-70 > .w-50:nth-of-type(1) {
  width: 100%;
 }

 .sub-head .w-70 > .w-50:nth-of-type(2) {
  width: 0;
 }

 .sticky.sub-head .w-70 > .w-50 {
   width: initial;
 }

 .sticky.sub-head .toolbar {
  visibility: visible;
 }

 .sub-head .toolbar {
  visibility: hidden;
  position: relative;
 }

 .sub-head .toolbar li {
   position: relative;
 }

 .sub-head .toolbar select#font-family {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  padding: 2px 10px;
  border-radius: 0;
  line-height: normal;
 }

 .sub-head .toolbar > li:nth-of-type(1):before {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  position: absolute;
  top: 5px;
  right: 5px;
  background-size: 8px 8px;
  background-repeat: no-repeat;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
 }

 .sub-head .author *,
 .sub-head span {
   display: inline-block;
 }

 .sub-head:nth-of-type(1) a.pw-widget.__pw-padding-true.__pw-layout-horizontal .pw-button:last-child {
   padding-right: 0;
 }

 .w-70 .author:nth-of-type(2) {
   padding: 1em 0;
 }

 .sub-head.sticky .col > a.box-title {
		font-size: 9px;
		line-height: 28px;
		width: 120px;
		height: 28px;
 }

 .sub-head.sticky .col > .w-50:nth-of-type(2),
 .sub-head.sticky .col > .w-50:nth-of-type(2) .toolbar {
	 float:right;
 }

 .sub-head.sticky .pw-button.__pw-size-32.__pw-counter-horizontal .pw-button__outer {
	 padding-right: 0;
	 height: 28px;
 }

 .sub-head.sticky .pw-button.__pw-size-32 .pw-button__outer {
	 min-height: 28px;
 }

 .sub-head.sticky .pw-button.__pw-size-32.__pw-counter-horizontal .pw-button-counter {
	margin-left: 3px;
	padding-left: 0;
	font-size: 10px;
	min-width: 25px;
	line-height: 28px;
 }

 .sub-head.sticky .pw-button.__pw-size-32 .pw-button-icon {
	 width: 16px;
	 min-height: 28px;
	 line-height: 28px;
 }

 .sub-head.sticky .pw-button-icon.__pw-size-32 {
		font-size: 13px;
 }

 .sub-head .toolbar {
	 height: 28px;
	 line-height: 16px;
	 margin: 5px 0;
 }

 .sub-head .toolbar li {
	 display: inline-block;
	 margin-right: 5px;
 }

 .sub-head .toolbar li span {
		font-size: 13px;
 }

 .sub-head .toolbar li a.font-size {
	 display: inline-block;
	 color: #fff;
	 background: #e53935;
	 padding: 0px 6px;
	 font-size: 12px;
	 line-height: 17px;
 }

 article > .author {
   margin: 10px 0;
   padding: 2% 0 3%;
 }

 article img {
   max-width: 728px;
   margin: 0 auto;
 }

 figure a {
   display: block;
 }

 #gallery .author {
   margin: 5px 0 10px;
 }

 .author h4 {
   margin-left: 5px;
   font-size: 14px;
   color: #e53935;
 }

 .author p {
   font-size: 12px;
 }

 .author li,
 .author li a {
   display: inline-block;
 }

 .author li a {
   width: 48px;
   height: 48px;
   overflow: hidden;
   border-radius: 50%;
 }

 article > figure:nth-of-type(1) a:nth-of-type(1) {
   display: block;
   width: 728px;
   height: 405px;
   overflow: hidden;
 }

 article figure figcaption {
   margin: 10px 0;
 }

 article figure figcaption p {
   color: #777;
   font-size: 11px;
   font-style: italic;
   line-height: 16px;
 }

 article a,
 article a:visited,
 article p a {
   color: #00b0ff;
 }

 article p {
   color: #333;
   font-size: 16px;
   font-weight: 400;
   letter-spacing: 0.01em;
   line-height: 22px;
   margin: 1em 0;
 }

 article strong {
   font-weight: 500;
 }

 article p em {
   font-style: italic;
   margin-right: 2px;
 }

 article ol,
 article ul {
   margin: 1em 1em 1em 2em;
 }

 article ul li {
   list-style: disc;
 }

 article ol li {
   list-style: decimal;
 }

 article h2,
 article h3,
 article h4,
 article h5,
 article h6 {
   display: block;
   margin: 1em 0;
 }

 article p iframe,
 article iframe.instagram-media,
 article twitterwidget {
   display: block;
   margin: auto !important;
 }

 .baca-juga {
   border: 1px solid #e53935;
   margin: 1em;
   padding: 1em;
   position: relative;
 }

 .baca-juga h3 {
   background: #fbfbfb;
   display: block;
   font-size: 18px;
   margin: -28px auto 0;
   padding: 0 5px;
   text-align: center;
 }

 .baca-juga li {
   margin: 1em 0;
 }

 .baca-juga li:last-child {
   margin: 0;
 }

 .baca-juga li a {
   color: #e53935;
 }

 /* tags */
 .tags {
   margin: 1em 0;
 }

 .tags > li {
   display: inline-block;
   margin-bottom: 4px;
 }

 .tags > li a {
   background: #00b0ff;
   color: #fff;
   display: block;
   font-size: 12px;
   line-height: 12px;
   padding: 10px 20px;
 }
 /* end tags */

 /* comments */
 .comments {
   margin-bottom: 30px;
 }

 .fb_iframe_widget,
 .fb_iframe_widget span,
 .fb_iframe_widget span iframe[style] {
   min-width: 100% !important;
   width: 100% !important;
 }

 .comments-count * {
   display: inline-block;
 }
 /* end comments */
 nav.pagination {
   margin: 40px 0;
   text-align: center;
 }

 nav.pagination li {
   list-style: none;
   display: inline-block;
 }

 nav.pagination li a {
   color: #111;
   padding: 10px 15px;
 }

 nav.pagination li a:hover,
 nav.pagination li a.active {
   background: #e53935;
   color: #fff;
   padding: 10px 15px;
   -webkit-transition: all 0.5s ease-in;
   transition: all 0.2s ease-in;
 }

 /* end article */

 #article .w-70 section.kanal-pilihan > .wrapper {
   margin-bottom: 30px;
 }

 footer {
   height: 340px;
   box-sizing: border-box;
   background: #000;
 }

 footer .wrapper {
   padding: 30px 20px;
 }

 footer .logo-tempo {
   width: 200px;
   height: 40px;
   background-size: 470px;
   background-position: -230px 0;
 }

 footer nav li {
   margin-bottom: 10px;
 }

 footer nav li a {
   color: #fff;
   font-size: 11px;
   letter-spacing: 0.01em;
 }

 footer hr {
   background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.75), rgba(0, 0, 0, 0));
   margin: 20px 0;
 }

 footer p {
   text-align: center;
   font-size: 10px;
   color: #ccc;
 }

 footer .swiper-button-next {
   -webkit-transform: rotate(-90deg);
   transform: rotate(-90deg);
   margin-right: 5%;
 }

 footer .social-media {
   margin: 0 auto;
 }

 .social-media {
   position: relative;
   display: flex;
   display: -webkit-flex;
   -webkit-align-items: center;
   align-items: center;
   -webkit-justify-content: center;
   justify-content: center;
   margin: 20px 0;
 }

 .social-media li {
   display: inline-block;
 }

 .social-media a {
   display: block;
   width: 32px;
   height: 32px;
   background-image: url(../images/sprites.png);
   background-repeat: no-repeat;
   background-size: 420px;
 }

 .social-media .facebook {
   background-position: -32px -34px;
 }

 .social-media .instagram {
   background-position: -95px -34px;
 }

 .social-media .twitter {
   background-position: -128px -34px;
 }

 .social-media .whatsapp {
   background-position: -160px -34px;
 }

 .social-media .line {
   background-position: -190px -34px;
 }

 .social-media .youtube {
   background-position: -222px -34px;
 }

 .swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  /* Fix of Webkit flickering */
  z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
  float: left;
}
.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0px, 0, 0);
  -moz-transform: translate3d(0px, 0, 0);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate3d(0px, 0, 0);
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -ms-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex: 0 0 auto;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-transition-property: -webkit-transform, height;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform, height;
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.swiper-wp8-vertical {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}
/* Arrows */
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: 60px;
  height: 64px;
  margin-top: -22px;
  z-index: 10;
  cursor: pointer;
  -moz-background-size: 27px 44px;
  -webkit-background-size: 27px 44px;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}
.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}
.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black,
section nav:nth-of-type(1) li a:after,
.sub-head .toolbar > li:nth-of-type(1):before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.newsflash .swiper-button-prev {
  right: 24px;
  left: auto;
}

.newsflash .swiper-button-next {
  right: 3px;
  left: auto;
}

.newsflash .swiper-button-prev,
.newsflash .swiper-button-next {
  -webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
  width: 14px;
  height: 18px;
  top: 23px;
  background-size: 4px 44px;
  border: 1px solid #555;
}

.head-newsflash .swiper-button-prev {
  right: 20px;
  left: auto;
}

.head-newsflash .swiper-button-next {
  right: 1px;
  left: auto;
}

.head-newsflash .swiper-button-prev,
.head-newsflash .swiper-button-next {
  /* -webkit-transform: rotate(-90deg);
	transform: rotate(-90deg); */
  width: 18px;
  height: 18px;
  top: 23px;
  background-size: 4px 44px;
  background-color: none;
  border: 0.2px solid #ddd;
}

.headline-terbaru.swiper-container-horizontal > .swiper-pagination-bullets {
  padding: 5px 0;
}

#section-4 .foto.swiper-container .swiper-button-prev {
  left: 10%;
}

#section-4 .foto.swiper-container .swiper-button-next {
  right: 10%;
}

#section-4 .foto.swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #fff;
}

#section-4 .foto.swiper-container .swiper-pagination .swiper-pagination-bullet-active:before {
  border: 1px solid #fff;
}

#section-4 .foto.swiper-container .swiper-pagination .swiper-pagination-bullet {
  background-color: #ddd;
  margin: 15px 5px 30px;
}

#gallery #section-4 .foto.swiper-container .swiper-button-next,
#gallery #section-4 .foto.swiper-container .swiper-button-prev {
  top: 45%;
}

/* Pagination Styles */
.swiper-pagination {
  position: relative;
  text-align: center;
  -webkit-transition: 300ms;
  -moz-transition: 300ms;
  -o-transition: 300ms;
  transition: 300ms;
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 0;
  left: 0;
  width: 100%;
}

#section-4 .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 0;
}
/* Bullets */
.swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  display: inline-block;
  border-radius: 100%;
  background-color: #555;
  opacity: 0.2;
  position: relative;
}

button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-white .swiper-pagination-bullet {
  background-color: #fff;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  background-color: rgba(244,67,54,1);
}
.swiper-pagination-bullet-active:before {
	content:'';
  opacity: 1;
  width: 23px;
  height: 23px;
  position:absolute;
  left:-5px;
  top:-5px;
  display: inline-block;
  border-radius: 100%;
  border:1px solid rgba(244,67,54,0.75);
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #fff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000;
}
.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0px, -50%, 0);
  -moz-transform: translate3d(0px, -50%, 0);
  -o-transform: translate(0px, -50%);
  -ms-transform: translate3d(0px, -50%, 0);
  transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 5px 0;
  display: block;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 1px 5px;
}
/* Progress */
.swiper-pagination-progress {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progress .swiper-pagination-progressbar {
  background: #007aff;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -o-transform-origin: left top;
  transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
  -webkit-transform-origin: right top;
  -moz-transform-origin: right top;
  -ms-transform-origin: right top;
  -o-transform-origin: right top;
  transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progress {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-container-vertical > .swiper-pagination-progress {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-progress.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.5);
}
.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
  background: #fff;
}
.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
  background: #000;
}
/* 3D Container */
.swiper-container-3d {
  -webkit-perspective: 1200px;
  -moz-perspective: 1200px;
  -o-perspective: 1200px;
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 3.6-15 */
  background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Opera 11.10-12.00 */
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 3.6-15 */
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Opera 11.10-12.00 */
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 3.6-15 */
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Opera 11.10-12.00 */
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 3.6-15 */
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Opera 11.10-12.00 */
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  /* Firefox 16+, IE10, Opera 12.50+ */
}
/* Coverflow */
.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
  /* Windows 8 IE 10 fix */
  -ms-perspective: 1200px;
}
/* Cube + Flip */
.swiper-container-cube,
.swiper-container-flip {
  overflow: visible;
}
.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}
.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
}
/* Cube */
.swiper-container-cube .swiper-slide {
  visibility: hidden;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  -moz-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}
/* Fade */
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -ms-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
/* Preloader */
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  -webkit-transform-origin: 50%;
  -moz-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  -moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}
.swiper-lazy-preloader:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  -webkit-background-size: 100%;
  background-size: 100%;
  background-repeat: no-repeat;
}
.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes swiper-preloader-spin {
  100% {
    transform: rotate(360deg);
  }
}

/* macbook pro 13 with bookmark toolbar show */
@media screen and (max-height: 570px){
  /*.swiper-pagination-fraction,
  .swiper-pagination-custom,
  .swiper-container-horizontal > .swiper-pagination-bullets {
    padding-top: 0;
    height: 70px;
  }*/
}

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

/* monitor 800px */
 @media screen and (min-width: 801px) and (max-width: 980px){
   .container-desktop,
   .ads.billboard {
     width: 100%;
   }

   .w-70,
   main section > .w-70 {
     width: 64%;
     padding-left: 10px;
     box-sizing: border-box;
   }

   .w-30 {
     width: 33%;
   }

   .header-top span {
     padding-left: 20px;
   }

   .logo-tempo {
     margin-left: 5%;
   }

   .header-main .w-50:nth-of-type(1) {
     width: 40%;
   }

   .menu li {
     padding: 0 6px;
     margin: 0 6px;
   }

   .menu li a {
     font-size: 9px;
   }

   .menu li:nth-of-type(1) {
     padding-left: 20px;
   }

   #headline.swiper-container.headline-mobile-terbaru .swiper-slide:nth-of-type(1) {
     height: 277px;
   }

   #headline.swiper-container.headline-mobile-terbaru .swiper-slide {
     height: auto;
   }

   .newsflash {
     padding-right: 20px;
   }

   .tab .tab-pagination .col:last-child > li {
     margin: 0 6px;
   }

   #section-3 .col:first-child .wrapper {
     padding-left: 10px;
   }

   #section-3 .col li a:nth-of-type(1) {
     width: 80px;
     height: 80px;
   }
 }


 /* custome image order */
 .img-artikel-other img {
   width: 100%;
   height: auto;
 }