[class*="pg-col-"] {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
    float: left;
}
/*
    PlasmaCloud grin system works in the same way as the Bootstrap grid system.
    These classes are just a complement to Bootstrap, and they won't work without
    Bootstrap.
    More about bootsrap grid system: https://getbootstrap.com/docs/3.4/css/#grid

    [PlasmaCloud class]     [Bootstrap class]       [width]
    pg-col-xs-[n]           col-xs-[n]              <768px
    pg-col-sm-[n]           col-sm-[n]              >=768px
    pg-col-md-[n]           col-md-[n]              >=992px
    pg-col-lg-[n]           col-lg-[n]              >=1200px
    pg-col-xl-[n]               -                   >=1440px
    pg-col-[w]px-[n]            -


    *[n] -  the number of twelve available columns you wish to span for element.
    *[w] -  predefined min screen width (from 500 to 1600, with step 100,
            e.g.: pg-col-1300px-6).
*/
.pg-col-xs-1,  .pg-col-1  { width: calc(100% / 12 * 1);  }
.pg-col-xs-2,  .pg-col-2  { width: calc(100% / 12 * 2);  }
.pg-col-xs-3,  .pg-col-3  { width: calc(100% / 12 * 3);  }
.pg-col-xs-4,  .pg-col-4  { width: calc(100% / 12 * 4);  }
.pg-col-xs-5,  .pg-col-5  { width: calc(100% / 12 * 5);  }
.pg-col-xs-6,  .pg-col-6  { width: calc(100% / 12 * 6);  }
.pg-col-xs-7,  .pg-col-7  { width: calc(100% / 12 * 7);  }
.pg-col-xs-8,  .pg-col-8  { width: calc(100% / 12 * 8);  }
.pg-col-xs-9,  .pg-col-9  { width: calc(100% / 12 * 9);  }
.pg-col-xs-10, .pg-col-10 { width: calc(100% / 12 * 10); }
.pg-col-xs-11, .pg-col-11 { width: calc(100% / 12 * 11); }
.pg-col-xs-12, .pg-col-12 { width: calc(100% / 12 * 12); }

