* {
    margin:0;
    outline:none;
    padding:0;
}


.preload * {
    -webkit-transition:none!important;
    -moz-transition:none!important;
    -ms-transition:none!important;
    -o-transition:none!important;
}


body,html {
    font-family:sans-serif;
    margin:0 auto;
}

header {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    padding:15px;
    background-color:#0d3b69;
    color:#FFF;
    z-index:99;
}
.header-location {
    position:fixed;
    top:70px;
    left:0;
    width:100%;
    border-bottom:1px #949494 solid;
    padding:10px 30px;
    background:#FFF;
    font-size:14px;
    color:#0d3b69;
    z-index:98;
}

#login img {
  width:80%;
}

.header-location a {
    color:#0d3b69;
    text-decoration:none;
}

#menu-frame {
    position:fixed;
    display:none;
    height:100%;
    width:300px;
    background:#FFF;
    top:0;
    left:0;
    box-shadow: 0 0 15px 0px rgba(0,0,0,0.1);
    z-index:100;
}
.menu-logo {
    position:relative;
    width:60%;
    margin:60px auto;
}
.menu-logo img {
    width:100%;
}

.menu,
.logo,
.user {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
}
.menu,
.user {
    width:50px;
    text-align:center;
}
.user {
    width:100px;
    padding-right:25px;
}
.logo {
    width:calc(100% - 150px);
    padding-left:25px;
}
.logo img {
    width:100px;
}
.menu a,
.menu span {
    display:block;
    width:60%;
    margin:0 auto;
}
.menu a {
    padding:10px 5px;
    transition:400ms;
}
.menu a:hover {
    background:rgba(0,0,0,0.2);
    transition:400ms;
}
.menu span div {
    display:block;
    height:3px;
    background:#FFF;
    margin:0 auto;
}
.menu span div:nth-child(2){
    margin-top:3px;
    margin-bottom:3px;
}

.menu-footer {
    position:absolute;
    bottom:10px;
    left:0;
    width:100%;
    padding:15px 0;
    font-size:11px;
    color:#6d6f71;
    border-top:1px #DDD solid;
    text-align:center;
}
#app {
    margin-top:175px;
}
.user a {
    position:relative;
    display:block;
    width:20px;
    height:20px;
    margin-right:15px;
    margin:0 auto;
    background:#CCC;
    color:#0d3b69;
    font-size:18px;
    font-weight:900;
    padding:10px;
    border-radius:50%;
    text-decoration:none;
    transition:400ms;
}
.user a:hover {
    box-shadow:inset 0px 0px 0px 3px rgba(0,0,0,0.2);
}

.menu-item {
    position:relative;
    display:block;
    width:100%;
    margin:5px auto;
}
.menu-item a {
    display:block;
    width:100%;
    box-sizing: border-box;
    color:#6d6f71;
    font-size:12px;
    text-decoration:none;
    text-align:center;
    transition:400ms;
}
.menu-item a:hover {
    background:rgba(0,0,0,0.07);
    transition:400ms;
}
.menu-item a span {
    position:relative;
    display:block;
    margin:0 auto;
    width:80%;
    text-align:left;
    padding:15px 0;
}

.menu-icon,
.menu-label,
.menu-arrow {
    display:inline-block;
    vertical-align:middle;
    box-sizing:border-box;
}

.menu-icon {
    text-align:center;
    width:20px;
}
.menu-icon img {
    width:90%;
}
.menu-label {
    padding-left:25px;
    width:calc(100% - 60px);
}
.menu-arrow {
    text-align:right;
    width:40px;
}

#user-frame {
    position:fixed;
    display:none;
    top:65px;
    right:15px;
    width:300px;
    border-radius:10px;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    padding:50px 20px;
    box-sizing: border-box;
    background:#FFF;
    z-index:100;
    text-align:center;
}

.user-icon {
    position:relative;
    display:block;
    box-sizing: border-box;
    border-radius:50%;
    width:100px;
    padding:20px 0;
    height:100px;
    font-size:52px;
    background:#CCC;
    color:#0d3b69;
    margin:0 auto;
    overflow:hidden;
}
.user-icon.file-preview {
    font-size:27px;
    padding:32px 0 0;
    border:3px #CCC solid;
}
.user-icon.file-preview img {
    margin-top:-32px;
    min-height:120px;
    max-width:120px;
}
.user-name {
    padding:25px 15px 50px;
    font-size:20px;
    color:#0d3b69;
    font-weight:900;
}
.user-email {
    font-size:14px;
    color:#6d6f71;
    margin-top:3px;
    font-weight:100;
}

