.logo-gs {
    width: 4rem;
    height: 3rem;
	  
	vertical-align: middle;
	overflow: visible;
  }
  .logo-gs-shadow {
    filter: drop-shadow(0 0.06rem 0.06rem rgba(0,0,0,.2));
    -webkit-filter: drop-shadow(0 0.06rem 0.06rem rgba(0,0,0,.2));
  }
  #brand-atom {
      transform-origin: 50% 49%;
      -webkit-transform-origin: 50% 49%;
      -moz-transform-origin: 50% 49%;
  }
  .icon-fill-1 {
      fill: #444444;
  }
  .icon-fill-2 {
      fill: #1D8A4B;
  }

  .icon-fill-1-footer {
      fill: white;
  }

  .icon-fill-2-footer {
      fill: #27AE60;
  }

  .logo-opengraphy-D {
	display: flex !important;
	justify-content: center!important;
	align-items: center !important;
}
.logo-opengraphy-D svg {
    height: 3rem;
    width: 3rem;
}



  /* #brand-atom:hover {
    -webkit-animation: logo-spin 3.5s cubic-bezier(.17,.67,.34,1.1) 1;
    animation: logo-spin 3.5s cubic-bezier(.17,.67,.34,1.1) 1;
  } */
  @-webkit-keyframes logo-spin {
    0% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
    }
    100% {
      transform: rotate(359deg);
      -webkit-transform: rotate(359deg);
    }
  }
  @keyframes logo-spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(359deg);
    }
  }

	@-webkit-keyframes reverse-logo-spin {
	 0% {
      transform: rotate(359deg);
      -webkit-transform: rotate(359deg);
    }	
    100% {
      transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
    }
  }
  @keyframes reverse-logo-spin {
     0% {
      transform: rotate(359deg);
    }	
    100% {
      transform: rotate(0deg);
    }
  }

  #brand-atom.animated {
    -webkit-animation: logo-spin 3500ms 1 cubic-bezier(.17,.67,.34,1.1);
    animation: logo-spin 3500ms 1 cubic-bezier(.17,.67,.34,1.1);
  }

  /* custom button : circle mask appear*/
html{
    --diameter: 0px;
}

.circleAppearClass {
	position: relative;
	z-index: 1;
	border-radius: 100vw;
	transition: all .3s ease;
	overflow: hidden;
}

.circleAppearSpan {
	position: absolute;
    border-radius: 50%;
    height: 0px;
    width: 0px;
    background-color: var(--e-global-color-primary);
    transition: width 0.6s ease-in-out, height 0.6s ease-in-out;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.circleAppearClass:hover .circleAppearSpan{
		height: var(--diameter);
        width: var(--diameter);
}