.wrapper {
    margin-left: auto;
    margin-right: auto;
    max-width: 750px;
    min-width: 320px;
}
@media screen and (min-width: 768px) {
    .wrapper {
        max-width:970px;
    }
}
@media screen and (min-width: 992px) {
    .wrapper {
        max-width:1170px;
    }
}
@media screen and  (min-width: 1200px) {
    .wrapper {
        max-width:1170px;
    }
}
/* grid system */
.grid {
    margin-left: auto;
    margin-right: auto;
}
*[class*="col-"]{
    display: block;
    padding: .5em;
    float: left;
}
/* phones */
.col-sm-12 {width:100%;}
.col-sm-11 {width:91.66666666666666%;}
.col-sm-10 {width:83.33333333333334%;}
.col-sm-9  {width:75%;}
.col-sm-8  {width:66.66666666666666%;}
.col-sm-7  {width:58.333333333333336%;}
.col-sm-6  {width:50%;}
.col-sm-5  {width:41.66666666666667%;}
.col-sm-4  {width:33.33333333333333%;}
.col-sm-3  {width:25%;}
.col-sm-2  {width: 16.666666666666664%;}
.col-sm-1  {width:8.333333333333332%;}
@media (max-width: 768px) {
    .sm-hide { display: none; }
    .sm-hide-100 { display: none; }
}

/* tablets */
@media (min-width: 768px) {
    .col-md-12 {width:100%;}
    .col-md-11 {width:91.66666666666666%;}
    .col-md-10 {width:83.33333333333334%;}
    .col-md-9  {width:75%;}
    .col-md-8  {width:66.66666666666666%;}
    .col-md-7  {width:58.333333333333336%;}
    .col-md-6  {width:50%;}
    .col-md-5  {width:41.66666666666667%;}
    .col-md-4  {width:33.33333333333333%;}
    .col-md-3  {width:25%;}
    .col-md-2  {width: 16.666666666666664%;}
    .col-md-1  {width:8.333333333333332%;}

    .sm-hide { display: inline }
    .sm-hide-100 { display: inline-block; width: 100% }
    .md-hide { display: none; }
    .md-hide-100 { display: none; }
}
/* desktops */
@media (min-width: 992px) {
    .col-lg-12 {width:100%;}
    .col-lg-11 {width:91.66666666666666%;}
    .col-lg-10 {width:83.33333333333334%;}
    .col-lg-9  {width:75%;}
    .col-lg-8  {width:66.66666666666666%;}
    .col-lg-7  {width:58.333333333333336%;}
    .col-lg-6  {width:50%;}
    .col-lg-5  {width:41.66666666666667%;}
    .col-lg-4  {width:33.33333333333333%;}
    .col-lg-3  {width:25%;}
    .col-lg-2  {width: 16.666666666666664%;}
    .col-lg-1  {width:8.333333333333332%;}
    .sm-hide {display: inline}
    .sm-hide-100 {display: inline-block; width: 100%}
    .md-hide {display: inline}
    .md-hide-100 {display: inline-block; width: 100%}
    .lg-hide {display: none;}
    .lg-hide-100 {display: none;}
}

.col-sm-offset-11 {margin-left:91.66666666666666%;}
.col-sm-offset-10 {margin-left:83.33333333333334%;}
.col-sm-offset-9  {margin-left:75%;}
.col-sm-offset-8  {margin-left:66.66666666666666%;}
.col-sm-offset-7  {margin-left:58.333333333333336%;}
.col-sm-offset-6  {margin-left:50%;}
.col-sm-offset-5  {margin-left:41.66666666666667%;}
.col-sm-offset-4  {margin-left:33.33333333333333%;}
.col-sm-offset-3  {margin-left:25%;}
.col-sm-offset-2  {margin-left: 16.666666666666664%;}
.col-sm-offset-1  {margin-left:8.333333333333332%;}

@media (min-width: 768px) {
    .col-md-offset-11 {margin-left:91.66666666666666%;}
    .col-md-offset-10 {margin-left:83.33333333333334%;}
    .col-md-offset-9  {margin-left:75%;}
    .col-md-offset-8  {margin-left:66.66666666666666%;}
    .col-md-offset-7  {margin-left:58.333333333333336%;}
    .col-md-offset-6  {margin-left:50%;}
    .col-md-offset-5  {margin-left:41.66666666666667%;}
    .col-md-offset-4  {margin-left:33.33333333333333%;}
    .col-md-offset-3  {margin-left:25%;}
    .col-md-offset-2  {margin-left: 16.666666666666664%;}
    .col-md-offset-1  {margin-left:8.333333333333332%;}
}

@media (min-width: 992px) {
    .col-lg-offset-11 {margin-left:91.66666666666666%;}
    .col-lg-offset-10 {margin-left:83.33333333333334%;}
    .col-lg-offset-9  {margin-left:75%;}
    .col-lg-offset-8  {margin-left:66.66666666666666%;}
    .col-lg-offset-7  {margin-left:58.333333333333336%;}
    .col-lg-offset-6  {margin-left:50%;}
    .col-lg-offset-5  {margin-left:41.66666666666667%;}
    .col-lg-offset-4  {margin-left:33.33333333333333%;}
    .col-lg-offset-3  {margin-left:25%;}
    .col-lg-offset-2  {margin-left: 16.666666666666664%;}
    .col-lg-offset-1  {margin-left:8.333333333333332%;}
}

.clear {
    clear: both;
}

.no-padding {
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 0;
}