﻿@-webkit-viewport   { width: device-width; }
@-moz-viewport      { width: device-width; }
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }

.cinchyHeader {
    padding: 10px 10px 0 10px;
    background: white;
    z-index: 9999;
    position: fixed;
    top: 0;
    left: 0;
    height: 80px;
    width: 100%;
}

#collapseHeader {  
    text-decoration: none;
    color: #ddd;  
    width: 100%;
    text-align: center;
    margin: 0 0 20px 0;
    -webkit-box-shadow: 0px 7px 15px -6px rgba(150,150,150,1);
    -moz-box-shadow: 0px 7px 15px -6px rgba(150,150,150,1);
    box-shadow: 0px 7px 15px -6px rgba(150,150,150,1);    
    -webkit-transition: background-color 1s ease-out;
    transition: background-color 1s ease-out;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background: white;
}

#collapseHeaderContainer {
    cursor: pointer;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1002;
}

.cinchyHeader.collapse.in + #collapseHeaderContainer > #collapseHeader {
    top: 80px;
}

#collapseHeader:hover {
    color: rgb(116,142,180);
    background: rgb(186, 199, 218);
}

.container-fluid {
    padding: 22px 0;
}

.container-fluid.uncollapsed {
    margin-top: 148px;
}

.container-fluid.uncollapsed.main-screen {
    margin-top: 120px;
}

#cinchyHeader div.screenContainer div.screenName .dropdown-toggle .title,
#cinchyHeader div.screenContainer div.screenName .dropdown-toggle .title.history-icon {
    transition: color 200ms ease-in !important;
    -webkit-transition: color 200ms ease-in !important;
    -moz-transition: color 200ms ease-in !important;
    -o-transition: color 200ms ease-in !important;
    -ms-transition: color 200ms ease-in !important;
}

#cinchyHeader div.screenContainer div.screenName .dropdown-toggle:hover .title {
    color: #555;
}

ul.nav.nav-tabs.tab-nav li a span.title {
    font-size:13px !important;
}

ul.nav.nav-tabs.tab-nav li a span.icon {
    font-size:13px !important;
}

.container-fluid {
    margin-top: 72px;
    -moz-transition: margin 200ms ease-in;    
    -webkit-transition: margin 200ms ease-in;
    -o-transition: margin 200ms ease-in;
    transition: margin 200ms ease-in;
}

.container-fluid.main-screen {
    margin-top: 30px;
}

.icon-large {
    font-size: 55px !important;
}

.cinchyHeader .companyLogo {
    background-image: url("../images/cinchy_logo.png");
    background-size:cover;        
    height: 70px;
    width: 170px;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    transition: opacity 0.2s;
}

.cinchyHeader .companyLogo:hover {
    opacity: 0.65;
}

.cinchyHeader .homeIcon {
    display: inline-block;
    vertical-align: middle;
    margin: 0 5px;
    height: 68px;
}

.cinchyHeader .homeIcon .homeIconLink {
    font-size: 45px;
    text-decoration: none;
}

    .cinchyHeader .homeIcon .prompt {
        position: relative;
        height: 0;
        opacity: 0;
        top: -15px;
        transition: top 200ms ease, opacity 200ms ease;
        text-align: center;
        font-size: 10px;
    }

    .companyLogo:hover {
        text-decoration: none !important;
        color: white;
    }

    /*
    .cinchyHeader .companyLogo:hover + .prompt {
        top: -10px;
        opacity: 1;
    }*/

    .cinchyHeader .companyLogo:hover + .homeIcon .cinchyIcon {
        color: rgb(116,142,180) !important;
    }

.cinchyHeader > .screenContainer {
    display: inline-block;
}

.cinchyHeader .screenContainer .screenName {
    font-size: 38px;
    font-family: 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: darkgrey;
    margin: 0 0 0 2px;
    display: inline-block;
    vertical-align: middle;    
    letter-spacing: -3px;    
}

.cinchyHeader .screenMenu .screenName .screenNameIcon {
    font-size: 32px;
    vertical-align: middle;
    margin-top: -2px;
}

.cinchyHeader .submenu {
    display: inline-block;
}

.userPhoto {
    cursor: pointer;
}

.cinchyHeader .userInfo {
    cursor: pointer;
    margin-bottom: 6px !important; /* Temporary alignment fix. */
}

.cinchyHeader .rightBar {
    height: 40px;
    min-width: 120px;
    padding: 15px 0;
    margin-right: 8px;
}

.cinchyHeader .rightBar .rightBarItems {
    display: inline-block;    
    vertical-align: middle;
    margin: 0 2px;
}

.cinchyHeader .rightBar .rightBarIcon {
    height: 40px;
}

.cinchyHeader .rightBar .cinchyIcon {
    font-size: 30px;
}

