/**********CLASS Hicrm_Loading_Wheel**********/
/**********#hicrm_loader**********/
@keyframes hicrm_spin {
  from {transform: rotate(0deg);}
  to {transform: rotate(36000deg);}
}

@keyframes hicrm_grow_and_shrink {
  0% {scale: 1;}
  50% {scale: .6;}
  100% {scale: 1;}
}


#hicrm_loader {
	--hicrm-loader-size: min(50vh, 90vw);
	height: var(--hicrm-loader-size);
	width: var(--hicrm-loader-size);
	margin: 0px auto;
	position: fixed;
  z-index: 9999999;
  top: calc(50vh - (var(--hicrm-loader-size) / 2));
  left: calc(50vw - (var(--hicrm-loader-size) / 2));
	animation-name: hicrm_spin;
	animation-duration: 120s;
	animation-timing-function: linear;    
}

#hicrm_loader .hicrm_loader_segment {
  position: absolute;
}

#hicrm_loader #hicrm_segment0 {rotate: calc((360deg / 8) * 0);}
#hicrm_loader #hicrm_segment1 {rotate: calc((360deg / 8) * 1);}
#hicrm_loader #hicrm_segment2 {rotate: calc((360deg / 8) * 2);}
#hicrm_loader #hicrm_segment3 {rotate: calc((360deg / 8) * 3);}
#hicrm_loader #hicrm_segment4 {rotate: calc((360deg / 8) * 4);}
#hicrm_loader #hicrm_segment5 {rotate: calc((360deg / 8) * 5);}
#hicrm_loader #hicrm_segment6 {rotate: calc((360deg / 8) * 6);}
#hicrm_loader #hicrm_segment7 {rotate: calc((360deg / 8) * 7);}

/***arm***/
#hicrm_loader[hicrm_type="arm"] {
	--hicrm-loader-arm-height: calc(var(--hicrm-loader-size) * .4);
	--hicrm-loader-arm-width: calc(var(--hicrm-loader-arm-height) / 5);
	--hicrm-loader-perspective: 500px;
	--hicrm-loader-rotateX: -75deg;
  --hicrm-large-circle-size: var(--hicrm-loader-arm-width);
  --hicrm-large-circle-y-offset: calc(var(--hicrm-large-circle-size) / 2);
  --hicrm-small-circle-size: calc(var(--hicrm-large-circle-size) / 2);  
  --hicrm-small-circle-y-offset: calc((var(--hicrm-small-circle-size) / 2));  
  --hicrm-arm-body-height: calc(var(--hicrm-loader-arm-height) - var(--hicrm-large-circle-y-offset) - var(--hicrm-small-circle-y-offset));   
}


#hicrm_loader .hicrm_arm {
	left: calc(50% - (var(--hicrm-loader-arm-width) / 2));
	top: calc((var(--hicrm-loader-size) / 2) - (var(--hicrm-loader-arm-height) * 1.25));
	width: var(--hicrm-loader-arm-width);
	height: var(--hicrm-loader-arm-height);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
	transform-origin: 50% calc(100% + var(--hicrm-loader-arm-height) * .25);
	animation-name: hicrm_grow_and_shrink;
	animation-duration: 2s;
  animation-iteration-count: 60;
	animation-timing-function: linear;   
}

#hicrm_loader .hicrm_arm *:is(.hicrm_large_circle, .hicrm_small_circle, .hicrm_arm_body.hicrm_top_layer) {background-color: white;}
#hicrm_loader .hicrm_arm *:is(.hicrm_large_circle, .hicrm_small_circle) {border-radius: 50%;}
#hicrm_loader .hicrm_arm *:is(.hicrm_large_circle, .hicrm_small_circle, .hicrm_arm_body) {position: absolute;}

#hicrm_loader .hicrm_arm .hicrm_large_circle {
  top: 0px;
  width: var(--hicrm-large-circle-size);
  height: var(--hicrm-large-circle-size);  
}
#hicrm_loader .hicrm_arm .hicrm_small_circle {
  bottom: 0px;
  width: var(--hicrm-small-circle-size);
  height: var(--hicrm-small-circle-size);  
}

#hicrm_loader .hicrm_arm .hicrm_arm_body {
  height: var(--hicrm-arm-body-height);  
  top: var(--hicrm-large-circle-y-offset);
}

#hicrm_loader .hicrm_arm .hicrm_arm_body.hicrm_top_layer {
  width: var(--hicrm-loader-arm-width);
  clip-path: polygon(0px 0px, 100% 0px, calc(50% + var(--hicrm-small-circle-y-offset)) 100%, calc(50% - var(--hicrm-small-circle-y-offset)) 100%);
}
#hicrm_loader .hicrm_arm .hicrm_arm_body.hicrm_bottom_layer {width: 0px;}

#hicrm_loader .hicrm_arm *:is(.hicrm_large_circle, .hicrm_small_circle, .hicrm_top_layer) {z-index: 999;}
#hicrm_loader .hicrm_arm .hicrm_bottom_layer {z-index: 0;}

#hicrm_loader .hicrm_arm .hicrm_arm_body.hicrm_bottom_layer {
  box-shadow: 
    0px 0px calc(var(--hicrm-loader-arm-width) * .5) calc(var(--hicrm-small-circle-size) * 0.4) black,
    0px 0px calc(var(--hicrm-loader-arm-width) * 1) calc(var(--hicrm-small-circle-size) * 0.4) black;
  clip-path: unset !important;
}



/***cricle***/
#hicrm_loader .hicrm_circle {
  --hicrm-loader-circle-width: calc(var(--hicrm-loader-size) * .25);	
	left: calc((100% - var(--hicrm-loader-circle-width)) / 2);
	top: 0px;
	width: var(--hicrm-loader-circle-width);
	height: 100%;
  transform-origin: 50% 50%;
}


#hicrm_loader #hicrm_segment0::before {
  opacity: calc((1 / 12) * 5);
  scale: calc((1 / 12) * 3);
}
#hicrm_loader #hicrm_segment1::before {
  opacity: calc((1 / 12) * 6);
  scale: calc((1 / 12) * 4);
}
#hicrm_loader #hicrm_segment2::before {
  opacity: calc((1 / 12) * 7);
  scale: calc((1 / 12) * 5);
}
#hicrm_loader #hicrm_segment3::before {
  opacity: calc((1 / 12) * 8);
  scale: calc((1 / 12) * 6);
}
#hicrm_loader #hicrm_segment4::before {
  opacity: calc((1 / 12) * 9);
  scale: calc((1 / 12) * 7);
}
#hicrm_loader #hicrm_segment5::before {
  opacity: calc((1 / 12) * 10);
  scale: calc((1 / 12) * 8);
}
#hicrm_loader #hicrm_segment6::before {
  opacity: calc((1 / 12) * 11);
  scale: calc((1 / 12) * 9);
}
#hicrm_loader #hicrm_segment7::before {
  opacity: calc((1 / 12) * 12);
  scale: calc((1 / 12) * 10);
}

#hicrm_loader .hicrm_circle::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: var(--hicrm-loader-circle-width);
  height: var(--hicrm-loader-circle-width);
  border-radius: 100%;
  background-color: white;
}
