/*body{
  background-image:url('/img/dbbgbody.png')
}*/
/*
body.newReply{
  padding-bottom:62px;
}
body.newTopic{
  padding-bottom:62px;
}
*/
html,body{
  height:100%;
  background-color:#EDEDED;
}
.postsarea{
}
.loading{
  visibility: hidden;
}
.loading-area{
  background-color:#EDEDED;
  display:none;
  text-align:center;
}
.loading-area.loading{
  display:block;
  visibility: visible;
}
.posts-header{
  position:absolute;
  z-index:999;
  background-color: #EDEDED;
  width:100%;
  margin-left:-15px;
  padding-left:15px;
}
.posts-header.ui-scrollfix{
  position:fixed;
  top:0;
  padding-top:0px;
  width:auto;
  min-width:60%;
}
.post-footer{
  padding-top:12px;
}
.post-avatar{
  width:16px;
  height:16px;
}
.no-avatar div{
  width:16px;
  height:16px;
  line-height:16px;
  border-radius:8px; 
  font-size:smaller;
}
.post-root .no-avatar div{
  width:48px;
  height:48px;
  line-height:48px;
  border-radius:24px;
  font-size:larger; 
}
.no-avatar{
  text-align:center;
}
.post .no-avatar{
  float:right;
}
.reply-avatar-area{
  text-align:right;
  margin:2px;
  padding-right: 0px;
  padding-left: 15px;
}
.post{
  margin-bottom:8px;
  padding:5px;
  font-size:small;
}
.post-root{
  font-size:medium;
  /*border-top:solid 5px #EDEDED;*/
}
.table-form>tbody>tr>td.post-content{
  border-top: none;
}
.post-content{
  
     word-break: break-all;
  
     /* Non standard for webkit */
     word-break: break-word;

-webkit-hyphens: auto;
   -moz-hyphens: auto;
    -ms-hyphens: auto;
        hyphens: auto;
}
.post-actions{
  height:6px;
  min-width:69px;
}
.posturls{
  padding:10px 20px 0px 20px;
}
.posturl-domain{
  font-size:x-small;
}
.posturl-title{
  font-weight:bold;
}
.posturl-desc{
  padding-top:5px;
}
.thumbnail>img{
  width:100%;
  max-width:100%;
}
.thumbnail{
  max-height:200px;
  overflow:hidden;
}
.media>video{
  width:100%;
  max-width:100%;
}
a.alert-warning{
  text-decoration:none;
  font-size:smaller;
}
.dropdown-sub-menu>li>a{
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}
.table td.post-left{
  text-align:right;
  width:64px;
  border-top:none;
}
tr.post td.post-right div.dropdown-toggle{
  display:block;
  padding-left:5px;
  color:#aaa;
}
tr.post td.post-right button.dropdown-toggle{
  display:none;
}
tr.post td.post-right .btn-open{
  display:none;
}
tr.post-root td.post-right div.dropdown-toggle{
  display:none;
}
tr.post-root td.post-right button.dropdown-toggle{
  display:block;
}
tr.post-root td.post-right .btn-open{
  display:inline-block;
}
.post-forums{
  text-align: left;
  font-size: small;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 0;
  min-width: 100%;
}
tr.post td.post-left { border-left: solid 2px transparent;}
tr.post td.post-right { border-right: solid 2px transparent;}
/*.topic_0{border-color: rgba(0,255,0,.2) !important}
.topic_1{border-color: rgba(0,0,255,.2) !important}
.topic_2{border-color: rgba(255,0,0,.2) !important}
.topic_3{border-color: rgba(255,255,0,.2) !important}
.topic_4{border-color: rgba(0,255,255,.2) !important}
.topic_5{border-color: rgba(255,0,255,.2) !important}*/
.table td.post-right{
  width:88px;
  border-top:none;
}
.table td.post-content{
  border-top-color:#F5F5F5;
}
.post-likes{
  text-align:right;
  padding-right:4px;
  font-size: 11px;
  line-height: 0;
  padding-top: 2px;
  display:inline-block;
  float:right;
}
.post-likes span{
  padding-left:2px;
}
.replies {
  font-size: small;
  border-radius: 0px;
  overflow: visible;
  margin-left: -27px;
}
.btn-open{
  border-radius: 0px;
  overflow: visible;
}
.btn-open .material-icons{
  padding-left:4px
}
.table tbody tr:hover td, .table tbody tr:hover th {
  background-color: transparent;
}
.bottomline{
  width: 695px;
  height: 2px;
  background: #F5F5F5;
  border-left: solid 10px white;
  border-right: solid 10px white;
  margin-top: 5px;
  margin-bottom: 6px;
}
.bottom-area{
  margin-bottom: 20px;padding-bottom: 10px;
}
.bottom-area textarea{
  width:100%;
}
.divider{
  font-size:x-small;
  text-align:center;
}
.section-cell{
  background-color:#fff;
  margin-bottom: 16px;
  margin-top: 16px;
  padding-bottom: 16px;
  padding-top: 16px;
}
.section_divider{
  background-color:inherit;
  box-shadow: none;
  margin-bottom: 0px !important;
  margin-top: 0px !important;
  padding-top: 0px;
  padding-bottom: 0px;
}
.navbar-top.container { 
  height: 2em; 
}
.navbar{
  margin-bottom:0px;
}
.navbar-toggle{
  margin-bottom:0px;
}
.masthead2{
  /*height: 100px;*/
  width: 100%;

  background-repeat: repeat-x;
}
.masthead-fg{
  line-height:0;
}
#header > button{
  position:absolute;
  right:0;
  margin:4px;
  z-index:9001;
}
.navbar-top{
z-index:1030;
position:absolute;
width:100%;
}
.dropdown-menu{
z-index:1050;
}
.navbar-top.ui-scrollfix {
  position: fixed;
  top: 0px;
  width: 100%;
}
.navbar-header{
  width:100%;
}