.cinchyIcon {
    color: rgb(186,199,218);
    -webkit-transition: color 500ms ease-out;
    transition: color 500ms ease-out;
}

.cinchyIcon:hover {
    color: rgb(116,142,180);
}

a.cinchyIcon {
    text-decoration: none;
}

.cinchyHeader .alertCountContainer {
    position: absolute;
    top: -5px;
    right: -5px;
    background: rgb(116,142,180);
    font-size: 12px;
    width: 16px;
    height: 16px;
    color: white;    
    text-align: center;        
    display: block;
    border-radius: 50%;
}

.cinchyHeader .alertCount {
    vertical-align: middle;
    display: block;
}

#icon-clock {
    border: 2px solid rgb(186,199,218);
    border-radius: 50%;
    cursor: hand; /* Firefox */
    cursor: pointer;
    -webkit-transition: border-color 500ms ease-out;
    transition: border-color 500ms ease-out;
}

#icon-clock:hover {
    border-color: rgb(128,216,168);
}

.cinchyHeader .rightBar .userPhoto {
    background-image: url("../images/avatar.png"); 
    background-size:cover;
    margin: 0px auto 0px auto;
    height: 36px;
    width: 36px;
    border: 2px solid #666666;
    border-radius: 50%;    
}

/*.cinchyHeader .rightBar*/ .search input {
    font-family: 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 16px;
    /*color: #555860;*/
    color: rgb(116,142,180);
    height: 30px;    
    width: 300px;
    display: inline;
    padding: 0 12px 0 25px;
    background: white url("../images/magnifying_glass.png") 4px 5px no-repeat;
    background-size: 16px;
    border-width: 1px;
    border-style: solid;
    /*border-color: #a8acbc #babdcc #c0c3d2;*/
    border-color: white;
    border-radius: 1px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: inset 0 0px #e5e7ed, 0 0px 0 #fcfcfc;
    -moz-box-shadow: inset 0 0px #e5e7ed, 0 0px 0 #fcfcfc;
    -ms-box-shadow: inset 0 0px #e5e7ed, 0 0px 0 #fcfcfc;
    -o-box-shadow: inset 0 0px #e5e7ed, 0 0px 0 #fcfcfc;
    box-shadow: inset 0 0px #e5e7ed, 0 0px 0 #fcfcfc;
}

/*.cinchyHeader .rightBar*/ .search input:focus {
    outline: none;
    /*border-color: #66b1ee;*/
    border-color: white;
    -webkit-box-shadow: 0 0 0px rgba(85, 168, 236, 0.9);
    -moz-box-shadow: 0 0 0px rgba(85, 168, 236, 0.9);
    -ms-box-shadow: 0 0 0px rgba(85, 168, 236, 0.9);
    -o-box-shadow: 0 0 0px rgba(85, 168, 236, 0.9);
    box-shadow: 0 0 0px rgba(85, 168, 236, 0.9);
}

/*.cinchyHeader .rightBar*/ .search input::-webkit-input-placeholder {
   color: rgb(116,142,180);
}

/*.cinchyHeader .rightBar*/ .search input:-moz-placeholder { /* Firefox 18- */
   color: rgb(116,142,180);  
}

/*.cinchyHeader .rightBar*/ .search input::-moz-placeholder {  /* Firefox 19+ */
   color: rgb(116,142,180);  
}

/*.cinchyHeader .rightBar*/ .search input:-ms-input-placeholder {  
   color: rgb(116,142,180);  
}

.cinchyHeader .rightBar .rightBarIcons {
    margin: 5px 0px 0px 0px;
    padding: 0px 5px 0px 5px;
    font-size: 11px;
}

.cinchyHeader .rightBar .rightBarIcons .fullScreen {
    float: left;
    width: 33%;
}

.cinchyHeader .rightBar .rightBarIcons .presentTime {
    float: right;
    width: 33%;
    text-align: right;
}

.cinchyHeader .rightBar .rightBarIcons .alerts {
    display: inline-block;
    width: 33%;
    text-align: center;
}

.cinchyHeader .rightBar .alertIcon {
    cursor: pointer;
    font-size: 36px;
}

.cinchyHeader .rightBar .rightBarIcons .fullScreen .fullScreenLink,
.cinchyHeader .rightBar .rightBarIcons .presentTime .presentTimeLink,
.cinchyHeader .rightBar .rightBarIcons .alerts .alertsLink {
    text-decoration: none;
    color: #AAAAAA;
}

#action-navigation {
    padding: 0 0 15px 5px; 
    margin: 0 0 2px 0;
}

#action-navigation > div > a {
    margin-right: 15px;
    font-size: 13px;
}

#action-navigation a {
    color: grey;
    -webkit-transition: color 0.2s ease-out; /* Safari */
    transition: color 0.2s ease-out;
    text-decoration: none;
    font-size: 13px;
}

