﻿/*
    Template: Home Template OTS TMR
    Author: M4verick
    Developer by: ETransact Sdn Bhd
    Email : erwanhafizi@gmail.com
    Version : COVID19#STAYATHOME 30042020
    Updated : 12062020

*/
/* 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}

/** datepicker */
.calendar-input div{margin:0}
.datepicker-dropdown{top:79px!important;position:absolute!important;width:280px;-webkit-box-shadow:0 8px 20px 0 rgba(0,0,0,.15);-moz-box-shadow:0 8px 20px 0 rgba(0,0,0,.15);box-shadow:0 8px 20px 0 rgba(0,0,0,.15);box-shadow:0 8px 20px 0 rgba(0,0,0,.15);border:none}
.datepicker-dropdown:before{top:-12px!important;right:20px!important;border-right:13px solid transparent;border-bottom:13px solid #fff;border-left:13px solid transparent}
.datepicker-dropdown:after{display:none}
.datepicker-dropdown.datepicker-orient-left:before{left:234px!important}
.datepicker-dropdown,.datepicker-dropdown>div{background:#fff!important}
.datepicker table{margin:0 auto;width:90%;}
.datepicker table tr td{border-radius:0}
.datepicker table tr td.active.active{background:#E30030;border:none}
.datepicker .datepicker-days table tr td{border:1px solid #f1f1f1}
.modify-search-trip-wrapper .datepicker-dropdown{top:56px!important}
.datepicker table tr td.disabled{cursor:no-drop}

/** slide */
.slider-home{width:100%; height:100%}

.image-retina{display:flex;justify-content:center;flex-flow:column}
.image-retina div{position:relative;text-align:center;background-color:rgba(0, 0, 0, 0.7);margin:0 auto;padding:2em}
.image-retina h1,.image-retina p{color:#fff;margin:0;padding:0}
.image-retina h1{font-family: 'Secular One', sans-serif;font-weight:700;line-height:1em;letter-spacing:.1em}

/** icon block */
.nav-icon.home{margin:0 auto 2em;padding:0}
.nav-icon{margin-top:2em;padding:0}
.nav-icon .box-item .icon-block{background:#3DADBB}
.nav-icon .box-item:first-child .icon-block{background:#3DADBB}
.nav-icon .box-item:last-child .icon-block{background:#3DADBB}
.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}

/** faq body */
.faq-content .panel-heading{padding:15px 16px;border-bottom:1px solid #ddd;background-color:#fff}
.faq-content .panel-default{border: 1px solid #ddd;margin-bottom:1em}
.faq-content .panel-default .panel-body{padding:1em;background-color:#fff}
.faq-content .panel-default p:last-child{margin:0}
.faq-content .panel-default .panel-title a{color:#020202}
.faq-content .panel-default .panel-title a span{color:#ECA43A;display:inline-block;margin-right:.5em}
.faq-content .panel-default .panel-title a:after{font-family:'FontAwesome';font-style:normal;font-size:1rem;content:"\f106";color:#020202;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}

/* bus list */
.container-fluid .head{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:baseline;-webkit-align-items:baseline;-ms-flex-align:baseline;align-items:baseline}
.bl-list-content{display:flex;margin:0 0 1rem;background-color:#f1f2f8;box-shadow:0 0 0 1px #dddde5;-webkit-transform:translateY(0);-webkit-transition: all .6s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all .6s cubic-bezier(0.165, 0.84, 0.44, 1)}
.bl-list-content:hover{-webkit-transform: scale(1.15, 1.15);transform: scale(1.15, 1.15);;position:relative;z-index:10}
.bl-image{max-width:50%}
.bl-image img{width:100%}
.bl-info{font-size:11px;padding:0 0 0 1em;display:flex;flex-flow:column nowrap;justify-content:center}
.bl-info li{float:left}
.bl-info li:after{content:"\2022";margin:0 .5em;color:#3DADBB;font-size:.875rem}
.bl-info li:last-child:after{content:""}
.bl-info li a:hover{text-decoration:underline!important}
.bl-info li a{color:#3DADBB}
.bl-info h6{margin:0;font-weight:700}
.more-links{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;font-weight:700;font-size:1rem;margin-bottom:1em}
.more-links a{color:#ff7b59}
.more-links a:hover{text-decoration:underline!important}
.more-links a svg{fill:#ff7b59;display:inline-block;vertical-align:middle;background-position:3px 0;width:1.125rem;height:1.125rem}
.buslist-content .more-links{margin-bottom:.5em}
.buslist-content.home ul{display:none}

.busfilter{display:table}
.busfilter input{background:none;border:none;outline:none;width:28px;min-width:0;padding:0;z-index:1;position:relative;line-height:18px;margin:5px 0;font-size:14px;-webkit-appearance:none;-webkit-transition:all .6s ease;transition:all .6s ease;cursor:pointer;color:#3DADBB}
.busfilter input + div{position:relative;height:28px;width:100%;margin:-28px 0 0}
.busfilter input + div svg{display:block;position:absolute;height:28px;width:160px;right:0;top:0;fill:none;stroke:#3DADBB;stroke-width:1.5px;stroke-dashoffset:271.908;stroke-dasharray:59 212.908;-webkit-transition:all .6s ease;transition:all .6s ease}
.busfilter input:not(:placeholder-shown),.busfilter input:focus{width:160px;padding:0 4px;cursor:text}
.busfilter input:not(:placeholder-shown) + div svg,.busfilter input:focus + div svg{stroke-dasharray:150 212.908;stroke-dashoffset:300}


/**/
.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}

/* image hover fx - top destination */
[class^="imghvr-"]{margin-bottom:.5em}
[class^="imghvr-"],[class^='imghvr-'] figcaption{background-color:#3DADBB;z-index:2}
[class^='imghvr-'] figcaption{padding:20px}
[class^='imghvr-'] figcaption>a{position:relative;display:block;color:#fff;margin-top:30%}
[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:#EEA93B;text-align:center}

/* 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}

/* 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}

/* faq tab */
.tabs-container{display:-webkit-box;display:flex;flex-wrap:wrap}
.tabs-container label{-webkit-box-ordinal-group:2;order:1;display:block;padding:1rem;margin:0;cursor:pointer;background:#fff;font-weight:bold;-webkit-transition:background ease .2s;transition:background ease .2s;border:1px solid #ddd;border-bottom:none; color:#020202}
.tabs-container .tab-section{-webkit-box-ordinal-group:100;order:99;-webkit-box-flex:1;flex-grow:1;width:100%;display:none;padding:1rem 1rem 0;border:1px solid #ddd;background-color:#ddd}
.tabs-container input[type="radio"]{display:none}
.tabs-container input[type="radio"]:checked+label{background:#ddd}
.tabs-container input[type="radio"]:checked+label+.tab-section{display:block}

/** 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}

/* popup */
.modal-window > div{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);padding:2em;background:#fff;box-shadow:0 1px 3px 0 rgba(27,27,27,.1),0 4px 8px 0 rgba(27,27,27,.1)}
.close-pop{color:#aaa;line-height:50px;font-size:80%;position:absolute;right:0;text-align:center;top:0;width:70px;text-decoration:none}.close-pop:hover{color:#000}