/* Off canvas layout CSS/JS provided by or adapted from work by Jason Weaver and Luke Wroblewski Requires globals.css grid.css */
body.off-canvas { padding: 0; margin: 0; }

.container { width: 100%; }

.row { overflow: hidden; }

.row .row { overflow: visible; }

.paneled .container { overflow: hidden; }

.paneled .row { width: 100%; }

[role="main"]:before { content: " "; position: absolute; z-index: -1; top: 0; left: -100%; width: 100%; height: 100%; background: #fff}

[role="complementary"], [role="main"] { background: #fff; width: 100%; padding: 0 15px; display: block; position: relative; z-index: 1; -webkit-transition: 0.25s all ease-in; -moz-transition: 0.25s all ease-in; -o-transition: 0.25s all ease-in; transition: 0.25s all ease-in; }

.paneled [role="main"] { padding: 0; }

.page-panel { width: 100%; padding: 0 15px; -webkit-transition: 0.3s margin ease-in-out; -moz-transition: 0.3s margin ease-in-out; -o-transition: 0.3s margin ease-in-out; transition: 0.3s margin ease-in-out; background: #fff; }

#switchPanels { margin: 0 -15px; }

.hide-extras [role="complementary"] { display: block; }

[role="navigation"]#topMenu { /*-webkit-transition: 0.25s all ease-in; -moz-transition: 0.25s all ease-in; -o-transition: 0.25s all ease-in; transition: 0.25s all ease-in;*/ }

[role="navigation"]#topMenu ul { margin-top: 0; }

[role="complementary"] { margin-left: -100%; width: 80%; float: left; z-index: 2; }

[role="main"] { margin-left: 0; float: right; z-index: 1; position: relative; min-height:196px;}

.paneled [role="main"] { background: #fff; width: 500%; overflow: hidden; float: none; position: relative; left: 0; -webkit-transition: 0.15s all ease-in; -moz-transition: 0.15s all ease-in; -o-transition: 0.15s all ease-in; transition: 0.15s all ease-in; }

.page-panel { min-height: 400px; float: left; margin: 0; width: 20%; }

.active [role="complementary"] { margin-left: 0; }

.active [role="main"] { margin-right: -80%; }

.active-menu [role="navigation"]#topMenu { margin-top: 0 !important; }

.listView {margin-bottom:10px;border-top:1px solid #000;border-bottom:1px solid #000;background-color:#e5e2dd;background-repeat:no-repeat;background-size:auto 100%;background-position:left;}

.listView a {padding:30px 30px 30px 90px;display:block;color:#333}

.pageSelect {background: #fff}

.pageSelect .button {width:100%; background: #4d4d4d;color:#fff}

.visited360 {background:url('../images/foundation/viewed.png')!important;background-repeat:no-repeat!important;background-size:auto 80%!important;background-position:right!important;}

.activeSection {background-image:url('../images/foundation/active.png')!important;background-repeat:no-repeat!important;background-size:auto 80%!important;background-position:right!important;}

.clientLogo {}

#header h2 {color:#fff;text-align:center;padding-bottom:5px;;margin:0 0 10px 0;font-size:1.5em;border-bottom:8px solid #474f51}
#header h1 {margin:0}

.rowHeader {background:none;}

.site-title {}

@media all and (min-width: 768px) { menu-button, .sidebar-button { display: none; }
  [role="complementary"] { width: 30%; margin-left: 0; float: left; padding: 0 15px; }
  [role="main"] { width: 70%; padding: 0 15px; }
  .paneled [role="main"] { width: 100%; padding: 0; background: #f4f4f4; left: 0 !important; }
  .page-panel { display: block; min-height: 800px; float: none; margin: 0; width: 100%; background: #f4f4f4; }
  .hide-extras [role="main"] { width: 100%; }
  .hide-extras [role="complementary"] { display: none; }
  [role="navigation"]#topMenu { display: none; } 
  .clientLogo {width:200px}
  .rowHeader {background-image:url('../images/kcl/header.jpg');background-position:right;background-repeat:no-repeat;}
  #header h1 img {height:100px;margin-top:10px}
  #header h2 {border:none;text-align:left;padding-left:40px}
  }