#action-navigation a > .fa {
    -webkit-transition: color 0.2s ease-out; /* Safari */
    transition: color 0.2s ease-out;
}

#action-navigation a:hover {
    color: #111;
}

#action-navigation > div {
    display: inline-block;
    vertical-align: middle;
}

#action-navigation > div.border-right {
    padding-left: 20px;
}

.spinner {
    -webkit-animation: spin 1s ease both;
    -moz-animation: spin 1s ease both;
    animation: spin 1s ease both;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}

@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}

@keyframes flash-red {
    0% { color: rgb(186, 199, 218); }
    50% { color: rgb(255, 100, 100); }
    100% { color: rgb(186, 199, 218); }
}

@-moz-keyframes flash-red {
    0% { color: rgb(186, 199, 218); }
    50% { color: rgb(255, 100, 100); }
    100% { color: rgb(186, 199, 218); }
}

@-webkit-keyframes flash-red {
    0% { color: rgb(186, 199, 218); }
    50% { color: rgb(255, 100, 100); }
    100% { color: rgb(186, 199, 218); }
}

.cinchyHeader .flashingRed {
    -webkit-animation: flash-red 5s infinite;
    -moz-animation: flash-red 5s infinite;
    animation: flash-red 5s infinite;
}

#collapseHeader::after {
    font-family: "Glyphicons Halflings";
    content: "\e113";
}

.collapse-icon #collapseHeader::after, .hovered #collapseHeader::after {
    content: "\e114";
}


.submenu-anchor {    
    width: 100%;
}

.submenu-view {
    width:85%;
    padding-right: 0 !important;
    display: inline-block !important;
    vertical-align: middle;
}

.submenu-view-options {
    text-align: right;
    padding: 4px !important;
    display: inline-block !important;
    margin: 0 !important;
    -webkit-transition: background-color 1s ease-out;
    transition: background-color 1s ease-out;    
}

.submenu-options:hover {
    background-color: #ccd;
}

.dropdown-menu>li
{	position:relative;
	-webkit-user-select: none; /* Chrome/Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+ */
	/* Rules below not implemented in browsers yet */
	-o-user-select: none;
	user-select: none;
	cursor:pointer;
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    display:none;
    margin-top: -1px;
	border-top-left-radius:0;
	border-bottom-left-radius:0;
	border-left-color:#fff;
}

.right-caret:after
 {	content:"";
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    border-left: 4px solid orange;
    display: inline-block;
    height: 0;
    opacity: 0.8;
    vertical-align: middle;
    width: 0;
	margin-left:5px;
}

.left-caret:after
{	content:"";
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    border-right: 4px solid orange;
    display: inline-block;
    height: 0;
    opacity: 0.8;
    vertical-align: middle;
    width: 0;
	margin-left:5px;
}

#table-container {
    margin: 10px;
}

#globe-container {
    height: 100%;
    min-height: 800px;
}

.flix-row {
  overflow-x: scroll;
  overflow-y: visible;
  width: 100%;
  padding: 40px;
}

.row__inner {
  -webkit-transition: 450ms -webkit-transform;
          transition: 450ms transform;
  font-size: 0;
  white-space: nowrap;
  /*margin: 70.3125px 0;*/
  margin: 10px 0;
  padding-bottom: 50px;
}
.tile {
    background-color: whitesmoke;
    position: relative;
    display: inline-block;
    width: 250px;
    height: 140.625px;
    margin-right: 10px;
    font-size: 20px;
    cursor: pointer;
    -webkit-transition: 450ms all;
            transition: 450ms all;
    -webkit-transform-origin: center left;
        -ms-transform-origin: center left;
            transform-origin: center left;
}
.tile__img {
  width: 250px;
  height: 140.625px;
  -o-object-fit: cover;
     object-fit: cover;
}
.tile__details {
    color: white;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  font-size: 10px;
  opacity: 0;
  background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
  -webkit-transition: 450ms opacity;
          transition: 450ms opacity;
}
.tile__details:after,
.tile__details:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  display: #000;
}

.tile:hover .tile__details {
  opacity: 1;
}
.tile__title {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 10px;
  text-align: left;
}
.row__inner:hover {
  -webkit-transform: translate3d(-125px, 0, 0);
          transform: translate3d(-125px, 0, 0);
}
.row__inner:hover .tile {
  opacity: 0.3;
}
.row__inner:hover .tile:hover {
  -webkit-transform: scale(2);
      -ms-transform: scale(2);
          transform: scale(2);
  opacity: 1;
}
.tile:hover ~ .tile {
  -webkit-transform: translate3d(250px, 0, 0);
          transform: translate3d(250px, 0, 0);
}

#table-container {
    margin: 10px;
}

.form-submenu form {
    width: 200px;
    margin: 0 5px;
}

.form-submenu label {
    display:block;
    font-size: 10px;
    margin: 5px 0 0 0;
}