.logout-button {
    position:relative;
    margin:0 auto;
    width:100%;
}
.logout-button a,
.login-frame a {
    position:relative;
    color:#FFF;
    text-decoration:none;
    display:block;
    box-sizing: border-box;
    font-size:16px;
    background:#0d3b69;
    padding:15px 0;
    text-align:center;
    border-radius:10px;
}
.dashboard-wrap,
.sims-wrap,
.users-wrap {
    position:relative;
    margin:0 auto;
    width:70%;
    padding-bottom:35px;
}
.sims-wrap.full-screen {
    width:96%;
    margin-top:-70px;
}
.module {
    display:inline-block;
    vertical-align:top;
    width:calc(25% - 30px);
    border-radius:10px;
    box-sizing: border-box;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    margin:15px;
    text-align:center;
    transition:400ms;
}
.module:hover {
    transform:scale(1.07);
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.15);
    transition:400ms;
}
.module a,
.module a span {
    display:block;
    padding:15px 10px;
    text-decoration:none;
}

.module-icon img {
    max-height:80px;
}
.module-label {
    font-size:22px;
    color:#0d3b69;
    margin:15px 0 5px;
}
.module-desc {
    font-size:14px;
    color:#6d6f71;
}


.data-table {
    position:relative;
    width:100%;
    box-sizing: border-box;
    border:1px #BBB solid;
    overflow-y:auto;
}

.table-head {
    position:relative;
    width:100%;
    box-sizing: border-box;
    padding:15px 0 15px 15px;
    background:#F8F8F8;
    border-bottom:1px #BBB solid;
}
.table-head.link {
    background:#FCFCFC;
    padding:15px;   
}
.table-title,
.table-desc,
.table-save {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
    font-size:14px;
    color:#666;
}
.table-title {
    text-align:right;
    width:70px;
    padding-right:20px;
    border-right:1px #BBB solid;
}
.long-desc .table-title {
    width:calc(100% - 250px);
    text-align:left;
}
.table-desc {
    width:calc(100% - 400px);
    padding-left:20px;
    font-size:12px;
}
.table-desc a {
    color:#333;
}

.table-head.link a {
    color:#222;
}
.table-save {
    width:295px;
    text-align:right;
}
.table-save a,
.info-object a {
    color:#444;
    text-decoration:none;
    text-transform:uppercase;
    font-size:18px;
}
.table-save span {
    display:block;
    padding:3px 0 2px;
}

.info-object.actions div {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
    padding:0 5px;
}

.table-save .lds-spinner {
    transform:scale(0.5);
}

.long-desc .table-save {
    width:250px;
    text-align:right;
    padding-right:7px;
}


.table-save-left,
  .table-save-right {
      display:inline-block;
      vertical-align:middle;
  }
  .table-save-left {
      padding-right:25px;
  }
  


  .table-save-right a,
  .table-save a,
  .info-object a {
      display:block;
      margin-top:-3px;
      font-size:14px;
      background-color:seagreen;
      padding:9px 13px;
      color:#FFF;
      border-radius:34px;
      transition:400ms;
  }
  .info-object a.delete,
  .table-save-right.delete a {
      background:crimson;
      width:109px;
      padding:9px 0;
      text-align:center;
  }

  
  .info-object a,
  .table-save a {
      width:100px;
      text-align:center;
      padding:9px 0;
      display:inline-block;
      margin-top:-18px;
  }
  .table-save a {
      width:60px;
  }
  .table-save a {
      margin-top:0;
  }
  #table-download a,
  #table-view a  {
      width:109px;
  }

  .file-uploader a {
      width:120px;
  }

  .table-save-right a:hover,
  .table-save a:hover,
  .info-object a:hover {
      background:green;
  }
  .table-save-right.delete a:hover,
  a.dz-remove:hover,
  .info-object a.delete:hover
   {
      background:#FF0000;
  }

  #prod-avail {
      padding-left:10px;
  }


