html, body{
    background: #c8cccf;
}

.page-main {
    padding-bottom: 0;
}

ol, ul {

     margin-bottom: 2px; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}


table {
    border-collapse: collapse;
    border-spacing: 0;
}
input, textarea, select, a {
    outline: medium none;
}
*, *::before, *::after {
    box-sizing: border-box;
}
.group::after {
    clear: both;
    content: "";
    display: table;
}
img {
    height: auto;
    max-width: 100%;
    vertical-align: bottom;
}
* {
}
.hide-mobile {
    display: block;
}
strong {
    font-weight: bold;
}
@media (max-width: 768px) {
.hide-mobile {
    display: none;
}
}
.show-mobile {
    display: none;
}
@media (max-width: 768px) {
.show-mobile {
    display: block;
}
}
.hide-phone {
    display: block;
}
@media (max-width: 599px) {
.hide-phone {
    display: none;
}
}
.show-phone {
    display: none;
}
@media (max-width: 599px) {
.show-phone {
    display: block;
}
}
.hide-ipad-portrait {
    display: block;
}
@media (max-width: 768px) {
.hide-ipad-portrait {
    display: none;
}
}
.show-ipad-portrait {
    display: none;
}
@media (max-width: 768px) {
.show-ipad-portrait {
    display: block;
}
}
.touch .hide-touch {
    display: none;
}
.already-visible {
    animation: 0s ease 0s normal none 1 running none;
    transform: translateY(0px);
}
H1 {
    font-size: 48px;
    font-weight: 300;
    line-height: normal;
    text-transform: uppercase;
}
@media (max-width: 1023px) {
H1 {
    font-size: 30px;
}
}
@media (max-width: 767px) {
H1 {
    font-size: 22px;
}
}
H2 {
    font-size: 28px;
    font-weight: 300;
    line-height: normal;
    margin: 0 0 20px;
    text-transform: uppercase;
}
@media (max-width: 1023px) {
H2 {
    font-size: 20px;
}
}
@media (max-width: 767px) {
H2 {
    font-size: 16px;
}
}
P {
    font-size: 20px;
}
@media (max-width: 1023px) {
P {
    font-size: 14px;
    line-height: normal;
}
}
@media (max-width: 767px) {
P {
    font-size: 12px;
}
}
I {
    font-style: italic;
}
SUP, SUB {
    font-size: 70%;
    height: 0;
    line-height: 1;
    position: relative;
    vertical-align: baseline;
}
SUP {
    bottom: 1ex;
}
SUB {
    top: 0.5ex;
}
A {
    color: #ef3125;
    text-decoration: none;
    transition: color 0.25s ease 0s;
}
A:hover, A.active {
    color: #58595b;
}
.link {
    color: #e80700;
    text-decoration: underline;
}
.link:hover {
    color: #e80700;
}
IFRAME {
    border: 0 none;
    max-width: 100%;
}
@media (max-width: 767px) {
.bookingWidget .col {
    float: none !important;
    max-width: 100%;
    width: 100% !important;
}
.bookingWidget .content {
    float: none !important;
    width: 100% !important;
}
.bookingWidget #bookingWidget {
    width: 100%;
}
}
#bookingWidget {
    min-height: 358px;
}
@media (max-width: 479px) {
#bookingWidget {
    min-height: 500px;
}
}
.nowrap {
    white-space: nowrap;
}
.button {
    background: #d8292f none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    padding: 10px 19px;
    transition: background 0.25s ease 0s;
    font-weight: 500;
}
.button:hover {
    background: #58595b none repeat scroll 0 0;
    color: #fff;
}
.video-container {
    height: 0;
    margin: 50px 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    padding-top: 30px;
    position: relative;
}
@media (max-width: 599px) {
.video-container {
    margin-left: 0;
    margin-right: 0;
}
}
.video-container iframe, .video-container object, .video-container embed {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
#page {
    background: #fff none repeat scroll 0 0;
    margin: auto;
    max-width: 1300px;
    position: relative;
}
.inner {
    margin: auto;
    overflow: hidden;
    position: relative;
}
.callout {
    color: #ea212d;
}
HEADER#mainHeader {
    background: transparent none repeat scroll 0 0;
    border-bottom: 1px solid transparent;
    box-shadow: none;
    max-width: 1300px;
    padding-bottom: 8px;
    padding-top: 8px;
    position: fixed;
    transition: background 0.5s ease 0s;
    width: 100%;
    z-index: 100;
}
HEADER#mainHeader.scrolled {
    background: #fff none repeat scroll 0 0;
    border-bottom: 1px solid #ccc;
    box-shadow: 0 0 16px -2px #dfdfdf;
}
HEADER#mainHeader > .inner {
    max-width: 1280px;
}
@media (max-width: 1323px) {
HEADER#mainHeader > .inner {
    padding-left: 20px;
    padding-right: 20px;
}
}
@media (max-width: 599px) {
HEADER#mainHeader > .inner {
    padding-left: 10px;
    padding-right: 10px;
}
}
#mobileToggleContainer {
    float: left;
    width: 60%;
}
#mainLogo {
    float: left;
    width: 100%;
}
#mainNavigation {
    float: right;
    font-size: 12px;
    position: relative;
}
#mainNavigation > UL > LI > A {
    display: inline-block;
    padding: 6px 12px;
    position: relative;
}
@media (max-width: 767px) {
#mainNavigation > UL > LI > A#nav_where {
    padding-left: 0;
}
}
#mainNavigation > UL LI {
    float: left;
    margin: 0 18px 0 0;
    position: relative;
}
#mainNavigation > UL LI:last-child {
    margin-right: 0;
}
@media (max-width: 767px) {
#mainNavigation > UL LI#mainNav_book {
    float: right;
    margin-right: 0;
}
}
@media (max-width: 767px) {
#mainNavigation > UL LI {
    margin-right: 0;
    text-align: left;
}
}
@media (min-width: 1024px) {
#mainNavigation {
    display: block;
}
}
@media (max-width: 767px) {
#mainNavigation {
    font-size: 15px;
}
}
#hero {
    padding-top: 49px;
    position: relative;
}
#hero > .inner {
    max-width: 1176px;
    padding-left: 10px;
    padding-right: 10px;
}
#hero .copy {
    bottom: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 100;
    left: 0;
    letter-spacing: 3px;
    line-height: normal;
    padding: 10px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    transition: opacity 0.5s ease 0s;
    vertical-align: middle;
}
#hero .copy > SPAN {
    display: table;
    height: 100%;
    padding: 10px;
    width: 100%;
}
#hero .copy > SPAN > SPAN {
    display: table-cell;
    vertical-align: middle;
}
@media (max-width: 1024px) {
#hero .copy {
    font-size: 18px;
}
}
@media (max-width: 768px) {
#hero .copy {
    font-size: 24px;
}
}
@media (max-width: 599px) {
#hero .copy {
    font-size: 16px;
}
}
@media (max-width: 479px) {
#hero .copy {
    font-size: 11px;
    line-height: 14px;
}
}
#hero .hero-copy {
    display: inline-block;
    padding: 0;
    text-align: left;
    vertical-align: middle;
    width: 52%;
}
#hero .hero-image {
    display: inline-block;
    padding: 3% 0;
    vertical-align: middle;
    width: 47%;
}
#hero .hero-undercopy {
    clear: both;
    margin: 10px 0 60px;
}
#hero .hero-undercopy a {
    margin-left: 40px;
}
@media (max-width: 1199px) {
#hero .hero-copy {
    padding: 0;
}
#hero .hero-undercopy p {
    margin: 0 auto 20px;
}
}
@media (max-width: 1023px) {
#hero .hero-copy {
    padding-top: 0;
}
}
@media (max-width: 599px) {
#hero .hero-copy {
    padding-top: 10%;
}
#hero .hero-image {
    display: none;
}
}
@media (max-width: 599px) {
#hero .hero-copy {
    text-align: center;
    width: 100%;
}
}
#hero .hero-copy .image {
    margin: 0 auto 30px;
    width: 64px;
}
#hero .hero-copy H1 {
    margin-bottom: 30px;
    text-align: center;
}
#hero .hero-copy P {
    font-weight: 300;
    line-height: 30px;
}
#hero .hero-undercopy p {
    font-weight: 300;
    line-height: 30px;
}
@media (max-width: 1023px) {
#hero .hero-copy P {
    line-height: 24px;
}
}
@media (max-width: 599px) {
#hero .hero-copy H1 {
    font-size: 36px;
}
#hero .hero-copy P {
    font-size: 15px;
}
#hero .hero-undercopy p {
    font-size: 16px;
    font-weight: normal;
}
#hero .hero-undercopy p strong {
    clear: both;
    display: block;
    width: 100%;
}
#hero .hero-undercopy p a {
    display: block;
    float: left;
    margin: 20px 0;
}
}
@media (max-width: 599px) {
#hero H1 SPAN {
    display: block;
}
}
#grid {
    background-color: #f2f2f2;
    padding: 70px 0 0;
    position: relative;
}
#grid > .inner {
    max-width: 1176px;
    padding-left: 10px;
    padding-right: 10px;
}
#grid .row {
    display: block;
    margin: 0 0 7%;
    position: relative;
}
@media (max-width: 1023px) {
#grid .row {
    margin-bottom: 50px;
}
}
@media (max-width: 767px) {
#grid .row .col {
    float: none;
}
}
#grid .row.even .col {
    float: right;
}
@media (max-width: 767px) {
#grid .row:nth-child(2n) .col, #grid .row.even .col {
    float: none;
}
}
#grid .row.even .content {
    float: left;
    padding-left: 0;
}
@media (max-width: 767px) {
#grid .row:nth-child(2n) .content, #grid .row.even .content {
    float: none;
    padding: 0;
}
}
#grid .content {
    float: right;
    padding: 0;
    width: 48%;
}
@media (max-width: 767px) {
#grid .content {
    margin-top: 30px;
    padding: 0;
}
}
@media (max-width: 767px) {
#grid .content {
    float: none;
    width: auto;
}
}
#grid .content .title {
    font-size: 28px;
    text-transform: uppercase;
}
#grid .content .description {
    font-size: 16px;
    line-height: 28px;
    margin: 20px 0;
}
.col {
    display: inline-block;
    float: left;
    margin-top: 0 !important;
    overflow: hidden;
    position: relative;
    transition: opacity 0.5s ease 0s;
    vertical-align: top;
    width: 48%;
}
@media (max-width: 767px) {
.col {
    display: block;
    float: none;
    margin: auto;
    width: 100%;
}
}
.col .copy {
    bottom: 0;
    color: #fff;
    font-size: 24px;
    font-weight: 100;
    left: 0;
    letter-spacing: 3px;
    line-height: normal;
    padding: 10px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    transition: opacity 0.5s ease 0s;
    vertical-align: middle;
}
.col .copy > SPAN {
    display: table;
    height: 100%;
    padding: 10px;
    width: 100%;
}
.col .copy > SPAN > SPAN {
    display: table-cell;
    vertical-align: middle;
}
@media (max-width: 1024px) {
.col .copy {
    font-size: 18px;
}
}
@media (max-width: 768px) {
.col .copy {
    font-size: 24px;
}
}
@media (max-width: 599px) {
.col .copy {
    font-size: 16px;
}
}
@media (max-width: 479px) {
.col .copy {
    font-size: 11px;
    line-height: 14px;
}
}
.touch #grid .col:hover .copy {
    opacity: 1;
}
.opacity #mainFooter .col::before {
    background: #000 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    opacity: 0.5;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity 0.5s ease 0s;
}
.opacity #mainFooter .col:hover::before {
    content: "";
    opacity: 0;
}
.opacity #mainFooter .ie_mask {
    display: none;
}
.opacity #mainFooter .col.active::before {
    display: none;
}
.no-opacity #mainFooter .col .ie_mask {
    background: rgba(0, 0, 0, 0) url("/content/dam/aircanada/portal/Legacy/Images/transpBlack50.png") repeat scroll left top;
    bottom: 0;
    display: block;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
}
.no-opacity #mainFooter .col.active .ie_mask {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    z-index: 1;
}
.no-opacity #mainFooter .col .copy {
    z-index: 1001;
}
IMG {
    max-width: 100%;
    width: 100%;
}
.large.col-4-2.left {
    float: left;
}
.large.col-4-2.right {
    float: right;
}
@media (max-width: 768px) {
.large.col-4-2 {
    width: 100%;
}
}
@media (max-width: 768px) {
.large .wide {
    width: 100%;
}
}
#mainFooter {
    background-color: #000000;
    border-top: 1px solid transparent;
    color: #58595b;
}
#mainFooter > .inner {
    max-width: 956px;
    padding-bottom: 100px;
}
@media (max-width: 1023px) {
#mainFooter > .inner {
    padding-left: 20px;
    padding-right: 20px;
}
}
#mainFooter > .inner .row {
    max-width: 635px;
}
#mainFooter .col {
    float: left;
    margin-bottom: 1%;
    width: 49.5%;
}
#mainFooter .col:nth-child(2n+1) {
    margin-right: 1%;
}
#mainFooter .copy {
    padding: 0;
}
#mainFooter H2 {
    font-size: 48px;
    margin: 0 0 40px;
}
#mainFooter P {
    font-size: 16px;
    line-height: 28px;
    margin: 0 0 20px;
}
#mainFooter #footerLogo {
    margin: 30px 0;
}
.starAlliance {
    float: left;
    padding: 40px 0 0 20px;
}
@media (max-width: 599px) {
.starAlliance {
    clear: left;
    float: none;
    padding: 50px 0 0;
    text-align: center;
}
}
#footerLinks {
    margin-top: 20%;
}
#footerLinks #star-alliance {
    float: right;
    text-align: right;
    width: 60%;
}
@media (max-width: 1323px) {
#footerLinks {
    padding: 0 20px;
}
}
@media (max-width: 1199px) {
.page_home #page {
    background-size: contain;
}
}
@media (max-width: 599px) {
.page_home #page {
    background-position: left top;
    background-size: auto auto;
}
}
.page_content HEADER#mainHeader {
    background: #fff none repeat scroll 0 0;
}
.page_content .block {
    margin: 0 0 25px;
}
.page_content .intro {
    margin: 0 0 20px;
    padding: 0;
}
@media (max-width: 599px) {
.page_content .intro {
    padding: 0;
}
}
.page_content H1 {
    background: rgba(100, 100, 100, 0.5) none repeat scroll 0 0;
    display: inline-block;
    line-height: normal;
    padding: 10px 20px;
}
@media (max-width: 599px) {
.page_content H1 {
    font-size: 20px;
}
}
.page_content #grid .inner {
    max-width: 956px;
    padding: 0 7%;
}
@media (max-width: 599px) {
.page_content #grid .inner {
    padding: 0 20px;
}
}
.page_content H2 {
    font-size: 28px;
    margin: 0 0 12px;
}
.page_content P {
    font-size: 14px;
    line-height: 24px;
    margin: 0 0 12px;
}
.page_content .image.large {
    margin: 20px 0;
}
@media (max-width: 599px) {
.page_content .image.large {
    padding: 0;
}
}
@media (max-width: 599px) {
.page_content .sideBySide {
    padding-left: 0;
}
}
.page_content .sideBySide .image {
    float: right;
    margin: 0 0 3% 3%;
    width: 55.6716%;
}
@media (max-width: 599px) {
.page_content .sideBySide .image {
    float: none;
    margin: 20px 0;
    width: auto;
}
}
.page_content .quote {
    border-bottom: 1px solid #f2f2f2;
    font-family: "Open Sans",sans-serif;
    font-size: 30px;
    font-style: italic;
    font-weight: 300;
    line-height: 40px;
    margin: 20px 0;
    padding: 0 30px 30px;
    position: relative;
}
.page_content .quote::before {
    color: #ea212d;
    content: "“";
    font-family: Georgia;
    font-size: 60px;
    font-weight: bold;
    left: -10px;
    position: absolute;
    top: 5px;
}
.page_content #mainFooter {
    padding-top: 80px;
}
#mainFooter {
    text-transform: uppercase;
}
@media (max-width: 1023px) {
#mainFooter {
    background-position: center bottom;
}
}
#mainFooter .title {
    color: #000;
    font-size: 28px;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.ie8 HEADER#mainHeader {
    background: #fff none repeat scroll 0 0;
}
.ie8 .page_content H1 {
    background: rgba(0, 0, 0, 0) url("images/ie8/transpBlack50.png") repeat scroll left top;
}
.oldAndroid HEADER#mainHeader {
    position: relative;
}
.oldAndroid.scrolled {
    background: #fff none repeat scroll 0 0;
    border-bottom: 0 none;
    box-shadow: none;
}
.oldAndroid #hero {
    padding-top: 0;
}
@media (max-width: 1199px) {
}
header img {
    display: block;
    height: auto;
    width: auto;
}
.button.landing {
    font-size: 16px;
    padding: 5px 10px;
    font-weight: 500;
}
.hacks {
    text-align: center;
}
.hacks h4 {
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
}
.filters {
    border-bottom: 1px solid #000;
    border-top: 1px solid #000;
    height: auto;
    margin: 12px 0 0;
    padding: 30px 0 10px;
    text-align: center;
}
.filters li {
    display: inline-block;
    margin: 0 28px 20px 0;
    vertical-align: top;
    width: auto;
}
@media (max-width: 910px) {
.filters li {
    margin: 0 15px 20px 0;
}
}
@media (max-width: 780px) {
.filters {
    height: auto;
    padding: 20px 0 15px;
}
.filters li {
    display: block;
    margin: 0 0 10px;
    text-align: center;
}
.filters li a br {
    display: none;
}
}
.filters li a {
    color: #000;
    font-size: 15px;
    line-height: 18px;
}
.filters li a:hover {
    color: #ef3125;
}
.filters li a.active {
    font-weight: bold;
}
.hack-tiles {
    clear: both;
    margin: 25px auto 0;
    text-align: center;
    width: 720px;
}
.grid-sizer {
    width: 240px;
}
@media (max-width: 909px) {
.hack-tiles {
    width: 480px;
}
}
@media (max-width: 559px) {
.hack-tiles {
    width: 240px;
}
}
.hack-tiles .tile {
    border: 1px solid #c1c1c1;
    box-sizing: border-box;
    display: none;
    height: auto;
    margin: 0 0 25px;
    width: 240px;
}
.hack-tiles .tile.in {
    display: block;
}
.hack-tiles .tile .category {
    color: #fff;
    font-size: 17px;
    height: 74px;
    line-height: 74px;
    text-align: center;
    text-transform: uppercase;
}
.hack-tiles .tile.pack .category, .hack-tiles .tile.pack .text .social li a, .hack-tiles .tile.pack .text > span .chicklets, .hack-tiles .tile.pack .text .fb {
    background-color: #8e8f90;
}
.hack-tiles .tile.celeb .category, .hack-tiles .tile.celeb .text .social li a, .hack-tiles .tile.celeb .text > span .chicklets, .hack-tiles .tile.celeb .text .fb {
    background-color: #8b7359;
}
.hack-tiles .tile.math .category, .hack-tiles .tile.math .text .social li a, .hack-tiles .tile.math .text > span .chicklets, .hack-tiles .tile.math .text .fb {
    background-color: #40464a;
}
.hack-tiles .tile.audio .category, .hack-tiles .tile.audio .text .social li a, .hack-tiles .tile.audio .text > span .chicklets, .hack-tiles .tile.audio .text .fb {
    background-color: #0093b2;
}
.hack-tiles .tile.frequent .category, .hack-tiles .tile.frequent .text .social li a, .hack-tiles .tile.frequent .text > span .chicklets, .hack-tiles .tile.frequent .text .fb {
    background-color: #2d2926;
}
.hack-tiles .tile.away .category, .hack-tiles .tile.away .text .social li a, .hack-tiles .tile.away .text > span .chicklets, .hack-tiles .tile.away .text .fb {
    background-color: #d22630;
}
.hack-tiles .tile .text {
    display: block;
    padding: 24px;
    text-align: center;
}
.hack-tiles .tile .text p {
    font-size: 12px;
    line-height: 19px;
}
.hack-tiles .tile .text .divider {
    border-top: 1px solid #969696;
    display: block;
    height: 1px;
    margin: 24px 0;
    width: 100%;
}
.hack-tiles .tile .text > span {
    color: #fff;
    display: inline-block;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    vertical-align: middle;
    width: 22px;
}
.hack-tiles .tile .text > span > span {
    display: inline-block;
    height: 22px;
    margin: 0;
    vertical-align: middle;
    width: 22px !important;
}
.hack-tiles .tile .text > span .chicklets {
    background-position: center center;
    border-radius: 11px;
    display: block;
    height: 22px;
    width: 22px;
}
.hack-tiles .tile .text > span .facebook {
    background-image: url("/content/dam/aircanada/portal/Legacy/Images/icon-fb.png");
}
.hack-tiles .tile .text > span .twitter {
    background-image: url("/content/dam/aircanada/portal/Legacy/Images/icon-tw.png");
}
.st_facebook {
    display: none !important;
}
.hack-tiles .tile .text .social {
    border-top: 1px solid #969696;
    margin-top: 25px;
    padding-top: 20px;
}
.hack-tiles .tile .text .social li {
    display: inline-block;
    height: 22px;
    vertical-align: middle;
    width: 22px;
}
.hack-tiles .tile .text .social li a {
    border-radius: 11px;
    color: #fff;
    display: block;
    font-size: 12px;
    height: 22px;
    line-height: 22px;
    width: 22px;
}
.hack-tiles .tile .text .fb {
    border-radius: 11px;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    height: 22px;
    line-height: 22px;
    margin-top: 2px;
    vertical-align: middle;
    width: 22px;
}
.hacks .button {
    margin: 20px 0 35px;
}
#pearson {
    border-top: 1px solid #000;
    padding: 30px 0 35px;
}
.list {
    list-style-type: disc;
    margin: 0 0 0 20px;
}
.list li {
    font-size: 0.9em;
    line-height: 1.5em;
    padding-bottom: 15px;
}
footer {
    background: #fff none repeat scroll 0 0;
    font-size: 0;
    padding: 58px 0 0;
}
footer .centre {
    margin: 0 auto;
    max-width: 980px;
    padding: 0 20px;
    width: 100%;
}
.footer-top {
    background: rgba(0, 0, 0, 0) url("/content/dam/aircanada/portal/Legacy/Images/bg-footer-top.jpg") repeat scroll 0 0;
    display: none;
    font-size: 16px;
    margin: 0 0 35px;
    min-height: 128px;
    padding: 26px 0;
    text-align: center;
    width: 100%;
}
.footer-top h3 {
    color: #fff;
    font-family: "Open Sans",sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 30px;
    margin: 0 auto 18px;
    text-transform: uppercase;
    width: 90%;
}
.footer-top h3 span {
    font-weight: 300;
    text-transform: none;
}
.footer-box {
    color: #000;
    display: inline-block;
    height: auto;
    margin-bottom: 30px;
    position: relative;
    vertical-align: top;
    width: 31%;
}
.footer-box.second, .footer-box.fifth {
    margin-left: 3.5%;
    margin-right: 3.5%;
}
.footer-box .red {
    color: #e80700;
}
.footer-box img {
    display: block;
    height: auto;
    width: 100%;
}
.footer-box p {
    font-size: 15px;
    line-height: 20px;
    margin: 10px 0 20px;
}
.footer-box .copy {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
.footer-box .content-wrap {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    position: relative;
}
.footer-box .content-wrap .copy {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    transition: all 0.25s ease-in-out 0s;
}
.footer-box .table {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    display: table;
    height: 100%;
    table-layout: fixed;
    text-align: center;
    transition: all 0.25s ease-in-out 0s;
    width: 100%;
}
.footer-box:hover:not(.para) .table,
.footer-box:focus:not(.para) .table {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.footer-box.para .table {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.footer-box.para:hover .copy,
.footer-box.para:focus .copy {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.footer-box .table-cell {
    color: #fff;
    display: table-cell;
    font-family: "Open Sans",sans-serif;
    font-size: 20px;
    letter-spacing: 2px;
    line-height: 24px;
    padding: 0 20px;
    text-transform: uppercase;
    vertical-align: middle;
    width: 100%;
}
footer h4 {
    border-bottom: 1px solid #000;
    color: #000;
    font-size: 13px;
    line-height: 30px;
    text-transform: uppercase;
    width: 100%;
}
footer h5 {
    color: #000;
    font-size: 22px;
    line-height: 30px;
    padding: 20px 0;
    width: 100%;
}
.footer-mid {
    background-color: #f2f2f2;
    width: 100%;
}
.footer-mid .ac-logo {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    padding: 40px 0 20px;
    width: 483px;
}
.footer-mid .award {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    width: 238px;
}
.footer-mid .social {
    font-size: 18px;
    padding: 30px 0;
    text-align: center;
}
.footer-mid .social a {
    color: #555555;
    font-size: 24px;
    padding-left: 6px;
    text-align: center;
}
.footer-mid .social a:hover {
    color: #ef3125;
}
.footer-bot {
    background-color: #9f9f9f;
    height: 90px;
    padding: 20px 0 0;
    width: 100%;
}
.footer-bot .left {
    float: left;
}
.footer-bot .left a {
    font-size: 12px;
    text-transform: uppercase;
}
.footer-bot .left .divider {
    display: inline-block;
    font-size: 16px;
    padding: 0 20px;
    vertical-align: bottom;
}
@media (max-width: 599px) {
.footer-bot .left .divider {
    padding: 0 10px;
}
}
.footer-bot .right {
    float: right;
}
.footer-bot .star-alliance-logo {
    background-image: url("/content/dam/aircanada/portal/Legacy/Images/logo_star-alliance.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    height: 25px;
    width: 251px;
}
@media (max-width: 1023px) {
.inner.landing {
    padding: 45px 20px 0;
}
.social {
    padding: 20px 0 15px;
}
.left, .right {
    float: none;
    text-align: center;
    width: 100%;
}
.left .divider, .right .divider {
    padding: 0 5px;
}
.left figure, .right figure {
    margin: 20px auto 0;
}
}
@media (max-width: 768px) {
.footer-box {
    display: block;
    margin: 3.5% auto !important;
    width: 100%;
}
}
.nobreak {
    white-space: nowrap;
}

#page_us_toronto #hero {
    background-attachment: scroll;
    background-image: url(/content/dam/aircanada/portal/images/marketing/travel-smart/us/header-toronto-stopover.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 50px;
}
#page_us_toronto #page #body .inner #hero .inner.landing .hero-undercopy .title {
    font-size: 32px;
    line-height: 37px;
    margin-bottom: 20px;
}
#page_us_toronto #page #body .inner #hero .inner.landing .hero-undercopy .description {
    font-size: 16px;
    line-height: 28px;
}

#page_us_toronto #page #body .inner .group .content {
    padding-right: 0px; width: 100%;
    padding-left: 0px;
}
#page_us_toronto #page #body .inner .group .step {
    padding-right: 0px; width: 100%;
    padding-left: 0px;  background: url(/content/dam/aircanada/portal/images/marketing/travel-smart/us/step-background.gif) no-repeat right top;
    float: left;
}
#page_us_toronto #grid {padding-top: 10px;}
#page_us_toronto #page #body .inner .group .content .title {
    text-align: left; font-size: 28px;
    text-transform: uppercase; padding-top: 14px;
}
#page_us_toronto #page #body  .inner .group  .content .description {
    margin: 20px 0;  font-size: 16px;
    line-height: 28px;
}

