.light {
    background-color: #FFFFFF;
    color: #000000;
}
.dark {
    background-color: #000000;
    color: #FFFFFF;
}
.light.accent {
    background-color: #FFFFFF;
}
.dark.accent {
    background-color: #000000;
}
.light .appbar {
    background-color: #DFDFDF;
}
.dark .appbar {
    background-color: #212021;
}
.blue .accent, .blue .live-tile .accent, .blue .live-tile > div, .blue .list-tile > div, .blue .live-tile > div.slide-back, .blue .flip-list > li > div {
    background-color: #1BA1E2;
}
.brown .accent, .brown .live-tile .accent, .brown .live-tile > div, .brown .list-tile > div, .brown .live-tile > div.slide-back, .brown .flip-list > li > div {
    background-color: #A05000;
}
.green .accent, .green.live-tile, .green .live-tile .accent, .green .live-tile > div, .green .list-tile > div, .green .live-tile > div.slide-back, .green .flip-list > li > div {
    background-color: #339933;
}
.lime .accent, .lime .live-tile .accent, .lime .live-tile > div, .lime .list-tile > div, .lime .live-tile > div.slide-back, .lime .flip-list > li > div {
    background-color: #A2C139;
}
.magenta .accent, .magenta.live-tile, .magenta .live-tile .accent, .magenta .live-tile > div, .magenta .list-tile > div, .magenta .live-tile > div.slide-back, .magenta .flip-list > li > div {
    background-color: #D80073;
}
.mango .accent, .mango.live-tile, .mango .live-tile .accent, .mango .live-tile > div, .mango .list-tile > div, .mango .live-tile > div.slide-back, .mango .flip-list > li > div {
    background-color: #F09609;
}
.pink .accent, .pink .live-tile .accent, .pink .live-tile > div, .pink .list-tile > div, .pink .live-tile > div.slide-back, .pink .flip-list > li > div {
    background-color: #E671B8;
}
.purple .accent, .purple .live-tile .accent, .purple .live-tile > div, .purple .list-tile > div, .purple .live-tile > div.slide-back, .purple .flip-list > li > div {
    background-color: #A200FF;
}
.red .accent, .red .live-tile .accent, .red .live-tile > div, .red .list-tile > div, .red .live-tile > div.slide-back, .red .flip-list > li > div {
    background-color: #E51400;
}
.teal .accent, .teal .live-tile .accent, .teal .live-tile > div, .teal .list-tile > div, .teal .live-tile > div.slide-back, .teal .flip-list > li > div {
    background-color: #00ABA9;
}
.blue.live-tile, .blue.live-tile .accent, .blue.accent, .blue.live-tile > div, .blue.list-tile > div, .blue.live-tile > div.slide-back, .blue.list-tile .flip-list > li > div {
    background-color: #1BA1E2;
}
.brown.live-tile, .brown.live-tile .accent, .brown.accent, .brown.live-tile > div, .brown.list-tile > div, .brown.live-tile > div.slide-back, .brown.list-tile .flip-list > li > div {
    background-color: #A05000;
}
.green.live-tile, .green.live-tile .accent, .green.accent, .green.live-tile > div, .green.list-tile > div, .green.live-tile > div.slide-back, .green.list-tile .flip-list > li > div {
    background-color: #339933;
}
.lime.live-tile, .lime.live-tile .accent, .lime.accent, .lime.live-tile > div, .lime.list-tile > div, .lime.live-tile > div.slide-back, .lime.list-tile .flip-list > li > div {
    background-color: #A2C139;
}
.magenta.live-tile, .magenta.live-tile .accent, .magenta.accent, .magenta.live-tile > div, .magenta.list-tile > div, .magenta.live-tile > div.slide-back, .magenta.list-tile .flip-list > li > div {
    background-color: #D80073;
}
.mango.live-tile, .mango.live-tile .accent, .mango.accent, .mango.live-tile > div, .mango.list-tile > div, .mango.live-tile > div.slide-back, .mango.list-tile .flip-list > li > div {
    background-color: #F09609;
}
.pink.live-tile, .pink.live-tile .accent, .pink.accent, .pink.live-tile > div, .pink.list-tile > div, .pink.live-tile > div.slide-back, .pink.list-tile .flip-list > li > div {
    background-color: #E671B8;
}
.purple.live-tile, .purple.live-tile .accent, .purple.accent, .purple.live-tile > div, .purple.list-tile > div, .purple.live-tile > div.slide-back, .purple.list-tile .flip-list > li > div {
    background-color: #A200FF;
}
.red.live-tile, .red.live-tile .accent, .red.accent, .red.live-tile > div, .red.list-tile > div, .red.live-tile > div.slide-back, .red.list-tile .flip-list > li > div {
    background-color: #E51400;
}
.teal.live-tile, .teal.live-tile .accent, .teal.accent, .teal.live-tile > div, .teal.list-tile > div, .teal.live-tile > div.slide-back, .teal.list-tile .flip-list > li > div {
    background-color: #00ABA9;
}
.blue .accentBorder, .blue.accentBorder {
    border-color: #1BA1E2;
}
.brown .accentBorder, .brown.accentBorder {
    border-color: #A05000;
}
.green .accentBorder, .green.accentBorder {
    border-color: #339933;
}
.lime .accentBorder, .lime.accentBorder {
    border-color: #A2C139;
}
.magenta .accentBorder, .magenta.accentBorder {
    border-color: #D80073;
}
.mango .accentBorder, .mango.accentBorder {
    border-color: #F09609;
}
.pink .accentBorder, .pink.accentBorder {
    border-color: #E671B8;
}
.purple .accentBorder, .purple.accentBorder {
    border-color: #A200FF;
}
.red .accentBorder, .red.accentBorder {
    border-color: #E51400;
}
.teal .accentBorder, .teal.accentBorder {
    border-color: #00ABA9;
}
.blue .accentColor, .blue.accentColor {
    color: #1BA1E2;
}
.brown .accentColor, .brown.accentColor {
    color: #A05000;
}
.green .accentColor, .green.accentColor {
    color: #339933;
}
.lime .accentColor, .lime.accentColor {
    color: #A2C139;
}
.magenta .accentColor, .magenta.accentColor {
    color: #D80073;
}
.mango .accentColor, .mango.accentColor {
    color: #F09609;
}
.pink .accentColor, .pink.accentColor {
    color: #E671B8;
}
.purple .accentColor, .purple.accentColor {
    color: #A200FF;
}
.red .accentColor, .red.accentColor {
    color: #E51400;
}
.teal .accentColor, .teal.accentColor {
    color: #00ABA9;
}
.blue .accentHover:hover, .blue .accentHover a:hover, .blue.accentHover a:hover {
    color: #1BA1E2;
}
.brown .accentHover:hover, .brown .accentHover a:hover, .brown.accentHover a:hover {
    color: #A05000;
}
.green .accentHover:hover, .green .accentHover a:hover, .green.accentHover a:hover {
    color: #339933;
}
.lime .accentHover:hover, .lime .accentHover a:hover, .lime.accentHover a:hover {
    color: #A2C139;
}
.magenta .accentHover:hover, .magenta .accentHover a:hover, .magenta.accentHover a:hover {
    color: #D80073;
}
.pink .accentHover:hover, .pink .accentHover a:hover, .pink.accentHover a:hover {
    color: #E671B8;
}
.purple .accentHover:hover, .purple .accentHover a:hover, .purple.accentHover a:hover {
    color: #A200FF;
}
.red .accentHover:hover, .red .accentHover a:hover, .red.accentHover a:hover {
    color: #E51400;
}
.teal .accentHover:hover, .teal .accentHover a:hover, .teal.accentHover a:hover {
    color: #00ABA9;
}
.blue .accentVisited:visited, .blue .accentVisited a:visited {
    color: #1BA1E2;
}
.brown .accentVisited:visited, .brown .accentVisited a:visited {
    color: #A05000;
}
.green .accentVisited:visited, .green .accentVisited a:visited {
    color: #339933;
}
.lime .accentVisited:visited, .lime .accentVisited a:visited {
    color: #A2C139;
}
.magenta .accentVisited:visited, .magenta .accentVisited a:visited {
    color: #D80073;
}
.mango .accentVisited:visited, .mango .accentVisited a:visited {
    color: #F09609;
}
.pink .accentVisited:visited, .pink .accentVisited a:visited {
    color: #E671B8;
}
.purple .accentVisited:visited, .purple .accentVisited a:visited {
    color: #A200FF;
}
.red .accentVisited:visited, .red .accentVisited a:visited {
    color: #E51400;
}
.teal .accentVisited:visited, .teal .accentVisited a:visited {
    color: #00ABA9;
}
.blue.accentLink, .blue.accentLink:link, .blue.accentLink:hover, .blue.accentLink:visited, .blue.accentVisited:visited, .blue.accentHover:hover, .blue .accentLink, .blue .accentLink:link, .blue .accentLink:hover, .blue .accentLink:visited {
    color: #1BA1E2;
}
.brown.accentLink, .brown.accentLink:link, .brown.accentLink:hover, .brown.accentLink:visited, .brown.accentVisited:visited, .brown.accentHover:hover, .brown .accentLink, .brown .accentLink:link, .brown .accentLink:hover, .brown .accentLink:visited {
    color: #A05000;
}
.green.accentLink, .green.accentLink:link, .green.accentLink:hover, .green.accentLink:visited, .green.accentVisited:visited, .green.accentHover:hover, .green .accentLink, .green .accentLink:link, .green .accentLink:hover, .green .accentLink:visited {
    color: #339933;
}
.lime.accentLink, .lime.accentLink:link, .lime.accentLink:hover, .lime.accentLink:visited, .lime.accentVisited:visited, .lime.accentHover:hover, .lime .accentLink, .lime .accentLink:link, .lime .accentLink:hover, .lime .accentLink:visited {
    color: #A2C139;
}
.magenta.accentLink, .magenta.accentLink:link, .magenta.accentLink:hover, .magenta.accentLink:visited, .magenta.accentVisited:visited, .magenta.accentHover:hover, .magenta .accentLink, .magenta .accentLink:link, .magenta .accentLink:hover, .magenta .accentLink:visited {
    color: #D80073;
}
.mango.accentLink, .mango.accentLink:link, .mango.accentLink:hover, .mango.accentLink:visited, .mango.accentVisited:visited, .mango.accentHover:hover, .mango .accentLink, .mango .accentLink:link, .mango .accentLink:hover, .mango .accentLink:visited {
    color: #F09609;
}
.pink.accentLink, .pink.accentLink:link, .pink.accentLink:hover, .pink.accentLink:visited, .pink.accentVisited:visited, .pink.accentHover:hover, .pink .accentLink, .pink .accentLink:link, .pink .accentLink:hover, .pink .accentLink:visited {
    color: #E671B8;
}
.purple.accentLink, .purple.accentLink:link, .purple.accentLink:hover, .purple.accentLink:visited, .purple.accentVisited:visited, .purple.accentHover:hover, .purple .accentLink, .purple .accentLink:link, .purple .accentLink:hover, .purple .accentLink:visited {
    color: #A200FF;
}
.red.accentLink, .red.accentLink:link, .red.accentLink:hover, .red.accentLink:visited, .red.accentVisited:visited, .red.accentHover:hover, .red .accentLink, .red .accentLink:link, .red .accentLink:hover, .red .accentLink:visited {
    color: #E51400;
}
.teal.accentLink, .teal.accentLink:link, .teal.accentLink:hover, .teal.accentLink:visited, .teal.accentVisited:visited, .teal.accentHover:hover, .teal .accentLink, .teal .accentLink:link, .teal .accentLink:hover, .teal .accentLink:visited {
    color: #00ABA9;
}
.appbar {
    background-color: #212021;
    bottom: 0;
    color: #FFFFFF;
    font-size: 0.9em;
    height: 60px;
    left: 0;
    line-height: normal;
    margin: 0;
    overflow: hidden;
    padding: 10px 0;
    position: fixed;
    text-align: center;
    width: 100%;
    z-index: 100;
}
.light .appbar {
    background-color: #DFDFDF;
    color: #000000;
}
.dark .appbar {
    background-color: #212021;
}
.appbar .clear {
    clear: both;
}
.appbar-buttons {
    margin: 0 auto;
    padding: 0 0 2px;
    position: relative;
    text-align: right;
    width: 252px;
}
.appbar-buttons li {
    display: inline;
    float: left;
    list-style: none outside none;
    padding: 0 10px;
}
.appbar-buttons li a {
    background-color: transparent;
    color: #FFFFFF;
    font-weight: bold;
}
.light .appbar-buttons li a {
    color: #000000;
}
.appbar-buttons a > img {
    background-image: url("images/metroIcons.jpg");
    background-repeat: no-repeat;
    border: medium none;
    height: 64px;
    width: 64px;
}
.light .appbar-buttons a > img {
    background-image: url("images/metroIcons_light.jpg");
}
.appbar-buttons a.home > img {
    background-position: -104px -12px;
}
.appbar-buttons a.about > img {
    background-position: -198px -99px;
}
.appbar-buttons a.twitter > img {
    background-position: -198px -12px;
}
.appbar-buttons li a:active, ul#menu li.selected a, .appbar-buttons li a:hover {
    text-decoration: none;
}
.appbar a.etc, .appbar a.etc:hover, .appbar a.etc:visited {
    color: #FFFFFF;
    cursor: pointer;
    display: block;
    font-size: 32px;
    height: 60px;
    position: absolute;
    right: 0;
    text-decoration: none;
    top: 0;
    width: 60px;
}
.light .appbar a.etc, .light .appbar a.etc:hover, .light .appbar a.etc:visited {
    color: #000000;
}
.appbar .charm-title {
    display: block;
    font-size: 10px;
    text-align: center;
}
.appbar .theme-options {
    display: block;
    margin: 0 auto;
    width: 644px;
}
.appbar .theme-options > li {
    display: inline;
    float: left;
    margin: 30px 10px;
}
.appbar .theme-options > li > a, .appbar .theme-options > li > a:hover, .appbar .theme-options > li > a:visited {
    padding: 15px 20px;
    text-decoration: none;
}
.appbar .base-theme-options {
    display: block;
    margin: 0 auto;
    width: 130px;
}
.appbar .base-theme-options > li {
    display: inline;
    float: left;
    margin: 30px 10px;
}
.appbar .base-theme-options > li > a, .appbar .base-theme-options > li > a:hover, .appbar .base-theme-options > li > a:visited {
    padding: 15px 20px;
    text-decoration: none;
}
.appbar .base-theme-options > li > a.dark.accent {
    background-color: #000000;
}
.appbar .theme-options {
    width: 650px;
}
.appbar .base-theme-options {
    width: 140px;
}