.sidebar.ui-scrollfix {
  position: fixed;
  top: 30px;
  height:100%;
}
.sidebar{
  /*overflow-y:scroll;*/
  height:100%;
  width:262px;
  top:50px;
}
/*
sidebar {
  display:block;
  padding-top:70px;
  margin-bottom:40px;
  background-color:#EDEDED;
}
*/
.sidebar-posts{
  min-height:340px;
  height:100%;
  max-height:100% !important;
}
.sidebar-row{
  position:relative;
}
.sidebar-row .btn-group{
  display:none;
  position:absolute;
  right:0;
}
.sidebar-row:hover .btn-group{
  display:block;
}
.sidebar-row .post-likes{
  display:block;
  padding-top:0px;
}
.sidebar-topic{
  /*background-color:#f8f8f8;*/
}
.sidebar-title{
  font-weight:bold;
  position: fixed;
  margin-top: 50px;
  width: 262px;
  background-color: white;
  z-index: 1;
}
.sidebar-form{
  position:fixed;
  bottom:0;
}
/*
.sidebar.ui-scrollfix {
  position: fixed;
  top: 30px;
  width: 100%;
}
.sidebar ul {
 padding-left: 15px;
}*/
.main-content{    
background-color:#EDEDED;
padding:10px;
  padding-top: 50px;
}
.breadcrumb{
margin:0px;
margin-top: 2px;
}
.breadcrumb-nowrap{
white-space: nowrap;
width: 90%;
overflow: hidden;
vertical-align: bottom;
}

