#loader {
  width:100%;
  height:100%;
  background:url('../imgs/loading.gif') 50% no-repeat;
  border: 1px solid black;
  border-radius: 5px;
  position: absolute;
}


.container {
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}

.homediv {
}
.homeimg {
    display: block;
    margin: auto;
    max-width: 100%;
    max-height: 100%;

}

.homelogin {
    position: relative;
    top: -100px;
    left: 300px;

}

.navbar-default {
  white-space: nowrap;
  margin:0px 5px 3px 5px;
  min-height:0px;
  min-height: 34px;
}

.navbar-default li{
  float:left;
}
.navbar-default ul {
  margin:0px;
}
.navbar-default li a {
    padding:6px;
  }
.nav-tabs {
  min-height: 40px;
}
.toolbar {
  position:fixed;
  top:0px;
  right:20px;
  height:40px;
}

.toolbar-div a {
  margin:10px;
}

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

body {
  padding: 0;
  overflow-y: scroll;
}

.footer {
  /* position:absolute; */
  bottom:0px;
  text-align:center;
}


.container-narrow > hr {
  margin: 30px 0;
}




#top_div {

width:100%;

}

widthBestFit {
  width:16.6%;
}


@media screen and (max-width: 4000px) {
  .widthBestFit {
  width:16.6%;
  }


@media screen and (max-width: 1200px) {
  .widthBestFit {
  width:19.9%;
  }
}
@media screen and (max-width: 1000px) {
  .widthBestFit {
  width:25%;
  }
}

@media screen and (max-width: 600px) {
.widthBestFit {
  width:33%;
}
}

@media screen and (max-width: 400px) {
  .widthBestFit {
  width:50%;
  }
}

.fixedWidth {
  width:200px;
}


.icons-toolbar {
  position:absolute;
  top:0px;
  left:50%;
}
.editseqsplit {
   display: block;
   position:relative;
}

.toolbar-icon {
  width:5em;
}

.updstep {
  border: dashed 1px grey;
  display: inline-block;
  position: relative;
  height: 232px;
  cursor: pointer;
}

.updstep-img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 200px;
  display: block;
  margin: auto;
  left: 0;
  right: 0;
  position: absolute;
  top: 0px;
  bottom: 32px;
}

.updstep-caption {
  z-index: 99;
  position: absolute;
  bottom: 0px;
  left:0px;
}

.updstep-info {
  z-index: 100;
  position: absolute;
  top:0px;
  height:100%;
  width:100%;
  display:table;
  text-align: center;
  cursor: pointer;
}

.updstep-marked {
  background-color: cyan;
}

.imageSelected {
  background-color: cyan;
}
.updstep-link {
    position: relative;
    top: -60%;
    transform: translateY(-50%);
    text-align: center;
}


.step {
  border: dashed 1px grey;
  display: inline-block;
  position: relative;
  height: 232px;
  margin-right: -4px;  // avoid space between steps (inline-block issue!)
}

.step-img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 200px;
  display: block;
  margin: auto;
  left: 0;
  right: 0;
  position: absolute;
  top: 0px;
  bottom: 32px;
}

.step-caption {
  z-index: 99;
  position: absolute;
  bottom: 0px;
  left:0px;
}

.step-info {
  z-index: 100;
  position: absolute;
  top:0px;
  height:100%;
  width:100%;
  display:table;
  text-align: center;
  cursor: default;
}

.steplink {
     margin-bottom:10px;
  }

 .steplink-headericon {
     width:30px;
     height:20px;
    text-align: center;
    top: 0px;
    font-size: 20px;
  }

.steplink-header {
   background-color: azure;
   display:block;
   width:100%;
   clear:both;
   height:22px;
   border:1px solid black;
   
}
.steplink-name {
  font-weight: bold;
  padding-left:10px;
  vertical-align: top;
  horizontal-align:;
}
.steplink-info {
    vertical-align: top; 
    padding-left:10px;
}
.steplink-children {
      border: 1px solid black;
      width:100%;

  display: inline-block;
  margin-top: -1px;
}


.step_TOP {/* width: 200px; */
   text-align: center;
   display:table-cell;vertical-align: top;
   margin:0 auto;

/*align-self: flex-start;

*/}

.step_SMALL {

}

.step_LARGE {
  font-size: large;
}

.step_BOTTOM {
display:table-cell;vertical-align: bottom;

/* align-self: flex-end; *//* margin-bottom: 32px; */}

.step_CENTER {
  display:table-cell;
  vertical-align:middle;
}

.yoga-asana {
  border: dashed 1px grey;
  display: inline-block;
  position: relative;
  height: 232px;
  -webkit-margin-before: 1px;
  -webkit-margin-after: 1px;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
}

.child-title {
  width:100%;
  border: solid 1px grey;
  background-color: azure;
}

.category {
    border: dashed 1px grey;
    display: inline-block;
    position: relative;
    height: 232px;
}

.category-img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 200px;
  display: block;
  margin: auto;
  left: 0;
  right: 0;
  position: absolute;
  top: 30px;
  bottom:0;
  cursor:pointer;
}

.category span {
  position: absolute;
  top: 0px;
}

.ellipsis {
  overflow: hidden;
    /* overflow-wrap: break-word; */
  text-overflow: ellipsis;
  width: 100%;
}

.yoga-asana-main {
    height:200px;
    width:100%;
    display: table-cell;
    vertical-align: middle;
}

.yoga-asana-img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 200px;
    display:block;
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom:30px;
}