#page_us_toronto #hero>.inner{
    max-width:956px;
    margin-top: 30%;
}
#page_us_toronto #grid > .inner {
    max-width: 956px;
}
#page_us_toronto #gallery > .inner {
    max-width: 956px;
}

.col-4 {
    float: left;
    width: 33.33%;
}
.b-box-wrap {
    margin-bottom: 25px;
    width: 100%;
}
.b-box-num{      float: left;
    margin: 6px 80px;
    text-align: center;
    width: 100%;
}
.b-box {
    height: 150px;
    padding: 0 25px;
    text-align: center;
}
.b-box .icon {
    margin: 0 auto;
}
.icon-locker.blue {
    background-position: -8px -50px;
    height: 50px;
    width: 29px;
}
.icon-locker, .icon-chair, .icon-laptop, .icon-smiley, .icon-arrow, .icon-cup {
    background-image: url("/content/dam/aircanada/portal/images/marketing/travel-smart/us/icons_grid_benefits_colors_mini.png");
}
.b-box h3 {
     font-size: 16px;
    padding: 24px 5px 10px;
    text-transform: uppercase;    color: #707070;

}
.b-box p {
     font-size: 14px;
    color: #000000;

}

.numberCircle {
     background: #f2f2f2 none repeat scroll 0 0;
    border: 3px solid #404041;
    border-radius: 50%;
    color: #404041;
    font: 41px Arial,sans-serif;
    height: 75px;
     margin: auto;;
    padding: 9px;
    text-align: center;
    width: 75px;
}
.dots {    color: #404041;
    float: left;
    font: 42px Arial,sans-serif;
    margin: 10px 0;
    padding: 2px}