.jumbotron2 {
  position: relative;
  /*padding: 40px 0;*/
}
#header .masthead2 {
height:240px;
}
#header #canvasarea{
  overflow:hidden;
}
.postcontent{
  overflow:hidden;
  /*padding-bottom:5px;*/
  white-space: pre-wrap;
}
.collapsed{
  max-height:322px;
  overflow:hidden;
}
.latest-activity{
  max-height:20px;
  margin:2px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.latest-activity .postcontent{
  display: inline;
  white-space: nowrap;
}
.latest-activity .collapsed{
  display:inline;
}
.latest-activity .glyphicon {
  display: inline;
}
form.post-form{
  background-color:#EDEDED;
  margin-bottom:0px;
  /*margin-right:10px;*/
}
table.table-form{
  margin-bottom:0px;
}
.posts-container{
  /*background-color:rgba(0,0,0,.2);*/
  padding-top:50px;
  background-color:#EDEDED;
  height:100%;
  min-height:300px;
  position:relative;
}
.other-container{
  background-color:#EDEDED;
  margin-top: 50px; 
}
.auth-container{
  background-image:url('/img/immigration.png');
  margin-top: 50px; 
  background-repeat:no-repeat;
  background-size:100%;
  min-height:500px;
}
.posts-table{
  background-color:#fdfdfd;
  margin-bottom: 0px;
  border-bottom: 20px;
  border-bottom: solid 20px white;
}
.posts-table>thead>tr>th{
  border-bottom:0px;
}
.posts-table>tbody>tr>th{
  border-top:0px;
}

.hideheader .masthead2{
  display:none;
  padding-top:1px;
}


.btn-post-info > .replies{
  width: 16px;
  float: left;
  margin-left: -2px;
}

.imgsize{
  max-width:300px;
  max-height:150px;
  width: expression(this.width > 300 ? 300: true);
  height: expression(this.height > 150 ? 150: true); 
  vertical-align:top; 
}
.youtube-link{
  position:relative;
  display:inline-block;
}
.youtube-link > a > .imgsize{

}
.youtube-link > a > .play{
  position: absolute;
  top: 0;
  left: 0;
  margin-left: 25%;
  margin-top: 12%;
}


@media (max-width:1199px){
  .sidebar{
    width:213px;
  }
}
@media (max-width:992px){
  .sidebar{
    display:none;
  }
}

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }
  /* Widen masthead and social buttons to fill body padding */
  .jumbotron2 {
    /* margin-top: -20px;  Offset bottom margin on .navbar */
  }
}
/* Tablet
------------------------- */
@media (max-width: 767px) {
  /* Remove any padding from the body */
  body {
    padding-top: 0;
  }
  /* Widen masthead and social buttons to fill body padding */
  .jumbotron2 {
    /*padding: 40px 20px;*/
    /*margin-top:   -20px;  Offset bottom margin on .navbar */
    /*margin-right: -20px;
    margin-left:  -20px;*/
  }
  .masthead-fg > button{
    margin-right:60px;
  }
  /*
  .sidebar.ui-scrollfix{
    position:static;
  }
  .sidebar.ui-scrollfix > ul{
    display:none;
  }*/
}

/* Landscape phones
------------------------- */
@media (max-width: 480px) {
  /* Remove padding above jumbotron */
  body {
    padding-top: 0;
  }
  body.newTopic{
    padding-bottom:0;
  }
  /*.posts-container{
    margin-top:0;
    padding:0px;
  }*/
  /* Downsize the jumbotrons */
  .jumbotron2{
    display:none;
  }
  .jumbotron2 h1 {
    font-size: 45px;
  }
  .jumbotron2 p,
  .jumbotron2 .btn {
    font-size: 18px;
  }
  .jumbotron2 .btn {
    display: block;
    margin: 0 auto;
  }
  /*UNFIX THE bars
  .navbar-fixed-top {
    position: static;
  }
  .navbar-fixed-bottom {
    position: static;
  }
  .navbar-top{
    position:relative;
  }
  .navbar-top.ui-scrollfix{
    position: static; 
  }
  .navbar{margin-bottom:0px;}*/
  .imgsize{
    max-width:150px;
    max-height:100px;
    width: expression(this.width > 150 ? 150: true);
    height: expression(this.height > 100 ? 100: true); 
  }
  section .row{
    margin-left: 0px;
    margin-right: 0px;
  }
  .post {
    padding: 0px 0px;
  }
  .post > div{
    padding: 0px 0px;
  }
  .btn-post-info{
    width:16px;
    height:16px;
    min-width:16px;
  }
  .btn-post-info .material-icons{
    width:16px;
    height:16px;
  }
  .container-fluid{
    padding: 5px 5px;
  }
  .post .no-avatar{
    float:none;
  }
  .no-avatar div{
    margin-left: auto;
    margin-right: auto;
  }
  .btn-open{
    display:none;
  }
  section canvas{
    width:32px;
    height:32px;
  }
  .bottom-area canvas{
    width:32px;
    height:32px;
  }
  .bottom-area .row{
    margin:0px 0px;
  }
  .bottom-area .row div{
    padding:0px 0px;
  }
  .bottom-area textarea{
    width:85%;
  }
  .post-root .no-avatar div {
    width: 32px;
    height: 32px;
    line-height: 32px;
  }
}