.table-row {
    position:relative;
    width:100%;
    box-sizing: border-box;
}


.parent-row {
    position:relative;
    width:100%;
    padding:35px 15px;
    padding-left:20px;
    border-bottom:1px #BBB solid;
    box-sizing: border-box;
}

.table-icon,
.table-name,
.table-arrow{
    display:inline-block;
    vertical-align: middle;
    box-sizing: border-box;
}
.table-icon {
    width:100px;
    padding-left:10px;
}
.table-icon img {
    width:50%;
}
.table-name {
    width:calc(100% - 150px);
}
.table-arrow {
    width:50px;
    padding-right:25px;
}


.child-rows {
    position:relative;
    width:100%;
    border-bottom:1px #BBB solid;
    box-sizing: border-box;
    background:#EEE;
}

.table-subhead {
    position:relative;
    width:100%;
    padding:10px 15px;
    background:#444;
    color:#FFF;
    box-sizing: border-box;
    font-size:12px;
    font-weight:900;
}

.table-subtitle_name,
.table-subtitle_created,
.table-subtitle_updated,
.table-subtitle_status,
.table-subicon,
.table-subname,
.table-subcreated,
.table-subupdated,
.table-substatus {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
}

.table-subtitle_name {
    width:calc(100% - 450px);
    padding-left:100px;
}
.table-subtitle_name.left-align {
    padding-left:20px;
}
.table-subtitle_created,
.table-subtitle_updated,
.table-subtitle_status,
.table-subcreated,
.table-subupdated,
.table-substatus {
    text-align:center;
    width:150px;
}

.table-name a,
.table-subname a {
    text-decoration:none;
    color:#444;
}

.table-subrow {
    position:relative;
    width:100%;
    box-sizing: border-box;
    padding:20px 15px;
    border-bottom:1px #BBB solid;
}
.table-subrow.new-button {
    background:#DDD;
    text-align:center;
    padding:15px 0;
}
.table-subrow.new-button a {
    background:;
    color:#FFF;
    text-decoration:none;
    text-transform:uppercase;
    font-size:12px;
    padding:10px 15px;
    border-radius:10px;
    background:darkgreen;
}

.table-subicon {
    width:70px;
    text-align:center;
}
.table-subicon img {
    width:50%;
}

.table-subname {
    width:calc(100% - 520px);
    padding-left:30px;
}


.table-subcreated,
.table-subupdated {
    font-size:12px;
    color:#666;
}

.table-substatus span {
    position:relative;
    margin:0 auto;
    display:block;
    width:70%;
    color:#777;
    background:#CCC;
    border:1px #999 solid;
    text-align:center;
    text-transform:uppercase;
    font-size:10px;
    padding:5px 0;
    border-radius:5px;
}

.child-rows {
    display:none;
}

.passage-editor {
    width:100%!important;
    height:300px!important;
    border-radius:5px;
    outline:none;
    padding:10px;
    box-sizing: border-box;
    font-size:16px;
}

.info-slider {
    position:fixed;
    overflow-y:auto;
    right:-350px;
    top:107px;
    background:#FFF;
    width:400px;
    height:calc(100% - 107px);
    z-index:99;
    box-shadow: 0 0 15px 0px rgba(0,0,0,0.1);
}
.info-slider.open {
    right:0;
}
.open-info,
.slider-wrap {
    display:inline-block;
    vertical-align:top;
    box-sizing: border-box;
}
.open-info {
    padding-top:20px;
    width:50px;
    height:100%;
    text-align:center;
}
.open-info:hover {
    background:rgba(0,0,0,0.07);
    transition:400ms;
}
.open-info a {
    display:block;
    height:100%;
}
.slider-wrap {
    width:calc(100% - 50px);
    padding:22px 35px;
}
.info-title {
    font-size:14px;
    color:#6d6f71;
    font-weight:900;
    padding-bottom:10px;
    padding-left:7px;
}
.info-title_header {
    padding-bottom:25px;
}