.yoga-asana-link {
    width: 200px;
    height: 200px;
    display:block;
    margin:auto;
    text-align: center;
    position: absolute;
}
.yoga-asana-link a {
    position:relative;
    top:80px;
}

.yoga-sample-img {
    width: 200px;
    height: 200px;
}

.yoga-asana-caption {
    font-size: small;
    white-space: pre-wrap;
    position: absolute;
    bottom: 0px;
    left: 0px;
}
/* line 1, ../../source/scss/ng-img-crop.scss */
img-crop {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}
/* line 7, ../../source/scss/ng-img-crop.scss */
img-crop canvas {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  outline: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  /* mobile webkit */
}

.cropArea {
    background: #E4E4E4;
    overflow: hidden;
    width:500px;
    height:350px;
}



.drop-box {
    background: #F8F8F8;
    border: 5px dashed #DDD;
    width: 200px;
    height: 65px;
    text-align: center;
    padding-top: 25px;
    margin: 10px;
}

.noselect {
  -webkit-touch-callout: none;/* iOS Safari */
  -webkit-user-select: none;/* Chrome/Safari/Opera */
  -khtml-user-select: none;/* Konqueror */
  -moz-user-select: none;/* Firefox */
  -ms-user-select: none;/* IE/Edge */
  user-select: none;/* non-prefixed version, currently
                                  not supported by any browser */
}

  
.recycle {
  cursor: url('imgs/delete.gif'), pointer;
}

.htitle {

}
.htitle span {
  font-weight:bold;
  padding-left:10px;
  font-size: 18px;
}

.table>tbody>tr.active>td {
    background:lightsteelblue;
}

.sticky-container {
  height:34px;
}
.sticky {
 
/*
    width: 600px;
    background-color: #333;
       color: #fff;
    padding: 0.5ex;
    font-size: 2em;
    border-radius: 0.5ex;
    */
 
/* padding-left: 160px; */
 
padding-right: 3px;
 
/* float: right; */
 
/* display: inline-block; */
}
.sticky.stick {
    position: fixed;
    top: 0;
    z-index: 10000;
    left: 130px;
    /*
    border-radius: 0 0 0.5em 0.5em;
    */
}

.updateHeader {
  background-color: lightgray;
  position: fixed;
  width:100%;
  z-index: 999;
  height: 25px;
}

.updateHeader span {
  
}

.updateHeader button {
  position: absolute;
  right: 0px;
}

.updateToolbar {
   position: fixed;
  width:100%;
   z-index: 999;
  height: 25px;
  top:25px;
}

.updateSteps {
  padding-top:50px;
}

.notselected {
  background-image: url("../imgs/checkbox_unchecked.png");
  background-repeat:no-repeat;
  background-position-x: right;
}
.selected {
  background-image: url("../imgs/checkbox_checked.png");
  background-repeat:no-repeat;
  background-position-x: right;
}

.actionActive {
  color:white;
  background-color:grey;
}

.addon-search {
  background-image: url("../imgs/search.png");
  background-repeat:no-repeat;
  background-position:center;
  width:32px;
}

.addon-cross {
  background-image: url("../imgs/cross.png");
  background-repeat:no-repeat;
  background-position:center;
  width:32px;
}

.addon-plus {
  background-image: url("../imgs/add.png");
  background-repeat:no-repeat;
  background-position:center;
  width:32px;
 
  height: 20px;
  padding: 16px;
}

.up {
  background-image: url("../imgs/up.png");
  background-repeat:no-repeat;
  width:16px;
  height:16px;
  vertical-align: middle;
  display:inline-block;
}
.down {
  background-image: url("../imgs/down.png");
  background-repeat:no-repeat;
  width:16px;
  height:16px;
  vertical-align: middle;
  display:inline-block;
}

#filter {
  min-width:150px;
}

.tblNames {

}
.tblNames img {
  width:50px;
  height:50px;
}


.tblListNames .col1 {
  height:100px;
  width:100px;
  vertical-align: middle;

  padding:0px !important;
}

.tblListNames .col2 {
  overflow-wrap: break-word;
}
.tblListNames .col1 img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100px;
    display: block;
    cursor: pointer;
    margin: auto;
}
.tblListNames .col3  {
  overflow-wrap: break-word;
  white-space: pre-wrap;
  font-size: smaller;
  display: block;
  margin:5px 0px 0px 10px;
}

.tblListNames .col4  {
}
@media screen and (max-width: 550px) {
  .tblListNames .col4  {
    display:none;
  }
}

.tblListNames th span {
 cursor: pointer; 
}

.categories a {
  background-color: lightcyan;
  border-radius: 5px;
  padding: 2px 10px;
  font-size: smaller;
  margin-left: 3px;
}

.otherLng {
  margin-left:20px;
  font-size: smaller;
  font-weight: normal;
}
.btn-search {
  top: 0px;
  display:table-cell;
  font-family: 'Glyphicons Halflings';
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 23px;
}
.btn-page {
  position:fixed;
  top: 45%;
  /* border: 1px solid #ccc; */
  /* border-radius: 4px; */
  font-size: 15px;
  /* width:1%; */
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  font-size: x-large;
  /* text-align: center; */
  -webkit-font-smoothing: antialiased;
  height: 10%;
}
.btn-page-left {
  left:0px;
}
.btn-page-right {
  right: 0px;
}
.btn-page[disabled] {
  opacity: .20;
}

.namesViewBtns {
  position: relative;
  /* float: left; */
  width: 130px;
  padding: 0px;
  /* display: block; */
  float: left;
  min-height: 1px;
}