.form-submenu {
    display: inline-block;
    margin-right: 10px;
}

.form-submenu .fill {
    width: 100%;
}

.form-cluster {
    padding: 20px;
    border-top: 1px solid lightgrey;
    border-bottom: 1px solid lightgrey;
}

.form-cluster h2 {
    margin-top: 0px;
}

.form-functions {
    border-top: 1px solid rgb(186,199,218);
}

.tab-nav {
    margin: 0 0 20px 0;
}

.tab-target {
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: opacity 200ms ease-in;
}

.tab-target.active {
    height: auto;
    opacity: 1;
    overflow: visible;
}

.form-group label {
    display: block;
}

.default-columns .item {
    margin: 5px 0;
}

.form-footer {
    margin: 30px 0;
}

.template {
    display:none;
}

.column-list .item .form-group input:-ms-input-placeholder,
.column-list .item .form-group input::-webkit-input-placeholder {
    color: lightgray;
}

.column-submenu .form-group {
    margin-bottom: 8px;
    margin-top: 5px;
}

.column-submenu .form-group label {
    margin-bottom: 2px;
    font-size: 12px;
    letter-spacing: -0.01em;
}

.column-submenu h2 {
    margin-top: 0;
}

/*
.column-submenu {    
    height: 0px;
    overflow: hidden;
    transition: height 200ms ease-out;
}

.column-submenu.active {    
    height: auto;    
}
*/

.submenu.dropdown {
    border: none;
    outline: none;
    font-size: 13px;
    background: none;
    color: grey;
}

.submenu.dropdown button {
    background: none;
    border: none;
    outline: none;
}

.submenu .dropdown-menu {
    min-width: 200px;
}

.submenu .dropdown-menu li a {
    vertical-align: middle;
}

.icon-dropdown {
    text-align: center;
    padding-top: 0 !important;
}

.icon-button {
    display: none;
}

.icon-button + label {
    padding: 5px;
    margin: 5px;
    width: 30px;
    text-align: center;
    cursor: pointer;
}

.icon-button:checked + label {
    background: lightgray;
}

.apply-control {
    margin: 10px 20px;
    display: block !important;
}

.apply-control input {
    width: 100%;
}

.tab-nav a {
    color:rgb(116,142,180);
}

.padded-item {
    padding: 3px 20px;
}

#column-list, #sort-list {
    margin: 3px 20px;
    height: 670px;
}

#sort-list .item {
    height: 35px;
    width: 180px;
    float: left;
    background-color: whitesmoke;
    overflow: auto;
    cursor: move;
}

#column-list .item  {
    padding: 5px;
    height: 35px;
    width: 180px;
    float: left;
    background-color: whitesmoke;
    overflow: auto;
    cursor: move;
}

#sort-list {
    width: 350px;
}

#sort-list .item {
    width: 300px;
}

.sort-label{
    display: inline-block;
}

.sort-input{
    display:inline-block;
}

#view-form {
    display: inline-block;
    vertical-align: middle;
}

.typeahead.dropdown-menu a {
    color: white !important;
}

.typeahead.dropdown-menu a:hover {
    color: lightgray !important;
}

.dropdown-menu.wide {    
    max-height: 670px;
    overflow: auto;
}

.dropdown-menu.wide li {
    display: inline-block;
}

#table-container {
    margin-bottom: 120px;
}

#table-container input[type=checkbox] {

}

#table-name-error {
    display: inline-block;
    margin-top: 5px;
    color: maroon;
}

#action-navigation .rest-prompt {
    color: rgb(116,142,180);
}

#alerts {
    transition: height 100ms ease-in;
}

.form-footer {
    margin-bottom: 10px !important;
}

.fixed-container {
    position: fixed;
    width: 100%;
    height: 100px;
    display: block;    
    top: 0;
    left: 0;
    background: white;
    z-index: 9999;
}

.unfixed-container {
    margin-top: 100px;
    transition: margin 100ms ease-in;
}

.unfixed-container.fullscreen {
    margin-top: 20px;
    transition: margin 100ms ease-in;
}

.title-icon {
    font-size: 35px !important;
    vertical-align: middle;    
    margin-right: 5px;    
    margin-bottom: 5px;
    opacity: 0.5;
    width: 35px;
    max-width: 35px;
    text-align: right;
}

.title-icon.no-margin {
    margin-bottom: 0 !important;
}

@keyframes fade {
    from { opacity: 1; }
    to { opacity: 0; }
}

@-moz-keyframes fade {
    from { opacity: 1; }
    to { opacity: 0; }
}

@-webkit-keyframes fade {
    from { opacity: 1; }
    to { opacity: 0; }
}

.activated {
    animation: fade 10s ease-out;
    -moz-animation: fade 10s ease-out;
    -webkit-animation: fade 10s ease-out;
}

#view-column-list, #view-group-list, #view-order-list, #view-total-list {
    width: 300px;
}

