::selection {
  background: var(--seafoam50);
  color: inherit;
}

html{
  height: 100vh;
}

body{
  font-family: 'Open Sans', Sans-serif !important;
  color: var(--eboy);
  margin: 0 auto;
  margin-left: auto !important;
  margin-right: auto !important;
  background: var(--backdrop) !important;
  font-size: 14px;
  height: 100%;
  /* overflow-y: scroll; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body a {
  color: var(--eboy);
}

input:focus{
  outline: none;
}

@media only screen and (min-width : 150px) and (max-width : 530px){
  .loginForm h3 {
    text-align:center;
    margin:0;
  }
}

iframe{
  /*background: white !important;*/
}

.form-control:focus{
  background-color: #fafafa !important;
  border: solid 1px #f1c460 !important;
  box-shadow: none !important;
  outline: none;
}
textarea:focus{
  border: solid 1px #f1c460 !important;
  box-shadow: none !important;
  outline: none;
}

#tooltipAlert .tooltip-arrow {
  border-bottom-color:transparent !important;
}

/*//keep it*/
div.alertCreateModal.fade.in.modal div.modal-dialog div.modal-content,
.cancelModal .modal-dialog .modal-content{
  height:225px;
  width: 487px;
  border-radius: 3px;
}

i.fa.fa-angle-double-left:hover{
  color: #38cdaf !important;
}

/*remove it soon*/
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
  /*background: #38cdaf !important;*/
}

.manageAccountDropdown li.open.dropdown ul.dropdown-menu {
  opacity: 0.95;
  background: #ffffff !important;
  position: absolute;
  left: -65%;
  border-radius: 2px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  border: solid 1px #aaaaaa;
  width: 242px !important;
}

.manageAccountDropdown li.open.dropdown ul.dropdown-menu li a {
  text-align: left;
  padding-left: 30px;
}

.manageAccountDropdown li.open.dropdown ul.dropdown-menu:before {
  position: absolute;
  top:-14px;
  background-color: transparent !important;
  width: 0;
  height: 0;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  border-bottom: 15px solid #ffffff;
  left:184px;
  content: " ";
  z-index: 9999;
}

.manageAccountDropdown li.open.dropdown ul.dropdown-menu:after {
  background-color: transparent !important;
  width: 0;
  height: 0;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  border-bottom: 15px solid #979797;
  position: absolute;
  content: '';
  left:184px;
  top:-15px;
}

.manageAccountDropdown li.open.dropdown .dropdown-toggle,.manageAccountDropdown li.dropdown a#user-dropdown.dropdown-toggle:hover {
  background: #ffffff !important;
}
.manageAccountDropdown li.dropdown a#user-dropdown.dropdown-toggle span {
  color: #aaaaaa;
  font-size: 11px;
}

.public_Scrollbar_main {
  display: none !important ;
}

.manageAccountDropdown.nav li.dropdown a {
  text-transform: capitalize;
  color:#4a4a4a;
}

.manageAccountDropdown.nav li.dropdown a:focus {
  background: white;
}

button#forms-switch-dropdown span.caret {
  display: none;
}

#form-switch-dropdown {
  background: transparent !important;
  border: 0px;
  color: #4a4a4a !important;
  position: absolute;
  top: -16.5px;
  height: 20px;
  width:20px;
  box-shadow: none;
}

#form-switch-dropdown + ul.dropdown-menu {
  position: absolute;
  left: -124px;
  top: 5px;
  background: #ffffff;
  max-height: 320px;
  width:244px;
  min-height: 50px;
  overflow: scroll;
}

button#form-switch-dropdown span span.caret {
  position: absolute;
  top:10px !important;
  left: 8.5px !important;
}

#form-switch-dropdown + ul.dropdown-menu:before {
  position: absolute;
  top:-8px;
  left:130px;
  z-index: 9999;
  width: 0;
  height: 0;
  border-left: 6.25px solid transparent;
  border-right: 6.25px solid transparent;
  border-bottom: 7.5px solid #ffffff;
  background-color: transparent !important;
  content: " ";

}

