@charset "UTF-8";
/* CSS Document */

/*.logo-type {
	position:relative;
	z-index:50;
	width:190px;
	height:116px;
}

.logo-type h1 {
	color:#b2b2b2;
}*/

.logo-orbit {
	width: 100px;
	height: 100px;
	float: left;
	top: -25px;
	position: relative;
}


@media screen and (max-width: 1023px) {
	.logo-orbit {
		top: -25px;

	}
}

.Atom {
  width: 100px;
  height: 100px;
  position: relative;
  /*background-color: #f2f2f2;*/
  border: solid 0px #78CDF4;
  border-radius: 50%;
  padding: 0px;
  z-index:100;
}

.Atom-nucleus,
.Atom-nucleus:before {
  position: absolute;
  border: solid 4px #78CDF4;
}

.Atom-nucleus {
  display: block;
  content: '';
  width: 20px;
  height: 20px;
  margin-left: -12px;
  margin-top: -12px;
  border-radius: 50%;
  top: 50%;
  left: 50%;
}

.Atom-nucleus:before {
  display: block;
  content: '';
  width: 26px;
  height: 26px;
  margin-left: -18px;
  margin-top: -18px;
  border-radius: 50%;
  top: 10px;
  left: 10px;
  opacity: 0.15;
  border: 0;
}

