/*--------------------------------------------------------------------------
* Author      : Nathan Winch
* Date        : April 23, 2012
* Project     : CBA Can Microsite
* Description : Main CSS. 
--------------------------------------------------------------------------*/
/*
* CONTENTS
*
* 1. STYLE GUIDE
* 2. SWATCH COLORS
* 3. FONTS
* 4. RESET
* 5. FRAMEWORK
*   5.1. SASS
        5.1.1. VARIABLES
        5.1.2. MIXINS
*   5.2. ELEMENT
*   5.3. PRIMARY
*       5.3.1. Site Wide
*   5.4. SKELETON
* 6. PAGE SPECIFIC
*   6.1. CAN
*   6.2. COMMBANK KACHING
*   6.3. COMMBANK PROPERTY GUIDE APP
*   6.4. EVERYDAY SETTLEMENT
*   6.5. CONCIERGE
*   6.6. HOME LOANS
* 7. MEDIA QUERIES
--------------------------------------------------------------------------*/
/*
* 1. STYLE GUIDE
*
* - All colors must be listed in the Swatch Colors section of this file.
* - All properties must be listed in alphabetical order for each declaration block.
--------------------------------------------------------------------------*/
/*
* 2. SWATCH COLORS
*
* 4ec4e2 - CBA brand sky
* 71d0e8 - CBA brand sky tint 1
* 95dcee - CBA brand sky tint 2
* b8e7f3 - CBA brand sky tint 3
* dcf3f9 - CBA brand sky tint 4
* c4b6a2 - CBA brand sandstone
* d0c5b5 - CBA brand sandstone tint 1
* dcd3c7 - CBA brand sandstone tint 2
* e7e2da - CBA brand sandstone tint 3
* f3f0ec - CBA brand sandstone tint 4
* 8a97a1 - CBA brand dusk
* a1acb4 - CBA brand dusk tint 1
* b9c1c7 - CBA brand dusk tint 2
* d0d5d9 - CBA brand dusk tint 3
* e8eaec - CBA brand dusk tint 4
* 808285 - CBA brand slate
* 999b9d - CBA brand slate tint 1
* b3b4b6 - CBA brand slate tint 2
* cccdce - CBA brand slate tint 3
* e6e6e7 - CBA brand slate tint 4
* ffcc00 - CBA brand yellow
* 231f20 - CBA brand dark
*
* cccccc - light grey
* 58585a - text grey
* 5f696f - illustration road grey
* 645e56 - brown
--------------------------------------------------------------------------*/
/*
* 3. FONTS
--------------------------------------------------------------------------*/
/*
* 4. RESET
* Description : Eric Meyer reset
* http://meyerweb.com/eric/tools/css/reset/
* v2.0 | 20110126
* License: none (public domain)
--------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*
* 5. FRAMEWORK
--------------------------------------------------------------------------*/
/*
* 5.1. SASS
---------------------------------------*/
/*
* 5.1.1. VARIABLES
---------------------------------------*/
/*
* 5.1.2. MIXINS
---------------------------------------*/
/*
* 5.2. ELEMENT
---------------------------------------*/
html {
  /*overflow-y:scroll;*/ }

body {
  background: #333;
  font-family: Verdana, Geneva, sans-serif; }

h1 span {
  display: block;
  font-size: 0;
  text-indent: -9999em; }
h1 .para1 {
  height: 125px;
  margin-bottom: 18px;
  width: 658px; }
h1 .para2 {
  height: 170px;
  margin-bottom: 18px;
  width: 606px; }
h1 .para2 {
  height: 214px;
  width: 698px; }

h2 {
  color: #fff;
  font-size: 50px; }

h3 {
  color: #fff;
  font-family: arial;
  font-size: 16px;
  font-weight: bold; }

h4 {
  color: #fff;
  font-size: 16px;
  line-height: 1.5; }

h6 {
  color: #231f20;
  font-size: 10px;
  text-transform: uppercase; 
  font-weight:bold;
}

p {
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 10px; }

strong {
  font-weight: bold; }

em {
  font-style: italic; }

/*
* 5.3. PRIMARY
---------------------------------------*/
/*
* 5.3.1 Site wide useable primary styles.
* Weight: ALL pages.
---------------------------------------*/
.clearfix {
  zoom: 1; }
  .clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden; }

.dawdle {
  background-position: top left;
  background-repeat: no-repeat; }

.page {
  position: relative; }

.content {
  margin: 0 auto;
  position: relative;
  width: 980px; }

.col-left {
  float: left;
  position: relative; }

.col-right {
  float: right;
  position: relative; }

.rowcol1,
.rowcol2,
.rowcol3,
.rowcol4 {
  float: left; }

