/*
*	https://material.io/color/#!/?view.left=1&view.right=1&primary.color=005ABE&secondary.color=f1f1f1
*/
/*
$backgroundColor: rgba(241, 241, 241, 1);
$secondaryColor: rgba(241, 241, 241, 1);
$secondaryLightColor: rgba(255, 255, 255, 1);
$secondaryDarkColor: rgba(190, 190, 190, 1);
*/
/*$buttonShadow: 0px 0px 2px 0 rgba(0,0,0,0.4);
$buttonShadowHover: 2px 2px 4px 0 rgba(0,0,0,0.4);*/
/* #E4EEF3 */
/* $defaultShadow: 0px 0px 4px 0 rgba(0,0,0,0.4); */
/*
*****************
*	OLD COLORS	*
*****************
	Header color: #383A3B
					rgba(56, 58, 59, 1)
	Clean blue: #0EB3FF
					rgba(14, 179, 255, 1)
	Almost white: #F1F1F1
					rgba(241, 241, 241, 1)
	Almost black: #1F1F1F
					rgba(31, 31, 31, 1)
	Light gray: #DEDEDE
					rgba(222, 222, 222, 1)
	Gray: rgba(56, 58, 59, 0.4)									NOTE; Used in textbox thin underline
					#A7A7A8
	Darker Gray: rgba(145, 145, 145, 1)
					#919191
	Green: rgba(46, 204, 113, 1)
					#2ECC71
	Red: rgba(242, 38, 19, 1)
					#F22613
	Tag hover: inset 0px 0px 0px 100px rgba(255,255,255,0.25)		
	
	
	Shadow: 0px 0px 4px 0 rgba(0,0,0,0.4)
	Button shadow: 1px 1px 2px 0 rgba(0,0,0,0.4)
	Button shadow hover: 2px 2px 4px 0 rgba(0,0,0,0.4)
	DEFAULT Button background: rgba(255, 255, 255, 0)
	Disabled button color: rgba(56, 58, 59, 0.1)
	
	Disabled opacity: 0.45

	
	
	
	
*****************
*	NEW COLORS	*
*****************
	LightBlue	#ADBFD8
				rgba(71, 117, 179, 0.4) !important
				
*/
.loaderAnim {
  position: absolute;
  height: 50px;
  width: auto;
  margin-top: calc(50vh - 25px);
  margin-bottom: calc(50vh - 25px);
  margin-left: calc(50% - 25px);
  margin-right: calc(50% - 25px);
  -webkit-animation-name: loaderSpinner;
          animation-name: loaderSpinner;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes loaderSpinner {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  5% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
  60% {
    -webkit-transform: rotate(370deg);
            transform: rotate(370deg);
  }
  80% {
    -webkit-transform: rotate(355deg);
            transform: rotate(355deg);
  }
  90% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes loaderSpinner {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  5% {
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
  60% {
    -webkit-transform: rotate(370deg);
            transform: rotate(370deg);
  }
  80% {
    -webkit-transform: rotate(355deg);
            transform: rotate(355deg);
  }
  90% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
/*
*
*/
.ripple {
  position: relative;
  overflow: hidden;
}

.ripple:after {
  content: " ";
  background: rgba(100, 100, 100, 0.4);
  display: block;
  position: absolute;
  width: 120%;
  height: 120%;
  top: 50%;
  bottom: 50%;
  left: 50%;
  right: 50%;
  margin: auto;
  padding: 0;
  border-radius: 100%;
  opacity: 0;
  -webkit-transition: all 0.6s;
          transition: all 0.6s;
  -webkit-transform: translateX(-50%) translateY(0%);
  -ms-transform: translateX(-50%) translateY(0%);
  transform: translateX(-50%) translateY(0%);
}

.ripple:active:after {
  width: 0%;
  height: 0%;
  top: 50%;
  left: 50%;
  opacity: 1;
  -webkit-transition: 0s;
          transition: 0s;
}

/*
*
*/