@font-face {
  font-family: Somatic;
  src: url("../somatic.otf");
}
@font-face {
  font-family: Nexa;
  src: url("../fonts/nexa/NexaLight.ttf");
}
@font-face {
  font-family: NexaBold;
  src: url("../fonts/nexa/NexaBold.ttf");
}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.small-hint i {
  font-size: 15px;
}
.required::after {
  content: "*";
  color: red;
  position: relative;
  left: 2px;
}
.light-logo, .dark-logo {
  bottom: 3px;
  position: relative;
}
/*Dashboard Overrides*/
.simple-feed .feed-item {
  padding-bottom: 20px;
}
.stats-card-portrait, .stats-card-portrait .vertical-stats,  .stats-card-portrait .img-header {
  height: 150px;
  min-height: 100px;
}
.stats-card-portrait .vertical-stats {
  width: 30%;
}
.spaced {
  padding: 20px !important;
}
.spaced-vertical {
  padding: 20px 0px;
}
.is-block {
  display: block;
}

.child-menu {
  /*background: #673fe4;*/
  background: linear-gradient(180deg, #673fe4 40%, #2cb5e8 150%);
}
.child-menu li.have-children ul li a {
  background-color: #218e7e;
}
.child-menu .sidebar-menu li a {
  transition: background-color 0.2s;
}
.child-menu .sidebar-menu li a:hover {
  background-color: #76debd;
  padding: 20px 25px;
  text-decoration: none;
  color: #fff;
}
.child-menu li.have-children.active {
  background-color: #2cb5e8;
}
.widget-bars {
  color: white;
}
#doughnut-card {
  padding: 15px;
}
.main-menu .main-menu-inner .main-logo img {
    width: 38px;
    height: 38px;
    transition: opacity .3s;
}
.dashboard-wrapper {
  padding: 20px 20px 0 20px;
}
.dashboard-wrapper .flex-card .material-header.is-secondary {
  box-shadow: 0 14px 26px -12px rgba(127,127,255,0.42),0 4px 23px 0px rgba(0,0,0,0.12),0 8px 10px -5px rgba(127,127,255,0.2) !important
}
.menu-wrapper .icon-box-toggle {
  top: 9px;
}
.no-account {
  color: white !important;
  opacity: 0.8;
}
.no-account:hover {
  color: white !important;
  opacity: 1;
}
.pagination {
  margin: 0;
}
/*  End overrides  */

.dashboard-new-survey-card {
  max-width: 600px;
}

.survey-widget-list {
  list-style-type: none !important;
  padding-left: 0;
  margin-left: 0;
}

.survey-widget-list li::before {
  content: ".";
  display: inline-block;
  width: 26px;
  height: 26px;
  margin-right: 9px;
  border-radius: 50%;
}