.tpl-yellow {
  background-color: #ffcc00; }

.tpl-dark {
  background-color: #231f20; }
  .tpl-dark .dawdle {
    background-image: url(/about-us/can/img/spinner-dark.gif); }

.tpl-sky {
  background-color: #4ec4e2; }
  .tpl-sky .dawdle {
    background-image: url(/about-us/can/img/spinner-sky.gif); }

.tpl-sandstone {
  background-color: #c4b6a2; }
  .tpl-sandstone .dawdle {
    background-image: url(/about-us/can/img/spinner-sandstone.gif); }

.tpl-sandstoneTint1 {
  background-color: #d0c5b5; }
  .tpl-sandstoneTint1 .dawdle {
    background-image: url(/about-us/can/img/spinner-sandstoneTint1.gif); }

.tpl-sandstoneTint2 {
  background-color: #dcd3c7; }
  .tpl-sandstoneTint2 .dawdle {
    background-image: url(/about-us/can/img/spinner-sandstoneTint2.gif); }

.tpl-sandstoneTint3 {
  background-color: #e7e2da; }
  .tpl-sandstoneTint3 .dawdle {
    background-image: url(/about-us/can/img/spinner-sandstoneTint3.gif); }

.tpl-dusk {
  background-color: #8a97a1; }
  .tpl-dusk .dawdle {
    background-image: url(/about-us/can/img/spinner-dusk.gif); }

.tpl-slate {
  background-color: #808285; }
  .tpl-slate .dawdle {
    background-image: url(/about-us/can/img/spinner-slate.gif); }

.btn {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    margin-bottom: 0; 
  }
  .btn a {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2);
    background: #ffcc00;
    color: #231f20;
    display: block;
    font-size: 12px;
    font-weight: bold;
    padding: 6px 12px 8px;
    text-align: center;
    text-decoration: none; }

.bgtext {
  position: absolute; }

.sprite-icons {
  display: block;
  font-size: 0;
  text-indent: -9999em;
  background-image: url(/about-us/can/img/sprite-icons.jpg); }

.illo {
  background-position: center center;
  display: block; }

.ellipsis {
  white-space: nowrap;
  overflow: hidden; }

.ellipsis.multiline {
  white-space: normal; }

.bgtilebtm {
  font-size: 0; }

/*
* 5.4. SKELETON
---------------------------------------*/
#cba-header {
	display: none;
	/*
  background: #c4b6a2;
  width: 100%; }
  #cba-header p {
    display: none; }
  #cba-header header {
    height: 104px;
    margin: 0 auto;
    text-align: center;
    width: 980px; }
 /* #cba-header .dawdle {
  *  background-image: url(/about-us/can/img/spinner-white.gif);*/ } 

#cba-footer {
  background: #fff;
  width: 100%; }
  
  #cba-footer footer {
    height: 360px;
    margin: 0 auto;
    padding-top: 32px;
    text-align: center;
    width: 980px; }
  #cba-footer .dawdle {
    background-image: url(/about-us/can/img/spinner-white.gif); }

#site-nav {
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 14px;
  z-index: 1000; }
  #site-nav ul {
    padding-top: 10px; }
  #site-nav li {
    margin-bottom: 2px; }
  #site-nav a {
    background: #f3f0ec;
    color: #fff;
    display: block;
    font-family: arial;
    padding: 8px 16px 9px 18px;
    text-align: left;
    text-decoration: none;
    width: 186px; }
    #site-nav a:hover {
      background: #ffcc00; }
    #site-nav a span {
      display: block; }
  #site-nav .ttl {
    color: #231f20;
    font-size: 15px;
    font-weight: bold;
    line-height: 1.3;
    padding-bottom: 3px; }
  #site-nav .descrip {
    color: #58585a;
    font-size: 13px; }
  #site-nav .social {
    padding: 6px 0 0 18px; }
    #site-nav .social a {
      background: none;
      float: right; }

#site-nav.looseTop {
  position: absolute;
  right: 0;
  top: 30px; }

#site-nav.looseBtm {
  position: absolute;
  top: 3620px; }

.lt-ie7 #site-nav {
  position: absolute;
  right: expression(0+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');
  top: expression(14+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px'); }

.touch #site-nav {
  position: absolute; }

.touch #site-nav h6 {
  display: none; }

.touch #site-nav li:not(.social) {
  display: none; }

.touch #site-nav .social {
  float: left;
  padding-left: 2px; }

#main {
  position: relative;
  width: 100%; }

#mq {
  left: -9999em;
  position: absolute;
  text-align: left;
  top: 0; }

/*
* 6. PAGE SPECIFIC
--------------------------------------------------------------------------*/
/*
* 6.1. CAN
---------------------------------------*/
#logo-cbacan {
  display: block;
  font-size: 0;
  text-indent: -9999em;
  height: 232px;
  margin-left: 90px;
  width: 630px; }

#section-can {
  height: 715px;
  z-index: 60; }
  #section-can p {
    color: #231f20;
    font-family: arial;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.2; }
  #section-can .content {
    height: 695px;
    padding-top: 10px; }
  #section-can .col {
    padding-top: 70px; }
  #section-can .col-left {
    padding-left: 40px;
    padding-right: 25px;
    width: 280px; }
  #section-can .col-right {
    float: left;
    width: 480px; }
    