/*side nav again*/

#wrapper {
  padding-left: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#wrapper.toggled {
  padding-left: 250px;
}
#wrapper-right {
  padding-right:0px;
  transition: all 0.5s ease;
}
#wrapper-right.toggled {
  padding-right:272px;
}

#sidebar-wrapper {
  z-index: 1000;
  position: fixed;
  left: 250px;
  width: 0;
  height: 100%;
  margin-left: -250px;
  margin-top:50px;
  overflow-y: auto;
  background: #000;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#sidebar-wrapper-right {
  z-index: 1000;
  position: fixed;
  right: 0px;
  top: 0px;
  width: 0;
  height: 100%;
  overflow-y: auto;
  transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
  width: 250px;
}
#wrapper-right.toggled #sidebar-wrapper-right {
  width: 262px;
  margin-right:10px;
}

#page-content-wrapper {
  width: 100%;
  position: absolute;
}

#wrapper.toggled #page-content-wrapper {
  position: absolute;
  margin-right: -250px;
}
/*needed?
#wrapper-right.toggled .posts-container {
  position: absolute;
  margin-right: -250px;
}*/

@media (min-width:768px) {

    #wrapper {
      padding-left: 250px;
    }
    #sidebar-wrapper {
      width: 250px;
    }
    #page-content-wrapper {
      position: relative;
    }
    #wrapper.toggled #page-content-wrapper {
      position: relative;
    }
    .btn-navbar{
      display:none;
    }
}


/* slide out nav */
/*
body {
  padding-top: 51px;  
}
#sidebar {
  height: 100%;
  padding-right: 0;
  padding-top: 20px;
}
#sidebar .nav {
  width: 95%;
}
#sidebar li {
  border:0 #f2f2f2 solid;
  border-bottom-width:1px;
}

@media screen and (max-width: 767px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
  }
  .row-offcanvas-right
  .sidebar-offcanvas {
    right: -41.6%;
  }

  .row-offcanvas-left
  .sidebar-offcanvas {
    left: -41.6%;
  }
  .row-offcanvas-right.active {
    right: 41.6%;
  }
  .row-offcanvas-left.active {
    left: 41.6%;
  }
  .sidebar-offcanvas {
    position: absolute;
    top: 0;
    width: 41.6%;
  }
  #sidebar {
    padding-top:0;
    background-color: #fff;
  }
}
*/

a {
  font-weight: inherit;
}
.mdl-layout__header .mdl-layout__drawer-button{
  background-color:transparent;
}
.mdl-layout-title{
  overflow: hidden;
  white-space: nowrap;
  width: 60%;
}
.drawer-right--open:not(.is-small-screen)>.mdl-layout__header {
  margin-right: 240px;
  width: calc(100% - 480px);
}
.drawer-right--open:not(.is-small-screen)>.mdl-layout__content {
  margin-right: 240px;
}
.drawer-right--open>.mdl-layout__drawer-right {
  /*-webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);*/
  right:0px;
}