.columnDiv .column-select {
    padding: 0 !important;
    margin: 0 !important;
}

.view-form{    
    width: 500px;
    text-align: left;
}

.filter-dropdown-menu {
    width: 350px;
}

.ui-autocomplete {
    z-index: 9999 !important;
}

.small * {
    font-size: 85%;
}

/* Stack */

.column-list {
    border-radius: 25px 25px 0 0;
    border: 2px solid whitesmoke;
    max-width: 480px;
    width: 100%;
    background: whitesmoke;
    overflow: hidden;
}

.column-list .item {
    width:100%;
    padding: 0 16px;
    border-radius: 25px 25px 0 0;
    border-top: 1px solid darkgrey;
    -webkit-box-shadow: 0px -3px 3px 0px rgba(240,240,240,0.5);
    -moz-box-shadow: 0px -3px 3px 0px rgba(240,240,240,0.5);
    box-shadow: 0px -3px 3px 0px rgba(240,240,240,0.5);
    transition: background 1000ms ease;
    background: whitesmoke;
}

#view-column-list, #view-group-list, #view-total-list, #view-order-list {
    border-radius: 25px 25px 0 0;
    /*border: 1px solid lightgrey;*/
    max-width: 600px;
    width: 100%;
}

.columnDiv {
    width:100%;
    padding: 5px 10px;    
    border-top: 1px solid darkgrey;
    
    /*
    border-radius: 25px 25px 0 0;
    -webkit-box-shadow: 0px -3px 3px 0px rgba(200,200,200,0.5);
    -moz-box-shadow: 0px -3px 3px 0px rgba(200,200,200,0.5);
    box-shadow: 0px -3px 3px 0px rgba(200,200,200,0.5);
    */
    background: white;
    max-height: 45px;
}

.columnDiv.is-pointer-down {
    z-index: 999;
}

.columnDiv .colNameDD {
    color: darkgrey;
    cursor: pointer;
    width: 85%;    
    display: inline-block;
    border: none;
    box-shadow: none;
    outline: none;
    font-size: 18px;
    padding: 0px;
}

#view-total-list .columnDiv .colNameDD, #view-order-list .columnDiv .colNameDD {
    width: 55%;
}

#view-total-list .columnDiv .aggregateOp, #view-order-list .columnDiv .sortDir  {
    width: 25%;
    display: inline-block;
}

.btnDeleteColumn {
    float:right;
    background: none;
    border: none;
    padding: 0 0 0 0;
    color: lightgrey;
    font-size: 18px !important;
    outline: none;
}

.column-list .item.is-pointer-down {
    border-bottom: none;
    max-height: 480px;
    z-index: 992 !important;
    background: white;
}

.column-list .item input.form-control {
    max-height: 34px;
}

.column-list .item textarea.form-control {
    min-height: 62px;
    resize: none;
}

.column-list .item.expanded {  
    z-index: 990;
    background: gainsboro;
    box-shadow: 0px 30px 5px 0px gainsboro;
    /*-webkit-box-shadow: 0px 42px 5px 0px rgba(245,245,245,1);
    -moz-box-shadow: 0px 42px 5px 0px rgba(245,245,245,1);    
    (background: -moz-linear-gradient(top,  rgba(191,191,191,0.15) 80%, white 100%); 
    background: -webkit-linear-gradient(top,  rgba(191,191,191,0.15) 80%,white 100%); 
    background: linear-gradient(to bottom,  rgba(191,191,191,0.15) 80%, white 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6bfbfbf', endColorstr='#00bfbfbf',GradientType=0 ); */
}

.column-list .item.expanded ~ .item {
    z-index: 991;
}  

.column-list .item .delete-button {
    float:right;
    background: none;
    border: none;
    padding: 0 0 0 0;
    margin-top: 9px;
}

.column-list .item .delete-button .icon {
    color: tomato;
    opacity: 0.5;
    font-size: 15px;
}

.column-list .column-name {
    font-size: 18px;
    height: 22px;
    line-height:22px;
    margin-top: 8px;
    margin-bottom: 2px;
    border: none;
    border-bottom: 1px solid transparent;
    outline: none;
    background: none;
}

.delete-button .fa {
    transition: opacity 200ms ease-out;
}

.delete-button:hover .fa {
    opacity: 1 !important;
}

.btnDeleteColumn .glyphicon {
    color: tomato;
    opacity: 0.5;
    transition: opacity 100ms ease;
}

.btnDeleteColumn:hover .glyphicon {
    opacity: 1;
}

#icon-color {
    margin-top: 2px;
    width: 100px;
}

.modal-open .modal {
    z-index: 9999 !important;
    background: rgba(0,0,0,0.8);
}

table.versions th {
    text-align: center;
    padding: 5px;
    color: dimgrey;
}

