/**! hopscotch - v0.3.1
*
* Copyright 2017 LinkedIn Corp. All rights reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
 * This fade animation is based on Dan Eden's animate.css (http://daneden.me/animate/), under the terms of the MIT license.
 *
 * Copyright 2013 Dan Eden.
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */
 .animated {
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -ms-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes fadeInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -o-transform: translateY(0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade-in-up {
  -webkit-animation-name: fadeInUp;
  -moz-animation-name: fadeInUp;
  -o-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes fadeInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@-o-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    -ms-transform: translateY(0);
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade-in-down {
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -o-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0);
  }
}
@-o-keyframes fadeInRight {
  0% {
    opacity: 0;
    -o-transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    -o-transform: translateX(0);
  }
}
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.fade-in-right {
  -webkit-animation-name: fadeInRight;
  -moz-animation-name: fadeInRight;
  -o-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0);
  }
}
@-o-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -o-transform: translateX(20px);
  }
  100% {
    opacity: 1;
    -o-transform: translateX(0);
  }
}
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
.fade-in-left {
  -webkit-animation-name: fadeInLeft;
  -moz-animation-name: fadeInLeft;
  -o-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}  
div.hopscotch-bubble .hopscotch-nav-button.next {
  border:none;
  color: #fff;
  margin: 0 0 0 10px;
  font-weight: bold;
  font-size: 14px;
  /* HS specific
  background-color: red; */ 
  outline: none;
  box-shadow: none;
  border-radius: 4px;
  }
  .hopscotch-nav-button.prev{
  border:none;
  color: #fff;
  margin: 0 0 0 10px;
  font-weight: bold;
  font-size: 14px;
  /* HS specific
  background-color: red; */ 
  outline: none;
  box-shadow: none;
  border-radius: 4px;
  } 
 