.survey-widget-list li:nth-child(1)::before { background-color: #3273dc; color: #3273dc; }
.survey-widget-list li:nth-child(2)::before { background-color: #23d160; color: #23d160; }
.survey-widget-list li:nth-child(3)::before { background-color: #209cee; color: #209cee; }
.survey-widget-list li:nth-child(4)::before { background-color: #ffdd57; color: #ffdd57; }
.survey-widget-list li:nth-child(5)::before { background-color: #ff3860; color: #ff3860; }
.survey-widget-list li:nth-child(6)::before { background-color: #673fe4; color: #673fe4; }

.valign-middle {
  vertical-align: middle;
}
.dashboard-profile {
  justify-content: left !important;
  padding-left: 20px; 
}
.dashboard-profile .dashboard-name {
  font-size: 2em !important;
  font-family: NexaBold;
}
.dashboard-profile * {
  color: white;
}
.dashboard-logout {
  background: none;
  border: 1px solid white;
  color: white;
  margin-top: 5px;
}
.dashboard-name-column {
  text-align: left; 
}
.survey-widget-list li {
  font-size: 1.2em;
}

#clicksy-navbar {
  font-size: 35px;
  text-align: left; 
  display: block;
  position: absolute;
  left: 24px;
}

#dashboard-wrapper {
  padding-top: 0px;
}
#login-form p a {
  color: white;
}
.gradient-background {
  background: linear-gradient(141deg, #673fe4 10%, #2cb5e8 100%) !important;
}
.clicksyfont {
  letter-spacing: 1px;
  font-family: Somatic;
  color: white;
  font-size: 5em;
  font-weight: 600;
}

.notification {
  margin: 20px;
}
.notification-static {
  position: fixed;
  width: calc(100% - 40px);
  top: 60px;
}

.login-button {
  color: white;
  border-color: white;
}
.login-button:hover {
  background-color: #ffffff00;
  border-color: white;
  color:white;
}
.login-button:active {
  background-color: #ffffff00;
  border-color: white;
  color:white;
}

.login-switch-button {
  position: fixed;
  bottom: 20px;
  text-align: center;
  margin: auto;
  left: 0;
  right: 0;
}

.login-box {
  max-width: 300px;
  margin: auto;
  margin-bottom: 10px;
}

.header-title {
  margin: 0px 10px;
}
.dashboard-container, .dashboard-header{
  margin: auto;
  margin-top: 30px;
  max-width: 1000px;
}

.survey-all-block {
  margin-bottom: 20px;
}

.new-survey-button {
  width: 100%;
}

.results-table .result-count {
  color: white;
  padding: 10px;
  border-radius: 5px;
  display: inline-block;
  min-width: 60px;
  text-align: center;
}

.results-table .result {
  margin: 10px;
}

.results-label {
  padding: 3px 10px; 
  display: inline;
}

.results-options {
  margin-bottom: 30px;
}
.results-options button {
  display: block;
  margin: 10px;
}

.results-table div:nth-child(1) .result-count { background-color: #3273dc; }
.results-table div:nth-child(2) .result-count { background-color: #23d160; }
.results-table div:nth-child(3) .result-count { background-color: #209cee; }
.results-table div:nth-child(4) .result-count { background-color: #ffdd57; }
.results-table div:nth-child(5) .result-count { background-color: #ff3860; }
.results-table div:nth-child(6) .result-count { background-color: #673fe4; }

/* Survey swatches */
.response-swatch {
  display: inline-block;
  width: 20px;
  height: 20px;
  position: relative;
  float: left;
  border-radius: 50%;
  margin-right: 30px;
}
.response-swatch.is-0 { background-color: #3273dc; }
.response-swatch.is-1 { background-color: #23d160; }
.response-swatch.is-2 { background-color: #209cee; }
.response-swatch.is-3 { background-color: #ffdd57; }
.response-swatch.is-4 { background-color: #ff3860; }
.response-swatch.is-5 { background-color: #673fe4; }

.account-dropdown {
  margin: 0px 20px;
  position: relative;
}
.account-dropdown .account-menu {
  position: absolute;
  top: 10px;
  padding-top: 30px;
  z-index: 50;
  display: none;
}
.account-dropdown:hover > .account-menu {
  display: block;
}
.account-avatar {
  cursor: pointer;
}
.account-avatar span {
  display: inline-block;
  margin-top: 5px;
  margin-left: 5px;
}

.empty-pie {
  border: 1px solid #ddd;
  width: 280px;
  height: 280px;
  position: relative;
  border-radius: 50%;
  text-align: center;
  margin-top: 20px;
  background: white;
}

.empty-pie-small {
  width: 150px;
  height: 150px;
  margin: 0;
}

.empty-pie span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 11px;
  color: #bbb;
}

#logo-text-sidebar {
  left: 15px;
  top: 12px;
  position: absolute;
  width: 135px;
  pointer-events: none;
}
#notification {
  z-index: 5000;
}

.responses-footer-link {
  margin: 10px; 
  display: inline-block;
}

.html-snippet-box {
  padding: 10px;
}
.html-snippet-box .select, .html-snippet-box textarea {
  margin-bottom: 10px;
}
.html-snippet-box textarea {
  font-size: 12px;
  padding: 10px;
}
.pie-widget {
  padding-bottom: 20px;
}

.survey-view-qa .subtitle {
  padding: 10px;
  margin: 0;
}
.survey-view-qa .answers .subtitle:nth-child(odd) {
  background: rgba(0,0,0,0.03);
}
.survey-view-header {
    margin: 20px;
    margin-left: 30px;
/*    color: white !important;
    background: #673fe4;*/
    border-bottom: 4px solid #673fe4;
    font-weight: 600 !important;
    font-family: NexaBold;
    font-weight: 100 !important;
    padding-bottom: 15px !important;
}

#deletion-model {
  background: rgba(0,0,0,0.5);
}
#deletion-model * {
  transform: none;
  opacity: 1;
}
.surveys-page-card {
  margin-top: 15px; 
  margin-left: 5px;
}
.dashboard-survey-question strong {
  padding-bottom: 10px;
  display: block;
  font-size: 20px;
}
.dashboard-survey-question {
  padding-bottom: 30px !important;
}
.dashboard-survey-graph {
  margin: 30px 0px;
}
#doughnutChart {
  width: 200px;
  height: 200px;
}
.survey-options button {
  display: block;
  margin: 8px 0px;
}
.survey-options {
  padding-bottom: 10px;
}
.survey-options-save {
  display: block;
}

.hidden, .hidden * {
  display: none;
}

.answers .subtitle {
  padding: 20px;
}

#survey-search {
  border: none;
  border-bottom: 1px solid #b5b5b5;
  border-radius: 0;
  padding: 16px;
  padding-left: 40px; 
  font-size: 1.4em;
}

.survey-search-add-new {
  display: block;
  margin: 10px;
}

#template-preview {
  width: 100%;
  text-align: center;
  background-color: #222222;
  border-radius: 5px;
  height: auto;
  padding: 30px;
  position: relative;
  transition: opacity 0.5s;
}
#template {
  transition: opacity 0.5s;
}
#template-preview .preview-center-box {
  position: relative;
  top: 50%;
  left: 0;
  right: 0;
  margin: auto;
  max-width: 400px;
}

.center-box {
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}
#template-preview * {
  margin: 10px;
  color: white;
}

@media only screen and (max-width: 769px) {
  #dashboard-avatar {
    display: none;
  }
}

.text-is-primary {
  color: #239887 !important;
}
.text-is-primary:hover {
  color: #673fe4 !important;
}


.thank-you-box {
  margin: auto;
  top: 50%;
  position: relative;
  transform: translate(0,-50%);
}
.thank-you-box textarea {
  max-width: 500px;
}
.thank-you-container {
  height: 100vh;
  text-align: center;
}
.thank-you-box .button {
  margin-top: 10px;
}


/*User facing comments*/
#clicky-comment-area {
  max-width: 400px;
  transition: opacity 0.5s;
  color: white;
}

.ty-for-comment {
  font-size: 2em;
}

.response-entry {
  transition: opacity 1s;
}

#card-element {
  border-bottom: 3px solid #673fe4;
}