/* CSS Document */

body, html { margin:0; padding:0; min-height:100%; min-width:100%;}
#ud_wrapper { max-width:800px; width:90%; margin:0 auto 0 auto;}
#ud_wrapper h2 { position:relative; font-size:40px; text-align:center; width:60%; margin:150px auto 50px auto;}
#ud_wrapper h2::after { content:""; position:absolute; bottom: -20px; left:50%; margin:0 0 0 -25px; width:50px; height:5px; background:#000;}
#ud_wrapper article p { font-size:22px; line-height:35px; color:#666; text-align:justify;}
#ud_wrapper article { margin:30px 0 100px 0;}

/* ######################################################### */
/* ############## Pre Loader ############################### */
/* ######################################################### */

#ud_preloader { 
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100%;
	height:100%;
	z-index:10000;
	background:
		-webkit-linear-gradient(45deg, hsla(227, 87%, 55%, 1) 0%, hsla(227, 87%, 55%, 0) 70%),
		-webkit-linear-gradient(315deg, hsla(200, 95%, 50%, 1) 10%, hsla(200, 95%, 50%, 0) 80%),
		-webkit-linear-gradient(225deg, hsla(203, 90%, 50%, 1) 10%, hsla(203, 90%, 50%, 0) 80%),
		-webkit-linear-gradient(135deg, hsla(227, 95%, 55%, 1) 100%, hsla(227, 95%, 55%, 0) 70%);
	background:
		linear-gradient(45deg, hsla(227, 87%, 55%, 1) 0%, hsla(227, 87%, 55%, 0) 70%),
		linear-gradient(135deg, hsla(200, 95%, 50%, 1) 10%, hsla(200, 95%, 50%, 0) 80%),
		linear-gradient(225deg, hsla(203, 90%, 50%, 1) 10%, hsla(203, 90%, 50%, 0) 80%),
		linear-gradient(315deg, hsla(227, 95%, 55%, 1) 100%, hsla(227, 95%, 55%, 0) 70%);
	}
#ud_preloader .ud_pre_half { background:#111; width:50%; height:100%; position:absolute; top:0; bottom:0;}
#ud_preloader #ud_bg_left { left:0;}
#ud_preloader #ud_bg_right { right:0;}
#ud_preloader #ud_dots { z-index:10001; width:65px; position:absolute; top:90%; left:50%; transform:translateX(-50%) translateY(-50%);}
#ud_preloader #ud_dots p { width:100%; margin:0 0 15px 0; color:#fff; font-size:12px; text-align:center;}
#ud_preloader #ud_dots .ud_dot { animation: infinite 500ms ease-in-out; border-radius:30px; width:15px; height:15px; background:#fff; float:left; margin:0 1.5px 0 0;}
#ud_preloader #ud_dots .ud_dot:last-child { margin:0 0 0 0;}

	@keyframes ud_preloader_1 {
		0% { background:#fff; transform:translateY(0);}
		25% { background: #cce9ff; transform:translateY(-5px);}
		50% { background:#fff; transform:translateY(0);}
	}
	
	@keyframes ud_preloader_2 {
		25% { background:#fff; transform:translateY(0);}
		50% { background:#66bdff; transform:translateY(-5px);}
		75% { background:#fff; transform:translateY(0);}
	}
	
	@keyframes ud_preloader_3 {
		50% { background:#fff; transform:translateY(0);}
		75% { background:#33a7ff; transform:translateY(-5px);}
		100% { background:#fff; transform:translateY(0);}
	}
	
	@keyframes ud_preloader_4 {
		75% { background:#fff; transform:translateY(0);}
		100% { background:#0091ff; transform:translateY(-5px);}
		25% { background:#fff; transform:translateY(0);}
	}
	
#svg4485{
    -webkit-animation-name: willkommen; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 5s; /* Safari 4.0 - 8.0 */
    animation-name: willkommen; 
    animation-duration: 5s;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes willkommen {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Standard syntax */
@keyframes willkommen {
    from {opacity: 0;}
    to {opacity: 1;}
}