@media (min-width:1024px){
  .mdl-layout-title{
    width:80%;
  }
  .mdl-layout--fixed-drawer>.mdl-layout__header {
      margin-left: 240px;
      width: calc(100% - 240px);
  }
}

.mdl-layout__header-row{
  background-position:0px 80px;
  background-image:url('/media/header-bg.png')
}
.mdl-layout__drawer-right {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  width: 240px;
  height: 100%;
  max-height: 100%;
  position: absolute;
  top: 0;
  right: -240px;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
  box-sizing: border-box;
  border-right: 1px solid #e0e0e0;
  background: #fafafa;
  /*
  -webkit-transform: translateX(250px);
  -ms-transform: translateX(250px);
  transform: translateX(250px);
  */
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  will-change: transform;
  -webkit-transition-duration: .2s;
  transition-duration: .2s;
  -webkit-transition-timing-function: cubic-bezier(.4,0,.2,1);
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  color: #424242;
  overflow: visible;
  overflow-y: auto;
  z-index: 5;
}
.sidebar-mdl{
  width:100%;
}

.demo-drawer {
  border: none;
}
/* iOS Safari specific workaround */
.demo-drawer .mdl-menu__container {
  z-index: -1;
}
.demo-drawer .demo-navigation {
  z-index: -2;
}
/* END iOS Safari specific workaround */
.demo-drawer .mdl-menu .mdl-menu__item{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.demo-drawer-header {
  box-sizing: border-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 16px;
  height: 151px;
}
.demo-avatar-dropdown {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}

.demo-navigation {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.demo-layout .demo-navigation .mdl-navigation__link {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  color: rgba(255, 255, 255, 0.56);
  font-weight: 500;
}
.demo-layout .demo-navigation .mdl-navigation__link:hover {
  background-color: #00BCD4;
  color: #37474F;
}
.demo-layout .demo-navigation .mdl-navigation__link.active {
  text-decoration:none;
  background-color:#EDEDED;
  color: #37474F;
}
.demo-navigation .mdl-navigation__link .material-icons {
  font-size: 24px;
  color: rgba(255, 255, 255, 0.56);
  margin-right: 32px;
}
.demo-drawer-header .mdl-menu__container{
  z-index:-10;
}
.demo-drawer-header .mdl-menu__container.is-visible{
  z-index:1;
}
.demo-avatar{
  width:50px;
  height:50px;
}

.mdl-navigation__link.active span{
  display:none;
}
header.demo-drawer-header canvas{
  max-width:48px;
  max-height:48px;
}
.mdl-card{
  min-height:100px;
}
.mdl-card__title{
  min-height:180px;
}



/* un-flex mdl */
.mdl-grid{
  display: block;
}
.section-cell{
  margin-bottom:16px;
  margin-top:16px;
}

/*static*/
.static{padding:10px;background:white;font-family:Verdana, sans-serif;font-size:11px;line-height:18px;}
.static p{font-size:11px;line-height:18px;white-space: pre-line}
.static a{white-space: pre-line}
.static .root{
  font-size:12px;
}
.static table{
  table-layout:fixed;
  word-wrap:break-word;
  background:#fff;border:#fff;
}
.static table { border-collapse: collapse; }
.static td + td,
.static th + th { border-left: 2px solid #fff; }
.static tr + tr { border-top: 2px solid #fff; }
/* < IE 7 */
.static tr + tr > td,
.static tr + tr > th { border-top: 2px solid #fff; }

.static thead tr{
  background:#90bf46;color:#fff; font-size:10px;
}
.static th{
  padding-left:10px;
  font-weight:normal;
}
.static td{
  padding:5px;
  background:#efefef;
}
.static .smallinfo{
  color:#666;
  font-size:10px;
}
.static-post-body, .static-post-byline{
  background:#efefef;
  padding:10px;
}
.static-footer{
  padding:20px;
}