#section-can h2 {
  color: #231f20;
  font: normal 50px/0.85 "Aachen W01 Bold", Arial, Verdana, serif;
  margin-bottom: 16px;
}

#section-can .btn {
  padding-top: 10px;
  width: 160px;
}
#section-can .btn a {
  font-family: Verdana, Geneva, sans-serif;
}


#can-video {
  background: black url(/about-us/can/img/spinner-black.gif) no-repeat center center;
  height: 270px;
  width: 480px; }

#bcExperienceMobile {
  display: none; }
  
/*  add link to poem page LINDA*/
#downloadpoem {
      float: left;
      width: 250px;
      padding-top: 31px;
      }
      
#downloadpoem p {
    font-size: 130%;
    font-family: arial;
    font-weight: bold;
    margin-top: 0px;
	font-size: 12px;
}

#downloadpoem a {
    color: #645E56;
    text-decoration: none;
}

#downloadpoem a:hover {
    color: #fff;
}


/* end */

#social-pages {
  float: right;
  padding-top: 30px; }
  #social-pages li {
    color: #645e56;
    float: left;
    font-family: arial;
    font-weight: bold;
    margin-right: 10px; 
	font-size: 13px;
	}
  #social-pages a {
    background-color: #231f20;
    height: 22px;
    text-decoration: none;
    width: 22px; 
	}
  #social-pages .facebook {
    background-position: 0 0; }
  #social-pages .twitter {
    background-position: -22px 0; }
  #social-pages .youtube {
    background-position: -44px 0; }
  #social-pages .googleplus {
    background-position: -66px 0; }
  #social-pages .first {
    padding-top: 3px; }
  #social-pages .last {
    margin-right: 0; }

.lt-ie7 #social-pages {
  width: 208px; }
  


/*
* 6.2. COMMBANK KACHING
---------------------------------------*/
#section-commbankkaching {
  /** +2px for bgtilebtm height. **/
  height: 407px;
  z-index: 59; }
  #section-commbankkaching h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    height: 101px;
    margin-bottom: 16px;
    width: 278px; }
  #section-commbankkaching h3 {
    color: #8a97a1;
    padding-bottom: 26px; }
  #section-commbankkaching p {
    color: #999b9d; }
  #section-commbankkaching .content {
    height: 373px;
    padding-top: 32px; }
  #section-commbankkaching .col-left {
    padding-right: 50px;
    width: 310px; }
    #section-commbankkaching .col-left .links {
      padding-top: 8px; }
      #section-commbankkaching .col-left .links .btn {
        float: left;
        padding-top: 4px; }
      #section-commbankkaching .col-left .links .appstore {
        float: right; }
  #section-commbankkaching .col-right {
    float: left;
    padding-top: 22px; }
  #section-commbankkaching .hero {
    display: block;
    height: 296px;
    position: relative;
    width: 583px; }
    #section-commbankkaching .hero .video {
      left: 66px;
      position: absolute;
      top: 28px; }
  #section-commbankkaching .bgtilebtm {
    background: url(/about-us/can/img/bgtilebtm-commbankkaching.jpg) 0 0 repeat-x;
    height: 2px;
    width: 100%; }