.info-object {
    position:relative;
    width:100%;
    box-sizing: border-box;
    padding:20px 10px 0 0;
}
.info-object input,
.login-frame input,
.info-object select {
    position:relative;
    width:90%;
    font-size:18px;
    padding:10px 15px;
    outline:none;
    border-radius:10px;
    border:1px #BBB solid;
}
.info-object.save {
    padding-top:50px;
    text-align:right;
}

input.checkbox {
    width:30px;
    margin-right:5px;
}
.checkbox {
    display:inline-block;
    vertical-align:middle;
}
span.checkbox {
    width:calc(100% - 60px);
    font-size:12px;
}
select {
    padding:0 0 0 5px;
    width:85px;
    font-size:12px;
}

.info-object.loader {
    text-align:center;
}
.info-object.loader .lds-spinner {
    transform:scale(0.6);
}

#notification-bar {
    position:fixed;
    top:-80px;
    left:50%;
    font-size:14px;
    text-align:center;
    margin-left:-200px;
    box-shadow:0 5px 5px 0 rgba(0,0,0,0.1);
    padding:0;
    width:400px;
    z-index:101;
  }
  #notification-text {
    padding:15px 0;
    display:block;
    position:relative;
    text-transform:uppercase;
  }
  #notification-timer {
    position:relative;
    width:0%;
    height:7px;
    background:#144620;
  }
  #notification-bar.green {
    color:#FFF;
    background:#28a745;
  }
  #notification-bar.red {
      color:#FFF;
      background:#FF0000;
  }

  #notification-bar.red #notification-timer {
      background:rgba(0,0,0,0.4);
  }

.login-frame {
    position:absolute;
    width:400px;
    padding:45px;
    box-sizing: border-box;
    left:50%;
    top:100px;
    margin-left:-200px;
    border-radius:10px;
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    text-align:center;
}
.login-frame img {
    margin-bottom:45px;
}

.edit-user_left,
.edit-user_right {
    display:inline-block;
    vertical-align:top;
    box-sizing: border-box;
}
.edit-user_left {
    width:250px;
    text-align:center;
    padding:45px 0;
}
.edit-user_right {
    width:calc(100% - 250px);
    padding:25px 25px 50px;
}

.info-object.delete {
    padding-top:45px;
}
.info-object.delete a {
    display:block;
    width:150px;
    font-size:12px;
    color:#FFF;
    background:#FF0000;
    padding:15px 0;
    text-align:center;
    border-radius:10px;
    transition:400ms;
}
.info-object.delete a:hover {
    background:#bd0000;
    transition:400ms;
}

#new-page .page-wrap {
    width:650px;
}
#new-page .page-wrap {
    padding:50px;
    background:#EEE;
}

.page-editor {
    position:relative;
    width:100%;
    padding:0;
    background:#FFF;
    overflow:hidden;
    margin-bottom:20px;
}
.ce-paragraph {
    font-size:20px;
    color:#444;
}
.ce-block__content,
.ce-toolbar__content {
    padding:7px 0;
    font-size:20px;
    max-width: unset!important;
    width:calc(100% - 100px)!important;
    margin:0 auto;
}
.component-title {
    position:relative;
    width:100%;
    background:#444;
    color:#FFF;
    font-size:12px;
    font-weight:900;
    padding:10px 50px;
}
.page-input input,
.page-input select {
    width:100%;
    padding:15px 50px;
    border:0;
    font-size:20px;

}
.page-input select {
    width:calc(100% - 50px);
    margin:7px 0 5px 22px;
    padding:15px 20px;
    border:1px #CCC solid;
}

#page-slug {
    display:none;
}
#page-slug.visible {
    display:block;
}
.page-input.slug-input span,
.page-input.slug-input input {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
}
.page-input.slug-input span {
    text-align:right;
    width:110px;
    font-size:20px;
    color:#222;
}
.page-input.slug-input input {
    width:calc(100% - 150px);
    padding-left:0;
}
/* --- Arrow Vectors --- */
.arrow {
    border: solid #6d6f71;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
}
 
.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
  
.left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}
  
.up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}
  
.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

#master-uploader {
    position:relative;
    width:calc(100% - 30px);
    min-height:350px;
    border:3px #CCC dashed;
    margin:0 15px 15px 15px;
    padding:30px;
    box-sizing: border-box;
}
#master-uploader:hover {
    border:3px #2196F3 dashed;
}

