/* media paletta wireframe :: 2023.02.16. v1.1 */


/* minden blokkra érvényes paraméter */
div[class*="col"] {
    float: left;
}
div[class*="box"] {
    float: left;
	text-align: center;
	margin-bottom: 10px;
}

/* S */
@media only screen and (max-width: 600px) {

    .wrapper {
        margin: 0;
        width: 100vw;    
    }

    .col-12-s {
        width: 96vw;
    }

    .col-11-s {
        width: 88vw;
    }

    .col-10-s {
        width: 80vw;
    }

    .col-9-s {
        width: 72vw;
    }

    .col-8-s {
        width: 64vw;
    }

    .col-7-s {
        width: 56vw;
    }

    .col-6-s {
        width: 48vw;
    }

    .col-5-s {
        width: 40vw;
    }

    .col-4-s {
        width: 32vw;
    }

    .col-3-s {
        width: 24vw;
    }

    .col-2-s {
        width: 16vw;
    }

    .col-1-s {
        width: 8vw;
    }

    .col-0-s {
        width: 0vw;
    }
	
	.box-12-s {
        width: 100%;
    }

    .box-11-s {
        width: 91.6666%;
    }

    .box-10-s {
        width: 83.3333%;
    }

    .box-9-s {
        width: 75%;
    }

    .box-8-s {
        width: 66.6666%;
    }

    .box-7-s {
        width: 58.3333%;
    }

    .box-6-s {
        width: 50%;
    }

    .box-5-s {
        width: 41.6666%;
    }

    .box-4-s {
        width: 33.3333%;
    }

    .box-3-s {
        width: 25%;
    }

    .box-2-s {
        width: 16.6%;
    }

    .box-1-s {
        width: 8.3333%;
    }

    .box-0-s {
        width: 0%;
    }
}

/* M */
@media only screen and (min-width: 600px) {
    .col-12-m {
        width: 96vw;
    }

    .col-11-m {
        width: 88vw;
    }

    .col-10-m {
        width: 80vw;
    }

    .col-9-m {
        width: 72vw;
    }

    .col-8-m {
        width: 64vw;
    }

    .col-7-m {
        width: 56vw;
    }

    .col-6-m {
        width: 48vw;
    }

    .col-5-m {
        width: 40vw;
    }

    .col-4-m {
        width: 32vw;
    }

    .col-3-m {
        width: 24vw;
    }

    .col-2-m {
        width: 16vw;
    }

    .col-1-m {
        width: 8vw;
    }

    .box-12-m {
        width: 100%;
    }

    .box-11-m {
        width: 91.6666%;
    }

    .box-10-m {
        width: 83.3333%;
    }

    .box-9-m {
        width: 75%;
    }

    .box-8-m {
        width: 66.6666%;
    }

    .box-7-m {
        width: 58.3333%;
    }

    .box-6-m {
        width: 50%;
    }

    .box-5-m {
        width: 41.6666%;
    }

    .box-4-m {
        width: 33.3333%;
    }

    .box-3-m {
        width: 25%;
    }

    .box-2-m {
        width: 16.6%;
    }

    .box-1-m {
        width: 8.3333%;
    }	
}

/* L */
@media only screen and (min-width: 768px) {
    .col-12-l {
        width: 96vw;
    }

    .col-11-l {
        width: 88vw;
    }

    .col-10-l {
        width: 80vw;
    }

    .col-9-l {
        width: 72vw;
    }

    .col-8-l {
        width: 64vw;
    }

    .col-7-l {
        width: 56vw;
    }

    .col-6-l {
        width: 48vw;
    }

    .col-5-l {
        width: 40vw;
    }

    .col-4-l {
        width: 32vw;
    }

    .col-3-l {
        width: 24vw;
    }

    .col-2-l {
        width: 16vw;
    }

    .col-1-l {
        width: 8vw;
    }

    .box-12-l {
        width: 100%;
    }

    .box-11-l {
        width: 91.6666%;
    }

    .box-10-l {
        width: 83.3333%;
    }

    .box-9-l {
        width: 75%;
    }

    .box-8-l {
        width: 66.6666%;
    }

    .box-7-l {
        width: 58.3333%;
    }

    .box-6-l {
        width: 50%;
    }

    .box-5-l {
        width: 41.6666%;
    }

    .box-4-l {
        width: 33.3333%;
    }

    .box-3-l {
        width: 25%;
    }

    .box-2-l {
        width: 16.6%;
    }

    .box-1-l {
        width: 8.3333%;
    }	
}