/*
* 6.3. COMMBANK PROPERTY GUIDE APP
---------------------------------------*/
#section-commbankpropertyguideapp {
  background-color: #4ec4e2;
  background-image: linear-gradient(top, #4ec4e2 0%, #4ec4e2 155px, #71d0e8 155px, #71d0e8 290px, #95dcee 290px, #95dcee 146px);
  background-image: -o-linear-gradient(top, #4ec4e2 0%, #4ec4e2 155px, #71d0e8 155px, #71d0e8 290px, #95dcee 290px, #95dcee 146px);
  background-image: -moz-linear-gradient(top, #4ec4e2 0%, #4ec4e2 155px, #71d0e8 155px, #71d0e8 290px, #95dcee 290px, #95dcee 146px);
  background-image: -webkit-linear-gradient(top, #4ec4e2 0%, #4ec4e2 155px, #71d0e8 155px, #71d0e8 290px, #95dcee 290px, #95dcee 146px);
  background-image: -ms-linear-gradient(top, #4ec4e2 0%, #4ec4e2 155px, #71d0e8 155px, #71d0e8 290px, #95dcee 290px, #95dcee 146px);
  background-image: -webkit-gradient(linear, left top, left 436px, color-stop(0, #4ec4e2), color-stop(155px, #4ec4e2), color-stop(155px, #71d0e8), color-stop(135px, #71d0e8), color-stop(135px, #95dcee), color-stop(146px, #95dcee));
  height: 487px;
  z-index: 58; }
  #section-commbankpropertyguideapp h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    height: 100px;
    margin-bottom: 26px;
    width: 357px; }
  #section-commbankpropertyguideapp h3 {
    color: #333;
    padding-bottom: 26px; }
  #section-commbankpropertyguideapp p {
    color: #333; }
  #section-commbankpropertyguideapp .content {
    height: 436px; }
  #section-commbankpropertyguideapp .col-left {
    height: 436px;
    width: 495px; }
    #section-commbankpropertyguideapp .col-left .illo {
      background-position: center top;
      bottom: -26px;
      height: 345px;
      left: -100px;
      position: absolute;
      width: 518px; }
  #section-commbankpropertyguideapp .col-right {
    float: left;
    padding-top: 36px;
    width: 360px; }
    #section-commbankpropertyguideapp .col-right .inner {
      width: 315px; }
    #section-commbankpropertyguideapp .col-right .links {
      padding-top: 8px; }
      #section-commbankpropertyguideapp .col-right .links .btn {
        float: left;
        padding-top: 4px; }
      #section-commbankpropertyguideapp .col-right .links .appstore {
        float: right; }
  #section-commbankpropertyguideapp .bgtilebtm {
    background: #5f696f;
    height: 51px;
    width: 100%; }
    #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 {
      height: 26px;
      width: 100%; }
      #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 .left {
        float: left;
        height: 26px;
        width: 30%; }
      #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 .right {
        float: right;
        width: 70%; }
        #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 .right .top {
          background: #d9d9da;
          height: 22px;
          width: 100%; }
        #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 .right .btm {
          background: url(/about-us/can/img/bgtilebtm-commbankpropertyguideapp1.jpg) 0 0 repeat-x;
          height: 4px;
          width: 100%; }
    #section-commbankpropertyguideapp .bgtilebtm .bgtilerow3 {
      background: url(/about-us/can/img/bgtilebtm-commbankpropertyguideapp2.jpg) 0 0 repeat-x;
      height: 25px;
      width: 100%; }

.lt-ie8 #section-commbankpropertyguideapp .bgtilebtm .bgtilerow1 .right {
  width: 69%; }
.lt-ie8 #section-commbankpropertyguideapp .col-left .illo {
  /*bottom:-25px;*/ }

/*
* 6.4. EVERYDAY SETTLEMENT
---------------------------------------*/
#section-everydaysettlement {
  /** +2px for bgtilebtm height. **/
  height: 372px;
  z-index: 57; }
  #section-everydaysettlement h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    height: 87px;
    margin-bottom: 26px;
    width: 263px; }
  #section-everydaysettlement h3 {
    color: #d0d5d9;
    padding-bottom: 26px; }
  #section-everydaysettlement .content {
    height: 370px; }
  #section-everydaysettlement .col-left {
    padding-top: 30px;
    padding-right: 15px;
    width: 305px; }
  #section-everydaysettlement .col-right {
    float: left;
    width: 660px; }
    #section-everydaysettlement .col-right .illo {
      height: 297px;
      left: 0;
      position: absolute;
      top: 40px;
      width: 598px; }
  #section-everydaysettlement .btn {
    padding-top: 26px; }
    #section-everydaysettlement .btn a {
      width: 150px; }
  #section-everydaysettlement .bgtilebtm {
    background: url(/about-us/can/img/bgtilebtm-everydaysettlement.jpg) 0 0 repeat-x;
    height: 2px;
    width: 100%; }

/*
* 6.5. CONCIERGE
---------------------------------------*/
#section-concierge {
  /** +3px for bgtilebtm height. **/
  height: 333px;
  z-index: 58; }
  #section-concierge h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em; }
  #section-concierge h3 {
    color: #cccdce;
    padding-bottom: 26px; }
  #section-concierge .content {
    height: 330px; }
  #section-concierge .col-left {
    height: 333px;
    width: 495px; }
    #section-concierge .col-left h4 {
      display: block;
      font-size: 0;
      text-indent: -9999em;
      bottom: 0;
      height: 32px;
      left: 0;
      position: absolute;
      width: 300px; }
    #section-concierge .col-left .illo {
      height: 336px;
      left: 26px;
      position: absolute;
      top: -24px;
      width: 419px; }
  #section-concierge .col-right {
    height: 293px;
    float: left;
    padding-top: 40px;
    width: 295px; }
    #section-concierge .col-right h2 {
      height: 53px;
      margin-bottom: 16px;
      width: 239px; }
  #section-concierge .btn {
    padding-top: 26px; }
    #section-concierge .btn a {
      width: 180px; }
  #section-concierge .bgtilebtm {
    background: url(/about-us/can/img/bgtilebtm-concierge.jpg) 0 0 repeat-x;
    height: 3px;
    width: 100%; }

.lt-ie7 #section-concierge .col-left h2 {
  bottom: -4px; }

