.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

.logo-box{
	width: 65%;
	max-width:285px;
	max-height:285px;
	position:relative;
	margin:0 auto;
}

.logo-box:before{
	content: "";
	display: block;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}

.logo-circles{
	position:absolute;
	background-color:#2cdbb9;
	border-radius:50%;
	display:block;
}

.circle-1{
	top:7%;
	left:27%;
	width:4%;
	height:4%;
}

.circle-2{
	top:2%;
	left:33%;
	width:12.3%;
	height:12.3%;
}

.circle-3{
	top:0%;
	left:45%;
	width:7%;
	height:7%;
}

.circle-4{
	top:1.5%;
	left:52.5%;
	width:4%;
	height:4%;
}

.circle-5{
	top:8%;
	left:49.5%;
	width:3%;
	height:3%;
}

.circle-6{
	top:11%;
	left:45%;
	width:4%;
	height:4%;
}

.circle-7{
	top:3.5%;
	left:53.5%;
	width:19%;
	height:19%;
}

.circle-8{
	top:11%;
	left:73%;
	width:4%;
	height:4%;
}

.circle-9{
	top:12%;
	left:19.4%;
	width:16.4%;
	height:16.4%;
}

.circle-10{
	top:16%;
	left:37%;
	width:4%;
	height:4%;
}

.circle-11{
	top:16.4%;
	left:41%;
	width:13%;
	height:13%;
}

.circle-12{
	top:22.4%;
	left:37%;
	width:3%;
	height:3%;
}

.circle-13{
	top:23%;
	left:55%;
	width:4%;
	height:4%;
}

.circle-14{
	top:22%;
	left:67%;
	width:5%;
	height:5%;
}

.circle-15{
	top:15.8%;
	left:73%;
	width:9%;
	height:9%;
}

.circle-16{
	top:26%;
	left:73%;
	width:3%;
	height:3%;
}

.circle-17{
	top:26.4%;
	left:77%;
	width:9%;
	height:9%;
}

.circle-18{
	top:22.6%;
	left:16%;
	width:3%;
	height:3%;
}

.circle-19{
	top:27%;
	left:15%;
	width:6%;
	height:6%;
}

.circle-20{
	top:30%;
	left:22%;
	width:5%;
	height:5%;
}

.circle-21{
	top:30%;
	left:29%;
	width:3.2%;
	height:3.2%;
}

.circle-22{
	top:26.4%;
	left:33.4%;
	width:8%;
	height:8%;
}

.circle-23{
	top:29%;
	left:51%;
	width:7%;
	height:7%;
}

.circle-24{
	top:25.4%;
	left:59%;
	width:8.4%;
	height:8.4%;
}

.circle-25{
	top:30%;
	left:67.4%;
	width:8%;
	height:8%;
}

.circle-26{
	top:35%;
	left:14%;
	width:11%;
	height:11%;
}

.circle-27{
	top:35%;
	left:26%;
	width:11%;
	height:11%;
}

.circle-28{
	top:32.8%;
	left:38.4%;
	width:13%;
	height:13%;
}

.circle-29{
	top:36%;
	left:55%;
	width:15%;
	height:15%;
}

.circle-30{
	top:37.6%;
	left:72%;
	width:14%;
	height:14%;
}

.circle-31{
	top:46.2%;
	left:17%;
	width:13%;
	height:13%;
}

.circle-32{
	top:47%;
	left:31%;
	width:8%;
	height:8%;
}

.circle-33{
	top:47.4%;
	left:41%;
	width:6%;
	height:6%;
}

.circle-34{
	top:45.4%;
	left:49%;
	width:5%;
	height:5%;
}

.circle-35{
	top:50%;
	left:54%;
	width:4%;
	height:4%;
}

.circle-36{
	top:53.2%;
	left:79.2%;
	width:4%;
	height:4%;
}

.circle-37{
	top:56.2%;
	left:29.2%;
	width:5%;
	height:5%;
}

.circle-38{
	top:55%;
	left:35%;
	width:10%;
	height:10%;
}

.circle-39{
	top:54%;
	left:46%;
	width:9%;
	height:9%;
}

.circle-40{
	top:54%;
	left:57%;
	width:6%;
	height:6%;
}

.circle-41{
	top:52.2%;
	left:64.4%;
	width:14.6%;
	height:14.6%;
}