#form-switch-dropdown+ ul.dropdown-menu:after {
position: absolute;
  left:130px;
  top:-9px;
  width: 0;
  height: 0;
  border-left: 6.25px solid transparent;
  border-right: 6.25px solid transparent;
  border-bottom: 7.5px solid #aaaaaa;
  background-color: transparent !important;
  content: '';

}


#form-switch-selector {
  background: transparent !important;
  border: 0;
  color: inherit !important;
  padding: 0;
  height: 35px;
  width:180px;
  border: #aaaaaa;
  box-shadow: none;
  padding-left: 10px;
  padding-bottom: 2px;
  position: relative;
  top:2px;
  font-weight: 600;
}

#form-switch-selector + ul.dropdown-menu {
  background: white;
  position: absolute;
  left: -35px;
  top:40px;
  padding: 0;
}

button#form-switch-selector span.caret {
  position: absolute;
  top:10px !important;
  left: 8.5px !important;
  display: none;
}

button#form-switch-selector.dropdown-toggle.btn.btn-default span {
  font-size: 12px;
  letter-spacing: -0.1px;
  font-weight: 400;
  color:#ffffff;
  text-decoration: none;
}

#form-switch-selector + ul.dropdown-menu:before {
  position: absolute;
  top:-15px;
  background-color: transparent !important;
  width: 0;
  height: 0;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  border-bottom: 15px solid #ffffff;
  left:95px;
  content: " ";
  z-index: 9999;
}

#form-switch-selector+ ul.dropdown-menu:after {
  background-color: transparent !important;
  width: 0;
  height: 0;
  border-left: 12.5px solid transparent;
  border-right: 12.5px solid transparent;
  border-bottom: 15px solid #aaaaaa;
  position: absolute;
  content: '';
  left:95px;
  top:-16px;
}

#form-switch-selector+ ul.dropdown-menu li a {
  text-decoration: none;
}


/*publish feedback*/

.publishModalFeedback div.modal-dialog div.modal-content {
    width: 451px !important;
    /*height: 276px;
    border-radius: 0px;*/
}


#userProfile .manageAccountDropdown > li {
  white-space: nowrap;
}

#userProfile .manageAccountDropdown > li:focus {
  background: #ffffff;
}



.btn-success {
  background: #89acf1 !important;
  border:0 !important;
}

.cancelBtn {
  border: 1px solid #c6d5fa !important;
  color: #89acf1 !important;
}

button#funnelDropdown.btn-default:active,
button#funnelDropdown.btn-default:hover,
button#funnelDropdown.dropdown-toggle.btn-default {
  background: transparent !important;
  border-left: 1px solid #e4ecfc;
  position: relative;
  left:-5px;
  cursor: pointer;
}

button#eventOptions.btn-default:active,
button#eventOptions.btn-default:hover,
button#eventOptions.btn-default:focus,
button#eventOptions.dropdown-toggle.btn-default {
  outline: none;
  background: transparent !important;
}

button#eventsOptions:focus {
    background: transparent;
    outline: none;
}


/* :global(.highcharts-axis-labels.highcharts-yaxis-labels > text ){
  font-weight: 400 !important;
  font-size: 10px !important;
  font-family: 'Open Sans' !important;
  color: #9b9b9b !important;
} */

#sessionDetails .arrow,
#replayActivity .arrow{
  display: none;
}

#sessionDetails{
  border: none;
}
#sessionDetails .popover-content {
  position: absolute;
  top: 50px;
  left: 10px;
  background-color: #ffffff;
  border-radius: 5px;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
  width: 240px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.tooltip.responseSessionDetails .tooltip-inner {
  position: absolute;
  top:-25px !important;
  left: -70px !important;
  background-color: #ffffff !important;
  border-radius: 5px !important;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3) !important;
  width: 240px !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

  .tooltip.sessionTooltip .tooltip-inner{
  position: absolute;
  top:-7.5px !important;
  left:-185px !important;
  height:47px;
  background-color: #ffffff !important;
  border-radius: 5px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3)!important;
  width: 240px !important;
  maxwidth: 240px !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.tooltip.sessionTooltip .tooltip-arrow {
  display: none !important;
}