/*
* 6.6. HOME LOANS
---------------------------------------*/
#section-homeloans {
  /** +3px for bgtilebtm height. **/
  height: 553px;
  z-index: 59; }
  #section-homeloans h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    margin-bottom: 16px; }
  #section-homeloans h3 {
    color: #666;
    padding-bottom: 16px; }
  #section-homeloans p {
    color: #333; }
  #section-homeloans a {
    color: #333;
    font-weight: bold;
    text-decoration: none; }
  #section-homeloans .col-left {
    height: 1px;
    width: 336px; }
  #section-homeloans .col-right {
    float: left;
    width: 644px; }
  #section-homeloans .row-homeloans {
    height: 280px; }
    #section-homeloans .row-homeloans h2 {
      height: 24px;
      width: 163px; }
    #section-homeloans .row-homeloans .rowcol1 {
      padding-top: 40px;
      position: relative;
      width: 285px;
      z-index: 51; }
    #section-homeloans .row-homeloans .rowcol2 {
      height: 1px;
      position: relative;
      width: 1px;
      z-index: 50; }
      #section-homeloans .row-homeloans .rowcol2 .illo {
        height: 241px;
        left: -50px;
        position: absolute;
        top: -9px;
        width: 418px; }
  #section-homeloans .row-businessspecialists h2 {
    background-image: url(/about-us/can/img/spinner-sandstoneTint1.gif);
    height: 29px;
    margin-bottom: 12px;
    width: 288px; }
  #section-homeloans .row-businessspecialists .rowcol1 {
    height: 270px;
    position: relative;
    width: 500px; }
    #section-homeloans .row-businessspecialists .rowcol1 .inner {
      background: url(/about-us/can/img/illustration-businessspecialists.jpg) 0 0 no-repeat;
      height: 213px;
      left: -36px;
      padding: 32px 32px 0 200px;
      position: absolute;
      top: 0;
      width: 305px; }
  #section-homeloans .bgtilebtm {
    background: url(/about-us/can/img/bgtilebtm-homeloans.jpg) 0 0 repeat-x;
    height: 3px;
    width: 100%; }

#social-feed {
  height: 1030px;
  left: 0;
  position: absolute;
  top: 0;
  width: 300px;
  z-index: 59; }
  #social-feed strong {
    color: #231f20; }
  #social-feed p {
    color: #808285;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 0; }
  #social-feed .facebook,
  #social-feed .tweets {
    background: #fff;
    height: 1126px;
    padding: 12px 16px 0;
    position: relative; }
  #social-feed .facebook {
    height: 180px;
    margin-bottom: 10px; }
  #social-feed .icon {
    height: 22px;
    position: absolute;
    right: 4px;
    top: 4px;
    width: 22px; }
  #social-feed .tweets .icon {
    background-position: -22px -22px; }
  #social-feed .fill {
    padding-top: 14px; }
  #social-feed .post {
    border-bottom: 1px solid #e6e6e7;
    height: 110px;
    padding: 10px 0; }
  #social-feed .first {
    padding-top: 0; }
  #social-feed .last {
    /*border-bottom:none;*/ }
  #social-feed .pic {
    float: left; }
  #social-feed .text {
    float: left;
    padding-left: 10px;
    width: 200px; }
  #social-feed .msg {
    color: #231f20;
    display: block;
    height: 75px;
    font-weight: normal;
    /*width:200px;*/ }
  #social-feed .user {
    color: #ffcc00; }
  #social-feed .facebook .post {
    border-bottom: 0;
    padding-top: 0;
    padding-bottom: 0; }
  #social-feed .facebook .icon {
    background-position: 0 -22px; }
  #social-feed .facebook .msg {
    color: #808285; }
  #social-feed .facebook .user {
    color: #4ec4e2; }
    #social-feed .facebook .user a {
      color: #4ec4e2; }
  #social-feed .handle {
    color: #231f20;
    font-weight: bold; }
  #social-feed .time {
    color: #b3b4b6;
    font-size: 10px;
    font-weight: normal; }
    #social-feed .time a {
      color: #b3b4b6;
      font-weight: normal; }
  #social-feed .loading {
    background: url(/about-us/can/img/spinner-white.gif) no-repeat center center;
    min-height: 25px; }
  #social-feed .illo {
    background-image: url(/about-us/can/img/spinner-white.gif);
    height: 85px;
    position: absolute;
    right: 0;
    top: 422px;
    width: 19px;
    z-index: 101; }
  #social-feed .illo2 {
    background-image: url(/about-us/can/img/spinner-white.gif);
    height: 112px;
    position: absolute;
    right: 0;
    top: 904px;
    width: 16px;
    z-index: 101; }
  #social-feed .facebook-home,
  #social-feed .twitter-home {
    color: #4ec4e2;
    float: right;
    font-family: arial;
    font-size: 11px;
    padding-top: 6px;
    text-align: right; }