@media (max-width: 559px) {
.col-4 {
       float: left;
    width: 100%;
}
#page_us_toronto #page #body .inner .group .step {
    padding-right: 0px; width: 100%;
    padding-left: 0px; background-image: none;
    float: left;
}
}
.step-row{ background-color: #e6e6e6;      padding-left: 0;
    padding-right: 0;
    width: 100%;}


#gallery > .inner {
    max-width: 956px;
    padding-left: 10px;
    padding-right: 10px;
}
.colleft {width: 70%; float: left;}
.colright {width: 30%; float: left; text-align: center;}





 /* jssor slider bullet navigator skin 01 css */
        /*
        .jssorb01 div           (normal)
        .jssorb01 div:hover     (normal mouseover)
        .jssorb01 .av           (active)
        .jssorb01 .av:hover     (active mouseover)
        .jssorb01 .dn           (mousedown)
        */
        .jssorb01 {
            position: absolute;
        }
        .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
            position: absolute;
            /* size of bullet elment */
            width: 12px;
            height: 12px;
            filter: alpha(opacity=70);
            opacity: .7;
            overflow: hidden;
            cursor: pointer;
            border: #000 1px solid;
        }
        .jssorb01 div { background-color: gray; }
        .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
        .jssorb01 .av { background-color: #fff; }
        .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

        /* jssor slider arrow navigator skin 13 css */
        /*
        .jssora13l                  (normal)
        .jssora13r                  (normal)
        .jssora13l:hover            (normal mouseover)
        .jssora13r:hover            (normal mouseover)
        .jssora13l.jssora13ldn      (mousedown)
        .jssora13r.jssora13rdn      (mousedown)
        */
        .jssora13l, .jssora13r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 40px;
            height: 50px;
            cursor: pointer;
            background: url('/content/dam/aircanada/portal/images/marketing/travel-smart/us/arrow.png') no-repeat;
            overflow: hidden;
        }
        .jssora13l { background-position: -10px -15px; }
        .jssora13r { background-position: -70px -15px; }
        .jssora13l:hover { background-position: -130px -15px; }
        .jssora13r:hover { background-position: -190px -15px; }
        .jssora13l.jssora13ldn { background-position: -250px -15px; }
        .jssora13r.jssora13rdn { background-position: -310px -15px; }


        .logo-stopover { margin: 60px 5px;}