#tooltipActivity .tooltip-arrow{
  border-top-color: #323c4f;
}

#tooltipActivity .tooltip-inner{
  background-color: #323c4f;
  border-radius: 2px 0 1px;
  color: white;
  font-size: 11px;
  font-weight: 400;
}


#renderPageDotActivity,
#renderClickDotActivity,
#renderChangeDotActivity,
#renderFBStartedDotActivity,
#renderFBSubmittedDotActivity,
#renderFBAbandonedDotActivity,
#renderPageDotMissing{
  min-width: 105px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  opacity: 1;
}

#renderPageDotActivity .tooltip-arrow,
#renderClickDotActivity .tooltip-arrow,
#renderChangeDotActivity .tooltip-arrow,
#renderFBStartedDotActivity .tooltip-arrow,
#renderFBSubmittedDotActivity .tooltip-arrow,
#renderFBAbandonedDotActivity .tooltip-arrow,
#renderPageDotMissing .tooltip-arrow{
  border-top-color: #252d3e;
}

#renderPageDotActivity .tooltip-inner,
#renderClickDotActivity .tooltip-inner,
#renderChangeDotActivity .tooltip-inner,
#renderFBStartedDotActivity .tooltip-inner,
#renderFBSubmittedDotActivity .tooltip-inner,
#renderFBAbandonedDotActivity .tooltip-inner,
#renderPageDotMissing .tooltip-inner{
  background-color: #252c3f !important;
  border-radius: 5px!important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  max-width: 280px;
  min-width: 105px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 0 10px 0 0;
  stroke: #fff;
  fill: #fff;
  line-height: 1.6 !important;
}

/*#renderPageDotActivity .tooltip-inner {
  border-left: 5px solid #89acf1;
}

#renderClickDotActivity .tooltip-inner {
  border-left: 5px solid #ffaa49;
}

#renderChangeDotActivity .tooltip-inner {
  border-left: 5px solid #f8c454;
}

#renderFBStartedDotActivity .tooltip-inner,
#renderFBSubmittedDotActivity .tooltip-inner {
  border-left: 5px solid #74cdb0;
}*/

.daterangepicker.opensleft:before,
.daterangepicker:after {
  display: none !important;
}

.daterangepicker.dropdown-menu.ltr.opensleft,
.daterangepicker.dropdown-menu.ltr.opensleft div.ranges {
  min-width: 220px !important;
  padding: 0 !important;
  margin:0 !important;
}

.daterangepicker.dropdown-menu.ltr.opensleft div.range_inputs {
  text-align: left !important;
  padding: 10px 0 5px 10px!important;
}

.daterangepicker.dropdown-menu.ltr.opensleft div.range_inputs .applyBtn{
  margin-right: 10px !important;
}

.daterangepicker.dropdown-menu.ltr.opensleft div.ranges ul {
  width: 218px !important;
  margin-top: 5px !important;
  margin-left: 0 !important;
}

.daterangepicker.dropdown-menu.ltr.opensleft div.ranges li {
  background: #ffffff !important;
  border: 0 !important;
  color: #4a4a4a !important;
  font-family: 'Open Sans'!important;
  font-size: 12px !important;
  font-weight: 400 !important;
  border-radius: 0 !important;
}

.daterangepicker.dropdown-menu.ltr.opensleft div.ranges li.active {
  background: #f6f6f6 !important;
  border: 0 !important;
  color: #4a4a4a !important;
  font-family: 'Open Sans'!important;
  font-size: 12px !important;
  font-weight: 400 !important;
  border-radius: 0 !important;
}

#accountMgmt .col-sm-9 {
    padding-left: 50px;
    height: calc(100vh - 150px);
    overflow: auto;
}


#tooltipUrl {
  width: 250px !important;
  word-wrap:normal;
  white-space: normal;
}

#tooltipUrl .tooltip-inner{
  background-color: #323c4f;
  border-radius: 2px 0 1px;
  color: white;
  font-size: 11px;
  font-weight: 400;
  max-width: 250px !important;
  white-space: normal;
  word-wrap: normal;
}