.dz-started .dz-message {
    display:none;
}

.dz-preview {
    display:block;
    width:100%;
    margin:5px auto;
    padding:10px;
    box-sizing: border-box;
    box-shadow:0 0 10px 0 rgba(0,0,0,0.09);
}
.dz-message {
    position:absolute;
    width:100%;
    text-align:center;
    font-size:12px;
    color:#999;
    left:0;
    top:50%;
    margin-top:-7px;
}

/* --- Dropzone --*/
.dropzone, .dropzone * {
    box-sizing: border-box;
  }
  
  .dropzone {
    position: relative;
  }
  .dropzone .dz-preview {
    position: relative;
    display: inline-block;
    width: 100%;
    margin: 0.5em;
  }
  .dropzone .dz-preview .dz-progress {
    display: inline-block;
    height: 15px;
    border: 1px solid #aaa;
  }
  .dropzone .dz-preview .dz-progress .dz-upload {
    display: block;
    width:0;
    height: 100%;
    background: green;
  }
  .dropzone .dz-preview .dz-error-message {
    color: red;
    display: none;
  }
  .dropzone .dz-preview.dz-error .dz-error-message, .dropzone .dz-preview.dz-error .dz-error-mark {
    display: block;
  }
  .dropzone .dz-preview.dz-success .dz-success-mark {
    display: block;
  }
  .dropzone .dz-preview .dz-error-mark, .dropzone .dz-preview .dz-success-mark {
    position: absolute;
    display: none;
    left: 30px;
    top: 30px;
    width: 54px;
    height: 58px;
    left: 50%;
    margin-left: -27px;
}
.dz-image,
.dz-progress,
.dz-details,
.dropzone a  {
    display:inline-block;
    width:20%;
    vertical-align: middle;
    box-sizing: border-box;
}
.dz-image {
    width:120px;
}
.dz-image {
    width:120px;
    height:120px;
    background:#CCC;
}
.dz-progress {
    width:70px;
    margin:0 15px;
}
.dz-details {
    width:calc(100% - 380px);
    font-size:14px;
    color:#444;
    box-sizing: border-box;
    padding-left:15px;
}
.dz-error-mark,
.dz-success-mark { 
    display:none!important; 
}
.dz-error-message {
    position:absolute;
    top:calc(50% - 22px);
    left:0;
    z-index:10;
    width:100%;
    padding:15px 0;
    font-size:12px;
    text-align:center;
    background: repeating-linear-gradient(45deg, rgba(0,0,0,0.5), rgba(0,0,0,0.5) 10px, #555 10px, #555 20px);
}
.dz-error-message span {
    color:#FFF;
    text-shadow:0 0 20px 20px rgba(0,0,0,0.8);
}
a.dz-remove {
    background:crimson;
    width:120px;
    margin-top:0;
}
.dz-complete a {
    display:none;
}
.dz-complete {
    border:1px green solid;
}

.directory-select .info-title,
.directory-select select {
    display:inline-block;
    vertical-align:middle;
    box-sizing: border-box;
}
.directory-select .info-title {
    width:150px;
    padding-left:15px;
    padding-top:10px;
}
.directory-select select {
    width:calc(100% - 165px);
}


/* --- Plus Vectors --- */
.plus {
    display:inline-block;
    width:50px;
    height:50px;

    margin-top:-15px;
    
    background:
      linear-gradient(#fff,#fff),
      linear-gradient(#fff,#fff),
      #000;
    background-position:center;
    background-size: 50% 2px,2px 50%; /*thickness = 2px, length = 50% (25px)*/
    background-repeat:no-repeat;
}
  
.alt {
    background:
      linear-gradient(#000,#000),
      linear-gradient(#000,#000);
    background-position:center;
    background-size: 30% 2px,2px 30%; /*thickness = 2px, length = 50% (25px)*/
    background-repeat:no-repeat;
}

/* -- Loader Vecors -- */
.lds-spinner {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
  }
  .lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: #444;
  }
  .lds-spinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
  }
  .lds-spinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
  }
  .lds-spinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
  }
  .lds-spinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
  }
  .lds-spinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
  }
  .lds-spinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
  }
  .lds-spinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
  }
  .lds-spinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
  }
  .lds-spinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
  }
  .lds-spinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
  }
  .lds-spinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
  }
  .lds-spinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
  }
  @keyframes lds-spinner {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  #table-save .lds-spinner {
    transform:scale(0.2);
}

  /* Editor Colours */
  .gjs-one-bg {
      background-color:#444!important;
  }
  .gjs-two-color {
      color:#FFF!important;
  }
  .gjs-four-color {
      color:#EEE!important;
  }
  .gjs-four-color-h:hover {
      color:#CCC!important;
  }
  .row,
  .cell {
      border:1px rgba(0,0,0,0.3) dotted!important;
  }
  .gjs-cv-canvas,
  .gjs-pn-commands {
      width:calc(100% - 200px)!important;
  }
  .gjs-pn-views-container,
  .gjs-pn-views {
      width:200px!important;
  }
  .gjs-pn-options {
      right:210px!important;
  }
  .gjs-pn-buttons {
      margin-left:35px!important;
  }
  .gjs-pn-buttons {
      margin-right:25px!important;
  }

  


  /* The switch - the box around the slider */
  .toggle-left,
  .toggle-right {
      display:inline-block;
      vertical-align:middle;
  }
  .toggle-left {
      padding-right:10px;
      font-size:12px;
      font-weight:900;
  }
  .toggle {
      float:right;
      width:200px;
  }
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #2196F3;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }

  .switch p,
  .switch .toggle {
      display:inline-block;
      vertical-align:middle;
  }


  .input-with-btn input,
