html,
body {
  font-size: 16px;
}
body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* Mobile Header */
.tc-mobileheader a.logo {
  margin: 0 auto;
  display: block;
  width: 40px;
  height: 37px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.tc-mobileheader a.logo > img {
  width: 100%;
  height: 100%;
}
.tc-mobileheader .btn-sidedrawer {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 20px;
}
.tc-mobileheader .right-col .btn-newlist {
  float: left;
}
.tc-mobileheader .right-col .btn-sharelink {
  float: left;
  margin-left: 10px;
  opacity: 0;
}
.tc-mobileheader.show-link .right-col .btn-sharelink {
  opacity: 1;
}

.tc-mobileheader span.progress-bar {
  opacity: 0;
  display: block;
  height: 2px;
  width: 100%;
  background: #cccccc;
  position: absolute;
  bottom: -1px;
}
.tc-mobileheader span.progress-bar-animate {
  animation: mobile-progress cubic-bezier(0.22, 0.61, 0.36, 1) 2s;
  animation-fill-mode: forwards;
  /*animation-delay: 1s;*/
  -moz-animation: mobile-progress cubic-bezier(0.22, 0.61, 0.36, 1) 2s;
  -moz-animation-fill-mode: forwards;
  /*-moz-animation-delay: 1s;*/
  -webkit-animation: mobile-progress cubic-bezier(0.22, 0.61, 0.36, 1) 2s;
  -webkit-animation-fill-mode: forwards;
  /*-webkit-animation-delay: 1s;*/
}

/* Side Drawer (Mobile) */
.tc-sharelink {
  opacity: 0;
  width: 200px;
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  margin-top: 40px;
}
.tc-sharelink.tc-sharelink-show {
  top: 50%;
  margin-top: 0;
  opacity: 1;
}

/* Search */
.tc-search-container {
  display: block;
  width: 400px;
  padding: 5px;

  position: fixed;
  z-index: 10;
  transform: translateX(50%);
  right: 50%;
  top: -80px;

  background: rgba(0,0,0,0.1);
  border-radius: 4px;
}
.tc-search-container.tc-search-show {
  top: 16px;
}
.tc-search-container .inner-container {
  display: block;
  border-radius: 4px;
  background: #ffffff;
  padding: 12px;
}
.tc-search-container .inner-container .tc-search-wrapper {
  width: 100%;
  border-radius: 4px;
  font-size: 15px;
  text-decoration: none;
  box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04);
  border: 1px solid #E5E5E5;
  cursor: text;
  overflow: hidden;
  background: rgba(255,255,255,1);
  display: block;
  position: relative;
  padding: 4px;
}
.tc-search-container .inner-container .tc-search-wrapper > .tc-search {
  float: left;
  width: 300px;
  height: 24px;
  line-height: 24px;
  color: #666666;
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  margin-top: 3px;
}
.tc-search-container .inner-container .tc-search-wrapper > span.search-icon {
  display: inline-block;
  float: left;
  width: 30px;
  height: 30px;
  position: relative;
  background: url('../images/sprite.svg') no-repeat -60px -60px;
}
.tc-search-container .inner-container .tc-search-wrapper > span.clear-icon {
  display: inline-block;
  cursor: pointer;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 4px;
  right: 3px;
  background: url('../images/sprite.svg') no-repeat -630px -60px;
}
.tc-search-container .inner-container .tc-search-wrapper > span.clear-icon:hover {
  background-position: -630px -90px;
}


/* Taskade Container */
/*.tc-container {
  width: 775px !important;
  margin: 10px auto 100px;
  position: relative;
  top: 20px;
  opacity: 0;
  z-index: 2;

  animation: seq1 cubic-bezier(0.22, 0.61, 0.36, 1) 1s;
  animation-fill-mode: forwards;
  animation-delay: 0.8s;
  -moz-animation: seq1 cubic-bezier(0.22, 0.61, 0.36, 1) 1s;
  -moz-animation-fill-mode: forwards;
  -moz-animation-delay: 0.8s;
  -webkit-animation: seq1 cubic-bezier(0.22, 0.61, 0.36, 1) 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-delay: 0.8s;
}*/