.react-resizable {
  position: relative;
}
.react-resizable-handle {
  position: absolute;
  width: 20px;
  height: 20px;
  bottom: 0;
  right: 0;
  background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+');
  background-position: bottom right;
  padding: 0 3px 3px 0;
  background-repeat: no-repeat;
  background-origin: content-box;
  box-sizing: border-box;
  cursor: se-resize;
}

.matchHighlighter {
  background-color: #f7f76b;
}

.customDropdown button {
  font-weight: 600 !important;
}

.customDropdown button:hover, .customDropdown button:active {
  background-color: #F6F7F9 !important;
}

.customDropdown .dropdown-menu > li > a {
  color: #505673 !important;
  font-weight: 600;
  padding: 8px;
}

.customDropdown .dropdown-menu > li.active > a,
.customDropdown .dropdown-menu > li.active > a:hover {
  color: #fff !important;
  background-color: #505673 !important;
}

.customDropdown .dropdown-menu > li > a:hover {
  background-color:  rgba(136, 76, 255, 0.20) !important;
}

.customDropdown ul.dropdown-menu {
  border: 1px solid var(--frozone);
  box-shadow: 0 2px 8px var(--grape20);
  font-size: 12px;
  margin: 0;
  padding: 0;
  border-radius: 0 4px 4px 4px;
}

.custom-heatmap-filter .customDropdown button:hover, .customDropdown button:active {
  background-color: #F6F7F9 !important;
}

.custom-heatmap-filter .customDropdown .dropdown-menu > li > a {
  font-size: 12px;
}

.custom-heatmap-filter .customDropdown .dropdown-menu > li.active > a,
.customDropdown .dropdown-menu > li.active > a:hover {
  color: inherit !important;
  background-color: #d0d7e6 !important;
}

.customDropdown .btn-default.active, .customDropdown .btn-default:active, .customDropdown .open>.dropdown-toggle.btn-default,
.customDropdown .btn-default:hover{
  background-color: transparent;
}

.customDropdown .btn-default.active.focus, .customDropdown .btn-default.active:focus, .customDropdown .btn-default.active:hover,
.customDropdown .btn-default:active.focus, .customDropdown .btn-default:active:focus, .customDropdown .btn-default:active:hover,
.customDropdown .open>.dropdown-toggle.btn-default.focus, .customDropdown .open>.dropdown-toggle.btn-default:focus,
.customDropdown .open>.dropdown-toggle.btn-default:hover, .customDropdown .btn-default.focus, .customDropdown .btn-default:focus {
  background-color: transparent;
}

.customDropdown .btn-group.open .dropdown-toggle {
  box-shadow: none;
}

.custom-heatmap-filter .customDropdown .dropdown-menu > li > a:hover {
  background-color:  rgba(80, 59, 255, 0.5) !important;
}

.customButton {
  background-color: transparent;
  color: inherit !important;
  border: none;
}

.customButton:focus {
  outline: none;
}

.user_list .__ResponsiveTable {
  height: inherit !important;
  display: block !important;
}

.user_list .fixedDataTableLayout_main.public_fixedDataTable_main {
  height: inherit !important;
}

.user_list .fixedDataTableLayout_rowsContainer {
  height: inherit !important;
}

.user_list .fixedDataTableLayout_bottomShadow.public_fixedDataTable_bottomShadow {
  bottom: 0 !important;
  top: 0 !important;
}

/* styles for pending events */
.pending{
	position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  background: white;
  font-family: sans-serif;
  font-size: 11px;
  color: #505673;
  padding: 0 7px;
  font-weight: bold;
  border-radius: 4px;
  justify-content: space-between;
  height: 28px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.2s ease-in-out;
}
.pending:hover{
	border:1px solid #838AA4;
}

.sk-chasing-dots {
	width: 20px;
	height: 20px;
	position: relative;
	text-align: center;
	-webkit-animation: sk-chasingDotsRotate 2s infinite linear;
	animation: sk-chasingDotsRotate 2s infinite linear;
}

.sk-chasing-dots .sk-child {
	width: 60%;
	height: 60%;
	display: inline-block;
	position: absolute;
	top: 0;
	background-color: #333;
	border-radius: 100%;
	-webkit-animation: sk-chasingDotsBounce 2s infinite ease-in-out;
	animation: sk-chasingDotsBounce 2s infinite ease-in-out;
}

