@charset "UTF-8" ;
	.svg-outer {
		background-color : #ffffff ;
	}
	.svg-wrap {
		width : 100% ;
		background-color : #ffffff ;
		transform : scale( 50% , 50% ) ;
		opacity : 1 ;
		transition : .25s all ;
	}
	.svg-wrap.white {
		opacity : 0 ;
		transition : .25s all ;
	}
	.rect {
		fill : #ffffff ;
	}
	g {
		position : relative ;
	}
	.g1 {
		z-index : 6 ;
	}
	.g2 {
		z-index : 7 ;
		animation : revelation .5s ease-in both ;
		animation-delay : 0.65s ;
	}
	.g3 {
		z-index : 8 ;
	}
	 path {
		stroke-width : 0.5 ;
	}
	.path1 {
		fill : #0099ff ;
		stroke : #ffffff ;
	}
	.path2 {
		fill : #ffffff ;
		stroke : #ffffff ;
	}
	.path3 {
		fill : transparent ;
		stroke : #ffffff ;
	}
	.path1 , .path2 , .path3 {
		animation : stroking 3s ease-in both ;
		animation-delay : .25s ;
		animation-fill-mode : forwards ;
	}
	.bottom {
		width : 0 ;
		height : 7.5px ;
		background-color : #0099ff ;
		position : fixed ;
		bottom : 0 ;
		animation : growing 1.5s ease-in both ;
		animation-delay : .1s ;
	}
	@keyframes revelation {
		100% {
			transform : translateY( -100% ) ;
		}
	}
	@keyframes stroking {
		0% {
			stroke : #0099ff ;
			stroke-dashoffset : 1000px ;
			stroke-dasharray : 1000px ;
		}
		100% {
			stroke : #0099ff ;
			stroke-dashoffset : 0 ;
		}
	}
	@keyframes growing {
		90% {
			width : 100% ;
			opacity : 1 ;
		}
		100% {
			width : 100% ;
			opacity : 0 ;
		}
	}