.input-with-btn a {
    display:inline-block;
    vertical-align: middle;
    box-sizing: border-box;
}
.input-with-btn input,
.input-with-btn select {
    width:calc(100% - 115px);

}
.input-with-btn a {
    margin:0 0 0 15px;
}
.input-with-btn a.cancel {
    background:crimson;
}
.input-with-btn a.cancel:hover {
    background:#FF0000;
}
.directory-select {
    display:none;
}
.directory-select.visible {
    display:block;
}


@media only screen and (max-width: 1367px){
    .dashboard-wrap, .sims-wrap, .users-wrap {
        width:calc(100% - 150px);
    }
}

@media only screen and (max-width:1167px){
    .module {
        width:calc(50% - 30px);
    }
}

@media only screen and (max-width: 1003px){
    .info-slider {
        right:-370px;
    }
    .open-info {
        width:30px;
    }
    .plus {
        width:30px;
        height:30px;
    }
}

@media only screen and (max-width: 867px){
    .info-slider {
        background:transparent;
        box-shadow:none;
        top:110px;
    }
    .info-slider.open {
        background:#FFF;
        box-shadow: 0 0 15px 0px rgba(0,0,0,0.1);
    }
    .dashboard-wrap, .sims-wrap, .users-wrap {
        width:96%;
    }
    #user-frame {
        transform:scale(0.92);
        top:35px;
    }
}

@media only screen and (max-width:967px){
    .mobile-table .table-subrow,
    .mobile-table .table-subhead,
    .mobile-table .child-rows {
        width:800px;
    }
    .mobile-table .table-row {
        overflow:auto;
    }
}

@media only screen and (max-width: 667px){
    #twine,
    #twine-menu {
        display:none;
    }
    .module {
        width:calc(100% - 30px);
    }
    #download-sim {
        display:none;
    }
    .edit-user_left, .edit-user_right {
        width:100%;
        display:block;
        padding-top:0;
        padding-bottom:0;
    }
    .edit-user_left {
        padding-top:30px;
    }
    .edit-user_right {
        padding-bottom:30px;
        margin-top:-25px;
    }
    .table-title,
    .table-desc,
    .table-save,
    .long-desc .table-title {
        width:100%;
        text-align:center;
        padding:0;
        margin:0 0 7px;
        border:none;
        box-sizing: border-box;
    }
    .table-save {
        display:block;
        box-sizing:border-box;
    }
    .table-save-left,
    .table-save-right {
        width:50%;
        box-sizing: border-box;
        padding:7px 15px;
        margin-top:15px;
    }
    .table-save-left {
        text-align:left;
    }
    .table-save-right {
        text-align:right;
        padding-right:30px;
    }
    .toggle {
        width:100%;
    }
}