/* ************************************************
    This is from the alaskaair.com website
***************************************************/

@font-face {
    font-family: Circular;
    src: url(fonts/ascircularweb-book.woff) format("woff");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Circular-Bold';
    src: url(fonts/ascircularweb-bold.woff) format("woff");
    font-weight: 700;
    font-style: normal
}

.gid-header {
    position: fixed;
    background-color: #0E4668;
    height: 25%;
    width: 100%;
}

.gid-header-svc-type {
    position: fixed;
    color: #fff;
    left: 2%;
    top: 19%;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 200%;
}

.gid-header-flt {
    position: fixed;
    color: #fff;
    right: 2%;
    top: 2%;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    ;
    font-weight: bold;
    font-size: 200%;
}

.gid-header-fltno {
    position: fixed;
    color: #fff;
    right: 2%;
    top: 5%;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    ;
    font-weight: bold;
    font-size: 750%;
}

.gid-body-left {
    position: fixed;
    background-color: #fff;
    width: 30%;
    height: 70%;
    left: 0px;
    bottom: 5%;
    /*border: dashed;*/
    padding: 2%;
}

.gid-body-right {
    position: fixed;
    background-color: #fff;
    width: 70%;
    height: 70%;
    right: 0px;
    bottom: 5%;
    /*border: dashed;*/
    padding: 2%;
}

.gid-footer {
    position: fixed;
    background-color: #fff;
    width: 100%;
    height: 5%;
    left: 0px;
    bottom: 0px;
    /*border: dashed;*/
}

.gid-footer-grid-container {
    display: grid;
    grid-template-columns: auto 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-template-areas: "grid-ow-icon grid-time grid-airplane-type grid-gate";
    justify-items: center;
    align-items: end;
}

.gid-footer-grid-container-without-icon {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-template-areas: "grid-time grid-airplane-type grid-gate";
    justify-items: center;
    align-items: center;
    padding-top: 20px;
}

.grid-ow-icon {
    grid-area: grid-ow-icon;
}

.grid-time {
    grid-area: grid-time;
}

.grid-airplane-type {
    grid-area: grid-airplane-type;
}

.grid-gate {
    grid-area: grid-gate;
}

@media all and (-ms-high-contrast:none) {
    .gid-footer-grid-container {
        display: -ms-grid;
        -ms-grid-columns: auto 1fr 1fr 1fr;
        -ms-grid-rows: auto;
    }

        .gid-footer-grid-container .grid-ow-icon {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 1;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

        .gid-footer-grid-container .grid-time {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 2;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

        .gid-footer-grid-container .grid-airplane-type {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 3;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

        .gid-footer-grid-container .grid-gate {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 4;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

    .gid-footer-grid-container-without-icon {
        display: -ms-grid;
        -ms-grid-columns: 1fr 1fr 1fr;
        -ms-grid-rows: auto;
    }

        .gid-footer-grid-container-without-icon .grid-ow-icon {
            display: none;
        }

        .gid-footer-grid-container-without-icon .grid-time {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 1;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

        .gid-footer-grid-container-without-icon .grid-airplane-type {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 2;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }

        .gid-footer-grid-container-without-icon .grid-gate {
            -ms-grid-row: 1;
            -ms-grid-row-span: 1;
            -ms-grid-column: 3;
            -ms-grid-column-span: 1;
            -ms-grid-row-align: center;
            -ms-grid-column-align: center;
            align-self: center;
            justify-self: center;
        }
}

.gid-footer-oneworld {
    height: 120px;
}

.gid-footer-oneworld-icon {
    height: inherit;
    padding-left: 20px;
}

.gid-footer-time {
    color: #606060;
    font-family: "Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 250%;
}

.gid-footer-aircraft {
    color: #606060;
    font-family: "Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 250%;
}

.gid-footer-gate {
    color: #606060;
    font-family: "Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 250%;
    padding-right: 15px;
}

.gid-body-upgrade-req {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 500%;
}

.gid-pax-upgrade-table {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 350%;
}

.gid-boardingGroup-table {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 32px;
}

.gid-pax-upgrade-td {
    padding-top: 10px;
    padding-right: 20px;
}

.gid-pax-upgrade-pri-td {
    color: #606060;
    padding-top: 10px;
    padding-right: 20px;
}

.gid-pax-upgrade-seat-td {
    padding-top: 10px;
    padding-right: 50px;
}

.gid-body-time-header {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 300%;
}

.gid-body-time {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 600%;
}

.gid-time-panel-alaska-logo {
    position: fixed;
    bottom: 10%;
    width: 20%;
    height: auto;
}

.gid-next-flights-header {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 500%;
}

.gid-next-flights-table {
    color: #000;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 300%;
}

.gid-next-flights-td {
    padding-bottom: 10%;
    padding-right: 50px;
}

.gid-next-flights-th {
    color: #606060;
    font-family: "AS Circular","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: bold;
    font-size: 80%;
    padding-top: 10px;
    padding-bottom: 2%;
    padding-right: 50px;
}

.gid-big-triangle {
    bottom: 200px;
    left: 88%;
    zoom: 140%;
    position: relative;
}

.gid-big-triangle-canceled {
    top: 40%;
    left: 27%;
    zoom: 160%;
    position: absolute;
}

#NewGateMessage {
    font-size: 80px;
}

#StandardFlightMessage {
    left: 3%;
}

.new-gate-row {
    height: 110px;
    min-width: 2000px;
}

.canceled-flight-row {
    font-size: 80px;
    /*padding-left: 700px;
    max-height: 110px;
    width: 200%*/;
    height: 110px;
    min-width: 2000px;
}

.canceled-flight-message-top {
    font-weight: normal;
    font-size: 80%;
    height: 110px;
    margin-left: 0;
    margin-top: 3.2%;
}

.canceled-flight-message-bottom {
    font-weight: normal;
    font-size: 80%;
    height: 110px;
    margin-left: 0;
    margin-top: -2%
}

myCarousel {
    height: 64vh
}
/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb
*/
.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
    opacity: 1;
}

    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

        .carousel-fade .carousel-inner > .item.next.left,
        .carousel-fade .carousel-inner > .item.prev.right,
        .carousel-fade .carousel-inner > .item.active {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }
}