﻿.ellibot-column{
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display:  flex;
	flex-wrap: wrap;
    flex-direction: row;
	-ms-flex-flow: wrap;
	-webkit-flex-flow: wrap;
	flex-flow: wrap;
}

.ellibot-column-box .ellibot-column-inside p:first-child,
.ellibot-column-box .ellibot-column-inside h1:first-child,
.ellibot-column-box .ellibot-column-inside h2:first-child,
.ellibot-column-box .ellibot-column-inside h3:first-child,
.ellibot-column-box .ellibot-column-inside h4:first-child,
.ellibot-column-box .ellibot-column-inside h5:first-child{margin-top: 0;}
.ellibot-column-box .ellibot-column-inside p:last-child,
.ellibot-column-box .ellibot-column-inside ul:last-child,
.ellibot-column-box .ellibot-column-inside ol:last-child{margin-bottom: 0;}

.ellibot-column-box{
	margin:22.5px 0px;
	max-width:100%;
	float:left; /* Fix för < IE 10 */
}
.ellibot-column-box .ellibot-column-inside{
	height:100%;
	max-width:100%;
}


/* Kolumn 1*/

.ellibot-column-box.ellibot-column-1{
	width:100%;
}
.ellibot-column-box.ellibot-column-1 .ellibot-column-inside{
	margin-left:0;
	margin-right:0;
}


/* Kolumn 2 (45px * 1 mellanrum = 45px | 45px / 2 block = 22.5px) */

.ellibot-column-box.ellibot-column-2{
	width:50%;
}
.ellibot-column-box.ellibot-column-2:nth-child(2n+1) .ellibot-column-inside{
	margin-left:0;
	margin-right:22.5px;
}
.ellibot-column-box.ellibot-column-2:nth-child(2n+2) .ellibot-column-inside{
	margin-left:22.5px;
	margin-right:0px;
}


/* Kolumn 2-first */
.ellibot-column-box.ellibot-column-2.ellibot-column-first:first-of-type{
	width:66.666666%;
}
.ellibot-column-box.ellibot-column-2.ellibot-column-first{
	width:33.333333%;
}
/* Kolumn 2-second */
.ellibot-column-box.ellibot-column-2.ellibot-column-second:last-of-type{
	width:66.666666%;
}
.ellibot-column-box.ellibot-column-2.ellibot-column-second{
	width:33.333333%;
}



/* Kolumn 3 (45px * 2 mellanrum = 90px | 90px / 3 block = 30px | 30px / 2 mellanrum = 15px) */

.ellibot-column-box.ellibot-column-3{
	width:33.333333%;
}
.ellibot-column-box.ellibot-column-3:nth-child(3n+1) .ellibot-column-inside{
	margin-left:0;
	margin-right:30px;
}
.ellibot-column-box.ellibot-column-3:nth-child(3n+2) .ellibot-column-inside{
	margin-left:15px;
	margin-right:15px;
}
.ellibot-column-box.ellibot-column-3:nth-child(3n+3) .ellibot-column-inside{
	margin-left:30px;
	margin-right:0px;
}


/* Kolumn 4 (45px * 3 mellanrum = 135px | 135px / 4 block = 33.75px | 33.75px / 3 mellanrum = 11.25px | 33.75px - 11.25px = 22.5px) */

.ellibot-column-box.ellibot-column-4{
	width:25%;
}
.ellibot-column-box.ellibot-column-4:nth-child(4n+1) .ellibot-column-inside{
	margin-left:0;
	margin-right:33.75px;
}
.ellibot-column-box.ellibot-column-4:nth-child(4n+2) .ellibot-column-inside{
	margin-left:11.25px;
	margin-right:22.5px;
}
.ellibot-column-box.ellibot-column-4:nth-child(4n+3) .ellibot-column-inside{
	margin-left:22.5px;
	margin-right:11.25px;
}
.ellibot-column-box.ellibot-column-4:nth-child(4n+4) .ellibot-column-inside{
	margin-left:33.75px;
	margin-right:0px;
}


/* Kolumn 5 (45px * 4 mellanrum = 180px | 180px / 5 block = 36px | 36px / 4 mellanrum = 9px | 36px - 9px = 27px | 36px / 2 = 18px) */

.ellibot-column-box.ellibot-column-5{
	width:20%;
}
.ellibot-column-box.ellibot-column-5:nth-child(5n+1) .ellibot-column-inside{
	margin-left:0;
	margin-right:36px;
}
.ellibot-column-box.ellibot-column-5:nth-child(5n+2) .ellibot-column-inside{
	margin-left:9px;
	margin-right:27px;
}
.ellibot-column-box.ellibot-column-5:nth-child(5n+3) .ellibot-column-inside{
	margin-left:18px;
	margin-right:18px;
}
.ellibot-column-box.ellibot-column-5:nth-child(5n+4) .ellibot-column-inside{
	margin-left:27px;
	margin-right:9px;
}
.ellibot-column-box.ellibot-column-5:nth-child(5n+5) .ellibot-column-inside{
	margin-left:36px;
	margin-right:0px;
}


/* Platta */
@media only screen and (max-width: 1024px){
	.ellibot-column-box.ellibot-column-2.ellibot-column-first,
	.ellibot-column-box.ellibot-column-2.ellibot-column-first:first-of-type,
	.ellibot-column-box.ellibot-column-2.ellibot-column-second,
	.ellibot-column-box.ellibot-column-2.ellibot-column-second:last-of-type,
	.ellibot-column-box.ellibot-column-3,
	.ellibot-column-box.ellibot-column-4,
	.ellibot-column-box.ellibot-column-5{
		width:50%;
	}
	.ellibot-column-box.ellibot-column-3:nth-child(2n+1) .ellibot-column-inside, .ellibot-column-box.ellibot-column-4:nth-child(2n+1) .ellibot-column-inside, .ellibot-column-box.ellibot-column-5:nth-child(2n+1) .ellibot-column-inside{
		margin-left:0;
		margin-right:22.5px;
	}
	.ellibot-column-box.ellibot-column-3:nth-child(2n+2) .ellibot-column-inside, .ellibot-column-box.ellibot-column-4:nth-child(2n+2) .ellibot-column-inside, .ellibot-column-box.ellibot-column-5:nth-child(2n+2) .ellibot-column-inside{
		margin-left:22.5px;
		margin-right:0;
	}
}

/* Mobil */
@media only screen and (max-width: 615px){
	.ellibot-column-box.ellibot-column-1,
	.ellibot-column-box.ellibot-column-2,
	.ellibot-column-box.ellibot-column-2.ellibot-column-first,
	.ellibot-column-box.ellibot-column-2.ellibot-column-first:first-of-type,
	.ellibot-column-box.ellibot-column-2.ellibot-column-second,
	.ellibot-column-box.ellibot-column-2.ellibot-column-second:last-of-type,
	.ellibot-column-box.ellibot-column-3,
	.ellibot-column-box.ellibot-column-4,
	.ellibot-column-box.ellibot-column-5{
		width:100%;
		float:none; /* Fix för < IE 10 */
		clear:both; /* Fix för < IE 10 */
	}
	.ellibot-column-box .ellibot-column-inside{
		margin-left:0 !important;
		margin-right:0 !important;
	}
}