.Atom-orbit {
  position: absolute;
  width: 100px;
  height: 100px;
  border: solid 4px transparent;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.Atom-orbit--visible {
  border-radius: 50%;
  border-color: white;
  opacity:0.1;
}

.Atom-electron {
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}
.Atom-electron:before {
  display: block;
  content: '';
  width: 20px;
  height: 20px;
  margin-left: -12px;
  margin-top: -12px;
  border-radius: 50%;
  position: absolute;
  top: 75px;
  left: 75px;
}
.Atom-electron:after {
  display: block;
  content: '';
  width: 16px;
  height: 16px;
  margin-left: -8px;
  margin-top: -8px;
  border-radius: 50%;
  position: absolute;
  top: 75px;
  left: 75px;
  border-color: rgba(255, 255, 255, 0.4);
}

.Atom-orbit--top.Atom-orbit--visible {
  -webkit-transform: rotateZ(0deg) rotateY(73deg);
          transform: rotateZ(0deg) rotateY(73deg);
}

.Atom-orbit--top.Atom-orbit--foreground {
  -webkit-transform: translateZ(100px) rotateZ(0deg) rotateY(73deg);
          transform: translateZ(100px) rotateZ(0deg) rotateY(73deg);
}

.Atom-orbit--top .Atom-electron:before {
  width: 25px;
  height: 25px;
}

@-webkit-keyframes rotate-top {
  0% {
    -webkit-transform: rotate(0deg) translate(-55px) rotate(0deg);
            transform: rotate(0deg) translate(-55px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg) translate(-55px) rotate(-360deg);
            transform: rotate(360deg) translate(-55px) rotate(-360deg);
  }
}

@keyframes rotate-top {
  0% {
    -webkit-transform: rotate(0deg) translate(-36px) rotate(0deg);
            transform: rotate(0deg) translate(-36px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg) translate(-36px) rotate(-360deg);
            transform: rotate(360deg) translate(-36px) rotate(-360deg);
  }
}
.Atom-orbit--top .Atom-electron {
  -webkit-animation: rotate-top infinite linear;
          animation: rotate-top infinite linear;
  -webkit-animation-duration: 1.9s;
          animation-duration: 1.9s;
}
.Atom-orbit--top .Atom-electron:before, .Atom-orbit--top .Atom-electron:after {
  -webkit-transform: rotateY(-73deg) rotateZ(0deg);
          transform: rotateY(-73deg) rotateZ(0deg);
}
.Atom-orbit--top .Atom-electron:before {
 /* background: -webkit-linear-gradient(270deg, #fad161 0%, #f99337 100%);
  background: linear-gradient(-180deg, #fad161 0%, #f99337 100%);*/
  border:3px solid #9C83BB;
  opacity: 1;
}

.Atom-orbit--top .Atom-electron:before {
  display: block;
  content: '';
  width: 14px;
  height: 14px;
	margin-left: -55px;
  margin-top: -29px;
  border-radius: 50%;
  position: absolute;
	top: 64px;
	left: 69px;
}

.Atom-orbit--top .Atom-electron:before {
  display: block;
  content: '';
  width: 14px;
  height: 14px;
	margin-left: -55px;
  margin-top: -29px;
  border-radius: 50%;
  position: absolute;
	top: 64px;
	left: 69px;
}


.Atom-orbit--top .Atom-electron:after {
 /* background: -webkit-linear-gradient(270deg, #fad161 0%, #f99337 100%);
  background: linear-gradient(-180deg, #fad161 0%, #f99337 100%);*/
  border:0px solid #9C83BB;
}

.Atom-orbit--left.Atom-orbit--visible {
  -webkit-transform: rotateZ(90deg) rotateY(73deg);
          transform: rotateZ(90deg) rotateY(73deg);
}

.Atom-orbit--left.Atom-orbit--foreground {
  -webkit-transform: translateZ(100px) rotateZ(90deg) rotateY(73deg);
          transform: translateZ(100px) rotateZ(90deg) rotateY(73deg);
}

.Atom-orbit--left .Atom-electron:before {
  width: 16px;
  height: 16px;
}

@-webkit-keyframes rotate-left {
  0% {
    -webkit-transform: rotate(60deg) translate(-35px) rotate(-60deg);
            transform: rotate(60deg) translate(-35px) rotate(-60deg);
  }
  100% {
    -webkit-transform: rotate(420deg) translate(-35px) rotate(-420deg);
            transform: rotate(420deg) translate(-35px) rotate(-420deg);
  }
}

@keyframes rotate-left {
  0% {
    -webkit-transform: rotate(60deg) translate(36px) rotate(-60deg);
            transform: rotate(60deg) translate(36px) rotate(-60deg);
  }
  100% {
    -webkit-transform: rotate(420deg) translate(36px) rotate(-420deg);
            transform: rotate(420deg) translate(36px) rotate(-420deg);
  }
}
.Atom-orbit--left .Atom-electron {
  -webkit-animation: rotate-left infinite linear;
          animation: rotate-left infinite linear;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}
.Atom-orbit--left .Atom-electron:before, .Atom-orbit--left .Atom-electron:after {
  -webkit-transform: rotateY(-73deg) rotateZ(60deg);
          transform: rotateY(-73deg) rotateZ(60deg);
}
.Atom-orbit--left .Atom-electron:before {
  /*background: -webkit-linear-gradient(270deg, #51ecc2 0%, #12ccdb 100%);
  background: linear-gradient(-180deg, #51ecc2 0%, #12ccdb 100%);*/
  opacity: 1;
  border:3px solid #BED000;
}
.Atom-orbit--left .Atom-electron:after {
  /*background: -webkit-linear-gradient(270deg, #51ecc2 0%, #12ccdb 100%);
  background: linear-gradient(-180deg, #51ecc2 0%, #12ccdb 100%);*/
}

/* Green */
.Atom-orbit--left .Atom-electron:before {
  display: block;
  content: '';
  width: 14px;
  height: 14px;
	margin-left: -15px;
  margin-top: 0px;
  border-radius: 50%;
  position: absolute;
  top: 39px;
  left: 39px;
}

.Atom-orbit--left .Atom-electron:before {
  display: block;
  content: '';
  width: 14px;
  height: 14px;
	margin-left: -15px;
  margin-top: 0px;
  border-radius: 50%;
  position: absolute;
  top: 39px;
  left: 39px;
}


/* Pink */
.Atom-orbit--right.Atom-orbit--visible {
  -webkit-transform: rotateZ(5deg) rotateY(73deg);
          transform: rotateZ(5deg) rotateY(73deg);
}

.Atom-orbit--right.Atom-orbit--foreground {
  -webkit-transform: translateZ(100px) rotateZ(5deg) rotateY(73deg);
          transform: translateZ(100px) rotateZ(5deg) rotateY(73deg);
}

.Atom-orbit--right .Atom-electron:before {
  width: 10px;
  height: 10px;
}

@-webkit-keyframes rotate-right {
  0% {
    -webkit-transform: rotate(120deg) translate(-45px) rotate(-120deg);
            transform: rotate(120deg) translate(-45px) rotate(-120deg);
  }
  100% {
    -webkit-transform: rotate(480deg) translate(-45px) rotate(-480deg);
            transform: rotate(480deg) translate(-45px) rotate(-480deg);
  }
}

@keyframes rotate-right {
  0% {
    -webkit-transform: rotate(120deg) translate(36px) rotate(-120deg);
            transform: rotate(120deg) translate(36px) rotate(-120deg);
  }
  100% {
    -webkit-transform: rotate(480deg) translate(36px) rotate(-480deg);
            transform: rotate(480deg) translate(36px) rotate(-480deg);
  }
}
.Atom-orbit--right .Atom-electron {
  -webkit-animation: rotate-right infinite linear;
          animation: rotate-right infinite linear;
  -webkit-animation-duration: 2.3s;
          animation-duration: 2.3s;
}

.Atom-orbit--right .Atom-electron:before, .Atom-orbit--right .Atom-electron:after {
  -webkit-transform: rotateY(-73deg) rotateZ(-60deg);
          transform: rotateY(-73deg) rotateZ(-60deg);
}
.Atom-orbit--right .Atom-electron:before {
  /*background: -webkit-linear-gradient(270deg, #0adef3 0%, #45beff 100%);
  background: linear-gradient(-180deg, #0adef3 0%, #45beff 100%);*/
  opacity: 1;
  border:3px solid #F5B7D4;
}
.Atom-orbit--right .Atom-electron:after {
 /* background: -webkit-linear-gradient(270deg, #0adef3 0%, #45beff 100%);
  background: linear-gradient(-180deg, #0adef3 0%, #45beff 100%);*/
}

.Atom-orbit--right .Atom-electron:before {
  display: block;
  content: '';
  width: 13px;
  height: 13px;
  margin-left: -30px;
  margin-top: 10px;
  border-radius: 50%;
  position: absolute;
	top: 33px;
	left: 42px;
}

.Atom-orbit--right .Atom-electron:before {
  display: block;
  content: '';
  width: 13px;
  height: 13px;
  margin-left: -30px;
  margin-top: 10px;
  border-radius: 50%;
  position: absolute;
	top: 33px;
	left: 42px;
}



.Atom-orbit--bottom.Atom-orbit--visible {
  -webkit-transform: rotateZ(0deg) rotateY(73deg);
          transform: rotateZ(0deg) rotateY(73deg);
}

.Atom-orbit--bottom.Atom-orbit--foreground {
  -webkit-transform: translateZ(100px) rotateZ(50deg) rotateY(73deg);
          transform: translateZ(100px) rotateZ(50deg) rotateY(73deg);
}

.Atom-orbit--bottom .Atom-electron:before {
  width: 16px;
  height: 16px;
}

@-webkit-keyframes rotate-bottom {
  0% {
    -webkit-transform: rotate(0deg) translate(-55px) rotate(0deg);
            transform: rotate(0deg) translate(-55px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg) translate(-55px) rotate(-360deg);
            transform: rotate(360deg) translate(-55px) rotate(-360deg);
  }
}

@keyframes rotate-bottom {
  0% {
    -webkit-transform: rotate(0deg) translate(-36px) rotate(0deg);
            transform: rotate(0deg) translate(-36px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg) translate(-36px) rotate(-360deg);
            transform: rotate(360deg) translate(-36px) rotate(-360deg);
  }
}
.Atom-orbit--bottom .Atom-electron {
  -webkit-animation: rotate-bottom infinite linear;
          animation: rotate-bottom infinite linear;
  -webkit-animation-duration: 2.5s;
          animation-duration: 2.5s;
}
.Atom-orbit--bottom .Atom-electron:before, .Atom-orbit--top .Atom-electron:after {
  -webkit-transform: rotateY(-73deg) rotateZ(0deg);
          transform: rotateY(-73deg) rotateZ(0deg);
}
.Atom-orbit--bottom .Atom-electron:before {
 /* background: -webkit-linear-gradient(270deg, #fad161 0%, #f99337 100%);
  background: linear-gradient(-180deg, #fad161 0%, #f99337 100%);*/
  border:3px solid #F69F00;
  opacity: 1;
}
.Atom-orbit--bottom .Atom-electron:after {
 /* background: -webkit-linear-gradient(270deg, #fad161 0%, #f99337 100%);
  background: linear-gradient(-180deg, #fad161 0%, #f99337 100%);*/
  border:0px solid #F69F00;
}

.Atom:hover .Atom-orbit--bottom .Atom-electron:before {
  display: block;
  content: '';
  width: 11px;
  height: 11px;
	margin-left: 4px;
  margin-top: -34px;
  border-radius: 50%;
  position: absolute;
	top: 68px;
  left: 15px;
}

.Atom-orbit--bottom .Atom-electron:before {
   display: block;
  content: '';
  width: 11px;
  height: 11px;
	margin-left: 4px;
  margin-top: -34px;
  border-radius: 50%;
  position: absolute;
	top: 68px;
  left: 15px;
}
