/*
* NuedGrid is al simple lightweight grid with no content styling within.
* you can use it in these way. 1st wrap it with a .row or .row-full-widht class
* then you can ues a 16 colum grid called like .c1, .c2, ....c16
* special widths are .half, .fifth , .quarter, .third and .full 
*
*/

/*Reset*/
* {
	margin:0;
	padding:0;
	border:0;
	/*outline:0;*/
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display:block;
}
html {
	height: 100%;
}
.row:after, .clear {
	clear: both;
}
img {
	-ms-interpolation-mode: bicubic;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a, p, h1, h2, h3, h4, h5, h6, span, li {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	text-rendering: optimizeLegibility;
}
/*.row, .row-full-width, div, nav, section {*/
.row, .row-full-width, nav, section {
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
 *zoom: 1;
}
.row {
	position: relative;
	width: 100%;
	margin: 0 auto;
	max-width: 90%;
}
.row-full-width {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 100%;
}
.row:before, .row:after, .row-full-width:before, .row-full-width:after {
	content: " ";
	display: table;
}
.row .row, .row-full-width .row {
	width: auto;
}
.c1, .c2, .c3, .c4, .quarter, .c5, .c6, .c7, .c8, .half, .fifth, .c9, .c10, .c11, .c12, .c13, .c14, .c15, .c16, .c17, .c18, .c19, .c20, .c21, .c22, .c23, .c24 .third {
	position: relative;
	width: 100%;
	float: left;
	display: block;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
/* 24 x Grid */
.c1 {
	position: relative;
	width: 4.164%;
}
.c2 {
	position: relative;
	width: 8.332%;
}
.c3 {
	position: relative;
	width: 12.49%;
}
.c4 {
	position: relative;
	width: 16.65%;
}
.c5 {
	position: relative;
	width: 20.83%;
}
.c6 {
	position: relative;
	width: 24.97%;
}
.c7 {
	position: relative;
	width: 29.16%;
}
.c8 {
	position: relative;
	width: 33.332%;
}
.c9 {
	position: relative;
	width: 37.492%;
}
.c10 {
	position: relative;
	width: 41.662%;
}
.c11 {
	position: relative;
	width: 45.832%;
}
.c12 {
	position: relative;
	width: 49.968%;
}
.c13 {
	position: relative;
	width: 54.16%;
}
.c14 {
	position: relative;
	width: 58.33%;
}
.c15 {
	position: relative;
	width: 62.49%;
}
.c16 {
	position: relative;
	width: 66.662%;
}
.c17 {
	position: relative;
	width: 70.83%;
}
.c18 {
	position: relative;
	width: 74.99%;
}
.c19 {
	position: relative;
	width: 79.16%;
}
.c20 {
	position: relative;
	width: 83.33%;
}
.c21 {
	position: relative;
	width: 87.49%;
}
.c22 {
	position: relative;
	width: 91.66%;
}
.c23 {
	position: relative;
	width: 95.83%;
}
.c24 {
	position: relative;
	width: 100%;
}
.full {
	position: relative;
	width: 100%;
}
.half {
	position: relative;
	width: 50%;
}
.third {
	position: relative;
	width: 33.332%;
}
.quarter {
	position: relative;
	width: 25%;
}
.fifth {
	position: relative;
	width: 20%;
}
.center {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	float: none !important;
}
.text-center {
	text-align: center;
}
.fl, .alignleft {
	float: left;
}
.fr, .alignright {
	float: right;
}
.fb div {
	border: 1px solid #ff00ff;
}
/*########## Responsiv part ################### */
.mobil-hidden, .hidden {
	display: none;
}
/* Smartphones (portrait and landscape) ----------- */
/*@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {*/
  @media only screen and (max-width : 480px) {
.phone50 {
	position: relative;
	width: 50%;
}
.phone100 {
	position: relative;
	width: 100%;
}
}
/* iPads (portrait and landscape) ----------- */
/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {*/
@media only screen and (max-width : 1024px) and (min-width : 481px) {
.pad50 {
	position: relative;
	width: 50%;
	float: left;
}
.pad100 {
	position: relative;
	width: 100%;
}
}