/*
* 6.7. ATMS
---------------------------------------*/
#section-atms {
  /** +3px for bgtilebtm height. **/
  height: 588px;
  z-index: 54; }
  #section-atms h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    height: 23px;
    margin-bottom: 16px;
    width: 159px; }
  #section-atms h3 {
    color: #666;
    padding-bottom: 16px; }
  #section-atms p {
    color: #333; }
  #section-atms a {
    color: #333;
    font-weight: bold;
    text-decoration: none; }
  #section-atms .content {
    height: 585px; }
  #section-atms .col-left {
    height: 1px;
    width: 336px; }
  #section-atms .col-right {
    float: left;
    width: 644px; }
  #section-atms .row-atms {
    height: 280px; }
    #section-atms .row-atms h2 {
      height: 24px;
      width: 79px; }
    #section-atms .row-atms .rowcol1 {
      height: 240px;
      padding-top: 40px;
      position: relative;
      width: 305px;
      z-index: 51; }
    #section-atms .row-atms .rowcol2 {
      position: relative;
      z-index: 50; }
      #section-atms .row-atms .rowcol2 .illo {
        height: 228px;
        left: -50px;
        position: absolute;
        top: 5px;
        width: 409px; }
  #section-atms .row-businessexperts h2 {
    background-image: url(/about-us/can/img/spinner-sandstone.gif);
    height: 29px;
    width: 239px; }
  #section-atms .row-businessexperts .rowcol1 {
    height: 272px;
    position: relative;
    width: 500px; }
    #section-atms .row-businessexperts .rowcol1 .inner {
      background: url(/about-us/can/img/illustration-businessexperts.jpg) 0 0 no-repeat;
      height: 240px;
      left: -36px;
      padding: 32px 32px 0 200px;
      position: absolute;
      top: 0;
      width: 312px; }
  #section-atms .bgtilebtm {
    background: url(/about-us/can/img/bgtilebtm-atms.jpg) 0 0 repeat-x;
    height: 3px;
    width: 100%; }

/*
* 6.8. MOBILE BANKERS
---------------------------------------*/
#section-mobilebankers {
  height: 840px;
  z-index: 60; }
  #section-mobilebankers h2 {
    display: block;
    font-size: 0;
    text-indent: -9999em;
    margin-bottom: 16px; }
  #section-mobilebankers h3 {
    color: #666;
    padding-bottom: 16px; }
  #section-mobilebankers p {
    color: #333; }
  #section-mobilebankers a {
    color: #333;
    font-weight: bold;
    text-decoration: none; }
  #section-mobilebankers .col-left {
    height: 637px;
    position: relative;
    width: 300px; }
    #section-mobilebankers .col-left h2 {
      background-image: url(/about-us/can/img/spinner-sandstoneTint3.gif);
      height: 30px;
      width: 183px; }
    #section-mobilebankers .col-left .inner {
      background: url(/about-us/can/img/illustration-childrenssavings.jpg) 0 0 no-repeat;
      height: 251px;
      left: 0;
      padding: 386px 42px 0 34px;
      position: absolute;
      top: -30px;
      width: 222px; }
  #section-mobilebankers .col-right {
    height: 637px;
    width: 680px; }
  #section-mobilebankers .row-mobilebankers {
    height: 290px;
    padding-top: 30px;
    position: relative; }
    #section-mobilebankers .row-mobilebankers h2 {
      background-image: url(/about-us/can/img/spinner-sandstoneTint4.gif);
      height: 24px;
      width: 212px; }
    #section-mobilebankers .row-mobilebankers p {
      margin-bottom: 8px; }
    #section-mobilebankers .row-mobilebankers .inner {
      background: url(/about-us/can/img/illustration-mobilebankers.jpg) 0 0 no-repeat;
      height: 258px;
      padding: 32px 280px 0 40px;
      width: 282px; }
  #section-mobilebankers .row-financialhealthcheck .rowcol1 {
    height: 255px;
    padding: 40px 0 0 40px;
    position: relative;
    width: 220px;
    z-index: 51; }
    #section-mobilebankers .row-financialhealthcheck .rowcol1 .cta {
      bottom: 0;
      left: 40px;
      position: absolute;
      white-space: nowrap; }
  #section-mobilebankers .row-financialhealthcheck .rowcol2 {
    position: relative;
    z-index: 50; }
    #section-mobilebankers .row-financialhealthcheck .rowcol2 .illo {
      height: 187px;
      left: -20px;
      position: absolute;
      top: 16px;
      width: 313px; }
  #section-mobilebankers .row-importantinfo {
    padding-top: 30px; }
    #section-mobilebankers .row-importantinfo strong {
      color: #231f20;
      font-weight: normal; }
    #section-mobilebankers .row-importantinfo p {
      color: #808285;
      font-size: 11px;
      margin-bottom: 0; }
    #section-mobilebankers .row-importantinfo .highlight {
      color: #ff0000; }

div.footerPolicy {font-size: 62.50%;}