@media (min-width: 500px) {
    .pg-col-500px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-500px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-500px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-500px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-500px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-500px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-500px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-500px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-500px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-500px-10 { width: calc(100% / 12 * 10); }
    .pg-col-500px-11 { width: calc(100% / 12 * 11); }
    .pg-col-500px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 600px) {
    .pg-col-600px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-600px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-600px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-600px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-600px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-600px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-600px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-600px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-600px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-600px-10 { width: calc(100% / 12 * 10); }
    .pg-col-600px-11 { width: calc(100% / 12 * 11); }
    .pg-col-600px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 700px) {
    .pg-col-700px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-700px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-700px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-700px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-700px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-700px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-700px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-700px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-700px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-700px-10 { width: calc(100% / 12 * 10); }
    .pg-col-700px-11 { width: calc(100% / 12 * 11); }
    .pg-col-700px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 768px) {
    .pg-col-sm-1  { width: calc(100% / 12 * 1);  }
    .pg-col-sm-2  { width: calc(100% / 12 * 2);  }
    .pg-col-sm-3  { width: calc(100% / 12 * 3);  }
    .pg-col-sm-4  { width: calc(100% / 12 * 4);  }
    .pg-col-sm-5  { width: calc(100% / 12 * 5);  }
    .pg-col-sm-6  { width: calc(100% / 12 * 6);  }
    .pg-col-sm-7  { width: calc(100% / 12 * 7);  }
    .pg-col-sm-8  { width: calc(100% / 12 * 8);  }
    .pg-col-sm-9  { width: calc(100% / 12 * 9);  }
    .pg-col-sm-10 { width: calc(100% / 12 * 10); }
    .pg-col-sm-11 { width: calc(100% / 12 * 11); }
    .pg-col-sm-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 800px) {
    .pg-col-800px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-800px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-800px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-800px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-800px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-800px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-800px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-800px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-800px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-800px-10 { width: calc(100% / 12 * 10); }
    .pg-col-800px-11 { width: calc(100% / 12 * 11); }
    .pg-col-800px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 900px) {
    .pg-col-900px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-900px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-900px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-900px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-900px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-900px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-900px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-900px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-900px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-900px-10 { width: calc(100% / 12 * 10); }
    .pg-col-900px-11 { width: calc(100% / 12 * 11); }
    .pg-col-900px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 992px) {
    .pg-col-md-1  { width: calc(100% / 12 * 1);  }
    .pg-col-md-2  { width: calc(100% / 12 * 2);  }
    .pg-col-md-3  { width: calc(100% / 12 * 3);  }
    .pg-col-md-4  { width: calc(100% / 12 * 4);  }
    .pg-col-md-5  { width: calc(100% / 12 * 5);  }
    .pg-col-md-6  { width: calc(100% / 12 * 6);  }
    .pg-col-md-7  { width: calc(100% / 12 * 7);  }
    .pg-col-md-8  { width: calc(100% / 12 * 8);  }
    .pg-col-md-9  { width: calc(100% / 12 * 9);  }
    .pg-col-md-10 { width: calc(100% / 12 * 10); }
    .pg-col-md-11 { width: calc(100% / 12 * 11); }
    .pg-col-md-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1000px) {
    .pg-col-1000px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1000px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1000px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1000px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1000px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1000px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1000px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1000px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1000px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1000px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1000px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1000px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1100px) {
    .pg-col-1100px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1100px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1100px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1100px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1100px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1100px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1100px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1100px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1100px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1100px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1100px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1100px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1200px) {
    .pg-col-1200px-1,  .pg-col-lg-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1200px-2,  .pg-col-lg-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1200px-3,  .pg-col-lg-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1200px-4,  .pg-col-lg-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1200px-5,  .pg-col-lg-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1200px-6,  .pg-col-lg-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1200px-7,  .pg-col-lg-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1200px-8,  .pg-col-lg-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1200px-9,  .pg-col-lg-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1200px-10, .pg-col-lg-10 { width: calc(100% / 12 * 10); }
    .pg-col-1200px-11, .pg-col-lg-11 { width: calc(100% / 12 * 11); }
    .pg-col-1200px-12, .pg-col-lg-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1300px) {
    .pg-col-1300px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1300px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1300px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1300px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1300px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1300px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1300px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1300px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1300px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1300px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1300px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1300px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1400px) {
    .pg-col-1400px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1400px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1400px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1400px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1400px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1400px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1400px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1400px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1400px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1400px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1400px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1400px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1440px) {
    .pg-col-xl-1  { width: calc(100% / 12 * 1);  }
    .pg-col-xl-2  { width: calc(100% / 12 * 2);  }
    .pg-col-xl-3  { width: calc(100% / 12 * 3);  }
    .pg-col-xl-4  { width: calc(100% / 12 * 4);  }
    .pg-col-xl-5  { width: calc(100% / 12 * 5);  }
    .pg-col-xl-6  { width: calc(100% / 12 * 6);  }
    .pg-col-xl-7  { width: calc(100% / 12 * 7);  }
    .pg-col-xl-8  { width: calc(100% / 12 * 8);  }
    .pg-col-xl-9  { width: calc(100% / 12 * 9);  }
    .pg-col-xl-10 { width: calc(100% / 12 * 10); }
    .pg-col-xl-11 { width: calc(100% / 12 * 11); }
    .pg-col-xl-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1500px) {
    .pg-col-1500px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1500px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1500px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1500px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1500px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1500px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1500px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1500px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1500px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1500px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1500px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1500px-12 { width: calc(100% / 12 * 12); }
}
@media (min-width: 1600px) {
    .pg-col-1600px-1  { width: calc(100% / 12 * 1);  }
    .pg-col-1600px-2  { width: calc(100% / 12 * 2);  }
    .pg-col-1600px-3  { width: calc(100% / 12 * 3);  }
    .pg-col-1600px-4  { width: calc(100% / 12 * 4);  }
    .pg-col-1600px-5  { width: calc(100% / 12 * 5);  }
    .pg-col-1600px-6  { width: calc(100% / 12 * 6);  }
    .pg-col-1600px-7  { width: calc(100% / 12 * 7);  }
    .pg-col-1600px-8  { width: calc(100% / 12 * 8);  }
    .pg-col-1600px-9  { width: calc(100% / 12 * 9);  }
    .pg-col-1600px-10 { width: calc(100% / 12 * 10); }
    .pg-col-1600px-11 { width: calc(100% / 12 * 11); }
    .pg-col-1600px-12 { width: calc(100% / 12 * 12); }
}