/*div.hopscotch-bubble .hopscotch-nav-button.next:hover {
  background-color: #2672ae;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#2672ae', endColorstr='#1e4f7e');
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2672ae), color-stop(100%, #1e4f7e));
  background-image: -webkit-linear-gradient(to bottom, #2672ae 0%, #1e4f7e 100%);
  background-image: -moz-linear-gradient(to bottom, #2672ae 0%, #1e4f7e 100%);
  background-image: -o-linear-gradient(to bottom, #2672ae 0%, #1e4f7e 100%);
  background-image: linear-gradient(to bottom, #2672ae 0%, #1e4f7e 100%);
}
div.hopscotch-bubble .hopscotch-nav-button.prev {
  border-color: #a7a7a7;
  color: #444;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  background-color: #f2f2f2;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#e9e9e9');
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f2f2f2), color-stop(100%, #e9e9e9));
  background-image: -webkit-linear-gradient(to bottom, #f2f2f2 0%, #e9e9e9 100%);
  background-image: -moz-linear-gradient(to bottom, #f2f2f2 0%, #e9e9e9 100%);
  background-image: -o-linear-gradient(to bottom, #f2f2f2 0%, #e9e9e9 100%);
  background-image: linear-gradient(to bottom, #f2f2f2 0%, #e9e9e9 100%);
}
div.hopscotch-bubble .hopscotch-nav-button.prev:hover {
  background-color: #e8e8e8;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFE8E8E8', endColorstr='#FFA9A9A9');
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e8e8e8), color-stop(13%, #e3e3e3), color-stop(32%, #d7d7d7), color-stop(71%, #b9b9b9), color-stop(100%, #a9a9a9));
  background-image: -webkit-linear-gradient(to bottom, #e8e8e8 0%, #e3e3e3 13%, #d7d7d7 32%, #b9b9b9 71%, #a9a9a9 100%);
  background-image: -moz-linear-gradient(to bottom, #e8e8e8 0%, #e3e3e3 13%, #d7d7d7 32%, #b9b9b9 71%, #a9a9a9 100%);
  background-image: -o-linear-gradient(to bottom, #e8e8e8 0%, #e3e3e3 13%, #d7d7d7 32%, #b9b9b9 71%, #a9a9a9 100%);
  background-image: linear-gradient(to bottom, #e8e8e8 0%, #e3e3e3 13%, #d7d7d7 32%, #b9b9b9 71%, #a9a9a9 100%);
}
*/
div.hopscotch-bubble {  
  /* default */
  border: 0px solid rgba(0, 0, 0, 0.5);
  /* transparent, if supported */
  color: white;
  font-family: Helvetica, Arial;
  font-size: 13px;
  position: absolute;
  z-index: 999999;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -moz-background-clip: padding;
  /* for Mozilla browsers*/
  -webkit-background-clip: padding;
  /* Webkit */
  background-clip: padding-box;
  /*  browsers with full support */
  height: auto;
}
div.hopscotch-bubble * {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
div.hopscotch-bubble.animate {
  -moz-transition-property: top, left;
  -moz-transition-duration: 1s;
  -moz-transition-timing-function: ease-in-out;
  -ms-transition-property: top, left;
  -ms-transition-duration: 1s;
  -ms-transition-timing-function: ease-in-out;
  -o-transition-property: top, left;
  -o-transition-duration: 1s;
  -o-transition-timing-function: ease-in-out;
  -webkit-transition-property: top, left;
  -webkit-transition-duration: 1s;
  -webkit-transition-timing-function: ease-in-out;
  transition-property: top, left;
  transition-duration: 1s;
  transition-timing-function: ease-in-out;
}
div.hopscotch-bubble.invisibl {
  opacity: 0;
}
div.hopscotch-bubble.hide,
div.hopscotch-bubble .hide,
div.hopscotch-bubble .hide-all {
  display: none;
}
div.hopscotch-bubble h3 {
  color: White;
  font-family: "Salesforce Sans", Arial, sans-serif;
  font-size: 16px;
  font-weight: bold;
  line-height: 19px;
  margin: -1px 15px 0 0;
  padding: 0;
}
div.hopscotch-bubble .hopscotch-bubble-container {
  padding: 15px;
  position: relative;
  /* width: 300px!; */
  /*background:black;*/
  border-radius: 4px;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  /* to fix text flickering */
}

div.hopscotch-bubble .hopscotch-content {
  font-family: "Salesforce Sans", Arial, sans-serif;
  font-weight: normal;
  line-height: 20px;
  font-size: 16px;
  margin: -5px 0 10px;
  padding-top: 16px;
  padding-bottom: 15px;
  /*border-bottom:1px solid lightgrey;*/
}
div.hopscotch-bubble .hopscotch-bubble-content {
  margin: 0 0 0 0px;
}
div.hopscotch-bubble.no-number .hopscotch-bubble-content {
  margin: 0;
}
div.hopscotch-bubble .hopscotch-bubble-close {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  font-size: 16px;
  color: white; 
 /* background:yellow;*/
  padding-bottom: 13px;
  display: block; 
  outline: none;
  box-shadow: none;
  font-weight: 700;
  position: absolute;
  text-decoration: none;
  width: 9px;
  height: 8px;
  top: 0px;
  right: 4px;
}

div.hopscotch-bubble .hopscotch-bubble-close.hide,
div.hopscotch-bubble .hopscotch-bubble-close.hide-all {
  display: none;
}
div.hopscotch-bubble .hopscotch-bubble-number {
  padding: 1px 4px;
 /* background: red;*/
   border-radius: 4px; 
  color: white;
  display: block;
  float: left;
  font-size: 14px;
}

div.hopscotch-bubble .hopscotch-bubble-arrow-container {
  position: absolute;
  width: 34px;
  height: 34px;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container .hopscotch-bubble-arrow,
div.hopscotch-bubble .hopscotch-bubble-arrow-container .hopscotch-bubble-arrow-border {
  width: 0;
  height: 0;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.up {
  top: -11px;
  left: 10px;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow {
  border-bottom: 17px solid black;
  border-left: 0px solid black;
  border-right: 0px solid black;
  position: relative;
  top: -10px;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow-border {
  /*border-bottom: 12px solid black;*/
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  color: teal;
} 
div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow {
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  position: relative;
  color:teal;
  /* top: 118px; */
  /* bottom: -33px; 
  border-top: 13px solid yellow;*/
  left: 13px;
}

div.hopscotch-bubble .hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow-border {  
  border-left: 17px solid transparent;
  border-right: 17px solid transparent;
} 
div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow {
  border-bottom: 13px solid transparent;
  border-top: 13px solid transparent;
  position: relative;
  /* left: 10px; */
  /* top: -152px; */
  color: teal;
  top: -29px;
  left: -12px;
}

div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow-border {
   
  border-bottom: 17px solid transparent;
  border-top: 17px solid transparent;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.right {
  top: 10px;
  /* right: var(--pop-over-width); */
  /* right: -44px */
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow {
  border-bottom: 13px solid transparent;
 /* border-left: 14px solid yellow;*/
  border-top: 13px solid transparent;
  position: relative;
  /* left: 310px; */
  top: -34px;
}

div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow-border { 
  border-bottom: 17px solid transparent;
  border-top: 17px solid transparent;
}
div.hopscotch-bubble .hopscotch-actions {
  margin: 5px 0 0;
  text-align: right;
}

/* css for all the arrows 
.hopscotch-bubble-arrow-container.up .hopscotch-bubble-arrow-border{
  border-bottom: 12px solid #00a9d7;
} 
.hopscotch-bubble-arrow-container.down .hopscotch-bubble-arrow{
  border-top: 13px solid #00a9d7;
}
.hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow{
  border-left: 14px solid #00a9d7;
}
.hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow{
  border-right: 15px solid #00a9d7;
}*/
.hopscotch-nav-button.next, .hopscotch-nav-button.prev{
  background-color: #00a9d7;
}
.hopscotch-bubble-container{
  background-color: #00a9d7;
}
.hopscotch-bubble-close {
  background:#00a9d7;
}
.hopscotch-bubble-number {
  background: #00a9d7;
}
.remindMe{
  font-size: 10px;
  position: absolute;
  transform: translate(0px, 18px);
}
.gm-popover-footer {
	display: flex;
	flex-direction: row;
	-webkit-box-pack: end;
	justify-content: space-between;
	-webkit-box-align: center;
	align-items: center;
	margin: 15px 15px 10px 15px;
}
.gm-action-btn{
	min-height: 30px;
	outline: none;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	cursor: pointer;
	margin: 0px 0px;
	border: none;
  font-size: 12px !important;
  /* width: 59% !important; */
  width: auto !important;
	color: rgb(74, 144, 226);
	text-align: center;
	font-weight: 500;
	background: rgb(255, 255, 255);
}
.gm-action-btn-prev{
	min-height: 30px;
	outline: none;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	cursor: pointer;
	margin: 0px 0px;
	border: none;
	font-size: 12px !important;
  /* width: 71% !important; */
  width: auto !important;
	color: rgb(74, 144, 226);
	text-align: center;
	font-weight: 500!important;
	background: rgb(255, 255, 255);
}
.gm-progress {
	font-size: 11px;
	width: 100%;
	margin-left: 2px;
	margin-bottom: 5px;
	text-align: center;
}
.gm-action-btn-txt{
	margin: 0px 6px 0px 6px;
	font-size: 11px !important;
	/* width:  65%  !important; */
	color: rgb(74, 144, 226);
	text-align: center;
	font-weight: 500 !important;
}
.gm-popover-content {
	max-width: 100%;
	position: relative;
	text-align: center;
	pointer-events: all;
	min-width: 290px;
	background-color: rgb(219, 200, 200);
	z-index: 1 !important;
}
.gm-quit-btn {
	position: absolute;
	width: 8px;
	height: 8px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	top: 8px;
	right: 8px;
	z-index: 10;
	cursor: pointer;
}
.gm-popover-wrapper {
	width: 100%;
	word-break: break-word;
}
.gm-popover {
	color: #666666;
	font-size: 16px;
	line-height: 1.618;
  min-width:300px;
}
.gm-btn-icon{
	width: 12px;
	height: 10px;
}
.gm-popover-wrapper img {
	max-height: 100% !important;
	max-width: 100%;
	height: auto !important;
	width: auto !important;
}
.gm-remind-btn{
	position: absolute;
	width: 8px;
	height: 8px;
	top: 7px;
	right: 55px;
	z-index: 9;
	cursor: pointer;
}
.gm-remind-btn-action{
	display: flex;
    border: none;
    background-color: rgb(219, 200, 200);
}
.gm-remind-btn button{
	height: 9px !important;
}
.gm-remind-btn button:focus{
	box-shadow: none !important;
}
.gm-remind-btn svg{
	height: 12px !important;
}
.gm-dropdownlist{
	float: right;
	width: max-content;
  background-color: white;
	color: black;
  right: -35px !important;
  top:13px !important;
}
.gm-dropdownlist ul {
	list-style: none;
    /*padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;*/
}
.gm-dropdownlist ul a{
  text-decoration: none;
  color : black;
}
.gm-dropdownlist ul a:hover{
  text-decoration: none;
  color : black;
}
 button:focus { outline:0 !important; }