/*
* 7. MEDIA QUERIES
--------------------------------------------------------------------------*/
@media screen and (max-width:1420px), screen and (max-height:735px) {
  #site-nav a {
    width: 122px; }
  #site-nav .ttl {
    font-size: 15px; }
  #site-nav .descrip {
    display: none; }

  .lt-ie8 #site-nav .social {
    width: 122px; } }
@media screen and (max-width:1290px), screen and (max-height:655px) {
  #site-nav a {
    width: 75px; }
  #site-nav .ttl {
    font-size: 13px;
    font-weight: normal;
    width: 75px; }
  #site-nav .descrip {
    display: none; }
  #site-nav .social {
    padding-left: 0; }

  .lt-ie8 #site-nav .social {
    width: 75px; } }
@media screen and (max-width:640px) {
  .page {
    width: auto; }

  .page .bgtilebtm {
    display: none; }

  .no-mobile {
    display: none !important; }

  .content {
    margin: 0;
    width: 100%; }
    .content .mob-toggle {
      cursor: pointer;
      display: block;
      padding: 25px 0 0;
      position: relative;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      text-decoration: none;
      width: inherit; }
      .content .mob-toggle h2 {
        margin-left: 40px; }
      .content .mob-toggle h3 {
        padding-left: 40px; }
      .content .mob-toggle span {
        background-repeat: no-repeat;
        display: block;
        height: 13px;
        position: absolute;
        right: 20px;
        top: 55px;
        width: 19px; }
    .content .mob-wrapper {
      display: none;
      padding: 25px 40px 35px;
      width: auto;
      /*max-height:0; -webkit-transition:max-height 40s ease-in-out;*/ }

  #mq {
    text-align: right; }

  #cba-header {
    height: 0px !important;
    margin: 0 auto;
    padding-top: 0px;
    text-align: center; }
    #cba-header header {
      height: 45px;
      margin: 0 auto;
      padding-top: 0;
      width: 265px; }
    #cba-header .dawdle {
      background-position: center center; }

  #cba-footer {
    height: 355px;
    margin: 0 auto;
    padding-top: 0; }

  #cba-footer footer {
    margin: 0 auto;
    padding-top: 0;
    width: 100%; }

  #site-nav {
    display: none; }

  #logo-cbacan {
    margin: 0 auto; }

  #section-can {
    height: auto; }
    #section-can p {
      font-size: 14px; }
    #section-can #can-video {
      height: 135px;
      width: 240px; }
    #section-can #bcExperience {
      display: none; }
    #section-can #bcExperienceMobile {
      display: block; }
    #section-can #social-pages {
      display: none; }
    #section-can .content {
      height: auto;
      padding-top: 5px;
      padding-bottom: 25px; }
      #section-can .content .left {
        float: none;
        width: inherit; }
    #section-can .col {
      padding-top: 25px; }
    #section-can .col-left {
      float: none;
      width: inherit; }
    #section-can .col-right {
      float: none;
      padding-top: 15px;
      padding-left: 40px;
      width: inherit; }

  #section-commbankkaching {
    background: #353132;
    height: auto; }
    #section-commbankkaching p {
      color: #fff;
      font-size: 14px; }
    #section-commbankkaching .content {
      height: auto;
      padding-top: 0; }
    #section-commbankkaching .col-left {
      float: none;
      padding-right: 0;
      width: inherit; }
      #section-commbankkaching .col-left .links .btn {
        float: none; }
      #section-commbankkaching .col-left .links .btn a {
        width: 150px; }
      #section-commbankkaching .col-left .links .appstore {
        display: block;
        float: none;
        padding-top: 26px; }
    #section-commbankkaching .col-right {
      display: none;
      float: none;
      width: inherit; }
    #section-commbankkaching .mob-toggle {
      background-color: #231f20; }
      #section-commbankkaching .mob-toggle span {
        background-image: url(/about-us/can/img/icon-arrowdown-dark-640w-lowres.jpg); }
      #section-commbankkaching .mob-toggle span.open {
        background-image: url(/about-us/can/img/icon-arrowup-dark-640w-lowres.jpg); }

  #section-commbankpropertyguideapp {
    background: #71d0e8;
    height: auto; }
    #section-commbankpropertyguideapp h2 {
      margin-bottom: 16px; }
    #section-commbankpropertyguideapp h3 {
      color: #b8e7f3; }
    #section-commbankpropertyguideapp p {
      color: #fff;
      font-size: 14px; }
    #section-commbankpropertyguideapp .content {
      height: auto;
      padding-top: 0; }
    #section-commbankpropertyguideapp .col-left {
      display: none;
      float: none;
      width: inherit; }
    #section-commbankpropertyguideapp .col-right {
      float: none;
      padding-top: 0;
      width: inherit; }
      #section-commbankpropertyguideapp .col-right .inner {
        width: inherit; }
      #section-commbankpropertyguideapp .col-right .links .btn {
        float: none; }
      #section-commbankpropertyguideapp .col-right .links .btn a {
        width: 150px; }
      #section-commbankpropertyguideapp .col-right .links .appstore {
        display: block;
        float: none;
        padding-top: 26px; }
    #section-commbankpropertyguideapp .mob-toggle {
      background: #4ec4e2; }
      #section-commbankpropertyguideapp .mob-toggle span {
        background-image: url(/about-us/can/img/icon-arrowdown-sky-640w-lowres.jpg); }
      #section-commbankpropertyguideapp .mob-toggle span.open {
        background-image: url(/about-us/can/img/icon-arrowup-sky-640w-lowres.jpg); }

  #section-everydaysettlement {
    background: #a1acb4;
    height: auto; }
    #section-everydaysettlement h2 {
      margin-bottom: 16px; }
    #section-everydaysettlement h3 {
      color: #b9c1c7; }
    #section-everydaysettlement p {
      color: #fff;
      font-size: 14px; }
    #section-everydaysettlement .content {
      height: auto;
      padding-top: 0; }
    #section-everydaysettlement .col-left {
      float: none;
      padding: 0;
      width: inherit; }
    #section-everydaysettlement .col-right {
      display: none;
      float: none;
      width: inherit; }
    #section-everydaysettlement .mob-toggle {
      background: #8a97a1; }
      #section-everydaysettlement .mob-toggle span {
        background-image: url(/about-us/can/img/icon-arrowdown-dusk-640w-lowres.jpg); }
      #section-everydaysettlement .mob-toggle span.open {
        background-image: url(/about-us/can/img/icon-arrowup-dusk-640w-lowres.jpg); }
    #section-everydaysettlement .btn a {
      width: 150px; }

  #section-concierge {
    background: #999b9d;
    height: auto; }
    #section-concierge h3 {
      color: #cccdce; }
    #section-concierge p {
      color: #fff;
      font-size: 14px; }
    #section-concierge .content {
      height: auto;
      padding-top: 0; }
    #section-concierge .col-left {
      display: none;
      float: none;
      width: inherit; }
    #section-concierge .col-right {
      float: none;
      height: auto;
      padding: 0;
      width: inherit; }
    #section-concierge .mob-toggle {
      background: #808285; }
      #section-concierge .mob-toggle span {
        background-image: url(/about-us/can/img/icon-arrowdown-slate-640w-lowres.jpg);
        top: 45px; }
      #section-concierge .mob-toggle span.open {
        background-image: url(/about-us/can/img/icon-arrowup-slate-640w-lowres.jpg); }

  #section-mobilebankers {
    background: #e6e6e7;
    height: auto;
    padding: 25px 12px 35px; }
    #section-mobilebankers .row-importantinfo {
      padding-top: 0; }
      #section-mobilebankers .row-importantinfo p {
        color: #999; }
      #section-mobilebankers .row-importantinfo strong {
        color: #999;
        font-weight: bold; }

  #section-homeloans,
  #section-atms,
  #section-mobilebankers .col-left,
  #section-mobilebankers .col-right {
    display: none; }

  #social-feed {
    display: none; } }
