/*==============================================*/
@font-face {
  font-family: 'rbtr';
  src: url('/fonts/Roboto-Regular-webfont.eot');
  src: url('/fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/Roboto-Regular-webfont.woff') format('woff'), url('/fonts/Roboto-Regular-webfont.ttf') format('truetype'), url('/fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'rbtm';
  src: url('/fonts/Roboto-Medium-webfont.eot');
  src: url('/fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/Roboto-Medium-webfont.woff') format('woff'), url('/fonts/Roboto-Medium-webfont.ttf') format('truetype'), url('/fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'rbtb';
  src: url('/fonts/Roboto-Bold-webfont.eot');
  src: url('/fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/Roboto-Bold-webfont.woff') format('woff'), url('/fonts/Roboto-Bold-webfont.ttf') format('truetype'), url('/fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'rbtl';
  src: url('fonts/roboto-light.eot');
  src: url('fonts/roboto-light.eot') format('embedded-opentype'), url('fonts/roboto-light.woff') format('woff'), url('fonts/roboto-light.ttf') format('truetype'), url('fonts/roboto-light.svg#RobotoLight') format('svg');
  font-weight: normal;
  font-style: normal;
}
.color li {
  padding: 5px 10px;
  list-style: none;
  display: inline-block;
}
.color li:nth-child(1) {
  background-color: #00539e;
}
.color li:nth-child(2) {
  background-color: #4b7b9c;
}
.color li:nth-child(3) {
  background-color: #003494;
}
.color li:nth-child(4) {
  background-color: #777777;
}
.color li:nth-child(5) {
  background-color: #333333;
}
.color li:nth-child(6) {
  background-color: #a8b4da;
}
.color li:nth-child(7) {
  background-color: #cdc3ac;
}
.color li:nth-child(8) {
  background-color: #c0392b;
}
.color li:nth-child(9) {
  background-color: #8b6d49;
}
.color li:nth-child(10) {
  background-color: #cccccc;
}
.color li:nth-child(11) {
  background-color: #4d4d4d;
}
.color li:nth-child(12) {
  background-color: #999999;
}
.color li:nth-child(13) {
  background-color: #808080;
}
.color li:nth-child(14) {
  background-color: #b2cce0;
}
.color li:nth-child(15) {
  background-color: #a8b7d7;
}
.color li:nth-child(16) {
  background-color: #5077b0;
}
.color li:nth-child(17) {
  background-color: #ffffff;
}
.color li:nth-child(18) {
  background-color: #ffffff;
}
.color li:nth-child(19) {
  background-color: #ebf2f2;
}
.color li:nth-child(20) {
  background-color: #d1d1e9;
}
.color li:nth-child(21) {
  background-color: #01304c;
}
.color li:nth-child(22) {
  background-color: #0380db;
}