table.versions td {
    padding: 5px;
    min-width: 80px;
    border-bottom: 1px solid lightgrey;    
    text-align: center;
}

table.versions td.revertible {
    color: black;
    cursor: pointer;
    cursor: hand;
    transition: background 200ms ease-in;
}

table.versions tr.latest-version {
    background: whitesmoke;
}

table.versions tr.latest-version td {
    color: black;        
}

table.versions td.revertible:hover {
    background: whitesmoke;
}

table.versions .version-column-list {
    text-align: left;
    -webkit-padding-start: 15px;
    margin-bottom: 0;
}

.modal-body .item .fa {
    font-size: 40px;
}

.sort-label {
    line-height: 35px;
    margin-left: 5px;
}

.sort-input label {
    cursor: pointer;
    padding: 5px;
    font-size: 15px;
    margin: 2px 0;
    transition: background 500ms ease;
}

.sort-input label:hover {
    background: gainsboro;
}

.sort-input input:checked + label {
    background: gainsboro;
}

.sort-input input:checked + label:hover {
    background: darkgray;
}

.icon-dropdown {
    
}

.icon-dropdown .icon-search-bar {
    text-align: left;
    width: 100% !important;
}

.icon-container {    
    overflow-y: scroll;
    max-height: 255px;
    min-height: 255px;
    text-align: left;
}

.move-handle.fa {
    font-size: 15px !important;
    cursor: ns-resize;
    color: grey;
    margin-top: 11px;
    margin-right: 18px;
    float: right;    
}

.settings-icon {
    font-size: 40px !important;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 200ms ease;
    color: rgb(116,142,180);    
    margin-bottom: 8px !important;
    transition: color 200ms;
    text-decoration: none !important;
}

.settings-icon:hover {
    opacity: 1;    
}

.launcher-action-bar div {
    vertical-align: middle;
}

#launcher-search-bar-container #launcher-search-icon {
    opacity: 0.5;
    transition: opacity 200ms ease;
}

#launcher-search-bar-container:hover #launcher-search-icon {
    opacity: 1;
}

#launcher-search-icon {
    vertical-align: middle;
    color: cadetblue;
    font-size: 20px;
}

#launcher-search-bar {
    color: rgb(116,142,180) !important;
    border: none;
    margin: 0 0 0 5px;
    vertical-align: middle;
    outline: none;
    font-size: 20px;
    width: 150px;
}

#launcher-search-bar::-webkit-input-placeholder {
    color: rgb(163,177,199) !important;
}

.hover-icon {
    font-size: 20px !important;
}

.faded {
    opacity: 0.60;
    transition: opacity 500ms ease;
    -webkit-transition: opacity 500ms ease;
}

.faded:hover {
    opacity: 1;
}

.delete-x:hover {
    color: indianred;
}

.add-x:hover {
    color: #00B050;
}

.nav-tabs > li {
    font-size: 15px !important;
}

.nav-tabs > li a {
    color: rgb(88,119,165);
}

.icon-sub-container {
    width: 150px;
    padding-top: 8px;
    margin-left: 65px;
}

.color-selector {
    position: absolute;
    top: 50px;
    left: 17px;
    height: 300px;
}

.color-select {
    height: 29px;
    width: 29px;
    margin: 0;
    display: block;
    cursor: pointer;
}

.color-select-input:checked + label {
    opacity: 1;    
}

.icon-select {
    transition: background 100ms ease;
}

.icon-select:hover {
    background: lightgrey;
}

ul.tab-nav {
    height: 100%;
    width: 50px;
    left: 0;
    position: fixed;
    background: #f0f0f0;
    transition: top 200ms ease-in;
    z-index: 1002;
}

ul.tab-nav.collapsed {
    top: 54px;
}

.tab-nav li {
    height: 50px !important;    
}

.tab-nav li.active {
    box-shadow: -5px 0px 5px 0px rgba(0,0,0,0.25);
    -webkit-box-shadow: -5px 0px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: -5px 0px 5px 0px rgba(0,0,0,0.25);
    box-shadow: -5px 0px 5px 0px rgba(0,0,0,0.25);
    z-index: 666;
}

.tab-nav li.active a {
    color: #555 !important;    
}

.tab-nav li a {
    border-radius: 0;
    color: grey !important;
    width: 155px !important;
    height: 50px !important;
    background: #f0f0f0;
    transition: width 100ms ease; 
    text-indent: 0;  
    border: none !important;
}


    .tab-nav li:hover a {
        color: grey !important;
    }

    .tab-nav li a .title {
        opacity: 0;
        transition: opacity 0.2s;
    }

    .tab-nav.expanded li a .title {
        opacity: 1;
    }

.tab-nav li {
    display: block !important;
    overflow: hidden;
    width: 50px;
}

.tab-nav.expanded li {
    width: 125px !important;
}