/* Taskade Document */

.tc-container .tc-actions {
  display: block;
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 3;
  overflow-x: hidden;
}
.tc-container .tc-actions > .action {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  position: relative;
  top: 0;
  margin-left: 4px;
}

/* Hide Search for New Lists */
body.is-newlist .tc-container .tc-actions > .action {
  top: -30px !important;
}
.tc-container .tc-sidebar {
  float: right;
  width: 0px;
  opacity: 0;
  overflow: hidden;
  margin: 0;
  padding: 0;
  position: relative;

  transition: all cubic-bezier(0.22, 0.61, 0.36, 1) .3s;
  -webkit-transition: all cubic-bezier(0.22, 0.61, 0.36, 1) .3s;
}
.tc-container .tc-sidebar section {
  position: relative;
  left: 0;
}
.clear {
  clear: both;
}

/*Extra small devices (portrait phones, less than 544px)*/
@media (max-width: 543px) {

  /* Search */
  .tc-search-container {
    width: 100%;
    top: -80px;
    padding: 0;
    background: #ffffff;
    border-bottom: 1px solid #eeeeee;
  }
  .tc-search-container .inner-container {
    padding: 10px;
  }
  .tc-search-container.tc-search-show {
    top: 0;
  }

  /* Hide Search on Mobile (Cloned in Mobile Header) */
  .tc-container .tc-actions > .action {
    top: -30px;
  }

  /* Taskade Document (Override) */
  .tc-container .tc-sidebar {
    display: none;
    width: 0px;
    opacity: 0;
    float: none;
  }
  .tc-container .btn-help {
    display: none;
  }
  .tc-container .kbs-note {
    display: none;
  }
}

/*Small devices (landscape phones, 544px and up)*/
@media (min-width: 544px) {

  /* Search */
  .tc-search-container {
    width: 100%;
    top: -80px;
    padding: 0;
    background: #ffffff;
    border-bottom: 1px solid #eeeeee;
  }
  .tc-search-container .inner-container {
    padding: 10px;
  }
  .tc-search-container.tc-search-show {
    top: 0;
  }

  /* Hide Search on Mobile (Cloned in Mobile Header) */
  .tc-container .tc-actions > .action {
    top: -30px;
  }

  /* Taskade Document (Override) */
  .tc-container .tc-sidebar {
    display: none;
    float: none;
    width: 0px;
    opacity: 0;
  }
  .tc-container .btn-help {
    display: none;
  }
  .tc-container .kbs-note {
    display: none;
  }
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {

  /* Search */
  .tc-search-container {
    display: block;
    width: 400px;
    padding: 0;

    position: fixed;
    z-index: 10;
    transform: translateX(50%);
    right: 50%;
    top: -80px;

    background: #ffffff;
    border-radius: 4px;
    border-bottom: 0;

    /* Border Radius */
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;

    /* Box Shadow */
    -webkit-box-shadow: 0 3px 2px 0 rgba(0,0,0,0.10);
       -moz-box-shadow: 0 3px 2px 0 rgba(0,0,0,0.10);
            box-shadow: 0 3px 2px 0 rgba(0,0,0,0.10);
  }
  .tc-search-container .inner-container {
    padding: 12px;
  }
  .tc-search-container.tc-search-show {
    top: 16px;
  }

  /* Hide Search on Mobile (Cloned in Mobile Header) */
  .tc-container .tc-actions > .action {
    top: 0;
  }

  /* Taskade Document (Override) */
  .tc-container .tc-sidebar {
    display: block;
    float: right;
    width: 0px;
    overflow: hidden;
  }
  .tc-container .btn-help {
    display: inline-block;
  }
  .tc-container .kbs-note {
    display: block;
  }

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {

  /* Taskade Document (Override) */
  .tc-container .tc-sidebar {
    display: block;
    float: right;
    width: 0px;
    overflow: hidden;
    position: relative;
  }

}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1100px) {

  /* Header (Override) */
  .tc-mobileheader {
    display: none;
  }

}