@media screen and (-webkit-min-device-pixel-ratio:2), screen and (min-device-pixel-ratio:2) {
  #section-commbankkaching .mob-toggle span {
    background-image: url(/about-us/can/img/icon-arrowdown-dark-640w.jpg);
    background-size: 50%;
    height: 25px;
    right: 0;
    width: 37px; }
  #section-commbankkaching .mob-toggle span.open {
    background-image: url(/about-us/can/img/icon-arrowup-dark-640w.jpg);
    background-size: 50%; }

  #section-commbankpropertyguideapp .mob-toggle span {
    background-image: url(/about-us/can/img/icon-arrowdown-sky-640w.jpg);
    background-size: 50%;
    height: 25px;
    right: 0;
    width: 37px; }
  #section-commbankpropertyguideapp .mob-toggle span.open {
    background-image: url(/about-us/can/img/icon-arrowup-sky-640w.jpg);
    background-size: 50%; }

  #section-everydaysettlement .mob-toggle span {
    background-image: url(/about-us/can/img/icon-arrowdown-dusk-640w.jpg);
    background-size: 50%;
    height: 25px;
    right: 0;
    width: 37px; }
  #section-everydaysettlement .mob-toggle span.open {
    background-image: url(/about-us/can/img/icon-arrowup-dusk-640w.jpg);
    background-size: 50%; }

  #section-concierge .mob-toggle span {
    background-image: url(/about-us/can/img/icon-arrowdown-slate-640w.jpg);
    background-size: 50%;
    height: 25px;
    right: 0;
    width: 37px; }
  #section-concierge .mob-toggle span.open {
    background-image: url(/about-us/can/img/icon-arrowup-slate-640w.jpg);
    background-size: 50%; } }

#section-can h2 {
  font-size: 32px;
  line-height: 0.65;
}