.sk-chasing-dots .sk-dot2 {
	top: auto;
	bottom: 0;
	-webkit-animation-delay: -1s;
	animation-delay: -1s;
}

.sk-chasing-dots .sk-dot1{
	background: #89C6FF;
}

.sk-chasing-dots .sk-dot2{
	background: #503BFF;
}

@-webkit-keyframes sk-chasingDotsRotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes sk-chasingDotsRotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@-webkit-keyframes sk-chasingDotsBounce {
	0%,
	100% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	50% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes sk-chasingDotsBounce {
	0%,
	100% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	50% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@keyframes collectingData {
  to {stroke-dashoffset: -400}
}

.collectingDataContainer {
  position:relative;
  width: 600px;
  display:flex;
  flex-direction: row;
  margin: 0 auto;
}

.collectingDataContainer #path1 {
  stroke-dasharray: 50;
  -webkit-animation: collectingData 4s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 4s infinite easeInOutExpo;
}


.collectingDataContainer #path2 {
  stroke-dasharray: 80;
  -webkit-animation: collectingData 4s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 4s infinite easeInOutExpo;
}

.collectingDataContainer #path3 {
  stroke-dasharray: 20;
  -webkit-animation: collectingData 4s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 4s infinite easeInOutExpo;
}

.collectingDataContainer #path4 {
  stroke-dasharray: 40;
  -webkit-animation: collectingData 10s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 10s infinite easeInOutExpo;
}

.collectingDataContainer #path5 {
  stroke-dasharray: 60;
  -webkit-animation: collectingData 4s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 4s infinite easeInOutExpo;
}

.collectingDataContainer #path6 {
  stroke-dasharray: 50;
  -webkit-animation: collectingData 4s infinite linear; /* Chrome, Safari, Opera */ 
  animation: collectingData 4s infinite easeInOutExpo;
}
#tooltip.feedback-tooltip {
  pointer-events: none;
}

.sessionListHeader .Select-control .Select-value {
  font-size: 16px !important;
  padding-left: 0 !important;
  top: -4px !important;
}

.bootstrap-typeahead input[type="text"]:focus {
  border: 1px solid var(--frozone) !important;
}

.bootstrap-typeahead .dropdown-menu {
  padding: 0 !important;
}

.bootstrap-typeahead .dropdown-menu a {
    color: #666;
    /* padding: 0; */
    padding: 8px 12px;
}

.bootstrap-typeahead .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>a:hover {
  background-color: rgba(0,126,255,.08) !important;
  color: #333;
}

@keyframes typeahead-spinner {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(350deg);
  }
}

.bootstrap-typeahead .spinner {
  animation: typeahead-spinner .4s infinite linear;
}

.aggregation-table-cell .rc-tooltip,
.multi-input .Select-menu-outer,
.multi-input .Select-arrow-zone {
  display: none;
}

.calendar-container .rdr-Calendar {
  box-shadow: 0 1px 6px 1px rgba(0,0,0,.26);
  border-radius: 10px;
}

.calendar-container .rdr-MonthAndYear-button.prev, .calendar-container .rdr-MonthAndYear-button.next {
  background: none !important;
}

.calendar-container .rdr-MonthAndYear-button.prev i {
  border-width: 6px 8px 6px 4px !important;
  border-color: transparent rgb(102, 102, 102) transparent transparent !important;
}

.calendar-container .rdr-MonthAndYear-button.next i {
  border-width: 6px 4px 6px 8px !important;
  border-color: transparent  transparent transparent rgb(102, 102, 102) !important;
}

.calendar-container .rdr-MonthAndYear-innerWrapper {
  font-size: 16px !important;
  font-weight: 600;
  margin-bottom: 4px;
}

.calendar-container .rdr-Days{
  font-weight: 600;
  color: var(--greyish);
}

.calendar-container .rdr-Day{
  border-radius: 50%;
}

.calendar-container .rdr-Calendar .is-selected {
  background-color: var(--frozone) !important;
  border-radius: 50%;
}