* {
    margin: 0;
    padding: 0;
}

body {
    /*font: 100%/1.5em Roboto, sans-serif;*/
}


.container {
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 1140px;
}

.container .cols {
    display: inline;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
}

.container .alpha {margin-left: 0;}
.container .omega {margin-right: 0;}


.container .cols.column1  {width: 55px;}
.container .cols.column2  {width: 150px;}
.container .cols.column3  {width: 245px;}
.container .cols.column4  {width: 340px;}
.container .cols.column5  {width: 435px;}
.container .cols.column6  {width: 530px;}
.container .cols.column7  {width: 625px;}
.container .cols.column8  {width: 720px;}
.container .cols.column9  {width: 815px;}
.container .cols.column10 {width: 910px;}
.container .cols.column11 {width: 1005px;}
.container .cols.column12 {width: 1100px;}

@media only screen and (min-width: 960px) and (max-width: 1160px) {
    .container {width: 960px;}
    .container .cols.column1  {width: 48px;}
    .container .cols.column2  {width: 128px;}
    .container .cols.column3  {width: 208px;}
    .container .cols.column4  {width: 288px;}
    .container .cols.column5  {width: 368px;}
    .container .cols.column6  {width: 448px;}
    .container .cols.column7  {width: 528px;}
    .container .cols.column8  {width: 608px;}
    .container .cols.column9  {width: 688px;}
    .container .cols.column10 {width: 768px;}
    .container .cols.column11 {width: 848px;}
    .container .cols.column12 {width: 928px;}

    .container .cols {
        margin-left: 16px;
        margin-right: 16px;
    }

    .container .alpha {margin-left: 0;}
    .container .omega {margin-right: 0;}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container {width: 768px;}
    .container .cols.column1  {width: 36px;}
    .container .cols.column2  {width: 100px;}
    .container .cols.column3  {width: 740px;}
    .container .cols.column4  {width: 740px;}
    .container .cols.column5  {width: 740px;}
    .container .cols.column6  {width: 740px;}
    .container .cols.column7  {width: 740px;}
    .container .cols.column8  {width: 740px;}
    .container .cols.column9  {width: 740px;}
    .container .cols.column10 {width: 740px;}
    .container .cols.column11 {width: 740px;}
    .container .cols.column12 {width: 740px;}

    .container .cols {
        margin-left: 14px;
        margin-right: 14px;
    }

    .container .alpha {margin-left: 0;}
    .container .omega {margin-right: 0;}
}

@media only screen and (max-width: 767px) {
    .container {width: 300px;}
    .container .cols.column1  {width: 300px;}
    .container .cols.column2  {width: 300px;}
    .container .cols.column3  {width: 300px;}
    .container .cols.column4  {width: 300px;}
    .container .cols.column5  {width: 300px;}
    .container .cols.column6  {width: 300px;}
    .container .cols.column7  {width: 300px;}
    .container .cols.column8  {width: 300px;}
    .container .cols.column9  {width: 300px;}
    .container .cols.column10 {width: 300px;}
    .container .cols.column11 {width: 300px;}
    .container .cols.column12 {width: 300px;}

    .container .cols {
        margin-left: 0;
        margin-right: 0;
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {width: 420px;}
    .container .cols.column1  {width: 420px;}
    .container .cols.column2  {width: 420px;}
    .container .cols.column3  {width: 420px;}
    .container .cols.column4  {width: 420px;}
    .container .cols.column5  {width: 420px;}
    .container .cols.column6  {width: 420px;}
    .container .cols.column7  {width: 420px;}
    .container .cols.column8  {width: 420px;}
    .container .cols.column9  {width: 420px;}
    .container .cols.column10 {width: 420px;}
    .container .cols.column11 {width: 420px;}
    .container .cols.column12 {width: 420px;}

    .container .cols {
        margin-left: 0;
        margin-right: 0;
    }
}