.circle-42{
	top:60.4%;
	left:23.4%;
	width:5%;
	height:5%;
}

.circle-43{
	top:63.2%;
	left:28.4%;
	width:7%;
	height:7%;
}

.circle-44{
	top:69.6%;
	left:35.4%;
	width:4%;
	height:4%;
}

.circle-45{
	top:65%;
	left:40.4%;
	width:11%;
	height:11%;
}

.circle-46{
	top:62%;
	left:52.4%;
	width:13%;
	height:13%;
}

.circle-47{
	top:67.4%;
	left:66%;
	width:4%;
	height:4%;
}

.intro-logo-text{
	position:absolute;
	bottom:0%;
	left:18%;
	width:66%;
}



.circle-1, .circle-6, .circle-11, .circle-16, .circle-21, .circle-26, .circle-31, .circle-36, .circle-41, .circle-46{
	opacity: 0;
    -moz-animation: fadein 0.8s ease-out 0s forwards; /* Firefox */
    -webkit-animation: fadein 0.8s ease-out 0s forwards; /* Safari and Chrome */
    -o-animation: fadein 0.8s ease-out 0s forwards; /* Opera */
    animation: fadein 0.8s ease-out 0s forwards;
    
}

.circle-2, .circle-7, .circle-12, .circle-17, .circle-22, .circle-27, .circle-32, .circle-37, .circle-42, .circle-47{
	opacity: 0;
    -moz-animation: fadein 0.8s ease-out 200ms forwards; /* Firefox */
    -webkit-animation: fadein 0.8s ease-out 200ms forwards; /* Safari and Chrome */
    -o-animation: fadein 0.8s ease-out 200ms forwards; /* Opera */
    animation: fadein 0.8s ease-out 200ms forwards;
}

.circle-3, .circle-8, .circle-13, .circle-18, .circle-23, .circle-28, .circle-33, .circle-38, .circle-43{
	opacity: 0;
    -moz-animation: fadein 0.8s ease-out 400ms forwards; /* Firefox */
    -webkit-animation: fadein 0.8s ease-out 400ms forwards; /* Safari and Chrome */
    -o-animation: fadein 0.8s ease-out 400ms forwards; /* Opera */
    animation: fadein 0.8s ease-out 400ms forwards;
}

.circle-4, .circle-9, .circle-14, .circle-19, .circle-24, .circle-29, .circle-34, .circle-39, .circle-44{
	opacity: 0;
    -moz-animation: fadein 0.8s ease-out 600ms forwards; /* Firefox */
    -webkit-animation: fadein 0.8s ease-out 600ms forwards; /* Safari and Chrome */
    -o-animation: fadein 0.8s ease-out 600ms forwards; /* Opera */
    animation: fadein 0.8s ease-out 600ms forwards;
}

.circle-5, .circle-10, .circle-15, .circle-20, .circle-25, .circle-30, .circle-35, .circle-40, .circle-45{
	opacity: 0;
    -moz-animation: fadein 0.8s ease-out 800ms forwards; /* Firefox */
    -webkit-animation: fadein 0.8s ease-out 800ms forwards; /* Safari and Chrome */
    -o-animation: fadein 0.8s ease-out 800ms forwards; /* Opera */
    animation: fadein 0.8s ease-out 800ms forwards;
}

@keyframes fadein {
    0% {
        opacity:0;
		transform:scale(.3);
    }
	70% {
        opacity:1;
		transform:scale(1.2);
    }
    100% {
        opacity:1;
		transform:scale(1);
    }
}
@-moz-keyframes fadein { /* Firefox */
    0% {
        opacity:0;
		transform:scale(.3);
    }
	70% {
        opacity:1;
		transform:scale(1.2);
    }
    100% {
        opacity:1;
		transform:scale(1);
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    0% {
        opacity:0;
		-webkit-transform: scale(0.3);
    }
	70% {
        opacity:1;
		-webkit-transform: scale(1.2);
    }
    100% {
        opacity:1;
		-webkit-transform: scale(1);
    }
}

@-o-keyframes fadein { /* Safari and Chrome */
    0% {
        opacity:0;
		-o-transform: scale(0.3);
    }
	70% {
        opacity:1;
		-o-transform: scale(1.2);
    }
    100% {
        opacity:1;
		-o-transform: scale(1);
    }
}