﻿/*
    Template: Home Template OTS KLIA
    Author: M4verick
    Developer by: ETransact Sdn Bhd
    Email : erwanhafizi@gmail.com
    Version : COVID19#STAYATHOME 13042020

*/
/* Main Page*/
main[role=main]{margin:0 auto;background:#fff}
.map-responsive{overflow:hidden;padding-bottom:56.25%;position:relative;height:0}
.map-responsive iframe{left:0;top:0;height:100%;width:100%;position:absolute}

/** search bar */
.search-trip-wrapper{width:100%;margin:0 auto;position:relative;z-index:10}

/** slide */
.slider-home{width:100%; height:100%;background-size:contain;background-position:center;background-repeat:no-repeat}

#slider1_container{display:none;position:relative;overflow:hidden;visibility:hidden;margin:0 auto;width:1300px;height:500px}
.slides-container{position:absolute;overflow:hidden}
.jssorl-004-double-tail-spin img{animation-name:jssorl-004-double-tail-spin;animation-duration:1.2s;animation-iteration-count:infinite;animation-timing-function:linear}
@keyframes jssorl-004-double-tail-spin {from{transform:rotate(0)}to{transform:rotate(360deg)}}
#progress-element{position:absolute;left:0;bottom:0;width:0;height:5px;background-color:rgba(255,255,255,.7);z-index:100}
.carousel-caption h1,.carousel-caption p{color:#fff;line-height:1em}
.carousel-caption h1{font-family:"Work Sans",sans-serif;line-height:1}
.carousel-caption p{font:400 21px Roboto,sans-serif}
.carousel-caption h1,.carousel-caption p{text-shadow: 0 1px 2px #1d1d1d}
.btn-banner,.btn-banner:focus{background-color:transparent;min-width:106px;padding:8px 16px;border:1px solid #fff;text-transform:uppercase;color:#fff;font-weight:700;margin-top:1em;box-shadow:none}
.btn-banner:hover{background:#fff}                                                                                                                                                                     
.btn-banner:active:focus,.btn-banner:hover:focus{color:#252525}
.btn-banner:active:focus,.btn-banner:active:hover{box-shadow:inset 0 3px 5px rgba(0,0,0,.25)}
/* image grid; content overlay */
.content-details{position:absolute;text-align:center;width:100%;left:50%;-webkit-transform:translate(-50%,-100%);-moz-transform:translate(-50%,-100%);transform:translate(-50%,-100%);-webkit-transition:all .3s ease-in-out 0s;-moz-transition:all .3s ease-in-out 0s;transition:all .3s ease-in-out 0s}
.content:hover .content-details{top:50%;left:50%;opacity:1}
.content-details h3{color:#fff;letter-spacing:.15em;margin:0;text-transform:uppercase;/*background:rgba(33,33,33,.7);*/padding-right:.5em;/*text-align:right;*/font-size:1em}
.fadeIn-bottom{top:116%}
.fadeIn-center{top:50%}

/** icon block */
.nav-icon{margin:2em auto 0;padding:0}
.nav-icon .box-item .icon-block{background:#F79B1A}
.nav-icon .box-item:first-child .icon-block{background:#F6711D}
.nav-icon .box-item:last-child .icon-block{background:#F5411E}
.nav-icon .box-item .icon-block p{font-size:1rem;color:#fff;margin-top:1em}
.nav-icon a{color:#fff}
.nav-icon a.active,.nav-icon a.active h6,.nav-icon a.focus,.nav-icon a.focus h6{color:#231F20;cursor:default}
.nav-icon a:hover,.nav-icon a:hover h6{color:rgba(255,255,255,0.75);transition: all 0.2s ease 0s}
.nav-icon h6{color:#fff;font-family:'Secular One', sans-serif;vertical-align:middle;display:inline-block}
.link{color:#2175ff;cursor:pointer;font-weight:400;text-decoration:none;font-size:1rem}
.link--arrowed{display:inline-block;height:2rem;line-height:2rem}
.link--arrowed .arrow-icon{position:relative;top:-1px;-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;vertical-align:middle;width:27px;height:27px;fill:none;stroke:#fff}
.link--arrowed .arrow-icon--circle{-webkit-transition:stroke-dashoffset .3s ease;transition:stroke-dashoffset .3s ease;stroke-dasharray:95;stroke-dashoffset:95}
.link--arrowed:hover .arrow-icon{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}
.link--arrowed:hover .arrow-icon--circle{stroke-dashoffset:0}


/** content body */
.top-content{margin-top:4vh}
.top-content h4{font-size:1.75rem;text-transform:inherit}
.top-content .container .row.top-destination-grid>div{margin-bottom:2vh}
.news-content .card,.top-content .card,.aboutus-content .card,.contactus-content .card,.promo-content .card,.promo-box-content .card,.operator-content .card,.articles-content .card,.newsletter-content .card{background:rgba(0,0,0,.05);border:none;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.articles-content .card{margin-bottom:2rem}
.articles-content button{float:right}
.buschedule-content .container{min-height:400px}
.faq-content .panel-heading{padding:15px 16px;background-color: #f6f6f6}
.faq-content .panel-default{border: 1px solid rgba(0,0,0,.125);margin-bottom:1em;box-shadow:0 1px 5px rgba(85, 85, 85, 0.15)}
.faq-content .panel-default .panel-body{padding:1em}
.faq-content .panel-default p:last-child{margin:0}
.faq-content .panel-default .panel-title a:after{font-family:'FontAwesome';font-style:normal;font-size:1rem;content:"\f106";color:#1f7de2;float:right}
.faq-content .panel-default .panel-title a.collapsed:after{content:"\f107"}
.faq-content h4,.faq-content h5{text-transform:none;margin:0}
.head-wrapper{margin-bottom:1.875rem}
.head-wrapper svg{height:30px}
.head-wrapper h2{padding:0}
.head-wrapper .head p{font-size:16px;margin:0}

/**/
.info-box{background-color:#fff2d8;padding:1em}
.ib-content{display:flex}
.ib-image{width:14%}
.ib-image img{width:100%}
.ib-info{padding:0 0 0 1em;font-size:14px;width:100%}
.ib-info h4{color:#212121}
.ib-info span:after{content:"\2022";margin:0 .5em;color:#282828;font-size:.875rem}
.ib-info span:last-child:after{content:"";margin:0}

/**/
[class^="imghvr-"]{margin-bottom:.5em}
[class^="imghvr-"],[class^='imghvr-'] figcaption{background-color:#282828;z-index:2}
[class^='imghvr-'] figcaption{padding:20px}
[class^='imghvr-'] figcaption>a{position:relative;display:block;color:#fff;margin-top:50px}
[class^='imghvr-'] figcaption>a:hover{text-decoration:underline!important}
[class^="imghvr-"] div{/*position:absolute;z-index:1;bottom:0;background-color:#282828;width:100%;*/padding:.5em}
[class^='imghvr-'] .top-destination{background-color:#282828;text-align:center}
[class^='imghvr-shutter-in-']:after{background-color:#243164}


/* contact us */
.contact-box-wrapper{position:relative}
.contact-box:first-child{margin-bottom:20px}
.contact-box{display:flex;flex-direction:column;align-items:center;text-align:center;padding:32px 40px;background-color:#fff;border:1px solid #ddd;box-shadow:0 1px 3px 0 rgba(27,27,27,.1),0 4px 8px 0 rgba(27,27,27,.1);border-radius:5px}
.contact-box-item{max-width:100%;margin-bottom:24px;color:#212121}
.contact-box-item.logo{height:50px;width:50px}
.contact-box-item.title{font-weight:600}
.contact-box-item a{color:#3996CA}
.contact-box-item a:hover{text-decoration:underline!important}


/** timeline */
#timeline{list-style:none;position:relative}
#timeline:before{top:0;bottom:0;position:absolute;content:" ";width:2px;background-color:#4997cd;left:50%;margin-left:-1.5px}
#timeline .clearFix{clear:both;height:0}
#timeline .timeline-badge{color:#fff;width:50px;height:50px;font-size:1.2em;text-align:center;position:absolute;top:20px;left:50%;margin-left:-25px;background-color:#4997cd;z-index:100;border-top-right-radius:50%;border-top-left-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%}
#timeline .timeline-badge span.timeline-balloon-date-day{font-size:1.4em}
#timeline .timeline-badge span.timeline-balloon-date-month{font-size:.8em;position:relative;top:-17px}
#timeline .timeline-badge.timeline-filter-movement{background-color:#fff;font-size:1.7em;height:35px;margin-left:-18px;width:35px;top:40px}
#timeline .timeline-badge.timeline-filter-movement a span{color:#4997cd;font-size:1.3em;top:-1px}
#timeline .timeline-badge.timeline-future-movement{background-color:#fff;height:35px;width:35px;font-size:1.7em;top:-16px;margin-left:-18px}
#timeline .timeline-badge.timeline-future-movement a span{color:#4997cd;font-size:.9em;top:2px;left:1px}
#timeline .timeline-movement{border-bottom:dashed 1px #4997cd;position:relative}
#timeline .timeline-movement.timeline-movement-top{height:60px}
#timeline .timeline-movement .timeline-item{padding:20px 0}
#timeline .timeline-movement .timeline-item .timeline-panel{border:1px solid #d4d4d4;border-radius:3px;background-color:#fff;color:#666;padding:10px;position:relative;-webkit-box-shadow:0 1px 6px rgba(0,0,0,0.175);box-shadow:0 1px 6px rgba(0,0,0,0.175)}
#timeline .timeline-movement .timeline-item .timeline-panel .timeline-panel-ul{list-style:none;padding:0;margin:0}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul{text-align:right}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul li{color:#666}
#timeline .timeline-movement .timeline-item .timeline-panel.credits .timeline-panel-ul li span.importo{color:#468c1f;font-size:1.3em}
#timeline .timeline-movement .timeline-item .timeline-panel.debits .timeline-panel-ul{text-align:left}
#timeline .timeline-movement .timeline-item .timeline-panel.debits .timeline-panel-ul span.importo{color:#e2001a;font-size:1.3em}


/** footer */
.affin{background-position:-115px -175px!important}.alliance{background-position:-188px -175px!important}.ambank{background-position:-261px -175px!important}.bankislam{background-position:-334px -175px!important}.muamalat{background-position:-408px -175px!important}.rakyat{background-position:-480px -175px!important}.bsn{background-position:-115px -198px!important}.cimb{background-position:-188px -198px!important}.hongleong{background-position:-262px -198px!important}.hsbc{background-position:-334px -198px!important}.m2u{background-position:-407px -198px!important}.m2e{background-position:-480px -198px!important}.ocbc{background-position:-115px -220px!important}.pb{background-position:-188px -220px!important}.rhb{background-position:-262px -220px!important}.oub{background-position:-334px -220px!important}.sc{background-position:-408px -220px!important}.kash{background-position:-480px -220px!important}.webcash{background-position:-115px -244px!important}.meps{background-position:-188px -244px!important}.mastercard{background-position:-260px -244px!important}.visa{background-position:-334px -244px!important}.kiple{background-position:-407px -244px!important}.alipay{background-position:-480px -244px!important}.footer-awards li{float:left}span[class*=award]{background:url(images/eticketing_big_sprite.png) no-repeat;display:inline-block;width:60px;height:57px}.award-soba{background-position:-160px -1398px!important}.award-awani{background-position:-215px -1398px!important}.award-topec{background-position:-84px -1395px!important}.footer-social span{width:20px;height:16px}


/* bus schedule */
.bus-operator-dropdown{display:none}
.buschedule-nav{margin-bottom:1em}
.buschedule-dropdown{}
.buschedule-dropdown button{border-radius:0}
.buschedule-dropdown button:focus{box-shadow:none!important}
.buschedule-dropdown .row{margin:0}
.buschedule-dropdown .row ul,.buschedule-dropdown .row ul li{width:100%}
.buschedule-dropdown .dropdown-menu{overflow-y:scroll;height:300px}
.dropdown-menu .bus-operator-dropdown{}
.buschedule-dropdown .dropdown-menu .dropdown-item{padding:0.25rem 1.5rem 0.25rem 1em;line-height:1.5em}
.buschedule-dropdown .dropdown-menu .dropdown-item:hover, .buschedule-dropdown .dropdown-menu .dropdown-item:focus{background:#f8f9fa;cursor:pointer}

.schedule-list table:not(.no-data-we-apologise){font-size:.75em}
.schedule-list table.no-data-we-apologise td, .schedule-list table.no-data-we-apologise th{padding:.25em 0}
.schedule-list table td,.schedule-list table th{padding:.25em 0.75rem}
.legend-schedule{font-size:0.875em}
.legend-schedule span{display:inline-block;height:15px;width:20px}
.legend-schedule span.status-1,.schedule-list table td.status-1{background:#209c83}
.legend-schedule span.status-0,.schedule-list table td.status-0{background:#eb5055}
.schedule-list table caption{caption-side:top;font-weight:700}
.schedule-list .operator-logo { width:100px; margin-right:20px }

.destination-display{font-size:18px;font-weight:700;color:#111;position:relative;line-height:2.2em}
.operator-list>div{margin-bottom:1em}
/* tnc */
.term-content{color:#212121}
.term-content ol{padding-left:20px}
.term-content ol li{list-style:decimal;padding-left:20px}
.policy-content ol{counter-reset:item;padding:0}
.policy-content ol>li{margin-bottom:1em}
.policy-content ol li{padding-left:0}
.policy-content ol li ol{padding-left:20px}
.policy-content ol li:before { content: counters(item, ".") " "; counter-increment: item;margin-right:.5em}
