.row {display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    /*padding: 5px;*/
    width: 100%;
    box-sizing: border-box;  }
.row-wrap {-webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
.row-no-padding {padding: 0; }
.row-no-padding > .col {padding: 0; }
.row + .row {margin-top: 0;
    padding-top: 0; }
.col {-webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: block;
    box-sizing: border-box;
    /*padding: 5px;*/
    width: 100%; }
.row-top {-webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    -moz-align-items: flex-start;
    align-items: flex-start; }
.row-bottom {-webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    -moz-align-items: flex-end;
    align-items: flex-end; }
.row-center {-webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center; }
.row-stretch {-webkit-box-align: stretch;
    -ms-flex-align: stretch;
    -webkit-align-items: stretch;
    -moz-align-items: stretch;
    align-items: stretch; }
.row-baseline {-webkit-box-align: baseline;
    -ms-flex-align: baseline;
    -webkit-align-items: baseline;
    -moz-align-items: baseline;
    align-items: baseline; }
/* .col-* vertically aligns an individual .col */
.col-top {-webkit-align-self: flex-start;
    -moz-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start; }
.col-bottom {-webkit-align-self: flex-end;
    -moz-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end; }
.col-center {-webkit-align-self: center;
    -moz-align-self: center;
    -ms-flex-item-align: center;
    align-self: center; }
.col-offset-5 {margin-left: 5%;}
.col-offset-10 {margin-left: 10%; }
.col-offset-20 {margin-left: 20%; }
.col-offset-25 {margin-left: 25%; }
.col-offset-33, .col-offset-34 {margin-left: 33.3333%; }
.col-offset-50 {margin-left: 50%; }
.col-offset-66, .col-offset-67 {margin-left: 66.6666%; }
.col-offset-75 {margin-left: 75%; }
.col-offset-80 {margin-left: 80%; }
.col-offset-90 {margin-left: 90%; }
.col-10 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%; }
.col-20 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 20%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; }
.col-25 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%; }
.col-30 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%; }
.col-33, .col-34 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 33.3333%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 33.3333%;
    -ms-flex: 0 0 33.3333%;
    flex: 0 0 33.3333%;
    max-width: 33.3333%; }
.col-35 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 35%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 35%;
    -ms-flex: 0 0 35%;
    flex: 0 0 35%;
    max-width: 35%; }
.col-40 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 40%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 40%;
    -ms-flex: 0 0 40%;
    flex: 0 0 40%;
    max-width: 40%; }
.col-50 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
.col-60 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 60%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 60%;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%; }
.col-65 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 65%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 65%;
    -ms-flex: 0 0 65%;
    flex: 0 0 65%;
    max-width: 65%; }
.col-66, .col-67 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 66.6666%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 66.6666%;
    -ms-flex: 0 0 66.6666%;
    flex: 0 0 66.6666%;
    max-width: 66.6666%; }
.col-70 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 70%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 70%;
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%; }
.col-75 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%; }
.col-80 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 80%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 80%;
    -ms-flex: 0 0 80%;
    flex: 0 0 80%;
    max-width: 80%; }
.col-90 {-webkit-box-flex: 0;
    -webkit-flex: 0 0 90%;
    -moz-box-flex: 0;
    -moz-flex: 0 0 90%;
    -ms-flex: 0 0 90%;
    flex: 0 0 90%;
    max-width: 90%; }
.bg-red{
    background-color: #FF5722;
    color: white;
}
.bg-orange{
    background-color: #FFB800;
    color: white;
}
.bg-green{
    background-color: #009688;
    color: white;
}
.bg-cyan{
    background-color: #2F4056;
    color: white;
}
.bg-blue{
    background-color: #1E9FFF;
    color: white;
}
.bg-light{
    background-color: #01AAED;
    color: white;
}
.bg-black{
    background-color: #393D49;
    color: white;
}
.bg-gray{
    background-color: #eeeeee;
    color: inherit;
}
.bg-white{
    background-color: white;
    color: inherit;
}
.bg-dark1{
    background-color: #e2e2e2;
    color: inherit;
}
.bg-dark2{
    background-color: #dddddd;
    color: inherit;
}
.bg-dark3{
    background-color: #d2d2d2;
    color: inherit;
}
.bg-dark4{
    background-color: #c2c2c2;
    color: inherit;
}
.bg-positive{
    color: white;
    background-color: #387ef5;
}
.bg-calm{
    color: white;
    background-color: #11c1f3;
}
.bg-assertive{
    color: white;
    background-color: #ef473a;
}
.bg-balanced{
    color: white;
    background-color: #33cd5f;
}
.bg-energized{
    color: white;
    background-color: #ffc900;
}
.bg-royal{
    color: white;
    background-color: #886aea;
}
.bg-dark{
    color: white;
    background-color: #444;
}
.red{
    color: #FF5722;
}
.orange{
    color: #FFB800;
}
.green{
    color: #009688;
}
.cyan{
    color: #2F4056;
}
.blue{
    color: #1E9FFF;
}
.black{
    color: #393D49;
}
.gray{
    color: #eeeeee;
}
.white{
    color: #fff;
}
.light{
    color: #01AAED;
}
.dark1{
    color: #e2e2e2;
}
.dark2{
    color: #dddddd;
}
.dark3{
    color: #d2d2d2;
}
.dark4{
    color: #c2c2c2;
}
.positive{
    color: #387ef5;
}
.calm{
    color: #11c1f3;
}
.assertive{
    color: #ef473a;
}
.balanced{
    color: #33cd5f;
}
.energized{
    color: #ffc900;
}
.royal{
    color: #886aea;
}
.dark{
    color: #444;
}
.circle-2{
    border-radius: 2px;
}
.circle-4{
    border-radius: 4px;
}
.circle-5{
    border-radius: 5px;
}
.circle-8{
    border-radius: 8px;
}
.circle-10{
    border-radius: 10px;
}
.circle-50{
    border-radius: 50%;
}
.text-left{
    text-align: left;
}
.text-center{
    text-align: center;
}
.text-right{
    text-align: right;
}
.icon-left{
    position: relative;
    padding-left: 30px;
    display: inline-block;
}
.icon-left .icon{
    font-size: 20px;
    line-height: inherit;
    padding-left: 3px;
    padding-right: 3px;
    vertical-align: baseline;
    position: absolute;
    top: 0;
    height: 100%;
    left: 4px;
    color: inherit;
}
.icon-top{
    text-align: center;
    display: block;
}
.icon-top .icon{
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
    display: block;
    font-size: 25px;
    margin: 0 auto -3px;
    line-height: 0;
    text-align: center;
    color: inherit;
}
.icon-only{
    display: inline-block;
    padding: 0 17px;
    line-height: 47px;
    text-align: center;
    font-size: 24px;
    border-radius: 4px;
}