/* XL */
@media only screen and (min-width: 992px) {
    .col-12-xl {
        width: 96vw;
    }

    .col-11-xl {
        width: 88vw;
    }

    .col-10-xl {
        width: 80vw;
    }

    .col-9-xl {
        width: 72vw;
    }

    .col-8-xl {
        width: 64vw;
    }

    .col-7-xl {
        width: 56vw;
    }

    .col-6-xl {
        width: 48vw;
    }

    .col-5-xl {
        width: 40vw;
    }

    .col-4-xl {
        width: 32vw;
    }

    .col-3-xl {
        width: 24vw;
    }

    .col-2-xl {
        width: 16vw;
    }

    .col-1-xl {
        width: 8vw;
    }
	
    .box-12-xl {
        width: 100%;
    }

    .box-11-xl {
        width: 91.6666%;
    }

    .box-10-xl {
        width: 83.3333%;
    }

    .box-9-xl {
        width: 75%;
    }

    .box-8-xl {
        width: 66.6666%;
    }

    .box-7-xl {
        width: 58.3333%;
    }

    .box-6-xl {
        width: 50%;
    }

    .box-5-xl {
        width: 41.6666%;
    }

    .box-4-xl {
        width: 33.3333%;
    }

    .box-3-xl {
        width: 25%;
    }

    .box-2-xl {
        width: 16.6%;
    }

    .box-1-xl {
        width: 8.3333%;
    }	
}

/* XXL */
@media only screen and (min-width: 1200px) {
    .col-12-xxl {
        width: 96vw;
    }

    .col-11-xxl {
        width: 88vw;
    }

    .col-10-xxl {
        width: 80vw;
    }

    .col-9-xxl {
        width: 72vw;
    }

    .col-8-xxl {
        width: 64vw;
    }

    .col-7-xxl {
        width: 56vw;
    }

    .col-6-xxl {
        width: 48vw;
    }

    .col-5-xxl {
        width: 40vw;
    }

    .col-4-xxl {
        width: 32vw;
    }

    .col-3-xxl {
        width: 24vw;
    }

    .col-2-xxl {
        width: 16vw;
    }

    .col-1-xxl {
        width: 8vw;
    }
	
    .box-12-xxl {
        width: 100%;
    }

    .box-11-xxl {
        width: 91.6666%;
    }

    .box-10-xxl {
        width: 83.3333%;
    }

    .box-9-xxl {
        width: 75%;
    }

    .box-8-xxl {
        width: 66.6666%;
    }

    .box-7-xxl {
        width: 58.3333%;
    }

    .box-6-xxl {
        width: 50%;
    }

    .box-5-xxl {
        width: 41.6666%;
    }

    .box-4-xxl {
        width: 33.3333%;
    }

    .box-3-xxl {
        width: 25%;
    }

    .box-2-xxl {
        width: 16.6%;
    }

    .box-1-xxl {
        width: 8.3333%;
    }	
}

/* ALL SIZE */

.col-12 {
    width: 96vw;
}

.col-11 {
    width: 88vw;
}

.col-10 {
    width: 80vw;
}

.col-9 {
    width: 72vw;
}

.col-8 {
    width: 64vw;
}

.col-7 {
    width: 56vw;
}

.col-6 {
    width: 48vw;
}

.col-5 {
    width: 40vw;
}

.col-4 {
    width: 32vw;
}

.col-3 {
    width: 24vw;
}

.col-2 {
    width: 16vw;
}

.col-1 {
    width: 8vw;
}

.col-0 {
    width: 0px;
  }

.box-12 {
    width: 100%;
}

.box-11 {
    width: 91.6666%;
}

.box-10 {
    width: 83.33333%;
}

.box-9 {
    width: 75%;
}

.box-8 {
    width: 66.6666%;
}

.box-7 {
    width: 58.3333%;
}

.box-6 {
    width: 50%;
}

.box-5 {
    width: 41.6666%;
}

.box-4 {
    width: 33.3333%;
}

.box-3 {
    width: 25%;
}

.box-2 {
    width: 16.6666%;
}

.box-1 {
    width: 8.3333%;
}

.box-0 {
    width: 0px;
  }