/* HTML-Grundeinstellungen */

@font-face {
    font-family: 'I-am-online-with-u';
    src:url('I-am-online-with-u.ttf.woff') format('woff'),
        url('I-am-online-with-u.ttf.svg#I-am-online-with-u') format('svg'),
        url('I-am-online-with-u.ttf.eot'),
        url('I-am-online-with-u.ttf.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
}

html, body {
	padding: 0;
	background: #EEEEEE fixed;
	background: -webkit-linear-gradient(#FFFFFF, #CCCCCC 60%) fixed;
	background: -o-linear-gradient(#FFFFFF, #CCCCCC 60%) fixed;
	background: -moz-linear-gradient(#FFFFFF, #CCCCCC 60%) fixed;
	background: linear-gradient(#FFFFFF, #CCCCCC 60%) fixed;
/* 	background-image: url("Abstract_blue_background.jpg"); */
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: 100% 100%;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 14px !important;
	line-height: 17px;
	color: #333333;
}

.iamonline {
	font-family: 'I-am-online-with-u';
}

img {
	border: 0px none;
}

a, a h2 {
	text-decoration: none;
	color: #333333;
}

a:hover, a:hover h2 {
	text-decoration: underline;
}

p {
	margin: 0;
	color: #333333;
	font-weight: bolder;
	font-size: 14px;
}
#wrapper {
	margin: 0 auto;
	position: relative;
}

#content {
	float: left;
	position: relative;
	top: 160px;
}

@media screen and ( min-width: 40px ) {
	@viewport {
		zoom: 0.5; 
	}
	#wrapper {
		max-width: 480px;
	}
	#inhalt {
		top: 90px;
	}
}

@media screen and ( min-width: 601px ) and ( max-width: 992px ) {
	@viewport {
		zoom: 0.8; 
	}
	#wrapper {
		max-width: 960px;
	}
	#inhalt {
		top: 130px;
	}
}

@media screen and ( min-width: 993px ) {
	@viewport {
		zoom: 1.0; 
	}
	body {
		/*background-image: url("https://www.desktopbackground.org/p/2015/12/20/1060618_free-winter-christmas-day-backgrounds-for-powerpoint-christmas_1600x1200_h.jpg");*/
	}
	#wrapper {
		max-width: 1400px;
	}
	#inhalt {
		top: 155px;
	}
}

#sidebar {
	width: 240px;
	float: right;
	position: relative;
	top: 160px;
}

/*#particles-js {
	position: fixed;
	width: 100%;
	height: 100%;
	background: linear-gradient(to bottom, rgba(117, 114, 113, 0.8) 10%, rgba(40, 49, 77, 0.8) 30%, rgba(29, 35, 71, 0.8) 50%, rgba(19, 25, 28, 0.8) 80%, rgba(15, 14, 14, .8) 100%), url(https://38.media.tumblr.com/tumblr_m00c3czJkM1qbukryo1_500.gif);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
}*/

span.ic {
	height: 25px;
	width: 25px;
	float: left;
}

span.ic.icons1 {
    background: url(/kegeln2.png) no-repeat -10px -36px;
}

span.ic.icons2 {
    background: url(/kegeln2.png) no-repeat -35px -36px;
}

span.ic.icons3 {
    background: url(/kegeln2.png) no-repeat -65px -36px;
}

span.ic.icons4 {
    background: url(/kegeln2.png) no-repeat -10px -11px;
}

span.ic.icons5 {
    background: url(/kegeln2.png) no-repeat -35px -11px;
}

span.ic.icons6 {
    background: url(/kegeln2.png) no-repeat -65px -11px;
}

span.ic.icon1 {
    background: url(/kegeln3.png) no-repeat -10px -67px;
}

span.ic.icon2 {
    background: url(/kegeln3.png) no-repeat -119px -11px;
}

span.ic.icon3 {
    background: url(/kegeln3.png) no-repeat -92px -11px;
}

span.ic.icon4 {
    background: url(/kegeln3.png) no-repeat -65px -65px;
}

span.ic.icon5 {
    background: url(/kegeln3.png) no-repeat -92px -65px;
}

span.ic.icon6 {
    background: url(/kegeln3.png) no-repeat -118px -37px;
}

span.ic.icon7 {
    background: url(/kegeln3.png) no-repeat -119px -65px;
}

span.ic.icon8 {
    background: url(/kegeln3.png) no-repeat -38px -65px;
}