<schedule-start-meta-tags></schedule-start-meta-tags>
<div *localisationReady>
    <page-layout [withScrollOverlay]="false" [withScrollUp]="false">
        <schedule-start-title title></schedule-start-title>
        <flights-page-tabs
            [viewType]="ViewType.Schedule"
            header-left
        ></flights-page-tabs>

        <ng-container content-left>
            <schedule-filter></schedule-filter>
            <search-history></search-history>
        </ng-container>
        <ng-container>
            <section class="frame">
                <h2>{{ 'SCHEDULE.SCHEDULE-START' | translate }}</h2>

                <div class="titles-container">
                    <div class="title title1">
                        <a>{{
                            'SCHEDULE.SCHEDULE-START-TITLE1' | translate
                        }}</a>
                        <div class="">
                            {{
                                'SCHEDULE.SCHEDULE-START-TITLE1-DESCRIPTION'
                                    | translate
                            }}
                        </div>
                    </div>

                    <div class="title title2">
                        <a>{{
                            'SCHEDULE.SCHEDULE-START-TITLE2' | translate
                        }}</a>
                        <div class="">
                            {{
                                'SCHEDULE.SCHEDULE-START-TITLE2-DESCRIPTION'
                                    | translate
                            }}
                        </div>
                    </div>

                    <div class="title title3">
                        <a>{{
                            'SCHEDULE.SCHEDULE-START-TITLE3' | translate
                        }}</a>
                        <div class="">
                            {{
                                'SCHEDULE.SCHEDULE-START-TITLE3-DESCRIPTION'
                                    | translate
                            }}
                        </div>
                    </div>

                    <div class="title title4">
                        <a>{{
                            'SCHEDULE.SCHEDULE-START-TITLE4' | translate
                        }}</a>
                        <div class="">
                            {{
                                'SCHEDULE.SCHEDULE-START-TITLE4-DESCRIPTION'
                                    | translate
                            }}
                        </div>
                    </div>
                </div>

                <!-- <div class="popular-chapters-container">
                    <h3>{{ 'SCHEDULE.POPULAR-CHAPTERS' | translate }}</h3>

                    <div class="titles-container">
                        <div class="title title5">
                            <a>{{
                                'SCHEDULE.SCHEDULE-START-TITLE5' | translate
                            }}</a>
                            <div class="">
                                {{
                                    'SCHEDULE.SCHEDULE-START-TITLE5-DESCRIPTION'
                                        | translate
                                }}
                            </div>
                        </div>

                        <div class="title title6">
                            <a>{{
                                'SCHEDULE.SCHEDULE-START-TITLE6' | translate
                            }}</a>
                            <div class="">
                                {{
                                    'SCHEDULE.SCHEDULE-START-TITLE6-DESCRIPTION'
                                        | translate
                                }}
                            </div>
                        </div>
                    </div>
                </div> -->

                <popular-requests></popular-requests>
  
            </section>

            <bottom-description></bottom-description>
            
        </ng-container>
    </page-layout>
</div>