.tab-nav li.action a {
    background: #888;    
}

    .tab-nav li.action a .title, .tab-nav li.action a .icon  {
        color: white;
    }

.tab-nav li a .icon {
    min-width: 18px;
    text-align: center;
}

#main-form {
    margin-left: 60px;
    transition: margin 100ms ease;
}

#main-form.expanded {
    margin-left: 135px;
}

.tab-nav.expanded {
    width: 125px !important;
}

.column-name {
    border-bottom: 1px solid white;
}

.column-name.editing {
    border-bottom: 1px solid lightgrey;
}

.main-tab.nav-tabs li {
    border: none;
    background: #f0f0f0;
}

    .main-tab.nav-tabs li a {
        border: none !important;
        color: grey;        
    }

.main-tab {
    margin-bottom: 10px;
    left: -15px;
    height:39px;
    border: none;
    background: #f0f0f0;
    left: 0;
    width: 100%;
    position: fixed;
    overflow: hidden;
    transition: top 200ms ease-in;
    z-index: 1001 !important;
}

.main-tab.nav-tabs li.active {
    background: white;
    height: 45px;
    -webkit-box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.05);
    box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.05);
    cursor: pointer;
}


    .main-tab.nav-tabs li:hover a {
        color: #999;
    }

    .main-tab.nav-tabs li.active a {
        color: #555;
        cursor: pointer;
    }

    .main-tab.nav-tabs li.ultra-active {
        background: #888;
    }

    .main-tab.nav-tabs li.ultra-active:hover {
        background: #555;
    }

    .main-tab.nav-tabs li.ultra-active:hover a {
        background: none !important;
    }

    .main-tab.nav-tabs li.ultra-active a {
        color: white;
    }

    .main-tab.nav-tabs li.ultra-active .fa {
        color: white;
    }


.main-tab.shifted.expanded {
    margin-left: 220px;
}

.main-tab .fa.disabled, .main-tab .fa.disabled + .title {
    color: lightgrey;
    cursor: default;
}

.marketplace-link:hover {
    text-decoration: none;
    color: #555;
}

.cinchy-tooltip.tooltip {
    font-size: 72px !important;
}

.lookup-table-name {
    color: silver;
    font-size: 13px;
    font-weight: normal;
    letter-spacing: -0.05em;
}

.submenu.dropdown {
    display: inline-block;
}

.submenu.dropdown button.dropdown-selector {
    border: none;
    vertical-align: middle;    
    letter-spacing: -0.03em;
    min-width: 100px;
    text-align: left;
}

.dropdown-header {
    margin: 0;
    letter-spacing: -0.03em;
    padding: 0;
    line-height: 0;
    font-size: 10px;
    text-align: left;
    color: #BBB;
}

.titular-message {
    margin: 20px;
    width: 200px;
}

.titular-message .icon {
    font-size: 172px;
    color: lightgrey;
}

.titular-message .message {    
    color: lightgrey;
    text-align: center;
}

/*
#action-navigation.fixed {
    left: 0;
    position: fixed;
}

#action-navigation.fixed ~ #table-container {
    top: 35px;
}
    */

.application-icon {
    margin-top: 2px;
    font-size: 35px !important;
}

.btn.btn-default.active.toggle-off {
    margin: 0;
}

.dropdown-label {
    display: inline;
}

.column-list .item .button-row .form-group {
    min-height: 33px;
    margin-top: 15px;
    margin-right: 2px;
}

.button-row {    
    display: inline-block;
    max-height: 66px;
}

.dropdown-selector > .htAutocompleteArrow {
    position: absolute;
    right: 0;
    top: 2px;
    color: #CCC;
}

.submenu-view .subview-title {
    line-height: 30px;
}

.submenu-view  .subview-container {
    position: relative;
    top: -7px;
}

.cinchy-welcome {
    color: #888;
    letter-spacing: -0.05em;
    margin-bottom: 20px;
}

.cinchy-welcome h1 {
    margin-top: 0;
    margin-bottom: 3px;
}

.big-panels {
    margin-top: 1%;
    width: 100%;
    text-align: center;
}

.big-panels .big-icon:first-child {
    margin-right: 25px;
}

.big-icon {    
    cursor: pointer;
    text-align: center;
    min-height: 400px;
    width: 45%;
    display: inline-block;
    padding: 140px 10px;    
    transition: background 0.8s;
    vertical-align: text-top;
    text-decoration: none;
    transition: background 0.2s;
    background: #f3f3f3;
}

.big-icon:hover {
    text-decoration: none;
    
}

.big-icon .icon {
    font-size: 220px;
    opacity: 0.65;
    transition: opacity 0.8s, transform 0.8s;
    text-decoration: none;
}

.big-icon:hover .icon {
    transform: scale(1.2,1.2);
    opacity: 1;   
}

.big-icon:active {
    text-decoration: none;
}