.bx-wrapper .bx-viewport{
	box-shadow: 0 0 transparent;
}
.featherlight .featherlight-content{
	padding: 25px 15px 0 25px
}
.bx-wrapper .bx-caption{
	bottom: 10px;
}
.gallery{
	width: 946px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.gallery li{
	width: 218px;
	margin: 0;
	margin: 0 0 25px 24px;
	list-style-type: none;
	float: left;
	cursor: pointer;
}
.gallery li.big{
	width: 460px;
}
.gallery li:first-child{
	margin-left: 0;
}
.gallery li.label{
	background-color: #f2f2f2;
	width: 218px;
	text-align: center;
	padding: 0;
	cursor: default;
}
.gallery li.label a{
	display: block;
	padding-top: 60px;
	padding-bottom: 59px;
	color: #404041;
}
.gallery li.label strong{
	text-transform: uppercase;
	color: #ec1d23;
	display: block;
	padding-bottom: 15px;
}
.show-xl,
.show-lg,
.show-md{
	display: none;
}
@media (min-width: 986px) {
	.show-xl{
		display: block;
	}
}
@media (min-width: 767px) and (max-width: 985px) {
	.show-lg{
		display: block;
	}
	.gallery{
		width: 716px;
		margin: 0 auto;
	}
	.gallery li.label{
		width: 704px;
	}
}
@media (max-width: 768px) {
	.show-md{
		display: block;
	}
	.gallery{
		width: 460px;
		margin: 0 auto;
	}
}