.big-icon h2 {
    color: #888;
    margin-bottom: 3px;
    letter-spacing: -0.05em;
    transition: color 0.8s, letter-spacing 0.8s;
}

.big-icon:hover h2 {
    color: #333;    
    letter-spacing: 0;
}

.big-icon p {    
    color: #888;
    letter-spacing: -0.05em;
}

.item.max:hover .uninstall-icon {
    height: 14px;
}

.uninstall-icon {
    position: absolute;
    top: 5px;
    right: 5px;
    color: indianred;
    cursor: pointer;
    height: 0;
    overflow: hidden;
    transition: height 0.2s;
}

.uninstall-icon.disabled {    
    color: lightgrey;
    cursor: unset;
}

.screenName a {
    color: grey;
    text-decoration: none;
}

.expandable .icon {
    font-size: 25px;
    text-indent: 2px;
}

.marketplace-form-group::after{
    display:block !important;
}

.description-form-group {
    margin-top: 10px;
    display: block !important;
}

.has-changed.text {
    color: red;
    text-decoration: line-through;
}

.new-change.text {    
    color: blue;
}

.identical.new-change div span.text {    
    color: lightblue;
}

.revertible.new-change.has-changed div span.text {
    color: forestgreen;
}

.identical.new-change.has-changed div span.text {
    color: lightgreen;
}

.revertible.has-changed div span.text {
    color: red;
}

.identical.has-changed div span.text {
    color: lightpink;
}

.node {
    text-align: center;
    overflow: hidden;    
}

.node span {
    text-align: center;   
    margin: 5px;
    padding: 5px;
    display: inline-block;
}

.node .children {
    border-top: 2px solid #ddd;    
}

.children .node {    
    display: inline-block;
    vertical-align: top;
    margin: 0 15px;
}

.form-control.multiselect-search {
    width: 100% !important;
    padding: 0 0 0 5px !important;
}

td:hover .htCustomAutocompleteArrow {
    opacity: 1;
}

.htCustomAutocompleteArrow {
    opacity: 0;
}

.recent-items .icon {
    opacity: 0.6;
}

#lnk #link-columns input.isSelected {
    display: inline-block;
    width: 20px !important;
    min-width: 0 !important;
}

.displayColumnName {
    display: inline-block;
}

.set-width-cell {
    width: 100px;
    max-width: 100px;
    min-height: 1em;
    line-height: 1em;
    overflow: hidden;    
    display: inline-block;
    vertical-align: middle;
    padding: 0 5px;
}

.set-width-cell b {
    font-size: 0.8em;
}

.search-display-item {
    border-top: 1px solid gray;
    width: 90%;
    background: white;
    cursor:n-resize;
}

.search-display-item .move-column,
.search-display-item .delete-column {
    margin-top: 5px;
    margin-right: 5px;
    float: right;
}

.search-display-item .delete-column:hover {
    color: indianred;
    cursor: pointer;
}

#table-container > div.btn-group.open > ul > li.multiselect-item.filter > div > input {
    padding: 0 0 0 10px;
}

#table-container > div.btn-group.open > ul > li.multiselect-item.filter > div > input {
    width: 99% !important;
}

.dropdown-menu .active {
  color: #fff;
  text-decoration: none;
  background-color: #337ab7;
  outline: 0;
}

.dropdown-menu .active a {
  color: #fff;
  text-decoration: none;
  background-color: #337ab7;
  outline: 0;
}

.dropdown-menu .active a label:hover {
  color: #fff;
  text-decoration: none;
  background-color: #236aa7;
  outline: 0;
}

.dropdown-menu a label:hover {
  text-decoration: none;
  background-color: gainsboro;
  outline: 0;
}

label.checkbox .set-width-cell, label.radio .set-width-cell {
    color: black;
}

.active label.checkbox .set-width-cell, .active label.radio .set-width-cell {
    color: white;
}

.icon-cinchy::before {
    position: relative;
    display: inline-block;    
    left: -0.5em;
}

.multiselect-breadth {
    padding: 0;
}

.multiselect-breadth .input-group {
    overflow: hidden;
}

.multiselect-breadth .input-group:hover {
    background: gray;
}


.multiselect-breadth .input-group-btn {
    display: none;
}

.multiselect-search {
    padding-left: 5px;
}

#table-container > div.btn-group.open > div > ul > li > a > label > input[type="radio"] {
    vertical-align: middle;    
}

#table-container > div.btn-group.open > div > ul > li.focused {
    background: lightgrey;
}

#table-container > div.btn-group.open > div > ul > li.focused.active {
    background: #236AA7;
}

.identical {

}

.fullscreen-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: -100;
    background-color: #190f25
}

.fullscreen-bg__video {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
}

.fullscreen-bg-cover {
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgb(0 0 0 / 14%);
}

.panel-body-without-padding {
    padding: 0;
}